BaseLibraries/MattrixwvReactComponents
1
0
Fork 0
Code Issues 3 Packages Projects Releases Wiki Activity

Update switches

Browse Source
This commit is contained in:
Matthew Ellison
2026-02-14 17:04:16 -05:00
parent 1743ed6ce4
commit 31c44d3d92
13 changed files with 39 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
lib/component/input/switch/ButtonSwitch.tsx
View File

@@ -1,9 +1,8 @@
import type { MattrixwvButtonSwitchProps } from "$/types/InputTypes"; import type { MattrixwvButtonSwitchProps } from "$/types/InputTypes";
import { Switch } from "@headlessui/react"; import { Switch } from "@headlessui/react";
import { forwardRef } from "react";
const ButtonSwitch = forwardRef<HTMLButtonElement, MattrixwvButtonSwitchProps>(({ export default function ButtonSwitch({
id, id,
className, className,
name, name,
@@ -14,7 +13,7 @@ const ButtonSwitch = forwardRef<HTMLButtonElement, MattrixwvButtonSwitchProps>((
disabled, disabled,
onNode, onNode,
offNode offNode
}, ref ) => { }: Readonly<MattrixwvButtonSwitchProps>){
return ( return (
<Switch <Switch
id={id} id={id}
@@ -25,7 +24,6 @@ const ButtonSwitch = forwardRef<HTMLButtonElement, MattrixwvButtonSwitchProps>((
checked={checked} checked={checked}
onChange={onChange} onChange={onChange}
disabled={disabled} disabled={disabled}
ref={ref}
> >
{({ checked }) => ( {({ checked }) => (
<> <>
@@ -34,8 +32,4 @@ const ButtonSwitch = forwardRef<HTMLButtonElement, MattrixwvButtonSwitchProps>((
)} )}
</Switch> </Switch>
); );
}); }
ButtonSwitch.displayName = "ButtonSwitch";
export default ButtonSwitch;

12
lib/component/input/switch/DangerSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const DangerSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function DangerSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const DangerSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
DangerSwitch.displayName = "DangerSwitch";
export default DangerSwitch;

12
lib/component/input/switch/DarkSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const DarkSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function DarkSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const DarkSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
DarkSwitch.displayName = "DarkSwitch";
export default DarkSwitch;

12
lib/component/input/switch/InfoSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const InfoSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function InfoSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const InfoSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
InfoSwitch.displayName = "InfoSwitch";
export default InfoSwitch;

12
lib/component/input/switch/LightSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const LightSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function LightSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const LightSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
LightSwitch.displayName = "LightSwitch";
export default LightSwitch;

12
lib/component/input/switch/MattrixwvSwitch.tsx
View File

@@ -1,11 +1,10 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import { Field, Label, Switch } from "@headlessui/react"; import { Field, Label, Switch } from "@headlessui/react";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import { Fragment } from "react/jsx-runtime"; import { Fragment } from "react/jsx-runtime";
const MattrixwvSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function MattrixwvSwitch({
id, id,
className, className,
knobClassName, knobClassName,
@@ -20,7 +19,7 @@ const MattrixwvSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
children, children,
offText, offText,
onText onText
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<Field as={Fragment}> <Field as={Fragment}>
<Switch <Switch
@@ -54,7 +53,6 @@ const MattrixwvSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
checked={checked} checked={checked}
onChange={onChange} onChange={onChange}
disabled={disabled} disabled={disabled}
ref={ref}
> >
{ {
offText && offText &&
@@ -107,8 +105,4 @@ const MattrixwvSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
</Label> </Label>
</Field> </Field>
); );
}); }
MattrixwvSwitch.displayName = "MattrixwvSwitch";
export default MattrixwvSwitch;

12
lib/component/input/switch/MoltenSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const MoltenSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function MoltenSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const MoltenSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
MoltenSwitch.displayName = "MoltenSwitch";
export default MoltenSwitch;

12
lib/component/input/switch/PrimarySwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const PrimarySwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function PrimarySwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const PrimarySwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
PrimarySwitch.displayName = "PrimarySwitch";
export default PrimarySwitch;

12
lib/component/input/switch/SecondarySwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const SecondarySwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function SecondarySwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const SecondarySwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
SecondarySwitch.displayName = "SecondarySwitch";
export default SecondarySwitch;

12
lib/component/input/switch/SuccessDangerSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const SuccessDangerSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function SuccessDangerSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -27,12 +26,7 @@ const SuccessDangerSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
SuccessDangerSwitch.displayName = "SuccessDangerSwitch";
export default SuccessDangerSwitch;

12
lib/component/input/switch/SuccessSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const SuccessSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function SuccessSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const SuccessSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
SuccessSwitch.displayName = "SuccessSwitch";
export default SuccessSwitch;

12
lib/component/input/switch/TertiarySwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const TertiarySwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function TertiarySwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const TertiarySwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
TertiarySwitch.displayName = "TertiarySwitch";
export default TertiarySwitch;

12
lib/component/input/switch/WarningSwitch.tsx
View File

@@ -1,15 +1,14 @@
import type { MattrixwvSwitchProps } from "$/types/InputTypes"; import type { MattrixwvSwitchProps } from "$/types/InputTypes";
import clsx from "clsx"; import clsx from "clsx";
import { forwardRef } from "react";
import MattrixwvSwitch from "./MattrixwvSwitch"; import MattrixwvSwitch from "./MattrixwvSwitch";
const WarningSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({ export default function WarningSwitch({
className, className,
knobClassName, knobClassName,
disabled, disabled,
...props ...props
}, ref ) => { }: Readonly<MattrixwvSwitchProps>){
return ( return (
<MattrixwvSwitch <MattrixwvSwitch
className={clsx( className={clsx(
@@ -28,12 +27,7 @@ const WarningSwitch = forwardRef<HTMLButtonElement, MattrixwvSwitchProps>(({
} }
)} )}
disabled={disabled} disabled={disabled}
ref={ref}
{...props} {...props}
/> />
); );
}); }
WarningSwitch.displayName = "WarningSwitch";
export default WarningSwitch;