From a5037ce63dfb8398c989cb32820a72ec16ad7671 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Thu, 8 Jan 2026 12:56:54 +0000 Subject: [PATCH 1/4] Update dependency react-resizable-panels to v4 --- package-lock.json | 14 +++++++------- package.json | 4 ++-- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/package-lock.json b/package-lock.json index e4c2ed06..0ed28ab8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -62,7 +62,7 @@ "playwright": "1.57.0", "react": "^19.2.3", "react-dom": "^19.2.3", - "react-resizable-panels": "^3.0.6", + "react-resizable-panels": "^4.3.1", "react-zoom-pan-pinch": "^3.7.0", "rimraf": "^6.1.2", "sass": "^1.94.2", @@ -98,7 +98,7 @@ "overlap-area": "^1.1.0", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0", - "react-resizable-panels": "^3.0.3", + "react-resizable-panels": "^3.0.3 || ^4.0.0", "react-zoom-pan-pinch": "^3.6.1", "sonner": "^2.0.7" } @@ -14371,14 +14371,14 @@ } }, "node_modules/react-resizable-panels": { - "version": "3.0.6", - "resolved": "https://registry.npmjs.org/react-resizable-panels/-/react-resizable-panels-3.0.6.tgz", - "integrity": "sha512-b3qKHQ3MLqOgSS+FRYKapNkJZf5EQzuf6+RLiq1/IlTHw99YrZ2NJZLk4hQIzTnnIkRg2LUqyVinu6YWWpUYew==", + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/react-resizable-panels/-/react-resizable-panels-4.3.1.tgz", + "integrity": "sha512-Y+kWgV80snvOvSmWf5ivndOaaxRjaEz/b1snYJaPASqnFzYdfRd6eAXwPPKWtOm/96DNeDGdFssYR8pA8U/zRg==", "dev": true, "license": "MIT", "peerDependencies": { - "react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc", - "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" } }, "node_modules/react-style-singleton": { diff --git a/package.json b/package.json index bdbc706d..5f242903 100644 --- a/package.json +++ b/package.json @@ -67,7 +67,7 @@ "playwright": "1.57.0", "react": "^19.2.3", "react-dom": "^19.2.3", - "react-resizable-panels": "^3.0.6", + "react-resizable-panels": "^4.3.1", "react-zoom-pan-pinch": "^3.7.0", "rimraf": "^6.1.2", "sass": "^1.94.2", @@ -112,7 +112,7 @@ "overlap-area": "^1.1.0", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0", - "react-resizable-panels": "^3.0.3", + "react-resizable-panels": "^3.0.3 || ^4.0.0", "react-zoom-pan-pinch": "^3.6.1", "sonner": "^2.0.7" }, From 68471a7faaa5ea51f842f49a0f72e81a8ebe0153 Mon Sep 17 00:00:00 2001 From: nicosammito Date: Thu, 8 Jan 2026 19:45:36 +0100 Subject: [PATCH 2/4] feat: update DResizablePanelGroup to use orientation prop and adjust default sizes for improved layout --- src/components/d-resizable/DResizable.stories.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/d-resizable/DResizable.stories.tsx b/src/components/d-resizable/DResizable.stories.tsx index f0a70d9b..ad5ae90f 100644 --- a/src/components/d-resizable/DResizable.stories.tsx +++ b/src/components/d-resizable/DResizable.stories.tsx @@ -135,12 +135,12 @@ export const Dashboard = () => { - - + + - + }> - - + + {show && ( <> - + From dc5a994b563a66c64783f00d84859f7eb7ab8ea4 Mon Sep 17 00:00:00 2001 From: nicosammito Date: Thu, 8 Jan 2026 19:45:41 +0100 Subject: [PATCH 3/4] feat: update DResizable styles to use aria-orientation for improved accessibility and layout --- src/components/d-resizable/DResizable.style.scss | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/components/d-resizable/DResizable.style.scss b/src/components/d-resizable/DResizable.style.scss index 061a83de..2f96d8e1 100644 --- a/src/components/d-resizable/DResizable.style.scss +++ b/src/components/d-resizable/DResizable.style.scss @@ -27,15 +27,16 @@ display: flex; align-items: center; justify-content: center; + background: helpers.borderColor(); + outline: none; - &[data-panel-group-direction=horizontal] { + &[aria-orientation=vertical] { width: 1px; height: 100%; - background: helpers.borderColor(); } - &[data-panel-group-direction=vertical] { - height: 1rem; + &[aria-orientation=horizontal] { + height: 1px; width: 100%; } } From 8af7eb2da9cc2b9152200e5ce0e0358700ee97b4 Mon Sep 17 00:00:00 2001 From: nicosammito Date: Thu, 8 Jan 2026 19:45:45 +0100 Subject: [PATCH 4/4] feat: refactor DResizable component to use Group and Separator for improved structure and consistency --- src/components/d-resizable/DResizable.tsx | 24 ++++++++--------------- 1 file changed, 8 insertions(+), 16 deletions(-) diff --git a/src/components/d-resizable/DResizable.tsx b/src/components/d-resizable/DResizable.tsx index 9ea57bbe..4cdb8d70 100644 --- a/src/components/d-resizable/DResizable.tsx +++ b/src/components/d-resizable/DResizable.tsx @@ -1,25 +1,17 @@ "use client" import * as React from "react" -import {Code0ComponentProps} from "../../utils/types"; -import {mergeCode0Props} from "../../utils/utils"; -import { - Panel, - PanelGroup, - PanelGroupProps, - PanelProps, - PanelResizeHandle, - PanelResizeHandleProps -} from "react-resizable-panels"; +import {Code0ComponentProps} from "../../utils"; +import {mergeCode0Props} from "../../utils"; +import {Group, GroupProps, Panel, PanelProps, Separator, SeparatorProps} from "react-resizable-panels"; import "./DResizable.style.scss" -import {IconFolder, IconGripVertical} from "@tabler/icons-react"; -type DResizablePanelGroupProps = Code0ComponentProps & PanelGroupProps +type DResizablePanelGroupProps = Code0ComponentProps & GroupProps type DResizablePanelProps = Code0ComponentProps & PanelProps -type DResizableHandleProps = Code0ComponentProps & PanelResizeHandleProps +type DResizableHandleProps = Code0ComponentProps & SeparatorProps export const DResizablePanelGroup: React.FC = (props) => { - return @@ -31,11 +23,11 @@ export const DResizablePanel: React.FC = (props) => { } export const DResizableHandle: React.FC = (props) => { - return
- + }