@falcondev-oss/nuxt-layers-base 0.1.0

package/.nuxt/ui/calendar.ts

@@ -0,0 +1,315 @@
+const color = [
+  "primary",
+  "secondary",
+  "success",
+  "info",
+  "warning",
+  "error",
+  "neutral"
+] as const
+
+const variant = [
+  "solid",
+  "outline",
+  "soft",
+  "subtle"
+] as const
+
+const size = [
+  "xs",
+  "sm",
+  "md",
+  "lg",
+  "xl"
+] as const
+
+export default {
+  "slots": {
+    "root": "",
+    "header": "flex items-center justify-between",
+    "body": "flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0",
+    "heading": "text-center font-medium truncate mx-auto",
+    "grid": "w-full border-collapse select-none space-y-1 focus:outline-none",
+    "gridRow": "grid grid-cols-7 place-items-center",
+    "gridWeekDaysRow": "mb-1 grid w-full grid-cols-7",
+    "gridBody": "grid",
+    "headCell": "rounded-md",
+    "cell": "relative text-center",
+    "cellTrigger": [
+      "m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted",
+      "transition"
+    ]
+  },
+  "variants": {
+    "color": {
+      "primary": {
+        "headCell": "text-primary",
+        "cellTrigger": "focus-visible:ring-primary"
+      },
+      "secondary": {
+        "headCell": "text-secondary",
+        "cellTrigger": "focus-visible:ring-secondary"
+      },
+      "success": {
+        "headCell": "text-success",
+        "cellTrigger": "focus-visible:ring-success"
+      },
+      "info": {
+        "headCell": "text-info",
+        "cellTrigger": "focus-visible:ring-info"
+      },
+      "warning": {
+        "headCell": "text-warning",
+        "cellTrigger": "focus-visible:ring-warning"
+      },
+      "error": {
+        "headCell": "text-error",
+        "cellTrigger": "focus-visible:ring-error"
+      },
+      "neutral": {
+        "headCell": "text-highlighted",
+        "cellTrigger": "focus-visible:ring-inverted"
+      }
+    },
+    "variant": {
+      "solid": "",
+      "outline": "",
+      "soft": "",
+      "subtle": ""
+    },
+    "size": {
+      "xs": {
+        "heading": "text-xs",
+        "cell": "text-xs",
+        "headCell": "text-[10px]",
+        "cellTrigger": "size-7",
+        "body": "space-y-2 pt-2"
+      },
+      "sm": {
+        "heading": "text-xs",
+        "headCell": "text-xs",
+        "cell": "text-xs",
+        "cellTrigger": "size-7"
+      },
+      "md": {
+        "heading": "text-sm",
+        "headCell": "text-xs",
+        "cell": "text-sm",
+        "cellTrigger": "size-8"
+      },
+      "lg": {
+        "heading": "text-md",
+        "headCell": "text-md",
+        "cellTrigger": "size-9 text-md"
+      },
+      "xl": {
+        "heading": "text-lg",
+        "headCell": "text-lg",
+        "cellTrigger": "size-10 text-lg"
+      }
+    }
+  },
+  "compoundVariants": [
+    {
+      "color": "primary" as typeof color[number],
+      "variant": "solid" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20"
+      }
+    },
+    {
+      "color": "secondary" as typeof color[number],
+      "variant": "solid" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-secondary data-[selected]:text-inverted data-today:not-data-[selected]:text-secondary data-[highlighted]:bg-secondary/20 hover:not-data-[selected]:bg-secondary/20"
+      }
+    },
+    {
+      "color": "success" as typeof color[number],
+      "variant": "solid" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-success data-[selected]:text-inverted data-today:not-data-[selected]:text-success data-[highlighted]:bg-success/20 hover:not-data-[selected]:bg-success/20"
+      }
+    },
+    {
+      "color": "info" as typeof color[number],
+      "variant": "solid" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-info data-[selected]:text-inverted data-today:not-data-[selected]:text-info data-[highlighted]:bg-info/20 hover:not-data-[selected]:bg-info/20"
+      }
+    },
+    {
+      "color": "warning" as typeof color[number],
+      "variant": "solid" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-warning data-[selected]:text-inverted data-today:not-data-[selected]:text-warning data-[highlighted]:bg-warning/20 hover:not-data-[selected]:bg-warning/20"
+      }
+    },
+    {
+      "color": "error" as typeof color[number],
+      "variant": "solid" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-error data-[selected]:text-inverted data-today:not-data-[selected]:text-error data-[highlighted]:bg-error/20 hover:not-data-[selected]:bg-error/20"
+      }
+    },
+    {
+      "color": "primary" as typeof color[number],
+      "variant": "outline" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10"
+      }
+    },
+    {
+      "color": "secondary" as typeof color[number],
+      "variant": "outline" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-secondary/50 data-[selected]:text-secondary data-today:not-data-[selected]:text-secondary data-[highlighted]:bg-secondary/10 hover:not-data-[selected]:bg-secondary/10"
+      }
+    },
+    {
+      "color": "success" as typeof color[number],
+      "variant": "outline" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-success/50 data-[selected]:text-success data-today:not-data-[selected]:text-success data-[highlighted]:bg-success/10 hover:not-data-[selected]:bg-success/10"
+      }
+    },
+    {
+      "color": "info" as typeof color[number],
+      "variant": "outline" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-info/50 data-[selected]:text-info data-today:not-data-[selected]:text-info data-[highlighted]:bg-info/10 hover:not-data-[selected]:bg-info/10"
+      }
+    },
+    {
+      "color": "warning" as typeof color[number],
+      "variant": "outline" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-warning/50 data-[selected]:text-warning data-today:not-data-[selected]:text-warning data-[highlighted]:bg-warning/10 hover:not-data-[selected]:bg-warning/10"
+      }
+    },
+    {
+      "color": "error" as typeof color[number],
+      "variant": "outline" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-error/50 data-[selected]:text-error data-today:not-data-[selected]:text-error data-[highlighted]:bg-error/10 hover:not-data-[selected]:bg-error/10"
+      }
+    },
+    {
+      "color": "primary" as typeof color[number],
+      "variant": "soft" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20"
+      }
+    },
+    {
+      "color": "secondary" as typeof color[number],
+      "variant": "soft" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-secondary/10 data-[selected]:text-secondary data-today:not-data-[selected]:text-secondary data-[highlighted]:bg-secondary/20 hover:not-data-[selected]:bg-secondary/20"
+      }
+    },
+    {
+      "color": "success" as typeof color[number],
+      "variant": "soft" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-success/10 data-[selected]:text-success data-today:not-data-[selected]:text-success data-[highlighted]:bg-success/20 hover:not-data-[selected]:bg-success/20"
+      }
+    },
+    {
+      "color": "info" as typeof color[number],
+      "variant": "soft" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-info/10 data-[selected]:text-info data-today:not-data-[selected]:text-info data-[highlighted]:bg-info/20 hover:not-data-[selected]:bg-info/20"
+      }
+    },
+    {
+      "color": "warning" as typeof color[number],
+      "variant": "soft" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-warning/10 data-[selected]:text-warning data-today:not-data-[selected]:text-warning data-[highlighted]:bg-warning/20 hover:not-data-[selected]:bg-warning/20"
+      }
+    },
+    {
+      "color": "error" as typeof color[number],
+      "variant": "soft" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-error/10 data-[selected]:text-error data-today:not-data-[selected]:text-error data-[highlighted]:bg-error/20 hover:not-data-[selected]:bg-error/20"
+      }
+    },
+    {
+      "color": "primary" as typeof color[number],
+      "variant": "subtle" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20"
+      }
+    },
+    {
+      "color": "secondary" as typeof color[number],
+      "variant": "subtle" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-secondary/10 data-[selected]:text-secondary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-secondary/25 data-today:not-data-[selected]:text-secondary data-[highlighted]:bg-secondary/20 hover:not-data-[selected]:bg-secondary/20"
+      }
+    },
+    {
+      "color": "success" as typeof color[number],
+      "variant": "subtle" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-success/10 data-[selected]:text-success data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-success/25 data-today:not-data-[selected]:text-success data-[highlighted]:bg-success/20 hover:not-data-[selected]:bg-success/20"
+      }
+    },
+    {
+      "color": "info" as typeof color[number],
+      "variant": "subtle" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-info/10 data-[selected]:text-info data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-info/25 data-today:not-data-[selected]:text-info data-[highlighted]:bg-info/20 hover:not-data-[selected]:bg-info/20"
+      }
+    },
+    {
+      "color": "warning" as typeof color[number],
+      "variant": "subtle" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-warning/10 data-[selected]:text-warning data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-warning/25 data-today:not-data-[selected]:text-warning data-[highlighted]:bg-warning/20 hover:not-data-[selected]:bg-warning/20"
+      }
+    },
+    {
+      "color": "error" as typeof color[number],
+      "variant": "subtle" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-error/10 data-[selected]:text-error data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-error/25 data-today:not-data-[selected]:text-error data-[highlighted]:bg-error/20 hover:not-data-[selected]:bg-error/20"
+      }
+    },
+    {
+      "color": "neutral" as typeof color[number],
+      "variant": "solid" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10"
+      }
+    },
+    {
+      "color": "neutral" as typeof color[number],
+      "variant": "outline" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[selected]:text-default data-[selected]:bg-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/10 hover:not-data-[selected]:bg-inverted/10"
+      }
+    },
+    {
+      "color": "neutral" as typeof color[number],
+      "variant": "soft" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-elevated data-[selected]:text-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10"
+      }
+    },
+    {
+      "color": "neutral" as typeof color[number],
+      "variant": "subtle" as typeof variant[number],
+      "class": {
+        "cellTrigger": "data-[selected]:bg-elevated data-[selected]:text-default data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10"
+      }
+    }
+  ],
+  "defaultVariants": {
+    "size": "md" as typeof size[number],
+    "color": "primary" as typeof color[number],
+    "variant": "solid" as typeof variant[number]
+  }
+}

package/.nuxt/ui/card.ts

@@ -0,0 +1,34 @@
+const variant = [
+  "solid",
+  "outline",
+  "soft",
+  "subtle"
+] as const
+
+export default {
+  "slots": {
+    "root": "rounded-lg overflow-hidden",
+    "header": "p-4 sm:px-6",
+    "body": "p-4 sm:p-6",
+    "footer": "p-4 sm:px-6"
+  },
+  "variants": {
+    "variant": {
+      "solid": {
+        "root": "bg-inverted text-inverted"
+      },
+      "outline": {
+        "root": "bg-default ring ring-default divide-y divide-default"
+      },
+      "soft": {
+        "root": "bg-elevated/50 divide-y divide-default"
+      },
+      "subtle": {
+        "root": "bg-elevated/50 ring ring-default divide-y divide-default"
+      }
+    }
+  },
+  "defaultVariants": {
+    "variant": "outline" as typeof variant[number]
+  }
+}

package/.nuxt/ui/carousel.ts

@@ -0,0 +1,38 @@
+export default {
+  "slots": {
+    "root": "relative focus:outline-none",
+    "viewport": "overflow-hidden",
+    "container": "flex items-start",
+    "item": "min-w-0 shrink-0 basis-full",
+    "controls": "",
+    "arrows": "",
+    "prev": "absolute rounded-full",
+    "next": "absolute rounded-full",
+    "dots": "absolute inset-x-0 -bottom-7 flex flex-wrap items-center justify-center gap-3",
+    "dot": [
+      "cursor-pointer size-3 bg-accented rounded-full focus:outline-none focus-visible:ring-2 focus-visible:ring-primary",
+      "transition"
+    ]
+  },
+  "variants": {
+    "orientation": {
+      "vertical": {
+        "container": "flex-col -mt-4",
+        "item": "pt-4",
+        "prev": "top-4 sm:-top-12 left-1/2 -translate-x-1/2 rotate-90 rtl:-rotate-90",
+        "next": "bottom-4 sm:-bottom-12 left-1/2 -translate-x-1/2 rotate-90 rtl:-rotate-90"
+      },
+      "horizontal": {
+        "container": "flex-row -ms-4",
+        "item": "ps-4",
+        "prev": "start-4 sm:-start-12 top-1/2 -translate-y-1/2",
+        "next": "end-4 sm:-end-12 top-1/2 -translate-y-1/2"
+      }
+    },
+    "active": {
+      "true": {
+        "dot": "data-[state=active]:bg-inverted"
+      }
+    }
+  }
+}

package/.nuxt/ui/changelog-version.ts

@@ -0,0 +1,45 @@
+export default {
+  "slots": {
+    "root": "relative",
+    "container": "flex flex-col mx-auto max-w-2xl",
+    "header": "",
+    "meta": "flex items-center gap-3 mb-2",
+    "date": "text-sm/6 text-toned truncate",
+    "badge": "",
+    "title": "relative text-xl text-pretty font-semibold text-highlighted",
+    "description": "text-base text-pretty text-muted mt-1",
+    "imageWrapper": "relative overflow-hidden rounded-lg aspect-[16/9] mt-5 group/changelog-version-image",
+    "image": "object-cover object-top w-full h-full",
+    "authors": "flex flex-wrap gap-x-4 gap-y-1.5",
+    "footer": "border-t border-default pt-5 flex items-center justify-between",
+    "indicator": "absolute start-0 top-0 w-32 hidden lg:flex items-center justify-end gap-3 min-w-0",
+    "dot": "size-4 rounded-full bg-default ring ring-default flex items-center justify-center my-1",
+    "dotInner": "size-2 rounded-full bg-primary"
+  },
+  "variants": {
+    "body": {
+      "false": {
+        "footer": "mt-5"
+      }
+    },
+    "badge": {
+      "false": {
+        "meta": "lg:hidden"
+      }
+    },
+    "to": {
+      "true": {
+        "title": [
+          "has-focus-visible:ring-2 has-focus-visible:ring-primary rounded-xs",
+          "transition"
+        ],
+        "image": "transform transition-transform duration-200 group-hover/changelog-version-image:scale-105 group-has-focus-visible/changelog-version-image:scale-105"
+      }
+    },
+    "hidden": {
+      "true": {
+        "date": "lg:hidden"
+      }
+    }
+  }
+}

package/.nuxt/ui/changelog-versions.ts

@@ -0,0 +1,8 @@
+export default {
+  "slots": {
+    "root": "relative",
+    "container": "flex flex-col gap-y-8 sm:gap-y-12 lg:gap-y-16",
+    "indicator": "absolute hidden lg:block overflow-hidden inset-y-3 start-32 h-full w-px bg-border -ms-[8.5px]",
+    "beam": "absolute start-0 top-0 w-full bg-primary will-change-[height]"
+  }
+}

package/.nuxt/ui/chat-message.ts

@@ -0,0 +1,136 @@
+const variant = [
+  "solid",
+  "outline",
+  "soft",
+  "subtle",
+  "naked"
+] as const
+
+const side = [
+  "left",
+  "right"
+] as const
+
+export default {
+  "slots": {
+    "root": "group/message relative w-full",
+    "container": "relative flex items-start",
+    "leading": "inline-flex items-center justify-center min-h-6",
+    "leadingIcon": "shrink-0",
+    "leadingAvatar": "shrink-0",
+    "leadingAvatarSize": "",
+    "content": "relative text-pretty min-w-0 *:first:mt-0 *:last:mb-0",
+    "actions": [
+      "opacity-0 group-hover/message:opacity-100 absolute bottom-0 flex items-center",
+      "transition-opacity"
+    ]
+  },
+  "variants": {
+    "variant": {
+      "solid": {
+        "content": "bg-inverted text-inverted"
+      },
+      "outline": {
+        "content": "bg-default ring ring-default"
+      },
+      "soft": {
+        "content": "bg-elevated/50"
+      },
+      "subtle": {
+        "content": "bg-elevated/50 ring ring-default"
+      },
+      "naked": {
+        "content": ""
+      }
+    },
+    "side": {
+      "left": {
+        "container": "rtl:justify-end"
+      },
+      "right": {
+        "container": "ltr:justify-end ms-auto max-w-[75%]"
+      }
+    },
+    "leading": {
+      "true": ""
+    },
+    "actions": {
+      "true": ""
+    },
+    "compact": {
+      "true": {
+        "root": "scroll-mt-3",
+        "container": "gap-1.5 pb-3",
+        "leadingIcon": "size-5",
+        "leadingAvatarSize": "2xs"
+      },
+      "false": {
+        "root": "scroll-mt-4 sm:scroll-mt-6",
+        "container": "gap-3 pb-8",
+        "leadingIcon": "size-8",
+        "leadingAvatarSize": "md"
+      }
+    }
+  },
+  "compoundVariants": [
+    {
+      "compact": true,
+      "actions": true,
+      "class": {
+        "container": "pb-8"
+      }
+    },
+    {
+      "leading": true,
+      "compact": false,
+      "side": "left" as typeof side[number],
+      "class": {
+        "actions": "left-11"
+      }
+    },
+    {
+      "leading": true,
+      "compact": true,
+      "side": "left" as typeof side[number],
+      "class": {
+        "actions": "left-6.5"
+      }
+    },
+    {
+      "variant": [
+        "solid" as typeof variant[number],
+        "outline" as typeof variant[number],
+        "soft" as typeof variant[number],
+        "subtle" as typeof variant[number]
+      ],
+      "compact": false,
+      "class": {
+        "content": "px-4 py-3 rounded-lg min-h-12",
+        "leading": "mt-2"
+      }
+    },
+    {
+      "variant": [
+        "solid" as typeof variant[number],
+        "outline" as typeof variant[number],
+        "soft" as typeof variant[number],
+        "subtle" as typeof variant[number]
+      ],
+      "compact": true,
+      "class": {
+        "content": "px-2 py-1 rounded-lg min-h-8",
+        "leading": "mt-1"
+      }
+    },
+    {
+      "variant": "naked" as typeof variant[number],
+      "side": "left" as typeof side[number],
+      "class": {
+        "content": "w-full"
+      }
+    }
+  ],
+  "defaultVariants": {
+    "variant": "naked" as typeof variant[number]
+  }
+}

package/.nuxt/ui/chat-messages.ts

@@ -0,0 +1,14 @@
+export default {
+  "slots": {
+    "root": "w-full flex flex-col gap-1 flex-1 px-2.5 [&>article]:last-of-type:min-h-(--last-message-height)",
+    "indicator": "h-6 flex items-center gap-1 py-3 *:size-2 *:rounded-full *:bg-elevated [&>*:nth-child(1)]:animate-[bounce_1s_infinite] [&>*:nth-child(2)]:animate-[bounce_1s_0.15s_infinite] [&>*:nth-child(3)]:animate-[bounce_1s_0.3s_infinite]",
+    "viewport": "absolute inset-x-0 top-[86%] data-[state=open]:animate-[fade-in_200ms_ease-out] data-[state=closed]:animate-[fade-out_200ms_ease-in]",
+    "autoScroll": "rounded-full absolute right-1/2 translate-x-1/2 bottom-0"
+  },
+  "variants": {
+    "compact": {
+      "true": "",
+      "false": ""
+    }
+  }
+}

package/.nuxt/ui/chat-palette.ts

@@ -0,0 +1,8 @@
+export default {
+  "slots": {
+    "root": "relative flex-1 flex flex-col min-h-0 min-w-0",
+    "prompt": "px-0 rounded-t-none border-t border-default",
+    "close": "",
+    "content": "overflow-y-auto flex-1 flex flex-col py-3"
+  }
+}

package/.nuxt/ui/chat-prompt-submit.ts

@@ -0,0 +1,5 @@
+export default {
+  "slots": {
+    "base": ""
+  }
+}

package/.nuxt/ui/chat-prompt.ts

@@ -0,0 +1,35 @@
+const variant = [
+  "outline",
+  "soft",
+  "subtle",
+  "naked"
+] as const
+
+export default {
+  "slots": {
+    "root": "relative flex flex-col items-stretch gap-2 px-2.5 py-2 w-full rounded-lg backdrop-blur",
+    "header": "flex items-center gap-1.5",
+    "body": "items-start",
+    "footer": "flex items-center justify-between gap-1.5",
+    "base": "text-base/5"
+  },
+  "variants": {
+    "variant": {
+      "outline": {
+        "root": "bg-default/75 ring ring-default"
+      },
+      "soft": {
+        "root": "bg-elevated/50"
+      },
+      "subtle": {
+        "root": "bg-elevated/50 ring ring-default"
+      },
+      "naked": {
+        "root": ""
+      }
+    }
+  },
+  "defaultVariants": {
+    "variant": "outline" as typeof variant[number]
+  }
+}