chore: format code

packages/ui/src/components/checkbox.tsx

@@ -9,14 +9,7 @@ export interface CheckboxProps extends ParentProps<ComponentProps<typeof Kobalte
 }
 
 export function Checkbox(props: CheckboxProps) {
-  const [local, others] = splitProps(props, [
-    "children",
-    "class",
-    "label",
-    "hideLabel",
-    "description",
-    "icon",
-  ])
+  const [local, others] = splitProps(props, ["children", "class", "label", "hideLabel", "description", "icon"])
   const resolved = children(() => local.children)
   return (
     <Kobalte {...others} data-component="checkbox">
@@ -42,9 +35,7 @@ export function Checkbox(props: CheckboxProps) {
           </Kobalte.Label>
         </Show>
         <Show when={local.description}>
-          <Kobalte.Description data-slot="checkbox-description">
-            {local.description}
-          </Kobalte.Description>
+          <Kobalte.Description data-slot="checkbox-description">{local.description}</Kobalte.Description>
         </Show>
         <Kobalte.ErrorMessage data-slot="checkbox-error" />
       </div>

packages/ui/src/components/dialog.tsx

@@ -38,11 +38,7 @@ export function DialogRoot(props: DialogProps) {
   return (
     <Kobalte {...others}>
       <Show when={props.trigger}>
-        <Kobalte.Trigger
-          ref={trigger}
-          data-component="dialog-trigger"
-          onFocusIn={handleTriggerFocus}
-        >
+        <Kobalte.Trigger ref={trigger} data-component="dialog-trigger" onFocusIn={handleTriggerFocus}>
           {props.trigger}
         </Kobalte.Trigger>
       </Show>

packages/ui/src/components/diff-changes.tsx

@@ -93,11 +93,7 @@ export function DiffChanges(props: {
 
   return (
     <Show when={variant() === "default" ? total() > 0 : true}>
-      <div
-        data-component="diff-changes"
-        data-variant={variant()}
-        classList={{ [props.class ?? ""]: true }}
-      >
+      <div data-component="diff-changes" data-variant={variant()} classList={{ [props.class ?? ""]: true }}>
         <Switch>
           <Match when={variant() === "bars"}>
             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 12" fill="none">

packages/ui/src/components/diff.tsx

@@ -23,13 +23,7 @@ export type DiffProps<T = {}> = FileDiffOptions<T> & {
 
 export function Diff<T>(props: DiffProps<T>) {
   let container!: HTMLDivElement
-  const [local, others] = splitProps(props, [
-    "before",
-    "after",
-    "class",
-    "classList",
-    "annotations",
-  ])
+  const [local, others] = splitProps(props, ["before", "after", "class", "classList", "annotations"])
 
   // const lineAnnotations: DiffLineAnnotation<ThreadMetadata>[] = [
   //   {
@@ -226,13 +220,7 @@ registerCustomTheme("OpenCode", () => {
         },
       },
       {
-        scope: [
-          "constant",
-          "entity.name.constant",
-          "variable.other.constant",
-          "variable.language",
-          "entity",
-        ],
+        scope: ["constant", "entity.name.constant", "variable.other.constant", "variable.language", "entity"],
         settings: {
           foreground: "var(--syntax-constant)",
         },
@@ -320,11 +308,7 @@ registerCustomTheme("OpenCode", () => {
         },
       },
       {
-        scope: [
-          "support.type.object.module",
-          "variable.other.object",
-          "support.type.property-name.css",
-        ],
+        scope: ["support.type.object.module", "variable.other.object", "support.type.property-name.css"],
         settings: {
           foreground: "var(--syntax-object)",
         },

packages/ui/src/components/icon-button.tsx

@@ -22,11 +22,7 @@ export function IconButton(props: ComponentProps<"button"> & IconButtonProps) {
         [split.class ?? ""]: !!split.class,
       }}
     >
-      <Icon
-        data-slot="icon"
-        name={props.icon}
-        size={split.iconSize ?? (split.size === "large" ? "normal" : "small")}
-      />
+      <Icon data-slot="icon" name={props.icon} size={split.iconSize ?? (split.size === "large" ? "normal" : "small")} />
     </Kobalte>
   )
 }

packages/ui/src/components/input.tsx

@@ -21,12 +21,7 @@ export function Input(props: InputProps) {
     "onKeyDown",
   ])
   return (
-    <Kobalte
-      data-component="input"
-      value={local.value}
-      onChange={local.onChange}
-      onKeyDown={local.onKeyDown}
-    >
+    <Kobalte data-component="input" value={local.value} onChange={local.onChange} onKeyDown={local.onKeyDown}>
       <Show when={local.label}>
         <Kobalte.Label data-slot="label" classList={{ "sr-only": local.hideLabel }}>
           {local.label}

packages/ui/src/components/list.tsx

@@ -62,13 +62,7 @@ export function List<T>(props: ListProps<T>) {
   })
 
   return (
-    <VList
-      data-component="list"
-      ref={setVirtualizer}
-      data={props.data}
-      onKeyDown={handleKey}
-      class={props.class}
-    >
+    <VList data-component="list" ref={setVirtualizer} data={props.data} onKeyDown={handleKey} class={props.class}>
       {(item) => (
         <button
           data-slot="item"

packages/ui/src/components/message-part.tsx

@@ -53,16 +53,11 @@ export function Message(props: MessageProps) {
   return (
     <Switch>
       <Match when={props.message.role === "user" && props.message}>
-        {(userMessage) => (
-          <UserMessageDisplay message={userMessage() as UserMessage} parts={props.parts} />
-        )}
+        {(userMessage) => <UserMessageDisplay message={userMessage() as UserMessage} parts={props.parts} />}
       </Match>
       <Match when={props.message.role === "assistant" && props.message}>
         {(assistantMessage) => (
-          <AssistantMessageDisplay
-            message={assistantMessage() as AssistantMessage}
-            parts={props.parts}
-          />
+          <AssistantMessageDisplay message={assistantMessage() as AssistantMessage} parts={props.parts} />
         )}
       </Match>
     </Switch>
@@ -93,12 +88,7 @@ export function Part(props: MessagePartProps) {
   const component = createMemo(() => PART_MAPPING[props.part.type])
   return (
     <Show when={component()}>
-      <Dynamic
-        component={component()}
-        part={props.part}
-        message={props.message}
-        hideDetails={props.hideDetails}
-      />
+      <Dynamic component={component()} part={props.part} message={props.message} hideDetails={props.hideDetails} />
     </Show>
   )
 }
@@ -226,10 +216,7 @@ ToolRegistry.register({
   name: "list",
   render(props) {
     return (
-      <BasicTool
-        icon="bullet-list"
-        trigger={{ title: "List", subtitle: getDirectory(props.input.path || "/") }}
-      >
+      <BasicTool icon="bullet-list" trigger={{ title: "List", subtitle: getDirectory(props.input.path || "/") }}>
         <Show when={false && props.output}>
           <div data-component="tool-output">{props.output}</div>
         </Show>

packages/ui/src/components/progress-circle.tsx

@@ -7,13 +7,7 @@ export interface ProgressCircleProps extends Pick<ComponentProps<"svg">, "class"
 }
 
 export function ProgressCircle(props: ProgressCircleProps) {
-  const [split, rest] = splitProps(props, [
-    "percentage",
-    "size",
-    "strokeWidth",
-    "class",
-    "classList",
-  ])
+  const [split, rest] = splitProps(props, ["percentage", "size", "strokeWidth", "class", "classList"])
 
   const size = () => split.size || 16
   const strokeWidth = () => split.strokeWidth || 3
@@ -42,13 +36,7 @@ export function ProgressCircle(props: ProgressCircleProps) {
         [split.class ?? ""]: !!split.class,
       }}
     >
-      <circle
-        cx={center}
-        cy={center}
-        r={radius()}
-        data-slot="background"
-        stroke-width={strokeWidth()}
-      />
+      <circle cx={center} cy={center} r={radius()} data-slot="background" stroke-width={strokeWidth()} />
       <circle
         cx={center}
         cy={center}

packages/ui/src/components/select-dialog.tsx

@@ -21,16 +21,15 @@ export function SelectDialog<T>(props: SelectDialogProps<T>) {
     mouseActive: false,
   })
 
-  const { filter, grouped, flat, reset, clear, active, setActive, onKeyDown, onInput } =
-    useFilteredList<T>({
-      items: others.items,
-      key: others.key,
-      filterKeys: others.filterKeys,
-      current: others.current,
-      groupBy: others.groupBy,
-      sortBy: others.sortBy,
-      sortGroupsBy: others.sortGroupsBy,
-    })
+  const { filter, grouped, flat, reset, clear, active, setActive, onKeyDown, onInput } = useFilteredList<T>({
+    items: others.items,
+    key: others.key,
+    filterKeys: others.filterKeys,
+    current: others.current,
+    groupBy: others.groupBy,
+    sortBy: others.sortBy,
+    sortGroupsBy: others.sortGroupsBy,
+  })
 
   createEffect(() => {
     filter()
@@ -118,8 +117,7 @@ export function SelectDialog<T>(props: SelectDialogProps<T>) {
           fallback={
             <div data-slot="empty-state">
               <div data-slot="message">
-                {props.emptyMessage ?? "No search results"} for{" "}
-                <span data-slot="filter">&quot;{filter()}&quot;</span>
+                {props.emptyMessage ?? "No search results"} for <span data-slot="filter">&quot;{filter()}&quot;</span>
               </div>
             </div>
           }

packages/ui/src/components/select.tsx

@@ -49,9 +49,7 @@ export function Select<T>(props: SelectProps<T> & ButtonProps) {
           {...itemProps}
         >
           <Kobalte.ItemLabel data-slot="select-item-label">
-            {props.label
-              ? props.label(itemProps.item.rawValue)
-              : (itemProps.item.rawValue as string)}
+            {props.label ? props.label(itemProps.item.rawValue) : (itemProps.item.rawValue as string)}
           </Kobalte.ItemLabel>
           <Kobalte.ItemIndicator data-slot="select-item-indicator">
             <Icon name="check-small" size="small" />

packages/ui/src/components/typewriter.tsx

@@ -2,11 +2,7 @@ import { createEffect, Show, type ValidComponent } from "solid-js"
 import { createStore } from "solid-js/store"
 import { Dynamic } from "solid-js/web"
 
-export const Typewriter = <T extends ValidComponent = "p">(props: {
-  text?: string
-  class?: string
-  as?: T
-}) => {
+export const Typewriter = <T extends ValidComponent = "p">(props: { text?: string; class?: string; as?: T }) => {
   const [store, setStore] = createStore({
     typing: false,
     displayed: "",