diff --git a/packages/ui/src/demo.tsx b/packages/ui/src/demo.tsx
index 5893ca75..6d60c25a 100644
--- a/packages/ui/src/demo.tsx
+++ b/packages/ui/src/demo.tsx
@@ -126,7 +126,7 @@ const Demo: Component = () => {
         <Tooltip value="This is a right tooltip" placement="right">
           <Button variant="secondary">Right Tooltip</Button>
         </Tooltip>
-        <Tooltip value={() => `Dynamic tooltip: ${new Date().toLocaleTimeString()}`} placement="top">
+        <Tooltip value={`Dynamic tooltip: ${new Date().toLocaleTimeString()}`} placement="top">
           <Button variant="primary">Dynamic Tooltip</Button>
         </Tooltip>
       </section>
@@ -141,7 +141,9 @@ const Demo: Component = () => {
         <Input
           placeholder="Enter text..."
           value={inputValue()}
-          onInput={(e: InputEvent & { currentTarget: HTMLInputElement }) => setInputValue(e.currentTarget.value)}
+          onInput={(e: InputEvent & { currentTarget: HTMLInputElement }) =>
+            setInputValue(e.currentTarget.value)
+          }
         />
         <Input placeholder="Disabled input" disabled />
         <Input type="password" placeholder="Password input" />
@@ -158,8 +160,15 @@ const Demo: Component = () => {
           checked={checked()}
           onChange={setChecked}
         />
-        <Checkbox label="With description" description="This is a helpful description for the checkbox" />
-        <Checkbox label="Indeterminate state" description="Useful for nested checkbox lists" indeterminate />
+        <Checkbox
+          label="With description"
+          description="This is a helpful description for the checkbox"
+        />
+        <Checkbox
+          label="Indeterminate state"
+          description="Useful for nested checkbox lists"
+          indeterminate
+        />
         <Checkbox
           label="I agree to the Terms and Conditions"
           description="You must agree to continue"
@@ -190,8 +199,17 @@ const Demo: Component = () => {
         <Button onClick={() => setDialogOpen(true)}>Open Dialog</Button>
         <Dialog open={dialogOpen()} onOpenChange={setDialogOpen}>
           <Dialog.Title>Example Dialog</Dialog.Title>
-          <Dialog.Description>This is an example dialog with a title and description.</Dialog.Description>
-          <div style={{ "margin-top": "16px", display: "flex", gap: "8px", "justify-content": "flex-end" }}>
+          <Dialog.Description>
+            This is an example dialog with a title and description.
+          </Dialog.Description>
+          <div
+            style={{
+              "margin-top": "16px",
+              display: "flex",
+              gap: "8px",
+              "justify-content": "flex-end",
+            }}
+          >
             <Button variant="ghost" onClick={() => setDialogOpen(false)}>
               Cancel
             </Button>
@@ -249,7 +267,10 @@ const Demo: Component = () => {
             </Accordion.Header>
             <Accordion.Content>
               <div style={{ padding: "16px" }}>
-                <p>Kobalte is a UI toolkit for building accessible web apps and design systems with SolidJS.</p>
+                <p>
+                  Kobalte is a UI toolkit for building accessible web apps and design systems with
+                  SolidJS.
+                </p>
               </div>
             </Accordion.Content>
           </Accordion.Item>