@extclp/vexip-ui/es/directives/loading/index.mjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"index.mjs","sources":["../../../directives/loading/index.ts"],"sourcesContent":["import { Spin } from '@/components/spin'\r\n\r\nimport { createVNode, nextTick, render } from 'vue'\r\n\r\nimport { isObject } from '@vexip-ui/utils'\r\n\r\nimport type { SpinProps } from '@/components/spin'\r\nimport type { DirectiveBinding, ObjectDirective, VNode } from 'vue'\r\n\r\ninterface LoadingRecord {\r\n  spin: VNode,\r\n  props: SpinProps,\r\n  originPosition: string,\r\n}\r\n\r\ntype LoadingElement = HTMLElement & { __loading?: LoadingRecord }\r\n\r\nfunction createSpin(\r\n  el: LoadingElement,\r\n  binding: DirectiveBinding<boolean | SpinProps>,\r\n  vnode: VNode<any, LoadingElement>,\r\n) {\r\n  const props: SpinProps = isObject(binding.value)\r\n    ? { ...binding.value }\r\n    : { active: binding.value }\r\n\r\n  props.inner = true\r\n\r\n  const spin = createVNode(Spin, props, null, 0, Object.keys(props))\r\n  const position = getComputedStyle(el).position\r\n\r\n  spin.appContext = vnode.appContext ?? (vnode as any).ctx?.appContext\r\n\r\n  el.__loading = {\r\n    spin,\r\n    props,\r\n    originPosition: position,\r\n  }\r\n\r\n  if (position === 'static') {\r\n    el.style.position = 'relative'\r\n  }\r\n\r\n  render(spin, el)\r\n}\r\n\r\nexport const vLoading: ObjectDirective<LoadingElement, boolean | SpinProps> = {\r\n  mounted(el, binding, vnode) {\r\n    nextTick(() => createSpin(el, binding, vnode))\r\n  },\r\n  updated(el, binding, vnode) {\r\n    nextTick(() => {\r\n      if (!el.__loading) {\r\n        createSpin(el, binding, vnode)\r\n        return\r\n      }\r\n\r\n      const props: SpinProps = isObject(binding.value) ? binding.value : { active: binding.value }\r\n      const component = el.__loading.spin.component\r\n\r\n      if (component) {\r\n        Object.keys(props).forEach(key => {\r\n          component.props[key] = props[key as keyof SpinProps]\r\n        })\r\n\r\n        component.props.inner = true\r\n      }\r\n    })\r\n  },\r\n  beforeUnmount(el) {\r\n    if (!el.__loading) return\r\n\r\n    render(null, el)\r\n    delete el.__loading\r\n  },\r\n}\r\n"],"names":["createSpin","el","binding","vnode","props","isObject","spin","createVNode","Spin","position","_a","render","vLoading","nextTick","component","key"],"mappings":";;;;AAiBA,SAASA,EACPC,GACAC,GACAC,GACA;;AACA,QAAMC,IAAmBC,EAASH,EAAQ,KAAK,IAC3C,EAAE,GAAGA,EAAQ,MAAM,IACnB,EAAE,QAAQA,EAAQ,MAAM;AAE5B,EAAAE,EAAM,QAAQ;AAER,QAAAE,IAAOC,EAAYC,GAAMJ,GAAO,MAAM,GAAG,OAAO,KAAKA,CAAK,CAAC,GAC3DK,IAAW,iBAAiBR,CAAE,EAAE;AAEtC,EAAAK,EAAK,aAAaH,EAAM,gBAAeO,IAAAP,EAAc,QAAd,gBAAAO,EAAmB,aAE1DT,EAAG,YAAY;AAAA,IACb,MAAAK;AAAA,IACA,OAAAF;AAAA,IACA,gBAAgBK;AAAA,EAClB,GAEIA,MAAa,aACfR,EAAG,MAAM,WAAW,aAGtBU,EAAOL,GAAML,CAAE;AACjB;AAEO,MAAMW,IAAiE;AAAA,EAC5E,QAAQX,GAAIC,GAASC,GAAO;AAC1B,IAAAU,EAAS,MAAMb,EAAWC,GAAIC,GAASC,CAAK,CAAC;AAAA,EAC/C;AAAA,EACA,QAAQF,GAAIC,GAASC,GAAO;AAC1B,IAAAU,EAAS,MAAM;AACT,UAAA,CAACZ,EAAG,WAAW;AACN,QAAAD,EAAAC,GAAIC,GAASC,CAAK;AAC7B;AAAA,MAAA;AAGI,YAAAC,IAAmBC,EAASH,EAAQ,KAAK,IAAIA,EAAQ,QAAQ,EAAE,QAAQA,EAAQ,MAAM,GACrFY,IAAYb,EAAG,UAAU,KAAK;AAEpC,MAAIa,MACF,OAAO,KAAKV,CAAK,EAAE,QAAQ,CAAOW,MAAA;AAChC,QAAAD,EAAU,MAAMC,CAAG,IAAIX,EAAMW,CAAsB;AAAA,MAAA,CACpD,GAEDD,EAAU,MAAM,QAAQ;AAAA,IAC1B,CACD;AAAA,EACH;AAAA,EACA,cAAcb,GAAI;AACZ,IAACA,EAAG,cAERU,EAAO,MAAMV,CAAE,GACf,OAAOA,EAAG;AAAA,EAAA;AAEd;"}