element-plus/es/utils/dom.mjs.map

A Component Library for Vue 3

{"version":3,"file":"dom.mjs","sources":["../../../../packages/utils/dom.ts"],"sourcesContent":["import isServer from './isServer'\nimport { camelize, isObject } from './util'\nimport type { CSSProperties } from 'vue'\n\nimport type { Nullable } from './types'\n\n/* istanbul ignore next */\nconst trimArr = function (s: string) {\n  return (s || '').split(' ').filter((item) => !!item.trim())\n}\n\n/* istanbul ignore next */\nexport const on = function (\n  element: HTMLElement | Document | Window,\n  event: string,\n  handler: EventListenerOrEventListenerObject,\n  useCapture = false\n): void {\n  if (element && event && handler) {\n    element?.addEventListener(event, handler, useCapture)\n  }\n}\n\n/* istanbul ignore next */\nexport const off = function (\n  element: HTMLElement | Document | Window,\n  event: string,\n  handler: EventListenerOrEventListenerObject,\n  useCapture = false\n): void {\n  if (element && event && handler) {\n    element?.removeEventListener(event, handler, useCapture)\n  }\n}\n\n/* istanbul ignore next */\nexport const once = function (\n  el: HTMLElement,\n  event: string,\n  fn: EventListener\n): void {\n  const listener = function (this: any, ...args: any) {\n    if (fn) {\n      fn.apply(this, args)\n    }\n    off(el, event, listener)\n  }\n  on(el, event, listener)\n}\n\n/* istanbul ignore next */\nexport function hasClass(el: HTMLElement | Element, cls: string): boolean {\n  if (!el || !cls) return false\n  if (cls.indexOf(' ') !== -1)\n    throw new Error('className should not contain space.')\n  if (el.classList) {\n    return el.classList.contains(cls)\n  } else {\n    const className = el.getAttribute('class') || ''\n    return className.split(' ').includes(cls)\n  }\n}\n\n/* istanbul ignore next */\nexport function addClass(el: HTMLElement | Element, cls: string): void {\n  if (!el) return\n  let className = el.getAttribute('class') || ''\n  const curClass = trimArr(className)\n  const classes = (cls || '')\n    .split(' ')\n    .filter((item) => !curClass.includes(item) && !!item.trim())\n\n  if (el.classList) {\n    el.classList.add(...classes)\n  } else {\n    className += ` ${classes.join(' ')}`\n    el.setAttribute('class', className)\n  }\n}\n\n/* istanbul ignore next */\nexport function removeClass(el: HTMLElement | Element, cls: string): void {\n  if (!el || !cls) return\n  const classes = trimArr(cls)\n  let curClass = el.getAttribute('class') || ''\n\n  if (el.classList) {\n    el.classList.remove(...classes)\n    return\n  }\n  classes.forEach((item) => {\n    curClass = curClass.replace(` ${item} `, ' ')\n  })\n  const className = trimArr(curClass).join(' ')\n  el.setAttribute('class', className)\n}\n\n/* istanbul ignore next */\n// Here I want to use the type CSSProperties, but the definition for CSSProperties\n// has { [index: number]: string } in its type annotation, which does not satisfy the method\n// camelize(s: string)\n// Same as the return type\nexport const getStyle = function (\n  element: HTMLElement,\n  styleName: string\n): string {\n  if (isServer) return ''\n  if (!element || !styleName) return ''\n  styleName = camelize(styleName)\n  if (styleName === 'float') {\n    styleName = 'cssFloat'\n  }\n  try {\n    const style = element.style[styleName]\n    if (style) return style\n    const computed = document.defaultView?.getComputedStyle(element, '')\n    return computed ? computed[styleName] : ''\n  } catch (e) {\n    return element.style[styleName]\n  }\n}\n\n/* istanbul ignore next */\nexport function setStyle(\n  element: HTMLElement,\n  styleName: CSSProperties | string,\n  value?: string\n): void {\n  if (!element || !styleName) return\n\n  if (isObject(styleName)) {\n    Object.keys(styleName).forEach((prop) => {\n      setStyle(element, prop, styleName[prop])\n    })\n  } else {\n    styleName = camelize(styleName)\n    element.style[styleName] = value\n  }\n}\n\nexport function removeStyle(\n  element: HTMLElement,\n  style: CSSProperties | string\n) {\n  if (!element || !style) return\n\n  if (isObject(style)) {\n    Object.keys(style).forEach((prop) => {\n      setStyle(element, prop, '')\n    })\n  } else {\n    setStyle(element, style, '')\n  }\n}\n\nexport const isScroll = (\n  el: HTMLElement,\n  isVertical?: Nullable<boolean>\n): RegExpMatchArray | null => {\n  if (isServer) return null\n  const determinedDirection = isVertical === null || isVertical === undefined\n  const overflow = determinedDirection\n    ? getStyle(el, 'overflow')\n    : isVertical\n    ? getStyle(el, 'overflow-y')\n    : getStyle(el, 'overflow-x')\n\n  return overflow.match(/(scroll|auto|overlay)/)\n}\n\nexport const getScrollContainer = (\n  el: HTMLElement,\n  isVertical?: Nullable<boolean>\n): Window | HTMLElement | undefined => {\n  if (isServer) return\n\n  let parent: HTMLElement = el\n  while (parent) {\n    if ([window, document, document.documentElement].includes(parent)) {\n      return window\n    }\n    if (isScroll(parent, isVertical)) {\n      return parent\n    }\n    parent = parent.parentNode as HTMLElement\n  }\n  return parent\n}\n\nexport const isInContainer = (\n  el: Element | undefined,\n  container: Element | Window | undefined\n): boolean => {\n  if (isServer || !el || !container) return false\n\n  const elRect = el.getBoundingClientRect()\n\n  let containerRect: Pick<DOMRect, 'top' | 'bottom' | 'left' | 'right'>\n  if (container instanceof Element) {\n    containerRect = container.getBoundingClientRect()\n  } else {\n    containerRect = {\n      top: 0,\n      right: window.innerWidth,\n      bottom: window.innerHeight,\n      left: 0,\n    }\n  }\n  return (\n    elRect.top < containerRect.bottom &&\n    elRect.bottom > containerRect.top &&\n    elRect.right > containerRect.left &&\n    elRect.left < containerRect.right\n  )\n}\n\nexport const getOffsetTop = (el: HTMLElement) => {\n  let offset = 0\n  let parent = el\n\n  while (parent) {\n    offset += parent.offsetTop\n    parent = parent.offsetParent as HTMLElement\n  }\n\n  return offset\n}\n\nexport const getOffsetTopDistance = (\n  el: HTMLElement,\n  containerEl: HTMLElement\n) => {\n  return Math.abs(getOffsetTop(el) - getOffsetTop(containerEl))\n}\n\nexport const stop = (e: Event) => e.stopPropagation()\n"],"names":[],"mappings":"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"}