tdesign-vue-next
Version:
TDesign Component for vue-next
1 lines • 10.6 kB
Source Map (JSON)
{"version":3,"file":"skeleton.mjs","sources":["../../../components/skeleton/skeleton.tsx"],"sourcesContent":["import { h, defineComponent, ref, watch } from 'vue';\nimport { isArray, isNumber, isFunction } from 'lodash-es';\n\nimport props from './props';\nimport { SkeletonRowCol, SkeletonRowColObj, TdSkeletonProps } from './type';\nimport { useContent, usePrefixClass } from '@tdesign/shared-hooks';\n\nconst ThemeMap: Record<TdSkeletonProps['theme'], SkeletonRowCol> = {\n text: [1],\n avatar: [{ type: 'circle', size: '56px' }],\n paragraph: [1, 1, { width: '70%' }],\n 'avatar-text': [[{ type: 'circle' }, { type: 'text', height: '32px' }]],\n tab: [{ height: '30px' }, { height: '200px' }],\n article: [\n { type: 'rect', height: '30px', width: '100%' },\n { type: 'rect', height: '200px', width: '100%' },\n [\n { type: 'text', height: '30px' },\n { type: 'text', height: '30px' },\n { type: 'text', height: '30px' },\n ],\n [\n { type: 'text', height: '30px' },\n { type: 'text', height: '30px' },\n ],\n [\n { type: 'text', height: '30px' },\n { type: 'text', height: '30px' },\n ],\n [\n { type: 'text', height: '30px' },\n { type: 'text', height: '30px' },\n ],\n ],\n};\n\nconst getColItemStyle = (obj: SkeletonRowColObj) => {\n const styleName = ['width', 'height', 'marginRight', 'marginLeft', 'margin', 'size', 'background', 'backgroundColor'];\n const style = Object.create(null);\n styleName.forEach((name) => {\n // TODO: function isKeyOfObj(key: string, obj: object): key is keyof typeof obj { return key in obj;}\n if (name in obj) {\n const val = obj[name as keyof typeof obj];\n const px = isNumber(val) ? `${val}px` : val;\n if (name === 'size') {\n [style.width, style.height] = [px, px];\n } else {\n style[name] = px;\n }\n }\n });\n return style;\n};\n\nexport default defineComponent({\n name: 'TSkeleton',\n props,\n setup(props, { slots }) {\n const isShow = ref(false);\n const COMPONENT_NAME = usePrefixClass('skeleton');\n const renderContent = useContent();\n const getColItemClass = (obj: SkeletonRowColObj) => [\n `${COMPONENT_NAME.value}__col`,\n `${COMPONENT_NAME.value}--type-${obj.type || 'text'}`,\n { [`${COMPONENT_NAME.value}--animation-${props.animation}`]: props.animation },\n ];\n\n const renderCols = (_cols: Number | SkeletonRowColObj | Array<SkeletonRowColObj>) => {\n let cols: Array<SkeletonRowColObj> = [];\n if (isArray(_cols)) {\n cols = _cols;\n } else if (isNumber(_cols)) {\n cols = new Array(_cols).fill({ type: 'text' });\n } else {\n cols = [_cols as SkeletonRowColObj];\n }\n return cols.map((obj) => (\n <div class={getColItemClass(obj)} style={getColItemStyle(obj)}>\n {isFunction(obj.content) ? obj.content(h) : obj.content}\n </div>\n ));\n };\n\n const renderRowCol = (_rowCol?: SkeletonRowCol) => {\n const rowCol: SkeletonRowCol = _rowCol || props.rowCol;\n\n const getBlockClass = () => [`${COMPONENT_NAME.value}__row`];\n\n return rowCol.map((item) => <div class={getBlockClass()}>{renderCols(item)}</div>);\n };\n\n let timer: NodeJS.Timeout = null;\n\n watch(\n () => props.loading,\n (bool) => {\n if (!bool) {\n clearTimeout(timer);\n isShow.value = false;\n return;\n }\n if (props.delay > 0) {\n timer = setTimeout(() => {\n clearTimeout(timer);\n isShow.value = true;\n }, props.delay);\n } else {\n isShow.value = true;\n }\n },\n { immediate: true },\n );\n\n return () => {\n const content = renderContent('default', 'content');\n\n if (slots.default && !isShow.value) {\n return <div>{content}</div>;\n }\n\n if (!isShow.value) {\n return;\n }\n\n const children = [];\n if (props.theme) {\n children.push(renderRowCol(ThemeMap[props.theme]));\n }\n if (props.rowCol) {\n children.push(renderRowCol(props.rowCol));\n }\n if (!props.theme && !props.rowCol) {\n // 什么都不传时，传入默认 rowCol\n children.push(renderRowCol([1, 1, 1, { width: '70%' }]));\n }\n\n return <div class={COMPONENT_NAME.value}>{children}</div>;\n };\n },\n});\n"],"names":["ThemeMap","text","avatar","type","size","paragraph","width","height","tab","article","getColItemStyle","obj","styleName","style","Object","create","forEach","name","val","px","isNumber","concat","_ref","defineComponent","props","setup","slots","_ref2","isShow","ref","COMPONENT_NAME","usePrefixClass","renderContent","useContent","getColItemClass","value","_defineProperty","animation","renderCols","_cols","cols","isArray","Array","fill","map","_createVNode","isFunction","content","h","renderRowCol","_rowCol","rowCol","getBlockClass","item","timer","watch","loading","bool","clearTimeout","delay","setTimeout","immediate","children","theme","push"],"mappings":"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"}