Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance.
Project price only 1 $
You can buy this project and download/modify it how often you want.
package.lib.components.VChip.VChip.mjs.map Maven / Gradle / Ivy
{"version":3,"file":"VChip.mjs","names":["VExpandXTransition","VAvatar","VChipGroupSymbol","VDefaultsProvider","VIcon","makeBorderProps","useBorder","makeComponentProps","makeDensityProps","useDensity","makeElevationProps","useElevation","makeGroupItemProps","useGroupItem","IconValue","useLocale","useProxiedModel","makeRoundedProps","useRounded","makeRouterProps","useLink","makeSizeProps","useSize","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","Ripple","computed","EventProp","genericComponent","propsFactory","makeVChipProps","activeClass","String","appendAvatar","appendIcon","closable","Boolean","closeIcon","type","default","closeLabel","draggable","filter","filterIcon","label","link","undefined","pill","prependAvatar","prependIcon","ripple","Object","text","modelValue","onClick","onClickOnce","tag","variant","VChip","name","directives","props","emits","e","value","val","click","setup","_ref","attrs","emit","slots","t","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","elevationClasses","roundedClasses","sizeClasses","themeClasses","isActive","group","isLink","isClickable","disabled","closeProps","preventDefault","stopPropagation","navigate","toggle","onKeyDown","key","Tag","hasAppendMedia","hasAppend","append","hasClose","close","hasFilter","hasPrependMedia","hasPrepend","prepend","hasColor","isSelected","_withDirectives","_createVNode","selectedClass","class","style","href","icon","_vShow","_Fragment","image","start","select","end","_mergeProps","size","_resolveDirective"],"sources":["../../../src/components/VChip/VChip.tsx"],"sourcesContent":["/* eslint-disable complexity */\n// Styles\nimport './VChip.sass'\n\n// Components\nimport { VExpandXTransition } from '@/components/transitions'\nimport { VAvatar } from '@/components/VAvatar'\nimport { VChipGroupSymbol } from '@/components/VChipGroup/VChipGroup'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupItemProps, useGroupItem } from '@/composables/group'\nimport { IconValue } from '@/composables/icons'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { makeSizeProps, useSize } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { computed } from 'vue'\nimport { EventProp, genericComponent, propsFactory } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { RippleDirectiveBinding } from '@/directives/ripple'\n\nexport type VChipSlots = {\n default: {\n isSelected: boolean | undefined\n selectedClass: boolean | (string | undefined)[] | undefined\n select: ((value: boolean) => void) | undefined\n toggle: (() => void) | undefined\n value: unknown\n disabled: boolean\n }\n label: never\n prepend: never\n append: never\n close: never\n filter: never\n}\n\nexport const makeVChipProps = propsFactory({\n activeClass: String,\n appendAvatar: String,\n appendIcon: IconValue,\n closable: Boolean,\n closeIcon: {\n type: IconValue,\n default: '$delete',\n },\n closeLabel: {\n type: String,\n default: '$vuetify.close',\n },\n draggable: Boolean,\n filter: Boolean,\n filterIcon: {\n type: String,\n default: '$complete',\n },\n label: Boolean,\n link: {\n type: Boolean,\n default: undefined,\n },\n pill: Boolean,\n prependAvatar: String,\n prependIcon: IconValue,\n ripple: {\n type: [Boolean, Object] as PropType,\n default: true,\n },\n text: String,\n modelValue: {\n type: Boolean,\n default: true,\n },\n\n onClick: EventProp<[MouseEvent]>(),\n onClickOnce: EventProp<[MouseEvent]>(),\n\n ...makeBorderProps(),\n ...makeComponentProps(),\n ...makeDensityProps(),\n ...makeElevationProps(),\n ...makeGroupItemProps(),\n ...makeRoundedProps(),\n ...makeRouterProps(),\n ...makeSizeProps(),\n ...makeTagProps({ tag: 'span' }),\n ...makeThemeProps(),\n ...makeVariantProps({ variant: 'tonal' } as const),\n}, 'VChip')\n\nexport const VChip = genericComponent()({\n name: 'VChip',\n\n directives: { Ripple },\n\n props: makeVChipProps(),\n\n emits: {\n 'click:close': (e: MouseEvent) => true,\n 'update:modelValue': (value: boolean) => true,\n 'group:selected': (val: { value: boolean }) => true,\n click: (e: MouseEvent | KeyboardEvent) => true,\n },\n\n setup (props, { attrs, emit, slots }) {\n const { t } = useLocale()\n const { borderClasses } = useBorder(props)\n const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n const { densityClasses } = useDensity(props)\n const { elevationClasses } = useElevation(props)\n const { roundedClasses } = useRounded(props)\n const { sizeClasses } = useSize(props)\n const { themeClasses } = provideTheme(props)\n\n const isActive = useProxiedModel(props, 'modelValue')\n const group = useGroupItem(props, VChipGroupSymbol, false)\n const link = useLink(props, attrs)\n const isLink = computed(() => props.link !== false && link.isLink.value)\n const isClickable = computed(() =>\n !props.disabled &&\n props.link !== false &&\n (!!group || props.link || link.isClickable.value)\n )\n const closeProps = computed(() => ({\n 'aria-label': t(props.closeLabel),\n onClick (e: MouseEvent) {\n e.preventDefault()\n e.stopPropagation()\n\n isActive.value = false\n\n emit('click:close', e)\n },\n }))\n\n function onClick (e: MouseEvent) {\n emit('click', e)\n\n if (!isClickable.value) return\n\n link.navigate?.(e)\n group?.toggle()\n }\n\n function onKeyDown (e: KeyboardEvent) {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault()\n onClick(e as any as MouseEvent)\n }\n }\n\n return () => {\n const Tag = (link.isLink.value) ? 'a' : props.tag\n const hasAppendMedia = !!(props.appendIcon || props.appendAvatar)\n const hasAppend = !!(hasAppendMedia || slots.append)\n const hasClose = !!(slots.close || props.closable)\n const hasFilter = !!(slots.filter || props.filter) && group\n const hasPrependMedia = !!(props.prependIcon || props.prependAvatar)\n const hasPrepend = !!(hasPrependMedia || slots.prepend)\n const hasColor = !group || group.isSelected.value\n\n return isActive.value && (\n \n { genOverlays(isClickable.value, 'v-chip') }\n\n { hasFilter && (\n \n \n { !slots.filter ? (\n 