@uipath/apollo-react 3.70.1 → 3.70.3-pr482.0700da2

package/dist/canvas/constants.cjs

@@ -24,6 +24,7 @@ var __webpack_require__ = {};
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
+    CANVAS_COMPACT_BREAKPOINT: ()=>CANVAS_COMPACT_BREAKPOINT,
     DEFAULT_NODE_SIZE: ()=>DEFAULT_NODE_SIZE,
     GRID_SPACING: ()=>GRID_SPACING,
     PREVIEW_EDGE_ID: ()=>PREVIEW_EDGE_ID,
@@ -33,11 +34,14 @@ const PREVIEW_NODE_ID = 'preview-node-id';
 const PREVIEW_EDGE_ID = 'preview-edge-id';
 const DEFAULT_NODE_SIZE = 96;
 const GRID_SPACING = 16;
+const CANVAS_COMPACT_BREAKPOINT = 600;
+exports.CANVAS_COMPACT_BREAKPOINT = __webpack_exports__.CANVAS_COMPACT_BREAKPOINT;
 exports.DEFAULT_NODE_SIZE = __webpack_exports__.DEFAULT_NODE_SIZE;
 exports.GRID_SPACING = __webpack_exports__.GRID_SPACING;
 exports.PREVIEW_EDGE_ID = __webpack_exports__.PREVIEW_EDGE_ID;
 exports.PREVIEW_NODE_ID = __webpack_exports__.PREVIEW_NODE_ID;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "CANVAS_COMPACT_BREAKPOINT",
     "DEFAULT_NODE_SIZE",
     "GRID_SPACING",
     "PREVIEW_EDGE_ID",

package/dist/canvas/constants.d.ts

@@ -2,4 +2,5 @@ export declare const PREVIEW_NODE_ID = "preview-node-id";
 export declare const PREVIEW_EDGE_ID = "preview-edge-id";
 export declare const DEFAULT_NODE_SIZE = 96;
 export declare const GRID_SPACING = 16;
+export declare const CANVAS_COMPACT_BREAKPOINT = 600;
 //# sourceMappingURL=constants.d.ts.map

package/dist/canvas/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/canvas/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,oBAAoB,CAAC;AACjD,eAAO,MAAM,eAAe,oBAAoB,CAAC;AACjD,eAAO,MAAM,iBAAiB,KAAK,CAAC;AAEpC,eAAO,MAAM,YAAY,KAAK,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/canvas/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,oBAAoB,CAAC;AACjD,eAAO,MAAM,eAAe,oBAAoB,CAAC;AACjD,eAAO,MAAM,iBAAiB,KAAK,CAAC;AAEpC,eAAO,MAAM,YAAY,KAAK,CAAC;AAG/B,eAAO,MAAM,yBAAyB,MAAM,CAAC"}

package/dist/canvas/constants.js

@@ -2,4 +2,5 @@ const PREVIEW_NODE_ID = 'preview-node-id';
 const PREVIEW_EDGE_ID = 'preview-edge-id';
 const DEFAULT_NODE_SIZE = 96;
 const GRID_SPACING = 16;
-export { DEFAULT_NODE_SIZE, GRID_SPACING, PREVIEW_EDGE_ID, PREVIEW_NODE_ID };
+const CANVAS_COMPACT_BREAKPOINT = 600;
+export { CANVAS_COMPACT_BREAKPOINT, DEFAULT_NODE_SIZE, GRID_SPACING, PREVIEW_EDGE_ID, PREVIEW_NODE_ID };

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/index.cjs

@@ -24,6 +24,9 @@ var __webpack_modules__ = {
     "./schema" (module) {
         module.exports = require("./schema/index.cjs");
     },
+    "./styles/tailwind.canvas.css" (module) {
+        module.exports = require("./styles/tailwind.canvas.css");
+    },
     "./styles/variables.css" (module) {
         module.exports = require("./styles/variables.css");
     },
@@ -84,86 +87,87 @@ var __webpack_exports__ = {};
 (()=>{
     __webpack_require__.r(__webpack_exports__);
     __webpack_require__.d(__webpack_exports__, {
-        Icons: ()=>_icons__rspack_import_6
+        Icons: ()=>_icons__rspack_import_7
     });
     __webpack_require__("./styles/variables.css");
-    var _components__rspack_import_1 = __webpack_require__("./components");
+    __webpack_require__("./styles/tailwind.canvas.css");
+    var _components__rspack_import_2 = __webpack_require__("./components");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _components__rspack_import_1)if ([
+    for(const __rspack_import_key in _components__rspack_import_2)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_components__rspack_import_1[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_components__rspack_import_2[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _constants__rspack_import_2 = __webpack_require__("./constants");
+    var _constants__rspack_import_3 = __webpack_require__("./constants");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _constants__rspack_import_2)if ([
+    for(const __rspack_import_key in _constants__rspack_import_3)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_constants__rspack_import_2[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_constants__rspack_import_3[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _controls__rspack_import_3 = __webpack_require__("./controls");
+    var _controls__rspack_import_4 = __webpack_require__("./controls");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _controls__rspack_import_3)if ([
+    for(const __rspack_import_key in _controls__rspack_import_4)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_controls__rspack_import_3[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_controls__rspack_import_4[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _core__rspack_import_4 = __webpack_require__("./core");
+    var _core__rspack_import_5 = __webpack_require__("./core");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _core__rspack_import_4)if ([
+    for(const __rspack_import_key in _core__rspack_import_5)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_core__rspack_import_4[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_core__rspack_import_5[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _hooks__rspack_import_5 = __webpack_require__("./hooks");
+    var _hooks__rspack_import_6 = __webpack_require__("./hooks");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _hooks__rspack_import_5)if ([
+    for(const __rspack_import_key in _hooks__rspack_import_6)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_hooks__rspack_import_5[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_hooks__rspack_import_6[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _icons__rspack_import_6 = __webpack_require__("./icons");
-    var _layouts__rspack_import_7 = __webpack_require__("./layouts");
+    var _icons__rspack_import_7 = __webpack_require__("./icons");
+    var _layouts__rspack_import_8 = __webpack_require__("./layouts");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _layouts__rspack_import_7)if ([
+    for(const __rspack_import_key in _layouts__rspack_import_8)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_layouts__rspack_import_7[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_layouts__rspack_import_8[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _schema__rspack_import_8 = __webpack_require__("./schema");
+    var _schema__rspack_import_9 = __webpack_require__("./schema");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _schema__rspack_import_8)if ([
+    for(const __rspack_import_key in _schema__rspack_import_9)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_schema__rspack_import_8[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_schema__rspack_import_9[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _types__rspack_import_9 = __webpack_require__("./types");
+    var _types__rspack_import_10 = __webpack_require__("./types");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _types__rspack_import_9)if ([
+    for(const __rspack_import_key in _types__rspack_import_10)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_types__rspack_import_9[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_types__rspack_import_10[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _types_execution__rspack_import_10 = __webpack_require__("./types/execution");
+    var _types_execution__rspack_import_11 = __webpack_require__("./types/execution");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _types_execution__rspack_import_10)if ([
+    for(const __rspack_import_key in _types_execution__rspack_import_11)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_types_execution__rspack_import_10[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_types_execution__rspack_import_11[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _types_validation__rspack_import_11 = __webpack_require__("./types/validation");
+    var _types_validation__rspack_import_12 = __webpack_require__("./types/validation");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _types_validation__rspack_import_11)if ([
+    for(const __rspack_import_key in _types_validation__rspack_import_12)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_types_validation__rspack_import_11[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_types_validation__rspack_import_12[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _utils__rspack_import_12 = __webpack_require__("./utils");
+    var _utils__rspack_import_13 = __webpack_require__("./utils");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _utils__rspack_import_12)if ([
+    for(const __rspack_import_key in _utils__rspack_import_13)if ([
         "Icons",
         "default"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_utils__rspack_import_12[__rspack_import_key];
+    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_utils__rspack_import_13[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
 })();
 exports.Icons = __webpack_exports__.Icons;

package/dist/canvas/index.d.ts

@@ -1,4 +1,5 @@
 import './styles/variables.css';
+import './styles/tailwind.canvas.css';
 export * from './components';
 export * from './constants';
 export * from './controls';

package/dist/canvas/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/canvas/index.ts"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAC;AAEhC,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/canvas/index.ts"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAC;AAChC,OAAO,8BAA8B,CAAC;AAEtC,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC"}

package/dist/canvas/index.js

@@ -1,4 +1,5 @@
 import "./styles/variables.css";
+import "./styles/tailwind.canvas.css";
 export * from "./components/index.js";
 export * from "./constants.js";
 export * from "./controls/index.js";

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, {})
+                            })
+                        })
                     })
                 })
             })