aring
/
tiny-vue
forked from opentiny/tiny-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(eslint): fix eslint error (#935)

This commit is contained in:
ajaxzheng 2023-11-25 18:22:18 +08:00 committed by GitHub
parent eee8e3df29
commit 4004ecd3b3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
525 changed files with 2884 additions and 2922 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.js
View File

@ -20,6 +20,7 @@ module.exports = {
'vue/prefer-separate-static-class': 'off',
'vue/comma-dangle': 'off',
'vue/prefer-template': 'off',
'vue/no-unused-refs': 'off',
'vue/singleline-html-element-content-newline': 'off',
'curly': 'off',
'sort-imports': 'off',
@ -34,7 +35,6 @@ module.exports = {
'prefer-const': 'off',
'multiline-ternary': 'off',
'@typescript-eslint/comma-dangle': 'off',
// '@typescript-eslint/indent': 'off',
'@typescript-eslint/no-unsafe-assignment': 'off',
'@typescript-eslint/no-unsafe-call': 'off',
'@typescript-eslint/no-unsafe-member-access': 'off',

4
examples/react-docs/package.json
View File

@ -17,8 +17,8 @@
"devDependencies": {
"@types/react": "^18.2.14",
"@types/react-dom": "^18.2.6",
"@typescript-eslint/eslint-plugin": "^5.61.0",
"@typescript-eslint/parser": "^5.61.0",
"@typescript-eslint/eslint-plugin": "^6.12.0",
"@typescript-eslint/parser": "^6.12.0",
"@vitejs/plugin-react": "^4.0.1",
"autoprefixer": "^10.4.12",
"eslint": "^8.44.0",

4
package.json
View File

@ -25,8 +25,6 @@
"bugs": {
"url": "https://github.com/opentiny/tiny-vue/issues"
},
"sideEffects": false,
"type": "module",
"main": "packages/index.js",
"engines": {
"node": ">=16",
@ -143,7 +141,7 @@
"@types/eslint": "^8.4.10",
"@types/node": "^18.11.18",
"@types/shelljs": "^0.8.12",
"@typescript-eslint/parser": "^5.48.0",
"@typescript-eslint/parser": "^6.12.0",
"@volar-plugins/eslint": "^2.0.0",
"@volar-plugins/prettier": "^2.0.0",
"@volar-plugins/prettyhtml": "^2.0.0",

27
packages/react-common/src/event.ts
View File

@ -2,15 +2,14 @@ import { eventBus } from './utils'
const $busMap = new Map()
export const emit = (props) => (evName, ...args) => {
const reactEvName = 'on'
+ evName.substr(0, 1).toUpperCase()
+ evName.substr(1)
export const emit =
(props) =>
(evName, ...args) => {
const reactEvName = 'on' + evName.substr(0, 1).toUpperCase() + evName.substr(1)
if (props[reactEvName] && typeof props[reactEvName] === 'function') {
props[reactEvName](...args)
}
else {
} else {
const $bus = $busMap.get(props)
if ($bus) {
$bus.emit(evName, ...args)
@ -21,8 +20,7 @@ export const on = (props) => (evName, callback) => {
if ($busMap.get(props)) {
const $bus = $busMap.get(props)
$bus.on(evName, callback)
}
else {
} else {
const $bus = eventBus()
$bus.on(evName, callback)
$busMap.set(props, $bus)
@ -43,8 +41,7 @@ export const once = (props) => (evName, callback) => {
if ($busMap.get(props)) {
$bus = $busMap.get(props)
$bus.on(evName, onceCallback)
}
else {
} else {
$bus = eventBus()
$bus.on(evName, onceCallback)
$busMap.set(props, $bus)
@ -54,8 +51,8 @@ export const emitEvent = (vm) => {
const broadcast = (vm, componentName, eventName, ...args) => {
const children = vm.$children
Array.isArray(children)
&& children.forEach((child) => {
Array.isArray(children) &&
children.forEach((child) => {
const name = child.$options && child.$options.componentName
const component = child
@ -63,8 +60,7 @@ export const emitEvent = (vm) => {
component.emit(eventName, ...args)
// todo: 调研 component.$emitter
// component.$emitter && component.$emitter.emit(eventName, params)
}
else {
} else {
broadcast(child, componentName, eventName, ...args)
}
})
@ -78,8 +74,7 @@ export const emitEvent = (vm) => {
while (parent && parent.type && (!name || name !== componentName)) {
parent = parent.$parent
if (parent)
name = parent.$options && parent.$options.componentName
if (parent) name = parent.$options && parent.$options.componentName
}
if (parent) {

22
packages/react-common/src/fiber.ts
View File

@ -21,7 +21,8 @@ function defaultBreaker({ type }) {
export function traverseFiber(fiber, handler, breaker = defaultBreaker) {
if (!fiber) return
typeof handler === 'function' && handler(fiber)
Array.isArray(handler) && handler.forEach(task => {
Array.isArray(handler) &&
handler.forEach((task) => {
typeof task === 'function' && task(fiber)
})
traverseFiber(fiber.sibling, handler, breaker)
@ -41,21 +42,20 @@ export function getParentFiber(fiber, isFirst = true, child = fiber) {
export function creatFiberCombine(fiber) {
if (!fiber) return
const refs = {};
const children = [];
const refs = {}
const children = []
traverseFiber(fiber.child, [
(fiber) => {
if (typeof fiber.type === 'string' && fiber.stateNode.getAttribute('v_ref')) {
refs[fiber.stateNode.getAttribute('v_ref')] = fiber.stateNode;
}
else if (fiber.memoizedProps.v_ref) {
refs[fiber.memoizedProps.v_ref] = fiber;
refs[fiber.stateNode.getAttribute('v_ref')] = fiber.stateNode
} else if (fiber.memoizedProps.v_ref) {
refs[fiber.memoizedProps.v_ref] = fiber
}
},
(fiber) => {
if (fiber.type && typeof fiber.type !== 'string') {
children.push(fiber);
children.push(fiber)
}
}
])
@ -74,11 +74,7 @@ export function useFiber() {
useEffect(() => {
if (ref.current) {
const current_fiber = getFiberByDom(ref.current)
setParent(
getParentFiber(
current_fiber.return
)
)
setParent(getParentFiber(current_fiber.return))
setCurrent(current_fiber.return)
}
}, [])

4
packages/react-common/src/hooks.ts
View File

@ -1,4 +1,4 @@
import { useState, useRef } from "react"
import { useState, useRef } from 'react'
export function useExcuteOnce(cb, ...args) {
const isExcuted = useRef(false)
@ -12,7 +12,7 @@ export function useExcuteOnce(cb, ...args) {
export function useReload() {
const [_, reload] = useState(0)
return () => reload(pre => pre + 1)
return () => reload((pre) => pre + 1)
}
export function useOnceResult(func, ...args) {

38
packages/react-common/src/index.ts
View File

@ -1,4 +1,3 @@
import { useEffect } from 'react'
import { Svg } from './svg-render'
import { generateVueHooks, useVueLifeHooks } from './vue-hooks.js'
import { emitEvent } from './event.js'
@ -9,6 +8,7 @@ import { useVm } from './vm.js'
import { twMerge } from 'tailwind-merge'
import { stringifyCssClass } from './csscls.js'
import { useExcuteOnce, useReload, useOnceResult } from './hooks.js'
// 导入 vue 响应式系统
import { effectScope, nextTick, reactive } from '@vue/runtime-core'
import { useCreateVueInstance } from './vue-instance'
@ -29,17 +29,7 @@ export const $props = {
export const mergeClass = (...cssClasses) => twMerge(stringifyCssClass(cssClasses))
const setup = ({
props,
renderless,
api,
extendOptions = {},
classes = {},
constants,
vm,
parent,
$bus
}) => {
const setup = ({ props, renderless, api, extendOptions = {}, classes = {}, constants, vm, parent, $bus }) => {
const render = typeof props.tiny_renderless === 'function' ? props.tiny_renderless : renderless
const { dispatch, broadcast } = emitEvent(vm)
@ -71,7 +61,7 @@ const setup = ({
a: filterAttrs,
m: mergeClass,
vm: utils.vm,
gcls: (key) => getElementCssClass(classes, key),
gcls: (key) => getElementCssClass(classes, key)
}
if (Array.isArray(api)) {
@ -87,14 +77,7 @@ const setup = ({
return attrs
}
export const useSetup = ({
props,
renderless,
api,
extendOptions = {},
classes = {},
constants
}) => {
export const useSetup = ({ props, renderless, api, extendOptions = {}, classes = {}, constants }) => {
const $bus = useOnceResult(() => eventBus())
// 刷新逻辑
@ -157,18 +140,7 @@ export const useSetup = ({
}
}
export {
Svg,
If,
Component,
Slot,
For,
Transition,
vc,
emitEvent,
useVm,
useFiber,
}
export { Svg, If, Component, Slot, For, Transition, vc, emitEvent, useVm, useFiber }
export * from './vue-hooks.js'
export * from './vue-props.js'

40
packages/react-common/src/reactive.ts
View File

@ -3,30 +3,23 @@ import { computed } from './vue-hooks'
// 响应式核心
const reactiveMap = new WeakMap()
const reactive = (
const reactive = (staticObject, handler = {}, path = [], rootStaticObject = staticObject) => {
reactiveMap.has(staticObject) ||
reactiveMap.set(
staticObject,
handler = {},
path = [],
rootStaticObject = staticObject
) => {
reactiveMap.has(staticObject) || reactiveMap.set(staticObject, new Proxy(staticObject, {
get(
target,
property,
receiver
) {
new Proxy(staticObject, {
get(target, property, receiver) {
const targetVal = target[property]
if (targetVal && targetVal['v-hooks-type'] === computed) {
return targetVal.value
}
const _path = [...path, property]
const res = typeof targetVal === 'object'
? reactive(targetVal, handler, _path, rootStaticObject)
: targetVal
const res = typeof targetVal === 'object' ? reactive(targetVal, handler, _path, rootStaticObject) : targetVal
// 监听访问
handler.get && handler.get({
handler.get &&
handler.get({
result: res,
root: rootStaticObject,
path: _path,
@ -37,12 +30,7 @@ const reactive = (
return res
},
set(
target,
property,
value,
receiver
) {
set(target, property, value, receiver) {
const targetVal = target[property]
if (targetVal && targetVal['v-hooks-type'] === computed) {
targetVal.value = value
@ -52,7 +40,8 @@ const reactive = (
const _path = [...path, property]
// 监听修改
handler.set && handler.set({
handler.set &&
handler.set({
target,
property,
receiver,
@ -65,21 +54,22 @@ const reactive = (
target[property] = value
return true
}
}))
})
)
return reactiveMap.get(staticObject)
}
export const useReload = () => {
const setReload = useState(0)[1]
return () => setReload(pre => pre + 1)
return () => setReload((pre) => pre + 1)
}
const isObject = (val) => val !== null && typeof val === 'object'
// 用于从 hooks 链表中查找 reactive 生成的 state
export function Reactive(obj) {
Object.keys(obj).forEach(key => {
Object.keys(obj).forEach((key) => {
this[key] = obj[key]
})
}

4
packages/react-common/src/render-stack.ts
View File

@ -1,8 +1,8 @@
const renderStack = []
export const getParent = () => renderStack[renderStack.length - 1] || ({})
export const getParent = () => renderStack[renderStack.length - 1] || {}
export const getRoot = () => renderStack[0] || ({})
export const getRoot = () => renderStack[0] || {}
export const EnterStack = (props) => {
renderStack.push(props)

15
packages/react-common/src/resolve-props.ts
View File

@ -2,13 +2,11 @@
const reactEventPrefix = /^on[A-Z]/
export function getEventByReactProps(props) {
const $listeners = {}
Object
.keys(props)
.filter(propName => {
return reactEventPrefix.test(propName)
&& typeof props[propName] === 'function'
Object.keys(props)
.filter((propName) => {
return reactEventPrefix.test(propName) && typeof props[propName] === 'function'
})
.map(reactEvName => {
.map((reactEvName) => {
return {
reactEvName,
vueEvName: reactEvName.substr(2).toLowerCase()
@ -23,9 +21,8 @@ export function getEventByReactProps(props) {
}
export function getAttrsByReactProps(props) {
const $attrs = {}
Object
.keys(props)
.filter(propName => {
Object.keys(props)
.filter((propName) => {
return !reactEventPrefix.test(propName) && !['children'].includes(propName)
})
.forEach((attr) => {

36
packages/react-common/src/utils.ts
View File

@ -42,9 +42,7 @@ export const eventBus = () => {
return
}
$bus[eventName] = $bus[eventName].filter(
subscriber => subscriber !== callback
)
$bus[eventName] = $bus[eventName].filter((subscriber) => subscriber !== callback)
}
const emit = (eventName, ...args) => {
@ -52,7 +50,7 @@ export const eventBus = () => {
return
}
$bus[eventName].forEach(subscriber => subscriber(...args))
$bus[eventName].forEach((subscriber) => subscriber(...args))
}
const once = (eventName, callback) => {
@ -78,25 +76,19 @@ export const eventBus = () => {
export function VueClassName(className) {
if (typeof className === 'string') {
return className
}
else if (Array.isArray(className)) {
} else if (Array.isArray(className)) {
return className.reduce((pre, cur, index) => {
if (typeof cur === 'string') {
return `${pre}${index === 0 ? '' : ' '}${cur}`
}
else {
} else {
return `${pre}${index === 0 ? '' : ' '}${VueClassName(cur)}`
}
}, '')
}
else if (typeof className === 'object') {
return Object
.keys(className)
.reduce((pre, key, index) => {
} else if (typeof className === 'object') {
return Object.keys(className).reduce((pre, key, index) => {
if (className[key]) {
return `${pre}${index === 0 ? '' : ' '}${key}`
}
else {
} else {
return pre
}
}, '')
@ -119,19 +111,19 @@ export const getElementCssClass = (classes = {}, key) => {
}
export function getPropByPath(obj, path) {
let tempObj = obj;
let tempObj = obj
// 将a[b].c转换为a.b.c
path = path.replace(/\[(\w+)\]/g, '.$1');
path = path.replace(/\[(\w+)\]/g, '.$1')
// 将.a.b转换为a.b
path = path.replace(/^\./, '');
path = path.replace(/^\./, '')
let keyArr = path.split('.');
let len = keyArr.length;
let keyArr = path.split('.')
let len = keyArr.length
for (let i = 0; i < len - 1; i++) {
let key = keyArr[i];
let key = keyArr[i]
if (key in tempObj) {
tempObj = tempObj[key];
tempObj = tempObj[key]
} else {
return
}

61
packages/react-common/src/vm.ts
View File

@ -1,8 +1,5 @@
import { useFiber, getParentFiber, creatFiberCombine } from './fiber.js'
import {
getEventByReactProps,
getAttrsByReactProps
} from './resolve-props.js'
import { getEventByReactProps, getAttrsByReactProps } from './resolve-props.js'
import { Reactive } from './reactive.js'
import { emit, on, off, once } from './event.js'
@ -10,19 +7,11 @@ const vmProxy = {
$parent: ({ fiber }) => {
const parentFiber = getParentFiber(fiber)
if (!parentFiber) return null
return createVmProxy(
creatFiberCombine(
parentFiber
)
)
return createVmProxy(creatFiberCombine(parentFiber))
},
$el: ({ fiber }) => fiber.child?.stateNode,
$refs: ({ refs, fiber }) => createRefsProxy(refs, fiber.constructor),
$children: ({ children }) => children.map((fiber) => createVmProxy(
creatFiberCombine(
getParentFiber(fiber)
)
)),
$children: ({ children }) => children.map((fiber) => createVmProxy(creatFiberCombine(getParentFiber(fiber)))),
$listeners: ({ fiber }) => getEventByReactProps(fiber.memoizedProps),
$attrs: ({ fiber }) => getAttrsByReactProps(fiber.memoizedProps),
$slots: ({ fiber }) => fiber.memoizedProps.slots,
@ -39,58 +28,50 @@ const vmProxy = {
$on: ({ fiber }) => on(fiber.memoizedProps),
$once: ({ fiber }) => once(fiber.memoizedProps),
$off: ({ fiber }) => off(fiber.memoizedProps),
$set: () => (target, propName, value) => target[propName] = value
$set: () => (target, propName, value) => (target[propName] = value)
}
const vmProxyMap = new WeakMap()
function createVmProxy(fiberCombine) {
if (!vmProxyMap.has(fiberCombine)) {
vmProxyMap.set(fiberCombine, new Proxy(fiberCombine, {
get(
target,
property,
receiver
) {
vmProxyMap.set(
fiberCombine,
new Proxy(fiberCombine, {
get(target, property, receiver) {
if (!vmProxy[property]) {
return target.fiber.memoizedProps[property]
}
return vmProxy[property](target, receiver)
},
set(
target,
property,
value
) {
set(target, property, value) {
return true
}
}))
})
)
}
return vmProxyMap.get(fiberCombine)
}
function createEmptyProxy() {
return new Proxy({}, {
return new Proxy(
{},
{
get() {
return undefined
},
set() {
return true
}
})
}
)
}
function createRefsProxy(refs, FiberNode) {
return new Proxy(refs, {
get(
target,
property
) {
get(target, property) {
if (target[property] instanceof FiberNode) {
return createVmProxy(
creatFiberCombine(target[property])
)
}
else {
return createVmProxy(creatFiberCombine(target[property]))
} else {
return target[property]
}
}
@ -105,9 +86,7 @@ function findStateInHooks(hookStart) {
if (refCurrent instanceof Reactive) break
curHook = curHook.next
}
return curHook
&& curHook.memoizedState
&& curHook.memoizedState.current
return curHook && curHook.memoizedState && curHook.memoizedState.current
}
export function useVm() {

8
packages/react-common/src/vue-hooks.ts
View File

@ -38,9 +38,7 @@ import { useEffect } from 'react'
const inject = () => {}
const provide = () => {}
export function generateVueHooks({
$bus
}) {
export function generateVueHooks({ $bus }) {
const reload = () => $bus.emit('event:reload')
function toPageLoad(reactiveHook, reload) {
@ -53,9 +51,9 @@ export function generateVueHooks({
typeof reload === 'function' && reload()
},
{
flush: "sync"
flush: 'sync'
}
);
)
})
return result
}

28
packages/react-common/src/vue-instance.ts
View File

@ -12,11 +12,11 @@ const collectRefs = (rootEl, $children) => {
// 收集普通元素 ref
traverseFiber(rootFiber, (fiber) => {
if (typeof fiber.type === 'string' && fiber.stateNode.getAttribute('v-ref')) {
refs[fiber.stateNode.getAttribute('v-ref')] = fiber.stateNode;
refs[fiber.stateNode.getAttribute('v-ref')] = fiber.stateNode
}
})
// 收集组件元素 ref
$children.forEach(child => {
$children.forEach((child) => {
if (child.$props['v-ref']) {
refs[child.$props['v-ref']] = child
}
@ -24,14 +24,12 @@ const collectRefs = (rootEl, $children) => {
return refs
}
export function useCreateVueInstance({
$bus,
props
}) {
export function useCreateVueInstance({ $bus, props }) {
const ref = useRef()
const vm = useOnceResult(() => reactive({
const vm = useOnceResult(() =>
reactive({
$el: undefined,
$options: props.$options || ({}),
$options: props.$options || {},
$props: props,
$parent: getParent().vm || {},
$root: getRoot().vm || {},
@ -43,17 +41,12 @@ export function useCreateVueInstance({
$children: [],
$refs: computed(() => collectRefs(vm.$el, vm.$children)),
// 方法
$set: (target, property, value) => target[property] = value,
$set: (target, property, value) => (target[property] = value),
$delete: (target, property) => delete target[property],
$watch: (expression, callback, options) => {
if (typeof expression === 'string') {
watch(
() => getPropByPath(vm, expression),
callback,
options
)
}
else if (typeof expression === 'function') {
watch(() => getPropByPath(vm, expression), callback, options)
} else if (typeof expression === 'function') {
watch(expression, callback, options)
}
},
@ -65,7 +58,8 @@ export function useCreateVueInstance({
$nextTick: nextTick,
$destroy: () => {},
$mount: () => {}
}))
})
)
useExcuteOnce(() => {
const { $listeners } = props

21
packages/react-common/src/vue-props.ts
View File

@ -4,28 +4,25 @@ export function defineVueProps(propsOptions, props) {
const $listeners = {}
const reactEventPrefix = /^on[A-Z]/
const propsArray = Array.isArray(propsOptions) ? propsOptions : Object.keys(propsOptions);
Object.keys(props).forEach(key => {
const propsArray = Array.isArray(propsOptions) ? propsOptions : Object.keys(propsOptions)
Object.keys(props).forEach((key) => {
if (propsArray.includes(key)) {
$props[key] = props[key]
}
else {
} else {
if (reactEventPrefix.test(key)) {
$listeners[key.substr(2).toLowerCase()] = props[key]
}
else {
} else {
$attrs[key] = props[key]
}
}
});
})
if (typeof propsOptions === 'object') {
Object
.keys(propsOptions)
.filter(key => !$props[key])
.forEach(key => {
Object.keys(propsOptions)
.filter((key) => !$props[key])
.forEach((key) => {
const options = propsOptions[key]
const defaultValue = (typeof options.default === 'function') ? options.default() : options.default
const defaultValue = typeof options.default === 'function' ? options.default() : options.default
defaultValue !== undefined && ($props[key] = defaultValue)
})
}

1
packages/react/mobile-first.ts
View File

@ -1,6 +1,5 @@
import Alert from '@opentiny/react-alert/src/mobile-first'
import Button from '@opentiny/react-button/src/mobile-first'
import { $prefix } from '@opentiny/react-common'
const components = [Alert, Button]

10
packages/react/src/alert/src/index.ts
View File

@ -3,15 +3,13 @@ import mobile from './mobile'
import mobileFirst from './mobile-first'
export default function (props) {
const {
tiny_mode = 'pc'
} = props
const { tiny_mode = 'pc' } = props
const S = ({
const S = {
pc,
mobile,
'mobile-first': mobileFirst
})[tiny_mode]
}[tiny_mode]
return (S(props))
return S(props)
}

10
packages/react/src/badge/src/index.ts
View File

@ -2,14 +2,12 @@ import pc from './pc'
import mobile from './mobile'
export default function (props) {
const {
tiny_mode = 'pc'
} = props
const { tiny_mode = 'pc' } = props
const S = ({
const S = {
pc,
mobile
})[tiny_mode]
}[tiny_mode]
return (S(props))
return S(props)
}

10
packages/react/src/button/src/index.ts
View File

@ -3,15 +3,13 @@ import mobile from './mobile'
import mobileFirst from './mobile-first'
export default function (props) {
const {
tiny_mode = 'pc'
} = props
const { tiny_mode = 'pc' } = props
const S = ({
const S = {
pc,
mobile,
'mobile-first': mobileFirst
})[tiny_mode]
}[tiny_mode]
return (S(props))
return S(props)
}

2
packages/react/src/switch/index.ts
View File

@ -1,3 +1,3 @@
import Switch from "./src/index"
import Switch from './src/index'
export default Switch

20
packages/react/src/switch/src/index.ts
View File

@ -9,19 +9,19 @@ const $constants = {
}
}
export default function (props) {
const {
tiny_mode = 'pc',
_constants = $constants
} = props || {}
const { tiny_mode = 'pc', _constants = $constants } = props || {}
const defaultProps = Object.assign({
const defaultProps = Object.assign(
{
_constants,
tiny_mode
}, props)
},
props
)
const S = ({
pc,
})[tiny_mode]
const S = {
pc
}[tiny_mode]
return (S && S(defaultProps))
return S && S(defaultProps)
}

2
packages/renderless/src/action-menu/index.ts
View File

@ -10,7 +10,7 @@
*
*/
import { IActionMenuRenderlessParams, IActionMenuItemData } from '@/types'
import type { IActionMenuRenderlessParams, IActionMenuItemData } from '@/types'
export const handleMoreClick = (emit: IActionMenuRenderlessParams['emit']) => () => {
emit('more-click')

2
packages/renderless/src/action-menu/vue.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
IActionMenuApi,
IActionMenuProps,
IActionMenuState,

2
packages/renderless/src/alert/index.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import { IAlertRenderlessParams } from '@/types'
import type { IAlertRenderlessParams } from '@/types'
export const handleClose =
({ emit, state }: Pick<IAlertRenderlessParams, 'emit' | 'state'>) =>

8
packages/renderless/src/alert/vue.ts
View File

@ -10,7 +10,13 @@
*
*/
import { IAlertApi, IAlertProps, IAlertState, ISharedRenderlessParamHooks, IAlertRenderlessParamUtils } from '@/types'
import type {
IAlertApi,
IAlertProps,
IAlertState,
ISharedRenderlessParamHooks,
IAlertRenderlessParamUtils
} from '@/types'
import { handleClose, computedGetIcon, computedGetTitle, handleHeaderClick } from './index'
export const api = ['handleClose', 'state', 'handleHeaderClick']

2
packages/renderless/src/anchor/index.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import { IAnchorRenderlessParams, IAnchorLinkItem } from '@/types'
import type { IAnchorRenderlessParams, IAnchorLinkItem } from '@/types'
import { addClass, removeClass } from '../common/deps/dom'
export const setFixAnchor =

2
packages/renderless/src/anchor/vue.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICElinksMapNSES FOR MORE DETAILS.
*
*/
import {
import type {
IAnchorState,
IAnchorProps,
IAnchorApi,

2
packages/renderless/src/badge/index.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import { IBadgeRenderlessParams, IBadgeContent } from '@/types'
import type { IBadgeRenderlessParams, IBadgeContent } from '@/types'
export const computedContent =
({ props, state }: Pick<IBadgeRenderlessParams, 'props' | 'state'>) =>

2
packages/renderless/src/badge/vue.ts
View File

@ -12,7 +12,7 @@
import { computedContent, computedValueRef } from './index'
import { xss } from '../common/xss'
import { IBadgeState, IBadgeProps, IBadgeApi, IBadgeRenderlessParams } from '@/types'
import type { IBadgeState, IBadgeProps, IBadgeApi, IBadgeRenderlessParams } from '@/types'
export const api = ['state']

11
packages/renderless/src/breadcrumb-item/index.ts
View File

@ -1,7 +1,14 @@
import { IBreadcrumbItemProps } from '@/types'
import type { IBreadcrumbItemProps } from '@/types'
export const linkClick =
({ props, refs, router, emit, breadcrumbEmitter, constants }: Pick<IBreadcrumbItemProps, 'props' | 'refs' | 'router' | 'emit' | 'breadcrumbEmitter' | 'constants'>) =>
({
props,
refs,
router,
emit,
breadcrumbEmitter,
constants
}: Pick<IBreadcrumbItemProps, 'props' | 'refs' | 'router' | 'emit' | 'breadcrumbEmitter' | 'constants'>) =>
(event: MouseEvent) => {
const { replace, to, option } = props
const currentBreadcrumbItem = { link: refs.link, replace, to, event, option }

13
packages/renderless/src/breadcrumb-item/vue.ts
View File

@ -10,12 +10,21 @@
*
*/
import { IBreadcrumbItemProps, IBreadcrumbItemApi, IBreadcrumbItemRenderlessParamUtils, ISharedRenderlessParamHooks } from '@/types'
import type {
IBreadcrumbItemProps,
IBreadcrumbItemApi,
IBreadcrumbItemRenderlessParamUtils,
ISharedRenderlessParamHooks
} from '@/types'
import { linkClick } from './index'
export const api = ['linkClick']
export const renderless = (props: IBreadcrumbItemProps, { inject }: ISharedRenderlessParamHooks, { refs, router, emit }: IBreadcrumbItemRenderlessParamUtils) => {
export const renderless = (
props: IBreadcrumbItemProps,
{ inject }: ISharedRenderlessParamHooks,
{ refs, router, emit }: IBreadcrumbItemRenderlessParamUtils
) => {
const breadcrumbEmitter = inject('breadcrumbEmitter')
const breadcrumb = inject('breadcrumb')
const constants = breadcrumb._constants

10
packages/renderless/src/breadcrumb/index.ts
View File

@ -10,10 +10,14 @@
*
*/
import { IBreadcrumbRenderlessParams } from '@/types'
import type { IBreadcrumbRenderlessParams } from '@/types'
export const breadcrumbItemSelect = ({ api, emit, state, constants }: Pick<IBreadcrumbRenderlessParams, 'api' | 'emit' | 'state' | 'constants'>) =>
{
export const breadcrumbItemSelect = ({
api,
emit,
state,
constants
}: Pick<IBreadcrumbRenderlessParams, 'api' | 'emit' | 'state' | 'constants'>) => {
state.breadcrumbEmitter.on(constants.EVENT_NAME.breadcrumbItemSelect, (value) => {
state.currentBreadcrumbItem = value
emit('select', value)

14
packages/renderless/src/breadcrumb/vue.ts
View File

@ -10,12 +10,22 @@
*
*/
import { IBreadcrumbProps, IBreadcrumbState, IBreadcrumbApi, IBreadcrumbRenderlessParamUtils, ISharedRenderlessParamHooks } from '@/types'
import type {
IBreadcrumbProps,
IBreadcrumbState,
IBreadcrumbApi,
IBreadcrumbRenderlessParamUtils,
ISharedRenderlessParamHooks
} from '@/types'
import { breadcrumbItemSelect } from './index'
export const api = ['breadcrumbItemSelect']
export const renderless = (props: IBreadcrumbProps, { reactive, provide }: ISharedRenderlessParamHooks, { emit, constants, emitter }: IBreadcrumbRenderlessParamUtils): IBreadcrumbApi => {
export const renderless = (
props: IBreadcrumbProps,
{ reactive, provide }: ISharedRenderlessParamHooks,
{ emit, constants, emitter }: IBreadcrumbRenderlessParamUtils
): IBreadcrumbApi => {
const state: IBreadcrumbState = reactive({
breadcrumbEmitter: emitter(),
currentBreadcrumbItem: {}

2
packages/renderless/src/button-group/index.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import { IButtonGroupRenderlessParams, IButtonGroupNode, IButtonGroupItemClass } from '@/types'
import type { IButtonGroupRenderlessParams, IButtonGroupNode, IButtonGroupItemClass } from '@/types'
export const handleChange =
({ emit, state }: Pick<IButtonGroupRenderlessParams, 'emit' | 'state'>) =>

2
packages/renderless/src/button-group/vue.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import {
import type {
IButtonGroupState,
ISharedRenderlessParamHooks,
IButtonGroupProps,

2
packages/renderless/src/button/index.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import { IButtonRenderlessParams, IButtonState } from '@/types'
import type { IButtonRenderlessParams, IButtonState } from '@/types'
export const handleClick =
({ emit, props, state }: Pick<IButtonRenderlessParams, 'emit' | 'props' | 'state'>) =>

9
packages/renderless/src/button/vue.ts
View File

@ -9,13 +9,8 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import {
IButtonState,
ISharedRenderlessParamHooks,
IButtonProps,
IButtonApi,
IButtonRenderlessParamUtils
} from '@/types'
import type { ISharedRenderlessParamHooks, IButtonProps, IButtonApi, IButtonRenderlessParamUtils } from '@/types'
import { handleClick, clearTimer } from './index'
export const api = ['state', 'handleClick']

8
packages/renderless/src/calendar-view/index.ts
View File

@ -161,7 +161,7 @@ const getCalendarItem = function (item, props, isFunction, type, isNext, isLast)
for (let i = item.start; i <= item.end; i++) {
let disabled = type === 'cur' && isFunction ? props.disabled(item.year + '-' + item.month + '-' + i) : false
res.push({ value: i, year: item.year, month: item.month, isNext: isNext, isLast: isLast, disabled })
res.push({ value: i, year: item.year, month: item.month, isNext, isLast, disabled })
}
return res
}
@ -297,7 +297,7 @@ export const getEventByMonth =
const startTime = getTime(date + ' ' + state.dayStartTime)
const endTime = getTime(date + ' ' + state.dayEndTime)
const obj = {
date: date,
date,
day: state.weekDays[new Date(date).getDay()],
events: []
}
@ -377,7 +377,7 @@ export const getEventByTime =
(day, start, end) => {
const date = typeof day === 'object' ? day.year + '-' + day.month + '-' + day.value : day
const startTime = getTime(date + ' ' + start)
const endTime = getTime(date + ' ' + (end ? end : start))
const endTime = getTime(date + ' ' + (end || start))
let result = []
if (state.mode === 'timeline') {
@ -413,7 +413,7 @@ export const isStartOrEndDay =
(type, day, start, end, event) => {
const date = day.toString().length > 2 ? day : state.activeYear + '-' + state.activeMonth + '-' + day
const startTime = getTime(date + ' ' + start)
const endTime = getTime(date + ' ' + (end ? end : start))
const endTime = getTime(date + ' ' + (end || start))
if (type === 'start') {
return event.start >= startTime && event.start < endTime

2
packages/renderless/src/calendar-view/vue.ts
View File

@ -76,7 +76,7 @@ const initState = ({ reactive, props, computed, api, images, modesIcon }) => {
dayStartTime: props._constants.DAY_START_TIME,
dayEndTime: props._constants.DAY_END_TIME,
wednesday: props._constants.WEDNESDAY,
modesIcon: modesIcon,
modesIcon,
images,
weekDays: [0, 1, 2, 3, 4, 5, 6],
dayTimes: computed(() => api.genDayTimes()),

2
packages/renderless/src/cascader-menu/index.ts
View File

@ -10,7 +10,7 @@
*
*/
import { ICascaderMenuRenderlessParamUtils, ICascaderMenuRenderlessParams, ICascaderMenuState } from '@/types'
import type { ICascaderMenuRenderlessParamUtils, ICascaderMenuRenderlessParams, ICascaderMenuState } from '@/types'
export const handleExpand = (state: ICascaderMenuState) => (e: MouseEvent) =>
(state.activeNode = e.target as HTMLElement)

2
packages/renderless/src/cascader-menu/vue.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
ICascaderMenuState,
ICascaderMenuProps,
ISharedRenderlessParamHooks,

10
packages/renderless/src/cascader-mobile/index.ts
View File

@ -13,11 +13,11 @@ export const syncCheckStatus =
(value) => {
const { valueField, textField, modelValue: propsModelValue, visible } = props
const { lazy, isLeaf: leafField } = api.getNodeConfig()
let currentData,
navList = [],
modelValue = value || propsModelValue || [],
len = modelValue.length,
isLeaf
let currentData
let navList = []
let modelValue = value || propsModelValue || []
let len = modelValue.length
let isLeaf
if (!visible) {
return

4
packages/renderless/src/cascader-mobile/vue.ts
View File

@ -52,8 +52,8 @@ export const renderless = (props, { computed, reactive, watch }, { emit, constan
filterOptions: []
},
options: computed(() => {
let arr,
list = [state.rootData]
let arr
let list = [state.rootData]
state.navList.map((option) => {
arr = option.childNodes
arr && arr.length && list.push(arr)

2
packages/renderless/src/cascader-node/index.ts
View File

@ -10,7 +10,7 @@
*
*/
import { ICascaderNodeRenderlessParams, ICascaderPanelNode } from '@/types'
import type { ICascaderNodeRenderlessParams, ICascaderPanelNode } from '@/types'
export const comptCheckPath =
({ api, parent, state }: Pick<ICascaderNodeRenderlessParams, 'api' | 'parent' | 'state'>) =>

2
packages/renderless/src/cascader-node/vue.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
ICascaderNodeApi,
ICascaderNodeProps,
ISharedRenderlessParamHooks,

4
packages/renderless/src/cascader-panel/index.ts
View File

@ -15,7 +15,7 @@ import { isEqual } from '../common/object'
import { isEmpty } from '../cascader'
import { KEY_CODE, CASCADER } from '../common'
import scrollIntoViewCommon from '../common/deps/scroll-into-view'
import {
import type {
ICascaderPanelApi,
ICascaderPanelData,
ICascaderPanelLazyLoadNode,
@ -350,7 +350,7 @@ export const getCheckedNodes =
const node = api.getNodeByValue(state.checkedValue)
return (isEmpty(state.checkedValue) || !node) ? [] : [node]
return isEmpty(state.checkedValue) || !node ? [] : [node]
}
export const clearCheckedNodes =

7
packages/renderless/src/cascader-panel/node.ts
View File

@ -9,7 +9,12 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import { ICascaderPanelConfig, ICascaderPanelData, ICascaderPanelNodePropValue, ICascaderPanelNodeValue } from '@/types'
import type {
ICascaderPanelConfig,
ICascaderPanelData,
ICascaderPanelNodePropValue,
ICascaderPanelNodeValue
} from '@/types'
import { isEqual } from '../common/object'
import { capitalize } from '../common/string'

7
packages/renderless/src/cascader-panel/store.ts
View File

@ -10,12 +10,7 @@
*
*/
import {
ICascaderPanelConfig,
ICascaderPanelData,
ICascaderPanelNode,
ICascaderPanelNodePropValue
} from '@/types'
import type { ICascaderPanelConfig, ICascaderPanelData, ICascaderPanelNode, ICascaderPanelNodePropValue } from '@/types'
import Node from './node'
import { valueEquals, coerceTruthyValueToArray as toArray } from './index'

2
packages/renderless/src/cascader-panel/vue.ts
View File

@ -37,7 +37,7 @@ import {
import { merge } from '../common/object'
import { isEmpty } from '../cascader'
import Store from './store.js'
import {
import type {
ICascaderPanelApi,
ICascaderPanelProps,
ICascaderPanelRenderlessParamUtils,

116
packages/renderless/src/cascader-view/index.ts
View File

@ -1,23 +1,31 @@
import TreeStore from '../common/deps/tree-model/tree-store'
export const close = ({ state, emit }) => () => {
export const close =
({ state, emit }) =>
() => {
state.search.show = false
emit('update:visible', false)
emit('close', false)
}
export const syncCheckStatus = ({ state, api }) => (value) => {
export const syncCheckStatus =
({ state, api }) =>
(value) => {
value && state.store.setDefaultCheckedKey(value)
state.checkList = api.getCheckedNodes()
}
export const watchModelValue = ({ props, state, emit }) => () => {
export const watchModelValue =
({ props, state, emit }) =>
() => {
const { textSplit } = props
emit('update:text', state.checkLabels.join(textSplit))
}
export const watchVisible = ({ emit, state, props, api }) => (visible) => {
export const watchVisible =
({ emit, state, props, api }) =>
(visible) => {
const { modelValue } = props
if (visible) {
@ -34,7 +42,9 @@ export const watchVisible = ({ emit, state, props, api }) => (visible) => {
const hasChildren = (option) => option && !option.isLeaf
export const selectOption = ({ emit, state, api }) => (option, deep = true) => {
export const selectOption =
({ emit, state, api }) =>
(option, deep = true) => {
const isAdd = !option.checked || option.indeterminate
if (option.disabled) {
@ -46,7 +56,9 @@ export const selectOption = ({ emit, state, api }) => (option, deep = true) => {
emit('click', option, isAdd)
}
export const nodeExpand = ({ emit, state, props, api }) => (option) => {
export const nodeExpand =
({ emit, state, props, api }) =>
(option) => {
if (option.isLeaf) {
return
}
@ -106,10 +118,12 @@ export const nodeExpand = ({ emit, state, props, api }) => (option) => {
}
}
export const confirm = ({ emit, state, props }) => () => {
export const confirm =
({ emit, state, props }) =>
() => {
const { emitPath, valueField } = props
let value,
data = []
let value
let data = []
state.computedCheckList.forEach((node) => {
if (node.waitLoad) {
@ -126,7 +140,9 @@ export const confirm = ({ emit, state, props }) => () => {
emit('update:modelValue', data)
}
export const loopSearchOption = ({ state, props, api }) => (param) => {
export const loopSearchOption =
({ state, props, api }) =>
(param) => {
const { options, prefixText = '', textSplit = '/', checkStrictly } = param || {}
const { valueField, textField, childrenField } = props
const { input } = state.search
@ -139,7 +155,7 @@ export const loopSearchOption = ({ state, props, api }) => (param) => {
const childNodes = item[childrenField]
const len = childNodes && childNodes.length
if ((checkStrictly || (!checkStrictly && !len)) && text.indexOf(input) > -1) {
if ((checkStrictly || (!checkStrictly && !len)) && text.includes(input)) {
list.push({
[valueField]: value,
[textField]: textNavStr
@ -160,7 +176,9 @@ export const loopSearchOption = ({ state, props, api }) => (param) => {
return list
}
export const filterOptionsHandler = ({ state, props }) => (list) => {
export const filterOptionsHandler =
({ state, props }) =>
(list) => {
const { valueField } = props
state.search.loaded = true
@ -172,7 +190,9 @@ export const filterOptionsHandler = ({ state, props }) => (list) => {
})
}
export const searchMethod = ({ state, props, api }) => () => {
export const searchMethod =
({ state, props, api }) =>
() => {
const { searchConfig } = props
const { input, options } = state.search
let list = []
@ -191,7 +211,9 @@ export const searchMethod = ({ state, props, api }) => () => {
}
}
export const searchBoxToggle = ({ state, props, api }) => (bool) => {
export const searchBoxToggle =
({ state, props, api }) =>
(bool) => {
const { searchConfig = {} } = props
const { lazy } = api.getNodeConfig()
state.search.show = bool
@ -206,53 +228,73 @@ export const searchBoxToggle = ({ state, props, api }) => (bool) => {
}
}
export const isSelected = ({ state }) => (option) => {
export const isSelected =
({ state }) =>
(option) => {
const { navList } = state
return navList.some((item) => item === option)
return navList.includes(option)
}
export const created = ({ api }) => () => {
export const created =
({ api }) =>
() => {
api.initTreeStore()
}
export const setLevel = ({ state, api }) => (level, option) => {
export const setLevel =
({ state, api }) =>
(level, option) => {
if (!api.disabledNavOption(level, option)) {
state.level = level
}
}
export const searchSelectHandler = ({ emit, api }) => (option) => {
export const searchSelectHandler =
({ emit, api }) =>
(option) => {
api.selectOption(option)
emit('search-click', option)
}
export const renderSearchOption = ({ state }) => (text) => {
export const renderSearchOption =
({ state }) =>
(text) => {
return (text || '').split(state.search.input)
}
export const loadData = ({ props, state }) => (data) => {
export const loadData =
({ props, state }) =>
(data) => {
props.visible && state.store.setData(data)
}
export const computedNavListHandler = ({ state, props, t }) => () => {
export const computedNavListHandler =
({ state, props, t }) =>
() => {
const { textField } = props
return [{ data: { [textField]: t('ui.base.all') } }, ...state.navList]
}
export const disabledNavOption = ({ state }) => (level, option) => {
export const disabledNavOption =
({ state }) =>
(level, option) => {
const node = state.navList[level]
return option.selfWaitLoad && (!node || !node.childNodes.length)
}
export const getNodeConfig = ({ constants, props }) => () => {
export const getNodeConfig =
({ constants, props }) =>
() => {
const { nodeConfig, valueField, childrenField } = props
return Object.assign({ nodeKey: valueField, children: childrenField }, constants.defaultNodeConfig, nodeConfig)
}
export const initTreeStore = ({ props, state, api }) => () => {
export const initTreeStore =
({ props, state, api }) =>
() => {
const { data, valueField, textField, visible, modelValue } = props
const {
lazy,
@ -332,7 +374,9 @@ export const initTreeStore = ({ props, state, api }) => () => {
}
}
export const clean = ({ state }) => () => {
export const clean =
({ state }) =>
() => {
const { options, waitLoadList } = state.selected
state.selected.removeList = [...waitLoadList, ...options]
@ -340,11 +384,15 @@ export const clean = ({ state }) => () => {
state.selected.waitLoadList = []
}
export const getCheckedNodes = ({ state }) => () => {
export const getCheckedNodes =
({ state }) =>
() => {
return state.store.getCheckedNodes(!state.store.checkStrictly, false, true)
}
export const toggleCheckList = ({ state, props, api }) => (show) => {
export const toggleCheckList =
({ state, props, api }) =>
(show) => {
const { valueField } = props
if (!state.computedCheckList.length) {
@ -374,7 +422,9 @@ export const toggleCheckList = ({ state, props, api }) => (show) => {
}
}
export const removeOption = ({ state }) => (option) => {
export const removeOption =
({ state }) =>
(option) => {
const { options, waitLoadList } = state.selected
let index
@ -387,13 +437,17 @@ export const removeOption = ({ state }) => (option) => {
}
}
export const computedSelectedListHandler = ({ state }) => () => {
export const computedSelectedListHandler =
({ state }) =>
() => {
const { options, waitLoadList } = state.selected
return [...waitLoadList, ...options]
}
export const inputKeyword = ({ state, api }) => () => {
export const inputKeyword =
({ state, api }) =>
() => {
const { search } = state
const show = !!search.input
if (search.show !== show) {

4
packages/renderless/src/cascader-view/vue.ts
View File

@ -75,8 +75,8 @@ export const renderless = (props, { computed, reactive, watch }, { t, emit, cons
waitLoadList: []
},
options: computed(() => {
let data,
list = [state.rootData]
let data
let list = [state.rootData]
state.navList.map((option) => {
data = option.childNodes
data && data.length && list.push(data)

2
packages/renderless/src/chart-core/deps/numerify.ts
View File

@ -30,7 +30,7 @@ function getBoundedPrecision(value, maxDecimals, optionals) {
function toFixed(value, maxDecimals, roundingFunction, optionals) {
let boundedPrecision = getBoundedPrecision(value, maxDecimals, optionals)
let power = Math.pow(10, boundedPrecision)
let power = 10 ** boundedPrecision
let output = (roundingFunction(value * `1e+${boundedPrecision}`) / power).toFixed(boundedPrecision)

2
packages/renderless/src/chart-core/index.ts
View File

@ -43,7 +43,7 @@ const isStack = ({ props }) => {
Object.keys(stack).forEach((key) => {
stack[key].forEach((stackItem) => {
const isExist = columns.some((col) => col === stackItem)
const isExist = columns.includes(stackItem)
if (isExist) {
flag = true
}

9
packages/renderless/src/checkbox-button/vue.ts
View File

@ -21,7 +21,14 @@ import {
computedIsDisabled,
toggleEvent
} from './index'
import { addToStore, computedIsChecked, computedStore, computedIsLimitDisabled, computedIsShowText, computedShowText } from '../checkbox'
import {
addToStore,
computedIsChecked,
computedStore,
computedIsLimitDisabled,
computedIsShowText,
computedShowText
} from '../checkbox'
export const api = ['state', 'handleChange']

2
packages/renderless/src/checkbox/index.ts
View File

@ -10,7 +10,7 @@
*
*/
import { ICheckboxRenderlessParams, ICheckboxState, ICheckboxChangeEvent, ICheckboxProps } from '@/types'
import type { ICheckboxRenderlessParams, ICheckboxState, ICheckboxChangeEvent, ICheckboxProps } from '@/types'
import { isNull } from '../common/type'
export const addToStore =

2
packages/renderless/src/checkbox/vue.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
ICheckboxApi,
ICheckboxProps,
ICheckboxState,

20
packages/renderless/src/collapse-item/index.ts
View File

@ -10,9 +10,7 @@
*
*/
import {
ICollapseItemRenderlessParams
} from '@/types'
import type { ICollapseItemRenderlessParams } from '@/types'
export const handleFocus =
({ state, interval }: Pick<ICollapseItemRenderlessParams, 'state' | 'interval'>) =>
@ -27,7 +25,14 @@ export const handleFocus =
}
export const handleHeaderClick =
({ componentName, dispatch, eventName, props, parent, state }: Pick<ICollapseItemRenderlessParams, 'componentName' | 'dispatch' | 'eventName' | 'props' | 'parent' | 'state'>) =>
({
componentName,
dispatch,
eventName,
props,
parent,
state
}: Pick<ICollapseItemRenderlessParams, 'componentName' | 'dispatch' | 'eventName' | 'props' | 'parent' | 'state'>) =>
() => {
if (props.disabled) {
return
@ -40,6 +45,11 @@ export const handleHeaderClick =
}
export const handleEnterClick =
({ componentName, dispatch, eventName, parent }: Pick<ICollapseItemRenderlessParams, 'componentName' | 'dispatch' | 'eventName' | 'parent'>) =>
({
componentName,
dispatch,
eventName,
parent
}: Pick<ICollapseItemRenderlessParams, 'componentName' | 'dispatch' | 'eventName' | 'parent'>) =>
() =>
dispatch(componentName, eventName, parent)

8
packages/renderless/src/collapse-item/vue.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
ICollapseItemProps,
ICollapseItemState,
ICollapseItemApi,
@ -22,7 +22,11 @@ import { guid } from '../common/string'
export const api = ['state', 'isActive', 'handleFocus', 'handleEnterClick', 'handleHeaderClick']
export const renderless = (props: ICollapseItemProps, { computed, reactive }: ISharedRenderlessParamHooks, { parent, constants, dispatch }: ICollapseItemRenderlessParamUtils) => {
export const renderless = (
props: ICollapseItemProps,
{ computed, reactive }: ISharedRenderlessParamHooks,
{ parent, constants, dispatch }: ICollapseItemRenderlessParamUtils
) => {
const _constants = parent.collapse._constants
const componentName = _constants.COMPONENT_NAME.Collapse
const eventName = _constants.EVENT_NAME.CollapseItemClick

4
packages/renderless/src/collapse/index.ts
View File

@ -9,9 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import {
ICollapseRenderlessParams
} from '@/types'
import type { ICollapseRenderlessParams } from '@/types'
export const setActiveNames =
({ emit, props, state }: Pick<ICollapseRenderlessParams, 'emit' | 'props' | 'state'>) =>

8
packages/renderless/src/collapse/vue.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import {
import type {
ICollapseProps,
ICollapseState,
ICollapseApi,
@ -21,7 +21,11 @@ import { setActiveNames, handleItemClick } from './index'
export const api = ['state']
export const renderless = (props: ICollapseProps, { reactive, watch }: ISharedRenderlessParamHooks, { parent, emit, constants }: ICollapseRenderlessParamUtils) => {
export const renderless = (
props: ICollapseProps,
{ reactive, watch }: ISharedRenderlessParamHooks,
{ parent, emit, constants }: ICollapseRenderlessParamUtils
) => {
const eventName = constants.EVENT_NAME.CollapseItemClick
const state: ICollapseState = reactive({

38
packages/renderless/src/color-picker/index.ts
View File

@ -1,13 +1,7 @@
import { IColorPickerRef as Ref } from '@/types'
import type { IColorPickerRef as Ref } from '@/types'
import type Color from './utils/color'
export const onCancel = (
tmpColor: Color,
triggerBg: Ref<string>,
isShow: Ref<boolean>,
pre: Ref<string>,
emit
) => {
export const onCancel = (tmpColor: Color, triggerBg: Ref<string>, isShow: Ref<boolean>, pre: Ref<string>, emit) => {
return (color: Ref<Color>) => {
tmpColor.reset(color.value.getHex())
triggerBg.value = pre.value
@ -16,13 +10,7 @@ export const onCancel = (
}
}
export const onConfirm = (
triggerBg: Ref<string>,
pre: Ref<string>,
hex: Ref<string>,
isShow: Ref<boolean>,
emit
) => {
export const onConfirm = (triggerBg: Ref<string>, pre: Ref<string>, hex: Ref<string>, isShow: Ref<boolean>, emit) => {
return (color: string) => {
pre.value = triggerBg.value
triggerBg.value = color
@ -32,30 +20,22 @@ export const onConfirm = (
}
}
export const onHueUpdate = (
tmpColor: Color,
triggerBg: Ref<string>
) => {
export const onHueUpdate = (tmpColor: Color, triggerBg: Ref<string>) => {
return (h: number) => {
triggerBg.value = tmpColor.getHex();
triggerBg.value = tmpColor.getHex()
tmpColor.set({ h })
}
}
export const onSVUpdate = (
tmpColor: Color,
triggerBg: Ref<string>
) => {
export const onSVUpdate = (tmpColor: Color, triggerBg: Ref<string>) => {
return ({ s, v }) => {
triggerBg.value = tmpColor.getHex();
triggerBg.value = tmpColor.getHex()
tmpColor.set({ s, v })
}
}
export const onColorUpdate = (
triggerBg: Ref<string>
) => {
export const onColorUpdate = (triggerBg: Ref<string>) => {
return (color: Ref<Color>) => {
triggerBg.value = color.value.getHex();
triggerBg.value = color.value.getHex()
}
}

8
packages/renderless/src/color-picker/utils/color.ts
View File

@ -40,7 +40,7 @@ export default class Color {
private s = 0
private v = 0
private a = 100
private preH = 0;
private preH = 0
private enableAlpha = false
constructor(value: string, alpha = false) {
this.reset(value)
@ -62,16 +62,18 @@ export default class Color {
this.s = s
this.v = v
this.a = a
this.preH = h;
this.preH = h
}
set({ h, s, v, a }: { h?: number; s?: number; v?: number; a?: number }) {
this.h = h ?? this.h
this.s = s ?? this.s
this.v = v ?? this.v
this.a = a ?? this.a
}
setPrevH(val: number) {
this.preH = val;
this.preH = val
}
/**

28
packages/renderless/src/color-picker/vue.ts
View File

@ -1,4 +1,4 @@
import { IColorSelectPanelRef as Ref } from '@/types'
import type { IColorSelectPanelRef as Ref } from '@/types'
import Color from './utils/color'
import { onConfirm, onCancel, onHueUpdate, onSVUpdate, onColorUpdate } from './index'
@ -25,12 +25,8 @@ export const renderless = (props, context, { emit }) => {
const changeVisible = (state: boolean) => {
isShow.value = state
}
const stack: Ref<string[]> = context.ref(
[...(history?.value ?? [])]
)
const predefineStack: Ref<string[]> = context.ref(
[...(predefine?.value ?? [])]
)
const stack: Ref<string[]> = context.ref([...(history?.value ?? [])])
const predefineStack: Ref<string[]> = context.ref([...(predefine?.value ?? [])])
const state = context.reactive({
isShow,
hex,
@ -49,17 +45,25 @@ export const renderless = (props, context, { emit }) => {
onSVUpdate: onSVUpdate(tmpColor, triggerBg),
onColorUpdate: onColorUpdate(triggerBg)
}
context.watch(predefine, (newPredefine: string[]) => {
context.watch(
predefine,
(newPredefine: string[]) => {
predefineStack.value = [...newPredefine]
}, { deep: true })
context.watch(history, (newHistory: string[]) => {
},
{ deep: true }
)
context.watch(
history,
(newHistory: string[]) => {
stack.value = [...newHistory]
}, { deep: true })
},
{ deep: true }
)
context.watch(modelValue, (newValue) => {
pre.value = newValue
hex.value = newValue
state.hex = newValue
state.triggerBg = newValue;
state.triggerBg = newValue
})
context.watch(visible, (visible) => {
isShow.value = visible

9
packages/renderless/src/color-select-panel/alpha-select/vue.ts
View File

@ -1,5 +1,5 @@
import { IColorSelectPanelRef as Ref } from '@/types'
import Color from '../utils/color'
import type { IColorSelectPanelRef as Ref } from '@/types'
import type Color from '../utils/color'
import { draggable } from '../utils/use-drag'
import { onDrag, updateThumb } from '.'
@ -23,7 +23,8 @@ export const renderless = (props, context, { emit }) => {
g.value = gg
b.value = bb
alpha.value = color.get('a')
}, {deep: true}
},
{ deep: true }
)
context.watch(alpha, (newAlpha) => {
updateThumb(newAlpha, alphaThumb.value, alphaWrapper.value)
@ -33,7 +34,7 @@ export const renderless = (props, context, { emit }) => {
return `linear-gradient(to right, rgba(${r.value}, ${g.value}, ${b.value}, 0) 0%, rgba(${r.value}, ${g.value}, ${b.value}, 1) 100%)`
})
const state = context.reactive({
background,
background
})
const api = {
state,

2
packages/renderless/src/color-select-panel/hue-select/index.ts
View File

@ -1,4 +1,4 @@
import { IColorSelectPanelRef } from '@/types'
import type { IColorSelectPanelRef } from '@/types'
import type Color from '../utils/color'
export const setPosition = (el: HTMLElement, x: number, y: number) => {

12
packages/renderless/src/color-select-panel/hue-select/vue.ts
View File

@ -1,7 +1,7 @@
import { IColorSelectPanelRef as Ref } from '@/types'
import type { IColorSelectPanelRef as Ref } from '@/types'
import { draggable } from '../utils/use-drag'
import { getThumbTop, resetCursor, updateThumb, updateCursor } from './index'
import Color from '../utils/color'
import type Color from '../utils/color'
export const api = ['state', 'cursor', 'wrapper', 'bar', 'thumb']
export const renderless = (props, context, { emit, expose }) => {
@ -18,10 +18,14 @@ export const renderless = (props, context, { emit, expose }) => {
})
const api = { state, cursor, wrapper, bar, thumb }
context.watch(()=>props, ()=>{
context.watch(
() => props,
() => {
h.value = color.get('h')
resetCursor(color.get('s'), color.get('v'), wrapper, cursor, thumb, color, h)
}, {deep: true})
},
{ deep: true }
)
context.watch(h, (newHue: string) => {
state.background = `hsl(${newHue}deg, 100%, 50%)`
})

6
packages/renderless/src/color-select-panel/index.ts
View File

@ -1,4 +1,4 @@
import { IColorSelectPanelRef } from '@/types'
import type { IColorSelectPanelRef } from '@/types'
import Color from './utils/color'
export const onConfirm = (
@ -95,7 +95,7 @@ export const handleHistoryClick = (
res.value = history
const tmpColor = new Color(history)
color.value.set({
...tmpColor.getHSV(),
...tmpColor.getHSV()
})
emit('color-update', color)
}
@ -112,7 +112,7 @@ export const handlePredefineClick = (
res.value = selectedColor
const tmpColor = new Color(selectedColor)
color.value.set({
...tmpColor.getHSV(),
...tmpColor.getHSV()
})
emit('color-update', color)
}

2
packages/renderless/src/color-select-panel/utils/color.ts
View File

@ -64,12 +64,14 @@ export default class Color {
this.v = v
this.a = a
}
set({ h, s, v, a }: { h?: number; s?: number; v?: number; a?: number }) {
this.h = h ?? this.h
this.s = s ?? this.s
this.v = v ?? this.v
this.a = a ?? this.a
}
setPrevH(val: number) {
this.preH = val
}

10
packages/renderless/src/color-select-panel/vue.ts
View File

@ -1,4 +1,4 @@
import { IColorSelectPanelRef as Ref } from '@/types'
import type { IColorSelectPanelRef as Ref } from '@/types'
import Color from './utils/color'
import { onConfirm, onCancel, onHSVUpdate, onAlphaUpdate, handleHistoryClick, handlePredefineClick } from '.'
@ -58,9 +58,13 @@ export const renderless = (props, context, { emit }) => {
},
{ deep: true }
)
context.watch(state,()=>{
context.watch(
state,
() => {
state.color = state.color
}, {deep: true})
},
{ deep: true }
)
context.watch(modelValue, (newValue) => {
pre.value = res.value
hex.value = newValue

2
packages/renderless/src/common/bigInt.ts
View File

@ -186,7 +186,7 @@ export class BigIntDecimal {
const trimRet = trimNumber(mergedValue)
this.negative = trimRet.negative
const numbers = trimRet.trimStr.split('.')
this.integer = numbers[0].indexOf('e') === -1 ? BigInt(numbers[0]) : numbers[0]
this.integer = !numbers[0].includes('e') ? BigInt(numbers[0]) : numbers[0]
const decimalStr = numbers[1] || '0'
this.decimal = convertBigInt(decimalStr)
this.decimalLen = decimalStr.length

4
packages/renderless/src/common/calendar/calendar.ts
View File

@ -97,8 +97,8 @@ export const getCalendar = (year, month) => {
end: lastDays
},
current: {
year: year,
month: month,
year,
month,
start: 1,
end: days
},

18
packages/renderless/src/common/deps/popper.ts
View File

@ -132,8 +132,8 @@ const getOffsetRectRelativeToCustomParent = (el: HTMLElement, parent: HTMLElemen
// 如果是fixed定位，直接返回相对视口位置
if (fixed) {
return {
top: top,
left: left,
top,
left,
bottom: top + height,
right: left + width,
width,
@ -357,10 +357,12 @@ class Popper {
return this
}
onUpdate(callback) {
this.state.updateCallback = callback
return this
}
update() {
let data = { instance: this, styles: {} } as unknown as UpdateData
@ -374,6 +376,7 @@ class Popper {
typeof this.state.updateCallback === 'function' && this.state.updateCallback(data)
}
/** 按顺序执行Modifiers， 如果传入终点modifier,则执行到指定位置 */
runModifiers(data: UpdateData, modifiers: Function[], ends?: Function) {
let modifiersToRun = modifiers.slice()
@ -394,6 +397,7 @@ class Popper {
return data
}
// 此时才把offsets.popper 赋值给popper dom, offsets.array赋值给array dom
applyStyle(data: UpdateData) {
let styles: any = { position: data.offsets.popper.position }
@ -416,6 +420,7 @@ class Popper {
return data
}
// 判断 placement是不是2段式的，是则处理一下偏移。 修改data.offsets.popper的值
shift(data: UpdateData) {
let placement = data.placement
@ -444,6 +449,7 @@ class Popper {
return data
}
// 校正popper的位置在boundaries 的内部
preventOverflow(data: UpdateData) {
let order = this._options.preventOverflowOrder
@ -493,6 +499,7 @@ class Popper {
})
return data
}
// 校正popper的位置在reference的边上。 如果2个分离了，重新调整popper的位置。 可能是担心 modifiers.offset 带来的副作用吧
keepTogether(data: UpdateData) {
let popper = getPopperClientRect(data.offsets.popper)
@ -516,6 +523,7 @@ class Popper {
return data
}
// 根据flip的策略，计算当前应该显示的位置。 空间不够要计算出flip的位置。 可能是担心preventOverflow 时，造成pop, reference会重叠。 重叠了就要flip一下
flip(data: UpdateData) {
// 只翻转一次，避免重复的flip
@ -563,6 +571,7 @@ class Popper {
})
return data
}
// 根据入参option上的offset, 给data.offset.popper进行校正
offset(data: UpdateData) {
let offset = this._options.offset
@ -580,6 +589,7 @@ class Popper {
return data
}
// 计算arrow的位置,保存在data.offsets.arrow ={top,left}
arrow(data: UpdateData) {
let arrow: string | HTMLElement = this._options.arrowElement // 小三角的dom
@ -650,6 +660,7 @@ class Popper {
let isParentFixed = isFixed(reference)
return isParentFixed ? 'fixed' : 'absolute'
}
/** 实时计算一下popper, reference的 位置信息， 用于 */
_getRefPopOffsets(popper, reference, placement) {
placement = placement.split('-')[0]
@ -689,6 +700,7 @@ class Popper {
reference: referenceOffsets
}
}
_setupEventListeners() {
this.state.updateBoundFn = this.update.bind(this)
@ -715,6 +727,7 @@ class Popper {
}
}
}
_removeEventListeners() {
off(window, 'resize', this.state.updateBoundFn)
@ -735,6 +748,7 @@ class Popper {
this.state.updateBoundFn = null as any
}
/** 实时计算一下Boundary的位置 */
_getBoundaries(data: UpdateData, padding: number, boundariesElement: string | HTMLElement) {
let boundaries = { right: 0, left: 0, top: 0, bottom: 0 }

10
packages/renderless/src/common/deps/touch-emulator.ts
View File

@ -74,19 +74,19 @@ const triggerTouch = (eventName, mouseEv) => {
}
const onMouse = (touchType) => (ev) => {
if ('mousedown' === ev.type) {
if (ev.type === 'mousedown') {
initiated = true
}
if ('mouseup' === ev.type) {
if (ev.type === 'mouseup') {
initiated = false
}
if ('mousemove' === ev.type && !initiated) {
if (ev.type === 'mousemove' && !initiated) {
return
}
if ('mousedown' === ev.type || !mouseTarget) {
if (ev.type === 'mousedown' || !mouseTarget) {
mouseTarget = ev.target
}
@ -94,7 +94,7 @@ const onMouse = (touchType) => (ev) => {
triggerTouch(touchType, ev)
}
if ('mouseup' === ev.type) {
if (ev.type === 'mouseup') {
eventTarget = null
mouseTarget = null
}

2
packages/renderless/src/common/deps/tree-model/tree-store.ts
View File

@ -401,7 +401,7 @@ export default class TreeStore {
getAllData() {
const children = this.props.children
const walkTree = (nodes) => {
return nodes.map(node => {
return nodes.map((node) => {
return { ...node.data, [children]: walkTree(node.childNodes) }
})
}

4
packages/renderless/src/common/deps/vue-popper.ts
View File

@ -13,8 +13,8 @@
import PopupManager from './popup-manager'
import PopperJS from './popper'
import { on } from './dom'
import { ISharedRenderlessFunctionParams } from 'types/shared.type'
import Popper from './popper'
import type { ISharedRenderlessFunctionParams } from 'types/shared.type'
import type Popper from './popper'
interface IPopperState {
popperJS: Popper

2
packages/renderless/src/common/deps/vue-popup.ts
View File

@ -13,7 +13,7 @@
import { merge } from '../object'
import PopupManager from './popup-manager'
import { addClass } from './dom'
import { ISharedRenderlessFunctionParams } from 'types/shared.type'
import type { ISharedRenderlessFunctionParams } from 'types/shared.type'
let idSeed = 1
const isServer = typeof window === 'undefined'

2
packages/renderless/src/common/event.ts
View File

@ -57,5 +57,5 @@ export const getActualTarget = (e) => {
if (!e || !e.target) {
return null
}
return (e.target.shadowRoot && e.composed) ? (e.composedPath()[0] || e.target) : e.target
return e.target.shadowRoot && e.composed ? e.composedPath()[0] || e.target : e.target
}

3
packages/renderless/src/common/index.ts
View File

@ -127,7 +127,8 @@ export const DATE = {
YearMonth: 'yyyy-MM'
}
const TriggerTypes = 'date,datetime,time,time-select,week,month,year,years,yearrange,daterange,monthrange,timerange,datetimerange,dates'
const TriggerTypes =
'date,datetime,time,time-select,week,month,year,years,yearrange,daterange,monthrange,timerange,datetimerange,dates'
export const DATEPICKER = {
Day: 'day',

84
packages/renderless/src/date-picker-mobile/index.ts
View File

@ -24,7 +24,9 @@ export const getDateStr = (year, month, day = '01', seperator = '/') => {
return arr.join(seperator)
}
export const getCurrentDate = ({ api, props }) => (dateValue) => {
export const getCurrentDate =
({ api, props }) =>
(dateValue) => {
const today = new Date()
const theDate = new Date(dateValue)
const year = theDate.getFullYear()
@ -38,7 +40,7 @@ export const getCurrentDate = ({ api, props }) => (dateValue) => {
return {
value: api.formatDate(theDate),
yearMonth: yearMonth,
yearMonth,
index,
day,
year,
@ -50,7 +52,9 @@ export const getCurrentDate = ({ api, props }) => (dateValue) => {
}
}
export const formatDate = ({ props, constants }) => (date, dateFormat) => {
export const formatDate =
({ props, constants }) =>
(date, dateFormat) => {
const { YEAR_MONTH_RANGE, YEAR_MONTH } = constants.TYPE
const defaultFormet = [YEAR_MONTH_RANGE, YEAR_MONTH].includes(props.type) ? 'yyyy/MM/01' : 'yyyy/MM/dd'
return format(date, dateFormat === undefined ? defaultFormet : dateFormat)
@ -63,7 +67,9 @@ const getDateFromStr = (dateStr, direction = 'top') => {
return new Date(yarr, month, 1)
}
export const loadingDate = ({ state, api }) => (direction) => {
export const loadingDate =
({ state, api }) =>
(direction) => {
const list = Object.keys(state.dateList)
const value = direction === 'top' ? list[0] : list[list.length - 1]
@ -77,7 +83,9 @@ export const loadingDate = ({ state, api }) => (direction) => {
}, 100)
}
export const initPanel = ({ state, api }) => ({ dateValue, direction, isInit }) => {
export const initPanel =
({ state, api }) =>
({ dateValue, direction, isInit }) => {
const currentDate = dateValue || (Array.isArray(state.date) ? state.date[0] : state.date) || new Date()
let month = currentDate.getMonth() + 1
@ -117,19 +125,25 @@ export const initPanel = ({ state, api }) => ({ dateValue, direction, isInit })
direction === 'top' ? Object.assign({}, dateList, state.dateList) : Object.assign({}, state.dateList, dateList)
}
export const getWeeksByMonth = ({ state }) => (yearMonth) => {
export const getWeeksByMonth =
({ state }) =>
(yearMonth) => {
const length = state.dateList[yearMonth].length
return Math.ceil(length / 7)
}
export const getDaysByWeek = ({ state, api }) => (yearMonth, week) => {
export const getDaysByWeek =
({ state, api }) =>
(yearMonth, week) => {
const length = state.dateList[yearMonth].length
const weeks = api.getWeeksByMonth(yearMonth)
return week === weeks ? length % 7 : 7
}
export const getDate = ({ state }) => ({ date, yearMonth, index }) => {
export const getDate =
({ state }) =>
({ date, yearMonth, index }) => {
let currentDate
if (date) {
@ -144,7 +158,9 @@ export const getDate = ({ state }) => ({ date, yearMonth, index }) => {
return currentDate || {}
}
export const getSelectedPosition = ({ state, api }) => (dateFormat) => {
export const getSelectedPosition =
({ state, api }) =>
(dateFormat) => {
const { selected } = state
const length = selected.length
@ -157,7 +173,9 @@ export const getSelectedPosition = ({ state, api }) => (dateFormat) => {
return index === 0 ? 'start' : index === length - 1 ? 'end' : index > -1 ? 'inner' : ''
}
export const watchVisible = ({ emit, api, state }) => (bool) => {
export const watchVisible =
({ emit, api, state }) =>
(bool) => {
if (bool) {
api.watchModelValue()
const currentDate = (Array.isArray(state.date) ? state.date[0] : state.date) || new Date()
@ -167,13 +185,15 @@ export const watchVisible = ({ emit, api, state }) => (bool) => {
emit('update:visible', bool)
}
export const scrollToCurrentDate = ({ state, vm, nextTick }) => ({ date, value }) => {
export const scrollToCurrentDate =
({ state, vm, nextTick }) =>
({ date, value }) => {
const { isYearMonthPanel, computedYears, months } = state
let field,
list,
year,
month,
index = -1
let field
let list
let year
let month
let index = -1
if (date) {
year = date.getFullYear()
@ -203,7 +223,9 @@ export const scrollToCurrentDate = ({ state, vm, nextTick }) => ({ date, value }
})
}
export const watchModelValue = ({ props, state, constants }) => () => {
export const watchModelValue =
({ props, state, constants }) =>
() => {
const { DATE, DATE_TIME, DATE_RANGE, DATE_TIME_RANGE, YEAR_MONTH_RANGE, YEAR_MONTH } = constants.TYPE
const { modelValue, type } = props
if ([DATE_RANGE, DATE_TIME_RANGE, YEAR_MONTH_RANGE].includes(type)) {
@ -230,7 +252,9 @@ export const watchModelValue = ({ props, state, constants }) => () => {
}
}
export const selectOption = ({ emit, state, props, constants }) => ({ value, index }) => {
export const selectOption =
({ emit, state, props, constants }) =>
({ value, index }) => {
const { DATE_RANGE, DATE_TIME_RANGE, YEAR_MONTH_RANGE, YEAR_MONTH } = constants.TYPE
const { type } = props
const { dateList, years } = state
@ -257,7 +281,9 @@ export const selectOption = ({ emit, state, props, constants }) => ({ value, ind
}
}
export const confirm = ({ emit, state, props, api, constants }) => () => {
export const confirm =
({ emit, state, props, api, constants }) =>
() => {
const { DATE_TIME, DATE_RANGE, DATE_TIME_RANGE, YEAR_MONTH_RANGE } = constants.TYPE
const { date, timeList } = state
const { type } = props
@ -287,20 +313,26 @@ export const confirm = ({ emit, state, props, api, constants }) => () => {
emit('update:modelValue', state.date)
}
export const timeConfirm = ({ emit, state }) => (value) => {
export const timeConfirm =
({ emit, state }) =>
(value) => {
state.timeVisible = false
state.timeList[state.showTimeIndex] = value
emit('time-confirm', value)
}
export const timeToggle = ({ state }) => (index) => {
export const timeToggle =
({ state }) =>
(index) => {
state.showTimeIndex = index
state.time = state.timeList[index]
state.timeVisible = true
}
export const selectedComputed = ({ state, props, constants, api }) => () => {
export const selectedComputed =
({ state, props, constants, api }) =>
() => {
const { type } = props
const { DATE_RANGE, DATE_TIME_RANGE, YEAR_MONTH_RANGE } = constants.TYPE
@ -334,7 +366,9 @@ export const selectedComputed = ({ state, props, constants, api }) => () => {
return state.date ? [api.formatDate(state.date)] : []
}
export const scrollStart = ({ state, api, props }) => () => {
export const scrollStart =
({ state, api, props }) =>
() => {
if (state.loading || !props.visible || !state.ready) {
return
}
@ -346,7 +380,9 @@ export const scrollStart = ({ state, api, props }) => () => {
api.scrollToCurrentDate({ value })
}
export const scrollEnd = ({ state, api }) => () => {
export const scrollEnd =
({ state, api }) =>
() => {
if (state.loading) {
return
}

6
packages/renderless/src/date-picker-mobile/vue.ts
View File

@ -36,11 +36,7 @@ export const api = [
'formatDate'
]
export const renderless = (
props,
{ computed, reactive, watch, onMounted },
{ emit, vm, nextTick, constants }
) => {
export const renderless = (props, { computed, reactive, watch, onMounted }, { emit, vm, nextTick, constants }) => {
const { DATE_RANGE, DATE_TIME_RANGE, YEAR_MONTH_RANGE, YEAR_MONTH } = constants.TYPE
const api = {}
const state = reactive({

10
packages/renderless/src/date-picker-mobile/year-month.ts
View File

@ -1,6 +1,8 @@
import { getDateStr } from './index'
export const initYearMonthPanel = ({ state, props }) => ({ dateValue, direction, isInit }) => {
export const initYearMonthPanel =
({ state, props }) =>
({ dateValue, direction, isInit }) => {
const years = []
const currentDate = dateValue || (Array.isArray(state.date) ? state.date[0] : state.date) || new Date()
let year = direction === 'top' ? currentDate.getFullYear() - state.yearNum : currentDate.getFullYear()
@ -21,7 +23,7 @@ export const initYearMonthPanel = ({ state, props }) => ({ dateValue, direction,
return {
value: getDateStr(currentYear, month),
year: currentYear,
month: month,
month,
disabled: typeof disabledDate === 'function' && !!disabledDate(new Date(currentYear, month - 1, 1)),
isToday: thisYear === currentYear && thisMonth === month
}
@ -31,7 +33,9 @@ export const initYearMonthPanel = ({ state, props }) => ({ dateValue, direction,
state.years = direction === 'top' ? Object.assign({}, years, state.years) : Object.assign({}, state.years, years)
}
export const loadYearMonth = ({ state, api }) => (direction) => {
export const loadYearMonth =
({ state, api }) =>
(direction) => {
const list = Object.keys(state.years)
let date

38
packages/renderless/src/date-picker/index.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
IDatePickerColumn,
IDatePickerConstants,
IDatePickerOriginColumn,
@ -19,7 +19,9 @@ import {
IDatePickerState
} from '@/types'
export const getMonthEndDay = (constants: IDatePickerConstants) => (year: number, month: number): number =>
export const getMonthEndDay =
(constants: IDatePickerConstants) =>
(year: number, month: number): number =>
constants.MonthDay - new Date(year, month - 1, constants.MonthDay).getDate()
export const getTrueValue = (value: string): number => {
@ -40,7 +42,10 @@ export const getTrueValue = (value: string): number => {
export const getBoundary =
({ api, constants, props }: Pick<IDatePickerRenderlessParams, 'api' | 'constants' | 'props'>) =>
({ type, value: val }: {
({
type,
value: val
}: {
type: string
value: Date
}): {
@ -83,7 +88,13 @@ export const getBoundary =
}
export const updateInnerValue =
({ api, constants, props, refs, state }: Pick<IDatePickerRenderlessParams, 'api' | 'constants' | 'props' | 'refs' | 'state'>) =>
({
api,
constants,
props,
refs,
state
}: Pick<IDatePickerRenderlessParams, 'api' | 'constants' | 'props' | 'refs' | 'state'>) =>
() => {
const indexes = refs.picker && refs.picker.getIndexes()
@ -118,7 +129,9 @@ export const updateInnerValue =
state.innerValue = api.formatValue(value)
}
export const formatValue = (props: IDatePickerProps) => (value: number): Date => {
export const formatValue =
(props: IDatePickerProps) =>
(value: number): Date => {
if (!Object.prototype.toString.call(value) === '[object Date]' && !isNaN(value.getTime())) {
value = props.minDate
}
@ -153,7 +166,13 @@ export const padZero = (num: number, targetLength = 2): string => {
}
export const updateColumnValue =
({ constants, nextTick, props, refs, state }: Pick<IDatePickerRenderlessParams, 'constants' | 'nextTick' | 'props' | 'refs' | 'state'>) =>
({
constants,
nextTick,
props,
refs,
state
}: Pick<IDatePickerRenderlessParams, 'constants' | 'nextTick' | 'props' | 'refs' | 'state'>) =>
() => {
const value = state.innerValue
const { formatter } = props
@ -309,7 +328,12 @@ export const getDisplayValue =
}
export const hookMounted =
({ constants, parent, refs, nextTick }: Pick<IDatePickerRenderlessParams, 'constants' | 'parent' | 'refs' | 'nextTick'>) =>
({
constants,
parent,
refs,
nextTick
}: Pick<IDatePickerRenderlessParams, 'constants' | 'parent' | 'refs' | 'nextTick'>) =>
() => {
nextTick(() => {
parent.$emit(constants.HookMounted, refs.refrence.$el)

2
packages/renderless/src/date-picker/vue.ts
View File

@ -28,7 +28,7 @@ import {
updateColumnValue
} from './index'
import { DATE } from '../common'
import {
import type {
IDatePickerApi,
IDatePickerProps,
IDatePickerRenderlessParamUtils,

4
packages/renderless/src/date-range/index.ts
View File

@ -586,7 +586,9 @@ export const computerLabel =
export const computerEnableYearArrow = (state) => () =>
state.unlinkPanels && state.rightYear * 12 + state.rightMonth - (state.leftYear * 12 + state.leftMonth + 1) >= 12
export const watchPickerVisible = ({ state, constants }) => (val) => {
export const watchPickerVisible =
({ state, constants }) =>
(val) => {
if (!val) {
state.singleSelect = false
state.minRangeDate = constants.startDate

2
packages/renderless/src/date-table/index.ts
View File

@ -21,7 +21,7 @@ import {
clearTime
} from '../common/deps/date-util'
import { DATEPICKER } from '../common'
import { IDateTableRow } from '@/types'
import type { IDateTableRow } from '@/types'
const formatJudg = ({ day, offset, j, i, cell, count, dateCountOfLastMonth }) => {
const nodfpm = day + offset < 0 ? 7 + day + offset : day + offset

7
packages/renderless/src/dropdown-item/index.ts
View File

@ -10,7 +10,12 @@
*
*/
import { IDropdownItemRenderlessParams, IDropdownItemStyle, IDropdownItemTag, IDropdownItemOptionStyle } from '@/types'
import type {
IDropdownItemRenderlessParams,
IDropdownItemStyle,
IDropdownItemTag,
IDropdownItemOptionStyle
} from '@/types'
import { on, off } from '../common/deps/dom'
export const getTitle = (props: IDropdownItemRenderlessParams['props']) => (): string => {

2
packages/renderless/src/dropdown-item/vue.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
IDropdownItemState,
IDropdownItemApi,
IDropdownItemProps,

2
packages/renderless/src/dropdown-menu/index.ts
View File

@ -10,7 +10,7 @@
*
*/
import { IDropdownMenuRenderlessParams, IDropdownMenuPopperParams, IDropdownItemVm } from '@/types'
import type { IDropdownMenuRenderlessParams, IDropdownMenuPopperParams, IDropdownItemVm } from '@/types'
import userPopper from '../common/deps/vue-popper'
export const toggleItem =

2
packages/renderless/src/dropdown-menu/vue.ts
View File

@ -10,7 +10,7 @@
*
*/
import {
import type {
IDropdownVm,
IDropdownMenuState,
IDropdownMenuApi,

3
packages/renderless/src/dropdown/index.ts
View File

@ -10,8 +10,7 @@
*
*/
import { IDropdownRenderlessParams } from '@/types'
import type { ComponentPublicInstance } from 'vue'
import type { IDropdownRenderlessParams } from '@/types'
import { KEY_CODE } from '../common'
import { addClass, removeClass, on, off } from '../common/deps/dom'

2
packages/renderless/src/dropdown/vue.ts
View File

@ -11,7 +11,7 @@
*/
import { guid } from '../common/string'
import {
import type {
IDropdownState,
IDropdownApi,
IDropdownProps,

24
packages/renderless/src/file-upload/index.ts
View File

@ -26,8 +26,7 @@ import type {
IFileUploadDownloadFileInner,
IFileUploadBatchSegmentDownload,
IFileUploadSliceDownloadChunk,
IFileUploadLargeDocumentDownload,
IFileUploadDownloadFileSingleInner
IFileUploadLargeDocumentDownload
} from '@/types'
import { extend } from '../common/object'
@ -349,10 +348,10 @@ const calcFileForMobile = (rawFile: File, file: IFileUploadFile) => {
const size = rawFile.size / 1024
if (size < 1024) {
file.size = Math.round(size * Math.pow(10, 1)) / Math.pow(10, 1) + 'KB'
file.size = Math.round(size * 10 ** 1) / 10 ** 1 + 'KB'
} else {
const fileSize = size / 1024
file.size = Math.round(fileSize * Math.pow(10, 1)) / Math.pow(10, 1) + 'MB'
file.size = Math.round(fileSize * 10 ** 1) / 10 ** 1 + 'MB'
}
}
@ -582,7 +581,7 @@ export const handleStart =
rawFiles.forEach((rawFile) => api.addFileToList(rawFile, updateId, reUpload))
const { UPLOADING, READY } = constants.FILE_STATUS
state.uploadingFiles = state.uploadFiles.filter((file) => [UPLOADING, READY].indexOf(file.status) > -1)
state.uploadingFiles = state.uploadFiles.filter((file) => [UPLOADING, READY].includes(file.status))
if (state.isEdm && state.isSuccess) {
rawFiles.forEach((rawFile) => {
@ -877,7 +876,7 @@ export const clearUploadingFiles =
({ constants, state }: Pick<IFileUploadRenderlessParams, 'constants' | 'state'>) =>
() => {
const { SUCESS, FAIL } = constants.FILE_STATUS
const isUploadComplete = state.uploadingFiles.every((file) => [SUCESS, FAIL].indexOf(file.status) > -1)
const isUploadComplete = state.uploadingFiles.every((file) => [SUCESS, FAIL].includes(file.status))
if (isUploadComplete) {
state.uploadingFiles = []
@ -1039,8 +1038,7 @@ const getTranslateFile =
} else {
const content = data.headers['content-disposition']
const name = content ? content.match(/fileName.?=(.*)/)[1] || content.match(/fileName=(.*)/)[1] : ''
const type =
name.indexOf('.') === -1
const type = !name.includes('.')
? data.headers['content-type']
: type !== 'zip'
? 'application / x - xls'
@ -1189,7 +1187,7 @@ export const validateDownloadStatus =
}
}
if (data.data && data.data.type && data.data.type.indexOf('application/json') > -1) {
if (data.data && data.data.type && data.data.type.includes('application/json')) {
const reader = new FileReader()
reader.onload = (e) => {
const errRes = JSON.parse(e.target.result)
@ -1199,7 +1197,7 @@ export const validateDownloadStatus =
return true
}
if (!isLessThan17G && data.headers['content-type'].indexOf('application/json') > -1) {
if (!isLessThan17G && data.headers['content-type'].includes('application/json')) {
const errRes = JSON.parse(String.fromCharCode.apply(null, new Uint8Array(data.data)))
errorHandle({ state, file, errRes, Modal, downloadOps })
return true
@ -1307,7 +1305,7 @@ export const downloadFileSingle =
.catch((data) => {
if (data.response && state.errorStatusCodes.includes(data.response.status)) {
const downloadOps = props.edm.download || {}
const tokenParams = { token: downloadOps.token, file: file, type: 'download' }
const tokenParams = { token: downloadOps.token, file, type: 'download' }
api.getToken(tokenParams).then((data) => {
api.afterDownload({ batchIndex, data, file, range, isChunk, isBatch, isLessThan17G })
})
@ -1491,7 +1489,7 @@ export const downloadFileSingleInner =
({ file, isBatch }) => {
const { SIZE_17G } = constants.EDM
const downloadOps = props.edm.download || {}
let tokenParams = { token: downloadOps.token, file: file, type: 'download' }
let tokenParams = { token: downloadOps.token, file, type: 'download' }
api.getToken(tokenParams).then((data) => {
if (!data) return
if (state.isHwh5) {
@ -2128,7 +2126,7 @@ export const sliceChunk =
state.batchQueueListen[file.docId + '-0'] = 0
for (let i = 0; i < chunkSize; i++) {
if (file.records.indexOf(i.toString()) > -1) {
if (file.records.includes(i.toString())) {
continue
}

2
packages/renderless/src/file-upload/vue.ts
View File

@ -9,7 +9,7 @@
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
import {
import type {
IFileUploadState,
IFileUploadApi,
IFileUploadProps,

4
packages/renderless/src/filter-bar/index.ts
View File

@ -1,4 +1,6 @@
export const click = ({ props, emit }) => (index) => {
export const click =
({ props, emit }) =>
(index) => {
const i = props.modelValue === index ? undefined : index
emit('update:modelValue', i)

42
packages/renderless/src/filter/index.ts
View File

@ -1,8 +1,10 @@
import { cloneDeep } from '../chart-core/deps/utils'
export const isEmpty = (value) => [undefined, null, ''].indexOf(value) !== -1
export const isEmpty = (value) => [undefined, null, ''].includes(value)
export const resize = ({ state, vm, props }) => () => {
export const resize =
({ state, vm, props }) =>
() => {
const refs = vm.$refs
if (state.showPanel) {
@ -18,7 +20,9 @@ export const resize = ({ state, vm, props }) => () => {
}
}
export const panelToggle = ({ state, props, api, emit }) => (index) => {
export const panelToggle =
({ state, props, api, emit }) =>
(index) => {
const { modelValue } = props
emit('panel', { index, modelValue })
@ -49,7 +53,9 @@ export const panelToggle = ({ state, props, api, emit }) => (index) => {
}
}
export const selectOption = ({ state, api }) => (value) => {
export const selectOption =
({ state, api }) =>
(value) => {
const {
selectPanel: { config }
} = state
@ -63,7 +69,9 @@ export const selectOption = ({ state, api }) => (value) => {
}
}
export const filterSelectOption = ({ state, props }) => (value, index) => {
export const filterSelectOption =
({ state, props }) =>
(value, index) => {
const { filterGroup } = props
if (filterGroup[index].type === 'tag' && !filterGroup[index].multiple) {
@ -71,7 +79,9 @@ export const filterSelectOption = ({ state, props }) => (value, index) => {
}
}
export const reset = ({ state, props }) => (isFilterGroup) => {
export const reset =
({ state, props }) =>
(isFilterGroup) => {
const { modelValue, filterValue } = props
if (isFilterGroup) {
@ -83,14 +93,18 @@ export const reset = ({ state, props }) => (isFilterGroup) => {
}
}
export const filterConfirm = ({ state, emit }) => () => {
export const filterConfirm =
({ state, emit }) =>
() => {
const filterValue = state.filterPanel.selected.slice()
state.filterPanel.show = false
emit('update:filter-value', cloneDeep(filterValue))
}
export const confirm = ({ state, props, emit, api }) => (isFilterGroup) => {
export const confirm =
({ state, props, emit, api }) =>
(isFilterGroup) => {
if (isFilterGroup) {
api.filterConfirm()
return
@ -112,14 +126,18 @@ export const confirm = ({ state, props, emit, api }) => (isFilterGroup) => {
emit('update:modelValue', modelValue.slice())
}
export const cancel = ({ state, emit }) => () => {
export const cancel =
({ state, emit }) =>
() => {
state.showPanelIndex = -1
state.filterPanel.show = false
emit('cancel', state)
}
export const labelListComputed = ({ props }) => () => {
export const labelListComputed =
({ props }) =>
() => {
const { data, modelValue } = props
return data.map((item, index) => {
@ -146,6 +164,8 @@ export const labelListComputed = ({ props }) => () => {
})
}
export const selectOptionAll = ({ state }) => () => {
export const selectOptionAll =
({ state }) =>
() => {
state.selectPanel.selected = []
}

12
packages/renderless/src/filter/tag-group.ts
View File

@ -1,13 +1,17 @@
import { isEmpty } from './index'
const selectOptionAll = ({ state, emit }) => () => {
const selectOptionAll =
({ state, emit }) =>
() => {
state.selected = []
emit('click', state.selected)
emit('update:modelValue', state.selected)
}
const selectOption = ({ state, props, emit }) => (value) => {
const selectOption =
({ state, props, emit }) =>
(value) => {
if (props.type === 'tag' && props.multiple) {
const index = state.selected.indexOf(value)
index === -1 ? state.selected.push(value) : state.selected.splice(index, 1)
@ -23,7 +27,9 @@ const selectOption = ({ state, props, emit }) => (value) => {
}
}
const setSelectedOption = ({ state }) => (value) => {
const setSelectedOption =
({ state }) =>
(value) => {
state.selected = isEmpty(value) ? [] : Array.isArray(value) ? value.slice() : [value]
}

4
packages/renderless/src/filter/vue.ts
View File

@ -41,9 +41,7 @@ export const renderless = (props, { reactive, computed, onMounted, onBeforeUnmou
labelList: computed(() => api.labelListComputed()),
showPanel: computed(() => state.showPanelIndex !== -1 || state.filterPanel.show),
hasFilterValue: computed(() =>
props.filterValue.find((item) =>
Array.isArray(item) ? item.length > 0 : [undefined, null, ''].indexOf(item) === -1
)
props.filterValue.find((item) => (Array.isArray(item) ? item.length > 0 : ![undefined, null, ''].includes(item)))
)
})

2
packages/renderless/src/form-item/index.ts
View File

@ -378,7 +378,7 @@ export const getRules =
const prop = getPropByPath(formRules, props.prop || '')
formRules = formRules ? prop.o[props.prop || ''] || prop.v : []
// @ts-ignore
// @ts-expect-error
return ([] as IFormItemRule[]).concat(selfRules || formRules || []).concat(requiredRule)
}

2
packages/renderless/src/image-viewer/index.ts
View File

@ -723,7 +723,7 @@ export const touchmove = (state) => (event) => {
}
export const touchend = (state) => (e) => {
var moveX = 0
let moveX = 0
state.endX = e.changedTouches[0].clientX
moveX = state.endX - state.firstX

2
packages/renderless/src/image/index.ts
View File

@ -10,7 +10,7 @@
*
*/
import { IImageApi, IImageProps, IImageRenderlessParams, IImageState } from '@/types'
import type { IImageProps, IImageRenderlessParams, IImageState } from '@/types'
import { on, off, getScrollContainer, isInContainer } from '../common/deps/dom'
import { typeOf } from '../common/type'
import '../common/deps/requestAnimationFrame'

Some files were not shown because too many files have changed in this diff Show More