@antsoo-lib/components 0.1.11 → 0.1.12

package/src/_util/PortalWrapper.tsx

@@ -1,191 +0,0 @@
-import {
-  computed,
-  defineComponent,
-  nextTick,
-  onBeforeUnmount,
-  onMounted,
-  onUpdated,
-  shallowRef,
-  watch,
-} from 'vue'
-
-import Portal from './Portal'
-import canUseDom from './canUseDom'
-import useScrollLocker from './hooks/useScrollLocker'
-import raf from './raf'
-import { booleanType } from './type'
-import PropTypes from './vue-types'
-
-let openCount = 0
-const supportDom = canUseDom()
-
-export function getOpenCount() {
-  return process.env.NODE_ENV === 'test' ? openCount : 0
-}
-
-const getParent = (getContainer: GetContainer) => {
-  if (!supportDom) {
-    return null
-  }
-  if (getContainer) {
-    if (typeof getContainer === 'string') {
-      return document.querySelectorAll(getContainer)[0] as HTMLElement
-    }
-    if (typeof getContainer === 'function') {
-      return getContainer()
-    }
-    if (typeof getContainer === 'object' && getContainer instanceof window.HTMLElement) {
-      return getContainer
-    }
-  }
-  return document.body
-}
-
-export type GetContainer = string | HTMLElement | (() => HTMLElement)
-
-export default defineComponent({
-  compatConfig: { MODE: 3 },
-  name: 'PortalWrapper',
-  inheritAttrs: false,
-  props: {
-    wrapperClassName: String,
-    forceRender: { type: Boolean, default: undefined },
-    getContainer: PropTypes.any,
-    visible: { type: Boolean, default: undefined },
-    autoLock: booleanType(),
-    didUpdate: Function,
-  },
-
-  setup(props, { slots }) {
-    const container = shallowRef<HTMLElement>()
-    const componentRef = shallowRef()
-    const rafId = shallowRef<number>()
-    const triggerUpdate = shallowRef(1)
-    const defaultContainer = canUseDom() && document.createElement('div')
-    const removeCurrentContainer = () => {
-      // Portal will remove from `parentNode`.
-      // Let's handle this again to avoid refactor issue.
-      if (container.value === defaultContainer) {
-        container.value?.parentNode?.removeChild(container.value)
-      }
-      container.value = null
-    }
-    let parent: HTMLElement = null
-    const attachToParent = (force = false) => {
-      if (force || (container.value && !container.value.parentNode)) {
-        parent = getParent(props.getContainer)
-        if (parent) {
-          parent.appendChild(container.value)
-          return true
-        }
-
-        return false
-      }
-
-      return true
-    }
-    const getContainer = () => {
-      if (!supportDom) {
-        return null
-      }
-      if (!container.value) {
-        container.value = defaultContainer
-        attachToParent(true)
-      }
-      setWrapperClassName()
-      return container.value
-    }
-    const setWrapperClassName = () => {
-      const { wrapperClassName } = props
-      if (container.value && wrapperClassName && wrapperClassName !== container.value.className) {
-        container.value.className = wrapperClassName
-      }
-    }
-    onUpdated(() => {
-      setWrapperClassName()
-      attachToParent()
-    })
-
-    useScrollLocker(
-      computed(() => {
-        return (
-          props.autoLock &&
-          props.visible &&
-          canUseDom() &&
-          (container.value === document.body || container.value === defaultContainer)
-        )
-      }),
-    )
-    onMounted(() => {
-      let init = false
-      watch(
-        [() => props.visible, () => props.getContainer],
-        ([visible, getContainer], [prevVisible, prevGetContainer]) => {
-          // Update count
-          if (supportDom) {
-            parent = getParent(props.getContainer)
-            if (parent === document.body) {
-              if (visible && !prevVisible) {
-                openCount += 1
-              } else if (init) {
-                openCount -= 1
-              }
-            }
-          }
-
-          if (init) {
-            // Clean up container if needed
-            const getContainerIsFunc =
-              typeof getContainer === 'function' && typeof prevGetContainer === 'function'
-            if (
-              getContainerIsFunc
-                ? getContainer.toString() !== prevGetContainer.toString()
-                : getContainer !== prevGetContainer
-            ) {
-              removeCurrentContainer()
-            }
-          }
-          init = true
-        },
-        { immediate: true, flush: 'post' },
-      )
-
-      nextTick(() => {
-        if (!attachToParent()) {
-          rafId.value = raf(() => {
-            triggerUpdate.value += 1
-          })
-        }
-      })
-    })
-
-    onBeforeUnmount(() => {
-      const { visible } = props
-      if (supportDom && parent === document.body) {
-        // 离开时不会 render， 导到离开时数值不变，改用 func 。。
-        openCount = visible && openCount ? openCount - 1 : openCount
-      }
-      removeCurrentContainer()
-      raf.cancel(rafId.value)
-    })
-    return () => {
-      const { forceRender, visible } = props
-      let portal = null
-      const childProps = {
-        getOpenCount: () => openCount,
-        getContainer,
-      }
-      if (triggerUpdate.value && (forceRender || visible || componentRef.value)) {
-        portal = (
-          <Portal
-            getContainer={getContainer}
-            ref={componentRef}
-            didUpdate={props.didUpdate}
-            v-slots={{ default: () => slots.default?.(childProps) }}
-          ></Portal>
-        )
-      }
-      return portal
-    }
-  },
-})

package/src/_util/__mocks__/Portal.tsx

@@ -1,13 +0,0 @@
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  compatConfig: { MODE: 3 },
-  name: 'Portal',
-  inheritAttrs: false,
-  props: ['getContainer'],
-  setup(_props, { slots }) {
-    return () => {
-      return slots.default?.()
-    }
-  },
-})

package/src/_util/__mocks__/RenderSlot.tsx

@@ -1,12 +0,0 @@
-import { defineComponent } from 'vue'
-
-import { customRenderSlot } from '../vnode'
-
-export default defineComponent({
-  name: 'RenderSlot',
-  setup(_props, { slots }) {
-    return () => {
-      return customRenderSlot(slots, 'default', {}, () => ['default value'])
-    }
-  },
-})

package/src/_util/canUseDom.ts

@@ -1,5 +0,0 @@
-function canUseDom() {
-  return !!(typeof window !== 'undefined' && window.document && window.document.createElement)
-}
-
-export default canUseDom

package/src/_util/classNames.ts

@@ -1,28 +0,0 @@
-import { isArray, isObject, isString } from './util'
-
-function classNames(...args: any[]) {
-  const classes = []
-  for (let i = 0; i < args.length; i++) {
-    const value = args[i]
-    if (!value) continue
-    if (isString(value)) {
-      classes.push(value)
-    } else if (isArray(value)) {
-      for (let i = 0; i < value.length; i++) {
-        const inner = classNames(value[i])
-        if (inner) {
-          classes.push(inner)
-        }
-      }
-    } else if (isObject(value)) {
-      for (const name in value) {
-        if (value[name]) {
-          classes.push(name)
-        }
-      }
-    }
-  }
-  return classes.join(' ')
-}
-
-export default classNames

package/src/_util/collapseMotion.tsx

@@ -1,51 +0,0 @@
-import { nextTick } from 'vue'
-
-import { addClass, removeClass } from '../vc-util/Dom/class'
-import type { CSSMotionProps } from './transition'
-
-const collapseMotion = (name = 'ant-motion-collapse', appear = true): CSSMotionProps => {
-  return {
-    name,
-    appear,
-    css: true,
-    onBeforeEnter: (node: HTMLDivElement) => {
-      node.style.height = '0px'
-      node.style.opacity = '0'
-      addClass(node, name)
-    },
-    onEnter: (node: HTMLDivElement) => {
-      nextTick(() => {
-        node.style.height = `${node.scrollHeight}px`
-        node.style.opacity = '1'
-      })
-    },
-    onAfterEnter: (node: HTMLDivElement) => {
-      if (node) {
-        removeClass(node, name)
-        node.style.height = null
-        node.style.opacity = null
-      }
-    },
-    onBeforeLeave: (node: HTMLDivElement) => {
-      addClass(node, name)
-      node.style.height = `${node.offsetHeight}px`
-      node.style.opacity = null
-    },
-    onLeave: (node: HTMLDivElement) => {
-      setTimeout(() => {
-        node.style.height = '0px'
-        node.style.opacity = '0'
-      })
-    },
-    onAfterLeave: (node: HTMLDivElement) => {
-      if (node) {
-        removeClass(node, name)
-        if (node.style) {
-          node.style.height = null
-          node.style.opacity = null
-        }
-      }
-    },
-  }
-}
-export default collapseMotion

package/src/_util/colors.ts

@@ -1,34 +0,0 @@
-import type { PresetColorKey } from '../theme/interface'
-import { PresetColors } from '../theme/interface'
-
-type InverseColor = `${PresetColorKey}-inverse`
-const inverseColors = PresetColors.map<InverseColor>((color) => `${color}-inverse`)
-
-export const PresetStatusColorTypes = [
-  'success',
-  'processing',
-  'error',
-  'default',
-  'warning',
-] as const
-
-export type PresetColorType = PresetColorKey | InverseColor
-
-export type PresetStatusColorType = (typeof PresetStatusColorTypes)[number]
-
-/**
- * determine if the color keyword belongs to the `Ant Design` {@link PresetColors}.
- * @param color color to be judged
- * @param includeInverse whether to include reversed colors
- */
-export function isPresetColor(color?: any, includeInverse = true) {
-  if (includeInverse) {
-    return [...inverseColors, ...PresetColors].includes(color)
-  }
-
-  return PresetColors.includes(color)
-}
-
-export function isPresetStatusColor(color?: any): color is PresetStatusColorType {
-  return PresetStatusColorTypes.includes(color)
-}

package/src/_util/component-classes.ts

@@ -1,167 +0,0 @@
-/**
- * source by `component-classes`
- * https://github.com/component/classes.git
- */
-import indexOf from 'lodash-es/indexOf'
-
-/**
- * Whitespace regexp.
- */
-const re = /\s+/
-
-export class ClassList {
-  el: Element
-  list: DOMTokenList
-
-  constructor(el: Element) {
-    if (!el || !el.nodeType) {
-      throw new Error('A DOM element reference is required')
-    }
-    this.el = el
-    this.list = el.classList
-  }
-
-  array() {
-    const className = this.el.getAttribute('class') || ''
-    const str = className.replace(/^\s+|\s+$/g, '')
-    const arr = str.split(re)
-    if (arr[0] === '') arr.shift()
-    return arr
-  }
-
-  /**
-   * Add class `name` if not already present.
-   *
-   * @param {string} name
-   * @return {ClassList}
-   * @api public
-   */
-  add(name: string): ClassList {
-    // classList
-    if (this.list) {
-      this.list.add(name)
-      return this
-    }
-
-    // fallback
-    const arr = this.array()
-    const i = indexOf(arr, name)
-    if (!~i) arr.push(name)
-    this.el.className = arr.join(' ')
-    return this
-  }
-  /**
-   * Remove class `name` when present, or
-   * pass a regular expression to remove
-   * any which match.
-   *
-   * @param {string | RegExp} name
-   * @return {ClassList}
-   * @api public
-   */
-  remove(name: string | RegExp): ClassList {
-    if (toString.call(name) === '[object RegExp]') {
-      return this._removeMatching(name as RegExp)
-    }
-
-    // classList
-    if (this.list) {
-      this.list.remove(name as string)
-      return this
-    }
-
-    // fallback
-    const arr = this.array()
-    const i = indexOf(arr, name)
-    if (~i) arr.splice(i, 1)
-    this.el.className = arr.join(' ')
-    return this
-  }
-  /**
-   * Remove all classes matching `re`.
-   *
-   * @param {RegExp} re
-   * @return {ClassList}
-   * @api private
-   */
-  _removeMatching(re: RegExp): ClassList {
-    const arr = this.array()
-    for (let i = 0; i < arr.length; i++) {
-      if (re.test(arr[i])) {
-        this.remove(arr[i])
-      }
-    }
-    return this
-  }
-
-  /**
-   * Toggle class `name`, can force state via `force`.
-   *
-   * For browsers that support classList, but do not support `force` yet,
-   * the mistake will be detected and corrected.
-   *
-   * @param {string} name
-   * @param {boolean} force
-   * @return {ClassList}
-   * @api public
-   */
-  toggle(name: string, force: boolean): ClassList {
-    // classList
-    if (this.list) {
-      if (typeof force !== 'undefined') {
-        if (force !== this.list.toggle(name, force)) {
-          this.list.toggle(name) // toggle again to correct
-        }
-      } else {
-        this.list.toggle(name)
-      }
-      return this
-    }
-
-    // fallback
-    if (typeof force !== 'undefined') {
-      if (!force) {
-        this.remove(name)
-      } else {
-        this.add(name)
-      }
-    } else {
-      if (this.has(name)) {
-        this.remove(name)
-      } else {
-        this.add(name)
-      }
-    }
-
-    return this
-  }
-  /**
-   * Check if class `name` is present.
-   *
-   * @param {string} name
-   * @api public
-   */
-  has(name: string) {
-    return this.list ? this.list.contains(name) : !!~indexOf(this.array(), name)
-  }
-  /**
-   * Check if class `name` is present.
-   *
-   * @param {string} name
-   * @api public
-   */
-  contains(name: string) {
-    return this.has(name)
-  }
-}
-
-/**
- * Wrap `el` in a `ClassList`.
- *
- * @param {Element} el
- * @return {ClassList}
- * @api public
- */
-export default function (el: Element): ClassList {
-  return new ClassList(el)
-}

package/src/_util/copy-to-clipboard/index.ts

@@ -1,120 +0,0 @@
-import deselectCurrent from './toggle-selection'
-
-interface Options {
-  debug?: boolean
-  message?: string
-  format?: string // MIME type
-  onCopy?: (clipboardData: object) => void
-}
-
-const clipboardToIE11Formatting = {
-  'text/plain': 'Text',
-  'text/html': 'Url',
-  default: 'Text',
-}
-
-const defaultMessage = 'Copy to clipboard: #{key}, Enter'
-
-function format(message: string) {
-  const copyKey = `${/mac os x/i.test(navigator.userAgent) ? '⌘' : 'Ctrl'}+C`
-  return message.replace(/#\{\s*key\s*\}/g, copyKey)
-}
-
-function copy(text: string, options?: Options): boolean {
-  let message
-  let reselectPrevious
-  let range
-  let selection
-  let mark
-  let success = false
-  if (!options) {
-    options = {}
-  }
-  const debug = options.debug || false
-  try {
-    reselectPrevious = deselectCurrent()
-
-    range = document.createRange()
-    selection = document.getSelection()
-
-    mark = document.createElement('span')
-    mark.textContent = text
-    // reset user styles for span element
-    mark.style.all = 'unset'
-    // prevents scrolling to the end of the page
-    mark.style.position = 'fixed'
-    mark.style.top = 0
-    mark.style.clip = 'rect(0, 0, 0, 0)'
-    // used to preserve spaces and line breaks
-    mark.style.whiteSpace = 'pre'
-    // do not inherit user-select (it may be `none`)
-    mark.style.webkitUserSelect = 'text'
-    mark.style.MozUserSelect = 'text'
-    mark.style.msUserSelect = 'text'
-    mark.style.userSelect = 'text'
-    mark.addEventListener('copy', (e) => {
-      e.stopPropagation()
-      if (options.format) {
-        e.preventDefault()
-        if (typeof e.clipboardData === 'undefined') {
-          // IE 11
-          debug && console.warn('unable to use e.clipboardData')
-          debug && console.warn('trying IE specific stuff')
-          ;(window as any).clipboardData.clearData()
-          const format =
-            clipboardToIE11Formatting[options.format] || clipboardToIE11Formatting.default
-          ;(window as any).clipboardData.setData(format, text)
-        } else {
-          // all other browsers
-          e.clipboardData.clearData()
-          e.clipboardData.setData(options.format, text)
-        }
-      }
-      if (options.onCopy) {
-        e.preventDefault()
-        options.onCopy(e.clipboardData)
-      }
-    })
-
-    document.body.appendChild(mark)
-
-    range.selectNodeContents(mark)
-    selection.addRange(range)
-
-    const successful = document.execCommand('copy')
-    if (!successful) {
-      throw new Error('copy command was unsuccessful')
-    }
-    success = true
-  } catch (err) {
-    debug && console.error('unable to copy using execCommand: ', err)
-    debug && console.warn('trying IE specific stuff')
-    try {
-      ;(window as any).clipboardData.setData(options.format || 'text', text)
-      options.onCopy && options.onCopy((window as any).clipboardData)
-      success = true
-    } catch (err) {
-      debug && console.error('unable to copy using clipboardData: ', err)
-      debug && console.error('falling back to prompt')
-      message = format('message' in options ? options.message : defaultMessage)
-      window.prompt(message, text)
-    }
-  } finally {
-    if (selection) {
-      if (typeof selection.removeRange == 'function') {
-        selection.removeRange(range)
-      } else {
-        selection.removeAllRanges()
-      }
-    }
-
-    if (mark) {
-      document.body.removeChild(mark)
-    }
-    reselectPrevious()
-  }
-
-  return success
-}
-
-export default copy

package/src/_util/copy-to-clipboard/toggle-selection.ts

@@ -1,41 +0,0 @@
-// copy from https://github.com/sudodoki/toggle-selection
-// refactor to esm
-const deselectCurrent = (): (() => void) => {
-  const selection = document.getSelection()
-  if (!selection.rangeCount) {
-    return function () {}
-  }
-  let active = document.activeElement as any
-
-  const ranges = []
-  for (let i = 0; i < selection.rangeCount; i++) {
-    ranges.push(selection.getRangeAt(i))
-  }
-
-  switch (
-    active.tagName.toUpperCase() // .toUpperCase handles XHTML
-  ) {
-    case 'INPUT':
-    case 'TEXTAREA':
-      active.blur()
-      break
-
-    default:
-      active = null
-      break
-  }
-
-  selection.removeAllRanges()
-  return function () {
-    selection.type === 'Caret' && selection.removeAllRanges()
-
-    if (!selection.rangeCount) {
-      ranges.forEach((range) => {
-        selection.addRange(range)
-      })
-    }
-
-    active && active.focus()
-  }
-}
-export default deselectCurrent

package/src/_util/createContext.ts

@@ -1,22 +0,0 @@
-import { inject, provide, reactive, watchEffect } from 'vue'
-
-function createContext<T extends Record<string, any>>(defaultValue?: T) {
-  const contextKey = Symbol('contextKey')
-  const useProvide = (props: T, newProps?: T) => {
-    const mergedProps = reactive<T>({} as T)
-    provide(contextKey, mergedProps)
-    watchEffect(() => {
-      Object.assign(mergedProps, props, newProps || {})
-    })
-    return mergedProps
-  }
-  const useInject = () => {
-    return inject(contextKey, defaultValue as T) || ({} as T)
-  }
-  return {
-    useProvide,
-    useInject,
-  }
-}
-
-export default createContext