From 4398ba185109748882845d198b21a89cc3542680 Mon Sep 17 00:00:00 2001 From: Jackson Hyde Date: Wed, 20 Nov 2024 18:44:02 +0000 Subject: [PATCH] Pax components and styles (#49) Pax Components and Styles, 1.6.0 Release, introducing mui-x --------- Co-authored-by: jackson --- package-lock.json | 632 +++++++++++++++--- package.json | 2 +- .../FlightFlagger/FlightFlagger.stories.tsx | 2 +- .../FlightFlagger/FlightFlaggerCard.tsx | 2 +- .../FlightFlaggerFilters.stories.tsx | 4 +- .../FlightFlagger/FlightFlaggerFilters.tsx | 2 +- .../FlightFlaggerHighlightChip.stories.tsx | 4 +- .../FlightFlaggerHighlightChip.tsx | 4 +- .../FlightFlaggerResults.stories.tsx | 2 +- .../FlightFlagger/FlightFlaggerResults.tsx | 2 +- .../FlightFlagger/FlightFlaggerTable.tsx | 15 +- .../FlightFlagger/icon-highlight-pax.svg | 2 +- src/components/Header/Header.stories.tsx | 2 +- .../Pax/PaxCard/PaxCard.stories.tsx | 80 +++ src/components/Pax/PaxCard/PaxCard.tsx | 81 +++ src/components/Pax/PaxCard/index.tsx | 2 + .../Pax/PaxDatasourceIcon/DatasourceIcon.svg | 35 + .../PaxDatasourceIcon.stories.tsx | 62 ++ .../PaxDatasourceIcon/PaxDatasourceIcon.tsx | 23 + src/components/Pax/PaxDatasourceIcon/index.ts | 2 + .../Pax/PaxHighlight/PaxHighlight.stories.tsx | 62 ++ .../Pax/PaxHighlight/PaxHighlight.tsx | 16 + src/components/Pax/PaxHighlight/index.ts | 2 + src/components/Pax/PaxSearchForm.stories.tsx | 130 ++++ src/components/Pax/PaxUtils.tsx | 79 +++ .../PlaneStatusLabel/PlaneStatus.stories.tsx | 45 ++ .../Pax/PlaneStatusLabel/PlaneStatusLabel.tsx | 52 ++ src/components/Pax/PlaneStatusLabel/index.tsx | 2 + src/components/Pax/index.ts | 13 + .../Staff/StaffUpdateSuccess.stories.tsx | 2 +- .../UpdateStaffForTimeRangeForm.stories.tsx | 2 +- src/components/Typography.stories.tsx | 2 +- src/components/index.ts | 10 +- .../ui/Highlight/Highlight.stories.tsx | 26 + src/components/ui/Highlight/Highlight.tsx | 35 + src/components/ui/Highlight/index.ts | 2 + .../ui/InfoTooltip/InfoTooltip.stories.tsx | 18 + src/components/ui/InfoTooltip/InfoTooltip.tsx | 29 + src/components/ui/InfoTooltip/index.ts | 2 + .../StatusTags/StatusTags.stories.tsx | 4 +- .../{ => ui}/StatusTags/StatusTags.tsx | 11 +- src/components/{ => ui}/StatusTags/index.ts | 0 .../ui/StyledTable/StyledTable.stories.tsx | 67 ++ .../{ => ui}/StyledTable/StyledTable.tsx | 0 src/components/{ => ui}/StyledTable/index.ts | 0 src/components/ui/index.ts | 17 + src/drt-theme.ts | 106 ++- tsconfig.json | 6 +- 48 files changed, 1568 insertions(+), 132 deletions(-) create mode 100644 src/components/Pax/PaxCard/PaxCard.stories.tsx create mode 100644 src/components/Pax/PaxCard/PaxCard.tsx create mode 100644 src/components/Pax/PaxCard/index.tsx create mode 100644 src/components/Pax/PaxDatasourceIcon/DatasourceIcon.svg create mode 100644 src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.stories.tsx create mode 100644 src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.tsx create mode 100644 src/components/Pax/PaxDatasourceIcon/index.ts create mode 100644 src/components/Pax/PaxHighlight/PaxHighlight.stories.tsx create mode 100644 src/components/Pax/PaxHighlight/PaxHighlight.tsx create mode 100644 src/components/Pax/PaxHighlight/index.ts create mode 100644 src/components/Pax/PaxSearchForm.stories.tsx create mode 100644 src/components/Pax/PaxUtils.tsx create mode 100644 src/components/Pax/PlaneStatusLabel/PlaneStatus.stories.tsx create mode 100644 src/components/Pax/PlaneStatusLabel/PlaneStatusLabel.tsx create mode 100644 src/components/Pax/PlaneStatusLabel/index.tsx create mode 100644 src/components/Pax/index.ts create mode 100644 src/components/ui/Highlight/Highlight.stories.tsx create mode 100644 src/components/ui/Highlight/Highlight.tsx create mode 100644 src/components/ui/Highlight/index.ts create mode 100644 src/components/ui/InfoTooltip/InfoTooltip.stories.tsx create mode 100644 src/components/ui/InfoTooltip/InfoTooltip.tsx create mode 100644 src/components/ui/InfoTooltip/index.ts rename src/components/{ => ui}/StatusTags/StatusTags.stories.tsx (86%) rename src/components/{ => ui}/StatusTags/StatusTags.tsx (82%) rename src/components/{ => ui}/StatusTags/index.ts (100%) create mode 100644 src/components/ui/StyledTable/StyledTable.stories.tsx rename src/components/{ => ui}/StyledTable/StyledTable.tsx (100%) rename src/components/{ => ui}/StyledTable/index.ts (100%) create mode 100644 src/components/ui/index.ts diff --git a/package-lock.json b/package-lock.json index 980107a..e350755 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@drt/drt-react-components", - "version": "1.5.4", + "version": "1.6.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@drt/drt-react-components", - "version": "1.5.4", + "version": "1.6.0", "license": "MIT", "dependencies": { "-": "^0.0.1", @@ -1823,7 +1823,7 @@ "version": "11.12.0", "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.12.0.tgz", "integrity": "sha512-y2WQb+oP8Jqvvclh8Q55gLUyb7UFvgv7eJfsj7td5TToBrIUtPay2kMrZi4xjq9qw2vD0ZR5fSho0yqoFgX7Rw==", - "dev": true, + "devOptional": true, "dependencies": { "@babel/helper-module-imports": "^7.16.7", "@babel/runtime": "^7.18.3", @@ -1842,13 +1842,12 @@ "version": "1.9.0", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz", "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==", - "dev": true + "devOptional": true }, "node_modules/@emotion/cache": { "version": "11.13.1", "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.13.1.tgz", "integrity": "sha512-iqouYkuEblRcXmylXIwwOodiEK5Ifl7JcX7o6V4jI3iW4mLXX3dmt5xwBtIkJiQEXFAI+pC8X0i67yiPkH9Ucw==", - "dev": true, "dependencies": { "@emotion/memoize": "^0.9.0", "@emotion/sheet": "^1.4.0", @@ -1861,13 +1860,13 @@ "version": "0.9.2", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==", - "dev": true + "devOptional": true }, "node_modules/@emotion/is-prop-valid": { "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==", - "dev": true, + "devOptional": true, "dependencies": { "@emotion/memoize": "^0.9.0" } @@ -1875,14 +1874,13 @@ "node_modules/@emotion/memoize": { "version": "0.9.0", "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz", - "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==", - "dev": true + "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==" }, "node_modules/@emotion/react": { "version": "11.13.3", "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz", "integrity": "sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==", - "dev": true, + "devOptional": true, "dependencies": { "@babel/runtime": "^7.18.3", "@emotion/babel-plugin": "^11.12.0", @@ -1906,7 +1904,7 @@ "version": "1.3.2", "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.2.tgz", "integrity": "sha512-grVnMvVPK9yUVE6rkKfAJlYZgo0cu3l9iMC77V7DW6E1DUIrU68pSEXRmFZFOFB1QFo57TncmOcvcbMDWsL4yA==", - "dev": true, + "devOptional": true, "dependencies": { "@emotion/hash": "^0.9.2", "@emotion/memoize": "^0.9.0", @@ -1918,14 +1916,13 @@ "node_modules/@emotion/sheet": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz", - "integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==", - "dev": true + "integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==" }, "node_modules/@emotion/styled": { "version": "11.13.0", "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.13.0.tgz", "integrity": "sha512-tkzkY7nQhW/zC4hztlwucpT8QEZ6eUzpXDRhww/Eej4tFfO0FxQYWRyg/c5CCXa4d/f174kqeXYjuQRnhzf6dA==", - "dev": true, + "devOptional": true, "dependencies": { "@babel/runtime": "^7.18.3", "@emotion/babel-plugin": "^11.12.0", @@ -1948,13 +1945,13 @@ "version": "0.10.0", "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz", "integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==", - "dev": true + "devOptional": true }, "node_modules/@emotion/use-insertion-effect-with-fallbacks": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.1.0.tgz", "integrity": "sha512-+wBOcIV5snwGgI2ya3u99D7/FJquOIniQT1IKyDsBmEgwvpxMNeS65Oib7OnE2d2aY+3BU4OiH+0Wchf8yk3Hw==", - "dev": true, + "devOptional": true, "peerDependencies": { "react": ">=16.8.0" } @@ -1962,14 +1959,12 @@ "node_modules/@emotion/utils": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.1.tgz", - "integrity": "sha512-BymCXzCG3r72VKJxaYVwOXATqXIZ85cuvg0YOUDxMGNrKc1DJRZk8MgV5wyXRyEayIMd4FuXJIUgTBXvDNW5cA==", - "dev": true + "integrity": "sha512-BymCXzCG3r72VKJxaYVwOXATqXIZ85cuvg0YOUDxMGNrKc1DJRZk8MgV5wyXRyEayIMd4FuXJIUgTBXvDNW5cA==" }, "node_modules/@emotion/weak-memoize": { "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==", - "dev": true + "integrity": "sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==" }, "node_modules/@esbuild/aix-ppc64": { "version": "0.24.0", @@ -2212,13 +2207,12 @@ } }, "node_modules/@esbuild/linux-x64": { - "version": "0.23.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.23.1.tgz", - "integrity": "sha512-EV6+ovTsEXCPAp58g2dD68LxoP/wK5pRvgy0J/HxPGB009omFPv3Yet0HiaqvrIrgPTBuC6wCH1LTOY91EO5hQ==", + "version": "0.24.0", + "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.24.0.tgz", + "integrity": "sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==", "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -2436,6 +2430,40 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/@floating-ui/core": { + "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.2.8" + } + }, + "node_modules/@floating-ui/dom": { + "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.6.0", + "@floating-ui/utils": "^0.2.8" + } + }, + "node_modules/@floating-ui/react-dom": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.2.tgz", + "integrity": "sha512-06okr5cgPzMNBy+Ycse2A6udMi4bqwW/zgBF/rwjcNqWkyr82Mcg8b0vjX8OJpZFy/FKjJmw6wV7t44kK6kW7A==", + "dependencies": { + "@floating-ui/dom": "^1.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" + } + }, + "node_modules/@floating-ui/utils": { + "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/@fontsource/material-icons": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/@fontsource/material-icons/-/material-icons-5.1.0.tgz", @@ -3026,7 +3054,6 @@ "version": "5.16.7", "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-5.16.7.tgz", "integrity": "sha512-RtsCt4Geed2/v74sbihWzzRs+HsIQCfclHeORh5Ynu2fS4icIKozcSubwuG7vtzq2uW3fOR1zITSP84TNt2GoQ==", - "dev": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/mui-org" @@ -3104,7 +3131,6 @@ "version": "5.16.5", "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.16.5.tgz", "integrity": "sha512-eQrjjg4JeczXvh/+8yvJkxWIiKNHVptB/AqpsKfZBWp5mUD5U3VsjODMuUl1K2BSq0omV3CiO/mQmWSSMKSmaA==", - "dev": true, "dependencies": { "@babel/runtime": "^7.23.9", "@mui/core-downloads-tracker": "^5.16.5", @@ -3149,7 +3175,6 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", - "dev": true, "engines": { "node": ">=6" } @@ -3158,7 +3183,6 @@ "version": "5.16.6", "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.16.6.tgz", "integrity": "sha512-rAk+Rh8Clg7Cd7shZhyt2HGTTE5wYKNSJ5sspf28Fqm/PZ69Er9o6KX25g03/FG2dfpg5GCwZh/xOojiTfm3hw==", - "dev": true, "dependencies": { "@babel/runtime": "^7.23.9", "@mui/utils": "^5.16.6", @@ -3185,7 +3209,6 @@ "version": "5.16.6", "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.16.6.tgz", "integrity": "sha512-zaThmS67ZmtHSWToTiHslbI8jwrmITcN93LQaR2lKArbvS7Z3iLkwRoiikNWutx9MBs8Q6okKvbZq1RQYB3v7g==", - "dev": true, "dependencies": { "@babel/runtime": "^7.23.9", "@emotion/cache": "^11.11.0", @@ -3217,7 +3240,6 @@ "version": "5.16.7", "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.16.7.tgz", "integrity": "sha512-Jncvs/r/d/itkxh7O7opOunTqbbSSzMTHzZkNLM+FjAOg+cYAZHrPDlYe1ZGKUYORwwb2XexlWnpZp0kZ4AHuA==", - "dev": true, "dependencies": { "@babel/runtime": "^7.23.9", "@mui/private-theming": "^5.16.6", @@ -3257,7 +3279,6 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", - "dev": true, "engines": { "node": ">=6" } @@ -3266,7 +3287,6 @@ "version": "7.2.18", "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.18.tgz", "integrity": "sha512-uvK9dWeyCJl/3ocVnTOS6nlji/Knj8/tVqVX03UVTpdmTJYu/s4jtDd9Kvv0nRGE0CUSNW1UYAci7PYypjealg==", - "dev": true, "peerDependencies": { "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0" }, @@ -3280,7 +3300,6 @@ "version": "5.16.6", "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.16.6.tgz", "integrity": "sha512-tWiQqlhxAt3KENNiSRL+DIn9H5xNVK6Jjf70x3PnfQPz1MPBdh7yyIcAyVBT9xiw7hP3SomRhPR7hzBMBCjqEA==", - "dev": true, "dependencies": { "@babel/runtime": "^7.23.9", "@mui/types": "^7.2.15", @@ -3522,6 +3541,7 @@ "cpu": [ "x64" ], + "dev": true, "optional": true, "os": [ "linux" @@ -3538,7 +3558,6 @@ "version": "2.11.8", "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", - "dev": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/popperjs" @@ -4218,6 +4237,429 @@ "storybook": "^8.3.6" } }, + "node_modules/@storybook/core/node_modules/@esbuild/aix-ppc64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.23.1.tgz", + "integrity": "sha512-6VhYk1diRqrhBAqpJEdjASR/+WVRtfjpqKuNw11cLiaWpAT/Uu+nokB+UJnevzy/P9C/ty6AOe0dwueMrGh/iQ==", + "cpu": [ + "ppc64" + ], + "dev": true, + "optional": true, + "os": [ + "aix" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/android-arm": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.23.1.tgz", + "integrity": "sha512-uz6/tEy2IFm9RYOyvKl88zdzZfwEfKZmnX9Cj1BHjeSGNuGLuMD1kR8y5bteYmwqKm1tj8m4cb/aKEorr6fHWQ==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/android-arm64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.23.1.tgz", + "integrity": "sha512-xw50ipykXcLstLeWH7WRdQuysJqejuAGPd30vd1i5zSyKK3WE+ijzHmLKxdiCMtH1pHz78rOg0BKSYOSB/2Khw==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/android-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.23.1.tgz", + "integrity": "sha512-nlN9B69St9BwUoB+jkyU090bru8L0NA3yFvAd7k8dNsVH8bi9a8cUAUSEcEEgTp2z3dbEDGJGfP6VUnkQnlReg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/darwin-arm64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.23.1.tgz", + "integrity": "sha512-YsS2e3Wtgnw7Wq53XXBLcV6JhRsEq8hkfg91ESVadIrzr9wO6jJDMZnCQbHm1Guc5t/CdDiFSSfWP58FNuvT3Q==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/darwin-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.23.1.tgz", + "integrity": "sha512-aClqdgTDVPSEGgoCS8QDG37Gu8yc9lTHNAQlsztQ6ENetKEO//b8y31MMu2ZaPbn4kVsIABzVLXYLhCGekGDqw==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/freebsd-arm64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.23.1.tgz", + "integrity": "sha512-h1k6yS8/pN/NHlMl5+v4XPfikhJulk4G+tKGFIOwURBSFzE8bixw1ebjluLOjfwtLqY0kewfjLSrO6tN2MgIhA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/freebsd-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.23.1.tgz", + "integrity": "sha512-lK1eJeyk1ZX8UklqFd/3A60UuZ/6UVfGT2LuGo3Wp4/z7eRTRYY+0xOu2kpClP+vMTi9wKOfXi2vjUpO1Ro76g==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-arm": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.23.1.tgz", + "integrity": "sha512-CXXkzgn+dXAPs3WBwE+Kvnrf4WECwBdfjfeYHpMeVxWE0EceB6vhWGShs6wi0IYEqMSIzdOF1XjQ/Mkm5d7ZdQ==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-arm64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.23.1.tgz", + "integrity": "sha512-/93bf2yxencYDnItMYV/v116zff6UyTjo4EtEQjUBeGiVpMmffDNUyD9UN2zV+V3LRV3/on4xdZ26NKzn6754g==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-ia32": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.23.1.tgz", + "integrity": "sha512-VTN4EuOHwXEkXzX5nTvVY4s7E/Krz7COC8xkftbbKRYAl96vPiUssGkeMELQMOnLOJ8k3BY1+ZY52tttZnHcXQ==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-loong64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.23.1.tgz", + "integrity": "sha512-Vx09LzEoBa5zDnieH8LSMRToj7ir/Jeq0Gu6qJ/1GcBq9GkfoEAoXvLiW1U9J1qE/Y/Oyaq33w5p2ZWrNNHNEw==", + "cpu": [ + "loong64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-mips64el": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.23.1.tgz", + "integrity": "sha512-nrFzzMQ7W4WRLNUOU5dlWAqa6yVeI0P78WKGUo7lg2HShq/yx+UYkeNSE0SSfSure0SqgnsxPvmAUu/vu0E+3Q==", + "cpu": [ + "mips64el" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-ppc64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.23.1.tgz", + "integrity": "sha512-dKN8fgVqd0vUIjxuJI6P/9SSSe/mB9rvA98CSH2sJnlZ/OCZWO1DJvxj8jvKTfYUdGfcq2dDxoKaC6bHuTlgcw==", + "cpu": [ + "ppc64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-riscv64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.23.1.tgz", + "integrity": "sha512-5AV4Pzp80fhHL83JM6LoA6pTQVWgB1HovMBsLQ9OZWLDqVY8MVobBXNSmAJi//Csh6tcY7e7Lny2Hg1tElMjIA==", + "cpu": [ + "riscv64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-s390x": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.23.1.tgz", + "integrity": "sha512-9ygs73tuFCe6f6m/Tb+9LtYxWR4c9yg7zjt2cYkjDbDpV/xVn+68cQxMXCjUpYwEkze2RcU/rMnfIXNRFmSoDw==", + "cpu": [ + "s390x" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/linux-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.23.1.tgz", + "integrity": "sha512-EV6+ovTsEXCPAp58g2dD68LxoP/wK5pRvgy0J/HxPGB009omFPv3Yet0HiaqvrIrgPTBuC6wCH1LTOY91EO5hQ==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/netbsd-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.23.1.tgz", + "integrity": "sha512-aevEkCNu7KlPRpYLjwmdcuNz6bDFiE7Z8XC4CPqExjTvrHugh28QzUXVOZtiYghciKUacNktqxdpymplil1beA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "netbsd" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/openbsd-arm64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.23.1.tgz", + "integrity": "sha512-3x37szhLexNA4bXhLrCC/LImN/YtWis6WXr1VESlfVtVeoFJBRINPJ3f0a/6LV8zpikqoUg4hyXw0sFBt5Cr+Q==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "openbsd" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/openbsd-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.23.1.tgz", + "integrity": "sha512-aY2gMmKmPhxfU+0EdnN+XNtGbjfQgwZj43k8G3fyrDM/UdZww6xrWxmDkuz2eCZchqVeABjV5BpildOrUbBTqA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "openbsd" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/sunos-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.23.1.tgz", + "integrity": "sha512-RBRT2gqEl0IKQABT4XTj78tpk9v7ehp+mazn2HbUeZl1YMdaGAQqhapjGTCe7uw7y0frDi4gS0uHzhvpFuI1sA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "sunos" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/win32-arm64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.23.1.tgz", + "integrity": "sha512-4O+gPR5rEBe2FpKOVyiJ7wNDPA8nGzDuJ6gN4okSA1gEOYZ67N8JPk58tkWtdtPeLz7lBnY6I5L3jdsr3S+A6A==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/win32-ia32": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.23.1.tgz", + "integrity": "sha512-BcaL0Vn6QwCwre3Y717nVHZbAa4UBEigzFm6VdsVdT/MbZ38xoj1X9HPkZhbmaBGUD1W8vxAfffbDe8bA6AKnQ==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/@esbuild/win32-x64": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.23.1.tgz", + "integrity": "sha512-BHpFFeslkWrXWyUPnbKm+xYYVYruCinGcftSBaa8zoF9hZO4BcSCFUvHVTtzpIY6YzUnYtuEhZ+C9iEXjxnasg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=18" + } + }, + "node_modules/@storybook/core/node_modules/esbuild": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.23.1.tgz", + "integrity": "sha512-VVNz/9Sa0bs5SELtn3f7qhJCDPCF5oMEl5cO9/SSinpE9hbPVvxbd572HH5AKiP7WD8INO53GgfDDhRjkylHEg==", + "dev": true, + "hasInstallScript": true, + "bin": { + "esbuild": "bin/esbuild" + }, + "engines": { + "node": ">=18" + }, + "optionalDependencies": { + "@esbuild/aix-ppc64": "0.23.1", + "@esbuild/android-arm": "0.23.1", + "@esbuild/android-arm64": "0.23.1", + "@esbuild/android-x64": "0.23.1", + "@esbuild/darwin-arm64": "0.23.1", + "@esbuild/darwin-x64": "0.23.1", + "@esbuild/freebsd-arm64": "0.23.1", + "@esbuild/freebsd-x64": "0.23.1", + "@esbuild/linux-arm": "0.23.1", + "@esbuild/linux-arm64": "0.23.1", + "@esbuild/linux-ia32": "0.23.1", + "@esbuild/linux-loong64": "0.23.1", + "@esbuild/linux-mips64el": "0.23.1", + "@esbuild/linux-ppc64": "0.23.1", + "@esbuild/linux-riscv64": "0.23.1", + "@esbuild/linux-s390x": "0.23.1", + "@esbuild/linux-x64": "0.23.1", + "@esbuild/netbsd-x64": "0.23.1", + "@esbuild/openbsd-arm64": "0.23.1", + "@esbuild/openbsd-x64": "0.23.1", + "@esbuild/sunos-x64": "0.23.1", + "@esbuild/win32-arm64": "0.23.1", + "@esbuild/win32-ia32": "0.23.1", + "@esbuild/win32-x64": "0.23.1" + } + }, "node_modules/@storybook/core/node_modules/semver": { "version": "7.6.3", "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz", @@ -5245,13 +5687,12 @@ "version": "4.0.2", "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.2.tgz", "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==", - "dev": true + "devOptional": true }, "node_modules/@types/prop-types": { "version": "15.7.13", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.13.tgz", - "integrity": "sha512-hCZTSvwbzWGvhqxp/RqVqwU999pBf2vp7hzIjiYOsl8wqOmUxkQ6ddw1cV3l8811+kdUFus/q4d1Y3E3SyEifA==", - "dev": true + "integrity": "sha512-hCZTSvwbzWGvhqxp/RqVqwU999pBf2vp7hzIjiYOsl8wqOmUxkQ6ddw1cV3l8811+kdUFus/q4d1Y3E3SyEifA==" }, "node_modules/@types/qs": { "version": "6.9.16", @@ -5269,7 +5710,6 @@ "version": "18.3.12", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.12.tgz", "integrity": "sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==", - "dev": true, "dependencies": { "@types/prop-types": "*", "csstype": "^3.0.2" @@ -5288,7 +5728,6 @@ "version": "4.4.11", "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.11.tgz", "integrity": "sha512-RM05tAniPZ5DZPzzNFP+DmrcOdD0efDUxMy3145oljWSl3x9ZV5vhme98gTxFrj2lhXvmGNnUiuDyJgY9IKkNA==", - "dev": true, "dependencies": { "@types/react": "*" } @@ -6486,7 +6925,7 @@ "version": "3.1.0", "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz", "integrity": "sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==", - "dev": true, + "devOptional": true, "dependencies": { "@babel/runtime": "^7.12.5", "cosmiconfig": "^7.0.0", @@ -6501,7 +6940,7 @@ "version": "7.1.0", "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz", "integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==", - "dev": true, + "devOptional": true, "dependencies": { "@types/parse-json": "^4.0.0", "import-fresh": "^3.2.1", @@ -7479,8 +7918,7 @@ "node_modules/csstype": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "dev": true + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" }, "node_modules/data-urls": { "version": "3.0.2", @@ -7788,7 +8226,6 @@ "version": "5.2.1", "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", - "dev": true, "dependencies": { "@babel/runtime": "^7.8.7", "csstype": "^3.0.2" @@ -8149,10 +8586,9 @@ } }, "node_modules/esbuild": { - "version": "0.23.1", - "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.23.1.tgz", - "integrity": "sha512-VVNz/9Sa0bs5SELtn3f7qhJCDPCF5oMEl5cO9/SSinpE9hbPVvxbd572HH5AKiP7WD8INO53GgfDDhRjkylHEg==", - "dev": true, + "version": "0.24.0", + "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.24.0.tgz", + "integrity": "sha512-FuLPevChGDshgSicjisSooU0cemp/sGXR841D5LHMB7mTVOmsEHcAxaH3irL53+8YDIeVNQEySh4DaYU/iuPqQ==", "hasInstallScript": true, "bin": { "esbuild": "bin/esbuild" @@ -8161,30 +8597,30 @@ "node": ">=18" }, "optionalDependencies": { - "@esbuild/aix-ppc64": "0.23.1", - "@esbuild/android-arm": "0.23.1", - "@esbuild/android-arm64": "0.23.1", - "@esbuild/android-x64": "0.23.1", - "@esbuild/darwin-arm64": "0.23.1", - "@esbuild/darwin-x64": "0.23.1", - "@esbuild/freebsd-arm64": "0.23.1", - "@esbuild/freebsd-x64": "0.23.1", - "@esbuild/linux-arm": "0.23.1", - "@esbuild/linux-arm64": "0.23.1", - "@esbuild/linux-ia32": "0.23.1", - "@esbuild/linux-loong64": "0.23.1", - "@esbuild/linux-mips64el": "0.23.1", - "@esbuild/linux-ppc64": "0.23.1", - "@esbuild/linux-riscv64": "0.23.1", - "@esbuild/linux-s390x": "0.23.1", - "@esbuild/linux-x64": "0.23.1", - "@esbuild/netbsd-x64": "0.23.1", - "@esbuild/openbsd-arm64": "0.23.1", - "@esbuild/openbsd-x64": "0.23.1", - "@esbuild/sunos-x64": "0.23.1", - "@esbuild/win32-arm64": "0.23.1", - "@esbuild/win32-ia32": "0.23.1", - "@esbuild/win32-x64": "0.23.1" + "@esbuild/aix-ppc64": "0.24.0", + "@esbuild/android-arm": "0.24.0", + "@esbuild/android-arm64": "0.24.0", + "@esbuild/android-x64": "0.24.0", + "@esbuild/darwin-arm64": "0.24.0", + "@esbuild/darwin-x64": "0.24.0", + "@esbuild/freebsd-arm64": "0.24.0", + "@esbuild/freebsd-x64": "0.24.0", + "@esbuild/linux-arm": "0.24.0", + "@esbuild/linux-arm64": "0.24.0", + "@esbuild/linux-ia32": "0.24.0", + "@esbuild/linux-loong64": "0.24.0", + "@esbuild/linux-mips64el": "0.24.0", + "@esbuild/linux-ppc64": "0.24.0", + "@esbuild/linux-riscv64": "0.24.0", + "@esbuild/linux-s390x": "0.24.0", + "@esbuild/linux-x64": "0.24.0", + "@esbuild/netbsd-x64": "0.24.0", + "@esbuild/openbsd-arm64": "0.24.0", + "@esbuild/openbsd-x64": "0.24.0", + "@esbuild/sunos-x64": "0.24.0", + "@esbuild/win32-arm64": "0.24.0", + "@esbuild/win32-ia32": "0.24.0", + "@esbuild/win32-x64": "0.24.0" } }, "node_modules/esbuild-register": { @@ -8217,7 +8653,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", - "dev": true, + "devOptional": true, "engines": { "node": ">=10" }, @@ -8867,7 +9303,7 @@ "version": "1.1.0", "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==", - "dev": true + "devOptional": true }, "node_modules/find-up": { "version": "5.0.0", @@ -9603,7 +10039,7 @@ "version": "3.3.2", "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", - "dev": true, + "devOptional": true, "dependencies": { "react-is": "^16.7.0" } @@ -9612,7 +10048,7 @@ "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "dev": true + "devOptional": true }, "node_modules/html-encoding-sniffer": { "version": "3.0.0", @@ -12058,6 +12494,34 @@ "node": ">= 0.10" } }, + "node_modules/moment": { + "version": "2.30.1", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz", + "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==", + "devOptional": true, + "engines": { + "node": "*" + } + }, + "node_modules/moment-timezone": { + "version": "0.5.46", + "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.46.tgz", + "integrity": "sha512-ZXm9b36esbe7OmdABqIWJuBBiLLwAjrN7CE+7sYdCCx82Nabt1wHDj8TVseS59QIlfFPbOoiBPm6ca9BioG4hw==", + "dev": true, + "dependencies": { + "moment": "^2.29.4" + }, + "engines": { + "node": "*" + } + }, + "node_modules/momentjs": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/momentjs/-/momentjs-2.0.0.tgz", + "integrity": "sha512-GYMUxLyCwVhECkJR1/LMHEyb9gWYSPRnXi+elGN0m5bet7ngQOxU4QLWUI/eBzgN4N/T194n6yP7lQiE+Udw9A==", + "deprecated": "WARNING: The correct package name for Moment.js is 'moment', not 'momentjs'.", + "dev": true + }, "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", @@ -12192,7 +12656,6 @@ "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -13466,7 +13929,6 @@ "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", - "dev": true, "dependencies": { "loose-envify": "^1.4.0", "object-assign": "^4.1.1", @@ -13476,8 +13938,7 @@ "node_modules/prop-types/node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "dev": true + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, "node_modules/proxy-addr": { "version": "2.0.7", @@ -13682,14 +14143,12 @@ "node_modules/react-is": { "version": "18.3.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz", - "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==", - "dev": true + "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==" }, "node_modules/react-transition-group": { "version": "4.4.5", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==", - "dev": true, "dependencies": { "@babel/runtime": "^7.5.5", "dom-helpers": "^5.0.1", @@ -14613,7 +15072,7 @@ "version": "0.5.7", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==", - "dev": true, + "devOptional": true, "engines": { "node": ">=0.10.0" } @@ -14964,8 +15423,7 @@ "node_modules/stylis": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz", - "integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==", - "dev": true + "integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==" }, "node_modules/supports-color": { "version": "7.2.0", @@ -16275,7 +16733,7 @@ "version": "1.10.2", "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz", "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==", - "dev": true, + "devOptional": true, "engines": { "node": ">= 6" } diff --git a/package.json b/package.json index 2fdd0ea..3a27f96 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@drt/drt-react-components", - "version": "1.5.6", + "version": "1.6.0", "description": "React components for DRT applications", "main": "dist/cjs/bundle.js", "module": "dist/esm/bundle.js", diff --git a/src/components/FlightFlagger/FlightFlagger.stories.tsx b/src/components/FlightFlagger/FlightFlagger.stories.tsx index 7c6077e..f424238 100644 --- a/src/components/FlightFlagger/FlightFlagger.stories.tsx +++ b/src/components/FlightFlagger/FlightFlagger.stories.tsx @@ -6,7 +6,7 @@ import type {Meta, StoryObj} from '@storybook/react'; import {default as FlightFlaggerComponent} from "./"; const meta: Meta = { - title: "DRT Components/Flight Flagger", + title: "DRT Components/Features/Flight Flagger", component: FlightFlaggerComponent, }; diff --git a/src/components/FlightFlagger/FlightFlaggerCard.tsx b/src/components/FlightFlagger/FlightFlaggerCard.tsx index 3414b06..4ec1c22 100644 --- a/src/components/FlightFlagger/FlightFlaggerCard.tsx +++ b/src/components/FlightFlagger/FlightFlaggerCard.tsx @@ -1,7 +1,7 @@ import React from "react"; import { Button, Box, Card, CardContent, Typography, Chip, Paper, BoxProps } from "@mui/material"; import ArrowRightIcon from '@mui/icons-material/ArrowRight'; -import { StatusTag } from "../StatusTags"; +import { StatusTag } from "../ui/StatusTags"; import { styled } from '@mui/material/styles'; import { getConfidenceAlert } from "./FlightFlaggerTable"; import { FlightArrival } from "./FlightArrival"; diff --git a/src/components/FlightFlagger/FlightFlaggerFilters.stories.tsx b/src/components/FlightFlagger/FlightFlaggerFilters.stories.tsx index 432bb7f..49a254c 100644 --- a/src/components/FlightFlagger/FlightFlaggerFilters.stories.tsx +++ b/src/components/FlightFlagger/FlightFlaggerFilters.stories.tsx @@ -5,14 +5,14 @@ import { } from "./FlightFlaggerFilters"; const meta: Meta = { - title: "DRT Components/Flight Flagger", + title: "DRT Components/Features/Flight Flagger/Filters", component: FlightFlaggerFiltersComponent, }; export default meta; type Story = StoryObj; -export const FlightFlaggerFilters: Story = { +export const Filters: Story = { args: { nationalities: [ {name: 'Great Britain', code: 'GBR'}, diff --git a/src/components/FlightFlagger/FlightFlaggerFilters.tsx b/src/components/FlightFlagger/FlightFlaggerFilters.tsx index f158eff..5a8d3a4 100644 --- a/src/components/FlightFlagger/FlightFlaggerFilters.tsx +++ b/src/components/FlightFlagger/FlightFlaggerFilters.tsx @@ -99,7 +99,7 @@ export const FlightFlaggerFilters = ({ const [currentFormState, setCurrentFormState] = useState(initialFormState) const [appliedSearchFlags, setAppliedSearchFlags] = useState(initialFormState) - const formIsTouched = (initialForm, currentForm) => { + const formIsTouched = (initialForm: FormState, currentForm: FormState) => { return currentForm.selectedNationalities.length !== initialForm.selectedNationalities.length || currentForm.selectedAgeGroups.length !== initialForm.selectedAgeGroups.length || currentForm.showTransitPaxNumber != initialForm.showTransitPaxNumber || diff --git a/src/components/FlightFlagger/FlightFlaggerHighlightChip.stories.tsx b/src/components/FlightFlagger/FlightFlaggerHighlightChip.stories.tsx index 1c834b7..84a0951 100644 --- a/src/components/FlightFlagger/FlightFlaggerHighlightChip.stories.tsx +++ b/src/components/FlightFlagger/FlightFlaggerHighlightChip.stories.tsx @@ -3,14 +3,14 @@ import type { Meta, StoryObj } from '@storybook/react'; import { FlightHighlightChip as FlightHighlightChipComponent } from './FlightFlaggerHighlightChip'; const meta: Meta = { - title: "DRT Components/Flight Flagger", + title: "DRT Components/Features/Flight Flagger/Highlight Chip", component: FlightHighlightChipComponent, }; export default meta; type Story = StoryObj; -export const FlightHighlightChip: Story = { +export const HighlightChip: Story = { args: { text: 'Highlighted info', }, diff --git a/src/components/FlightFlagger/FlightFlaggerHighlightChip.tsx b/src/components/FlightFlagger/FlightFlaggerHighlightChip.tsx index 51148da..f1ea09f 100644 --- a/src/components/FlightFlagger/FlightFlaggerHighlightChip.tsx +++ b/src/components/FlightFlagger/FlightFlaggerHighlightChip.tsx @@ -1,5 +1,5 @@ import React from "react"; -import { Chip } from "@mui/material"; +import { Box, Chip } from "@mui/material"; import TungstenIcon from '@mui/icons-material/Tungsten'; import CustomHighlightIcon from './icon-highlight-pax.svg' @@ -8,7 +8,7 @@ export interface IFlightHighlightChip { } const HighlightIcon = () => { - return + return } export const FlightHighlightChip = ({text}: IFlightHighlightChip) => { diff --git a/src/components/FlightFlagger/FlightFlaggerResults.stories.tsx b/src/components/FlightFlagger/FlightFlaggerResults.stories.tsx index 256be97..6feb1c0 100644 --- a/src/components/FlightFlagger/FlightFlaggerResults.stories.tsx +++ b/src/components/FlightFlagger/FlightFlaggerResults.stories.tsx @@ -4,7 +4,7 @@ import ExampleFlights from "./ExampleFlights"; import type { Meta, StoryObj } from '@storybook/react'; const meta: Meta = { - title: "DRT Components/Flight Flagger", + title: "DRT Components/Features/Flight Flagger/Flight Flagger Results", component: FlightFlaggerResultsComponent, }; diff --git a/src/components/FlightFlagger/FlightFlaggerResults.tsx b/src/components/FlightFlagger/FlightFlaggerResults.tsx index 9511e97..77e8673 100644 --- a/src/components/FlightFlagger/FlightFlaggerResults.tsx +++ b/src/components/FlightFlagger/FlightFlaggerResults.tsx @@ -21,7 +21,7 @@ export const FlightFlaggerResults = ({flights, showHighlightOnly}: IFlightFlagge flights = flights.filter(flight => flight.highlights) } return isMobile ? - + ({backgroundColor: theme.palette.secondary.light, p: 2})}> {resultCount} { flights.map((flight: FlightArrival, index: number) => { return diff --git a/src/components/FlightFlagger/FlightFlaggerTable.tsx b/src/components/FlightFlagger/FlightFlaggerTable.tsx index bb20651..dd3c964 100644 --- a/src/components/FlightFlagger/FlightFlaggerTable.tsx +++ b/src/components/FlightFlagger/FlightFlaggerTable.tsx @@ -1,10 +1,11 @@ import React from "react"; import { Table, TableCell, TableRow, Tooltip, TooltipProps, IconButton } from "@mui/material"; -import { StyledTableHeader, StyledTableHeaderCell, StyledTableBody, RelativeTableCell, CellStatusHighlight } from "../StyledTable"; +import { StyledTableHeader, StyledTableHeaderCell, StyledTableBody, RelativeTableCell, CellStatusHighlight } from "../ui/StyledTable"; import { FlightHighlightChip } from "./FlightFlaggerHighlightChip"; import { FlightArrival } from "./FlightArrival"; import InfoIcon from '@mui/icons-material/Info'; import { styled } from '@mui/material/styles'; +import {InfoTooltip} from "../ui/InfoTooltip/InfoTooltip"; export interface IFlightCard { flight: FlightArrival @@ -48,22 +49,14 @@ export const FlightFlaggerTable = ({flights, ...others}: IFlightFlaggerTable) => Origin Country - - - - - + Gate/Stand Status Scheduled Expected - - - - - + Exp PCP Exp PCP Pax diff --git a/src/components/FlightFlagger/icon-highlight-pax.svg b/src/components/FlightFlagger/icon-highlight-pax.svg index 5aac0df..5f20954 100644 --- a/src/components/FlightFlagger/icon-highlight-pax.svg +++ b/src/components/FlightFlagger/icon-highlight-pax.svg @@ -1 +1 @@ - + diff --git a/src/components/Header/Header.stories.tsx b/src/components/Header/Header.stories.tsx index 85d5bb6..456bd80 100644 --- a/src/components/Header/Header.stories.tsx +++ b/src/components/Header/Header.stories.tsx @@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react'; import { default as HeaderComponent } from "."; const meta: Meta = { - title: "DRT Components/Header", + title: "DRT Components/UI/Header", component: HeaderComponent, }; diff --git a/src/components/Pax/PaxCard/PaxCard.stories.tsx b/src/components/Pax/PaxCard/PaxCard.stories.tsx new file mode 100644 index 0000000..da267ba --- /dev/null +++ b/src/components/Pax/PaxCard/PaxCard.stories.tsx @@ -0,0 +1,80 @@ +import * as React from 'react'; +import { PaxCard as PaxCardComponent } from './PaxCard'; +import { PaxTimeRange } from './PaxCard'; + +import type { Meta, StoryObj } from '@storybook/react'; +import { Stack } from '@mui/material'; + +const meta: Meta = { + title: "DRT Components/Features/Pax/PaxCard", + component: PaxCardComponent, +}; + +export default meta; +type Story = StoryObj; + +const startTime1 = new Date(); +const startTime2 = new Date(); +const startTime3 = new Date(); +const endTime1 = new Date(); +const endTime2 = new Date(); +const endTime3 = new Date(); + +const queues = [ + { queueName: 'EEA', queueCount: 77 }, + { queueName: 'Non-EEA', queueCount: 128 }, + { queueName: 'EEA', queueCount: 213 } +] + + +startTime1.setHours(11, 26); +endTime1.setHours(11, 26); + +startTime2.setHours(11, 26); +endTime2.setHours(11, 31); + +startTime3.setHours(11, 31); +endTime3.setHours(11, 36); + +export const PaxCardSingle:Story = { + args: { + queues: queues, + timeRange: PaxTimeRange.Next5Mins, + startTime: startTime1, + endTime: endTime1 + } +} + +export const PaxCardGroup: Story = { + render: () => { + return ( + ({ + p:2, + backgroundColor: theme.palette.secondary.light || theme.palette.grey[200] + })}> + + + + + ) + } +}; diff --git a/src/components/Pax/PaxCard/PaxCard.tsx b/src/components/Pax/PaxCard/PaxCard.tsx new file mode 100644 index 0000000..1f9dbcd --- /dev/null +++ b/src/components/Pax/PaxCard/PaxCard.tsx @@ -0,0 +1,81 @@ +import { BorderBottom } from '@mui/icons-material'; +import { Paper, styled, Theme, Typography, Table, TableHead, TableRow, TableCell, TableBody } from '@mui/material'; +import * as React from 'react'; + + +export enum PaxTimeRange { + Next5Mins = 'Next 5 Mins', + Next5to10Mins = 'Next 5 to 10 Mins', + Next10to15Mins = 'Next 10 to 15 Mins', +} + +export type PortQueue = { + queueName: string, + queueCount: number +} + +export interface IPaxCard { + queues: PortQueue[], + timeRange: PaxTimeRange, + startTime: Date, + endTime: Date, +} + +const StyledPaxCard = styled(Paper)(({theme} : {theme: Theme}) => ({ + display: 'inline-block', + padding: theme.spacing(2), + backgroundColor: theme.palette.grey[100], + '.MuiTableCell-root': { + backgroundColor: theme.palette.background.default, + color: theme.palette.common.black, + padding: `${theme.spacing(1)} ${theme.spacing(0)}` + }, + '& .MuiTableRow-root :first-child': { + paddingRight: theme.spacing(1) + }, + '& .MuiTableCell-head': { + borderBottom: `1px solid ${theme.palette.common.black}`, + }, + '& .MuiTableBody-root .MuiTableCell-root': { + borderBottom: 'none !important', + } +})); + +const formatTime = (datetime:Date) => { + return `${datetime.getHours()}:${datetime.getMinutes()}` +} + +export const PaxCard = ({queues, timeRange, startTime, endTime}: IPaxCard) => { + + + return ( + + {timeRange} + + {`(${formatTime(startTime)} to ${formatTime(endTime)})`} + + + + + + Estimated pax: + { queues.reduce((sum, q) => sum + q.queueCount, 0)} + + + + { + queues.map((queue) => { + return ( + + {`${queue.queueName}:`} + { queue.queueCount } + + ) + }) + } + +
+ + + ) +} diff --git a/src/components/Pax/PaxCard/index.tsx b/src/components/Pax/PaxCard/index.tsx new file mode 100644 index 0000000..9b97dab --- /dev/null +++ b/src/components/Pax/PaxCard/index.tsx @@ -0,0 +1,2 @@ +export { PaxCard } from "./PaxCard"; +export type { IPaxCard, PaxTimeRange, PortQueue } from "./PaxCard"; diff --git a/src/components/Pax/PaxDatasourceIcon/DatasourceIcon.svg b/src/components/Pax/PaxDatasourceIcon/DatasourceIcon.svg new file mode 100644 index 0000000..af9b610 --- /dev/null +++ b/src/components/Pax/PaxDatasourceIcon/DatasourceIcon.svg @@ -0,0 +1,35 @@ + + + + + + + + + + diff --git a/src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.stories.tsx b/src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.stories.tsx new file mode 100644 index 0000000..ed6ada4 --- /dev/null +++ b/src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.stories.tsx @@ -0,0 +1,62 @@ +import * as React from 'react'; +import { PaxDatasource } from './PaxDatasourceIcon'; +import { DatasourceStatus } from '../PaxUtils'; + +import type { Meta, StoryObj } from '@storybook/react'; + +const meta: Meta = { + title: "DRT Components/Features/Pax/PaxDatasource", + component: PaxDatasource, +}; + +export default meta; +type Story = StoryObj; + +export const Estimate: Story = { + args: { + status: DatasourceStatus.Estimate, + }, +}; + +export const PortForecast: Story = { + args: { + status: DatasourceStatus.PortForecast, + }, +}; + +export const DRTForecast: Story = { + args: { + status: DatasourceStatus.DRTForecast, + }, +}; + +export const PortLiveData: Story = { + args: { + status: DatasourceStatus.PortLiveData, + }, +}; + +export const CarrierData: Story = { + args: { + status: DatasourceStatus.CarrierData, + }, +}; + +export const TerminalAverageData: Story = { + args: { + status: DatasourceStatus.TerminalAverageData, + }, +}; + +export const PastCarrierData: Story = { + args: { + status: DatasourceStatus.PastCarrierData, + }, +}; + +export const VerifiedCarrierData: Story = { + args: { + status: DatasourceStatus.VerifiedCarrierData, + }, +}; + diff --git a/src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.tsx b/src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.tsx new file mode 100644 index 0000000..f7cbb56 --- /dev/null +++ b/src/components/Pax/PaxDatasourceIcon/PaxDatasourceIcon.tsx @@ -0,0 +1,23 @@ +import React from "react"; +import DatasourceIcon from './DatasourceIcon.svg'; +import { Tooltip, Box } from "@mui/material"; + +import { DatasourceStatus, getPaxContent } from "../PaxUtils"; + +export interface IPaxDatasource { + status: DatasourceStatus, +} + +export const PaxDatasource = ({status}: IPaxDatasource) => { + + const content = getPaxContent(status); + + return ( + + + + { content.icon } + + + ) +} diff --git a/src/components/Pax/PaxDatasourceIcon/index.ts b/src/components/Pax/PaxDatasourceIcon/index.ts new file mode 100644 index 0000000..61ca41e --- /dev/null +++ b/src/components/Pax/PaxDatasourceIcon/index.ts @@ -0,0 +1,2 @@ +export { PaxDatasource } from './PaxDatasourceIcon' +export type {IPaxDatasource} from './PaxDatasourceIcon' diff --git a/src/components/Pax/PaxHighlight/PaxHighlight.stories.tsx b/src/components/Pax/PaxHighlight/PaxHighlight.stories.tsx new file mode 100644 index 0000000..5bf2e61 --- /dev/null +++ b/src/components/Pax/PaxHighlight/PaxHighlight.stories.tsx @@ -0,0 +1,62 @@ +import * as React from 'react'; +import { PaxHighlight } from './PaxHighlight'; +import { DatasourceStatus } from '../PaxUtils'; + +import type { Meta, StoryObj } from '@storybook/react'; + +const meta: Meta = { + title: "DRT Components/Features/Pax/PaxHighlight", + component: PaxHighlight, +}; + +export default meta; +type Story = StoryObj; + +export const Estimate: Story = { + args: { + status: DatasourceStatus.Estimate, + }, +}; + +export const PortForecast: Story = { + args: { + status: DatasourceStatus.PortForecast, + }, +}; + +export const DRTForecast: Story = { + args: { + status: DatasourceStatus.DRTForecast, + }, +}; + +export const PortLiveData: Story = { + args: { + status: DatasourceStatus.PortLiveData, + }, +}; + +export const CarrierData: Story = { + args: { + status: DatasourceStatus.CarrierData, + }, +}; + +export const TerminalAverageData: Story = { + args: { + status: DatasourceStatus.TerminalAverageData, + }, +}; + +export const PastCarrierData: Story = { + args: { + status: DatasourceStatus.PastCarrierData, + }, +}; + +export const VerifiedCarrierData: Story = { + args: { + status: DatasourceStatus.VerifiedCarrierData, + }, +}; + diff --git a/src/components/Pax/PaxHighlight/PaxHighlight.tsx b/src/components/Pax/PaxHighlight/PaxHighlight.tsx new file mode 100644 index 0000000..f04b432 --- /dev/null +++ b/src/components/Pax/PaxHighlight/PaxHighlight.tsx @@ -0,0 +1,16 @@ +import React from "react"; +import { Highlight } from "../../ui/Highlight/Highlight"; +import { DatasourceStatus, getPaxContent } from "../PaxUtils"; + +export interface IPaxHighlight { + status: DatasourceStatus +} + +export const PaxHighlight = ({status}: IPaxHighlight) => { + + const content = getPaxContent(status); + + return ( + + ) +} diff --git a/src/components/Pax/PaxHighlight/index.ts b/src/components/Pax/PaxHighlight/index.ts new file mode 100644 index 0000000..ae87d26 --- /dev/null +++ b/src/components/Pax/PaxHighlight/index.ts @@ -0,0 +1,2 @@ +export { PaxHighlight } from './PaxHighlight' +export type {IPaxHighlight} from './PaxHighlight' diff --git a/src/components/Pax/PaxSearchForm.stories.tsx b/src/components/Pax/PaxSearchForm.stories.tsx new file mode 100644 index 0000000..af68af7 --- /dev/null +++ b/src/components/Pax/PaxSearchForm.stories.tsx @@ -0,0 +1,130 @@ +import * as React from 'react'; +import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment'; +import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider"; +import { DatePicker } from '@mui/x-date-pickers'; +import { TimePicker } from '@mui/x-date-pickers/TimePicker'; +import {InfoTooltip} from '../ui/InfoTooltip'; + + +import { useArgs } from '@storybook/preview-api'; +import type { Meta, StoryObj } from '@storybook/react'; +import { Box, TextField,Grid, ToggleButton, ToggleButtonGroup, Stack, Switch, FormControlLabel, FormLabel, Typography } from '@mui/material'; +import moment from 'moment'; + +interface PaxSearchFormStoryControls { + timeMachine: boolean, + day: "yesterday" | "today" | "tomorrow", + time: "now" | "24hour" +} + +const meta: Meta = { + title: "DRT Components/Features/Pax/Pax Form Layout", + args: { + timeMachine: true, + day: "yesterday", + time: "now" + }, + argTypes: { + timeMachine: { + options: [true, false], + control: { + type: 'radio' + } + }, + day: { + options: ["yesterday", "today", "tomorrow"], + control: { + type: 'radio' + } + }, + time: { + options: ["now", "24hour"], + control: { + type: 'radio' + } + } + } +}; + +export default meta; +type Story = StoryObj; + +export const PaxFormLayout: Story = { + + + render: () => { + const [args, updateArgs] = useArgs(); + + const handleChangeDay = ( event: React.MouseEvent, newValue: string | null) => { + updateArgs({ + ...args, + day: newValue + }); + }; + + const handleChangeTime = ( event: React.MouseEvent, newValue: string | null) => { + updateArgs({ + ...args, + time: newValue + }); + }; + + const handleChangeTimeMachine = ( event: React.ChangeEvent) => { + console.log(event) + updateArgs({ + ...args, + timeMachine: event.target.checked + }); + }; + + return ( + + ({ + maxWidth: '600px', + padding: 2, + backgroundColor: theme.palette.secondary.light || theme.palette.grey[200] + })}> + + + + + Yesterday + Today + Tomorrow + + + Now + 24 hours + + + + + + + + + + + + + + + Time Machine + + + {args.timeMachine ? 'On' : 'Off'} + + + + ) + } +}; diff --git a/src/components/Pax/PaxUtils.tsx b/src/components/Pax/PaxUtils.tsx new file mode 100644 index 0000000..ec7ca25 --- /dev/null +++ b/src/components/Pax/PaxUtils.tsx @@ -0,0 +1,79 @@ +import * as React from 'react' + +import ReportIcon from '@mui/icons-material/Report'; //estimate +import WarningIcon from '@mui/icons-material/Warning'; //port forecast + drtforecast +import CheckCircleIcon from '@mui/icons-material/CheckCircle'; // carrier data +import BeenhereIcon from '@mui/icons-material/Beenhere'; // port live data + +export enum DatasourceStatus { + Estimate = "Estimate", + PortForecast = "Port forecast", + DRTForecast = "DRT forecast", + PortLiveData = "Port live data", + CarrierData = "Carrier data", + TerminalAverageData = "Terminal average data", + PastCarrierData = "Past carrier data", + VerifiedCarrierData = "Verified carrier data", +} + +export type PaxStatusContent = { + paxColor: string, + statusLabel: string, + statusText: string, + icon: React.ReactNode +} + +export const getPaxContent = (status: DatasourceStatus) : PaxStatusContent => { + + const content: PaxStatusContent = { + paxColor: '', + statusLabel: '', + statusText: '', + icon: <> + } + + switch (status) { + case DatasourceStatus.PortForecast: + content.paxColor = "warning" + content.statusText = "Based on an historical average or an estimated load factor"; + content.icon = + break; + case DatasourceStatus.DRTForecast: + content.paxColor = "warning" + content.statusText = "Machine learning from multiple information sources and historical trends"; + content.icon = + break; + case DatasourceStatus.PortLiveData: + content.paxColor = "success" + content.statusText = "Live data from the port operator"; + content.icon = + break; + case DatasourceStatus.CarrierData: + content.paxColor = "info" + content.statusText = "Advance Passenger Information (API) from the carrier"; + content.icon = + break; + case DatasourceStatus.Estimate: + content.paxColor = "error" + content.statusText = "Based on an historical average or an estimated load factor"; + content.icon = + break; + case DatasourceStatus.TerminalAverageData: + content.paxColor = "error" + content.statusText = "Based on historical average pax splits for this terminal"; + content.icon = + break; + case DatasourceStatus.PastCarrierData: + content.paxColor = "warning" + content.statusText = "Based on historical Advance Passenger Information (API) from this flight or route"; + content.icon = + break; + case DatasourceStatus.VerifiedCarrierData: + content.paxColor = "success" + content.statusText = "Advance Passenger Information (API) from the carrier"; + content.icon = + break; + } + + return content +} diff --git a/src/components/Pax/PlaneStatusLabel/PlaneStatus.stories.tsx b/src/components/Pax/PlaneStatusLabel/PlaneStatus.stories.tsx new file mode 100644 index 0000000..1ea4fea --- /dev/null +++ b/src/components/Pax/PlaneStatusLabel/PlaneStatus.stories.tsx @@ -0,0 +1,45 @@ +import * as React from 'react'; +import { PlaneStatusLabel } from './PlaneStatusLabel'; +import { PlaneStatus } from './PlaneStatusLabel'; +import { DatasourceStatus } from '../PaxUtils'; + +import type { Meta, StoryObj } from '@storybook/react'; + +const meta: Meta = { + title: "DRT Components/Features/Pax/PlaneStatusLabel", + component: PlaneStatusLabel, +}; + +export default meta; +type Story = StoryObj; + +export const Delayed: Story = { + args: { + status: PlaneStatus.Delayed, + }, +}; + +export const Cancelled: Story = { + args: { + status: PlaneStatus.Cancelled, + }, +}; + +export const Diverted: Story = { + args: { + status: PlaneStatus.Diverted, + }, +}; + +export const OnChocks: Story = { + args: { + status: PlaneStatus.OnChocks, + }, +}; + +export const OnChocksDelayed: Story = { + args: { + status: PlaneStatus.OnChocksDelayed, + }, +}; + diff --git a/src/components/Pax/PlaneStatusLabel/PlaneStatusLabel.tsx b/src/components/Pax/PlaneStatusLabel/PlaneStatusLabel.tsx new file mode 100644 index 0000000..c7bfd4a --- /dev/null +++ b/src/components/Pax/PlaneStatusLabel/PlaneStatusLabel.tsx @@ -0,0 +1,52 @@ +import { useTheme } from '@mui/material/styles'; +import * as React from 'react'; + +import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline'; +import DoDisturbIcon from '@mui/icons-material/DoDisturb'; +import AirlineStopsIcon from '@mui/icons-material/AirlineStops'; +import { Stack, Typography } from '@mui/material'; + +export enum PlaneStatus { + Delayed = "Delayed", + Cancelled = "Cancelled", + Diverted = "Diverted", + OnChocks = "On chocks", + OnChocksDelayed = "On chocks (delayed)", +} + +export interface IPlaneStatusLabel { + status: PlaneStatus +} + +export const PlaneStatusLabel = ({status}: IPlaneStatusLabel) => { + let icon : React.ReactNode = <>; + let text : string = ''; + let color: string = 'info'; + + switch(status) { + case PlaneStatus.Delayed: + color = 'error'; + icon = ; + break; + case PlaneStatus.Cancelled: + color = 'error'; + icon = ; + break; + case PlaneStatus.Diverted: + color = 'error'; + icon = ; + break; + case PlaneStatus.OnChocks: + color = 'info'; + icon = <>; + break; + case PlaneStatus.OnChocksDelayed: + color = 'error'; + icon = ; + break; + } + + return ( + { icon } { status } + ) +} diff --git a/src/components/Pax/PlaneStatusLabel/index.tsx b/src/components/Pax/PlaneStatusLabel/index.tsx new file mode 100644 index 0000000..9535da0 --- /dev/null +++ b/src/components/Pax/PlaneStatusLabel/index.tsx @@ -0,0 +1,2 @@ +export type { IPlaneStatusLabel } from "./PlaneStatusLabel"; +export { PlaneStatus, PlaneStatusLabel } from "./PlaneStatusLabel"; diff --git a/src/components/Pax/index.ts b/src/components/Pax/index.ts new file mode 100644 index 0000000..36e2112 --- /dev/null +++ b/src/components/Pax/index.ts @@ -0,0 +1,13 @@ +export { DatasourceStatus } from './PaxUtils' + +export { PaxDatasource } from './PaxDatasourceIcon' +export type {IPaxDatasource} from './PaxDatasourceIcon' + +export { PaxHighlight } from './PaxHighlight' +export type { IPaxHighlight } from './PaxHighlight' + +export { PaxCard } from "./PaxCard"; +export type { IPaxCard, PaxTimeRange, PortQueue } from "./PaxCard"; + +export type { IPlaneStatusLabel } from "./PlaneStatusLabel"; +export { PlaneStatus, PlaneStatusLabel } from "./PlaneStatusLabel"; diff --git a/src/components/Staff/StaffUpdateSuccess.stories.tsx b/src/components/Staff/StaffUpdateSuccess.stories.tsx index cc287c2..3b6a3b8 100644 --- a/src/components/Staff/StaffUpdateSuccess.stories.tsx +++ b/src/components/Staff/StaffUpdateSuccess.stories.tsx @@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react'; import { StaffUpdateSuccess as StaffUpdateSuccessComponent } from "./StaffUpdateSuccess"; const meta: Meta = { - title: "DRT Components/StaffSuccessComponent", + title: "DRT Components/Features/Staff/StaffSuccess", component: StaffUpdateSuccessComponent, }; diff --git a/src/components/Staff/UpdateStaffForTimeRangeForm.stories.tsx b/src/components/Staff/UpdateStaffForTimeRangeForm.stories.tsx index ba30229..eaade06 100644 --- a/src/components/Staff/UpdateStaffForTimeRangeForm.stories.tsx +++ b/src/components/Staff/UpdateStaffForTimeRangeForm.stories.tsx @@ -4,7 +4,7 @@ import type {IUpdateStaffForTimeRangeData} from './UpdateStaffForTimeRangeForm' import {UpdateStaffForTimeRangeForm as UpdateStaffForTimeRangeFormComponent} from './UpdateStaffForTimeRangeForm' const meta: Meta = { - title: "DRT Components/UpdateStaffForTimeRangeFormComponent", + title: "DRT Components/Features/Staff/UpdateStaffForTimeRangeFormComponent", component: UpdateStaffForTimeRangeFormComponent, } diff --git a/src/components/Typography.stories.tsx b/src/components/Typography.stories.tsx index 0896482..7d2c991 100644 --- a/src/components/Typography.stories.tsx +++ b/src/components/Typography.stories.tsx @@ -4,7 +4,7 @@ import { Typography as MuiTypography } from "@mui/material"; import type {Meta, StoryObj} from '@storybook/react'; const meta: Meta = { - title: "DRT Components/MUI Components", + title: "DRT Components/MUI Components/Typography", component: MuiTypography, }; diff --git a/src/components/index.ts b/src/components/index.ts index 22322f5..3202090 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -3,8 +3,8 @@ export {default as FlightFlagger} from "./FlightFlagger"; export {FlightFlaggerFilters, FlightHighlightChip} from "./FlightFlagger"; export type {IFlightFlagger, IFlightFlaggerFilters, IFlightHighlightChip} from "./FlightFlagger"; -export {StatusTag} from "./StatusTags"; -export type {IStatusTag} from "./StatusTags"; +export {StatusTag} from "./ui/StatusTags"; +export type {IStatusTag} from "./ui/StatusTags"; export {default as Header} from './Header' export type {IHeader, MenuItem} from './Header'; @@ -14,3 +14,9 @@ export {StaffUpdateSuccess} from './Staff' export type {IUpdateStaffForTimeRangeData, IUpdateStaffForTimeRangeForm} from './Staff' export {UpdateStaffForTimeRangeForm} from './Staff' + +export * from "./Pax"; +export type * from "./Pax"; + +export * from './ui'; +export type * from './ui'; diff --git a/src/components/ui/Highlight/Highlight.stories.tsx b/src/components/ui/Highlight/Highlight.stories.tsx new file mode 100644 index 0000000..c49264a --- /dev/null +++ b/src/components/ui/Highlight/Highlight.stories.tsx @@ -0,0 +1,26 @@ +import * as React from 'react'; +import { Highlight } from './Highlight'; + +import type { Meta, StoryObj } from '@storybook/react'; +import { Stack } from '@mui/material'; + +const meta: Meta = { + title: "DRT Components/UI/Highlight", + component: Highlight, +}; + +export default meta; +type Story = StoryObj; + +export const Info: Story = { + render: (storyContext) => { + return + + + + + + + + } +}; diff --git a/src/components/ui/Highlight/Highlight.tsx b/src/components/ui/Highlight/Highlight.tsx new file mode 100644 index 0000000..12cd2e2 --- /dev/null +++ b/src/components/ui/Highlight/Highlight.tsx @@ -0,0 +1,35 @@ +import React from "react"; +import { bgcolor, Box, styled, Theme } from '@mui/system'; +import { PaletteColor, useTheme } from '@mui/material/styles'; +import { Tooltip, Typography } from "@mui/material"; + +const HighlightWrapper = styled(Typography)(({color, bgColor} : {color: string, bgColor: string}) => ({ + paddingTop: 2, + paddingBottom: 2, + paddingLeft: 4, + paddingRight: 4, + display: 'inline-block', + backgroundColor: bgColor, + cursor: 'pointer', + '> span:after': { + content: '""', + display: 'block', + height: '4px', + width: '100%', + borderTop: `1px dotted ${color}` + } +})); + +export interface IHighlight { + color: string, + text: string, + tooltipText: string, +} + +export const Highlight = ({color, text, tooltipText} : IHighlight) => { + const theme: Theme = useTheme() + const bgColor = theme.palette[color].light; + const textColor = theme.palette[color].dark; + + return { text } +} diff --git a/src/components/ui/Highlight/index.ts b/src/components/ui/Highlight/index.ts new file mode 100644 index 0000000..1144535 --- /dev/null +++ b/src/components/ui/Highlight/index.ts @@ -0,0 +1,2 @@ +export { Highlight } from "./Highlight"; +export type { IHighlight } from "./Highlight"; diff --git a/src/components/ui/InfoTooltip/InfoTooltip.stories.tsx b/src/components/ui/InfoTooltip/InfoTooltip.stories.tsx new file mode 100644 index 0000000..d3f8a34 --- /dev/null +++ b/src/components/ui/InfoTooltip/InfoTooltip.stories.tsx @@ -0,0 +1,18 @@ +import * as React from 'react'; +import { InfoTooltip as InfoTooltipComponent } from './InfoTooltip'; + +import type { Meta, StoryObj } from '@storybook/react'; + +const meta: Meta = { + title: "DRT Components/UI/InfoTooltip", + component: InfoTooltipComponent, +}; + +export default meta; +type Story = StoryObj; + +export const InfoTooltip: Story = { + args: { + text: "Wow, what a useful tooltip!", + }, +}; diff --git a/src/components/ui/InfoTooltip/InfoTooltip.tsx b/src/components/ui/InfoTooltip/InfoTooltip.tsx new file mode 100644 index 0000000..714306e --- /dev/null +++ b/src/components/ui/InfoTooltip/InfoTooltip.tsx @@ -0,0 +1,29 @@ +import React from "react"; +import { Tooltip, TooltipProps, IconButton } from "@mui/material"; +import InfoIcon from '@mui/icons-material/Info'; +import { styled, Theme } from '@mui/material/styles'; + + +const StyledTooltip = styled(Tooltip)(({theme}) => ({ + color: 'inherit', + '& > svg': { + fontSize: '1em', + width: '0.9em', + height: '0.9em', + } +})); + +export interface IInfoTooltip { + text: string +} + + +export const InfoTooltip = ({ text } : IInfoTooltip) => { + return ( + + + + + + ) +} diff --git a/src/components/ui/InfoTooltip/index.ts b/src/components/ui/InfoTooltip/index.ts new file mode 100644 index 0000000..b04b719 --- /dev/null +++ b/src/components/ui/InfoTooltip/index.ts @@ -0,0 +1,2 @@ +export type {IInfoTooltip} from "./InfoTooltip"; +export {InfoTooltip} from "./InfoTooltip"; diff --git a/src/components/StatusTags/StatusTags.stories.tsx b/src/components/ui/StatusTags/StatusTags.stories.tsx similarity index 86% rename from src/components/StatusTags/StatusTags.stories.tsx rename to src/components/ui/StatusTags/StatusTags.stories.tsx index d0b7fb8..faad59f 100644 --- a/src/components/StatusTags/StatusTags.stories.tsx +++ b/src/components/ui/StatusTags/StatusTags.stories.tsx @@ -1,9 +1,9 @@ -import { StatusTag as StatusTagComponent } from "./"; +import { StatusTag as StatusTagComponent } from "."; import type { Meta, StoryObj } from '@storybook/react'; const meta: Meta = { - title: "DRT Components/StatusTags", + title: "DRT Components/UI/StatusTags", component: StatusTagComponent, }; diff --git a/src/components/StatusTags/StatusTags.tsx b/src/components/ui/StatusTags/StatusTags.tsx similarity index 82% rename from src/components/StatusTags/StatusTags.tsx rename to src/components/ui/StatusTags/StatusTags.tsx index 96e8e14..d4812db 100644 --- a/src/components/StatusTags/StatusTags.tsx +++ b/src/components/ui/StatusTags/StatusTags.tsx @@ -1,6 +1,6 @@ import React from "react"; import { Alert, AlertColor, AlertProps } from "@mui/material"; -import { styled } from '@mui/material/styles'; +import { styled, useTheme } from '@mui/material/styles'; import CheckCircleIcon from '@mui/icons-material/CheckCircle'; import InfoIcon from '@mui/icons-material/Info'; import ErrorIcon from '@mui/icons-material/Error'; @@ -22,27 +22,28 @@ export interface IStatusTag { } export const StatusTag = ({type, text}: IStatusTag) => { + const theme = useTheme() let bgColor, icon; let severity = 'success'; switch (type) { case 'success': - bgColor = '#547A00' + bgColor = theme.palette.success.main severity = 'success' icon = break; case 'warning': - bgColor = '#C94900' + bgColor = theme.palette.warning.main severity = 'warning' icon = break; case 'error': - bgColor = '#99001E' + bgColor = theme.palette.error.main severity = 'error' icon = break; case 'info': default: - bgColor = '#404252' + bgColor = theme.palette.info.main severity = 'info' icon = break; diff --git a/src/components/StatusTags/index.ts b/src/components/ui/StatusTags/index.ts similarity index 100% rename from src/components/StatusTags/index.ts rename to src/components/ui/StatusTags/index.ts diff --git a/src/components/ui/StyledTable/StyledTable.stories.tsx b/src/components/ui/StyledTable/StyledTable.stories.tsx new file mode 100644 index 0000000..784b52c --- /dev/null +++ b/src/components/ui/StyledTable/StyledTable.stories.tsx @@ -0,0 +1,67 @@ +import * as React from 'react'; +import { Table as MuiTable, TableHead, TableCell, TableBody, TableRow } from "@mui/material"; +import {InfoTooltip} from '../InfoTooltip'; + +import type {Meta, StoryObj} from '@storybook/react'; + +const meta: Meta = { + title: "DRT Components/MUI Components", + component: MuiTable, +}; + +export default meta; +type Story = StoryObj; + +function createData( + name: string, + calories: number, + fat: number, + carbs: number, + protein: number, +) { + return { name, calories, fat, carbs, protein }; +} + +const rows = [ + createData('Frozen yoghurt', 159, 6.0, 24, 4.0), + createData('Ice cream sandwich', 237, 9.0, 37, 4.3), + createData('Eclair', 262, 16.0, 24, 6.0), + createData('Cupcake', 305, 3.7, 67, 4.3), + createData('Gingerbread', 356, 16.0, 49, 3.9), +]; + + +export const Table: Story = { + render: (storyContext) => { + return + + + Dessert (100g serving) + + Calories + + + Fat (g) + Carbs (g) + Protein (g) + + + + {rows.map((row) => ( + + + {row.name} + + {row.calories} + {row.fat} + {row.carbs} + {row.protein} + + ))} + + + } +}; diff --git a/src/components/StyledTable/StyledTable.tsx b/src/components/ui/StyledTable/StyledTable.tsx similarity index 100% rename from src/components/StyledTable/StyledTable.tsx rename to src/components/ui/StyledTable/StyledTable.tsx diff --git a/src/components/StyledTable/index.ts b/src/components/ui/StyledTable/index.ts similarity index 100% rename from src/components/StyledTable/index.ts rename to src/components/ui/StyledTable/index.ts diff --git a/src/components/ui/index.ts b/src/components/ui/index.ts new file mode 100644 index 0000000..04c1706 --- /dev/null +++ b/src/components/ui/index.ts @@ -0,0 +1,17 @@ +export { Highlight } from "./Highlight"; +export type { IHighlight } from "./Highlight"; + +export type {IInfoTooltip} from "./InfoTooltip"; +export {InfoTooltip} from "./InfoTooltip"; + +export { StatusTag } from "./StatusTags"; +export type {IStatusTag} from './StatusTags'; + +export { + StyledTableHeader, + StyledTableHeaderCell, + StyledTableBody, + RelativeTableCell, + CellHighlight, + CellStatusHighlight, +} from "./StyledTable"; diff --git a/src/drt-theme.ts b/src/drt-theme.ts index b68a821..473dc6d 100644 --- a/src/drt-theme.ts +++ b/src/drt-theme.ts @@ -1,5 +1,6 @@ -import { createTheme } from "@mui/material"; +import { createTheme, darken, lighten } from "@mui/material"; +import React from "react"; declare module '@mui/material/styles' { interface PaperVariants { @@ -42,13 +43,46 @@ declare module "@mui/material/Typography" { } } -let defaultValues = createTheme(); -let drtTheme = createTheme({ +const defaultValues = createTheme({ palette: { - primary: { main: '#005ea5'}, - secondary: { main: '#233E82'} + primary: { + main: '#005ea5', + light: lighten('#005ea5', 0.8) + }, + secondary: { + main: '#233E82', + light: '#E6E9F1' + }, + error: { + main: '#99001E', + light: '#FFEBEE', + }, + success: { + main: '#547A00', + light: '#F0F6DB' + }, + warning: { + main: '#C94900', + light: '#FFF2E1', + }, + info: { + main: '#404252', + light: lighten('#404252', 0.8) + }, + } +}); + +const drtTheme = createTheme({ + palette: { + primary: defaultValues.palette.primary, + secondary: defaultValues.palette.secondary, + error: defaultValues.palette.error, + success: defaultValues.palette.success, + warning: defaultValues.palette.warning, + info: defaultValues.palette.info, }, typography: { + fontFamily: '"Roboto","Helvetica","Arial",sans-serif', h1: { fontSize: '38px', fontWeight: 'bold', @@ -83,7 +117,7 @@ let drtTheme = createTheme({ fontWeight: "bold", }, body1: { - fontSize: "14px", + fontSize: "16px", }, body2: { fontSize: "12px", @@ -109,7 +143,6 @@ let drtTheme = createTheme({ }, logoTitle: { fontSize: '1.6em' - }, }, components: { @@ -123,6 +156,13 @@ let drtTheme = createTheme({ } ] }, + MuiInputBase: { + styleOverrides: { + root: { + backgroundColor: defaultValues.palette.common.white + } + } + }, MuiButton: { styleOverrides: { root: { @@ -135,6 +175,33 @@ let drtTheme = createTheme({ } }, }, + MuiToggleButtonGroup: { + styleOverrides: { + root: { + width: '100%' + } + } + }, + MuiToggleButton: { + styleOverrides: { + root: { + flexGrow: 1, + '&.MuiToggleButton-primary': { + backgroundColor: defaultValues.palette.primary.main, + color: defaultValues.palette.common.white, + '&:hover': { + backgroundColor: lighten(defaultValues.palette.primary.main, 0.1), + color: defaultValues.palette.common.white, + }, + '&.Mui-selected': { + backgroundColor: defaultValues.palette.primary.dark, + color: defaultValues.palette.common.white, + cursor: 'default' + } + } + } + } + }, MuiAccordion: { styleOverrides: { root: { @@ -161,6 +228,31 @@ let drtTheme = createTheme({ } } } + }, + MuiTableCell:{ + styleOverrides: { + root: { + fontSize: '16px', + padding: 8, + }, + head: { + backgroundColor: defaultValues.palette.info.main, + color: defaultValues.palette.common.white, + padding: 6, + } + } + }, + MuiTableRow: { + styleOverrides: { + root: { + '&:nth-of-type(odd)': { + backgroundColor: defaultValues.palette.common.white, + }, + '&:nth-of-type(even)': { + backgroundColor: defaultValues.palette.grey[100], + }, + } + } } } }) diff --git a/tsconfig.json b/tsconfig.json index 4e27465..494f538 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -105,5 +105,9 @@ /* Completeness */ // "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ "skipLibCheck": true, /* Skip type checking all .d.ts files. */ - } + }, + "include": [ + "./src/drt-theme.d.ts", + "**/*.ts" + ] }