@uipath/apollo-wind 0.15.2 → 1.0.0

package/dist/components/ui/index.cjs

@@ -33,19 +33,19 @@ var __webpack_modules__ = {
     "@/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");
     },
-    "./command" (module) {
+    "@/components/ui/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");
     },
     "@/components/ui/editable-cell" (module) {
@@ -72,10 +72,10 @@ 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) {
+    "./input" (module) {
         module.exports = require("./input.cjs");
     },
     "./label" (module) {
@@ -90,7 +90,7 @@ var __webpack_modules__ = {
     "./pagination" (module) {
         module.exports = require("./pagination.cjs");
     },
-    "./popover" (module) {
+    "@/components/ui/popover" (module) {
         module.exports = require("./popover.cjs");
     },
     "./progress" (module) {
@@ -138,7 +138,7 @@ var __webpack_modules__ = {
     "./switch" (module) {
         module.exports = require("./switch.cjs");
     },
-    "@/components/ui/table" (module) {
+    "./table" (module) {
         module.exports = require("./table.cjs");
     },
     "./tabs" (module) {
@@ -150,7 +150,7 @@ var __webpack_modules__ = {
     "./toggle-group" (module) {
         module.exports = require("./toggle-group.cjs");
     },
-    "./toggle" (module) {
+    "@/components/ui/toggle" (module) {
         module.exports = require("./toggle.cjs");
     },
     "./tooltip" (module) {
@@ -283,14 +283,14 @@ var __webpack_exports__ = {};
         "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__("./command");
+    var _command__rspack_import_14 = __webpack_require__("@/components/ui/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,14 +374,14 @@ 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",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_hover_card__rspack_import_24[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input__rspack_import_25 = __webpack_require__("@/components/ui/input");
+    var _input__rspack_import_25 = __webpack_require__("./input");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input__rspack_import_25)if ([
         "TreeView",
@@ -416,7 +416,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_pagination__rspack_import_29[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _popover__rspack_import_30 = __webpack_require__("./popover");
+    var _popover__rspack_import_30 = __webpack_require__("@/components/ui/popover");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _popover__rspack_import_30)if ([
         "TreeView",
@@ -528,7 +528,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_switch__rspack_import_45[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _table__rspack_import_46 = __webpack_require__("@/components/ui/table");
+    var _table__rspack_import_46 = __webpack_require__("./table");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _table__rspack_import_46)if ([
         "TreeView",
@@ -549,7 +549,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_48[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _toggle__rspack_import_49 = __webpack_require__("./toggle");
+    var _toggle__rspack_import_49 = __webpack_require__("@/components/ui/toggle");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _toggle__rspack_import_49)if ([
         "TreeView",

package/dist/components/ui/resizable.cjs

@@ -32,16 +32,16 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_lucide_react_namespaceObject = require("lucide-react");
 const external_react_resizable_panels_namespaceObject = require("react-resizable-panels");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
-const ResizablePanelGroup = ({ className, ...props })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_resizable_panels_namespaceObject.PanelGroup, {
-        className: (0, index_cjs_namespaceObject.cn)('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className),
+const ResizablePanelGroup = ({ className, ...props })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_resizable_panels_namespaceObject.Group, {
+        className: (0, index_cjs_namespaceObject.cn)('flex h-full w-full', className),
         ...props
     });
 const ResizablePanel = external_react_resizable_panels_namespaceObject.Panel;
-const ResizableHandle = ({ withHandle, className, ...props })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_resizable_panels_namespaceObject.PanelResizeHandle, {
-        className: (0, index_cjs_namespaceObject.cn)('group relative flex w-px items-center justify-center bg-border transition-colors data-[resize-handle-state=hover]:bg-primary data-[resize-handle-state=drag]:bg-primary after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90', className),
+const ResizableHandle = ({ withHandle, className, ...props })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_resizable_panels_namespaceObject.Separator, {
+        className: (0, index_cjs_namespaceObject.cn)('group relative flex w-px items-center justify-center bg-border transition-colors data-[separator=hover]:bg-primary data-[separator=active]:bg-primary after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:-translate-y-1/2 aria-[orientation=horizontal]:after:translate-x-0 [&[aria-orientation=horizontal]>div]:rotate-90', className),
         ...props,
         children: withHandle && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-            className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border transition-colors group-data-[resize-handle-state=hover]:bg-primary group-data-[resize-handle-state=drag]:bg-primary",
+            className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border transition-colors group-data-[separator=hover]:bg-primary group-data-[separator=active]:bg-primary",
             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.GripVertical, {
                 className: "h-2.5 w-2.5"
             })

package/dist/components/ui/resizable.d.ts

@@ -1,23 +1,9 @@
-import * as ResizablePrimitive from 'react-resizable-panels';
-declare const ResizablePanelGroup: ({ className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => import("react/jsx-runtime").JSX.Element;
-declare const ResizablePanel: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<HTMLDivElement | HTMLElement | HTMLButtonElement | HTMLHRElement | HTMLSpanElement | HTMLObjectElement | HTMLParagraphElement | HTMLSlotElement | HTMLStyleElement | HTMLTitleElement | HTMLMapElement | HTMLTableElement | HTMLDialogElement | HTMLFormElement | HTMLImageElement | HTMLLinkElement | HTMLOptionElement | HTMLMeterElement | HTMLTextAreaElement | HTMLProgressElement | HTMLEmbedElement | HTMLPreElement | HTMLInputElement | HTMLSelectElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDListElement | HTMLFieldSetElement | HTMLHeadingElement | HTMLHeadElement | HTMLHtmlElement | HTMLIFrameElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMetaElement | HTMLOListElement | HTMLOptGroupElement | HTMLOutputElement | HTMLScriptElement | HTMLSourceElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLTableCaptionElement | HTMLMenuElement | HTMLPictureElement>, "id" | "onResize"> & {
-    className?: string;
-    collapsedSize?: number | undefined;
-    collapsible?: boolean | undefined;
-    defaultSize?: number | undefined;
-    id?: string;
-    maxSize?: number | undefined;
-    minSize?: number | undefined;
-    onCollapse?: ResizablePrimitive.PanelOnCollapse;
-    onExpand?: ResizablePrimitive.PanelOnExpand;
-    onResize?: ResizablePrimitive.PanelOnResize;
-    order?: number;
-    style?: object;
-    tagName?: keyof HTMLElementTagNameMap | undefined;
-} & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<ResizablePrimitive.ImperativePanelHandle>>;
-declare const ResizableHandle: ({ withHandle, className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+import { Group, Panel, Separator } from 'react-resizable-panels';
+import type { PanelImperativeHandle } from 'react-resizable-panels';
+declare const ResizablePanelGroup: ({ className, ...props }: React.ComponentProps<typeof Group>) => import("react/jsx-runtime").JSX.Element;
+declare const ResizablePanel: typeof Panel;
+declare const ResizableHandle: ({ withHandle, className, ...props }: React.ComponentProps<typeof Separator> & {
     withHandle?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;
 export { ResizablePanelGroup, ResizablePanel, ResizableHandle };
+export type { PanelImperativeHandle };

package/dist/components/ui/resizable.js

@@ -1,17 +1,17 @@
 import { jsx } from "react/jsx-runtime";
 import { GripVertical } from "lucide-react";
-import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";
+import { Group, Panel, Separator } from "react-resizable-panels";
 import { cn } from "../../lib/index.js";
-const ResizablePanelGroup = ({ className, ...props })=>/*#__PURE__*/ jsx(PanelGroup, {
-        className: cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className),
+const ResizablePanelGroup = ({ className, ...props })=>/*#__PURE__*/ jsx(Group, {
+        className: cn('flex h-full w-full', className),
         ...props
     });
 const ResizablePanel = Panel;
-const ResizableHandle = ({ withHandle, className, ...props })=>/*#__PURE__*/ jsx(PanelResizeHandle, {
-        className: cn('group relative flex w-px items-center justify-center bg-border transition-colors data-[resize-handle-state=hover]:bg-primary data-[resize-handle-state=drag]:bg-primary after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90', className),
+const ResizableHandle = ({ withHandle, className, ...props })=>/*#__PURE__*/ jsx(Separator, {
+        className: cn('group relative flex w-px items-center justify-center bg-border transition-colors data-[separator=hover]:bg-primary data-[separator=active]:bg-primary after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:-translate-y-1/2 aria-[orientation=horizontal]:after:translate-x-0 [&[aria-orientation=horizontal]>div]:rotate-90', className),
         ...props,
         children: withHandle && /*#__PURE__*/ jsx("div", {
-            className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border transition-colors group-data-[resize-handle-state=hover]:bg-primary group-data-[resize-handle-state=drag]:bg-primary",
+            className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border transition-colors group-data-[separator=hover]:bg-primary group-data-[separator=active]:bg-primary",
             children: /*#__PURE__*/ jsx(GripVertical, {
                 className: "h-2.5 w-2.5"
             })

package/dist/styles.css

@@ -4178,13 +4178,13 @@
       }
     }
   }
-  .group-data-\[resize-handle-state\=drag\]\:bg-primary {
-    &:is(:where(.group)[data-resize-handle-state="drag"] *) {
+  .group-data-\[separator\=active\]\:bg-primary {
+    &:is(:where(.group)[data-separator="active"] *) {
       background-color: var(--primary);
     }
   }
-  .group-data-\[resize-handle-state\=hover\]\:bg-primary {
-    &:is(:where(.group)[data-resize-handle-state="hover"] *) {
+  .group-data-\[separator\=hover\]\:bg-primary {
+    &:is(:where(.group)[data-separator="hover"] *) {
       background-color: var(--primary);
     }
   }
@@ -5047,72 +5047,42 @@
       color: var(--muted-foreground);
     }
   }
-  .data-\[active\=true\]\:bg-surface-overlay {
-    &[data-active="true"] {
-      background-color: var(--surface-overlay);
-    }
-  }
-  .data-\[disabled\]\:pointer-events-none {
-    &[data-disabled] {
-      pointer-events: none;
-    }
-  }
-  .data-\[disabled\]\:opacity-50 {
-    &[data-disabled] {
-      opacity: 50%;
-    }
-  }
-  .data-\[disabled\=true\]\:pointer-events-none {
-    &[data-disabled="true"] {
-      pointer-events: none;
-    }
-  }
-  .data-\[disabled\=true\]\:opacity-50 {
-    &[data-disabled="true"] {
-      opacity: 50%;
-    }
-  }
-  .data-\[panel-group-direction\=vertical\]\:h-px {
-    &[data-panel-group-direction="vertical"] {
+  .aria-\[orientation\=horizontal\]\:h-px {
+    &[aria-orientation="horizontal"] {
       height: 1px;
     }
   }
-  .data-\[panel-group-direction\=vertical\]\:w-full {
-    &[data-panel-group-direction="vertical"] {
+  .aria-\[orientation\=horizontal\]\:w-full {
+    &[aria-orientation="horizontal"] {
       width: 100%;
     }
   }
-  .data-\[panel-group-direction\=vertical\]\:flex-col {
-    &[data-panel-group-direction="vertical"] {
-      flex-direction: column;
-    }
-  }
-  .data-\[panel-group-direction\=vertical\]\:after\:left-0 {
-    &[data-panel-group-direction="vertical"] {
+  .aria-\[orientation\=horizontal\]\:after\:left-0 {
+    &[aria-orientation="horizontal"] {
       &::after {
         content: var(--tw-content);
         left: calc(var(--spacing) * 0);
       }
     }
   }
-  .data-\[panel-group-direction\=vertical\]\:after\:h-1 {
-    &[data-panel-group-direction="vertical"] {
+  .aria-\[orientation\=horizontal\]\:after\:h-1 {
+    &[aria-orientation="horizontal"] {
       &::after {
         content: var(--tw-content);
         height: calc(var(--spacing) * 1);
       }
     }
   }
-  .data-\[panel-group-direction\=vertical\]\:after\:w-full {
-    &[data-panel-group-direction="vertical"] {
+  .aria-\[orientation\=horizontal\]\:after\:w-full {
+    &[aria-orientation="horizontal"] {
       &::after {
         content: var(--tw-content);
         width: 100%;
       }
     }
   }
-  .data-\[panel-group-direction\=vertical\]\:after\:translate-x-0 {
-    &[data-panel-group-direction="vertical"] {
+  .aria-\[orientation\=horizontal\]\:after\:translate-x-0 {
+    &[aria-orientation="horizontal"] {
       &::after {
         content: var(--tw-content);
         --tw-translate-x: calc(var(--spacing) * 0);
@@ -5120,8 +5090,8 @@
       }
     }
   }
-  .data-\[panel-group-direction\=vertical\]\:after\:-translate-y-1\/2 {
-    &[data-panel-group-direction="vertical"] {
+  .aria-\[orientation\=horizontal\]\:after\:-translate-y-1\/2 {
+    &[aria-orientation="horizontal"] {
       &::after {
         content: var(--tw-content);
         --tw-translate-y: calc(calc(1/2 * 100%) * -1);
@@ -5129,6 +5099,31 @@
       }
     }
   }
+  .data-\[active\=true\]\:bg-surface-overlay {
+    &[data-active="true"] {
+      background-color: var(--surface-overlay);
+    }
+  }
+  .data-\[disabled\]\:pointer-events-none {
+    &[data-disabled] {
+      pointer-events: none;
+    }
+  }
+  .data-\[disabled\]\:opacity-50 {
+    &[data-disabled] {
+      opacity: 50%;
+    }
+  }
+  .data-\[disabled\=true\]\:pointer-events-none {
+    &[data-disabled="true"] {
+      pointer-events: none;
+    }
+  }
+  .data-\[disabled\=true\]\:opacity-50 {
+    &[data-disabled="true"] {
+      opacity: 50%;
+    }
+  }
   .data-\[placeholder\]\:text-muted-foreground {
     &[data-placeholder] {
       color: var(--muted-foreground);
@@ -5179,16 +5174,6 @@
       color: var(--primary-foreground);
     }
   }
-  .data-\[resize-handle-state\=drag\]\:bg-primary {
-    &[data-resize-handle-state="drag"] {
-      background-color: var(--primary);
-    }
-  }
-  .data-\[resize-handle-state\=hover\]\:bg-primary {
-    &[data-resize-handle-state="hover"] {
-      background-color: var(--primary);
-    }
-  }
   .data-\[selected-single\=true\]\:bg-primary {
     &[data-selected-single="true"] {
       background-color: var(--primary);
@@ -5214,6 +5199,16 @@
       color: var(--accent-foreground);
     }
   }
+  .data-\[separator\=active\]\:bg-primary {
+    &[data-separator="active"] {
+      background-color: var(--primary);
+    }
+  }
+  .data-\[separator\=hover\]\:bg-primary {
+    &[data-separator="hover"] {
+      background-color: var(--primary);
+    }
+  }
   .data-\[side\=bottom\]\:translate-y-1 {
     &[data-side="bottom"] {
       --tw-translate-y: calc(var(--spacing) * 1);
@@ -6021,8 +6016,8 @@
       }
     }
   }
-  .\[\&\[data-panel-group-direction\=vertical\]\>div\]\:rotate-90 {
-    &[data-panel-group-direction=vertical]>div {
+  .\[\&\[aria-orientation\=horizontal\]\>div\]\:rotate-90 {
+    &[aria-orientation=horizontal]>div {
       rotate: 90deg;
     }
   }
@@ -7013,7 +7008,7 @@
   --border-radius-m: 4px;
   --border-radius-l: 8px;
 }
-body.light {
+body.light, .light {
   --color-background: #ffffff;
   --color-background-secondary: #f4f5f7;
   --color-background-inverse: #182027;
@@ -7136,7 +7131,7 @@ body.light {
   --border: var(--border-light);
   color-scheme: light;
 }
-body.light-hc {
+body.light-hc, .light-hc {
   --color-background: #ffffff;
   --color-background-secondary: #f4f5f7;
   --color-background-inverse: #182027;
@@ -7259,7 +7254,7 @@ body.light-hc {
   --border: var(--border-light-hc);
   color-scheme: light;
 }
-body.dark {
+body.dark, .dark {
   --color-background: #182027;
   --color-background-secondary: #273139;
   --color-background-inverse: #f8f9fa;
@@ -7382,7 +7377,7 @@ body.dark {
   --border: var(--border-dark);
   color-scheme: dark;
 }
-body.dark-hc {
+body.dark-hc, .dark-hc {
   --color-background: #182027;
   --color-background-secondary: #273139;
   --color-background-inverse: #f8f9fa;
@@ -7508,7 +7503,7 @@ body.dark-hc {
 :root {
   --radius: 0.75rem;
 }
-body.dark {
+body.dark, .dark {
   --surface: var(--color-background, #182027);
   --surface-raised: var(--color-background-raised, #273139);
   --surface-overlay: var(--color-background-selected, #374652);
@@ -7566,7 +7561,7 @@ body.dark {
   --input: var(--border-subtle);
   color-scheme: dark;
 }
-body.dark-hc {
+body.dark-hc, .dark-hc {
   --surface: var(--color-background, #182027);
   --surface-raised: var(--color-background-raised, #273139);
   --surface-overlay: var(--color-background-selected, #374652);
@@ -7624,7 +7619,7 @@ body.dark-hc {
   --input: var(--border-subtle);
   color-scheme: dark;
 }
-body.light {
+body.light, .light {
   --surface: var(--color-background, #ffffff);
   --surface-raised: var(--color-background-raised, #ffffff);
   --surface-overlay: var(--color-background-secondary, #f4f5f7);
@@ -7682,7 +7677,7 @@ body.light {
   --input: var(--border-subtle);
   color-scheme: light;
 }
-body.light-hc {
+body.light-hc, .light-hc {
   --surface: var(--color-background, #ffffff);
   --surface-raised: var(--color-background-raised, #ffffff);
   --surface-overlay: var(--color-background-secondary, #f4f5f7);
@@ -7740,7 +7735,7 @@ body.light-hc {
   --input: var(--border-subtle);
   color-scheme: light;
 }
-.future-dark {
+body.future-dark, .future-dark {
   --surface: var(--color-zinc-950);
   --surface-raised: var(--color-zinc-900);
   --surface-overlay: var(--color-zinc-800);
@@ -7795,7 +7790,7 @@ body.light-hc {
   --border-de-emp: var(--border-subtle);
   --input: var(--ap-wind-border);
 }
-.future-light {
+body.future-light, .future-light {
   --surface: var(--color-zinc-50);
   --surface-raised: var(--color-zinc-100);
   --surface-overlay: var(--color-zinc-200);
@@ -7850,7 +7845,7 @@ body.light-hc {
   --border-de-emp: var(--border-subtle);
   --input: var(--ap-wind-border);
 }
-.wireframe {
+body.wireframe, .wireframe {
   --surface: #ffffff;
   --surface-raised: #f9fafb;
   --surface-overlay: #f3f4f6;
@@ -7899,11 +7894,11 @@ body.light-hc {
   --border-de-emp: var(--border-subtle);
   --input: var(--ap-wind-border);
 }
-.wireframe *, .wireframe *::before, .wireframe *::after {
+body.wireframe *, body.wireframe *::before, body.wireframe *::after, .wireframe *, .wireframe *::before, .wireframe *::after {
   border-style: dashed !important;
   box-shadow: none !important;
 }
-.vertex {
+body.vertex, .vertex {
   --surface: oklch(0.21 0.03 258.5);
   --surface-raised: oklch(0.233 0.036 254.7);
   --surface-overlay: oklch(0.2648 0.0329 254.38);
@@ -7952,7 +7947,7 @@ body.light-hc {
   --border-de-emp: var(--border-subtle);
   --input: var(--ap-wind-border);
 }
-.canvas {
+body.canvas, .canvas {
   --surface: #182027;
   --surface-raised: #273139;
   --surface-overlay: #334049;

package/dist/tailwind.css

@@ -23,7 +23,7 @@
   * Each theme uses semantic tokens from apollo-core with hardcoded fallbacks
   */
 
-body.dark {
+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 {
+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 {
+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 {
+body.light-hc, .light-hc {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: var(--color-background, #ffffff);
   --surface-raised: var(--color-background-raised, #ffffff);
@@ -335,7 +335,7 @@ body.light-hc {
  * FUTURE — Dark theme (default for Future templates)
  * ============================================================================ */
 
-.future-dark {
+body.future-dark, .future-dark {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: var(--color-zinc-950);
   /* page / canvas */
@@ -447,7 +447,7 @@ body.light-hc {
  * FUTURE — Light theme
  * ============================================================================ */
 
-.future-light {
+body.future-light, .future-light {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: var(--color-zinc-50);
   /* page / canvas */
@@ -563,7 +563,7 @@ body.light-hc {
  * a quick sketch or blueprint so stakeholders focus on layout, not polish.
  * ============================================================================ */
 
-.wireframe {
+body.wireframe, .wireframe {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: #ffffff;
   --surface-raised: #f9fafb;
@@ -627,6 +627,9 @@ body.light-hc {
 }
 
 /* Wireframe overrides: dashed borders everywhere, reduced rounding */
+body.wireframe *,
+body.wireframe *::before,
+body.wireframe *::after,
 .wireframe *,
 .wireframe *::before,
 .wireframe *::after {
@@ -642,7 +645,7 @@ body.light-hc {
  * Source: apps/apollo-vertex/app/themes.ts  (default.config.dark)
  * ============================================================================ */
 
-.vertex {
+body.vertex, .vertex {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: oklch(0.21 0.03 258.5);
   /* deep blue-grey — page / canvas */
@@ -737,7 +740,7 @@ body.light-hc {
  * Source: packages/apollo-core/src/tokens/jss/palette.ts  (darkPalette)
  * ============================================================================ */
 
-.canvas {
+body.canvas, .canvas {
   /* ── Surfaces ─────────────────────────────────────────────────────────── */
   --surface: #182027;
   /* ColorBackgroundDark — page / canvas */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-wind",
-  "version": "0.15.2",
+  "version": "1.0.0",
   "description": "UiPath wind design system - A Tailwind CSS based React component library",
   "type": "module",
   "main": "./dist/index.js",
@@ -103,7 +103,7 @@
     "react-day-picker": "^9.13.0",
     "react-hook-form": "^7.66.1",
     "react-live": "^4.1.8",
-    "react-resizable-panels": "^3.0.6",
+    "react-resizable-panels": "^4.7.3",
     "react-syntax-highlighter": "^16.1.0",
     "recharts": "2.15.4",
     "sonner": "^2.0.7",
@@ -111,7 +111,7 @@
     "tailwindcss": "^4.1.17",
     "vaul": "^1.1.2",
     "zod": "^4.3.5",
-    "@uipath/apollo-core": "5.7.2"
+    "@uipath/apollo-core": "5.7.3"
   },
   "devDependencies": {
     "@rsbuild/plugin-react": "^1.4.1",