{"version":3,"file":"form-item.mjs","sources":["../../../../../../packages/components/form/src/form-item.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"formItemRef\"\n    :class=\"formItemClasses\"\n    data-test-name=\"form-item\"\n    data-test-variant=\"\"\n    data-test-state=\"\"\n  >\n    <label v-if=\"label || $slots.label\" :class=\"formItemLabelClasses\">\n      <slot name=\"label\" :label=\"label\">\n        {{ label }}\n        <span v-if=\"optional\">{{ t('b.formItem.optional') }}</span>\n        <span v-if=\"required\" style=\"color: var(--b-color-red-4)\">*</span>\n      </slot>\n    </label>\n    <slot>\n      <p :class=\"ns.e('value')\">{{ value }}</p>\n    </slot>\n    <p v-if=\"error\" :class=\"ns.e('error')\">\n      <b-icon :size=\"14\">\n        <Error />\n      </b-icon>\n      <span>{{ error }}</span>\n    </p>\n    <p v-else-if=\"helpText\" :class=\"ns.e('help-text')\">\n      <b-icon :size=\"14\">\n        <Information />\n      </b-icon>\n      <span>{{ helpText }}</span>\n    </p>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, provide, reactive, ref, toRefs } from 'vue'\nimport { formItemContextKey } from '@bigin/tokens'\nimport { useLocale, useNamespace, useSize } from '@bigin/hooks'\nimport { Error, Information } from '@bigin/icons-vue'\nimport BIcon from '@bigin/components/icon'\nimport { formItemProps } from './form-item'\n\nimport type { FormItemContext } from '@bigin/tokens'\n\ndefineOptions({\n  name: 'BFormItem',\n})\nconst props = defineProps(formItemProps)\n\nconst _size = useSize(undefined, { formItem: false })\nconst ns = useNamespace('form-item')\nconst focused = ref(false)\n\nconst formItemRef = ref<HTMLDivElement>()\n\nconst { t } = useLocale()\n\nconst formItemClasses = computed(() => [\n  ns.b(),\n  ns.m(_size.value),\n  ns.is('error', !!props.error),\n  ns.is('focused', focused.value),\n  ns.is('topless', props.topless),\n])\n\nconst formItemLabelClasses = computed(() => [\n  ns.e('label'),\n  ns.is('optional', props.optional),\n  ns.is('required', props.required),\n])\n\nconst setFocused = (value: boolean) => (focused.value = value)\n\nconst context: FormItemContext = reactive({\n  ...toRefs(props),\n  $el: formItemRef,\n  size: _size,\n  setFocused,\n})\n\nprovide(formItemContextKey, context)\n\ndefineExpose({\n  /** @description form item size */\n  size: _size,\n  focused,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;mCA2Cc,CAAA;AAAA,EACZ,IAAM,EAAA,WAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAGA,IAAA,MAAM,QAAQ,OAAQ,CAAA,KAAA,CAAA,EAAW,EAAE,QAAA,EAAU,OAAO,CAAA,CAAA;AAC9C,IAAA,MAAA,EAAA,GAAK,aAAa,WAAW,CAAA,CAAA;AAC7B,IAAA,MAAA,OAAA,GAAU,IAAI,KAAK,CAAA,CAAA;AAEzB,IAAA,MAAM,cAAc,GAAoB,EAAA,CAAA;AAElC,IAAA,MAAA,EAAE,CAAE,EAAA,GAAI,SAAU,EAAA,CAAA;AAElB,IAAA,MAAA,eAAA,GAAkB,SAAS,MAAM;AAAA,MACrC,GAAG,CAAE,EAAA;AAAA,MACL,EAAA,CAAG,CAAE,CAAA,KAAA,CAAM,KAAK,CAAA;AAAA,MAChB,GAAG,EAAG,CAAA,OAAA,EAAS,CAAC,CAAC,MAAM,KAAK,CAAA;AAAA,MAC5B,EAAG,CAAA,EAAA,CAAG,SAAW,EAAA,OAAA,CAAQ,KAAK,CAAA;AAAA,MAC9B,EAAG,CAAA,EAAA,CAAG,SAAW,EAAA,KAAA,CAAM,OAAO,CAAA;AAAA,KAC/B,CAAA,CAAA;AAEK,IAAA,MAAA,oBAAA,GAAuB,SAAS,MAAM;AAAA,MAC1C,EAAA,CAAG,EAAE,OAAO,CAAA;AAAA,MACZ,EAAG,CAAA,EAAA,CAAG,UAAY,EAAA,KAAA,CAAM,QAAQ,CAAA;AAAA,MAChC,EAAG,CAAA,EAAA,CAAG,UAAY,EAAA,KAAA,CAAM,QAAQ,CAAA;AAAA,KACjC,CAAA,CAAA;AAED,IAAA,MAAM,UAAa,GAAA,CAAC,KAAoB,KAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA,CAAA;AAExD,IAAA,MAAM,UAA2B,QAAS,CAAA;AAAA,MACxC,GAAG,OAAO,KAAK,CAAA;AAAA,MACf,GAAK,EAAA,WAAA;AAAA,MACL,IAAM,EAAA,KAAA;AAAA,MACN,UAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,OAAA,CAAQ,oBAAoB,OAAO,CAAA,CAAA;AAEtB,IAAA,MAAA,CAAA;AAAA,MAEX,IAAM,EAAA,KAAA;AAAA,MACN,OAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}