chore: simplify classname structure on formik switch field

uzh-bf · Jul 17, 2024 · ad0537f · ad0537f
1 parent 5af469d
commit ad0537f
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 22 deletions.
diff --git a/src/Switch.tsx b/src/Switch.tsx
@@ -7,8 +7,6 @@ import { Tooltip } from './Tooltip'
 import Label from './forms/Label'
 
 export interface SwitchClassName {
-  override?: string
-  thumbOverride?: string
   root?: string
   element?: string
   thumb?: string
@@ -112,7 +110,6 @@ export function Switch({
         data-test={data?.test}
         checked={checked}
         className={twMerge(
-          className?.override,
           'relative rounded-full border-0 bg-uzh-grey-80',
           disabled && 'cursor-not-allowed bg-uzh-grey-40',
           checked && 'bg-primary-60',
@@ -127,7 +124,6 @@ export function Switch({
       >
         <RadixSwitch.Thumb
           className={twMerge(
-            className?.thumbOverride,
             'block rounded-full bg-white transition-transform',
             typeof checked === 'undefined' &&
               transitionSizeUndefined[size || 'md'],

diff --git a/src/forms/NewFormikSwitchField.tsx b/src/forms/NewFormikSwitchField.tsx
@@ -1,6 +1,5 @@
 import { useField } from 'formik'
 import React from 'react'
-import { twMerge } from 'tailwind-merge'
 import Switch, { SwitchClassName } from '../Switch'
 
 export interface NewFormikSwitchFieldProps {
@@ -53,23 +52,21 @@ export function NewFormikSwitchField({
   const [field, meta, helpers] = useField(name)
 
   return (
-    <div className={twMerge('w-full', className?.root)}>
-      <Switch
-        id={id}
-        required={required}
-        checked={field.value}
-        onCheckedChange={(newValue) => helpers.setValue(newValue)}
-        onBlur={() => helpers.setTouched(true)}
-        data={data}
-        disabled={disabled}
-        label={label}
-        tooltip={tooltip}
-        size={size}
-        error={!!meta.error && meta.touched ? meta.error : error}
-        hideError={hideError}
-        className={className}
-      />
-    </div>
+    <Switch
+      id={id}
+      required={required}
+      checked={field.value}
+      onCheckedChange={(newValue) => helpers.setValue(newValue)}
+      onBlur={() => helpers.setTouched(true)}
+      data={data}
+      disabled={disabled}
+      label={label}
+      tooltip={tooltip}
+      size={size}
+      error={!!meta.error && meta.touched ? meta.error : error}
+      hideError={hideError}
+      className={className}
+    />
   )
 }