@bitrix24/b24ui-nuxt 0.1.1

package/.nuxt/b24ui/button.ts

@@ -0,0 +1,342 @@
+const buttonGroup = [
+  "horizontal",
+  "vertical"
+] as const
+
+const color = [
+  "default",
+  "danger",
+  "success",
+  "warning",
+  "primary",
+  "secondary",
+  "collab",
+  "ai",
+  "link"
+] as const
+
+const depth = [
+  "light",
+  "normal",
+  "dark"
+] as const
+
+const size = [
+  "xs",
+  "sm",
+  "md",
+  "lg"
+] as const
+
+export default {
+  "slots": {
+    "base": [
+      "select-none cursor-pointer inline-flex items-center",
+      "relative focus:outline-hidden",
+      "disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-50 aria-disabled:opacity-50",
+      "transition duration-150 ease-linear"
+    ],
+    "baseLine": [
+      "inline-flex items-center"
+    ],
+    "label": "truncate",
+    "leadingIcon": "shrink-0",
+    "leadingAvatar": "shrink-0",
+    "leadingAvatarSize": "",
+    "trailingIcon": "shrink-0"
+  },
+  "variants": {
+    "buttonGroup": {
+      "horizontal": "focus-visible:outline-none ring ring-inset ring-0 focus-visible:ring-2 not-only:first:rounded-e-none not-only:last:rounded-s-none not-last:not-first:rounded-none not-only:first:border-e-0 not-only:not-first:border-s-0",
+      "vertical": "focus-visible:outline-none ring ring-inset ring-0 focus-visible:ring-2 not-only:first:rounded-b-none not-only:last:rounded-t-none not-last:not-first:rounded-none"
+    },
+    "noSplit": {
+      "false": "not-only:not-first:after:content-[''] not-only:not-first:after:absolute not-only:not-first:after:top-[7px] not-only:not-first:after:bottom-[6px] not-only:not-first:after:left-0 not-only:not-first:after:w-px not-only:not-first:after:bg-current/30"
+    },
+    "color": {
+      "default": "text-white dark:text-base-100 bg-base-650 border border-base-650 hover:bg-base-850 hover:border-base-850 hover:focus-visible:ring-0 active:bg-slate-850 active:border-slate-850 active:focus-visible:ring-0 disabled:bg-base-650 aria-disabled:bg-base-650 disabled:border-base-650 aria-disabled:border-base-650 focus-visible:outline-base-650 ring-base-850 focus-visible:ring-base-850",
+      "danger": "text-white dark:text-red-100 bg-red-720 border border-red-720 hover:bg-red-790 hover:border-red-790 hover:focus-visible:ring-0 active:bg-red-730 active:border-red-730 active:focus-visible:ring-0 disabled:bg-red-720 aria-disabled:bg-red-720 disabled:border-red-720 aria-disabled:border-red-720 focus-visible:outline-red-720 ring-red-800 focus-visible:ring-red-800",
+      "success": "text-base-900 bg-green-450 border border-green-450 hover:bg-green-370 hover:border-green-370 hover:focus-visible:ring-0 active:bg-green-430 active:border-green-430 active:focus-visible:ring-0 disabled:bg-green-450 aria-disabled:bg-green-450 disabled:border-green-450 aria-disabled:border-green-450 focus-visible:outline-green-450 ring-green-500 focus-visible:ring-green-500",
+      "warning": "text-white dark:text-orange-100 bg-orange-500 border border-orange-500 hover:bg-orange-500/75 hover:border-orange-500/75 hover:focus-visible:ring-0 active:bg-orange-500/85 active:border-orange-500/85 active:focus-visible:ring-0 disabled:bg-orange-500 aria-disabled:bg-orange-500 disabled:border-bg-orange-500 aria-disabled:border-bg-orange-500 focus-visible:outline-orange-500 ring-orange-800 focus-visible:ring-orange-800",
+      "primary": "text-white dark:text-blue-100 bg-blue-530 border border-blue-530 hover:bg-blue-450 hover:border-blue-450 hover:focus-visible:ring-0 active:bg-blue-550 active:border-blue-550 active:focus-visible:ring-0 disabled:bg-blue-530 aria-disabled:bg-blue-530 disabled:border-blue-530 aria-disabled:border-blue-530 focus-visible:outline-blue-530 ring-blue-800 focus-visible:ring-blue-800",
+      "secondary": "text-base-900 bg-cyan-160 border border-cyan-230 hover:bg-cyan-150 hover:border-cyan-230 hover:focus-visible:ring-0 active:bg-cyan-230 active:border-cyan-230 active:focus-visible:ring-0 disabled:bg-cyan-160 aria-disabled:bg-cyan-160 disabled:border-cyan-230 aria-disabled:border-cyan-230 focus-visible:outline-cyan-160 ring-cyan-500 focus-visible:ring-cyan-500",
+      "collab": "text-white dark:text-collab-100 bg-collab-600 border border-collab-600 hover:bg-collab-500 hover:border-collab-500 hover:focus-visible:ring-0 active:bg-collab-700 active:border-collab-700 active:focus-visible:ring-0 disabled:bg-collab-600 aria-disabled:bg-collab-600 disabled:border-collab-600 aria-disabled:border-collab-600 focus-visible:outline-collab-600 ring-collab-900 focus-visible:ring-collab-900",
+      "ai": "text-white dark:text-ai-100 bg-ai-450 border border-ai-450 hover:bg-ai-370 hover:border-ai-370 hover:focus-visible:ring-0 active:bg-ai-550 active:border-ai-550 active:focus-visible:ring-0 disabled:bg-ai-450 aria-disabled:bg-ai-450 disabled:border-ai-450 aria-disabled:border-ai-450 focus-visible:outline-ai-450 ring-ai-900 focus-visible:ring-ai-900",
+      "link": "no-underline decoration-solid decoration-auto text-base-900 decoration-gray-900 bg-transparent border border-transparent dark:text-base-300 hover:text-base-750 dark:hover:text-base-400 hover:focus-visible:ring-0 active:text-base-900 dark:active:text-base-700 active:focus-visible:ring-0 disabled:text-base-900 aria-disabled:text-base-900 dark:disabled:text-base-300 dark:aria-disabled:disabled:text-base-300 focus-visible:outline-base-400 ring-base-850 focus-visible:ring-base-850"
+    },
+    "depth": {
+      "light": "",
+      "normal": "",
+      "dark": ""
+    },
+    "size": {
+      "xs": {
+        "base": "h-xl2 ps-4 pe-4 text-3xs leading-none",
+        "baseLine": "gap-1",
+        "leadingIcon": "size-5",
+        "leadingAvatarSize": "2xs",
+        "trailingIcon": "size-md2"
+      },
+      "sm": {
+        "base": "h-3xl ps-[18px] pe-[18px] text-xs leading-none",
+        "baseLine": "gap-1.5",
+        "leadingIcon": "size-6",
+        "leadingAvatarSize": "xs",
+        "trailingIcon": "size-lg"
+      },
+      "md": {
+        "base": "h-5xl ps-5 pe-5 text-xs leading-none",
+        "baseLine": "gap-1.5",
+        "leadingIcon": "size-xl2",
+        "leadingAvatarSize": "sm",
+        "trailingIcon": "size-lg"
+      },
+      "lg": {
+        "base": "h-6xl ps-[28px] pe-[28px] text-xs leading-none",
+        "baseLine": "gap-2",
+        "leadingIcon": "size-xl2",
+        "leadingAvatarSize": "md",
+        "trailingIcon": "size-lg"
+      }
+    },
+    "block": {
+      "true": {
+        "base": "w-full",
+        "baseLine": "w-full justify-center",
+        "trailingIcon": "ms-auto"
+      }
+    },
+    "rounded": {
+      "true": "rounded-full",
+      "false": "rounded-2xs"
+    },
+    "leading": {
+      "true": ""
+    },
+    "useLabel": {
+      "true": "",
+      "false": "ps-1.5 pe-1.5 justify-center"
+    },
+    "useDropdown": {
+      "true": "ps-2 pe-2"
+    },
+    "useWait": {
+      "true": ""
+    },
+    "useClock": {
+      "true": ""
+    },
+    "loading": {
+      "true": ""
+    },
+    "normalCase": {
+      "true": "font-semibold normal-case",
+      "false": "font-bold uppercase"
+    }
+  },
+  "compoundVariants": [
+    {
+      "color": "default" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-base-800 dark:text-base-800 bg-base-200 border border-base-300 hover:bg-base-320 hover:border-base-320 hover:focus-visible:ring-0 active:bg-base-250 active:border-base-250 active:focus-visible:ring-0 disabled:bg-base-200 aria-disabled:bg-base-200 disabled:border-base-300 aria-disabled:border-base-300 focus-visible:outline-base-200"
+    },
+    {
+      "color": "default" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-white dark:text-base-100 bg-base-900 border border-base-900 hover:bg-base-900/75 hover:border-base-900/75 hover:focus-visible:ring-0 active:bg-base-900/85 active:border-base-900/85 active:focus-visible:ring-0 disabled:bg-base-900 aria-disabled:bg-base-900 disabled:border-base-900 aria-disabled:border-base-900 focus-visible:outline-base-900 ring-base-700 focus-visible:ring-base-700"
+    },
+    {
+      "color": "danger" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-red-750 dark:text-red-760 bg-red-270 border border-red-270 hover:bg-red-250 hover:border-red-250 dark:hover:bg-red-200 dark:hover:border-red-200 hover:focus-visible:ring-0 active:bg-red-350 active:border-red-350 dark:active:bg-red-350 dark:active:border-red-350 active:focus-visible:ring-0 disabled:bg-red-270 aria-disabled:bg-red-270 disabled:border-red-270 aria-disabled:border-red-270 dark:disabled:bg-red-270 dark:aria-disabled:bg-red-270 dark:disabled:border-red-270 dark:aria-disabled:border-red-270 focus-visible:outline-red-270"
+    },
+    {
+      "color": "danger" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-white dark:text-red-100 bg-red-850 border border-red-850 hover:bg-red-760 hover:border-red-760 hover:focus-visible:ring-0 active:bg-red-930 active:border-red-930 active:focus-visible:ring-0 disabled:bg-red-850 aria-disabled:bg-red-850 disabled:border-red-850 aria-disabled:border-red-850 focus-visible:outline-red-850 ring-red-950 focus-visible:ring-red-950"
+    },
+    {
+      "color": "success" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-green-780 bg-green-280 border border-green-280 hover:bg-green-270 hover:border-green-270 hover:focus-visible:ring-0 dark:hover:bg-green-200 dark:hover:border-green-200 active:bg-green-330 active:border-green-270 active:focus-visible:ring-0 dark:active:bg-green-330 dark:active:border-green-270 disabled:bg-green-280 aria-disabled:bg-green-280 disabled:border-green-280 aria-disabled:border-green-280 dark:disabled:bg-green-280 dark:aria-disabled:bg-green-280 dark:disabled:border-green-280 dark:aria-disabled:border-green-280 focus-visible:outline-green-280"
+    },
+    {
+      "color": "success" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-white dark:text-green-100 bg-green-730 border border-green-730 hover:bg-green-570 hover:border-green-570 hover:focus-visible:ring-0 active:bg-green-570 active:border-green-570 active:focus-visible:ring-0 disabled:bg-green-730 aria-disabled:bg-green-730 disabled:border-green-730 aria-disabled:border-green-730 focus-visible:outline-green-730 ring-green-900 focus-visible:ring-green-900"
+    },
+    {
+      "color": "warning" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-orange-750 dark:text-orange-750 bg-orange-350/80 border border-orange-350/80 dark:bg-orange-230 dark:border-orange-230 hover:bg-orange-500/65 hover:border-orange-500/65 dark:hover:bg-orange-400 dark:hover:border-orange-400 hover:focus-visible:ring-0 active:bg-orange-550 active:border-orange-550 dark:active:bg-orange-600 dark:active:border-orange-600 active:focus-visible:ring-0 disabled:bg-orange-230 aria-disabled:bg-orange-230 disabled:border-orange-230 aria-disabled:border-orange-230 dark:disabled:bg-orange-230 dark:aria-disabled:bg-orange-230 dark:disabled:border-orange-230 dark:aria-disabled:border-orange-230 focus-visible:outline-orange-230"
+    },
+    {
+      "color": "warning" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-white dark:text-orange-100 bg-orange-700 border border-orange-700 hover:bg-orange-700/75 hover:border-orange-700/75 hover:focus-visible:ring-0 active:bg-orange-700/85 active:border-orange-700/85 active:focus-visible:ring-0 disabled:bg-orange-700 aria-disabled:bg-orange-700 disabled:border-orange-700 aria-disabled:border-orange-700 focus-visible:outline-orange-700"
+    },
+    {
+      "color": "primary" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-blue-800 dark:text-blue-800 bg-blue-300 border border-blue-400 hover:bg-blue-300/75 hover:border-blue-300/75 hover:focus-visible:ring-0 active:bg-blue-300/85 active:border-blue-300/85 active:focus-visible:ring-0 disabled:bg-blue-300 aria-disabled:bg-blue-300 disabled:border-blue-300 aria-disabled:border-blue-300 focus-visible:outline-blue-300"
+    },
+    {
+      "color": "primary" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-white dark:text-blue-100 bg-blue-650 border border-blue-650 hover:bg-blue-630 hover:border-blue-630 hover:focus-visible:ring-0 active:bg-blue-750 active:border-blue-750 active:focus-visible:ring-0 disabled:bg-blue-650 aria-disabled:bg-blue-650 disabled:border-blue-650 aria-disabled:border-blue-650 focus-visible:outline-blue-650"
+    },
+    {
+      "color": "secondary" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-blue-620 dark:text-blue-850 bg-blue-310 border border-blue-310 hover:bg-cyan-150 hover:border-cyan-150 hover:focus-visible:ring-0 active:bg-cyan-230 active:border-cyan-230 active:focus-visible:ring-0 disabled:bg-blue-310 aria-disabled:bg-blue-310 disabled:border-blue-310 aria-disabled:border-blue-310 focus-visible:outline-blue-310"
+    },
+    {
+      "color": "secondary" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-base-900 bg-cyan-350 border-cyan-500 hover:bg-cyan-350/75 hover:focus-visible:ring-0 active:bg-cyan-350/85 active:focus-visible:ring-0 disabled:bg-cyan-350 aria-disabled:bg-cyan-350 focus-visible:outline-cyan-350 ring-cyan-900 focus-visible:ring-cyan-900"
+    },
+    {
+      "color": "collab" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-collab-900 dark:text-collab-900 bg-collab-300 border border-collab-400 hover:bg-collab-300/75 hover:border-collab-300/75 hover:focus-visible:ring-0 active:bg-collab-300/85 active:border-collab-300/85 active:focus-visible:ring-0 disabled:bg-collab-300 aria-disabled:bg-collab-300 disabled:border-collab-300 aria-disabled:border-collab-300 focus-visible:outline-collab-300"
+    },
+    {
+      "color": "collab" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-white dark:text-collab-100 bg-collab-700 border border-collab-700 hover:bg-collab-700/75 hover:border-collab-700/75 hover:focus-visible:ring-0 active:bg-collab-700/85 active:border-collab-700/85 active:focus-visible:ring-0 disabled:bg-collab-700 aria-disabled:bg-collab-700 disabled:border-collab-700 aria-disabled:border-collab-700 focus-visible:outline-collab-700"
+    },
+    {
+      "color": "ai" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-ai-900 dark:text-ai-900 bg-ai-300 border border-ai-400 hover:bg-ai-300/75 hover:border-ai-300/75 hover:focus-visible:ring-0 active:bg-ai-300/85 active:border-ai-300/85 active:focus-visible:ring-0 disabled:bg-ai-300 aria-disabled:bg-ai-300 disabled:border-ai-300 aria-disabled:border-ai-300 focus-visible:outline-ai-300"
+    },
+    {
+      "color": "ai" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": "text-white dark:text-ai-100 bg-ai-550 border border-ai-550 hover:bg-ai-550/75 hover:border-ai-550/75 hover:focus-visible:ring-0 active:bg-ai-550/85 active:border-ai-550/85 active:focus-visible:ring-0 disabled:bg-ai-550 aria-disabled:bg-ai-550 disabled:border-ai-550 aria-disabled:border-ai-550 focus-visible:outline-ai-550 ring-ai-900 focus-visible:ring-ai-900"
+    },
+    {
+      "color": "link" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "class": "text-base-900 dark:text-base-300 bg-transparent border border-transparent hover:text-base-master dark:hover:text-base-100 hover:bg-base-30 dark:hover:bg-base-850 hover:focus-visible:ring-0 active:text-base-ebony active:bg-blue-270 dark:active:text-base-100 dark:active:bg-slate-850 active:focus-visible:ring-0 disabled:text-base-master disabled:bg-base-30 aria-disabled:bg-base-30 dark:disabled:text-base-100 dark:aria-disabled:text-base-100 dark:disabled:bg-base-850 dark:aria-disabled:bg-base-850 focus-visible:outline-base-30 dark:focus-visible:outline-base-850"
+    },
+    {
+      "color": "link" as typeof color[number],
+      "depth": "light" as typeof depth[number],
+      "useLabel": true,
+      "class": "ps-1.5 pe-1.5"
+    },
+    {
+      "color": "link" as typeof color[number],
+      "depth": "dark" as typeof depth[number],
+      "class": " border text-base-900 bg-transparent border-base-330 dark:text-base-300 dark:border-base-800 hover:text-base-900 dark:hover:text-base-900 hover:bg-base-320 hover:border-base-330 hover:focus-visible:ring-0 active:text-base-900 dark:active:text-base-900 active:bg-base-250 active:border-base-550 active:focus-visible:ring-0 disabled:bg-transparent disabled:border-base-330 aria-disabled:bg-transparent aria-disabled:border-base-330 dark:disabled:text-base-900 dark:aria-disabled:text-base-900 dark:disabled:border-base-900 dark:aria-disabled:border-base-900 focus-visible:outline-base-330"
+    },
+    {
+      "size": "xs" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": false,
+      "class": "ps-1.5 pe-4"
+    },
+    {
+      "size": "sm" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": false,
+      "class": "ps-2.5 pe-[18px]"
+    },
+    {
+      "size": "md" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": false,
+      "class": "ps-3.5 pe-5"
+    },
+    {
+      "size": "lg" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": false,
+      "class": "ps-4 pe-[28px]"
+    },
+    {
+      "size": "xs" as typeof size[number],
+      "leading": false,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-4 pe-1.5"
+    },
+    {
+      "size": "sm" as typeof size[number],
+      "leading": false,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-[18px] pe-1.5"
+    },
+    {
+      "size": "md" as typeof size[number],
+      "leading": false,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-5 pe-2.5"
+    },
+    {
+      "size": "lg" as typeof size[number],
+      "leading": false,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-[28px] pe-3.5"
+    },
+    {
+      "size": "xs" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-1.5 pe-1.5"
+    },
+    {
+      "size": "sm" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-2.5 pe-1.5"
+    },
+    {
+      "size": "md" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-3.5 pe-2.5"
+    },
+    {
+      "size": "lg" as typeof size[number],
+      "leading": true,
+      "useLabel": true,
+      "useDropdown": true,
+      "class": "ps-4 pe-3.5"
+    },
+    {
+      "normalCase": true,
+      "size": "xs" as typeof size[number],
+      "class": "text-xs"
+    },
+    {
+      "normalCase": true,
+      "size": "sm" as typeof size[number],
+      "class": "text-sm"
+    },
+    {
+      "normalCase": true,
+      "size": [
+        "md" as typeof size[number],
+        "lg" as typeof size[number]
+      ],
+      "class": "text-md"
+    }
+  ],
+  "defaultVariants": {
+    "size": "md" as typeof size[number],
+    "color": "default" as typeof color[number],
+    "depth": "normal" as typeof depth[number]
+  }
+}

package/.nuxt/b24ui/checkbox.ts

@@ -0,0 +1,128 @@
+const color = [
+  "default",
+  "danger",
+  "success",
+  "warning",
+  "primary",
+  "secondary",
+  "collab",
+  "ai"
+] as const
+
+const size = [
+  "xs",
+  "sm",
+  "md",
+  "lg"
+] as const
+
+export default {
+  "slots": {
+    "root": "relative flex items-start",
+    "base": "cursor-pointer shrink-0 flex items-center justify-center rounded-2xs text-white dark:text-base-150 ring ring-inset ring-base-300 dark:ring-base-700 focus-visible:outline-2 focus-visible:outline-offset-2",
+    "container": "flex items-center",
+    "wrapper": "font-b24-primary ms-2",
+    "icon": "shrink-0 size-full",
+    "label": "cursor-pointer block font-regular text-base-master dark:text-base-400",
+    "description": "text-base-500 dark:text-base-600"
+  },
+  "variants": {
+    "color": {
+      "default": "focus-visible:outline-base-900 dark:focus-visible:outline-base-350",
+      "danger": "focus-visible:outline-red-500 dark:focus-visible:outline-red-600",
+      "success": "focus-visible:outline-green-500 dark:focus-visible:outline-green-600",
+      "warning": "focus-visible:outline-orange-500 dark:focus-visible:outline-orange-600",
+      "primary": "focus-visible:outline-blue-500 dark:focus-visible:outline-blue-600",
+      "secondary": "focus-visible:outline-cyan-350 dark:focus-visible:outline-cyan-500",
+      "collab": "focus-visible:outline-collab-500 dark:focus-visible:outline-collab-600",
+      "ai": "focus-visible:outline-ai-500 dark:focus-visible:outline-ai-600"
+    },
+    "size": {
+      "xs": {
+        "base": "size-3",
+        "container": "h-4",
+        "wrapper": "text-xs",
+        "label": "leading-4"
+      },
+      "sm": {
+        "base": "size-3.5",
+        "container": "h-4",
+        "wrapper": "text-sm",
+        "label": "leading-4"
+      },
+      "md": {
+        "base": "size-4",
+        "container": "h-5",
+        "wrapper": "text-md",
+        "label": "leading-5"
+      },
+      "lg": {
+        "base": "size-5",
+        "container": "h-5",
+        "wrapper": "text-xl",
+        "label": "leading-5"
+      }
+    },
+    "required": {
+      "true": {
+        "label": "after:content-['*'] after:ms-0.5 after:text-red-500 dark:after:text-red-600"
+      }
+    },
+    "disabled": {
+      "true": {
+        "base": "cursor-not-allowed opacity-75",
+        "label": "cursor-not-allowed opacity-75",
+        "description": "cursor-not-allowed opacity-75"
+      }
+    },
+    "checked": {
+      "true": ""
+    }
+  },
+  "compoundVariants": [
+    {
+      "color": "default" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-base-900 bg-base-900 dark:ring-base-350 dark:bg-base-350 dark:text-base-800"
+    },
+    {
+      "color": "danger" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-red-500 bg-red-500 dark:ring-red-600 dark:bg-red-600 dark:text-red-250"
+    },
+    {
+      "color": "success" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-green-500 bg-green-500 dark:ring-green-600 dark:bg-green-600 dark:text-green-250"
+    },
+    {
+      "color": "warning" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-orange-500 bg-orange-500 dark:ring-orange-600 dark:bg-orange-600 dark:text-orange-250"
+    },
+    {
+      "color": "primary" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-blue-500 bg-blue-500 dark:ring-blue-600 dark:bg-blue-600 dark:text-blue-250"
+    },
+    {
+      "color": "secondary" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-cyan-350 bg-cyan-350 dark:ring-cyan-500 dark:bg-cyan-500"
+    },
+    {
+      "color": "collab" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-collab-500 bg-collab-500 dark:ring-collab-600 dark:bg-collab-600 dark:text-collab-250"
+    },
+    {
+      "color": "ai" as typeof color[number],
+      "checked": true,
+      "class": "ring-2 ring-ai-500 bg-ai-500 dark:ring-ai-600 dark:bg-ai-600 dark:text-ai-250"
+    }
+  ],
+  "defaultVariants": {
+    "size": "md" as typeof size[number],
+    "color": "primary" as typeof color[number]
+  }
+}

package/.nuxt/b24ui/chip.ts

@@ -0,0 +1,205 @@
+const color = [
+  "default",
+  "danger",
+  "success",
+  "warning",
+  "primary",
+  "secondary",
+  "collab",
+  "ai",
+  "link"
+] as const
+
+const size = [
+  "3xs",
+  "2xs",
+  "xs",
+  "sm",
+  "md",
+  "lg",
+  "xl",
+  "2xl",
+  "3xl"
+] as const
+
+const position = [
+  "top-right",
+  "bottom-right",
+  "top-left",
+  "bottom-left"
+] as const
+
+export default {
+  "slots": {
+    "root": "relative inline-flex items-center justify-center shrink-0",
+    "base": "select-none rounded-sm flex items-center justify-center p-1 text-white leading-none font-semibold font-b24-secondary whitespace-nowrap"
+  },
+  "variants": {
+    "color": {
+      "default": "bg-base-500 dark:bg-base-900 dark:text-base-150",
+      "danger": "bg-red-500 dark:bg-red-600 dark:text-red-250",
+      "success": "bg-green-500 dark:bg-green-600 dark:text-green-250",
+      "warning": "bg-orange-500 dark:bg-orange-600 dark:text-orange-250",
+      "primary": "bg-blue-500 dark:bg-blue-600 dark:text-blue-250",
+      "secondary": "bg-cyan-350 dark:bg-cyan-500",
+      "collab": "bg-collab-500 dark:bg-collab-800 dark:text-collab-250",
+      "ai": "bg-ai-500 dark:bg-ai-800 dark:text-ai-250",
+      "link": "bg-base-900/85 text-white dark:bg-white/85 dark:text-base-900"
+    },
+    "size": {
+      "3xs": "h-1 min-w-1 text-[0px] text-transparent p-0",
+      "2xs": "h-1.5 min-w-1.5 text-[0px] text-transparent p-0",
+      "xs": "h-xs2 min-w-xs2 text-[0px] text-transparent  p-0",
+      "sm": "h-sm min-w-sm text-4xs font-regular",
+      "md": "h-md min-w-md text-3xs",
+      "lg": "h-lg min-w-lg rounded-md text-xs",
+      "xl": "h-lg min-w-lg rounded-md text-xs",
+      "2xl": "h-lg min-w-lg rounded-md text-xs",
+      "3xl": "h-lg min-w-lg rounded-md text-xs"
+    },
+    "position": {
+      "top-right": "top-0 right-0",
+      "bottom-right": "bottom-0 right-0",
+      "top-left": "top-0 left-0",
+      "bottom-left": "bottom-0 left-0"
+    },
+    "inset": {
+      "false": ""
+    },
+    "standalone": {
+      "true": "",
+      "false": "ring ring-white dark:ring-base-700 absolute"
+    }
+  },
+  "compoundVariants": [
+    {
+      "position": "top-right" as typeof position[number],
+      "inset": false,
+      "standalone": false,
+      "class": "-translate-y-1/2 translate-x-1/2 transform"
+    },
+    {
+      "position": "bottom-right" as typeof position[number],
+      "inset": false,
+      "standalone": false,
+      "class": "translate-y-1/2 translate-x-1/2 transform"
+    },
+    {
+      "position": "top-left" as typeof position[number],
+      "inset": false,
+      "standalone": false,
+      "class": "-translate-y-1/2 -translate-x-1/2 transform"
+    },
+    {
+      "position": "bottom-left" as typeof position[number],
+      "inset": false,
+      "standalone": false,
+      "class": "translate-y-1/2 -translate-x-1/2 transform"
+    },
+    {
+      "position": "top-right" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "xs" as typeof size[number],
+        "sm" as typeof size[number],
+        "md" as typeof size[number],
+        "lg" as typeof size[number],
+        "xl" as typeof size[number],
+        "2xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "-translate-y-1/3 translate-x-1/3 transform"
+    },
+    {
+      "position": "top-right" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "3xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "translate-y-0 translate-x-0 transform"
+    },
+    {
+      "position": "bottom-right" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "xs" as typeof size[number],
+        "sm" as typeof size[number],
+        "md" as typeof size[number],
+        "lg" as typeof size[number],
+        "xl" as typeof size[number],
+        "2xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "translate-y-1/3 translate-x-1/3 transform"
+    },
+    {
+      "position": "bottom-right" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "3xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "translate-y-0 translate-x-0 transform"
+    },
+    {
+      "position": "top-left" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "xs" as typeof size[number],
+        "sm" as typeof size[number],
+        "md" as typeof size[number],
+        "lg" as typeof size[number],
+        "xl" as typeof size[number],
+        "2xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "-translate-y-1/3 -translate-x-1/3 transform"
+    },
+    {
+      "position": "top-left" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "3xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "-translate-y-0 -translate-x-0 transform"
+    },
+    {
+      "position": "bottom-left" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "xs" as typeof size[number],
+        "sm" as typeof size[number],
+        "md" as typeof size[number],
+        "lg" as typeof size[number],
+        "xl" as typeof size[number],
+        "2xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "translate-y-1/3 -translate-x-1/3 transform"
+    },
+    {
+      "position": "bottom-left" as typeof position[number],
+      "size": [
+        "2xs" as typeof size[number],
+        "3xl" as typeof size[number]
+      ],
+      "inset": true,
+      "standalone": false,
+      "class": "translate-y-0 -translate-x-0 transform"
+    }
+  ],
+  "defaultVariants": {
+    "size": "sm" as typeof size[number],
+    "color": "danger" as typeof color[number],
+    "position": "top-right" as typeof position[number]
+  }
+}