From 16d159b7e640047e915b71ba325ed9d9ef8c776f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Fri, 20 Aug 2021 19:30:59 +0200 Subject: [PATCH 1/2] Add re-resizable MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- package-lock.json | 31 +++++++++++++++++++++++++++++++ package.json | 1 + 2 files changed, 32 insertions(+) diff --git a/package-lock.json b/package-lock.json index 128bf6a..3537bde 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,6 +13,7 @@ "events": "^3.3.0", "lodash-move": "^1.1.1", "matrix-js-sdk": "^12.0.1", + "re-resizable": "^6.9.0", "react": "^17.0.0", "react-dom": "^17.0.0", "react-router-dom": "^5.2.0", @@ -1021,6 +1022,11 @@ "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==" }, + "node_modules/fast-memoize": { + "version": "2.5.2", + "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.5.2.tgz", + "integrity": "sha512-Ue0LwpDYErFbmNnZSF0UH6eImUwDmogUO1jyE+JbN2gsQz/jICm1Ve7t9QT0rNSsfJt+Hs4/S3GnsDVjL4HVrw==" + }, "node_modules/forever-agent": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz", @@ -1570,6 +1576,18 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/re-resizable": { + "version": "6.9.0", + "resolved": "https://registry.npmjs.org/re-resizable/-/re-resizable-6.9.0.tgz", + "integrity": "sha512-3cUDG81ylyqI0Pdgle/RHwwRYq0ORZzsUaySOCO8IbEtNyaRtrIHYm/jMQ5pjcNiKCxR3vsSymIQZHwJq4gg2Q==", + "dependencies": { + "fast-memoize": "^2.5.1" + }, + "peerDependencies": { + "react": "^16.13.1 || ^17.0.0", + "react-dom": "^16.13.1 || ^17.0.0" + } + }, "node_modules/react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", @@ -2688,6 +2706,11 @@ "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==" }, + "fast-memoize": { + "version": "2.5.2", + "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.5.2.tgz", + "integrity": "sha512-Ue0LwpDYErFbmNnZSF0UH6eImUwDmogUO1jyE+JbN2gsQz/jICm1Ve7t9QT0rNSsfJt+Hs4/S3GnsDVjL4HVrw==" + }, "forever-agent": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz", @@ -3096,6 +3119,14 @@ "side-channel": "^1.0.4" } }, + "re-resizable": { + "version": "6.9.0", + "resolved": "https://registry.npmjs.org/re-resizable/-/re-resizable-6.9.0.tgz", + "integrity": "sha512-3cUDG81ylyqI0Pdgle/RHwwRYq0ORZzsUaySOCO8IbEtNyaRtrIHYm/jMQ5pjcNiKCxR3vsSymIQZHwJq4gg2Q==", + "requires": { + "fast-memoize": "^2.5.1" + } + }, "react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", diff --git a/package.json b/package.json index 6a81d08..72758fd 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "events": "^3.3.0", "lodash-move": "^1.1.1", "matrix-js-sdk": "^12.0.1", + "re-resizable": "^6.9.0", "react": "^17.0.0", "react-dom": "^17.0.0", "react-router-dom": "^5.2.0", From d73e2ab002e14e715c0704f924d52acbe6cb3f7b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Fri, 20 Aug 2021 19:22:29 +0200 Subject: [PATCH 2/2] Make devtools resizable MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/DevTools.jsx | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/src/DevTools.jsx b/src/DevTools.jsx index 633201c..b016cdc 100644 --- a/src/DevTools.jsx +++ b/src/DevTools.jsx @@ -18,6 +18,7 @@ import React, { useCallback, useEffect, useRef, useState } from "react"; import ColorHash from "color-hash"; import classNames from "classnames"; import styles from "./DevTools.module.css"; +import { Resizable } from "re-resizable"; const colorHash = new ColorHash({ lightness: 0.8 }); @@ -77,7 +78,19 @@ export function DevTools({ manager }) { } return ( -
+
setSelectedEvent(null)} /> )} -
+ ); }