From 833c509606fd22b45f14eb5d63ddd1dc94f20535 Mon Sep 17 00:00:00 2001 From: Matt Aitken Date: Wed, 10 May 2023 17:44:49 +0100 Subject: [PATCH] CodeBlock working well, except syntax highlighting is broken somehow --- apps/webapp/app/components/code/CodeBlock.tsx | 351 ++++++++++++++---- apps/webapp/app/components/code/prismTheme.ts | 105 ------ .../components/stories/CodeBlock.stories.tsx | 18 +- apps/webapp/package.json | 2 +- apps/webapp/tailwind.config.js | 2 +- pnpm-lock.yaml | 300 +-------------- 6 files changed, 310 insertions(+), 468 deletions(-) delete mode 100644 apps/webapp/app/components/code/prismTheme.ts diff --git a/apps/webapp/app/components/code/CodeBlock.tsx b/apps/webapp/app/components/code/CodeBlock.tsx index 229416fa2..491069633 100644 --- a/apps/webapp/app/components/code/CodeBlock.tsx +++ b/apps/webapp/app/components/code/CodeBlock.tsx @@ -1,91 +1,288 @@ -import { useState } from "react"; -import type { PrismProps } from "@mantine/prism"; -import { Prism } from "@mantine/prism"; -import { theme } from "./prismTheme"; +import { ClipboardIcon } from "@heroicons/react/20/solid"; +import type { Language, PrismTheme } from "prism-react-renderer"; +import Highlight, { defaultProps } from "prism-react-renderer"; +import { forwardRef } from "react"; import { cn } from "~/utils/cn"; +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from "../primitives/Tooltip"; + +//This is a fork of https://github.com/mantinedev/mantine/blob/master/src/mantine-prism/src/Prism/Prism.tsx +//it didn't support highlighting lines by dimming the rest of the code, or animations on the highlighting type CodeBlockProps = { + /** Code which will be highlighted */ code: string; - language?: PrismProps["language"]; + /** Programming language that should be highlighted */ + language: Language; + + /** Show copy to clipboard button */ showCopyButton?: boolean; + + /** Display line numbers */ showLineNumbers?: boolean; - className?: string; + + /** Highlight line at given line number with color from theme.colors */ highlightLines?: number[]; + + /** Add/override classes on the overall element */ + className?: string; + + /** Add/override code theme */ + theme?: PrismTheme; }; -const highlighted: NonNullable[string] = { - color: "grape", +const dimAmount = 0.5; + +const defaultTheme: PrismTheme = { + plain: { + color: "#9CDCFE", + backgroundColor: "#0e1521", + }, + styles: [ + { + types: ["prolog"], + style: { + color: "rgb(0, 0, 128)", + }, + }, + { + types: ["comment"], + style: { + color: "rgb(106, 153, 85)", + }, + }, + { + types: ["builtin", "changed", "keyword", "interpolation-punctuation"], + style: { + color: "rgb(86, 156, 214)", + }, + }, + { + types: ["number", "inserted"], + style: { + color: "rgb(181, 206, 168)", + }, + }, + { + types: ["constant"], + style: { + color: "rgb(100, 102, 149)", + }, + }, + { + types: ["attr-name", "variable"], + style: { + color: "rgb(156, 220, 254)", + }, + }, + { + types: ["deleted", "string", "attr-value", "template-punctuation"], + style: { + color: "rgb(206, 145, 120)", + }, + }, + { + types: ["selector"], + style: { + color: "rgb(215, 186, 125)", + }, + }, + { + // Fix tag color + types: ["tag"], + style: { + color: "rgb(78, 201, 176)", + }, + }, + { + // Fix tag color for HTML + types: ["tag"], + languages: ["markup"], + style: { + color: "rgb(86, 156, 214)", + }, + }, + { + types: ["punctuation", "operator"], + style: { + color: "rgb(212, 212, 212)", + }, + }, + { + // Fix punctuation color for HTML + types: ["punctuation"], + languages: ["markup"], + style: { + color: "#808080", + }, + }, + { + types: ["function"], + style: { + color: "rgb(220, 220, 170)", + }, + }, + { + types: ["class-name"], + style: { + color: "rgb(78, 201, 176)", + }, + }, + { + types: ["char"], + style: { + color: "rgb(209, 105, 105)", + }, + }, + ], }; -export default function CodeBlock({ - code, - language = "typescript", - showCopyButton = true, - showLineNumbers = true, - className, - highlightLines = [], -}: CodeBlockProps) { - let highlightedLines: PrismProps["highlightLines"] = {}; +export const CodeBlock = forwardRef( + ( + { + showCopyButton = true, + showLineNumbers = true, + highlightLines, + code, + className, + language, + theme = defaultTheme, + ...props + }: CodeBlockProps, + ref + ) => { + code = code.trim(); + const maxLineSize = code.split("\n").length.toString().length; - if (highlightLines) { - highlightedLines = highlightLines.reduce((acc, line) => { - acc[line] = highlighted; - return acc; - }, {} as Record); + return ( +
+ {showCopyButton && ( + + + + + + Copy + + + )} + + + {({ + className: inheritedClassName, + style: inheritedStyle, + tokens, + getLineProps, + getTokenProps, + }) => ( +
+
+                {tokens
+                  .map((line, index) => {
+                    if (
+                      index === tokens.length - 1 &&
+                      line.length === 1 &&
+                      line[0].content === "\n"
+                    ) {
+                      return null;
+                    }
+
+                    const lineNumber = index + 1;
+                    const lineProps = getLineProps({ line, key: index });
+
+                    let hasAnyHighlights = highlightLines
+                      ? highlightLines.length > 0
+                      : false;
+
+                    let shouldDim = hasAnyHighlights;
+                    if (
+                      hasAnyHighlights &&
+                      highlightLines?.includes(lineNumber)
+                    ) {
+                      shouldDim = false;
+                    }
+
+                    return (
+                      
+ {showLineNumbers && ( +
+ {lineNumber} +
+ )} + +
+ {line.map((token, key) => { + const tokenProps = getTokenProps({ token, key }); + return ( + + ); + })} +
+
+
+ ); + }) + .filter(Boolean)} +
+
+ )} +
+
+ ); } +); - return ( - theme} - noCopy={!showCopyButton} - copyLabel="Copy code" - copiedLabel="Code copied" - radius="md" - highlightLines={highlightedLines} - > - {code} - - ); -} - -// return ( -//
-//
-//         {code}
-//       
-// {showCopyButton === true && ( -// -// )} -// {maxHeight && ( -//
-// -//
-// )} -//
-// ); -// } +CodeBlock.displayName = "CodeBlock"; diff --git a/apps/webapp/app/components/code/prismTheme.ts b/apps/webapp/app/components/code/prismTheme.ts deleted file mode 100644 index 7b69324ec..000000000 --- a/apps/webapp/app/components/code/prismTheme.ts +++ /dev/null @@ -1,105 +0,0 @@ -import type { PrismTheme } from "prism-react-renderer"; - -export const theme: PrismTheme = { - plain: { - color: "#9CDCFE", - backgroundColor: "#0e1521", - }, - styles: [ - { - types: ["prolog"], - style: { - color: "rgb(0, 0, 128)", - }, - }, - { - types: ["comment"], - style: { - color: "rgb(106, 153, 85)", - }, - }, - { - types: ["builtin", "changed", "keyword", "interpolation-punctuation"], - style: { - color: "rgb(86, 156, 214)", - }, - }, - { - types: ["number", "inserted"], - style: { - color: "rgb(181, 206, 168)", - }, - }, - { - types: ["constant"], - style: { - color: "rgb(100, 102, 149)", - }, - }, - { - types: ["attr-name", "variable"], - style: { - color: "rgb(156, 220, 254)", - }, - }, - { - types: ["deleted", "string", "attr-value", "template-punctuation"], - style: { - color: "rgb(206, 145, 120)", - }, - }, - { - types: ["selector"], - style: { - color: "rgb(215, 186, 125)", - }, - }, - { - // Fix tag color - types: ["tag"], - style: { - color: "rgb(78, 201, 176)", - }, - }, - { - // Fix tag color for HTML - types: ["tag"], - languages: ["markup"], - style: { - color: "rgb(86, 156, 214)", - }, - }, - { - types: ["punctuation", "operator"], - style: { - color: "rgb(212, 212, 212)", - }, - }, - { - // Fix punctuation color for HTML - types: ["punctuation"], - languages: ["markup"], - style: { - color: "#808080", - }, - }, - { - types: ["function"], - style: { - color: "rgb(220, 220, 170)", - }, - }, - { - types: ["class-name"], - style: { - color: "rgb(78, 201, 176)", - }, - }, - { - types: ["char"], - style: { - color: "rgb(209, 105, 105)", - }, - }, - ], -}; diff --git a/apps/webapp/app/components/stories/CodeBlock.stories.tsx b/apps/webapp/app/components/stories/CodeBlock.stories.tsx index 10e4c6bea..4ba2ae835 100644 --- a/apps/webapp/app/components/stories/CodeBlock.stories.tsx +++ b/apps/webapp/app/components/stories/CodeBlock.stories.tsx @@ -1,6 +1,6 @@ import type { Meta, StoryObj } from "@storybook/react"; import { withDesign } from "storybook-addon-designs"; -import CodeBlock from "../code/CodeBlock"; +import { CodeBlock } from "../code/CodeBlock"; const meta: Meta = { title: "CodeBlock", @@ -16,9 +16,23 @@ export const Basic: Story = { args: { code: `export const client = new TriggerClient("smoke-test", { apiUrl: "http://localhost:3000", - endpoint: "http://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entryhttp://localhost:3007/__trigger/entry", + endpoint: "http://localhost:3007/__trigger/entry", logLevel: "debug", + longLine: "This is a long line that will scroll off the edge of the screen and cause a horizontal scrollbar", + onLog: (log) => { + console.log(log); + }, + onLogError: (log) => { + console.error(log); + }, + onLogWarning: (log) => { + console.warn(log); + }, + onLogInfo: (log) => { + console.info(log); + }, });`, + highlightLines: [2], }, render: (args) => , diff --git a/apps/webapp/package.json b/apps/webapp/package.json index 41d0f254f..6e4efdf7b 100644 --- a/apps/webapp/package.json +++ b/apps/webapp/package.json @@ -61,7 +61,6 @@ "@jsonhero/fetch-hero": "^0.2.2", "@keyv/redis": "^2.3.7", "@lezer/highlight": "^1.1.2", - "@mantine/prism": "^6.0.10", "@nangohq/frontend": "^0.8.9", "@nangohq/node": "^0.8.4", "@octokit/webhooks": "^10.4.0", @@ -230,6 +229,7 @@ "storybook": "^7.0.7", "storybook-addon-designs": "7.0.0-beta.2", "storybook-addon-variants": "^0.2.0", + "tailwind-scrollbar": "^3.0.1", "tailwindcss": "3.1.8", "ts-node": "^10.7.0", "tsconfig-paths": "^3.14.1", diff --git a/apps/webapp/tailwind.config.js b/apps/webapp/tailwind.config.js index e76516f57..46cf98b8c 100644 --- a/apps/webapp/tailwind.config.js +++ b/apps/webapp/tailwind.config.js @@ -138,9 +138,9 @@ module.exports = { }, }, plugins: [ - require("tailwind-scrollbar-hide"), require("@tailwindcss/forms"), require("@tailwindcss/typography"), require("tailwindcss-animate"), + require("tailwind-scrollbar"), ], }; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f962ec9b4..eb06f3639 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -60,7 +60,6 @@ importers: '@jsonhero/fetch-hero': ^0.2.2 '@keyv/redis': ^2.3.7 '@lezer/highlight': ^1.1.2 - '@mantine/prism': ^6.0.10 '@nangohq/frontend': ^0.8.9 '@nangohq/node': ^0.8.4 '@octokit/types': ^9.0.0 @@ -213,6 +212,7 @@ importers: storybook-addon-designs: 7.0.0-beta.2 storybook-addon-variants: ^0.2.0 tailwind-merge: ^1.12.0 + tailwind-scrollbar: ^3.0.1 tailwind-scrollbar-hide: ^1.1.7 tailwindcss: 3.1.8 tailwindcss-animate: ^1.0.5 @@ -247,7 +247,6 @@ importers: '@jsonhero/fetch-hero': 0.2.2 '@keyv/redis': 2.5.4 '@lezer/highlight': 1.1.3 - '@mantine/prism': 6.0.10_o2ai6dbc6f7cu3klkweiztmp2i '@nangohq/frontend': 0.8.9 '@nangohq/node': 0.8.4 '@octokit/webhooks': 10.5.1 @@ -414,6 +413,7 @@ importers: storybook: 7.0.9 storybook-addon-designs: 7.0.0-beta.2_fuu4oksmjyaadonkqyb7qxotcm storybook-addon-variants: 0.2.0_firmaeoekdtgift4jqxe74wtdm + tailwind-scrollbar: 3.0.1_tailwindcss@3.1.8 tailwindcss: 3.1.8_aesdjsunmf4wiehhujt67my7tu ts-node: 10.9.1_fodzh64fuekdilycyvke2qmf2e tsconfig-paths: 3.14.1 @@ -2025,6 +2025,7 @@ packages: engines: {node: '>=6.9.0'} dependencies: '@babel/types': 7.21.5 + dev: true /@babel/helper-module-transforms/7.20.11: resolution: {integrity: sha512-uRy78kN4psmji1s2QtbtcCSaj/LILFDp0f/ymhpQH5QY3nljUZCaNWz9X1dEj/8MBdBEFECs7yRhKn8i7NjZgg==} @@ -2162,6 +2163,7 @@ packages: /@babel/helper-string-parser/7.21.5: resolution: {integrity: sha512-5pTUx3hAJaZIdW99sJ6ZUUgWq/Y+Hja7TowEnLNMm1VivRgZQL3vpBY3qUACVsvw+yQU6+YgfBVmcbLaZtrA1w==} engines: {node: '>=6.9.0'} + dev: true /@babel/helper-validator-identifier/7.19.1: resolution: {integrity: sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==} @@ -4288,6 +4290,7 @@ packages: '@babel/helper-string-parser': 7.21.5 '@babel/helper-validator-identifier': 7.19.1 to-fast-properties: 2.0.0 + dev: true /@base2/pretty-print-object/1.0.1: resolution: {integrity: sha512-4iri8i1AqYHJE2DstZYkyEprg6Pq6sKx3xn5FpySk9sNhH7qN2LLlHJCfDTZRILNwQNPD7mATWM0TBui7uC1pA==} @@ -4651,97 +4654,17 @@ packages: engines: {node: '>=10.0.0'} dev: true - /@emotion/babel-plugin/11.11.0: - resolution: {integrity: sha512-m4HEDZleaaCH+XgDDsPF15Ht6wTLsgDTeR3WYj9Q/k76JtWhrJjcP4+/XlG8LGT/Rol9qUfOIztXeA84ATpqPQ==} - dependencies: - '@babel/helper-module-imports': 7.21.4 - '@babel/runtime': 7.20.7 - '@emotion/hash': 0.9.1 - '@emotion/memoize': 0.8.1 - '@emotion/serialize': 1.1.2 - babel-plugin-macros: 3.1.0 - convert-source-map: 1.9.0 - escape-string-regexp: 4.0.0 - find-root: 1.1.0 - source-map: 0.5.7 - stylis: 4.2.0 - dev: false - - /@emotion/cache/11.11.0: - resolution: {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 - stylis: 4.2.0 - dev: false - /@emotion/hash/0.9.0: resolution: {integrity: sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==} dev: true - /@emotion/hash/0.9.1: - resolution: {integrity: sha512-gJB6HLm5rYwSLI6PQa+X1t5CFGrv1J1TWG+sOyMCeKz2ojaj6Fnl/rZEspogG+cvqbt4AE/2eIyD2QfLKTBNlQ==} - dev: false - - /@emotion/memoize/0.8.1: - resolution: {integrity: sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==} - dev: false - - /@emotion/react/11.11.0_kzbn2opkn2327fwg5yzwzya5o4: - resolution: {integrity: sha512-ZSK3ZJsNkwfjT3JpDAWJZlrGD81Z3ytNDsxw1LKq1o+xkmO5pnWfr6gmCC8gHEFf3nSSX/09YrG67jybNPxSUw==} - peerDependencies: - '@types/react': '*' - react: '>=16.8.0' - peerDependenciesMeta: - '@types/react': - optional: true - dependencies: - '@babel/runtime': 7.20.7 - '@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_react@18.2.0 - '@emotion/utils': 1.2.1 - '@emotion/weak-memoize': 0.3.1 - '@types/react': 18.0.26 - hoist-non-react-statics: 3.3.2 - react: 18.2.0 - dev: false - - /@emotion/serialize/1.1.2: - resolution: {integrity: sha512-zR6a/fkFP4EAcCMQtLOhIgpprZOwNmCldtpaISpvz348+DP4Mz8ZoKaGGCQpbzepNIUWbq4w6hNZkwDyKoS+HA==} - dependencies: - '@emotion/hash': 0.9.1 - '@emotion/memoize': 0.8.1 - '@emotion/unitless': 0.8.1 - '@emotion/utils': 1.2.1 - csstype: 3.1.1 - dev: false - - /@emotion/sheet/1.2.2: - resolution: {integrity: sha512-0QBtGvaqtWi+nx6doRwDdBIzhNdZrXUppvTM4dtZZWEGTXL/XE/yJxLMGlDT1Gt+UHH5IX1n+jkXyytE/av7OA==} - dev: false - - /@emotion/unitless/0.8.1: - resolution: {integrity: sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==} - dev: false - /@emotion/use-insertion-effect-with-fallbacks/1.0.1_react@18.2.0: resolution: {integrity: sha512-jT/qyKZ9rzLErtrjGgdkMBn2OP8wl0G3sQlBb3YPryvKHsjvINUhVaPFfP+fpBcOkmrVOVEEHQFJ7nbj2TH2gw==} peerDependencies: react: '>=16.8.0' dependencies: react: 18.2.0 - - /@emotion/utils/1.2.1: - resolution: {integrity: sha512-Y2tGf3I+XVnajdItskUCn6LX+VUDmP6lTL4fcqsXAv43dnlbZiuW4MWQW38rW/BVWSE7Q/7+XQocmpnRYILUmg==} - dev: false - - /@emotion/weak-memoize/0.3.1: - resolution: {integrity: sha512-EsBwpc7hBUJWAsNPBmJy4hxWx12v6bshQsldrVmjxJoc3isbxhOrF2IcCpaXxfvq03NwkI7sbsOLXbYuqF/8Ww==} - dev: false + dev: true /@esbuild-kit/cjs-loader/2.4.1: resolution: {integrity: sha512-lhc/XLith28QdW0HpHZvZKkorWgmCNT7sVelMHDj3HFdTfdqkwEKvT+aXVQtNAmCC39VJhunDkWhONWB7335mg==} @@ -5625,22 +5548,12 @@ packages: resolution: {integrity: sha512-buc8BXHmG9l82+OQXOFU3Kr2XQx9ys01U/Q9HMIrZ300iLc8HLMgh7dcCqgYzAzf4BkoQvDcXf5Y+CuEZ5JBYg==} dev: false - /@floating-ui/core/1.2.6: - resolution: {integrity: sha512-EvYTiXet5XqweYGClEmpu3BoxmsQ4hkj3QaYA6qEnigCWffTP3vNRwBReTdrwDwo7OoJ3wM8Uoe9Uk4n+d4hfg==} - dev: false - /@floating-ui/dom/0.5.4: resolution: {integrity: sha512-419BMceRLq0RrmTSDxn8hf9R3VCJv2K9PUfugh5JyEFmdjzDo+e8U5EdR8nzKq8Yj1htzLm3b6eQEEam3/rrtg==} dependencies: '@floating-ui/core': 0.7.3 dev: false - /@floating-ui/dom/1.2.7: - resolution: {integrity: sha512-DyqylONj1ZaBnzj+uBnVfzdjjCkFCL2aA9ESHLyUOGSqb03RpbLMImP1ekIQXYs4KLk9jAjJfZAU8hXfWSahEg==} - dependencies: - '@floating-ui/core': 1.2.6 - dev: false - /@floating-ui/react-dom/0.7.2_ib3m5ricvtkl2cll7qpr2f6lvq: resolution: {integrity: sha512-1T0sJcpHgX/u4I1OzIEhlcrvkUN8ln39nz7fMoE/2HDHrPiMFoOGR7++GYyfUmIQHkkrTinaeQsO3XWubjSvGg==} peerDependencies: @@ -5655,30 +5568,6 @@ packages: - '@types/react' dev: false - /@floating-ui/react-dom/1.3.0_biqbaboplfbrettd7655fr4n2y: - resolution: {integrity: sha512-htwHm67Ji5E/pROEAr7f8IKFShuiCKHwUC/UY4vC3I5jiSvGFAYnSYiZO5MlGmads+QqvUkR9ANHEguGrDv72g==} - peerDependencies: - react: '>=16.8.0' - react-dom: '>=16.8.0' - dependencies: - '@floating-ui/dom': 1.2.7 - react: 18.2.0 - react-dom: 18.2.0_react@18.2.0 - dev: false - - /@floating-ui/react/0.19.2_biqbaboplfbrettd7655fr4n2y: - resolution: {integrity: sha512-JyNk4A0Ezirq8FlXECvRtQOX/iBe5Ize0W/pLkrZjfHW9GUV7Xnq6zm6fyZuQzaHHqEnVizmvlA96e1/CkZv+w==} - peerDependencies: - react: '>=16.8.0' - react-dom: '>=16.8.0' - dependencies: - '@floating-ui/react-dom': 1.3.0_biqbaboplfbrettd7655fr4n2y - aria-hidden: 1.2.3 - react: 18.2.0 - react-dom: 18.2.0_react@18.2.0 - tabbable: 6.1.2 - dev: false - /@gar/promisify/1.1.3: resolution: {integrity: sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==} dev: true @@ -5981,73 +5870,6 @@ packages: '@lit-labs/ssr-dom-shim': 1.1.1 dev: true - /@mantine/core/6.0.10_zecty7ayspqmnjyeptesd5jvly: - resolution: {integrity: sha512-Q8HdRTBkQDs6LEtklpYm6efz2WaV6T5rvgjUOfXq0z44G/XYM+P1B1BSFnHvUDkeWYLcGkK6aPI5Uxc0GEN04w==} - peerDependencies: - '@mantine/hooks': 6.0.10 - react: '>=16.8.0' - react-dom: '>=16.8.0' - dependencies: - '@floating-ui/react': 0.19.2_biqbaboplfbrettd7655fr4n2y - '@mantine/hooks': 6.0.10_react@18.2.0 - '@mantine/styles': 6.0.10_47zgoiguaund3gg2dv4s2nbrcu - '@mantine/utils': 6.0.10_react@18.2.0 - '@radix-ui/react-scroll-area': 1.0.2_biqbaboplfbrettd7655fr4n2y - react: 18.2.0 - react-dom: 18.2.0_react@18.2.0 - react-remove-scroll: 2.5.5_kzbn2opkn2327fwg5yzwzya5o4 - react-textarea-autosize: 8.3.4_kzbn2opkn2327fwg5yzwzya5o4 - transitivePeerDependencies: - - '@emotion/react' - - '@types/react' - dev: false - - /@mantine/hooks/6.0.10_react@18.2.0: - resolution: {integrity: sha512-rxH5/CxmUs1mUZAj27Fza4SH07HV1XyrL7L9wwhZdMLg+oDEaAs8BMz8lsOIHOCro9ZDh+Mm7QAbEW8HcvmYJg==} - peerDependencies: - react: '>=16.8.0' - dependencies: - react: 18.2.0 - dev: false - - /@mantine/prism/6.0.10_o2ai6dbc6f7cu3klkweiztmp2i: - resolution: {integrity: sha512-y4oW1L8H9Jq+Ymm5RphanczVnlbHyNZy+PC9ZIbVy61f+WDWLM4tmCWYPgxXWQ35yXpMCz3U9UkAsSGEaalAOA==} - peerDependencies: - '@mantine/core': 6.0.10 - '@mantine/hooks': 6.0.10 - react: '>=16.8.0' - react-dom: '>=16.8.0' - dependencies: - '@mantine/core': 6.0.10_zecty7ayspqmnjyeptesd5jvly - '@mantine/hooks': 6.0.10_react@18.2.0 - '@mantine/utils': 6.0.10_react@18.2.0 - prism-react-renderer: 1.3.5_react@18.2.0 - react: 18.2.0 - react-dom: 18.2.0_react@18.2.0 - dev: false - - /@mantine/styles/6.0.10_47zgoiguaund3gg2dv4s2nbrcu: - resolution: {integrity: sha512-TVyo4xNBO7PhP2jubu2OI1YK2DEULrVgdsP0+1wfwj/bhSTnTLYmh2aOb1FyTiFvFn1dfq4If428z/ZuGiLtdQ==} - peerDependencies: - '@emotion/react': '>=11.9.0' - react: '>=16.8.0' - react-dom: '>=16.8.0' - dependencies: - '@emotion/react': 11.11.0_kzbn2opkn2327fwg5yzwzya5o4 - clsx: 1.1.1 - csstype: 3.0.9 - react: 18.2.0 - react-dom: 18.2.0_react@18.2.0 - dev: false - - /@mantine/utils/6.0.10_react@18.2.0: - resolution: {integrity: sha512-Lo4VUn3+/kqhdjSoPzUFbxXEjMxj5vS4pqRjKRGtJsTwHiMFNcm8u4cIESzMBAEsoaBrI1dGE4WttwOJhjUaSw==} - peerDependencies: - react: '>=16.8.0' - dependencies: - react: 18.2.0 - dev: false - /@manypkg/cli/0.19.2: resolution: {integrity: sha512-DXx/P1lyunNoFWwOj1MWBucUhaIJljoiAGOpO2fE0GKMBCI6EZBZD0Up1+fQZoXBecKXRgV9mGgLvIB2fOQ0KQ==} hasBin: true @@ -6897,18 +6719,6 @@ packages: react-dom: 18.2.0_react@18.2.0 dev: false - /@radix-ui/react-primitive/1.0.1_biqbaboplfbrettd7655fr4n2y: - resolution: {integrity: sha512-fHbmislWVkZaIdeF6GZxF0A/NH/3BjrGIYj+Ae6eTmTCr7EB0RQAAVEiqsXK6p3/JcRqVSBQoceZroj30Jj3XA==} - peerDependencies: - react: ^16.8 || ^17.0 || ^18.0 - react-dom: ^16.8 || ^17.0 || ^18.0 - dependencies: - '@babel/runtime': 7.20.7 - '@radix-ui/react-slot': 1.0.1_react@18.2.0 - react: 18.2.0 - react-dom: 18.2.0_react@18.2.0 - dev: false - /@radix-ui/react-primitive/1.0.2_biqbaboplfbrettd7655fr4n2y: resolution: {integrity: sha512-zY6G5Qq4R8diFPNwtyoLRZBxzu1Z+SXMlfYpChN7Dv8gvmx9X3qhDqiLWvKseKVJMuedFeU/Sa0Sy/Ia+t06Dw==} peerDependencies: @@ -6941,26 +6751,6 @@ packages: react-dom: 18.2.0_react@18.2.0 dev: false - /@radix-ui/react-scroll-area/1.0.2_biqbaboplfbrettd7655fr4n2y: - resolution: {integrity: sha512-k8VseTxI26kcKJaX0HPwkvlNBPTs56JRdYzcZ/vzrNUkDlvXBy8sMc7WvCpYzZkHgb+hd72VW9MqkqecGtuNgg==} - peerDependencies: - react: ^16.8 || ^17.0 || ^18.0 - react-dom: ^16.8 || ^17.0 || ^18.0 - dependencies: - '@babel/runtime': 7.20.7 - '@radix-ui/number': 1.0.0 - '@radix-ui/primitive': 1.0.0 - '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 - '@radix-ui/react-context': 1.0.0_react@18.2.0 - '@radix-ui/react-direction': 1.0.0_react@18.2.0 - '@radix-ui/react-presence': 1.0.0_biqbaboplfbrettd7655fr4n2y - '@radix-ui/react-primitive': 1.0.1_biqbaboplfbrettd7655fr4n2y - '@radix-ui/react-use-callback-ref': 1.0.0_react@18.2.0 - '@radix-ui/react-use-layout-effect': 1.0.0_react@18.2.0 - react: 18.2.0 - react-dom: 18.2.0_react@18.2.0 - dev: false - /@radix-ui/react-select/1.2.1_ib3m5ricvtkl2cll7qpr2f6lvq: resolution: {integrity: sha512-GULRMITaOHNj79BZvQs3iZO0+f2IgI8g5HDhMi7Bnc13t7IlG86NFtOCfTLme4PNZdEtU+no+oGgcl6IFiphpQ==} peerDependencies: @@ -10946,15 +10736,6 @@ packages: - supports-color dev: true - /babel-plugin-macros/3.1.0: - resolution: {integrity: sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==} - engines: {node: '>=10', npm: '>=6'} - dependencies: - '@babel/runtime': 7.20.7 - cosmiconfig: 7.1.0 - resolve: 1.22.1 - dev: false - /babel-plugin-named-exports-order/0.0.2: resolution: {integrity: sha512-OgOYHOLoRK+/mvXU9imKHlG6GkPLYrUCvFXG/CM93R/aNNO8pOOF4aS+S8CCHMDQoNSeiOYEZb/G6RwL95Jktw==} dev: true @@ -11858,11 +11639,6 @@ packages: resolution: {integrity: sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==} engines: {node: '>=0.8'} - /clsx/1.1.1: - resolution: {integrity: sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==} - engines: {node: '>=6'} - dev: false - /clsx/1.2.1: resolution: {integrity: sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==} engines: {node: '>=6'} @@ -12051,6 +11827,7 @@ packages: /convert-source-map/1.9.0: resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==} + dev: true /convert-source-map/2.0.0: resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==} @@ -12259,10 +12036,6 @@ packages: engines: {node: '>=4'} hasBin: true - /csstype/3.0.9: - resolution: {integrity: sha512-rpw6JPxK6Rfg1zLOYCSwle2GFOOsnjmDYDaBwEcwoOg4qlsIVCN789VkBZDJAGi4T07gI4YSutR43t9Zz4Lzuw==} - dev: false - /csstype/3.1.1: resolution: {integrity: sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==} @@ -13397,6 +13170,7 @@ packages: /escape-string-regexp/4.0.0: resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==} engines: {node: '>=10'} + dev: true /escape-string-regexp/5.0.0: resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==} @@ -14378,10 +14152,6 @@ packages: pkg-dir: 4.2.0 dev: true - /find-root/1.1.0: - resolution: {integrity: sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==} - dev: false - /find-up/3.0.0: resolution: {integrity: sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==} engines: {node: '>=6'} @@ -19806,20 +19576,6 @@ packages: tslib: 2.4.1 dev: false - /react-textarea-autosize/8.3.4_kzbn2opkn2327fwg5yzwzya5o4: - resolution: {integrity: sha512-CdtmP8Dc19xL8/R6sWvtknD/eCXkQr30dtvC4VmGInhRsfF8X/ihXCq6+9l9qbxmKRiq407/7z5fxE7cVWQNgQ==} - engines: {node: '>=10'} - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - dependencies: - '@babel/runtime': 7.20.7 - react: 18.2.0 - use-composed-ref: 1.3.0_react@18.2.0 - use-latest: 1.2.1_kzbn2opkn2327fwg5yzwzya5o4 - transitivePeerDependencies: - - '@types/react' - dev: false - /react-use-intercom/3.0.2_biqbaboplfbrettd7655fr4n2y: resolution: {integrity: sha512-1zp97bK3Hx9W6NJZS2wO6gA+eGlWZf1J+nj8+P22a8ORsnWiUYpZ12Kzco8vv9Qn+0Gbb6eX9lkkrLXf5noXyg==} engines: {node: '>=10'} @@ -21314,10 +21070,6 @@ packages: react: 18.2.0 dev: false - /stylis/4.2.0: - resolution: {integrity: sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==} - dev: false - /sucrase/3.29.0: resolution: {integrity: sha512-bZPAuGA5SdFHuzqIhTAqt9fvNEo9rESqXIG3oiKdF8K4UmkQxC4KlNL3lVyAErXp+mPvUqZ5l13qx6TrDIGf3A==} engines: {node: '>=8'} @@ -21388,10 +21140,6 @@ packages: tslib: 2.4.1 dev: true - /tabbable/6.1.2: - resolution: {integrity: sha512-qCN98uP7i9z0fIS4amQ5zbGBOq+OSigYeGvPy7NDk8Y9yncqDZ9pRPgfsc2PJIVM9RrJj7GIfuRgmjoUU9zTHQ==} - dev: false - /tailwind-merge/1.12.0: resolution: {integrity: sha512-Y17eDp7FtN1+JJ4OY0Bqv9OA41O+MS8c1Iyr3T6JFLnOgLg3EvcyMKZAnQ8AGyvB5Nxm3t9Xb5Mhe139m8QT/g==} dev: false @@ -21400,6 +21148,15 @@ packages: resolution: {integrity: sha512-X324n9OtpTmOMqEgDUEA/RgLrNfBF/jwJdctaPZDzB3mppxJk7TLIDmOreEDm1Bq4R9LSPu4Epf8VSdovNU+iA==} dev: false + /tailwind-scrollbar/3.0.1_tailwindcss@3.1.8: + resolution: {integrity: sha512-mM0ecSf/RGRGWw/qB0Zg1bWhuXIkpmleNAFgMxdb4eERgA6eQ0kVouYsF3/OvBqDSK8RJikZC/ynGPxnfXeddw==} + engines: {node: '>=12.13.0'} + peerDependencies: + tailwindcss: 3.x + dependencies: + tailwindcss: 3.1.8_aesdjsunmf4wiehhujt67my7tu + dev: true + /tailwindcss-animate/1.0.5_tailwindcss@3.1.8: resolution: {integrity: sha512-UU3qrOJ4lFQABY+MVADmBm+0KW3xZyhMdRvejwtXqYOL7YjHYxmuREFAZdmVG5LPe5E9CAst846SLC4j5I3dcw==} peerDependencies: @@ -21743,6 +21500,7 @@ packages: /to-fast-properties/2.0.0: resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==} engines: {node: '>=4'} + dev: true /to-object-path/0.3.0: resolution: {integrity: sha512-9mWHdnGRuh3onocaHzukyvCZhzvr6tiflAy/JRFXcJX0TjgfWA9pk9t8CMbzmBE4Jfw58pXbkngtBtqYxzNEyg==} @@ -22526,14 +22284,6 @@ packages: tslib: 2.4.1 dev: false - /use-composed-ref/1.3.0_react@18.2.0: - resolution: {integrity: sha512-GLMG0Jc/jiKov/3Ulid1wbv3r54K9HlMW29IWcDFPEqFkSO2nS0MuefWgMJpeHQ9YJeXDL3ZUF+P3jdXlZX/cQ==} - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - dependencies: - react: 18.2.0 - dev: false - /use-isomorphic-layout-effect/1.1.2_kzbn2opkn2327fwg5yzwzya5o4: resolution: {integrity: sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==} peerDependencies: @@ -22547,20 +22297,6 @@ packages: react: 18.2.0 dev: false - /use-latest/1.2.1_kzbn2opkn2327fwg5yzwzya5o4: - resolution: {integrity: sha512-xA+AVm/Wlg3e2P/JiItTziwS7FK92LWrDB0p+hgXloIMuVCeJJ8v6f0eeHyPZaJrM+usM1FkFfbNCrJGs8A/zw==} - peerDependencies: - '@types/react': '*' - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - '@types/react': - optional: true - dependencies: - '@types/react': 18.0.26 - react: 18.2.0 - use-isomorphic-layout-effect: 1.1.2_kzbn2opkn2327fwg5yzwzya5o4 - dev: false - /use-resize-observer/9.1.0_biqbaboplfbrettd7655fr4n2y: resolution: {integrity: sha512-R25VqO9Wb3asSD4eqtcxk8sJalvIOYBqS8MNZlpDSQ4l4xMQxC/J7Id9HoTqPq8FwULIn0PVW+OAqF2dyYbjow==} peerDependencies: