@type-dom/ui 0.1.0 → 0.1.1

package/src/components/basic/td-button/td-button.const.d.ts

@@ -1,7 +1,22 @@
 import { InjectionKey } from '@type-dom/framework';
-import type { ITdButtonConfig } from './td-button.interface';
+import type { TdButtonProps } from './td-button.interface';
 export interface ButtonGroupContext {
-    size?: ITdButtonConfig['size'];
-    type?: ITdButtonConfig['type'];
+    size?: TdButtonProps['size'];
+    type?: TdButtonProps['type'];
 }
 export declare const buttonGroupContextKey: InjectionKey<ButtonGroupContext>;
+export declare const buttonTypes: readonly ["default", "primary", "success", "warning", "info", "danger", "text", ""];
+export declare const buttonNativeTypes: readonly ["button", "submit", "reset"];
+export declare const buttonProps: {
+    type: string;
+    nativeType: string;
+    tag: string;
+};
+export declare const buttonEmits: {
+    click: (evt: MouseEvent) => boolean;
+};
+export type ButtonType = TdButtonProps['type'];
+export type ButtonNativeType = TdButtonProps['nativeType'];
+export interface ButtonConfigContext {
+    autoInsertSpace?: boolean;
+}

package/src/components/basic/td-button/td-button.const.js

@@ -1,4 +1,27 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.buttonGroupContextKey = void 0;
+exports.buttonEmits = exports.buttonProps = exports.buttonNativeTypes = exports.buttonTypes = exports.buttonGroupContextKey = void 0;
 exports.buttonGroupContextKey = Symbol('buttonGroupContextKey');
+exports.buttonTypes = [
+    'default',
+    'primary',
+    'success',
+    'warning',
+    'info',
+    'danger',
+    /**
+     * @deprecated
+     * Text type will be deprecated in the next major version (3.0.0)
+     */
+    'text',
+    '',
+];
+exports.buttonNativeTypes = ['button', 'submit', 'reset'];
+exports.buttonProps = {
+    type: '',
+    nativeType: 'button',
+    tag: 'button',
+};
+exports.buttonEmits = {
+    click: (evt) => evt instanceof MouseEvent,
+};

package/src/components/basic/td-button/td-button.interface.d.ts

@@ -1,9 +1,11 @@
-import { ITypeConfig, ITypeHtml, TypeSvgSvg } from '@type-dom/framework';
+import { TypeProps, ITypeHtml, TypeSvgSvg } from '@type-dom/framework';
+import { ComponentSize } from '../../../constants';
 export interface ITdButtonAbstract extends ITypeHtml {
     className: 'TdButton' | string;
 }
 export interface ITdButton extends ITdButtonAbstract {
     className: 'TdButton';
+    props: TdButtonProps;
 }
 export type IButtonSize = 'small' | 'default' | 'large';
 export type IButtonType = 'default' | 'primary' | 'success' | 'warning' | 'info' | 'danger'
@@ -26,20 +28,79 @@ export type IButtonNativeType = 'button' | 'submit' | 'reset';
  *     color 自定义按钮的颜色。
  *     disabled  按钮是否为禁用状态
  */
-export interface ITdButtonConfig extends ITypeConfig {
-    size?: IButtonSize;
+export interface TdButtonProps extends TypeProps {
+    svgObj?: TypeSvgSvg;
+    /**
+     * @description button size
+     */
+    size?: ComponentSize;
+    /**
+     * @description disable the button
+     */
     disabled?: boolean;
+    /**
+     * @description button type
+     */
     type?: IButtonType;
-    svgObj?: TypeSvgSvg;
-    icon?: string;
+    /**
+     * @description icon component
+     */
+    icon?: TypeSvgSvg;
+    /**
+     * @description native button type
+     */
     nativeType?: IButtonNativeType;
+    /**
+     * @description determine whether it's loading
+     */
     loading?: boolean;
+    /**
+     * @description customize loading icon component
+     *     default?: () => Loading;
+     */
     loadingIcon?: TypeSvgSvg;
+    /**
+     * @description determine whether it's a plain button
+     */
     plain?: boolean;
+    /**
+     * @description determine whether it's a text button
+     */
     text?: boolean;
+    /**
+     * @description determine whether it's a link button
+     */
     link?: boolean;
-    round?: boolean;
+    /**
+     * @description determine whether the text button background color is always on
+     */
     bg?: boolean;
+    /**
+     * @description native button autofocus
+     */
+    autofocus?: boolean;
+    /**
+     * @description determine whether it's a round button
+     */
+    round?: boolean;
+    /**
+     * @description determine whether it's a circle button
+     */
     circle?: boolean;
+    /**
+     * @description custom button color; automatically calculate `hover` and `active` color
+     */
     color?: string;
+    /**
+     * @description dark mode; which automatically converts `color` to dark mode colors
+     */
+    dark?: boolean;
+    /**
+     * @description automatically insert a space between two chinese characters
+     */
+    autoInsertSpace?: boolean;
+    /**
+     * @description custom element tag
+     */
+    tag?: string;
 }

package/src/components/basic/td-button/td-button.interface.js

@@ -1,6 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-// export interface ITdButtonSlots extends IUISlots {
-//   loading?: SlotNode;
-//   icon?: SlotNode; // 这里不是 TdIcon, 而是 svg
-// }

package/src/components/basic/td-button/td-button.style.d.ts

@@ -6,11 +6,13 @@ export declare const $buttonBorderRadius: {
     small: string;
 };
 export declare const $buttonPaddingVertical: {
+    '': string;
     large: string;
     default: string;
     small: string;
 };
 export declare const $buttonPaddingHorizontal: {
+    '': string;
     large: string;
     default: string;
     small: string;

package/src/components/basic/td-button/td-button.style.js

@@ -11,11 +11,13 @@ exports.$buttonBorderRadius = {
     small: parseInt(var_1.$borderRadius.base, 10) - 1 + 'px',
 };
 exports.$buttonPaddingVertical = {
+    '': '9px',
     large: '13px',
     default: '9px',
     small: '6px',
 };
 exports.$buttonPaddingHorizontal = {
+    '': '16px',
     large: '20px',
     default: '16px',
     small: '12px',
@@ -23,7 +25,7 @@ exports.$buttonPaddingHorizontal = {
 exports.$buttonIconSpanGap = {
     large: '8px',
     default: '6px',
-    small: '4px'
+    small: '4px',
 };
 exports.$sizeOpts = {
     // mini: {
@@ -36,20 +38,20 @@ exports.$sizeOpts = {
         height: var_1.$commonComponentSize.small,
         fontSize: var_1.$fontSizeMap.small,
         padding: exports.$buttonPaddingVertical.small + ' ' + exports.$buttonPaddingHorizontal.small,
-        borderRadius: exports.$buttonBorderRadius.small
+        borderRadius: exports.$buttonBorderRadius.small,
     },
     default: {
         height: var_1.$commonComponentSize.default,
         fontSize: var_1.$fontSizeMap.default,
         padding: exports.$buttonPaddingVertical.default + ' ' + exports.$buttonPaddingHorizontal.default,
-        borderRadius: exports.$buttonBorderRadius.default
+        borderRadius: exports.$buttonBorderRadius.default,
     },
     large: {
         height: var_1.$commonComponentSize.large,
         fontSize: var_1.$fontSizeMap.large,
         padding: exports.$buttonPaddingVertical.large + ' ' + exports.$buttonPaddingHorizontal.large,
-        borderRadius: exports.$buttonBorderRadius.large
-    }
+        borderRadius: exports.$buttonBorderRadius.large,
+    },
 };
 exports.$tdButtonBase = {
     display: 'inline-flex',
@@ -75,7 +77,7 @@ exports.$tdButtonBase = {
     // borderWidth: $borderWidth,
     // borderStyle: $borderStyle,
     borderColor: var_1.$button.borderColor, // getCssVar('button', 'border-color');
-    padding: '8px 15px'
+    padding: '8px 15px',
 };
 exports.$buttonStateColors = {};
 function buttonVariant($type) {
@@ -85,24 +87,24 @@ function buttonVariant($type) {
             backgroundColor: var_1.$colors[$type].base,
             borderColor: var_1.$colors[$type].base,
             borderWidth: var_1.$borderWidth,
-            outlineColor: var_1.$colors[$type]['light-5']
+            outlineColor: var_1.$colors[$type]['light-5'],
             // activeColor: $colors[$type]['dark-2'],
         },
         hover: {
             color: var_1.$colorWhite,
             // 'link-text-color': $colors[$type]['light-5'],
             backgroundColor: var_1.$colors[$type]['light-3'], // ['color', $type, 'light-3'],
-            borderColor: var_1.$colors[$type]['light-3'] // ['color', $type, 'light-3'],
+            borderColor: var_1.$colors[$type]['light-3'], // ['color', $type, 'light-3'],
         },
         active: {
             backgroundColor: var_1.$colors[$type]['dark-2'], // ['color', $type, 'dark-2'],
-            borderColor: var_1.$colors[$type]['dark-2'] // ['color', $type, 'dark-2'],
+            borderColor: var_1.$colors[$type]['dark-2'], // ['color', $type, 'dark-2'],
         },
         disabled: {
             color: var_1.$colorWhite,
             backgroundColor: var_1.$colors[$type]['light-5'], // ['color', $type, 'light-5'],
-            borderColor: var_1.$colors[$type]['light-5'] // ['color', $type, 'light-5'],
-        }
+            borderColor: var_1.$colors[$type]['light-5'], // ['color', $type, 'light-5'],
+        },
     };
     // for (const $type1 in $buttonColorTypes) {
     //   console.log('$type1 is ', $type1);
@@ -132,7 +134,7 @@ for (const $type of [
     'success',
     'warning',
     'danger',
-    'info'
+    'info',
 ]) {
     // @include m($type) {
     //   @include button-variant($type);
@@ -146,21 +148,21 @@ function buttonPlain($type) {
             color: var_1.$colors[$type].base,
             backgroundColor: var_1.$colors[$type]['light-9'],
             borderColor: var_1.$colors[$type]['light-5'],
-            borderWidth: var_1.$borderWidth
+            borderWidth: var_1.$borderWidth,
         },
         hover: {
             color: var_1.$colorWhite,
             backgroundColor: var_1.$colors[$type].base,
-            borderColor: var_1.$colors[$type].base
+            borderColor: var_1.$colors[$type].base,
         },
         active: {
-            color: var_1.$colorWhite
+            color: var_1.$colorWhite,
         },
         disabled: {
             color: var_1.$colors[$type].base,
             backgroundColor: var_1.$colors[$type]['light-9'], // ['color', $type, 'light-5'],
-            borderColor: var_1.$colors[$type]['light-5'] // ['color', $type, 'light-5'],
-        }
+            borderColor: var_1.$colors[$type]['light-5'], // ['color', $type, 'light-5'],
+        },
     };
 }
 for (const $type of [
@@ -169,7 +171,7 @@ for (const $type of [
     'success',
     'warning',
     'danger',
-    'info'
+    'info',
 ]) {
     buttonPlain($type);
 }

package/src/components/basic/td-button/use-button.d.ts

@@ -0,0 +1,21 @@
+import { AnyFn } from '@type-dom/framework';
+import { TdButtonProps } from './td-button.interface';
+export declare const useButton: (props: TdButtonProps, emit: AnyFn) => {
+    _disabled: import("@type-dom/signals").Computed<boolean>;
+    _size: import("@type-dom/signals").Computed<"" | "default" | "small" | "large">;
+    _type: import("@type-dom/signals").Computed<"primary" | "success" | "warning" | "danger" | "info" | "default" | "" | "text">;
+    _ref: import("@type-dom/signals").Signal<HTMLButtonElement | undefined>;
+    _props: import("@type-dom/signals").Computed<{
+        ariaDisabled: boolean | undefined;
+        disabled: boolean | undefined;
+        autofocus: boolean | undefined;
+        type: import("./td-button.interface").IButtonNativeType | undefined;
+    } | {
+        ariaDisabled?: undefined;
+        disabled?: undefined;
+        autofocus?: undefined;
+        type?: undefined;
+    }>;
+    shouldAddSpace: import("@type-dom/signals").Computed<boolean>;
+    handleClick: (evt?: MouseEvent) => void;
+};

package/src/components/basic/td-button/use-button.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useButton = void 0;
+const signals_1 = require("@type-dom/signals");
+const framework_1 = require("@type-dom/framework");
+const use_deprecated_1 = require("../../../hooks/use-deprecated");
+const use_form_item_1 = require("../../form/td-form/hooks/use-form-item");
+const use_form_common_props_1 = require("../../form/td-form/hooks/use-form-common-props");
+const constants_1 = require("./constants");
+const td_config_provider_1 = require("../../configuration/td-config-provider");
+const useButton = (props, emit) => {
+    (0, use_deprecated_1.useDeprecated)({
+        from: 'type.text',
+        replacement: 'link',
+        version: '3.0.0',
+        scope: 'props',
+        ref: 'https://element-plus.org/en-US/component/button.html#button-attributes',
+    }, (0, signals_1.computed)(() => props.type === 'text'));
+    const buttonGroupContext = (0, framework_1.inject)(constants_1.buttonGroupContextKey, undefined);
+    const globalConfig = (0, td_config_provider_1.useGlobalConfig)('button');
+    const { form } = (0, use_form_item_1.useFormItem)();
+    const _size = (0, use_form_common_props_1.useFormSize)((0, signals_1.computed)(() => buttonGroupContext === null || buttonGroupContext === void 0 ? void 0 : buttonGroupContext.size));
+    const _disabled = (0, use_form_common_props_1.useFormDisabled)();
+    const _ref = (0, signals_1.signal)();
+    const slots = (0, framework_1.useSlots)();
+    const _type = (0, signals_1.computed)(() => props.type || (0, signals_1.unref)(buttonGroupContext === null || buttonGroupContext === void 0 ? void 0 : buttonGroupContext.type) || '');
+    const autoInsertSpace = (0, signals_1.computed)(() => {
+        var _a, _b, _c;
+        return (_c = (_a = props.autoInsertSpace) !== null && _a !== void 0 ? _a : (_b = globalConfig.get()) === null || _b === void 0 ? void 0 : _b.autoInsertSpace) !== null && _c !== void 0 ? _c : false;
+    });
+    const _props = (0, signals_1.computed)(() => {
+        if (props.tag === 'button') {
+            return {
+                ariaDisabled: _disabled.get() || props.loading,
+                disabled: _disabled.get() || props.loading,
+                autofocus: props.autofocus,
+                type: props.nativeType,
+            };
+        }
+        return {};
+    });
+    // add space between two characters in Chinese
+    const shouldAddSpace = (0, signals_1.computed)(() => {
+        const defaultSlot = (0, framework_1.arraySlot)(slots === null || slots === void 0 ? void 0 : slots.default);
+        if (autoInsertSpace.get() && (defaultSlot === null || defaultSlot === void 0 ? void 0 : defaultSlot.length) === 1) {
+            const slot = defaultSlot[0];
+            if ((slot === null || slot === void 0 ? void 0 : slot.type) === Text) {
+                const text = slot.children;
+                return /^\p{Unified_Ideograph}{2}$/u.test(text.trim());
+            }
+        }
+        return false;
+    });
+    const handleClick = (evt) => {
+        if (_disabled.get() || props.loading) {
+            evt === null || evt === void 0 ? void 0 : evt.stopPropagation();
+            return;
+        }
+        if (props.nativeType === 'reset') {
+            form === null || form === void 0 ? void 0 : form.resetFields();
+        }
+        // emit('click', evt)
+    };
+    return {
+        _disabled,
+        _size,
+        _type,
+        _ref,
+        _props,
+        shouldAddSpace,
+        handleClick,
+    };
+};
+exports.useButton = useButton;

package/src/components/basic/td-button-group/style/css.d.ts

@@ -0,0 +1,2 @@
+import '../../../base/style/css';
+import '../../../../theme-chalk/el-button-group.css';

package/src/components/basic/td-button-group/style/css.js

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

package/src/components/basic/td-button-group/style/index.d.ts

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

package/src/components/basic/td-button-group/style/index.js

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

package/src/components/basic/td-button-group/td-button-group.class.d.ts

@@ -1,11 +1,11 @@
 import { TypeDiv } from '@type-dom/framework';
 import { TdButton } from '../td-button/td-button.class';
 import { ITdButtonGroup, ITdButtonGroupConfig } from './td-button-group.interface';
+import './style/index';
 export declare class TdButtonGroup extends TypeDiv implements ITdButtonGroup {
     className: 'TdButtonGroup';
+    props: ITdButtonGroupConfig;
     childNodes: TdButton[];
     constructor(params: ITdButtonGroupConfig);
     setup(): void;
-    addBtnStyle(btn: TdButton, index: number): void;
-    setBtnStyle(btn: TdButton, index: number): void;
 }

package/src/components/basic/td-button-group/td-button-group.class.js

@@ -2,102 +2,28 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TdButtonGroup = void 0;
 const framework_1 = require("@type-dom/framework");
-const td_button_style_1 = require("../td-button/td-button.style");
+const signals_1 = require("@type-dom/signals");
+const use_namespace_1 = require("../../../hooks/use-namespace");
+const constants_1 = require("../td-button/constants");
+require("./style/index");
 class TdButtonGroup extends framework_1.TypeDiv {
     constructor(params) {
         super();
         this.className = 'TdButtonGroup';
-        this.attr.addName('td-button-group');
-        this.style.addObj({
-            display: 'inline-block',
-            verticalAlign: 'middle',
-        });
         this.childNodes = [];
-        if (params === null || params === void 0 ? void 0 : params.slot) {
-            this.slotChild(params.slot);
-        }
-        this.useParams(params);
+        this.props = this.useParams(params);
     }
     setup() {
         console.log('td-button-group setup . ');
-        this.childNodes.forEach((btn, index) => {
-            if (this.childNodes.length > 1) {
-                this.setBtnStyle(btn, index);
-            }
-            btn.addEvents({
-                mouseenter: () => {
-                    btn.style.setObj({
-                        zIndex: 1,
-                    });
-                    if (this.childNodes.length > 1) {
-                        this.setBtnStyle(btn, index);
-                    }
-                },
-                mouseleave: () => {
-                    btn.style.setObj({
-                        zIndex: 1,
-                    });
-                    if (this.childNodes.length > 1) {
-                        this.setBtnStyle(btn, index);
-                    }
-                },
-            });
+        const props = this.props;
+        this.attr.addName('td-button-group');
+        const ns = (0, use_namespace_1.useNamespace)('button');
+        this.attr.addClass(ns.b('group'));
+        this.slotChildren(props.slot);
+        this.provide(constants_1.buttonGroupContextKey, {
+            size: (0, signals_1.toRef)(props, 'size'),
+            type: (0, signals_1.toRef)(props, 'type'),
         });
     }
-    addBtnStyle(btn, index) {
-        console.log('td-button-group addBtnStyle . ');
-        if (index === 0) {
-            btn.style.addObj({
-                borderTopRightRadius: 0,
-                borderBottomRightRadius: 0,
-                marginRight: '-1px',
-                borderRightColor: td_button_style_1.$borderRightColor,
-            });
-        }
-        else if (index === this.children.length - 1) {
-            btn.style.addObj({
-                borderTopLeftRadius: 0,
-                borderBottomLeftRadius: 0,
-                borderLeftColor: td_button_style_1.$borderRightColor,
-            });
-        }
-        else {
-            btn.style.addObj({
-                borderTopRightRadius: 0,
-                borderTopLeftRadius: 0,
-                borderBottomRightRadius: 0,
-                borderBottomLeftRadius: 0,
-                borderLeftColor: td_button_style_1.$borderRightColor,
-                borderRightColor: td_button_style_1.$borderRightColor,
-            });
-        }
-    }
-    setBtnStyle(btn, index) {
-        if (index === 0) {
-            btn.style.setObj({
-                borderTopRightRadius: 0,
-                borderBottomRightRadius: 0,
-                marginRight: '-1px',
-                borderRightColor: td_button_style_1.$borderRightColor,
-            });
-        }
-        else if (index === this.children.length - 1) {
-            btn.style.setObj({
-                borderTopLeftRadius: 0,
-                borderBottomLeftRadius: 0,
-                borderLeftColor: td_button_style_1.$borderRightColor,
-            });
-        }
-        else {
-            btn.style.setObj({
-                borderTopRightRadius: 0,
-                borderTopLeftRadius: 0,
-                borderBottomRightRadius: 0,
-                borderBottomLeftRadius: 0,
-                borderLeftColor: td_button_style_1.$borderRightColor,
-                borderRightColor: td_button_style_1.$borderRightColor,
-            });
-        }
-    }
 }
 exports.TdButtonGroup = TdButtonGroup;

package/src/components/basic/td-button-group/td-button-group.interface.d.ts

@@ -1,9 +1,10 @@
-import { ITypeConfig, ITypeDiv } from '@type-dom/framework';
-import { IButtonSize, IButtonType, ITdButtonConfig } from '../td-button/td-button.interface';
+import { ITypeDiv, TypeDivProps } from '@type-dom/framework';
+import { IButtonSize, IButtonType, TdButtonProps } from '../td-button/td-button.interface';
 export interface ITdButtonGroup extends ITypeDiv {
     className: 'TdButtonGroup';
+    props: ITdButtonGroupConfig;
 }
-export interface ITdButtonGroupConfig extends ITypeConfig {
+export interface ITdButtonGroupConfig extends TypeDivProps {
     /**
      * @description control the size of buttons in this button-group
      */
@@ -12,5 +13,5 @@ export interface ITdButtonGroupConfig extends ITypeConfig {
      * @description control the type of buttons in this button-group
      */
     type?: IButtonType;
-    options?: ITdButtonConfig[];
+    options?: TdButtonProps[];
 }

package/src/components/basic/td-container/style/css.d.ts

@@ -0,0 +1,6 @@
+import '@element-plus/components/base/style/css';
+import '@element-plus/theme-chalk/el-container.css';
+import '@element-plus/theme-chalk/el-aside.css';
+import '@element-plus/theme-chalk/el-footer.css';
+import '@element-plus/theme-chalk/el-header.css';
+import '@element-plus/theme-chalk/el-main.css';

package/src/components/basic/td-container/style/css.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+require("@element-plus/components/base/style/css");
+require("@element-plus/theme-chalk/el-container.css");
+require("@element-plus/theme-chalk/el-aside.css");
+require("@element-plus/theme-chalk/el-footer.css");
+require("@element-plus/theme-chalk/el-header.css");
+require("@element-plus/theme-chalk/el-main.css");

package/src/components/basic/td-container/style/index.d.ts

@@ -0,0 +1,6 @@
+import '../../../base/style';
+import '../../../../theme-chalk/container.scss';
+import '../../../../theme-chalk/aside.scss';
+import '../../../../theme-chalk/footer.scss';
+import '../../../../theme-chalk/header.scss';
+import '../../../../theme-chalk/main.scss';

package/src/components/basic/td-container/style/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+require("../../../base/style");
+require("../../../../theme-chalk/container.scss");
+require("../../../../theme-chalk/aside.scss");
+require("../../../../theme-chalk/footer.scss");
+require("../../../../theme-chalk/header.scss");
+require("../../../../theme-chalk/main.scss");

package/src/components/basic/td-container/td-aside/style/css.d.ts

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

package/src/components/basic/td-container/td-aside/style/css.js

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

package/src/components/basic/td-container/td-aside/style/index.d.ts

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

package/src/components/basic/td-container/td-aside/style/index.js

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

package/src/components/basic/td-container/td-aside/td-aside.class.d.ts

@@ -1,7 +1,8 @@
-import { TypeDiv } from '@type-dom/framework';
-import { ITdAside, ITdAsideConfig } from './td-aside.interface';
-export declare class TdAside extends TypeDiv implements ITdAside {
+import { TypeAside } from '@type-dom/framework';
+import { ITdAside, TdAsideProps } from './td-aside.interface';
+export declare class TdAside extends TypeAside implements ITdAside {
     className: 'TdAside';
-    props: ITdAsideConfig;
-    constructor(params?: ITdAsideConfig);
+    props: TdAsideProps;
+    constructor(params?: TdAsideProps);
+    setup(): void;
 }