@twintag/twintag-form 1.6.2 → 1.7.0

package/lib/common/icon.tsx

@@ -19,9 +19,10 @@ export const Icon: FC<Props> = ({ name, className, ...props }) => {
     [name],
   );
 
+  // biome-ignore lint/performance/noDynamicNamespaceImportAccess: ignore for now
   const Comp = icons[camel];
 
-  if (!Comp) return <></>;
+  if (!Comp) return null;
 
   return (
     <Comp

package/lib/components/config.tsx

@@ -1,4 +1,5 @@
 import type { ElementType } from 'react';
+
 import type { InputCompConfig } from '../types';
 
 import { Accordion } from './containers/accordion';

package/lib/components/containers/accordion.tsx

@@ -1,7 +1,8 @@
 import type { FC } from 'react';
-import type { Props } from '@twintag/twintag-form/types';
 import type { WithChildren } from 'twintag-types/dom';
 
+import type { Props } from '@twintag/twintag-form/types';
+
 import { tv } from 'tailwind-variants';
 
 import {
@@ -114,7 +115,7 @@ const AccordionItem: FC<AccordionItemProps> = ({
     >
       <AccordionTrigger className='text-category'>
         <span className={trigger()}>
-          {icon ? <Icon name={icon} className={iconVariants()} /> : <></>}
+          {icon ? <Icon name={icon} className={iconVariants()} /> : null}
           {label}
         </span>
       </AccordionTrigger>

package/lib/components/containers/category.tsx

@@ -46,7 +46,7 @@ const Category: FC<Props> = ({ label, children }) => {
 
   return (
     <section className={container()}>
-      {label ? <h3 className={heading()}>{label}</h3> : <></>}
+      {label ? <h3 className={heading()}>{label}</h3> : null}
 
       <div className={content()}>{children}</div>
     </section>

package/lib/components/fields/checkbox.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { AsteriskIcon } from 'lucide-react';
@@ -50,17 +51,13 @@ export const Checkbox: FC<Props<'input'>> = ({ label, bind, options }) => {
                   <span className='ml-0.5 inline-block'>
                     <AsteriskIcon className='h-3 w-3 text-tf-destructive' />
                   </span>
-                ) : (
-                  <></>
-                )}
+                ) : null}
               </FormLabel>
               {options?.description ? (
                 <FormDescription size={size}>
                   {options.description}
                 </FormDescription>
-              ) : (
-                <></>
-              )}
+              ) : null}
               <FormMessage size={size} />
             </div>
           </div>

package/lib/components/fields/date-picker.tsx

@@ -1,4 +1,5 @@
 import type * as React from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { format } from 'date-fns';
@@ -97,17 +98,13 @@ export const DatePicker: React.FC<Props<'input', 'datepicker'>> = ({
                 <span className='ml-0.5 inline-block'>
                   <AsteriskIcon className='h-3 w-3 text-tf-destructive' />
                 </span>
-              ) : (
-                <></>
-              )}
+              ) : null}
             </FormLabel>
             {options?.description ? (
               <FormDescription size={size}>
                 {options.description}
               </FormDescription>
-            ) : (
-              <></>
-            )}
+            ) : null}
           </div>
           <Popover>
             <PopoverTrigger asChild>

package/lib/components/fields/file.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { AsteriskIcon } from 'lucide-react';
@@ -40,17 +41,13 @@ export const File: FC<Props<'input', 'file'>> = ({ label, bind, options }) => {
                 <span className='ml-0.5 inline-block'>
                   <AsteriskIcon className='h-3 w-3 text-tf-destructive' />
                 </span>
-              ) : (
-                <></>
-              )}
+              ) : null}
             </FormLabel>
             {options?.description ? (
               <FormDescription size={size}>
                 {options.description}
               </FormDescription>
-            ) : (
-              <></>
-            )}
+            ) : null}
           </div>
           <FormControl>
             <Input

package/lib/components/fields/input.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { AsteriskIcon } from 'lucide-react';
@@ -41,17 +42,13 @@ export const Input: FC<Props<'input', 'text'>> = ({ label, bind, options }) => {
                 <span className='ml-0.5 inline-block'>
                   <AsteriskIcon className='h-3 w-3 text-tf-destructive' />
                 </span>
-              ) : (
-                <></>
-              )}
+              ) : null}
             </FormLabel>
             {options?.description ? (
               <FormDescription size={size}>
                 {options.description}
               </FormDescription>
-            ) : (
-              <></>
-            )}
+            ) : null}
           </div>
           <FormControl>
             <InputPrimitive

package/lib/components/fields/radiogroup.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { AsteriskIcon } from 'lucide-react';
@@ -47,17 +48,13 @@ export const RadioGroup: FC<
                 <span className='ml-0.5 inline-block'>
                   <AsteriskIcon className='h-3 w-3 text-tf-destructive' />
                 </span>
-              ) : (
-                <></>
-              )}
+              ) : null}
             </FormLabel>
             {options?.description ? (
               <FormDescription size={size}>
                 {options.description}
               </FormDescription>
-            ) : (
-              <></>
-            )}
+            ) : null}
           </div>
           <FormControl>
             <CommonRadioGroup

package/lib/components/fields/submit.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { Button } from '@twintag/twintag-form/common/button';

package/lib/components/fields/textarea.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { AsteriskIcon } from 'lucide-react';
@@ -44,17 +45,13 @@ export const Textarea: FC<Props<'input', 'text'>> = ({
                 <span className='ml-0.5 inline-block'>
                   <AsteriskIcon className='h-3 w-3 text-tf-destructive' />
                 </span>
-              ) : (
-                <></>
-              )}
+              ) : null}
             </FormLabel>
             {options?.description ? (
               <FormDescription size={size}>
                 {options.description}
               </FormDescription>
-            ) : (
-              <></>
-            )}
+            ) : null}
           </div>
           <FormControl>
             <CommonTextarea

package/lib/components/fields/toggle.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '@twintag/twintag-form/types';
 
 import { AsteriskIcon } from 'lucide-react';
@@ -41,17 +42,13 @@ export const Toggle: FC<Props<'input'>> = ({ label, bind, options }) => {
                   <span className='ml-0.5 inline-block'>
                     <AsteriskIcon className='h-3 w-3 text-tf-destructive' />
                   </span>
-                ) : (
-                  <></>
-                )}
+                ) : null}
               </FormLabel>
               {options?.description ? (
                 <FormDescription size={size}>
                   {options.description}
                 </FormDescription>
-              ) : (
-                <></>
-              )}
+              ) : null}
             </div>
             <FormControl>
               <Switch

package/lib/components/fields/tri-toggle.tsx

@@ -1,7 +1,8 @@
 import type { FC } from 'react';
-import type { Props } from '@twintag/twintag-form/types';
 import type { VariantProps } from 'tailwind-variants';
 
+import type { Props } from '@twintag/twintag-form/types';
+
 import * as React from 'react';
 import * as SliderPrimitive from '@radix-ui/react-slider';
 import { useFormContext } from 'react-hook-form';
@@ -111,9 +112,7 @@ export const TriToggle: FC<Props<'input'>> = ({ label, bind, options }) => {
                 <FormDescription size={size}>
                   {options.description}
                 </FormDescription>
-              ) : (
-                <></>
-              )}
+              ) : null}
             </div>
             <FormControl>
               <Slider

package/lib/components/input.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '../types';
 
 import { Inputs } from './config';
@@ -6,7 +7,7 @@ import { Inputs } from './config';
 export const Input: FC<Props<'input'>> = ({ subtype, ...rest }) => {
   const Comp = Inputs.get(subtype!)?.component;
 
-  if (!Comp) return <></>;
+  if (!Comp) return null;
 
   return <Comp {...rest} />;
 };

package/lib/components/label.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { Props } from '../types';
 
 import { Label as LabelComp } from '../common/label';

package/lib/components/provider.tsx

@@ -1,9 +1,10 @@
+import type { WithChildren } from 'twintag-types/dom';
+
 import type {
   ParsedJsonComponent,
   RawJsonComponent,
   TwintagFormContext,
 } from '@twintag/twintag-form/types';
-import type { WithChildren } from 'twintag-types/dom';
 
 import { createContext, useContext, useMemo } from 'react';
 import { LabelToString } from 'twintag-types/dom';

package/lib/components/renderer.tsx

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+
 import type { ParsedJsonComponent } from '@twintag/twintag-form/types';
 
 import { Containers } from '@twintag/twintag-form/components/config';
@@ -11,7 +12,7 @@ type Props = {
 const RecursiveRenderer: FC<Props> = ({ config }) => {
   const { id, type, items, comp, ...rest } = config;
 
-  if (!type || !comp) return <></>;
+  if (!type || !comp) return null;
 
   const Component = comp;
 

package/lib/index.tsx

@@ -1,4 +1,5 @@
 import type { ComponentProps } from 'react';
+
 import type { RawJsonComponent } from '@twintag/twintag-form/types';
 
 import { forwardRef } from 'react';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twintag/twintag-form",
-  "version": "1.6.2",
+  "version": "1.7.0",
   "author": "Twintag",
   "type": "module",
   "exports": {
@@ -33,10 +33,10 @@
     "@twind/with-web-components": "^1.1.3",
     "clsx": "^2.1.0",
     "date-fns": "^3.3.1",
-    "lucide-react": "^0.269.0",
-    "react": "^18.2.0",
+    "lucide-react": "0.543.0",
+    "react": "^19.2.4",
     "react-day-picker": "^8.10.0",
-    "react-dom": "^18.2.0",
+    "react-dom": "^19.2.4",
     "react-hook-form": "^7.50.1",
     "tailwind-merge": "^2.2.1",
     "uuid": "^9.0.1"
@@ -44,11 +44,11 @@
   "devDependencies": {
     "@twind/with-react": "^1.1.3",
     "@types/uuid": "^9.0.7",
-    "@vitejs/plugin-react-swc": "^3.6.0",
-    "vite": "^5.2.11",
-    "vite-plugin-dts": "^3.9.1",
+    "@vitejs/plugin-react-swc": "^4.1.0",
+    "vite": "^7.3.2",
+    "vite-plugin-dts": "^4.5.4",
     "tsconfig": "0.0.0",
-    "twintag-types": "0.4.0"
+    "twintag-types": "0.6.0"
   },
   "publishConfig": {
     "access": "public"
@@ -56,7 +56,6 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
-    "format": "prettier --write \"**/*.{ts,md,tsx,cjs,mjs,json,html}\" --ignore-path ../../.gitignore",
-    "format:check": "prettier --check \"**/*.{ts,md,tsx,cjs,mjs,json,html}\" --ignore-path ../../.gitignore"
+    "format": "prettier --write \"**/*.{ts,md,tsx,cjs,mjs,json,html}\" --ignore-path ../../.gitignore"
   }
 }

package/prettier.config.mjs

@@ -1,26 +1,10 @@
 import baseConfig from '../../prettier.config.mjs';
 
 /**
- * @type {import('prettier').Config & import('prettier-plugin-tailwindcss').PluginOptions &
- *       import("@ianvs/prettier-plugin-sort-imports").PluginConfig}
+ * @type {import('prettier').Config & import('prettier-plugin-tailwindcss').PluginOptions
  */
 const config = {
   ...baseConfig,
-  importOrder: [
-    '<TYPES>^react$',
-    '<TYPES>',
-    '<TYPES>^@/.*$',
-    '<TYPES>^[./]',
-    '',
-    '^zod$',
-    '^react$',
-    '<THIRD_PARTY_MODULES>',
-    '',
-    '^@twintag/twintag-form/.*$',
-    '^@/.*$',
-    '',
-    '^[./]',
-  ],
 };
 
 export default config;