Merge branch 'oneclient/main' of https://github.com/Polyfrost/OneLauncher into oneclient/main
This commit is contained in:
Szedann
commit
aad310f2dd
9 changed files with 268 additions and 19 deletions
2
.vscode/settings.json
vendored
2
.vscode/settings.json
vendored
|
|
@ -12,7 +12,7 @@
|
|||
"editor.defaultFormatter": "rvest.vs-code-prettier-eslint"
|
||||
},
|
||||
"[typescriptreact]": {
|
||||
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
|
||||
"editor.defaultFormatter": "vscode.typescript-language-features"
|
||||
},
|
||||
"files.readonlyInclude": {
|
||||
"**/node_modules/**": true,
|
||||
|
|
|
|||
9
apps/oneclient/frontend/src/assets/logos/Logo.svg
Normal file
9
apps/oneclient/frontend/src/assets/logos/Logo.svg
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<svg width="153" height="32" viewBox="0 0 153 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M22.4648 25.3793V7.44458H25.2079L26.3799 11.0264V25.3793H22.4648ZM34.6091 25.3793L24.2353 11.8393L25.2079 7.44458L35.5818 20.9846L34.6091 25.3793ZM34.6091 25.3793L33.5616 21.7975V7.44458H37.4768V25.3793H34.6091ZM42.3714 25.3793V7.44458H46.2866V25.3793H42.3714ZM45.364 25.3793V21.9245H55.0144V25.3793H45.364ZM45.364 17.8854V14.5575H54.1416V17.8854H45.364ZM45.364 10.874V7.44458H54.8898V10.874H45.364Z" fill="#D5DBFF" fill-opacity="0.85"/>
|
||||
<path d="M67.2479 25.6588C65.9345 25.6588 64.7124 25.4302 63.5821 24.9729C62.4683 24.4987 61.4875 23.8382 60.6396 22.9915C59.8083 22.1447 59.16 21.1624 58.6945 20.0447C58.229 18.91 57.9961 17.6906 57.9961 16.3866C57.9961 15.0825 58.229 13.8716 58.6945 12.7539C59.16 11.6192 59.8083 10.6369 60.6396 9.80712C61.4707 8.97727 62.4434 8.33371 63.5572 7.87644C64.6875 7.40227 65.9096 7.16516 67.2229 7.16516C68.6192 7.16516 69.8578 7.3938 70.9385 7.85104C72.0355 8.30831 72.9914 8.93493 73.8063 9.7309L71.1877 12.4236C70.7222 11.9156 70.157 11.5176 69.4922 11.2297C68.8437 10.9418 68.0873 10.7979 67.2229 10.7979C66.4582 10.7979 65.7514 10.9333 65.1031 11.2043C64.4714 11.4583 63.9227 11.8309 63.4572 12.322C63.0085 12.8132 62.6511 13.4059 62.3852 14.1003C62.1358 14.7946 62.0109 15.5567 62.0109 16.3866C62.0109 17.2334 62.1358 18.0039 62.3852 18.6983C62.6511 19.3926 63.0085 19.9854 63.4572 20.4765C63.9227 20.9676 64.4714 21.3487 65.1031 21.6197C65.7514 21.8907 66.4582 22.0261 67.2229 22.0261C68.1206 22.0261 68.9019 21.8822 69.567 21.5943C70.2318 21.3064 70.8053 20.9084 71.2876 20.4003L73.9308 23.0931C73.083 23.889 72.1105 24.5156 71.0133 24.9729C69.9325 25.4302 68.6774 25.6588 67.2479 25.6588ZM77.5831 25.3794V7.44461H81.498V25.3794H77.5831ZM80.6003 25.3794V21.8737H89.3031V25.3794H80.6003ZM93.0575 25.3794V7.44461H96.9726V25.3794H93.0575ZM101.859 25.3794V7.44461H105.774V25.3794H101.859ZM104.852 25.3794V21.9245H114.502V25.3794H104.852ZM104.852 17.8854V14.5575H113.63V17.8854H104.852ZM104.852 10.874V7.44461H114.378V10.874H104.852ZM118.698 25.3794V7.44461H121.441L122.613 11.0265V25.3794H118.698ZM130.842 25.3794L120.468 11.8394L121.441 7.44461L131.814 20.9846L130.842 25.3794ZM130.842 25.3794L129.795 21.7975V7.44461H133.71V25.3794H130.842ZM142.918 25.3794V7.69862H146.833V25.3794H142.918ZM137.407 10.9249V7.44461H152.345V10.9249H137.407Z" fill="#D5DBFF"/>
|
||||
<path d="M7.90642 7.17236H6.63633C5.1788 7.17236 3.83197 7.95838 3.1032 9.23429L0.259 14.2139C0.161603 14.3844 0.0772228 14.5602 0.00585938 14.7399L4.04665 13.9875C5.67828 13.6836 6.95495 12.3931 7.25554 10.7439L7.90642 7.17236Z" fill="#D5DBFF"/>
|
||||
<path d="M0 17.7972C0.072567 17.982 0.158862 18.1627 0.258886 18.3378L3.10308 23.3174C3.83185 24.5933 5.17868 25.3793 6.63622 25.3793H7.90877L7.25542 21.7944C6.95484 20.1451 5.67817 18.8546 4.04654 18.5508L0 17.7972Z" fill="#D5DBFF"/>
|
||||
<path d="M11.1172 25.3793H12.3254C13.7829 25.3793 15.1297 24.5933 15.8585 23.3174L18.7027 18.3378C18.8004 18.1668 18.885 17.9904 18.9565 17.8102L14.9794 18.5508C13.3478 18.8546 12.0711 20.1451 11.7705 21.7944L11.1172 25.3793Z" fill="#D5DBFF"/>
|
||||
<path d="M18.9502 14.727C18.8799 14.5518 18.7973 14.3803 18.7022 14.2139L15.858 9.23429C15.1292 7.95835 13.7824 7.17236 12.3249 7.17236H11.1191L11.7701 10.7439C12.0706 12.3931 13.3473 13.6836 14.9789 13.9875L18.9502 14.727Z" fill="#D5DBFF"/>
|
||||
<path d="M9.47318 7.52967C9.47851 7.48181 9.54735 7.48181 9.55268 7.52967L9.86729 10.3575C10.1879 13.2396 12.4348 15.5162 15.2853 15.8472L18.5731 16.229C18.6203 16.2345 18.6203 16.3038 18.5731 16.3093L15.2853 16.6911C12.4348 17.0221 10.1879 19.2987 9.86729 22.1808L9.55268 25.0086C9.54735 25.0565 9.47851 25.0565 9.47318 25.0086L9.15908 22.1852C8.83818 19.3011 6.58846 17.0236 3.73565 16.6949L0.388983 16.3093C0.341693 16.3039 0.341693 16.2344 0.388983 16.229L3.73565 15.8434C6.58846 15.5147 8.83818 13.2372 9.15908 10.3531L9.47318 7.52967Z" fill="#D5DBFF" fill-opacity="0.85"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.9 KiB |
|
|
@ -232,6 +232,11 @@ export type VersionType =
|
|||
*/
|
||||
"old_beta"
|
||||
|
||||
<<<<<<< HEAD
|
||||
const ARGS_MAP = { 'folders':'{"openCluster":["folder_name"],"fromCluster":["folder_name"]}', 'core':'{"getRunningProcessesByClusterId":["cluster_id"],"writeSettings":["setting"],"getPackage":["provider","slug"],"open":["input"],"updateClusterProfile":["name","profile"],"getScreenshots":["id"],"fetchMinecraftProfile":["uuid"],"launchCluster":["id","uuid"],"readSettings":[],"getMultiplePackages":["provider","slugs"],"getClusters":[],"updateClusterById":["id","request"],"getRunningProcesses":[],"getGlobalProfile":[],"getPackageVersions":["provider","slug","mc_version","loader","offset","limit"],"getProfileOrDefault":["name"],"getUser":["uuid"],"createCluster":["options"],"killProcess":["pid"],"setDefaultUser":["uuid"],"openMsaLogin":[],"searchPackages":["provider","query"],"isClusterRunning":["cluster_id"],"getPackageBody":["provider","body"],"getLoadersForVersion":["mc_version"],"removeUser":["uuid"],"getClusterById":["id"],"removeCluster":["id"],"getGameVersions":[],"getUsers":[],"getUsersFromAuthor":["provider","author"],"getLogByName":["id","name"],"downloadPackage":["provider","package_id","version_id","cluster_id","skip_compatibility"],"getDefaultUser":["fallback"],"getLogs":["id"],"getWorlds":["id"]}', 'oneclient':'{"getClustersGroupedByMajor":[],"openDevTools":[]}', 'events':'{"message":["event"],"process":["event"],"ingress":["event"]}' }
|
||||
export type Router = { 'oneclient': { openDevTools: () => Promise<void>,
|
||||
getClustersGroupedByMajor: () => Promise<Partial<{ [key in number]: ClusterModel[] }>> },
|
||||
=======
|
||||
const ARGS_MAP = { 'events':'{"message":["event"],"ingress":["event"],"process":["event"]}', 'oneclient':'{"getClustersGroupedByMajor":[],"openDevTools":[]}', 'core':'{"writeSettings":["setting"],"getWorlds":["id"],"getRunningProcessesByClusterId":["cluster_id"],"updateClusterProfile":["name","profile"],"getClusterById":["id"],"openMsaLogin":[],"getScreenshots":["id"],"getUsers":[],"getProfileOrDefault":["name"],"updateClusterById":["id","request"],"getDefaultUser":["fallback"],"removeCluster":["id"],"createCluster":["options"],"getPackage":["provider","slug"],"downloadPackage":["provider","package_id","version_id","cluster_id","skip_compatibility"],"getUsersFromAuthor":["provider","author"],"open":["input"],"getMultiplePackages":["provider","slugs"],"getLogByName":["id","name"],"getLoadersForVersion":["mc_version"],"isClusterRunning":["cluster_id"],"searchPackages":["provider","query"],"setDefaultUser":["uuid"],"getUser":["uuid"],"killProcess":["pid"],"getPackageVersions":["provider","slug","mc_version","loader","offset","limit"],"launchCluster":["id","uuid"],"getClusters":[],"getRunningProcesses":[],"getGameVersions":[],"getGlobalProfile":[],"getPackageBody":["provider","body"],"removeUser":["uuid"],"fetchMinecraftProfile":["uuid"],"readSettings":[],"getLogs":["id"]}', 'folders':'{"fromCluster":["folder_name"],"openCluster":["folder_name"]}' }
|
||||
export type Router = { 'oneclient': { openDevTools: () => Promise<void>,
|
||||
getClustersGroupedByMajor: () => Promise<Partial<{ [key in number]: ClusterModel[] }>> },
|
||||
|
|
@ -240,6 +245,7 @@ message: (event: MessagePayload) => Promise<void>,
|
|||
process: (event: ProcessPayload) => Promise<void> },
|
||||
'folders': { fromCluster: (folderName: string) => Promise<string>,
|
||||
openCluster: (folderName: string) => Promise<null> },
|
||||
>>>>>>> 035657cb791987107fa8d13da125fbb9d6d60825
|
||||
'core': { getClusters: () => Promise<ClusterModel[]>,
|
||||
getClusterById: (id: number) => Promise<ClusterModel | null>,
|
||||
removeCluster: (id: number) => Promise<null>,
|
||||
|
|
@ -275,7 +281,16 @@ getPackageVersions: (provider: Provider, slug: string, mcVersion: string | null,
|
|||
downloadPackage: (provider: Provider, packageId: string, versionId: string, clusterId: number, skipCompatibility: boolean | null) => Promise<PackageModel>,
|
||||
getUsersFromAuthor: (provider: Provider, author: PackageAuthor) => Promise<ManagedUser[]>,
|
||||
fetchMinecraftProfile: (uuid: string) => Promise<MojangPlayerProfile>,
|
||||
<<<<<<< HEAD
|
||||
open: (input: string) => Promise<null> },
|
||||
'folders': { fromCluster: (folderName: string) => Promise<string>,
|
||||
openCluster: (folderName: string) => Promise<null> },
|
||||
'events': { ingress: (event: IngressPayload) => Promise<void>,
|
||||
message: (event: MessagePayload) => Promise<void>,
|
||||
process: (event: ProcessPayload) => Promise<void> } };
|
||||
=======
|
||||
open: (input: string) => Promise<null> } };
|
||||
>>>>>>> 035657cb791987107fa8d13da125fbb9d6d60825
|
||||
|
||||
|
||||
export type { InferCommandOutput }
|
||||
|
|
|
|||
|
|
@ -1,9 +1,108 @@
|
|||
import { createFileRoute } from '@tanstack/react-router'
|
||||
import { Tab, TabContent, TabList, TabPanel, Tabs } from '@onelauncher/common/components';
|
||||
import { createFileRoute } from '@tanstack/react-router';
|
||||
import { OverlayScrollbarsComponent } from 'overlayscrollbars-react';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
export const Route = createFileRoute('/onboarding/preferences/mods')({
|
||||
component: RouteComponent,
|
||||
})
|
||||
component: RouteComponent,
|
||||
});
|
||||
|
||||
function RouteComponent() {
|
||||
return <div>Hello "/onboarding/preferences/mods"!</div>
|
||||
return (
|
||||
<div className="min-h-screen px-7">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h1 className="text-4xl font-semibold mb-2">Choose Mods</h1>
|
||||
<p className="text-slate-400 text-lg mb-2">
|
||||
Something something in corporate style fashion about picking your preferred gamemodes and versions and
|
||||
optionally loader so that oneclient can pick something for them
|
||||
</p>
|
||||
|
||||
<div className="relative">
|
||||
<Tabs defaultValue="skyblock">
|
||||
<TabList className="gap-6">
|
||||
<Tab value="skyblock">Skyblock</Tab>
|
||||
<Tab value="survival">Survival</Tab>
|
||||
<Tab value="minigames">Minigames</Tab>
|
||||
<Tab value="pvp">PVP</Tab>
|
||||
<Tab value="gui">GUI</Tab>
|
||||
<Tab value="util">Utility</Tab>
|
||||
<Tab value="misc">Misc</Tab>
|
||||
|
||||
<div className="absolute right-4">
|
||||
<div className="bg-[#D0D7F3] rounded-xl text-brand text-sm px-2 py-1">
|
||||
31 Mods selected
|
||||
</div>
|
||||
</div>
|
||||
</TabList>
|
||||
|
||||
<TabContent>
|
||||
<TabPanel value="skyblock">
|
||||
<OverlayScrollbarsComponent>
|
||||
<div className="h-96 grid grid-cols-3 gap-2">
|
||||
{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15].map(x => (
|
||||
<div className="space-y-2" key={x}>
|
||||
{x % 2 === 0 ? <ModCard2 active={x % 2 === 0} /> : <ModCard active={x % 2 === 0} />}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</OverlayScrollbarsComponent>
|
||||
</TabPanel>
|
||||
</TabContent>
|
||||
</Tabs>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
interface ModCardProps {
|
||||
active: boolean;
|
||||
}
|
||||
|
||||
function ModCard(props: ModCardProps) {
|
||||
const { active } = props;
|
||||
|
||||
return (
|
||||
<div className={twMerge('p-2 rounded-lg mb-2 break-inside-avoid', active ? 'bg-brand/20 border border-brand' : 'bg-component-bg border border-gray-100/5')}>
|
||||
<div className="flex flex-row gap-2">
|
||||
<img className="rounded-xl size-16" src="https://cdn.modrinth.com/data/8pJYUDNi/790dfffda5974fccda843477cfe8ed19b1347ea3_96.webp" />
|
||||
<div className="flex flex-col">
|
||||
<p className="text-fg-primary text-xl">Chatting</p>
|
||||
<p className="text-fg-secondary">
|
||||
by
|
||||
{' '}
|
||||
{' '}
|
||||
<span className="font-semibold">Polyfrost</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="pt-1 text-fg-secondary font-normal">
|
||||
<p>Chatting is a chat mod adding utilities such as extremely customizable chat tabs, chat shortcuts, chat screenshots, and message copying.</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function ModCard2(props: ModCardProps) {
|
||||
const { active } = props;
|
||||
|
||||
return (
|
||||
<div className={twMerge('p-2 rounded-lg mb-2 break-inside-avoid', active ? 'bg-brand/20 border border-brand' : 'bg-component-bg border border-gray-100/5')}>
|
||||
<div className="flex flex-row gap-2">
|
||||
<img className="rounded-xl size-16" src="https://cdn.modrinth.com/data/8pJYUDNi/790dfffda5974fccda843477cfe8ed19b1347ea3_96.webp" />
|
||||
<div className="flex flex-col">
|
||||
<p className="text-fg-primary text-xl">Chatting</p>
|
||||
<p className="text-fg-secondary">
|
||||
by
|
||||
{' '}
|
||||
{' '}
|
||||
<span className="font-semibold">Polyfrost</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="pt-1 text-fg-secondary font-normal">
|
||||
<p>Chatting is a chat mod adding utilities such as extremely customizable chat tabs, chat shortcuts, chat screenshots, and message copying. Chatting is a chat mod adding utilities such as extremely customizable chat tabs, chat shortcuts, chat screenshots, and message copying Chatting is a chat mod adding utilities such as extremely customizable chat tabs, chat shortcuts, chat screenshots, and message copying</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ const versions = [
|
|||
|
||||
function RouteComponent() {
|
||||
return (
|
||||
<div className="min-h-screen p-8">
|
||||
<div className="min-h-screen px-7">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h1 className="text-4xl font-semibold mb-2">Starting Versions</h1>
|
||||
<p className="text-slate-400 text-lg mb-2">
|
||||
|
|
@ -42,7 +42,7 @@ function RouteComponent() {
|
|||
/>
|
||||
))}
|
||||
<div className="border border-component-bg-hover rounded-xl">
|
||||
<div className="flex items-center justify-center h-46">
|
||||
<div className="flex items-center justify-center h-32">
|
||||
<PlusIcon className="text-component-bg-hover size-12" />
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -63,7 +63,7 @@ export function VersionCard({ version, tags }: VersionCardProps) {
|
|||
<div className="relative">
|
||||
<img
|
||||
alt={`Minecraft ${version} landscape`}
|
||||
className="w-full rounded-xl h-48 object-cover"
|
||||
className="w-full rounded-xl h-32 object-cover"
|
||||
src={CavesAndCliffs}
|
||||
/>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import type { PropsWithChildren } from 'react';
|
||||
import Logo from '@/assets/logos/oneclient2.svg';
|
||||
import Logo from '@/assets/logos/Logo.svg';
|
||||
import LauncherLogo from '@/assets/logos/oneclient.svg?react';
|
||||
import { LoaderSuspense, NavbarButton } from '@/components';
|
||||
import { GameBackground } from '@/components/GameBackground';
|
||||
import { Stepper } from '@/components/Stepper';
|
||||
|
|
@ -109,7 +110,7 @@ function AppShell({
|
|||
<div className={`min-w-64 ${isFirstStep ? 'bg-page' : ''} border-r border-component-border flex flex-col`}>
|
||||
<div className="p-6">
|
||||
<div className="flex items-center gap-2">
|
||||
<img alt="logo" className="w-52 h-12" src={Logo} />
|
||||
<LauncherLogo className="w-52 h-12" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -131,10 +132,10 @@ function AppShell({
|
|||
}
|
||||
|
||||
function BackgroundGradient() {
|
||||
const background = useAppShellStore(state => state.background);
|
||||
// const background = useAppShellStore(state => state.background);
|
||||
|
||||
if (background === 'none')
|
||||
return undefined;
|
||||
// if (background === 'none')
|
||||
// return undefined;
|
||||
|
||||
return (
|
||||
<div className="relative">
|
||||
|
|
|
|||
127
packages/web_common/src/components/TabList.tsx
Normal file
127
packages/web_common/src/components/TabList.tsx
Normal file
|
|
@ -0,0 +1,127 @@
|
|||
import type { HTMLAttributes, ReactNode, Ref } from 'react';
|
||||
import { createContext, useContext, useState } from 'react';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
// i thank chatgpt for this i dont want to replace current tabs component yet so this is going to be here for some time
|
||||
interface TabsContextType {
|
||||
activeTab: string;
|
||||
setActiveTab: (value: string) => void;
|
||||
}
|
||||
|
||||
const TabsContext = createContext<TabsContextType | null>(null);
|
||||
|
||||
function useTabs() {
|
||||
const context = useContext(TabsContext);
|
||||
if (!context)
|
||||
throw new Error('useTabs must be used within a <Tabs> component');
|
||||
|
||||
return context;
|
||||
}
|
||||
|
||||
interface TabsProps {
|
||||
defaultValue: string;
|
||||
children: ReactNode;
|
||||
}
|
||||
|
||||
export function Tabs({ defaultValue, children }: TabsProps) {
|
||||
const [activeTab, setActiveTab] = useState(defaultValue);
|
||||
|
||||
return (
|
||||
<TabsContext.Provider value={{ activeTab, setActiveTab }}>
|
||||
{children}
|
||||
</TabsContext.Provider>
|
||||
);
|
||||
}
|
||||
|
||||
interface TabListProps extends HTMLAttributes<HTMLDivElement> {
|
||||
floating?: boolean;
|
||||
ref?: Ref<HTMLDivElement>;
|
||||
}
|
||||
|
||||
export function TabList({
|
||||
className,
|
||||
children,
|
||||
floating = false,
|
||||
ref,
|
||||
}: TabListProps) {
|
||||
return (
|
||||
<div className="pointer-events-none sticky top-0 z-10 min-h-[74px] h-[74px] max-h-[74px] w-full" ref={ref}>
|
||||
<div
|
||||
className={twMerge(
|
||||
'pointer-events-auto flex flex-row gap-2 border border-transparent bg-page-elevated transition-all',
|
||||
floating
|
||||
? 'px-6 mx-4 py-3 shadow-lg border-ghost-overlay rounded-xl'
|
||||
: 'px-10 py-6 rounded-2xl',
|
||||
className,
|
||||
)}
|
||||
role="tablist"
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
interface TabProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'value'> {
|
||||
value: string;
|
||||
}
|
||||
|
||||
export function Tab({
|
||||
children,
|
||||
value,
|
||||
className,
|
||||
...rest
|
||||
}: TabProps) {
|
||||
const { activeTab, setActiveTab } = useTabs();
|
||||
const isActive = activeTab === value;
|
||||
|
||||
return (
|
||||
<div className="relative flex justify-center items-center">
|
||||
<button
|
||||
aria-selected={isActive}
|
||||
className={twMerge(
|
||||
'text-center text-lg transition-all duration-100 after:duration-100 after:transition-all',
|
||||
isActive
|
||||
? 'text-fg-primary font-semibold partial-underline-75% pointer-events-none'
|
||||
: 'text-fg-secondary font-normal partial-underline-0% hover:partial-underline-60% hover:text-fg-secondary-hover pointer-events-auto',
|
||||
className,
|
||||
)}
|
||||
onClick={() => setActiveTab(value)}
|
||||
role="tab"
|
||||
type="button"
|
||||
{...rest}
|
||||
>
|
||||
{children}
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
interface TabPanelProps extends HTMLAttributes<HTMLDivElement> {
|
||||
value: string;
|
||||
}
|
||||
|
||||
export function TabPanel({ children, value, ...rest }: TabPanelProps) {
|
||||
const { activeTab } = useTabs();
|
||||
|
||||
if (activeTab !== value)
|
||||
return null;
|
||||
|
||||
return (
|
||||
<div
|
||||
className="bg-page-elevated px-3 pt-3 w-full rounded-2xl h-full"
|
||||
role="tabpanel"
|
||||
{...rest}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function TabContent({ children, className, ...rest }: HTMLAttributes<HTMLDivElement>) {
|
||||
return (
|
||||
<div className={twMerge('pt-4', className)} {...rest}>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -7,6 +7,7 @@ export * from './Popup';
|
|||
export * from './SelectList';
|
||||
export * from './Show';
|
||||
export * from './Switch';
|
||||
export * from './TabList';
|
||||
export * from './TextField';
|
||||
export * from './ToggleButton';
|
||||
export * from './Tooltip';
|
||||
|
|
|
|||
9
pnpm-lock.yaml
generated
9
pnpm-lock.yaml
generated
|
|
@ -277,9 +277,6 @@ importers:
|
|||
'@tauri-apps/plugin-dialog':
|
||||
specifier: 'catalog:'
|
||||
version: 2.2.1
|
||||
'@tauri-apps/plugin-opener':
|
||||
specifier: 'catalog:'
|
||||
version: 2.3.0
|
||||
'@untitled-theme/icons-react':
|
||||
specifier: 'catalog:'
|
||||
version: 0.14.0(@types/react@19.1.2)(react@19.1.0)
|
||||
|
|
@ -304,12 +301,12 @@ importers:
|
|||
react-just-parallax:
|
||||
specifier: 'catalog:'
|
||||
version: 3.1.16(react@19.1.0)
|
||||
react-toastify:
|
||||
specifier: 'catalog:'
|
||||
version: 11.0.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
|
||||
react-markdown:
|
||||
specifier: ^10.1.0
|
||||
version: 10.1.0(@types/react@19.1.2)(react@19.1.0)
|
||||
react-toastify:
|
||||
specifier: 'catalog:'
|
||||
version: 11.0.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
|
||||
rehype-raw:
|
||||
specifier: ^7.0.0
|
||||
version: 7.0.0
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue