ct-component-plus 0.0.43 → 0.0.44

package/packages/directives/click-outside/index.ts

@@ -1,118 +1,118 @@
-import { isClient, isElement } from '../../utils'
-
-import type {
-  ComponentPublicInstance,
-  DirectiveBinding,
-  ObjectDirective,
-} from 'vue'
-
-type DocumentHandler = <T extends MouseEvent>(mouseup: T, mousedown: T) => void
-type FlushList = Map<
-  HTMLElement,
-  {
-    documentHandler: DocumentHandler
-    bindingFn: (...args: unknown[]) => unknown
-  }[]
->
-
-const nodeList: FlushList = new Map()
-
-let startClick: MouseEvent
-
-if (isClient) {
-  document.addEventListener('mousedown', (e: MouseEvent) => (startClick = e))
-  document.addEventListener('mouseup', (e: MouseEvent) => {
-    for (const handlers of nodeList.values()) {
-      for (const { documentHandler } of handlers) {
-        documentHandler(e as MouseEvent, startClick)
-      }
-    }
-  })
-}
-
-function createDocumentHandler(
-  el: HTMLElement,
-  binding: DirectiveBinding
-): DocumentHandler {
-  let excludes: HTMLElement[] = []
-  if (Array.isArray(binding.arg)) {
-    excludes = binding.arg
-  } else if (isElement(binding.arg)) {
-    // due to current implementation on binding type is wrong the type casting is necessary here
-    excludes.push(binding.arg as unknown as HTMLElement)
-  }
-  return function (mouseup, mousedown) {
-    const popperRef = (
-      binding.instance as ComponentPublicInstance<{
-        popperRef: HTMLElement
-      }>
-    ).popperRef
-    const mouseUpTarget = mouseup.target as Node
-    const mouseDownTarget = mousedown?.target as Node
-    const isBound = !binding || !binding.instance
-    const isTargetExists = !mouseUpTarget || !mouseDownTarget
-    const isContainedByEl =
-      el.contains(mouseUpTarget) || el.contains(mouseDownTarget)
-    const isSelf = el === mouseUpTarget
-
-    const isTargetExcluded =
-      (excludes.length &&
-        excludes.some((item) => item?.contains(mouseUpTarget))) ||
-      (excludes.length && excludes.includes(mouseDownTarget as HTMLElement))
-    const isContainedByPopper =
-      popperRef &&
-      (popperRef.contains(mouseUpTarget) || popperRef.contains(mouseDownTarget))
-    if (
-      isBound ||
-      isTargetExists ||
-      isContainedByEl ||
-      isSelf ||
-      isTargetExcluded ||
-      isContainedByPopper
-    ) {
-      return
-    }
-    binding.value(mouseup, mousedown)
-  }
-}
-
-const ClickOutside: ObjectDirective = {
-  beforeMount(el: HTMLElement, binding: DirectiveBinding) {
-    // there could be multiple handlers on the element
-    if (!nodeList.has(el)) {
-      nodeList.set(el, [])
-    }
-
-    nodeList.get(el)!.push({
-      documentHandler: createDocumentHandler(el, binding),
-      bindingFn: binding.value,
-    })
-  },
-  updated(el: HTMLElement, binding: DirectiveBinding) {
-    if (!nodeList.has(el)) {
-      nodeList.set(el, [])
-    }
-
-    const handlers = nodeList.get(el)!
-    const oldHandlerIndex = handlers.findIndex(
-      (item) => item.bindingFn === binding.oldValue
-    )
-    const newHandler = {
-      documentHandler: createDocumentHandler(el, binding),
-      bindingFn: binding.value,
-    }
-
-    if (oldHandlerIndex >= 0) {
-      // replace the old handler to the new handler
-      handlers.splice(oldHandlerIndex, 1, newHandler)
-    } else {
-      handlers.push(newHandler)
-    }
-  },
-  unmounted(el: HTMLElement) {
-    // remove all listeners when a component unmounted
-    nodeList.delete(el)
-  },
-}
-
-export default ClickOutside
+import { isClient, isElement } from '../../utils'
+
+import type {
+  ComponentPublicInstance,
+  DirectiveBinding,
+  ObjectDirective,
+} from 'vue'
+
+type DocumentHandler = <T extends MouseEvent>(mouseup: T, mousedown: T) => void
+type FlushList = Map<
+  HTMLElement,
+  {
+    documentHandler: DocumentHandler
+    bindingFn: (...args: unknown[]) => unknown
+  }[]
+>
+
+const nodeList: FlushList = new Map()
+
+let startClick: MouseEvent
+
+if (isClient) {
+  document.addEventListener('mousedown', (e: MouseEvent) => (startClick = e))
+  document.addEventListener('mouseup', (e: MouseEvent) => {
+    for (const handlers of nodeList.values()) {
+      for (const { documentHandler } of handlers) {
+        documentHandler(e as MouseEvent, startClick)
+      }
+    }
+  })
+}
+
+function createDocumentHandler(
+  el: HTMLElement,
+  binding: DirectiveBinding
+): DocumentHandler {
+  let excludes: HTMLElement[] = []
+  if (Array.isArray(binding.arg)) {
+    excludes = binding.arg
+  } else if (isElement(binding.arg)) {
+    // due to current implementation on binding type is wrong the type casting is necessary here
+    excludes.push(binding.arg as unknown as HTMLElement)
+  }
+  return function (mouseup, mousedown) {
+    const popperRef = (
+      binding.instance as ComponentPublicInstance<{
+        popperRef: HTMLElement
+      }>
+    ).popperRef
+    const mouseUpTarget = mouseup.target as Node
+    const mouseDownTarget = mousedown?.target as Node
+    const isBound = !binding || !binding.instance
+    const isTargetExists = !mouseUpTarget || !mouseDownTarget
+    const isContainedByEl =
+      el.contains(mouseUpTarget) || el.contains(mouseDownTarget)
+    const isSelf = el === mouseUpTarget
+
+    const isTargetExcluded =
+      (excludes.length &&
+        excludes.some((item) => item?.contains(mouseUpTarget))) ||
+      (excludes.length && excludes.includes(mouseDownTarget as HTMLElement))
+    const isContainedByPopper =
+      popperRef &&
+      (popperRef.contains(mouseUpTarget) || popperRef.contains(mouseDownTarget))
+    if (
+      isBound ||
+      isTargetExists ||
+      isContainedByEl ||
+      isSelf ||
+      isTargetExcluded ||
+      isContainedByPopper
+    ) {
+      return
+    }
+    binding.value(mouseup, mousedown)
+  }
+}
+
+const ClickOutside: ObjectDirective = {
+  beforeMount(el: HTMLElement, binding: DirectiveBinding) {
+    // there could be multiple handlers on the element
+    if (!nodeList.has(el)) {
+      nodeList.set(el, [])
+    }
+
+    nodeList.get(el)!.push({
+      documentHandler: createDocumentHandler(el, binding),
+      bindingFn: binding.value,
+    })
+  },
+  updated(el: HTMLElement, binding: DirectiveBinding) {
+    if (!nodeList.has(el)) {
+      nodeList.set(el, [])
+    }
+
+    const handlers = nodeList.get(el)!
+    const oldHandlerIndex = handlers.findIndex(
+      (item) => item.bindingFn === binding.oldValue
+    )
+    const newHandler = {
+      documentHandler: createDocumentHandler(el, binding),
+      bindingFn: binding.value,
+    }
+
+    if (oldHandlerIndex >= 0) {
+      // replace the old handler to the new handler
+      handlers.splice(oldHandlerIndex, 1, newHandler)
+    } else {
+      handlers.push(newHandler)
+    }
+  },
+  unmounted(el: HTMLElement) {
+    // remove all listeners when a component unmounted
+    nodeList.delete(el)
+  },
+}
+
+export default ClickOutside

package/packages/echarts/bar/index.js

@@ -1,64 +1,64 @@
-import { baseOption } from "../base"
-export const baseBarOption = {
-  ...baseOption,
-  color: [
-    'rgba(77, 100, 255, 1)',
-    "rgba(255, 173, 44, 1)",
-    "rgba(30, 183, 173, 1)",
-    "rgba(255, 146, 24, 1)",
-    "rgba(66, 166, 255, 1)",
-    "rgba(136, 206, 119, 1)",
-  ],
-  axisPointer: {
-    lineStyle: {
-      opacity: 0
-    },
-  },
-  series: []
-}
-
-export const seriesItem = {
-  name: "",
-  type: 'bar',
-  silent: true,
-  barWidth: 28,
-  barGap: '50%',
-  barCategoryGap: 0,
-  label: {
-    show: false,
-    position: "outside",
-    fontSize: 14,
-    color: '#141617',
-    fontWeight: 400,
-  },
-  emphasis: {
-    label: {
-      show: false,
-      position: "outside",
-      fontSize: 14,
-      color: '#141617',
-      fontWeight: 400,
-    },
-  },
-  itemStyle: {
-    borderRadius: [4, 4, 0, 0],
-    borderWidth: 4,
-    borderColor: {
-      type: 'linear',
-      x: 0,
-      y: 0,
-      x2: 0,
-      y2: 1,
-      colorStops: [{
-        offset: 0, color: '#999CFF' // 0% 处的颜色
-      }, {
-        offset: 1, color: '#696EFF' // 100% 处的颜色
-      }],
-      global: false // 缺省为 false
-    }
-  },
-  labelLayout: {
-    draggable: true,
-  },
-  data: [],
+import { baseOption } from "../base"
+export const baseBarOption = {
+  ...baseOption,
+  color: [
+    'rgba(77, 100, 255, 1)',
+    "rgba(255, 173, 44, 1)",
+    "rgba(30, 183, 173, 1)",
+    "rgba(255, 146, 24, 1)",
+    "rgba(66, 166, 255, 1)",
+    "rgba(136, 206, 119, 1)",
+  ],
+  axisPointer: {
+    lineStyle: {
+      opacity: 0
+    },
+  },
+  series: []
+}
+
+export const seriesItem = {
+  name: "",
+  type: 'bar',
+  silent: true,
+  barWidth: 28,
+  barGap: '50%',
+  barCategoryGap: 0,
+  label: {
+    show: false,
+    position: "outside",
+    fontSize: 14,
+    color: '#141617',
+    fontWeight: 400,
+  },
+  emphasis: {
+    label: {
+      show: false,
+      position: "outside",
+      fontSize: 14,
+      color: '#141617',
+      fontWeight: 400,
+    },
+  },
+  itemStyle: {
+    borderRadius: [4, 4, 0, 0],
+    borderWidth: 4,
+    borderColor: {
+      type: 'linear',
+      x: 0,
+      y: 0,
+      x2: 0,
+      y2: 1,
+      colorStops: [{
+        offset: 0, color: '#999CFF' // 0% 处的颜色
+      }, {
+        offset: 1, color: '#696EFF' // 100% 处的颜色
+      }],
+      global: false // 缺省为 false
+    }
+  },
+  labelLayout: {
+    draggable: true,
+  },
+  data: [],
 }

package/packages/echarts/base.js

@@ -1,100 +1,100 @@
-//存放基础通用配置
-
-export const baseOption = {
-  tooltip: {
-    trigger: "axis",
-    // 设置边框样式
-    borderColor: '#fff',
-    borderWidth: 1,
-    borderRadius: 4,
-    // 设置阴影效果
-    shadowColor: 'rgba(102, 114, 144, 0.16)',
-    shadowBlur: 14,
-    shadowOffsetX: 0,
-    shadowOffsetY: 4,
-    padding: [14, 16, 18, 16],
-    formatter: (param) => {
-      let dom = `<div style="color: #141617;font-size:14px;font-weight:600;line-height: 18px;margin-bottom:18px;">${param[0].name}</div>`;
-      param.forEach((p, index) => {
-        dom += `<div style="color:#141617;font-size:14px;line-height: 18px;display:flex;align-items:center;margin-bottom:${index + 1 == param.length ? '' : '12px'};">
-        <span style="margin-right:32px;display:inline-flex;align-items:center">
-          <span style="display:inline-block;margin-right:8px;border-radius:6px;width:6px;height:6px;background-color:${p.color};"></span>
-          ${p.seriesName}
-        </span>
-        <span>${p.value}</span>
-        </div>`
-      })
-      return dom
-    }
-  },
-  legend: {
-    show: true,
-    bottom: 0,
-    itemWidth: 14,
-    itemHeight: 14,
-    itemStyle: {
-      borderWidth: 0,
-    },
-    inactiveBorderWidth: 0,
-    itemGap: 32,
-    borderRadius: 2,
-    icon: "roundRect",
-    textStyle: {
-      fontWeight: 400,
-      fontSize: 14
-    },
-    data: [],
-  },
-  grid: {
-    left: 0,
-    right: 0,
-    bottom: 40,
-    top: 30,
-    containLabel: true,
-  },
-  xAxis: {
-    type: "category",
-    boundaryGap: true,
-    axisLabel: {
-      margin: 11,
-      color: "#8F99A3",
-      fontSize: 14,
-    },
-    axisTick: {
-      show: false,
-    },
-    axisLine: {
-      show: true,
-      lineStyle: {
-        color: "#A4AFBB",
-      },
-    },
-    axisPointer: {
-      snap: true,
-    },
-    data: [],
-  },
-  yAxis: {
-    type: "value",
-    inverse: false,
-    axisLine: {
-      show: false,
-      lineStyle: {
-        color: "#C0CCD7",
-      },
-    },
-    splitLine: {
-      show: true,
-      lineStyle: {
-        type: "dashed",
-        color: "#DDE2EB",
-        dashOffset: 10,
-      },
-    },
-    axisLabel: {
-      margin: 8,
-      color: "#8F99A3",
-      fontSize: 13,
-    },
-  },
+//存放基础通用配置
+
+export const baseOption = {
+  tooltip: {
+    trigger: "axis",
+    // 设置边框样式
+    borderColor: '#fff',
+    borderWidth: 1,
+    borderRadius: 4,
+    // 设置阴影效果
+    shadowColor: 'rgba(102, 114, 144, 0.16)',
+    shadowBlur: 14,
+    shadowOffsetX: 0,
+    shadowOffsetY: 4,
+    padding: [14, 16, 18, 16],
+    formatter: (param) => {
+      let dom = `<div style="color: #141617;font-size:14px;font-weight:600;line-height: 18px;margin-bottom:18px;">${param[0].name}</div>`;
+      param.forEach((p, index) => {
+        dom += `<div style="color:#141617;font-size:14px;line-height: 18px;display:flex;align-items:center;margin-bottom:${index + 1 == param.length ? '' : '12px'};">
+        <span style="margin-right:32px;display:inline-flex;align-items:center">
+          <span style="display:inline-block;margin-right:8px;border-radius:6px;width:6px;height:6px;background-color:${p.color};"></span>
+          ${p.seriesName}
+        </span>
+        <span>${p.value}</span>
+        </div>`
+      })
+      return dom
+    }
+  },
+  legend: {
+    show: true,
+    bottom: 0,
+    itemWidth: 14,
+    itemHeight: 14,
+    itemStyle: {
+      borderWidth: 0,
+    },
+    inactiveBorderWidth: 0,
+    itemGap: 32,
+    borderRadius: 2,
+    icon: "roundRect",
+    textStyle: {
+      fontWeight: 400,
+      fontSize: 14
+    },
+    data: [],
+  },
+  grid: {
+    left: 0,
+    right: 0,
+    bottom: 40,
+    top: 30,
+    containLabel: true,
+  },
+  xAxis: {
+    type: "category",
+    boundaryGap: true,
+    axisLabel: {
+      margin: 11,
+      color: "#8F99A3",
+      fontSize: 14,
+    },
+    axisTick: {
+      show: false,
+    },
+    axisLine: {
+      show: true,
+      lineStyle: {
+        color: "#A4AFBB",
+      },
+    },
+    axisPointer: {
+      snap: true,
+    },
+    data: [],
+  },
+  yAxis: {
+    type: "value",
+    inverse: false,
+    axisLine: {
+      show: false,
+      lineStyle: {
+        color: "#C0CCD7",
+      },
+    },
+    splitLine: {
+      show: true,
+      lineStyle: {
+        type: "dashed",
+        color: "#DDE2EB",
+        dashOffset: 10,
+      },
+    },
+    axisLabel: {
+      margin: 8,
+      color: "#8F99A3",
+      fontSize: 13,
+    },
+  },
 }