This commit is contained in:
Ling53666
2025-08-18 09:11:51 +08:00
commit 02554225da
2516 changed files with 133155 additions and 0 deletions

View File

@ -0,0 +1 @@
.ant-skeleton-avatar{width:44px;height:44px;border-radius:4px;background:#eee;display:inline-block}.ant-skeleton-avatar-animate{background:linear-gradient(90deg,#eee 25%,rgba(204,204,204,.6) 37%,#eee 63%);background-size:400% 100%;animation:ant-skeleton-loading 1.4s ease infinite}.ant-skeleton-avatar-circle{border-radius:50%}.ant-skeleton-avatar-x-small{width:40px;height:40px}.ant-skeleton-avatar-small{width:44px;height:44px}.ant-skeleton-avatar-medium{width:52px;height:52px}.ant-skeleton-avatar-large{width:60px;height:60px}

View File

@ -0,0 +1,10 @@
<import-sjs
from="./index.sjs"
name="utils"
></import-sjs>
<view
a:if="{{loading}}"
style="{{style}}"
class="ant-skeleton-avatar ant-skeleton-avatar-{{shape}} {{animate ? 'ant-skeleton-avatar-animate' : ''}} {{utils.getClass(size)}} {{className || ''}}"
></view>
<slot a:else></slot>

View File

@ -0,0 +1 @@
export {};

View File

@ -0,0 +1,3 @@
import { Component } from '../../_util/simply';
import { SkeletonAvatarDefaultProps } from './props';
Component(SkeletonAvatarDefaultProps);

View File

@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@ -0,0 +1,10 @@
function getClass(size) {
var list = ['x-small', 'small', 'medium', 'large'];
if (list.indexOf(size) >= 0) {
return "ant-skeleton-avatar-".concat(size);
}
return 'ant-skeleton-avatar-medium';
}
export default {
getClass: getClass
};

View File

@ -0,0 +1,6 @@
import { ISkeletonBaseProps } from '../props';
export interface SkeletonAvatarProps extends ISkeletonBaseProps {
shape: 'circle' | 'square';
size: 'x-small' | 'small' | 'medium' | 'large';
}
export declare const SkeletonAvatarDefaultProps: Partial<SkeletonAvatarProps>;

View File

@ -0,0 +1,3 @@
import { __assign } from "tslib";
import { SkeletonDefaultBaseProps } from '../props';
export var SkeletonAvatarDefaultProps = __assign(__assign({}, SkeletonDefaultBaseProps), { shape: 'square', size: 'medium' });

View File

@ -0,0 +1 @@
.ant-skeleton-button{width:60px;height:24px;border-radius:4px;background:#eee;display:inline-block}.ant-skeleton-button-animate{background:linear-gradient(90deg,#eee 25%,rgba(204,204,204,.6) 37%,#eee 63%);background-size:400% 100%;animation:ant-skeleton-loading 1.4s ease infinite}.ant-skeleton-button-large{font-size:18px;padding:12px 12px 12px 12px}.ant-skeleton-button-medium{font-size:17px;padding:8px 12px 8px 12px}.ant-skeleton-button-small{font-size:15px;padding:4px 12px 4px 12px}

View File

@ -0,0 +1,10 @@
<import-sjs
from="./index.sjs"
name="utils"
></import-sjs>
<view
a:if="{{loading}}"
class="ant-skeleton-button {{animate ? 'ant-skeleton-button-animate' : ''}} {{utils.getClass(size)}} {{className || ''}}"
style="{{style}}"
></view>
<slot a:else></slot>

View File

@ -0,0 +1 @@
export {};

View File

@ -0,0 +1,3 @@
import { Component } from '../../_util/simply';
import { SkeletonButtonDefaultProps } from './props';
Component(SkeletonButtonDefaultProps);

View File

@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@ -0,0 +1,10 @@
function getClass(size) {
var list = ['small', 'medium', 'large'];
if (list.indexOf(size) >= 0) {
return "ant-skeleton-button-".concat(size);
}
return 'ant-skeleton-button-medium';
}
export default {
getClass: getClass
};

View File

@ -0,0 +1,5 @@
import { ISkeletonBaseProps } from '../props';
export interface SkeletonButtonProps extends ISkeletonBaseProps {
size?: 'small' | 'medium' | 'large';
}
export declare const SkeletonButtonDefaultProps: Partial<SkeletonButtonProps>;

View File

@ -0,0 +1,3 @@
import { __assign } from "tslib";
import { SkeletonDefaultBaseProps } from '../props';
export var SkeletonButtonDefaultProps = __assign(__assign({}, SkeletonDefaultBaseProps), { size: 'medium' });

View File

@ -0,0 +1 @@
.ant-skeleton-input{width:200px;height:20px;border-radius:4px;background:#eee;display:inline-block}.ant-skeleton-input-animate{background:linear-gradient(90deg,#eee 25%,rgba(204,204,204,.6) 37%,#eee 63%);background-size:400% 100%;animation:ant-skeleton-loading 1.4s ease infinite}

View File

@ -0,0 +1,6 @@
<view
a:if="{{loading}}"
class="ant-skeleton-input {{animate ? 'ant-skeleton-input-animate' : ''}} {{className || ''}}"
style="{{style}}"
></view>
<slot a:else></slot>

View File

@ -0,0 +1 @@
export {};

View File

@ -0,0 +1,3 @@
import { Component } from '../../_util/simply';
import { SkeletonInputDefaultProps } from './props';
Component(SkeletonInputDefaultProps);

View File

@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@ -0,0 +1,4 @@
import { ISkeletonBaseProps } from '../props';
export interface SkeletonInputProps extends ISkeletonBaseProps {
}
export declare const SkeletonInputDefaultProps: Partial<SkeletonInputProps>;

View File

@ -0,0 +1,3 @@
import { __assign } from "tslib";
import { SkeletonDefaultBaseProps } from '../props';
export var SkeletonInputDefaultProps = __assign({}, SkeletonDefaultBaseProps);

View File

@ -0,0 +1 @@
@keyframes ant-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}.ant-skeleton-paragraph-animate .ant-skeleton-paragraph-row{background:linear-gradient(90deg,#eee 25%,rgba(204,204,204,.6) 37%,#eee 63%);background-size:400% 100%;animation:ant-skeleton-loading 1.4s ease infinite}.ant-skeleton-paragraph-row{width:100%;height:15px;margin-bottom:12px;border-radius:4px;background:#eee}.ant-skeleton-paragraph-row:nth-last-of-type(1){margin-bottom:0}.ant-skeleton-paragraph-row:nth-last-of-type(1):not(:nth-of-type(1)){width:60%}

View File

@ -0,0 +1,14 @@
<view
a:if="{{loading && rows > 0}}"
class="ant-skeleton-paragraph {{animate ? 'ant-skeleton-paragraph-animate' : ''}} {{className || ''}}"
style="{{style}}"
>
<block
a:for="{{rows}}"
a:for-index="index"
a:for-item="item"
>
<view class="ant-skeleton-paragraph-row"></view>
</block>
</view>
<slot a:else></slot>

View File

@ -0,0 +1 @@
export {};

View File

@ -0,0 +1,3 @@
import { Component } from '../../_util/simply';
import { SkeletonParagraphDefaultProps } from './props';
Component(SkeletonParagraphDefaultProps);

View File

@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@ -0,0 +1,5 @@
import { ISkeletonBaseProps } from '../props';
export interface SkeletonParagraphProps extends ISkeletonBaseProps {
rows: number;
}
export declare const SkeletonParagraphDefaultProps: Partial<SkeletonParagraphProps>;

View File

@ -0,0 +1,3 @@
import { __assign } from "tslib";
import { SkeletonDefaultBaseProps } from '../props';
export var SkeletonParagraphDefaultProps = __assign(__assign({}, SkeletonDefaultBaseProps), { rows: 3 });

View File

@ -0,0 +1 @@
@keyframes ant-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}.ant-skeleton-title{height:20px;width:45%;margin-bottom:20px;border-radius:4px;background:#eee}.ant-skeleton-title-animate{background:linear-gradient(90deg,#eee 25%,rgba(204,204,204,.6) 37%,#eee 63%);background-size:400% 100%;animation:ant-skeleton-loading 1.4s ease infinite}

View File

@ -0,0 +1,6 @@
<view
a:if="{{loading}}"
class="ant-skeleton-title {{animate ? 'ant-skeleton-title-animate' : ''}} {{className || ''}}"
style="{{style}}"
></view>
<slot a:else></slot>

View File

@ -0,0 +1 @@
export {};

View File

@ -0,0 +1,3 @@
import { Component } from '../../_util/simply';
import { SkeletonTitleDefaultProps } from './props';
Component(SkeletonTitleDefaultProps);

View File

@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@ -0,0 +1,4 @@
import { ISkeletonBaseProps } from '../props';
export interface SkeletonTitleProps extends ISkeletonBaseProps {
}
export declare const SkeletonTitleDefaultProps: Partial<SkeletonTitleProps>;

View File

@ -0,0 +1,3 @@
import { __assign } from "tslib";
import { SkeletonDefaultBaseProps } from '../props';
export var SkeletonTitleDefaultProps = __assign({}, SkeletonDefaultBaseProps);

View File

@ -0,0 +1 @@
.ant-skeleton{display:flex;align-items:flex-start;width:100%;flex:1;flex-wrap:nowrap}.ant-skeleton-avatar-wrapper{flex-shrink:0;padding-right:16px}.ant-skeleton-avatar-wrapper+.ant-skeleton-content-wrapper{padding-top:12px}.ant-skeleton-content-wrapper{flex:1;width:100%}

View File

@ -0,0 +1,29 @@
<view
a:if="{{loading}}"
class="ant-skeleton {{className || ''}}"
>
<view
a:if="{{avatar}}"
class="ant-skeleton-avatar-wrapper"
>
<avatar
animate="{{animate}}"
loading
size="{{avatar === true ? 'medium' : avatar.size}}"
></avatar>
</view>
<view class="ant-skeleton-content-wrapper">
<title
a:if="{{title}}"
animate="{{animate}}"
loading
></title>
<paragraph
a:if="{{paragraph}}"
animate="{{animate}}"
rows="{{paragraph === true ? 3 : paragraph.rows}}"
loading
></paragraph>
</view>
</view>
<slot a:else></slot>

View File

@ -0,0 +1 @@
export {};

View File

@ -0,0 +1,3 @@
import { Component } from '../_util/simply';
import { SkeletonDefaultProps } from './props';
Component(SkeletonDefaultProps);

View File

@ -0,0 +1,8 @@
{
"component": true,
"usingComponents": {
"avatar": "./Avatar/index",
"paragraph": "./Paragraph/index",
"title": "./Title/index"
}
}

View File

@ -0,0 +1,40 @@
import { IBaseProps } from '../_util/base';
export interface ISkeletonBaseProps extends IBaseProps {
/**
* @description 为 true 时,显示占位图。反之则直接展示子组件
* @default true
*/
loading?: boolean;
/**
* @description 是否展示动画效果
* @default false
*/
animate?: boolean;
}
/**
* @description 骨架屏
*/
export interface ISkeletonProps extends ISkeletonBaseProps {
/**
* @description 是否显示头像占位图
* @default false
*/
avatar?: boolean | {
shape?: 'circle' | 'square';
size?: 'x-small' | 'small' | 'medium' | 'large';
};
/**
* @description 是否显示标题占位图
* @default true
*/
title?: boolean;
/**
* @description 段落
* @default true
*/
paragraph?: boolean | {
rows?: number;
};
}
export declare const SkeletonDefaultBaseProps: ISkeletonBaseProps;
export declare const SkeletonDefaultProps: Partial<ISkeletonProps>;

View File

@ -0,0 +1,11 @@
export var SkeletonDefaultBaseProps = {
loading: true,
animate: false,
};
export var SkeletonDefaultProps = {
loading: true,
animate: false,
avatar: false,
title: true,
paragraph: true,
};