@type-dom/ui 0.0.3 → 0.0.5

package/src/components/navigation/td-anchor/td-anchor.interface.d.ts

@@ -0,0 +1,44 @@
+import { IUI, IUIConfig } from '../../../ui/ui.interface';
+export interface ITdAnchor extends IUI {
+    className: 'TdAnchor';
+}
+export interface ITdAnchorConfig extends IUIConfig {
+    /**
+     * @description scroll container
+     */
+    container?: string | HTMLElement | Window;
+    /**
+     * @description Set the offset of the anchor scroll
+     *     default: 0,
+     */
+    offset?: number;
+    /**
+     * @description The offset of the element starting to trigger the anchor
+     *     default: 15,
+     */
+    bound?: number;
+    /**
+     * @description Set the scroll duration of the container when the anchor is clicked, in milliseconds
+     *     default: 300,
+     */
+    duration?: number;
+    /**
+     * @description Whether to show the marker
+     *     default: true,
+     */
+    marker?: boolean;
+    /**
+     * @description Set Anchor type
+     *     default: 'default',
+     */
+    type?: 'default' | 'underline';
+    /**
+     * @description Set Anchor direction
+     *     default: 'vertical',
+     */
+    direction?: 'vertical' | 'horizontal';
+}
+export interface AnchorLinkState {
+    el: HTMLElement;
+    href: string;
+}

package/src/components/navigation/td-anchor/td-anchor.interface.js

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

package/src/components/navigation/td-anchor/td-anchor.style.d.ts

@@ -0,0 +1,14 @@
+export declare const $anchor: {
+    bgColor: {
+        '': string;
+        default: string;
+        page: string;
+        overlay: string;
+    };
+    paddingIndent: string;
+    lineHeight: string;
+    fontSize: string;
+    color: string;
+    activeColor: string;
+    markerBgColor: string;
+};

package/src/components/navigation/td-anchor/td-anchor.style.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.$anchor = void 0;
+const var_1 = require("../../../styles/var");
+exports.$anchor = {
+    // bgColor: getCssVar('bg-color'),
+    bgColor: var_1.$bgColor,
+    paddingIndent: '14px',
+    lineHeight: '22px',
+    fontSize: '12px',
+    // color: getCssVar('text-color-secondary'),
+    color: var_1.$textColor.secondary,
+    // activeColor: getCssVar('color-primary'),
+    activeColor: var_1.$colorPrimary,
+    // markerBgColor: getCssVar('color-primary'),
+    markerBgColor: var_1.$colorPrimary
+};

package/src/components/navigation/td-backtop/td-backtop.class.d.ts

@@ -0,0 +1,17 @@
+import { UI } from '../../../ui/ui.abstract';
+import { ITdBackTop, ITdBackTopConfig } from './td-backtop.interface';
+export declare class TdBackTop extends UI implements ITdBackTop {
+    className: 'TdBackTop';
+    props: ITdBackTopConfig;
+    static initCalled: boolean;
+    private container;
+    private el;
+    private visible;
+    private transition;
+    private division;
+    constructor(params?: ITdBackTopConfig);
+    mounted(): void;
+    initEvents(): void;
+    handleScroll(event?: MouseEvent): void;
+    handleClick(event?: MouseEvent): void;
+}

package/src/components/navigation/td-backtop/td-backtop.class.js

@@ -0,0 +1,145 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdBackTop = void 0;
+const rxjs_1 = require("rxjs");
+const framework_1 = require("@type-dom/framework");
+const svgs_1 = require("@type-dom/svgs");
+const utils_1 = require("@type-dom/utils");
+const ui_abstract_1 = require("../../../ui/ui.abstract");
+const var_1 = require("../../../styles/var");
+const td_icon_class_1 = require("../../basic/td-icon/td-icon.class");
+const td_backtop_style_1 = require("./td-backtop.style");
+class TdBackTop extends ui_abstract_1.UI {
+    constructor(params) {
+        super(params, 'fragment');
+        this.visible = false;
+        this.className = 'TdBackTop';
+        this.division = new framework_1.Div({
+            name: 'td-back-top',
+            attrObj: {
+                class: 'td-back-top'
+            },
+            styleObj: {
+                right: (0, utils_1.addUnit)(params === null || params === void 0 ? void 0 : params.right) || '40px',
+                bottom: (0, utils_1.addUnit)(params === null || params === void 0 ? void 0 : params.bottom) || '40px',
+                position: 'fixed',
+                // backgroundColor: getCssVar('backtop', 'bg-color'),
+                // backgroundColor: $backtop.bgColor,
+                width: '40px',
+                height: '40px',
+                borderRadius: '50%',
+                // color: getCssVar('backtop', 'text-color'),
+                color: td_backtop_style_1.$backtop.textColor,
+                // display: this.visible ? 'flex' : 'none',
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                fontSize: '20px',
+                // boxShadow: getCssVar('box-shadow', 'lighter'),
+                boxShadow: var_1.$boxShadow.lighter,
+                cursor: 'pointer',
+                zIndex: 999
+            },
+            events: {
+                click: (event) => {
+                    this.handleClick(event);
+                }
+            }
+        });
+        this.division.ctrl.addAttrObj({
+            componentId: this.componentId
+        });
+        this.transition = new framework_1.Transition({
+            name: 'fade',
+            slot: this.division
+        });
+        this.addChild(this.transition);
+        // this.ctrl.addAttrName('td-back-top');
+        if (!TdBackTop.initCalled) {
+            TdBackTop.initCalled = true;
+            (0, framework_1.createClass)('td-back-top', {
+                // position: 'fixed',
+                // backgroundColor: getCssVar('backtop', 'bg-color'),
+                backgroundColor: td_backtop_style_1.$backtop.bgColor
+                // width: '40px',
+                // height: '40px',
+                // borderRadius: '50%',
+                // // color: getCssVar('backtop', 'text-color'),
+                // color: $backtop.textColor,
+                // display: 'flex',
+                // // display: 'flex',
+                // alignItems: 'center',
+                // justifyContent: 'center',
+                // fontSize: '20px',
+                // // boxShadow: getCssVar('box-shadow', 'lighter'),
+                // boxShadow: $boxShadow.lighter,
+                // cursor: 'pointer',
+                // zIndex: 5
+            });
+            (0, framework_1.createClass)('td-back-top:hover', {
+                backgroundColor: td_backtop_style_1.$backtop.hoverBgColor
+            });
+        }
+        this.division.addChild(this.getSlotNode());
+        if (params === null || params === void 0 ? void 0 : params.slot) {
+            // this.setSlot(this.transition, this.props.slot);
+            // this.division.slotChild(params.slot);
+        }
+        else {
+            this.getSlotNode().resetSlot(new td_icon_class_1.TdIcon({
+                size: 20,
+                svgObj: new svgs_1.ElCaretTopSvg()
+            }));
+        }
+        this.container = document;
+        this.el = document.documentElement; // todo 监听不生效 ？？？？
+        this.props = this.setParams(params);
+    }
+    mounted() {
+        var _a;
+        console.log('TdBackTop mounted');
+        if ((_a = this.props) === null || _a === void 0 ? void 0 : _a.target) {
+            this.el = this.props.target;
+            // if (!this.el) {
+            //   throw Error(`target does not exist: ${this.props.target}`)
+            // }
+        }
+        // this.container = this.root?.dom as HTMLDivElement; // this.el;
+        // this.container.style.setProperty('over-flow', 'scroll');
+        // Give visible an initial value, fix #13066
+        this.handleScroll();
+    }
+    initEvents() {
+        console.log('TdBackTop initEvents');
+        // nextTick(() => {
+        console.log('TdBackTop initEvents 2');
+        this.subscriptions.push((0, rxjs_1.fromEvent)(this.container, 'scroll')
+            .pipe((0, rxjs_1.throttleTime)(300))
+            .subscribe((event) => {
+            // console.error('handleScroll . 1');
+            this.handleScroll(event);
+        }));
+        // });
+    }
+    handleScroll(event) {
+        var _a;
+        console.error('handleScroll . ');
+        // console.log('this.el', this.el);
+        if (this.el) {
+            this.visible =
+                this.el.scrollTop >= (((_a = this.props) === null || _a === void 0 ? void 0 : _a.visibilityHeight) || 200);
+            console.log('this.visible', this.visible);
+            // this.setStyleObj({
+            //   display: this.visible ? 'flex' : 'none',
+            // })
+            this.transition.showSlot(this.visible);
+        }
+    }
+    handleClick(event) {
+        var _a;
+        console.error('handleClick . ');
+        (_a = this.el) === null || _a === void 0 ? void 0 : _a.scrollTo({ top: 0, behavior: 'smooth' });
+    }
+}
+exports.TdBackTop = TdBackTop;
+TdBackTop.initCalled = false;

package/src/components/navigation/td-backtop/td-backtop.interface.d.ts

@@ -0,0 +1,26 @@
+import { IUI, IUIConfig } from '../../../ui/ui.interface';
+export interface ITdBackTop extends IUI {
+    className: 'TdBackTop';
+}
+export interface ITdBackTopConfig extends IUIConfig {
+    /**
+     * @description the button will not show until the scroll height reaches this value.
+     *     default: 200,
+     */
+    visibilityHeight?: number;
+    /**
+     * @description the target to trigger scroll.
+     *     default: '',
+     */
+    target?: HTMLElement;
+    /**
+     * @description right distance.
+     *     default: 40,
+     */
+    right?: number;
+    /**
+     * @description bottom distance.
+     *     default: 40,
+     */
+    bottom?: number;
+}

package/src/components/navigation/td-backtop/td-backtop.interface.js

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

package/src/components/navigation/td-backtop/td-backtop.style.d.ts

@@ -0,0 +1,5 @@
+export declare const $backtop: {
+    bgColor: string;
+    textColor: string;
+    hoverBgColor: string;
+};

package/src/components/navigation/td-backtop/td-backtop.style.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.$backtop = void 0;
+const var_1 = require("../../../styles/var");
+exports.$backtop = {
+    // 'bg-color': getCssVar('bg-color', 'overlay'),
+    bgColor: var_1.$bgColor.overlay,
+    // 'text-color': getCssVar('color-primary'),
+    textColor: var_1.$colorPrimary,
+    // 'hover-bg-color': getCssVar('border-color-extra-light'),
+    hoverBgColor: var_1.$borderColor.extraLight
+    // 'hover-text-color':
+};

package/src/components/navigation/td-breadcrumb/td-breadcrumb.class.d.ts

@@ -0,0 +1,11 @@
+import { UI } from '../../../ui/ui.abstract';
+import { TdBreadcrumbItem } from '../td-breadcrumb-item/td-breadcrumb-item.class';
+import { ITdBreadcrumb, ITdBreadcrumbConfig } from './td-breadcrumb.interface';
+export declare class TdBreadcrumb extends UI implements ITdBreadcrumb {
+    className: 'TdBreadcrumb';
+    props: ITdBreadcrumbConfig;
+    childNodes: TdBreadcrumbItem[];
+    constructor(params?: ITdBreadcrumbConfig);
+    created(): void;
+    mounted(): void;
+}

package/src/components/navigation/td-breadcrumb/td-breadcrumb.class.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdBreadcrumb = void 0;
+const ui_abstract_1 = require("../../../ui/ui.abstract");
+//  todo link 样式没有添加
+class TdBreadcrumb extends ui_abstract_1.UI {
+    constructor(params) {
+        super(params);
+        this.className = 'TdBreadcrumb';
+        this.ctrl.addAttrName('td-breadcrumb');
+        this.ctrl.addStyleObj({
+            fontSize: '14px',
+            lineHeight: 1
+        });
+        this.childNodes = [];
+        if (params === null || params === void 0 ? void 0 : params.slot) {
+            this.slotChild(params === null || params === void 0 ? void 0 : params.slot);
+        }
+        this.props = this.setParams(params);
+    }
+    created() {
+        console.log('TdBreadcrumb created . ');
+        this.childNodes.forEach((item, index) => {
+            if (index < this.childNodes.length - 1) {
+                item.addSeparator(this.props);
+            }
+        });
+    }
+    mounted() {
+        var _a;
+        const items = this.childNodes;
+        if (items.length) {
+            (_a = items[items.length - 1]) === null || _a === void 0 ? void 0 : _a.ctrl.setAttribute('aria-current', 'page');
+        }
+    }
+}
+exports.TdBreadcrumb = TdBreadcrumb;

package/src/components/navigation/td-breadcrumb/td-breadcrumb.interface.d.ts

@@ -0,0 +1,16 @@
+import { TypeSvgSvg } from '@type-dom/framework';
+import { IUI, IUIConfig } from '../../../ui/ui.interface';
+export interface ITdBreadcrumb extends IUI {
+    className: 'TdBreadcrumb';
+}
+export interface ITdBreadcrumbConfig extends IUIConfig {
+    /**
+     * @description separator character
+     *     default: '/',
+     */
+    separator?: string;
+    /**
+     * @description icon component of icon separator
+     */
+    separatorIcon?: TypeSvgSvg;
+}

package/src/components/navigation/td-breadcrumb/td-breadcrumb.interface.js

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

package/src/components/navigation/td-breadcrumb-item/td-breadcrumb-item.class.d.ts

@@ -0,0 +1,8 @@
+import { UI } from '../../../ui/ui.abstract';
+import { ITdBreadcrumbConfig } from '../td-breadcrumb/td-breadcrumb.interface';
+import { ITdBreadcrumbItem, ITdBreadcrumbItemConfig } from './td-breadcrumb-item.interface';
+export declare class TdBreadcrumbItem extends UI implements ITdBreadcrumbItem {
+    className: 'TdBreadcrumbItem';
+    constructor(params?: ITdBreadcrumbItemConfig);
+    addSeparator(breadcrumbConfig?: ITdBreadcrumbConfig): void;
+}

package/src/components/navigation/td-breadcrumb-item/td-breadcrumb-item.class.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdBreadcrumbItem = void 0;
+const framework_1 = require("@type-dom/framework");
+const ui_abstract_1 = require("../../../ui/ui.abstract");
+const var_1 = require("../../../styles/var");
+const td_icon_class_1 = require("../../basic/td-icon/td-icon.class");
+class TdBreadcrumbItem extends ui_abstract_1.UI {
+    constructor(params) {
+        super(params, 'span');
+        this.className = 'TdBreadcrumbItem';
+        this.ctrl.addStyleObj({
+            float: 'left',
+            display: 'inline-flex',
+            alignItems: 'center'
+        });
+        const link = new framework_1.Span({
+            name: 'link',
+            attrObj: {
+                role: 'link'
+            },
+            styleObj: {
+                // color: getCssVar('text-color', 'regular');
+                color: var_1.$textColor.regular
+            },
+            events: {
+                click: (evt) => {
+                    if (!(params === null || params === void 0 ? void 0 : params.toPath) || !(params === null || params === void 0 ? void 0 : params.router)) {
+                        return;
+                    }
+                    (params === null || params === void 0 ? void 0 : params.replace)
+                        ? params.router.replace(params.toPath)
+                        : params.router.push(params.toPath);
+                    // params.replace ? params.router.replace(params.toPath) : params.router.push(params.toPath)
+                }
+            }
+        }); // todo slot
+        this.addChild(link);
+        if (params === null || params === void 0 ? void 0 : params.slot) {
+            this.slotChild(params === null || params === void 0 ? void 0 : params.slot);
+        }
+        this.setParams(params);
+    }
+    addSeparator(breadcrumbConfig) {
+        if (breadcrumbConfig === null || breadcrumbConfig === void 0 ? void 0 : breadcrumbConfig.separatorIcon) {
+            breadcrumbConfig.separatorIcon.ctrl.addStyleObj({
+                verticalAlign: 'middle'
+            });
+            this.addChild(new td_icon_class_1.TdIcon({
+                styleObj: {
+                    margin: '0 6px',
+                    fontWeight: 'normal'
+                },
+                svgObj: breadcrumbConfig.separatorIcon.clone()
+            }));
+        }
+        else {
+            this.addChild(new framework_1.Span({
+                text: (breadcrumbConfig === null || breadcrumbConfig === void 0 ? void 0 : breadcrumbConfig.separator) || '/',
+                attrObj: {
+                    role: 'presentation'
+                },
+                styleObj: {
+                    margin: '0 6px',
+                    fontWeight: 'normal'
+                }
+            }));
+        }
+    }
+}
+exports.TdBreadcrumbItem = TdBreadcrumbItem;

package/src/components/navigation/td-breadcrumb-item/td-breadcrumb-item.interface.d.ts

@@ -0,0 +1,18 @@
+import { IUI, IUIConfig } from '../../../ui/ui.interface';
+import { Router } from '@type-dom/framework';
+export interface ITdBreadcrumbItem extends IUI {
+    className: 'TdBreadcrumbItem';
+}
+export interface ITdBreadcrumbItemConfig extends IUIConfig {
+    /**
+     * @description target route of the link, same as `to` of `vue-router`
+     *     default: '',
+     */
+    toPath?: string;
+    /**
+     * @description if `true`, the navigation will not leave a history record
+     *     default: false,
+     */
+    replace?: boolean;
+    router?: Router;
+}

package/src/components/navigation/td-breadcrumb-item/td-breadcrumb-item.interface.js

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

package/src/components/navigation/td-dropdown/td-dropdown.class.js

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

package/src/components/navigation/td-dropdown/td-dropdown.interface.js

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

package/src/components/navigation/td-menu/td-menu.class.d.ts

@@ -2,6 +2,7 @@ import { UI } from '../../../ui/ui.abstract';
 import { ITdMenu, ITdMenuConfig } from './td-menu.interface';
 export declare class TdMenu extends UI implements ITdMenu {
     className: 'TdMenu';
-    constructor(config?: ITdMenuConfig);
-    setConfig(config?: ITdMenuConfig): void;
+    props: ITdMenuConfig;
+    constructor(params?: ITdMenuConfig);
+    setup(): void;
 }

package/src/components/navigation/td-menu/td-menu.class.js

@@ -4,13 +4,14 @@ exports.TdMenu = void 0;
 const ui_abstract_1 = require("../../../ui/ui.abstract");
 const var_1 = require("../../../styles/var");
 class TdMenu extends ui_abstract_1.UI {
-    constructor(config) {
-        super({ tag: 'ul' });
+    constructor(params) {
+        super(params, 'ul');
         this.className = 'TdMenu';
-        this.addAttrObj({
+        this.ctrl.addAttrObj({
+            name: 'td-menu',
             role: 'menubar'
         });
-        this.addStyleObj({
+        this.ctrl.addStyleObj({
             // border-right: solid 1px var(--el-menu-border-color),
             borderRight: 'solid 1px ' + var_1.$borderColor.base,
             listStyle: 'none',
@@ -21,16 +22,16 @@ class TdMenu extends ui_abstract_1.UI {
             backgroundColor: var_1.$borderColor.base,
             boxSizing: 'border-box'
         });
-        this.setConfig(config);
+        this.props = this.setParams(params);
     }
-    setConfig(config) {
-        super.setConfig(config);
-        const mode = (config === null || config === void 0 ? void 0 : config.mode) || 'vertical';
+    setup() {
+        const props = this.props;
+        const mode = props.mode || 'vertical';
         if (mode === 'vertical') {
-            this.addStyleObj({});
+            this.ctrl.addStyleObj({});
         }
         else {
-            this.addStyleObj({
+            this.ctrl.addStyleObj({
                 display: 'flex',
                 flexWrap: 'nowrap',
                 borderRight: 'none'

package/src/components/navigation/td-page-header/td-page-header.class.js

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

package/src/components/navigation/td-page-header/td-page-header.interface.js

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

package/src/components/navigation/td-steps/td-steps.class.js

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

package/src/components/navigation/td-steps/td-steps.interface.js

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

package/src/components/navigation/td-tabs/td-tab-bar.class.d.ts

@@ -0,0 +1,12 @@
+import { IStyle } from '@type-dom/css-type';
+import { UI } from '../../../ui/ui.abstract';
+import { ITdTabBar, ITdTabBarConfig } from './td-tab-bar.interface';
+export declare class TdTabBar extends UI implements ITdTabBar {
+    className: 'TdTabBar';
+    props: ITdTabBarConfig;
+    barStyle?: IStyle;
+    private rootTabs;
+    constructor(params: ITdTabBarConfig);
+    getBarStyle(): IStyle;
+    change(): void;
+}

package/src/components/navigation/td-tabs/td-tab-bar.class.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdTabBar = void 0;
+const utils_1 = require("@type-dom/utils");
+const ui_abstract_1 = require("../../../ui/ui.abstract");
+const td_tabs_style_1 = require("./td-tabs.style");
+class TdTabBar extends ui_abstract_1.UI {
+    constructor(params) {
+        super(params);
+        this.className = 'TdTabBar';
+        this.ctrl.addAttrName('td-tab-bar');
+        this.ctrl.addStyleObj(td_tabs_style_1.$tabsActiveBarStyle);
+        this.rootTabs = params.rootTabs;
+        this.props = this.setParams(params);
+    }
+    getBarStyle() {
+        var _a;
+        console.log('getBarStyle . ');
+        let offset = 0;
+        let tabSize = 0;
+        const sizeName = ['top', 'bottom'].includes(((_a = this.rootTabs) === null || _a === void 0 ? void 0 : _a.props.tabPosition) || 'top')
+            ? 'width'
+            : 'height';
+        const sizeDir = sizeName === 'width' ? 'x' : 'y';
+        const position = sizeDir === 'x' ? 'left' : 'top';
+        this.props.tabs.every((tab, index) => {
+            var _a, _b;
+            // const $el = instance.parent?.refs?.[`tab-${tab.uid}`] as HTMLElement
+            const $el = (_a = this.rootTabs.tabNav.tabs.find((node) => { var _a, _b; return ((_a = node.props.attrObj) === null || _a === void 0 ? void 0 : _a.tabName) === ((_b = tab.name) !== null && _b !== void 0 ? _b : (index + 1)); })) === null || _a === void 0 ? void 0 : _a.dom;
+            console.log('$el is ', $el);
+            if (!$el)
+                return false;
+            const tabName = (_b = tab.name) !== null && _b !== void 0 ? _b : (index + 1);
+            if (tabName !== this.rootTabs.currentName) {
+                return true;
+            }
+            offset =
+                $el[`offset${(0, utils_1.capitalize)(position)}`];
+            tabSize =
+                $el[`client${(0, utils_1.capitalize)(sizeName)}`];
+            const tabStyles = window.getComputedStyle($el);
+            // console.log('tabStyle is ', tabStyles);
+            if (sizeName === 'width') {
+                tabSize -=
+                    Number.parseFloat(tabStyles.paddingLeft) +
+                        Number.parseFloat(tabStyles.paddingRight);
+                offset += Number.parseFloat(tabStyles.paddingLeft);
+            }
+            return false;
+        });
+        return {
+            [sizeName]: `${tabSize}px`,
+            transform: `translate${(0, utils_1.capitalize)(sizeDir)}(${offset}px)`,
+        };
+    }
+    change() {
+        console.log('update . ');
+        this.barStyle = this.getBarStyle();
+        this.ctrl.setStyleObj(this.barStyle);
+    }
+}
+exports.TdTabBar = TdTabBar;

package/src/components/navigation/td-tabs/td-tab-bar.interface.d.ts

@@ -0,0 +1,10 @@
+import { IUI, IUIConfig } from '../../../ui/ui.interface';
+import { ITdTabPaneConfig } from './td-tab-pane.interface';
+import { TdTabs } from './td-tabs.class';
+export interface ITdTabBar extends IUI {
+    className: 'TdTabBar';
+}
+export interface ITdTabBarConfig extends IUIConfig {
+    tabs: ITdTabPaneConfig[];
+    rootTabs: TdTabs;
+}

package/src/components/navigation/td-tabs/td-tab-bar.interface.js

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