mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
39 lines
829 B
TypeScript
39 lines
829 B
TypeScript
import type { CSSProperties } from 'vue'
|
|
import type { ThumbProps } from './thumb'
|
|
|
|
export const GAP = 4 // top 2 + bottom 2 of bar instance
|
|
|
|
export const BAR_MAP = {
|
|
vertical: {
|
|
offset: 'offsetHeight',
|
|
scroll: 'scrollTop',
|
|
scrollSize: 'scrollHeight',
|
|
size: 'height',
|
|
key: 'vertical',
|
|
axis: 'Y',
|
|
client: 'clientY',
|
|
direction: 'top',
|
|
},
|
|
horizontal: {
|
|
offset: 'offsetWidth',
|
|
scroll: 'scrollLeft',
|
|
scrollSize: 'scrollWidth',
|
|
size: 'width',
|
|
key: 'horizontal',
|
|
axis: 'X',
|
|
client: 'clientX',
|
|
direction: 'left',
|
|
},
|
|
} as const
|
|
|
|
export const renderThumbStyle = ({
|
|
move,
|
|
size,
|
|
bar,
|
|
}: Pick<ThumbProps, 'move' | 'size'> & {
|
|
bar: typeof BAR_MAP[keyof typeof BAR_MAP]
|
|
}): CSSProperties => ({
|
|
[bar.size]: size,
|
|
transform: `translate${bar.axis}(${move}%)`,
|
|
})
|