reka-ui/dist/TagsInput/TagsInputItem.cjs.map

Vue port for Radix UI Primitives.

{"version":3,"file":"TagsInputItem.cjs","sources":["../../src/TagsInput/TagsInputItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useForwardExpose } from '@/shared'\nimport { type ComputedRef, type Ref, computed, toRefs } from 'vue'\nimport { type AcceptableInputValue, injectTagsInputRootContext } from './TagsInputRoot.vue'\n\nexport interface TagsInputItemProps extends PrimitiveProps {\n  /** Value associated with the tags */\n  value: AcceptableInputValue\n  /** When `true`, prevents the user from interacting with the tags input. */\n  disabled?: boolean\n}\n\nexport interface TagsInputItemContext {\n  value: Ref<AcceptableInputValue>\n  displayValue: ComputedRef<string>\n  isSelected: Ref<boolean>\n  disabled?: Ref<boolean>\n  textId: string\n}\n\nexport const [injectTagsInputItemContext, provideTagsInputItemContext]\n  = createContext<TagsInputItemContext>('TagsInputItem')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useCollection } from '@/Collection'\n\nconst props = defineProps<TagsInputItemProps>()\nconst { value } = toRefs(props)\n\nconst context = injectTagsInputRootContext()\nconst { forwardRef, currentElement } = useForwardExpose()\nconst { CollectionItem } = useCollection()\n\nconst isSelected = computed(() => context.selectedElement.value === currentElement.value)\n\nconst disabled = computed(() => props.disabled || context.disabled.value)\n\nconst itemContext = provideTagsInputItemContext({\n  value,\n  isSelected,\n  disabled,\n  textId: '',\n  displayValue: computed(() => context.displayValue(value.value)),\n})\n</script>\n\n<template>\n  <CollectionItem :value=\"value\">\n    <Primitive\n      :ref=\"forwardRef\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :aria-labelledby=\"itemContext.textId\"\n      :aria-current=\"isSelected\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :data-state=\"isSelected ? 'active' : 'inactive'\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":["createContext","toRefs","injectTagsInputRootContext","useForwardExpose","useCollection","computed"],"mappings":";;;;;;;;;AAqBO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe;;;;;;;;;;AAOvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,EAAE,KAAA,EAAU,GAAAC,UAAA,CAAO,KAAK,CAAA;AAE9B,IAAA,MAAM,UAAUC,kDAA2B,EAAA;AAC3C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AACxD,IAAM,MAAA,EAAE,cAAe,EAAA,GAAIC,mCAAc,EAAA;AAEzC,IAAA,MAAM,aAAaC,YAAS,CAAA,MAAM,QAAQ,eAAgB,CAAA,KAAA,KAAU,eAAe,KAAK,CAAA;AAExF,IAAA,MAAM,WAAWA,YAAS,CAAA,MAAM,MAAM,QAAY,IAAA,OAAA,CAAQ,SAAS,KAAK,CAAA;AAExE,IAAA,MAAM,cAAc,2BAA4B,CAAA;AAAA,MAC9C,KAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAQ,EAAA,EAAA;AAAA,MACR,cAAcA,YAAS,CAAA,MAAM,QAAQ,YAAa,CAAA,KAAA,CAAM,KAAK,CAAC;AAAA,KAC/D,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}