From 9cf7c58926bc77d26c6b42f5abfb5a03233fea72 Mon Sep 17 00:00:00 2001 From: molvqingtai Date: Fri, 14 Jul 2023 20:04:51 +0800 Subject: [PATCH] chore: fix css scope and add test page --- components.json | 2 +- index.html | 11 +++++ package.json | 2 + pnpm-lock.yaml | 85 +++++++++++++++++++++++++++++++--- src/components/Sidebar.tsx | 6 ++- src/components/ui/button.tsx | 47 +++++++++++++++++++ src/components/ui/textarea.tsx | 19 ++++++++ src/createShadowRoot.ts | 6 +-- src/index.css | 50 ++++++++++---------- tailwind.config.ts | 2 +- vite.config.ts | 3 ++ 11 files changed, 195 insertions(+), 38 deletions(-) create mode 100644 index.html create mode 100644 src/components/ui/button.tsx create mode 100644 src/components/ui/textarea.tsx diff --git a/components.json b/components.json index 7d79574..4192276 100644 --- a/components.json +++ b/components.json @@ -11,6 +11,6 @@ }, "aliases": { "components": "@/components", - "utils": "@/utils/index.ts" + "utils": "@/utils/index" } } diff --git a/index.html b/index.html new file mode 100644 index 0000000..83afb49 --- /dev/null +++ b/index.html @@ -0,0 +1,11 @@ + + + + + + WebChat + + +

WebChat Dev Page

+ + \ No newline at end of file diff --git a/package.json b/package.json index e69b39e..c85557b 100644 --- a/package.json +++ b/package.json @@ -85,8 +85,10 @@ }, "dependencies": { "@radix-ui/react-icons": "^1.3.0", + "@radix-ui/react-slot": "^1.0.2", "class-variance-authority": "^0.6.1", "clsx": "^1.2.1", + "peerjs": "^1.4.7", "tailwind-merge": "^1.13.2", "tailwindcss-animate": "^1.0.6", "type-fest": "^3.13.0" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5632aad..bd1f1d7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -4,12 +4,18 @@ dependencies: '@radix-ui/react-icons': specifier: ^1.3.0 version: 1.3.0(react@18.2.0) + '@radix-ui/react-slot': + specifier: ^1.0.2 + version: 1.0.2(@types/react@18.2.14)(react@18.2.0) class-variance-authority: specifier: ^0.6.1 version: 0.6.1 clsx: specifier: ^1.2.1 version: 1.2.1 + peerjs: + specifier: ^1.4.7 + version: 1.4.7 tailwind-merge: specifier: ^1.13.2 version: 1.13.2 @@ -356,7 +362,6 @@ packages: engines: {node: '>=6.9.0'} dependencies: regenerator-runtime: 0.13.11 - dev: true /@babel/template@7.22.5: resolution: {integrity: sha512-X7yV7eiwAxdj9k94NEylvbVHLiVG1nvzCV2EAowhxLTwODV1jl9UzZ48leOC0sH7OnuHrIkllaBgneUykIcZaw==} @@ -1046,6 +1051,20 @@ packages: config-chain: 1.1.13 dev: true + /@radix-ui/react-compose-refs@1.0.1(@types/react@18.2.14)(react@18.2.0): + resolution: {integrity: sha512-fDSBgd44FKHa1FRMU59qBMPFcl2PZE+2nmqunj+BWFyYYjnhIDWL2ItDs3rrbJDQOtzt5nIebLCQc4QRfz6LJw==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.21.0 + '@types/react': 18.2.14 + react: 18.2.0 + dev: false + /@radix-ui/react-icons@1.3.0(react@18.2.0): resolution: {integrity: sha512-jQxj/0LKgp+j9BiTXz3O3sgs26RNet2iLWmsPyRz2SIcR4q/4SbazXfnYwbAr+vLYKSfc7qxzyGQA1HLlYiuNw==} peerDependencies: @@ -1054,6 +1073,21 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-slot@1.0.2(@types/react@18.2.14)(react@18.2.0): + resolution: {integrity: sha512-YeTpuq4deV+6DusvVUW4ivBgnkHwECUu0BiN43L5UCDFgdhsRUWAghhTF5MbvNTPzmiFOx90asDSUjWuCNapwg==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.21.0 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.14)(react@18.2.0) + '@types/react': 18.2.14 + react: 18.2.0 + dev: false + /@rollup/pluginutils@4.2.1: resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==} engines: {node: '>= 8.0.0'} @@ -1192,6 +1226,12 @@ packages: - supports-color dev: true + /@swc/helpers@0.3.17: + resolution: {integrity: sha512-tb7Iu+oZ+zWJZ3HJqwx8oNwSDIU440hmVMDPhpACWQWnrZHK99Bxs70gT1L2dnr5Hg50ZRWEFkQCAnOVVV0z1Q==} + dependencies: + tslib: 2.6.0 + dev: false + /@szmarczak/http-timer@5.0.1: resolution: {integrity: sha512-+PmQX0PiAYPMeVYe237LJAYvOMYW1j2rH5YROyS3b4CTVJum34HfRvKvAzozHAQG0TnHNdUfY9nCeUyRAs//cw==} engines: {node: '>=14.16'} @@ -1240,7 +1280,6 @@ packages: /@types/prop-types@15.7.5: resolution: {integrity: sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==} - dev: true /@types/react-dom@18.2.7: resolution: {integrity: sha512-GRaAEriuT4zp9N4p1i8BDBYmEyfo+xQ3yHjJU4eiK5NDa1RmUZG+unZABUTK4/Ox/M+GaHwb6Ow8rUITrtjszA==} @@ -1254,11 +1293,9 @@ packages: '@types/prop-types': 15.7.5 '@types/scheduler': 0.16.3 csstype: 3.1.2 - dev: true /@types/scheduler@0.16.3: resolution: {integrity: sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==} - dev: true /@types/semver@7.5.0: resolution: {integrity: sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw==} @@ -2434,7 +2471,6 @@ packages: /csstype@3.1.2: resolution: {integrity: sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==} - dev: true /dargs@7.0.0: resolution: {integrity: sha512-2iy1EkLdlBzQGvbweYRFxmFath8+K7+AKB0TlhHWkNuH+TmovaMH/Wp7V7R4u7f4SnX3OgLsU9t1NI9ioDnUpg==} @@ -3251,6 +3287,10 @@ packages: engines: {node: '>=6'} dev: true + /eventemitter3@4.0.7: + resolution: {integrity: sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==} + dev: false + /events@3.3.0: resolution: {integrity: sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==} engines: {node: '>=0.8.x'} @@ -5335,6 +5375,20 @@ packages: resolve-protobuf-schema: 2.1.0 dev: true + /peerjs-js-binarypack@1.0.1: + resolution: {integrity: sha512-N6aeia3NhdpV7kiGxJV5xQiZZCVEEVjRz2T2C6UZQiBkHWHzUv/oWA4myQLcwBwO8LUoR1KWW5oStvwVesmfCg==} + dev: false + + /peerjs@1.4.7: + resolution: {integrity: sha512-dWE2HIGvJO0Hm8lYHJiO/5OWl8xYtGcAuU08To1HMIfhh76ULzkCS3NIQO/PZm4noO1RhaGTkQaQ6sbAss6/Tg==} + engines: {node: '>= 10'} + dependencies: + '@swc/helpers': 0.3.17 + eventemitter3: 4.0.7 + peerjs-js-binarypack: 1.0.1 + webrtc-adapter: 7.7.1 + dev: false + /pend@1.2.0: resolution: {integrity: sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==} dev: true @@ -5717,7 +5771,6 @@ packages: /regenerator-runtime@0.13.11: resolution: {integrity: sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==} - dev: true /regexp.prototype.flags@1.5.0: resolution: {integrity: sha512-0SutC3pNudRKgquxGoRGIz946MZVHqbNfPjBdxeOhBrdgDKlRoXmYLQN9xRbrR09ZXWeGAdPuif7egofn6v5LA==} @@ -5894,6 +5947,13 @@ packages: fsevents: 2.3.2 dev: true + /rtcpeerconnection-shim@1.2.15: + resolution: {integrity: sha512-C6DxhXt7bssQ1nHb154lqeL0SXz5Dx4RczXZu2Aa/L1NJFnEVDxFwCBo3fqtuljhHIGceg5JKBV4XJ0gW5JKyw==} + engines: {node: '>=6.0.0', npm: '>=3.10.0'} + dependencies: + sdp: 2.12.0 + dev: false + /run-applescript@5.0.0: resolution: {integrity: sha512-XcT5rBksx1QdIhlFOCtgZkB99ZEouFZ1E2Kc2LHqNW13U3/74YGdkQRmThTwxy4QIyookibDKYZOPqX//6BlAg==} engines: {node: '>=12'} @@ -5953,6 +6013,10 @@ packages: loose-envify: 1.4.0 dev: true + /sdp@2.12.0: + resolution: {integrity: sha512-jhXqQAQVM+8Xj5EjJGVweuEzgtGWb3tmEEpl3CLP3cStInSbVHSg0QWOGQzNq8pSID4JkpeV2mPqlMDLrm0/Vw==} + dev: false + /semver-diff@4.0.0: resolution: {integrity: sha512-0Ju4+6A8iOnpL/Thra7dZsSlOHYAHIeMxfhWQRI1/VLcT3WDBZKKtQt/QkBOsiIN9ZpuvHE6cGZ0x4glCMmfiA==} engines: {node: '>=12'} @@ -6608,7 +6672,6 @@ packages: /tslib@2.6.0: resolution: {integrity: sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==} - dev: true /tsutils@3.21.0(typescript@5.1.6): resolution: {integrity: sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==} @@ -6995,6 +7058,14 @@ packages: resolution: {integrity: sha512-kyDivFZ7ZM0BVOUteVbDFhlRt7Ah/CSPwJdi8hBpkK7QLumUqdLtVfm/PX/hkcnrvr0i77fO5+TjZ94Pe+C9iw==} dev: true + /webrtc-adapter@7.7.1: + resolution: {integrity: sha512-TbrbBmiQBL9n0/5bvDdORc6ZfRY/Z7JnEj+EYOD1ghseZdpJ+nF2yx14k3LgQKc7JZnG7HAcL+zHnY25So9d7A==} + engines: {node: '>=6.0.0', npm: '>=3.10.0'} + dependencies: + rtcpeerconnection-shim: 1.2.15 + sdp: 2.12.0 + dev: false + /when@3.7.7: resolution: {integrity: sha1-q6A/w7tzbWyIsJHQE9io5ZDYRxg=} dev: true diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx index 49c7bff..1d9698f 100644 --- a/src/components/Sidebar.tsx +++ b/src/components/Sidebar.tsx @@ -1,11 +1,15 @@ import Logo from '@/components/Logo' +import { Textarea } from '@/components/ui/textarea' +import { Button } from '@/components/ui/button' export default function Sidebar() { return (
-
Sidebar
+
Sidebar123

This is the sidebar page

+