npm - @uipath/apollo-wind - Versions diffs - 0.14.0 → 0.15.0-pr320.b49d311 - Mend

@uipath/apollo-wind 0.14.0 → 0.15.0-pr320.b49d311

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (21) hide show

package/dist/components/custom/chat-composer.cjs +4 -7
package/dist/components/custom/chat-composer.js +4 -7
package/dist/components/custom/flow-node-expandable.cjs +81 -0
package/dist/components/custom/flow-node-expandable.d.ts +27 -0
package/dist/components/custom/flow-node-expandable.js +47 -0
package/dist/components/custom/flow-node.cjs +32 -34
package/dist/components/custom/flow-node.d.ts +14 -9
package/dist/components/custom/flow-node.js +33 -35
package/dist/components/custom/hover-menu.cjs +84 -0
package/dist/components/custom/hover-menu.d.ts +13 -0
package/dist/components/custom/hover-menu.js +50 -0
package/dist/components/custom/panel-delegate.cjs +5 -2
package/dist/components/custom/panel-delegate.js +5 -2
package/dist/components/custom/toolbar-canvas.cjs +5 -2
package/dist/components/custom/toolbar-canvas.js +5 -2
package/dist/components/custom/toolbar-view.cjs +5 -2
package/dist/components/custom/toolbar-view.js +5 -2
package/dist/components/ui/index.cjs +20 -20
package/dist/styles.css +68 -14
package/dist/tailwind.css +4 -4
package/package.json +1 -1

package/dist/components/custom/chat-composer.cjs CHANGED Viewed

@@ -32,7 +32,6 @@ const external_react_namespaceObject = require("react");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 function ChatComposer({ className, placeholder = 'I would like you to automate my', onSubmit }) {
     const [value, setValue] = external_react_namespaceObject.useState('');
-    const [focused, setFocused] = external_react_namespaceObject.useState(false);
     const handleSubmit = ()=>{
         if (value.trim()) {
             onSubmit?.(value.trim());
@@ -57,9 +56,7 @@ function ChatComposer({ className, placeholder = 'I would like you to automate m
                     rows: 3,
                     value: value,
                     onChange: (e)=>setValue(e.target.value),
-                    onKeyDown: handleKeyDown,
-                    onFocus: ()=>setFocused(true),
-                    onBlur: ()=>setFocused(false)
+                    onKeyDown: handleKeyDown
                 }),
                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
                     className: "flex items-center justify-between",
@@ -110,14 +107,14 @@ function ChatComposer({ className, placeholder = 'I would like you to automate m
                                     onClick: handleSubmit,
                                     "aria-label": "Submit message",
                                     children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.CornerRightUp, {
-                                        className: "h-5 w-5 text-white"
+                                        className: "h-5 w-5 text-foreground-on-accent"
                                     })
                                 }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
                                     type: "button",
-                                    className: (0, index_cjs_namespaceObject.cn)('flex h-8 w-8 items-center justify-center rounded-lg', focused ? 'bg-foreground-accent hover:bg-foreground-accent-muted' : 'bg-surface-hover hover:bg-foreground-accent-muted'),
+                                    className: "flex h-8 w-8 items-center justify-center rounded-lg bg-surface-hover group-focus-within/input:bg-foreground-accent hover:bg-foreground-accent-muted",
                                     "aria-label": "Voice input",
                                     children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Mic, {
-                                        className: "h-5 w-5 text-white"
+                                        className: "h-5 w-5 text-foreground-on-accent"
                                     })
                                 })
                             ]

package/dist/components/custom/chat-composer.js CHANGED Viewed

@@ -4,7 +4,6 @@ import { useState } from "react";
 import { cn } from "../../lib/index.js";
 function ChatComposer({ className, placeholder = 'I would like you to automate my', onSubmit }) {
     const [value, setValue] = useState('');
-    const [focused, setFocused] = useState(false);
     const handleSubmit = ()=>{
         if (value.trim()) {
             onSubmit?.(value.trim());
@@ -29,9 +28,7 @@ function ChatComposer({ className, placeholder = 'I would like you to automate m
                     rows: 3,
                     value: value,
                     onChange: (e)=>setValue(e.target.value),
-                    onKeyDown: handleKeyDown,
-                    onFocus: ()=>setFocused(true),
-                    onBlur: ()=>setFocused(false)
+                    onKeyDown: handleKeyDown
                 }),
                 /*#__PURE__*/ jsxs("div", {
                     className: "flex items-center justify-between",
@@ -82,14 +79,14 @@ function ChatComposer({ className, placeholder = 'I would like you to automate m
                                     onClick: handleSubmit,
                                     "aria-label": "Submit message",
                                     children: /*#__PURE__*/ jsx(CornerRightUp, {
-                                        className: "h-5 w-5 text-white"
+                                        className: "h-5 w-5 text-foreground-on-accent"
                                     })
                                 }) : /*#__PURE__*/ jsx("button", {
                                     type: "button",
-                                    className: cn('flex h-8 w-8 items-center justify-center rounded-lg', focused ? 'bg-foreground-accent hover:bg-foreground-accent-muted' : 'bg-surface-hover hover:bg-foreground-accent-muted'),
+                                    className: "flex h-8 w-8 items-center justify-center rounded-lg bg-surface-hover group-focus-within/input:bg-foreground-accent hover:bg-foreground-accent-muted",
                                     "aria-label": "Voice input",
                                     children: /*#__PURE__*/ jsx(Mic, {
-                                        className: "h-5 w-5 text-white"
+                                        className: "h-5 w-5 text-foreground-on-accent"
                                     })
                                 })
                             ]

package/dist/components/custom/flow-node-expandable.cjs ADDED Viewed

@@ -0,0 +1,81 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    FlowNodeExpandable: ()=>FlowNodeExpandable
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+require("react");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const index_cjs_namespaceObject = require("../../lib/index.cjs");
+function FlowNodeExpandable({ className, title = 'Node title', icon, expanded = false, selected = false, forceState, onToggle }) {
+    const isSelected = selected || 'selected' === forceState || 'selected-hover' === forceState;
+    const isHover = 'hover' === forceState;
+    const isSelectedHover = 'selected-hover' === forceState;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: (0, index_cjs_namespaceObject.cn)('group w-[360px] rounded-2xl bg-surface-overlay', expanded ? 'flex flex-col size-[360px] px-4 pt-2.5 pb-4 gap-[15px]' : 'p-3', !isSelected && !isHover && 'border-[1.6px] border-border', !isSelected && !forceState && 'group-hover:border-2 group-hover:border-border-hover', isHover && 'border-2 border-border-hover', isSelected && !isSelectedHover && 'border-2 border-brand', isSelectedHover && 'border-2 border-foreground-accent-muted', !forceState && isSelected && 'group-hover:border-foreground-accent-muted', className),
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                className: "flex items-center justify-between",
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        className: "flex items-center gap-2.5",
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                                className: "flex items-center justify-center rounded-xl bg-surface size-8 shrink-0",
+                                children: icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Workflow, {
+                                    className: "h-5 w-5 text-foreground-muted"
+                                })
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                className: "text-sm font-medium text-foreground whitespace-nowrap",
+                                children: title
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+                        type: "button",
+                        className: "flex items-center justify-center rounded text-foreground-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                        onClick: onToggle,
+                        "aria-label": expanded ? `Collapse ${title}` : `Expand ${title}`,
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronDown, {
+                            className: (0, index_cjs_namespaceObject.cn)('h-4 w-4', expanded && 'rotate-180')
+                        })
+                    })
+                ]
+            }),
+            expanded && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                className: "flex-1 min-h-0 rounded-lg bg-surface"
+            })
+        ]
+    });
+}
+exports.FlowNodeExpandable = __webpack_exports__.FlowNodeExpandable;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "FlowNodeExpandable"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/custom/flow-node-expandable.d.ts ADDED Viewed

@@ -0,0 +1,27 @@
+import * as React from 'react';
+export interface FlowNodeExpandableProps {
+    className?: string;
+    /** Node title */
+    title?: string;
+    /** Icon rendered in the node header */
+    icon?: React.ReactNode;
+    /** Whether the node is expanded */
+    expanded?: boolean;
+    /** Whether the node is selected */
+    selected?: boolean;
+    /**
+     * Force a specific visual state — used for Storybook stories and snapshots.
+     * In normal use, hover is driven by CSS group-hover.
+     */
+    forceState?: 'default' | 'hover' | 'selected' | 'selected-hover';
+    /** Callback when expand/collapse chevron is toggled */
+    onToggle?: () => void;
+}
+/**
+ * Expandable card-style canvas node for the Flow template.
+ *
+ * Collapsed: 360px wide, header only.
+ * Expanded: 360×360px, header + content area.
+ * Shares the same 4-state border pattern as FlowNode.
+ */
+export declare function FlowNodeExpandable({ className, title, icon, expanded, selected, forceState, onToggle, }: FlowNodeExpandableProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/custom/flow-node-expandable.js ADDED Viewed

@@ -0,0 +1,47 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { ChevronDown, Workflow } from "lucide-react";
+import { cn } from "../../lib/index.js";
+function FlowNodeExpandable({ className, title = 'Node title', icon, expanded = false, selected = false, forceState, onToggle }) {
+    const isSelected = selected || 'selected' === forceState || 'selected-hover' === forceState;
+    const isHover = 'hover' === forceState;
+    const isSelectedHover = 'selected-hover' === forceState;
+    return /*#__PURE__*/ jsxs("div", {
+        className: cn('group w-[360px] rounded-2xl bg-surface-overlay', expanded ? 'flex flex-col size-[360px] px-4 pt-2.5 pb-4 gap-[15px]' : 'p-3', !isSelected && !isHover && 'border-[1.6px] border-border', !isSelected && !forceState && 'group-hover:border-2 group-hover:border-border-hover', isHover && 'border-2 border-border-hover', isSelected && !isSelectedHover && 'border-2 border-brand', isSelectedHover && 'border-2 border-foreground-accent-muted', !forceState && isSelected && 'group-hover:border-foreground-accent-muted', className),
+        children: [
+            /*#__PURE__*/ jsxs("div", {
+                className: "flex items-center justify-between",
+                children: [
+                    /*#__PURE__*/ jsxs("div", {
+                        className: "flex items-center gap-2.5",
+                        children: [
+                            /*#__PURE__*/ jsx("div", {
+                                className: "flex items-center justify-center rounded-xl bg-surface size-8 shrink-0",
+                                children: icon ?? /*#__PURE__*/ jsx(Workflow, {
+                                    className: "h-5 w-5 text-foreground-muted"
+                                })
+                            }),
+                            /*#__PURE__*/ jsx("span", {
+                                className: "text-sm font-medium text-foreground whitespace-nowrap",
+                                children: title
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsx("button", {
+                        type: "button",
+                        className: "flex items-center justify-center rounded text-foreground-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                        onClick: onToggle,
+                        "aria-label": expanded ? `Collapse ${title}` : `Expand ${title}`,
+                        children: /*#__PURE__*/ jsx(ChevronDown, {
+                            className: cn('h-4 w-4', expanded && 'rotate-180')
+                        })
+                    })
+                ]
+            }),
+            expanded && /*#__PURE__*/ jsx("div", {
+                className: "flex-1 min-h-0 rounded-lg bg-surface"
+            })
+        ]
+    });
+}
+export { FlowNodeExpandable };

package/dist/components/custom/flow-node.cjs CHANGED Viewed

@@ -30,41 +30,39 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 require("react");
 const external_lucide_react_namespaceObject = require("lucide-react");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
-function FlowNode({ className, title = 'Node title', icon, children, selected = false }) {
-    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, index_cjs_namespaceObject.cn)('flex h-[360px] w-[360px] flex-col overflow-hidden rounded-2xl bg-surface-overlay px-4 pb-4 pt-2.5', selected && 'ring-1 ring-ring', className),
-        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-            className: "flex flex-1 flex-col gap-[15px]",
-            children: [
-                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                    className: "flex items-center justify-between",
-                    children: [
-                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                            className: "flex items-center gap-2.5",
-                            children: [
-                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                                    className: "flex h-8 w-8 items-center justify-center rounded-lg bg-surface",
-                                    children: icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Bot, {
-                                        className: "h-5 w-5 text-foreground-muted"
-                                    })
-                                }),
-                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                    className: "text-sm font-medium text-foreground",
-                                    children: title
-                                })
-                            ]
-                        }),
-                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronDown, {
-                            className: "h-4 w-4 text-foreground-muted"
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                    className: "flex-1 rounded-lg bg-surface-raised",
-                    children: children
+function FlowNode({ className, title = 'Node title', subtitle = 'Secondary title', icon, selected = false, forceState, onClick }) {
+    const isSelected = selected || 'selected' === forceState || 'selected-hover' === forceState;
+    const isHover = 'hover' === forceState;
+    const isSelectedHover = 'selected-hover' === forceState;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("button", {
+        type: "button",
+        className: (0, index_cjs_namespaceObject.cn)('group flex w-[107px] flex-col items-center gap-2.5 rounded-[32px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2', className),
+        onClick: onClick,
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                className: (0, index_cjs_namespaceObject.cn)('relative flex items-center justify-center rounded-[32px] size-24 bg-surface-overlay', !isSelected && !isHover && 'border-[1.6px] border-border', !isSelected && !forceState && 'group-hover:border-2 group-hover:border-border-hover', isHover && 'border-2 border-border-hover', isSelected && !isSelectedHover && 'border-2 border-brand', isSelectedHover && 'border-2 border-foreground-accent-muted', !forceState && isSelected && 'group-hover:border-foreground-accent-muted'),
+                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                    className: "flex items-center justify-center overflow-hidden rounded-[24px] bg-surface size-20",
+                    children: icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Bot, {
+                        className: "h-10 w-10 text-foreground-muted",
+                        strokeWidth: 1.4
+                    })
                 })
-            ]
-        })
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                className: "flex flex-col items-center",
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                        className: "text-center text-[14px] font-semibold leading-[18px] text-foreground",
+                        children: title
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                        className: "text-center text-[12px] leading-[18px] text-foreground-muted",
+                        children: subtitle
+                    })
+                ]
+            })
+        ]
     });
 }
 exports.FlowNode = __webpack_exports__.FlowNode;

package/dist/components/custom/flow-node.d.ts CHANGED Viewed

@@ -3,18 +3,23 @@ export interface FlowNodeProps {
     className?: string;
     /** Node title */
     title?: string;
-    /** Icon to display in the node header */
+    /** Node subtitle */
+    subtitle?: string;
+    /** Icon rendered inside the inner shape */
     icon?: React.ReactNode;
-    /** Node content (rendered below the header) */
-    children?: React.ReactNode;
-    /** Whether the node is selected */
+    /** Whether the node is in selected state */
     selected?: boolean;
+    /**
+     * Force a specific visual state — used for Storybook stories and snapshots.
+     * In normal use, hover is driven by CSS group-hover.
+     */
+    forceState?: 'default' | 'hover' | 'selected' | 'selected-hover';
+    onClick?: () => void;
 }
 /**
- * A canvas node card for the Flow template.
+ * Icon-centric canvas node for the Flow template.
  *
- * Displays a dark card with a header (icon + title + chevron) and a
- * content area. Default size is 360×360px but can be overridden via
- * className.
+ * 96×96 outer ring → 80×80 inner rounded shape → 40×40 icon.
+ * Title + subtitle centered below.
  */
-export declare function FlowNode({ className, title, icon, children, selected, }: FlowNodeProps): import("react/jsx-runtime").JSX.Element;
+export declare function FlowNode({ className, title, subtitle, icon, selected, forceState, onClick, }: FlowNodeProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/custom/flow-node.js CHANGED Viewed

@@ -1,42 +1,40 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-import { Bot, ChevronDown } from "lucide-react";
+import { Bot } from "lucide-react";
 import { cn } from "../../lib/index.js";
-function FlowNode({ className, title = 'Node title', icon, children, selected = false }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn('flex h-[360px] w-[360px] flex-col overflow-hidden rounded-2xl bg-surface-overlay px-4 pb-4 pt-2.5', selected && 'ring-1 ring-ring', className),
-        children: /*#__PURE__*/ jsxs("div", {
-            className: "flex flex-1 flex-col gap-[15px]",
-            children: [
-                /*#__PURE__*/ jsxs("div", {
-                    className: "flex items-center justify-between",
-                    children: [
-                        /*#__PURE__*/ jsxs("div", {
-                            className: "flex items-center gap-2.5",
-                            children: [
-                                /*#__PURE__*/ jsx("div", {
-                                    className: "flex h-8 w-8 items-center justify-center rounded-lg bg-surface",
-                                    children: icon ?? /*#__PURE__*/ jsx(Bot, {
-                                        className: "h-5 w-5 text-foreground-muted"
-                                    })
-                                }),
-                                /*#__PURE__*/ jsx("span", {
-                                    className: "text-sm font-medium text-foreground",
-                                    children: title
-                                })
-                            ]
-                        }),
-                        /*#__PURE__*/ jsx(ChevronDown, {
-                            className: "h-4 w-4 text-foreground-muted"
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ jsx("div", {
-                    className: "flex-1 rounded-lg bg-surface-raised",
-                    children: children
+function FlowNode({ className, title = 'Node title', subtitle = 'Secondary title', icon, selected = false, forceState, onClick }) {
+    const isSelected = selected || 'selected' === forceState || 'selected-hover' === forceState;
+    const isHover = 'hover' === forceState;
+    const isSelectedHover = 'selected-hover' === forceState;
+    return /*#__PURE__*/ jsxs("button", {
+        type: "button",
+        className: cn('group flex w-[107px] flex-col items-center gap-2.5 rounded-[32px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2', className),
+        onClick: onClick,
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: cn('relative flex items-center justify-center rounded-[32px] size-24 bg-surface-overlay', !isSelected && !isHover && 'border-[1.6px] border-border', !isSelected && !forceState && 'group-hover:border-2 group-hover:border-border-hover', isHover && 'border-2 border-border-hover', isSelected && !isSelectedHover && 'border-2 border-brand', isSelectedHover && 'border-2 border-foreground-accent-muted', !forceState && isSelected && 'group-hover:border-foreground-accent-muted'),
+                children: /*#__PURE__*/ jsx("div", {
+                    className: "flex items-center justify-center overflow-hidden rounded-[24px] bg-surface size-20",
+                    children: icon ?? /*#__PURE__*/ jsx(Bot, {
+                        className: "h-10 w-10 text-foreground-muted",
+                        strokeWidth: 1.4
+                    })
                 })
-            ]
-        })
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                className: "flex flex-col items-center",
+                children: [
+                    /*#__PURE__*/ jsx("span", {
+                        className: "text-center text-[14px] font-semibold leading-[18px] text-foreground",
+                        children: title
+                    }),
+                    /*#__PURE__*/ jsx("span", {
+                        className: "text-center text-[12px] leading-[18px] text-foreground-muted",
+                        children: subtitle
+                    })
+                ]
+            })
+        ]
     });
 }
 export { FlowNode };

package/dist/components/custom/hover-menu.cjs ADDED Viewed

@@ -0,0 +1,84 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    HoverMenu: ()=>HoverMenu
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+require("react");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const index_cjs_namespaceObject = require("../../lib/index.cjs");
+function MenuButton({ icon: Icon, label, onClick }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+        type: "button",
+        className: "group flex h-6 w-6 items-center justify-center rounded-[4px] text-foreground-muted hover:bg-surface-hover hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        "aria-label": label,
+        onClick: onClick,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            className: "h-4 w-4 transition-transform group-hover:scale-[1.25]",
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {
+                className: "h-full w-full",
+                strokeWidth: 1.4
+            })
+        })
+    });
+}
+function HoverMenu({ className, onPlay, onEdit, onDelete, onMore }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: (0, index_cjs_namespaceObject.cn)('flex h-10 items-center gap-1 rounded-xl border border-surface-overlay bg-surface-raised px-2 py-1', className),
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(MenuButton, {
+                icon: external_lucide_react_namespaceObject.Play,
+                label: "Run node",
+                onClick: onPlay
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(MenuButton, {
+                icon: external_lucide_react_namespaceObject.Pencil,
+                label: "Edit node",
+                onClick: onEdit
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(MenuButton, {
+                icon: external_lucide_react_namespaceObject.Trash2,
+                label: "Delete node",
+                onClick: onDelete
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                className: "h-5 w-px bg-border-subtle"
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(MenuButton, {
+                icon: external_lucide_react_namespaceObject.EllipsisVertical,
+                label: "More options",
+                onClick: onMore
+            })
+        ]
+    });
+}
+exports.HoverMenu = __webpack_exports__.HoverMenu;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "HoverMenu"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/custom/hover-menu.d.ts ADDED Viewed

@@ -0,0 +1,13 @@
+export interface HoverMenuProps {
+    className?: string;
+    onPlay?: () => void;
+    onEdit?: () => void;
+    onDelete?: () => void;
+    onMore?: () => void;
+}
+/**
+ * Contextual hover menu for canvas nodes.
+ *
+ * Displays Play, Edit, Delete, and More actions in a compact floating toolbar.
+ */
+export declare function HoverMenu({ className, onPlay, onEdit, onDelete, onMore }: HoverMenuProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/custom/hover-menu.js ADDED Viewed

@@ -0,0 +1,50 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { EllipsisVertical, Pencil, Play, Trash2 } from "lucide-react";
+import { cn } from "../../lib/index.js";
+function MenuButton({ icon: Icon, label, onClick }) {
+    return /*#__PURE__*/ jsx("button", {
+        type: "button",
+        className: "group flex h-6 w-6 items-center justify-center rounded-[4px] text-foreground-muted hover:bg-surface-hover hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        "aria-label": label,
+        onClick: onClick,
+        children: /*#__PURE__*/ jsx("div", {
+            className: "h-4 w-4 transition-transform group-hover:scale-[1.25]",
+            children: /*#__PURE__*/ jsx(Icon, {
+                className: "h-full w-full",
+                strokeWidth: 1.4
+            })
+        })
+    });
+}
+function HoverMenu({ className, onPlay, onEdit, onDelete, onMore }) {
+    return /*#__PURE__*/ jsxs("div", {
+        className: cn('flex h-10 items-center gap-1 rounded-xl border border-surface-overlay bg-surface-raised px-2 py-1', className),
+        children: [
+            /*#__PURE__*/ jsx(MenuButton, {
+                icon: Play,
+                label: "Run node",
+                onClick: onPlay
+            }),
+            /*#__PURE__*/ jsx(MenuButton, {
+                icon: Pencil,
+                label: "Edit node",
+                onClick: onEdit
+            }),
+            /*#__PURE__*/ jsx(MenuButton, {
+                icon: Trash2,
+                label: "Delete node",
+                onClick: onDelete
+            }),
+            /*#__PURE__*/ jsx("div", {
+                className: "h-5 w-px bg-border-subtle"
+            }),
+            /*#__PURE__*/ jsx(MenuButton, {
+                icon: EllipsisVertical,
+                label: "More options",
+                onClick: onMore
+            })
+        ]
+    });
+}
+export { HoverMenu };

package/dist/components/custom/panel-delegate.cjs CHANGED Viewed

@@ -36,7 +36,7 @@ const tooltip_cjs_namespaceObject = require("../ui/tooltip.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 function UiPathLogo({ className }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, index_cjs_namespaceObject.cn)('flex h-9 w-9 items-center justify-center overflow-clip rounded-lg bg-[#0092b8] shadow-sm', className),
+        className: (0, index_cjs_namespaceObject.cn)('flex h-9 w-9 items-center justify-center overflow-hidden rounded-lg bg-[#0092b8] shadow-sm', className),
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("svg", {
             viewBox: "0 0 24 24",
             fill: "none",
@@ -70,6 +70,7 @@ function ExpandedNavItem({ item, isOpen, isActive, onToggle, selectedChildId, on
         type: "button",
         className: (0, index_cjs_namespaceObject.cn)('flex h-10 w-full items-center gap-2 rounded-2xl px-1 text-foreground-hover transition-colors hover:bg-surface-hover hover:text-foreground', isActive && 'bg-surface-hover text-foreground'),
         onClick: onToggle,
+        "aria-current": isActive ? 'page' : void 0,
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                 className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-lg",
@@ -134,8 +135,10 @@ function CollapsedNavItem({ item, isActive, onClick }) {
                 asChild: true,
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
                     type: "button",
-                    className: "group flex h-12 w-full items-center justify-center",
+                    className: "group flex h-12 w-full items-center justify-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset rounded-lg",
                     onClick: onClick,
+                    "aria-label": item.label,
+                    "aria-pressed": isActive,
                     children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                         className: (0, index_cjs_namespaceObject.cn)('flex h-9 w-9 items-center justify-center rounded-lg text-foreground-muted group-hover:bg-surface-hover group-hover:text-foreground-hover', isActive && 'bg-surface-hover text-foreground-hover'),
                         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {

package/dist/components/custom/panel-delegate.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "../ui/
 import { cn } from "../../lib/index.js";
 function UiPathLogo({ className }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex h-9 w-9 items-center justify-center overflow-clip rounded-lg bg-[#0092b8] shadow-sm', className),
+        className: cn('flex h-9 w-9 items-center justify-center overflow-hidden rounded-lg bg-[#0092b8] shadow-sm', className),
         children: /*#__PURE__*/ jsxs("svg", {
             viewBox: "0 0 24 24",
             fill: "none",
@@ -42,6 +42,7 @@ function ExpandedNavItem({ item, isOpen, isActive, onToggle, selectedChildId, on
         type: "button",
         className: cn('flex h-10 w-full items-center gap-2 rounded-2xl px-1 text-foreground-hover transition-colors hover:bg-surface-hover hover:text-foreground', isActive && 'bg-surface-hover text-foreground'),
         onClick: onToggle,
+        "aria-current": isActive ? 'page' : void 0,
         children: [
             /*#__PURE__*/ jsx("div", {
                 className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-lg",
@@ -106,8 +107,10 @@ function CollapsedNavItem({ item, isActive, onClick }) {
                 asChild: true,
                 children: /*#__PURE__*/ jsx("button", {
                     type: "button",
-                    className: "group flex h-12 w-full items-center justify-center",
+                    className: "group flex h-12 w-full items-center justify-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset rounded-lg",
                     onClick: onClick,
+                    "aria-label": item.label,
+                    "aria-pressed": isActive,
                     children: /*#__PURE__*/ jsx("div", {
                         className: cn('flex h-9 w-9 items-center justify-center rounded-lg text-foreground-muted group-hover:bg-surface-hover group-hover:text-foreground-hover', isActive && 'bg-surface-hover text-foreground-hover'),
                         children: /*#__PURE__*/ jsx("div", {

package/dist/components/custom/toolbar-canvas.cjs CHANGED Viewed

@@ -41,8 +41,11 @@ function ToolbarButton({ icon: Icon, label, onClick }) {
         className: "group flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted hover:bg-surface-hover hover:text-foreground",
         onClick: onClick,
         "aria-label": label,
-        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {
-            className: "h-5 w-5 group-hover:h-6 group-hover:w-6"
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            className: "h-5 w-5 transition-transform group-hover:scale-[1.2]",
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {
+                className: "h-full w-full"
+            })
         })
     });
 }

package/dist/components/custom/toolbar-canvas.js CHANGED Viewed

@@ -13,8 +13,11 @@ function ToolbarButton({ icon: Icon, label, onClick }) {
         className: "group flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted hover:bg-surface-hover hover:text-foreground",
         onClick: onClick,
         "aria-label": label,
-        children: /*#__PURE__*/ jsx(Icon, {
-            className: "h-5 w-5 group-hover:h-6 group-hover:w-6"
+        children: /*#__PURE__*/ jsx("div", {
+            className: "h-5 w-5 transition-transform group-hover:scale-[1.2]",
+            children: /*#__PURE__*/ jsx(Icon, {
+                className: "h-full w-full"
+            })
         })
     });
 }

package/dist/components/custom/toolbar-view.cjs CHANGED Viewed

@@ -36,8 +36,11 @@ function ViewButton({ icon: Icon, label, onClick }) {
         className: "group flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted hover:bg-surface-hover hover:text-foreground",
         onClick: onClick,
         "aria-label": label,
-        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {
-            className: "h-5 w-5 group-hover:h-6 group-hover:w-6"
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            className: "h-5 w-5 transition-transform group-hover:scale-[1.2]",
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {
+                className: "h-full w-full"
+            })
         })
     });
 }

package/dist/components/custom/toolbar-view.js CHANGED Viewed

@@ -8,8 +8,11 @@ function ViewButton({ icon: Icon, label, onClick }) {
         className: "group flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted hover:bg-surface-hover hover:text-foreground",
         onClick: onClick,
         "aria-label": label,
-        children: /*#__PURE__*/ jsx(Icon, {
-            className: "h-5 w-5 group-hover:h-6 group-hover:w-6"
+        children: /*#__PURE__*/ jsx("div", {
+            className: "h-5 w-5 transition-transform group-hover:scale-[1.2]",
+            children: /*#__PURE__*/ jsx(Icon, {
+                className: "h-full w-full"
+            })
         })
     });
 }

package/dist/components/ui/index.cjs CHANGED Viewed

@@ -15,7 +15,7 @@ var __webpack_modules__ = {
     "./avatar" (module) {
         module.exports = require("./avatar.cjs");
     },
-    "@/components/ui/badge" (module) {
+    "./badge" (module) {
         module.exports = require("./badge.cjs");
     },
     "./breadcrumb" (module) {
@@ -27,25 +27,25 @@ var __webpack_modules__ = {
     "@/components/ui/button" (module) {
         module.exports = require("./button.cjs");
     },
-    "./calendar" (module) {
+    "@/components/ui/calendar" (module) {
         module.exports = require("./calendar.cjs");
     },
-    "./card" (module) {
+    "@/components/ui/card" (module) {
         module.exports = require("./card.cjs");
     },
-    "@/components/ui/checkbox" (module) {
+    "./checkbox" (module) {
         module.exports = require("./checkbox.cjs");
     },
-    "@/components/ui/collapsible" (module) {
+    "./collapsible" (module) {
         module.exports = require("./collapsible.cjs");
     },
     "./combobox" (module) {
         module.exports = require("./combobox.cjs");
     },
-    "@/components/ui/command" (module) {
+    "./command" (module) {
         module.exports = require("./command.cjs");
     },
-    "@/components/ui/context-menu" (module) {
+    "./context-menu" (module) {
         module.exports = require("./context-menu.cjs");
     },
     "./data-table" (module) {
@@ -57,10 +57,10 @@ var __webpack_modules__ = {
     "./datetime-picker" (module) {
         module.exports = require("./datetime-picker.cjs");
     },
-    "@/components/ui/dialog" (module) {
+    "./dialog" (module) {
         module.exports = require("./dialog.cjs");
     },
-    "@/components/ui/dropdown-menu" (module) {
+    "./dropdown-menu" (module) {
         module.exports = require("./dropdown-menu.cjs");
     },
     "./editable-cell" (module) {
@@ -72,7 +72,7 @@ var __webpack_modules__ = {
     "./file-upload" (module) {
         module.exports = require("./file-upload.cjs");
     },
-    "@/components/ui/hover-card" (module) {
+    "./hover-card" (module) {
         module.exports = require("./hover-card.cjs");
     },
     "@/components/ui/input" (module) {
@@ -241,7 +241,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_avatar__rspack_import_4[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _badge__rspack_import_5 = __webpack_require__("@/components/ui/badge");
+    var _badge__rspack_import_5 = __webpack_require__("./badge");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _badge__rspack_import_5)if ([
         "TreeView",
@@ -269,28 +269,28 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_button_group__rspack_import_8[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _calendar__rspack_import_9 = __webpack_require__("./calendar");
+    var _calendar__rspack_import_9 = __webpack_require__("@/components/ui/calendar");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _calendar__rspack_import_9)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_calendar__rspack_import_9[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _card__rspack_import_10 = __webpack_require__("./card");
+    var _card__rspack_import_10 = __webpack_require__("@/components/ui/card");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _card__rspack_import_10)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_card__rspack_import_10[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _checkbox__rspack_import_11 = __webpack_require__("@/components/ui/checkbox");
+    var _checkbox__rspack_import_11 = __webpack_require__("./checkbox");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _checkbox__rspack_import_11)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_checkbox__rspack_import_11[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _collapsible__rspack_import_12 = __webpack_require__("@/components/ui/collapsible");
+    var _collapsible__rspack_import_12 = __webpack_require__("./collapsible");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _collapsible__rspack_import_12)if ([
         "TreeView",
@@ -304,14 +304,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_combobox__rspack_import_13[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _command__rspack_import_14 = __webpack_require__("@/components/ui/command");
+    var _command__rspack_import_14 = __webpack_require__("./command");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _command__rspack_import_14)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_command__rspack_import_14[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _context_menu__rspack_import_15 = __webpack_require__("@/components/ui/context-menu");
+    var _context_menu__rspack_import_15 = __webpack_require__("./context-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _context_menu__rspack_import_15)if ([
         "TreeView",
@@ -339,14 +339,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_datetime_picker__rspack_import_18[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dialog__rspack_import_19 = __webpack_require__("@/components/ui/dialog");
+    var _dialog__rspack_import_19 = __webpack_require__("./dialog");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dialog__rspack_import_19)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dialog__rspack_import_19[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dropdown_menu__rspack_import_20 = __webpack_require__("@/components/ui/dropdown-menu");
+    var _dropdown_menu__rspack_import_20 = __webpack_require__("./dropdown-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dropdown_menu__rspack_import_20)if ([
         "TreeView",
@@ -374,7 +374,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_file_upload__rspack_import_23[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _hover_card__rspack_import_24 = __webpack_require__("@/components/ui/hover-card");
+    var _hover_card__rspack_import_24 = __webpack_require__("./hover-card");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _hover_card__rspack_import_24)if ([
         "TreeView",

package/dist/styles.css CHANGED Viewed

@@ -926,10 +926,26 @@
     width: calc(var(--spacing) * 4);
     height: calc(var(--spacing) * 4);
   }
+  .size-8 {
+    width: calc(var(--spacing) * 8);
+    height: calc(var(--spacing) * 8);
+  }
+  .size-20 {
+    width: calc(var(--spacing) * 20);
+    height: calc(var(--spacing) * 20);
+  }
+  .size-24 {
+    width: calc(var(--spacing) * 24);
+    height: calc(var(--spacing) * 24);
+  }
   .size-\[--cell-size\] {
     width: --cell-size;
     height: --cell-size;
   }
+  .size-\[360px\] {
+    width: 360px;
+    height: 360px;
+  }
   .size-full {
     width: 100%;
     height: 100%;
@@ -1294,6 +1310,9 @@
   .w-\[100px\] {
     width: 100px;
   }
+  .w-\[107px\] {
+    width: 107px;
+  }
   .w-\[110px\] {
     width: 110px;
   }
@@ -2003,6 +2022,10 @@
     border-style: var(--tw-border-style);
     border-width: 1.5px;
   }
+  .border-\[1\.6px\] {
+    border-style: var(--tw-border-style);
+    border-width: 1.6px;
+  }
   .border-t {
     border-top-style: var(--tw-border-style);
     border-top-width: 1px;
@@ -2089,6 +2112,9 @@
       border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
     }
   }
+  .border-foreground-accent-muted {
+    border-color: var(--foreground-accent-muted);
+  }
   .border-gray-200 {
     border-color: var(--color-gray-200);
   }
@@ -3497,6 +3523,9 @@
   .text-\[13px\] {
     font-size: 13px;
   }
+  .text-\[14px\] {
+    font-size: 14px;
+  }
   .text-\[15px\] {
     font-size: 15px;
   }
@@ -4020,24 +4049,44 @@
   .\[--cell-size\:2\.75rem\] {
     --cell-size: 2.75rem;
   }
-  .group-hover\:h-6 {
+  .group-focus-within\/input\:bg-foreground-accent {
+    &:is(:where(.group\/input):focus-within *) {
+      background-color: var(--foreground-accent);
+    }
+  }
+  .group-hover\:scale-\[1\.2\] {
     &:is(:where(.group):hover *) {
       @media (hover: hover) {
-        height: calc(var(--spacing) * 6);
+        scale: 1.2;
       }
     }
   }
-  .group-hover\:w-6 {
+  .group-hover\:scale-\[1\.25\] {
     &:is(:where(.group):hover *) {
       @media (hover: hover) {
-        width: calc(var(--spacing) * 6);
+        scale: 1.25;
       }
     }
   }
-  .group-hover\:scale-\[1\.2\] {
+  .group-hover\:border-2 {
     &:is(:where(.group):hover *) {
       @media (hover: hover) {
-        scale: 1.2;
+        border-style: var(--tw-border-style);
+        border-width: 2px;
+      }
+    }
+  }
+  .group-hover\:border-border-hover {
+    &:is(:where(.group):hover *) {
+      @media (hover: hover) {
+        border-color: var(--border-hover);
+      }
+    }
+  }
+  .group-hover\:border-foreground-accent-muted {
+    &:is(:where(.group):hover *) {
+      @media (hover: hover) {
+        border-color: var(--foreground-accent-muted);
       }
     }
   }
@@ -4923,6 +4972,11 @@
       outline-style: none;
     }
   }
+  .focus-visible\:ring-inset {
+    &:focus-visible {
+      --tw-ring-inset: inset;
+    }
+  }
   .active\:scale-95 {
     &:active {
       --tw-scale-x: 95%;
@@ -6959,7 +7013,7 @@
   --border-radius-m: 4px;
   --border-radius-l: 8px;
 }
-body.light {
+.light {
   --color-background: #ffffff;
   --color-background-secondary: #f4f5f7;
   --color-background-inverse: #182027;
@@ -7082,7 +7136,7 @@ body.light {
   --border: var(--border-light);
   color-scheme: light;
 }
-body.light-hc {
+.light-hc {
   --color-background: #ffffff;
   --color-background-secondary: #f4f5f7;
   --color-background-inverse: #182027;
@@ -7205,7 +7259,7 @@ body.light-hc {
   --border: var(--border-light-hc);
   color-scheme: light;
 }
-body.dark {
+.dark {
   --color-background: #182027;
   --color-background-secondary: #273139;
   --color-background-inverse: #f8f9fa;
@@ -7328,7 +7382,7 @@ body.dark {
   --border: var(--border-dark);
   color-scheme: dark;
 }
-body.dark-hc {
+.dark-hc {
   --color-background: #182027;
   --color-background-secondary: #273139;
   --color-background-inverse: #f8f9fa;
@@ -7454,7 +7508,7 @@ body.dark-hc {
 :root {
   --radius: 0.75rem;
 }
-body.dark {
+.dark {
   --surface: var(--color-background, #182027);
   --surface-raised: var(--color-background-raised, #273139);
   --surface-overlay: var(--color-background-selected, #374652);
@@ -7512,7 +7566,7 @@ body.dark {
   --input: var(--border-subtle);
   color-scheme: dark;
 }
-body.dark-hc {
+.dark-hc {
   --surface: var(--color-background, #182027);
   --surface-raised: var(--color-background-raised, #273139);
   --surface-overlay: var(--color-background-selected, #374652);
@@ -7570,7 +7624,7 @@ body.dark-hc {
   --input: var(--border-subtle);
   color-scheme: dark;
 }
-body.light {
+.light {
   --surface: var(--color-background, #ffffff);
   --surface-raised: var(--color-background-raised, #ffffff);
   --surface-overlay: var(--color-background-secondary, #f4f5f7);
@@ -7628,7 +7682,7 @@ body.light {
   --input: var(--border-subtle);
   color-scheme: light;
 }
-body.light-hc {
+.light-hc {
   --surface: var(--color-background, #ffffff);
   --surface-raised: var(--color-background-raised, #ffffff);
   --surface-overlay: var(--color-background-secondary, #f4f5f7);

package/dist/tailwind.css CHANGED Viewed

@@ -23,7 +23,7 @@
   * Each theme uses semantic tokens from apollo-core with hardcoded fallbacks
   */
-body.dark {
+.dark {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: var(--color-background, #182027);
   --surface-raised: var(--color-background-raised, #273139);
@@ -100,7 +100,7 @@ body.dark {
   color-scheme: dark;
 }
-body.dark-hc {
+.dark-hc {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: var(--color-background, #182027);
   --surface-raised: var(--color-background-raised, #273139);
@@ -177,7 +177,7 @@ body.dark-hc {
   color-scheme: dark;
 }
-body.light {
+.light {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: var(--color-background, #ffffff);
   --surface-raised: var(--color-background-raised, #ffffff);
@@ -254,7 +254,7 @@ body.light {
   color-scheme: light;
 }
-body.light-hc {
+.light-hc {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: var(--color-background, #ffffff);
   --surface-raised: var(--color-background-raised, #ffffff);

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-wind",
-  "version": "0.14.0",
+  "version": "0.15.0-pr320.b49d311",
   "description": "UiPath wind design system - A Tailwind CSS based React component library",
   "type": "module",
   "main": "./dist/index.js",