diff --git a/apps/www/src/lib/registry/default/ui/tags-input/TagsInputItem.vue b/apps/www/src/lib/registry/default/ui/tags-input/TagsInputItem.vue
index ce83db3a..23fae205 100644
--- a/apps/www/src/lib/registry/default/ui/tags-input/TagsInputItem.vue
+++ b/apps/www/src/lib/registry/default/ui/tags-input/TagsInputItem.vue
@@ -16,7 +16,7 @@ const forwardedProps = useForwardProps(delegatedProps)
 </script>
 
 <template>
-  <TagsInputItem v-bind="forwardedProps" :class="cn('flex h-6 items-center rounded-md bg-secondary', props.class)">
+  <TagsInputItem v-bind="forwardedProps" :class="cn('flex h-6 items-center rounded bg-secondary data-[state=active]:ring-ring data-[state=active]:ring-2 data-[state=active]:ring-offset-2 ring-offset-background', props.class)">
     <slot />
   </TagsInputItem>
 </template>
diff --git a/apps/www/src/lib/registry/new-york/ui/tags-input/TagsInputItem.vue b/apps/www/src/lib/registry/new-york/ui/tags-input/TagsInputItem.vue
index 690fe5e9..c3cc8d40 100644
--- a/apps/www/src/lib/registry/new-york/ui/tags-input/TagsInputItem.vue
+++ b/apps/www/src/lib/registry/new-york/ui/tags-input/TagsInputItem.vue
@@ -16,7 +16,7 @@ const forwardedProps = useForwardProps(delegatedProps)
 </script>
 
 <template>
-  <TagsInputItem v-bind="forwardedProps" :class="cn('flex h-5 items-center rounded-md bg-secondary', props.class)">
+  <TagsInputItem v-bind="forwardedProps" :class="cn('flex h-5 items-center rounded-md bg-secondary data-[state=active]:ring-ring data-[state=active]:ring-2 data-[state=active]:ring-offset-2 ring-offset-background', props.class)">
     <slot />
   </TagsInputItem>
 </template>
diff --git a/apps/www/src/public/registry/styles/default/tags-input.json b/apps/www/src/public/registry/styles/default/tags-input.json
index 91249cb7..01060323 100644
--- a/apps/www/src/public/registry/styles/default/tags-input.json
+++ b/apps/www/src/public/registry/styles/default/tags-input.json
@@ -15,7 +15,7 @@
     },
     {
       "name": "TagsInputItem.vue",
-      "content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { TagsInputItem, type TagsInputItemProps, useForwardProps } from 'radix-vue'\n\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<TagsInputItemProps & { class?: HTMLAttributes['class'] }>()\n\nconst delegatedProps = computed(() => {\n  const { class: _, ...delegated } = props\n\n  return delegated\n})\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <TagsInputItem v-bind=\"forwardedProps\" :class=\"cn('flex h-6 items-center rounded-md bg-secondary', props.class)\">\n    <slot />\n  </TagsInputItem>\n</template>\n"
+      "content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { TagsInputItem, type TagsInputItemProps, useForwardProps } from 'radix-vue'\n\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<TagsInputItemProps & { class?: HTMLAttributes['class'] }>()\n\nconst delegatedProps = computed(() => {\n  const { class: _, ...delegated } = props\n\n  return delegated\n})\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <TagsInputItem v-bind=\"forwardedProps\" :class=\"cn('flex h-6 items-center rounded bg-secondary data-[state=active]:ring-ring data-[state=active]:ring-2 data-[state=active]:ring-offset-2 ring-offset-background', props.class)\">\n    <slot />\n  </TagsInputItem>\n</template>\n"
     },
     {
       "name": "TagsInputItemDelete.vue",
diff --git a/apps/www/src/public/registry/styles/new-york/tags-input.json b/apps/www/src/public/registry/styles/new-york/tags-input.json
index 2417c717..3eaa3f7e 100644
--- a/apps/www/src/public/registry/styles/new-york/tags-input.json
+++ b/apps/www/src/public/registry/styles/new-york/tags-input.json
@@ -15,7 +15,7 @@
     },
     {
       "name": "TagsInputItem.vue",
-      "content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { TagsInputItem, type TagsInputItemProps, useForwardProps } from 'radix-vue'\n\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<TagsInputItemProps & { class?: HTMLAttributes['class'] }>()\n\nconst delegatedProps = computed(() => {\n  const { class: _, ...delegated } = props\n\n  return delegated\n})\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <TagsInputItem v-bind=\"forwardedProps\" :class=\"cn('flex h-5 items-center rounded-md bg-secondary', props.class)\">\n    <slot />\n  </TagsInputItem>\n</template>\n"
+      "content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { TagsInputItem, type TagsInputItemProps, useForwardProps } from 'radix-vue'\n\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<TagsInputItemProps & { class?: HTMLAttributes['class'] }>()\n\nconst delegatedProps = computed(() => {\n  const { class: _, ...delegated } = props\n\n  return delegated\n})\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <TagsInputItem v-bind=\"forwardedProps\" :class=\"cn('flex h-5 items-center rounded-md bg-secondary data-[state=active]:ring-ring data-[state=active]:ring-2 data-[state=active]:ring-offset-2 ring-offset-background', props.class)\">\n    <slot />\n  </TagsInputItem>\n</template>\n"
     },
     {
       "name": "TagsInputItemDelete.vue",