{"version":3,"file":"form-label-wrap.mjs","names":["Fragment","computed","defineComponent","inject","nextTick","onBeforeUnmount","onMounted","onUpdated","ref","watch","createVNode","_createVNode","_Fragment","useResizeObserver","throwError","useNamespace","formContextKey","formItemContextKey","COMPONENT_NAME","name","props","isAutoWidth","Boolean","updateAll","setup","slots","formContext","undefined","formItemContext","ns","el","computedWidth","getLabelWidth","value","firstElementChild","width","window","getComputedStyle","Math","ceil","Number","parseFloat","updateLabelWidth","action","hasLabel","deregisterLabelWidth","updateLabelWidthFn","val","oldVal","registerLabelWidth","autoLabelWidth","style","marginWidth","max","parseInt","labelPosition","marginPosition","be","default"],"sources":["../../../../../../packages/components/form/src/form-label-wrap.tsx"],"sourcesContent":["import {\n  Fragment,\n  computed,\n  defineComponent,\n  inject,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  onUpdated,\n  ref,\n  watch,\n} from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { formContextKey, formItemContextKey } from './constants'\n\nimport type { CSSProperties } from 'vue'\n\nconst COMPONENT_NAME = 'ElLabelWrap'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: {\n    isAutoWidth: Boolean,\n    updateAll: Boolean,\n  },\n\n  setup(props, { slots }) {\n    const formContext = inject(formContextKey, undefined)\n    const formItemContext = inject(formItemContextKey)\n    if (!formItemContext)\n      throwError(\n        COMPONENT_NAME,\n        'usage: <el-form-item><label-wrap /></el-form-item>'\n      )\n\n    const ns = useNamespace('form')\n\n    const el = ref<HTMLElement>()\n    const computedWidth = ref(0)\n\n    const getLabelWidth = () => {\n      if (el.value?.firstElementChild) {\n        const width = window.getComputedStyle(el.value.firstElementChild).width\n        return Math.ceil(Number.parseFloat(width))\n      } else {\n        return 0\n      }\n    }\n\n    const updateLabelWidth = (action: 'update' | 'remove' = 'update') => {\n      nextTick(() => {\n        if (formItemContext.hasLabel && props.isAutoWidth) {\n          if (action === 'update') {\n            computedWidth.value = getLabelWidth()\n          } else if (action === 'remove') {\n            formContext?.deregisterLabelWidth(computedWidth.value)\n          }\n        }\n      })\n    }\n    const updateLabelWidthFn = () => updateLabelWidth('update')\n\n    onMounted(() => {\n      updateLabelWidthFn()\n    })\n    onBeforeUnmount(() => {\n      updateLabelWidth('remove')\n    })\n    onUpdated(() => updateLabelWidthFn())\n\n    watch(computedWidth, (val, oldVal) => {\n      if (props.updateAll) {\n        formContext?.registerLabelWidth(val, oldVal)\n      }\n    })\n\n    useResizeObserver(\n      computed(\n        () => (el.value?.firstElementChild ?? null) as HTMLElement | null\n      ),\n      updateLabelWidthFn\n    )\n\n    return () => {\n      if (!slots) return null\n\n      const { isAutoWidth } = props\n      if (isAutoWidth) {\n        const autoLabelWidth = formContext?.autoLabelWidth\n        const hasLabel = formItemContext?.hasLabel\n        const style: CSSProperties = {}\n        if (hasLabel && autoLabelWidth && autoLabelWidth !== 'auto') {\n          const marginWidth = Math.max(\n            0,\n            Number.parseInt(autoLabelWidth, 10) - computedWidth.value\n          )\n          const labelPosition =\n            formItemContext.labelPosition || formContext.labelPosition\n\n          const marginPosition =\n            labelPosition === 'left' ? 'marginRight' : 'marginLeft'\n\n          if (marginWidth) {\n            style[marginPosition] = `${marginWidth}px`\n          }\n        }\n        return (\n          <div ref={el} class={[ns.be('item', 'label-wrap')]} style={style}>\n            {slots.default?.()}\n          </div>\n        )\n      } else {\n        return <Fragment ref={el}>{slots.default?.()}</Fragment>\n      }\n    }\n  },\n})\n"],"mappings":";;;;;;AAmBA,MAAMkB,iBAAiB;AACvB,IAAA,0BAAehB,gCAAgB;CAC7BiB,MAAMD;CACNE,OAAO;EACLC,aAAaC;EACbC,WAAWD;CACb;CAEAE,MAAMJ,OAAO,EAAEK,SAAS;EACtB,MAAMC,cAAcvB,OAAOa,gBAAgBW,KAAAA,CAAS;EACpD,MAAMC,kBAAkBzB,OAAOc,kBAAkB;EACjD,IAAI,CAACW,iBACHd,WACEI,gBACA,oDACF;EAEF,MAAMW,KAAKd,aAAa,MAAM;EAE9B,MAAMe,KAAKtB,IAAiB;EAC5B,MAAMuB,gBAAgBvB,IAAI,CAAC;EAE3B,MAAMwB,sBAAsB;GAC1B,IAAIF,GAAGG,OAAOC,mBAAmB;IAC/B,MAAMC,QAAQC,OAAOC,iBAAiBP,GAAGG,MAAMC,iBAAiB,CAAC,CAACC;IAClE,OAAOG,KAAKC,KAAKC,OAAOC,WAAWN,KAAK,CAAC;GAC3C,OACE,OAAO;EAEX;EAEA,MAAMO,oBAAoBC,SAA8B,aAAa;GACnEvC,eAAe;IACb,IAAIwB,gBAAgBgB,YAAYxB,MAAMC,aAAa;KACjD,IAAIsB,WAAW,UACbZ,cAAcE,QAAQD,cAAc;UAC/B,IAAIW,WAAW,UACpBjB,aAAamB,qBAAqBd,cAAcE,KAAK;IAEzD;GACF,CAAC;EACH;EACA,MAAMa,2BAA2BJ,iBAAiB,QAAQ;EAE1DpC,gBAAgB;GACdwC,mBAAmB;EACrB,CAAC;EACDzC,sBAAsB;GACpBqC,iBAAiB,QAAQ;EAC3B,CAAC;EACDnC,gBAAgBuC,mBAAmB,CAAC;EAEpCrC,MAAMsB,gBAAgBgB,KAAKC,WAAW;GACpC,IAAI5B,MAAMG,WACRG,aAAauB,mBAAmBF,KAAKC,MAAM;EAE/C,CAAC;EAEDnC,kBACEZ,eACS6B,GAAGG,OAAOC,qBAAqB,IACxC,GACAY,kBACF;EAEA,aAAa;GACX,IAAI,CAACrB,OAAO,OAAO;GAEnB,MAAM,EAAEJ,gBAAgBD;GACxB,IAAIC,aAAa;IACf,MAAM6B,iBAAiBxB,aAAawB;IACpC,MAAMN,WAAWhB,iBAAiBgB;IAClC,MAAMO,QAAuB,CAAC;IAC9B,IAAIP,YAAYM,kBAAkBA,mBAAmB,QAAQ;KAC3D,MAAME,cAAcd,KAAKe,IACvB,GACAb,OAAOc,SAASJ,gBAAgB,EAAE,IAAInB,cAAcE,KACtD;KAIA,MAAMuB,kBAFJ5B,gBAAgB2B,iBAAiB7B,YAAY6B,mBAG3B,SAAS,gBAAgB;KAE7C,IAAIH,aACFD,MAAMK,kBAAkB,GAAGJ,YAAW;IAE1C;IACA,OAAAzC,YAAA,OAAA;KAAA,OACYmB;KAAE,SAAS,CAACD,GAAG4B,GAAG,QAAQ,YAAY,CAAC;KAAC,SAASN;IAAK,GAAA,CAC7D1B,MAAMiC,UAAU,CAAC,CAAA;GAGxB,OACE,OAAA/C,YAAAC,UAAA,EAAA,OAAsBkB,GAAE,GAAA,CAAGL,MAAMiC,UAAU,CAAC,CAAA;EAEhD;CACF;AACF,CAAC"}