From 7de41a1fddcb496c1c9907bdf4ce7b3b41f75e00 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 6 Jan 2025 15:36:07 +0200 Subject: [PATCH 001/190] update: removes old deps and installs new ones --- app/package-lock.json | 2033 ++++++++++++++++++++--------------------- app/package.json | 4 +- 2 files changed, 1011 insertions(+), 1026 deletions(-) diff --git a/app/package-lock.json b/app/package-lock.json index 946a6403c..9e1b446b5 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -11,7 +11,8 @@ "@ai-sdk/openai": "^1.0.8", "@chakra-ui/icons": "^2.1.0", "@chakra-ui/next-js": "^2.2.0", - "@chakra-ui/react": "^2.8.2", + "@chakra-ui/react": "^3.2.5", + "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", "@next/env": "^14.2.5", "@nivo/bar": "^0.88.0", @@ -51,7 +52,6 @@ "exceljs": "^4.4.0", "fetch-blob": "^4.0.0", "fetch-mock": "^11.1.5", - "framer-motion": "^11.11.17", "geojson": "^0.5.0", "http-errors": "^2.0.0", "i18next": "^23.13.0", @@ -374,6 +374,67 @@ "node": ">=6.0.0" } }, + "node_modules/@ark-ui/react": { + "version": "4.6.0", + "resolved": "https://registry.npmjs.org/@ark-ui/react/-/react-4.6.0.tgz", + "integrity": "sha512-tOr0SdMwn1GrM5DzUC+ATLcGlvVVoan3g1rgYBZV/06LEKfs12+m0zbvJz9IpiOiy0dzBXvDQRgGsIlzL/6blg==", + "dependencies": { + "@internationalized/date": "3.6.0", + "@zag-js/accordion": "0.79.1", + "@zag-js/anatomy": "0.79.1", + "@zag-js/auto-resize": "0.79.1", + "@zag-js/avatar": "0.79.1", + "@zag-js/carousel": "0.79.1", + "@zag-js/checkbox": "0.79.1", + "@zag-js/clipboard": "0.79.1", + "@zag-js/collapsible": "0.79.1", + "@zag-js/collection": "0.79.1", + "@zag-js/color-picker": "0.79.1", + "@zag-js/color-utils": "0.79.1", + "@zag-js/combobox": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/date-picker": "0.79.1", + "@zag-js/date-utils": "0.79.1", + "@zag-js/dialog": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/editable": "0.79.1", + "@zag-js/file-upload": "0.79.1", + "@zag-js/file-utils": "0.79.1", + "@zag-js/highlight-word": "0.79.1", + "@zag-js/hover-card": "0.79.1", + "@zag-js/i18n-utils": "0.79.1", + "@zag-js/menu": "0.79.1", + "@zag-js/number-input": "0.79.1", + "@zag-js/pagination": "0.79.1", + "@zag-js/pin-input": "0.79.1", + "@zag-js/popover": "0.79.1", + "@zag-js/presence": "0.79.1", + "@zag-js/progress": "0.79.1", + "@zag-js/qr-code": "0.79.1", + "@zag-js/radio-group": "0.79.1", + "@zag-js/rating-group": "0.79.1", + "@zag-js/react": "0.79.1", + "@zag-js/select": "0.79.1", + "@zag-js/signature-pad": "0.79.1", + "@zag-js/slider": "0.79.1", + "@zag-js/splitter": "0.79.1", + "@zag-js/steps": "0.79.1", + "@zag-js/switch": "0.79.1", + "@zag-js/tabs": "0.79.1", + "@zag-js/tags-input": "0.79.1", + "@zag-js/time-picker": "0.79.1", + "@zag-js/timer": "0.79.1", + "@zag-js/toast": "0.79.1", + "@zag-js/toggle-group": "0.79.1", + "@zag-js/tooltip": "0.79.1", + "@zag-js/tree-view": "0.79.1", + "@zag-js/types": "0.79.1" + }, + "peerDependencies": { + "react": ">=18.0.0", + "react-dom": ">=18.0.0" + } + }, "node_modules/@babel/code-frame": { "version": "7.24.6", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.6.tgz", @@ -2407,135 +2468,26 @@ "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz", "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==" }, - "node_modules/@chakra-ui/accordion": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/accordion/-/accordion-2.3.1.tgz", - "integrity": "sha512-FSXRm8iClFyU+gVaXisOSEw0/4Q+qZbFRiuhIAkVU6Boj0FxAMrlo9a8AV5TuF77rgaHytCdHk0Ng+cyUijrag==", - "dependencies": { - "@chakra-ui/descendant": "3.1.0", - "@chakra-ui/icon": "3.2.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-use-controllable-state": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5", - "@chakra-ui/transition": "2.1.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "framer-motion": ">=4.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/alert": { - "version": "2.2.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/alert/-/alert-2.2.2.tgz", - "integrity": "sha512-jHg4LYMRNOJH830ViLuicjb3F+v6iriE/2G5T+Sd0Hna04nukNJ1MxUmBPE+vI22me2dIflfelu2v9wdB6Pojw==", - "dependencies": { - "@chakra-ui/icon": "3.2.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5", - "@chakra-ui/spinner": "2.1.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/anatomy": { "version": "2.2.2", "resolved": "https://registry.npmjs.org/@chakra-ui/anatomy/-/anatomy-2.2.2.tgz", - "integrity": "sha512-MV6D4VLRIHr4PkW4zMyqfrNS1mPlCTiCXwvYGtDFQYr+xHFfonhAuf9WjsSc0nyp2m0OdkSLnzmVKkZFLo25Tg==" - }, - "node_modules/@chakra-ui/avatar": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/avatar/-/avatar-2.3.0.tgz", - "integrity": "sha512-8gKSyLfygnaotbJbDMHDiJoF38OHXUYVme4gGxZ1fLnQEdPVEaIWfH+NndIjOM0z8S+YEFnT9KyGMUtvPrBk3g==", - "dependencies": { - "@chakra-ui/image": "2.1.0", - "@chakra-ui/react-children-utils": "2.0.6", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/breadcrumb": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/breadcrumb/-/breadcrumb-2.2.0.tgz", - "integrity": "sha512-4cWCG24flYBxjruRi4RJREWTGF74L/KzI2CognAW/d/zWR0CjiScuJhf37Am3LFbCySP6WSoyBOtTIoTA4yLEA==", - "dependencies": { - "@chakra-ui/react-children-utils": "2.0.6", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } + "integrity": "sha512-MV6D4VLRIHr4PkW4zMyqfrNS1mPlCTiCXwvYGtDFQYr+xHFfonhAuf9WjsSc0nyp2m0OdkSLnzmVKkZFLo25Tg==", + "peer": true }, "node_modules/@chakra-ui/breakpoint-utils": { "version": "2.0.8", "resolved": "https://registry.npmjs.org/@chakra-ui/breakpoint-utils/-/breakpoint-utils-2.0.8.tgz", "integrity": "sha512-Pq32MlEX9fwb5j5xx8s18zJMARNHlQZH2VH1RZgfgRDpp7DcEgtRW5AInfN5CfqdHLO1dGxA7I3MqEuL5JnIsA==", + "peer": true, "dependencies": { "@chakra-ui/shared-utils": "2.0.5" } }, - "node_modules/@chakra-ui/button": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/button/-/button-2.1.0.tgz", - "integrity": "sha512-95CplwlRKmmUXkdEp/21VkEWgnwcx2TOBG6NfYlsuLBDHSLlo5FKIiE2oSi4zXc4TLcopGcWPNcm/NDaSC5pvA==", - "dependencies": { - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5", - "@chakra-ui/spinner": "2.1.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/card": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/card/-/card-2.2.0.tgz", - "integrity": "sha512-xUB/k5MURj4CtPAhdSoXZidUbm8j3hci9vnc+eZJVDqhDOShNlD6QeniQNRPRys4lWAQLCbFcrwL29C8naDi6g==", - "dependencies": { - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/checkbox": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/checkbox/-/checkbox-2.3.2.tgz", - "integrity": "sha512-85g38JIXMEv6M+AcyIGLh7igNtfpAN6KGQFYxY9tBj0eWvWk4NKQxvqqyVta0bSAyIl1rixNIIezNpNWk2iO4g==", - "dependencies": { - "@chakra-ui/form-control": "2.2.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-callback-ref": "2.1.0", - "@chakra-ui/react-use-controllable-state": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/react-use-safe-layout-effect": "2.1.0", - "@chakra-ui/react-use-update-effect": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5", - "@chakra-ui/visually-hidden": "2.2.0", - "@zag-js/focus-visible": "0.16.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/clickable": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/clickable/-/clickable-2.1.0.tgz", "integrity": "sha512-flRA/ClPUGPYabu+/GLREZVZr9j2uyyazCAUHAdrTUEdDYCr31SVGhgh7dgKdtq23bOvAQJpIJjw/0Bs0WvbXw==", + "peer": true, "dependencies": { "@chakra-ui/react-use-merge-refs": "2.1.0", "@chakra-ui/shared-utils": "2.0.5" @@ -2544,22 +2496,11 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/close-button": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/close-button/-/close-button-2.1.1.tgz", - "integrity": "sha512-gnpENKOanKexswSVpVz7ojZEALl2x5qjLYNqSQGbxz+aP9sOXPfUS56ebyBrre7T7exuWGiFeRwnM0oVeGPaiw==", - "dependencies": { - "@chakra-ui/icon": "3.2.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/color-mode": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/@chakra-ui/color-mode/-/color-mode-2.2.0.tgz", "integrity": "sha512-niTEA8PALtMWRI9wJ4LL0CSBDo8NBfLNp4GD6/0hstcm3IlbBHTVKxN6HwSaoNYfphDQLxCjT4yG+0BJA5tFpg==", + "peer": true, "dependencies": { "@chakra-ui/react-use-safe-layout-effect": "2.1.0" }, @@ -2567,41 +2508,11 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/control-box": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/control-box/-/control-box-2.1.0.tgz", - "integrity": "sha512-gVrRDyXFdMd8E7rulL0SKeoljkLQiPITFnsyMO8EFHNZ+AHt5wK4LIguYVEq88APqAGZGfHFWXr79RYrNiE3Mg==", - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/counter": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/counter/-/counter-2.1.0.tgz", - "integrity": "sha512-s6hZAEcWT5zzjNz2JIWUBzRubo9la/oof1W7EKZVVfPYHERnl5e16FmBC79Yfq8p09LQ+aqFKm/etYoJMMgghw==", - "dependencies": { - "@chakra-ui/number-utils": "2.0.7", - "@chakra-ui/react-use-callback-ref": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "react": ">=18" - } - }, - "node_modules/@chakra-ui/css-reset": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/css-reset/-/css-reset-2.3.0.tgz", - "integrity": "sha512-cQwwBy5O0jzvl0K7PLTLgp8ijqLPKyuEMiDXwYzl95seD3AoeuoCLyzZcJtVqaUZ573PiBdAbY/IlZcwDOItWg==", - "peerDependencies": { - "@emotion/react": ">=10.0.35", - "react": ">=18" - } - }, "node_modules/@chakra-ui/descendant": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/descendant/-/descendant-3.1.0.tgz", "integrity": "sha512-VxCIAir08g5w27klLyi7PVo8BxhW4tgU/lxQyujkmi4zx7hT9ZdrcQLAted/dAa+aSIZ14S1oV0Q9lGjsAdxUQ==", + "peer": true, "dependencies": { "@chakra-ui/react-context": "2.1.0", "@chakra-ui/react-use-merge-refs": "2.1.0" @@ -2613,49 +2524,14 @@ "node_modules/@chakra-ui/dom-utils": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/dom-utils/-/dom-utils-2.1.0.tgz", - "integrity": "sha512-ZmF2qRa1QZ0CMLU8M1zCfmw29DmPNtfjR9iTo74U5FPr3i1aoAh7fbJ4qAlZ197Xw9eAW28tvzQuoVWeL5C7fQ==" - }, - "node_modules/@chakra-ui/editable": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/editable/-/editable-3.1.0.tgz", - "integrity": "sha512-j2JLrUL9wgg4YA6jLlbU88370eCRyor7DZQD9lzpY95tSOXpTljeg3uF9eOmDnCs6fxp3zDWIfkgMm/ExhcGTg==", - "dependencies": { - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-callback-ref": "2.1.0", - "@chakra-ui/react-use-controllable-state": "2.1.0", - "@chakra-ui/react-use-focus-on-pointer-down": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/react-use-safe-layout-effect": "2.1.0", - "@chakra-ui/react-use-update-effect": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/event-utils": { - "version": "2.0.8", - "resolved": "https://registry.npmjs.org/@chakra-ui/event-utils/-/event-utils-2.0.8.tgz", - "integrity": "sha512-IGM/yGUHS+8TOQrZGpAKOJl/xGBrmRYJrmbHfUE7zrG3PpQyXvbLDP1M+RggkCFVgHlJi2wpYIf0QtQlU0XZfw==" - }, - "node_modules/@chakra-ui/focus-lock": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/focus-lock/-/focus-lock-2.1.0.tgz", - "integrity": "sha512-EmGx4PhWGjm4dpjRqM4Aa+rCWBxP+Rq8Uc/nAVnD4YVqkEhBkrPTpui2lnjsuxqNaZ24fIAZ10cF1hlpemte/w==", - "dependencies": { - "@chakra-ui/dom-utils": "2.1.0", - "react-focus-lock": "^2.9.4" - }, - "peerDependencies": { - "react": ">=18" - } + "integrity": "sha512-ZmF2qRa1QZ0CMLU8M1zCfmw29DmPNtfjR9iTo74U5FPr3i1aoAh7fbJ4qAlZ197Xw9eAW28tvzQuoVWeL5C7fQ==", + "peer": true }, "node_modules/@chakra-ui/form-control": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/@chakra-ui/form-control/-/form-control-2.2.0.tgz", "integrity": "sha512-wehLC1t4fafCVJ2RvJQT2jyqsAwX7KymmiGqBu7nQoQz8ApTkGABWpo/QwDh3F/dBLrouHDoOvGmYTqft3Mirw==", + "peer": true, "dependencies": { "@chakra-ui/icon": "3.2.0", "@chakra-ui/react-context": "2.1.0", @@ -2668,20 +2544,6 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/hooks": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/hooks/-/hooks-2.2.1.tgz", - "integrity": "sha512-RQbTnzl6b1tBjbDPf9zGRo9rf/pQMholsOudTxjy4i9GfTfz6kgp5ValGjQm2z7ng6Z31N1cnjZ1AlSzQ//ZfQ==", - "dependencies": { - "@chakra-ui/react-utils": "2.0.12", - "@chakra-ui/utils": "2.0.15", - "compute-scroll-into-view": "3.0.3", - "copy-to-clipboard": "3.3.3" - }, - "peerDependencies": { - "react": ">=18" - } - }, "node_modules/@chakra-ui/icon": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/@chakra-ui/icon/-/icon-3.2.0.tgz", @@ -2706,39 +2568,11 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/image": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/image/-/image-2.1.0.tgz", - "integrity": "sha512-bskumBYKLiLMySIWDGcz0+D9Th0jPvmX6xnRMs4o92tT3Od/bW26lahmV2a2Op2ItXeCmRMY+XxJH5Gy1i46VA==", - "dependencies": { - "@chakra-ui/react-use-safe-layout-effect": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/input": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/input/-/input-2.1.2.tgz", - "integrity": "sha512-GiBbb3EqAA8Ph43yGa6Mc+kUPjh4Spmxp1Pkelr8qtudpc3p2PJOOebLpd90mcqw8UePPa+l6YhhPtp6o0irhw==", - "dependencies": { - "@chakra-ui/form-control": "2.2.0", - "@chakra-ui/object-utils": "2.1.0", - "@chakra-ui/react-children-utils": "2.0.6", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/layout": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/@chakra-ui/layout/-/layout-2.3.1.tgz", "integrity": "sha512-nXuZ6WRbq0WdgnRgLw+QuxWAHuhDtVX8ElWqcTK+cSMFg/52eVP47czYBE5F35YhnoW2XBwfNoNgZ7+e8Z01Rg==", + "peer": true, "dependencies": { "@chakra-ui/breakpoint-utils": "2.0.8", "@chakra-ui/icon": "3.2.0", @@ -2755,20 +2589,14 @@ "node_modules/@chakra-ui/lazy-utils": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/@chakra-ui/lazy-utils/-/lazy-utils-2.0.5.tgz", - "integrity": "sha512-UULqw7FBvcckQk2n3iPO56TMJvDsNv0FKZI6PlUNJVaGsPbsYxK/8IQ60vZgaTVPtVcjY6BE+y6zg8u9HOqpyg==" - }, - "node_modules/@chakra-ui/live-region": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/live-region/-/live-region-2.1.0.tgz", - "integrity": "sha512-ZOxFXwtaLIsXjqnszYYrVuswBhnIHHP+XIgK1vC6DePKtyK590Wg+0J0slDwThUAd4MSSIUa/nNX84x1GMphWw==", - "peerDependencies": { - "react": ">=18" - } + "integrity": "sha512-UULqw7FBvcckQk2n3iPO56TMJvDsNv0FKZI6PlUNJVaGsPbsYxK/8IQ60vZgaTVPtVcjY6BE+y6zg8u9HOqpyg==", + "peer": true }, "node_modules/@chakra-ui/media-query": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/@chakra-ui/media-query/-/media-query-3.3.0.tgz", "integrity": "sha512-IsTGgFLoICVoPRp9ykOgqmdMotJG0CnPsKvGQeSFOB/dZfIujdVb14TYxDU4+MURXry1MhJ7LzZhv+Ml7cr8/g==", + "peer": true, "dependencies": { "@chakra-ui/breakpoint-utils": "2.0.8", "@chakra-ui/react-env": "3.1.0", @@ -2783,6 +2611,7 @@ "version": "2.2.1", "resolved": "https://registry.npmjs.org/@chakra-ui/menu/-/menu-2.2.1.tgz", "integrity": "sha512-lJS7XEObzJxsOwWQh7yfG4H8FzFPRP5hVPN/CL+JzytEINCSBvsCDHrYPQGp7jzpCi8vnTqQQGQe0f8dwnXd2g==", + "peer": true, "dependencies": { "@chakra-ui/clickable": "2.1.0", "@chakra-ui/descendant": "3.1.0", @@ -2806,29 +2635,6 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/modal": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/modal/-/modal-2.3.1.tgz", - "integrity": "sha512-TQv1ZaiJMZN+rR9DK0snx/OPwmtaGH1HbZtlYt4W4s6CzyK541fxLRTjIXfEzIGpvNW+b6VFuFjbcR78p4DEoQ==", - "dependencies": { - "@chakra-ui/close-button": "2.1.1", - "@chakra-ui/focus-lock": "2.1.0", - "@chakra-ui/portal": "2.1.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5", - "@chakra-ui/transition": "2.1.0", - "aria-hidden": "^1.2.3", - "react-remove-scroll": "^2.5.6" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "framer-motion": ">=4.0.0", - "react": ">=18", - "react-dom": ">=18" - } - }, "node_modules/@chakra-ui/next-js": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/@chakra-ui/next-js/-/next-js-2.2.0.tgz", @@ -2843,83 +2649,17 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/number-input": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/number-input/-/number-input-2.1.2.tgz", - "integrity": "sha512-pfOdX02sqUN0qC2ysuvgVDiws7xZ20XDIlcNhva55Jgm095xjm8eVdIBfNm3SFbSUNxyXvLTW/YQanX74tKmuA==", - "dependencies": { - "@chakra-ui/counter": "2.1.0", - "@chakra-ui/form-control": "2.2.0", - "@chakra-ui/icon": "3.2.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-callback-ref": "2.1.0", - "@chakra-ui/react-use-event-listener": "2.1.0", - "@chakra-ui/react-use-interval": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/react-use-safe-layout-effect": "2.1.0", - "@chakra-ui/react-use-update-effect": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/number-utils": { - "version": "2.0.7", - "resolved": "https://registry.npmjs.org/@chakra-ui/number-utils/-/number-utils-2.0.7.tgz", - "integrity": "sha512-yOGxBjXNvLTBvQyhMDqGU0Oj26s91mbAlqKHiuw737AXHt0aPllOthVUqQMeaYLwLCjGMg0jtI7JReRzyi94Dg==" - }, "node_modules/@chakra-ui/object-utils": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/object-utils/-/object-utils-2.1.0.tgz", - "integrity": "sha512-tgIZOgLHaoti5PYGPTwK3t/cqtcycW0owaiOXoZOcpwwX/vlVb+H1jFsQyWiiwQVPt9RkoSLtxzXamx+aHH+bQ==" - }, - "node_modules/@chakra-ui/pin-input": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/pin-input/-/pin-input-2.1.0.tgz", - "integrity": "sha512-x4vBqLStDxJFMt+jdAHHS8jbh294O53CPQJoL4g228P513rHylV/uPscYUHrVJXRxsHfRztQO9k45jjTYaPRMw==", - "dependencies": { - "@chakra-ui/descendant": "3.1.0", - "@chakra-ui/react-children-utils": "2.0.6", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-use-controllable-state": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/popover": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/popover/-/popover-2.2.1.tgz", - "integrity": "sha512-K+2ai2dD0ljvJnlrzesCDT9mNzLifE3noGKZ3QwLqd/K34Ym1W/0aL1ERSynrcG78NKoXS54SdEzkhCZ4Gn/Zg==", - "dependencies": { - "@chakra-ui/close-button": "2.1.1", - "@chakra-ui/lazy-utils": "2.0.5", - "@chakra-ui/popper": "3.1.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-animation-state": "2.1.0", - "@chakra-ui/react-use-disclosure": "2.1.0", - "@chakra-ui/react-use-focus-effect": "2.1.0", - "@chakra-ui/react-use-focus-on-pointer-down": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "framer-motion": ">=4.0.0", - "react": ">=18" - } + "integrity": "sha512-tgIZOgLHaoti5PYGPTwK3t/cqtcycW0owaiOXoZOcpwwX/vlVb+H1jFsQyWiiwQVPt9RkoSLtxzXamx+aHH+bQ==", + "peer": true }, "node_modules/@chakra-ui/popper": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/popper/-/popper-3.1.0.tgz", "integrity": "sha512-ciDdpdYbeFG7og6/6J8lkTFxsSvwTdMLFkpVylAF6VNC22jssiWfquj2eyD4rJnzkRFPvIWJq8hvbfhsm+AjSg==", + "peer": true, "dependencies": { "@chakra-ui/react-types": "2.0.7", "@chakra-ui/react-use-merge-refs": "2.1.0", @@ -2929,129 +2669,21 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/portal": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/portal/-/portal-2.1.0.tgz", - "integrity": "sha512-9q9KWf6SArEcIq1gGofNcFPSWEyl+MfJjEUg/un1SMlQjaROOh3zYr+6JAwvcORiX7tyHosnmWC3d3wI2aPSQg==", + "node_modules/@chakra-ui/react": { + "version": "3.2.5", + "resolved": "https://registry.npmjs.org/@chakra-ui/react/-/react-3.2.5.tgz", + "integrity": "sha512-ZoKHxHSdbnkybrem4D6TfQUCGcrLsZno/eYzK3msKPO7J6UF6ScWkDaDz2fjVn2SAE5B/lM10d71BB+5ENxiBw==", "dependencies": { - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-use-safe-layout-effect": "2.1.0" - }, - "peerDependencies": { - "react": ">=18", - "react-dom": ">=18" - } - }, - "node_modules/@chakra-ui/progress": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/progress/-/progress-2.2.0.tgz", - "integrity": "sha512-qUXuKbuhN60EzDD9mHR7B67D7p/ZqNS2Aze4Pbl1qGGZfulPW0PY8Rof32qDtttDQBkzQIzFGE8d9QpAemToIQ==", - "dependencies": { - "@chakra-ui/react-context": "2.1.0" + "@ark-ui/react": "4.6.0", + "@emotion/is-prop-valid": "1.3.1", + "@emotion/serialize": "1.3.3", + "@emotion/use-insertion-effect-with-fallbacks": "1.2.0", + "@emotion/utils": "1.4.2", + "@pandacss/is-valid-prop": "0.41.0", + "csstype": "3.1.3" }, "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/provider": { - "version": "2.4.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/provider/-/provider-2.4.2.tgz", - "integrity": "sha512-w0Tef5ZCJK1mlJorcSjItCSbyvVuqpvyWdxZiVQmE6fvSJR83wZof42ux0+sfWD+I7rHSfj+f9nzhNaEWClysw==", - "dependencies": { - "@chakra-ui/css-reset": "2.3.0", - "@chakra-ui/portal": "2.1.0", - "@chakra-ui/react-env": "3.1.0", - "@chakra-ui/system": "2.6.2", - "@chakra-ui/utils": "2.0.15" - }, - "peerDependencies": { - "@emotion/react": "^11.0.0", - "@emotion/styled": "^11.0.0", - "react": ">=18", - "react-dom": ">=18" - } - }, - "node_modules/@chakra-ui/radio": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/radio/-/radio-2.1.2.tgz", - "integrity": "sha512-n10M46wJrMGbonaghvSRnZ9ToTv/q76Szz284gv4QUWvyljQACcGrXIONUnQ3BIwbOfkRqSk7Xl/JgZtVfll+w==", - "dependencies": { - "@chakra-ui/form-control": "2.2.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5", - "@zag-js/focus-visible": "0.16.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/react": { - "version": "2.8.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/react/-/react-2.8.2.tgz", - "integrity": "sha512-Hn0moyxxyCDKuR9ywYpqgX8dvjqwu9ArwpIb9wHNYjnODETjLwazgNIliCVBRcJvysGRiV51U2/JtJVrpeCjUQ==", - "dependencies": { - "@chakra-ui/accordion": "2.3.1", - "@chakra-ui/alert": "2.2.2", - "@chakra-ui/avatar": "2.3.0", - "@chakra-ui/breadcrumb": "2.2.0", - "@chakra-ui/button": "2.1.0", - "@chakra-ui/card": "2.2.0", - "@chakra-ui/checkbox": "2.3.2", - "@chakra-ui/close-button": "2.1.1", - "@chakra-ui/control-box": "2.1.0", - "@chakra-ui/counter": "2.1.0", - "@chakra-ui/css-reset": "2.3.0", - "@chakra-ui/editable": "3.1.0", - "@chakra-ui/focus-lock": "2.1.0", - "@chakra-ui/form-control": "2.2.0", - "@chakra-ui/hooks": "2.2.1", - "@chakra-ui/icon": "3.2.0", - "@chakra-ui/image": "2.1.0", - "@chakra-ui/input": "2.1.2", - "@chakra-ui/layout": "2.3.1", - "@chakra-ui/live-region": "2.1.0", - "@chakra-ui/media-query": "3.3.0", - "@chakra-ui/menu": "2.2.1", - "@chakra-ui/modal": "2.3.1", - "@chakra-ui/number-input": "2.1.2", - "@chakra-ui/pin-input": "2.1.0", - "@chakra-ui/popover": "2.2.1", - "@chakra-ui/popper": "3.1.0", - "@chakra-ui/portal": "2.1.0", - "@chakra-ui/progress": "2.2.0", - "@chakra-ui/provider": "2.4.2", - "@chakra-ui/radio": "2.1.2", - "@chakra-ui/react-env": "3.1.0", - "@chakra-ui/select": "2.1.2", - "@chakra-ui/skeleton": "2.1.0", - "@chakra-ui/skip-nav": "2.1.0", - "@chakra-ui/slider": "2.1.0", - "@chakra-ui/spinner": "2.1.0", - "@chakra-ui/stat": "2.1.1", - "@chakra-ui/stepper": "2.3.1", - "@chakra-ui/styled-system": "2.9.2", - "@chakra-ui/switch": "2.1.2", - "@chakra-ui/system": "2.6.2", - "@chakra-ui/table": "2.1.0", - "@chakra-ui/tabs": "3.0.0", - "@chakra-ui/tag": "3.1.1", - "@chakra-ui/textarea": "2.1.2", - "@chakra-ui/theme": "3.3.1", - "@chakra-ui/theme-utils": "2.0.21", - "@chakra-ui/toast": "7.0.2", - "@chakra-ui/tooltip": "2.3.1", - "@chakra-ui/transition": "2.1.0", - "@chakra-ui/utils": "2.0.15", - "@chakra-ui/visually-hidden": "2.2.0" - }, - "peerDependencies": { - "@emotion/react": "^11.0.0", - "@emotion/styled": "^11.0.0", - "framer-motion": ">=4.0.0", + "@emotion/react": ">=11", "react": ">=18", "react-dom": ">=18" } @@ -3060,6 +2692,7 @@ "version": "2.0.6", "resolved": "https://registry.npmjs.org/@chakra-ui/react-children-utils/-/react-children-utils-2.0.6.tgz", "integrity": "sha512-QVR2RC7QsOsbWwEnq9YduhpqSFnZGvjjGREV8ygKi8ADhXh93C8azLECCUVgRJF2Wc+So1fgxmjLcbZfY2VmBA==", + "peer": true, "peerDependencies": { "react": ">=18" } @@ -3068,6 +2701,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-context/-/react-context-2.1.0.tgz", "integrity": "sha512-iahyStvzQ4AOwKwdPReLGfDesGG+vWJfEsn0X/NoGph/SkN+HXtv2sCfYFFR9k7bb+Kvc6YfpLlSuLvKMHi2+w==", + "peer": true, "peerDependencies": { "react": ">=18" } @@ -3076,6 +2710,7 @@ "version": "3.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-env/-/react-env-3.1.0.tgz", "integrity": "sha512-Vr96GV2LNBth3+IKzr/rq1IcnkXv+MLmwjQH6C8BRtn3sNskgDFD5vLkVXcEhagzZMCh8FR3V/bzZPojBOyNhw==", + "peer": true, "dependencies": { "@chakra-ui/react-use-safe-layout-effect": "2.1.0" }, @@ -3087,6 +2722,7 @@ "version": "2.0.7", "resolved": "https://registry.npmjs.org/@chakra-ui/react-types/-/react-types-2.0.7.tgz", "integrity": "sha512-12zv2qIZ8EHwiytggtGvo4iLT0APris7T0qaAWqzpUGS0cdUtR8W+V1BJ5Ocq+7tA6dzQ/7+w5hmXih61TuhWQ==", + "peer": true, "peerDependencies": { "react": ">=18" } @@ -3095,6 +2731,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-animation-state/-/react-use-animation-state-2.1.0.tgz", "integrity": "sha512-CFZkQU3gmDBwhqy0vC1ryf90BVHxVN8cTLpSyCpdmExUEtSEInSCGMydj2fvn7QXsz/za8JNdO2xxgJwxpLMtg==", + "peer": true, "dependencies": { "@chakra-ui/dom-utils": "2.1.0", "@chakra-ui/react-use-event-listener": "2.1.0" @@ -3107,6 +2744,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-callback-ref/-/react-use-callback-ref-2.1.0.tgz", "integrity": "sha512-efnJrBtGDa4YaxDzDE90EnKD3Vkh5a1t3w7PhnRQmsphLy3g2UieasoKTlT2Hn118TwDjIv5ZjHJW6HbzXA9wQ==", + "peer": true, "peerDependencies": { "react": ">=18" } @@ -3115,6 +2753,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-controllable-state/-/react-use-controllable-state-2.1.0.tgz", "integrity": "sha512-QR/8fKNokxZUs4PfxjXuwl0fj/d71WPrmLJvEpCTkHjnzu7LnYvzoe2wB867IdooQJL0G1zBxl0Dq+6W1P3jpg==", + "peer": true, "dependencies": { "@chakra-ui/react-use-callback-ref": "2.1.0" }, @@ -3126,6 +2765,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-disclosure/-/react-use-disclosure-2.1.0.tgz", "integrity": "sha512-Ax4pmxA9LBGMyEZJhhUZobg9C0t3qFE4jVF1tGBsrLDcdBeLR9fwOogIPY9Hf0/wqSlAryAimICbr5hkpa5GSw==", + "peer": true, "dependencies": { "@chakra-ui/react-use-callback-ref": "2.1.0" }, @@ -3137,6 +2777,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-event-listener/-/react-use-event-listener-2.1.0.tgz", "integrity": "sha512-U5greryDLS8ISP69DKDsYcsXRtAdnTQT+jjIlRYZ49K/XhUR/AqVZCK5BkR1spTDmO9H8SPhgeNKI70ODuDU/Q==", + "peer": true, "dependencies": { "@chakra-ui/react-use-callback-ref": "2.1.0" }, @@ -3148,6 +2789,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-focus-effect/-/react-use-focus-effect-2.1.0.tgz", "integrity": "sha512-xzVboNy7J64xveLcxTIJ3jv+lUJKDwRM7Szwn9tNzUIPD94O3qwjV7DDCUzN2490nSYDF4OBMt/wuDBtaR3kUQ==", + "peer": true, "dependencies": { "@chakra-ui/dom-utils": "2.1.0", "@chakra-ui/react-use-event-listener": "2.1.0", @@ -3158,40 +2800,11 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/react-use-focus-on-pointer-down": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-focus-on-pointer-down/-/react-use-focus-on-pointer-down-2.1.0.tgz", - "integrity": "sha512-2jzrUZ+aiCG/cfanrolsnSMDykCAbv9EK/4iUyZno6BYb3vziucmvgKuoXbMPAzWNtwUwtuMhkby8rc61Ue+Lg==", - "dependencies": { - "@chakra-ui/react-use-event-listener": "2.1.0" - }, - "peerDependencies": { - "react": ">=18" - } - }, - "node_modules/@chakra-ui/react-use-interval": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-interval/-/react-use-interval-2.1.0.tgz", - "integrity": "sha512-8iWj+I/+A0J08pgEXP1J1flcvhLBHkk0ln7ZvGIyXiEyM6XagOTJpwNhiu+Bmk59t3HoV/VyvyJTa+44sEApuw==", - "dependencies": { - "@chakra-ui/react-use-callback-ref": "2.1.0" - }, - "peerDependencies": { - "react": ">=18" - } - }, - "node_modules/@chakra-ui/react-use-latest-ref": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-latest-ref/-/react-use-latest-ref-2.1.0.tgz", - "integrity": "sha512-m0kxuIYqoYB0va9Z2aW4xP/5b7BzlDeWwyXCH6QpT2PpW3/281L3hLCm1G0eOUcdVlayqrQqOeD6Mglq+5/xoQ==", - "peerDependencies": { - "react": ">=18" - } - }, "node_modules/@chakra-ui/react-use-merge-refs": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-merge-refs/-/react-use-merge-refs-2.1.0.tgz", "integrity": "sha512-lERa6AWF1cjEtWSGjxWTaSMvneccnAVH4V4ozh8SYiN9fSPZLlSG3kNxfNzdFvMEhM7dnP60vynF7WjGdTgQbQ==", + "peer": true, "peerDependencies": { "react": ">=18" } @@ -3200,6 +2813,7 @@ "version": "2.2.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-outside-click/-/react-use-outside-click-2.2.0.tgz", "integrity": "sha512-PNX+s/JEaMneijbgAM4iFL+f3m1ga9+6QK0E5Yh4s8KZJQ/bLwZzdhMz8J/+mL+XEXQ5J0N8ivZN28B82N1kNw==", + "peer": true, "dependencies": { "@chakra-ui/react-use-callback-ref": "2.1.0" }, @@ -3207,53 +2821,11 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/react-use-pan-event": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-pan-event/-/react-use-pan-event-2.1.0.tgz", - "integrity": "sha512-xmL2qOHiXqfcj0q7ZK5s9UjTh4Gz0/gL9jcWPA6GVf+A0Od5imEDa/Vz+533yQKWiNSm1QGrIj0eJAokc7O4fg==", - "dependencies": { - "@chakra-ui/event-utils": "2.0.8", - "@chakra-ui/react-use-latest-ref": "2.1.0", - "framesync": "6.1.2" - }, - "peerDependencies": { - "react": ">=18" - } - }, - "node_modules/@chakra-ui/react-use-previous": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-previous/-/react-use-previous-2.1.0.tgz", - "integrity": "sha512-pjxGwue1hX8AFcmjZ2XfrQtIJgqbTF3Qs1Dy3d1krC77dEsiCUbQ9GzOBfDc8pfd60DrB5N2tg5JyHbypqh0Sg==", - "peerDependencies": { - "react": ">=18" - } - }, "node_modules/@chakra-ui/react-use-safe-layout-effect": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-safe-layout-effect/-/react-use-safe-layout-effect-2.1.0.tgz", "integrity": "sha512-Knbrrx/bcPwVS1TorFdzrK/zWA8yuU/eaXDkNj24IrKoRlQrSBFarcgAEzlCHtzuhufP3OULPkELTzz91b0tCw==", - "peerDependencies": { - "react": ">=18" - } - }, - "node_modules/@chakra-ui/react-use-size": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-size/-/react-use-size-2.1.0.tgz", - "integrity": "sha512-tbLqrQhbnqOjzTaMlYytp7wY8BW1JpL78iG7Ru1DlV4EWGiAmXFGvtnEt9HftU0NJ0aJyjgymkxfVGI55/1Z4A==", - "dependencies": { - "@zag-js/element-size": "0.10.5" - }, - "peerDependencies": { - "react": ">=18" - } - }, - "node_modules/@chakra-ui/react-use-timeout": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-timeout/-/react-use-timeout-2.1.0.tgz", - "integrity": "sha512-cFN0sobKMM9hXUhyCofx3/Mjlzah6ADaEl/AXl5Y+GawB5rgedgAcu2ErAgarEkwvsKdP6c68CKjQ9dmTQlJxQ==", - "dependencies": { - "@chakra-ui/react-use-callback-ref": "2.1.0" - }, + "peer": true, "peerDependencies": { "react": ">=18" } @@ -3262,6 +2834,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/react-use-update-effect/-/react-use-update-effect-2.1.0.tgz", "integrity": "sha512-ND4Q23tETaR2Qd3zwCKYOOS1dfssojPLJMLvUtUbW5M9uW1ejYWgGUobeAiOVfSplownG8QYMmHTP86p/v0lbA==", + "peer": true, "peerDependencies": { "react": ">=18" } @@ -3270,6 +2843,7 @@ "version": "2.0.12", "resolved": "https://registry.npmjs.org/@chakra-ui/react-utils/-/react-utils-2.0.12.tgz", "integrity": "sha512-GbSfVb283+YA3kA8w8xWmzbjNWk14uhNpntnipHCftBibl0lxtQ9YqMFQLwuFOO0U2gYVocszqqDWX+XNKq9hw==", + "peer": true, "dependencies": { "@chakra-ui/utils": "2.0.15" }, @@ -3277,72 +2851,16 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/select": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/select/-/select-2.1.2.tgz", - "integrity": "sha512-ZwCb7LqKCVLJhru3DXvKXpZ7Pbu1TDZ7N0PdQ0Zj1oyVLJyrpef1u9HR5u0amOpqcH++Ugt0f5JSmirjNlctjA==", - "dependencies": { - "@chakra-ui/form-control": "2.2.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/shared-utils": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/@chakra-ui/shared-utils/-/shared-utils-2.0.5.tgz", "integrity": "sha512-4/Wur0FqDov7Y0nCXl7HbHzCg4aq86h+SXdoUeuCMD3dSj7dpsVnStLYhng1vxvlbUnLpdF4oz5Myt3i/a7N3Q==" }, - "node_modules/@chakra-ui/skeleton": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/skeleton/-/skeleton-2.1.0.tgz", - "integrity": "sha512-JNRuMPpdZGd6zFVKjVQ0iusu3tXAdI29n4ZENYwAJEMf/fN0l12sVeirOxkJ7oEL0yOx2AgEYFSKdbcAgfUsAQ==", - "dependencies": { - "@chakra-ui/media-query": "3.3.0", - "@chakra-ui/react-use-previous": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/skip-nav": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/skip-nav/-/skip-nav-2.1.0.tgz", - "integrity": "sha512-Hk+FG+vadBSH0/7hwp9LJnLjkO0RPGnx7gBJWI4/SpoJf3e4tZlWYtwGj0toYY4aGKl93jVghuwGbDBEMoHDug==", - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/slider": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/slider/-/slider-2.1.0.tgz", - "integrity": "sha512-lUOBcLMCnFZiA/s2NONXhELJh6sY5WtbRykPtclGfynqqOo47lwWJx+VP7xaeuhDOPcWSSecWc9Y1BfPOCz9cQ==", - "dependencies": { - "@chakra-ui/number-utils": "2.0.7", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-callback-ref": "2.1.0", - "@chakra-ui/react-use-controllable-state": "2.1.0", - "@chakra-ui/react-use-latest-ref": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/react-use-pan-event": "2.1.0", - "@chakra-ui/react-use-size": "2.1.0", - "@chakra-ui/react-use-update-effect": "2.1.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/spinner": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/spinner/-/spinner-2.1.0.tgz", "integrity": "sha512-hczbnoXt+MMv/d3gE+hjQhmkzLiKuoTo42YhUG7Bs9OSv2lg1fZHW1fGNRFP3wTi6OIbD044U1P9HK+AOgFH3g==", + "peer": true, "dependencies": { "@chakra-ui/shared-utils": "2.0.5" }, @@ -3351,62 +2869,22 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/stat": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/stat/-/stat-2.1.1.tgz", - "integrity": "sha512-LDn0d/LXQNbAn2KaR3F1zivsZCewY4Jsy1qShmfBMKwn6rI8yVlbvu6SiA3OpHS0FhxbsZxQI6HefEoIgtqY6Q==", - "dependencies": { - "@chakra-ui/icon": "3.2.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/stepper": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/stepper/-/stepper-2.3.1.tgz", - "integrity": "sha512-ky77lZbW60zYkSXhYz7kbItUpAQfEdycT0Q4bkHLxfqbuiGMf8OmgZOQkOB9uM4v0zPwy2HXhe0vq4Dd0xa55Q==", - "dependencies": { - "@chakra-ui/icon": "3.2.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/styled-system": { "version": "2.9.2", "resolved": "https://registry.npmjs.org/@chakra-ui/styled-system/-/styled-system-2.9.2.tgz", "integrity": "sha512-To/Z92oHpIE+4nk11uVMWqo2GGRS86coeMmjxtpnErmWRdLcp1WVCVRAvn+ZwpLiNR+reWFr2FFqJRsREuZdAg==", + "peer": true, "dependencies": { "@chakra-ui/shared-utils": "2.0.5", "csstype": "^3.1.2", "lodash.mergewith": "4.6.2" } }, - "node_modules/@chakra-ui/switch": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/switch/-/switch-2.1.2.tgz", - "integrity": "sha512-pgmi/CC+E1v31FcnQhsSGjJnOE2OcND4cKPyTE+0F+bmGm48Q/b5UmKD9Y+CmZsrt/7V3h8KNczowupfuBfIHA==", - "dependencies": { - "@chakra-ui/checkbox": "2.3.2", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "framer-motion": ">=4.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/system": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/@chakra-ui/system/-/system-2.6.2.tgz", "integrity": "sha512-EGtpoEjLrUu4W1fHD+a62XR+hzC5YfsWm+6lO0Kybcga3yYEij9beegO0jZgug27V+Rf7vns95VPVP6mFd/DEQ==", + "peer": true, "dependencies": { "@chakra-ui/color-mode": "2.2.0", "@chakra-ui/object-utils": "2.1.0", @@ -3422,69 +2900,11 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/table": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/table/-/table-2.1.0.tgz", - "integrity": "sha512-o5OrjoHCh5uCLdiUb0Oc0vq9rIAeHSIRScc2ExTC9Qg/uVZl2ygLrjToCaKfaaKl1oQexIeAcZDKvPG8tVkHyQ==", - "dependencies": { - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/tabs": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/tabs/-/tabs-3.0.0.tgz", - "integrity": "sha512-6Mlclp8L9lqXmsGWF5q5gmemZXOiOYuh0SGT/7PgJVNPz3LXREXlXg2an4MBUD8W5oTkduCX+3KTMCwRrVrDYw==", - "dependencies": { - "@chakra-ui/clickable": "2.1.0", - "@chakra-ui/descendant": "3.1.0", - "@chakra-ui/lazy-utils": "2.0.5", - "@chakra-ui/react-children-utils": "2.0.6", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-use-controllable-state": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/react-use-safe-layout-effect": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/tag": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/tag/-/tag-3.1.1.tgz", - "integrity": "sha512-Bdel79Dv86Hnge2PKOU+t8H28nm/7Y3cKd4Kfk9k3lOpUh4+nkSGe58dhRzht59lEqa4N9waCgQiBdkydjvBXQ==", - "dependencies": { - "@chakra-ui/icon": "3.2.0", - "@chakra-ui/react-context": "2.1.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, - "node_modules/@chakra-ui/textarea": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/textarea/-/textarea-2.1.2.tgz", - "integrity": "sha512-ip7tvklVCZUb2fOHDb23qPy/Fr2mzDOGdkrpbNi50hDCiV4hFX02jdQJdi3ydHZUyVgZVBKPOJ+lT9i7sKA2wA==", - "dependencies": { - "@chakra-ui/form-control": "2.2.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/theme": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/@chakra-ui/theme/-/theme-3.3.1.tgz", "integrity": "sha512-Hft/VaT8GYnItGCBbgWd75ICrIrIFrR7lVOhV/dQnqtfGqsVDlrztbSErvMkoPKt0UgAkd9/o44jmZ6X4U2nZQ==", + "peer": true, "dependencies": { "@chakra-ui/anatomy": "2.2.2", "@chakra-ui/shared-utils": "2.0.5", @@ -3498,6 +2918,7 @@ "version": "2.1.2", "resolved": "https://registry.npmjs.org/@chakra-ui/theme-tools/-/theme-tools-2.1.2.tgz", "integrity": "sha512-Qdj8ajF9kxY4gLrq7gA+Azp8CtFHGO9tWMN2wfF9aQNgG9AuMhPrUzMq9AMQ0MXiYcgNq/FD3eegB43nHVmXVA==", + "peer": true, "dependencies": { "@chakra-ui/anatomy": "2.2.2", "@chakra-ui/shared-utils": "2.0.5", @@ -3511,6 +2932,7 @@ "version": "2.0.21", "resolved": "https://registry.npmjs.org/@chakra-ui/theme-utils/-/theme-utils-2.0.21.tgz", "integrity": "sha512-FjH5LJbT794r0+VSCXB3lT4aubI24bLLRWB+CuRKHijRvsOg717bRdUN/N1fEmEpFnRVrbewttWh/OQs0EWpWw==", + "peer": true, "dependencies": { "@chakra-ui/shared-utils": "2.0.5", "@chakra-ui/styled-system": "2.9.2", @@ -3518,53 +2940,11 @@ "lodash.mergewith": "4.6.2" } }, - "node_modules/@chakra-ui/toast": { - "version": "7.0.2", - "resolved": "https://registry.npmjs.org/@chakra-ui/toast/-/toast-7.0.2.tgz", - "integrity": "sha512-yvRP8jFKRs/YnkuE41BVTq9nB2v/KDRmje9u6dgDmE5+1bFt3bwjdf9gVbif4u5Ve7F7BGk5E093ARRVtvLvXA==", - "dependencies": { - "@chakra-ui/alert": "2.2.2", - "@chakra-ui/close-button": "2.1.1", - "@chakra-ui/portal": "2.1.0", - "@chakra-ui/react-context": "2.1.0", - "@chakra-ui/react-use-timeout": "2.1.0", - "@chakra-ui/react-use-update-effect": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5", - "@chakra-ui/styled-system": "2.9.2", - "@chakra-ui/theme": "3.3.1" - }, - "peerDependencies": { - "@chakra-ui/system": "2.6.2", - "framer-motion": ">=4.0.0", - "react": ">=18", - "react-dom": ">=18" - } - }, - "node_modules/@chakra-ui/tooltip": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/tooltip/-/tooltip-2.3.1.tgz", - "integrity": "sha512-Rh39GBn/bL4kZpuEMPPRwYNnccRCL+w9OqamWHIB3Qboxs6h8cOyXfIdGxjo72lvhu1QI/a4KFqkM3St+WfC0A==", - "dependencies": { - "@chakra-ui/dom-utils": "2.1.0", - "@chakra-ui/popper": "3.1.0", - "@chakra-ui/portal": "2.1.0", - "@chakra-ui/react-types": "2.0.7", - "@chakra-ui/react-use-disclosure": "2.1.0", - "@chakra-ui/react-use-event-listener": "2.1.0", - "@chakra-ui/react-use-merge-refs": "2.1.0", - "@chakra-ui/shared-utils": "2.0.5" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "framer-motion": ">=4.0.0", - "react": ">=18", - "react-dom": ">=18" - } - }, "node_modules/@chakra-ui/transition": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/transition/-/transition-2.1.0.tgz", "integrity": "sha512-orkT6T/Dt+/+kVwJNy7zwJ+U2xAZ3EU7M3XCs45RBvUnZDr/u9vdmaM/3D/rOpmQJWgQBwKPJleUXrYWUagEDQ==", + "peer": true, "dependencies": { "@chakra-ui/shared-utils": "2.0.5" }, @@ -3577,6 +2957,7 @@ "version": "2.0.15", "resolved": "https://registry.npmjs.org/@chakra-ui/utils/-/utils-2.0.15.tgz", "integrity": "sha512-El4+jL0WSaYYs+rJbuYFDbjmfCcfGDmRY95GO4xwzit6YAPZBLcR65rOEwLps+XWluZTy1xdMrusg/hW0c1aAA==", + "peer": true, "dependencies": { "@types/lodash.mergewith": "4.6.7", "css-box-model": "1.2.1", @@ -3584,15 +2965,6 @@ "lodash.mergewith": "4.6.2" } }, - "node_modules/@chakra-ui/visually-hidden": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/visually-hidden/-/visually-hidden-2.2.0.tgz", - "integrity": "sha512-KmKDg01SrQ7VbTD3+cPWf/UfpF5MSwm3v7MWi0n5t8HnnadT13MF0MJCDSXbBWnzLv1ZKJ6zlyAOeARWX+DpjQ==", - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@colors/colors": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz", @@ -3712,15 +3084,15 @@ } }, "node_modules/@emotion/babel-plugin": { - "version": "11.11.0", - "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.11.0.tgz", - "integrity": "sha512-m4HEDZleaaCH+XgDDsPF15Ht6wTLsgDTeR3WYj9Q/k76JtWhrJjcP4+/XlG8LGT/Rol9qUfOIztXeA84ATpqPQ==", + "version": "11.13.5", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.13.5.tgz", + "integrity": "sha512-pxHCpT2ex+0q+HH91/zsdHkw/lXd468DIN2zvfvLtPKLLMo6gQj7oLObq8PhkrxOZb/gGCq03S3Z7PDhS8pduQ==", "dependencies": { "@babel/helper-module-imports": "^7.16.7", "@babel/runtime": "^7.18.3", - "@emotion/hash": "^0.9.1", - "@emotion/memoize": "^0.8.1", - "@emotion/serialize": "^1.1.2", + "@emotion/hash": "^0.9.2", + "@emotion/memoize": "^0.9.0", + "@emotion/serialize": "^1.3.3", "babel-plugin-macros": "^3.1.0", "convert-source-map": "^1.5.0", "escape-string-regexp": "^4.0.0", @@ -3730,48 +3102,47 @@ } }, "node_modules/@emotion/cache": { - "version": "11.11.0", - "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.11.0.tgz", - "integrity": "sha512-P34z9ssTCBi3e9EI1ZsWpNHcfY1r09ZO0rZbRO2ob3ZQMnFI35jB536qoXbkdesr5EUhYi22anuEJuyxifaqAQ==", - "dependencies": { - "@emotion/memoize": "^0.8.1", - "@emotion/sheet": "^1.2.2", - "@emotion/utils": "^1.2.1", - "@emotion/weak-memoize": "^0.3.1", + "version": "11.14.0", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.14.0.tgz", + "integrity": "sha512-L/B1lc/TViYk4DcpGxtAVbx0ZyiKM5ktoIyafGkH6zg/tj+mA+NE//aPYKG0k8kCHSHVJrpLpcAlOBEXQ3SavA==", + "dependencies": { + "@emotion/memoize": "^0.9.0", + "@emotion/sheet": "^1.4.0", + "@emotion/utils": "^1.4.2", + "@emotion/weak-memoize": "^0.4.0", "stylis": "4.2.0" } }, "node_modules/@emotion/hash": { - "version": "0.9.1", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.1.tgz", - "integrity": "sha512-gJB6HLm5rYwSLI6PQa+X1t5CFGrv1J1TWG+sOyMCeKz2ojaj6Fnl/rZEspogG+cvqbt4AE/2eIyD2QfLKTBNlQ==" + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", + "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==" }, "node_modules/@emotion/is-prop-valid": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz", - "integrity": "sha512-61Mf7Ufx4aDxx1xlDeOm8aFFigGHE4z+0sKCa+IHCeZKiyP9RLD0Mmx7m8b9/Cf37f7NAvQOOJAbQQGVr5uERw==", - "peer": true, + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.1.tgz", + "integrity": "sha512-/ACwoqx7XQi9knQs/G0qKvv5teDMhD7bXYns9N/wM8ah8iNb8jZ2uNO0YOgiq2o2poIvVtJS2YALasQuMSQ7Kw==", "dependencies": { - "@emotion/memoize": "^0.8.1" + "@emotion/memoize": "^0.9.0" } }, "node_modules/@emotion/memoize": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz", - "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==" + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz", + "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==" }, "node_modules/@emotion/react": { - "version": "11.11.1", - "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.11.1.tgz", - "integrity": "sha512-5mlW1DquU5HaxjLkfkGN1GA/fvVGdyHURRiX/0FHl2cfIfRxSOfmxEH5YS43edp0OldZrZ+dkBKbngxcNCdZvA==", + "version": "11.14.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.14.0.tgz", + "integrity": "sha512-O000MLDBDdk/EohJPFUqvnp4qnHeYkVP5B0xEG0D/L7cOKP9kefu2DXn8dj74cQfsEzUqh+sr1RzFqiL1o+PpA==", "dependencies": { "@babel/runtime": "^7.18.3", - "@emotion/babel-plugin": "^11.11.0", - "@emotion/cache": "^11.11.0", - "@emotion/serialize": "^1.1.2", - "@emotion/use-insertion-effect-with-fallbacks": "^1.0.1", - "@emotion/utils": "^1.2.1", - "@emotion/weak-memoize": "^0.3.1", + "@emotion/babel-plugin": "^11.13.5", + "@emotion/cache": "^11.14.0", + "@emotion/serialize": "^1.3.3", + "@emotion/use-insertion-effect-with-fallbacks": "^1.2.0", + "@emotion/utils": "^1.4.2", + "@emotion/weak-memoize": "^0.4.0", "hoist-non-react-statics": "^3.3.1" }, "peerDependencies": { @@ -3784,21 +3155,21 @@ } }, "node_modules/@emotion/serialize": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.2.tgz", - "integrity": "sha512-zR6a/fkFP4EAcCMQtLOhIgpprZOwNmCldtpaISpvz348+DP4Mz8ZoKaGGCQpbzepNIUWbq4w6hNZkwDyKoS+HA==", + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.3.tgz", + "integrity": "sha512-EISGqt7sSNWHGI76hC7x1CksiXPahbxEOrC5RjmFRJTqLyEK9/9hZvBbiYn70dw4wuwMKiEMCUlR6ZXTSWQqxA==", "dependencies": { - "@emotion/hash": "^0.9.1", - "@emotion/memoize": "^0.8.1", - "@emotion/unitless": "^0.8.1", - "@emotion/utils": "^1.2.1", + "@emotion/hash": "^0.9.2", + "@emotion/memoize": "^0.9.0", + "@emotion/unitless": "^0.10.0", + "@emotion/utils": "^1.4.2", "csstype": "^3.0.2" } }, "node_modules/@emotion/sheet": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.2.2.tgz", - "integrity": "sha512-0QBtGvaqtWi+nx6doRwDdBIzhNdZrXUppvTM4dtZZWEGTXL/XE/yJxLMGlDT1Gt+UHH5IX1n+jkXyytE/av7OA==" + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz", + "integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==" }, "node_modules/@emotion/styled": { "version": "11.11.0", @@ -3824,27 +3195,27 @@ } }, "node_modules/@emotion/unitless": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz", - "integrity": "sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==" + "version": "0.10.0", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz", + "integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==" }, "node_modules/@emotion/use-insertion-effect-with-fallbacks": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.1.tgz", - "integrity": "sha512-jT/qyKZ9rzLErtrjGgdkMBn2OP8wl0G3sQlBb3YPryvKHsjvINUhVaPFfP+fpBcOkmrVOVEEHQFJ7nbj2TH2gw==", + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.2.0.tgz", + "integrity": "sha512-yJMtVdH59sxi/aVJBpk9FQq+OR8ll5GT8oWd57UpeaKEVGab41JWaCFA7FRLoMLloOZF/c/wsPoe+bfGmRKgDg==", "peerDependencies": { "react": ">=16.8.0" } }, "node_modules/@emotion/utils": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.1.tgz", - "integrity": "sha512-Y2tGf3I+XVnajdItskUCn6LX+VUDmP6lTL4fcqsXAv43dnlbZiuW4MWQW38rW/BVWSE7Q/7+XQocmpnRYILUmg==" + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.2.tgz", + "integrity": "sha512-3vLclRofFziIa3J2wDh9jjbkUz9qk5Vi3IZ/FSTKViB0k+ef0fPV7dYrUIugbgupYDx7v9ud/SjrtEP8Y4xLoA==" }, "node_modules/@emotion/weak-memoize": { - "version": "0.3.1", - "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.3.1.tgz", - "integrity": "sha512-EsBwpc7hBUJWAsNPBmJy4hxWx12v6bshQsldrVmjxJoc3isbxhOrF2IcCpaXxfvq03NwkI7sbsOLXbYuqF/8Ww==" + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz", + "integrity": "sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==" }, "node_modules/@esbuild/aix-ppc64": { "version": "0.19.11", @@ -4338,26 +3709,26 @@ "integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ==" }, "node_modules/@floating-ui/core": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.4.1.tgz", - "integrity": "sha512-jk3WqquEJRlcyu7997NtR5PibI+y5bi+LS3hPmguVClypenMsCY3CBa3LAQnozRCtCrYWSEtAdiskpamuJRFOQ==", + "version": "1.6.8", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.8.tgz", + "integrity": "sha512-7XJ9cPU+yI2QeLS+FCSlqNFZJq8arvswefkZrYI1yQBbftw6FyrZOxYSh+9S7z7TpeWlRt9zJ5IhM1WIL334jA==", "dependencies": { - "@floating-ui/utils": "^0.1.1" + "@floating-ui/utils": "^0.2.8" } }, "node_modules/@floating-ui/dom": { - "version": "1.5.2", - "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.5.2.tgz", - "integrity": "sha512-6ArmenS6qJEWmwzczWyhvrXRdI/rI78poBcW0h/456+onlabit+2G+QxHx5xTOX60NBJQXjsCLFbW2CmsXpUog==", + "version": "1.6.12", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.12.tgz", + "integrity": "sha512-NP83c0HjokcGVEMeoStg317VD9W7eDlGK7457dMBANbKA6GJZdc7rjujdgqzTaz93jkGgc5P/jeWbaCHnMNc+w==", "dependencies": { - "@floating-ui/core": "^1.4.1", - "@floating-ui/utils": "^0.1.1" + "@floating-ui/core": "^1.6.0", + "@floating-ui/utils": "^0.2.8" } }, "node_modules/@floating-ui/utils": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.2.tgz", - "integrity": "sha512-ou3elfqG/hZsbmF4bxeJhPHIf3G2pm0ujc39hYEZrfVqt7Vk/Zji6CXc3W0pmYM8BW1g40U+akTl9DKZhFhInQ==" + "version": "0.2.8", + "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.8.tgz", + "integrity": "sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==" }, "node_modules/@hapi/hoek": { "version": "9.3.0", @@ -4420,6 +3791,22 @@ "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.2.tgz", "integrity": "sha512-6EwiSjwWYP7pTckG6I5eyFANjPhmPjUX9JRLUSfNPC7FX7zK9gyZAfUEaECL6ALTpGX5AjnBq3C9XmVWPitNpw==" }, + "node_modules/@internationalized/date": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.6.0.tgz", + "integrity": "sha512-+z6ti+CcJnRlLHok/emGEsWQhe7kfSmEW+/6qCzvKY67YPh7YOBfvc7+/+NXq+zJlbArg30tYpqLjNgcAYv2YQ==", + "dependencies": { + "@swc/helpers": "^0.5.0" + } + }, + "node_modules/@internationalized/number": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/@internationalized/number/-/number-3.6.0.tgz", + "integrity": "sha512-PtrRcJVy7nw++wn4W2OuePQQfTqDzfusSuY1QTtui4wa7r+rGVtR75pO8CyKvHvzyQYi3Q1uO5sY0AsB4e65Bw==", + "dependencies": { + "@swc/helpers": "^0.5.0" + } + }, "node_modules/@isaacs/cliui": { "version": "8.0.2", "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz", @@ -5449,6 +4836,11 @@ "node": ">=8.0.0" } }, + "node_modules/@pandacss/is-valid-prop": { + "version": "0.41.0", + "resolved": "https://registry.npmjs.org/@pandacss/is-valid-prop/-/is-valid-prop-0.41.0.tgz", + "integrity": "sha512-BE6h6CsJk14ugIRrsazJtN3fcg+KDFRat1Bs93YFKH6jd4DOb1yUyVvC70jKqPVvg70zEcV8acZ7VdcU5TLu+w==" + }, "node_modules/@panva/hkdf": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@panva/hkdf/-/hkdf-1.1.1.tgz", @@ -5558,6 +4950,7 @@ "version": "2.11.8", "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", + "peer": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/popperjs" @@ -9080,6 +8473,7 @@ "version": "4.6.7", "resolved": "https://registry.npmjs.org/@types/lodash.mergewith/-/lodash.mergewith-4.6.7.tgz", "integrity": "sha512-3m+lkO5CLRRYU0fhGRp7zbsGi6+BZj0uTVSwvcKU+nSlhjA9/QRNfuSGnD2mX6hQA7ZbmcCkzk5h4ZYGOtk14A==", + "peer": true, "dependencies": { "@types/lodash": "*" } @@ -10141,24 +9535,774 @@ "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==", "dev": true }, + "node_modules/@zag-js/accordion": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/accordion/-/accordion-0.79.1.tgz", + "integrity": "sha512-GlyuRhc2Mwq0punW6dARPTM4EoIce4MxjNCuZLyMxEKt23xFEB5ICVNgz4X/4fyKu+0SaNpttztbBqzTv/fnpg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/anatomy": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/anatomy/-/anatomy-0.79.1.tgz", + "integrity": "sha512-kdwGFERoVlxLfBKFVrtY/3UATaU/Tqyxe2DBiwccy9RcY8LQlVAoFuRRmK1hlV7Dz9IXrPoQEDYTNgSORz4NyA==" + }, + "node_modules/@zag-js/aria-hidden": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/aria-hidden/-/aria-hidden-0.79.1.tgz", + "integrity": "sha512-UFp/u8ytJ4WASB1kUnJ+uJ/N6huRfIshAoRKnnfxJSE71QpJ0T8ncniuXv2L/rxjOXBr8nDRhRq9ZNZwwi69Vw==" + }, + "node_modules/@zag-js/auto-resize": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/auto-resize/-/auto-resize-0.79.1.tgz", + "integrity": "sha512-eki2QeC3K7TLRizH7T/QKcIlwZnUMS+TsFO1fBJwWvW8oKESKfemWt05e6HsuORwVJGC/tkd2F5OTFGVVJXZkQ==", + "dependencies": { + "@zag-js/dom-query": "0.79.1" + } + }, + "node_modules/@zag-js/avatar": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/avatar/-/avatar-0.79.1.tgz", + "integrity": "sha512-fPVJ1SDzZ9CqnyEXBwZpldrCC48mhwsjyWzjlid7NHlBYothSvjy9+C11FyDA9ms0ziwXMIXKbo2uSz3qfdgvg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/carousel": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/carousel/-/carousel-0.79.1.tgz", + "integrity": "sha512-tc9BPbVWPutfJTw1WorgJxbMEQJN+7Ur5bkP+V5ght8BKl/wiHhaR6KFEGXVtQVgH/dUMaViFTX+OeGzegk6Wg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/scroll-snap": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/checkbox": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/checkbox/-/checkbox-0.79.1.tgz", + "integrity": "sha512-QF79sAfvJpw76+H5+7KkW3Lify8csV4CA9JLyGpL81m9LJTC8yeKXUnN5be9ZKjDKlNsg0INk9nVBI0a6Q037Q==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/focus-visible": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/clipboard": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/clipboard/-/clipboard-0.79.1.tgz", + "integrity": "sha512-LDIEAeaAm5lwWhijS+w4/Psa9rUppiarjKv6qPjNL2iBOGmlU2Tw2LukCbZpY4Sg12y7BqesyK0o+5BBjwetmg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/collapsible": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/collapsible/-/collapsible-0.79.1.tgz", + "integrity": "sha512-NMg5zvWSrVq1uFA/TN/mRBYdsxw9/rWnaNSO0DT0h2gP+l5HUouz1wlz8Tkwa4VRhW0rrg20kGEhwAHZ8uPdrw==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/collection": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/collection/-/collection-0.79.1.tgz", + "integrity": "sha512-PeOqddL2M6+2cKJhTP3aahGxV4rJgwwGJz9hYVQs+H7+yHLDrG99vDpphWDL6g8kDlyQSpijwl5+gR/z52cw0A==", + "dependencies": { + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/color-picker": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/color-picker/-/color-picker-0.79.1.tgz", + "integrity": "sha512-2v0VX86G53kcB+OIjLDXK752iFM2GUQ1/UUHnLVXWvo5Wfi+Oa5wRDMaMDXt/nI35NU8C55k2Hnbk0dYTQZj5g==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/color-utils": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/text-selection": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/color-utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/color-utils/-/color-utils-0.79.1.tgz", + "integrity": "sha512-a+0HGl/vfhtTBEZzoLZjNVZMOMBFrDRXDZvkan1Wz6hk2oLHdgfpGoTt/Vu93A62queXlt2Q7gbn1mFocRNg7w==", + "dependencies": { + "@zag-js/numeric-range": "0.79.1" + } + }, + "node_modules/@zag-js/combobox": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/combobox/-/combobox-0.79.1.tgz", + "integrity": "sha512-elOshWIEHYqUfmbemnNF39xWinLwG5sQB+OgCaeo0Z9bc79yXHY83bOtquc3WceOasnqzpDeQeu19fmBmi+euw==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/aria-hidden": "0.79.1", + "@zag-js/collection": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/core": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/core/-/core-0.79.1.tgz", + "integrity": "sha512-kfYas04BQnbdL46nDfBjELAHcba+Lq+D2xts1mKbFjgxb1HBDYh0mIngjilAP/8y2Pj2XsjuVlfn3wsuNldqCQ==", + "dependencies": { + "@zag-js/store": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/date-picker": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/date-picker/-/date-picker-0.79.1.tgz", + "integrity": "sha512-IjSB7N4JmlKKNDOcIwoBdXNZCcjxO1AsDmty7k3mOJgGzsCGkxUY6kyTzB+HaTmr+6yyieu+4CrXmVueIEXn9w==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/date-utils": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/live-region": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/text-selection": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + }, + "peerDependencies": { + "@internationalized/date": ">=3.0.0" + } + }, + "node_modules/@zag-js/date-utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/date-utils/-/date-utils-0.79.1.tgz", + "integrity": "sha512-WKg2ks+G/sGgl/WaJu7OO9IYxFP2UdZq8yy0iMNIEQceIGCpYDjLr43Vov1+6mipQ9+oBgXxJQu4+VShpjyesA==", + "peerDependencies": { + "@internationalized/date": ">=3.0.0" + } + }, + "node_modules/@zag-js/dialog": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/dialog/-/dialog-0.79.1.tgz", + "integrity": "sha512-OkOjAnElcxYBkylg/hXZaeKZGas5aNwKT6Tu2qnZp7bQpoNnECIkkpUMhYqJGRG+PGm1zIB8/J4oR/rUx6pdPA==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/aria-hidden": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/focus-trap": "0.79.1", + "@zag-js/remove-scroll": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/dismissable": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/dismissable/-/dismissable-0.79.1.tgz", + "integrity": "sha512-KAEPoXKAZVztCKhKK6EuWnLqKfAfeE3ltUPGCV8eTPuYyPy6JsKl+pvumdmIJnMY0awi9IThLUwnDlPrg/UpuA==", + "dependencies": { + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/interact-outside": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/dom-event": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/dom-event/-/dom-event-0.79.1.tgz", + "integrity": "sha512-PMgtMfl7iPt9kbGMu8tgHYDSWBo/0bKOILWoKtuOZEsOI1QTud+8RhrYmWqvr/Go9W/99YmjzAIS4Dcd8jJDIg==", + "dependencies": { + "@zag-js/dom-query": "0.79.1", + "@zag-js/text-selection": "0.79.1", + "@zag-js/types": "0.79.1" + } + }, "node_modules/@zag-js/dom-query": { - "version": "0.16.0", - "resolved": "https://registry.npmjs.org/@zag-js/dom-query/-/dom-query-0.16.0.tgz", - "integrity": "sha512-Oqhd6+biWyKnhKwFFuZrrf6lxBz2tX2pRQe6grUnYwO6HJ8BcbqZomy2lpOdr+3itlaUqx+Ywj5E5ZZDr/LBfQ==" + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/dom-query/-/dom-query-0.79.1.tgz", + "integrity": "sha512-9z4IEK9q5m/yMyxoj8BPqIurMqRIvRiK2/nAY92n2mP3MTeTKf+AFpMHXGz7wArPx2NIRq+Q7TdfSMey3vKs2w==" + }, + "node_modules/@zag-js/editable": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/editable/-/editable-0.79.1.tgz", + "integrity": "sha512-sAK8CCb1L+jwUaxKpBIdtZWFuxCPUhx9pCtm2d2r9nbmsam3iFBbe52PjjcndEJcVB/n5TibUbfptkzI/4oGOQ==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/interact-outside": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/element-rect": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/element-rect/-/element-rect-0.79.1.tgz", + "integrity": "sha512-BO4n9vBB2MdEHYh6fxy5gMmJXwN65dt55xKxvQYUzrVI8ds2mHnQgDAVGwnZpnXvbXNAd2RLqjksketdhNIoBA==" }, "node_modules/@zag-js/element-size": { - "version": "0.10.5", - "resolved": "https://registry.npmjs.org/@zag-js/element-size/-/element-size-0.10.5.tgz", - "integrity": "sha512-uQre5IidULANvVkNOBQ1tfgwTQcGl4hliPSe69Fct1VfYb2Fd0jdAcGzqQgPhfrXFpR62MxLPB7erxJ/ngtL8w==" + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/element-size/-/element-size-0.79.1.tgz", + "integrity": "sha512-a75L+5YBsubFgjyt/fnvZB/E00wUbDm3VM3JBdvWxX/7gyrazFMyC3kt8Yaf7GmoW8N+h8nZ4nbzhhHImFl8Ug==" + }, + "node_modules/@zag-js/file-upload": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/file-upload/-/file-upload-0.79.1.tgz", + "integrity": "sha512-DnEIP34wVvH9F8F9qEUARP8rdMQCCtjiQX9WXHhqLJA5w3t+EVLL0zGtNASXqsUCWHiE4xCEJbgyHfSXYfcttA==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/file-utils": "0.79.1", + "@zag-js/i18n-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/file-utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/file-utils/-/file-utils-0.79.1.tgz", + "integrity": "sha512-Ss7A9vyDnw9gn0gSzO59JAsk3xb06mQTtGP1n9/iBi2ctkHLoeN41RTRPZ3jfSt4kRfUiK7Gon+y0VE/vUC9+w==", + "dependencies": { + "@zag-js/i18n-utils": "0.79.1" + } + }, + "node_modules/@zag-js/focus-trap": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/focus-trap/-/focus-trap-0.79.1.tgz", + "integrity": "sha512-dofZPlwyBFYACmT6+afSOwcRgFFAJni3xMXL7qCb0E3LXYxbb7AgFIrSLNic0iMSfP4iAE1pd8THnQHdkH2tYQ==", + "dependencies": { + "@zag-js/dom-query": "0.79.1", + "focus-trap": "7.6.2" + } }, "node_modules/@zag-js/focus-visible": { - "version": "0.16.0", - "resolved": "https://registry.npmjs.org/@zag-js/focus-visible/-/focus-visible-0.16.0.tgz", - "integrity": "sha512-a7U/HSopvQbrDU4GLerpqiMcHKEkQkNPeDZJWz38cw/6Upunh41GjHetq5TB84hxyCaDzJ6q2nEdNoBQfC0FKA==", + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/focus-visible/-/focus-visible-0.79.1.tgz", + "integrity": "sha512-yWNKy6ybkg6VA2uXarEg+1xIuz2iwbn9TD7FZXZPxDgd2RzUacXuyhhTJlENEwGVcweZQkg78XzOWUCbXR2+iQ==", + "dependencies": { + "@zag-js/dom-query": "0.79.1" + } + }, + "node_modules/@zag-js/form-utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/form-utils/-/form-utils-0.79.1.tgz", + "integrity": "sha512-AcfqKWqlReo38OKQFlC2Jx6/wT7Zmx5x22C1dXN9TvxhvqolpiQPT7eZ/Un7xq4D55lhzdJOPfh/esQ+W6ErDQ==" + }, + "node_modules/@zag-js/highlight-word": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/highlight-word/-/highlight-word-0.79.1.tgz", + "integrity": "sha512-D3yt9BmBUPMXZngIKxEFJO/D7sX/+3Dd3hcOPOilJD3gP9IFPZCC2YHkXUXJ/cv9kyzXdweAOAJY7b6bJST0dQ==" + }, + "node_modules/@zag-js/hover-card": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/hover-card/-/hover-card-0.79.1.tgz", + "integrity": "sha512-QHMKCT56Gh+eqdhVFaApXqY1jXh2R+ROM3g5Qif06woN8/1tk4OmgsAx1TwSK7nPWp3iNqiSZUq6x9yZ3GFqCg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/i18n-utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/i18n-utils/-/i18n-utils-0.79.1.tgz", + "integrity": "sha512-jw7oARe27Fy/6sRiRmX6nf86HxZ6nXW1jfEBc8X0Ciebm+IIowZbWywpHZJKDi9wlnWOsK6XxC1rINId453NVg==", + "dependencies": { + "@zag-js/dom-query": "0.79.1" + } + }, + "node_modules/@zag-js/interact-outside": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/interact-outside/-/interact-outside-0.79.1.tgz", + "integrity": "sha512-baNBMvlv9GuMGt+Dj4JOuOj1djEHXTR1UruWn+6TNuwqKlYtB0jJY+qCjLvFxldfAaQU0i6oD3l6in5E86TEIg==", + "dependencies": { + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/live-region": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/live-region/-/live-region-0.79.1.tgz", + "integrity": "sha512-VnU/fem0/Ue9Cgqk+eVTgCu8QqnlixBBUay+PceFbsBjWl3jcA9cXSnwhP/lQzwdq958foEqh/N4fD+wDc9SBA==" + }, + "node_modules/@zag-js/menu": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/menu/-/menu-0.79.1.tgz", + "integrity": "sha512-0Oryb9QRCRlu+Y1jndZdt4lTwZ4BZXiwHXsW6XF1uekks0C/AKbVzVUYUAQME58CFDbeMzf+wigQqsm+fuq0Xg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/rect-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/number-input": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/number-input/-/number-input-0.79.1.tgz", + "integrity": "sha512-oJXx8yA86WtMdIMCQdWbviPXQuE8HfOYhgEKBSliVjH1d3hBXTZjhYIrvfy/0x1M7sYWb/J+0Bt+AOzSj9t2dQ==", + "dependencies": { + "@internationalized/number": "3.6.0", + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/number-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/number-utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/number-utils/-/number-utils-0.79.1.tgz", + "integrity": "sha512-SHmbXDkMBcTMtl+X7kQd55/a5JpRKzZZ2Gq1Ve8y2CoVKErX2mFHDR2nY8SBpwBO3J5/OoE5MTyNQ0slaRUi9w==" + }, + "node_modules/@zag-js/numeric-range": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/numeric-range/-/numeric-range-0.79.1.tgz", + "integrity": "sha512-4bwwjqi/o2AwbPNlP25LY2z6OX8y9unOg+V+TfXjtAL/Ml1q0CMuvle4CxVm/gNBedvP9TrbmYzpj6SfxiXRGA==" + }, + "node_modules/@zag-js/pagination": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/pagination/-/pagination-0.79.1.tgz", + "integrity": "sha512-kM93D+7kpHXz9Gea6ZkxywNBPVcCEfN1EhdJ/qQodvmHUoBpCR9/CiQFrxx1wznSz3W4Nagrg8LEqCu5+JjZwQ==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/pin-input": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/pin-input/-/pin-input-0.79.1.tgz", + "integrity": "sha512-uZ+rDDuLH1x03kA0rRa+vBjZT3p4c7ytoXp/XP2bcKw+QlrBtjijmXED3kw4Bp/oOkov4jRWERtGqj+8Ptz1tA==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/popover": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/popover/-/popover-0.79.1.tgz", + "integrity": "sha512-DCTwrL4PBQX0LVmn6GIv3t931QKZxztkzIZ6jKD1Tn/tu+d6dkdAaw8Ebp55xuK2mKKA9k0eKeUdI3p4ja91Hw==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/aria-hidden": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/focus-trap": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/remove-scroll": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/popper": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/popper/-/popper-0.79.1.tgz", + "integrity": "sha512-kvvkB4Z1auLguPWi5ed36E14V3Vs57dNjD9p6Kwugb/dYrGUXA1n7FTC6qgZ8IZKNF0xb5FN3Wx527u/n+OPwg==", + "dependencies": { + "@floating-ui/dom": "1.6.12", + "@zag-js/dom-query": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/presence": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/presence/-/presence-0.79.1.tgz", + "integrity": "sha512-YJPFfqFCXs6vMVT/1w5gI60RcnC/JUz+FZRVXA8ElffStn/73HeKNa7XORX2Q2noEkRGEU5LUtkHzoiSxsmVAA==", + "dependencies": { + "@zag-js/core": "0.79.1", + "@zag-js/types": "0.79.1" + } + }, + "node_modules/@zag-js/progress": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/progress/-/progress-0.79.1.tgz", + "integrity": "sha512-AsFoJOMyRdNW9ELhliMCqTNBvlKMvACQyolxzMn/5Lo6BsdDKGcGqTrhmc9OwgFYq9EAfrocrRs/ks2j6OGzaQ==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/qr-code": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/qr-code/-/qr-code-0.79.1.tgz", + "integrity": "sha512-qkBvAUEQLm2gEUkFZMOL12xH9vB55Y0NEU2G7T9MlTsaRjkvRApzcqrFgL90+EYuvXVSHBYnXNPHhFTTMqCZ0A==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1", + "proxy-memoize": "3.0.1", + "uqr": "0.1.2" + } + }, + "node_modules/@zag-js/radio-group": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/radio-group/-/radio-group-0.79.1.tgz", + "integrity": "sha512-Lcci+UQVpqbvlJOxHMzxbAGILezBwedW3Q3SARs7AydLnikKh97CKidjEIsYdikN/fCb4dCtvAx5n3W2Flw7Pg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/element-rect": "0.79.1", + "@zag-js/focus-visible": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/rating-group": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/rating-group/-/rating-group-0.79.1.tgz", + "integrity": "sha512-biwSdA42vmCW36Ys4Nr48uWt2tSmd0DHBhfo3yfH0cc8r6qDx85vj1TgHIOq89mPfrFLPvMR5/isWcw0bQpsdA==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/react": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/react/-/react-0.79.1.tgz", + "integrity": "sha512-DHxBW/Z2PQiCFxjxUcfxOCeqdzCQMy8Gz54CaIzy1Nh18BJEqwaoVAT7FPRB49iFY8Nqi4xYibMzFXItNHTmMQ==", + "dependencies": { + "@zag-js/core": "0.79.1", + "@zag-js/store": "0.79.1", + "@zag-js/types": "0.79.1", + "proxy-compare": "3.0.1" + }, + "peerDependencies": { + "react": ">=18.0.0", + "react-dom": ">=18.0.0" + } + }, + "node_modules/@zag-js/rect-utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/rect-utils/-/rect-utils-0.79.1.tgz", + "integrity": "sha512-nkSOiRLzcICs2/lQbCZayTcJZLP1czirFDxClCxj+Nv/p4GkYIegEQHDNXy0tstrkJNr1hypPop0q8N3HqcHzA==" + }, + "node_modules/@zag-js/remove-scroll": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/remove-scroll/-/remove-scroll-0.79.1.tgz", + "integrity": "sha512-bBkS9ma49lNWZhqkl+B96PW107WD2MtJCQ14QzkoTBWHNCGYm8XoQg7tm/PuR+CuMsqpPul5NQgB8NO/dQIElw==", + "dependencies": { + "@zag-js/dom-query": "0.79.1" + } + }, + "node_modules/@zag-js/scroll-snap": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/scroll-snap/-/scroll-snap-0.79.1.tgz", + "integrity": "sha512-ImlGIEQMYfwaC1WJR04FoxjgCWHWmcxY4RR5SmkHJcCOMSoAFWRLsPfkHaBJawpgWx4vYMQmRjtuyXWdL92Tdw==", + "dependencies": { + "@zag-js/dom-query": "0.79.1" + } + }, + "node_modules/@zag-js/select": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/select/-/select-0.79.1.tgz", + "integrity": "sha512-0X6YW3ej+dmYDAgePvMgPSPJyVrdIQoaTBU1D5Kq3sPVk3wupSg3HGmBu1ckdLq7+Ijf3qWiESwLQFC6aRxWFw==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/collection": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/signature-pad": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/signature-pad/-/signature-pad-0.79.1.tgz", + "integrity": "sha512-mfU3hccyfmHP29fNoeWYQYsV4qg7h32diyWNkM1zMYjjsoVwwtOROy3zAf7McNeYZgdDU8/XiDkriw7fnqFkAg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1", + "perfect-freehand": "^1.2.2" + } + }, + "node_modules/@zag-js/slider": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/slider/-/slider-0.79.1.tgz", + "integrity": "sha512-fMMPge9walxA2+w54K4JXFHdUshTwhtU3DZp7xbi5Fmv1vzCEu8qUue3uC+rCMB7728/uj/Gh7i24zjRaJTsaw==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/element-size": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/numeric-range": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/splitter": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/splitter/-/splitter-0.79.1.tgz", + "integrity": "sha512-GUnmAW7qt37nAyixckb+BKVgrvrjoi+nETgw0d1Q990oUCpYyUw6MdRbTpvO9w9TKOh7yydZC9zJLg3azSpDNA==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/number-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/steps": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/steps/-/steps-0.79.1.tgz", + "integrity": "sha512-eexfVZEX3aeMxymjr1+cduTgfIUbxftf5Sa9HDK8HiC+BmlO/Blju/In7kn1EwXJZ7pgVcwDibuJjng8KJRJTg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/store": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/store/-/store-0.79.1.tgz", + "integrity": "sha512-mcXuiS7iqPTFU5sfli4v4kzBJcEAL3L3SVe8l9XezXED6UXYCGHjGQqpNuzsBfY29GPwUOwcF8FfFizxpCL1mQ==", + "dependencies": { + "proxy-compare": "3.0.1" + } + }, + "node_modules/@zag-js/switch": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/switch/-/switch-0.79.1.tgz", + "integrity": "sha512-i+32oau7E1PQyHM6iIOxWDYjMgYHFoiDPg+DzMFQgykw49sXO5y4Ux+406MjXnqaGDA7nI8UhDOGqIl+AhvYKQ==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/focus-visible": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/tabs": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/tabs/-/tabs-0.79.1.tgz", + "integrity": "sha512-ZFJoggGOhvHszxZacXIvBKV2eKFOjJy5DT123d894RZjDy0yMOZwbN/J2T+dMw4ZttuetLvFJ6HAk26XR7iPhQ==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/element-rect": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/tags-input": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/tags-input/-/tags-input-0.79.1.tgz", + "integrity": "sha512-3gPkNpk45eMaoERY81nEVgeW5S1hOug8rz1ZCJ/NBU1MWy/vuIcOyqWV7Ccc6Hxu6X07ujSyEz0MIdy6ddVcbg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/auto-resize": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/form-utils": "0.79.1", + "@zag-js/interact-outside": "0.79.1", + "@zag-js/live-region": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/text-selection": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/text-selection/-/text-selection-0.79.1.tgz", + "integrity": "sha512-lm+CzcNkX6HhbDh/msawCUKvbsw2ArS+FswDoet6ERG4hfz+6aCmw4LACUqYTsNd97usIdPEw8FeL9EakL+lMw==", + "dependencies": { + "@zag-js/dom-query": "0.79.1" + } + }, + "node_modules/@zag-js/time-picker": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/time-picker/-/time-picker-0.79.1.tgz", + "integrity": "sha512-3OeDDhMzoWjjmHnyF1ranvIGbC5ZM8tA+sNXm6cwGneqL4PpA3ngjGYSB1G6VphI/3ovV6NwoRjs/QYuncCaZw==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-event": "^0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + }, + "peerDependencies": { + "@internationalized/date": ">=3.0.0" + } + }, + "node_modules/@zag-js/timer": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/timer/-/timer-0.79.1.tgz", + "integrity": "sha512-NU93fyq+fDKqkdxu73j7HczWZdbihnUNpO6h9S08he4tTbw4NPFyQxh3mIDXeFrNVk6R+Mr4CSnN7KpfbeL5yg==", "dependencies": { - "@zag-js/dom-query": "0.16.0" + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" } }, + "node_modules/@zag-js/toast": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/toast/-/toast-0.79.1.tgz", + "integrity": "sha512-tjtjCOlEKFabXNxKbfPKkGIm941e44L8vQGJWFgI+K+aJyO0SkQYc2RV/bqPGKFL8RMncqX8o6OEdFSzKOIZIA==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dismissable": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/toggle-group": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/toggle-group/-/toggle-group-0.79.1.tgz", + "integrity": "sha512-Fh611w1OxADNvZ+QYMoHr6+f1kr40gxXApQYIa7ug3RuCP0HFwuqi97PsjEckxhFVAhjNmt1G0qv8JWM5P7fnA==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/tooltip": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/tooltip/-/tooltip-0.79.1.tgz", + "integrity": "sha512-Lehi+kiWPt2WAzMD56Vmcvs+kvbFQcMui0MZhjM79NN1O8yjg+AxFiZuVgALVgkDbmPwhoR2ZWbom+1sgUPfcQ==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/focus-visible": "0.79.1", + "@zag-js/popper": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/tree-view": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/tree-view/-/tree-view-0.79.1.tgz", + "integrity": "sha512-fwi5P7IKxETciyS/hBIFipUfXThmfTNom6NwNwQ7Mo3jPJ3UawWzs3LC00prVVuI0OMQEzLRLMdxf6XtJxoxCg==", + "dependencies": { + "@zag-js/anatomy": "0.79.1", + "@zag-js/collection": "0.79.1", + "@zag-js/core": "0.79.1", + "@zag-js/dom-event": "0.79.1", + "@zag-js/dom-query": "0.79.1", + "@zag-js/types": "0.79.1", + "@zag-js/utils": "0.79.1" + } + }, + "node_modules/@zag-js/types": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/types/-/types-0.79.1.tgz", + "integrity": "sha512-TwzaNwiEYpk/7XbUL8zqFiUtd/9Ru0zceuuisYRuNIAN2kBAaKSljx2VvymtAOgbP7IMX+nWcrWN1PywKT7hlw==", + "dependencies": { + "csstype": "3.1.3" + } + }, + "node_modules/@zag-js/utils": { + "version": "0.79.1", + "resolved": "https://registry.npmjs.org/@zag-js/utils/-/utils-0.79.1.tgz", + "integrity": "sha512-jW8+qG16vO2vGHWuf5h4ONISMrSJlapXUQqYhZW8rXP8uDfU5vh6sk2qTGL8i8G2TV8sFb7Xj29gyx9roOrBmQ==" + }, "node_modules/abab": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz", @@ -10706,17 +10850,6 @@ "sprintf-js": "~1.0.2" } }, - "node_modules/aria-hidden": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.3.tgz", - "integrity": "sha512-xcLxITLe2HYa1cnYnwCjkOO1PqUHQpozB8x9AR0OgWN2woOBi5kSDVxKfd0b7sb1hw5qFeJhXm9H1nu3xSfLeQ==", - "dependencies": { - "tslib": "^2.0.0" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/aria-query": { "version": "5.1.3", "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.1.3.tgz", @@ -12473,7 +12606,8 @@ "node_modules/color2k": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/color2k/-/color2k-2.0.3.tgz", - "integrity": "sha512-zW190nQTIoXcGCaU08DvVNFTmQhUpnJfVuAKfWqUQkflXKpaDdpaYoM0iluLS9lgJNHyBF58KKA2FBEwkD7wog==" + "integrity": "sha512-zW190nQTIoXcGCaU08DvVNFTmQhUpnJfVuAKfWqUQkflXKpaDdpaYoM0iluLS9lgJNHyBF58KKA2FBEwkD7wog==", + "peer": true }, "node_modules/colorette": { "version": "2.0.20", @@ -12556,11 +12690,6 @@ "node": ">= 6" } }, - "node_modules/compute-scroll-into-view": { - "version": "3.0.3", - "resolved": "https://registry.npmjs.org/compute-scroll-into-view/-/compute-scroll-into-view-3.0.3.tgz", - "integrity": "sha512-nadqwNxghAGTamwIqQSG433W6OADZx2vCo3UXHNrzTRHK/htu+7+L0zhjEoaeaQVNAi3YgqWDv8+tzf0hRfR+A==" - }, "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", @@ -12634,14 +12763,6 @@ "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz", "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==" }, - "node_modules/copy-to-clipboard": { - "version": "3.3.3", - "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz", - "integrity": "sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==", - "dependencies": { - "toggle-selection": "^1.0.6" - } - }, "node_modules/core-js-compat": { "version": "3.37.1", "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.37.1.tgz", @@ -12938,6 +13059,7 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/css-box-model/-/css-box-model-1.2.1.tgz", "integrity": "sha512-a7Vr4Q/kd/aw96bnJG332W9V9LkJO69JRcaCYDUqjp6/z0w6VcZjgAcTbgFxEPfBgdnAwlh3iwu+hLopa+flJw==", + "peer": true, "dependencies": { "tiny-invariant": "^1.0.6" } @@ -13796,11 +13918,6 @@ "node": ">=8" } }, - "node_modules/detect-node-es": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/detect-node-es/-/detect-node-es-1.1.0.tgz", - "integrity": "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==" - }, "node_modules/devlop": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/devlop/-/devlop-1.1.0.tgz", @@ -16189,15 +16306,12 @@ "node": ">=0.4.0" } }, - "node_modules/focus-lock": { - "version": "0.11.6", - "resolved": "https://registry.npmjs.org/focus-lock/-/focus-lock-0.11.6.tgz", - "integrity": "sha512-KSuV3ur4gf2KqMNoZx3nXNVhqCkn42GuTYCX4tXPEwf0MjpFQmNMiN6m7dXaUXgIoivL6/65agoUMg4RLS0Vbg==", + "node_modules/focus-trap": { + "version": "7.6.2", + "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.6.2.tgz", + "integrity": "sha512-9FhUxK1hVju2+AiQIDJ5Dd//9R2n2RAfJ0qfhF4IHGHgcoEUTMpbTeG/zbEuwaiYXfuAH6XE0/aCyxDdRM+W5w==", "dependencies": { - "tslib": "^2.0.3" - }, - "engines": { - "node": ">=10" + "tabbable": "^6.2.0" } }, "node_modules/follow-redirects": { @@ -16401,6 +16515,7 @@ "version": "11.11.17", "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.11.17.tgz", "integrity": "sha512-O8QzvoKiuzI5HSAHbcYuL6xU+ZLXbrH7C8Akaato4JzQbX2ULNeniqC2Vo5eiCtFktX9XsJ+7nUhxcl2E2IjpA==", + "peer": true, "dependencies": { "tslib": "^2.4.0" }, @@ -16425,6 +16540,7 @@ "version": "6.1.2", "resolved": "https://registry.npmjs.org/framesync/-/framesync-6.1.2.tgz", "integrity": "sha512-jBTqhX6KaQVDyus8muwZbBeGGP0XgujBRbQ7gM7BRdS3CadCZIHiawyzYLnafYcvZIh5j8WE7cxZKFn7dXhu9g==", + "peer": true, "dependencies": { "tslib": "2.4.0" } @@ -16432,7 +16548,8 @@ "node_modules/framesync/node_modules/tslib": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz", - "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==" + "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==", + "peer": true }, "node_modules/fresh": { "version": "0.5.2", @@ -16675,14 +16792,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/get-nonce": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/get-nonce/-/get-nonce-1.0.1.tgz", - "integrity": "sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==", - "engines": { - "node": ">=6" - } - }, "node_modules/get-package-type": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz", @@ -17753,14 +17862,6 @@ "node": ">=12" } }, - "node_modules/invariant": { - "version": "2.2.4", - "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", - "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==", - "dependencies": { - "loose-envify": "^1.0.0" - } - }, "node_modules/ipaddr.js": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz", @@ -20361,7 +20462,8 @@ "node_modules/lodash.mergewith": { "version": "4.6.2", "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.2.tgz", - "integrity": "sha512-GK3g5RPZWTRSeLSpgP8Xhra+pnjBC56q9FZYe1d5RN3TJ35dbkGy3YqBSMbyCrlbi+CM9Z3Jk5yTL7RCsqboyQ==" + "integrity": "sha512-GK3g5RPZWTRSeLSpgP8Xhra+pnjBC56q9FZYe1d5RN3TJ35dbkGy3YqBSMbyCrlbi+CM9Z3Jk5yTL7RCsqboyQ==", + "peer": true }, "node_modules/lodash.once": { "version": "4.1.1", @@ -22752,6 +22854,11 @@ "integrity": "sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==", "dev": true }, + "node_modules/perfect-freehand": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/perfect-freehand/-/perfect-freehand-1.2.2.tgz", + "integrity": "sha512-eh31l019WICQ03pkF3FSzHxB8n07ItqIQ++G5UV8JX0zVOXzgTGCqnRR0jJ2h9U8/2uW4W4mtGJELt9kEV0CFQ==" + }, "node_modules/performance-now": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", @@ -23618,12 +23725,25 @@ "node": ">= 0.10" } }, + "node_modules/proxy-compare": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/proxy-compare/-/proxy-compare-3.0.1.tgz", + "integrity": "sha512-V9plBAt3qjMlS1+nC8771KNf6oJ12gExvaxnNzN/9yVRLdTv/lc+oJlnSzrdYDAvBfTStPCoiaCOTmTs0adv7Q==" + }, "node_modules/proxy-from-env": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.0.0.tgz", "integrity": "sha512-F2JHgJQ1iqwnHDcQjVBsq3n/uoaFL+iPW/eAeL7kVxy/2RrWaN4WroKjjvbsoRtv0ftelNyC01bjRhn/bhcf4A==", "dev": true }, + "node_modules/proxy-memoize": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/proxy-memoize/-/proxy-memoize-3.0.1.tgz", + "integrity": "sha512-VDdG/VYtOgdGkWJx7y0o7p+zArSf2383Isci8C+BP3YXgMYDoPd3cCBjw0JdWb6YBb9sFiOPbAADDVTPJnh+9g==", + "dependencies": { + "proxy-compare": "^3.0.0" + } + }, "node_modules/ps-tree": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/ps-tree/-/ps-tree-1.2.0.tgz", @@ -23869,17 +23989,6 @@ "react": "^16.0.0 || ^17.0.0 || ^18.0.0" } }, - "node_modules/react-clientside-effect": { - "version": "1.2.6", - "resolved": "https://registry.npmjs.org/react-clientside-effect/-/react-clientside-effect-1.2.6.tgz", - "integrity": "sha512-XGGGRQAKY+q25Lz9a/4EPqom7WRjz3z9R2k4jhVKA/puQFH/5Nt27vFZYql4m4NVNdUvX8PS3O7r/Zzm7cjUlg==", - "dependencies": { - "@babel/runtime": "^7.12.13" - }, - "peerDependencies": { - "react": "^15.3.0 || ^16.0.0 || ^17.0.0 || ^18.0.0" - } - }, "node_modules/react-colorful": { "version": "5.6.1", "resolved": "https://registry.npmjs.org/react-colorful/-/react-colorful-5.6.1.tgz", @@ -24365,29 +24474,8 @@ "node_modules/react-fast-compare": { "version": "3.2.2", "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz", - "integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==" - }, - "node_modules/react-focus-lock": { - "version": "2.9.5", - "resolved": "https://registry.npmjs.org/react-focus-lock/-/react-focus-lock-2.9.5.tgz", - "integrity": "sha512-h6vrdgUbsH2HeD5I7I3Cx1PPrmwGuKYICS+kB9m+32X/9xHRrAbxgvaBpG7BFBN9h3tO+C3qX1QAVESmi4CiIA==", - "dependencies": { - "@babel/runtime": "^7.0.0", - "focus-lock": "^0.11.6", - "prop-types": "^15.6.2", - "react-clientside-effect": "^1.2.6", - "use-callback-ref": "^1.3.0", - "use-sidecar": "^1.1.2" - }, - "peerDependencies": { - "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } + "integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==", + "peer": true }, "node_modules/react-hook-form": { "version": "7.53.0", @@ -24521,51 +24609,6 @@ "node": ">=0.10.0" } }, - "node_modules/react-remove-scroll": { - "version": "2.5.6", - "resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.5.6.tgz", - "integrity": "sha512-bO856ad1uDYLefgArk559IzUNeQ6SWH4QnrevIUjH+GczV56giDfl3h0Idptf2oIKxQmd1p9BN25jleKodTALg==", - "dependencies": { - "react-remove-scroll-bar": "^2.3.4", - "react-style-singleton": "^2.2.1", - "tslib": "^2.1.0", - "use-callback-ref": "^1.3.0", - "use-sidecar": "^1.1.2" - }, - "engines": { - "node": ">=10" - }, - "peerDependencies": { - "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/react-remove-scroll-bar": { - "version": "2.3.4", - "resolved": "https://registry.npmjs.org/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.4.tgz", - "integrity": "sha512-63C4YQBUt0m6ALadE9XV56hV8BgJWDmmTPY758iIJjfQKt2nYwoUrPk0LXRXcB/yIj82T1/Ixfdpdk68LwIB0A==", - "dependencies": { - "react-style-singleton": "^2.2.1", - "tslib": "^2.0.0" - }, - "engines": { - "node": ">=10" - }, - "peerDependencies": { - "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, "node_modules/react-select": { "version": "5.8.0", "resolved": "https://registry.npmjs.org/react-select/-/react-select-5.8.0.tgz", @@ -24587,28 +24630,6 @@ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" } }, - "node_modules/react-style-singleton": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.1.tgz", - "integrity": "sha512-ZWj0fHEMyWkHzKYUr2Bs/4zU6XLmq9HsgBURm7g5pAVfyn49DgUiNgY2d4lXRlYSiCif9YBGpQleewkcqddc7g==", - "dependencies": { - "get-nonce": "^1.0.0", - "invariant": "^2.2.4", - "tslib": "^2.0.0" - }, - "engines": { - "node": ">=10" - }, - "peerDependencies": { - "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, "node_modules/react-transition-group": { "version": "4.4.5", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", @@ -26797,6 +26818,11 @@ "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==", "dev": true }, + "node_modules/tabbable": { + "version": "6.2.0", + "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz", + "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==" + }, "node_modules/tailwindcss": { "version": "3.4.10", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.10.tgz", @@ -27262,11 +27288,6 @@ "node": ">=8.0" } }, - "node_modules/toggle-selection": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/toggle-selection/-/toggle-selection-1.0.6.tgz", - "integrity": "sha512-BiZS+C1OS8g/q2RRbJmy59xpyghNBqrr6k5L/uKBGRsTfxmu3ffiRnd8mlGPUVayg8pvfi5urfnu8TU7DVOkLQ==" - }, "node_modules/toidentifier": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz", @@ -28501,6 +28522,11 @@ "browserslist": ">= 4.21.0" } }, + "node_modules/uqr": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/uqr/-/uqr-0.1.2.tgz", + "integrity": "sha512-MJu7ypHq6QasgF5YRTjqscSzQp/W11zoUk6kvmlH+fmWEs63Y0Eib13hYFwAzagRJcVY8WVnlV+eBDUGMJ5IbA==" + }, "node_modules/uri-js": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", @@ -28535,26 +28561,6 @@ "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==", "dev": true }, - "node_modules/use-callback-ref": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.3.0.tgz", - "integrity": "sha512-3FT9PRuRdbB9HfXhEq35u4oZkvpJ5kuYbpqhCfmiZyReuRgpnhDlbr2ZEnnuS0RrJAPn6l23xjFg9kpDM+Ms7w==", - "dependencies": { - "tslib": "^2.0.0" - }, - "engines": { - "node": ">=10" - }, - "peerDependencies": { - "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, "node_modules/use-isomorphic-layout-effect": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz", @@ -28569,27 +28575,6 @@ } } }, - "node_modules/use-sidecar": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/use-sidecar/-/use-sidecar-1.1.2.tgz", - "integrity": "sha512-epTbsLuzZ7lPClpz2TyryBfztm7m+28DlEv2ZCQ3MDr5ssiwyOwGH/e5F9CkfWjJ1t4clvI58yF822/GUkjjhw==", - "dependencies": { - "detect-node-es": "^1.1.0", - "tslib": "^2.0.0" - }, - "engines": { - "node": ">=10" - }, - "peerDependencies": { - "@types/react": "^16.9.0 || ^17.0.0 || ^18.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, "node_modules/use-sync-external-store": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz", diff --git a/app/package.json b/app/package.json index 5b4c6b20c..0288e3284 100644 --- a/app/package.json +++ b/app/package.json @@ -37,7 +37,8 @@ "@ai-sdk/openai": "^1.0.8", "@chakra-ui/icons": "^2.1.0", "@chakra-ui/next-js": "^2.2.0", - "@chakra-ui/react": "^2.8.2", + "@chakra-ui/react": "^3.2.5", + "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", "@next/env": "^14.2.5", "@nivo/bar": "^0.88.0", @@ -77,7 +78,6 @@ "exceljs": "^4.4.0", "fetch-blob": "^4.0.0", "fetch-mock": "^11.1.5", - "framer-motion": "^11.11.17", "geojson": "^0.5.0", "http-errors": "^2.0.0", "i18next": "^23.13.0", From 9ae16ed9c94589a1507cf4e2f7b83fb3709344f8 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 6 Jan 2025 15:38:09 +0200 Subject: [PATCH 002/190] update: adds component snippets using cli --- app/package-lock.json | 18 ++++-- app/package.json | 3 +- app/src/components/ui/avatar.tsx | 74 +++++++++++++++++++++++ app/src/components/ui/button.tsx | 40 +++++++++++++ app/src/components/ui/checkbox.tsx | 25 ++++++++ app/src/components/ui/close-button.tsx | 17 ++++++ app/src/components/ui/color-mode.tsx | 67 +++++++++++++++++++++ app/src/components/ui/dialog.tsx | 62 +++++++++++++++++++ app/src/components/ui/drawer.tsx | 52 ++++++++++++++++ app/src/components/ui/field.tsx | 33 +++++++++++ app/src/components/ui/input-group.tsx | 53 +++++++++++++++++ app/src/components/ui/popover.tsx | 59 ++++++++++++++++++ app/src/components/ui/provider.tsx | 15 +++++ app/src/components/ui/radio.tsx | 24 ++++++++ app/src/components/ui/slider.tsx | 82 ++++++++++++++++++++++++++ app/src/components/ui/tooltip.tsx | 46 +++++++++++++++ 16 files changed, 665 insertions(+), 5 deletions(-) create mode 100644 app/src/components/ui/avatar.tsx create mode 100644 app/src/components/ui/button.tsx create mode 100644 app/src/components/ui/checkbox.tsx create mode 100644 app/src/components/ui/close-button.tsx create mode 100644 app/src/components/ui/color-mode.tsx create mode 100644 app/src/components/ui/dialog.tsx create mode 100644 app/src/components/ui/drawer.tsx create mode 100644 app/src/components/ui/field.tsx create mode 100644 app/src/components/ui/input-group.tsx create mode 100644 app/src/components/ui/popover.tsx create mode 100644 app/src/components/ui/provider.tsx create mode 100644 app/src/components/ui/radio.tsx create mode 100644 app/src/components/ui/slider.tsx create mode 100644 app/src/components/ui/tooltip.tsx diff --git a/app/package-lock.json b/app/package-lock.json index 9e1b446b5..400d97069 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -64,6 +64,7 @@ "lodash.uniqby": "^4.7.0", "next": "^14.2.17", "next-auth": "^4.24.10", + "next-themes": "^0.4.4", "nodemailer": "^6.9.13", "openai": "^4.68.1", "pg": "^8.13.0", @@ -77,7 +78,7 @@ "react-email": "^3.0.2", "react-hook-form": "^7.53.0", "react-i18next": "^15.0.1", - "react-icons": "^5.3.0", + "react-icons": "^5.4.0", "react-intersection-observer": "^9.8.2", "react-markdown": "^9.0.1", "react-redux": "^9.1.2", @@ -21947,6 +21948,15 @@ "uuid": "dist/bin/uuid" } }, + "node_modules/next-themes": { + "version": "0.4.4", + "resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.4.4.tgz", + "integrity": "sha512-LDQ2qIOJF0VnuVrrMSMLrWGjRMkq+0mpgl6e0juCLqdJ+oo8Q84JRWT6Wh11VDQKkMMe+dVzDKLWs5n87T+PkQ==", + "peerDependencies": { + "react": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc" + } + }, "node_modules/next-tick": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz", @@ -24514,9 +24524,9 @@ } }, "node_modules/react-icons": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.3.0.tgz", - "integrity": "sha512-DnUk8aFbTyQPSkCfF8dbX6kQjXA9DktMeJqfjrg6cK9vwQVMxmcA3BfP4QoiztVmEHtwlTgLFsPuH2NskKT6eg==", + "version": "5.4.0", + "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.4.0.tgz", + "integrity": "sha512-7eltJxgVt7X64oHh6wSWNwwbKTCtMfK35hcjvJS0yxEAhPM8oUKdS3+kqaW1vicIltw+kR2unHaa12S9pPALoQ==", "peerDependencies": { "react": "*" } diff --git a/app/package.json b/app/package.json index 0288e3284..62dd1e0c1 100644 --- a/app/package.json +++ b/app/package.json @@ -90,6 +90,7 @@ "lodash.uniqby": "^4.7.0", "next": "^14.2.17", "next-auth": "^4.24.10", + "next-themes": "^0.4.4", "nodemailer": "^6.9.13", "openai": "^4.68.1", "pg": "^8.13.0", @@ -103,7 +104,7 @@ "react-email": "^3.0.2", "react-hook-form": "^7.53.0", "react-i18next": "^15.0.1", - "react-icons": "^5.3.0", + "react-icons": "^5.4.0", "react-intersection-observer": "^9.8.2", "react-markdown": "^9.0.1", "react-redux": "^9.1.2", diff --git a/app/src/components/ui/avatar.tsx b/app/src/components/ui/avatar.tsx new file mode 100644 index 000000000..cd84664ae --- /dev/null +++ b/app/src/components/ui/avatar.tsx @@ -0,0 +1,74 @@ +"use client" + +import type { GroupProps, SlotRecipeProps } from "@chakra-ui/react" +import { Avatar as ChakraAvatar, Group } from "@chakra-ui/react" +import * as React from "react" + +type ImageProps = React.ImgHTMLAttributes + +export interface AvatarProps extends ChakraAvatar.RootProps { + name?: string + src?: string + srcSet?: string + loading?: ImageProps["loading"] + icon?: React.ReactElement + fallback?: React.ReactNode +} + +export const Avatar = React.forwardRef( + function Avatar(props, ref) { + const { name, src, srcSet, loading, icon, fallback, children, ...rest } = + props + return ( + + + {fallback} + + + {children} + + ) + }, +) + +interface AvatarFallbackProps extends ChakraAvatar.FallbackProps { + name?: string + icon?: React.ReactElement +} + +const AvatarFallback = React.forwardRef( + function AvatarFallback(props, ref) { + const { name, icon, children, ...rest } = props + return ( + + {children} + {name != null && children == null && <>{getInitials(name)}} + {name == null && children == null && ( + {icon} + )} + + ) + }, +) + +function getInitials(name: string) { + const names = name.trim().split(" ") + const firstName = names[0] != null ? names[0] : "" + const lastName = names.length > 1 ? names[names.length - 1] : "" + return firstName && lastName + ? `${firstName.charAt(0)}${lastName.charAt(0)}` + : firstName.charAt(0) +} + +interface AvatarGroupProps extends GroupProps, SlotRecipeProps<"avatar"> {} + +export const AvatarGroup = React.forwardRef( + function AvatarGroup(props, ref) { + const { size, variant, borderless, ...rest } = props + return ( + + + + ) + }, +) diff --git a/app/src/components/ui/button.tsx b/app/src/components/ui/button.tsx new file mode 100644 index 000000000..21d5f4b55 --- /dev/null +++ b/app/src/components/ui/button.tsx @@ -0,0 +1,40 @@ +import type { ButtonProps as ChakraButtonProps } from "@chakra-ui/react" +import { + AbsoluteCenter, + Button as ChakraButton, + Span, + Spinner, +} from "@chakra-ui/react" +import * as React from "react" + +interface ButtonLoadingProps { + loading?: boolean + loadingText?: React.ReactNode +} + +export interface ButtonProps extends ChakraButtonProps, ButtonLoadingProps {} + +export const Button = React.forwardRef( + function Button(props, ref) { + const { loading, disabled, loadingText, children, ...rest } = props + return ( + + {loading && !loadingText ? ( + <> + + + + {children} + + ) : loading && loadingText ? ( + <> + + {loadingText} + + ) : ( + children + )} + + ) + }, +) diff --git a/app/src/components/ui/checkbox.tsx b/app/src/components/ui/checkbox.tsx new file mode 100644 index 000000000..2a27c2ffb --- /dev/null +++ b/app/src/components/ui/checkbox.tsx @@ -0,0 +1,25 @@ +import { Checkbox as ChakraCheckbox } from "@chakra-ui/react" +import * as React from "react" + +export interface CheckboxProps extends ChakraCheckbox.RootProps { + icon?: React.ReactNode + inputProps?: React.InputHTMLAttributes + rootRef?: React.Ref +} + +export const Checkbox = React.forwardRef( + function Checkbox(props, ref) { + const { icon, children, inputProps, rootRef, ...rest } = props + return ( + + + + {icon || } + + {children != null && ( + {children} + )} + + ) + }, +) diff --git a/app/src/components/ui/close-button.tsx b/app/src/components/ui/close-button.tsx new file mode 100644 index 000000000..94af48859 --- /dev/null +++ b/app/src/components/ui/close-button.tsx @@ -0,0 +1,17 @@ +import type { ButtonProps } from "@chakra-ui/react" +import { IconButton as ChakraIconButton } from "@chakra-ui/react" +import * as React from "react" +import { LuX } from "react-icons/lu" + +export type CloseButtonProps = ButtonProps + +export const CloseButton = React.forwardRef< + HTMLButtonElement, + CloseButtonProps +>(function CloseButton(props, ref) { + return ( + + {props.children ?? } + + ) +}) diff --git a/app/src/components/ui/color-mode.tsx b/app/src/components/ui/color-mode.tsx new file mode 100644 index 000000000..a34b9689c --- /dev/null +++ b/app/src/components/ui/color-mode.tsx @@ -0,0 +1,67 @@ +"use client" + +import type { IconButtonProps } from "@chakra-ui/react" +import { ClientOnly, IconButton, Skeleton } from "@chakra-ui/react" +import { ThemeProvider, useTheme } from "next-themes" +import type { ThemeProviderProps } from "next-themes" +import * as React from "react" +import { LuMoon, LuSun } from "react-icons/lu" + +export interface ColorModeProviderProps extends ThemeProviderProps {} + +export function ColorModeProvider(props: ColorModeProviderProps) { + return ( + + ) +} + +export function useColorMode() { + const { resolvedTheme, setTheme } = useTheme() + const toggleColorMode = () => { + setTheme(resolvedTheme === "light" ? "dark" : "light") + } + return { + colorMode: resolvedTheme, + setColorMode: setTheme, + toggleColorMode, + } +} + +export function useColorModeValue(light: T, dark: T) { + const { colorMode } = useColorMode() + return colorMode === "light" ? light : dark +} + +export function ColorModeIcon() { + const { colorMode } = useColorMode() + return colorMode === "light" ? : +} + +interface ColorModeButtonProps extends Omit {} + +export const ColorModeButton = React.forwardRef< + HTMLButtonElement, + ColorModeButtonProps +>(function ColorModeButton(props, ref) { + const { toggleColorMode } = useColorMode() + return ( + }> + + + + + ) +}) diff --git a/app/src/components/ui/dialog.tsx b/app/src/components/ui/dialog.tsx new file mode 100644 index 000000000..89d68a5de --- /dev/null +++ b/app/src/components/ui/dialog.tsx @@ -0,0 +1,62 @@ +import { Dialog as ChakraDialog, Portal } from "@chakra-ui/react" +import { CloseButton } from "./close-button" +import * as React from "react" + +interface DialogContentProps extends ChakraDialog.ContentProps { + portalled?: boolean + portalRef?: React.RefObject + backdrop?: boolean +} + +export const DialogContent = React.forwardRef< + HTMLDivElement, + DialogContentProps +>(function DialogContent(props, ref) { + const { + children, + portalled = true, + portalRef, + backdrop = true, + ...rest + } = props + + return ( + + {backdrop && } + + + {children} + + + + ) +}) + +export const DialogCloseTrigger = React.forwardRef< + HTMLButtonElement, + ChakraDialog.CloseTriggerProps +>(function DialogCloseTrigger(props, ref) { + return ( + + + {props.children} + + + ) +}) + +export const DialogRoot = ChakraDialog.Root +export const DialogFooter = ChakraDialog.Footer +export const DialogHeader = ChakraDialog.Header +export const DialogBody = ChakraDialog.Body +export const DialogBackdrop = ChakraDialog.Backdrop +export const DialogTitle = ChakraDialog.Title +export const DialogDescription = ChakraDialog.Description +export const DialogTrigger = ChakraDialog.Trigger +export const DialogActionTrigger = ChakraDialog.ActionTrigger diff --git a/app/src/components/ui/drawer.tsx b/app/src/components/ui/drawer.tsx new file mode 100644 index 000000000..ccb96c80a --- /dev/null +++ b/app/src/components/ui/drawer.tsx @@ -0,0 +1,52 @@ +import { Drawer as ChakraDrawer, Portal } from "@chakra-ui/react" +import { CloseButton } from "./close-button" +import * as React from "react" + +interface DrawerContentProps extends ChakraDrawer.ContentProps { + portalled?: boolean + portalRef?: React.RefObject + offset?: ChakraDrawer.ContentProps["padding"] +} + +export const DrawerContent = React.forwardRef< + HTMLDivElement, + DrawerContentProps +>(function DrawerContent(props, ref) { + const { children, portalled = true, portalRef, offset, ...rest } = props + return ( + + + + {children} + + + + ) +}) + +export const DrawerCloseTrigger = React.forwardRef< + HTMLButtonElement, + ChakraDrawer.CloseTriggerProps +>(function DrawerCloseTrigger(props, ref) { + return ( + + + + ) +}) + +export const DrawerTrigger = ChakraDrawer.Trigger +export const DrawerRoot = ChakraDrawer.Root +export const DrawerFooter = ChakraDrawer.Footer +export const DrawerHeader = ChakraDrawer.Header +export const DrawerBody = ChakraDrawer.Body +export const DrawerBackdrop = ChakraDrawer.Backdrop +export const DrawerDescription = ChakraDrawer.Description +export const DrawerTitle = ChakraDrawer.Title +export const DrawerActionTrigger = ChakraDrawer.ActionTrigger diff --git a/app/src/components/ui/field.tsx b/app/src/components/ui/field.tsx new file mode 100644 index 000000000..dd3b66f10 --- /dev/null +++ b/app/src/components/ui/field.tsx @@ -0,0 +1,33 @@ +import { Field as ChakraField } from "@chakra-ui/react" +import * as React from "react" + +export interface FieldProps extends Omit { + label?: React.ReactNode + helperText?: React.ReactNode + errorText?: React.ReactNode + optionalText?: React.ReactNode +} + +export const Field = React.forwardRef( + function Field(props, ref) { + const { label, children, helperText, errorText, optionalText, ...rest } = + props + return ( + + {label && ( + + {label} + + + )} + {children} + {helperText && ( + {helperText} + )} + {errorText && ( + {errorText} + )} + + ) + }, +) diff --git a/app/src/components/ui/input-group.tsx b/app/src/components/ui/input-group.tsx new file mode 100644 index 000000000..5d8fb32ad --- /dev/null +++ b/app/src/components/ui/input-group.tsx @@ -0,0 +1,53 @@ +import type { BoxProps, InputElementProps } from "@chakra-ui/react" +import { Group, InputElement } from "@chakra-ui/react" +import * as React from "react" + +export interface InputGroupProps extends BoxProps { + startElementProps?: InputElementProps + endElementProps?: InputElementProps + startElement?: React.ReactNode + endElement?: React.ReactNode + children: React.ReactElement + startOffset?: InputElementProps["paddingStart"] + endOffset?: InputElementProps["paddingEnd"] +} + +export const InputGroup = React.forwardRef( + function InputGroup(props, ref) { + const { + startElement, + startElementProps, + endElement, + endElementProps, + children, + startOffset = "6px", + endOffset = "6px", + ...rest + } = props + + const child = + React.Children.only>(children) + + return ( + + {startElement && ( + + {startElement} + + )} + {React.cloneElement(child, { + ...(startElement && { + ps: `calc(var(--input-height) - ${startOffset})`, + }), + ...(endElement && { pe: `calc(var(--input-height) - ${endOffset})` }), + ...children.props, + })} + {endElement && ( + + {endElement} + + )} + + ) + }, +) diff --git a/app/src/components/ui/popover.tsx b/app/src/components/ui/popover.tsx new file mode 100644 index 000000000..3320659db --- /dev/null +++ b/app/src/components/ui/popover.tsx @@ -0,0 +1,59 @@ +import { Popover as ChakraPopover, Portal } from "@chakra-ui/react" +import { CloseButton } from "./close-button" +import * as React from "react" + +interface PopoverContentProps extends ChakraPopover.ContentProps { + portalled?: boolean + portalRef?: React.RefObject +} + +export const PopoverContent = React.forwardRef< + HTMLDivElement, + PopoverContentProps +>(function PopoverContent(props, ref) { + const { portalled = true, portalRef, ...rest } = props + return ( + + + + + + ) +}) + +export const PopoverArrow = React.forwardRef< + HTMLDivElement, + ChakraPopover.ArrowProps +>(function PopoverArrow(props, ref) { + return ( + + + + ) +}) + +export const PopoverCloseTrigger = React.forwardRef< + HTMLButtonElement, + ChakraPopover.CloseTriggerProps +>(function PopoverCloseTrigger(props, ref) { + return ( + + + + ) +}) + +export const PopoverTitle = ChakraPopover.Title +export const PopoverDescription = ChakraPopover.Description +export const PopoverFooter = ChakraPopover.Footer +export const PopoverHeader = ChakraPopover.Header +export const PopoverRoot = ChakraPopover.Root +export const PopoverBody = ChakraPopover.Body +export const PopoverTrigger = ChakraPopover.Trigger diff --git a/app/src/components/ui/provider.tsx b/app/src/components/ui/provider.tsx new file mode 100644 index 000000000..fd0331bf9 --- /dev/null +++ b/app/src/components/ui/provider.tsx @@ -0,0 +1,15 @@ +"use client" + +import { ChakraProvider, defaultSystem } from "@chakra-ui/react" +import { + ColorModeProvider, + type ColorModeProviderProps, +} from "./color-mode" + +export function Provider(props: ColorModeProviderProps) { + return ( + + + + ) +} diff --git a/app/src/components/ui/radio.tsx b/app/src/components/ui/radio.tsx new file mode 100644 index 000000000..b3919d08c --- /dev/null +++ b/app/src/components/ui/radio.tsx @@ -0,0 +1,24 @@ +import { RadioGroup as ChakraRadioGroup } from "@chakra-ui/react" +import * as React from "react" + +export interface RadioProps extends ChakraRadioGroup.ItemProps { + rootRef?: React.Ref + inputProps?: React.InputHTMLAttributes +} + +export const Radio = React.forwardRef( + function Radio(props, ref) { + const { children, inputProps, rootRef, ...rest } = props + return ( + + + + {children && ( + {children} + )} + + ) + }, +) + +export const RadioGroup = ChakraRadioGroup.Root diff --git a/app/src/components/ui/slider.tsx b/app/src/components/ui/slider.tsx new file mode 100644 index 000000000..55a7283bc --- /dev/null +++ b/app/src/components/ui/slider.tsx @@ -0,0 +1,82 @@ +import { Slider as ChakraSlider, For, HStack } from "@chakra-ui/react" +import * as React from "react" + +export interface SliderProps extends ChakraSlider.RootProps { + marks?: Array + label?: React.ReactNode + showValue?: boolean +} + +export const Slider = React.forwardRef( + function Slider(props, ref) { + const { marks: marksProp, label, showValue, ...rest } = props + const value = props.defaultValue ?? props.value + + const marks = marksProp?.map((mark) => { + if (typeof mark === "number") return { value: mark, label: undefined } + return mark + }) + + const hasMarkLabel = !!marks?.some((mark) => mark.label) + + return ( + + {label && !showValue && ( + {label} + )} + {label && showValue && ( + + {label} + + + )} + + + + + + + + + ) + }, +) + +function SliderThumbs(props: { value?: number[] }) { + const { value } = props + return ( + + {(_, index) => ( + + + + )} + + ) +} + +interface SliderMarksProps { + marks?: Array +} + +const SliderMarks = React.forwardRef( + function SliderMarks(props, ref) { + const { marks } = props + if (!marks?.length) return null + + return ( + + {marks.map((mark, index) => { + const value = typeof mark === "number" ? mark : mark.value + const label = typeof mark === "number" ? undefined : mark.label + return ( + + + {label} + + ) + })} + + ) + }, +) diff --git a/app/src/components/ui/tooltip.tsx b/app/src/components/ui/tooltip.tsx new file mode 100644 index 000000000..644c37cee --- /dev/null +++ b/app/src/components/ui/tooltip.tsx @@ -0,0 +1,46 @@ +import { Tooltip as ChakraTooltip, Portal } from "@chakra-ui/react" +import * as React from "react" + +export interface TooltipProps extends ChakraTooltip.RootProps { + showArrow?: boolean + portalled?: boolean + portalRef?: React.RefObject + content: React.ReactNode + contentProps?: ChakraTooltip.ContentProps + disabled?: boolean +} + +export const Tooltip = React.forwardRef( + function Tooltip(props, ref) { + const { + showArrow, + children, + disabled, + portalled, + content, + contentProps, + portalRef, + ...rest + } = props + + if (disabled) return children + + return ( + + {children} + + + + {showArrow && ( + + + + )} + {content} + + + + + ) + }, +) From f5c309b6fd46279378cf0658ac5abf4efc1b57ef Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 6 Jan 2025 16:44:54 +0200 Subject: [PATCH 003/190] update(styling): migrates tokens to v3 style guide --- app/src/lib/app-theme.ts | 1070 +++++++++++++++++++------------------- 1 file changed, 538 insertions(+), 532 deletions(-) diff --git a/app/src/lib/app-theme.ts b/app/src/lib/app-theme.ts index f890dcd94..a10e54a0e 100644 --- a/app/src/lib/app-theme.ts +++ b/app/src/lib/app-theme.ts @@ -1,562 +1,568 @@ -import { extendTheme, theme } from "@chakra-ui/react"; +import { createSystem, defaultConfig } from "@chakra-ui/react"; -export const appTheme = extendTheme({ - colors: { - brand: { - primary: "#001EA7", - secondary: "#2351DC", - }, - - content: { - primary: "#00001F", - secondary: "#00001F", - tertiary: "#4B4C63", - link: "#2351DC", - alternative: "#001EA7", - }, - - semantic: { - success: "#24BE00", - successOverlay: "#EFFDE5", - warning: "#C98300", - warningOverlay: "#FEF8E1", - danger: "#F23D33", - dangerOverlay: "#FFEAEE", - info: "#2351DC", - }, - - base: { - light: "#FFFFFF", - dark: "#00001F", - }, - - border: { - neutral: "#D7D8FA", - overlay: "#E6E7FF", - }, - divider: { - neutral: "#F0F0F0", - }, - - background: { - default: "#FFFFFF", - neutral: "#E8EAFB", - alternative: "#EFFDE5", - overlay: "#C5CBF5", - transparentGrey: "rgba(232, 234, 251, 0.20)", - backgroundLight: "#FAFAFA", - backgroundGreyFlat: "#FAFBFE", - backgroundLoading: "#E8EAFB", - }, - - interactive: { - primary: "#008600", - primaryLight: "#61c261", - accent: "#5FE500", - secondary: "#2351DC", - tertiary: "#24BE00", - quaternary: "#F17105", - control: "#7A7B9A", - connected: "#FA7200", - }, - - sentiment: { - positiveOverlay: "#EFFDE5", - positiveLight: "#f0f7eb", - positiveDark: "#b9cfa9", - positiveDefault: "#24BE00", - warningDefault: "#C98300", - warningOverlay: "#FEF8E1", - negativeDefault: "#F23D33", - negativeOverlay: "#FFEAEE", - }, - - brandScheme: { - 100: "#C5CBF5", - 500: "#2351DC", - }, - - body: "#232640", - }, - - fonts: { - heading: "var(--font-poppins)", - body: "var(--font-opensans)", - }, - - fontSizes: { - display: { - xl: "140px", - lg: "57px", - md: "45px", - sm: "36px", - }, - - headline: { - lg: "32px", - md: "28px", - sm: "24px", - }, - - title: { - lg: "22px", - md: "16px", - sm: "14px", - }, - - label: { - lg: "14px", - md: "12px", - sm: "11px", - }, - - body: { - xl: "22px", - lg: "16px", - md: "14px", - sm: "12px", - }, - - button: { - lg: "20px", - md: "14px", - sm: "12px", - }, - - caption: "12px", - overline: "10px", - }, - - fontWeights: { - hairline: 100, - thin: 200, - light: 300, - regular: 400, - medium: 500, - semibold: 600, - bold: 700, - }, - - lineHeights: { - normal: "normal", - none: 1, - "64": "64px", - "52": "52px", - "44": "44px", - "40": "40px", - "36": "36px", - "32": "32px", - "28": "28px", - "24": "24px", - "20": "20px", - "16": "16px", - }, - - letterSpacing: { - normal: 0, - wide: "0.5px", - wider: "1.25px", - widest: "1.5px", - }, - - spacing: { - xs: "4px", - s: "8px", - m: "16px", - l: "24px", - xl: "32px", - xxl: "40px", - "xxl-2": "48px", - "xxl-3": "56px", - "xxl-4": "64px", - "xxl-5": "72px", - "xxl-6": "80px", - }, - - shadows: { - "1dp": "0px 1px 2px -1px #0000001A, 0px 1px 3px 0px #00001F1A", - "2dp": "0px 2px 4px -2px #0000001A, 0px 4px 6px -1px #0000001A", - "4dp": "0px 4px 6px -4px #0000001A, 0px 10px 15px -3px #0000001A", - "8dp": "0px 8px 10px -6px #0000001A, 0px 20px 25px -5px #0000001A", - "12dp": "0px 25px 50px -12px #00000040", - }, - - borderRadius: { - full: "50%", - minimal: "4px", - rounded: "8px", - "rounded-xl": "16px", - "rounded-xxl": "20px", - }, - borders: { - inputBox: " 1px solid #D7D8FB", - }, - /* - breakpoints: { - xs: "360px", - sm: "600px", - md: "905px", - lg: "1240px", - xl: "1440px", - }, - */ - - components: { - Button: { - baseStyle: { - textTransform: "uppercase", - borderRadius: 50, - fontFamily: "var(--font-poppins)", - letterSpacing: "1.25px", - lineHeight: "16px", - }, - variants: { - outline: { - border: "2px solid", - borderColor: "interactive.secondary", - color: "interactive.secondary", - _hover: { - borderColor: "#5a7be0", - color: "#5a7be0", - }, - _active: { - borderColor: "#899ee0", - color: "#899ee0", - }, - _loading: { - opacity: 0.8, - }, +export const appTheme = createSystem(defaultConfig, +{ + theme: { + tokens: { + colors: { + brand: { + primary: {value:"#001EA7"}, + secondary: {value:"#2351DC"}, + }, + + content: { + primary: {value:"#00001F"}, + secondary: {value:"#00001F"}, + tertiary: {value:"#4B4C63"}, + link: {value:"#2351DC"}, + alternative: {value:"#001EA7"}, + }, + + semantic: { + success: {value:"#24BE00"}, + successOverlay: {value:"#EFFDE5"}, + warning: {value:"#C98300"}, + warningOverlay: {value:"#FEF8E1"}, + danger: {value:"#F23D33"}, + dangerOverlay: {value:"#FFEAEE"}, + info: {value:"#2351DC"}, + }, + + base: { + light: {value:"#FFFFFF"}, + dark: {value:"#00001F"}, + }, + + border: { + neutral: {value:"#D7D8FA"}, + overlay: {value:"#E6E7FF"}, + }, + divider: { + neutral: {value:"#F0F0F0"}, + }, + + background: { + default: {value:"#FFFFFF"}, + neutral: {value:"#E8EAFB"}, + alternative: {value:"#EFFDE5"}, + overlay: {value:"#C5CBF5"}, + transparentGrey: {value: "rgba(232, 234, 251, 0.20)"}, + backgroundLight: {value:"#FAFAFA"}, + backgroundGreyFlat: {value:"#FAFBFE"}, + backgroundLoading: {value:"#E8EAFB"}, + }, + + interactive: { + primary: {value:"#008600"}, + primaryLight: {value:"#61c261"}, + accent: {value:"#5FE500"}, + secondary: {value:"#2351DC"}, + tertiary: {value:"#24BE00"}, + quaternary: {value:"#F17105"}, + control: {value:"#7A7B9A"}, + connected: {value:"#FA7200"}, + }, + + sentiment: { + positiveOverlay: {value:"#EFFDE5"}, + positiveLight: {value:"#f0f7eb"}, + positiveDark: {value:"#b9cfa9"}, + positiveDefault: {value:"#24BE00"}, + warningDefault: {value:"#C98300"}, + warningOverlay: {value:"#FEF8E1"}, + negativeDefault: {value:"#F23D33"}, + negativeOverlay: {value:"#FFEAEE"}, + }, + + brandScheme: { + 100: {value:"#C5CBF5"}, + 500: {value:"#2351DC"}, + }, + + body: {value:"#232640"}, }, - solid: { - bg: "interactive.secondary", - color: "white", - _hover: { - bg: "#5a7be0", - }, - _active: { - bg: "#899ee0", - }, - _loading: { - bg: "background.overlay", - color: "content.link", - _hover: { - bg: "#5a7be0", - color: "base.light", - }, - }, + + fonts: { + heading: {value:"var(--font-poppins)"}, + body: {value:"var(--font-opensans)"}, }, - danger: { - bg: "sentiment.negativeDefault", // #F23D33 - color: "white", - _hover: { - bg: "#FF5F5F", - }, - _active: { - bg: "#E3241A", - }, - _loading: { - bg: "semantic.dangerOverlay", - color: "base.dark", - _hover: { - bg: "#E3241A", - color: "base.light", - }, + + fontSizes: { + display: { + xl: {value: "140px"}, + lg: {value:"57px"}, + md: {value: "45px"}, + sm: {value: "36px"}, + }, + + headline: { + lg: {value:"32px"}, + md: {value: "28px"}, + sm: {value: "24px"}, + }, + + title: { + lg: {value: "22px"}, + md: {value: "16px"}, + sm: {value: "14px"}, + }, + + label: { + lg: {value: "14px"}, + md: {value: "12px"}, + sm: {value: "11px"}, + }, + + body: { + xl: {value: "22px"}, + lg: {value: "16px"}, + md: {value: "14px"}, + sm: {value: "12px"}, + }, + + button: { + lg: {value: "20px"}, + md: {value: "14px"}, + sm: {value: "12px"}, }, + + caption: {value: "12px"}, + overline: {value: "10px"}, }, - solidPrimary: { - ...theme.components.Button.variants?.solid, - bg: "sentiment.positiveOverlay", - color: "interactive.primary", - _hover: { - bg: "sentiment.positiveLight", - color: "interactive.primaryLight", - }, - _active: { - bg: "sentiment.positiveDark", - color: "sentiment.positiveOverlay", - }, - _loading: { - opacity: 0.8, - bg: "sentiment.positiveLight", - }, + + fontWeights: { + hairline: {value:100}, + thin: {value:200}, + light: {value:300}, + regular: {value:400}, + medium: {value:500}, + semibold: {value:600}, + bold: {value:700}, }, - ghost: { - color: "content.link", + + lineHeights: { + normal: {value: "normal"}, + none: {value: 1}, + "64": {value: "64px"}, + "52": {value: "52px"}, + "44": {value: "44px"}, + "40": {value: "40px"}, + "36": {value: "36px"}, + "32": {value: "32px"}, + "28": {value: "28px"}, + "24": {value: "24px"}, + "20": {value: "20px"}, + "16": {value: "16px"}, }, - lightGhost: { - color: "base.light", - _hover: { - bg: "background.transparentGrey", - color: "base.light", - }, + + letterSpacings: { + normal: {value: 0}, + wide: {value: "0.5px"}, + wider: {value: "1.25px"}, + widest: {value: "1.5px"}, }, - solidIcon: { - bgColor: "background.neutral", - color: "interactive.secondary", - _hover: { - color: "white", - bg: "#5a7be0", - }, - _active: { - bg: "#899ee0", - }, - _loading: { - opacity: 0.8, - bg: "background.neutral", - }, + + spacing: { + xs: {value: "4px"}, + s: {value: "8px"}, + m: {value: "16px"}, + l: {value: "24px"}, + xl: {value: "32px"}, + xxl: {value: "40px"}, + "xxl-2": {value: "48px"}, + "xxl-3": {value: "56px"}, + "xxl-4": {value: "64px"}, + "xxl-5": {value: "72px"}, + "xxl-6": {value: "80px"}, }, - }, - }, - Link: { - baseStyle: { - color: "brand.secondary", - }, - }, - Card: { - baseStyle: { - container: { - borderRadius: 8, - px: 6, - py: 8, + + shadows: { + "1dp": {value: "0px 1px 2px -1px #0000001A, 0px 1px 3px 0px #00001F1A"}, + "2dp": {value: "0px 2px 4px -2px #0000001A, 0px 4px 6px -1px #0000001A"}, + "4dp": {value: "0px 4px 6px -4px #0000001A, 0px 10px 15px -3px #0000001A"}, + "8dp": {value: "0px 8px 10px -6px #0000001A, 0px 20px 25px -5px #0000001A"}, + "12dp": {value: "0px 25px 50px -12px #00000040"}, }, - }, - }, - Tag: { - variants: { - brand: { - container: { - px: 3, - py: 1, - borderRadius: "full", - borderColor: "background.neutral", - borderWidth: 1, - color: "background.neutral", - }, - label: { - color: "content.secondary", - fontFamily: "heading", - fontSize: "14px", - lineHeight: "20px", - letterSpacing: "0.5px", - borderWidth: 0, - mt: -0.5, - }, - }, - filled: { - container: { - px: 4, - py: 1, - borderRadius: "full", - bgColor: "background.neutral", - }, - label: { - color: "content.alternative", - }, + + radii: { + full: {value: "50%"}, + minimal: {value: "4px"}, + rounded: {value: "8px"}, + "rounded-xl": {value: "16px"}, + "rounded-xxl": {value: "20px"}, }, - success: { - container: { - px: 4, - py: 1, - borderRadius: "full", - borderWidth: 1, - borderColor: "sentiment.positiveDefault", - bgColor: "sentiment.positiveOverlay", - color: "sentiment.positiveDefault", - fontWeight: 500, - }, - label: { - color: "sentiment.positiveDefault", - }, + borders: { + inputBox: {value: "1px solid #D7D8FB"}, }, - warning: { - container: { - px: 4, - py: 1, - borderRadius: "full", - borderWidth: 1, - borderColor: "sentiment.warningDefault", - bgColor: "sentiment.warningOverlay", - color: "sentiment.warningDefault", - }, - label: { - color: "sentiment.warningDefault", - }, + /* + breakpoints: { + xs: "360px", + sm: "600px", + md: "905px", + lg: "1240px", + xl: "1440px", }, - low: { - container: { - bgColor: "sentiment.warningOverlay", - borderColor: "sentiment.warningDefault", - borderWidth: 1, - borderRadius: "full", - }, - label: { - color: "sentiment.warningDefault", - fontWeight: "medium", + */ + components: { + Button: { + baseStyle: { + textTransform: "uppercase", + borderRadius: 50, + fontFamily: "var(--font-poppins)", + letterSpacing: "1.25px", + lineHeight: "16px", + }, + variants: { + outline: { + border: "2px solid", + borderColor: "interactive.secondary", + color: "interactive.secondary", + _hover: { + borderColor: "#5a7be0", + color: "#5a7be0", + }, + _active: { + borderColor: "#899ee0", + color: "#899ee0", + }, + _loading: { + opacity: 0.8, + }, + }, + solid: { + bg: "interactive.secondary", + color: "white", + _hover: { + bg: "#5a7be0", + }, + _active: { + bg: "#899ee0", + }, + _loading: { + bg: "background.overlay", + color: "content.link", + _hover: { + bg: "#5a7be0", + color: "base.light", + }, + }, + }, + danger: { + bg: "sentiment.negativeDefault", // #F23D33 + color: "white", + _hover: { + bg: "#FF5F5F", + }, + _active: { + bg: "#E3241A", + }, + _loading: { + bg: "semantic.dangerOverlay", + color: "base.dark", + _hover: { + bg: "#E3241A", + color: "base.light", + }, + }, + }, + solidPrimary: { + // Button.variants?.solid, + bg: "sentiment.positiveOverlay", + color: "interactive.primary", + _hover: { + bg: "sentiment.positiveLight", + color: "interactive.primaryLight", + }, + _active: { + bg: "sentiment.positiveDark", + color: "sentiment.positiveOverlay", + }, + _loading: { + opacity: 0.8, + bg: "sentiment.positiveLight", + }, + }, + ghost: { + color: "content.link", + }, + lightGhost: { + color: "base.light", + _hover: { + bg: "background.transparentGrey", + color: "base.light", + }, + }, + solidIcon: { + bgColor: "background.neutral", + color: "interactive.secondary", + _hover: { + color: "white", + bg: "#5a7be0", + }, + _active: { + bg: "#899ee0", + }, + _loading: { + opacity: 0.8, + bg: "background.neutral", + }, + }, + }, }, - }, - medium: { - container: { - bgColor: "background.neutral", - borderColor: "content.link", - borderWidth: 1, - borderRadius: "full", + Link: { + baseStyle: { + color: "brand.secondary", + }, }, - label: { - color: "content.link", - fontWeight: "medium", + Card: { + baseStyle: { + container: { + borderRadius: 8, + px: 6, + py: 8, + }, + }, }, - }, - high: { - container: { - bgColor: "sentiment.positiveOverlay", - borderColor: "interactive.tertiary", - borderWidth: 1, - borderRadius: "full", + Tag: { + variants: { + brand: { + container: { + px: 3, + py: 1, + borderRadius: "full", + borderColor: "background.neutral", + borderWidth: 1, + color: "background.neutral", + }, + label: { + color: "content.secondary", + fontFamily: "heading", + fontSize: "14px", + lineHeight: "20px", + letterSpacing: "0.5px", + borderWidth: 0, + mt: -0.5, + }, + }, + filled: { + container: { + px: 4, + py: 1, + borderRadius: "full", + bgColor: "background.neutral", + }, + label: { + color: "content.alternative", + }, + }, + success: { + container: { + px: 4, + py: 1, + borderRadius: "full", + borderWidth: 1, + borderColor: "sentiment.positiveDefault", + bgColor: "sentiment.positiveOverlay", + color: "sentiment.positiveDefault", + fontWeight: 500, + }, + label: { + color: "sentiment.positiveDefault", + }, + }, + warning: { + container: { + px: 4, + py: 1, + borderRadius: "full", + borderWidth: 1, + borderColor: "sentiment.warningDefault", + bgColor: "sentiment.warningOverlay", + color: "sentiment.warningDefault", + }, + label: { + color: "sentiment.warningDefault", + }, + }, + low: { + container: { + bgColor: "sentiment.warningOverlay", + borderColor: "sentiment.warningDefault", + borderWidth: 1, + borderRadius: "full", + }, + label: { + color: "sentiment.warningDefault", + fontWeight: "medium", + }, + }, + medium: { + container: { + bgColor: "background.neutral", + borderColor: "content.link", + borderWidth: 1, + borderRadius: "full", + }, + label: { + color: "content.link", + fontWeight: "medium", + }, + }, + high: { + container: { + bgColor: "sentiment.positiveOverlay", + borderColor: "interactive.tertiary", + borderWidth: 1, + borderRadius: "full", + }, + label: { + color: "interactive.tertiary", + fontWeight: "medium", + }, + }, + }, + defaultProps: { + variant: "brand", + }, }, - label: { - color: "interactive.tertiary", - fontWeight: "medium", + Tooltip: { + baseStyle: { + bg: "content.secondary", + color: "base.light", + px: 4, + py: 2, + borderRadius: "lg", + }, }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Tooltip: { - baseStyle: { - bg: "content.secondary", - color: "base.light", - px: 4, - py: 2, - borderRadius: "lg", - }, - }, - Tabs: { - variants: { - line: { - tab: { - borderColor: "#E6E7FF", - _selected: { - color: "interactive.secondary", - borderColor: "interactive.secondary", - fontWeight: "bold", + Tabs: { + variants: { + line: { + tab: { + borderColor: "#E6E7FF", + _selected: { + color: "interactive.secondary", + borderColor: "interactive.secondary", + fontWeight: "bold", + }, + }, + }, }, }, - }, - }, - }, - Accordion: { - variants: { - brand: { - container: { - borderRadius: "8px", - bgColor: "background.transparentGrey", - borderWidth: 0, - px: 4, - py: 4, - mb: 6, + Accordion: { + variants: { + brand: { + container: { + borderRadius: "8px", + bgColor: "background.transparentGrey", + borderWidth: 0, + px: 4, + py: 4, + mb: 6, + }, + button: { + borderRadius: "8px", + }, + }, + }, + defaultProps: { + variant: "brand", + }, }, - button: { - borderRadius: "8px", + Progress: { + baseStyle: { + filledTrack: { + bg: "#24BE00", + }, + }, }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Progress: { - baseStyle: { - filledTrack: { - bg: "#24BE00", - }, - }, - }, - Form: { - variants: { - brand: { - container: { - label: { - fontFamily: "heading", - fontWeight: "500", - lineHeight: "20px", - letterSpacing: "0.5px", - fontSize: "14px", - mb: 4, + Form: { + variants: { + brand: { + container: { + label: { + fontFamily: "heading", + fontWeight: "500", + lineHeight: "20px", + letterSpacing: "0.5px", + fontSize: "14px", + mb: 4, + }, + }, + }, + }, + defaultProps: { + variant: "brand", }, }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Text: { - variants: { - spaced: { - fontWeight: "medium", - lineHeight: "20", - letterSpacing: "wide", - }, - card: { - fontSize: "label.lg", - fontWeight: "medium", - color: "content.secondary", - textTransform: "none", - whiteSpace: "normal", - textAlign: "left", - }, - }, - }, - Heading: { - sizes: { - lg: { - fontSize: "24px", - lineHeight: "32px", - fontWeight: 600, - }, - }, - }, - Switch: { - variants: { - brand: { - track: { - bg: "background.overlay", - _checked: { - bg: "content.link", + Text: { + variants: { + spaced: { + fontWeight: "medium", + lineHeight: "20", + letterSpacing: "wide", + }, + card: { + fontSize: "label.lg", + fontWeight: "medium", + color: "content.secondary", + textTransform: "none", + whiteSpace: "normal", + textAlign: "left", + }, }, }, - container: { - mb: "0 !important", + Heading: { + sizes: { + lg: { + fontSize: "24px", + lineHeight: "32px", + fontWeight: 600, + }, + }, }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Textarea: { - variants: { - brand: { - borderWidth: "1px", - borderRadius: "16px", - resize: "none", - borderColor: "border.neutral", - _invalid: { - background: "sentiment.negativeOverlay", - borderWidth: "2px", - borderColor: "sentiment.negativeDefault", + Switch: { + variants: { + brand: { + track: { + bg: "background.overlay", + _checked: { + bg: "content.link", + }, + }, + container: { + mb: "0 !important", + }, + }, + }, + defaultProps: { + variant: "brand", + }, }, - _focus: { - borderWidth: "2px", - borderColor: "#3182ce", + Textarea: { + variants: { + brand: { + borderWidth: "1px", + borderRadius: "16px", + resize: "none", + borderColor: "border.neutral", + _invalid: { + background: "sentiment.negativeOverlay", + borderWidth: "2px", + borderColor: "sentiment.negativeDefault", + }, + _focus: { + borderWidth: "2px", + borderColor: "#3182ce", + }, + }, + }, + defaultProps: { + variant: "brand", + }, }, }, - }, - defaultProps: { - variant: "brand", - }, - }, - }, -}); + } + } + } +} +); From 9ea3ee2420e9c646a9dfd553d3436e04bf0e1a94 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 8 Jan 2025 11:25:34 +0200 Subject: [PATCH 004/190] adds button recipe --- app/src/lib/app-theme.ts | 61 +++++++++++++++++++++++++++++++++++++++- 1 file changed, 60 insertions(+), 1 deletion(-) diff --git a/app/src/lib/app-theme.ts b/app/src/lib/app-theme.ts index a10e54a0e..ac58f9c00 100644 --- a/app/src/lib/app-theme.ts +++ b/app/src/lib/app-theme.ts @@ -1,8 +1,67 @@ -import { createSystem, defaultConfig } from "@chakra-ui/react"; +import { createSystem, defaultConfig, defineRecipe } from "@chakra-ui/react"; + + +// Buttons +const buttonRecipe = defineRecipe({ + variants: { + raised: { + true: { + boxShadow: "md", + } + }, + outline: { + true: { + border: "2px solid", + borderColor: "brand.primary", + color: "brand.primary", + _hover: { + borderColor: "brand.secondary", + color: "brand.secondary", + }, + _active: { + borderColor: "brand.secondary", + color: "brand.secondary", + }, + _loading: { + opacity: 0.8,} + },} + solid:{ + true: { + bg: "brand.primary", + color: "white", + _hover: { + bg: "brand.secondary", + } + } + }, + danger: { + true: { + bg: "semantic.danger", + color: "white", + _hover: { + bg: "semantic.dangerOverlay", + } + } + }, + solidPrimary: { + true: { + bg: "sentiment.positiveOverlay", + color: "interactive.primary", + _hover: { + bg: "sentiment.positiveLight", + color: "interactive.primaryLight", + } + } + } + } +}) export const appTheme = createSystem(defaultConfig, { theme: { + recipes: { + button: buttonRecipe + }, tokens: { colors: { brand: { From be5db0a42c1ba2fc140cb42021955cdca185a4f6 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 9 Jan 2025 15:22:08 +0200 Subject: [PATCH 005/190] adds base style for a button recipe --- app/src/lib/app-theme.ts | 777 +++++++++++---------------------------- 1 file changed, 216 insertions(+), 561 deletions(-) diff --git a/app/src/lib/app-theme.ts b/app/src/lib/app-theme.ts index ac58f9c00..2179c464d 100644 --- a/app/src/lib/app-theme.ts +++ b/app/src/lib/app-theme.ts @@ -1,13 +1,19 @@ import { createSystem, defaultConfig, defineRecipe } from "@chakra-ui/react"; - // Buttons const buttonRecipe = defineRecipe({ + base: { + textTransform: "uppercase", + borderRadius: 50, + fontFamily: "var(--font-poppins)", + letterSpacing: "1.25px", + lineHeight: "16px", + }, variants: { raised: { true: { boxShadow: "md", - } + }, }, outline: { true: { @@ -23,16 +29,18 @@ const buttonRecipe = defineRecipe({ color: "brand.secondary", }, _loading: { - opacity: 0.8,} - },} - solid:{ + opacity: 0.8, + }, + }, + }, + solid: { true: { bg: "brand.primary", color: "white", _hover: { bg: "brand.secondary", - } - } + }, + }, }, danger: { true: { @@ -40,8 +48,8 @@ const buttonRecipe = defineRecipe({ color: "white", _hover: { bg: "semantic.dangerOverlay", - } - } + }, + }, }, solidPrimary: { true: { @@ -50,210 +58,217 @@ const buttonRecipe = defineRecipe({ _hover: { bg: "sentiment.positiveLight", color: "interactive.primaryLight", - } - } - } - } -}) + }, + }, + }, + }, +}); -export const appTheme = createSystem(defaultConfig, -{ +export const appTheme = createSystem(defaultConfig, { theme: { recipes: { - button: buttonRecipe + button: buttonRecipe, }, tokens: { - colors: { - brand: { - primary: {value:"#001EA7"}, - secondary: {value:"#2351DC"}, - }, - - content: { - primary: {value:"#00001F"}, - secondary: {value:"#00001F"}, - tertiary: {value:"#4B4C63"}, - link: {value:"#2351DC"}, - alternative: {value:"#001EA7"}, - }, - - semantic: { - success: {value:"#24BE00"}, - successOverlay: {value:"#EFFDE5"}, - warning: {value:"#C98300"}, - warningOverlay: {value:"#FEF8E1"}, - danger: {value:"#F23D33"}, - dangerOverlay: {value:"#FFEAEE"}, - info: {value:"#2351DC"}, - }, - - base: { - light: {value:"#FFFFFF"}, - dark: {value:"#00001F"}, - }, - - border: { - neutral: {value:"#D7D8FA"}, - overlay: {value:"#E6E7FF"}, - }, - divider: { - neutral: {value:"#F0F0F0"}, - }, - - background: { - default: {value:"#FFFFFF"}, - neutral: {value:"#E8EAFB"}, - alternative: {value:"#EFFDE5"}, - overlay: {value:"#C5CBF5"}, - transparentGrey: {value: "rgba(232, 234, 251, 0.20)"}, - backgroundLight: {value:"#FAFAFA"}, - backgroundGreyFlat: {value:"#FAFBFE"}, - backgroundLoading: {value:"#E8EAFB"}, - }, - - interactive: { - primary: {value:"#008600"}, - primaryLight: {value:"#61c261"}, - accent: {value:"#5FE500"}, - secondary: {value:"#2351DC"}, - tertiary: {value:"#24BE00"}, - quaternary: {value:"#F17105"}, - control: {value:"#7A7B9A"}, - connected: {value:"#FA7200"}, - }, - - sentiment: { - positiveOverlay: {value:"#EFFDE5"}, - positiveLight: {value:"#f0f7eb"}, - positiveDark: {value:"#b9cfa9"}, - positiveDefault: {value:"#24BE00"}, - warningDefault: {value:"#C98300"}, - warningOverlay: {value:"#FEF8E1"}, - negativeDefault: {value:"#F23D33"}, - negativeOverlay: {value:"#FFEAEE"}, - }, - - brandScheme: { - 100: {value:"#C5CBF5"}, - 500: {value:"#2351DC"}, - }, - - body: {value:"#232640"}, + colors: { + brand: { + primary: { value: "#001EA7" }, + secondary: { value: "#2351DC" }, + }, + + content: { + primary: { value: "#00001F" }, + secondary: { value: "#00001F" }, + tertiary: { value: "#4B4C63" }, + link: { value: "#2351DC" }, + alternative: { value: "#001EA7" }, + }, + + semantic: { + success: { value: "#24BE00" }, + successOverlay: { value: "#EFFDE5" }, + warning: { value: "#C98300" }, + warningOverlay: { value: "#FEF8E1" }, + danger: { value: "#F23D33" }, + dangerOverlay: { value: "#FFEAEE" }, + info: { value: "#2351DC" }, + }, + + base: { + light: { value: "#FFFFFF" }, + dark: { value: "#00001F" }, + }, + + border: { + neutral: { value: "#D7D8FA" }, + overlay: { value: "#E6E7FF" }, + }, + divider: { + neutral: { value: "#F0F0F0" }, + }, + + background: { + default: { value: "#FFFFFF" }, + neutral: { value: "#E8EAFB" }, + alternative: { value: "#EFFDE5" }, + overlay: { value: "#C5CBF5" }, + transparentGrey: { value: "rgba(232, 234, 251, 0.20)" }, + backgroundLight: { value: "#FAFAFA" }, + backgroundGreyFlat: { value: "#FAFBFE" }, + backgroundLoading: { value: "#E8EAFB" }, + }, + + interactive: { + primary: { value: "#008600" }, + primaryLight: { value: "#61c261" }, + accent: { value: "#5FE500" }, + secondary: { value: "#2351DC" }, + tertiary: { value: "#24BE00" }, + quaternary: { value: "#F17105" }, + control: { value: "#7A7B9A" }, + connected: { value: "#FA7200" }, + }, + + sentiment: { + positiveOverlay: { value: "#EFFDE5" }, + positiveLight: { value: "#f0f7eb" }, + positiveDark: { value: "#b9cfa9" }, + positiveDefault: { value: "#24BE00" }, + warningDefault: { value: "#C98300" }, + warningOverlay: { value: "#FEF8E1" }, + negativeDefault: { value: "#F23D33" }, + negativeOverlay: { value: "#FFEAEE" }, }, - - fonts: { - heading: {value:"var(--font-poppins)"}, - body: {value:"var(--font-opensans)"}, + + brandScheme: { + 100: { value: "#C5CBF5" }, + 500: { value: "#2351DC" }, }, - - fontSizes: { - display: { - xl: {value: "140px"}, - lg: {value:"57px"}, - md: {value: "45px"}, - sm: {value: "36px"}, - }, - - headline: { - lg: {value:"32px"}, - md: {value: "28px"}, - sm: {value: "24px"}, - }, - - title: { - lg: {value: "22px"}, - md: {value: "16px"}, - sm: {value: "14px"}, - }, - - label: { - lg: {value: "14px"}, - md: {value: "12px"}, - sm: {value: "11px"}, - }, - - body: { - xl: {value: "22px"}, - lg: {value: "16px"}, - md: {value: "14px"}, - sm: {value: "12px"}, - }, - - button: { - lg: {value: "20px"}, - md: {value: "14px"}, - sm: {value: "12px"}, - }, - - caption: {value: "12px"}, - overline: {value: "10px"}, + + body: { value: "#232640" }, + }, + + fonts: { + heading: { value: "var(--font-poppins)" }, + body: { value: "var(--font-opensans)" }, + }, + + fontSizes: { + display: { + xl: { value: "140px" }, + lg: { value: "57px" }, + md: { value: "45px" }, + sm: { value: "36px" }, }, - - fontWeights: { - hairline: {value:100}, - thin: {value:200}, - light: {value:300}, - regular: {value:400}, - medium: {value:500}, - semibold: {value:600}, - bold: {value:700}, + + headline: { + lg: { value: "32px" }, + md: { value: "28px" }, + sm: { value: "24px" }, }, - - lineHeights: { - normal: {value: "normal"}, - none: {value: 1}, - "64": {value: "64px"}, - "52": {value: "52px"}, - "44": {value: "44px"}, - "40": {value: "40px"}, - "36": {value: "36px"}, - "32": {value: "32px"}, - "28": {value: "28px"}, - "24": {value: "24px"}, - "20": {value: "20px"}, - "16": {value: "16px"}, + + title: { + lg: { value: "22px" }, + md: { value: "16px" }, + sm: { value: "14px" }, }, - - letterSpacings: { - normal: {value: 0}, - wide: {value: "0.5px"}, - wider: {value: "1.25px"}, - widest: {value: "1.5px"}, + + label: { + lg: { value: "14px" }, + md: { value: "12px" }, + sm: { value: "11px" }, }, - - spacing: { - xs: {value: "4px"}, - s: {value: "8px"}, - m: {value: "16px"}, - l: {value: "24px"}, - xl: {value: "32px"}, - xxl: {value: "40px"}, - "xxl-2": {value: "48px"}, - "xxl-3": {value: "56px"}, - "xxl-4": {value: "64px"}, - "xxl-5": {value: "72px"}, - "xxl-6": {value: "80px"}, + + body: { + xl: { value: "22px" }, + lg: { value: "16px" }, + md: { value: "14px" }, + sm: { value: "12px" }, }, - - shadows: { - "1dp": {value: "0px 1px 2px -1px #0000001A, 0px 1px 3px 0px #00001F1A"}, - "2dp": {value: "0px 2px 4px -2px #0000001A, 0px 4px 6px -1px #0000001A"}, - "4dp": {value: "0px 4px 6px -4px #0000001A, 0px 10px 15px -3px #0000001A"}, - "8dp": {value: "0px 8px 10px -6px #0000001A, 0px 20px 25px -5px #0000001A"}, - "12dp": {value: "0px 25px 50px -12px #00000040"}, + + button: { + lg: { value: "20px" }, + md: { value: "14px" }, + sm: { value: "12px" }, }, - - radii: { - full: {value: "50%"}, - minimal: {value: "4px"}, - rounded: {value: "8px"}, - "rounded-xl": {value: "16px"}, - "rounded-xxl": {value: "20px"}, + + caption: { value: "12px" }, + overline: { value: "10px" }, + }, + + fontWeights: { + hairline: { value: 100 }, + thin: { value: 200 }, + light: { value: 300 }, + regular: { value: 400 }, + medium: { value: 500 }, + semibold: { value: 600 }, + bold: { value: 700 }, + }, + + lineHeights: { + normal: { value: "normal" }, + none: { value: 1 }, + "64": { value: "64px" }, + "52": { value: "52px" }, + "44": { value: "44px" }, + "40": { value: "40px" }, + "36": { value: "36px" }, + "32": { value: "32px" }, + "28": { value: "28px" }, + "24": { value: "24px" }, + "20": { value: "20px" }, + "16": { value: "16px" }, + }, + + letterSpacings: { + normal: { value: 0 }, + wide: { value: "0.5px" }, + wider: { value: "1.25px" }, + widest: { value: "1.5px" }, + }, + + spacing: { + xs: { value: "4px" }, + s: { value: "8px" }, + m: { value: "16px" }, + l: { value: "24px" }, + xl: { value: "32px" }, + xxl: { value: "40px" }, + "xxl-2": { value: "48px" }, + "xxl-3": { value: "56px" }, + "xxl-4": { value: "64px" }, + "xxl-5": { value: "72px" }, + "xxl-6": { value: "80px" }, + }, + + shadows: { + "1dp": { + value: "0px 1px 2px -1px #0000001A, 0px 1px 3px 0px #00001F1A", }, - borders: { - inputBox: {value: "1px solid #D7D8FB"}, + "2dp": { + value: "0px 2px 4px -2px #0000001A, 0px 4px 6px -1px #0000001A", }, - /* + "4dp": { + value: "0px 4px 6px -4px #0000001A, 0px 10px 15px -3px #0000001A", + }, + "8dp": { + value: "0px 8px 10px -6px #0000001A, 0px 20px 25px -5px #0000001A", + }, + "12dp": { value: "0px 25px 50px -12px #00000040" }, + }, + + radii: { + full: { value: "50%" }, + minimal: { value: "4px" }, + rounded: { value: "8px" }, + "rounded-xl": { value: "16px" }, + "rounded-xxl": { value: "20px" }, + }, + borders: { + inputBox: { value: "1px solid #D7D8FB" }, + }, + /* breakpoints: { xs: "360px", sm: "600px", @@ -262,366 +277,6 @@ export const appTheme = createSystem(defaultConfig, xl: "1440px", }, */ - components: { - Button: { - baseStyle: { - textTransform: "uppercase", - borderRadius: 50, - fontFamily: "var(--font-poppins)", - letterSpacing: "1.25px", - lineHeight: "16px", - }, - variants: { - outline: { - border: "2px solid", - borderColor: "interactive.secondary", - color: "interactive.secondary", - _hover: { - borderColor: "#5a7be0", - color: "#5a7be0", - }, - _active: { - borderColor: "#899ee0", - color: "#899ee0", - }, - _loading: { - opacity: 0.8, - }, - }, - solid: { - bg: "interactive.secondary", - color: "white", - _hover: { - bg: "#5a7be0", - }, - _active: { - bg: "#899ee0", - }, - _loading: { - bg: "background.overlay", - color: "content.link", - _hover: { - bg: "#5a7be0", - color: "base.light", - }, - }, - }, - danger: { - bg: "sentiment.negativeDefault", // #F23D33 - color: "white", - _hover: { - bg: "#FF5F5F", - }, - _active: { - bg: "#E3241A", - }, - _loading: { - bg: "semantic.dangerOverlay", - color: "base.dark", - _hover: { - bg: "#E3241A", - color: "base.light", - }, - }, - }, - solidPrimary: { - // Button.variants?.solid, - bg: "sentiment.positiveOverlay", - color: "interactive.primary", - _hover: { - bg: "sentiment.positiveLight", - color: "interactive.primaryLight", - }, - _active: { - bg: "sentiment.positiveDark", - color: "sentiment.positiveOverlay", - }, - _loading: { - opacity: 0.8, - bg: "sentiment.positiveLight", - }, - }, - ghost: { - color: "content.link", - }, - lightGhost: { - color: "base.light", - _hover: { - bg: "background.transparentGrey", - color: "base.light", - }, - }, - solidIcon: { - bgColor: "background.neutral", - color: "interactive.secondary", - _hover: { - color: "white", - bg: "#5a7be0", - }, - _active: { - bg: "#899ee0", - }, - _loading: { - opacity: 0.8, - bg: "background.neutral", - }, - }, - }, - }, - Link: { - baseStyle: { - color: "brand.secondary", - }, - }, - Card: { - baseStyle: { - container: { - borderRadius: 8, - px: 6, - py: 8, - }, - }, - }, - Tag: { - variants: { - brand: { - container: { - px: 3, - py: 1, - borderRadius: "full", - borderColor: "background.neutral", - borderWidth: 1, - color: "background.neutral", - }, - label: { - color: "content.secondary", - fontFamily: "heading", - fontSize: "14px", - lineHeight: "20px", - letterSpacing: "0.5px", - borderWidth: 0, - mt: -0.5, - }, - }, - filled: { - container: { - px: 4, - py: 1, - borderRadius: "full", - bgColor: "background.neutral", - }, - label: { - color: "content.alternative", - }, - }, - success: { - container: { - px: 4, - py: 1, - borderRadius: "full", - borderWidth: 1, - borderColor: "sentiment.positiveDefault", - bgColor: "sentiment.positiveOverlay", - color: "sentiment.positiveDefault", - fontWeight: 500, - }, - label: { - color: "sentiment.positiveDefault", - }, - }, - warning: { - container: { - px: 4, - py: 1, - borderRadius: "full", - borderWidth: 1, - borderColor: "sentiment.warningDefault", - bgColor: "sentiment.warningOverlay", - color: "sentiment.warningDefault", - }, - label: { - color: "sentiment.warningDefault", - }, - }, - low: { - container: { - bgColor: "sentiment.warningOverlay", - borderColor: "sentiment.warningDefault", - borderWidth: 1, - borderRadius: "full", - }, - label: { - color: "sentiment.warningDefault", - fontWeight: "medium", - }, - }, - medium: { - container: { - bgColor: "background.neutral", - borderColor: "content.link", - borderWidth: 1, - borderRadius: "full", - }, - label: { - color: "content.link", - fontWeight: "medium", - }, - }, - high: { - container: { - bgColor: "sentiment.positiveOverlay", - borderColor: "interactive.tertiary", - borderWidth: 1, - borderRadius: "full", - }, - label: { - color: "interactive.tertiary", - fontWeight: "medium", - }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Tooltip: { - baseStyle: { - bg: "content.secondary", - color: "base.light", - px: 4, - py: 2, - borderRadius: "lg", - }, - }, - Tabs: { - variants: { - line: { - tab: { - borderColor: "#E6E7FF", - _selected: { - color: "interactive.secondary", - borderColor: "interactive.secondary", - fontWeight: "bold", - }, - }, - }, - }, - }, - Accordion: { - variants: { - brand: { - container: { - borderRadius: "8px", - bgColor: "background.transparentGrey", - borderWidth: 0, - px: 4, - py: 4, - mb: 6, - }, - button: { - borderRadius: "8px", - }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Progress: { - baseStyle: { - filledTrack: { - bg: "#24BE00", - }, - }, - }, - Form: { - variants: { - brand: { - container: { - label: { - fontFamily: "heading", - fontWeight: "500", - lineHeight: "20px", - letterSpacing: "0.5px", - fontSize: "14px", - mb: 4, - }, - }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Text: { - variants: { - spaced: { - fontWeight: "medium", - lineHeight: "20", - letterSpacing: "wide", - }, - card: { - fontSize: "label.lg", - fontWeight: "medium", - color: "content.secondary", - textTransform: "none", - whiteSpace: "normal", - textAlign: "left", - }, - }, - }, - Heading: { - sizes: { - lg: { - fontSize: "24px", - lineHeight: "32px", - fontWeight: 600, - }, - }, - }, - Switch: { - variants: { - brand: { - track: { - bg: "background.overlay", - _checked: { - bg: "content.link", - }, - }, - container: { - mb: "0 !important", - }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - Textarea: { - variants: { - brand: { - borderWidth: "1px", - borderRadius: "16px", - resize: "none", - borderColor: "border.neutral", - _invalid: { - background: "sentiment.negativeOverlay", - borderWidth: "2px", - borderColor: "sentiment.negativeDefault", - }, - _focus: { - borderWidth: "2px", - borderColor: "#3182ce", - }, - }, - }, - defaultProps: { - variant: "brand", - }, - }, - }, - } - } - } -} -); + }, + }, +}); From eb948692cb686372f80cf5c4f993f34708059041 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 9 Jan 2025 15:30:03 +0200 Subject: [PATCH 006/190] adds more button variants --- app/src/lib/app-theme.ts | 84 +++++++++++++++++++++++++++++++++------- 1 file changed, 70 insertions(+), 14 deletions(-) diff --git a/app/src/lib/app-theme.ts b/app/src/lib/app-theme.ts index 2179c464d..1e5b2fc5c 100644 --- a/app/src/lib/app-theme.ts +++ b/app/src/lib/app-theme.ts @@ -10,23 +10,18 @@ const buttonRecipe = defineRecipe({ lineHeight: "16px", }, variants: { - raised: { - true: { - boxShadow: "md", - }, - }, outline: { true: { border: "2px solid", - borderColor: "brand.primary", - color: "brand.primary", + borderColor: "interactive.secondary", + color: "interactive.secondary", _hover: { - borderColor: "brand.secondary", - color: "brand.secondary", + borderColor: "#5a7be0", + color: "#5a7be0", }, _active: { - borderColor: "brand.secondary", - color: "brand.secondary", + borderColor: "#899ee0", + color: "#899ee0", }, _loading: { opacity: 0.8, @@ -35,19 +30,41 @@ const buttonRecipe = defineRecipe({ }, solid: { true: { - bg: "brand.primary", + bg: "interactive.secondary", color: "white", _hover: { - bg: "brand.secondary", + bg: "#5a7be0", + }, + _active: { + bg: "#899ee0", + }, + _loading: { + bg: "background.overlay", + color: "content.link", + _hover: { + bg: "#5a7be0", + color: "base.light", + }, }, }, }, danger: { true: { - bg: "semantic.danger", + bg: "sentiment.negativeDefault", // #F23D33 color: "white", _hover: { + bg: "#FF5F5F", + }, + _active: { + bg: "#E3241A", + }, + _loading: { bg: "semantic.dangerOverlay", + color: "base.dark", + _hover: { + bg: "#E3241A", + color: "base.light", + }, }, }, }, @@ -59,6 +76,45 @@ const buttonRecipe = defineRecipe({ bg: "sentiment.positiveLight", color: "interactive.primaryLight", }, + _active: { + bg: "sentiment.positiveDark", + color: "sentiment.positiveOverlay", + }, + _loading: { + opacity: 0.8, + bg: "sentiment.positiveLight", + }, + }, + }, + ghost: { + true: { + color: "content.link", + }, + }, + lightGhost: { + true: { + color: "base.light", + _hover: { + bg: "background.transparentGrey", + color: "base.light", + }, + }, + }, + solidIcon: { + true: { + bgColor: "background.neutral", + color: "interactive.secondary", + _hover: { + color: "white", + bg: "#5a7be0", + }, + _active: { + bg: "#899ee0", + }, + _loading: { + opacity: 0.8, + bg: "background.neutral", + }, }, }, }, From 5178d9c12cb2e7cc997072a3e6a2a41eb7c0acd1 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 9 Jan 2025 16:47:03 +0200 Subject: [PATCH 007/190] moves app in theme folder, moves recipes in dir recipes/index --- app/src/app/providers.tsx | 2 +- app/src/lib/{ => theme}/app-theme.ts | 121 +------------------------ app/src/lib/theme/recipes/index.ts | 127 +++++++++++++++++++++++++++ 3 files changed, 129 insertions(+), 121 deletions(-) rename app/src/lib/{ => theme}/app-theme.ts (69%) create mode 100644 app/src/lib/theme/recipes/index.ts diff --git a/app/src/app/providers.tsx b/app/src/app/providers.tsx index 7a45c43a3..79e53fe28 100644 --- a/app/src/app/providers.tsx +++ b/app/src/app/providers.tsx @@ -1,6 +1,6 @@ "use client"; -import { appTheme } from "@/lib/app-theme"; +import { appTheme } from "@/lib/theme/app-theme"; import { persistor, store } from "@/lib/store"; import { CacheProvider } from "@chakra-ui/next-js"; import { ChakraProvider } from "@chakra-ui/react"; diff --git a/app/src/lib/app-theme.ts b/app/src/lib/theme/app-theme.ts similarity index 69% rename from app/src/lib/app-theme.ts rename to app/src/lib/theme/app-theme.ts index 1e5b2fc5c..d7b21d5fe 100644 --- a/app/src/lib/app-theme.ts +++ b/app/src/lib/theme/app-theme.ts @@ -1,124 +1,5 @@ import { createSystem, defaultConfig, defineRecipe } from "@chakra-ui/react"; - -// Buttons -const buttonRecipe = defineRecipe({ - base: { - textTransform: "uppercase", - borderRadius: 50, - fontFamily: "var(--font-poppins)", - letterSpacing: "1.25px", - lineHeight: "16px", - }, - variants: { - outline: { - true: { - border: "2px solid", - borderColor: "interactive.secondary", - color: "interactive.secondary", - _hover: { - borderColor: "#5a7be0", - color: "#5a7be0", - }, - _active: { - borderColor: "#899ee0", - color: "#899ee0", - }, - _loading: { - opacity: 0.8, - }, - }, - }, - solid: { - true: { - bg: "interactive.secondary", - color: "white", - _hover: { - bg: "#5a7be0", - }, - _active: { - bg: "#899ee0", - }, - _loading: { - bg: "background.overlay", - color: "content.link", - _hover: { - bg: "#5a7be0", - color: "base.light", - }, - }, - }, - }, - danger: { - true: { - bg: "sentiment.negativeDefault", // #F23D33 - color: "white", - _hover: { - bg: "#FF5F5F", - }, - _active: { - bg: "#E3241A", - }, - _loading: { - bg: "semantic.dangerOverlay", - color: "base.dark", - _hover: { - bg: "#E3241A", - color: "base.light", - }, - }, - }, - }, - solidPrimary: { - true: { - bg: "sentiment.positiveOverlay", - color: "interactive.primary", - _hover: { - bg: "sentiment.positiveLight", - color: "interactive.primaryLight", - }, - _active: { - bg: "sentiment.positiveDark", - color: "sentiment.positiveOverlay", - }, - _loading: { - opacity: 0.8, - bg: "sentiment.positiveLight", - }, - }, - }, - ghost: { - true: { - color: "content.link", - }, - }, - lightGhost: { - true: { - color: "base.light", - _hover: { - bg: "background.transparentGrey", - color: "base.light", - }, - }, - }, - solidIcon: { - true: { - bgColor: "background.neutral", - color: "interactive.secondary", - _hover: { - color: "white", - bg: "#5a7be0", - }, - _active: { - bg: "#899ee0", - }, - _loading: { - opacity: 0.8, - bg: "background.neutral", - }, - }, - }, - }, -}); +import { buttonRecipe } from "./recipes"; export const appTheme = createSystem(defaultConfig, { theme: { diff --git a/app/src/lib/theme/recipes/index.ts b/app/src/lib/theme/recipes/index.ts new file mode 100644 index 000000000..064b43d69 --- /dev/null +++ b/app/src/lib/theme/recipes/index.ts @@ -0,0 +1,127 @@ +/** + * This file contains all the recipes that are used to define the styles of the components. + */ + +import { defineRecipe } from "@chakra-ui/react"; + +export const buttonRecipe = defineRecipe({ + // base styles for the button + base: { + textTransform: "uppercase", + borderRadius: 50, + fontFamily: "var(--font-poppins)", + letterSpacing: "1.25px", + lineHeight: "16px", + }, + + // variants for the button + variants: { + outline: { + true: { + border: "2px solid", + borderColor: "interactive.secondary", + color: "interactive.secondary", + _hover: { + borderColor: "#5a7be0", + color: "#5a7be0", + }, + _active: { + borderColor: "#899ee0", + color: "#899ee0", + }, + _loading: { + opacity: 0.8, + }, + }, + }, + solid: { + true: { + bg: "interactive.secondary", + color: "white", + _hover: { + bg: "#5a7be0", + }, + _active: { + bg: "#899ee0", + }, + _loading: { + bg: "background.overlay", + color: "content.link", + _hover: { + bg: "#5a7be0", + color: "base.light", + }, + }, + }, + }, + danger: { + true: { + bg: "sentiment.negativeDefault", // #F23D33 + color: "white", + _hover: { + bg: "#FF5F5F", + }, + _active: { + bg: "#E3241A", + }, + _loading: { + bg: "semantic.dangerOverlay", + color: "base.dark", + _hover: { + bg: "#E3241A", + color: "base.light", + }, + }, + }, + }, + solidPrimary: { + true: { + bg: "sentiment.positiveOverlay", + color: "interactive.primary", + _hover: { + bg: "sentiment.positiveLight", + color: "interactive.primaryLight", + }, + _active: { + bg: "sentiment.positiveDark", + color: "sentiment.positiveOverlay", + }, + _loading: { + opacity: 0.8, + bg: "sentiment.positiveLight", + }, + }, + }, + ghost: { + true: { + color: "content.link", + }, + }, + lightGhost: { + true: { + color: "base.light", + _hover: { + bg: "background.transparentGrey", + color: "base.light", + }, + }, + }, + solidIcon: { + true: { + bgColor: "background.neutral", + color: "interactive.secondary", + _hover: { + color: "white", + bg: "#5a7be0", + }, + _active: { + bg: "#899ee0", + }, + _loading: { + opacity: 0.8, + bg: "background.neutral", + }, + }, + }, + }, +}); From 0481ad5335fb59a6adbeba5951332b4b2fc66906 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 9 Jan 2025 16:50:32 +0200 Subject: [PATCH 008/190] adds link recipe --- app/src/lib/theme/app-theme.ts | 2 +- app/src/lib/theme/recipes/index.ts | 6 ++++++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/app/src/lib/theme/app-theme.ts b/app/src/lib/theme/app-theme.ts index d7b21d5fe..23b622101 100644 --- a/app/src/lib/theme/app-theme.ts +++ b/app/src/lib/theme/app-theme.ts @@ -1,4 +1,4 @@ -import { createSystem, defaultConfig, defineRecipe } from "@chakra-ui/react"; +import { createSystem, defaultConfig } from "@chakra-ui/react"; import { buttonRecipe } from "./recipes"; export const appTheme = createSystem(defaultConfig, { diff --git a/app/src/lib/theme/recipes/index.ts b/app/src/lib/theme/recipes/index.ts index 064b43d69..b83467e86 100644 --- a/app/src/lib/theme/recipes/index.ts +++ b/app/src/lib/theme/recipes/index.ts @@ -125,3 +125,9 @@ export const buttonRecipe = defineRecipe({ }, }, }); + +export const linkRecipe = defineRecipe({ + base: { + color: "brand.secondary", + }, +}); From d4323568b2f8897397d5cc05d8756ece3f9619f0 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 9 Jan 2025 17:08:41 +0200 Subject: [PATCH 009/190] adds tag and card recipe --- app/src/lib/theme/app-theme.ts | 4 +- app/src/lib/theme/recipes/index.ts | 117 +++++++++++++++++++++++++++++ 2 files changed, 120 insertions(+), 1 deletion(-) diff --git a/app/src/lib/theme/app-theme.ts b/app/src/lib/theme/app-theme.ts index 23b622101..8f428be78 100644 --- a/app/src/lib/theme/app-theme.ts +++ b/app/src/lib/theme/app-theme.ts @@ -1,10 +1,12 @@ import { createSystem, defaultConfig } from "@chakra-ui/react"; -import { buttonRecipe } from "./recipes"; +import { buttonRecipe, linkRecipe, tagRecipe } from "./recipes"; export const appTheme = createSystem(defaultConfig, { theme: { recipes: { button: buttonRecipe, + link: linkRecipe, + tag: tagRecipe, }, tokens: { colors: { diff --git a/app/src/lib/theme/recipes/index.ts b/app/src/lib/theme/recipes/index.ts index b83467e86..08106641e 100644 --- a/app/src/lib/theme/recipes/index.ts +++ b/app/src/lib/theme/recipes/index.ts @@ -4,6 +4,7 @@ import { defineRecipe } from "@chakra-ui/react"; +// define a recipe for the button export const buttonRecipe = defineRecipe({ // base styles for the button base: { @@ -126,8 +127,124 @@ export const buttonRecipe = defineRecipe({ }, }); +// define a recipe for the link (anchor tag) export const linkRecipe = defineRecipe({ base: { color: "brand.secondary", }, }); + +// define a recipe for the tag +export const tagRecipe = defineRecipe({ + base: {}, + + variants: { + brand: { + container: { + px: 3, + py: 1, + borderRadius: "full", + borderColor: "background.neutral", + borderWidth: 1, + color: "background.neutral", + }, + label: { + color: "content.secondary", + fontFamily: "heading", + fontSize: "14px", + lineHeight: "20px", + letterSpacing: "0.5px", + borderWidth: 0, + mt: -0.5, + }, + }, + filled: { + container: { + px: 4, + py: 1, + borderRadius: "full", + bgColor: "background.neutral", + }, + label: { + color: "content.alternative", + }, + }, + success: { + container: { + px: 4, + py: 1, + borderRadius: "full", + borderWidth: 1, + borderColor: "sentiment.positiveDefault", + bgColor: "sentiment.positiveOverlay", + color: "sentiment.positiveDefault", + fontWeight: 500, + }, + label: { + color: "sentiment.positiveDefault", + }, + }, + warning: { + container: { + px: 4, + py: 1, + borderRadius: "full", + borderWidth: 1, + borderColor: "sentiment.warningDefault", + bgColor: "sentiment.warningOverlay", + color: "sentiment.warningDefault", + }, + label: { + color: "sentiment.warningDefault", + }, + }, + low: { + container: { + bgColor: "sentiment.warningOverlay", + borderColor: "sentiment.warningDefault", + borderWidth: 1, + borderRadius: "full", + }, + label: { + color: "sentiment.warningDefault", + fontWeight: "medium", + }, + }, + medium: { + container: { + bgColor: "background.neutral", + borderColor: "content.link", + borderWidth: 1, + borderRadius: "full", + }, + label: { + color: "content.link", + fontWeight: "medium", + }, + }, + high: { + container: { + bgColor: "sentiment.positiveOverlay", + borderColor: "interactive.tertiary", + borderWidth: 1, + borderRadius: "full", + }, + label: { + color: "interactive.tertiary", + fontWeight: "medium", + }, + }, + }, + defaultVariants: { + brand: "label", + }, +}); + +// define a recipe for the card +export const cardRecipe = defineRecipe({ + base: { + borderRadius: 8, + px: 6, + py: 8, + }, +}); From 7f5df3a9dda79f034b0c5e2622ce9bff94a22a7d Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 9 Jan 2025 17:50:28 +0200 Subject: [PATCH 010/190] adds progress, form, accordion and tooltip recipes --- app/src/lib/theme/recipes/index.ts | 74 ++++++++++++++++++++++++++++++ 1 file changed, 74 insertions(+) diff --git a/app/src/lib/theme/recipes/index.ts b/app/src/lib/theme/recipes/index.ts index 08106641e..edd72d434 100644 --- a/app/src/lib/theme/recipes/index.ts +++ b/app/src/lib/theme/recipes/index.ts @@ -248,3 +248,77 @@ export const cardRecipe = defineRecipe({ py: 8, }, }); + +// define a recipe for the tooltip +export const tooltipRecipe = defineRecipe({ + base: { + bg: "content.secondary", + color: "base.light", + borderRadius: 8, + px: 4, + py: 2, + }, +}); + +// define a recipe for the tabs +export const tabsRecipe = defineRecipe({ + variants: { + true: { + line: { + tab: { + borderColor: "#E6E7FF", + _selected: { + color: "interactive.secondary", + borderColor: "interactive.secondary", + fontWeight: "bold", + }, + }, + }, + }, + }, +}); + +// define a recipe for the accordion +export const accordionRecipe = defineRecipe({ + variants: { + brand: { + container: { + borderRadius: 8, + }, + button: { + borderRadius: "8px", + }, + }, + }, + defaultVariants: { + brand: "container", + }, +}); + +// define a recipe for the progress +export const progressRecipe = defineRecipe({ + base: { + bg: "#24BE00", + }, +}); + +// define a recipe for the Form +export const formRecipe = defineRecipe({ + variants: { + brand: { + container: { + label: { + fontFamily: "heading", + fontWeight: "500", + lineHeight: "20px", + letterSpacing: "0.5px", + fontSize: "14px", + mb: 4, + }, + }, + }, + }, + defaultVariants: { + brand: "container", + }, +}); From ab3892fe7d70f9f7799a35566faa0275ae375904 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 13 Jan 2025 12:37:30 +0200 Subject: [PATCH 011/190] adds switch, heading, textarea recipe --- app/src/lib/theme/recipes/index.ts | 80 ++++++++++++++++++++++++++++++ 1 file changed, 80 insertions(+) diff --git a/app/src/lib/theme/recipes/index.ts b/app/src/lib/theme/recipes/index.ts index edd72d434..12f9b3cbd 100644 --- a/app/src/lib/theme/recipes/index.ts +++ b/app/src/lib/theme/recipes/index.ts @@ -322,3 +322,83 @@ export const formRecipe = defineRecipe({ brand: "container", }, }); + +// define a recipe for the text +export const textRecipe = defineRecipe({ + variants: { + spaced: { + true: { + fontWeight: "medium", + lineHeight: "20", + letterSpacing: "wide", + }, + }, + card: { + true: { + fontSize: "label.lg", + fontWeight: "medium", + color: "content.secondary", + textTransform: "none", + whiteSpace: "normal", + textAlign: "left", + }, + }, + }, +}); + +// define a recipe for the Heading +export const headingRecipe = defineRecipe({ + variants: { + lg: { + true: { + fontSize: "24px", + fontWeight: "bold", + lineHeight: "32px", + }, + }, + }, + defaultVariants: { + lg: true, + }, +}); + +// define a recipe for the Switch +export const switchRecipe = defineRecipe({ + variants: { + brand: { + track: { + borderRadius: "full", + bg: "background.neutral", + _checked: { + bg: "interactive.secondary", + }, + }, + container: { + mb: "0 !important", + }, + }, + }, + defaultVariants: { + brand: "track", + }, +}); + +// define a recipe for the Textarea +export const textareaRecipe = defineRecipe({ + variants: { + brand: { + container: { + bg: "background.neutral", + borderColor: "background.neutral", + borderRadius: 8, + color: "content.secondary", + _focus: { + borderColor: "interactive.secondary", + }, + }, + }, + }, + defaultVariants: { + brand: "container", + }, +}); From 6fd88899bd1fbc72d2c03101c563d2fa811f15eb Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 13 Jan 2025 12:41:39 +0200 Subject: [PATCH 012/190] imports recipes in app theme --- app/src/lib/theme/app-theme.ts | 26 +++++++++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/app/src/lib/theme/app-theme.ts b/app/src/lib/theme/app-theme.ts index 8f428be78..7fd462821 100644 --- a/app/src/lib/theme/app-theme.ts +++ b/app/src/lib/theme/app-theme.ts @@ -1,5 +1,19 @@ import { createSystem, defaultConfig } from "@chakra-ui/react"; -import { buttonRecipe, linkRecipe, tagRecipe } from "./recipes"; +import { + accordionRecipe, + buttonRecipe, + cardRecipe, + formRecipe, + headingRecipe, + linkRecipe, + progressRecipe, + switchRecipe, + tabsRecipe, + tagRecipe, + textareaRecipe, + textRecipe, + tooltipRecipe, +} from "./recipes"; export const appTheme = createSystem(defaultConfig, { theme: { @@ -7,6 +21,16 @@ export const appTheme = createSystem(defaultConfig, { button: buttonRecipe, link: linkRecipe, tag: tagRecipe, + card: cardRecipe, + tooltip: tooltipRecipe, + tab: tabsRecipe, + accordion: accordionRecipe, + progress: progressRecipe, + form: formRecipe, + text: textRecipe, + heading: headingRecipe, + switch: switchRecipe, + textarea: textareaRecipe, }, tokens: { colors: { From 2d8129816f8e8344a9616c4b54c71ad23d593903 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 13 Jan 2025 12:45:20 +0200 Subject: [PATCH 013/190] ran prettier to /ui components for better formatting --- app/src/components/ui/avatar.tsx | 52 +++++++++++++------------- app/src/components/ui/button.tsx | 16 ++++---- app/src/components/ui/checkbox.tsx | 16 ++++---- app/src/components/ui/close-button.tsx | 14 +++---- app/src/components/ui/color-mode.tsx | 38 +++++++++---------- app/src/components/ui/dialog.tsx | 40 ++++++++++---------- app/src/components/ui/drawer.tsx | 40 ++++++++++---------- app/src/components/ui/field.tsx | 18 ++++----- app/src/components/ui/input-group.tsx | 28 +++++++------- app/src/components/ui/popover.tsx | 38 +++++++++---------- app/src/components/ui/provider.tsx | 11 ++---- app/src/components/ui/radio.tsx | 16 ++++---- app/src/components/ui/slider.tsx | 46 +++++++++++------------ app/src/components/ui/tooltip.tsx | 24 ++++++------ 14 files changed, 197 insertions(+), 200 deletions(-) diff --git a/app/src/components/ui/avatar.tsx b/app/src/components/ui/avatar.tsx index cd84664ae..94e25828d 100644 --- a/app/src/components/ui/avatar.tsx +++ b/app/src/components/ui/avatar.tsx @@ -1,24 +1,24 @@ -"use client" +"use client"; -import type { GroupProps, SlotRecipeProps } from "@chakra-ui/react" -import { Avatar as ChakraAvatar, Group } from "@chakra-ui/react" -import * as React from "react" +import type { GroupProps, SlotRecipeProps } from "@chakra-ui/react"; +import { Avatar as ChakraAvatar, Group } from "@chakra-ui/react"; +import * as React from "react"; -type ImageProps = React.ImgHTMLAttributes +type ImageProps = React.ImgHTMLAttributes; export interface AvatarProps extends ChakraAvatar.RootProps { - name?: string - src?: string - srcSet?: string - loading?: ImageProps["loading"] - icon?: React.ReactElement - fallback?: React.ReactNode + name?: string; + src?: string; + srcSet?: string; + loading?: ImageProps["loading"]; + icon?: React.ReactElement; + fallback?: React.ReactNode; } export const Avatar = React.forwardRef( function Avatar(props, ref) { const { name, src, srcSet, loading, icon, fallback, children, ...rest } = - props + props; return ( @@ -27,18 +27,18 @@ export const Avatar = React.forwardRef( {children} - ) + ); }, -) +); interface AvatarFallbackProps extends ChakraAvatar.FallbackProps { - name?: string - icon?: React.ReactElement + name?: string; + icon?: React.ReactElement; } const AvatarFallback = React.forwardRef( function AvatarFallback(props, ref) { - const { name, icon, children, ...rest } = props + const { name, icon, children, ...rest } = props; return ( {children} @@ -47,28 +47,28 @@ const AvatarFallback = React.forwardRef( {icon} )} - ) + ); }, -) +); function getInitials(name: string) { - const names = name.trim().split(" ") - const firstName = names[0] != null ? names[0] : "" - const lastName = names.length > 1 ? names[names.length - 1] : "" + const names = name.trim().split(" "); + const firstName = names[0] != null ? names[0] : ""; + const lastName = names.length > 1 ? names[names.length - 1] : ""; return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` - : firstName.charAt(0) + : firstName.charAt(0); } interface AvatarGroupProps extends GroupProps, SlotRecipeProps<"avatar"> {} export const AvatarGroup = React.forwardRef( function AvatarGroup(props, ref) { - const { size, variant, borderless, ...rest } = props + const { size, variant, borderless, ...rest } = props; return ( - ) + ); }, -) +); diff --git a/app/src/components/ui/button.tsx b/app/src/components/ui/button.tsx index 21d5f4b55..20f5f7892 100644 --- a/app/src/components/ui/button.tsx +++ b/app/src/components/ui/button.tsx @@ -1,22 +1,22 @@ -import type { ButtonProps as ChakraButtonProps } from "@chakra-ui/react" +import type { ButtonProps as ChakraButtonProps } from "@chakra-ui/react"; import { AbsoluteCenter, Button as ChakraButton, Span, Spinner, -} from "@chakra-ui/react" -import * as React from "react" +} from "@chakra-ui/react"; +import * as React from "react"; interface ButtonLoadingProps { - loading?: boolean - loadingText?: React.ReactNode + loading?: boolean; + loadingText?: React.ReactNode; } export interface ButtonProps extends ChakraButtonProps, ButtonLoadingProps {} export const Button = React.forwardRef( function Button(props, ref) { - const { loading, disabled, loadingText, children, ...rest } = props + const { loading, disabled, loadingText, children, ...rest } = props; return ( {loading && !loadingText ? ( @@ -35,6 +35,6 @@ export const Button = React.forwardRef( children )} - ) + ); }, -) +); diff --git a/app/src/components/ui/checkbox.tsx b/app/src/components/ui/checkbox.tsx index 2a27c2ffb..6f2c86dda 100644 --- a/app/src/components/ui/checkbox.tsx +++ b/app/src/components/ui/checkbox.tsx @@ -1,15 +1,15 @@ -import { Checkbox as ChakraCheckbox } from "@chakra-ui/react" -import * as React from "react" +import { Checkbox as ChakraCheckbox } from "@chakra-ui/react"; +import * as React from "react"; export interface CheckboxProps extends ChakraCheckbox.RootProps { - icon?: React.ReactNode - inputProps?: React.InputHTMLAttributes - rootRef?: React.Ref + icon?: React.ReactNode; + inputProps?: React.InputHTMLAttributes; + rootRef?: React.Ref; } export const Checkbox = React.forwardRef( function Checkbox(props, ref) { - const { icon, children, inputProps, rootRef, ...rest } = props + const { icon, children, inputProps, rootRef, ...rest } = props; return ( @@ -20,6 +20,6 @@ export const Checkbox = React.forwardRef( {children} )} - ) + ); }, -) +); diff --git a/app/src/components/ui/close-button.tsx b/app/src/components/ui/close-button.tsx index 94af48859..8dc4448ad 100644 --- a/app/src/components/ui/close-button.tsx +++ b/app/src/components/ui/close-button.tsx @@ -1,9 +1,9 @@ -import type { ButtonProps } from "@chakra-ui/react" -import { IconButton as ChakraIconButton } from "@chakra-ui/react" -import * as React from "react" -import { LuX } from "react-icons/lu" +import type { ButtonProps } from "@chakra-ui/react"; +import { IconButton as ChakraIconButton } from "@chakra-ui/react"; +import * as React from "react"; +import { LuX } from "react-icons/lu"; -export type CloseButtonProps = ButtonProps +export type CloseButtonProps = ButtonProps; export const CloseButton = React.forwardRef< HTMLButtonElement, @@ -13,5 +13,5 @@ export const CloseButton = React.forwardRef< {props.children ?? } - ) -}) + ); +}); diff --git a/app/src/components/ui/color-mode.tsx b/app/src/components/ui/color-mode.tsx index a34b9689c..1f619db19 100644 --- a/app/src/components/ui/color-mode.tsx +++ b/app/src/components/ui/color-mode.tsx @@ -1,40 +1,40 @@ -"use client" +"use client"; -import type { IconButtonProps } from "@chakra-ui/react" -import { ClientOnly, IconButton, Skeleton } from "@chakra-ui/react" -import { ThemeProvider, useTheme } from "next-themes" -import type { ThemeProviderProps } from "next-themes" -import * as React from "react" -import { LuMoon, LuSun } from "react-icons/lu" +import type { IconButtonProps } from "@chakra-ui/react"; +import { ClientOnly, IconButton, Skeleton } from "@chakra-ui/react"; +import { ThemeProvider, useTheme } from "next-themes"; +import type { ThemeProviderProps } from "next-themes"; +import * as React from "react"; +import { LuMoon, LuSun } from "react-icons/lu"; export interface ColorModeProviderProps extends ThemeProviderProps {} export function ColorModeProvider(props: ColorModeProviderProps) { return ( - ) + ); } export function useColorMode() { - const { resolvedTheme, setTheme } = useTheme() + const { resolvedTheme, setTheme } = useTheme(); const toggleColorMode = () => { - setTheme(resolvedTheme === "light" ? "dark" : "light") - } + setTheme(resolvedTheme === "light" ? "dark" : "light"); + }; return { colorMode: resolvedTheme, setColorMode: setTheme, toggleColorMode, - } + }; } export function useColorModeValue(light: T, dark: T) { - const { colorMode } = useColorMode() - return colorMode === "light" ? light : dark + const { colorMode } = useColorMode(); + return colorMode === "light" ? light : dark; } export function ColorModeIcon() { - const { colorMode } = useColorMode() - return colorMode === "light" ? : + const { colorMode } = useColorMode(); + return colorMode === "light" ? : ; } interface ColorModeButtonProps extends Omit {} @@ -43,7 +43,7 @@ export const ColorModeButton = React.forwardRef< HTMLButtonElement, ColorModeButtonProps >(function ColorModeButton(props, ref) { - const { toggleColorMode } = useColorMode() + const { toggleColorMode } = useColorMode(); return ( }> - ) -}) + ); +}); diff --git a/app/src/components/ui/dialog.tsx b/app/src/components/ui/dialog.tsx index 89d68a5de..e954059e4 100644 --- a/app/src/components/ui/dialog.tsx +++ b/app/src/components/ui/dialog.tsx @@ -1,11 +1,11 @@ -import { Dialog as ChakraDialog, Portal } from "@chakra-ui/react" -import { CloseButton } from "./close-button" -import * as React from "react" +import { Dialog as ChakraDialog, Portal } from "@chakra-ui/react"; +import { CloseButton } from "./close-button"; +import * as React from "react"; interface DialogContentProps extends ChakraDialog.ContentProps { - portalled?: boolean - portalRef?: React.RefObject - backdrop?: boolean + portalled?: boolean; + portalRef?: React.RefObject; + backdrop?: boolean; } export const DialogContent = React.forwardRef< @@ -18,7 +18,7 @@ export const DialogContent = React.forwardRef< portalRef, backdrop = true, ...rest - } = props + } = props; return ( @@ -29,8 +29,8 @@ export const DialogContent = React.forwardRef< - ) -}) + ); +}); export const DialogCloseTrigger = React.forwardRef< HTMLButtonElement, @@ -48,15 +48,15 @@ export const DialogCloseTrigger = React.forwardRef< {props.children} - ) -}) + ); +}); -export const DialogRoot = ChakraDialog.Root -export const DialogFooter = ChakraDialog.Footer -export const DialogHeader = ChakraDialog.Header -export const DialogBody = ChakraDialog.Body -export const DialogBackdrop = ChakraDialog.Backdrop -export const DialogTitle = ChakraDialog.Title -export const DialogDescription = ChakraDialog.Description -export const DialogTrigger = ChakraDialog.Trigger -export const DialogActionTrigger = ChakraDialog.ActionTrigger +export const DialogRoot = ChakraDialog.Root; +export const DialogFooter = ChakraDialog.Footer; +export const DialogHeader = ChakraDialog.Header; +export const DialogBody = ChakraDialog.Body; +export const DialogBackdrop = ChakraDialog.Backdrop; +export const DialogTitle = ChakraDialog.Title; +export const DialogDescription = ChakraDialog.Description; +export const DialogTrigger = ChakraDialog.Trigger; +export const DialogActionTrigger = ChakraDialog.ActionTrigger; diff --git a/app/src/components/ui/drawer.tsx b/app/src/components/ui/drawer.tsx index ccb96c80a..447c57a0b 100644 --- a/app/src/components/ui/drawer.tsx +++ b/app/src/components/ui/drawer.tsx @@ -1,18 +1,18 @@ -import { Drawer as ChakraDrawer, Portal } from "@chakra-ui/react" -import { CloseButton } from "./close-button" -import * as React from "react" +import { Drawer as ChakraDrawer, Portal } from "@chakra-ui/react"; +import { CloseButton } from "./close-button"; +import * as React from "react"; interface DrawerContentProps extends ChakraDrawer.ContentProps { - portalled?: boolean - portalRef?: React.RefObject - offset?: ChakraDrawer.ContentProps["padding"] + portalled?: boolean; + portalRef?: React.RefObject; + offset?: ChakraDrawer.ContentProps["padding"]; } export const DrawerContent = React.forwardRef< HTMLDivElement, DrawerContentProps >(function DrawerContent(props, ref) { - const { children, portalled = true, portalRef, offset, ...rest } = props + const { children, portalled = true, portalRef, offset, ...rest } = props; return ( @@ -21,8 +21,8 @@ export const DrawerContent = React.forwardRef< - ) -}) + ); +}); export const DrawerCloseTrigger = React.forwardRef< HTMLButtonElement, @@ -38,15 +38,15 @@ export const DrawerCloseTrigger = React.forwardRef< > - ) -}) + ); +}); -export const DrawerTrigger = ChakraDrawer.Trigger -export const DrawerRoot = ChakraDrawer.Root -export const DrawerFooter = ChakraDrawer.Footer -export const DrawerHeader = ChakraDrawer.Header -export const DrawerBody = ChakraDrawer.Body -export const DrawerBackdrop = ChakraDrawer.Backdrop -export const DrawerDescription = ChakraDrawer.Description -export const DrawerTitle = ChakraDrawer.Title -export const DrawerActionTrigger = ChakraDrawer.ActionTrigger +export const DrawerTrigger = ChakraDrawer.Trigger; +export const DrawerRoot = ChakraDrawer.Root; +export const DrawerFooter = ChakraDrawer.Footer; +export const DrawerHeader = ChakraDrawer.Header; +export const DrawerBody = ChakraDrawer.Body; +export const DrawerBackdrop = ChakraDrawer.Backdrop; +export const DrawerDescription = ChakraDrawer.Description; +export const DrawerTitle = ChakraDrawer.Title; +export const DrawerActionTrigger = ChakraDrawer.ActionTrigger; diff --git a/app/src/components/ui/field.tsx b/app/src/components/ui/field.tsx index dd3b66f10..4cb552913 100644 --- a/app/src/components/ui/field.tsx +++ b/app/src/components/ui/field.tsx @@ -1,17 +1,17 @@ -import { Field as ChakraField } from "@chakra-ui/react" -import * as React from "react" +import { Field as ChakraField } from "@chakra-ui/react"; +import * as React from "react"; export interface FieldProps extends Omit { - label?: React.ReactNode - helperText?: React.ReactNode - errorText?: React.ReactNode - optionalText?: React.ReactNode + label?: React.ReactNode; + helperText?: React.ReactNode; + errorText?: React.ReactNode; + optionalText?: React.ReactNode; } export const Field = React.forwardRef( function Field(props, ref) { const { label, children, helperText, errorText, optionalText, ...rest } = - props + props; return ( {label && ( @@ -28,6 +28,6 @@ export const Field = React.forwardRef( {errorText} )} - ) + ); }, -) +); diff --git a/app/src/components/ui/input-group.tsx b/app/src/components/ui/input-group.tsx index 5d8fb32ad..992eb0f0f 100644 --- a/app/src/components/ui/input-group.tsx +++ b/app/src/components/ui/input-group.tsx @@ -1,15 +1,15 @@ -import type { BoxProps, InputElementProps } from "@chakra-ui/react" -import { Group, InputElement } from "@chakra-ui/react" -import * as React from "react" +import type { BoxProps, InputElementProps } from "@chakra-ui/react"; +import { Group, InputElement } from "@chakra-ui/react"; +import * as React from "react"; export interface InputGroupProps extends BoxProps { - startElementProps?: InputElementProps - endElementProps?: InputElementProps - startElement?: React.ReactNode - endElement?: React.ReactNode - children: React.ReactElement - startOffset?: InputElementProps["paddingStart"] - endOffset?: InputElementProps["paddingEnd"] + startElementProps?: InputElementProps; + endElementProps?: InputElementProps; + startElement?: React.ReactNode; + endElement?: React.ReactNode; + children: React.ReactElement; + startOffset?: InputElementProps["paddingStart"]; + endOffset?: InputElementProps["paddingEnd"]; } export const InputGroup = React.forwardRef( @@ -23,10 +23,10 @@ export const InputGroup = React.forwardRef( startOffset = "6px", endOffset = "6px", ...rest - } = props + } = props; const child = - React.Children.only>(children) + React.Children.only>(children); return ( @@ -48,6 +48,6 @@ export const InputGroup = React.forwardRef( )} - ) + ); }, -) +); diff --git a/app/src/components/ui/popover.tsx b/app/src/components/ui/popover.tsx index 3320659db..0262a8977 100644 --- a/app/src/components/ui/popover.tsx +++ b/app/src/components/ui/popover.tsx @@ -1,25 +1,25 @@ -import { Popover as ChakraPopover, Portal } from "@chakra-ui/react" -import { CloseButton } from "./close-button" -import * as React from "react" +import { Popover as ChakraPopover, Portal } from "@chakra-ui/react"; +import { CloseButton } from "./close-button"; +import * as React from "react"; interface PopoverContentProps extends ChakraPopover.ContentProps { - portalled?: boolean - portalRef?: React.RefObject + portalled?: boolean; + portalRef?: React.RefObject; } export const PopoverContent = React.forwardRef< HTMLDivElement, PopoverContentProps >(function PopoverContent(props, ref) { - const { portalled = true, portalRef, ...rest } = props + const { portalled = true, portalRef, ...rest } = props; return ( - ) -}) + ); +}); export const PopoverArrow = React.forwardRef< HTMLDivElement, @@ -29,8 +29,8 @@ export const PopoverArrow = React.forwardRef< - ) -}) + ); +}); export const PopoverCloseTrigger = React.forwardRef< HTMLButtonElement, @@ -47,13 +47,13 @@ export const PopoverCloseTrigger = React.forwardRef< > - ) -}) + ); +}); -export const PopoverTitle = ChakraPopover.Title -export const PopoverDescription = ChakraPopover.Description -export const PopoverFooter = ChakraPopover.Footer -export const PopoverHeader = ChakraPopover.Header -export const PopoverRoot = ChakraPopover.Root -export const PopoverBody = ChakraPopover.Body -export const PopoverTrigger = ChakraPopover.Trigger +export const PopoverTitle = ChakraPopover.Title; +export const PopoverDescription = ChakraPopover.Description; +export const PopoverFooter = ChakraPopover.Footer; +export const PopoverHeader = ChakraPopover.Header; +export const PopoverRoot = ChakraPopover.Root; +export const PopoverBody = ChakraPopover.Body; +export const PopoverTrigger = ChakraPopover.Trigger; diff --git a/app/src/components/ui/provider.tsx b/app/src/components/ui/provider.tsx index fd0331bf9..c1f896c87 100644 --- a/app/src/components/ui/provider.tsx +++ b/app/src/components/ui/provider.tsx @@ -1,15 +1,12 @@ -"use client" +"use client"; -import { ChakraProvider, defaultSystem } from "@chakra-ui/react" -import { - ColorModeProvider, - type ColorModeProviderProps, -} from "./color-mode" +import { ChakraProvider, defaultSystem } from "@chakra-ui/react"; +import { ColorModeProvider, type ColorModeProviderProps } from "./color-mode"; export function Provider(props: ColorModeProviderProps) { return ( - ) + ); } diff --git a/app/src/components/ui/radio.tsx b/app/src/components/ui/radio.tsx index b3919d08c..365e1d2dd 100644 --- a/app/src/components/ui/radio.tsx +++ b/app/src/components/ui/radio.tsx @@ -1,14 +1,14 @@ -import { RadioGroup as ChakraRadioGroup } from "@chakra-ui/react" -import * as React from "react" +import { RadioGroup as ChakraRadioGroup } from "@chakra-ui/react"; +import * as React from "react"; export interface RadioProps extends ChakraRadioGroup.ItemProps { - rootRef?: React.Ref - inputProps?: React.InputHTMLAttributes + rootRef?: React.Ref; + inputProps?: React.InputHTMLAttributes; } export const Radio = React.forwardRef( function Radio(props, ref) { - const { children, inputProps, rootRef, ...rest } = props + const { children, inputProps, rootRef, ...rest } = props; return ( @@ -17,8 +17,8 @@ export const Radio = React.forwardRef( {children} )} - ) + ); }, -) +); -export const RadioGroup = ChakraRadioGroup.Root +export const RadioGroup = ChakraRadioGroup.Root; diff --git a/app/src/components/ui/slider.tsx b/app/src/components/ui/slider.tsx index 55a7283bc..e3eaf5230 100644 --- a/app/src/components/ui/slider.tsx +++ b/app/src/components/ui/slider.tsx @@ -1,23 +1,23 @@ -import { Slider as ChakraSlider, For, HStack } from "@chakra-ui/react" -import * as React from "react" +import { Slider as ChakraSlider, For, HStack } from "@chakra-ui/react"; +import * as React from "react"; export interface SliderProps extends ChakraSlider.RootProps { - marks?: Array - label?: React.ReactNode - showValue?: boolean + marks?: Array; + label?: React.ReactNode; + showValue?: boolean; } export const Slider = React.forwardRef( function Slider(props, ref) { - const { marks: marksProp, label, showValue, ...rest } = props - const value = props.defaultValue ?? props.value + const { marks: marksProp, label, showValue, ...rest } = props; + const value = props.defaultValue ?? props.value; const marks = marksProp?.map((mark) => { - if (typeof mark === "number") return { value: mark, label: undefined } - return mark - }) + if (typeof mark === "number") return { value: mark, label: undefined }; + return mark; + }); - const hasMarkLabel = !!marks?.some((mark) => mark.label) + const hasMarkLabel = !!marks?.some((mark) => mark.label); return ( @@ -38,12 +38,12 @@ export const Slider = React.forwardRef( - ) + ); }, -) +); function SliderThumbs(props: { value?: number[] }) { - const { value } = props + const { value } = props; return ( {(_, index) => ( @@ -52,31 +52,31 @@ function SliderThumbs(props: { value?: number[] }) { )} - ) + ); } interface SliderMarksProps { - marks?: Array + marks?: Array; } const SliderMarks = React.forwardRef( function SliderMarks(props, ref) { - const { marks } = props - if (!marks?.length) return null + const { marks } = props; + if (!marks?.length) return null; return ( {marks.map((mark, index) => { - const value = typeof mark === "number" ? mark : mark.value - const label = typeof mark === "number" ? undefined : mark.label + const value = typeof mark === "number" ? mark : mark.value; + const label = typeof mark === "number" ? undefined : mark.label; return ( {label} - ) + ); })} - ) + ); }, -) +); diff --git a/app/src/components/ui/tooltip.tsx b/app/src/components/ui/tooltip.tsx index 644c37cee..ea71654f0 100644 --- a/app/src/components/ui/tooltip.tsx +++ b/app/src/components/ui/tooltip.tsx @@ -1,13 +1,13 @@ -import { Tooltip as ChakraTooltip, Portal } from "@chakra-ui/react" -import * as React from "react" +import { Tooltip as ChakraTooltip, Portal } from "@chakra-ui/react"; +import * as React from "react"; export interface TooltipProps extends ChakraTooltip.RootProps { - showArrow?: boolean - portalled?: boolean - portalRef?: React.RefObject - content: React.ReactNode - contentProps?: ChakraTooltip.ContentProps - disabled?: boolean + showArrow?: boolean; + portalled?: boolean; + portalRef?: React.RefObject; + content: React.ReactNode; + contentProps?: ChakraTooltip.ContentProps; + disabled?: boolean; } export const Tooltip = React.forwardRef( @@ -21,9 +21,9 @@ export const Tooltip = React.forwardRef( contentProps, portalRef, ...rest - } = props + } = props; - if (disabled) return children + if (disabled) return children; return ( @@ -41,6 +41,6 @@ export const Tooltip = React.forwardRef( - ) + ); }, -) +); From 639deb92c1b44baea7886bfd30353e20450d2135 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 13 Jan 2025 12:50:51 +0200 Subject: [PATCH 014/190] imports chakra provider from @/ui --- app/src/app/providers.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/src/app/providers.tsx b/app/src/app/providers.tsx index 79e53fe28..4dfccdb4a 100644 --- a/app/src/app/providers.tsx +++ b/app/src/app/providers.tsx @@ -3,7 +3,7 @@ import { appTheme } from "@/lib/theme/app-theme"; import { persistor, store } from "@/lib/store"; import { CacheProvider } from "@chakra-ui/next-js"; -import { ChakraProvider } from "@chakra-ui/react"; +import { Provider as ChakraProvider } from "@/components/ui/provider"; import { SessionProvider } from "next-auth/react"; import localFont from "next/font/local"; import { Provider } from "react-redux"; From a1fcaccf5b61c6e07e107b2d5f4e781a9c8dd21a Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 13 Jan 2025 12:53:30 +0200 Subject: [PATCH 015/190] update: modifies tsconfig compileroptions --- app/tsconfig.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/tsconfig.json b/app/tsconfig.json index 251f23e18..ec533ae20 100644 --- a/app/tsconfig.json +++ b/app/tsconfig.json @@ -12,8 +12,8 @@ "forceConsistentCasingInFileNames": true, "noEmit": true, "esModuleInterop": true, - "module": "esnext", - "moduleResolution": "node", + "module": "ESNext", + "moduleResolution": "Bundler", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", From ed1c7c1c408a16d4c8b3ad4956fdc52200883f26 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 13 Jan 2025 13:07:28 +0200 Subject: [PATCH 016/190] update: imports app theme in new provider --- app/package-lock.json | 1131 +++++++++++++--------------- app/package.json | 2 +- app/src/app/providers.tsx | 2 +- app/src/components/ui/provider.tsx | 5 +- app/tsconfig.json | 4 +- 5 files changed, 547 insertions(+), 597 deletions(-) diff --git a/app/package-lock.json b/app/package-lock.json index 400d97069..45c96cd75 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -11,7 +11,7 @@ "@ai-sdk/openai": "^1.0.8", "@chakra-ui/icons": "^2.1.0", "@chakra-ui/next-js": "^2.2.0", - "@chakra-ui/react": "^3.2.5", + "@chakra-ui/react": "^3.3.1", "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", "@next/env": "^14.2.5", @@ -376,60 +376,62 @@ } }, "node_modules/@ark-ui/react": { - "version": "4.6.0", - "resolved": "https://registry.npmjs.org/@ark-ui/react/-/react-4.6.0.tgz", - "integrity": "sha512-tOr0SdMwn1GrM5DzUC+ATLcGlvVVoan3g1rgYBZV/06LEKfs12+m0zbvJz9IpiOiy0dzBXvDQRgGsIlzL/6blg==", + "version": "4.8.0", + "resolved": "https://registry.npmjs.org/@ark-ui/react/-/react-4.8.0.tgz", + "integrity": "sha512-42GgXBbeNzxOin1Ac/X1dP45a6SM5np3tEq8qJmDA4h82AVdPXmtZ//3GMDdLl9CXngvSlKYqsrU+/be1xj3pg==", "dependencies": { "@internationalized/date": "3.6.0", - "@zag-js/accordion": "0.79.1", - "@zag-js/anatomy": "0.79.1", - "@zag-js/auto-resize": "0.79.1", - "@zag-js/avatar": "0.79.1", - "@zag-js/carousel": "0.79.1", - "@zag-js/checkbox": "0.79.1", - "@zag-js/clipboard": "0.79.1", - "@zag-js/collapsible": "0.79.1", - "@zag-js/collection": "0.79.1", - "@zag-js/color-picker": "0.79.1", - "@zag-js/color-utils": "0.79.1", - "@zag-js/combobox": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/date-picker": "0.79.1", - "@zag-js/date-utils": "0.79.1", - "@zag-js/dialog": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/editable": "0.79.1", - "@zag-js/file-upload": "0.79.1", - "@zag-js/file-utils": "0.79.1", - "@zag-js/highlight-word": "0.79.1", - "@zag-js/hover-card": "0.79.1", - "@zag-js/i18n-utils": "0.79.1", - "@zag-js/menu": "0.79.1", - "@zag-js/number-input": "0.79.1", - "@zag-js/pagination": "0.79.1", - "@zag-js/pin-input": "0.79.1", - "@zag-js/popover": "0.79.1", - "@zag-js/presence": "0.79.1", - "@zag-js/progress": "0.79.1", - "@zag-js/qr-code": "0.79.1", - "@zag-js/radio-group": "0.79.1", - "@zag-js/rating-group": "0.79.1", - "@zag-js/react": "0.79.1", - "@zag-js/select": "0.79.1", - "@zag-js/signature-pad": "0.79.1", - "@zag-js/slider": "0.79.1", - "@zag-js/splitter": "0.79.1", - "@zag-js/steps": "0.79.1", - "@zag-js/switch": "0.79.1", - "@zag-js/tabs": "0.79.1", - "@zag-js/tags-input": "0.79.1", - "@zag-js/time-picker": "0.79.1", - "@zag-js/timer": "0.79.1", - "@zag-js/toast": "0.79.1", - "@zag-js/toggle-group": "0.79.1", - "@zag-js/tooltip": "0.79.1", - "@zag-js/tree-view": "0.79.1", - "@zag-js/types": "0.79.1" + "@zag-js/accordion": "0.81.1", + "@zag-js/anatomy": "0.81.1", + "@zag-js/auto-resize": "0.81.1", + "@zag-js/avatar": "0.81.1", + "@zag-js/carousel": "0.81.1", + "@zag-js/checkbox": "0.81.1", + "@zag-js/clipboard": "0.81.1", + "@zag-js/collapsible": "0.81.1", + "@zag-js/collection": "0.81.1", + "@zag-js/color-picker": "0.81.1", + "@zag-js/color-utils": "0.81.1", + "@zag-js/combobox": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/date-picker": "0.81.1", + "@zag-js/date-utils": "0.81.1", + "@zag-js/dialog": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/editable": "0.81.1", + "@zag-js/file-upload": "0.81.1", + "@zag-js/file-utils": "0.81.1", + "@zag-js/focus-trap": "0.81.1", + "@zag-js/highlight-word": "0.81.1", + "@zag-js/hover-card": "0.81.1", + "@zag-js/i18n-utils": "0.81.1", + "@zag-js/menu": "0.81.1", + "@zag-js/number-input": "0.81.1", + "@zag-js/pagination": "0.81.1", + "@zag-js/pin-input": "0.81.1", + "@zag-js/popover": "0.81.1", + "@zag-js/presence": "0.81.1", + "@zag-js/progress": "0.81.1", + "@zag-js/qr-code": "0.81.1", + "@zag-js/radio-group": "0.81.1", + "@zag-js/rating-group": "0.81.1", + "@zag-js/react": "0.81.1", + "@zag-js/select": "0.81.1", + "@zag-js/signature-pad": "0.81.1", + "@zag-js/slider": "0.81.1", + "@zag-js/splitter": "0.81.1", + "@zag-js/steps": "0.81.1", + "@zag-js/switch": "0.81.1", + "@zag-js/tabs": "0.81.1", + "@zag-js/tags-input": "0.81.1", + "@zag-js/time-picker": "0.81.1", + "@zag-js/timer": "0.81.1", + "@zag-js/toast": "0.81.1", + "@zag-js/toggle-group": "0.81.1", + "@zag-js/tooltip": "0.81.1", + "@zag-js/tour": "0.81.1", + "@zag-js/tree-view": "0.81.1", + "@zag-js/types": "0.81.1" }, "peerDependencies": { "react": ">=18.0.0", @@ -2671,11 +2673,11 @@ } }, "node_modules/@chakra-ui/react": { - "version": "3.2.5", - "resolved": "https://registry.npmjs.org/@chakra-ui/react/-/react-3.2.5.tgz", - "integrity": "sha512-ZoKHxHSdbnkybrem4D6TfQUCGcrLsZno/eYzK3msKPO7J6UF6ScWkDaDz2fjVn2SAE5B/lM10d71BB+5ENxiBw==", + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/@chakra-ui/react/-/react-3.3.1.tgz", + "integrity": "sha512-npO3gwzU8Zf6EcfUSApeSGLgts12DVScyE316uXe17i0vO9xz5QladLKN+qdzA0YnSKsefZVErLAeM9FsKk/+A==", "dependencies": { - "@ark-ui/react": "4.6.0", + "@ark-ui/react": "4.8.0", "@emotion/is-prop-valid": "1.3.1", "@emotion/serialize": "1.3.3", "@emotion/use-insertion-effect-with-fallbacks": "1.2.0", @@ -9537,511 +9539,477 @@ "dev": true }, "node_modules/@zag-js/accordion": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/accordion/-/accordion-0.79.1.tgz", - "integrity": "sha512-GlyuRhc2Mwq0punW6dARPTM4EoIce4MxjNCuZLyMxEKt23xFEB5ICVNgz4X/4fyKu+0SaNpttztbBqzTv/fnpg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/accordion/-/accordion-0.81.1.tgz", + "integrity": "sha512-NMSx9DNz+FigY9E+FtT/3GCjpP4H0VTbBTmqUDxw3FYKgP3txPoIQGrV4Dig4hCtCiPdmlwSZatA29HrTi8+zw==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/anatomy": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/anatomy/-/anatomy-0.79.1.tgz", - "integrity": "sha512-kdwGFERoVlxLfBKFVrtY/3UATaU/Tqyxe2DBiwccy9RcY8LQlVAoFuRRmK1hlV7Dz9IXrPoQEDYTNgSORz4NyA==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/anatomy/-/anatomy-0.81.1.tgz", + "integrity": "sha512-x63RqFLdqz2a7KCxvpWXMAwr9A5lWtag4dslku6IBu5IT0oMYuQJ0d+3NeY74xKwdctTmnLs/xRsyUfey5DarQ==" }, "node_modules/@zag-js/aria-hidden": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/aria-hidden/-/aria-hidden-0.79.1.tgz", - "integrity": "sha512-UFp/u8ytJ4WASB1kUnJ+uJ/N6huRfIshAoRKnnfxJSE71QpJ0T8ncniuXv2L/rxjOXBr8nDRhRq9ZNZwwi69Vw==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/aria-hidden/-/aria-hidden-0.81.1.tgz", + "integrity": "sha512-Jsd4rmdZ73+S/PVnoCxI4BjN52okPECztPIxGvNiEOJfL+/YJWmHweprJgmHZJPt9rufZ05SvfeiKr2VXso0vg==" }, "node_modules/@zag-js/auto-resize": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/auto-resize/-/auto-resize-0.79.1.tgz", - "integrity": "sha512-eki2QeC3K7TLRizH7T/QKcIlwZnUMS+TsFO1fBJwWvW8oKESKfemWt05e6HsuORwVJGC/tkd2F5OTFGVVJXZkQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/auto-resize/-/auto-resize-0.81.1.tgz", + "integrity": "sha512-InlncZmgT+ofhrUEeQN8BOa8hUCpPNl6dwL83AxXk5J8k+SmfVr0hH6CNSeAEG9XUmepUGPzXQwYbA5t0KRtNA==", "dependencies": { - "@zag-js/dom-query": "0.79.1" + "@zag-js/dom-query": "0.81.1" } }, "node_modules/@zag-js/avatar": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/avatar/-/avatar-0.79.1.tgz", - "integrity": "sha512-fPVJ1SDzZ9CqnyEXBwZpldrCC48mhwsjyWzjlid7NHlBYothSvjy9+C11FyDA9ms0ziwXMIXKbo2uSz3qfdgvg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/avatar/-/avatar-0.81.1.tgz", + "integrity": "sha512-ooMCxBamNWYYi7ZHY+FFpGJouuHWaaO9DTYRwWXsr9pW+FYGcJcPXKKsaFGPeAldBs8dqlBmFdMOWylLySau4Q==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/carousel": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/carousel/-/carousel-0.79.1.tgz", - "integrity": "sha512-tc9BPbVWPutfJTw1WorgJxbMEQJN+7Ur5bkP+V5ght8BKl/wiHhaR6KFEGXVtQVgH/dUMaViFTX+OeGzegk6Wg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/carousel/-/carousel-0.81.1.tgz", + "integrity": "sha512-iQRnR5yYChFOsdAGAoH8bZei9tlSCngJJ1Bka8j+XvLHLyjOe+fqhaqwlkAFunMH1kEo1lHVbFDQ5FPGZq9PgA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/scroll-snap": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/scroll-snap": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/checkbox": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/checkbox/-/checkbox-0.79.1.tgz", - "integrity": "sha512-QF79sAfvJpw76+H5+7KkW3Lify8csV4CA9JLyGpL81m9LJTC8yeKXUnN5be9ZKjDKlNsg0INk9nVBI0a6Q037Q==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/checkbox/-/checkbox-0.81.1.tgz", + "integrity": "sha512-HmoRt7luHZXvNlsqQW5rrQlcFEVKthFkZPgAwUKM5xD7MaifDQUfaWMcOkYUBpJtziDufV2CcdIu9d1z4/hSMA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/focus-visible": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/focus-visible": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/clipboard": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/clipboard/-/clipboard-0.79.1.tgz", - "integrity": "sha512-LDIEAeaAm5lwWhijS+w4/Psa9rUppiarjKv6qPjNL2iBOGmlU2Tw2LukCbZpY4Sg12y7BqesyK0o+5BBjwetmg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/clipboard/-/clipboard-0.81.1.tgz", + "integrity": "sha512-ccDxY+8CsM6XvOnfSQmQqsa99XXjjByVYD4ovylk6+jXwVhToyjOxGiQq/n8zALXHLj2hM/1WIvDwZGTPr1GfQ==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/collapsible": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/collapsible/-/collapsible-0.79.1.tgz", - "integrity": "sha512-NMg5zvWSrVq1uFA/TN/mRBYdsxw9/rWnaNSO0DT0h2gP+l5HUouz1wlz8Tkwa4VRhW0rrg20kGEhwAHZ8uPdrw==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/collapsible/-/collapsible-0.81.1.tgz", + "integrity": "sha512-oPnmsVtS3/1olPY4E0IwoixK95MDjIGmfHPVmNX3lioN9hbszxBoUQtsZ0ryXNH9HXvDbnJ/KWtpMELjj2TjPA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/collection": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/collection/-/collection-0.79.1.tgz", - "integrity": "sha512-PeOqddL2M6+2cKJhTP3aahGxV4rJgwwGJz9hYVQs+H7+yHLDrG99vDpphWDL6g8kDlyQSpijwl5+gR/z52cw0A==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/collection/-/collection-0.81.1.tgz", + "integrity": "sha512-cGvBWL0Z31Vt/RTyuwarkokfer2zlw92+mlX9Hed8198aWyI6bklmaZs77xO89fy8Osjjik/STB6TyItgn1jPA==", "dependencies": { - "@zag-js/utils": "0.79.1" + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/color-picker": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/color-picker/-/color-picker-0.79.1.tgz", - "integrity": "sha512-2v0VX86G53kcB+OIjLDXK752iFM2GUQ1/UUHnLVXWvo5Wfi+Oa5wRDMaMDXt/nI35NU8C55k2Hnbk0dYTQZj5g==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/color-utils": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/text-selection": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/color-picker/-/color-picker-0.81.1.tgz", + "integrity": "sha512-O7AI1BK/GWlyF3pf9O/9iVk2hcBaaJdBAoNyzqrI6+dPgrjs9eXA4VYyavcHZBm3ABCzqZ7ePO9mnBi//wag8Q==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/color-utils": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/color-utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/color-utils/-/color-utils-0.79.1.tgz", - "integrity": "sha512-a+0HGl/vfhtTBEZzoLZjNVZMOMBFrDRXDZvkan1Wz6hk2oLHdgfpGoTt/Vu93A62queXlt2Q7gbn1mFocRNg7w==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/color-utils/-/color-utils-0.81.1.tgz", + "integrity": "sha512-Fq4vktoW3UmrhFMb731ldODDSQrLsSO+81eADBzbz3CgGOCOy6rYv73aIgvAgngTOp9Q98NQnTxyt1S8eEGOaw==", "dependencies": { - "@zag-js/numeric-range": "0.79.1" + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/combobox": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/combobox/-/combobox-0.79.1.tgz", - "integrity": "sha512-elOshWIEHYqUfmbemnNF39xWinLwG5sQB+OgCaeo0Z9bc79yXHY83bOtquc3WceOasnqzpDeQeu19fmBmi+euw==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/aria-hidden": "0.79.1", - "@zag-js/collection": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/combobox/-/combobox-0.81.1.tgz", + "integrity": "sha512-FHJPDZ/A54+ksDJ5dl/Aj49BHso7T8k7s7uSADLvEVJ3kR9qJ+zTdAXR01IQPn+rZWxNUShD76YRK2VKzVt+JQ==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/aria-hidden": "0.81.1", + "@zag-js/collection": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/core": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/core/-/core-0.79.1.tgz", - "integrity": "sha512-kfYas04BQnbdL46nDfBjELAHcba+Lq+D2xts1mKbFjgxb1HBDYh0mIngjilAP/8y2Pj2XsjuVlfn3wsuNldqCQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/core/-/core-0.81.1.tgz", + "integrity": "sha512-LJwPH5RgY0EUDDSCfpXFoXQ9+CwakiZOjo9SZdq7lk+wYmP8hCv+r2FCAPclSHljyrGqpIlHU/brkcFslkcN4Q==", "dependencies": { - "@zag-js/store": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/store": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/date-picker": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/date-picker/-/date-picker-0.79.1.tgz", - "integrity": "sha512-IjSB7N4JmlKKNDOcIwoBdXNZCcjxO1AsDmty7k3mOJgGzsCGkxUY6kyTzB+HaTmr+6yyieu+4CrXmVueIEXn9w==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/date-utils": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/live-region": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/text-selection": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/date-picker/-/date-picker-0.81.1.tgz", + "integrity": "sha512-Mrhi+wFJ8I59wmRIMU/0tuL1D9/ycosmtifD7U63leZJZM32lk+Do7YUhP0FyZ/qBVcjCykU3rJZkHL9EBOuFw==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/date-utils": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/live-region": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" }, "peerDependencies": { "@internationalized/date": ">=3.0.0" } }, "node_modules/@zag-js/date-utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/date-utils/-/date-utils-0.79.1.tgz", - "integrity": "sha512-WKg2ks+G/sGgl/WaJu7OO9IYxFP2UdZq8yy0iMNIEQceIGCpYDjLr43Vov1+6mipQ9+oBgXxJQu4+VShpjyesA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/date-utils/-/date-utils-0.81.1.tgz", + "integrity": "sha512-NWen8ebvNkPbENaVS3qcpRjeEhcjF0uiDzBlg1cBdqu2A2EUfO1/lrjYTKpboTC2fQeVoIPdrvCkMXvywHFr8Q==", "peerDependencies": { "@internationalized/date": ">=3.0.0" } }, "node_modules/@zag-js/dialog": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/dialog/-/dialog-0.79.1.tgz", - "integrity": "sha512-OkOjAnElcxYBkylg/hXZaeKZGas5aNwKT6Tu2qnZp7bQpoNnECIkkpUMhYqJGRG+PGm1zIB8/J4oR/rUx6pdPA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/dialog/-/dialog-0.81.1.tgz", + "integrity": "sha512-Jt6ReyeMAveLKgerhhnpiM0ZKrHCyGmRgRtFbW7o4WSQ63UUyTPgUYIvyRJeVJjAGF6IcfvVVVVY3YthRyzf8A==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/aria-hidden": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/focus-trap": "0.79.1", - "@zag-js/remove-scroll": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/aria-hidden": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/focus-trap": "0.81.1", + "@zag-js/remove-scroll": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/dismissable": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/dismissable/-/dismissable-0.79.1.tgz", - "integrity": "sha512-KAEPoXKAZVztCKhKK6EuWnLqKfAfeE3ltUPGCV8eTPuYyPy6JsKl+pvumdmIJnMY0awi9IThLUwnDlPrg/UpuA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/dismissable/-/dismissable-0.81.1.tgz", + "integrity": "sha512-PT19n3CK5XW7S3dQhFLxALsJ0JFsOdukxVNE5iLHPAKEuJeM6dnzG1pn6x3U1wrGybHZgaZkyiF4PWsvXsdaiQ==", "dependencies": { - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/interact-outside": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/dom-query": "0.81.1", + "@zag-js/interact-outside": "0.81.1", + "@zag-js/utils": "0.81.1" } }, - "node_modules/@zag-js/dom-event": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/dom-event/-/dom-event-0.79.1.tgz", - "integrity": "sha512-PMgtMfl7iPt9kbGMu8tgHYDSWBo/0bKOILWoKtuOZEsOI1QTud+8RhrYmWqvr/Go9W/99YmjzAIS4Dcd8jJDIg==", + "node_modules/@zag-js/dom-query": { + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/dom-query/-/dom-query-0.81.1.tgz", + "integrity": "sha512-5CsCVT6xUIwj5hTmsSplqdZXC5HFXj/wU3p+Mp0XjM63fgJODXZh79DPjx/Vqo/YrqSQPoK5dHRhUY8fiDyoSQ==", "dependencies": { - "@zag-js/dom-query": "0.79.1", - "@zag-js/text-selection": "0.79.1", - "@zag-js/types": "0.79.1" + "@zag-js/types": "0.81.1" } }, - "node_modules/@zag-js/dom-query": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/dom-query/-/dom-query-0.79.1.tgz", - "integrity": "sha512-9z4IEK9q5m/yMyxoj8BPqIurMqRIvRiK2/nAY92n2mP3MTeTKf+AFpMHXGz7wArPx2NIRq+Q7TdfSMey3vKs2w==" - }, "node_modules/@zag-js/editable": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/editable/-/editable-0.79.1.tgz", - "integrity": "sha512-sAK8CCb1L+jwUaxKpBIdtZWFuxCPUhx9pCtm2d2r9nbmsam3iFBbe52PjjcndEJcVB/n5TibUbfptkzI/4oGOQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/editable/-/editable-0.81.1.tgz", + "integrity": "sha512-phH7pdgwn/KTnYxe7W83j764Z28fqk0rTxzAYj2Rb5ctQA8ls/UdsbBpdALEx08+rxw3pELT7wxk2Rm+n6Ljqw==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/interact-outside": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/interact-outside": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/element-rect": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/element-rect/-/element-rect-0.79.1.tgz", - "integrity": "sha512-BO4n9vBB2MdEHYh6fxy5gMmJXwN65dt55xKxvQYUzrVI8ds2mHnQgDAVGwnZpnXvbXNAd2RLqjksketdhNIoBA==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/element-rect/-/element-rect-0.81.1.tgz", + "integrity": "sha512-f11a8MqEEi8yZ4+WmoWpjDBpcWh6kZwkNYyNaVBqseWT9xGTjW3hXxz4L8G0kZaxcsMI2EEv9FNX7tB8FqJD/A==" }, "node_modules/@zag-js/element-size": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/element-size/-/element-size-0.79.1.tgz", - "integrity": "sha512-a75L+5YBsubFgjyt/fnvZB/E00wUbDm3VM3JBdvWxX/7gyrazFMyC3kt8Yaf7GmoW8N+h8nZ4nbzhhHImFl8Ug==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/element-size/-/element-size-0.81.1.tgz", + "integrity": "sha512-taasImQwXYDvlhQ9L0tPHjbG2Yxqk1FU7sIu5qf9ml1btUEAVah3+DTiCMKBsm+NzgyPY2bsRMqMW3I+4kvkaA==" }, "node_modules/@zag-js/file-upload": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/file-upload/-/file-upload-0.79.1.tgz", - "integrity": "sha512-DnEIP34wVvH9F8F9qEUARP8rdMQCCtjiQX9WXHhqLJA5w3t+EVLL0zGtNASXqsUCWHiE4xCEJbgyHfSXYfcttA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/file-upload/-/file-upload-0.81.1.tgz", + "integrity": "sha512-a19kPUQ+5lyZRI9qK5ANBNTPY5syKJyva4ahmUm1EtV1Wt89x8xVRc5YG8XXaKlKrZlJdDvNPh2rMhV9QviBJw==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/file-utils": "0.79.1", - "@zag-js/i18n-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/file-utils": "0.81.1", + "@zag-js/i18n-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/file-utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/file-utils/-/file-utils-0.79.1.tgz", - "integrity": "sha512-Ss7A9vyDnw9gn0gSzO59JAsk3xb06mQTtGP1n9/iBi2ctkHLoeN41RTRPZ3jfSt4kRfUiK7Gon+y0VE/vUC9+w==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/file-utils/-/file-utils-0.81.1.tgz", + "integrity": "sha512-oO+7U8TjUSKxnCG9PtG+6SAgzNkf2cq+lTBjOruaRz3sbrxfNMiz2xf/fIbuhEvHryPKWo86Kd/u/kvU5/gY1A==", "dependencies": { - "@zag-js/i18n-utils": "0.79.1" + "@zag-js/i18n-utils": "0.81.1" } }, "node_modules/@zag-js/focus-trap": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/focus-trap/-/focus-trap-0.79.1.tgz", - "integrity": "sha512-dofZPlwyBFYACmT6+afSOwcRgFFAJni3xMXL7qCb0E3LXYxbb7AgFIrSLNic0iMSfP4iAE1pd8THnQHdkH2tYQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/focus-trap/-/focus-trap-0.81.1.tgz", + "integrity": "sha512-hhW+XkuaaPyTdEBIIEjex+Sflr8sd5pCU/ISyGs4x5wHaPSfYjTUlpasC6ISZ9ADs4kKVidfDnY7u60a2WOAeA==", "dependencies": { - "@zag-js/dom-query": "0.79.1", - "focus-trap": "7.6.2" + "@zag-js/dom-query": "0.81.1" } }, "node_modules/@zag-js/focus-visible": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/focus-visible/-/focus-visible-0.79.1.tgz", - "integrity": "sha512-yWNKy6ybkg6VA2uXarEg+1xIuz2iwbn9TD7FZXZPxDgd2RzUacXuyhhTJlENEwGVcweZQkg78XzOWUCbXR2+iQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/focus-visible/-/focus-visible-0.81.1.tgz", + "integrity": "sha512-sQopikZzXGNBcxfPzhsJn2/txD5KDoFIuZpN1TwZHCx6JTBtzWHCl/t9VpULeTSbERdCI9iTx5Zt4QxceuwEBA==", "dependencies": { - "@zag-js/dom-query": "0.79.1" + "@zag-js/dom-query": "0.81.1" } }, "node_modules/@zag-js/form-utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/form-utils/-/form-utils-0.79.1.tgz", - "integrity": "sha512-AcfqKWqlReo38OKQFlC2Jx6/wT7Zmx5x22C1dXN9TvxhvqolpiQPT7eZ/Un7xq4D55lhzdJOPfh/esQ+W6ErDQ==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/form-utils/-/form-utils-0.81.1.tgz", + "integrity": "sha512-Zb7PvXZWIsudQsT+MZtG+HTsP/s1izifzj3ce4jEh4bgo3heLlwPTGkm+4mGqVAivcaPW4HmvwmLOgWoiXA/3A==" }, "node_modules/@zag-js/highlight-word": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/highlight-word/-/highlight-word-0.79.1.tgz", - "integrity": "sha512-D3yt9BmBUPMXZngIKxEFJO/D7sX/+3Dd3hcOPOilJD3gP9IFPZCC2YHkXUXJ/cv9kyzXdweAOAJY7b6bJST0dQ==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/highlight-word/-/highlight-word-0.81.1.tgz", + "integrity": "sha512-PU4zcfVSj446CtSw+viYkFMGkCjZvrZvQxPnGENFNNUHpsnwudz1a/NJiOPxSJTLY+C0FP0vanOl9YbgEL5xGQ==" }, "node_modules/@zag-js/hover-card": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/hover-card/-/hover-card-0.79.1.tgz", - "integrity": "sha512-QHMKCT56Gh+eqdhVFaApXqY1jXh2R+ROM3g5Qif06woN8/1tk4OmgsAx1TwSK7nPWp3iNqiSZUq6x9yZ3GFqCg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/hover-card/-/hover-card-0.81.1.tgz", + "integrity": "sha512-xoAVYUf4sk70f8z1wbeITU+QiGy7jqdPgNkbT6jbklKVS/N8Y7WdWPU67ebCJWDLrUFQ2szG3nJVY/ZiACu1RA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/i18n-utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/i18n-utils/-/i18n-utils-0.79.1.tgz", - "integrity": "sha512-jw7oARe27Fy/6sRiRmX6nf86HxZ6nXW1jfEBc8X0Ciebm+IIowZbWywpHZJKDi9wlnWOsK6XxC1rINId453NVg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/i18n-utils/-/i18n-utils-0.81.1.tgz", + "integrity": "sha512-/7sQuPOewdf/KpQQkizQplWIS/3PH+iqexef/IV/1sS+KgmTrTz8UsVKm4Vw7FcMmFaWlAOdHqS3UgWiJ2j24w==", "dependencies": { - "@zag-js/dom-query": "0.79.1" + "@zag-js/dom-query": "0.81.1" } }, "node_modules/@zag-js/interact-outside": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/interact-outside/-/interact-outside-0.79.1.tgz", - "integrity": "sha512-baNBMvlv9GuMGt+Dj4JOuOj1djEHXTR1UruWn+6TNuwqKlYtB0jJY+qCjLvFxldfAaQU0i6oD3l6in5E86TEIg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/interact-outside/-/interact-outside-0.81.1.tgz", + "integrity": "sha512-jfeDlxNCYbRgKwcIdSjr0C6KChbbJSQyeYi+TDmqAQEVTiVYQo3j3NMdoV0V+IVoK+xnj4wC5DhRdEIHLzRiCA==", "dependencies": { - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/dom-query": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/live-region": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/live-region/-/live-region-0.79.1.tgz", - "integrity": "sha512-VnU/fem0/Ue9Cgqk+eVTgCu8QqnlixBBUay+PceFbsBjWl3jcA9cXSnwhP/lQzwdq958foEqh/N4fD+wDc9SBA==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/live-region/-/live-region-0.81.1.tgz", + "integrity": "sha512-zyR3xbKOBQ5qftXy8TCUkj8ZAn5p2UKMgsNLYaxW2UVKMy3syMfJ57BFqg8Hvw1vZ9X9orwQG8vSb85ZBIWP9g==" }, "node_modules/@zag-js/menu": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/menu/-/menu-0.79.1.tgz", - "integrity": "sha512-0Oryb9QRCRlu+Y1jndZdt4lTwZ4BZXiwHXsW6XF1uekks0C/AKbVzVUYUAQME58CFDbeMzf+wigQqsm+fuq0Xg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/menu/-/menu-0.81.1.tgz", + "integrity": "sha512-CUDkAvEu/Z2xpY9KJC0Y5//nJ3FWSoOB1bml5fJVfmHSzcwU5JJ2deop1JgFGrOyIK2NYWKsiLRgONpLnkuEAA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/rect-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/rect-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/number-input": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/number-input/-/number-input-0.79.1.tgz", - "integrity": "sha512-oJXx8yA86WtMdIMCQdWbviPXQuE8HfOYhgEKBSliVjH1d3hBXTZjhYIrvfy/0x1M7sYWb/J+0Bt+AOzSj9t2dQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/number-input/-/number-input-0.81.1.tgz", + "integrity": "sha512-NBtSgYcA8lbHC1Wn+XKXcy22qA6JBKOXxVUPuMl8RIDNPbIG5MmU1wa4XwvvvpPKdoaXvAROUiP9MgPAJgACoQ==", "dependencies": { "@internationalized/number": "3.6.0", - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/number-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" - } - }, - "node_modules/@zag-js/number-utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/number-utils/-/number-utils-0.79.1.tgz", - "integrity": "sha512-SHmbXDkMBcTMtl+X7kQd55/a5JpRKzZZ2Gq1Ve8y2CoVKErX2mFHDR2nY8SBpwBO3J5/OoE5MTyNQ0slaRUi9w==" - }, - "node_modules/@zag-js/numeric-range": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/numeric-range/-/numeric-range-0.79.1.tgz", - "integrity": "sha512-4bwwjqi/o2AwbPNlP25LY2z6OX8y9unOg+V+TfXjtAL/Ml1q0CMuvle4CxVm/gNBedvP9TrbmYzpj6SfxiXRGA==" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" + } }, "node_modules/@zag-js/pagination": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/pagination/-/pagination-0.79.1.tgz", - "integrity": "sha512-kM93D+7kpHXz9Gea6ZkxywNBPVcCEfN1EhdJ/qQodvmHUoBpCR9/CiQFrxx1wznSz3W4Nagrg8LEqCu5+JjZwQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/pagination/-/pagination-0.81.1.tgz", + "integrity": "sha512-ynHXkAA/LLjRvlShr+e288sB0b1mP9s6rZItPnrbs7iSopGH5C+T6yqTuBPhSKTQRL36ixw6rjbI0TusnXhlvw==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/pin-input": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/pin-input/-/pin-input-0.79.1.tgz", - "integrity": "sha512-uZ+rDDuLH1x03kA0rRa+vBjZT3p4c7ytoXp/XP2bcKw+QlrBtjijmXED3kw4Bp/oOkov4jRWERtGqj+8Ptz1tA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/pin-input/-/pin-input-0.81.1.tgz", + "integrity": "sha512-+oUdY+LISM1NLHrMax/wiuEhYjRAAGKZT8xY/6g4C464Xqahjc2GNQjpoJ2V2S7N7vn7Prw4m+6rbe4TWAr1Pw==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/popover": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/popover/-/popover-0.79.1.tgz", - "integrity": "sha512-DCTwrL4PBQX0LVmn6GIv3t931QKZxztkzIZ6jKD1Tn/tu+d6dkdAaw8Ebp55xuK2mKKA9k0eKeUdI3p4ja91Hw==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/aria-hidden": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/focus-trap": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/remove-scroll": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/popover/-/popover-0.81.1.tgz", + "integrity": "sha512-rL+6buqokxxAwCzPFmKt6p7G07zdH34ix1n1MhUVStllU7e/1Kho/bL7qeELFTIJDcgmmKBRj7sa8VJOTj0uJQ==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/aria-hidden": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/focus-trap": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/remove-scroll": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/popper": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/popper/-/popper-0.79.1.tgz", - "integrity": "sha512-kvvkB4Z1auLguPWi5ed36E14V3Vs57dNjD9p6Kwugb/dYrGUXA1n7FTC6qgZ8IZKNF0xb5FN3Wx527u/n+OPwg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/popper/-/popper-0.81.1.tgz", + "integrity": "sha512-zTGVu8bVtuGatwrtPdL8jahvWg+wx6N4sWuuCbh7FJbfVfQ849NRgP7im0ar4MLoMFcELkJGmxYQoJ1kbtPVIg==", "dependencies": { "@floating-ui/dom": "1.6.12", - "@zag-js/dom-query": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/dom-query": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/presence": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/presence/-/presence-0.79.1.tgz", - "integrity": "sha512-YJPFfqFCXs6vMVT/1w5gI60RcnC/JUz+FZRVXA8ElffStn/73HeKNa7XORX2Q2noEkRGEU5LUtkHzoiSxsmVAA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/presence/-/presence-0.81.1.tgz", + "integrity": "sha512-9cWVU8ciU0oG3wJbo6AftDCdpBIGNIk3UqXxAQf4LI//FgnOiYtOmpvl9LXrS1MqEOAwnR6rkCeiNjTmW8O4Mw==", "dependencies": { - "@zag-js/core": "0.79.1", - "@zag-js/types": "0.79.1" + "@zag-js/core": "0.81.1", + "@zag-js/types": "0.81.1" } }, "node_modules/@zag-js/progress": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/progress/-/progress-0.79.1.tgz", - "integrity": "sha512-AsFoJOMyRdNW9ELhliMCqTNBvlKMvACQyolxzMn/5Lo6BsdDKGcGqTrhmc9OwgFYq9EAfrocrRs/ks2j6OGzaQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/progress/-/progress-0.81.1.tgz", + "integrity": "sha512-mgUt8sub5DOCv2ic5UJqqWsR5tM/HWqMY2ug5LVN3WD9d0ChBzi2TB5nUprunDa1xbGQfk3AyPNYNYnkqHaVLQ==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/qr-code": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/qr-code/-/qr-code-0.79.1.tgz", - "integrity": "sha512-qkBvAUEQLm2gEUkFZMOL12xH9vB55Y0NEU2G7T9MlTsaRjkvRApzcqrFgL90+EYuvXVSHBYnXNPHhFTTMqCZ0A==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/qr-code/-/qr-code-0.81.1.tgz", + "integrity": "sha512-aM2e8LwMffUq5PHaBTFseTb5PUmTgD9+avc4R/IqD6bXod/RRc0C5n2BhAsOMJnXFFucq2Wuwofk2dS4FlQ4vQ==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1", "proxy-memoize": "3.0.1", "uqr": "0.1.2" } }, "node_modules/@zag-js/radio-group": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/radio-group/-/radio-group-0.79.1.tgz", - "integrity": "sha512-Lcci+UQVpqbvlJOxHMzxbAGILezBwedW3Q3SARs7AydLnikKh97CKidjEIsYdikN/fCb4dCtvAx5n3W2Flw7Pg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/radio-group/-/radio-group-0.81.1.tgz", + "integrity": "sha512-EOE9Usqf2ih6j7VqwtRak1Gq2WkMOaTh3xAgFSIpId5gI5lmbx5IPjyyufp9XZJzn6LOkHRViMHllGA9d1A2Ig==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/element-rect": "0.79.1", - "@zag-js/focus-visible": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/element-rect": "0.81.1", + "@zag-js/focus-visible": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/rating-group": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/rating-group/-/rating-group-0.79.1.tgz", - "integrity": "sha512-biwSdA42vmCW36Ys4Nr48uWt2tSmd0DHBhfo3yfH0cc8r6qDx85vj1TgHIOq89mPfrFLPvMR5/isWcw0bQpsdA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/rating-group/-/rating-group-0.81.1.tgz", + "integrity": "sha512-9MbeNVQeLDw/PppnCrJo7I9UOGzMCstzfPyyM3Yrpt8KN+hP8h2nHW1JHUvXQ9OslJWjKLnCLxJReEJxGxNdJQ==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/react": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/react/-/react-0.79.1.tgz", - "integrity": "sha512-DHxBW/Z2PQiCFxjxUcfxOCeqdzCQMy8Gz54CaIzy1Nh18BJEqwaoVAT7FPRB49iFY8Nqi4xYibMzFXItNHTmMQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/react/-/react-0.81.1.tgz", + "integrity": "sha512-fEBk2ejKCYDiHLEbNB6B+WgtzfigvKLP8Q3RSVc/IP9y6DkdztdWGZ80GBB/7cRdcbBOBZGK0ZEEi76iSC5YVg==", "dependencies": { - "@zag-js/core": "0.79.1", - "@zag-js/store": "0.79.1", - "@zag-js/types": "0.79.1", + "@zag-js/core": "0.81.1", + "@zag-js/store": "0.81.1", + "@zag-js/types": "0.81.1", "proxy-compare": "3.0.1" }, "peerDependencies": { @@ -10050,259 +10018,253 @@ } }, "node_modules/@zag-js/rect-utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/rect-utils/-/rect-utils-0.79.1.tgz", - "integrity": "sha512-nkSOiRLzcICs2/lQbCZayTcJZLP1czirFDxClCxj+Nv/p4GkYIegEQHDNXy0tstrkJNr1hypPop0q8N3HqcHzA==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/rect-utils/-/rect-utils-0.81.1.tgz", + "integrity": "sha512-3BkNYhEYZYBk770EUiM/aZ9k1HJg9FaWKOHXGpfZpndlqjUtLLMehej7752KFcpZaDRtUZ3Po1WXq0sIgwEtxw==" }, "node_modules/@zag-js/remove-scroll": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/remove-scroll/-/remove-scroll-0.79.1.tgz", - "integrity": "sha512-bBkS9ma49lNWZhqkl+B96PW107WD2MtJCQ14QzkoTBWHNCGYm8XoQg7tm/PuR+CuMsqpPul5NQgB8NO/dQIElw==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/remove-scroll/-/remove-scroll-0.81.1.tgz", + "integrity": "sha512-ONcWwEAAa3W9kYTHKoILGlFPJQ8XHvXkaVeYA+t8IlCA5pK2cS7yGA8ItyQUFFbJu1k1es53DQESXqZHtOoWTQ==", "dependencies": { - "@zag-js/dom-query": "0.79.1" + "@zag-js/dom-query": "0.81.1" } }, "node_modules/@zag-js/scroll-snap": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/scroll-snap/-/scroll-snap-0.79.1.tgz", - "integrity": "sha512-ImlGIEQMYfwaC1WJR04FoxjgCWHWmcxY4RR5SmkHJcCOMSoAFWRLsPfkHaBJawpgWx4vYMQmRjtuyXWdL92Tdw==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/scroll-snap/-/scroll-snap-0.81.1.tgz", + "integrity": "sha512-eRbyvLxPI+rRkgd2GYCz9xeesucFgpqa9NPI3ERTibSsMSTOgZsYogi8vn6rXfW/YGS4xgiXZbVSMRgEeLPijQ==", "dependencies": { - "@zag-js/dom-query": "0.79.1" + "@zag-js/dom-query": "0.81.1" } }, "node_modules/@zag-js/select": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/select/-/select-0.79.1.tgz", - "integrity": "sha512-0X6YW3ej+dmYDAgePvMgPSPJyVrdIQoaTBU1D5Kq3sPVk3wupSg3HGmBu1ckdLq7+Ijf3qWiESwLQFC6aRxWFw==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/collection": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/select/-/select-0.81.1.tgz", + "integrity": "sha512-eYCJoxUfwXBMSI/+GLZCzmT3P2UMInKztRt064bW+pLMIHhsHCoUKoNNzDFFx9q27HKgXk6pZIp4/5ZnxPF4WQ==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/collection": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/signature-pad": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/signature-pad/-/signature-pad-0.79.1.tgz", - "integrity": "sha512-mfU3hccyfmHP29fNoeWYQYsV4qg7h32diyWNkM1zMYjjsoVwwtOROy3zAf7McNeYZgdDU8/XiDkriw7fnqFkAg==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/signature-pad/-/signature-pad-0.81.1.tgz", + "integrity": "sha512-wHFeZuwoJWG5/Tk5u8T7M+ENg9nkBf8md14huW8MKVcfkLNi+a/z2B1KzodWnn4mekxUMEKAXhOdmELqqAHSOg==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1", "perfect-freehand": "^1.2.2" } }, "node_modules/@zag-js/slider": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/slider/-/slider-0.79.1.tgz", - "integrity": "sha512-fMMPge9walxA2+w54K4JXFHdUshTwhtU3DZp7xbi5Fmv1vzCEu8qUue3uC+rCMB7728/uj/Gh7i24zjRaJTsaw==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/slider/-/slider-0.81.1.tgz", + "integrity": "sha512-1yPml/nIWpiijEmUxYzlPOIi6v2r+URhBM9giEG9mwaUU9uWtYrEQKSQVQChkPlW8xoNxtqtG6wNjEjekWDqfw==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/element-size": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/numeric-range": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/element-size": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/splitter": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/splitter/-/splitter-0.79.1.tgz", - "integrity": "sha512-GUnmAW7qt37nAyixckb+BKVgrvrjoi+nETgw0d1Q990oUCpYyUw6MdRbTpvO9w9TKOh7yydZC9zJLg3azSpDNA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/splitter/-/splitter-0.81.1.tgz", + "integrity": "sha512-KlSIsCZWL1zLfqE05xyGYVKxu8OiQ91yVBqsJhuHUPTH0Ww/UQI4sU70yWqePrGi+L+VieMZUia4OFKcmhvljA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/number-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/steps": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/steps/-/steps-0.79.1.tgz", - "integrity": "sha512-eexfVZEX3aeMxymjr1+cduTgfIUbxftf5Sa9HDK8HiC+BmlO/Blju/In7kn1EwXJZ7pgVcwDibuJjng8KJRJTg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/steps/-/steps-0.81.1.tgz", + "integrity": "sha512-RA/TFqsc0QBgL61R8rWUhawANvZIaXN3nNP6RQ/qcYQpVjCLIC97oDrWvZd//THrMay65wPT4iuOGkBoXLqr5g==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/store": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/store/-/store-0.79.1.tgz", - "integrity": "sha512-mcXuiS7iqPTFU5sfli4v4kzBJcEAL3L3SVe8l9XezXED6UXYCGHjGQqpNuzsBfY29GPwUOwcF8FfFizxpCL1mQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/store/-/store-0.81.1.tgz", + "integrity": "sha512-IsRnK6G/I5Sx8kxLC/PNUmxduOeLsrtgWuw1FGu1x88BgE+/akmL9fZoGdQds+TFNPESTtqWQxiTFm1w3nn/aQ==", "dependencies": { "proxy-compare": "3.0.1" } }, "node_modules/@zag-js/switch": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/switch/-/switch-0.79.1.tgz", - "integrity": "sha512-i+32oau7E1PQyHM6iIOxWDYjMgYHFoiDPg+DzMFQgykw49sXO5y4Ux+406MjXnqaGDA7nI8UhDOGqIl+AhvYKQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/switch/-/switch-0.81.1.tgz", + "integrity": "sha512-2lEOGzVW2bqA2GY7HVg2aKXsQoD0v65K9qVuJiP/9Lpst6JPOw5E6nEZj1xOheluHJVI29R/HBUIw9GU27MroA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/focus-visible": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/focus-visible": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/tabs": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/tabs/-/tabs-0.79.1.tgz", - "integrity": "sha512-ZFJoggGOhvHszxZacXIvBKV2eKFOjJy5DT123d894RZjDy0yMOZwbN/J2T+dMw4ZttuetLvFJ6HAk26XR7iPhQ==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/tabs/-/tabs-0.81.1.tgz", + "integrity": "sha512-B24xFIfVJRL0nbzp97mqKN1zJKVrL8eXR2TOq+1ZxqrnnUZ5RQNzqo46wFIItRQsHjvbxyuI54KgvL1bp29wiw==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/element-rect": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/element-rect": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/tags-input": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/tags-input/-/tags-input-0.79.1.tgz", - "integrity": "sha512-3gPkNpk45eMaoERY81nEVgeW5S1hOug8rz1ZCJ/NBU1MWy/vuIcOyqWV7Ccc6Hxu6X07ujSyEz0MIdy6ddVcbg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/tags-input/-/tags-input-0.81.1.tgz", + "integrity": "sha512-nR5aE0NIaLrz2GQEGN1EkJFJrs53wdrx8cBpRn6qCIuC907fCRRDb8jdamZ51wP6GvRmgqdufuhGtbS7s78v/Q==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/auto-resize": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/form-utils": "0.79.1", - "@zag-js/interact-outside": "0.79.1", - "@zag-js/live-region": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" - } - }, - "node_modules/@zag-js/text-selection": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/text-selection/-/text-selection-0.79.1.tgz", - "integrity": "sha512-lm+CzcNkX6HhbDh/msawCUKvbsw2ArS+FswDoet6ERG4hfz+6aCmw4LACUqYTsNd97usIdPEw8FeL9EakL+lMw==", - "dependencies": { - "@zag-js/dom-query": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/auto-resize": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/form-utils": "0.81.1", + "@zag-js/interact-outside": "0.81.1", + "@zag-js/live-region": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/time-picker": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/time-picker/-/time-picker-0.79.1.tgz", - "integrity": "sha512-3OeDDhMzoWjjmHnyF1ranvIGbC5ZM8tA+sNXm6cwGneqL4PpA3ngjGYSB1G6VphI/3ovV6NwoRjs/QYuncCaZw==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/time-picker/-/time-picker-0.81.1.tgz", + "integrity": "sha512-7iBOfRb7J0IYxOSy1Vbznfnq1ISzrbujbjHNY+PjbEDCA7vCEmI0vGEXHBs4YTkTaW5Sisku1a44Ua1kvHT0Dg==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-event": "^0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" }, "peerDependencies": { "@internationalized/date": ">=3.0.0" } }, "node_modules/@zag-js/timer": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/timer/-/timer-0.79.1.tgz", - "integrity": "sha512-NU93fyq+fDKqkdxu73j7HczWZdbihnUNpO6h9S08he4tTbw4NPFyQxh3mIDXeFrNVk6R+Mr4CSnN7KpfbeL5yg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/timer/-/timer-0.81.1.tgz", + "integrity": "sha512-BcdSBf+EeQwdKiic0yDFjErCYbwa5vxVWbE7tDHoEXBWeV1xMIjqcxG20qJ2kSxDWjlkx+vpcTnDqvIYnFl5ag==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/toast": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/toast/-/toast-0.79.1.tgz", - "integrity": "sha512-tjtjCOlEKFabXNxKbfPKkGIm941e44L8vQGJWFgI+K+aJyO0SkQYc2RV/bqPGKFL8RMncqX8o6OEdFSzKOIZIA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/toast/-/toast-0.81.1.tgz", + "integrity": "sha512-v3jEsOcgtl2yIE1kllSccMUlHC87nB7UohFkhVl5gAV2sXMQ2evLna/+DAYlBRYjJogapOW+g69rW4sPX+HZxA==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dismissable": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/toggle-group": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/toggle-group/-/toggle-group-0.79.1.tgz", - "integrity": "sha512-Fh611w1OxADNvZ+QYMoHr6+f1kr40gxXApQYIa7ug3RuCP0HFwuqi97PsjEckxhFVAhjNmt1G0qv8JWM5P7fnA==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/toggle-group/-/toggle-group-0.81.1.tgz", + "integrity": "sha512-x/cpAd/pER/F/pitJ+Rd3RZ02vj8pe17noE7t/1wFyiNRLTi6R4E5fik9yqyFAukLwizxCXpS3rDYIEi7ta70w==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/tooltip": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/tooltip/-/tooltip-0.79.1.tgz", - "integrity": "sha512-Lehi+kiWPt2WAzMD56Vmcvs+kvbFQcMui0MZhjM79NN1O8yjg+AxFiZuVgALVgkDbmPwhoR2ZWbom+1sgUPfcQ==", - "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/focus-visible": "0.79.1", - "@zag-js/popper": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/tooltip/-/tooltip-0.81.1.tgz", + "integrity": "sha512-yNmgLlOh1AN006TD7xTkW/lu45O201g+uEXZhwgCiJsngYmOKNFMJFCUllE3KDR/kxecOFr9UZTVual1IhFxjA==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/focus-visible": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" + } + }, + "node_modules/@zag-js/tour": { + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/tour/-/tour-0.81.1.tgz", + "integrity": "sha512-ssKFyZyjFmRpvmlKSOEeo/yb01oCkF8XKOoYFiCgz7Pm9Guaf4rwEWbQBpzlKYaj2zZ8L6+7bOWVgt0f+ZngNw==", + "dependencies": { + "@zag-js/anatomy": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dismissable": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/focus-trap": "0.81.1", + "@zag-js/interact-outside": "0.81.1", + "@zag-js/popper": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/tree-view": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/tree-view/-/tree-view-0.79.1.tgz", - "integrity": "sha512-fwi5P7IKxETciyS/hBIFipUfXThmfTNom6NwNwQ7Mo3jPJ3UawWzs3LC00prVVuI0OMQEzLRLMdxf6XtJxoxCg==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/tree-view/-/tree-view-0.81.1.tgz", + "integrity": "sha512-ks2OtbJXvvmC3UXUyaFQKO+LQDopNhenJ2mV+Gqs3RNqO/5EViIWbiZN6s2bsSaduQhfaCTqk4pFkeBhYIluhQ==", "dependencies": { - "@zag-js/anatomy": "0.79.1", - "@zag-js/collection": "0.79.1", - "@zag-js/core": "0.79.1", - "@zag-js/dom-event": "0.79.1", - "@zag-js/dom-query": "0.79.1", - "@zag-js/types": "0.79.1", - "@zag-js/utils": "0.79.1" + "@zag-js/anatomy": "0.81.1", + "@zag-js/collection": "0.81.1", + "@zag-js/core": "0.81.1", + "@zag-js/dom-query": "0.81.1", + "@zag-js/types": "0.81.1", + "@zag-js/utils": "0.81.1" } }, "node_modules/@zag-js/types": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/types/-/types-0.79.1.tgz", - "integrity": "sha512-TwzaNwiEYpk/7XbUL8zqFiUtd/9Ru0zceuuisYRuNIAN2kBAaKSljx2VvymtAOgbP7IMX+nWcrWN1PywKT7hlw==", + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/types/-/types-0.81.1.tgz", + "integrity": "sha512-+T9H99wHn7snO0LwZ9PHX9o4ZAz3Y80Z3nlEFCWyGwFjRwrmZxoGN016pQI+C9HUVe+qXDN5oXysV1N/1/6O0A==", "dependencies": { "csstype": "3.1.3" } }, "node_modules/@zag-js/utils": { - "version": "0.79.1", - "resolved": "https://registry.npmjs.org/@zag-js/utils/-/utils-0.79.1.tgz", - "integrity": "sha512-jW8+qG16vO2vGHWuf5h4ONISMrSJlapXUQqYhZW8rXP8uDfU5vh6sk2qTGL8i8G2TV8sFb7Xj29gyx9roOrBmQ==" + "version": "0.81.1", + "resolved": "https://registry.npmjs.org/@zag-js/utils/-/utils-0.81.1.tgz", + "integrity": "sha512-lWpU6n6wKhK6GkgyE3IdEChY5AjwmrAqdr9rc4F2qlb/lEp/TFbKOn2TOiFHPLd2YzE4jElFQL7+/7CDK3qFPg==" }, "node_modules/abab": { "version": "2.0.6", @@ -16307,14 +16269,6 @@ "node": ">=0.4.0" } }, - "node_modules/focus-trap": { - "version": "7.6.2", - "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.6.2.tgz", - "integrity": "sha512-9FhUxK1hVju2+AiQIDJ5Dd//9R2n2RAfJ0qfhF4IHGHgcoEUTMpbTeG/zbEuwaiYXfuAH6XE0/aCyxDdRM+W5w==", - "dependencies": { - "tabbable": "^6.2.0" - } - }, "node_modules/follow-redirects": { "version": "1.15.6", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz", @@ -26828,11 +26782,6 @@ "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==", "dev": true }, - "node_modules/tabbable": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz", - "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==" - }, "node_modules/tailwindcss": { "version": "3.4.10", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.10.tgz", diff --git a/app/package.json b/app/package.json index 62dd1e0c1..f1747a5e9 100644 --- a/app/package.json +++ b/app/package.json @@ -37,7 +37,7 @@ "@ai-sdk/openai": "^1.0.8", "@chakra-ui/icons": "^2.1.0", "@chakra-ui/next-js": "^2.2.0", - "@chakra-ui/react": "^3.2.5", + "@chakra-ui/react": "^3.3.1", "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", "@next/env": "^14.2.5", diff --git a/app/src/app/providers.tsx b/app/src/app/providers.tsx index 4dfccdb4a..4ce4aadb1 100644 --- a/app/src/app/providers.tsx +++ b/app/src/app/providers.tsx @@ -55,7 +55,7 @@ export function Providers({ children }: { children: React.ReactNode }) { `} - + diff --git a/app/src/components/ui/provider.tsx b/app/src/components/ui/provider.tsx index c1f896c87..1e1f2dc8f 100644 --- a/app/src/components/ui/provider.tsx +++ b/app/src/components/ui/provider.tsx @@ -1,11 +1,12 @@ "use client"; -import { ChakraProvider, defaultSystem } from "@chakra-ui/react"; +import { ChakraProvider } from "@chakra-ui/react"; import { ColorModeProvider, type ColorModeProviderProps } from "./color-mode"; +import { appTheme } from "@/lib/theme/app-theme"; export function Provider(props: ColorModeProviderProps) { return ( - + ); diff --git a/app/tsconfig.json b/app/tsconfig.json index ec533ae20..251f23e18 100644 --- a/app/tsconfig.json +++ b/app/tsconfig.json @@ -12,8 +12,8 @@ "forceConsistentCasingInFileNames": true, "noEmit": true, "esModuleInterop": true, - "module": "ESNext", - "moduleResolution": "Bundler", + "module": "esnext", + "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", From c2e89dde47cc1c4eaa2ca0ea94b103be40c6ced5 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 13 Jan 2025 15:20:43 +0200 Subject: [PATCH 017/190] updates home page and inventory tab with new components --- .../[inventory]/InventoryResultTab/index.tsx | 192 +++++++++--------- app/src/app/providers.tsx | 1 - app/src/components/HomePage/HomePage.tsx | 67 +++--- app/src/components/ui/progress-circle.tsx | 37 ++++ app/src/components/ui/toaster.tsx | 43 ++++ 5 files changed, 202 insertions(+), 138 deletions(-) create mode 100644 app/src/components/ui/progress-circle.tsx create mode 100644 app/src/components/ui/toaster.tsx diff --git a/app/src/app/[lng]/[inventory]/InventoryResultTab/index.tsx b/app/src/app/[lng]/[inventory]/InventoryResultTab/index.tsx index d3ca73c4f..39a62c28d 100644 --- a/app/src/app/[lng]/[inventory]/InventoryResultTab/index.tsx +++ b/app/src/app/[lng]/[inventory]/InventoryResultTab/index.tsx @@ -5,18 +5,11 @@ import { Box, Card, CardHeader, - CircularProgress, - Divider, Heading, HStack, Icon, - Tab, - TabList, - TabPanel, - TabPanels, Tabs, Text, - useToast, } from "@chakra-ui/react"; import { TabHeader } from "@/components/HomePage/TabHeader"; import EmissionsWidget from "@/app/[lng]/[inventory]/InventoryResultTab/EmissionsWidget"; @@ -46,6 +39,11 @@ import { MdBarChart, MdTableChart } from "react-icons/md"; import EmissionBySectorTableSection from "@/app/[lng]/[inventory]/InventoryResultTab/EmissionBySectorTable"; import EmissionBySectorChart from "@/app/[lng]/[inventory]/InventoryResultTab/EmissionBySectorChart"; import { EmissionsForecastSection } from "@/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastSection"; +import { toaster } from "@/components/ui/toaster"; +import { + ProgressCircleRing, + ProgressCircleRoot, +} from "@/components/ui/progress-circle"; enum TableView { BY_ACTIVITY = "by-activity", @@ -96,15 +94,12 @@ function SectorTabs({ inventoryId: inventory!.inventoryId!, sector: SECTORS[selectedIndex].name, }); - const toast = useToast(); const makeErrorToast = (title: string, description?: string) => { - toast({ + toaster.create({ title, description, - position: "bottom", - status: "error", - isClosable: true, + type: "error", duration: 10000, }); }; @@ -128,16 +123,16 @@ function SectorTabs({ Object.entries(sectorBreakdown?.byScope || {}).length === 0; return ( - setSelectedIndex(index)} + // index={selectedIndex} + // onChange={(index) => setSelectedIndex(index)} > - + {getSectorsForInventory(inventory?.inventoryType).map( ({ icon, name }, index) => ( - + {t(name)} - + ), )} - + - - {SECTORS.map(({ icon, name }) => { - const shouldShowTableByActivity = - !isEmptyInventory && - !isResultsLoading && - false && // ON-3126 restore view by activity - selectedTableView === TableView.BY_ACTIVITY; - const shouldShowTableByScope = - !isEmptyInventory && - inventory && - !isResultsLoading && - !isLoadingNewData; // && - // selectedTableView === TableView.BY_SCOPE; ON-3126 restore view by activity - return ( - - {isTopEmissionsResponseLoading ? ( - - ) : ( - - - - - - {t("breakdown-of-sub-sector-emissions")} - - {/* + {SECTORS.map(({ icon, name }) => { + const shouldShowTableByActivity = + !isEmptyInventory && + !isResultsLoading && + false && // ON-3126 restore view by activity + selectedTableView === TableView.BY_ACTIVITY; + const shouldShowTableByScope = + !isEmptyInventory && + inventory && + !isResultsLoading && + !isLoadingNewData; // && + // selectedTableView === TableView.BY_SCOPE; ON-3126 restore view by activity + return ( + + {isTopEmissionsResponseLoading ? ( + + + + ) : ( + + + + + {t("breakdown-of-sub-sector-emissions")} + + {/* {***[ON-3126 restore view by activity]*/} - - {(isResultsLoading || isLoadingNewData) && ( - - )} - {isEmptyInventory && ( - - )} - {shouldShowTableByActivity && ( - - )} - {shouldShowTableByScope && ( - - )} - - )} - - ); - })} - - + + {(isResultsLoading || isLoadingNewData) && ( + + + + )} + {isEmptyInventory && ( + + )} + {shouldShowTableByActivity && ( + + )} + {shouldShowTableByScope && ( + + )} + + )} + + ); + })} + ); } @@ -410,7 +402,7 @@ export function EmissionPerSectors({ return ( - + {t("ghg-by-sector-heading")} @@ -419,7 +411,9 @@ export function EmissionPerSectors({ {loadingState && ( - + + + )} {!loadingState && transformedYearOverYearData.length === 0 && ( @@ -449,7 +443,7 @@ export function EmissionPerSectors({ ) } - + ); } diff --git a/app/src/app/providers.tsx b/app/src/app/providers.tsx index 4ce4aadb1..085f4d516 100644 --- a/app/src/app/providers.tsx +++ b/app/src/app/providers.tsx @@ -1,6 +1,5 @@ "use client"; -import { appTheme } from "@/lib/theme/app-theme"; import { persistor, store } from "@/lib/store"; import { CacheProvider } from "@chakra-ui/next-js"; import { Provider as ChakraProvider } from "@/components/ui/provider"; diff --git a/app/src/components/HomePage/HomePage.tsx b/app/src/components/HomePage/HomePage.tsx index 7169d0121..35b1925b7 100644 --- a/app/src/components/HomePage/HomePage.tsx +++ b/app/src/components/HomePage/HomePage.tsx @@ -9,17 +9,7 @@ import { } from "@/services/api"; import { CheckUserSession } from "@/util/check-user-session"; import { formatEmissions } from "@/util/helpers"; -import { - Box, - Button, - Tab, - TabList, - TabPanel, - TabPanels, - Tabs, - Text, - VStack, -} from "@chakra-ui/react"; +import { Box, Tabs, Text, VStack } from "@chakra-ui/react"; import { useParams, useRouter } from "next/navigation"; import MissingInventory from "@/components/missing-inventory"; import InventoryCalculationTab from "@/components/HomePage/InventoryCalculationTab"; @@ -32,6 +22,7 @@ import { useEffect } from "react"; import React, { useMemo } from "react"; import { YearSelectorCard } from "@/components/Cards/years-selection-card"; import { AddIcon } from "@chakra-ui/icons"; +import { Button } from "../ui/button"; export default function HomePage({ lng, @@ -174,7 +165,6 @@ export default function HomePage({ @@ -195,13 +186,13 @@ export default function HomePage({ lng={lng} t={t} /> - - + + {[ t("tab-emission-inventory-calculation-title"), t("tab-emission-inventory-results-title"), ]?.map((tab, index) => ( - + {t(tab)} - + ))} - - - - - - - - - - + + + + + + + + ) : ( (function ProgressCircleRing(props, ref) { + const { trackColor, cap, color, ...rest } = props + return ( + + + + + ) +}) + +export const ProgressCircleValueText = React.forwardRef< + HTMLDivElement, + ChakraProgressCircle.ValueTextProps +>(function ProgressCircleValueText(props, ref) { + return ( + + + + ) +}) + +export const ProgressCircleRoot = ChakraProgressCircle.Root diff --git a/app/src/components/ui/toaster.tsx b/app/src/components/ui/toaster.tsx new file mode 100644 index 000000000..df6c2c38e --- /dev/null +++ b/app/src/components/ui/toaster.tsx @@ -0,0 +1,43 @@ +"use client" + +import { + Toaster as ChakraToaster, + Portal, + Spinner, + Stack, + Toast, + createToaster, +} from "@chakra-ui/react" + +export const toaster = createToaster({ + placement: "bottom-end", + pauseOnPageIdle: true, +}) + +export const Toaster = () => { + return ( + + + {(toast) => ( + + {toast.type === "loading" ? ( + + ) : ( + + )} + + {toast.title && {toast.title}} + {toast.description && ( + {toast.description} + )} + + {toast.action && ( + {toast.action.label} + )} + {toast.meta?.closable && } + + )} + + + ) +} From 079cf8e0fdccad9c2d892a7e0d0f36b2fb63476c Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 10:22:24 +0200 Subject: [PATCH 018/190] fix: uninstalls and removes chakra icons --- app/next.config.mjs | 1 + app/package-lock.json | 17 +++-------------- app/package.json | 1 - app/src/app/[...not_found]/page.tsx | 6 +++--- .../EmissionsForecast/EmissionsForecastCard.tsx | 4 ++-- .../[inventory]/data/[step]/EmissionsForm.tsx | 4 ++-- app/src/components/Cards/SectorCard.tsx | 5 +++-- .../DownloadAndShareModals/DownloadButtons.tsx | 5 ++--- .../DownloadAndShareModals/PublishButtons.tsx | 4 ++-- .../DownloadAndShareModals/PublishedView.tsx | 4 ++-- app/src/components/HomePage/Hero.tsx | 14 +++++++------- app/src/components/HomePage/HomePage.tsx | 4 ++-- app/src/components/NotAvailable.tsx | 4 ++-- app/src/components/missing-inventory.tsx | 4 ++-- app/src/components/navigation-bar.tsx | 4 ++-- app/src/components/ui/provider.tsx | 2 +- 16 files changed, 36 insertions(+), 47 deletions(-) diff --git a/app/next.config.mjs b/app/next.config.mjs index 338fc8b25..9742cab98 100644 --- a/app/next.config.mjs +++ b/app/next.config.mjs @@ -10,6 +10,7 @@ const nextConfig = { trailingSlash: true, experimental: { serverComponentsExternalPackages: ["sequelize"], + optimizePackageImports: ['@chakra-ui/react'] }, env: { APP_VERSION: packageInfo.version, diff --git a/app/package-lock.json b/app/package-lock.json index 45c96cd75..f9da1deb3 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -9,7 +9,6 @@ "version": "0.39.0-dev.0", "dependencies": { "@ai-sdk/openai": "^1.0.8", - "@chakra-ui/icons": "^2.1.0", "@chakra-ui/next-js": "^2.2.0", "@chakra-ui/react": "^3.3.1", "@emotion/react": "^11.14.0", @@ -2551,6 +2550,7 @@ "version": "3.2.0", "resolved": "https://registry.npmjs.org/@chakra-ui/icon/-/icon-3.2.0.tgz", "integrity": "sha512-xxjGLvlX2Ys4H0iHrI16t74rG9EBcpFvJ3Y3B7KMQTrnW34Kf7Da/UC8J67Gtx85mTHW020ml85SVPKORWNNKQ==", + "peer": true, "dependencies": { "@chakra-ui/shared-utils": "2.0.5" }, @@ -2559,18 +2559,6 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/icons": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/@chakra-ui/icons/-/icons-2.1.1.tgz", - "integrity": "sha512-3p30hdo4LlRZTT5CwoAJq3G9fHI0wDc0pBaMHj4SUn0yomO+RcDRlzhdXqdr5cVnzax44sqXJVnf3oQG0eI+4g==", - "dependencies": { - "@chakra-ui/icon": "3.2.0" - }, - "peerDependencies": { - "@chakra-ui/system": ">=2.0.0", - "react": ">=18" - } - }, "node_modules/@chakra-ui/layout": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/@chakra-ui/layout/-/layout-2.3.1.tgz", @@ -2857,7 +2845,8 @@ "node_modules/@chakra-ui/shared-utils": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/@chakra-ui/shared-utils/-/shared-utils-2.0.5.tgz", - "integrity": "sha512-4/Wur0FqDov7Y0nCXl7HbHzCg4aq86h+SXdoUeuCMD3dSj7dpsVnStLYhng1vxvlbUnLpdF4oz5Myt3i/a7N3Q==" + "integrity": "sha512-4/Wur0FqDov7Y0nCXl7HbHzCg4aq86h+SXdoUeuCMD3dSj7dpsVnStLYhng1vxvlbUnLpdF4oz5Myt3i/a7N3Q==", + "peer": true }, "node_modules/@chakra-ui/spinner": { "version": "2.1.0", diff --git a/app/package.json b/app/package.json index f1747a5e9..e1d00d738 100644 --- a/app/package.json +++ b/app/package.json @@ -35,7 +35,6 @@ }, "dependencies": { "@ai-sdk/openai": "^1.0.8", - "@chakra-ui/icons": "^2.1.0", "@chakra-ui/next-js": "^2.2.0", "@chakra-ui/react": "^3.3.1", "@emotion/react": "^11.14.0", diff --git a/app/src/app/[...not_found]/page.tsx b/app/src/app/[...not_found]/page.tsx index 9903373c9..cf39b089c 100644 --- a/app/src/app/[...not_found]/page.tsx +++ b/app/src/app/[...not_found]/page.tsx @@ -1,12 +1,12 @@ "use client"; import { useTranslation } from "@/i18n/client"; import { api } from "@/services/api"; -import { ArrowForwardIcon } from "@chakra-ui/icons"; import { Box, Text } from "@chakra-ui/layout"; import { Button, IconButton } from "@chakra-ui/react"; import Image from "next/image"; import { useRouter } from "next/navigation"; import React from "react"; +import { MdArrowForward } from "react-icons/md"; const NotFound = ({ params: { lng } }: { params: { lng: string } }) => { const { data: userInfo, isLoading: isUserInfoLoading } = @@ -58,9 +58,9 @@ const NotFound = ({ params: { lng } }: { params: { lng: string } }) => { h="48px" px="24px" fontSize="body.md" - isLoading={isUserInfoLoading} - rightIcon={} + // isLoading={isUserInfoLoading} > + rightIcon={} {t("goto-dashboard")} diff --git a/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx b/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx index 8c3288454..dc2fd6cae 100644 --- a/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx +++ b/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx @@ -10,8 +10,8 @@ import { IconButton, Text, } from "@chakra-ui/react"; -import { InfoOutlineIcon } from "@chakra-ui/icons"; import { EmissionsForecastChart } from "@/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastChart"; +import { MdInfoOutline } from "react-icons/md"; export const EmissionsForecastCard = ({ forecast, @@ -46,7 +46,7 @@ export const EmissionsForecastCard = ({ variant={"unstyled"} isRound onClick={() => setIsExplanationModalOpen(true)} - icon={} + icon={} aria-label={"growth-rates-explanation"} /> diff --git a/app/src/app/[lng]/[inventory]/data/[step]/EmissionsForm.tsx b/app/src/app/[lng]/[inventory]/data/[step]/EmissionsForm.tsx index b69c43d44..6cfc666bf 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/EmissionsForm.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/EmissionsForm.tsx @@ -1,5 +1,4 @@ import { RadioButton } from "@/components/radio-button"; -import { InfoOutlineIcon } from "@chakra-ui/icons"; import { Box, Flex, @@ -20,6 +19,7 @@ import type { TFunction } from "i18next"; import { Control, useController } from "react-hook-form"; import { resolve } from "@/util/helpers"; import type { EmissionsFactorWithDataSources } from "@/util/types"; +import { MdInfoOutline } from "react-icons/md"; export function EmissionsForm({ t, @@ -121,7 +121,7 @@ export function EmissionsForm({ color="base.light" placement="bottom-start" > - + diff --git a/app/src/components/Cards/SectorCard.tsx b/app/src/components/Cards/SectorCard.tsx index 995771fc2..c4dbecb66 100644 --- a/app/src/components/Cards/SectorCard.tsx +++ b/app/src/components/Cards/SectorCard.tsx @@ -23,8 +23,9 @@ import { } from "@/util/helpers"; import { TFunction } from "i18next"; import { Trans } from "react-i18next/TransWithoutContext"; -import { AddIcon } from "@chakra-ui/icons"; +// import { AddIcon } from "@chakra-ui/icons"; import { InventoryType, InventoryTypeEnum, ISector } from "@/util/constants"; +import { BsPlus } from "react-icons/bs"; export function SectorCard({ sectorProgress, @@ -116,7 +117,7 @@ export function SectorCard({ color="brand.secondary" ml={2} > - + add-data-to-sector diff --git a/app/src/components/HomePage/DownloadAndShareModals/DownloadButtons.tsx b/app/src/components/HomePage/DownloadAndShareModals/DownloadButtons.tsx index 554d262a7..94958b287 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/DownloadButtons.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/DownloadButtons.tsx @@ -9,8 +9,7 @@ import { useToast, } from "@chakra-ui/react"; import React, { MouseEventHandler } from "react"; -import { InfoOutlineIcon } from "@chakra-ui/icons"; -import { MdCheckCircleOutline } from "react-icons/md"; +import { MdCheckCircleOutline, MdInfoOutline } from "react-icons/md"; import { FiDownload } from "react-icons/fi"; const DownloadButtons = ({ @@ -79,7 +78,7 @@ const DownloadButtons = ({ > {status === "info" || status === "error" ? ( - + ) : ( )} diff --git a/app/src/components/HomePage/DownloadAndShareModals/PublishButtons.tsx b/app/src/components/HomePage/DownloadAndShareModals/PublishButtons.tsx index 0a382b34b..374c9c6c8 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/PublishButtons.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/PublishButtons.tsx @@ -1,8 +1,8 @@ import type { TFunction } from "i18next"; import { Badge, Button, HStack, Text, VStack } from "@chakra-ui/react"; import { Img } from "@react-email/components"; -import { ChevronRightIcon } from "@chakra-ui/icons"; import React from "react"; +import { BsChevronRight } from "react-icons/bs"; const PublishButtons = ({ t, @@ -39,7 +39,7 @@ const PublishButtons = ({ mx="24px" variant="ghost" leftIcon={{title}} - rightIcon={} + rightIcon={} isDisabled={!isAvailable} style={{ backgroundColor: "white", diff --git a/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx b/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx index a4d8dd21b..33bc38462 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx @@ -14,8 +14,8 @@ import { enUS, pt, de, es } from "date-fns/locale"; import { formatDistance } from "date-fns"; import { toZonedTime } from "date-fns-tz"; import { BlueSubtitle } from "@/components/blue-subtitle"; -import { ExternalLinkIcon } from "@chakra-ui/icons"; import "dotenv/config"; +import { FiExternalLink } from "react-icons/fi"; export function PublishedView({ inventoryId, @@ -72,7 +72,7 @@ export function PublishedView({ target="_blank" rel="noopener noreferrer" variant="ghost" - rightIcon={} + rightIcon={} > diff --git a/app/src/components/HomePage/Hero.tsx b/app/src/components/HomePage/Hero.tsx index 933e89eec..0ea4ba1a6 100644 --- a/app/src/components/HomePage/Hero.tsx +++ b/app/src/components/HomePage/Hero.tsx @@ -3,8 +3,12 @@ import dynamic from "next/dynamic"; import { Box, Heading, Icon, Spinner, Text, Tooltip } from "@chakra-ui/react"; import { CircleFlag } from "react-circle-flags"; import { InventorySelect } from "@/components/InventorySelect"; -import { MdArrowOutward, MdGroup, MdOutlineAspectRatio } from "react-icons/md"; -import { InfoOutlineIcon } from "@chakra-ui/icons"; +import { + MdArrowOutward, + MdGroup, + MdInfoOutline, + MdOutlineAspectRatio, +} from "react-icons/md"; import { Trans } from "react-i18next/TransWithoutContext"; import { getShortenNumberUnit, shortenNumber } from "@/util/helpers"; import type { TFunction } from "i18next"; @@ -103,11 +107,7 @@ export function Hero({ })} placement="bottom-start" > - + - + {t("add-new-inventory")} diff --git a/app/src/components/NotAvailable.tsx b/app/src/components/NotAvailable.tsx index 9de2a6e6e..2a1564fdd 100644 --- a/app/src/components/NotAvailable.tsx +++ b/app/src/components/NotAvailable.tsx @@ -1,10 +1,10 @@ import { Box, Text } from "@chakra-ui/layout"; import Image from "next/image"; import { Button, Heading } from "@chakra-ui/react"; -import { ArrowForwardIcon } from "@chakra-ui/icons"; import React from "react"; import { useTranslation } from "@/i18n/client"; import "dotenv/config"; +import { MdArrowForward } from "react-icons/md"; const NotAvailable = ({ lng }: { lng: string }) => { const { t } = useTranslation(lng, "inventory-not-found"); @@ -54,7 +54,7 @@ const NotAvailable = ({ lng }: { lng: string }) => { h="48px" px="24px" fontSize="body.md" - rightIcon={} + rightIcon={} > {t("go-to-citycatalyst")} diff --git a/app/src/components/missing-inventory.tsx b/app/src/components/missing-inventory.tsx index df8b8d1ae..f43f0c8b4 100644 --- a/app/src/components/missing-inventory.tsx +++ b/app/src/components/missing-inventory.tsx @@ -1,11 +1,11 @@ import { Box, Link, Text } from "@chakra-ui/layout"; import Image from "next/image"; import { Button, CircularProgress, Heading } from "@chakra-ui/react"; -import { ArrowForwardIcon } from "@chakra-ui/icons"; import React, { useEffect } from "react"; import { useTranslation } from "@/i18n/client"; import { useRouter } from "next/navigation"; import { api } from "@/services/api"; +import { MdArrowForward } from "react-icons/md"; const MissingInventory = ({ lng }: { lng: string }) => { const { data: userInfo, isLoading: isUserInfoLoading } = @@ -79,7 +79,7 @@ const MissingInventory = ({ lng }: { lng: string }) => { px="24px" fontSize="body.md" isLoading={isUserInfoLoading} - rightIcon={} + rightIcon={} > {t("goto-dashboard")} diff --git a/app/src/components/navigation-bar.tsx b/app/src/components/navigation-bar.tsx index c1bec5279..51538c31a 100644 --- a/app/src/components/navigation-bar.tsx +++ b/app/src/components/navigation-bar.tsx @@ -2,7 +2,6 @@ import { useTranslation } from "@/i18n/client"; import { languages } from "@/i18n/settings"; -import { TriangleDownIcon, TriangleUpIcon } from "@chakra-ui/icons"; import { Avatar, Box, @@ -23,6 +22,7 @@ import NextLink from "next/link"; import { CircleFlag } from "react-circle-flags"; import { FiSettings } from "react-icons/fi"; import { MdLogout } from "react-icons/md"; +import { GoTriangleDown, GoTriangleUp } from "react-icons/go"; import Cookies from "js-cookie"; import { useParams } from "next/navigation"; import { api } from "@/services/api"; @@ -144,7 +144,7 @@ export function NavigationBar({ width="24" /> } - rightIcon={isOpen ? : } + rightIcon={isOpen ? : } className="whitespace-nowrap normal-case" _hover={{ bg: "#FFF2", diff --git a/app/src/components/ui/provider.tsx b/app/src/components/ui/provider.tsx index 1e1f2dc8f..26acfe15a 100644 --- a/app/src/components/ui/provider.tsx +++ b/app/src/components/ui/provider.tsx @@ -4,7 +4,7 @@ import { ChakraProvider } from "@chakra-ui/react"; import { ColorModeProvider, type ColorModeProviderProps } from "./color-mode"; import { appTheme } from "@/lib/theme/app-theme"; -export function Provider(props: ColorModeProviderProps) { +export function Provider(props: ColorModeProviderProps, value: any) { return ( From 78d958494b388f03456563475f0b920241286787 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 11:46:56 +0200 Subject: [PATCH 019/190] adds menu component, replaces next link with chakra link --- app/package-lock.json | 15 --- app/package.json | 1 - .../EmptyStateCardContent.tsx | 4 +- app/src/app/providers.tsx | 22 ++-- app/src/components/HomePage/Hero.tsx | 12 +- app/src/components/InventorySelect.tsx | 37 +++--- app/src/components/ui/menu.tsx | 110 ++++++++++++++++++ 7 files changed, 145 insertions(+), 56 deletions(-) create mode 100644 app/src/components/ui/menu.tsx diff --git a/app/package-lock.json b/app/package-lock.json index f9da1deb3..3e5415834 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -9,7 +9,6 @@ "version": "0.39.0-dev.0", "dependencies": { "@ai-sdk/openai": "^1.0.8", - "@chakra-ui/next-js": "^2.2.0", "@chakra-ui/react": "^3.3.1", "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", @@ -2626,20 +2625,6 @@ "react": ">=18" } }, - "node_modules/@chakra-ui/next-js": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/next-js/-/next-js-2.2.0.tgz", - "integrity": "sha512-brCz0UEOlImX4Np2jDIaljZJkW6kiDSuXG5erxvYjZlklLhmti1zj0o1sSjt5yff1xndfgHoOJb+BYG5wx+vDg==", - "dependencies": { - "@emotion/cache": "^11.11.0" - }, - "peerDependencies": { - "@chakra-ui/react": ">=2.4.0", - "@emotion/react": ">=11", - "next": ">=13", - "react": ">=18" - } - }, "node_modules/@chakra-ui/object-utils": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/@chakra-ui/object-utils/-/object-utils-2.1.0.tgz", diff --git a/app/package.json b/app/package.json index e1d00d738..26f092bda 100644 --- a/app/package.json +++ b/app/package.json @@ -35,7 +35,6 @@ }, "dependencies": { "@ai-sdk/openai": "^1.0.8", - "@chakra-ui/next-js": "^2.2.0", "@chakra-ui/react": "^3.3.1", "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", diff --git a/app/src/app/[lng]/[inventory]/InventoryResultTab/EmptyStateCardContent.tsx b/app/src/app/[lng]/[inventory]/InventoryResultTab/EmptyStateCardContent.tsx index 740d32b8f..946e45dfe 100644 --- a/app/src/app/[lng]/[inventory]/InventoryResultTab/EmptyStateCardContent.tsx +++ b/app/src/app/[lng]/[inventory]/InventoryResultTab/EmptyStateCardContent.tsx @@ -1,7 +1,7 @@ import { TFunction } from "i18next"; -import { Center, Text, VStack } from "@chakra-ui/react"; +import { Center, Link, Text, VStack } from "@chakra-ui/react"; import Image from "next/image"; -import { Link } from "@chakra-ui/next-js"; +// import { Link } from "@chakra-ui/next-js"; export const EmptyStateCardContent = ({ t, diff --git a/app/src/app/providers.tsx b/app/src/app/providers.tsx index 085f4d516..71f00add5 100644 --- a/app/src/app/providers.tsx +++ b/app/src/app/providers.tsx @@ -53,17 +53,17 @@ export function Providers({ children }: { children: React.ReactNode }) { } `} - - - - - - {children} - - - - - + {/* */} + + + + + {children} + + + + + {/* */} ); } diff --git a/app/src/components/HomePage/Hero.tsx b/app/src/components/HomePage/Hero.tsx index 0ea4ba1a6..0cdb2678c 100644 --- a/app/src/components/HomePage/Hero.tsx +++ b/app/src/components/HomePage/Hero.tsx @@ -169,11 +169,7 @@ export function Hero({ } placement="bottom-start" > - + - + - } /> - + + + + + {isLoading && ( - +
@@ -59,13 +67,7 @@ export const InventorySelect = ({ return ( - } + value={city.cityId} onClick={() => !isCurrent && onSelect({ city, years })} > @@ -75,12 +77,13 @@ export const InventorySelect = ({ ); })} } > Add a new city - - + + ); }; diff --git a/app/src/components/ui/menu.tsx b/app/src/components/ui/menu.tsx new file mode 100644 index 000000000..eab6f3d10 --- /dev/null +++ b/app/src/components/ui/menu.tsx @@ -0,0 +1,110 @@ +"use client"; + +import { AbsoluteCenter, Menu as ChakraMenu, Portal } from "@chakra-ui/react"; +import * as React from "react"; +import { LuCheck, LuChevronRight } from "react-icons/lu"; + +interface MenuContentProps extends ChakraMenu.ContentProps { + portalled?: boolean; + portalRef?: React.RefObject; +} + +export const MenuContent = React.forwardRef( + function MenuContent(props, ref) { + const { portalled = true, portalRef, ...rest } = props; + return ( + + + + + + ); + }, +); + +export const MenuArrow = React.forwardRef< + HTMLDivElement, + ChakraMenu.ArrowProps +>(function MenuArrow(props, ref) { + return ( + + + + ); +}); + +export const MenuCheckboxItem = React.forwardRef< + HTMLDivElement, + ChakraMenu.CheckboxItemProps +>(function MenuCheckboxItem(props, ref) { + return ( + + + {props.children} + + ); +}); + +export const MenuRadioItem = React.forwardRef< + HTMLDivElement, + ChakraMenu.RadioItemProps +>(function MenuRadioItem(props, ref) { + const { children, ...rest } = props; + return ( + + + + + + + {children} + + ); +}); + +export const MenuItemGroup = React.forwardRef< + HTMLDivElement, + ChakraMenu.ItemGroupProps +>(function MenuItemGroup(props, ref) { + const { title, children, ...rest } = props; + return ( + + {title && ( + + {title} + + )} + {children} + + ); +}); + +export interface MenuTriggerItemProps extends ChakraMenu.ItemProps { + startIcon?: React.ReactNode; +} + +export const MenuTriggerItem = React.forwardRef< + HTMLDivElement, + MenuTriggerItemProps +>(function MenuTriggerItem(props, ref) { + const { startIcon, children, ...rest } = props; + return ( + + {startIcon} + {children} + + + ); +}); + +export const MenuRadioItemGroup = ChakraMenu.RadioItemGroup; +export const MenuContextTrigger = ChakraMenu.ContextTrigger; +export const MenuRoot = ChakraMenu.Root; +export const MenuSeparator = ChakraMenu.Separator; + +export const MenuItem = ChakraMenu.Item; +export const MenuItemText = ChakraMenu.ItemText; +export const MenuItemCommand = ChakraMenu.ItemCommand; +export const MenuTrigger = ChakraMenu.Trigger; From 78b46821e179fc6aac206891701506d381350641 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 12:01:40 +0200 Subject: [PATCH 020/190] update: menu component in inventory select --- app/src/components/InventorySelect.tsx | 24 +++++++----------------- app/tsconfig.json | 4 ++-- 2 files changed, 9 insertions(+), 19 deletions(-) diff --git a/app/src/components/InventorySelect.tsx b/app/src/components/InventorySelect.tsx index 30dd88566..a08063e2f 100644 --- a/app/src/components/InventorySelect.tsx +++ b/app/src/components/InventorySelect.tsx @@ -1,13 +1,6 @@ import { api, useGetCitiesAndYearsQuery } from "@/services/api"; import type { CityAndYearsResponse } from "@/util/types"; -import { - Center, - Icon, - IconButton, - MenuRoot, - Spinner, - Text, -} from "@chakra-ui/react"; +import { Center, Icon, IconButton, Spinner, Text } from "@chakra-ui/react"; import { useRouter } from "next/navigation"; import { MdAdd, @@ -15,7 +8,7 @@ import { MdLocationOn, MdOutlineLocationOn, } from "react-icons/md"; -import { MenuContent, MenuItem, MenuTrigger } from "./ui/menu"; +import { MenuRoot, MenuContent, MenuItem, MenuTrigger } from "./ui/menu"; import { Button } from "./ui/button"; export const InventorySelect = ({ @@ -40,8 +33,8 @@ export const InventorySelect = ({ }; return ( - - + + From aafca6122397754c1cd4a9bc3a2a0050e1a3b7d9 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 12:19:14 +0200 Subject: [PATCH 023/190] updates: tags and labels --- .../HomePage/InventoryCalculationTab.tsx | 47 ++++++++++--------- app/src/components/ui/tag.tsx | 39 +++++++++++++++ 2 files changed, 64 insertions(+), 22 deletions(-) create mode 100644 app/src/components/ui/tag.tsx diff --git a/app/src/components/HomePage/InventoryCalculationTab.tsx b/app/src/components/HomePage/InventoryCalculationTab.tsx index 6b9b77c82..51d580cba 100644 --- a/app/src/components/HomePage/InventoryCalculationTab.tsx +++ b/app/src/components/HomePage/InventoryCalculationTab.tsx @@ -11,10 +11,9 @@ import { Center, Heading, Spinner, - Tag, TagLabel, - TagLeftIcon, Text, + Icon, } from "@chakra-ui/react"; import { Trans } from "react-i18next/TransWithoutContext"; import { TabHeader } from "@/components/HomePage/TabHeader"; @@ -25,6 +24,8 @@ import { SECTORS, } from "@/util/constants"; +import { Tag } from "@/components/ui/tag"; + const getSectorProgresses = ( inventoryProgress: InventoryProgressResponse, referenceNumber: string, @@ -82,27 +83,29 @@ export default function InventoryCalculationTab({ - - - - {formatPercent(thirdPartyProgress)}%{" "} - connect-third-party-data - + + } + > + {formatPercent(thirdPartyProgress)}%{" "} + connect-third-party-data - - - - {formatPercent(uploadedProgress)}%{" "} - uploaded-data - + + } + > + {formatPercent(uploadedProgress)}%{" "} + uploaded-data diff --git a/app/src/components/ui/tag.tsx b/app/src/components/ui/tag.tsx new file mode 100644 index 000000000..728250f17 --- /dev/null +++ b/app/src/components/ui/tag.tsx @@ -0,0 +1,39 @@ +import { Tag as ChakraTag } from "@chakra-ui/react" +import * as React from "react" + +export interface TagProps extends ChakraTag.RootProps { + startElement?: React.ReactNode + endElement?: React.ReactNode + onClose?: VoidFunction + closable?: boolean +} + +export const Tag = React.forwardRef( + function Tag(props, ref) { + const { + startElement, + endElement, + onClose, + closable = !!onClose, + children, + ...rest + } = props + + return ( + + {startElement && ( + {startElement} + )} + {children} + {endElement && ( + {endElement} + )} + {closable && ( + + + + )} + + ) + }, +) From 606a2175f6ca09a25c438e781e8345d9669c5ee4 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 12:26:51 +0200 Subject: [PATCH 024/190] adds dialog component --- app/src/components/ui/close-button.tsx | 14 ++++----- app/src/components/ui/dialog.tsx | 40 +++++++++++++------------- 2 files changed, 27 insertions(+), 27 deletions(-) diff --git a/app/src/components/ui/close-button.tsx b/app/src/components/ui/close-button.tsx index 8dc4448ad..94af48859 100644 --- a/app/src/components/ui/close-button.tsx +++ b/app/src/components/ui/close-button.tsx @@ -1,9 +1,9 @@ -import type { ButtonProps } from "@chakra-ui/react"; -import { IconButton as ChakraIconButton } from "@chakra-ui/react"; -import * as React from "react"; -import { LuX } from "react-icons/lu"; +import type { ButtonProps } from "@chakra-ui/react" +import { IconButton as ChakraIconButton } from "@chakra-ui/react" +import * as React from "react" +import { LuX } from "react-icons/lu" -export type CloseButtonProps = ButtonProps; +export type CloseButtonProps = ButtonProps export const CloseButton = React.forwardRef< HTMLButtonElement, @@ -13,5 +13,5 @@ export const CloseButton = React.forwardRef< {props.children ?? } - ); -}); + ) +}) diff --git a/app/src/components/ui/dialog.tsx b/app/src/components/ui/dialog.tsx index e954059e4..89d68a5de 100644 --- a/app/src/components/ui/dialog.tsx +++ b/app/src/components/ui/dialog.tsx @@ -1,11 +1,11 @@ -import { Dialog as ChakraDialog, Portal } from "@chakra-ui/react"; -import { CloseButton } from "./close-button"; -import * as React from "react"; +import { Dialog as ChakraDialog, Portal } from "@chakra-ui/react" +import { CloseButton } from "./close-button" +import * as React from "react" interface DialogContentProps extends ChakraDialog.ContentProps { - portalled?: boolean; - portalRef?: React.RefObject; - backdrop?: boolean; + portalled?: boolean + portalRef?: React.RefObject + backdrop?: boolean } export const DialogContent = React.forwardRef< @@ -18,7 +18,7 @@ export const DialogContent = React.forwardRef< portalRef, backdrop = true, ...rest - } = props; + } = props return ( @@ -29,8 +29,8 @@ export const DialogContent = React.forwardRef< - ); -}); + ) +}) export const DialogCloseTrigger = React.forwardRef< HTMLButtonElement, @@ -48,15 +48,15 @@ export const DialogCloseTrigger = React.forwardRef< {props.children} - ); -}); + ) +}) -export const DialogRoot = ChakraDialog.Root; -export const DialogFooter = ChakraDialog.Footer; -export const DialogHeader = ChakraDialog.Header; -export const DialogBody = ChakraDialog.Body; -export const DialogBackdrop = ChakraDialog.Backdrop; -export const DialogTitle = ChakraDialog.Title; -export const DialogDescription = ChakraDialog.Description; -export const DialogTrigger = ChakraDialog.Trigger; -export const DialogActionTrigger = ChakraDialog.ActionTrigger; +export const DialogRoot = ChakraDialog.Root +export const DialogFooter = ChakraDialog.Footer +export const DialogHeader = ChakraDialog.Header +export const DialogBody = ChakraDialog.Body +export const DialogBackdrop = ChakraDialog.Backdrop +export const DialogTitle = ChakraDialog.Title +export const DialogDescription = ChakraDialog.Description +export const DialogTrigger = ChakraDialog.Trigger +export const DialogActionTrigger = ChakraDialog.ActionTrigger From adc76c4d61c13078582e55a75aabc8ffc8557eb6 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 15:50:04 +0200 Subject: [PATCH 025/190] update: replaces modal with dialog component --- .../DownloadAndShareModals/ModalPublish.tsx | 83 +++++++++---------- 1 file changed, 41 insertions(+), 42 deletions(-) diff --git a/app/src/components/HomePage/DownloadAndShareModals/ModalPublish.tsx b/app/src/components/HomePage/DownloadAndShareModals/ModalPublish.tsx index f771928de..7a0db6f70 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/ModalPublish.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/ModalPublish.tsx @@ -1,17 +1,4 @@ -import { - Box, - Button, - Divider, - HStack, - Img, - Modal, - ModalCloseButton, - ModalContent, - ModalFooter, - ModalHeader, - ModalOverlay, - Text, -} from "@chakra-ui/react"; +import { Box, Button, HStack, Image, Text } from "@chakra-ui/react"; import type { TFunction } from "i18next"; import { api } from "@/services/api"; import { useState } from "react"; @@ -19,18 +6,29 @@ import { UnpublishedView } from "@/components/HomePage/DownloadAndShareModals/Un import { PublishedView } from "@/components/HomePage/DownloadAndShareModals/PublishedView"; import { InventoryResponse } from "@/util/types"; +import { + DialogRoot, + DialogContent, + DialogHeader, + DialogBody, + DialogFooter, +} from "@/components/ui/dialog"; + const ModalPublish = ({ t, isPublishOpen, + //Todo: resolve close action onPublishClose, inventoryId, inventory, + setModalOpen, }: { t: TFunction; isPublishOpen: boolean; onPublishClose: () => void; inventoryId: string; inventory: InventoryResponse; + setModalOpen: (open: boolean) => void; }) => { const [isAuthorized, setIsAuthorized] = useState(false); @@ -44,12 +42,11 @@ const ModalPublish = ({ }; return ( - - - - + setModalOpen(e.open)}> + + - publish-to-web - - - - {!inventory.isPublic ? ( - - setIsAuthorized((isAuth: boolean) => !isAuth) - } - /> - ) : ( - - )} - + + + + + {!inventory.isPublic ? ( + + setIsAuthorized((isAuth: boolean) => !isAuth) + } + /> + ) : ( + + )} + + ))} From d84f48497b46b7a8172eaaf65427d0a3292d94e6 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 16:05:20 +0200 Subject: [PATCH 027/190] update: updates published view modal --- .../DownloadAndShareModals/PublishedView.tsx | 32 ++++++++++--------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx b/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx index 33bc38462..02ac1063d 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx @@ -2,11 +2,11 @@ import i18next, { TFunction } from "i18next"; import { Box, Button, - Divider, HStack, - ModalBody, Text, VStack, + Link, + Icon, } from "@chakra-ui/react"; import { InventoryResponse } from "@/util/types"; import type { Locale } from "date-fns"; @@ -16,6 +16,12 @@ import { toZonedTime } from "date-fns-tz"; import { BlueSubtitle } from "@/components/blue-subtitle"; import "dotenv/config"; import { FiExternalLink } from "react-icons/fi"; +import { + DialogRoot, + DialogBody, + DialogContent, + DialogFooter, +} from "@/components/ui/dialog"; export function PublishedView({ inventoryId, @@ -50,12 +56,12 @@ export function PublishedView({ const URL = `${window.location.protocol}//${window.location.host}/${lng}/public/${inventoryId}`; return ( - + {t("public-city-inventory")} {t("manage-public-inventory-description")} - + @@ -66,18 +72,14 @@ export function PublishedView({ - + + + - + ); } From 86e44419d6f98dae856e5195d2642710944caac1 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 16:08:04 +0200 Subject: [PATCH 028/190] adds checkbox component --- .../DownloadAndShareModals/PublishedView.tsx | 4 ++-- app/src/components/ui/checkbox.tsx | 16 ++++++++-------- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx b/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx index 02ac1063d..0b127fdae 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/PublishedView.tsx @@ -56,7 +56,7 @@ export function PublishedView({ const URL = `${window.location.protocol}//${window.location.host}/${lng}/public/${inventoryId}`; return ( - + {t("public-city-inventory")} @@ -80,6 +80,6 @@ export function PublishedView({ - + ); } diff --git a/app/src/components/ui/checkbox.tsx b/app/src/components/ui/checkbox.tsx index 6f2c86dda..2a27c2ffb 100644 --- a/app/src/components/ui/checkbox.tsx +++ b/app/src/components/ui/checkbox.tsx @@ -1,15 +1,15 @@ -import { Checkbox as ChakraCheckbox } from "@chakra-ui/react"; -import * as React from "react"; +import { Checkbox as ChakraCheckbox } from "@chakra-ui/react" +import * as React from "react" export interface CheckboxProps extends ChakraCheckbox.RootProps { - icon?: React.ReactNode; - inputProps?: React.InputHTMLAttributes; - rootRef?: React.Ref; + icon?: React.ReactNode + inputProps?: React.InputHTMLAttributes + rootRef?: React.Ref } export const Checkbox = React.forwardRef( function Checkbox(props, ref) { - const { icon, children, inputProps, rootRef, ...rest } = props; + const { icon, children, inputProps, rootRef, ...rest } = props return ( @@ -20,6 +20,6 @@ export const Checkbox = React.forwardRef( {children} )} - ); + ) }, -); +) From 82ae03f0686b2a3c2f034562652ed3f81a819c54 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 16:09:19 +0200 Subject: [PATCH 029/190] update: unpublushed view components --- .../DownloadAndShareModals/UnpublishedView.tsx | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/app/src/components/HomePage/DownloadAndShareModals/UnpublishedView.tsx b/app/src/components/HomePage/DownloadAndShareModals/UnpublishedView.tsx index 4d65c945c..82742e003 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/UnpublishedView.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/UnpublishedView.tsx @@ -1,5 +1,12 @@ import type { TFunction } from "i18next"; -import { Checkbox, ModalBody, Text } from "@chakra-ui/react"; +import { Text } from "@chakra-ui/react"; +import { + DialogRoot, + DialogBody, + DialogContent, + DialogFooter, +} from "@/components/ui/dialog"; +import { Checkbox } from "@/components/ui/checkbox"; export function UnpublishedView({ checked, @@ -11,14 +18,14 @@ export function UnpublishedView({ t: TFunction; }) { return ( - + {t("make-public")} {t("make-public-description")} - + {t("i-authorize")} - + ); } From f10b31ffa5f094e0846a5cf8b38a81a22086d7a9 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 16:14:20 +0200 Subject: [PATCH 030/190] feat: adds accordion component --- .../EmissionsForecastCard.tsx | 2 +- .../components/HomePage/DownloadButton.tsx | 2 + app/src/components/ui/accordion.tsx | 47 +++++++++++++++++++ 3 files changed, 50 insertions(+), 1 deletion(-) create mode 100644 app/src/components/ui/accordion.tsx diff --git a/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx b/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx index dc2fd6cae..185f7ce62 100644 --- a/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx +++ b/app/src/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/EmissionsForecastCard.tsx @@ -1,5 +1,5 @@ import { EmissionsForecastData } from "@/util/types"; -import { TFunction } from "i18next/typescript/t"; +import { TFunction } from "i18next"; import { useState } from "react"; import { GrowthRatesExplanationModal } from "@/app/[lng]/[inventory]/InventoryResultTab/EmissionsForecast/GrowthRatesExplanationModal"; import { diff --git a/app/src/components/HomePage/DownloadButton.tsx b/app/src/components/HomePage/DownloadButton.tsx index 6a3f7a76b..e742461a0 100644 --- a/app/src/components/HomePage/DownloadButton.tsx +++ b/app/src/components/HomePage/DownloadButton.tsx @@ -59,6 +59,8 @@ const DownloadButton: React.FC = ({ cityLocode={city?.locode} /> {}} t={t} isPublishOpen={isPublishOpen} onPublishClose={onPublishClose} diff --git a/app/src/components/ui/accordion.tsx b/app/src/components/ui/accordion.tsx new file mode 100644 index 000000000..d8763da05 --- /dev/null +++ b/app/src/components/ui/accordion.tsx @@ -0,0 +1,47 @@ +import { Accordion, HStack } from "@chakra-ui/react" +import * as React from "react" +import { LuChevronDown } from "react-icons/lu" + +interface AccordionItemTriggerProps extends Accordion.ItemTriggerProps { + indicatorPlacement?: "start" | "end" +} + +export const AccordionItemTrigger = React.forwardRef< + HTMLButtonElement, + AccordionItemTriggerProps +>(function AccordionItemTrigger(props, ref) { + const { children, indicatorPlacement = "end", ...rest } = props + return ( + + {indicatorPlacement === "start" && ( + + + + )} + + {children} + + {indicatorPlacement === "end" && ( + + + + )} + + ) +}) + +interface AccordionItemContentProps extends Accordion.ItemContentProps {} + +export const AccordionItemContent = React.forwardRef< + HTMLDivElement, + AccordionItemContentProps +>(function AccordionItemContent(props, ref) { + return ( + + + + ) +}) + +export const AccordionRoot = Accordion.Root +export const AccordionItem = Accordion.Item From e025928fe8c5c322ef4df7991a56fe523ff8a9ff Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 16:26:11 +0200 Subject: [PATCH 031/190] updates accordion in activity view --- .../InventoryResultTab/ByActivityView.tsx | 45 +++++++++---------- 1 file changed, 20 insertions(+), 25 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityView.tsx b/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityView.tsx index 3882977e3..f52465104 100644 --- a/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityView.tsx +++ b/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityView.tsx @@ -1,19 +1,15 @@ import React from "react"; -import { - Accordion, - AccordionButton, - AccordionIcon, - AccordionItem, - AccordionPanel, - Box, - Heading, - HStack, - Text, -} from "@chakra-ui/react"; +import { Box, Heading, HStack, Text } from "@chakra-ui/react"; import { capitalizeFirstLetter, convertKgToTonnes } from "@/util/helpers"; import ByActivityViewTable from "@/app/[lng]/[inventory]/InventoryResultTab/ByActivityViewTable"; import type { TFunction } from "i18next"; import type { SectorBreakdownResponse } from "@/util/types"; +import { + AccordionItem, + AccordionItemContent, + AccordionItemTrigger, + AccordionRoot, +} from "@/components/ui/accordion"; interface EmissionsBreakdownByActivityProps { tData: TFunction; @@ -29,7 +25,7 @@ export const ByActivityView: React.FC = ({ sectorBreakdown, }) => { return ( - + {Object.entries(sectorBreakdown!.byActivity || {}).map( ([subSector, values]) => { const consumptions = Object.entries( @@ -39,15 +35,15 @@ export const ByActivityView: React.FC = ({ const consumptionOrMassOfWasteTitle = sectorName !== "waste" ? "consumption" : "mass-of-waste"; return ( - - + = ({ justifyContent="space-between" width="100%" > - {tData(subSector)} - - + {tData(subSector)} + + {capitalizeFirstLetter( tDashboard(consumptionOrMassOfWasteTitle), )} @@ -78,7 +74,7 @@ export const ByActivityView: React.FC = ({ )) )} - + {capitalizeFirstLetter(tDashboard("emissions"))}:{" "} @@ -89,20 +85,19 @@ export const ByActivityView: React.FC = ({ - - - + + - + ); }, )} - + ); }; From b4e59eb9ce6797ec83c9c77f3cbf3cc99047d7a7 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 16:36:31 +0200 Subject: [PATCH 032/190] update: updates by activity view components --- .../ByActivityViewTable.tsx | 55 +++++++++---------- 1 file changed, 25 insertions(+), 30 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityViewTable.tsx b/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityViewTable.tsx index 0df7da564..b047c039b 100644 --- a/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityViewTable.tsx +++ b/app/src/app/[lng]/[inventory]/InventoryResultTab/ByActivityViewTable.tsx @@ -1,14 +1,5 @@ import React from "react"; -import { - Box, - Table, - TableContainer, - Tbody, - Td, - Th, - Thead, - Tr, -} from "@chakra-ui/react"; +import { Box, Table } from "@chakra-ui/react"; import type { TFunction } from "i18next"; import { ActivityBreakdown } from "@/util/types"; import { convertKgToTonnes } from "@/util/helpers"; @@ -41,16 +32,16 @@ const ByActivityViewTable: React.FC = ({ totalEmissionsPercentage, } = details; rows.push( - - {tData(subSector)} - + + {tData(subSector)} + {activityValue === "N/A" ? "N/A" : `${activityValue} ${tData(activityUnits)}`} - - {convertKgToTonnes(totalActivityEmissions)} - {totalEmissionsPercentage}% - , + + {convertKgToTonnes(totalActivityEmissions)} + {totalEmissionsPercentage}% + , ); }); }); @@ -61,19 +52,23 @@ const ByActivityViewTable: React.FC = ({ sectorName !== "waste" ? "consumption" : "mass-of-waste"; return ( - - - - - - - - - - - {renderRows(data)} -
{tDashboard("activity-type")}{tDashboard(consumptionOrMassTitle)}{tDashboard("emissions")}{tDashboard("%-of-sub-sector-emissions")}
- + + + + + {tDashboard("activity-type")} + + + {tDashboard(consumptionOrMassTitle)} + + {tDashboard("emissions")} + + {tDashboard("%-of-sub-sector-emissions")} + + + + {renderRows(data)} + ); }; From f8878899e728aaf7b78b85dc6dc18a6c67153400 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 16:42:29 +0200 Subject: [PATCH 033/190] update: scope view table component --- .../InventoryResultTab/ByScopeView.tsx | 71 +++++++++---------- 1 file changed, 33 insertions(+), 38 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/InventoryResultTab/ByScopeView.tsx b/app/src/app/[lng]/[inventory]/InventoryResultTab/ByScopeView.tsx index 44123eec9..e411f0b8f 100644 --- a/app/src/app/[lng]/[inventory]/InventoryResultTab/ByScopeView.tsx +++ b/app/src/app/[lng]/[inventory]/InventoryResultTab/ByScopeView.tsx @@ -1,14 +1,5 @@ import React from "react"; -import { - Box, - ChakraProvider, - Table, - Tbody, - Td, - Th, - Thead, - Tr, -} from "@chakra-ui/react"; +import { Box, Table } from "@chakra-ui/react"; import { ActivityDataByScope } from "@/util/types"; import type { TFunction } from "i18next"; import { convertKgToTonnes } from "@/util/helpers"; @@ -33,36 +24,40 @@ const ByScopeView: React.FC = ({ inventoryType ].scopes; return ( - - - - - - - - + + + + + {tData("subsector")} + + {tDashboard("total-emissions")} + + + {tDashboard("%-of-sector-emissions")} + + {scopes.map((s) => ( + + {tDashboard("emissions-scope")} {s} + + ))} + + + + {data.map((item, index) => ( + + {tData(item.activityTitle)} + {convertKgToTonnes(item.totalEmissions)} + {item.percentage}% {scopes.map((s) => ( - + + {convertKgToTonnes(item.scopes[s] || 0)} + ))} - - - - {data.map((item, index) => ( - - - - - {scopes.map((s) => ( - - ))} - - ))} - -
{tData("subsector")}{tDashboard("total-emissions")}{tDashboard("%-of-sector-emissions")} - {tDashboard("emissions-scope")} {s} -
{tData(item.activityTitle)}{convertKgToTonnes(item.totalEmissions)}{item.percentage}%{convertKgToTonnes(item.scopes[s] || 0)}
- - + + ))} + + + ); }; From 78a899c18eeae9005690f2f8e17b233895bb9746 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 14 Jan 2025 17:40:10 +0200 Subject: [PATCH 034/190] update: auth login components --- app/src/app/[lng]/auth/login/page.tsx | 17 +++--- app/src/components/email-input.tsx | 75 +++++++++++---------------- app/src/components/ui/field.tsx | 18 +++---- 3 files changed, 46 insertions(+), 64 deletions(-) diff --git a/app/src/app/[lng]/auth/login/page.tsx b/app/src/app/[lng]/auth/login/page.tsx index 749c30e40..294501ff1 100644 --- a/app/src/app/[lng]/auth/login/page.tsx +++ b/app/src/app/[lng]/auth/login/page.tsx @@ -4,13 +4,14 @@ import EmailInput from "@/components/email-input"; import PasswordInput from "@/components/password-input"; import { useAuthToast } from "@/hooks/useAuthToast"; import { useTranslation } from "@/i18n/client"; -import { Link } from "@chakra-ui/next-js"; -import { Button, Heading, Text, useToast } from "@chakra-ui/react"; +import { Heading, Text, Link } from "@chakra-ui/react"; import { TFunction } from "i18next"; import { signIn } from "next-auth/react"; import { useRouter, useSearchParams } from "next/navigation"; import { Suspense, useEffect, useState } from "react"; import { SubmitHandler, useForm } from "react-hook-form"; +import { toaster } from "@/components/ui/toaster"; +import { Button } from "@/components/ui/button"; type Inputs = { email: string; @@ -20,16 +21,14 @@ type Inputs = { function VerifiedNotification({ t }: { t: TFunction }) { const searchParams = useSearchParams(); const isVerified = !!searchParams.get("verification-code"); - const toast = useToast(); + useEffect(() => { if (isVerified) { - toast({ + toaster.create({ title: t("verified-toast-title"), description: t("verified-toast-description"), - status: "success", - duration: null, - isClosable: true, - position: "bottom-right", + type: "success", + duration: 0, }); } // eslint-disable-next-line react-hooks/exhaustive-deps @@ -111,7 +110,7 @@ export default function Login({ - )} - - - ), + type: status, + duration: duration!, + // render: ({ + // onClose, + // }: { + // onClose: MouseEventHandler; + // }) => ( + // + // + // {status === "info" || status === "error" ? ( + // + // ) : ( + // + // )} + // + // {t(title)} + // + // + // + // {status === "error" && ( + // + // )} + // + // + // ), }); }; @@ -170,8 +160,7 @@ const DownloadButtons = ({ my="16px" mx="24px" variant="ghost" - leftIcon={} - isDisabled={!isAvailable} + disabled={!isAvailable} style={{ backgroundColor: "white", color: "black", @@ -180,6 +169,7 @@ const DownloadButtons = ({ justifyContent="flex-start" onClick={() => handleDownload(format)} > + @@ -205,6 +195,7 @@ const DownloadButtons = ({ )} ))} + ); }; From 13145dfc83d6de8ed9096350a9ae11c941c89146 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 15 Jan 2025 14:12:37 +0200 Subject: [PATCH 046/190] updates download share modal --- .../ModalDownloadShare.tsx | 46 +++++++++---------- 1 file changed, 23 insertions(+), 23 deletions(-) diff --git a/app/src/components/HomePage/DownloadAndShareModals/ModalDownloadShare.tsx b/app/src/components/HomePage/DownloadAndShareModals/ModalDownloadShare.tsx index 97afc9794..6aa4d5b7e 100644 --- a/app/src/components/HomePage/DownloadAndShareModals/ModalDownloadShare.tsx +++ b/app/src/components/HomePage/DownloadAndShareModals/ModalDownloadShare.tsx @@ -1,20 +1,21 @@ -import { - Center, - Divider, - Modal, - ModalBody, - ModalCloseButton, - ModalContent, - ModalHeader, - ModalOverlay, - Text, -} from "@chakra-ui/react"; +import { Box, Center, Text } from "@chakra-ui/react"; import type { TFunction } from "i18next"; import React from "react"; import DownloadButtons from "./DownloadButtons"; import ModalPublishButtons from "./PublishButtons"; import { InventoryResponse } from "@/util/types"; +import { + DialogBody, + DialogCloseTrigger, + DialogContent, + DialogFooter, + DialogHeader, + DialogRoot, + DialogTitle, + DialogTrigger, +} from "@/components/ui/dialog"; + const ModalDownloadShare = ({ t, lng, @@ -35,19 +36,18 @@ const ModalDownloadShare = ({ inventory: InventoryResponse; }) => { return ( - - - - + + +
{t("download-and-share")}
- - - - + + + + - + - - - + + + ); }; From 380b5a1824c3fef5720b658eb21d233ab57238d3 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 15 Jan 2025 14:22:43 +0200 Subject: [PATCH 047/190] update segmented --- app/src/components/SegmentedProgress.tsx | 86 +++++++++++------------- 1 file changed, 40 insertions(+), 46 deletions(-) diff --git a/app/src/components/SegmentedProgress.tsx b/app/src/components/SegmentedProgress.tsx index 5820676fb..dadd85ad7 100644 --- a/app/src/components/SegmentedProgress.tsx +++ b/app/src/components/SegmentedProgress.tsx @@ -4,12 +4,7 @@ import { Box, Flex, Table, - TableContainer, - Tbody, - Td, Text, - Tooltip, - Tr, useToken, VStack, } from "@chakra-ui/react"; @@ -19,6 +14,8 @@ import { toKebabCase, } from "@/util/helpers"; +import { Tooltip } from "@/components/ui/tooltip"; + export type SegmentedProgressValues = | number | { name: string; percentage: number; value: bigint }; @@ -56,53 +53,50 @@ export function SegmentedProgress({ : v, ); const tooltipContent = ( - - - - {normalizedValues.map((value, index) => ( - - - - - - ))} - - - - - - -
- - {t(toKebabCase(value.name))} - - - - {value.percentage.toFixed(1)}% - - - {convertKgToTonnes(value.value)} -
- - {capitalizeFirstLetter(t("total"))} + + + {normalizedValues.map((value, index) => ( + + + + {t(toKebabCase(value.name))} - - - {convertKgToTonnes(total!)} + + + + {value.percentage.toFixed(1)}% -
- + + + {convertKgToTonnes(value.value)} + + + ))} + + + + {capitalizeFirstLetter(t("total"))} + + + + + + {convertKgToTonnes(total!)} + + + + + ); const progressBars = ( Date: Wed, 15 Jan 2025 14:29:08 +0200 Subject: [PATCH 048/190] update missing inventory component --- app/src/components/missing-inventory.tsx | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/app/src/components/missing-inventory.tsx b/app/src/components/missing-inventory.tsx index f43f0c8b4..9739396a0 100644 --- a/app/src/components/missing-inventory.tsx +++ b/app/src/components/missing-inventory.tsx @@ -1,11 +1,16 @@ import { Box, Link, Text } from "@chakra-ui/layout"; import Image from "next/image"; -import { Button, CircularProgress, Heading } from "@chakra-ui/react"; +import { Heading } from "@chakra-ui/react"; import React, { useEffect } from "react"; import { useTranslation } from "@/i18n/client"; import { useRouter } from "next/navigation"; import { api } from "@/services/api"; import { MdArrowForward } from "react-icons/md"; +import { Button } from "@/components/ui/button"; +import { + ProgressCircleRing, + ProgressCircleRoot, +} from "@/components/ui/progress-circle"; const MissingInventory = ({ lng }: { lng: string }) => { const { data: userInfo, isLoading: isUserInfoLoading } = @@ -78,10 +83,9 @@ const MissingInventory = ({ lng }: { lng: string }) => { h="48px" px="24px" fontSize="body.md" - isLoading={isUserInfoLoading} - rightIcon={} + loading={isUserInfoLoading} > - {t("goto-dashboard")} + {t("goto-dashboard")} @@ -93,7 +97,9 @@ const MissingInventory = ({ lng }: { lng: string }) => { justifyContent="center" className="flex w-full relative h-[100vh] z-10" > - + + + ); }; From 901152a2711ef81c1bbb3e691b4f4c9e527a89e1 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 15 Jan 2025 14:47:24 +0200 Subject: [PATCH 049/190] updates navbar components --- app/src/components/navigation-bar.tsx | 272 ++++++++++++-------------- app/src/components/ui/avatar.tsx | 52 ++--- 2 files changed, 154 insertions(+), 170 deletions(-) diff --git a/app/src/components/navigation-bar.tsx b/app/src/components/navigation-bar.tsx index 51538c31a..767d3f302 100644 --- a/app/src/components/navigation-bar.tsx +++ b/app/src/components/navigation-bar.tsx @@ -2,19 +2,7 @@ import { useTranslation } from "@/i18n/client"; import { languages } from "@/i18n/settings"; -import { - Avatar, - Box, - Button, - Divider, - Heading, - Icon, - Menu, - MenuButton, - MenuItem, - MenuList, - Text, -} from "@chakra-ui/react"; +import { Box, Button, Heading, Icon, Text } from "@chakra-ui/react"; import i18next from "i18next"; import { signOut, useSession } from "next-auth/react"; import Image from "next/image"; @@ -26,7 +14,13 @@ import { GoTriangleDown, GoTriangleUp } from "react-icons/go"; import Cookies from "js-cookie"; import { useParams } from "next/navigation"; import { api } from "@/services/api"; -import { useEffect } from "react"; +import { + MenuContent, + MenuItem, + MenuRoot, + MenuTrigger, +} from "@/components/ui/menu"; +import { Avatar, AvatarGroup } from "@/components/ui/avatar"; function countryFromLanguage(language: string) { return language == "en" ? "us" : language; @@ -95,7 +89,7 @@ export function NavigationBar({ /> - + {t("title")} @@ -122,140 +116,130 @@ export function NavigationBar({ {t("learning-hub")} - + )} - - {({ isOpen }) => ( - <> - - } - rightIcon={isOpen ? : } - className="whitespace-nowrap normal-case" - _hover={{ - bg: "#FFF2", - }} - _active={{ - bg: "#FFF3", - }} + + + + + {i18next.language.toUpperCase()} + + + {languages.map((language) => ( + onChangeLanguage(language)} + key={language} > - {i18next.language.toUpperCase()} - - - {languages.map((language) => ( - onChangeLanguage(language)} - key={language} - > - - {language.toUpperCase()} - - ))} - - - )} - - {!isPublic && status === "authenticated" && session.user && ( - - {({ isOpen }) => ( - <> - + : } - className="whitespace-nowrap normal-case" - _hover={{ - bg: "#FFF2", - }} - _active={{ - bg: "#FFF3", - }} - > - - {session.user?.name} - - - + {language.toUpperCase()} + + ))} + + + {!isPublic && status === "authenticated" && session.user && ( + + : } + className="whitespace-nowrap normal-case" + _hover={{ + bg: "#FFF2", + }} + _active={{ + bg: "#FFF3", + }} + > + + + {session.user?.name} + + + + + - - - - {t("settings")} - - - logOut()} - > - - {t("log-out")} - - - - )} - + + {t("settings")} + + + logOut()} + > + + {t("log-out")} + + + )} ); diff --git a/app/src/components/ui/avatar.tsx b/app/src/components/ui/avatar.tsx index 94e25828d..cd84664ae 100644 --- a/app/src/components/ui/avatar.tsx +++ b/app/src/components/ui/avatar.tsx @@ -1,24 +1,24 @@ -"use client"; +"use client" -import type { GroupProps, SlotRecipeProps } from "@chakra-ui/react"; -import { Avatar as ChakraAvatar, Group } from "@chakra-ui/react"; -import * as React from "react"; +import type { GroupProps, SlotRecipeProps } from "@chakra-ui/react" +import { Avatar as ChakraAvatar, Group } from "@chakra-ui/react" +import * as React from "react" -type ImageProps = React.ImgHTMLAttributes; +type ImageProps = React.ImgHTMLAttributes export interface AvatarProps extends ChakraAvatar.RootProps { - name?: string; - src?: string; - srcSet?: string; - loading?: ImageProps["loading"]; - icon?: React.ReactElement; - fallback?: React.ReactNode; + name?: string + src?: string + srcSet?: string + loading?: ImageProps["loading"] + icon?: React.ReactElement + fallback?: React.ReactNode } export const Avatar = React.forwardRef( function Avatar(props, ref) { const { name, src, srcSet, loading, icon, fallback, children, ...rest } = - props; + props return ( @@ -27,18 +27,18 @@ export const Avatar = React.forwardRef( {children} - ); + ) }, -); +) interface AvatarFallbackProps extends ChakraAvatar.FallbackProps { - name?: string; - icon?: React.ReactElement; + name?: string + icon?: React.ReactElement } const AvatarFallback = React.forwardRef( function AvatarFallback(props, ref) { - const { name, icon, children, ...rest } = props; + const { name, icon, children, ...rest } = props return ( {children} @@ -47,28 +47,28 @@ const AvatarFallback = React.forwardRef( {icon} )} - ); + ) }, -); +) function getInitials(name: string) { - const names = name.trim().split(" "); - const firstName = names[0] != null ? names[0] : ""; - const lastName = names.length > 1 ? names[names.length - 1] : ""; + const names = name.trim().split(" ") + const firstName = names[0] != null ? names[0] : "" + const lastName = names.length > 1 ? names[names.length - 1] : "" return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` - : firstName.charAt(0); + : firstName.charAt(0) } interface AvatarGroupProps extends GroupProps, SlotRecipeProps<"avatar"> {} export const AvatarGroup = React.forwardRef( function AvatarGroup(props, ref) { - const { size, variant, borderless, ...rest } = props; + const { size, variant, borderless, ...rest } = props return ( - ); + ) }, -); +) From dfc0cadc5030dde746880a3806a5444dacff9a10 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 16 Jan 2025 09:52:02 +0200 Subject: [PATCH 050/190] fix: render error for components expecting one child --- app/src/components/ChatBot/chat-bot.tsx | 40 ++++--- app/src/components/ChatBot/chat-popover.tsx | 76 +++++++------ app/src/components/navigation-bar.tsx | 113 +++++++++++--------- app/src/components/ui/popover.tsx | 38 +++---- 4 files changed, 136 insertions(+), 131 deletions(-) diff --git a/app/src/components/ChatBot/chat-bot.tsx b/app/src/components/ChatBot/chat-bot.tsx index 122669233..c68224942 100644 --- a/app/src/components/ChatBot/chat-bot.tsx +++ b/app/src/components/ChatBot/chat-bot.tsx @@ -5,14 +5,12 @@ import { useCopyToClipboard } from "@/hooks/use-copy-to-clipboard"; import { Box, Button, - Divider, HStack, Icon, IconButton, Spacer, Text, Textarea, - useToast, } from "@chakra-ui/react"; import { TFunction } from "i18next"; import { BsStars } from "react-icons/bs"; @@ -30,6 +28,7 @@ import { api, useCreateThreadIdMutation } from "@/services/api"; import { AssistantStream } from "openai/lib/AssistantStream"; // @ts-expect-error - no types for this yet import { AssistantStreamEvent } from "openai/resources/beta/assistants/assistants"; +import { Toaster, toaster } from "@/components/ui/toaster"; import ReactMarkdown from "react-markdown"; import remarkGfm from "remark-gfm"; @@ -79,7 +78,6 @@ export default function ChatBot({ const [getAllDataSources] = api.useLazyGetAllDataSourcesQuery(); const [getUserInventories] = api.useLazyGetUserInventoriesQuery(); const [getInventory] = api.useLazyGetInventoryQuery(); - const toast = useToast(); // AbortController reference const abortControllerRef = useRef(null); @@ -87,12 +85,11 @@ export default function ChatBot({ const handleError = (error: any, errorMessage: string) => { // Display error to user - toast({ + toaster.create({ title: "An error occurred", description: errorMessage, - status: "error", + type: "error", duration: 5000, - isClosable: true, }); }; @@ -531,7 +528,7 @@ export default function ChatBot({ i === messages.length - 1 && messages.length > 1 && ( <> - + {/* copyToClipboard(m.text)} variant="ghost" - icon={ - - } aria-label="Copy text" color={ isCopied ? "sentiment.positiveDefault" : "content.tertiary" } - /> + > + + {/* @@ -634,19 +630,21 @@ export default function ChatBot({ {inputDisabled ? ( } colorScheme="red" aria-label={t("stop-generation")} - /> + > + + ) : ( } color="content.tertiary" aria-label={t("send-message")} - isDisabled={inputDisabled} - /> + disabled={inputDisabled} + > + + )} diff --git a/app/src/components/ChatBot/chat-popover.tsx b/app/src/components/ChatBot/chat-popover.tsx index 5e2a309a5..e6a430995 100644 --- a/app/src/components/ChatBot/chat-popover.tsx +++ b/app/src/components/ChatBot/chat-popover.tsx @@ -1,24 +1,21 @@ "use client"; -import { - Button, - Icon, - IconButton, - Popover, - PopoverArrow, - PopoverBody, - PopoverCloseButton, - PopoverContent, - PopoverHeader, - PopoverTrigger, - useDisclosure, -} from "@chakra-ui/react"; +import { Button, Icon, IconButton, useDisclosure } from "@chakra-ui/react"; import React from "react"; import { BsStars } from "react-icons/bs"; import ChatBot from "./chat-bot"; import { useTranslation } from "@/i18n/client"; import { AskAiIcon } from "../icons"; +import { + PopoverBody, + PopoverCloseTrigger, + PopoverContent, + PopoverRoot, + PopoverTitle, + PopoverTrigger, +} from "@/components/ui/popover"; + export default function ChatPopover({ lng = "en", inventoryId, @@ -27,34 +24,34 @@ export default function ChatPopover({ lng?: string; inventoryId: string; }) { - const { isOpen, onOpen, onClose } = useDisclosure(); + const { open, onOpen, onClose } = useDisclosure(); const inputRef = React.useRef(null); const { t } = useTranslation(lng, "chat"); return ( <> - { - state.elements.popper.style.zIndex = "9999"; - }, - }, - ]} + inputRef.current} + onOpenChange={onOpen} + positioning={{ + placement: "top-end", + }} + // closeOnBlur={false} + // strategy="fixed" + // modifiers={[ + // { + // name: "zIndex", + // enabled: true, + // phase: "write", + // fn: ({ state }) => { + // state.elements.popper.style.zIndex = "9999"; + // }, + // }, + // ]} > - + @@ -75,9 +73,9 @@ export default function ChatPopover({ className="drop-shadow-md" zIndex={9999} > - {t("ask-ai-expert")} - - + - + ); } diff --git a/app/src/components/navigation-bar.tsx b/app/src/components/navigation-bar.tsx index 767d3f302..97c5165d7 100644 --- a/app/src/components/navigation-bar.tsx +++ b/app/src/components/navigation-bar.tsx @@ -2,17 +2,17 @@ import { useTranslation } from "@/i18n/client"; import { languages } from "@/i18n/settings"; -import { Box, Button, Heading, Icon, Text } from "@chakra-ui/react"; +import { Box, Button, Heading, Icon, Link, Text } from "@chakra-ui/react"; import i18next from "i18next"; import { signOut, useSession } from "next-auth/react"; import Image from "next/image"; -import NextLink from "next/link"; + import { CircleFlag } from "react-circle-flags"; import { FiSettings } from "react-icons/fi"; import { MdLogout } from "react-icons/md"; import { GoTriangleDown, GoTriangleUp } from "react-icons/go"; import Cookies from "js-cookie"; -import { useParams } from "next/navigation"; +import { useParams, useRouter } from "next/navigation"; import { api } from "@/services/api"; import { MenuContent, @@ -74,12 +74,13 @@ export function NavigationBar({ const { data: userInfo, isLoading: isUserInfoLoading } = api.useGetUserInfoQuery(); const currentInventoryId = userInfo?.defaultInventoryId; + const router = useRouter(); return ( - + CityCatalyst logo - - + + {t("title")} - +
{showNav && !isPublic && ( <> {" "} - + {t("dashboard")} - - + {t("learning-hub")} - + )} - + + - {i18next.language.toUpperCase()} + {i18next.language.toUpperCase()} + {languages.map((language) => ( @@ -166,6 +170,7 @@ export function NavigationBar({ {!isPublic && status === "authenticated" && session.user && ( - - - {session.user?.name} - + + + + {session.user?.name} + + - + router.push( + `/${inventory ? inventory : currentInventoryId}/settings`, + ) + } > - - - {t("settings")} - - + + {t("settings")} + + ; + portalled?: boolean + portalRef?: React.RefObject } export const PopoverContent = React.forwardRef< HTMLDivElement, PopoverContentProps >(function PopoverContent(props, ref) { - const { portalled = true, portalRef, ...rest } = props; + const { portalled = true, portalRef, ...rest } = props return ( - ); -}); + ) +}) export const PopoverArrow = React.forwardRef< HTMLDivElement, @@ -29,8 +29,8 @@ export const PopoverArrow = React.forwardRef< - ); -}); + ) +}) export const PopoverCloseTrigger = React.forwardRef< HTMLButtonElement, @@ -47,13 +47,13 @@ export const PopoverCloseTrigger = React.forwardRef< > - ); -}); + ) +}) -export const PopoverTitle = ChakraPopover.Title; -export const PopoverDescription = ChakraPopover.Description; -export const PopoverFooter = ChakraPopover.Footer; -export const PopoverHeader = ChakraPopover.Header; -export const PopoverRoot = ChakraPopover.Root; -export const PopoverBody = ChakraPopover.Body; -export const PopoverTrigger = ChakraPopover.Trigger; +export const PopoverTitle = ChakraPopover.Title +export const PopoverDescription = ChakraPopover.Description +export const PopoverFooter = ChakraPopover.Footer +export const PopoverHeader = ChakraPopover.Header +export const PopoverRoot = ChakraPopover.Root +export const PopoverBody = ChakraPopover.Body +export const PopoverTrigger = ChakraPopover.Trigger From b1460b52fc7866ff406acb481fddd889e066cc58 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 16 Jan 2025 12:07:45 +0200 Subject: [PATCH 051/190] update: password input components --- app/src/app/[lng]/[inventory]/layout.tsx | 4 +- app/src/components/ChatBot/chat-bot.tsx | 6 +- app/src/components/ChatBot/chat-popover.tsx | 30 ++++-- app/src/components/navigation-bar.tsx | 27 ++--- app/src/components/password-input.tsx | 111 +++++++++----------- app/src/components/ui/provider.tsx | 3 +- 6 files changed, 90 insertions(+), 91 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/layout.tsx b/app/src/app/[lng]/[inventory]/layout.tsx index 1c2894298..39bb23433 100644 --- a/app/src/app/[lng]/[inventory]/layout.tsx +++ b/app/src/app/[lng]/[inventory]/layout.tsx @@ -13,9 +13,9 @@ export default function DataLayout({ }) { return ( - + {/* */}
{children}
- + {/* */} ); } diff --git a/app/src/components/ChatBot/chat-bot.tsx b/app/src/components/ChatBot/chat-bot.tsx index c68224942..39c7df04b 100644 --- a/app/src/components/ChatBot/chat-bot.tsx +++ b/app/src/components/ChatBot/chat-bot.tsx @@ -497,7 +497,7 @@ export default function ChatBot({ {messages.map((m, i) => { const isUser = m.role === "user"; return ( - + 1 && ( <> - + {/* } @@ -557,7 +557,7 @@ export default function ChatBot({ boxSize={5} /> - + {/* */} {/* @@ -73,7 +81,7 @@ export default function ChatPopover({ className="drop-shadow-md" zIndex={9999} > - {t("ask-ai-expert")} - - + + diff --git a/app/src/components/navigation-bar.tsx b/app/src/components/navigation-bar.tsx index 97c5165d7..2f1bd1f5e 100644 --- a/app/src/components/navigation-bar.tsx +++ b/app/src/components/navigation-bar.tsx @@ -2,7 +2,7 @@ import { useTranslation } from "@/i18n/client"; import { languages } from "@/i18n/settings"; -import { Box, Button, Heading, Icon, Link, Text } from "@chakra-ui/react"; +import { Box, Heading, Icon, Link, Text } from "@chakra-ui/react"; import i18next from "i18next"; import { signOut, useSession } from "next-auth/react"; import Image from "next/image"; @@ -22,6 +22,8 @@ import { } from "@/components/ui/menu"; import { Avatar, AvatarGroup } from "@/components/ui/avatar"; +import { Button } from "@/components/ui/button"; + function countryFromLanguage(language: string) { return language == "en" ? "us" : language; } @@ -133,18 +135,18 @@ export function NavigationBar({ bg: "#FFF3", }} > - - + {/* + /> */} {i18next.language.toUpperCase()} - + {languages.map((language) => ( @@ -153,7 +155,7 @@ export function NavigationBar({ onClick={() => onChangeLanguage(language)} key={language} > - - {language.toUpperCase()} + /> */} + {language.toUpperCase()} ))} @@ -171,7 +173,6 @@ export function NavigationBar({ : } @@ -183,7 +184,7 @@ export function NavigationBar({ bg: "#FFF3", }} > - + - {t("settings")} + {t("settings")} - {t("log-out")} + {t("log-out")} diff --git a/app/src/components/password-input.tsx b/app/src/components/password-input.tsx index d65ed7f10..db4322f02 100644 --- a/app/src/components/password-input.tsx +++ b/app/src/components/password-input.tsx @@ -1,14 +1,9 @@ -import { ViewIcon, ViewOffIcon, WarningIcon } from "@chakra-ui/icons"; import { Button, - FormControl, - FormErrorMessage, - FormLabel, + Icon, Input, - InputGroup, - InputRightElement, List, - ListIcon, + ListIndicator, ListItem, Text, } from "@chakra-ui/react"; @@ -16,6 +11,9 @@ import { useState } from "react"; import { FieldError } from "react-hook-form"; import { CheckListIcon, CloseListIcon } from "./icons"; import { TFunction } from "i18next"; +import { Field } from "@/components/ui/field"; +import { InputGroup } from "./ui/input-group"; +import { GrFormView, GrFormViewHide } from "react-icons/gr"; export default function PasswordInput({ children, @@ -53,9 +51,24 @@ export default function PasswordInput({ const isPasswordValid = hasMinLength && hasLowercase && hasUppercase && hasNumber && hasSpecial; return ( - - {name} - + + + {showPassword ? ( + + ) : ( + + )} + + } + > - - - {children} {/* Password Checklist */} {shouldValidate && ( - - - + + + > + {hasMinLength ? : } + {t("password-min-length-check", { length: 8 })} - - - + + + > + {hasUppercase ? : } + {t("password-upper-case-check")} - - - + + + > + {hasLowercase ? : } + {t("password-lower-case-check")} - - - + + + > + {hasNumber ? : } + {t("password-number-check")} - - - )} - {error && ( - - - - {t(error.message!)} - - + + )} - + ); } diff --git a/app/src/components/ui/provider.tsx b/app/src/components/ui/provider.tsx index 26acfe15a..5f78d0090 100644 --- a/app/src/components/ui/provider.tsx +++ b/app/src/components/ui/provider.tsx @@ -3,10 +3,11 @@ import { ChakraProvider } from "@chakra-ui/react"; import { ColorModeProvider, type ColorModeProviderProps } from "./color-mode"; import { appTheme } from "@/lib/theme/app-theme"; +import { system } from "@chakra-ui/react/preset"; export function Provider(props: ColorModeProviderProps, value: any) { return ( - + ); From f6777c7f4336d6bc8f3e9cc4b0bdb367f57748a8 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Thu, 16 Jan 2025 14:07:57 +0200 Subject: [PATCH 052/190] fix: render error for components expecting one child --- app/src/app/[lng]/[inventory]/layout.tsx | 4 +- app/src/app/[lng]/auth/login/page.tsx | 3 +- app/src/components/ChatBot/chat-bot.tsx | 82 +++---- app/src/components/navigation-bar.tsx | 266 ++++++++++++----------- app/src/components/password-input.tsx | 2 +- app/src/components/ui/provider.tsx | 3 +- app/src/hooks/useAuthToast.tsx | 56 +++-- 7 files changed, 218 insertions(+), 198 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/layout.tsx b/app/src/app/[lng]/[inventory]/layout.tsx index 39bb23433..1c2894298 100644 --- a/app/src/app/[lng]/[inventory]/layout.tsx +++ b/app/src/app/[lng]/[inventory]/layout.tsx @@ -13,9 +13,9 @@ export default function DataLayout({ }) { return ( - {/* */} +
{children}
- {/* */} + ); } diff --git a/app/src/app/[lng]/auth/login/page.tsx b/app/src/app/[lng]/auth/login/page.tsx index 294501ff1..f21ba3e7a 100644 --- a/app/src/app/[lng]/auth/login/page.tsx +++ b/app/src/app/[lng]/auth/login/page.tsx @@ -10,7 +10,7 @@ import { signIn } from "next-auth/react"; import { useRouter, useSearchParams } from "next/navigation"; import { Suspense, useEffect, useState } from "react"; import { SubmitHandler, useForm } from "react-hook-form"; -import { toaster } from "@/components/ui/toaster"; +import { Toaster, toaster } from "@/components/ui/toaster"; import { Button } from "@/components/ui/button"; type Inputs = { @@ -133,6 +133,7 @@ export default function Login({ + ); } diff --git a/app/src/components/ChatBot/chat-bot.tsx b/app/src/components/ChatBot/chat-bot.tsx index 39c7df04b..2505d360d 100644 --- a/app/src/components/ChatBot/chat-bot.tsx +++ b/app/src/components/ChatBot/chat-bot.tsx @@ -513,24 +513,29 @@ export default function ChatBot({ className={`rounded-2xl border-r-t px-6 py-4 ${isUser ? userStyles : botStyles}`} bg={isUser ? "content.link" : "base.light"} > - - - {m.text} - - - {!isUser && - i === messages.length - 1 && - messages.length > 1 && ( - <> - - - {/* + + + {m.text} + + + {!isUser && + i === messages.length - 1 && + messages.length > 1 && ( + <> + + + {/* } aria-label="Vote good" @@ -542,23 +547,23 @@ export default function ChatBot({ aria-label="Vote bad" color="content.tertiary" /> */} - copyToClipboard(m.text)} - variant="ghost" - aria-label="Copy text" - color={ - isCopied - ? "sentiment.positiveDefault" - : "content.tertiary" - } - > - - - {/* */} - {/* */} - - - )} + + + )} + ); diff --git a/app/src/components/navigation-bar.tsx b/app/src/components/navigation-bar.tsx index 2f1bd1f5e..896e5f54f 100644 --- a/app/src/components/navigation-bar.tsx +++ b/app/src/components/navigation-bar.tsx @@ -122,135 +122,151 @@ export function NavigationBar({ )} - - - - - - {languages.map((language) => ( - onChangeLanguage(language)} - key={language} + + + + - {/* */} - {language.toUpperCase()} - - ))} - - - {!isPublic && status === "authenticated" && session.user && ( - - : } - className="whitespace-nowrap normal-case" - _hover={{ - bg: "#FFF2", - }} - _active={{ - bg: "#FFF3", - }} - > - + + + {languages.map((language) => ( + onChangeLanguage(language)} + key={language} + > + + + {language.toUpperCase()} + + + ))} + + + + + {!isPublic && status === "authenticated" && session.user && ( + + - : } + className="whitespace-nowrap normal-case" + _hover={{ + bg: "#FFF2", + }} + _active={{ + bg: "#FFF3", + }} > - {session.user?.name} - - - - - - router.push( - `/${inventory ? inventory : currentInventoryId}/settings`, - ) - } - > - - {t("settings")} - + + - logOut()} - > - - {t("log-out")} - - - - )} + + + router.push( + `/${inventory ? inventory : currentInventoryId}/settings`, + ) + } + > + + {" "} + + {t("settings")} + + + logOut()} + > + + + {t("log-out")} + + + + + )} + + ); } diff --git a/app/src/components/password-input.tsx b/app/src/components/password-input.tsx index db4322f02..e4a1208ef 100644 --- a/app/src/components/password-input.tsx +++ b/app/src/components/password-input.tsx @@ -1,5 +1,4 @@ import { - Button, Icon, Input, List, @@ -14,6 +13,7 @@ import { TFunction } from "i18next"; import { Field } from "@/components/ui/field"; import { InputGroup } from "./ui/input-group"; import { GrFormView, GrFormViewHide } from "react-icons/gr"; +import { Button } from "./ui/button"; export default function PasswordInput({ children, diff --git a/app/src/components/ui/provider.tsx b/app/src/components/ui/provider.tsx index 5f78d0090..26acfe15a 100644 --- a/app/src/components/ui/provider.tsx +++ b/app/src/components/ui/provider.tsx @@ -3,11 +3,10 @@ import { ChakraProvider } from "@chakra-ui/react"; import { ColorModeProvider, type ColorModeProviderProps } from "./color-mode"; import { appTheme } from "@/lib/theme/app-theme"; -import { system } from "@chakra-ui/react/preset"; export function Provider(props: ColorModeProviderProps, value: any) { return ( - + ); diff --git a/app/src/hooks/useAuthToast.tsx b/app/src/hooks/useAuthToast.tsx index 8082bb4a7..4ca32d2f4 100644 --- a/app/src/hooks/useAuthToast.tsx +++ b/app/src/hooks/useAuthToast.tsx @@ -1,39 +1,37 @@ -import { CheckCircleIcon } from "@chakra-ui/icons"; -import { Box, Text, useToast } from "@chakra-ui/react"; +import { Box, Text } from "@chakra-ui/react"; import { TFunction } from "i18next"; +import { toaster } from "@/components/ui/toaster"; export function useAuthToast(t: TFunction) { - const toast = useToast(); - const showLoginSuccessToast = () => { - return toast({ + return toaster.create({ title: t("verified-toast-title"), description: t("verified-toast-description"), - status: "success", + type: "success", duration: 3000, - isClosable: true, - position: "top", - render: () => ( - - - - {t("logged-in-successful")} - - - ), + placement: "top", + // Todo: add custom styles to toaster + // render: () => ( + // + // + // + // {t("logged-in-successful")} + // + // + // ) }); }; From fe6d01771d95083718525f81cf3701cb44b563a4 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 22 Jan 2025 09:54:58 +0200 Subject: [PATCH 053/190] fix: updates password input component --- app/src/app/[lng]/auth/login/page.tsx | 12 +- app/src/components/email-input.tsx | 50 ++++---- app/src/components/password-input.tsx | 89 +++++--------- app/src/components/ui/input-group.tsx | 28 ++--- app/src/components/ui/password-input.tsx | 148 +++++++++++++++++++++++ app/tsconfig.json | 6 +- 6 files changed, 222 insertions(+), 111 deletions(-) create mode 100644 app/src/components/ui/password-input.tsx diff --git a/app/src/app/[lng]/auth/login/page.tsx b/app/src/app/[lng]/auth/login/page.tsx index f21ba3e7a..039a560b5 100644 --- a/app/src/app/[lng]/auth/login/page.tsx +++ b/app/src/app/[lng]/auth/login/page.tsx @@ -4,7 +4,7 @@ import EmailInput from "@/components/email-input"; import PasswordInput from "@/components/password-input"; import { useAuthToast } from "@/hooks/useAuthToast"; import { useTranslation } from "@/i18n/client"; -import { Heading, Text, Link } from "@chakra-ui/react"; +import { Heading, Text, Link, Box } from "@chakra-ui/react"; import { TFunction } from "i18next"; import { signIn } from "next-auth/react"; import { useRouter, useSearchParams } from "next/navigation"; @@ -13,7 +13,7 @@ import { SubmitHandler, useForm } from "react-hook-form"; import { Toaster, toaster } from "@/components/ui/toaster"; import { Button } from "@/components/ui/button"; -type Inputs = { +export type LoginInputs = { email: string; password: string; }; @@ -48,7 +48,7 @@ export default function Login({ handleSubmit, register, formState: { errors, isSubmitting }, - } = useForm(); + } = useForm(); const searchParams = useSearchParams(); @@ -63,7 +63,7 @@ export default function Login({ callbackUrl = callbackParam; } const { showLoginSuccessToast } = useAuthToast(t); - const onSubmit: SubmitHandler = async (data) => { + const onSubmit: SubmitHandler = async (data) => { try { const res = await signIn("credentials", { redirect: false, @@ -93,7 +93,7 @@ export default function Login({ }; return ( - <> + {t("login-heading")} {t("login-details")} @@ -134,6 +134,6 @@ export default function Login({ - + ); } diff --git a/app/src/components/email-input.tsx b/app/src/components/email-input.tsx index 7314b4319..51e940386 100644 --- a/app/src/components/email-input.tsx +++ b/app/src/components/email-input.tsx @@ -22,31 +22,29 @@ export default function EmailInput({ disabled?: boolean; }) { return ( - - - - {children} - - + + + {children} + ); } diff --git a/app/src/components/password-input.tsx b/app/src/components/password-input.tsx index e4a1208ef..798b68c71 100644 --- a/app/src/components/password-input.tsx +++ b/app/src/components/password-input.tsx @@ -1,19 +1,10 @@ -import { - Icon, - Input, - List, - ListIndicator, - ListItem, - Text, -} from "@chakra-ui/react"; +import { Box, List, ListIndicator, Text } from "@chakra-ui/react"; import { useState } from "react"; import { FieldError } from "react-hook-form"; import { CheckListIcon, CloseListIcon } from "./icons"; import { TFunction } from "i18next"; import { Field } from "@/components/ui/field"; -import { InputGroup } from "./ui/input-group"; -import { GrFormView, GrFormViewHide } from "react-icons/gr"; -import { Button } from "./ui/button"; +import { PasswordInput as ChakraPasswordInput } from "@/components/ui/password-input"; export default function PasswordInput({ children, @@ -36,66 +27,40 @@ export default function PasswordInput({ shouldValidate?: boolean; watchPassword?: string; }) { - const [showPassword, setShowPassword] = useState(false); - const handlePasswordVisibility = () => setShowPassword(!showPassword); - // Password checks const password = watchPassword || ""; const hasLowercase = /[a-z]/.test(password); const hasMinLength = password.length >= 8; const hasUppercase = /[A-Z]/.test(password); const hasNumber = /\d/.test(password); - const hasSpecial = /[^A-Za-z0-9]/.test(password); - // overal validity - const isPasswordValid = - hasMinLength && hasLowercase && hasUppercase && hasNumber && hasSpecial; return ( - - {showPassword ? ( - - ) : ( - - )} - - } - > - - value.length >= 8 || t("password-min-length"), - hasUpperCase: (value: string) => - /[A-Z]/.test(value) || t("password-upper-case"), - hasLowerCase: (value: string) => - /[a-z]/.test(value) || t("password-lower-case"), - hasNumber: (value: string) => - /[0-9]/.test(value) || t("password-number"), - } - : undefined, - })} - /> - - {children} + + value.length >= 8 || t("password-min-length"), + hasUpperCase: (value: string) => + /[A-Z]/.test(value) || t("password-upper-case"), + hasLowerCase: (value: string) => + /[a-z]/.test(value) || t("password-lower-case"), + hasNumber: (value: string) => + /[0-9]/.test(value) || t("password-number"), + } + : undefined, + })} + /> + + {children} {/* Password Checklist */} {shouldValidate && ( diff --git a/app/src/components/ui/input-group.tsx b/app/src/components/ui/input-group.tsx index 992eb0f0f..5d8fb32ad 100644 --- a/app/src/components/ui/input-group.tsx +++ b/app/src/components/ui/input-group.tsx @@ -1,15 +1,15 @@ -import type { BoxProps, InputElementProps } from "@chakra-ui/react"; -import { Group, InputElement } from "@chakra-ui/react"; -import * as React from "react"; +import type { BoxProps, InputElementProps } from "@chakra-ui/react" +import { Group, InputElement } from "@chakra-ui/react" +import * as React from "react" export interface InputGroupProps extends BoxProps { - startElementProps?: InputElementProps; - endElementProps?: InputElementProps; - startElement?: React.ReactNode; - endElement?: React.ReactNode; - children: React.ReactElement; - startOffset?: InputElementProps["paddingStart"]; - endOffset?: InputElementProps["paddingEnd"]; + startElementProps?: InputElementProps + endElementProps?: InputElementProps + startElement?: React.ReactNode + endElement?: React.ReactNode + children: React.ReactElement + startOffset?: InputElementProps["paddingStart"] + endOffset?: InputElementProps["paddingEnd"] } export const InputGroup = React.forwardRef( @@ -23,10 +23,10 @@ export const InputGroup = React.forwardRef( startOffset = "6px", endOffset = "6px", ...rest - } = props; + } = props const child = - React.Children.only>(children); + React.Children.only>(children) return ( @@ -48,6 +48,6 @@ export const InputGroup = React.forwardRef( )} - ); + ) }, -); +) diff --git a/app/src/components/ui/password-input.tsx b/app/src/components/ui/password-input.tsx new file mode 100644 index 000000000..0c608a947 --- /dev/null +++ b/app/src/components/ui/password-input.tsx @@ -0,0 +1,148 @@ +"use client" + +import type { + ButtonProps, + GroupProps, + InputProps, + StackProps, +} from "@chakra-ui/react" +import { + Box, + HStack, + IconButton, + Input, + Stack, + mergeRefs, + useControllableState, +} from "@chakra-ui/react" +import * as React from "react" +import { LuEye, LuEyeOff } from "react-icons/lu" +import { InputGroup } from "./input-group" + +export interface PasswordVisibilityProps { + defaultVisible?: boolean + visible?: boolean + onVisibleChange?: (visible: boolean) => void + visibilityIcon?: { on: React.ReactNode; off: React.ReactNode } +} + +export interface PasswordInputProps + extends InputProps, + PasswordVisibilityProps { + rootProps?: GroupProps +} + +export const PasswordInput = React.forwardRef< + HTMLInputElement, + PasswordInputProps +>(function PasswordInput(props, ref) { + const { + rootProps, + defaultVisible, + visible: visibleProp, + onVisibleChange, + visibilityIcon = { on: , off: }, + ...rest + } = props + + const [visible, setVisible] = useControllableState({ + value: visibleProp, + defaultValue: defaultVisible || false, + onChange: onVisibleChange, + }) + + const inputRef = React.useRef(null) + + return ( + { + if (rest.disabled) return + if (e.button !== 0) return + e.preventDefault() + setVisible(!visible) + }} + > + {visible ? visibilityIcon.off : visibilityIcon.on} + + } + {...rootProps} + > + + + ) +}) + +const VisibilityTrigger = React.forwardRef( + function VisibilityTrigger(props, ref) { + return ( + + ) + }, +) + +interface PasswordStrengthMeterProps extends StackProps { + max?: number + value: number +} + +export const PasswordStrengthMeter = React.forwardRef< + HTMLDivElement, + PasswordStrengthMeterProps +>(function PasswordStrengthMeter(props, ref) { + const { max = 4, value, ...rest } = props + + const percent = (value / max) * 100 + const { label, colorPalette } = getColorPalette(percent) + + return ( + + + {Array.from({ length: max }).map((_, index) => ( + + ))} + + {label && {label}} + + ) +}) + +function getColorPalette(percent: number) { + switch (true) { + case percent < 33: + return { label: "Low", colorPalette: "red" } + case percent < 66: + return { label: "Medium", colorPalette: "orange" } + default: + return { label: "High", colorPalette: "green" } + } +} diff --git a/app/tsconfig.json b/app/tsconfig.json index 55d224ddd..a94f98938 100644 --- a/app/tsconfig.json +++ b/app/tsconfig.json @@ -1,6 +1,6 @@ { "compilerOptions": { - "target": "ESNext", + "target": "ES2020", "lib": [ "dom", "dom.iterable", @@ -13,7 +13,7 @@ "noEmit": true, "esModuleInterop": true, "module": "esnext", - "moduleResolution": "bundler", + "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", @@ -39,4 +39,4 @@ "cypress.config.ts" ] -} +} \ No newline at end of file From c82a65eacc12f13b643cca157ba3a2df4d0e71e3 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 22 Jan 2025 10:18:20 +0200 Subject: [PATCH 054/190] updates signup components --- app/src/app/[lng]/auth/signup/page.tsx | 142 +++++++++++-------------- 1 file changed, 64 insertions(+), 78 deletions(-) diff --git a/app/src/app/[lng]/auth/signup/page.tsx b/app/src/app/[lng]/auth/signup/page.tsx index 2f6fd1875..bbcceb51a 100644 --- a/app/src/app/[lng]/auth/signup/page.tsx +++ b/app/src/app/[lng]/auth/signup/page.tsx @@ -3,24 +3,17 @@ import EmailInput from "@/components/email-input"; import PasswordInput from "@/components/password-input"; import { useTranslation } from "@/i18n/client"; -import { InfoOutlineIcon, WarningIcon } from "@chakra-ui/icons"; -import { Link } from "@chakra-ui/next-js"; -import { - Button, - Checkbox, - FormControl, - FormErrorMessage, - FormHelperText, - FormLabel, - Heading, - Input, - Text, -} from "@chakra-ui/react"; + +import { Box, Heading, Icon, Input, Link, Text } from "@chakra-ui/react"; import { useParams, useRouter, useSearchParams } from "next/navigation"; import { useState } from "react"; import { useForm, SubmitHandler } from "react-hook-form"; import { Trans } from "react-i18next/TransWithoutContext"; import { logger } from "@/services/logger"; +import { MdInfoOutline, MdWarning } from "react-icons/md"; +import { Button } from "@/components/ui/button"; +import { Field } from "@/components/ui/field"; +import { Checkbox } from "@/components/ui/checkbox"; type Inputs = { inventory?: string; @@ -136,8 +129,23 @@ export default function Signup({ {t("signup-details")}
- - {t("full-name")} + + + + {errors.name?.message} + + + } + > - {errors.name && ( - - - - {errors.name.message} - - - )} - + - {!errors.password && watchPassword.length === 0 && ( - - {" "} - - {t("password-hint")} - - - )} - + /> - - {t("invite-code")} + + + + {errors.inviteCode?.message} + + + } + > - {errors.inviteCode && ( - - - - {errors.inviteCode.message} - - - )} - + + Don't have an invitation code?{" "} - - - + + + + + + {errors.acceptTerms?.message} + + + } + > - {errors.acceptTerms && ( - - - - {errors.acceptTerms.message} - - - )} - + {error && {error}} */} - - - )} - + + + )} + + ); diff --git a/app/src/components/navigation-bar.tsx b/app/src/components/navigation-bar.tsx index 896e5f54f..a18a7b0b4 100644 --- a/app/src/components/navigation-bar.tsx +++ b/app/src/components/navigation-bar.tsx @@ -10,7 +10,6 @@ import Image from "next/image"; import { CircleFlag } from "react-circle-flags"; import { FiSettings } from "react-icons/fi"; import { MdLogout } from "react-icons/md"; -import { GoTriangleDown, GoTriangleUp } from "react-icons/go"; import Cookies from "js-cookie"; import { useParams, useRouter } from "next/navigation"; import { api } from "@/services/api"; @@ -125,19 +124,18 @@ export function NavigationBar({ - - @@ -157,7 +159,7 @@ export function NavigationBar({ onClick={() => onChangeLanguage(language)} key={language} > - + - {language.toUpperCase()} + {language.toUpperCase()} ))} @@ -184,14 +186,8 @@ export function NavigationBar({ // Todo: add icon switch functionality // rightIcon={isOpen ? : } className="whitespace-nowrap normal-case" - _hover={{ - bg: "#FFF2", - }} - _active={{ - bg: "#FFF3", - }} > - From 1bd149e31e791a4c593ecd7dd02782a102fdcc37 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 23 Jan 2025 17:36:03 +0100 Subject: [PATCH 058/190] fix(ui): unable to sign up, error on check email page --- app/src/app/[lng]/auth/check-email/page.tsx | 2 +- app/src/app/[lng]/auth/signup/page.tsx | 10 +++++++--- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/app/src/app/[lng]/auth/check-email/page.tsx b/app/src/app/[lng]/auth/check-email/page.tsx index 93be1e82e..e720291ed 100644 --- a/app/src/app/[lng]/auth/check-email/page.tsx +++ b/app/src/app/[lng]/auth/check-email/page.tsx @@ -1,7 +1,7 @@ "use client"; import { useTranslation } from "@/i18n/client"; -import { Link } from "@chakra-ui/next-js"; +import { Link } from "@chakra-ui/react"; import { Button, Heading, Text } from "@chakra-ui/react"; import NextLink from "next/link"; import { useSearchParams } from "next/navigation"; diff --git a/app/src/app/[lng]/auth/signup/page.tsx b/app/src/app/[lng]/auth/signup/page.tsx index bbcceb51a..962ac7e95 100644 --- a/app/src/app/[lng]/auth/signup/page.tsx +++ b/app/src/app/[lng]/auth/signup/page.tsx @@ -79,6 +79,10 @@ export default function Signup({ data.inventory = inventoryId; } + if (typeof data.acceptTerms !== "boolean") { + data.acceptTerms = data.acceptTerms === "on"; + } + try { const res = await fetch("/api/v0/auth/register", { method: "POST", @@ -179,7 +183,7 @@ export default function Signup({ Date: Thu, 23 Jan 2025 17:36:50 +0100 Subject: [PATCH 059/190] fix(ui): add formatting to ui components for button and toaster --- app/src/components/ui/button.tsx | 16 ++++++++-------- app/src/components/ui/toaster.tsx | 10 +++++----- 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/app/src/components/ui/button.tsx b/app/src/components/ui/button.tsx index 20f5f7892..21d5f4b55 100644 --- a/app/src/components/ui/button.tsx +++ b/app/src/components/ui/button.tsx @@ -1,22 +1,22 @@ -import type { ButtonProps as ChakraButtonProps } from "@chakra-ui/react"; +import type { ButtonProps as ChakraButtonProps } from "@chakra-ui/react" import { AbsoluteCenter, Button as ChakraButton, Span, Spinner, -} from "@chakra-ui/react"; -import * as React from "react"; +} from "@chakra-ui/react" +import * as React from "react" interface ButtonLoadingProps { - loading?: boolean; - loadingText?: React.ReactNode; + loading?: boolean + loadingText?: React.ReactNode } export interface ButtonProps extends ChakraButtonProps, ButtonLoadingProps {} export const Button = React.forwardRef( function Button(props, ref) { - const { loading, disabled, loadingText, children, ...rest } = props; + const { loading, disabled, loadingText, children, ...rest } = props return ( {loading && !loadingText ? ( @@ -35,6 +35,6 @@ export const Button = React.forwardRef( children )} - ); + ) }, -); +) diff --git a/app/src/components/ui/toaster.tsx b/app/src/components/ui/toaster.tsx index df6c2c38e..a2b882cc6 100644 --- a/app/src/components/ui/toaster.tsx +++ b/app/src/components/ui/toaster.tsx @@ -1,4 +1,4 @@ -"use client" +"use client"; import { Toaster as ChakraToaster, @@ -7,12 +7,12 @@ import { Stack, Toast, createToaster, -} from "@chakra-ui/react" +} from "@chakra-ui/react"; export const toaster = createToaster({ placement: "bottom-end", pauseOnPageIdle: true, -}) +}); export const Toaster = () => { return ( @@ -39,5 +39,5 @@ export const Toaster = () => { )} - ) -} + ); +}; From 00f45c7fb90cf44bb552c49592e4ac1f871c2e06 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 23 Jan 2025 17:37:24 +0100 Subject: [PATCH 060/190] fix(build): TypeScript errors in toaster ui component because of wrong moduleResolution key --- app/tsconfig.json | 16 +++++----------- 1 file changed, 5 insertions(+), 11 deletions(-) diff --git a/app/tsconfig.json b/app/tsconfig.json index a94f98938..5026fc3cb 100644 --- a/app/tsconfig.json +++ b/app/tsconfig.json @@ -1,11 +1,7 @@ { "compilerOptions": { - "target": "ES2020", - "lib": [ - "dom", - "dom.iterable", - "esnext" - ], + "target": "ESNext", + "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true, "strict": true, @@ -13,7 +9,7 @@ "noEmit": true, "esModuleInterop": true, "module": "esnext", - "moduleResolution": "node", + "moduleResolution": "bundler", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", @@ -24,9 +20,7 @@ } ], "paths": { - "@/*": [ - "./src/*" - ] + "@/*": ["./src/*"] }, "baseUrl": "." }, @@ -38,5 +32,5 @@ "cypress/**/*", "cypress.config.ts" ] +} -} \ No newline at end of file From f2e1d59b74044908365e610b4a8c301fa4703323 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 23 Jan 2025 17:37:35 +0100 Subject: [PATCH 061/190] fix(build): missing line in package-lock.json --- app/package-lock.json | 1 + 1 file changed, 1 insertion(+) diff --git a/app/package-lock.json b/app/package-lock.json index 031e28f01..e10bcef07 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -24438,6 +24438,7 @@ "version": "5.4.0", "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.4.0.tgz", "integrity": "sha512-7eltJxgVt7X64oHh6wSWNwwbKTCtMfK35hcjvJS0yxEAhPM8oUKdS3+kqaW1vicIltw+kR2unHaa12S9pPALoQ==", + "license": "MIT", "peerDependencies": { "react": "*" } From 6b3c4ea872e09ddbdd1c8a12a763373cca268e4d Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 23 Jan 2025 17:39:41 +0100 Subject: [PATCH 062/190] fix(ui): upgrade onboarding pages and components to Chakra UI v3 --- .../done/[cityId]/[year]/[inventory]/page.tsx | 13 ++--- app/src/app/[lng]/onboarding/page.tsx | 16 ++----- .../setup/FormattedThousandsNumberInput.tsx | 18 +++---- app/src/app/[lng]/onboarding/setup/page.tsx | 47 ++++++++++++------- 4 files changed, 49 insertions(+), 45 deletions(-) diff --git a/app/src/app/[lng]/onboarding/done/[cityId]/[year]/[inventory]/page.tsx b/app/src/app/[lng]/onboarding/done/[cityId]/[year]/[inventory]/page.tsx index 01f3ce9f3..43d27d594 100644 --- a/app/src/app/[lng]/onboarding/done/[cityId]/[year]/[inventory]/page.tsx +++ b/app/src/app/[lng]/onboarding/done/[cityId]/[year]/[inventory]/page.tsx @@ -2,8 +2,8 @@ import { useTranslation } from "@/i18n/client"; import { useAppSelector } from "@/lib/hooks"; -import { ArrowForwardIcon } from "@chakra-ui/icons"; -import { Box, Button, Card, Flex, Heading, Text } from "@chakra-ui/react"; +import { MdArrowForward } from "react-icons/md"; +import { Box, Button, Heading, Text } from "@chakra-ui/react"; import NextLink from "next/link"; import { Trans } from "react-i18next/TransWithoutContext"; import { logger } from "@/services/logger"; @@ -58,14 +58,9 @@ export default function OnboardingDone({ - diff --git a/app/src/app/[lng]/onboarding/page.tsx b/app/src/app/[lng]/onboarding/page.tsx index ed54aaf5e..2bc98ca1f 100644 --- a/app/src/app/[lng]/onboarding/page.tsx +++ b/app/src/app/[lng]/onboarding/page.tsx @@ -1,11 +1,11 @@ "use client"; import { useTranslation } from "@/i18n/client"; -import { ArrowForwardIcon, ArrowRightIcon } from "@chakra-ui/icons"; -import { Box, Button, Heading, HStack, Text, VStack } from "@chakra-ui/react"; +import { Box, Button, Heading, HStack, Text } from "@chakra-ui/react"; import Image from "next/image"; import NextLink from "next/link"; -import { Trans } from "react-i18next/TransWithoutContext"; +import { MdArrowForward } from "react-icons/md"; + export default function Onboarding({ params: { lng }, }: { @@ -86,14 +86,7 @@ export default function Onboarding({ px="175px" > - diff --git a/app/src/app/[lng]/onboarding/setup/FormattedThousandsNumberInput.tsx b/app/src/app/[lng]/onboarding/setup/FormattedThousandsNumberInput.tsx index 6f0d11d00..79cd1b358 100644 --- a/app/src/app/[lng]/onboarding/setup/FormattedThousandsNumberInput.tsx +++ b/app/src/app/[lng]/onboarding/setup/FormattedThousandsNumberInput.tsx @@ -9,6 +9,7 @@ import { UseControllerProps, Control, } from "react-hook-form"; +import { Field } from "@/components/ui/field"; function useFormattedNumber( name: Path, @@ -78,14 +79,15 @@ function FormattedNumberInput({ ); return ( - + + + ); } diff --git a/app/src/app/[lng]/onboarding/setup/page.tsx b/app/src/app/[lng]/onboarding/setup/page.tsx index 1117171b9..b827a3a4b 100644 --- a/app/src/app/[lng]/onboarding/setup/page.tsx +++ b/app/src/app/[lng]/onboarding/setup/page.tsx @@ -11,8 +11,8 @@ import { } from "@/services/api"; import { OCCityAttributes } from "@/util/types"; -import { ArrowBackIcon, ArrowForwardIcon } from "@chakra-ui/icons"; -import { Box, Button, Text, useSteps, useToast } from "@chakra-ui/react"; +import { MdArrowForward, MdArrowBack } from "react-icons/md"; +import { Box, Icon, Text, useSteps } from "@chakra-ui/react"; import { useRouter } from "next/navigation"; import { useState } from "react"; @@ -23,6 +23,17 @@ import SetInventoryDetailsStep from "@/components/steps/add-inventory-details-st import SetPopulationDataStep from "@/components/steps/add-population-data-step"; import ConfirmStep from "@/components/steps/confirm-city-data-step"; import ProgressSteps from "@/components/steps/progress-steps"; +import { Toaster, toaster } from "@/components/ui/toaster"; +import { Button } from "@/components/ui/button"; +import { + StepsCompletedContent, + StepsContent, + StepsItem, + StepsList, + StepsNextTrigger, + StepsPrevTrigger, + StepsRoot, +} from "@/components/ui/steps"; export type Inputs = { city: string; @@ -58,7 +69,6 @@ export default function OnboardingSetup({ }) { const { t } = useTranslation(lng, "onboarding"); const router = useRouter(); - const toast = useToast(); const { handleSubmit, register, @@ -76,8 +86,12 @@ export default function OnboardingSetup({ { title: t("confirm-step") }, ]; - const { activeStep, goToNext, goToPrevious } = useSteps({ - index: 0, + const { + value: activeStep, + goToNextStep, + goToPrevStep, + } = useSteps({ + defaultStep: 0, count: steps.length, }); @@ -97,12 +111,11 @@ export default function OnboardingSetup({ const [isConfirming, setConfirming] = useState(false); const makeErrorToast = (title: string, description?: string) => { - toast({ + toaster.create({ title, description, - position: "top", - status: "error", - isClosable: true, + placement: "top", + type: "error", duration: 10000, }); }; @@ -209,7 +222,7 @@ export default function OnboardingSetup({ locode: ocCityData?.actor_id!, name: ocCityData?.name!, }); - goToNext(); + goToNextStep(); }; return ( @@ -217,12 +230,12 @@ export default function OnboardingSetup({
@@ -293,7 +306,6 @@ export default function OnboardingSetup({ onClick={handleSubmit(onSubmit)} h="64px" type="submit" - rightIcon={} > {t("continue")} + )} {activeStep == 1 && ( @@ -312,7 +325,6 @@ export default function OnboardingSetup({ onClick={handleSubmit(onSubmit)} px="24px" h="64px" - rightIcon={} > {t("continue")} + )} {activeStep == 2 && ( @@ -331,7 +344,6 @@ export default function OnboardingSetup({ onClick={handleSubmit(onSubmit)} px="24px" h="64px" - rightIcon={} > {t("continue")} + )} {activeStep == 3 && ( )} From d58ce6e6c4f8ea90148c682a9ad44e3ad85777bc Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 23 Jan 2025 18:13:20 +0100 Subject: [PATCH 063/190] fix(ui): add missing Toaster and remove unused imports on onboarding setup page --- app/src/app/[lng]/onboarding/setup/page.tsx | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/app/src/app/[lng]/onboarding/setup/page.tsx b/app/src/app/[lng]/onboarding/setup/page.tsx index b827a3a4b..1193b156f 100644 --- a/app/src/app/[lng]/onboarding/setup/page.tsx +++ b/app/src/app/[lng]/onboarding/setup/page.tsx @@ -25,15 +25,6 @@ import ConfirmStep from "@/components/steps/confirm-city-data-step"; import ProgressSteps from "@/components/steps/progress-steps"; import { Toaster, toaster } from "@/components/ui/toaster"; import { Button } from "@/components/ui/button"; -import { - StepsCompletedContent, - StepsContent, - StepsItem, - StepsList, - StepsNextTrigger, - StepsPrevTrigger, - StepsRoot, -} from "@/components/ui/steps"; export type Inputs = { city: string; @@ -370,6 +361,7 @@ export default function OnboardingSetup({
+
); From 423b85c6b6c7f98efa8a652b185b28b9f5e660a1 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 23 Jan 2025 18:13:39 +0100 Subject: [PATCH 064/190] feat(ui): add select snippet from Chakra CLI --- app/src/components/ui/select.tsx | 143 +++++++++++++++++++++++++++++++ 1 file changed, 143 insertions(+) create mode 100644 app/src/components/ui/select.tsx diff --git a/app/src/components/ui/select.tsx b/app/src/components/ui/select.tsx new file mode 100644 index 000000000..99d84e6c5 --- /dev/null +++ b/app/src/components/ui/select.tsx @@ -0,0 +1,143 @@ +"use client" + +import type { CollectionItem } from "@chakra-ui/react" +import { Select as ChakraSelect, Portal } from "@chakra-ui/react" +import { CloseButton } from "./close-button" +import * as React from "react" + +interface SelectTriggerProps extends ChakraSelect.ControlProps { + clearable?: boolean +} + +export const SelectTrigger = React.forwardRef< + HTMLButtonElement, + SelectTriggerProps +>(function SelectTrigger(props, ref) { + const { children, clearable, ...rest } = props + return ( + + {children} + + {clearable && } + + + + ) +}) + +const SelectClearTrigger = React.forwardRef< + HTMLButtonElement, + ChakraSelect.ClearTriggerProps +>(function SelectClearTrigger(props, ref) { + return ( + + + + ) +}) + +interface SelectContentProps extends ChakraSelect.ContentProps { + portalled?: boolean + portalRef?: React.RefObject +} + +export const SelectContent = React.forwardRef< + HTMLDivElement, + SelectContentProps +>(function SelectContent(props, ref) { + const { portalled = true, portalRef, ...rest } = props + return ( + + + + + + ) +}) + +export const SelectItem = React.forwardRef< + HTMLDivElement, + ChakraSelect.ItemProps +>(function SelectItem(props, ref) { + const { item, children, ...rest } = props + return ( + + {children} + + + ) +}) + +interface SelectValueTextProps + extends Omit { + children?(items: CollectionItem[]): React.ReactNode +} + +export const SelectValueText = React.forwardRef< + HTMLSpanElement, + SelectValueTextProps +>(function SelectValueText(props, ref) { + const { children, ...rest } = props + return ( + + + {(select) => { + const items = select.selectedItems + if (items.length === 0) return props.placeholder + if (children) return children(items) + if (items.length === 1) + return select.collection.stringifyItem(items[0]) + return `${items.length} selected` + }} + + + ) +}) + +export const SelectRoot = React.forwardRef< + HTMLDivElement, + ChakraSelect.RootProps +>(function SelectRoot(props, ref) { + return ( + + {props.asChild ? ( + props.children + ) : ( + <> + + {props.children} + + )} + + ) +}) as ChakraSelect.RootComponent + +interface SelectItemGroupProps extends ChakraSelect.ItemGroupProps { + label: React.ReactNode +} + +export const SelectItemGroup = React.forwardRef< + HTMLDivElement, + SelectItemGroupProps +>(function SelectItemGroup(props, ref) { + const { children, label, ...rest } = props + return ( + + {label} + {children} + + ) +}) + +export const SelectLabel = ChakraSelect.Label +export const SelectItemText = ChakraSelect.ItemText From 263ba8c7f4f6197ab160ab9c90e47868a2991e99 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 23 Jan 2025 18:14:08 +0100 Subject: [PATCH 065/190] fix(ui): update AddInventoryDetailsStep component to Chakra UI v3 --- .../steps/add-inventory-details-step.tsx | 107 +++++++++++------- 1 file changed, 63 insertions(+), 44 deletions(-) diff --git a/app/src/components/steps/add-inventory-details-step.tsx b/app/src/components/steps/add-inventory-details-step.tsx index 14b36baa4..2d5f865d5 100644 --- a/app/src/components/steps/add-inventory-details-step.tsx +++ b/app/src/components/steps/add-inventory-details-step.tsx @@ -9,21 +9,28 @@ import { Inputs } from "../../app/[lng]/onboarding/setup/page"; import { useEffect } from "react"; import { Box, - FormControl, - FormErrorMessage, + createListCollection, + Field, Heading, HStack, - InputGroup, - InputRightElement, + Icon, Link, - Select, Text, useRadioGroup, UseRadioGroupProps, } from "@chakra-ui/react"; -import { CheckIcon, WarningIcon } from "@chakra-ui/icons"; +import { MdCheck, MdWarning } from "react-icons/md"; import { Trans } from "react-i18next"; import { CustomRadioButtons } from "@/components/custom-radio-buttons"; +import { InputGroup } from "@/components/ui/input-group"; +import { + SelectContent, + SelectItem, + SelectLabel, + SelectRoot, + SelectTrigger, + SelectValueText, +} from "@/components/ui/select"; export default function SetInventoryDetailsStep({ t, @@ -52,7 +59,7 @@ export default function SetInventoryDetailsStep({ }, []); const { getRootProps: inventoryGoalRootProps, - getRadioProps: getInventoryGoalRadioProps, + getItemProps: getInventoryGoalRadioProps, } = useRadioGroup({ name: "inventoryGoal", defaultValue: "gpc_basic", @@ -63,7 +70,7 @@ export default function SetInventoryDetailsStep({ // Handle global warming potential Radio Input // Set default global warming potential form value - const { getRootProps: GWPRootProps, getRadioProps: getGWPRadioProps } = + const { getRootProps: GWPRootProps, getItemProps: getGWPRadioProps } = useRadioGroup({ name: "globalWarmingPotential", defaultValue: "ar6", @@ -74,6 +81,7 @@ export default function SetInventoryDetailsStep({ const inventoryGoalGroup = inventoryGoalRootProps(); const gwpGroup = GWPRootProps(); + const yearsCollection = createListCollection({ items: years }); return ( @@ -125,10 +133,36 @@ export default function SetInventoryDetailsStep({ - - - - - {!!year && ( - + + - )} - + + + {years.map((year: number, i: number) => ( + + {year} + + ))} + + - - - - {errors.year && errors.year.message} - - - + @@ -252,10 +274,10 @@ export default function SetInventoryDetailsStep({ alignItems="center" py="16px" > - - {/* TODO: - only enable ar6 and disable ar5 until we have the feature - */} Date: Fri, 24 Jan 2025 10:10:28 +0100 Subject: [PATCH 066/190] fix(ui): build errors in AddPopulationDataStep component --- .../steps/add-population-data-step.tsx | 206 ++++++++++-------- 1 file changed, 116 insertions(+), 90 deletions(-) diff --git a/app/src/components/steps/add-population-data-step.tsx b/app/src/components/steps/add-population-data-step.tsx index 385a17959..a48aa0a8f 100644 --- a/app/src/components/steps/add-population-data-step.tsx +++ b/app/src/components/steps/add-population-data-step.tsx @@ -11,19 +11,27 @@ import { useEffect, useState } from "react"; import { findClosestYear } from "@/util/helpers"; import { Box, - FormControl, - FormErrorIcon, - FormErrorMessage, + createListCollection, + Group, Heading, HStack, - InputGroup, - InputRightElement, + Icon, + InputAddon, Select, Text, } from "@chakra-ui/react"; import FormattedThousandsNumberInput from "@/app/[lng]/onboarding/setup/FormattedThousandsNumberInput"; -import { InfoOutlineIcon } from "@chakra-ui/icons"; +import { MdErrorOutline, MdInfoOutline } from "react-icons/md"; import Checkmark from "./chekmark"; +import { Field } from "@/components/ui/field"; +import { + SelectContent, + SelectItem, + SelectLabel, + SelectRoot, + SelectTrigger, + SelectValueText, +} from "@/components/ui/select"; export default function SetPopulationDataStep({ t, @@ -140,6 +148,8 @@ export default function SetPopulationDataStep({ const countryPopulation = watch("countryPopulation"); const countryPopulationYear = watch("countryPopulationYear"); + const yearsCollection = createListCollection({ items: years }); + return ( - - + + + + {errors.countryPopulation?.message} + + } + > name="countryPopulation" control={control} @@ -209,7 +227,7 @@ export default function SetPopulationDataStep({ letterSpacing="wide" /> - + - {errors.countryPopulation && ( - - - {errors.countryPopulation.message} - - )} - + - - - - + + + + + + {years.map((year: number, i: number) => ( + + {year} + + ))} + + + - - - + + + @@ -293,8 +305,16 @@ export default function SetPopulationDataStep({ - - + + + + {errors.regionPopulation?.message} + + } + > name="regionPopulation" control={control} @@ -314,21 +334,12 @@ export default function SetPopulationDataStep({ fontSize="body.lg" letterSpacing="wide" /> - {errors.regionPopulation && ( - - - {errors.regionPopulation.message} - - )} - + - - - - + + + + + + {years.map((year: number, i: number) => ( + + {year} + + ))} + + + - - - + + + @@ -383,8 +402,16 @@ export default function SetPopulationDataStep({ - - + + + + {errors.cityPopulation?.message} + + } + > name="cityPopulation" control={control} @@ -404,21 +431,12 @@ export default function SetPopulationDataStep({ fontSize="body.lg" letterSpacing="wide" /> - {errors.cityPopulation && ( - - - {errors.cityPopulation.message} - - )} - + - - - - + + + + + + {years.map((year: number, i: number) => ( + + {year} + + ))} + + + - - - + + + From 72713c3d0f8c3c64c29f10fde9db11634bbde388 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Fri, 24 Jan 2025 10:11:45 +0100 Subject: [PATCH 067/190] fix(ui): add missing dependencies to useEffect calls on AddPopulationDataStep --- app/src/components/steps/add-population-data-step.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/app/src/components/steps/add-population-data-step.tsx b/app/src/components/steps/add-population-data-step.tsx index a48aa0a8f..e6bb491ba 100644 --- a/app/src/components/steps/add-population-data-step.tsx +++ b/app/src/components/steps/add-population-data-step.tsx @@ -17,7 +17,6 @@ import { HStack, Icon, InputAddon, - Select, Text, } from "@chakra-ui/react"; import FormattedThousandsNumberInput from "@/app/[lng]/onboarding/setup/FormattedThousandsNumberInput"; @@ -89,7 +88,7 @@ export default function SetPopulationDataStep({ setValue("cityPopulationYear", population.year); } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [cityData, year, setValue]); + }, [cityData, year, numberOfYearsDisplayed, setValue]); useEffect(() => { if (regionData && year) { @@ -105,7 +104,7 @@ export default function SetPopulationDataStep({ setValue("regionPopulation", population.population); setValue("regionPopulationYear", population.year); } - }, [regionData, year, setValue]); + }, [regionData, year, numberOfYearsDisplayed, setValue]); useEffect(() => { if (countryData && year) { @@ -137,7 +136,7 @@ export default function SetPopulationDataStep({ setValue("totalCountryEmissions", emissions); } } - }, [countryData, year, setValue]); + }, [countryData, year, numberOfYearsDisplayed, setValue]); const cityPopulation = watch("cityPopulation"); const cityPopulationYear = watch("cityPopulationYear"); From ee9d87e0dcc4ee99f087146fb8e36e4e8b426d3f Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Fri, 24 Jan 2025 10:15:24 +0100 Subject: [PATCH 068/190] fix(ui): issues with Checkmark component by inlining the icon and replacing it with react-icons --- .../steps/add-population-data-step.tsx | 21 +++++++++---------- app/src/components/steps/chekmark.tsx | 12 ----------- 2 files changed, 10 insertions(+), 23 deletions(-) delete mode 100644 app/src/components/steps/chekmark.tsx diff --git a/app/src/components/steps/add-population-data-step.tsx b/app/src/components/steps/add-population-data-step.tsx index e6bb491ba..fa8fbe323 100644 --- a/app/src/components/steps/add-population-data-step.tsx +++ b/app/src/components/steps/add-population-data-step.tsx @@ -20,8 +20,7 @@ import { Text, } from "@chakra-ui/react"; import FormattedThousandsNumberInput from "@/app/[lng]/onboarding/setup/FormattedThousandsNumberInput"; -import { MdErrorOutline, MdInfoOutline } from "react-icons/md"; -import Checkmark from "./chekmark"; +import { MdCheck, MdErrorOutline, MdInfoOutline } from "react-icons/md"; import { Field } from "@/components/ui/field"; import { SelectContent, @@ -271,9 +270,9 @@ export default function SetPopulationDataStep({ - + {!!countryPopulationYear && !!countryPopulation && ( + + )} @@ -368,9 +367,9 @@ export default function SetPopulationDataStep({ - + {!!regionPopulationYear && !!regionPopulation && ( + + )} @@ -465,9 +464,9 @@ export default function SetPopulationDataStep({ - + {!!cityPopulationYear && !!cityPopulation && ( + + )} diff --git a/app/src/components/steps/chekmark.tsx b/app/src/components/steps/chekmark.tsx deleted file mode 100644 index 58c9e4e92..000000000 --- a/app/src/components/steps/chekmark.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import { CheckIcon } from "@chakra-ui/icons"; -import React, { FC } from "react"; - -interface CheckmarkProps { - condition: boolean; -} - -const Checkmark: FC = ({ condition }) => { - return condition ? : null; -}; - -export default Checkmark; From a191a897347516e2f295a73daacaff873dffc096 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Fri, 24 Jan 2025 10:52:36 +0100 Subject: [PATCH 069/190] fix(ui): build errors on SelectCitySteps, add custom useOutsideClick hook --- .../components/steps/select-city-steps.tsx | 415 +++++++++--------- app/src/lib/use-outside-click.ts | 23 + 2 files changed, 233 insertions(+), 205 deletions(-) create mode 100644 app/src/lib/use-outside-click.ts diff --git a/app/src/components/steps/select-city-steps.tsx b/app/src/components/steps/select-city-steps.tsx index 19e338329..2e3e0c0f8 100644 --- a/app/src/components/steps/select-city-steps.tsx +++ b/app/src/components/steps/select-city-steps.tsx @@ -7,7 +7,7 @@ import { import { TFunction } from "i18next"; import { OCCityAttributes } from "@/util/types"; import { useAppDispatch } from "@/lib/hooks"; -import { useEffect, useRef, useState } from "react"; +import { useEffect, useState } from "react"; import { set } from "@/features/city/openclimateCitySlice"; import { useGetCityQuery, @@ -18,32 +18,25 @@ import { findClosestYear } from "@/util/helpers"; import { Box, Card, - FormControl, - FormErrorMessage, - FormLabel, + Group, Heading, Icon, Input, - InputGroup, - InputLeftElement, - InputRightElement, + InputAddon, Link, Text, - useOutsideClick, } from "@chakra-ui/react"; -import { - CheckIcon, - InfoOutlineIcon, - SearchIcon, - WarningIcon, -} from "@chakra-ui/icons"; -import RecentSearches from "@/components/recent-searches"; +import { MdCheck, MdInfoOutline, MdSearch, MdWarning } from "react-icons/md"; import Image from "next/image"; import dynamic from "next/dynamic"; import { NoResultsIcon } from "../icons"; import { useSearchParams } from "next/navigation"; import { Trans } from "react-i18next"; +import RecentSearches from "@/components/recent-searches"; +import { useOutsideClick } from "@/lib/use-outside-click"; +import { Field } from "@/components/ui/field"; + const CityMap = dynamic(() => import("@/components/CityMap"), { ssr: false }); export default function SelectCityStep({ @@ -152,7 +145,7 @@ export default function SelectCityStep({ area: 0, }); } - }, [CCCityData]); + }, [CCCityData, setValue, setOcCityData]); // react to API data changes and different year selections useEffect(() => { @@ -246,11 +239,10 @@ export default function SelectCityStep({ // using useOutsideClick instead of onBlur input attribute // to fix clicking city dropdown entries not working - const cityInputRef = useRef(null); - useOutsideClick({ - ref: cityInputRef, - handler: () => setTimeout(() => setOnInputClicked(false), 0), - }); + // const cityInputRef = useRef(null); + const cityInputRef = useOutsideClick(() => + setTimeout(() => setOnInputClicked(false), 0), + ); return ( @@ -277,215 +269,228 @@ export default function SelectCityStep({ - - - - - {t("city")} - - + + + + + + {errors.city && errors.city.message} + + + } + label={t("city")} + data-testId="setup-city-input-label" > - - - - setOnInputClicked(true)} - onFocus={() => setOnInputClicked(true)} - /> - - {isCityNew && ( - + + - )} - - - {onInputClicked && ( - - {!isLoading && !cityInputQuery && } - {isLoading &&

Fetching Cities...

} - {isSuccess && - cities && - cities.map((city: OCCityAttributes) => { - return ( - handleSetCity(city)} - key={city.actor_id} - className="h-[72px] py-3 w-full flex flex-col justify-center group px-4 hover:bg-[#2351DC] transition-all duration-150 cursor-pointer" - > + + setOnInputClicked(true)} + onFocus={() => setOnInputClicked(true)} + /> + + {isCityNew && ( + + )} + + + {onInputClicked && ( + + {!isLoading && !cityInputQuery && } + {isLoading &&

Fetching Cities...

} + {isSuccess && + cities && + cities.map((city: OCCityAttributes) => { + return ( + handleSetCity(city)} + key={city.actor_id} + className="h-[72px] py-3 w-full flex flex-col justify-center group px-4 hover:bg-[#2351DC] transition-all duration-150 cursor-pointer" + > + + {city.name} + + + {renderParentPath(city.root_path_geo)} + + + ); + })} + {isSuccess && cities.length == 0 && ( + + + + + - {city.name} + {t("no-results")} - {renderParentPath(city.root_path_geo)} + {t("no-results-details")} - ); - })} - {isSuccess && cities.length == 0 && ( - - - - - - {t("no-results")} - - + )} + + {ocCityData ? ( + + + + + + + - {t("no-results-details")} - - - - )} + Contact Us + + + + - )} - - - - {errors.city && errors.city.message} - - - - {ocCityData ? ( - - - - - - - - Contact Us - - - - - - ) : ( - - city-image - - - {t("unselected-city-boundary-heading")} - - - {t("unselected-city-boundary-description")} - + city-image + + + {t("unselected-city-boundary-heading")} + + + {t("unselected-city-boundary-description")} + + - - )} - - + )} + + + ); diff --git a/app/src/lib/use-outside-click.ts b/app/src/lib/use-outside-click.ts new file mode 100644 index 000000000..9fa5c8bed --- /dev/null +++ b/app/src/lib/use-outside-click.ts @@ -0,0 +1,23 @@ +import { useEffect, useRef } from "react"; + +export const useOutsideClick = (callback: () => void) => { + const ref = useRef(null); + + useEffect(() => { + const handleClickOutside = (event: MouseEvent | TouchEvent) => { + if (ref.current && !ref.current.contains(event.target as Node)) { + callback(); + } + }; + + document.addEventListener("mouseup", handleClickOutside); + document.addEventListener("touchend", handleClickOutside); + + return () => { + document.removeEventListener("mouseup", handleClickOutside); + document.removeEventListener("touchend", handleClickOutside); + }; + }, [callback]); + + return ref; +}; From 61d3dbb13ca5e2ed031ea7b89a7ada3263598d9e Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Fri, 24 Jan 2025 10:53:31 +0100 Subject: [PATCH 070/190] feat(ui): create CustomRadio component with previous styling but using new Radio component recipe --- app/src/components/custom-radio-buttons.tsx | 49 ----------------- app/src/components/ui/custom-radio.tsx | 58 +++++++++++++++++++++ 2 files changed, 58 insertions(+), 49 deletions(-) delete mode 100644 app/src/components/custom-radio-buttons.tsx create mode 100644 app/src/components/ui/custom-radio.tsx diff --git a/app/src/components/custom-radio-buttons.tsx b/app/src/components/custom-radio-buttons.tsx deleted file mode 100644 index e21e2c9b5..000000000 --- a/app/src/components/custom-radio-buttons.tsx +++ /dev/null @@ -1,49 +0,0 @@ -import { Box, Icon, useRadio, UseRadioProps } from "@chakra-ui/react"; -import { InventoryButtonCheckIcon } from "./icons"; - -interface CustomRadioProps extends UseRadioProps { - children: React.ReactNode; -} - -export function CustomRadioButtons(props: CustomRadioProps) { - const { getInputProps, getRadioProps } = useRadio(props); - - return ( - - - - {props.isChecked ? : ""} - {props.children} - - - ); -} diff --git a/app/src/components/ui/custom-radio.tsx b/app/src/components/ui/custom-radio.tsx new file mode 100644 index 000000000..1d09e49d1 --- /dev/null +++ b/app/src/components/ui/custom-radio.tsx @@ -0,0 +1,58 @@ +import { RadioGroup as ChakraRadioGroup } from "@chakra-ui/react"; +import * as React from "react"; + +import { Box, Icon } from "@chakra-ui/react"; +import { InventoryButtonCheckIcon } from "../icons"; + +export interface RadioProps extends ChakraRadioGroup.ItemProps { + rootRef?: React.Ref; + inputProps?: React.InputHTMLAttributes; +} + +export const RadioGroup = ChakraRadioGroup.Root; + +export const CustomRadio = React.forwardRef( + function Radio(props, ref) { + const { children, inputProps, rootRef, ...rest } = props; + return ( + + + + + {props.value ? : ""} + {children && ( + {children} + )} + + + ); + }, +); From 2dc5a7aa2622029ef76164909f70cef198219f2d Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Fri, 24 Jan 2025 10:53:45 +0100 Subject: [PATCH 071/190] fix(ui): most build errors on AddInventoryDetailsStep --- .../steps/add-inventory-details-step.tsx | 93 ++++++++++--------- 1 file changed, 48 insertions(+), 45 deletions(-) diff --git a/app/src/components/steps/add-inventory-details-step.tsx b/app/src/components/steps/add-inventory-details-step.tsx index 2d5f865d5..18765fa2b 100644 --- a/app/src/components/steps/add-inventory-details-step.tsx +++ b/app/src/components/steps/add-inventory-details-step.tsx @@ -10,7 +10,6 @@ import { useEffect } from "react"; import { Box, createListCollection, - Field, Heading, HStack, Icon, @@ -21,7 +20,7 @@ import { } from "@chakra-ui/react"; import { MdCheck, MdWarning } from "react-icons/md"; import { Trans } from "react-i18next"; -import { CustomRadioButtons } from "@/components/custom-radio-buttons"; +import { CustomRadio, RadioGroup } from "@/components/ui/custom-radio"; import { InputGroup } from "@/components/ui/input-group"; import { SelectContent, @@ -31,6 +30,7 @@ import { SelectTrigger, SelectValueText, } from "@/components/ui/select"; +import { Field } from "@/components/ui/field"; export default function SetInventoryDetailsStep({ t, @@ -134,8 +134,8 @@ export default function SetInventoryDetailsStep({ + + + {errors.inventoryGoal && errors.inventoryGoal.message} + + + } render={({ field }) => ( <> - - {inventoryGoalOptions.map((value) => { - const radioProps = getInventoryGoalRadioProps({ value }); - return ( - - {t(value)} - - ); - })} - + (field.value = e.value)} + > + + {inventoryGoalOptions.map((value) => { + const radioProps = getInventoryGoalRadioProps({ + value, + }); + return ( + + {t(value)} + + ); + })} + + )} /> - - - - {errors.inventoryGoal && errors.inventoryGoal.message} - - @@ -348,14 +356,9 @@ export default function SetInventoryDetailsStep({ {globalWarmingPotential.map((value) => { const radioProps = getGWPRadioProps({ value }); return ( - + {t(value)} - + ); })} From c9426d7d4a9d9423a2f0c3b9a3f3382a0045a02e Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Fri, 24 Jan 2025 10:55:16 +0100 Subject: [PATCH 072/190] fix(ui): error text build error on AddInventoryDetailsStep --- .../steps/add-inventory-details-step.tsx | 35 ++++++++----------- 1 file changed, 14 insertions(+), 21 deletions(-) diff --git a/app/src/components/steps/add-inventory-details-step.tsx b/app/src/components/steps/add-inventory-details-step.tsx index 18765fa2b..a6c240323 100644 --- a/app/src/components/steps/add-inventory-details-step.tsx +++ b/app/src/components/steps/add-inventory-details-step.tsx @@ -248,27 +248,6 @@ export default function SetInventoryDetailsStep({ rules={{ required: t("inventory-goal-required"), }} - errorText={ - - - - {errors.inventoryGoal && errors.inventoryGoal.message} - - - } render={({ field }) => ( <> )} /> + + + + {errors.inventoryGoal && errors.inventoryGoal.message} + + From 268b655eba2280db709074f7d3d41d12a3337f71 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Fri, 24 Jan 2025 15:14:26 +0200 Subject: [PATCH 073/190] updates data inventory/data page and components --- app/src/app/[lng]/[inventory]/data/page.tsx | 20 ++++++++++++++------ app/src/components/Cards/add-data-card.tsx | 13 ++++++------- 2 files changed, 20 insertions(+), 13 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/data/page.tsx b/app/src/app/[lng]/[inventory]/data/page.tsx index b2832714d..0179be37b 100644 --- a/app/src/app/[lng]/[inventory]/data/page.tsx +++ b/app/src/app/[lng]/[inventory]/data/page.tsx @@ -1,13 +1,21 @@ "use client"; import { useTranslation } from "@/i18n/client"; -import { ArrowBackIcon } from "@chakra-ui/icons"; -import { Link } from "@chakra-ui/next-js"; -import { Box, Card, Grid, GridItem, Heading, Text } from "@chakra-ui/react"; +import { + Box, + Card, + Grid, + GridItem, + Heading, + Icon, + Link, + Text, +} from "@chakra-ui/react"; import { Trans } from "react-i18next/TransWithoutContext"; import AddDataCard from "@/components/Cards/add-data-card"; import { getSectorsForInventory, InventoryTypeEnum } from "@/util/constants"; import { api } from "@/services/api"; +import { MdArrowBack } from "react-icons/md"; export default function AddDataIntro({ params: { lng, inventory }, @@ -22,7 +30,7 @@ export default function AddDataIntro({ - + - + - + ); } diff --git a/app/src/components/Cards/add-data-card.tsx b/app/src/components/Cards/add-data-card.tsx index 65316d595..ebe1e377f 100644 --- a/app/src/components/Cards/add-data-card.tsx +++ b/app/src/components/Cards/add-data-card.tsx @@ -2,9 +2,9 @@ import { Box, Button, Card, - Divider, Heading, Icon, + Separator, Text, VStack, } from "@chakra-ui/react"; @@ -36,7 +36,7 @@ function AddDataCard({ }: AddDataCardProps) { const router = useRouter(); return ( - {title} - + {description} @@ -69,17 +68,17 @@ function AddDataCard({ data-testid="sector-card-button" width="100%" onClick={() => router.push(`/${inventory}/data/${number}`)} - leftIcon={} variant="ghost" h="48px" bg="interactive.secondary" color="base.light" mt="auto" > + {buttonText} - + ); } From e7d28065e17cd3df10d86b9d632532ad714591ce Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 27 Jan 2025 12:32:48 +0200 Subject: [PATCH 074/190] fix add data component styling --- app/src/app/[lng]/[inventory]/data/page.tsx | 12 +++++++++--- app/src/components/Cards/add-data-card.tsx | 6 +++--- 2 files changed, 12 insertions(+), 6 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/data/page.tsx b/app/src/app/[lng]/[inventory]/data/page.tsx index 0179be37b..27606f6f0 100644 --- a/app/src/app/[lng]/[inventory]/data/page.tsx +++ b/app/src/app/[lng]/[inventory]/data/page.tsx @@ -27,12 +27,16 @@ export default function AddDataIntro({ const { data: inventoryData } = api.useGetInventoryQuery(inventory); return ( - + - + Learn more diff --git a/app/src/components/Cards/add-data-card.tsx b/app/src/components/Cards/add-data-card.tsx index ebe1e377f..e93f6ea78 100644 --- a/app/src/components/Cards/add-data-card.tsx +++ b/app/src/components/Cards/add-data-card.tsx @@ -45,9 +45,9 @@ function AddDataCard({ borderWidth={1} height="100%" > - + - + {title} @@ -74,7 +74,7 @@ function AddDataCard({ color="base.light" mt="auto" > - + {buttonText} From 64625dbc38e36a56df8288783da3bbbadead3697 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 27 Jan 2025 13:02:21 +0200 Subject: [PATCH 075/190] updates secrot page components, adds breadcrumbs component --- .../[lng]/[inventory]/data/[step]/page.tsx | 242 +++++++++--------- app/src/components/ui/breadcrumb.tsx | 40 +++ 2 files changed, 166 insertions(+), 116 deletions(-) create mode 100644 app/src/components/ui/breadcrumb.tsx diff --git a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx index ceecf64e3..4aaab0dbd 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx @@ -24,21 +24,11 @@ import { nameToI18NKey, } from "@/util/helpers"; import type { DataSourceResponse, SectorProgress } from "@/util/types"; -import { - ArrowBackIcon, - ChevronRightIcon, - SearchIcon, - WarningIcon, -} from "@chakra-ui/icons"; + import { Box, - Breadcrumb, - BreadcrumbItem, - BreadcrumbLink, - Button, Card, Center, - CircularProgress, Flex, Heading, HStack, @@ -48,13 +38,10 @@ import { SimpleGrid, Spinner, Stack, - Tag, TagLabel, - TagLeftIcon, Text, useDisclosure, useSteps, - useToast, } from "@chakra-ui/react"; import { TFunction } from "i18next"; import { useRouter } from "next/navigation"; @@ -63,13 +50,17 @@ import { Trans } from "react-i18next/TransWithoutContext"; import { FiTarget, FiTrash2 } from "react-icons/fi"; import { MdAdd, + MdArrowBack, MdArrowDropDown, MdArrowDropUp, MdCheckCircle, + MdChevronRight, MdHomeWork, MdOutlineCheckCircle, MdOutlineEdit, MdRefresh, + MdSearch, + MdWarning, } from "react-icons/md"; import { useDispatch, useSelector } from "react-redux"; import { SourceDrawer } from "./SourceDrawer"; @@ -84,6 +75,18 @@ import { InventoryValueAttributes } from "@/models/InventoryValue"; import { motion } from "framer-motion"; import { getTranslationFromDict } from "@/i18n"; import { getScopesForInventoryAndSector, SECTORS } from "@/util/constants"; +import { Button } from "@/components/ui/button"; +import { toaster } from "@/components/ui/toaster"; +import { + BreadcrumbCurrentLink, + BreadcrumbLink, + BreadcrumbRoot, +} from "@/components/ui/breadcrumb"; +import { Tag } from "@/components/ui/tag"; +import { + ProgressCircleRing, + ProgressCircleRoot, +} from "@/components/ui/progress-circle"; function getMailURI(locode?: string, sector?: string, year?: number): string { const emails = @@ -122,9 +125,8 @@ function SearchDataSourcesPrompt({ /> - + {t("wait-for-search")} @@ -171,7 +174,7 @@ function NoDataSourcesMessage({ > {t("no-data-sources")} - + I
I @@ -191,7 +194,7 @@ export default function AddDataSteps({ }) { const { t } = useTranslation(lng, "data"); const router = useRouter(); - const toast = useToast(); + // const toast = useToast(); const { data: userInfo, isLoading: isUserInfoLoading } = api.useGetUserInfoQuery(); @@ -305,7 +308,7 @@ export default function AddDataSteps({ useState(); const [selectedSourceData, setSelectedSourceData] = useState(); const { - isOpen: isSourceDrawerOpen, + open: isSourceDrawerOpen, onClose: onSourceDrawerClose, onOpen: onSourceDrawerOpen, } = useDisclosure(); @@ -316,10 +319,10 @@ export default function AddDataSteps({ }; const showError = (title: string, description: string) => { - toast({ + toaster.create({ title, description, - status: "error", + type: "error", isClosable: true, }); }; @@ -366,7 +369,7 @@ export default function AddDataSteps({ } } catch (error: any) { console.error("Failed to connect data source", source, error); - toast({ + toaster.create({ title: t("data-source-connect-failed"), description: error.data?.error?.message, status: "error", @@ -405,7 +408,7 @@ export default function AddDataSteps({ const [selectedSubsector, setSelectedSubsector] = useState(); const { - isOpen: isSubsectorDrawerOpen, + open: isSubsectorDrawerOpen, onClose: onSubsectorDrawerClose, onOpen: onSubsectorDrawerOpen, } = useDisclosure(); @@ -450,7 +453,7 @@ export default function AddDataSteps({ // Add file data to rudux state object const { - isOpen: isfileDataModalOpen, + open: isfileDataModalOpen, onOpen: onFileDataModalOpen, onClose: onfileDataModalClose, } = useDisclosure(); @@ -474,14 +477,14 @@ export default function AddDataSteps({ ) { deleteUserFile({ fileId, cityId }).then((res: any) => { if (res.error) { - toast({ + toaster.create({ title: t("file-deletion-error"), description: t("file-deletion-error-description"), status: "error", duration: 2000, }); } else { - toast({ + toaster.create({ title: t("file-deletion-success"), description: t("file-deletion-success"), status: "success", @@ -621,41 +624,39 @@ export default function AddDataSteps({ - } + separator={ + + } > - - - {t("all-sectors")} - - + + {t("all-sectors")} + - - - {t(kebab(currentStep.name))} - - - + + {t(kebab(currentStep.name))} + + {/*** Sector summary section ***/} - {scrollPosition <= 0 ? ( <> - - - - {t("data-connected-percent", { - progress: formatPercentage( - currentStep.connectedProgress, - ), - })} - + + } + > + {t("data-connected-percent", { + progress: formatPercentage( + currentStep.connectedProgress, + ), + })} - - - - {t("data-added-percent", { - progress: formatPercentage(currentStep.addedProgress), - })} - + + } + > + {t("data-added-percent", { + progress: formatPercentage(currentStep.addedProgress), + })} ) : ( @@ -761,12 +765,12 @@ export default function AddDataSteps({ )}
- +
{/*** Manual data entry section for subsectors ***/} - + {t("add-data-heading")} @@ -776,19 +780,19 @@ export default function AddDataSteps({ {t("select-subsector")} - + {isInventoryLoading || !currentStep.subSectors ? (
) : inventoryProgressError ? (
- +
) : ( currentStep.subSectors.map( (subSector: SubSectorWithRelations) => ( - {subSector.completedCount > 0 && subSector.completedCount < subSector.totalCount ? ( - + > + + ) : ( @@ -850,7 +854,11 @@ export default function AddDataSteps({ )} - + ), ) )} - + {/*** Third party data source section ***/} - + {t("check-data-heading")} - - {t("check-data-details")} - + {t("check-data-details")} {dataSources && ( ) : dataSourcesError ? (
- +
) : dataSources && dataSources?.length === 0 ? ( ) : ( - + {dataSources .slice(0, isDataSectionExpanded ? dataSources.length : 6) .map(({ source, data }) => { @@ -924,7 +930,7 @@ export default function AddDataSteps({ ); return ( - {/* TODO add icon to DataSource */} - + {getTranslationFromDict(source.datasetName)} - - + + } + > {t("data-quality")}:{" "} {t("quality-" + source.dataQuality)} {source.subCategory?.scope && ( - - + + } + > {t("scope")}: {source.subCategory.scope.scopeName} @@ -968,7 +980,7 @@ export default function AddDataSteps({ {getTranslationFromDict(source.datasetDescription) || @@ -1004,7 +1016,7 @@ export default function AddDataSteps({ variant="outline" bgColor="background.neutral" onClick={() => onConnectClick(source)} - isLoading={ + loading={ isConnectDataSourceLoading && source.datasourceId === connectingDataSourceId } @@ -1012,7 +1024,7 @@ export default function AddDataSteps({ {t("connect-data")} )} - + ); })} @@ -1024,19 +1036,17 @@ export default function AddDataSteps({ onClick={() => setDataSectionExpanded(!isDataSectionExpanded)} mt={8} fontWeight="normal" - rightIcon={ - - } > {t(isDataSectionExpanded ? "less-datasets" : "more-datasets")} + )} - + {/* Upload own data section */} - + {t("upload-your-data-heading")} @@ -1149,7 +1159,7 @@ export default function AddDataSteps({ - + {/* Add fole data modal */} (function BreadcrumbRoot(props, ref) { + const { separator, separatorGap, children, ...rest } = props + + const validChildren = React.Children.toArray(children).filter( + React.isValidElement, + ) + + return ( + + + {validChildren.map((child, index) => { + const last = index === validChildren.length - 1 + return ( + + {child} + {!last && ( + {separator} + )} + + ) + })} + + + ) +}) + +export const BreadcrumbLink = Breadcrumb.Link +export const BreadcrumbCurrentLink = Breadcrumb.CurrentLink +export const BreadcrumbEllipsis = Breadcrumb.Ellipsis From a7a4e0bcdaa0da18649ab987e885947a050e5038 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 27 Jan 2025 13:28:04 +0200 Subject: [PATCH 076/190] fix: source drawer components --- .../[inventory]/data/[step]/SourceDrawer.tsx | 526 ++++++++++-------- app/src/components/ui/drawer.tsx | 40 +- 2 files changed, 299 insertions(+), 267 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx b/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx index 0cb6b38ad..ff77f5fab 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx @@ -1,28 +1,21 @@ import type { SectorAttributes } from "@/models/Sector"; -import { ArrowBackIcon, InfoOutlineIcon } from "@chakra-ui/icons"; import { - Button, chakra, - Drawer, - DrawerBody, - DrawerContent, - DrawerOverlay, Flex, Heading, HStack, Icon, Link, Stack, - Tag, TagLabel, - TagLeftIcon, Text, - Tooltip, } from "@chakra-ui/react"; import type { TFunction } from "i18next"; import { RefObject } from "react"; import { + MdArrowBack, MdHomeWork, + MdInfoOutline, MdOpenInNew, MdOutlineLocationOn, MdOutlineTimer, @@ -33,6 +26,18 @@ import { DataCheckIcon, ScaleIcon } from "@/components/icons"; import { FiTarget } from "react-icons/fi"; import { getTranslationFromDict } from "@/i18n"; import { convertKgToTonnes } from "@/util/helpers"; +import { + DrawerBackdrop, + DrawerBody, + DrawerContent, + DrawerHeader, + DrawerRoot, + DrawerTitle, + DrawerTrigger, +} from "@/components/ui/drawer"; +import { Tooltip } from "@/components/ui/tooltip"; +import { Tag } from "@/components/ui/tag"; +import { Button } from "@/components/ui/button"; export function SourceDrawer({ source, @@ -84,268 +89,295 @@ export function SourceDrawer({ }; }; return ( - - - - - - {source && ( - - - - {source.subcategoryId ? "Scope Data" : "Sub-sector Data"} - - - {sector?.sectorName} /{" "} - {source.subSector?.subsectorName || - source.subCategory?.subsector?.subsectorName} - - - - {getTranslationFromDict(source.datasetName)} - - - - {source.subCategory?.referenceNumber || - source.subSector?.referenceNumber}{" "} - {source.subCategory?.subcategoryName || - source.subSector?.subsectorName} - - - - {t("by")}{" "} - - {source.publisher?.name} - - - - - {t("total-emissions-included")}{" "} - + + + + + + Drawer Title + + + + {source && ( + + + - - - - - - - {emissionsToBeIncluded().number} + {source.subcategoryId ? "Scope Data" : "Sub-sector Data"} - - {emissionsToBeIncluded().unit} - - - - {sourceData?.issue && ( - - {t("error")}: {t(sourceData?.issue)} - - )} + {sector?.sectorName} /{" "} + {source.subSector?.subsectorName || + source.subCategory?.subsector?.subsectorName} + - - - - - {t("Location")}:{" "} - {source.geographicalLocation?.toLowerCase()} - - - {source.subCategory?.scope && ( - - - - {t("scope")}: {source.subCategory.scope.scopeName} - - - )} - - - - {t("scale")}: {t(source.spatialResolution || "unknown")} - - + + {getTranslationFromDict(source.datasetName)} + - - - - {t("data-quality")}: {t("quality-" + source.dataQuality)} - - - - - - {t("updated-every")}{" "} - {source.frequencyOfUpdate == "annual" - ? t("year") - : t(source.frequencyOfUpdate ?? "unknown")} - - - - - - {source.startYear} - {source.endYear} - - - + + {source.subCategory?.referenceNumber || + source.subSector?.referenceNumber}{" "} + {source.subCategory?.subcategoryName || + source.subSector?.subsectorName} + - - {t("inside-dataset")} - - {getTranslationFromDict(source.datasetDescription)} - - - - {t("methodology")} + {t("by")}{" "} - + {source.publisher?.name} - - - {getTranslationFromDict(source.methodologyDescription)} - - {t("transform-data-heading")} - + {t("total-emissions-included")}{" "} + - + - - {getTranslationFromDict(source.transformationDescription)} - - - - )} - {hideActions ? null : ( - - - - )} - + + + )} + + - + ); } diff --git a/app/src/components/ui/drawer.tsx b/app/src/components/ui/drawer.tsx index 447c57a0b..ccb96c80a 100644 --- a/app/src/components/ui/drawer.tsx +++ b/app/src/components/ui/drawer.tsx @@ -1,18 +1,18 @@ -import { Drawer as ChakraDrawer, Portal } from "@chakra-ui/react"; -import { CloseButton } from "./close-button"; -import * as React from "react"; +import { Drawer as ChakraDrawer, Portal } from "@chakra-ui/react" +import { CloseButton } from "./close-button" +import * as React from "react" interface DrawerContentProps extends ChakraDrawer.ContentProps { - portalled?: boolean; - portalRef?: React.RefObject; - offset?: ChakraDrawer.ContentProps["padding"]; + portalled?: boolean + portalRef?: React.RefObject + offset?: ChakraDrawer.ContentProps["padding"] } export const DrawerContent = React.forwardRef< HTMLDivElement, DrawerContentProps >(function DrawerContent(props, ref) { - const { children, portalled = true, portalRef, offset, ...rest } = props; + const { children, portalled = true, portalRef, offset, ...rest } = props return ( @@ -21,8 +21,8 @@ export const DrawerContent = React.forwardRef< - ); -}); + ) +}) export const DrawerCloseTrigger = React.forwardRef< HTMLButtonElement, @@ -38,15 +38,15 @@ export const DrawerCloseTrigger = React.forwardRef< > - ); -}); + ) +}) -export const DrawerTrigger = ChakraDrawer.Trigger; -export const DrawerRoot = ChakraDrawer.Root; -export const DrawerFooter = ChakraDrawer.Footer; -export const DrawerHeader = ChakraDrawer.Header; -export const DrawerBody = ChakraDrawer.Body; -export const DrawerBackdrop = ChakraDrawer.Backdrop; -export const DrawerDescription = ChakraDrawer.Description; -export const DrawerTitle = ChakraDrawer.Title; -export const DrawerActionTrigger = ChakraDrawer.ActionTrigger; +export const DrawerTrigger = ChakraDrawer.Trigger +export const DrawerRoot = ChakraDrawer.Root +export const DrawerFooter = ChakraDrawer.Footer +export const DrawerHeader = ChakraDrawer.Header +export const DrawerBody = ChakraDrawer.Body +export const DrawerBackdrop = ChakraDrawer.Backdrop +export const DrawerDescription = ChakraDrawer.Description +export const DrawerTitle = ChakraDrawer.Title +export const DrawerActionTrigger = ChakraDrawer.ActionTrigger From cb4a63cc71ac4846ee8dc02301c20fce9519b7d7 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Mon, 27 Jan 2025 15:29:39 +0200 Subject: [PATCH 077/190] updates sector page and file input modal --- .../[lng]/[inventory]/data/[step]/page.tsx | 9 +- .../components/Modals/add-file-data-modal.tsx | 97 +++++++++---------- app/src/components/file-input.tsx | 90 +++++++++-------- 3 files changed, 103 insertions(+), 93 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx index 4aaab0dbd..6c3ed3213 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx @@ -269,11 +269,14 @@ export default function AddDataSteps({ // eslint-disable-next-line react-hooks/exhaustive-deps }, [inventoryProgress]); - const { activeStep, goToNext, setActiveStep } = useSteps({ - index: Number(step) - 1, + const { value: activeStep, goToNextStep: goToNext } = useSteps({ + defaultStep: Number(step) - 1, count: steps.length, }); + const currentStep = steps[activeStep]; + console.log("currentStep", currentStep); + useEffect(() => { // change step param in URL without reloading const newPath = location.pathname.replace( @@ -650,7 +653,7 @@ export default function AddDataSteps({ - {t(kebab(currentStep.name))} + {t(kebab(currentStep.name || ""))} diff --git a/app/src/components/Modals/add-file-data-modal.tsx b/app/src/components/Modals/add-file-data-modal.tsx index e9b6e6417..1ba3e5b9f 100644 --- a/app/src/components/Modals/add-file-data-modal.tsx +++ b/app/src/components/Modals/add-file-data-modal.tsx @@ -1,23 +1,7 @@ import React, { FC, useEffect, useState } from "react"; -import { - Box, - Button, - Checkbox, - Divider, - FormControl, - FormLabel, - Modal, - ModalBody, - ModalCloseButton, - ModalContent, - ModalFooter, - ModalHeader, - ModalOverlay, - Text, - useToast, -} from "@chakra-ui/react"; +import { Box, Icon, Separator, Text } from "@chakra-ui/react"; import DropdownSelectInput from "../dropdown-select-input"; -import { InfoIcon, InfoOutlineIcon } from "@chakra-ui/icons"; + import { DataStep, SubSectorWithRelations, @@ -32,10 +16,26 @@ import { UserFileResponse, UserInfoResponse, } from "@/util/types"; -import { MdOutlineInsertDriveFile } from "react-icons/md"; +import { MdInfoOutline, MdOutlineInsertDriveFile } from "react-icons/md"; import { appendFileToFormData } from "@/util/helpers"; import { api, useAddUserFileMutation } from "@/services/api"; +import { + DialogBackdrop, + DialogBody, + DialogCloseTrigger, + DialogContent, + DialogFooter, + DialogHeader, + DialogRoot, + DialogTitle, + DialogTrigger, +} from "@/components/ui/dialog"; +import { toaster } from "../ui/toaster"; +import { Button } from "../ui/button"; +import { Field } from "../ui/field"; +import { Checkbox } from "../ui/checkbox"; + interface AddFileDataModalProps { isOpen: boolean; onClose: () => void; @@ -113,8 +113,6 @@ const AddFileDataModal: FC = ({ const cityId = inventoryData?.city.cityId!; - const toast = useToast(); - const onSubmit: SubmitHandler = async (data) => { const base64FileString = await fileToBase64(uploadedFile); const filename = uploadedFile.name; @@ -138,14 +136,14 @@ const AddFileDataModal: FC = ({ await addUserFile({ formData, cityId }).then((res: any) => { // show toast if (res.error) { - toast({ + toaster.create({ title: t("file-upload-error"), description: t("file-upload-error-description"), status: "error", duration: 2000, }); } else { - toast({ + toaster.create({ title: t("file-upload-success"), description: t("file-upload-success"), status: "success", @@ -180,10 +178,10 @@ const AddFileDataModal: FC = ({ }; return ( - - - - + + + = ({ borderColor="border.neutral" > {t("file-context")} - - - + + + = ({ > {t("file-data-description")} - +
- - - {t("select-subsector-label")} - - + + {" "} + {t("select-subsector-label")} + + + } + > = ({ )} - - - - {t("scopes")} - + + {t("scopes")}}> {scopes.map((scope) => ( = ({ value={scope.value} borderColor="interactive.secondary" {...register("scopes", { required: true })} - onChange={(e) => + onChange={(e: any) => handleSelectedScopes(scope.value, e.target.checked) } checked={selectedScopes.includes(scope.value)} @@ -294,12 +293,12 @@ const AddFileDataModal: FC = ({ )} - +
- - + = ({ bg="interactive.secondary" h="64px" w="316px" - isLoading={isLoading} + loading={isLoading} onClick={handleSubmit(onSubmit)} > {t("upload")} - - - + + + ); }; diff --git a/app/src/components/file-input.tsx b/app/src/components/file-input.tsx index d59d6f596..eca5cbcae 100644 --- a/app/src/components/file-input.tsx +++ b/app/src/components/file-input.tsx @@ -1,4 +1,4 @@ -import { Box, FormLabel, Heading, Input, Text, VStack } from "@chakra-ui/react"; +import { Box, Heading, Input, Text, VStack } from "@chakra-ui/react"; import { TFunction } from "i18next"; import React, { useState, @@ -8,6 +8,7 @@ import React, { SetStateAction, } from "react"; import { FiUpload } from "react-icons/fi"; +import { Field } from "./ui/field"; interface FileUploadProps { onFileSelect: (file: File) => void; // Define a type for the onFileSelect prop @@ -65,53 +66,60 @@ const FileInput: React.FC = ({ onDragLeave={handleDragLeave} onDrop={handleDrop} > - - - + - - - - - {t("click-to-upload")} - {" "} - -  {t("drag-and-drop")} + + + + + {t("click-to-upload")} + {" "} + +  {t("drag-and-drop")} + + + + {t("csv-or-json")} - - {t("csv-or-json")} - - - + } + > + + ); }; From 6bcba76fe10e6501bd1ee6d2fbb8a4ac8f650f18 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Tue, 28 Jan 2025 14:29:59 +0200 Subject: [PATCH 078/190] fix: sector page styling --- app/package-lock.json | 1038 ++++++++--------- app/package.json | 2 +- .../[inventory]/data/[step]/SourceDrawer.tsx | 4 +- .../[lng]/[inventory]/data/[step]/page.tsx | 99 +- app/src/components/SegmentedProgress.tsx | 3 +- app/src/components/file-input.tsx | 99 +- app/src/components/icons.tsx | 68 +- app/src/components/ui/file-upload.tsx | 174 +++ app/src/lib/theme/recipes/button.recipe.ts | 1 + 9 files changed, 880 insertions(+), 608 deletions(-) create mode 100644 app/src/components/ui/file-upload.tsx diff --git a/app/package-lock.json b/app/package-lock.json index 031e28f01..0074ce0e5 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -9,7 +9,7 @@ "version": "0.39.0-dev.0", "dependencies": { "@ai-sdk/openai": "^1.0.8", - "@chakra-ui/react": "^3.4.0", + "@chakra-ui/react": "^3.5.1", "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", "@next/env": "^14.2.5", @@ -374,62 +374,62 @@ } }, "node_modules/@ark-ui/react": { - "version": "4.8.1", - "resolved": "https://registry.npmjs.org/@ark-ui/react/-/react-4.8.1.tgz", - "integrity": "sha512-KjWQWyg5I95RJFNosNMWFjbDSSoN5SQRR1vorbP0n8kukzRIS0hJKX64JPOdfW5ndyp2gQ3OVN65WaFQDwM0pA==", - "dependencies": { - "@internationalized/date": "3.6.0", - "@zag-js/accordion": "0.81.2", - "@zag-js/anatomy": "0.81.2", - "@zag-js/auto-resize": "0.81.2", - "@zag-js/avatar": "0.81.2", - "@zag-js/carousel": "0.81.2", - "@zag-js/checkbox": "0.81.2", - "@zag-js/clipboard": "0.81.2", - "@zag-js/collapsible": "0.81.2", - "@zag-js/collection": "0.81.2", - "@zag-js/color-picker": "0.81.2", - "@zag-js/color-utils": "0.81.2", - "@zag-js/combobox": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/date-picker": "0.81.2", - "@zag-js/date-utils": "0.81.2", - "@zag-js/dialog": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/editable": "0.81.2", - "@zag-js/file-upload": "0.81.2", - "@zag-js/file-utils": "0.81.2", - "@zag-js/focus-trap": "0.81.2", - "@zag-js/highlight-word": "0.81.2", - "@zag-js/hover-card": "0.81.2", - "@zag-js/i18n-utils": "0.81.2", - "@zag-js/menu": "0.81.2", - "@zag-js/number-input": "0.81.2", - "@zag-js/pagination": "0.81.2", - "@zag-js/pin-input": "0.81.2", - "@zag-js/popover": "0.81.2", - "@zag-js/presence": "0.81.2", - "@zag-js/progress": "0.81.2", - "@zag-js/qr-code": "0.81.2", - "@zag-js/radio-group": "0.81.2", - "@zag-js/rating-group": "0.81.2", - "@zag-js/react": "0.81.2", - "@zag-js/select": "0.81.2", - "@zag-js/signature-pad": "0.81.2", - "@zag-js/slider": "0.81.2", - "@zag-js/splitter": "0.81.2", - "@zag-js/steps": "0.81.2", - "@zag-js/switch": "0.81.2", - "@zag-js/tabs": "0.81.2", - "@zag-js/tags-input": "0.81.2", - "@zag-js/time-picker": "0.81.2", - "@zag-js/timer": "0.81.2", - "@zag-js/toast": "0.81.2", - "@zag-js/toggle-group": "0.81.2", - "@zag-js/tooltip": "0.81.2", - "@zag-js/tour": "0.81.2", - "@zag-js/tree-view": "0.81.2", - "@zag-js/types": "0.81.2" + "version": "4.9.1", + "resolved": "https://registry.npmjs.org/@ark-ui/react/-/react-4.9.1.tgz", + "integrity": "sha512-grnfoSUrGxN0VMgtf4yvpMgin2T4ERINqYm3x/XKny+q2iIO76PD7yjNP7IW+CDmNxy3QPOidcvRiCyy6x0LGA==", + "dependencies": { + "@internationalized/date": "3.7.0", + "@zag-js/accordion": "0.82.1", + "@zag-js/anatomy": "0.82.1", + "@zag-js/auto-resize": "0.82.1", + "@zag-js/avatar": "0.82.1", + "@zag-js/carousel": "0.82.1", + "@zag-js/checkbox": "0.82.1", + "@zag-js/clipboard": "0.82.1", + "@zag-js/collapsible": "0.82.1", + "@zag-js/collection": "0.82.1", + "@zag-js/color-picker": "0.82.1", + "@zag-js/color-utils": "0.82.1", + "@zag-js/combobox": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/date-picker": "0.82.1", + "@zag-js/date-utils": "0.82.1", + "@zag-js/dialog": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/editable": "0.82.1", + "@zag-js/file-upload": "0.82.1", + "@zag-js/file-utils": "0.82.1", + "@zag-js/focus-trap": "0.82.1", + "@zag-js/highlight-word": "0.82.1", + "@zag-js/hover-card": "0.82.1", + "@zag-js/i18n-utils": "0.82.1", + "@zag-js/menu": "0.82.1", + "@zag-js/number-input": "0.82.1", + "@zag-js/pagination": "0.82.1", + "@zag-js/pin-input": "0.82.1", + "@zag-js/popover": "0.82.1", + "@zag-js/presence": "0.82.1", + "@zag-js/progress": "0.82.1", + "@zag-js/qr-code": "0.82.1", + "@zag-js/radio-group": "0.82.1", + "@zag-js/rating-group": "0.82.1", + "@zag-js/react": "0.82.1", + "@zag-js/select": "0.82.1", + "@zag-js/signature-pad": "0.82.1", + "@zag-js/slider": "0.82.1", + "@zag-js/splitter": "0.82.1", + "@zag-js/steps": "0.82.1", + "@zag-js/switch": "0.82.1", + "@zag-js/tabs": "0.82.1", + "@zag-js/tags-input": "0.82.1", + "@zag-js/time-picker": "0.82.1", + "@zag-js/timer": "0.82.1", + "@zag-js/toast": "0.82.1", + "@zag-js/toggle-group": "0.82.1", + "@zag-js/tooltip": "0.82.1", + "@zag-js/tour": "0.82.1", + "@zag-js/tree-view": "0.82.1", + "@zag-js/types": "0.82.1" }, "peerDependencies": { "react": ">=18.0.0", @@ -2646,11 +2646,11 @@ } }, "node_modules/@chakra-ui/react": { - "version": "3.4.0", - "resolved": "https://registry.npmjs.org/@chakra-ui/react/-/react-3.4.0.tgz", - "integrity": "sha512-ImnUqpZspxVbEMiKUbkIb1ReA9sXioQawKMbW/bGY21O3MjPpNPs9KX1bMk5n4VfsEUlyN0BXwK51lqhFDCEUg==", + "version": "3.5.1", + "resolved": "https://registry.npmjs.org/@chakra-ui/react/-/react-3.5.1.tgz", + "integrity": "sha512-RwhFNwhmlAgDOUBLqwKGvhra57Ts65hO/frcCpiLmROc4xDNGiybN7Cq90bft2PztlWBZk7ixpLkiMQsrGXlmQ==", "dependencies": { - "@ark-ui/react": "4.8.1", + "@ark-ui/react": "4.9.1", "@emotion/is-prop-valid": "1.3.1", "@emotion/serialize": "1.3.3", "@emotion/use-insertion-effect-with-fallbacks": "1.2.0", @@ -3769,9 +3769,9 @@ "integrity": "sha512-6EwiSjwWYP7pTckG6I5eyFANjPhmPjUX9JRLUSfNPC7FX7zK9gyZAfUEaECL6ALTpGX5AjnBq3C9XmVWPitNpw==" }, "node_modules/@internationalized/date": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.6.0.tgz", - "integrity": "sha512-+z6ti+CcJnRlLHok/emGEsWQhe7kfSmEW+/6qCzvKY67YPh7YOBfvc7+/+NXq+zJlbArg30tYpqLjNgcAYv2YQ==", + "version": "3.7.0", + "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.7.0.tgz", + "integrity": "sha512-VJ5WS3fcVx0bejE/YHfbDKR/yawZgKqn/if+oEeLqNwBtPzVB06olkfcnojTmEMX+gTpH+FlQ69SHNitJ8/erQ==", "dependencies": { "@swc/helpers": "^0.5.0" } @@ -9513,464 +9513,464 @@ "dev": true }, "node_modules/@zag-js/accordion": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/accordion/-/accordion-0.81.2.tgz", - "integrity": "sha512-xmA5GxSlme4zqpeahVpf3uC1zhSHB81c7LFfSpRDfe2KjwTAffnKAWL3thU4I4MXnIQkIXvt604yh7BWYXTrUA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/accordion/-/accordion-0.82.1.tgz", + "integrity": "sha512-DWaElpm6RhntW8zVPMfd+s461FuXi6rv4pDPpXb4xCAJ0KTkBzS6PFxoBLL+11Mjv9XioaBoJatIGOCF8GAtTA==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/anatomy": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/anatomy/-/anatomy-0.81.2.tgz", - "integrity": "sha512-wTjaT0n4bdgwd75z9x3FztYprBzmcKJj2VhgJ1OnOFFdMz+EX0mnY5PqCY8sIZQ7jfIimXcZF/xYQmqIGhQnZw==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/anatomy/-/anatomy-0.82.1.tgz", + "integrity": "sha512-wpgU7LyU9St3o/ft8Nkundi7MkW37vN1hYc2E7VA/R6mun0qiANsEf83ymIlAYnovLC6WUlBso9xwqejr6wRCg==" }, "node_modules/@zag-js/aria-hidden": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/aria-hidden/-/aria-hidden-0.81.2.tgz", - "integrity": "sha512-QpqapPBe97GsOIv9zm+4nnQB3hMwRBGJZ48/KWUABsKH1YQYX+BLHj97HY7FF3+ML6hdBXKiHYDVfWPBQCzeDw==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/aria-hidden/-/aria-hidden-0.82.1.tgz", + "integrity": "sha512-KSz9oMY9rn1N3k3tFTKHlU66eQf8XZ/gy/ex27J0ykZoaYJplWQerSZvVakbILeh+rtpvdiTNaSgrCAwYwvAPA==" }, "node_modules/@zag-js/auto-resize": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/auto-resize/-/auto-resize-0.81.2.tgz", - "integrity": "sha512-A2ueJOZhp/DkofwxZa0Wo6YQsfEmuWb5FEy38oVSctznR6yEypBms849GC3efd4/IDKYwvdt/4cGeGU2FVLfWQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/auto-resize/-/auto-resize-0.82.1.tgz", + "integrity": "sha512-adOB7Y4p4i6b8GJv4V6qhlK1YRj4Ejs5I+eWFd8Rx535uQIcxEEVtpEAD5SRYg5PNk1ikaT+GCoHnTadGj6PuA==", "dependencies": { - "@zag-js/dom-query": "0.81.2" + "@zag-js/dom-query": "0.82.1" } }, "node_modules/@zag-js/avatar": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/avatar/-/avatar-0.81.2.tgz", - "integrity": "sha512-eyIEtk2yA+Apl4a/fIiKrSD8C0tFD0+g/JgKcvkiP/OFG4WaBeAg4/URr9dl2Ytg0+1GkRYJzB+wcEUBOqOX8w==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/avatar/-/avatar-0.82.1.tgz", + "integrity": "sha512-XjRvDRmBxwy5OtIzlQOpf7zNk4g0b/uA7qZve5Hz0R7yWOu+NFlbFv0GsvRfgyYMCT5J0xBu271EG9FJq3QKyw==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/carousel": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/carousel/-/carousel-0.81.2.tgz", - "integrity": "sha512-IoJZ6WMGOiyZqm+uya6VBuZGQRNH/6RdVQpoUYgzkf7RRf7uCUs89il7iPf9IB0qO7JZ8eYOa8ZRRRZ1qGos4g==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/carousel/-/carousel-0.82.1.tgz", + "integrity": "sha512-MO9+9oedxdKynxgvLLzXs+VQSOhu+GvsCLV4fBt7nMBMGIRHtRSzXHRNRkO0aqbsO/nKQ8TFH7GYzI1NqT/y4A==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/scroll-snap": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/scroll-snap": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/checkbox": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/checkbox/-/checkbox-0.81.2.tgz", - "integrity": "sha512-lvqo8M6zsuAluBpp1RbFKhkn7VZI8vNHdzyi14iacWNtzkORbGI0+PXvXQcs0m8mDhTrfk21fnv/rpjsQe+3lg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/checkbox/-/checkbox-0.82.1.tgz", + "integrity": "sha512-yD/h8ao/JTljEo+zthpKzTy/f9fqOlJ7Nd6psPoSKZy2MRGD0TDUbOjravb3icVgjTLCiaPVWMWdonny08Me6A==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/focus-visible": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/focus-visible": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/clipboard": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/clipboard/-/clipboard-0.81.2.tgz", - "integrity": "sha512-+o2kZ0wUxKWI5qIM5CqwzYBEksZKY8/FvomcRv19N8Dr5zXzoVIf8Cub+COlX07ZM9jDW4KjdOijsz4dyBNQBg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/clipboard/-/clipboard-0.82.1.tgz", + "integrity": "sha512-r1r3vwozs+lyNgccR3OfmYAydP0cJbIHGsgDKGuempinqv6xIoptHOkFgWNd6Kxz/3MnxP+BMEy6fZzECXkhdQ==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/collapsible": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/collapsible/-/collapsible-0.81.2.tgz", - "integrity": "sha512-JauqCO4gdPibc4nViPps2rVrovNTaiiMNVy/QMUa6PEtu2zW+l/OR56eQWneIrF11ahq6uUt0HPf0vYhM96A/Q==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/collapsible/-/collapsible-0.82.1.tgz", + "integrity": "sha512-TuggUoXRVBOwACksi63TsN2rOukzUpe6oVMUvp9MaQaDbg9gpw0JzLTrdAaHfE+bhgXAb3EjN6wcZjq8zBctZQ==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/collection": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/collection/-/collection-0.81.2.tgz", - "integrity": "sha512-FEqd77voD550yp3O3ZuGsV/g7KUvjOX30hBN2O4qGeXkSGvSJSDuy6eL07M+Fm/vWLDz8moMKnwZ7R9QUWLFEg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/collection/-/collection-0.82.1.tgz", + "integrity": "sha512-uteM+xWZlWhRQe5biA5QWyva9PdzXONs+bpycUtZt8MakQgPmhW2whY9r1aW5NFVb/ScTwGAIGB3Eyc6Npz7Wg==", "dependencies": { - "@zag-js/utils": "0.81.2" + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/color-picker": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/color-picker/-/color-picker-0.81.2.tgz", - "integrity": "sha512-NliCZhgWBhPb338BkL7GLEqGxkkcitqVMGq82284Fh6qg+e1kXS1lrC1X6p32WU/3dwoSc12YEfbolRkIWAcTQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/color-picker/-/color-picker-0.82.1.tgz", + "integrity": "sha512-/MShDVBFNnXResLzeyWyKApeHuB9rmUeJo3WD/Bl6rTwjmvVCKRYguIe1SQviOokMLjuAyh0YWXdKMQw0HvMqQ==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/color-utils": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/color-utils": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/color-utils": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/color-utils/-/color-utils-0.81.2.tgz", - "integrity": "sha512-mvnagJ0eZkSRIfRcqdZUB6Pv8GaGtHWqDU1rCQoYSmV/Dp468ERoOQbl8/95qeTYRGGL4ba/n89oEDCcVRcUoA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/color-utils/-/color-utils-0.82.1.tgz", + "integrity": "sha512-BMSYcBeypGX0wCLszU2jxWBRUmd5/wPDJ59Y3Zwl9yNld0gtMnuBLSUeokMcG0UVQ/BxkyrWu3VDkKTUYKprqQ==", "dependencies": { - "@zag-js/utils": "0.81.2" + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/combobox": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/combobox/-/combobox-0.81.2.tgz", - "integrity": "sha512-EygGIhg4w+f8BmsLFffxHnxsG/V31iHScOVojK/jK6uJi8Q705ZBzvv4sC6ARVxgB9rt+HE+f2sQUZtbSSpxvA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/combobox/-/combobox-0.82.1.tgz", + "integrity": "sha512-Me3a0Sw4dTtmBRmbLGO/C1LJ4btZwbd5RLYnf8RPhEnqGJ5Z05i+ffWEe+SNBvpQO14njqBcF6P8VypVD/Ro1A==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/aria-hidden": "0.81.2", - "@zag-js/collection": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/aria-hidden": "0.82.1", + "@zag-js/collection": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/core": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/core/-/core-0.81.2.tgz", - "integrity": "sha512-dyOSdvxIUaZivEgszAZAsEXzDbz30K7R5cnav42ey6q2DysyA0ir61KuSLqik7pBpkMocLOslB1yjY3XVT7Hfg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/core/-/core-0.82.1.tgz", + "integrity": "sha512-Ux0fkt1PumcqLwExcEozCMEfKBxtd2JlnitXo4hR3lJW5q9G52FkgWDyPSrhblyTkX+7RgxViZTMnHxaXs99jg==", "dependencies": { - "@zag-js/store": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/store": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/date-picker": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/date-picker/-/date-picker-0.81.2.tgz", - "integrity": "sha512-o1eH8c4FnTf5ncq9eVFwz2mwwWFuZ7YwXXCXCA3dXoIjOhJc/IjxbW7Ji4m7nRAPkd0TCq06VSJnpwGObdfa6A==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/date-picker/-/date-picker-0.82.1.tgz", + "integrity": "sha512-f+4CV29+hcQ3Yw9hh0yyVRANONIUEWIrPS1fpnrrUNtIC0Y7f1Ajx+x089X9VxgQhwreK1sEwpnrL2vIqy+9+A==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/date-utils": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/live-region": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/date-utils": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/live-region": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" }, "peerDependencies": { "@internationalized/date": ">=3.0.0" } }, "node_modules/@zag-js/date-utils": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/date-utils/-/date-utils-0.81.2.tgz", - "integrity": "sha512-dWh2t3wiaRBM8wjWVd9pYlUu/T3L0DTXGquTqq+1TtsU89uLNQMKR9kYgK9iqRwITIUPojsTOy40CJIjBRLP5w==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/date-utils/-/date-utils-0.82.1.tgz", + "integrity": "sha512-z9sHtgV4fvtXsqLaTD4/o+D+H5wumLYhIw/Bj3yC41gR5oa4Wo9QifRT9DBfvuokmXsrnRZ8k32hUtWoYb6M/A==", "peerDependencies": { "@internationalized/date": ">=3.0.0" } }, "node_modules/@zag-js/dialog": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/dialog/-/dialog-0.81.2.tgz", - "integrity": "sha512-IN3GdKoRPr2mLiLHhrnrxAjvNMg3gjogtlXApsFA2Quxi0J2X68CS/5EU66hiVxzp3YfmulC7F5amSiN8Xn3ew==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/dialog/-/dialog-0.82.1.tgz", + "integrity": "sha512-oqi+6Y/rx6ZKxg3s9r6bIuo33x+5+UDhvrlk31kE3LWgU1KJjVV0VEkFMK9B1SJTY7IizhlWMyDx+JXJ+jOy5Q==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/aria-hidden": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/focus-trap": "0.81.2", - "@zag-js/remove-scroll": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/aria-hidden": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/focus-trap": "0.82.1", + "@zag-js/remove-scroll": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/dismissable": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/dismissable/-/dismissable-0.81.2.tgz", - "integrity": "sha512-LEK01BSl22PHSoYGWVQ9LH5FRI5G6leOO6ZabCMysBmHf7+NkieUSo07wVrAcCDYvdRCkmGTQ6B/u/z2STJ5lQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/dismissable/-/dismissable-0.82.1.tgz", + "integrity": "sha512-vs+zkORzaeNzX4Wsy4OkW1AVce7l4Tc6DHZq8gqNB5SvhK+5wEPl6EmacQRvZyoCxi2m6xpaI98UkLCmVJKU+Q==", "dependencies": { - "@zag-js/dom-query": "0.81.2", - "@zag-js/interact-outside": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/dom-query": "0.82.1", + "@zag-js/interact-outside": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/dom-query": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/dom-query/-/dom-query-0.81.2.tgz", - "integrity": "sha512-Iqi84Ac+5G8PUSETdJFG4eQ+g+Ami/IKxpTmYBdpPZWzgg82hD/+DQ5dDFndQc5HLfo1uhJVZy8O7z8gTrr0Sg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/dom-query/-/dom-query-0.82.1.tgz", + "integrity": "sha512-KFtbqDUykQur587hyrGi8LL8GfTS2mqBpIT0kL3E+S63Mq7U84i+hGf3VyNuInMB5ONpkNEk5JN4G9/HWQ6pAQ==", "dependencies": { - "@zag-js/types": "0.81.2" + "@zag-js/types": "0.82.1" } }, "node_modules/@zag-js/editable": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/editable/-/editable-0.81.2.tgz", - "integrity": "sha512-Mn6rj0N61eNZ/b/tuyXlZAdtDmx0aIvHqW30Cqy/a/wO63GCDBx+HNFa+nYM+rvgy5V0KDrrqAm01XV/5e03fg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/editable/-/editable-0.82.1.tgz", + "integrity": "sha512-V5i3kYSHFJYj8914nBf4VKKtm6m59gG482vm20As4EnLcwGFrOBbm4HXUgsKq0wYSLy/lTtvMrUT8Iqudye2gw==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/interact-outside": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/interact-outside": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/element-rect": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/element-rect/-/element-rect-0.81.2.tgz", - "integrity": "sha512-s2skZTYiauP1gcZhoD8TzBY3tm6DGG0rL2ZCNaP0dtvXv+VMY+/uziwMem32BIQhsSNeA0U5RLaUdzGNuQV6ZA==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/element-rect/-/element-rect-0.82.1.tgz", + "integrity": "sha512-xXUjmeIUdxkxic5bepp6fVqN9Qs+54PXCAUl6g/DtJecQVmVooIfa3SLSULhany4aR4mlGojp5TJxvSpUBA58Q==" }, "node_modules/@zag-js/element-size": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/element-size/-/element-size-0.81.2.tgz", - "integrity": "sha512-73MoNe2u5oTZlPj2T4dbHDdEN6aPXunth9vx1abWiTKif7VG1BqVQb9a6LKyFOztdSG9FaQif2p0VcmLsiO4zw==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/element-size/-/element-size-0.82.1.tgz", + "integrity": "sha512-k1rOE6NhoULI9d5pt2qVUxWCQVEf3OTPH8UDnbsdf11xn+hMCzRYd9lekUdVGrcHHGvEK+W6iAfWZnlwsJsmow==" }, "node_modules/@zag-js/file-upload": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/file-upload/-/file-upload-0.81.2.tgz", - "integrity": "sha512-SK4iCV+4b5aAGH4Fotscuuw0a+P2WTOc1n1IXVLzbcIcAWxOAui5Id+yqimRKUGlqa2D9U6I6vpVFa4UKvAGZg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/file-upload/-/file-upload-0.82.1.tgz", + "integrity": "sha512-6cgJsy9bf2DB0v+CVq1L4g4aCePTpfWsV4C0HC+82K+OSPomiIPsQS87wo4+eAcy3z+80Qh+uglZCFAwkW8W+g==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/file-utils": "0.81.2", - "@zag-js/i18n-utils": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/file-utils": "0.82.1", + "@zag-js/i18n-utils": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/file-utils": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/file-utils/-/file-utils-0.81.2.tgz", - "integrity": "sha512-wKMgJX8xUXzrKTMHm0JqeD4ljaAGhnNd1EPN2xQOl81zd0Hmr6A2293/2bwXtsSSAhS2h2w+mEJkf3phnz5IEg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/file-utils/-/file-utils-0.82.1.tgz", + "integrity": "sha512-/u86hMd+E5UCrrY9akDAExkO7sgPA1lXzWC9gSX4LSxHATk7Vo4o5+4LiE1MX4WZRytOhtxAycJzNDVpqzmppQ==", "dependencies": { - "@zag-js/i18n-utils": "0.81.2" + "@zag-js/i18n-utils": "0.82.1" } }, "node_modules/@zag-js/focus-trap": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/focus-trap/-/focus-trap-0.81.2.tgz", - "integrity": "sha512-jvMBiUHMb71PDPJOKwGMLSVyv+xYtdW3me+zB5eYBXol8EsAv83m6bjT0SZpJzSeph/9pBg2c+qHhNNQGaZyiA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/focus-trap/-/focus-trap-0.82.1.tgz", + "integrity": "sha512-z5OzmR8O3n2043Lwhp1qcizNHXvzc/Xteb3hWmxbX9hR3k0wHJeMXMj3GTDO0FBixRt+d8iHEmt3/8CkI72mqw==", "dependencies": { - "@zag-js/dom-query": "0.81.2" + "@zag-js/dom-query": "0.82.1" } }, "node_modules/@zag-js/focus-visible": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/focus-visible/-/focus-visible-0.81.2.tgz", - "integrity": "sha512-zQF/VK5KN81HkxhRXccP2ai2j7QRhq0J5x9rYIOX/m99S3JvA4l4zKNuENd4vMtS7LZbyIZ9dArMvqLXl5Q+dw==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/focus-visible/-/focus-visible-0.82.1.tgz", + "integrity": "sha512-b87FqZO6e9RmTY4msEzwZ3hZ8pRuPd2vbR2b6SlXr6ohtmGKlGgBGO4kmarZN/ClE+7VOnOEqIicatRBEgX9bw==", "dependencies": { - "@zag-js/dom-query": "0.81.2" + "@zag-js/dom-query": "0.82.1" } }, "node_modules/@zag-js/highlight-word": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/highlight-word/-/highlight-word-0.81.2.tgz", - "integrity": "sha512-YLl8nmvEOtwVFbeZnmL+pZPuRBZiPK0N094hWdKn+ouVxC4lIx+CabDLbKcG2rRm/75Wtyvc/8W4JBkKOQhLfg==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/highlight-word/-/highlight-word-0.82.1.tgz", + "integrity": "sha512-lS5r3V0l7Z53QyNwkxulYp5QYA9mFkU+3XsZqfM6cBjh+wmGE1xeIwknAmFtYvuYNK37AwT7pp5z0Rm1Ep6WVQ==" }, "node_modules/@zag-js/hover-card": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/hover-card/-/hover-card-0.81.2.tgz", - "integrity": "sha512-MuS2T8ZeQtCt8H+MfebLOhpCDN/OCoP0OXyVmzaEvC/S2g1wCUl0itPNvz1O028ekLQwqlxwxEI4c4PXTDDvwA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/hover-card/-/hover-card-0.82.1.tgz", + "integrity": "sha512-fp9t/PNXODwxXR1X+VzgYeSpgoJ+M3W/qvuA2stgPI4kEinwKEssSlP2sH6gTmQVZKL8SV1jiNQinVh00NE85g==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/i18n-utils": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/i18n-utils/-/i18n-utils-0.81.2.tgz", - "integrity": "sha512-OBFV+MTy1Ypz8nEwgHrcEGS70dAC1qN2tADWE78VMdjcky5T5VcwoxXlVGgaSOUUdBqC+BfR14m9g3BOREqqdQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/i18n-utils/-/i18n-utils-0.82.1.tgz", + "integrity": "sha512-YcTIqka6+/YoH2VRBMnv3CvTjHdUo/NG2nMenAB9Wq0MLTn+TAtcsujenz7ckJcgayVhFAchWNhwK9+/cs1dAw==", "dependencies": { - "@zag-js/dom-query": "0.81.2" + "@zag-js/dom-query": "0.82.1" } }, "node_modules/@zag-js/interact-outside": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/interact-outside/-/interact-outside-0.81.2.tgz", - "integrity": "sha512-PqEQMiSWJtDUVd0qAsbu0PUo/f5scmbZgX5aaxqKhv0EG+ikitoDem4Y173RSCrbah90/IYOQO+OuVrB1awS9A==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/interact-outside/-/interact-outside-0.82.1.tgz", + "integrity": "sha512-WcWJB5kM41fDM6YMGC3ZEPVn1q3Nrm+cAFkllRJrRY4+bUKXmtN8bqDaRKghP+dG5CXz66SiM6xBvDE4nqtK5Q==", "dependencies": { - "@zag-js/dom-query": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/dom-query": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/live-region": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/live-region/-/live-region-0.81.2.tgz", - "integrity": "sha512-PFrOXUXYipHXsygh43LDankinS1fp00rXTWX7Tr8Ao2UiFA/3ooxNqhupq0wvVT2lNgxSDsMSS2XpenZRNLI/g==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/live-region/-/live-region-0.82.1.tgz", + "integrity": "sha512-BmSXc41y1uOra/UV1lt8BurWkuwne/+c371IJCK6l+MWsO0ufq1lrjfx4cyFf5yhVcPRkhv/b/0i+7RxfDSK1A==" }, "node_modules/@zag-js/menu": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/menu/-/menu-0.81.2.tgz", - "integrity": "sha512-DXCTAo+DwJKD/8n3az1fqyq/xDOWw7MvRcRubbSz/aJPTdLCrnul/kDAKCr1zZ6JRdMX5xzBSJRlwA69/uPMHw==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/menu/-/menu-0.82.1.tgz", + "integrity": "sha512-faAlQZYeWHcGH8nIxBYh7HHfVjSKsHV8yUsbhMD0XkePWM6eB+dPRd/Fc3DeT8ieM8+sUODnTHEuxar0i48v4w==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/rect-utils": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/rect-utils": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/number-input": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/number-input/-/number-input-0.81.2.tgz", - "integrity": "sha512-17LjDRJ4Jtb7PEQjcXzgn+hJ0XKQTttMZsEQmGJwHYtQLYXxYqWxihlK1wdpInlxy3a8zwp9ob2gwegbeB1DWA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/number-input/-/number-input-0.82.1.tgz", + "integrity": "sha512-QIQlxlxM78+TkEhPEGlTbkBR3G2ngm5vhc3BFw4sG6ABMyre8TiIH37EqQB7EGKyAcuz6QwPk3AervHMFKe4YQ==", "dependencies": { "@internationalized/number": "3.6.0", - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/pagination": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/pagination/-/pagination-0.81.2.tgz", - "integrity": "sha512-79Z9ELA+xM5LSCtUuztyUnIBFUHOIfnm1xkBIctEs9PMulx9W0Z8KkzfiV44Ze4Qmk/50LByaveg4vQ0sAY9VQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/pagination/-/pagination-0.82.1.tgz", + "integrity": "sha512-1Rsd3cSnlewefNB1RBI0ymK5wlgiBcK42H1IrJIhly6+SXDAhp0Oc45ofsCzpfhkQ4be+A9Cb30ayc6J4ZU2kA==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/pin-input": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/pin-input/-/pin-input-0.81.2.tgz", - "integrity": "sha512-EnNP4bbiPZPt6kQC5XLTYxjq1WrlxXJdWjloe1voZSlL/ZDo7l9Wztx/+7sSwys11F17r9RTm7ACYH4ixs0ujQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/pin-input/-/pin-input-0.82.1.tgz", + "integrity": "sha512-P7UN7rIt03YHt05SuK+kZ9mhl4AfvCvaSGB/9KzEq5r6p1D3lc4+0LVkkOvL2EEB8vbGY/y5BNcvaF2jPQPH5Q==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/popover": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/popover/-/popover-0.81.2.tgz", - "integrity": "sha512-7Meukjyw+yBFJfR3LiFISG28+rb6J5+dwmcQscFswjq7yS602gqr3LCHhrl8AdfIt/fOcSBRc8BY+lf3uXGqlQ==", - "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/aria-hidden": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/focus-trap": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/remove-scroll": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/popover/-/popover-0.82.1.tgz", + "integrity": "sha512-zZ8H/jcjaXcLRX4dBcmandexeKV/5cBOt4AUVEnd3/X5NFFkA2Njz8rpQFcNRZl814NxG4RCchIu8kmonmUKCA==", + "dependencies": { + "@zag-js/anatomy": "0.82.1", + "@zag-js/aria-hidden": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/focus-trap": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/remove-scroll": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/popper": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/popper/-/popper-0.81.2.tgz", - "integrity": "sha512-9WzvtgadumsrEyKzcx4eoNE7H++k4eC44sVbIYNWXfaOQhzrQchSRhLjRfj06FQ7Pj2qj9ep7LjzJ2X2yWBkAg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/popper/-/popper-0.82.1.tgz", + "integrity": "sha512-vQTmVUs6aLGqKmWb+FnLDntsulvd/sCvgndeTmwOHRW8PBwPb86aDnvNrNosBSS+Kk9p6CMJwWZ6CuPWR5Kf7Q==", "dependencies": { "@floating-ui/dom": "1.6.12", - "@zag-js/dom-query": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/dom-query": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/presence": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/presence/-/presence-0.81.2.tgz", - "integrity": "sha512-S4iMDxWko+km2QgadJ8W8HuRIW6p04sCxvZrsgT/xGQrJJ5/nmDPcmyyKPeMWtultzi4k1G6SIGQoSzEZvgFZg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/presence/-/presence-0.82.1.tgz", + "integrity": "sha512-eZeAkq2s7NYCiNVMvkWL2Or458hZj71u7ygCt6skA18sO1ZksY+qIFqj99leCov+fesz06Hf8bxZz5029t/Wjg==", "dependencies": { - "@zag-js/core": "0.81.2", - "@zag-js/types": "0.81.2" + "@zag-js/core": "0.82.1", + "@zag-js/types": "0.82.1" } }, "node_modules/@zag-js/progress": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/progress/-/progress-0.81.2.tgz", - "integrity": "sha512-LRpDNI9lap0fOr1DiB1WLuY4j5lEVW0v5TBBT61vNhbc0b07Lq3bR6PoSUW7RWjC26mFrbS9/3MuwHrfSR4BeQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/progress/-/progress-0.82.1.tgz", + "integrity": "sha512-Fy1EjUda7o7e/yTKbZgKKayGOsHxkjLG+x0AakHmbR/k2VKbM4QuFHB9RJLlqNd9a+m/BzS1kEKWzCJ7/mXL9Q==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/qr-code": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/qr-code/-/qr-code-0.81.2.tgz", - "integrity": "sha512-TtHoJC78iBsK8PrRkZz5l8LZdVWUZQiaRx7locjYmhjsWSHxgxyoZ7GZG8mfblFO0vVsGlyupfApYV9QENkjBw==", - "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/qr-code/-/qr-code-0.82.1.tgz", + "integrity": "sha512-E1N1o1dPVuhWkcrg6urut2aaCqrc16OeE9VJh1mAGIUknF3p0QScH+ql7J/n9r8WOa21xyF6HLKhnWVPRQmHGg==", + "dependencies": { + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1", "proxy-memoize": "3.0.1", "uqr": "0.1.2" } }, "node_modules/@zag-js/radio-group": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/radio-group/-/radio-group-0.81.2.tgz", - "integrity": "sha512-rRjCZVyAxUvEFNnpyhCCLH3dPGIF/XkUn9L/A770oPrel9Z33ULIZMEef96X0W74btdi88OC/BSZMOrA9OrLTw==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/radio-group/-/radio-group-0.82.1.tgz", + "integrity": "sha512-YTqP4Ok2YEmEXCEiNW2tufZ6svt4sh7KHqrHZq81vPAJMKKhVosP6LnZvmt4dVn6tKJ0OU8idwFVtPM5jSAWoA==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/element-rect": "0.81.2", - "@zag-js/focus-visible": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/element-rect": "0.82.1", + "@zag-js/focus-visible": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/rating-group": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/rating-group/-/rating-group-0.81.2.tgz", - "integrity": "sha512-Ktm7Bh9GZb7s+fOIpdvg0zBS8EbY+ITOtNd9MZyCNa4CSm0whw7X5AYk5z9cvaXA1z9jB9JprGk9zgO9bxqEzg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/rating-group/-/rating-group-0.82.1.tgz", + "integrity": "sha512-ULl0OA207b6Ilsr2QWt4dbx58hA/NnyCmHpvv1pAYSlH3K0Es5b25B80Cc5jM/3NK3yqoY81OkS9U8lxmpWo+A==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/react": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/react/-/react-0.81.2.tgz", - "integrity": "sha512-hm3Ws+CBECRslQX0d1VDv6RlMrbh2GM9uGhRWE7MIrO5UuOS5qGPUj8lPDJNoHW1aWYJAl8Fl5CfJ1lPdwAI5A==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/react/-/react-0.82.1.tgz", + "integrity": "sha512-CZivUTFQ4TdRKTN+9wpWAo0lEZlMnbjJPVn2VJVpcz+eRNUeoVzevkNY/OzAqdV3mp+VtdNabQn1fAz8ngViPQ==", "dependencies": { - "@zag-js/core": "0.81.2", - "@zag-js/store": "0.81.2", - "@zag-js/types": "0.81.2", + "@zag-js/core": "0.82.1", + "@zag-js/store": "0.82.1", + "@zag-js/types": "0.82.1", "proxy-compare": "3.0.1" }, "peerDependencies": { @@ -9979,249 +9979,249 @@ } }, "node_modules/@zag-js/rect-utils": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/rect-utils/-/rect-utils-0.81.2.tgz", - "integrity": "sha512-Hv+vs2FHn+iHn7FJF33KV83SZm8Zs8ogW0dVPsPshF8dIuoCbu/JSyaORrrTlXKlsN/E72SiKsXtn7javefWLw==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/rect-utils/-/rect-utils-0.82.1.tgz", + "integrity": "sha512-gXmvj1wK9FeToOCzvoZ5gycqUNRzfeqd84uwJeG9zA8SVdoyEnoAji8IAynneq8t3LbiNUcu37wjTw0dcWM6ig==" }, "node_modules/@zag-js/remove-scroll": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/remove-scroll/-/remove-scroll-0.81.2.tgz", - "integrity": "sha512-bcyEWuHgVYd3YdGJ99z460QwiFXeL+iNhzSNWltr6ZDvdOCQdK2Q8iAO+SgK0E1KfsnFnqLcSuBHBhJwLD6/6g==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/remove-scroll/-/remove-scroll-0.82.1.tgz", + "integrity": "sha512-68cvXvqgNOlucbnGKRyephk8Qg8wb4xpjgUdmF9xQwICdY/uhW2p4ZGJ4471TDCDIlpoBrJPYsWqV2oWH3QNfA==", "dependencies": { - "@zag-js/dom-query": "0.81.2" + "@zag-js/dom-query": "0.82.1" } }, "node_modules/@zag-js/scroll-snap": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/scroll-snap/-/scroll-snap-0.81.2.tgz", - "integrity": "sha512-JNJ/qfbtSwqGVIIlg16FPkMWXudn7rrDmnSC7jrlMMTnMKxLTRTyC7hDGPvjEL4MDDWMSbnxDa0peGDXMNNSJQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/scroll-snap/-/scroll-snap-0.82.1.tgz", + "integrity": "sha512-HL3MkBpWx4Cw0+h1UP/PnvLP3Z1T+F5mkeS8HWmiP+KPzhtFiEBRrve+xk7h7BMXifteg2UZy53ZiZfJeGsd3w==", "dependencies": { - "@zag-js/dom-query": "0.81.2" + "@zag-js/dom-query": "0.82.1" } }, "node_modules/@zag-js/select": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/select/-/select-0.81.2.tgz", - "integrity": "sha512-bQYxuhf6JC9nKzlLAAcG0GxjhpVsNoI5AhCNqq+4yoMUbR/yqZwCiHFAPxZMneciS/LsWuDZMvZyVt4pY4j9Sw==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/select/-/select-0.82.1.tgz", + "integrity": "sha512-cc6D8Iz+Ewnx9L0J63QGqC2bbiwzCEcJVE/j4OZDcy4Qk3lqr3qA09uuJbQxAi7yvIeB44DIEt9ryTZPkZbgiw==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/collection": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/collection": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/signature-pad": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/signature-pad/-/signature-pad-0.81.2.tgz", - "integrity": "sha512-TC/DKJtJsv0L3nGDAZsMxLZ2FsDwLSIqaAoK3s/kYga+//zBwHOh46NEy21fNEZBwCWh/r6Tj2p+WuutFRFc0g==", - "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/signature-pad/-/signature-pad-0.82.1.tgz", + "integrity": "sha512-s8ae88OpAafkpuqimO9beUiVTn3FG+bnWeWnYQOLtNYMCNHzQbVZp9QBNbOoUpNcDT14mx9rfZe98BqfiMohFw==", + "dependencies": { + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1", "perfect-freehand": "^1.2.2" } }, "node_modules/@zag-js/slider": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/slider/-/slider-0.81.2.tgz", - "integrity": "sha512-yD8FgHh7g5CVoG0itscJyq3+kPtD5EQgYH+yPpc87fQ1o7SHbzq3U9WE3KXDY555OYQYD5dAkWCIeQRfmQKnJg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/slider/-/slider-0.82.1.tgz", + "integrity": "sha512-qXVvXbDRq6Cla036M9OH6plO7ubefM7k65NJQKjtITDua+VliKQLXj9BrdPLT9K96wWntW+D/TiZXE+JNbR4ow==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/element-size": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/element-size": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/splitter": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/splitter/-/splitter-0.81.2.tgz", - "integrity": "sha512-+ZCzb+XCtnFsKi55pZHCDxJ090eFUecVHohSyZH45JePp0i+QO2vK495yjYH/NHSwwS9QSwrprRZGa2QfaeKKg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/splitter/-/splitter-0.82.1.tgz", + "integrity": "sha512-eMNncj+pcepYTf+51s4ysDS/tjtKXswpwsSQR0AeNqCE3SW3TGzHOM0+uheyjgv9EmDGDrr3Imdo0PCkq3bqug==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/steps": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/steps/-/steps-0.81.2.tgz", - "integrity": "sha512-w2/QwDVOX0RW7igAHcYr6yZM9/A/tcm9Nb4ZWbkM253vkGDMm6ruvDpO58R9qjce2rtExXgU437WTHZe7y1TyA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/steps/-/steps-0.82.1.tgz", + "integrity": "sha512-N/LVOPbpQGtqpnNsdgZsQytpvXVoJ9Uldo8G38Q7892wwhVx63L0qLaiOK+SkU7kUTueOh109HezZ67nq3sadw==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/store": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/store/-/store-0.81.2.tgz", - "integrity": "sha512-D4jqyKokVwpNXL0lq3nn9iQekyntNbPkAetDZs3vy1gPAq0hvFWKF8iNTCthC1e3hRZqJBE8l6gbL9fi1nU/XA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/store/-/store-0.82.1.tgz", + "integrity": "sha512-uWlVivLZBCuAEXrXOITM1srwfBtAnT8kBYVPElrT5aSO9gkV1YC/g+YdFRol7KKOg12qO561CPKReVfilmtAKg==", "dependencies": { "proxy-compare": "3.0.1" } }, "node_modules/@zag-js/switch": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/switch/-/switch-0.81.2.tgz", - "integrity": "sha512-Ts1O8dmhkQKnWwjtnmK/yH5QMAAIAjuwVaUPcRuFuiBqU7Meo3Kapo7wAu3mxXXpNmarMUzntdv+uxmXFtAjVQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/switch/-/switch-0.82.1.tgz", + "integrity": "sha512-lIZsOs5nG9TkPs75+OK5THprEO0u3NAiLnEJ489KEFautVX/GMwAWvGHNFS7CcCpLZv+EpVKAPAdmGfEphrzhA==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/focus-visible": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/focus-visible": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/tabs": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/tabs/-/tabs-0.81.2.tgz", - "integrity": "sha512-UK4J/o6Iuos/i9RG4KOT+TYBuHHeYUDer9XIQPMEX4wppgqZaisZMvsHGkA4s7kIezvuupR/uZxjzZocQFYsqQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/tabs/-/tabs-0.82.1.tgz", + "integrity": "sha512-1uwNRvy8LyUTCAWjL1kD7BexOZ0sHrZ4OnUwDNuaWbqxUjtzoe+ftvcLXvmwFMmrns7o1SVnjqkgSVKuE4mcDA==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/element-rect": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/element-rect": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/tags-input": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/tags-input/-/tags-input-0.81.2.tgz", - "integrity": "sha512-zCqzluQsW7SAhZ2BkNTaTPdYkdSoMsrekEowRFHe+snRmX2UnUJ7B8skd0tw114ipJxEiC+Pjq/c5aReP+UvMw==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/tags-input/-/tags-input-0.82.1.tgz", + "integrity": "sha512-1mY8nCNMQgMwWBV5zX0bUcIgstqKjvFOAuYhGLIxbQPbgX7lP8Kr3nuhABh0oC0KnWaKfOMlItir2k795G4KMQ==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/auto-resize": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/interact-outside": "0.81.2", - "@zag-js/live-region": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/auto-resize": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/interact-outside": "0.82.1", + "@zag-js/live-region": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/time-picker": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/time-picker/-/time-picker-0.81.2.tgz", - "integrity": "sha512-/+cvKNp3g4mZ16IVWf8qutTtE9yQCS4lVtfCF0TMGryL1dGjFHZtbDBhVF0yUl2IlvBZKZIX2Zz8bd8KZbJ0VA==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/time-picker/-/time-picker-0.82.1.tgz", + "integrity": "sha512-nWKx3yyHFBUBPOTDFhi3du4wWlQe8wY0EoeWLQN6bpJSF4qo/BosTZJkUHm//FgUdwdhQBFOAsrlrJ0vL4qvNA==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" }, "peerDependencies": { "@internationalized/date": ">=3.0.0" } }, "node_modules/@zag-js/timer": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/timer/-/timer-0.81.2.tgz", - "integrity": "sha512-eWF00NMAhCl7cNeNeqT5y7mtXPeuJm2bH9V+sXO8uvYXpKKgykX8nvEDeMJj4gAw3gpG/ov6rZpDBcaqPdXq+Q==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/timer/-/timer-0.82.1.tgz", + "integrity": "sha512-uG4xCrYHgDZJgvW+71ROQX0xIkqMup37ZpNSLS2f5eD5DO1n/9NYLztA1YyeCJyv1aEDsZreeJLJvNDElgXA2A==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/toast": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/toast/-/toast-0.81.2.tgz", - "integrity": "sha512-9MAFg5qAGOpCtcp8vp0MPDxzaLyn/dNjs8mscNfV93DRUA2TOCz3SXllk/qNnUjdU+Ux2WV04OwbElz43sBjwg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/toast/-/toast-0.82.1.tgz", + "integrity": "sha512-4dL99zHXQg8j7ReJAR9zLAp5lNKMS4Nm+THnJaKsA0TF5QkELGnsZz47oKhFY0aQn46paxMLVagLqQ0+2i6D1w==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/toggle-group": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/toggle-group/-/toggle-group-0.81.2.tgz", - "integrity": "sha512-y6BbbOCvsNYUhUfQuswNZO/LpYhmwuO2vDE88GnWAO1g41epAG3ASrkYCtpApQKVbmIHh6gNa9taGhIhzo/13A==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/toggle-group/-/toggle-group-0.82.1.tgz", + "integrity": "sha512-8YaYKFz3ciiQhlTFScrvqH3Ke6UMDQLSgMEsCcERBYatd6TxkJwlFiBzpksIDsZpmloBrylyItJvqmzj9jt6Ig==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/tooltip": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/tooltip/-/tooltip-0.81.2.tgz", - "integrity": "sha512-qhpUUJwUf5DrlbKh533OJYU0kYo0Nuv6RoF7qs+XSqCx4btqyCNPseJf9/BX2UTqwo7J6cZwr0iqRwJgxx2k/Q==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/tooltip/-/tooltip-0.82.1.tgz", + "integrity": "sha512-ewF/1h2INDJlzYnoIigcWFWim56ezhfl7YGKgqLBdxBoRvZHyhRIfR8bbddVZk4k144gXsMVMeXwS6VEt6D0eQ==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/focus-visible": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/focus-visible": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/tour": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/tour/-/tour-0.81.2.tgz", - "integrity": "sha512-RD9eEw9EN4Qa8awT3mS/pM9bCMR0aljt1UyTL8siR0jH/tMwZ7Vntuxb3bQGdyUSLQykyh1miczMS8zha84BKg==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/tour/-/tour-0.82.1.tgz", + "integrity": "sha512-Oo4ZA3vG2sYEotfrWVXfIV1KW0Z+s91U+2YPtM2sOLnhetEVXxj/AwAruZfvS6WOcTI7D9UBrrQolY94fdZeOA==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dismissable": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/focus-trap": "0.81.2", - "@zag-js/interact-outside": "0.81.2", - "@zag-js/popper": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dismissable": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/focus-trap": "0.82.1", + "@zag-js/interact-outside": "0.82.1", + "@zag-js/popper": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/tree-view": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/tree-view/-/tree-view-0.81.2.tgz", - "integrity": "sha512-G782cRXUnACceINnpQTLEeg33n6nzProOCC38dguwqKNd1pUDloVnDyo87XHDxEA2WCi0CslGlxW8YuL5iOd9w==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/tree-view/-/tree-view-0.82.1.tgz", + "integrity": "sha512-xvYwaL49ffC8nnb+ENgNtkSZE1jMh8tm1E777AqBqnrhJZ28+FA9Sk8YDuWIWhNOV/r4n97jTXqj4SAGCrlAMQ==", "dependencies": { - "@zag-js/anatomy": "0.81.2", - "@zag-js/collection": "0.81.2", - "@zag-js/core": "0.81.2", - "@zag-js/dom-query": "0.81.2", - "@zag-js/types": "0.81.2", - "@zag-js/utils": "0.81.2" + "@zag-js/anatomy": "0.82.1", + "@zag-js/collection": "0.82.1", + "@zag-js/core": "0.82.1", + "@zag-js/dom-query": "0.82.1", + "@zag-js/types": "0.82.1", + "@zag-js/utils": "0.82.1" } }, "node_modules/@zag-js/types": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/types/-/types-0.81.2.tgz", - "integrity": "sha512-RmEN7+TrpJiS1NLqTvURmxhYyCrsuLKblbdR/MSJ2L0M0sdncyClSNhcXkjSd0wRuEaNPF97H5lvAhQ+nEMynQ==", + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/types/-/types-0.82.1.tgz", + "integrity": "sha512-Nr/CU/z/SZWDL92P2u9VDZL9JUxY8L1P7dGI0CmDKHlEHk1+vzqg3UnVkUKkZ5eVMNLtloHbrux5X9Gmkl39WQ==", "dependencies": { "csstype": "3.1.3" } }, "node_modules/@zag-js/utils": { - "version": "0.81.2", - "resolved": "https://registry.npmjs.org/@zag-js/utils/-/utils-0.81.2.tgz", - "integrity": "sha512-lE3aCkA+e9tCiU10FS73CyiAa43folvKCDr5HMJ8se2MgYUyVfB5vjRKBvH3eAi4tcniwYjYY73pH5V7Gf2wnA==" + "version": "0.82.1", + "resolved": "https://registry.npmjs.org/@zag-js/utils/-/utils-0.82.1.tgz", + "integrity": "sha512-JUGdEjstrzB0G2AJqzQiURIl6UZ1ONYgby/pqBKX57LO5LxasQXk9oNZh8+ZAvePNC/lKqqTtyyI02YQB4XwkA==" }, "node_modules/abab": { "version": "2.0.6", diff --git a/app/package.json b/app/package.json index f7a9e0178..3fb11798c 100644 --- a/app/package.json +++ b/app/package.json @@ -35,7 +35,7 @@ }, "dependencies": { "@ai-sdk/openai": "^1.0.8", - "@chakra-ui/react": "^3.4.0", + "@chakra-ui/react": "^3.5.1", "@emotion/react": "^11.14.0", "@huggingface/inference": "^2.8.0", "@next/env": "^14.2.5", diff --git a/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx b/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx index ff77f5fab..6e7eea9e9 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/SourceDrawer.tsx @@ -97,7 +97,7 @@ export function SourceDrawer({ finalFocusRef={finalFocusRef} > - + {/* - + */} Drawer Title diff --git a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx index 6c3ed3213..7c1757f76 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx @@ -7,6 +7,8 @@ import { DataAlertIcon, DataCheckIcon, ExcelFileIcon, + MissingDataIcon, + NoDatasourcesIcon, WorldSearchIcon, } from "@/components/icons"; import { @@ -87,6 +89,7 @@ import { ProgressCircleRing, ProgressCircleRoot, } from "@/components/ui/progress-circle"; +import { TbWorldSearch } from "react-icons/tb"; function getMailURI(locode?: string, sector?: string, year?: number): string { const emails = @@ -115,11 +118,11 @@ function SearchDataSourcesPrompt({ return ( @@ -157,15 +160,13 @@ function NoDataSourcesMessage({ }) { return ( - + + + I
I - + please report this I @@ -625,8 +631,10 @@ export default function AddDataSteps({ className={` ${isExpanded ? "hidden" : "flex"} transition-all duration-50 ease-linear`} >
-
+
{/*** Manual data entry section for subsectors ***/} - - + + {t("add-data-heading")} @@ -783,7 +795,7 @@ export default function AddDataSteps({ {t("select-subsector")} - + {isInventoryLoading || !currentStep.subSectors ? (
@@ -798,8 +810,9 @@ export default function AddDataSteps({ { router.push( @@ -832,9 +845,9 @@ export default function AddDataSteps({ as={ subSector.completed ? MdOutlineCheckCircle - : DataAlertIcon + : MissingDataIcon } - boxSize={9} + boxSize={10} color={ subSector.completed ? "interactive.tertiary" @@ -844,8 +857,10 @@ export default function AddDataSteps({ )} {t(nameToI18NKey(subSector.subsectorName!))} @@ -857,19 +872,26 @@ export default function AddDataSteps({ )} - } - /> + > + + ), @@ -878,7 +900,7 @@ export default function AddDataSteps({ {/*** Third party data source section ***/} - + - + {t("check-data-heading")} {t("check-data-details")} @@ -894,14 +916,15 @@ export default function AddDataSteps({ {dataSources && ( } aria-label="Refresh" size="lg" h={16} w={16} isLoading={areDataSourcesFetching} onClick={onSearchDataSourcesClicked} - /> + > + + )} {!dataSources ? ( @@ -1049,8 +1072,8 @@ export default function AddDataSteps({ )} {/* Upload own data section */} - - + + {t("upload-your-data-heading")} @@ -1078,7 +1101,7 @@ export default function AddDataSteps({ sectorData[0]?.files.map( (file: InventoryUserFileAttributes, i: number) => { return ( - {file.fileName} @@ -1154,7 +1177,7 @@ export default function AddDataSteps({ ))} - + ); }, )} diff --git a/app/src/components/SegmentedProgress.tsx b/app/src/components/SegmentedProgress.tsx index dadd85ad7..d377b2f35 100644 --- a/app/src/components/SegmentedProgress.tsx +++ b/app/src/components/SegmentedProgress.tsx @@ -103,7 +103,8 @@ export function SegmentedProgress({ backgroundColor="background.neutral" w="full" className="flex flex-row" - borderRadius="full" + borderRightRadius="10px" + borderLeftRadius="10px" > {normalizedValues.map((value, i) => ( void; // Define a type for the onFileSelect prop @@ -66,60 +72,61 @@ const FileInput: React.FC = ({ onDragLeave={handleDragLeave} onDrop={handleDrop} > - + + - - - - - {t("click-to-upload")} - {" "} - -  {t("drag-and-drop")} + + + + + {t("click-to-upload")} + {" "} + +  {t("drag-and-drop")} + + + + {t("csv-or-json")} - - {t("csv-or-json")} - - - } - > - - + ); }; diff --git a/app/src/components/icons.tsx b/app/src/components/icons.tsx index 17a12fbd9..5c45963aa 100644 --- a/app/src/components/icons.tsx +++ b/app/src/components/icons.tsx @@ -21,7 +21,13 @@ export const DataAlertIcon = (props: any) => ( export const WorldSearchIcon = (props: any) => ( @@ -1205,3 +1211,63 @@ export const HeatIcon = () => { ); }; + +export const MissingDataIcon = () => { + return ( + + + + + + + + + ); +}; + +export const NoDatasourcesIcon = () => { + return ( + + + + + + + + + ); +}; diff --git a/app/src/components/ui/file-upload.tsx b/app/src/components/ui/file-upload.tsx new file mode 100644 index 000000000..28f5c8bd7 --- /dev/null +++ b/app/src/components/ui/file-upload.tsx @@ -0,0 +1,174 @@ +"use client"; + +import type { ButtonProps, RecipeProps } from "@chakra-ui/react"; +import { + Button, + FileUpload as ChakraFileUpload, + Icon, + IconButton, + Span, + Text, + useFileUploadContext, + useRecipe, +} from "@chakra-ui/react"; +import * as React from "react"; +import { LuFile, LuUpload, LuX } from "react-icons/lu"; + +export interface FileUploadRootProps extends ChakraFileUpload.RootProps { + inputProps?: React.InputHTMLAttributes; +} + +export const FileUploadRoot = React.forwardRef< + HTMLInputElement, + FileUploadRootProps +>(function FileUploadRoot(props, ref) { + const { children, inputProps, ...rest } = props; + return ( + + + {children} + + ); +}); + +export interface FileUploadDropzoneProps + extends ChakraFileUpload.DropzoneProps { + label: React.ReactNode; + description?: React.ReactNode; + children?: React.ReactNode; +} + +export const FileUploadDropzone = React.forwardRef< + HTMLInputElement, + FileUploadDropzoneProps +>(function FileUploadDropzone(props, ref) { + const { children, label, description, ...rest } = props; + return ( + + +
{label}
+ {description && {description}} + + {children} + + ); +}); + +interface VisibilityProps { + showSize?: boolean; + clearable?: boolean; +} + +interface FileUploadItemProps extends VisibilityProps { + file: File; +} + +const FileUploadItem = React.forwardRef( + function FileUploadItem(props, ref) { + const { file, showSize, clearable } = props; + return ( + + + + + + + + {showSize ? ( + + + + + ) : ( + + )} + + {clearable && ( + + + + + + )} + + ); + }, +); + +interface FileUploadListProps + extends VisibilityProps, + ChakraFileUpload.ItemGroupProps { + files?: File[]; +} + +export const FileUploadList = React.forwardRef< + HTMLUListElement, + FileUploadListProps +>(function FileUploadList(props, ref) { + const { showSize, clearable, files, ...rest } = props; + + const fileUpload = useFileUploadContext(); + const acceptedFiles = files ?? fileUpload.acceptedFiles; + + if (acceptedFiles.length === 0) return null; + + return ( + + {acceptedFiles.map((file) => ( + + ))} + + ); +}); + +type Assign = Omit & U; + +interface FileInputProps extends Assign> { + placeholder?: React.ReactNode; +} + +export const FileInput = React.forwardRef( + function FileInput(props, ref) { + const inputRecipe = useRecipe({ key: "input" }); + const [recipeProps, restProps] = inputRecipe.splitVariantProps(props); + const { placeholder = "Select file(s)", ...rest } = restProps; + return ( + + + + ); + }, +); + +export const FileUploadLabel = ChakraFileUpload.Label; +export const FileUploadClearTrigger = ChakraFileUpload.ClearTrigger; +export const FileUploadTrigger = ChakraFileUpload.Trigger; diff --git a/app/src/lib/theme/recipes/button.recipe.ts b/app/src/lib/theme/recipes/button.recipe.ts index 010e01c50..179552970 100644 --- a/app/src/lib/theme/recipes/button.recipe.ts +++ b/app/src/lib/theme/recipes/button.recipe.ts @@ -11,6 +11,7 @@ export const buttonRecipe = defineRecipe({ letterSpacing: "1.25px", lineHeight: "16px", display: "flex", + fontWeight: "bold", }, // variants for the button From 2caa73d5796371b49488aadee48c516cdf0e638f Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 29 Jan 2025 11:16:02 +0200 Subject: [PATCH 079/190] fix: file upload dialog --- .../[lng]/[inventory]/data/[step]/page.tsx | 8 ++-- .../components/Modals/add-file-data-modal.tsx | 14 ++++-- app/src/components/file-input.tsx | 16 ++++--- app/src/components/ui/dialog.tsx | 44 ++++++++++--------- 4 files changed, 49 insertions(+), 33 deletions(-) diff --git a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx index 7c1757f76..e5e955ddd 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx @@ -281,7 +281,6 @@ export default function AddDataSteps({ }); const currentStep = steps[activeStep]; - console.log("currentStep", currentStep); useEffect(() => { // change step param in URL without reloading @@ -469,8 +468,10 @@ export default function AddDataSteps({ const [uploadedFile, setUploadedFile] = useState(); + const [openFileUploadDialog, setOpenFileUploadDialog] = useState(false); + const handleFileSelect = async (file: File) => { - onFileDataModalOpen(); + setOpenFileUploadDialog((v) => !v); }; const sectorData = getInventoryData.sectors.filter( @@ -1188,9 +1189,10 @@ export default function AddDataSteps({ {/* Add fole data modal */} void; onClose: () => void; subsectors: SubSectorWithRelations[] | null; t: TFunction; @@ -65,6 +66,7 @@ const scopes = [ ]; const AddFileDataModal: FC = ({ + onOpenChange, isOpen, onClose, subsectors, @@ -178,7 +180,11 @@ const AddFileDataModal: FC = ({ }; return ( - + onOpenChange(e.open)} + > = ({ label={ <> {" "} - {t("select-subsector-label")} + + {t("select-subsector-label")} + } @@ -306,7 +314,7 @@ const AddFileDataModal: FC = ({ justifyContent="space-around" > - } + separator={ + + } > - - - {t("all-sectors")} - - + + {t("all-sectors")} + - - - - {!subSectorData ? ( - - ) : ( - t(kebab(subSectorData?.subsectorName)) - )} - - - - + + + {!subSectorData ? ( + + ) : ( + t(kebab(subSectorData?.subsectorName)) + )} + + + )} @@ -294,7 +292,7 @@ function SubSectorPage({ > {!subSectorData ? ( - + ) : subSectorData?.referenceNumber != undefined ? ( subSectorData?.referenceNumber + " " + @@ -405,7 +399,7 @@ function SubSectorPage({ h="80px" > {scopes?.map((scope, index) => ( - @@ -416,14 +410,14 @@ function SubSectorPage({ > {t("scope")} {scope.scope} - + ))}
- + {loadingState ? ( ) : ( @@ -444,10 +438,10 @@ function SubSectorPage({ ); }) )} - +
- + ); } diff --git a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx index 314308035..7f5ddebb9 100644 --- a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx +++ b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx @@ -1147,7 +1147,7 @@ export default function AddDataSteps({ w="full" > - + ); }; diff --git a/app/src/components/dropdown-select-input.tsx b/app/src/components/dropdown-select-input.tsx index 09446fb23..93b729d73 100644 --- a/app/src/components/dropdown-select-input.tsx +++ b/app/src/components/dropdown-select-input.tsx @@ -1,15 +1,31 @@ import React, { useEffect, useState } from "react"; -import { Box, Checkbox, List, ListItem, Text, Input } from "@chakra-ui/react"; -import { MdArrowDropDown, MdArrowDropUp } from "react-icons/md"; +import { + Box, + List, + ListItem, + Text, + Input, + TagLabel, + IconButton, + Icon, + Fieldset, + CheckboxGroup, +} from "@chakra-ui/react"; +import { MdArrowDropDown, MdArrowDropUp, MdClose } from "react-icons/md"; import { SubSectorWithRelations } from "@/app/[lng]/[inventory]/data/[step]/types"; import { UseFormRegister, UseFormSetValue, UseFormWatch, + useController, useForm, } from "react-hook-form"; import { FileData } from "./Modals/add-file-data-dialog"; import { TFunction } from "i18next"; +import { Tag } from "./ui/tag"; +import { Checkbox } from "./ui/checkbox"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { z } from "zod"; interface DropdownSelectProps { subsectors: SubSectorWithRelations[] | null; @@ -27,33 +43,30 @@ const DropdownSelectInput: React.FC = ({ register, }) => { const [selectedItems, setSelectedItems] = useState([]); + const [showDropdown, setShowDropdown] = useState(false); + + const handleShowdropDown = () => { + setShowDropdown((prev) => !prev); + }; - const handleCheckboxChange = ( - event: React.ChangeEvent, - value: string, - ) => { - if (event.target.checked) { - setSelectedItems([...selectedItems, value]); + const handleCheckboxChange = (checked: boolean, value: string) => { + if (checked) { + console.log(value); + setSelectedItems((prev) => [...prev, value]); } else { - setSelectedItems(selectedItems.filter((item) => item !== value)); + setSelectedItems((prev) => prev.filter((item) => item !== value)); } }; useEffect(() => { - const subsectorValues = selectedItems.slice().join(","); - setValue("subsectors", subsectorValues); - }, [setValue, selectedItems]); + setValue("subsectors", selectedItems.join(",")); + }, [selectedItems, setValue]); const handleRemoveItem = (item: string) => { - setSelectedItems( - selectedItems.filter((selectedItem) => selectedItem !== item), - ); + setSelectedItems((prev) => prev.filter((selected) => selected !== item)); }; - const [showDropdown, setShowDropdown] = useState(false); - const handleShowdropDown = () => { - setShowDropdown((prev) => !prev); - }; + console.log(subsectors); return ( @@ -84,22 +97,28 @@ const DropdownSelectInput: React.FC = ({ {t("select-placeholder")} )} - {selectedItems.map((item) => ( + {selectedItems.map((item, i) => ( - {item} - {t(item)}{" "} + handleRemoveItem(item)} color="content.alternative" + boxSize="16px" /> ))} @@ -125,41 +144,37 @@ const DropdownSelectInput: React.FC = ({ py="16px" zIndex="50" > - - {subsectors?.map((subsector) => ( - - - handleCheckboxChange(e, subsector.subsectorName!) - } - /> - - {subsector.subsectorName} - - - ))} - + + + + + {subsectors?.map((subsector) => { + return ( + + handleCheckboxChange(e, subsector.subsectorName!) + } + > + + {t(subsector?.subsectorName!)} + + + ); + })} + + + + )} From 6394afe1469a95e7b1ea41a7d02ff9a561eac371 Mon Sep 17 00:00:00 2001 From: Cephas Chapa Date: Wed, 29 Jan 2025 15:34:20 +0200 Subject: [PATCH 082/190] updates all activity dialogs and components --- app/package-lock.json | 9 + .../activity-modal/activity-form-modal.tsx | 54 ++- .../activity-modal/activity-modal-body.tsx | 390 +++++++++--------- .../components/Modals/change-methodology.tsx | 61 ++- .../Modals/delete-activity-modal.tsx | 63 ++- .../Modals/delete-all-activities-modal.tsx | 63 ++- app/src/components/ui/select.tsx | 143 +++++++ 7 files changed, 466 insertions(+), 317 deletions(-) create mode 100644 app/src/components/ui/select.tsx diff --git a/app/package-lock.json b/app/package-lock.json index 0074ce0e5..3250ee131 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -11,6 +11,7 @@ "@ai-sdk/openai": "^1.0.8", "@chakra-ui/react": "^3.5.1", "@emotion/react": "^11.14.0", + "@hookform/resolvers": "^3.10.0", "@huggingface/inference": "^2.8.0", "@next/env": "^14.2.5", "@nivo/bar": "^0.88.0", @@ -3722,6 +3723,14 @@ "@hapi/hoek": "^9.0.0" } }, + "node_modules/@hookform/resolvers": { + "version": "3.10.0", + "resolved": "https://registry.npmjs.org/@hookform/resolvers/-/resolvers-3.10.0.tgz", + "integrity": "sha512-79Dv+3mDF7i+2ajj7SkypSKHhl1cbln1OGavqrsF7p6mbUv11xpqpacPsGDCTRvCSjEEIez2ef1NveSVL3b0Ag==", + "peerDependencies": { + "react-hook-form": "^7.0.0" + } + }, "node_modules/@huggingface/inference": { "version": "2.8.0", "resolved": "https://registry.npmjs.org/@huggingface/inference/-/inference-2.8.0.tgz", diff --git a/app/src/components/Modals/activity-modal/activity-form-modal.tsx b/app/src/components/Modals/activity-modal/activity-form-modal.tsx index 4a80318d6..e54e53ebf 100644 --- a/app/src/components/Modals/activity-modal/activity-form-modal.tsx +++ b/app/src/components/Modals/activity-modal/activity-form-modal.tsx @@ -1,22 +1,10 @@ "use client"; import { api, useUpdateActivityValueMutation } from "@/services/api"; -import { - Box, - Button, - Modal, - ModalCloseButton, - ModalContent, - ModalFooter, - ModalHeader, - ModalOverlay, - Text, - useToast, -} from "@chakra-ui/react"; +import { Box, Button, Text } from "@chakra-ui/react"; import { FC } from "react"; import { SubmitHandler } from "react-hook-form"; import { TFunction } from "i18next"; -import { CheckCircleIcon } from "@chakra-ui/icons"; import { getInputMethodology } from "@/util/helpers"; import type { SuggestedActivity } from "@/util/form-schema"; import ActivityModalBody, { Inputs } from "./activity-modal-body"; @@ -28,6 +16,16 @@ import useActivityForm, { } from "@/hooks/activity-value-form/use-activity-form"; import { FetchBaseQueryError } from "@reduxjs/toolkit/query"; import useEmissionFactors from "@/hooks/activity-value-form/use-emission-factors"; +import { toaster } from "@/components/ui/toaster"; +import { + DialogBackdrop, + DialogCloseTrigger, + DialogContent, + DialogFooter, + DialogHeader, + DialogRoot, +} from "@/components/ui/dialog"; +import { MdCheckCircle } from "react-icons/md"; interface AddActivityModalProps { isOpen: boolean; @@ -106,8 +104,6 @@ const AddActivityModal: FC = ({ handleSubmit(onSubmit)(); }; - const toast = useToast(); - const [createActivityValue, { isLoading }] = api.useCreateActivityValueMutation(); @@ -229,7 +225,7 @@ const AddActivityModal: FC = ({ if (response.data) { setHasActivityData(!hasActivityData); - toast({ + toaster.create({ status: "success", duration: 1200, title: t("activity-value-success"), @@ -245,7 +241,7 @@ const AddActivityModal: FC = ({ gap="8px" px="16px" > - + {title} ), @@ -260,7 +256,7 @@ const AddActivityModal: FC = ({ handleManalInputValidationError(errorData.error.issues); } else { const error = response.error as FetchBaseQueryError; - toast({ + toaster.create({ status: "error", title: errorData.error?.message || t("activity-value-error"), }); @@ -282,19 +278,19 @@ const AddActivityModal: FC = ({ return ( <> - - - + - = ({ borderColor="border.neutral" > {edit ? t("update-emission-data") : t("add-emission-data")} - - + + = ({ clearErrors={clearErrors} setValue={setValue} /> - = ({ fontWeight="semibold" fontSize="button.md" type="submit" - isLoading={isLoading || updateLoading} + loading={isLoading || updateLoading} onClick={submit} p={0} m={0} > {edit ? t("update-emission-data") : t("add-emission-data")} - - - + + + ); }; diff --git a/app/src/components/Modals/activity-modal/activity-modal-body.tsx b/app/src/components/Modals/activity-modal/activity-modal-body.tsx index b0649c85a..756d93040 100644 --- a/app/src/components/Modals/activity-modal/activity-modal-body.tsx +++ b/app/src/components/Modals/activity-modal/activity-modal-body.tsx @@ -1,14 +1,11 @@ import { Box, - FormControl, - FormLabel, Grid, Heading, HStack, + Icon, Input, - InputGroup, - ModalBody, - Select, + SelectValueText, Spinner, Text, Textarea, @@ -16,7 +13,6 @@ import { } from "@chakra-ui/react"; import { useEffect, useState } from "react"; import BuildingTypeSelectInput from "../../building-select-input"; -import { InfoOutlineIcon, WarningIcon } from "@chakra-ui/icons"; import { TFunction } from "i18next"; import { Control, @@ -39,6 +35,15 @@ import PercentageBreakdownInput from "@/components/percentage-breakdown-input"; import { RadioButton } from "@/components/radio-button"; import { EmissionFactorTypes } from "@/hooks/activity-value-form/use-emission-factors"; import DependentSelectInput from "@/components/dependent-select-input"; +import { DialogBody } from "@/components/ui/dialog"; +import { Field } from "@/components/ui/field"; +import { + SelectContent, + SelectItem, + SelectRoot, + SelectTrigger, +} from "@/components/ui/select"; +import { MdInfoOutline, MdWarning } from "react-icons/md"; interface AddActivityModalBodyProps { t: TFunction; @@ -183,19 +188,20 @@ const ActivityModalBody = ({ ); return ( - +
{methodology.activitySelectionField && ( - - {t(methodology.activitySelectionField.id)} + ))} - + )} {f.options && ( - + - + )} {f.type === "percentage-breakdown" && ( )} {f.type === "text" && ( - - {t(f.id)} - - - + + + {(errors?.activity?.[f.id] as any) ? ( - + {" "} {errors?.activity?.[f.id]?.message}{" "} @@ -308,12 +314,11 @@ const ActivityModalBody = ({ ) : ( "" )} - + )} {f.type === "number" && ( <> - - {t(f.id)} + {f.units && ( - + + + + + {f.units?.map((item: string) => ( + + {t(item)} + + ))} + + )} {(errors?.activity?.[f.id] as any) ? ( @@ -352,7 +362,10 @@ const ActivityModalBody = ({ alignItems="center" mt="6px" > - + {errors?.activity?.[f.id]?.message}{" "} @@ -368,7 +381,10 @@ const ActivityModalBody = ({ alignItems="center" mt="6px" > - + {errors?.activity?.[`${f.id}-unit`]?.message}{" "} @@ -376,12 +392,11 @@ const ActivityModalBody = ({ ) : ( "" )} - + )} {f.dependsOn && ( - - {t(f.id)} + - + )} ); @@ -404,7 +419,7 @@ const ActivityModalBody = ({ gap="16px" w="full" > - {t(title)} @@ -463,11 +478,10 @@ const ActivityModalBody = ({ ) : ( "" )} - + {!hideEmissionFactors && ( - - {t("emission-factor-type")} - + + + + + {emissionsFactorTypes.map(({ id, name }) => ( + + {t(name)} + + ))} + + {t("add-custom")} + + + + {errors.activity?.emissionFactorType ? ( - + {t("emission-factor-form-label")} @@ -520,17 +542,14 @@ const ActivityModalBody = ({ mt="6px" > )} - + )} ) : null} {methodology?.id.includes("direct-measure") && ( - - - {t("emissions-value-co2")} - + @@ -550,7 +569,7 @@ const ActivityModalBody = ({ {(errors?.activity?.["CO2EmissionFactor"] as any) ? ( - + {t("emission-amount-form-error")} @@ -558,11 +577,8 @@ const ActivityModalBody = ({ ) : ( "" )} - - - - {t("emissions-value-n2o")} - + + @@ -582,7 +598,7 @@ const ActivityModalBody = ({ {(errors?.activity?.["N2OEmissionFactor"] as any) ? ( - + {t("emission-amount-form-error")} @@ -590,11 +606,8 @@ const ActivityModalBody = ({ ) : ( "" )} - - - - {t("emissions-value-ch4")} - + + @@ -614,7 +627,7 @@ const ActivityModalBody = ({ {(errors?.activity?.["CH4EmissionFactor"] as any) ? ( - + {t("emission-amount-form-error")} @@ -622,7 +635,7 @@ const ActivityModalBody = ({ ) : ( "" )} - + )} {!methodology?.id.includes("direct-measure") && @@ -635,7 +648,7 @@ const ActivityModalBody = ({ display="flex" alignItems="center" > - {t("emissions-factor-values")} - + - - - - {t("co2-emission-factor")} - + + ) : ( @@ -677,10 +687,10 @@ const ActivityModalBody = ({ )} - + {(errors?.activity?.["CO2EmissionFactor"] as any) ? ( - + {t("emission-amount-form-error")} @@ -694,11 +704,8 @@ const ActivityModalBody = ({ h="16px" > )} - - - - {t("n2o-emission-factor")} - + + ) : ( @@ -726,7 +733,7 @@ const ActivityModalBody = ({ {(errors?.activity?.["N2OEmissionFactor"] as any) ? ( - + {t("emission-amount-form-error")} @@ -740,11 +747,8 @@ const ActivityModalBody = ({ h="16px" > )} - - - - {t("ch4-emission-factor")} - + + ) : ( @@ -772,7 +776,7 @@ const ActivityModalBody = ({ {(errors?.activity?.["CH4EmissionFactor"] as any) ? ( - + {t("emission-amount-form-error")} @@ -786,15 +790,17 @@ const ActivityModalBody = ({ h="16px" > )} - + {" "} )} - - {t("data-quality")} - + + + + + + {t("detailed-activity-data")} + + + {t("modeled-activity-data")} + + + {t("highly-modeled-uncertain-activity-data")} + + + {errors.activity?.dataQuality ? ( - + {t("data-quality-form-label")} ) : ( "" )} - + {sourceField && ( - - {t("data-source")} - - - + + + {(errors?.activity?.[sourceField.id] as any) ? ( - + {" "} {errors?.activity?.[sourceField.id]?.message}{" "} @@ -879,13 +892,13 @@ const ActivityModalBody = ({ ) : ( "" )} - + )} - - {t("data-comments")}