@type-dom/ui 0.1.2 → 0.2.0

package/src/components/data/td-statistic/td-statistic.interface.d.ts

@@ -1,54 +0,0 @@
-import { ISlotRaw, ITypeDiv, StyleValue, TypeDivProps } from '@type-dom/framework';
-import { MaybeRef } from '@type-dom/signals';
-import { Dayjs } from 'dayjs';
-export interface ITdStatistic extends ITypeDiv {
-    className: 'TdStatistic';
-}
-export interface StatisticProps extends TypeDivProps {
-    /**
-     * @description Setting the decimal point
-     *     default: '.',
-     */
-    decimalSeparator?: string;
-    /**
-     * @description Sets the thousandth identifier
-     *     default: ',',
-     */
-    groupSeparator?: string;
-    /**
-     * @description numerical precision
-     *     default: 0,
-     */
-    precision?: number;
-    /**
-     * @description Custom numerical presentation
-     */
-    formatter?: (value?: MaybeRef<number | number[] | string | Dayjs>) => string;
-    /**
-     * @description Numerical content
-     *     default: 0,
-     */
-    value?: MaybeRef<number | number[] | Dayjs>;
-    /**
-     * @description Sets the prefix of a number
-     */
-    prefix?: string;
-    /**
-     * @description  Sets the suffix of a number
-     */
-    suffix?: string;
-    /**
-     * @description Numeric titles
-     */
-    title?: string;
-    /**
-     * @description Styles numeric values
-     */
-    valueStyle?: StyleValue;
-    slots?: {
-        prefix?: ISlotRaw;
-        suffix?: ISlotRaw;
-        title?: ISlotRaw;
-        value?: ISlotRaw;
-    };
-}

package/src/components/data/td-statistic/td-statistic.interface.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/src/components/data/td-statistic/td-statistic.style.d.ts

@@ -1,9 +0,0 @@
-import { Property } from '@type-dom/css-type';
-export declare const $statistic: {
-    titleFontWeight: Property.FontWeight;
-    titleFontSize: string;
-    titleColor: string;
-    contentFontWeight: Property.FontWeight;
-    contentFontSize: string;
-    contentColor: string;
-};

package/src/components/data/td-statistic/td-statistic.style.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.$statistic = void 0;
-const var_1 = require("../../../styles/var");
-exports.$statistic = {
-    titleFontWeight: 400,
-    // titleFontSize: getCssVar('font-size', 'extra-small'),
-    titleFontSize: var_1.$fontSizes.extraSmall,
-    // titleColor: getCssVar('text-color', 'regular'),
-    titleColor: var_1.$textColor.regular,
-    contentFontWeight: 400,
-    // contentFontSize: getCssVar('font-size', 'extra-large'),
-    contentFontSize: var_1.$fontSizes.extraLarge,
-    // contentColor: getCssVar('text-color', 'primary'),
-    contentColor: var_1.$textColor.primary,
-};

package/src/components/data/td-table/td-table.class.js

@@ -1 +0,0 @@
-"use strict";

package/src/components/data/td-table/td-table.interface.js

@@ -1 +0,0 @@
-"use strict";

package/src/components/data/td-tag/style/css.d.ts

@@ -1,2 +0,0 @@
-import '../../../base/style/css';
-import '@element-plus/theme-chalk/el-tag.css';

package/src/components/data/td-tag/style/css.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-require("../../../base/style/css");
-require("@element-plus/theme-chalk/el-tag.css");

package/src/components/data/td-tag/style/index.d.ts

@@ -1,2 +0,0 @@
-import '../../../base/style';
-import '../../../../theme-chalk/tag.scss';

package/src/components/data/td-tag/style/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-require("../../../base/style");
-require("../../../../theme-chalk/tag.scss");

package/src/components/data/td-tag/td-tag.class.d.ts

@@ -1,9 +0,0 @@
-import { TypeFragment } from '@type-dom/framework';
-import { ITdTag, TagProps } from './td-tag.interface';
-import './style/index';
-export declare class TdTag extends TypeFragment implements ITdTag {
-    className: 'TdTag';
-    props: TagProps;
-    constructor(params?: TagProps);
-    setup(): void;
-}

package/src/components/data/td-tag/td-tag.class.js

@@ -1,112 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TdTag = void 0;
-const framework_1 = require("@type-dom/framework");
-const signals_1 = require("@type-dom/signals");
-const svgs_1 = require("@type-dom/svgs");
-const use_namespace_1 = require("../../../hooks/use-namespace");
-const use_form_common_props_1 = require("../../form/td-form/hooks/use-form-common-props");
-const td_icon_class_1 = require("../../basic/td-icon/td-icon.class");
-const td_tag_const_1 = require("./td-tag.const");
-require("./style/index");
-class TdTag extends framework_1.TypeFragment {
-    constructor(params = {}) {
-        super();
-        this.className = 'TdTag';
-        // this.attr.addName('td-tag');
-        this.addEmits(td_tag_const_1.tagEmits);
-        this.assignProps(td_tag_const_1.tagProps);
-        this.props = this.useParams(params);
-    }
-    setup() {
-        var _a, _b;
-        const props = this.props;
-        const emit = this.emit;
-        const tagSize = (0, use_form_common_props_1.useFormSize)();
-        const ns = (0, use_namespace_1.useNamespace)('tag');
-        const containerKls = (0, signals_1.computed)(() => {
-            const { type, hit, effect, closable, round } = props;
-            return [
-                ns.b(),
-                ns.is('closable', closable),
-                ns.m(type || 'primary'),
-                ns.m(tagSize.get()),
-                ns.m(effect),
-                ns.is('hit', hit),
-                ns.is('round', round),
-            ];
-        });
-        // methods
-        const handleClose = (event) => {
-            emit('close', event);
-        };
-        const handleClick = (event) => {
-            emit('click', event);
-        };
-        const handleVNodeMounted = (vnode) => {
-            // // @ts-ignore
-            // if (vnode?.component?.subTree?.component?.bum) {
-            //   // @ts-ignore
-            //   vnode.component.subTree.component.bum = null;
-            // }
-        };
-        if (props.disableTransitions) {
-            this.addChild(new framework_1.Span({
-                vIf: props.disableTransitions,
-                class: containerKls,
-                styleObj: Object.assign(Object.assign({}, props.styleObj), { backgroundColor: props.color }),
-                events: {
-                    click: handleClick,
-                },
-                slot: [
-                    new framework_1.Span({
-                        class: ns.e('content'),
-                        slot: props.slot || ((_a = props.slots) === null || _a === void 0 ? void 0 : _a.default),
-                    }),
-                    new td_icon_class_1.TdIcon({
-                        vIf: props.closable,
-                        class: ns.e('close'),
-                        events: {
-                            click: (evt) => {
-                                handleClose(evt);
-                                evt === null || evt === void 0 ? void 0 : evt.stopPropagation();
-                            },
-                        },
-                        slot: new svgs_1.ElCloseSvg(),
-                    }),
-                ],
-            }));
-        }
-        else {
-            this.addChild(new framework_1.Transition({
-                name: `${ns.namespace.get()}-zoom-in-center`,
-                appear: true,
-                slot: new framework_1.Span({
-                    class: containerKls,
-                    styleObj: Object.assign(Object.assign({}, props.styleObj), { backgroundColor: props.color }),
-                    events: {
-                        click: handleClick,
-                    },
-                    slot: [
-                        new framework_1.Span({
-                            class: ns.e('content'),
-                            slot: props.slot || ((_b = props.slots) === null || _b === void 0 ? void 0 : _b.default),
-                        }),
-                        new td_icon_class_1.TdIcon({
-                            vIf: props.closable,
-                            class: ns.e('close'),
-                            events: {
-                                click: (evt) => {
-                                    handleClose(evt);
-                                    evt === null || evt === void 0 ? void 0 : evt.stopPropagation();
-                                },
-                            },
-                            slot: new svgs_1.ElCloseSvg(),
-                        }),
-                    ],
-                }),
-            }));
-        }
-    }
-}
-exports.TdTag = TdTag;

package/src/components/data/td-tag/td-tag.const.d.ts

@@ -1,7 +0,0 @@
-import { TagProps } from './td-tag.interface';
-export declare const tagProps: TagProps;
-export declare const tagEmits: {
-    close: (evt?: MouseEvent) => evt is MouseEvent;
-    click: (evt?: MouseEvent) => evt is MouseEvent;
-};
-export type TagEmits = typeof tagEmits;

package/src/components/data/td-tag/td-tag.const.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.tagEmits = exports.tagProps = void 0;
-exports.tagProps = {
-    type: 'primary',
-    effect: 'light',
-};
-exports.tagEmits = {
-    close: (evt) => evt instanceof MouseEvent,
-    click: (evt) => evt instanceof MouseEvent,
-};
-// export type TagInstance = InstanceType<typeof Tag>

package/src/components/data/td-tag/td-tag.interface.d.ts

@@ -1,42 +0,0 @@
-import { ITypeFragment, TypeFragmentProps } from '@type-dom/framework';
-import { ComponentSize } from '../../../constants/size';
-import { IType } from '../../../styles';
-export interface ITdTag extends ITypeFragment {
-    className: 'TdTag';
-}
-export interface TagProps extends TypeFragmentProps {
-    /**
-     * @description type of Tag
-     *     default: 'primary',
-     */
-    type?: IType;
-    /**
-     * @description whether Tag can be removed
-     */
-    closable?: boolean;
-    /**
-     * @description whether to disable animations
-     */
-    disableTransitions?: boolean;
-    /**
-     * @description whether Tag has a highlighted border
-     */
-    hit?: boolean;
-    /**
-     * @description background color of the Tag
-     */
-    color?: string;
-    /**
-     * @description size of Tag
-     */
-    size?: ComponentSize;
-    /**
-     * @description theme of Tag
-     *     default: 'light',
-     */
-    effect?: 'dark' | 'light' | 'plain';
-    /**
-     * @description whether Tag is rounded
-     */
-    round?: boolean;
-}

package/src/components/data/td-tag/td-tag.interface.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/src/components/data/td-tag/td-tag.style.d.ts

@@ -1,49 +0,0 @@
-import { IStyle } from '@type-dom/css-type';
-import { ComponentSize } from '../../../constants/size';
-import { IType } from '../../../styles/var';
-export declare const $tag: {
-    fontSize: string;
-    bgColor?: string;
-    borderColor?: string;
-    hoverColor?: string;
-    borderRadius: string;
-    borderRadiusRounded?: string;
-    textColor?: string;
-    hit?: string;
-};
-export declare const $tagHeight: {
-    '': string;
-    large: string;
-    default: string;
-    small: string;
-};
-export declare const $tagPadding: {
-    '': string;
-    large: string;
-    default: string;
-    small: string;
-};
-export declare const $tagIconSize: {
-    '': string;
-    large: string;
-    default: string;
-    small: string;
-};
-export declare const $tagBorderWidth = "1px";
-export declare const $tagIconSpanGap: {
-    '': string;
-    large: string;
-    default: string;
-    small: string;
-};
-export declare const $iconSize = "14px";
-export declare const $tagTypes: Record<IType, {
-    bgColor: string;
-    borderColor: string;
-    hoverColor: string;
-    textColor: string;
-    hit: string;
-}>;
-export declare function genTheme($backgroundColorWeight: string | false, $borderColorWeight: string, $hoverColorWeight: string): void;
-export declare const $tagSizes: Record<ComponentSize, IStyle>;
-export declare function useType(): void;

package/src/components/data/td-tag/td-tag.style.js

@@ -1,85 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.$tagSizes = exports.$tagTypes = exports.$iconSize = exports.$tagIconSpanGap = exports.$tagBorderWidth = exports.$tagIconSize = exports.$tagPadding = exports.$tagHeight = exports.$tag = void 0;
-exports.genTheme = genTheme;
-exports.useType = useType;
-const var_1 = require("../../../styles/var");
-exports.$tag = {
-    fontSize: '12px',
-    borderRadius: '4px',
-    borderRadiusRounded: '9999px',
-};
-exports.$tagHeight = {
-    '': '24px',
-    large: '32px',
-    default: '24px',
-    small: '20px',
-};
-exports.$tagPadding = {
-    '': '10px',
-    large: '12px',
-    default: '10px',
-    small: '8px',
-};
-exports.$tagIconSize = {
-    '': '14px',
-    large: '16px',
-    default: '14px',
-    small: '12px',
-};
-exports.$tagBorderWidth = '1px';
-exports.$tagIconSpanGap = {
-    '': '6px',
-    large: '8px',
-    default: '6px',
-    small: '4px',
-};
-exports.$iconSize = '14px';
-// 常用主题
-// dark
-// plain
-exports.$tagTypes = {};
-function genTheme($backgroundColorWeight, $borderColorWeight, $hoverColorWeight) {
-    exports.$tag.bgColor = returnVarList($backgroundColorWeight);
-    exports.$tag.borderColor = returnVarList($borderColorWeight);
-    exports.$tag.hoverColor = returnVarList($hoverColorWeight);
-    for (const type of var_1.$types) {
-        exports.$tagTypes[type] = {
-            bgColor: returnVarList($backgroundColorWeight, type),
-            borderColor: returnVarList($borderColorWeight, type),
-            hoverColor: returnVarList($hoverColorWeight, type),
-            textColor: var_1.$colors[type].base,
-            hit: var_1.$colors[type].base,
-        };
-        // console.log('$tagTypes[type] is ', $tagTypes[type]);
-    }
-    const hoverColor = returnVarList($hoverColorWeight, 'primary');
-    // console.log('hoverColor is ', hoverColor);
-}
-function returnVarList($var, $type = 'primary') {
-    // console.log('returnVarList . ');
-    let $list = var_1.$fillColor.blank;
-    if ($var !== false) {
-        $list = var_1.$colors[$type] && var_1.$colors[$type][$var || 'base'];
-    }
-    return $list;
-}
-exports.$tagSizes = {};
-function useType() {
-    for (const size of ['', 'large', 'default', 'small']) {
-        exports.$tagSizes[size] = {
-            padding: '0 ' +
-                (parseFloat(exports.$tagPadding[size]) -
-                    parseFloat(exports.$tagBorderWidth)) +
-                'px',
-            height: exports.$tagHeight[size],
-            // iconSize: $tagIconSize[size as ISize],
-            // iconSpanGap: $tagIconSpanGap[size]
-            marginLeft: exports.$tagIconSpanGap[size],
-            // paddingRight: parseFloat($tagIconSpanGap[size as ISize]) - parseFloat($borderWidth) + 'px', // closable 时
-        };
-        if (size === 'small') {
-            exports.$tagSizes[size].transform = 'scale(0.8)';
-        }
-    }
-}

package/src/components/data/td-timeline/td-timeline.class.js

@@ -1 +0,0 @@
-"use strict";

package/src/components/data/td-timeline/td-timeline.interface.js

@@ -1 +0,0 @@
-"use strict";

package/src/components/data/td-tree/td-tree.class.js

@@ -1 +0,0 @@
-"use strict";

package/src/components/data/td-tree/td-tree.interface.js

@@ -1 +0,0 @@
-"use strict";

package/src/components/feedback/index.d.ts

@@ -1,17 +0,0 @@
-export { TdAlert } from './td-alert/td-alert.class';
-export type * from './td-alert/td-alert.interface';
-export { TdDialog } from './td-dialog/td-dialog.class';
-export type * from './td-dialog/td-dialog.interface';
-export * from './td-dialog/td-dialog.style';
-export { TdMessage } from './td-message/method';
-export type * from './td-message/td-message.interface';
-export * from './td-message-box/index';
-export { TdNotification } from './td-notification/index';
-export * from './td-loading/index';
-export { TdPopconfirm } from './td-popconfirm/td-popconfirm.class';
-export type * from './td-popconfirm/td-popconfirm.interface';
-export type * from './td-popper/td-popper.interface';
-export { TdPopover } from './td-popover/td-popover.class';
-export type * from './td-popover/td-popover.interface';
-export { TdTooltip } from './td-tooltip/td-tooltip.class';
-export type * from './td-tooltip/td-tooltip.interface';

package/src/components/feedback/index.js

@@ -1,26 +0,0 @@
-"use strict";
-// export { Dialog } from './dialog/dialog.class';
-// export { MessageBox } from './message-box/message-box';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TdTooltip = exports.TdPopover = exports.TdPopconfirm = exports.TdNotification = exports.TdMessage = exports.TdDialog = exports.TdAlert = void 0;
-const tslib_1 = require("tslib");
-var td_alert_class_1 = require("./td-alert/td-alert.class");
-Object.defineProperty(exports, "TdAlert", { enumerable: true, get: function () { return td_alert_class_1.TdAlert; } });
-var td_dialog_class_1 = require("./td-dialog/td-dialog.class");
-Object.defineProperty(exports, "TdDialog", { enumerable: true, get: function () { return td_dialog_class_1.TdDialog; } });
-tslib_1.__exportStar(require("./td-dialog/td-dialog.style"), exports);
-var method_1 = require("./td-message/method");
-Object.defineProperty(exports, "TdMessage", { enumerable: true, get: function () { return method_1.TdMessage; } });
-tslib_1.__exportStar(require("./td-message-box/index"), exports);
-// export { TdMessageBox } from './td-message-box/td-message-box.class';
-// export type * from './td-message-box/td-message-box.interface';
-var index_1 = require("./td-notification/index");
-Object.defineProperty(exports, "TdNotification", { enumerable: true, get: function () { return index_1.TdNotification; } });
-// export type * from './td-notification/td-notification.interface';
-tslib_1.__exportStar(require("./td-loading/index"), exports);
-var td_popconfirm_class_1 = require("./td-popconfirm/td-popconfirm.class");
-Object.defineProperty(exports, "TdPopconfirm", { enumerable: true, get: function () { return td_popconfirm_class_1.TdPopconfirm; } });
-var td_popover_class_1 = require("./td-popover/td-popover.class");
-Object.defineProperty(exports, "TdPopover", { enumerable: true, get: function () { return td_popover_class_1.TdPopover; } });
-var td_tooltip_class_1 = require("./td-tooltip/td-tooltip.class");
-Object.defineProperty(exports, "TdTooltip", { enumerable: true, get: function () { return td_tooltip_class_1.TdTooltip; } });

package/src/components/feedback/td-alert/style/css.js

@@ -1,3 +0,0 @@
-"use strict";
-// import '../../../../styles/base/style/css'
-// import '../../../../theme-chalk/el-alert.css'

package/src/components/feedback/td-alert/style/index.d.ts

@@ -1,2 +0,0 @@
-import '../../../base/style';
-import '../../../../theme-chalk/alert.scss';

package/src/components/feedback/td-alert/style/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-require("../../../base/style");
-require("../../../../theme-chalk/alert.scss");

package/src/components/feedback/td-alert/td-alert.class.d.ts

@@ -1,12 +0,0 @@
-import { TypeFragment } from '@type-dom/framework';
-import { ITdAlert, AlertProps } from './td-alert.interface';
-import './style/index';
-export declare class TdAlert extends TypeFragment implements ITdAlert {
-    className: 'TdAlert';
-    props: AlertProps;
-    private alertTitle?;
-    private alertDescription?;
-    name?: string;
-    constructor(params?: AlertProps);
-    setup(): void;
-}

package/src/components/feedback/td-alert/td-alert.class.js

@@ -1,108 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TdAlert = void 0;
-const framework_1 = require("@type-dom/framework");
-const svgs_1 = require("@type-dom/svgs");
-const signals_1 = require("@type-dom/signals");
-const index_1 = require("../../../hooks/use-namespace/index");
-const td_icon_class_1 = require("../../basic/td-icon/td-icon.class");
-const td_alert_const_1 = require("./td-alert.const");
-require("./style/index");
-class TdAlert extends framework_1.TypeFragment {
-    constructor(params = {}) {
-        super();
-        this.className = 'TdAlert';
-        this.assignProps(td_alert_const_1.alertProps);
-        this.addEmits(td_alert_const_1.alertEmits);
-        this.props = this.useParams(params);
-    }
-    setup() {
-        const props = this.props;
-        const slots = (0, framework_1.useSlots)();
-        const ns = (0, index_1.useNamespace)('alert');
-        this.name = ns.b('fade');
-        const visible = (0, signals_1.signal)(true);
-        const iconComponent = (0, signals_1.computed)(() => svgs_1.TypeComponentsMap[props.type]);
-        const hasDesc = (0, signals_1.computed)(() => !!(props.description || (slots === null || slots === void 0 ? void 0 : slots.default)));
-        const close = (evt) => {
-            // console.log('close . ');
-            visible.set(false);
-            this.emit('close', evt);
-        };
-        const { type, center, effect } = props;
-        const alertKls = [
-            ns.b(),
-            ns.m(type),
-            ns.is('center', center),
-            ns.is(effect),
-        ];
-        // console.warn('alertKls is ', alertKls);
-        this.addChild(new framework_1.Transition({
-            name: ns.b('fade'),
-            slot: new framework_1.Div({
-                vShow: visible,
-                class: [
-                    ns.b(),
-                    ns.m(type),
-                    ns.is('center', center),
-                    ns.is(effect),
-                ].filter((i) => i !== ''),
-                attrObj: {
-                    role: 'alert',
-                },
-                styleObj: props.styleObj,
-                slot: [
-                    new td_icon_class_1.TdIcon({
-                        vIf: props.showIcon && iconComponent,
-                        class: [ns.e('icon'), { [ns.is('big')]: hasDesc }],
-                        slot: (slots === null || slots === void 0 ? void 0 : slots.icon) || new (iconComponent.get())(),
-                    }),
-                    new framework_1.Div({
-                        class: ns.e('content'),
-                        slot: [
-                            new framework_1.Span({
-                                vIf: props.title || (slots === null || slots === void 0 ? void 0 : slots.title),
-                                class: [ns.e('title'), { 'with-description': hasDesc.get() }],
-                                init: (ele) => {
-                                    if (slots === null || slots === void 0 ? void 0 : slots.title) {
-                                        ele.slotChildren(slots === null || slots === void 0 ? void 0 : slots.title);
-                                    }
-                                    else {
-                                        ele.addChild(new framework_1.TextNode(props.title));
-                                    }
-                                },
-                            }),
-                            new framework_1.P({
-                                vIf: hasDesc,
-                                class: ns.e('description'),
-                                slot: [props.description || ''],
-                            }),
-                            new framework_1.Fragment({
-                                vIf: props.closable,
-                                slot: [
-                                    new framework_1.Div({
-                                        vIf: props.closeText,
-                                        class: [ns.e('close-btn'), ns.is('customed')],
-                                        slot: props.closeText,
-                                        events: {
-                                            click: close,
-                                        },
-                                    }),
-                                    new td_icon_class_1.TdIcon({
-                                        class: ns.e('close-btn'),
-                                        vIf: !props.closeText,
-                                        slot: new svgs_1.ElCloseSvg(),
-                                        events: {
-                                            click: close,
-                                        },
-                                    }),
-                                ],
-                            }),
-                        ],
-                    }),
-                ],
-            }),
-        }));
-    }
-}
-exports.TdAlert = TdAlert;