Restructure Form components

src/app/(pages)/aup/components/AupView.tsx

@@ -4,10 +4,7 @@ import { dateToHuman } from "@/utils/dates";
 import EditButton from "./EditButton";
 import RequestSignatureButton from "./RequestSignatureButton";
 import DeleteButton from "./DeleteButton";
-import Field from "@/components/Field";
-import Label from "@/components/Label";
-import Description from "@/components/Description";
-import { Form } from "@/components/Form";
+import { Form, Field, Label, Description } from "@/components/Form";
 
 type AupViewProps = {
   aup: AUP;

src/app/(pages)/aup/components/CreateModal.tsx

@@ -1,8 +1,7 @@
 import { Button } from "@/components/Buttons";
-import Description from "@/components/Description";
-import { Form } from "@/components/Form";
+import { Description } from "@/components/Form";
+import { Form, Label } from "@/components/Form";
 import { Input } from "@/components/Inputs";
-import Label from "@/components/Label";
 import { Modal, ModalBody, ModalFooter, ModalProps } from "@/components/Modal";
 import { createAUP } from "@/services/aup";
 import { Field } from "@headlessui/react";

src/app/(pages)/aup/components/EditModal.tsx

@@ -1,7 +1,4 @@
-import Description from "@/components/Description";
-import Field from "@/components/Field";
-import { Form } from "@/components/Form";
-import Label from "@/components/Label";
+import { Form, Field, Description, Label } from "@/components/Form";
 import { Modal, ModalBody, ModalFooter, ModalProps } from "@/components/Modal";
 import { Input } from "@/components/Inputs";
 import { Button } from "@/components/Buttons";

src/app/(pages)/clients/new/Form/GeneralSettings.tsx

@@ -1,10 +1,8 @@
 import { CarouselPanel } from "@/components/Carousel";
-import Field from "@/components/Field";
 import { Input } from "@/components/Inputs";
-import Label from "@/components/Label";
 import Section from "@/components/Section";
 import { useFormStatus } from "@/utils/forms";
-import Description from "@/components/Description";
+import { Field, Label, Description } from "@/components/Form";
 
 type GeneralSettingsProps = {
   id: string;

src/app/(pages)/clients/new/Form/OIDCSettings/AuthenticationFlow/AuthorizationCode.tsx

@@ -1,6 +1,5 @@
-import Field from "@/components/Field";
+import { Field, Label } from "@/components/Form";
 import { InputList } from "@/components/Inputs";
-import Label from "@/components/Label";
 import { Description } from "@headlessui/react";
 
 type AuthorizationCodeProps = {

src/app/(pages)/clients/new/Form/OIDCSettings/AuthenticationFlow/index.tsx

@@ -1,7 +1,6 @@
-import Label from "@/components/Label";
 import Select from "@/components/Select";
 import { Description } from "@headlessui/react";
-import Field from "@/components/Field";
+import { Field, Label } from "@/components/Form";
 import AuthorizationCode from "./AuthorizationCode";
 import ClientCredentials from "./ClientCredentials";
 import DeviceCode from "./DeviceCode";
@@ -53,9 +52,7 @@ export default function AuthenticationFlow(
     <>
       <Field>
         <Label>Authentication Flow</Label>
-        <Description className="text-xs text-primary/60">
-          A little description.
-        </Description>
+        <Description className="description">A little description.</Description>
         <Select
           name="grant_types"
           options={grantTypes}

src/app/(pages)/clients/new/Form/OIDCSettings/ClientAuthentication/PrivateKeyJwt.tsx

@@ -1,7 +1,5 @@
-import Description from "@/components/Description";
-import Field from "@/components/Field";
+import { Field, Description, Label } from "@/components/Form";
 import { Input } from "@/components/Inputs";
-import Label from "@/components/Label";
 import TextArea from "@/components/TextArea";
 import { useState } from "react";
 

src/app/(pages)/clients/new/Form/OIDCSettings/ClientAuthentication/index.tsx

@@ -1,6 +1,4 @@
-import Description from "@/components/Description";
-import Field from "@/components/Field";
-import Label from "@/components/Label";
+import { Description, Field, Label } from "@/components/Form";
 import Select from "@/components/Select";
 import { capitalize } from "@/utils/strings";
 import { useState } from "react";

src/app/(pages)/clients/new/Form/OIDCSettings/index.tsx

@@ -1,10 +1,8 @@
 import { CarouselPanel } from "@/components/Carousel";
-import Field from "@/components/Field";
+import { Field, Label, Description } from "@/components/Form";
 import { InputListDropdown } from "@/components/Inputs";
-import Label from "@/components/Label";
 import Section from "@/components/Section";
 import { type Scope } from "@/models/client";
-import Description from "@/components/Description";
 import { OpenIdConfiguration } from "@/models/openid-configuration";
 import AuthenticationFlow from "./AuthenticationFlow";
 import { useFormStatus } from "@/utils/forms";

src/app/(pages)/clients/new/Form/OtherSettings.tsx

@@ -1,7 +1,6 @@
 import { CarouselPanel } from "@/components/Carousel";
-import Field from "@/components/Field";
+import { Field, Label } from "@/components/Form";
 import { Input } from "@/components/Inputs";
-import Label from "@/components/Label";
 import Section from "@/components/Section";
 import { useFormStatus } from "@/utils/forms";
 import { useEffect } from "react";

src/app/(pages)/scopes/components/NewScopeModal.tsx

@@ -1,5 +1,4 @@
-import Description from "@/components/Description";
-import { Form, FormSection } from "@/components/Form";
+import { Form, Description, FormSection } from "@/components/Form";
 import { Input } from "@/components/Inputs";
 import { Modal, ModalBody, ModalFooter, ModalProps } from "@/components/Modal";
 import { Button } from "@/components/Buttons";

src/app/(pages)/users/[user]/components/Attributes/AddButton/AddAttributeModal.tsx

@@ -1,8 +1,6 @@
 import { Button } from "@/components/Buttons";
-import Field from "@/components/Field";
-import { Form } from "@/components/Form";
+import { Form, Field, Label } from "@/components/Form";
 import { Input } from "@/components/Inputs";
-import Label from "@/components/Label";
 import { Modal, ModalBody, ModalFooter, ModalProps } from "@/components/Modal";
 import { User } from "@/models/scim";
 import { addAttribute } from "@/services/users";

src/app/(pages)/users/[user]/components/Groups/JoinGroupButton/JoinGroupModal.tsx

@@ -1,6 +1,6 @@
 "use client";
 import { Button } from "@/components/Buttons";
-import { Form } from "@/components/Form";
+import { Form, Field, Label } from "@/components/Form";
 import { XMarkIcon, ArrowUpTrayIcon } from "@heroicons/react/24/solid";
 import { Group } from "@/models/groups";
 import { JoinGroupRequest } from "@/models/group-requests";
@@ -11,8 +11,6 @@ import { useState } from "react";
 import { addUserToGroup, searchGroup } from "@/services/groups";
 import { Input } from "@/components/Inputs";
 import { makeScimReferenceFromUser } from "@/utils/scim";
-import Field from "@/components/Field";
-import Label from "@/components/Label";
 import Combobox from "@/components/Combobox";
 import InfoTable from "@/components/InfoTable";
 

src/app/(pages)/users/[user]/components/Info/ChangeMembershipEndTime/index.tsx

@@ -1,8 +1,6 @@
 import { Button } from "@/components/Buttons";
-import Field from "@/components/Field";
-import { Form } from "@/components/Form";
+import { Form, Field, Label } from "@/components/Form";
 import { Input } from "@/components/Inputs";
-import Label from "@/components/Label";
 import { Modal, ModalBody, ModalFooter, ModalProps } from "@/components/Modal";
 import { User } from "@/models/scim";
 import {

src/app/(pages)/users/[user]/components/SSHKeys/AddButton/AddSSHKeyModal.tsx

@@ -1,8 +1,6 @@
 import { Button } from "@/components/Buttons";
-import Field from "@/components/Field";
-import { Form } from "@/components/Form";
+import { Form, Field, Label } from "@/components/Form";
 import { Input } from "@/components/Inputs";
-import Label from "@/components/Label";
 import { Modal, ModalBody, ModalFooter, ModalProps } from "@/components/Modal";
 import TextArea from "@/components/TextArea";
 import { SSHKey } from "@/models/indigo-user";

src/components/Form/index.ts

@@ -1,2 +1,5 @@
 export { default as Form } from "./Form";
 export { default as FormSection } from "./FormSection";
+export { default as Field } from "./Field";
+export { default as Description } from "./Description";
+export { default as Label } from "./Label";