refactor: swap out radix with reka (#1271)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **Refactor**
- Improved type safety and consistency across UI components by
leveraging centralized type definitions.

- **Chores**
- Updated and consolidated UI component dependencies by migrating from a
previous library to a new one and refining package configurations.

- **Style**
- Standardized code formatting for uniform syntax and improved
readability.

- **Tests**
- Expanded testing configuration to include additional file types for
enhanced test coverage.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: mdatelle <mike@datelle.net>
This commit is contained in:
Michael Datelle
2025-03-26 14:56:43 -04:00
committed by GitHub
parent 49f636541b
commit b0099421f3
32 changed files with 163 additions and 548 deletions
+10 -352
View File
@@ -523,9 +523,6 @@ importers:
lucide-vue-next:
specifier: ^0.483.0
version: 0.483.0(vue@3.5.13(typescript@5.8.2))
radix-vue:
specifier: ^1.9.13
version: 1.9.17(vue@3.5.13(typescript@5.8.2))
reka-ui:
specifier: ^2.1.0
version: 2.1.1(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2))
@@ -750,12 +747,6 @@ importers:
pinia:
specifier: ^3.0.1
version: 3.0.1(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2))
radix-vue:
specifier: ^1.9.13
version: 1.9.17(vue@3.5.13(typescript@5.8.2))
reka-ui:
specifier: ^2.0.2
version: 2.1.1(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2))
semver:
specifier: ^7.6.3
version: 7.7.1
@@ -865,6 +856,9 @@ importers:
vite-plugin-remove-console:
specifier: ^2.2.0
version: 2.2.0
vite-plugin-vue-tracer:
specifier: ^0.1.3
version: 0.1.3(vite@6.2.3(@types/node@22.13.13)(jiti@2.4.2)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0))(vue@3.5.13(typescript@5.8.2))
vitest:
specifier: ^3.0.0
version: 3.0.9(@types/node@22.13.13)(@vitest/ui@3.0.9)(happy-dom@17.4.4)(jiti@2.4.2)(jsdom@26.0.0)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0)
@@ -1514,12 +1508,6 @@ packages:
cpu: [ppc64]
os: [aix]
'@esbuild/aix-ppc64@0.25.0':
resolution: {integrity: sha512-O7vun9Sf8DFjH2UtqK8Ku3LkquL9SZL8OLY1T5NZkA34+wG3OQF7cl4Ql8vdNzM6fzBbYfLaiRLIOZ+2FOCgBQ==}
engines: {node: '>=18'}
cpu: [ppc64]
os: [aix]
'@esbuild/aix-ppc64@0.25.1':
resolution: {integrity: sha512-kfYGy8IdzTGy+z0vFGvExZtxkFlA4zAxgKEahG9KE1ScBjpQnFsNOX8KTU5ojNru5ed5CVoJYXFtoxaq5nFbjQ==}
engines: {node: '>=18'}
@@ -1532,12 +1520,6 @@ packages:
cpu: [arm64]
os: [android]
'@esbuild/android-arm64@0.25.0':
resolution: {integrity: sha512-grvv8WncGjDSyUBjN9yHXNt+cq0snxXbDxy5pJtzMKGmmpPxeAmAhWxXI+01lU5rwZomDgD3kJwulEnhTRUd6g==}
engines: {node: '>=18'}
cpu: [arm64]
os: [android]
'@esbuild/android-arm64@0.25.1':
resolution: {integrity: sha512-50tM0zCJW5kGqgG7fQ7IHvQOcAn9TKiVRuQ/lN0xR+T2lzEFvAi1ZcS8DiksFcEpf1t/GYOeOfCAgDHFpkiSmA==}
engines: {node: '>=18'}
@@ -1550,12 +1532,6 @@ packages:
cpu: [arm]
os: [android]
'@esbuild/android-arm@0.25.0':
resolution: {integrity: sha512-PTyWCYYiU0+1eJKmw21lWtC+d08JDZPQ5g+kFyxP0V+es6VPPSUhM6zk8iImp2jbV6GwjX4pap0JFbUQN65X1g==}
engines: {node: '>=18'}
cpu: [arm]
os: [android]
'@esbuild/android-arm@0.25.1':
resolution: {integrity: sha512-dp+MshLYux6j/JjdqVLnMglQlFu+MuVeNrmT5nk6q07wNhCdSnB7QZj+7G8VMUGh1q+vj2Bq8kRsuyA00I/k+Q==}
engines: {node: '>=18'}
@@ -1568,12 +1544,6 @@ packages:
cpu: [x64]
os: [android]
'@esbuild/android-x64@0.25.0':
resolution: {integrity: sha512-m/ix7SfKG5buCnxasr52+LI78SQ+wgdENi9CqyCXwjVR2X4Jkz+BpC3le3AoBPYTC9NHklwngVXvbJ9/Akhrfg==}
engines: {node: '>=18'}
cpu: [x64]
os: [android]
'@esbuild/android-x64@0.25.1':
resolution: {integrity: sha512-GCj6WfUtNldqUzYkN/ITtlhwQqGWu9S45vUXs7EIYf+7rCiiqH9bCloatO9VhxsL0Pji+PF4Lz2XXCES+Q8hDw==}
engines: {node: '>=18'}
@@ -1586,12 +1556,6 @@ packages:
cpu: [arm64]
os: [darwin]
'@esbuild/darwin-arm64@0.25.0':
resolution: {integrity: sha512-mVwdUb5SRkPayVadIOI78K7aAnPamoeFR2bT5nszFUZ9P8UpK4ratOdYbZZXYSqPKMHfS1wdHCJk1P1EZpRdvw==}
engines: {node: '>=18'}
cpu: [arm64]
os: [darwin]
'@esbuild/darwin-arm64@0.25.1':
resolution: {integrity: sha512-5hEZKPf+nQjYoSr/elb62U19/l1mZDdqidGfmFutVUjjUZrOazAtwK+Kr+3y0C/oeJfLlxo9fXb1w7L+P7E4FQ==}
engines: {node: '>=18'}
@@ -1604,12 +1568,6 @@ packages:
cpu: [x64]
os: [darwin]
'@esbuild/darwin-x64@0.25.0':
resolution: {integrity: sha512-DgDaYsPWFTS4S3nWpFcMn/33ZZwAAeAFKNHNa1QN0rI4pUjgqf0f7ONmXf6d22tqTY+H9FNdgeaAa+YIFUn2Rg==}
engines: {node: '>=18'}
cpu: [x64]
os: [darwin]
'@esbuild/darwin-x64@0.25.1':
resolution: {integrity: sha512-hxVnwL2Dqs3fM1IWq8Iezh0cX7ZGdVhbTfnOy5uURtao5OIVCEyj9xIzemDi7sRvKsuSdtCAhMKarxqtlyVyfA==}
engines: {node: '>=18'}
@@ -1622,12 +1580,6 @@ packages:
cpu: [arm64]
os: [freebsd]
'@esbuild/freebsd-arm64@0.25.0':
resolution: {integrity: sha512-VN4ocxy6dxefN1MepBx/iD1dH5K8qNtNe227I0mnTRjry8tj5MRk4zprLEdG8WPyAPb93/e4pSgi1SoHdgOa4w==}
engines: {node: '>=18'}
cpu: [arm64]
os: [freebsd]
'@esbuild/freebsd-arm64@0.25.1':
resolution: {integrity: sha512-1MrCZs0fZa2g8E+FUo2ipw6jw5qqQiH+tERoS5fAfKnRx6NXH31tXBKI3VpmLijLH6yriMZsxJtaXUyFt/8Y4A==}
engines: {node: '>=18'}
@@ -1640,12 +1592,6 @@ packages:
cpu: [x64]
os: [freebsd]
'@esbuild/freebsd-x64@0.25.0':
resolution: {integrity: sha512-mrSgt7lCh07FY+hDD1TxiTyIHyttn6vnjesnPoVDNmDfOmggTLXRv8Id5fNZey1gl/V2dyVK1VXXqVsQIiAk+A==}
engines: {node: '>=18'}
cpu: [x64]
os: [freebsd]
'@esbuild/freebsd-x64@0.25.1':
resolution: {integrity: sha512-0IZWLiTyz7nm0xuIs0q1Y3QWJC52R8aSXxe40VUxm6BB1RNmkODtW6LHvWRrGiICulcX7ZvyH6h5fqdLu4gkww==}
engines: {node: '>=18'}
@@ -1658,12 +1604,6 @@ packages:
cpu: [arm64]
os: [linux]
'@esbuild/linux-arm64@0.25.0':
resolution: {integrity: sha512-9QAQjTWNDM/Vk2bgBl17yWuZxZNQIF0OUUuPZRKoDtqF2k4EtYbpyiG5/Dk7nqeK6kIJWPYldkOcBqjXjrUlmg==}
engines: {node: '>=18'}
cpu: [arm64]
os: [linux]
'@esbuild/linux-arm64@0.25.1':
resolution: {integrity: sha512-jaN3dHi0/DDPelk0nLcXRm1q7DNJpjXy7yWaWvbfkPvI+7XNSc/lDOnCLN7gzsyzgu6qSAmgSvP9oXAhP973uQ==}
engines: {node: '>=18'}
@@ -1676,12 +1616,6 @@ packages:
cpu: [arm]
os: [linux]
'@esbuild/linux-arm@0.25.0':
resolution: {integrity: sha512-vkB3IYj2IDo3g9xX7HqhPYxVkNQe8qTK55fraQyTzTX/fxaDtXiEnavv9geOsonh2Fd2RMB+i5cbhu2zMNWJwg==}
engines: {node: '>=18'}
cpu: [arm]
os: [linux]
'@esbuild/linux-arm@0.25.1':
resolution: {integrity: sha512-NdKOhS4u7JhDKw9G3cY6sWqFcnLITn6SqivVArbzIaf3cemShqfLGHYMx8Xlm/lBit3/5d7kXvriTUGa5YViuQ==}
engines: {node: '>=18'}
@@ -1694,12 +1628,6 @@ packages:
cpu: [ia32]
os: [linux]
'@esbuild/linux-ia32@0.25.0':
resolution: {integrity: sha512-43ET5bHbphBegyeqLb7I1eYn2P/JYGNmzzdidq/w0T8E2SsYL1U6un2NFROFRg1JZLTzdCoRomg8Rvf9M6W6Gg==}
engines: {node: '>=18'}
cpu: [ia32]
os: [linux]
'@esbuild/linux-ia32@0.25.1':
resolution: {integrity: sha512-OJykPaF4v8JidKNGz8c/q1lBO44sQNUQtq1KktJXdBLn1hPod5rE/Hko5ugKKZd+D2+o1a9MFGUEIUwO2YfgkQ==}
engines: {node: '>=18'}
@@ -1718,12 +1646,6 @@ packages:
cpu: [loong64]
os: [linux]
'@esbuild/linux-loong64@0.25.0':
resolution: {integrity: sha512-fC95c/xyNFueMhClxJmeRIj2yrSMdDfmqJnyOY4ZqsALkDrrKJfIg5NTMSzVBr5YW1jf+l7/cndBfP3MSDpoHw==}
engines: {node: '>=18'}
cpu: [loong64]
os: [linux]
'@esbuild/linux-loong64@0.25.1':
resolution: {integrity: sha512-nGfornQj4dzcq5Vp835oM/o21UMlXzn79KobKlcs3Wz9smwiifknLy4xDCLUU0BWp7b/houtdrgUz7nOGnfIYg==}
engines: {node: '>=18'}
@@ -1736,12 +1658,6 @@ packages:
cpu: [mips64el]
os: [linux]
'@esbuild/linux-mips64el@0.25.0':
resolution: {integrity: sha512-nkAMFju7KDW73T1DdH7glcyIptm95a7Le8irTQNO/qtkoyypZAnjchQgooFUDQhNAy4iu08N79W4T4pMBwhPwQ==}
engines: {node: '>=18'}
cpu: [mips64el]
os: [linux]
'@esbuild/linux-mips64el@0.25.1':
resolution: {integrity: sha512-1osBbPEFYwIE5IVB/0g2X6i1qInZa1aIoj1TdL4AaAb55xIIgbg8Doq6a5BzYWgr+tEcDzYH67XVnTmUzL+nXg==}
engines: {node: '>=18'}
@@ -1754,12 +1670,6 @@ packages:
cpu: [ppc64]
os: [linux]
'@esbuild/linux-ppc64@0.25.0':
resolution: {integrity: sha512-NhyOejdhRGS8Iwv+KKR2zTq2PpysF9XqY+Zk77vQHqNbo/PwZCzB5/h7VGuREZm1fixhs4Q/qWRSi5zmAiO4Fw==}
engines: {node: '>=18'}
cpu: [ppc64]
os: [linux]
'@esbuild/linux-ppc64@0.25.1':
resolution: {integrity: sha512-/6VBJOwUf3TdTvJZ82qF3tbLuWsscd7/1w+D9LH0W/SqUgM5/JJD0lrJ1fVIfZsqB6RFmLCe0Xz3fmZc3WtyVg==}
engines: {node: '>=18'}
@@ -1772,12 +1682,6 @@ packages:
cpu: [riscv64]
os: [linux]
'@esbuild/linux-riscv64@0.25.0':
resolution: {integrity: sha512-5S/rbP5OY+GHLC5qXp1y/Mx//e92L1YDqkiBbO9TQOvuFXM+iDqUNG5XopAnXoRH3FjIUDkeGcY1cgNvnXp/kA==}
engines: {node: '>=18'}
cpu: [riscv64]
os: [linux]
'@esbuild/linux-riscv64@0.25.1':
resolution: {integrity: sha512-nSut/Mx5gnilhcq2yIMLMe3Wl4FK5wx/o0QuuCLMtmJn+WeWYoEGDN1ipcN72g1WHsnIbxGXd4i/MF0gTcuAjQ==}
engines: {node: '>=18'}
@@ -1790,12 +1694,6 @@ packages:
cpu: [s390x]
os: [linux]
'@esbuild/linux-s390x@0.25.0':
resolution: {integrity: sha512-XM2BFsEBz0Fw37V0zU4CXfcfuACMrppsMFKdYY2WuTS3yi8O1nFOhil/xhKTmE1nPmVyvQJjJivgDT+xh8pXJA==}
engines: {node: '>=18'}
cpu: [s390x]
os: [linux]
'@esbuild/linux-s390x@0.25.1':
resolution: {integrity: sha512-cEECeLlJNfT8kZHqLarDBQso9a27o2Zd2AQ8USAEoGtejOrCYHNtKP8XQhMDJMtthdF4GBmjR2au3x1udADQQQ==}
engines: {node: '>=18'}
@@ -1808,24 +1706,12 @@ packages:
cpu: [x64]
os: [linux]
'@esbuild/linux-x64@0.25.0':
resolution: {integrity: sha512-9yl91rHw/cpwMCNytUDxwj2XjFpxML0y9HAOH9pNVQDpQrBxHy01Dx+vaMu0N1CKa/RzBD2hB4u//nfc+Sd3Cw==}
engines: {node: '>=18'}
cpu: [x64]
os: [linux]
'@esbuild/linux-x64@0.25.1':
resolution: {integrity: sha512-xbfUhu/gnvSEg+EGovRc+kjBAkrvtk38RlerAzQxvMzlB4fXpCFCeUAYzJvrnhFtdeyVCDANSjJvOvGYoeKzFA==}
engines: {node: '>=18'}
cpu: [x64]
os: [linux]
'@esbuild/netbsd-arm64@0.25.0':
resolution: {integrity: sha512-RuG4PSMPFfrkH6UwCAqBzauBWTygTvb1nxWasEJooGSJ/NwRw7b2HOwyRTQIU97Hq37l3npXoZGYMy3b3xYvPw==}
engines: {node: '>=18'}
cpu: [arm64]
os: [netbsd]
'@esbuild/netbsd-arm64@0.25.1':
resolution: {integrity: sha512-O96poM2XGhLtpTh+s4+nP7YCCAfb4tJNRVZHfIE7dgmax+yMP2WgMd2OecBuaATHKTHsLWHQeuaxMRnCsH8+5g==}
engines: {node: '>=18'}
@@ -1838,12 +1724,6 @@ packages:
cpu: [x64]
os: [netbsd]
'@esbuild/netbsd-x64@0.25.0':
resolution: {integrity: sha512-jl+qisSB5jk01N5f7sPCsBENCOlPiS/xptD5yxOx2oqQfyourJwIKLRA2yqWdifj3owQZCL2sn6o08dBzZGQzA==}
engines: {node: '>=18'}
cpu: [x64]
os: [netbsd]
'@esbuild/netbsd-x64@0.25.1':
resolution: {integrity: sha512-X53z6uXip6KFXBQ+Krbx25XHV/NCbzryM6ehOAeAil7X7oa4XIq+394PWGnwaSQ2WRA0KI6PUO6hTO5zeF5ijA==}
engines: {node: '>=18'}
@@ -1856,12 +1736,6 @@ packages:
cpu: [arm64]
os: [openbsd]
'@esbuild/openbsd-arm64@0.25.0':
resolution: {integrity: sha512-21sUNbq2r84YE+SJDfaQRvdgznTD8Xc0oc3p3iW/a1EVWeNj/SdUCbm5U0itZPQYRuRTW20fPMWMpcrciH2EJw==}
engines: {node: '>=18'}
cpu: [arm64]
os: [openbsd]
'@esbuild/openbsd-arm64@0.25.1':
resolution: {integrity: sha512-Na9T3szbXezdzM/Kfs3GcRQNjHzM6GzFBeU1/6IV/npKP5ORtp9zbQjvkDJ47s6BCgaAZnnnu/cY1x342+MvZg==}
engines: {node: '>=18'}
@@ -1874,12 +1748,6 @@ packages:
cpu: [x64]
os: [openbsd]
'@esbuild/openbsd-x64@0.25.0':
resolution: {integrity: sha512-2gwwriSMPcCFRlPlKx3zLQhfN/2WjJ2NSlg5TKLQOJdV0mSxIcYNTMhk3H3ulL/cak+Xj0lY1Ym9ysDV1igceg==}
engines: {node: '>=18'}
cpu: [x64]
os: [openbsd]
'@esbuild/openbsd-x64@0.25.1':
resolution: {integrity: sha512-T3H78X2h1tszfRSf+txbt5aOp/e7TAz3ptVKu9Oyir3IAOFPGV6O9c2naym5TOriy1l0nNf6a4X5UXRZSGX/dw==}
engines: {node: '>=18'}
@@ -1892,12 +1760,6 @@ packages:
cpu: [x64]
os: [sunos]
'@esbuild/sunos-x64@0.25.0':
resolution: {integrity: sha512-bxI7ThgLzPrPz484/S9jLlvUAHYMzy6I0XiU1ZMeAEOBcS0VePBFxh1JjTQt3Xiat5b6Oh4x7UC7IwKQKIJRIg==}
engines: {node: '>=18'}
cpu: [x64]
os: [sunos]
'@esbuild/sunos-x64@0.25.1':
resolution: {integrity: sha512-2H3RUvcmULO7dIE5EWJH8eubZAI4xw54H1ilJnRNZdeo8dTADEZ21w6J22XBkXqGJbe0+wnNJtw3UXRoLJnFEg==}
engines: {node: '>=18'}
@@ -1910,12 +1772,6 @@ packages:
cpu: [arm64]
os: [win32]
'@esbuild/win32-arm64@0.25.0':
resolution: {integrity: sha512-ZUAc2YK6JW89xTbXvftxdnYy3m4iHIkDtK3CLce8wg8M2L+YZhIvO1DKpxrd0Yr59AeNNkTiic9YLf6FTtXWMw==}
engines: {node: '>=18'}
cpu: [arm64]
os: [win32]
'@esbuild/win32-arm64@0.25.1':
resolution: {integrity: sha512-GE7XvrdOzrb+yVKB9KsRMq+7a2U/K5Cf/8grVFRAGJmfADr/e/ODQ134RK2/eeHqYV5eQRFxb1hY7Nr15fv1NQ==}
engines: {node: '>=18'}
@@ -1928,12 +1784,6 @@ packages:
cpu: [ia32]
os: [win32]
'@esbuild/win32-ia32@0.25.0':
resolution: {integrity: sha512-eSNxISBu8XweVEWG31/JzjkIGbGIJN/TrRoiSVZwZ6pkC6VX4Im/WV2cz559/TXLcYbcrDN8JtKgd9DJVIo8GA==}
engines: {node: '>=18'}
cpu: [ia32]
os: [win32]
'@esbuild/win32-ia32@0.25.1':
resolution: {integrity: sha512-uOxSJCIcavSiT6UnBhBzE8wy3n0hOkJsBOzy7HDAuTDE++1DJMRRVCPGisULScHL+a/ZwdXPpXD3IyFKjA7K8A==}
engines: {node: '>=18'}
@@ -1946,12 +1796,6 @@ packages:
cpu: [x64]
os: [win32]
'@esbuild/win32-x64@0.25.0':
resolution: {integrity: sha512-ZENoHJBxA20C2zFzh6AI4fT6RraMzjYw4xKWemRTRmRVtN9c5DcH9r/f2ihEkMjOW5eGgrwCslG/+Y/3bL+DHQ==}
engines: {node: '>=18'}
cpu: [x64]
os: [win32]
'@esbuild/win32-x64@0.25.1':
resolution: {integrity: sha512-Y1EQdcfwMSeQN/ujR5VayLOJ1BHaK+ssyk0AEzPjC+t1lITgsnccPqFjb6V+LsTp/9Iov4ysfjxLaGJ9RPtkVg==}
engines: {node: '>=18'}
@@ -3590,9 +3434,6 @@ packages:
'@tanstack/virtual-core@3.13.0':
resolution: {integrity: sha512-NBKJP3OIdmZY3COJdWkSonr50FMVIi+aj5ZJ7hI/DTpEKg2RMfo/KvP8A3B/zOSpMgIe52B5E2yn7rryULzA6g==}
'@tanstack/virtual-core@3.13.4':
resolution: {integrity: sha512-fNGO9fjjSLns87tlcto106enQQLycCKR4DPNpgq3djP5IdcPFdPAmaKjsgzIeRhH7hWrELgW12hYnRthS5kLUw==}
'@tanstack/virtual-core@3.13.5':
resolution: {integrity: sha512-gMLNylxhJdUlfRR1G3U9rtuwUh2IjdrrniJIDcekVJN3/3i+bluvdMi3+eodnxzJq5nKnxnigo9h0lIpaqV6HQ==}
@@ -3601,11 +3442,6 @@ packages:
peerDependencies:
vue: ^2.7.0 || ^3.0.0
'@tanstack/vue-virtual@3.13.4':
resolution: {integrity: sha512-1fPrd3hE1SS4R/9JbX1AlzueY4duCK7ixuLcMW5GMnk9N6WbLo9MioNKiv22V+UaXKOLNy8tLdzT8NYerOFTOQ==}
peerDependencies:
vue: ^2.7.0 || ^3.0.0
'@tanstack/vue-virtual@3.13.5':
resolution: {integrity: sha512-1hhUA6CUjmKc5JDyKLcYOV6mI631FaKKxXh77Ja4UtIy6EOofYaLPk8vVgvK6vLMUSfHR2vI3ZpPY9ibyX60SA==}
peerDependencies:
@@ -3849,9 +3685,6 @@ packages:
'@types/uuid@9.0.8':
resolution: {integrity: sha512-jg+97EGIcY9AGHJJRaaPVgetKDsrTgbRjQ5Msgjh/DQKEFl0DtyRr/VCOyD1T2R1MNeWPK/u7JoGhlDZnKBAfA==}
'@types/web-bluetooth@0.0.20':
resolution: {integrity: sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==}
'@types/web-bluetooth@0.0.21':
resolution: {integrity: sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA==}
@@ -3928,7 +3761,6 @@ packages:
'@unraid/libvirt@1.1.3':
resolution: {integrity: sha512-aZNHkwgQ/0e+5BE7i3Ru4GC3Ev8fEUlnU0wmTcuSbpN0r74rMpiGwzA/4cqIJU8X+Kj//I80pkUufzXzHmMWwQ==}
engines: {node: '>=14'}
cpu: [x64, arm64]
os: [linux, darwin]
'@unraid/tailwind-rem-to-rem@1.1.0':
@@ -4227,9 +4059,6 @@ packages:
peerDependencies:
vue: ^3.5.0
'@vueuse/core@10.11.1':
resolution: {integrity: sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==}
'@vueuse/core@12.8.2':
resolution: {integrity: sha512-HbvCmZdzAu3VGi/pWYm5Ut+Kd9mn1ZHnn4L5G8kOQTPs/IwIAmJoBrmYk2ckLArgMXZj0AW3n5CAejLUO+PhdQ==}
@@ -4280,9 +4109,6 @@ packages:
universal-cookie:
optional: true
'@vueuse/metadata@10.11.1':
resolution: {integrity: sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==}
'@vueuse/metadata@12.8.2':
resolution: {integrity: sha512-rAyLGEuoBJ/Il5AmFHiziCPdQzRt88VxR+Y/A/QhJ1EWtWqPBBAxTAFaSkviwEuOEZNtW8pvkPgoCZQ+HxqW1A==}
@@ -4295,9 +4121,6 @@ packages:
nuxt: ^3.0.0 || ^4.0.0-0
vue: ^3.5.0
'@vueuse/shared@10.11.1':
resolution: {integrity: sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==}
'@vueuse/shared@12.8.2':
resolution: {integrity: sha512-dznP38YzxZoNloI0qpEfpkms8knDtaoQ6Y/sfS0L7Yki4zh40LFHEhur0odJC6xTHG5dxWVPiUWBXn+wCG2s5w==}
@@ -6178,11 +6001,6 @@ packages:
engines: {node: '>=18'}
hasBin: true
esbuild@0.25.0:
resolution: {integrity: sha512-BXq5mqc8ltbaN34cDqWuYKyNhX8D/Z0J1xdtdQ8UcIIIyJyz+ZMKUt58tF3SrZ85jcfN/PZYhjR5uDQAYNVbuw==}
engines: {node: '>=18'}
hasBin: true
esbuild@0.25.1:
resolution: {integrity: sha512-BGO5LtrGC7vxnqucAe/rmvKdJllfGaYWdyABvyMoXQlfYMb2bbRuReWR5tEGE//4LcNJj9XrkovTqNYRFZHAMQ==}
engines: {node: '>=18'}
@@ -8391,11 +8209,6 @@ packages:
engines: {node: ^18 || >=20}
hasBin: true
nanoid@5.1.4:
resolution: {integrity: sha512-GTFcMIDgR7tqji/LpSY8rtg464VnJl/j6ypoehYnuGb+Y8qZUdtKB8WVCXon0UEZgFDbuUxpIl//6FHLHgXSNA==}
engines: {node: ^18 || >=20}
hasBin: true
nanotar@0.2.0:
resolution: {integrity: sha512-9ca1h0Xjvo9bEkE4UOxgAzLV0jHKe6LMaxo37ND2DAhhAtd0j8pR1Wxz+/goMrZO8AEZTWCmyaOsFI/W5AdpCQ==}
@@ -9532,11 +9345,6 @@ packages:
resolution: {integrity: sha512-AAFUA5O1d83pIHEhJwWCq/RQcRukCkn/NSm2QsTEMle5f2hP0ChI2+3Xb051PZCkLryI/Ir1MVKviT2FIloaTQ==}
engines: {node: '>=12'}
radix-vue@1.9.17:
resolution: {integrity: sha512-mVCu7I2vXt1L2IUYHTt0sZMz7s1K2ZtqKeTIxG3yC5mMFfLBG4FtE1FDeRMpDd+Hhg/ybi9+iXmAP1ISREndoQ==}
peerDependencies:
vue: '>= 3.2.0'
radix3@1.1.2:
resolution: {integrity: sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==}
@@ -11167,8 +10975,8 @@ packages:
peerDependencies:
vite: ^3.0.0-0 || ^4.0.0-0 || ^5.0.0-0 || ^6.0.0-0
vite-plugin-vue-tracer@0.1.2:
resolution: {integrity: sha512-pH8BaBQfC9K9A2/ENsdOSfyba76BZGDsmzi7LvgDqNMcPekznIHRdPFjPMVWetYz7fQGPHqvuSQjUrdTyYLmnQ==}
vite-plugin-vue-tracer@0.1.3:
resolution: {integrity: sha512-+fN6oo0//dwZP9Ax9gRKeUroCqpQ43P57qlWgL0ljCIxAs+Rpqn/L4anIPZPgjDPga5dZH+ZJsshbF0PNJbm3Q==}
peerDependencies:
vite: ^6.0.0
vue: ^3.5.0
@@ -12474,99 +12282,66 @@ snapshots:
'@esbuild/aix-ppc64@0.23.1':
optional: true
'@esbuild/aix-ppc64@0.25.0':
optional: true
'@esbuild/aix-ppc64@0.25.1':
optional: true
'@esbuild/android-arm64@0.23.1':
optional: true
'@esbuild/android-arm64@0.25.0':
optional: true
'@esbuild/android-arm64@0.25.1':
optional: true
'@esbuild/android-arm@0.23.1':
optional: true
'@esbuild/android-arm@0.25.0':
optional: true
'@esbuild/android-arm@0.25.1':
optional: true
'@esbuild/android-x64@0.23.1':
optional: true
'@esbuild/android-x64@0.25.0':
optional: true
'@esbuild/android-x64@0.25.1':
optional: true
'@esbuild/darwin-arm64@0.23.1':
optional: true
'@esbuild/darwin-arm64@0.25.0':
optional: true
'@esbuild/darwin-arm64@0.25.1':
optional: true
'@esbuild/darwin-x64@0.23.1':
optional: true
'@esbuild/darwin-x64@0.25.0':
optional: true
'@esbuild/darwin-x64@0.25.1':
optional: true
'@esbuild/freebsd-arm64@0.23.1':
optional: true
'@esbuild/freebsd-arm64@0.25.0':
optional: true
'@esbuild/freebsd-arm64@0.25.1':
optional: true
'@esbuild/freebsd-x64@0.23.1':
optional: true
'@esbuild/freebsd-x64@0.25.0':
optional: true
'@esbuild/freebsd-x64@0.25.1':
optional: true
'@esbuild/linux-arm64@0.23.1':
optional: true
'@esbuild/linux-arm64@0.25.0':
optional: true
'@esbuild/linux-arm64@0.25.1':
optional: true
'@esbuild/linux-arm@0.23.1':
optional: true
'@esbuild/linux-arm@0.25.0':
optional: true
'@esbuild/linux-arm@0.25.1':
optional: true
'@esbuild/linux-ia32@0.23.1':
optional: true
'@esbuild/linux-ia32@0.25.0':
optional: true
'@esbuild/linux-ia32@0.25.1':
optional: true
@@ -12576,123 +12351,81 @@ snapshots:
'@esbuild/linux-loong64@0.23.1':
optional: true
'@esbuild/linux-loong64@0.25.0':
optional: true
'@esbuild/linux-loong64@0.25.1':
optional: true
'@esbuild/linux-mips64el@0.23.1':
optional: true
'@esbuild/linux-mips64el@0.25.0':
optional: true
'@esbuild/linux-mips64el@0.25.1':
optional: true
'@esbuild/linux-ppc64@0.23.1':
optional: true
'@esbuild/linux-ppc64@0.25.0':
optional: true
'@esbuild/linux-ppc64@0.25.1':
optional: true
'@esbuild/linux-riscv64@0.23.1':
optional: true
'@esbuild/linux-riscv64@0.25.0':
optional: true
'@esbuild/linux-riscv64@0.25.1':
optional: true
'@esbuild/linux-s390x@0.23.1':
optional: true
'@esbuild/linux-s390x@0.25.0':
optional: true
'@esbuild/linux-s390x@0.25.1':
optional: true
'@esbuild/linux-x64@0.23.1':
optional: true
'@esbuild/linux-x64@0.25.0':
optional: true
'@esbuild/linux-x64@0.25.1':
optional: true
'@esbuild/netbsd-arm64@0.25.0':
optional: true
'@esbuild/netbsd-arm64@0.25.1':
optional: true
'@esbuild/netbsd-x64@0.23.1':
optional: true
'@esbuild/netbsd-x64@0.25.0':
optional: true
'@esbuild/netbsd-x64@0.25.1':
optional: true
'@esbuild/openbsd-arm64@0.23.1':
optional: true
'@esbuild/openbsd-arm64@0.25.0':
optional: true
'@esbuild/openbsd-arm64@0.25.1':
optional: true
'@esbuild/openbsd-x64@0.23.1':
optional: true
'@esbuild/openbsd-x64@0.25.0':
optional: true
'@esbuild/openbsd-x64@0.25.1':
optional: true
'@esbuild/sunos-x64@0.23.1':
optional: true
'@esbuild/sunos-x64@0.25.0':
optional: true
'@esbuild/sunos-x64@0.25.1':
optional: true
'@esbuild/win32-arm64@0.23.1':
optional: true
'@esbuild/win32-arm64@0.25.0':
optional: true
'@esbuild/win32-arm64@0.25.1':
optional: true
'@esbuild/win32-ia32@0.23.1':
optional: true
'@esbuild/win32-ia32@0.25.0':
optional: true
'@esbuild/win32-ia32@0.25.1':
optional: true
'@esbuild/win32-x64@0.23.1':
optional: true
'@esbuild/win32-x64@0.25.0':
optional: true
'@esbuild/win32-x64@0.25.1':
optional: true
@@ -13899,7 +13632,7 @@ snapshots:
tinyglobby: 0.2.12
vite: 6.2.3(@types/node@22.13.13)(jiti@2.4.2)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0)
vite-plugin-inspect: 11.0.0(@nuxt/kit@3.16.1(magicast@0.3.5))(vite@6.2.3(@types/node@22.13.13)(jiti@2.4.2)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0))
vite-plugin-vue-tracer: 0.1.2(vite@6.2.3(@types/node@22.13.13)(jiti@2.4.2)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0))(vue@3.5.13(typescript@5.8.2))
vite-plugin-vue-tracer: 0.1.3(vite@6.2.3(@types/node@22.13.13)(jiti@2.4.2)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0))(vue@3.5.13(typescript@5.8.2))
which: 5.0.0
ws: 8.18.1
transitivePeerDependencies:
@@ -14917,8 +14650,6 @@ snapshots:
'@tanstack/virtual-core@3.13.0': {}
'@tanstack/virtual-core@3.13.4': {}
'@tanstack/virtual-core@3.13.5': {}
'@tanstack/vue-virtual@3.13.0(vue@3.5.13(typescript@5.8.2))':
@@ -14926,11 +14657,6 @@ snapshots:
'@tanstack/virtual-core': 3.13.0
vue: 3.5.13(typescript@5.8.2)
'@tanstack/vue-virtual@3.13.4(vue@3.5.13(typescript@5.8.2))':
dependencies:
'@tanstack/virtual-core': 3.13.4
vue: 3.5.13(typescript@5.8.2)
'@tanstack/vue-virtual@3.13.5(vue@3.5.13(typescript@5.8.2))':
dependencies:
'@tanstack/virtual-core': 3.13.5
@@ -15202,8 +14928,6 @@ snapshots:
'@types/uuid@9.0.8': {}
'@types/web-bluetooth@0.0.20': {}
'@types/web-bluetooth@0.0.21': {}
'@types/ws@8.18.0':
@@ -15719,16 +15443,6 @@ snapshots:
'@vueuse/shared': 13.0.0(vue@3.5.13(typescript@5.8.2))
vue: 3.5.13(typescript@5.8.2)
'@vueuse/core@10.11.1(vue@3.5.13(typescript@5.8.2))':
dependencies:
'@types/web-bluetooth': 0.0.20
'@vueuse/metadata': 10.11.1
'@vueuse/shared': 10.11.1(vue@3.5.13(typescript@5.8.2))
vue-demi: 0.14.10(vue@3.5.13(typescript@5.8.2))
transitivePeerDependencies:
- '@vue/composition-api'
- vue
'@vueuse/core@12.8.2(typescript@5.8.2)':
dependencies:
'@types/web-bluetooth': 0.0.21
@@ -15755,8 +15469,6 @@ snapshots:
focus-trap: 7.6.4
fuse.js: 7.1.0
'@vueuse/metadata@10.11.1': {}
'@vueuse/metadata@12.8.2': {}
'@vueuse/metadata@13.0.0': {}
@@ -15772,13 +15484,6 @@ snapshots:
transitivePeerDependencies:
- magicast
'@vueuse/shared@10.11.1(vue@3.5.13(typescript@5.8.2))':
dependencies:
vue-demi: 0.14.10(vue@3.5.13(typescript@5.8.2))
transitivePeerDependencies:
- '@vue/composition-api'
- vue
'@vueuse/shared@12.8.2(typescript@5.8.2)':
dependencies:
vue: 3.5.13(typescript@5.8.2)
@@ -17702,7 +17407,7 @@ snapshots:
es-set-tostringtag@2.1.0:
dependencies:
es-errors: 1.3.0
get-intrinsic: 1.2.7
get-intrinsic: 1.3.0
has-tostringtag: 1.0.2
hasown: 2.0.2
@@ -17836,34 +17541,6 @@ snapshots:
'@esbuild/win32-ia32': 0.23.1
'@esbuild/win32-x64': 0.23.1
esbuild@0.25.0:
optionalDependencies:
'@esbuild/aix-ppc64': 0.25.0
'@esbuild/android-arm': 0.25.0
'@esbuild/android-arm64': 0.25.0
'@esbuild/android-x64': 0.25.0
'@esbuild/darwin-arm64': 0.25.0
'@esbuild/darwin-x64': 0.25.0
'@esbuild/freebsd-arm64': 0.25.0
'@esbuild/freebsd-x64': 0.25.0
'@esbuild/linux-arm': 0.25.0
'@esbuild/linux-arm64': 0.25.0
'@esbuild/linux-ia32': 0.25.0
'@esbuild/linux-loong64': 0.25.0
'@esbuild/linux-mips64el': 0.25.0
'@esbuild/linux-ppc64': 0.25.0
'@esbuild/linux-riscv64': 0.25.0
'@esbuild/linux-s390x': 0.25.0
'@esbuild/linux-x64': 0.25.0
'@esbuild/netbsd-arm64': 0.25.0
'@esbuild/netbsd-x64': 0.25.0
'@esbuild/openbsd-arm64': 0.25.0
'@esbuild/openbsd-x64': 0.25.0
'@esbuild/sunos-x64': 0.25.0
'@esbuild/win32-arm64': 0.25.0
'@esbuild/win32-ia32': 0.25.0
'@esbuild/win32-x64': 0.25.0
esbuild@0.25.1:
optionalDependencies:
'@esbuild/aix-ppc64': 0.25.1
@@ -20302,8 +19979,6 @@ snapshots:
nanoid@5.1.0: {}
nanoid@5.1.4: {}
nanotar@0.2.0: {}
natural-compare@1.4.0: {}
@@ -21723,23 +21398,6 @@ snapshots:
quick-lru@6.1.2: {}
radix-vue@1.9.17(vue@3.5.13(typescript@5.8.2)):
dependencies:
'@floating-ui/dom': 1.6.13
'@floating-ui/vue': 1.1.6(vue@3.5.13(typescript@5.8.2))
'@internationalized/date': 3.7.0
'@internationalized/number': 3.6.0
'@tanstack/vue-virtual': 3.13.4(vue@3.5.13(typescript@5.8.2))
'@vueuse/core': 10.11.1(vue@3.5.13(typescript@5.8.2))
'@vueuse/shared': 10.11.1(vue@3.5.13(typescript@5.8.2))
aria-hidden: 1.2.4
defu: 6.1.4
fast-deep-equal: 3.1.3
nanoid: 5.1.4
vue: 3.5.13(typescript@5.8.2)
transitivePeerDependencies:
- '@vue/composition-api'
radix3@1.1.2: {}
randombytes@2.1.0:
@@ -22935,7 +22593,7 @@ snapshots:
terser@5.39.0:
dependencies:
'@jridgewell/source-map': 0.3.6
acorn: 8.14.0
acorn: 8.14.1
commander: 2.20.3
source-map-support: 0.5.21
@@ -23092,7 +22750,7 @@ snapshots:
tsx@4.19.3:
dependencies:
esbuild: 0.25.0
esbuild: 0.25.1
get-tsconfig: 4.10.0
optionalDependencies:
fsevents: 2.3.3
@@ -23591,7 +23249,7 @@ snapshots:
transitivePeerDependencies:
- supports-color
vite-plugin-vue-tracer@0.1.2(vite@6.2.3(@types/node@22.13.13)(jiti@2.4.2)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0))(vue@3.5.13(typescript@5.8.2)):
vite-plugin-vue-tracer@0.1.3(vite@6.2.3(@types/node@22.13.13)(jiti@2.4.2)(stylus@0.57.0)(terser@5.39.0)(tsx@4.19.3)(yaml@2.7.0))(vue@3.5.13(typescript@5.8.2)):
dependencies:
estree-walker: 3.0.3
exsolve: 1.0.4
+1 -2
View File
@@ -49,9 +49,8 @@
"clsx": "^2.1.1",
"kebab-case": "^2.0.1",
"lucide-vue-next": "^0.483.0",
"radix-vue": "^1.9.13",
"shadcn-vue": "^1.0.0",
"reka-ui": "^2.1.0",
"shadcn-vue": "^1.0.0",
"tailwind-merge": "^2.6.0",
"vue-sonner": "^1.3.0"
},
@@ -1,25 +1,11 @@
<script setup lang="ts">
import { computed } from 'vue';
import type { Component } from 'vue';
import { badgeVariants } from './badge.variants';
import { badgeVariants, type BadgeVariants } from './badge.variants';
export interface BadgeProps {
variant?:
| 'red'
| 'yellow'
| 'green'
| 'blue'
| 'indigo'
| 'purple'
| 'pink'
| 'orange'
| 'black'
| 'white'
| 'transparent'
| 'current'
| 'gray'
| 'custom';
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
variant?: BadgeVariants['variant'];
size?: BadgeVariants['size'];
icon?: Component;
iconRight?: Component;
iconStyles?: string;
@@ -1,37 +1,39 @@
import { cva } from "class-variance-authority";
import { cva, VariantProps } from 'class-variance-authority';
export const badgeVariants = cva(
"inline-flex items-center rounded-full font-semibold leading-none transition-all duration-200 ease-in-out unraid-ui-badge-test",
'inline-flex items-center rounded-full font-semibold leading-none transition-all duration-200 ease-in-out unraid-ui-badge-test',
{
variants: {
variant: {
red: "bg-unraid-red text-white hover:bg-orange-dark",
yellow: "bg-yellow-100 text-black hover:bg-yellow-200",
green: "bg-green-200 text-green-800 hover:bg-green-300",
blue: "bg-blue-100 text-blue-800 hover:bg-blue-200",
indigo: "bg-indigo-100 text-indigo-800 hover:bg-indigo-200",
purple: "bg-purple-100 text-purple-800 hover:bg-purple-200",
pink: "bg-pink-100 text-pink-800 hover:bg-pink-200",
orange: "bg-orange text-white hover:bg-orange-dark",
black: "bg-black text-white hover:bg-gray-800",
white: "bg-white text-black hover:bg-gray-100",
transparent: "bg-transparent text-black hover:bg-gray-100",
current: "bg-current text-current hover:bg-gray-100",
gray: "bg-gray-200 text-gray-800 hover:bg-gray-300",
custom: "",
red: 'bg-unraid-red text-white hover:bg-orange-dark',
yellow: 'bg-yellow-100 text-black hover:bg-yellow-200',
green: 'bg-green-200 text-green-800 hover:bg-green-300',
blue: 'bg-blue-100 text-blue-800 hover:bg-blue-200',
indigo: 'bg-indigo-100 text-indigo-800 hover:bg-indigo-200',
purple: 'bg-purple-100 text-purple-800 hover:bg-purple-200',
pink: 'bg-pink-100 text-pink-800 hover:bg-pink-200',
orange: 'bg-orange text-white hover:bg-orange-dark',
black: 'bg-black text-white hover:bg-gray-800',
white: 'bg-white text-black hover:bg-gray-100',
transparent: 'bg-transparent text-black hover:bg-gray-100',
current: 'bg-current text-current hover:bg-gray-100',
gray: 'bg-gray-200 text-gray-800 hover:bg-gray-300',
custom: '',
},
size: {
xs: "text-12px px-8px py-4px gap-4px",
sm: "text-14px px-8px py-4px gap-8px",
md: "text-16px px-12px py-8px gap-8px",
lg: "text-18px px-12px py-8px gap-8px",
xl: "text-20px px-16px py-12px gap-8px",
"2xl": "text-24px px-16px py-12px gap-8px",
xs: 'text-12px px-8px py-4px gap-4px',
sm: 'text-14px px-8px py-4px gap-8px',
md: 'text-16px px-12px py-8px gap-8px',
lg: 'text-18px px-12px py-8px gap-8px',
xl: 'text-20px px-16px py-12px gap-8px',
'2xl': 'text-24px px-16px py-12px gap-8px',
},
},
defaultVariants: {
variant: "gray",
size: "md",
variant: 'gray',
size: 'md',
},
}
);
export type BadgeVariants = VariantProps<typeof badgeVariants>;
@@ -1,30 +1,21 @@
<script setup lang="ts">
import { computed } from "vue";
import { buttonVariants } from "./button.variants";
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
import { computed } from 'vue';
import { buttonVariants, type ButtonVariants } from './button.variants';
export interface ButtonProps {
variant?:
| "primary"
| "destructive"
| "outline"
| "secondary"
| "ghost"
| "link";
size?: "sm" | "md" | "lg" | "icon";
variant?: ButtonVariants['variant'];
size?: ButtonVariants['size'];
class?: string;
}
const props = withDefaults(defineProps<ButtonProps>(), {
variant: "primary",
size: "md",
variant: 'primary',
size: 'md',
});
const buttonClass = computed(() => {
return cn(
buttonVariants({ variant: props.variant, size: props.size }),
props.class
);
return cn(buttonVariants({ variant: props.variant, size: props.size }), props.class);
});
</script>
@@ -1,30 +1,29 @@
import { cva } from "class-variance-authority";
import { cva, VariantProps } from 'class-variance-authority';
export const buttonVariants = cva(
"inline-flex items-center justify-center rounded-md text-base font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
'inline-flex items-center justify-center rounded-md text-base font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
{
variants: {
variant: {
primary: "bg-primary text-primary-foreground hover:bg-primary/90",
destructive:
"bg-destructive text-destructive-foreground hover:bg-destructive/90",
outline:
"border border-input bg-background hover:bg-accent hover:text-accent-foreground",
secondary:
"bg-secondary text-secondary-foreground hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground",
link: "text-primary underline-offset-4 hover:underline",
primary: 'bg-primary text-primary-foreground hover:bg-primary/90',
destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
ghost: 'hover:bg-accent hover:text-accent-foreground',
link: 'text-primary underline-offset-4 hover:underline',
},
size: {
sm: "h-9 rounded-md px-3",
md: "h-10 px-4 py-2",
lg: "h-11 rounded-md px-8",
icon: "h-10 w-10",
sm: 'h-9 rounded-md px-3',
md: 'h-10 px-4 py-2',
lg: 'h-11 rounded-md px-8',
icon: 'h-10 w-10',
},
},
defaultVariants: {
variant: "primary",
size: "md",
variant: 'primary',
size: 'md',
},
}
);
export type ButtonVariants = VariantProps<typeof buttonVariants>;
@@ -1,17 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from "vue";
import {
ScrollAreaCorner,
ScrollAreaRoot,
type ScrollAreaRootProps,
ScrollAreaViewport,
} from "radix-vue";
import ScrollBar from "./ScrollBar.vue";
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
import { ScrollAreaCorner, ScrollAreaRoot, ScrollAreaViewport, type ScrollAreaRootProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
import ScrollBar from './ScrollBar.vue';
const props = defineProps<
ScrollAreaRootProps & { class?: HTMLAttributes["class"] }
>();
const props = defineProps<ScrollAreaRootProps & { class?: HTMLAttributes['class'] }>();
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props;
@@ -21,10 +14,7 @@ const delegatedProps = computed(() => {
</script>
<template>
<ScrollAreaRoot
v-bind="delegatedProps"
:class="cn('relative overflow-hidden', props.class)"
>
<ScrollAreaRoot v-bind="delegatedProps" :class="cn('relative overflow-hidden', props.class)">
<ScrollAreaViewport class="h-full w-full rounded-[inherit]">
<slot />
</ScrollAreaViewport>
@@ -1,16 +1,12 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from "vue";
import {
ScrollAreaScrollbar,
type ScrollAreaScrollbarProps,
ScrollAreaThumb,
} from "radix-vue";
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
import { ScrollAreaScrollbar, ScrollAreaThumb, type ScrollAreaScrollbarProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = withDefaults(
defineProps<ScrollAreaScrollbarProps & { class?: HTMLAttributes["class"] }>(),
defineProps<ScrollAreaScrollbarProps & { class?: HTMLAttributes['class'] }>(),
{
orientation: "vertical",
orientation: 'vertical',
class: undefined,
}
);
@@ -28,10 +24,8 @@ const delegatedProps = computed(() => {
:class="
cn(
'flex touch-none select-none transition-colors',
orientation === 'vertical' &&
'h-full w-2.5 border-l border-l-transparent p-px',
orientation === 'horizontal' &&
'h-2.5 flex-col border-t border-t-transparent p-px',
orientation === 'vertical' && 'h-full w-2.5 border-l border-l-transparent p-px',
orientation === 'horizontal' && 'h-2.5 flex-col border-t border-t-transparent p-px',
props.class
)
"
@@ -1,4 +1,5 @@
<script setup lang="ts">
import useTeleport from '@/composables/useTeleport';
import { cn } from '@/lib/utils';
import { X } from 'lucide-vue-next';
import {
@@ -10,17 +11,19 @@ import {
type DialogContentEmits,
} from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
import { sheetVariants } from './sheet.variants';
import { sheetVariants, type SheetVariants } from './sheet.variants';
export interface SheetContentProps {
side?: 'top' | 'bottom' | 'left' | 'right';
padding?: 'none' | 'md';
side?: SheetVariants['side'];
padding?: SheetVariants['padding'];
class?: HTMLAttributes['class'];
disabled?: boolean;
forceMount?: boolean;
to?: string | HTMLElement;
}
const { teleportTarget } = useTeleport();
const props = withDefaults(defineProps<SheetContentProps>(), {
side: 'right',
padding: 'md',
@@ -41,7 +44,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
</script>
<template>
<DialogPortal :disabled="disabled" :force-mount="forceMount" :to="to">
<DialogPortal :disabled="disabled" :force-mount="forceMount" :to="teleportTarget">
<DialogOverlay
class="fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
/>
@@ -1,23 +1,27 @@
import { cva } from "class-variance-authority";
import { cva, VariantProps } from 'class-variance-authority';
export const sheetVariants = cva(
"fixed z-50 bg-background gap-4 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500 border-border",
'fixed z-50 bg-background gap-4 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500 border-border',
{
variants: {
side: {
top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
bottom:
'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
left: 'inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',
right:
'inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',
},
padding: {
none: "",
md: "p-6",
none: '',
md: 'p-6',
},
},
defaultVariants: {
side: "right",
padding: "md",
side: 'right',
padding: 'md',
},
}
);
);
export type SheetVariants = VariantProps<typeof sheetVariants>;
@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils';
import type { StepperRootEmits, StepperRootProps } from 'radix-vue';
import { StepperRoot, useForwardPropsEmits } from 'radix-vue';
import type { StepperRootEmits, StepperRootProps } from 'reka-ui';
import { StepperRoot, useForwardPropsEmits } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<StepperRootProps & { class?: HTMLAttributes['class'] }>();
@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils';
import type { StepperDescriptionProps } from 'radix-vue';
import { StepperDescription, useForwardProps } from 'radix-vue';
import type { StepperDescriptionProps } from 'reka-ui';
import { StepperDescription, useForwardProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<StepperDescriptionProps & { class?: HTMLAttributes['class'] }>();
@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils';
import type { StepperIndicatorProps } from 'radix-vue';
import { StepperIndicator, useForwardProps } from 'radix-vue';
import type { StepperIndicatorProps } from 'reka-ui';
import { StepperIndicator, useForwardProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<StepperIndicatorProps & { class?: HTMLAttributes['class'] }>();
@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils';
import type { StepperItemProps } from 'radix-vue';
import { StepperItem, useForwardProps } from 'radix-vue';
import type { StepperItemProps } from 'reka-ui';
import { StepperItem, useForwardProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<StepperItemProps & { class?: HTMLAttributes['class'] }>();
@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils';
import type { StepperSeparatorProps } from 'radix-vue';
import { StepperSeparator, useForwardProps } from 'radix-vue';
import type { StepperSeparatorProps } from 'reka-ui';
import { StepperSeparator, useForwardProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<StepperSeparatorProps & { class?: HTMLAttributes['class'] }>();
@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils';
import type { StepperTitleProps } from 'radix-vue';
import { StepperTitle, useForwardProps } from 'radix-vue';
import type { StepperTitleProps } from 'reka-ui';
import { StepperTitle, useForwardProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<StepperTitleProps & { class?: HTMLAttributes['class'] }>();
@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils';
import type { StepperTriggerProps } from 'radix-vue';
import { StepperTrigger, useForwardProps } from 'radix-vue';
import type { StepperTriggerProps } from 'reka-ui';
import { StepperTrigger, useForwardProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<StepperTriggerProps & { class?: HTMLAttributes['class'] }>();
@@ -1,6 +1,6 @@
<script setup lang="ts">
import { TabsRoot, useForwardPropsEmits } from 'radix-vue';
import type { TabsRootEmits, TabsRootProps } from 'radix-vue';
import { TabsRoot, useForwardPropsEmits } from 'reka-ui';
import type { TabsRootEmits, TabsRootProps } from 'reka-ui';
import type { HTMLAttributes } from 'vue';
const props = defineProps<TabsRootProps>();
@@ -1,11 +1,9 @@
<script setup lang="ts">
import { cn } from "@/lib/utils";
import { TabsContent, type TabsContentProps } from "radix-vue";
import { computed, type HTMLAttributes } from "vue";
import { cn } from '@/lib/utils';
import { TabsContent, type TabsContentProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<
TabsContentProps & { class?: HTMLAttributes["class"] }
>();
const props = defineProps<TabsContentProps & { class?: HTMLAttributes['class'] }>();
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props;
@@ -1,11 +1,9 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from "vue";
import { TabsList, type TabsListProps } from "radix-vue";
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
import { TabsList, type TabsListProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<
TabsListProps & { class?: HTMLAttributes["class"] }
>();
const props = defineProps<TabsListProps & { class?: HTMLAttributes['class'] }>();
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props;
@@ -1,11 +1,9 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from "vue";
import { TabsTrigger, type TabsTriggerProps, useForwardProps } from "radix-vue";
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
import { TabsTrigger, useForwardProps, type TabsTriggerProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<
TabsTriggerProps & { class?: HTMLAttributes["class"] }
>();
const props = defineProps<TabsTriggerProps & { class?: HTMLAttributes['class'] }>();
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props;
@@ -4,7 +4,7 @@ import {
useForwardPropsEmits,
type TooltipRootEmits,
type TooltipRootProps,
} from 'radix-vue';
} from 'reka-ui';
import type { HTMLAttributes } from 'vue';
const props = defineProps<TooltipRootProps>();
@@ -1,26 +1,23 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from "vue";
import useTeleport from '@/composables/useTeleport';
import { cn } from '@/lib/utils';
import {
TooltipContent,
type TooltipContentEmits,
type TooltipContentProps,
TooltipPortal,
useForwardPropsEmits,
} from "radix-vue";
import { cn } from "@/lib/utils";
import useTeleport from "@/composables/useTeleport";
type TooltipContentEmits,
type TooltipContentProps,
} from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
defineOptions({
inheritAttrs: false,
});
const props = withDefaults(
defineProps<TooltipContentProps & { class?: HTMLAttributes["class"] }>(),
{
sideOffset: 4,
class: undefined,
}
);
const props = withDefaults(defineProps<TooltipContentProps & { class?: HTMLAttributes['class'] }>(), {
sideOffset: 4,
class: undefined,
});
const emits = defineEmits<TooltipContentEmits>();
@@ -1,7 +1,7 @@
<script setup lang="ts">
import { TooltipProvider, type TooltipProviderProps } from 'radix-vue'
import { TooltipProvider, type TooltipProviderProps } from 'reka-ui';
const props = defineProps<TooltipProviderProps>()
const props = defineProps<TooltipProviderProps>();
</script>
<template>
@@ -1,7 +1,7 @@
<script setup lang="ts">
import { TooltipTrigger, type TooltipTriggerProps } from 'radix-vue'
import { TooltipTrigger, type TooltipTriggerProps } from 'reka-ui';
const props = defineProps<TooltipTriggerProps>()
const props = defineProps<TooltipTriggerProps>();
</script>
<template>
@@ -1,9 +1,9 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from "vue";
import { Label, type LabelProps } from "radix-vue";
import { cn } from "@/lib/utils";
import { cn } from '@/lib/utils';
import { Label, type LabelProps } from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<LabelProps & { class?: HTMLAttributes["class"] }>();
const props = defineProps<LabelProps & { class?: HTMLAttributes['class'] }>();
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props;
@@ -1,17 +1,15 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from "vue";
import { cn } from '@/lib/utils';
import {
SwitchRoot,
type SwitchRootEmits,
type SwitchRootProps,
SwitchThumb,
useForwardPropsEmits,
} from "radix-vue";
import { cn } from "@/lib/utils";
type SwitchRootEmits,
type SwitchRootProps,
} from 'reka-ui';
import { computed, type HTMLAttributes } from 'vue';
const props = defineProps<
SwitchRootProps & { class?: HTMLAttributes["class"] }
>();
const props = defineProps<SwitchRootProps & { class?: HTMLAttributes['class'] }>();
const emits = defineEmits<SwitchRootEmits>();
+1 -1
View File
@@ -52,7 +52,7 @@ const onSelectOpen = () => {
<span v-else>{{ control.schema.default ?? 'Select an option' }}</span>
</SelectTrigger>
<!-- The content includes the selectable options -->
<SelectContent :to="teleportTarget as HTMLElement">
<SelectContent :to="teleportTarget">
<SelectItem v-for="option in options" :key="option.value" :value="option.value">
<SelectItemText>{{ option.label }}</SelectItemText>
</SelectItem>
@@ -1,5 +1,4 @@
import type { Meta, StoryObj } from '@storybook/vue3';
import { h } from 'vue';
import Button from '../../../src/components/common/button/Button.vue';
import SheetComponent from '../../../src/components/common/sheet/Sheet.vue';
import SheetContent from '../../../src/components/common/sheet/SheetContent.vue';
+7 -1
View File
@@ -7,6 +7,12 @@
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.test.tsbuildinfo",
"types": ["node", "happy-dom", "vitest/globals", "@vue/test-utils", "@testing-library/vue"]
},
"include": ["src/**/*.test.ts", "src/**/*.spec.ts", "src/**/*.test.tsx", "src/**/*.spec.tsx"],
"include": [
"src/**/*.test.ts",
"src/**/*.spec.ts",
"src/**/*.test.tsx",
"src/**/*.spec.tsx",
"src/**/*.vue"
],
"exclude": ["node_modules", "**/*.copy.vue", "**/*copy.vue"]
}
+1 -2
View File
@@ -39,7 +39,7 @@ import {
const { mutate: archiveAll, loading: loadingArchiveAll } = useMutation(archiveAllNotifications);
const { mutate: deleteArchives, loading: loadingDeleteAll } = useMutation(deleteArchivedNotifications);
const { mutate: recalculateOverview } = useMutation(resetOverview);
const { teleportTarget, determineTeleportTarget } = useTeleport();
const { determineTeleportTarget } = useTeleport();
const importance = ref<Importance | undefined>(undefined);
const confirmAndArchiveAll = async () => {
@@ -127,7 +127,6 @@ const prepareToViewNotifications = () => {
<NotificationsIndicator :overview="overview" :seen="haveSeenNotifications" />
</SheetTrigger>
<SheetContent
:to="teleportTarget as HTMLElement"
side="right"
class="w-full max-w-[100vw] sm:max-w-[540px] max-h-screen h-screen min-h-screen px-0 flex flex-col gap-5 pb-0"
>
+2 -6
View File
@@ -67,6 +67,7 @@
"terser": "^5.37.0",
"typescript": "^5.7.3",
"vite-plugin-remove-console": "^2.2.0",
"vite-plugin-vue-tracer": "^0.1.3",
"vitest": "^3.0.0",
"vue-tsc": "^2.1.10",
"vuetify-nuxt-module": "0.18.4"
@@ -103,8 +104,6 @@
"marked": "^15.0.0",
"marked-base-url": "^1.1.6",
"pinia": "^3.0.1",
"radix-vue": "^1.9.13",
"reka-ui": "^2.0.2",
"semver": "^7.6.3",
"tailwind-merge": "^2.5.5",
"vue-i18n": "^11.0.0",
@@ -115,10 +114,7 @@
"@rollup/rollup-linux-x64-gnu": "^4.30.1"
},
"overrides": {
"vue": "latest",
"radix-vue": {
"@floating-ui/vue": "^1.1.5"
}
"vue": "latest"
},
"packageManager": "pnpm@10.6.5"
}