diff --git a/bun.lockb b/bun.lockb
index 606f682..6d2aebe 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/composer.json b/composer.json
index a7cee22..6e276b5 100644
--- a/composer.json
+++ b/composer.json
@@ -1,5 +1,5 @@
 {
-    "name": "laravel/laravel",
+    "name": "justd/inertia.tswip",
     "type": "project",
     "description": "The skeleton application for the Laravel framework.",
     "keywords": [
diff --git a/composer.lock b/composer.lock
index 3afdfae..a2a2830 100644
--- a/composer.lock
+++ b/composer.lock
@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "d15b9d4eda84071327624b5592f8e665",
+    "content-hash": "188229731eaa8d2e65c92a5f0a76920a",
     "packages": [
         {
             "name": "amphp/amp",
@@ -1938,16 +1938,16 @@
         },
         {
             "name": "laravel/framework",
-            "version": "v11.18.1",
+            "version": "v11.19.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/laravel/framework.git",
-                "reference": "b19ba518c56852567e99fbae9321bc436c2cc5a8"
+                "reference": "5e103d499e9ee5bcfc184412d034c4e516b87085"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/laravel/framework/zipball/b19ba518c56852567e99fbae9321bc436c2cc5a8",
-                "reference": "b19ba518c56852567e99fbae9321bc436c2cc5a8",
+                "url": "https://api.github.com/repos/laravel/framework/zipball/5e103d499e9ee5bcfc184412d034c4e516b87085",
+                "reference": "5e103d499e9ee5bcfc184412d034c4e516b87085",
                 "shasum": ""
             },
             "require": {
@@ -2135,7 +2135,7 @@
                 "issues": "https://github.com/laravel/framework/issues",
                 "source": "https://github.com/laravel/framework"
             },
-            "time": "2024-07-26T10:39:29+00:00"
+            "time": "2024-07-30T15:22:41+00:00"
         },
         {
             "name": "laravel/prompts",
@@ -7348,16 +7348,16 @@
         },
         {
             "name": "laravel/pint",
-            "version": "v1.17.0",
+            "version": "v1.17.1",
             "source": {
                 "type": "git",
                 "url": "https://github.com/laravel/pint.git",
-                "reference": "4dba80c1de4b81dc4c4fb10ea6f4781495eb29f5"
+                "reference": "b5b6f716db298671c1dfea5b1082ec2c0ae7064f"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/laravel/pint/zipball/4dba80c1de4b81dc4c4fb10ea6f4781495eb29f5",
-                "reference": "4dba80c1de4b81dc4c4fb10ea6f4781495eb29f5",
+                "url": "https://api.github.com/repos/laravel/pint/zipball/b5b6f716db298671c1dfea5b1082ec2c0ae7064f",
+                "reference": "b5b6f716db298671c1dfea5b1082ec2c0ae7064f",
                 "shasum": ""
             },
             "require": {
@@ -7400,7 +7400,7 @@
                 "issues": "https://github.com/laravel/pint/issues",
                 "source": "https://github.com/laravel/pint"
             },
-            "time": "2024-07-23T16:40:20+00:00"
+            "time": "2024-08-01T09:06:33+00:00"
         },
         {
             "name": "laravel/sail",
@@ -7586,23 +7586,23 @@
         },
         {
             "name": "nunomaduro/collision",
-            "version": "v8.3.0",
+            "version": "v8.4.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/nunomaduro/collision.git",
-                "reference": "b49f5b2891ce52726adfd162841c69d4e4c84229"
+                "reference": "e7d1aa8ed753f63fa816932bbc89678238843b4a"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/nunomaduro/collision/zipball/b49f5b2891ce52726adfd162841c69d4e4c84229",
-                "reference": "b49f5b2891ce52726adfd162841c69d4e4c84229",
+                "url": "https://api.github.com/repos/nunomaduro/collision/zipball/e7d1aa8ed753f63fa816932bbc89678238843b4a",
+                "reference": "e7d1aa8ed753f63fa816932bbc89678238843b4a",
                 "shasum": ""
             },
             "require": {
                 "filp/whoops": "^2.15.4",
                 "nunomaduro/termwind": "^2.0.1",
                 "php": "^8.2.0",
-                "symfony/console": "^7.1.2"
+                "symfony/console": "^7.1.3"
             },
             "conflict": {
                 "laravel/framework": "<11.0.0 || >=12.0.0",
@@ -7610,13 +7610,13 @@
             },
             "require-dev": {
                 "larastan/larastan": "^2.9.8",
-                "laravel/framework": "^11.16.0",
-                "laravel/pint": "^1.16.2",
-                "laravel/sail": "^1.30.2",
+                "laravel/framework": "^11.19.0",
+                "laravel/pint": "^1.17.1",
+                "laravel/sail": "^1.31.0",
                 "laravel/sanctum": "^4.0.2",
                 "laravel/tinker": "^2.9.0",
-                "orchestra/testbench-core": "^9.2.1",
-                "pestphp/pest": "^2.34.9 || ^3.0.0",
+                "orchestra/testbench-core": "^9.2.3",
+                "pestphp/pest": "^2.35.0 || ^3.0.0",
                 "sebastian/environment": "^6.1.0 || ^7.0.0"
             },
             "type": "library",
@@ -7673,25 +7673,25 @@
                     "type": "patreon"
                 }
             ],
-            "time": "2024-07-16T22:41:01+00:00"
+            "time": "2024-08-03T15:32:23+00:00"
         },
         {
             "name": "pestphp/pest",
-            "version": "v2.34.9",
+            "version": "v2.35.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/pestphp/pest.git",
-                "reference": "ef120125e036bf84c9e46a9e62219702f5b92e16"
+                "reference": "d0ff2c8ec294b7aa7fcb0f3ddc4fdec864234646"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/pestphp/pest/zipball/ef120125e036bf84c9e46a9e62219702f5b92e16",
-                "reference": "ef120125e036bf84c9e46a9e62219702f5b92e16",
+                "url": "https://api.github.com/repos/pestphp/pest/zipball/d0ff2c8ec294b7aa7fcb0f3ddc4fdec864234646",
+                "reference": "d0ff2c8ec294b7aa7fcb0f3ddc4fdec864234646",
                 "shasum": ""
             },
             "require": {
                 "brianium/paratest": "^7.3.1",
-                "nunomaduro/collision": "^7.10.0|^8.1.1",
+                "nunomaduro/collision": "^7.10.0|^8.3.0",
                 "nunomaduro/termwind": "^1.15.1|^2.0.1",
                 "pestphp/pest-plugin": "^2.1.1",
                 "pestphp/pest-plugin-arch": "^2.7.0",
@@ -7705,8 +7705,8 @@
             },
             "require-dev": {
                 "pestphp/pest-dev-tools": "^2.16.0",
-                "pestphp/pest-plugin-type-coverage": "^2.8.4",
-                "symfony/process": "^6.4.0|^7.1.1"
+                "pestphp/pest-plugin-type-coverage": "^2.8.5",
+                "symfony/process": "^6.4.0|^7.1.3"
             },
             "bin": ["bin/pest"],
             "type": "library",
@@ -7753,7 +7753,7 @@
             "keywords": ["framework", "pest", "php", "test", "testing", "unit"],
             "support": {
                 "issues": "https://github.com/pestphp/pest/issues",
-                "source": "https://github.com/pestphp/pest/tree/v2.34.9"
+                "source": "https://github.com/pestphp/pest/tree/v2.35.0"
             },
             "funding": [
                 {
@@ -7765,7 +7765,7 @@
                     "type": "github"
                 }
             ],
-            "time": "2024-07-11T08:36:26+00:00"
+            "time": "2024-08-02T10:57:29+00:00"
         },
         {
             "name": "pestphp/pest-plugin",
diff --git a/justd.json b/justd.json
index b53a3c6..36efd86 100644
--- a/justd.json
+++ b/justd.json
@@ -1,3 +1,4 @@
 {
+    "$schema": "http://justd.co",
     "ui": "resources/js/components/ui"
 }
diff --git a/package.json b/package.json
index 34780dc..79e9c43 100644
--- a/package.json
+++ b/package.json
@@ -9,12 +9,12 @@
     "devDependencies": {
         "@inertiajs/react": "^1.2.0",
         "@tailwindcss/forms": "^0.5.7",
-        "@types/node": "^18.19.42",
+        "@types/node": "^18.19.43",
         "@types/react": "^18.3.3",
         "@types/react-dom": "^18.3.0",
         "@vitejs/plugin-react": "^4.3.1",
-        "autoprefixer": "^10.4.19",
-        "axios": "^1.7.2",
+        "autoprefixer": "^10.4.20",
+        "axios": "^1.7.3",
         "laravel-vite-plugin": "^1.0.5",
         "postcss": "^8.4.40",
         "prettier": "^3.3.3",
@@ -28,9 +28,9 @@
         "vite-plugin-watch": "^0.3.1"
     },
     "dependencies": {
-        "@irsyadadl/paranoid": "^1.4.11",
+        "@irsyadadl/paranoid": "^1.4.12",
         "clsx": "^2.1.1",
-        "framer-motion": "^11.3.19",
+        "framer-motion": "^11.3.21",
         "react-aria-components": "^1.3.1",
         "sonner": "^1.5.0",
         "tailwind-merge": "^2.4.0",
diff --git a/resources/js/components/ui/avatar.tsx b/resources/js/components/ui/avatar.tsx
index 10ce9a4..bf04e2d 100644
--- a/resources/js/components/ui/avatar.tsx
+++ b/resources/js/components/ui/avatar.tsx
@@ -47,6 +47,7 @@ interface AvatarProps extends React.ComponentPropsWithoutRef<'span'>, VariantPro
     alt?: string
     status?: Status
     className?: string
+    role?: string
 }
 
 const Avatar = ({
@@ -58,6 +59,7 @@ const Avatar = ({
     className,
     shape,
     size,
+    role = 'avatar',
     ...props
 }: AvatarProps) => {
     const badgeId = React.useId()
@@ -65,7 +67,7 @@ const Avatar = ({
     return (
         <span
             aria-labelledby={ariaLabelledby}
-            role="avatar"
+            role={role}
             data-slot="avatar"
             {...props}
             className={avatarStyles({ shape, size, className })}
diff --git a/resources/js/components/ui/field.tsx b/resources/js/components/ui/field.tsx
index 16e6c25..fc0cfb5 100644
--- a/resources/js/components/ui/field.tsx
+++ b/resources/js/components/ui/field.tsx
@@ -13,11 +13,13 @@ import {
     Text,
     type TextProps
 } from 'react-aria-components'
-import { twMerge } from 'tailwind-merge'
 import { tv } from 'tailwind-variants'
 
 import { ctr } from './primitive'
 
+// primitive styles
+
+// primitive styles
 const fieldBorderStyles = tv({
     base: 'group-focus-within:border-primary forced-colors:border-[Highlight]',
     variants: {
@@ -27,26 +29,38 @@ const fieldBorderStyles = tv({
     }
 })
 
-const Label = (props: LabelProps) => {
-    return (
-        <LabelPrimitive
-            {...props}
-            className={twMerge('w-fit cursor-default font-medium text-secondary-fg text-sm', props.className)}
-        />
-    )
+const fieldGroupPrefixStyles = tv({
+    base: [
+        'flex group-invalid:border-danger group-disabled:bg-secondary group-disabled:opacity-50 items-center group-invalid:focus-within:ring-danger/20',
+        '[&>.x2e2>.kbt32x]:size-7 [&>.x2e2>.kbt32x]:rounded-sm [&>.x2e2:has(.kbt32x)]:size-9 [&>.x2e2:has(.kbt32x)]:grid [&>.x2e2:has(.kbt32x)]:place-items-center',
+        '[&>.x2e2>.kbt32x]:before:rounded-[calc(theme(borderRadius.sm)-1px)] [&>.x2e2>.kbt32x]:after:rounded-[calc(theme(borderRadius.sm)-1px)] dark:[&>.x2e2>.kbt32x]:after:rounded-sm',
+        '[&>.isSfx:has(.kbt32x)]:-mr-2 [&>.isPfx:has(.kbt32x)]:-ml-2 [&>.isSfx>.kbt32x]:mr-0.5 [&>.isPfx>.kbt32x]:ml-0.5'
+    ]
+})
+
+const fieldStyles = tv({
+    slots: {
+        description: 'text-sm text-muted-fg',
+        label: 'w-fit cursor-default font-medium text-secondary-fg text-sm',
+        fieldError: 'text-sm text-danger forced-colors:text-[Mark]',
+        input: [
+            'w-full min-w-0 bg-transparent p-2 text-base text-fg placeholder-muted-fg focus:outline-none lg:text-sm'
+        ]
+    }
+})
+
+const { description, label, fieldError, input } = fieldStyles()
+
+const Label = ({ className, ...props }: LabelProps) => {
+    return <LabelPrimitive {...props} className={label({ className })} />
 }
 
-const Description = (props: TextProps) => {
-    return <Text {...props} slot="description" className={twMerge('text-sm text-muted-fg', props.className)} />
+const Description = ({ className, ...props }: TextProps) => {
+    return <Text {...props} slot="description" className={description({ className })} />
 }
 
-const FieldError = (props: FieldErrorProps) => {
-    return (
-        <FieldErrorPrimitive
-            {...props}
-            className={ctr(props.className, 'text-sm text-danger forced-colors:text-[Mark]')}
-        />
-    )
+const FieldError = ({ className, ...props }: FieldErrorProps) => {
+    return <FieldErrorPrimitive {...props} className={ctr(className, fieldError())} />
 }
 
 const fieldGroupStyles = tv({
@@ -59,15 +73,6 @@ const fieldGroupStyles = tv({
     ]
 })
 
-const fieldGroupPrefixStyles = tv({
-    base: [
-        'flex group-invalid:border-danger group-disabled:bg-secondary group-disabled:opacity-50 items-center group-invalid:focus-within:ring-danger/20',
-        '[&>.x2e2>.kbt32x]:size-7 [&>.x2e2>.kbt32x]:rounded-sm [&>.x2e2:has(.kbt32x)]:size-9 [&>.x2e2:has(.kbt32x)]:grid [&>.x2e2:has(.kbt32x)]:place-items-center',
-        '[&>.x2e2>.kbt32x]:before:rounded-[calc(theme(borderRadius.sm)-1px)] [&>.x2e2>.kbt32x]:after:rounded-[calc(theme(borderRadius.sm)-1px)] dark:[&>.x2e2>.kbt32x]:after:rounded-sm',
-        '[&>.isSfx:has(.kbt32x)]:-mr-2 [&>.isPfx:has(.kbt32x)]:-ml-2 [&>.isSfx>.kbt32x]:mr-0.5 [&>.isPfx>.kbt32x]:ml-0.5'
-    ]
-})
-
 const FieldGroup = (props: GroupProps) => {
     return (
         <Group
@@ -80,16 +85,7 @@ const FieldGroup = (props: GroupProps) => {
 }
 
 const Input = React.forwardRef<HTMLInputElement, InputProps>((props, ref) => {
-    return (
-        <InputPrimitive
-            ref={ref}
-            {...props}
-            className={ctr(
-                props.className,
-                'w-full min-w-0 bg-transparent p-2 text-base text-fg placeholder-muted-fg focus:outline-none lg:text-sm'
-            )}
-        />
-    )
+    return <InputPrimitive ref={ref} {...props} className={ctr(props.className, input())} />
 })
 Input.displayName = 'Input'
 
diff --git a/resources/js/components/ui/text-field.tsx b/resources/js/components/ui/text-field.tsx
index 5cf7ade..d5ec36a 100644
--- a/resources/js/components/ui/text-field.tsx
+++ b/resources/js/components/ui/text-field.tsx
@@ -34,12 +34,8 @@ const TextField = ({
 }: TextFieldProps) => {
     return (
         <TextFieldPrimitive {...props} className={ctr(props.className, 'group flex flex-col gap-1')}>
-            {label && <Label id="x21z-id">{label}</Label>}
-            <FieldGroup
-                aria-labelledby={label ? 'x21z-id' : undefined}
-                data-loading={isLoading ? 'true' : undefined}
-                className={fieldGroupPrefixStyles()}
-            >
+            {label && <Label>{label}</Label>}
+            <FieldGroup data-loading={isLoading ? 'true' : undefined} className={fieldGroupPrefixStyles()}>
                 {isLoading && indicatorPlace === 'prefix' ? (
                     <IconLoader className="animate-spin isPfx" />
                 ) : prefix ? (
diff --git a/resources/js/components/ui/toast.tsx b/resources/js/components/ui/toast.tsx
index f9abbb4..02fbe50 100644
--- a/resources/js/components/ui/toast.tsx
+++ b/resources/js/components/ui/toast.tsx
@@ -1,8 +1,8 @@
+import { useTheme } from '@/components/theme-provider'
 import { IconCheck, IconCircleInfoFill, IconLoader, IconTriangleInfoFill } from '@irsyadadl/paranoid'
 import { Toaster as ToasterPrimitive, type ToasterProps } from 'sonner'
 import { twJoin } from 'tailwind-merge'
 
-import { useTheme } from 'components/theme-provider'
 import { buttonStyles } from './button'
 
 const Toast = ({ ...props }: ToasterProps) => {
@@ -23,11 +23,11 @@ const Toast = ({ ...props }: ToasterProps) => {
                 closeButton: true,
                 classNames: {
                     toast: twJoin(
-                        'bg-background ring-1 ring-border dark:ring-inset min-w-[22rem] rounded-xl text-fg overflow-hidden text-[0.925rem] backdrop-blur-xl px-4 py-3 font-normal sm:px-5 sm:py-5',
+                        'bg-background ring-1 ring-border dark:ring-inset sm:min-w-[22rem] rounded-xl text-fg overflow-hidden text-[0.925rem] backdrop-blur-xl px-4 py-3 font-normal sm:px-5 sm:py-5',
                         '[&:has([data-icon])_[data-content]]:ml-5',
                         '[&:has([data-button])_[data-close-button="true"]]:hidden',
                         '[&:not([data-description])_[data-title]]:font-normal',
-                        '[&:has([data-description])_[data-title]]:!font-medium',
+                        '[&:has([data-description])_[data-title]]:!font-medium [&:has([data-description])_[data-title]]:!text-lg',
                         '[&>[data-button]]:absolute [&>[data-button=true]]:bottom-4',
                         '[&>[data-action=true]]:right-4',
                         '[&>[data-cancel=true]]:left-4'