UNPKG

vexip-ui

Version:

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

1 lines 4.22 kB
{"version":3,"file":"index.cjs","sources":["../../../directives/resize/index.ts"],"sourcesContent":["import { useResize } from '@vexip-ui/hooks'\nimport { noop, throttle } from '@vexip-ui/utils'\n\nimport type { DirectiveBinding, ObjectDirective } from 'vue'\nimport type { ResizeHandler } from '@vexip-ui/hooks'\n\nconst { observeResize, unobserveResize } = useResize()\n\nexport interface VResizeOptions {\n handler: ResizeHandler,\n throttle?: boolean | number,\n disabled?: boolean\n}\n\ninterface ResizeRecord {\n useThrottle: boolean | number,\n observed: boolean\n}\n\nfunction createObserver(\n el: HTMLElement & { __resize?: ResizeRecord },\n binding: DirectiveBinding<ResizeHandler | VResizeOptions>,\n) {\n const options: VResizeOptions =\n typeof binding.value === 'function' ? { handler: binding.value } : { ...binding.value }\n const useThrottle = options.throttle || binding.modifiers.throttle\n\n el.__resize = {\n useThrottle,\n observed: false,\n }\n\n if (options.disabled) {\n unobserveResize(el)\n el.__resize.observed = false\n return\n }\n\n const throttleResize = useThrottle\n ? throttle(options.handler, typeof useThrottle === 'boolean' ? 16 : useThrottle)\n : options.handler\n\n observeResize(el, throttleResize)\n el.__resize.observed = true\n}\n\nexport const vResize: ObjectDirective<\n HTMLElement & { __resize?: ResizeRecord },\n ResizeHandler | VResizeOptions\n> = {\n mounted(el, binding) {\n createObserver(el, binding)\n },\n updated(el, binding) {\n if (!el.__resize) {\n createObserver(el, binding)\n return\n }\n\n const options: VResizeOptions =\n typeof binding.value === 'function' ? { handler: binding.value } : { ...binding.value }\n const useThrottle = options.throttle || binding.modifiers.throttle\n\n const getHandler = () =>\n useThrottle\n ? throttle(options.handler, typeof useThrottle === 'boolean' ? 16 : useThrottle)\n : options.handler\n\n if (options.disabled) {\n if (el.__resize.observed) {\n unobserveResize(el)\n el.__resize.observed = false\n }\n } else if (!el.__resize.observed) {\n observeResize(el, getHandler())\n el.__resize.observed = true\n } else {\n const prevOptions: VResizeOptions =\n typeof binding.oldValue === 'function'\n ? { handler: binding.oldValue }\n : { ...(binding.oldValue || { handler: noop }) }\n\n if (useThrottle !== el.__resize.useThrottle || options.handler !== prevOptions.handler) {\n unobserveResize(el)\n observeResize(el, getHandler())\n }\n }\n },\n beforeUnmount(el) {\n if (el.__resize?.observed) {\n unobserveResize(el)\n }\n\n delete el.__resize\n },\n}\n"],"names":["observeResize","unobserveResize","useResize","createObserver","el","binding","options","useThrottle","throttleResize","throttle","vResize","getHandler","prevOptions","noop","_a"],"mappings":"gJAMM,CAAE,cAAAA,EAAe,gBAAAC,CAAgB,EAAIC,YAAU,EAarD,SAASC,EACPC,EACAC,EACA,CACA,MAAMC,EACJ,OAAOD,EAAQ,OAAU,WAAa,CAAE,QAASA,EAAQ,KAAM,EAAI,CAAE,GAAGA,EAAQ,KAAM,EAClFE,EAAcD,EAAQ,UAAYD,EAAQ,UAAU,SAO1D,GALAD,EAAG,SAAW,CACZ,YAAAG,EACA,SAAU,EACZ,EAEID,EAAQ,SAAU,CACpBL,EAAgBG,CAAE,EAClBA,EAAG,SAAS,SAAW,GACvB,MAAA,CAGI,MAAAI,EAAiBD,EACnBE,EAAA,SAASH,EAAQ,QAAS,OAAOC,GAAgB,UAAY,GAAKA,CAAW,EAC7ED,EAAQ,QAEZN,EAAcI,EAAII,CAAc,EAChCJ,EAAG,SAAS,SAAW,EACzB,CAEO,MAAMM,EAGT,CACF,QAAQN,EAAIC,EAAS,CACnBF,EAAeC,EAAIC,CAAO,CAC5B,EACA,QAAQD,EAAIC,EAAS,CACf,GAAA,CAACD,EAAG,SAAU,CAChBD,EAAeC,EAAIC,CAAO,EAC1B,MAAA,CAGF,MAAMC,EACJ,OAAOD,EAAQ,OAAU,WAAa,CAAE,QAASA,EAAQ,KAAM,EAAI,CAAE,GAAGA,EAAQ,KAAM,EAClFE,EAAcD,EAAQ,UAAYD,EAAQ,UAAU,SAEpDM,EAAa,IACjBJ,EACIE,EAAA,SAASH,EAAQ,QAAS,OAAOC,GAAgB,UAAY,GAAKA,CAAW,EAC7ED,EAAQ,QAEd,GAAIA,EAAQ,SACNF,EAAG,SAAS,WACdH,EAAgBG,CAAE,EAClBA,EAAG,SAAS,SAAW,YAEhB,CAACA,EAAG,SAAS,SACRJ,EAAAI,EAAIO,GAAY,EAC9BP,EAAG,SAAS,SAAW,OAClB,CACL,MAAMQ,EACJ,OAAOP,EAAQ,UAAa,WACxB,CAAE,QAASA,EAAQ,QAAS,EAC5B,CAAE,GAAIA,EAAQ,UAAY,CAAE,QAASQ,EAAAA,KAAQ,GAE/CN,IAAgBH,EAAG,SAAS,aAAeE,EAAQ,UAAYM,EAAY,WAC7EX,EAAgBG,CAAE,EACJJ,EAAAI,EAAIO,GAAY,EAChC,CAEJ,EACA,cAAcP,EAAI,QACZU,EAAAV,EAAG,WAAH,MAAAU,EAAa,UACfb,EAAgBG,CAAE,EAGpB,OAAOA,EAAG,QAAA,CAEd"}