Remnants

apps/class-solid/src/components/ObjectField.tsx

@@ -82,26 +82,30 @@ export function MyTextField({
   Field,
   // biome-ignore lint/suspicious/noExplicitAny: json schema types are too complex
 }: { name: string; schema: any; [key: string]: any; Field: any }) {
+  // TODO use generics to type more explicitly
+  // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+  function myfield(field: any, props: any) {
+    return (
+      <TextField class="flex items-center">
+        <TextFieldLabel for={name} class="basis-1/2">
+          {schema.description ?? name}
+        </TextFieldLabel>
+        <TextFieldInput
+          type="text"
+          id={props.name}
+          name={props.name}
+          value={field.value}
+          placeholder={schema.default}
+          {...props}
+          class="basis-1/2"
+        />
+      </TextField>
+    );
+  }
+
   return (
     // TODO: display units after input field?
     // TODO: add more modularforms functionality
-    <Field name={name}>
-      {(field, props) => (
-        <TextField class="flex items-center">
-          <TextFieldLabel for={name} class="basis-3/4">
-            {schema.description ?? name}
-          </TextFieldLabel>
-          <TextFieldInput
-            type="text"
-            id={props.name}
-            name={props.name}
-            value={field.value}
-            placeholder={schema.default}
-            {...props}
-            class="basis-1/4"
-          />
-        </TextField>
-      )}
-    </Field>
+    <Field name={name}>{myfield}</Field>
   );
 }

apps/class-solid/src/components/ui/accordion.tsx

@@ -1,41 +1,46 @@
-import type { JSX, ValidComponent } from "solid-js"
-import { splitProps } from "solid-js"
+import type { JSX, ValidComponent } from "solid-js";
+import { splitProps } from "solid-js";
 
-import * as AccordionPrimitive from "@kobalte/core/accordion"
-import type { PolymorphicProps } from "@kobalte/core/polymorphic"
+import * as AccordionPrimitive from "@kobalte/core/accordion";
+import type { PolymorphicProps } from "@kobalte/core/polymorphic";
 
-import { cn } from "~/lib/utils"
+import { cn } from "~/lib/utils";
 
-const Accordion = AccordionPrimitive.Root
+const Accordion = AccordionPrimitive.Root;
 
 type AccordionItemProps<T extends ValidComponent = "div"> =
   AccordionPrimitive.AccordionItemProps<T> & {
-    class?: string | undefined
-  }
+    class?: string | undefined;
+  };
 
 const AccordionItem = <T extends ValidComponent = "div">(
-  props: PolymorphicProps<T, AccordionItemProps<T>>
+  props: PolymorphicProps<T, AccordionItemProps<T>>,
 ) => {
-  const [local, others] = splitProps(props as AccordionItemProps, ["class"])
-  return <AccordionPrimitive.Item class={cn("border-b", local.class)} {...others} />
-}
+  const [local, others] = splitProps(props as AccordionItemProps, ["class"]);
+  return (
+    <AccordionPrimitive.Item class={cn("border-b", local.class)} {...others} />
+  );
+};
 
 type AccordionTriggerProps<T extends ValidComponent = "button"> =
   AccordionPrimitive.AccordionTriggerProps<T> & {
-    class?: string | undefined
-    children?: JSX.Element
-  }
+    class?: string | undefined;
+    children?: JSX.Element;
+  };
 
 const AccordionTrigger = <T extends ValidComponent = "button">(
-  props: PolymorphicProps<T, AccordionTriggerProps<T>>
+  props: PolymorphicProps<T, AccordionTriggerProps<T>>,
 ) => {
-  const [local, others] = splitProps(props as AccordionTriggerProps, ["class", "children"])
+  const [local, others] = splitProps(props as AccordionTriggerProps, [
+    "class",
+    "children",
+  ]);
   return (
     <AccordionPrimitive.Header class="flex">
       <AccordionPrimitive.Trigger
         class={cn(
           "flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-expanded]>svg]:rotate-180",
-          local.class
+          local.class,
         )}
         {...others}
       >
@@ -50,34 +55,38 @@ const AccordionTrigger = <T extends ValidComponent = "button">(
           stroke-linejoin="round"
           class="size-4 shrink-0 transition-transform duration-200"
         >
+          <title>Button</title>
           <path d="M6 9l6 6l6 -6" />
         </svg>
       </AccordionPrimitive.Trigger>
     </AccordionPrimitive.Header>
-  )
-}
+  );
+};
 
 type AccordionContentProps<T extends ValidComponent = "div"> =
   AccordionPrimitive.AccordionContentProps<T> & {
-    class?: string | undefined
-    children?: JSX.Element
-  }
+    class?: string | undefined;
+    children?: JSX.Element;
+  };
 
 const AccordionContent = <T extends ValidComponent = "div">(
-  props: PolymorphicProps<T, AccordionContentProps<T>>
+  props: PolymorphicProps<T, AccordionContentProps<T>>,
 ) => {
-  const [local, others] = splitProps(props as AccordionContentProps, ["class", "children"])
+  const [local, others] = splitProps(props as AccordionContentProps, [
+    "class",
+    "children",
+  ]);
   return (
     <AccordionPrimitive.Content
       class={cn(
         "animate-accordion-up overflow-hidden text-sm transition-all data-[expanded]:animate-accordion-down",
-        local.class
+        local.class,
       )}
       {...others}
     >
-      <div class="pb-4 pt-0">{local.children}</div>
+      <div class="pt-0 pb-4">{local.children}</div>
     </AccordionPrimitive.Content>
-  )
-}
+  );
+};
 
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

packages/class/src/config.ts

@@ -76,6 +76,8 @@ const mixedLayer = z
   .describe("Mixed layer");
 
 export const classConfig = z.object({
+  title: z.string().default(""),
+  description: z.string().default(""),
   initialState: initialState.default({}),
   timeControl: timeControl.default({}),
   mixedLayer: mixedLayer.default({}),