feat: Add Select form component

Author: codinsonn

apps/next/app/(generated)/demos/forms/page.tsx

@@ -1,2 +1,2 @@
 'use client'
-export { default } from '@app/core/routes/demos/forms/index'
+export { default, dynamic } from '@app/core/routes/demos/forms/index'

apps/next/app/NextClientRootLayout.tsx

@@ -1,5 +1,6 @@
 'use client'
 import React from 'react'
+import { SafeAreaProvider } from 'react-native-safe-area-context'
 import UniversalAppProviders from '@app/screens/UniversalAppProviders'
 import { Image as NextContextImage } from '@green-stack/core/components/Image.next'
 import { Link as NextContextLink } from '@green-stack/core/navigation/Link.next'
@@ -26,15 +27,22 @@ const NextClientRootLayout = ({ children }: NextClientRootLayoutProps) => {
     // -- Render --
 
     return (
-        <UniversalAppProviders
-            contextImage={NextContextImage}
-            contextLink={NextContextLink}
-            contextRouter={nextContextRouter}
-            useContextRouteParams={useNextRouteParams}
-            isNext
+        <SafeAreaProvider
+            initialMetrics={{
+                frame: { x: 0, y: 0, width: 0, height: 0 },
+                insets: { top: 0, right: 0, bottom: 0, left: 0 },
+            }}
         >
-            {children}
-        </UniversalAppProviders>
+            <UniversalAppProviders
+                contextImage={NextContextImage}
+                contextLink={NextContextLink}
+                contextRouter={nextContextRouter}
+                useContextRouteParams={useNextRouteParams}
+                isNext
+            >
+                {children}
+            </UniversalAppProviders>
+        </SafeAreaProvider>
     )
 }
 

apps/next/app/NextServerRootLayout.tsx

@@ -11,17 +11,17 @@ import NextClientRootLayout from './NextClientRootLayout'
 /* --- Types ----------------------------------------------------------------------------------- */
 
 type NextServerRootLayoutProps = {
-  children: ReactNode
+    children: ReactNode
 }
 
 /* --- <NextServerRootLayout/> ----------------------------------------------------------------- */
 
 const NextServerRootLayout = ({ children }: NextServerRootLayoutProps) => (
-  <Document>
-    <NextClientRootLayout>
-      {children}
-    </NextClientRootLayout>
-  </Document>
+    <Document>
+        <NextClientRootLayout>
+            {children}
+        </NextClientRootLayout>
+    </Document>
 )
 
 /* --- Exports --------------------------------------------------------------------------------- */

features/@app-core/forms/Checkbox.styled.tsx

@@ -1,6 +1,6 @@
 import { forwardRef, ElementRef } from 'react'
 import { CheckboxRoot, CheckboxIndicator } from '@green-stack/forms/Checkbox.primitives'
-import { cn, theme, View, Text, Pressable } from '../components/styled'
+import { cn, theme, Text, Pressable } from '../components/styled'
 import { CheckFilled } from '../icons/CheckFilled'
 import { z, schema, PropsOf } from '@green-stack/schemas'
 

features/@app-core/forms/RadioGroup.styled.tsx

@@ -1,4 +1,4 @@
-import type { ReactNode, ElementRef } from 'react'
+import type { ReactNode, ElementRef, Dispatch, SetStateAction } from 'react'
 import { createContext, useContext, useState, useEffect, forwardRef } from 'react'
 import { RadioGroupRoot, RadioGroupItem, RadioGroupIndicator } from '@green-stack/forms/RadioGroup.primitives'
 import { cn, View, Text, Pressable } from '../components/styled'
@@ -8,7 +8,7 @@ import { z, schema, PropsOf } from '@green-stack/schemas'
 
 export type RadioGroupContext = {
     value: string,
-    setValue: (value: string) => void,
+    setValue: Dispatch<SetStateAction<string>>,
 }
 
 export const RadioGroupContext = createContext<RadioGroupContext | undefined>(undefined)
@@ -70,8 +70,8 @@ export const RadioButton = forwardRef<
                 id={nativeID}
                 aria-labelledby={labelledByID}
                 onPress={() => setValue(value)}
+                {...props}
                 hitSlop={props.hitSlop}
-                {...rawProps}
                 className={cn(
                     'aspect-square h-4 w-4 rounded-full justify-centeritems-center border border-primary text-primary ',
                     'native:h-[20] native:w-[20]',