idanoo/autobrr
1
0
Fork 0
mirror of https://github.com/idanoo/autobrr synced 2025-07-26 18:29:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(web): update deprecated HeadlessUI v2 components (#1580)

Browse source 
* refactor(web): move away from old headless UI dot notation

* refactor(web): refactor `Disclosure` component

* refactor(web): rename formik's `Field` to `FormikField` and keep original HeadlessUI component names
This commit is contained in:
martylukyy 2024-08-12 20:36:45 +02:00 • committed by GitHub
parent 21a8e27260
commit 7d7bf9ed4c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 185 additions and 176 deletions
Download patch file Download diff file Expand all files Collapse all files

14
web/src/components/Checkbox.tsx
View file

@ -3,7 +3,7 @@
* SPDX-License-Identifier: GPL-2.0-or-later
*/
import { Switch } from "@headlessui/react";
import { Switch, Field, Label, Description } from "@headlessui/react";
import { classNames } from "@utils";
interface CheckboxProps {
@ -23,7 +23,7 @@ export const Checkbox = ({
setValue,
disabled
}: CheckboxProps) => (
<Switch.Group
<Field
as="div"
className={classNames(className ?? "py-2", "flex items-center justify-between")}
onClick={(e) => {
@ -34,14 +34,14 @@ export const Checkbox = ({
{(label || description) ? (
<div className="flex flex-col mr-4">
{label ? (
<Switch.Label as="p" className="text-sm font-medium whitespace-nowrap text-gray-900 dark:text-white" passive>
<Label as="p" className="text-sm font-medium whitespace-nowrap text-gray-900 dark:text-white" passive>
{label}
</Switch.Label>
</Label>
) : null}
{description ? (
<Switch.Description className="text-sm text-gray-500 dark:text-gray-400">
<Description className="text-sm text-gray-500 dark:text-gray-400">
{description}
</Switch.Description>
</Description>
) : null}
</div>
) : null}
@ -81,5 +81,5 @@ export const Checkbox = ({
)}
</span>
</Switch>
</Switch.Group>
</Field>
);