@type-dom/ui 0.2.2 → 0.3.1

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

@@ -0,0 +1,337 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { capitalize, throwError } from '@type-dom/utils';
+import { Div, Span, nextTick, TypeDiv, onMounted, useResizeObserver, inject, onUpdated, defineExpose, arraySlot, useWindowFocus, useDocumentVisibility, } from '@type-dom/framework';
+import { ElArrowLeftSvg, ElArrowRightSvg, ElCloseSvg } from '@type-dom/svgs';
+import { computed, signal, unref, watch } from '@type-dom/signals';
+import { EVENT_CODE } from '../../../constants/aria';
+import { useNamespace } from '../../../hooks/use-namespace';
+import { TdIcon } from '../../basic/td-icon/td-icon.class';
+import { TdTabBar } from './td-tab-bar.class';
+// import { TdTabs } from './td-tabs.class';
+import { tabsRootContextKey } from './constants';
+export class TdTabNav extends TypeDiv {
+    constructor(params = {}) {
+        super();
+        this.className = 'TdTabNav';
+        this.attr.addName('td-tab-nav-wrap');
+        this.props = this.useParams(params);
+    }
+    setup() {
+        var _a, _b, _c;
+        const props = this.props;
+        const emit = this.emit;
+        const COMPONENT_NAME = 'TdTabNav';
+        const rootTabs = inject(tabsRootContextKey);
+        if (!rootTabs)
+            throwError(COMPONENT_NAME, `<td-tabs><tab-nav /></td-tabs>`);
+        const ns = useNamespace('tabs');
+        const visibility = useDocumentVisibility();
+        const focused = useWindowFocus();
+        const navScroll$ = signal();
+        const nav$ = signal();
+        const el$ = signal();
+        const tabBarRef = signal();
+        const scrollable = signal(undefined);
+        const navOffset = signal(0);
+        const isFocus = signal(false);
+        const focusable = signal(true);
+        const sizeName = computed(() => ['top', 'bottom'].includes(rootTabs.props.tabPosition)
+            ? 'width'
+            : 'height');
+        const navStyle = computed(() => {
+            const dir = sizeName.get() === 'width' ? 'X' : 'Y';
+            return {
+                transform: `translate${dir}(-${navOffset.get()}px)`,
+            };
+        });
+        const scrollPrev = () => {
+            var _a;
+            if (!navScroll$.get())
+                return;
+            const containerSize = (_a = navScroll$.get()) === null || _a === void 0 ? void 0 : _a[`offset${capitalize(sizeName.get())}`];
+            const currentOffset = navOffset.get();
+            if (!currentOffset)
+                return;
+            const newOffset = currentOffset > containerSize ? currentOffset - containerSize : 0;
+            navOffset.set(newOffset);
+        };
+        const scrollNext = () => {
+            var _a, _b;
+            if (!navScroll$.get() || !nav$.get())
+                return;
+            const navSize = (_a = nav$.get()) === null || _a === void 0 ? void 0 : _a[`offset${capitalize(sizeName.get())}`];
+            const containerSize = (_b = navScroll$.get()) === null || _b === void 0 ? void 0 : _b[`offset${capitalize(sizeName.get())}`];
+            const currentOffset = navOffset.get();
+            if (navSize - currentOffset <= containerSize)
+                return;
+            const newOffset = navSize - currentOffset > containerSize * 2
+                ? currentOffset + containerSize
+                : navSize - containerSize;
+            navOffset.set(newOffset);
+        };
+        const scrollToActiveTab = () => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const nav = nav$.get();
+            if (!scrollable.get() || !el$.get() || !navScroll$.get() || !nav)
+                return;
+            yield nextTick();
+            const activeTab = (_a = el$.get()) === null || _a === void 0 ? void 0 : _a.querySelector('.is-active');
+            if (!activeTab)
+                return;
+            const navScroll = navScroll$.get();
+            const isHorizontal = ['top', 'bottom'].includes(rootTabs.props.tabPosition);
+            const activeTabBounding = activeTab.getBoundingClientRect();
+            const navScrollBounding = navScroll === null || navScroll === void 0 ? void 0 : navScroll.getBoundingClientRect();
+            const maxOffset = isHorizontal
+                ? nav.offsetWidth - navScrollBounding.width
+                : nav.offsetHeight - navScrollBounding.height;
+            const currentOffset = navOffset.get();
+            let newOffset = currentOffset;
+            if (isHorizontal) {
+                if (activeTabBounding.left < navScrollBounding.left) {
+                    newOffset =
+                        currentOffset - (navScrollBounding.left - activeTabBounding.left);
+                }
+                if (activeTabBounding.right > navScrollBounding.right) {
+                    newOffset =
+                        currentOffset + activeTabBounding.right - navScrollBounding.right;
+                }
+            }
+            else {
+                if (activeTabBounding.top < navScrollBounding.top) {
+                    newOffset =
+                        currentOffset - (navScrollBounding.top - activeTabBounding.top);
+                }
+                if (activeTabBounding.bottom > navScrollBounding.bottom) {
+                    newOffset =
+                        currentOffset +
+                            (activeTabBounding.bottom - navScrollBounding.bottom);
+                }
+            }
+            newOffset = Math.max(newOffset, 0);
+            navOffset.set(Math.min(newOffset, maxOffset));
+        });
+        const update = () => {
+            var _a, _b, _c;
+            if (!nav$.get() || !navScroll$.get())
+                return;
+            props.stretch && ((_a = tabBarRef.get()) === null || _a === void 0 ? void 0 : _a.update());
+            const navSize = (_b = nav$.get()) === null || _b === void 0 ? void 0 : _b[`offset${capitalize(sizeName.get())}`];
+            const containerSize = (_c = navScroll$.get()) === null || _c === void 0 ? void 0 : _c[`offset${capitalize(sizeName.get())}`];
+            const currentOffset = navOffset.get();
+            if (containerSize < navSize) {
+                scrollable.set(scrollable.get() || {});
+                scrollable.get().prev = currentOffset;
+                scrollable.get().next = currentOffset + containerSize < navSize;
+                if (navSize - currentOffset < containerSize) {
+                    navOffset.set(navSize - containerSize);
+                }
+            }
+            else {
+                scrollable.set(undefined);
+                if (currentOffset > 0) {
+                    navOffset.set(0);
+                }
+            }
+        };
+        const changeTab = (event) => {
+            let step = 0;
+            switch (event === null || event === void 0 ? void 0 : event.code) {
+                case EVENT_CODE.left:
+                case EVENT_CODE.up:
+                    step = -1;
+                    break;
+                case EVENT_CODE.right:
+                case EVENT_CODE.down:
+                    step = 1;
+                    break;
+                default:
+                    return;
+            }
+            const tabList = Array.from(event.currentTarget.querySelectorAll('[role=tab]:not(.is-disabled)'));
+            const currentIndex = tabList.indexOf(event.target);
+            let nextIndex = currentIndex + step;
+            if (nextIndex < 0) {
+                nextIndex = tabList.length - 1;
+            }
+            else if (nextIndex >= tabList.length) {
+                nextIndex = 0;
+            }
+            tabList[nextIndex].focus({ preventScroll: true }); // 改变焦点元素
+            tabList[nextIndex].click(); // 选中下一个tab
+            setFocus();
+        };
+        const setFocus = () => {
+            if (focusable.get())
+                isFocus.set(true);
+        };
+        const removeFocus = () => isFocus.set(false);
+        watch(visibility, (visibility) => {
+            if (visibility === 'hidden') {
+                focusable.set(false);
+            }
+            else if (visibility === 'visible') {
+                setTimeout(() => focusable.set(true), 50);
+            }
+        });
+        watch(focused, (focused) => {
+            if (focused) {
+                setTimeout(() => focusable.set(true), 50);
+            }
+            else {
+                focusable.set(false);
+            }
+        });
+        useResizeObserver(el$, update);
+        onMounted(() => setTimeout(() => scrollToActiveTab(), 0));
+        onUpdated(() => update());
+        defineExpose({
+            scrollToActiveTab,
+            removeFocus,
+        });
+        const scrollBtn = scrollable.get()
+            ? [
+                new Span({
+                    name: 'nav-prev',
+                    class: [
+                        ns.e('nav-prev'),
+                        ns.is('disabled', !((_a = scrollable.get()) === null || _a === void 0 ? void 0 : _a.prev)),
+                    ],
+                    events: {
+                        click: (evt) => {
+                            scrollPrev();
+                        },
+                    },
+                    slot: [
+                        new TdIcon({
+                            slot: new ElArrowLeftSvg(),
+                        }),
+                    ],
+                }),
+                new Span({
+                    name: 'nav-next',
+                    class: [
+                        ns.e('nav-next'),
+                        ns.is('disabled', !((_b = scrollable.get()) === null || _b === void 0 ? void 0 : _b.next)),
+                    ],
+                    events: {
+                        click: (evt) => {
+                            scrollNext();
+                        },
+                    },
+                    slot: [
+                        new TdIcon({
+                            slot: new ElArrowRightSvg(),
+                        }),
+                    ],
+                }),
+            ]
+            : undefined;
+        const tabs = (_c = props.panes) === null || _c === void 0 ? void 0 : _c.map((pane, index) => {
+            var _a, _b, _c;
+            const uid = pane.uid;
+            const disabled = pane.props.disabled;
+            const tabName = (_b = (_a = pane.props.name) !== null && _a !== void 0 ? _a : pane.index) !== null && _b !== void 0 ? _b : `${index}`;
+            const closable = !disabled && (pane.isClosable || props.editable);
+            pane.index = `${index}`;
+            const btnClose = closable
+                ? new TdIcon({
+                    class: 'is-icon-close',
+                    events: {
+                        // `onClick` not exist when generate dts
+                        click: (ev) => emit('tabRemove', pane, ev),
+                    },
+                    slot: new ElCloseSvg(),
+                })
+                : undefined;
+            const tabLabelContent = ((_c = pane.slots) === null || _c === void 0 ? void 0 : _c.label) || pane.props.label;
+            const tabindex = !disabled && pane.active ? 0 : -1;
+            return new Div({
+                refId: `tab-${uid}`,
+                class: [
+                    ns.e('item'),
+                    ns.is(rootTabs.props.tabPosition),
+                    ns.is('active', pane.active.get()),
+                    ns.is('disabled', unref(disabled)),
+                    ns.is('closable', unref(closable)),
+                    ns.is('focus', isFocus.get()),
+                ],
+                attrObj: {
+                    id: `tab-${tabName}`,
+                    key: `tab-${uid}`,
+                    ariaControls: `pane-${tabName}`,
+                    role: 'tab',
+                    ariaSelected: pane.active.get(),
+                    tabindex: tabindex,
+                },
+                events: {
+                    focus: () => setFocus(),
+                    blur: () => removeFocus(),
+                    click: (ev) => {
+                        removeFocus();
+                        emit('tabClick', pane, tabName, ev);
+                    },
+                    keydown: (ev) => {
+                        if (closable &&
+                            ((ev === null || ev === void 0 ? void 0 : ev.code) === EVENT_CODE.delete ||
+                                (ev === null || ev === void 0 ? void 0 : ev.code) === EVENT_CODE.backspace)) {
+                            emit('tabRemove', pane, ev);
+                        }
+                    },
+                },
+                slot: [...arraySlot(tabLabelContent), btnClose],
+            });
+        });
+        this.addChild(new Div({
+            refDom: el$,
+            class: [
+                ns.e('nav-wrap'),
+                ns.is('scrollable', !!scrollable.get()),
+                ns.is(rootTabs.props.tabPosition),
+            ],
+            slot: [
+                ...scrollBtn,
+                new Div({
+                    class: ns.e('nav-scroll'),
+                    refDom: navScroll$,
+                    slot: [
+                        new Div({
+                            refDom: nav$,
+                            class: [
+                                ns.e('nav'),
+                                ns.is(rootTabs.props.tabPosition),
+                                ns.is('stretch', props.stretch &&
+                                    ['top', 'bottom'].includes(rootTabs.props.tabPosition)),
+                            ],
+                            attrObj: {
+                                role: 'tablist',
+                            },
+                            styleObj: navStyle,
+                            events: {
+                                keydown: changeTab,
+                            },
+                            init: (ele) => {
+                                if (!props.type) {
+                                    ele.addChild(new TdTabBar({
+                                        refEl: tabBarRef,
+                                        tabs: [...props.panes],
+                                    }));
+                                }
+                                ele.slotChildren(tabs);
+                            },
+                        }),
+                    ],
+                }),
+            ],
+        }));
+    }
+}
+//# sourceMappingURL=td-tab-nav.class.js.map

package/dist/src/components/navigation/td-tabs/td-tab-nav.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tab-nav.class.js","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tab-nav.class.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EACL,GAAG,EACH,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,SAAS,EACT,iBAAiB,EACjB,MAAM,EACN,SAAS,EACT,YAAY,EACZ,SAAS,EACT,cAAc,EACd,qBAAqB,GACtB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAC;AAG3D,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,4CAA4C;AAC5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,OAAO,QAAS,SAAQ,OAAO;IAMnC,YAAY,SAAsB,EAAE;QAClC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,UAAU,CAAC;QAC5B,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QAErC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;IACtC,CAAC;IAEQ,KAAK;;QACZ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QACvB,MAAM,cAAc,GAAG,UAAU,CAAC;QAClC,MAAM,QAAQ,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAC;QAC5C,IAAI,CAAC,QAAQ;YAAE,UAAU,CAAC,cAAc,EAAE,gCAAgC,CAAC,CAAC;QAE5E,MAAM,EAAE,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;QAChC,MAAM,UAAU,GAAG,qBAAqB,EAAE,CAAC;QAC3C,MAAM,OAAO,GAAG,cAAc,EAAE,CAAC;QAEjC,MAAM,UAAU,GAAG,MAAM,EAAkB,CAAC;QAC5C,MAAM,IAAI,GAAG,MAAM,EAAkB,CAAC;QACtC,MAAM,GAAG,GAAG,MAAM,EAAkB,CAAC;QAErC,MAAM,SAAS,GAAG,MAAM,EAAY,CAAC;QAErC,MAAM,UAAU,GAAG,MAAM,CAAyB,SAAS,CAAC,CAAC;QAC7D,MAAM,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;QAC5B,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;QAC9B,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;QAE/B,MAAM,QAAQ,GAAG,QAAQ,CAAC,GAAG,EAAE,CAC7B,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAY,CAAC;YACrD,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,QAAQ,CACb,CAAC;QACF,MAAM,QAAQ,GAAG,QAAQ,CAAS,GAAG,EAAE;YACrC,MAAM,GAAG,GAAG,QAAQ,CAAC,GAAG,EAAE,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;YACnD,OAAO;gBACL,SAAS,EAAE,YAAY,GAAG,KAAK,SAAS,CAAC,GAAG,EAAE,KAAK;aACpD,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,MAAM,UAAU,GAAG,GAAG,EAAE;;YACtB,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE;gBAAE,OAAO;YAE9B,MAAM,aAAa,GACjB,MAAA,UAAU,CAAC,GAAG,EAAE,0CACd,SAAS,UAAU,CAAC,QAAQ,CAAC,GAAG,EAAG,CAAuB,EAAE,CAC7D,CAAC;YACJ,MAAM,aAAa,GAAG,SAAS,CAAC,GAAG,EAAE,CAAC;YAEtC,IAAI,CAAC,aAAa;gBAAE,OAAO;YAE3B,MAAM,SAAS,GACb,aAAa,GAAG,aAAc,CAAC,CAAC,CAAC,aAAa,GAAG,aAAc,CAAC,CAAC,CAAC,CAAC,CAAC;YAEtE,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;QAC3B,CAAC,CAAC;QAEF,MAAM,UAAU,GAAG,GAAG,EAAE;;YACtB,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE;gBAAE,OAAO;YAE7C,MAAM,OAAO,GACX,MAAA,IAAI,CAAC,GAAG,EAAE,0CACR,SAAS,UAAU,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAuB,EAAE,CAC5D,CAAC;YACJ,MAAM,aAAa,GACjB,MAAA,UAAU,CAAC,GAAG,EAAE,0CACd,SAAS,UAAU,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAuB,EAAE,CAC5D,CAAC;YACJ,MAAM,aAAa,GAAG,SAAS,CAAC,GAAG,EAAE,CAAC;YAEtC,IAAI,OAAQ,GAAG,aAAa,IAAI,aAAc;gBAAE,OAAO;YAEvD,MAAM,SAAS,GACb,OAAQ,GAAG,aAAa,GAAG,aAAc,GAAG,CAAC;gBAC3C,CAAC,CAAC,aAAa,GAAG,aAAc;gBAChC,CAAC,CAAC,OAAQ,GAAG,aAAc,CAAC;YAEhC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;QAC3B,CAAC,CAAC;QAEF,MAAM,iBAAiB,GAAG,GAAS,EAAE;;YACnC,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;YACvB,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG;gBAAE,OAAO;YAEzE,MAAM,QAAQ,EAAE,CAAC;YAEjB,MAAM,SAAS,GAAG,MAAA,GAAG,CAAC,GAAG,EAAE,0CAAE,aAAa,CAAC,YAAY,CAAC,CAAC;YACzD,IAAI,CAAC,SAAS;gBAAE,OAAO;YAEvB,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC;YACnC,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAC7C,QAAQ,CAAC,KAAK,CAAC,WAAY,CAC5B,CAAC;YACF,MAAM,iBAAiB,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAC;YAC5D,MAAM,iBAAiB,GAAG,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,qBAAqB,EAAE,CAAC;YAC7D,MAAM,SAAS,GAAG,YAAY;gBAC5B,CAAC,CAAC,GAAG,CAAC,WAAW,GAAG,iBAAkB,CAAC,KAAK;gBAC5C,CAAC,CAAC,GAAG,CAAC,YAAY,GAAG,iBAAkB,CAAC,MAAM,CAAC;YACjD,MAAM,aAAa,GAAG,SAAS,CAAC,GAAG,EAAE,CAAC;YACtC,IAAI,SAAS,GAAG,aAAa,CAAC;YAE9B,IAAI,YAAY,EAAE,CAAC;gBACjB,IAAI,iBAAiB,CAAC,IAAI,GAAG,iBAAkB,CAAC,IAAI,EAAE,CAAC;oBACrD,SAAS;wBACP,aAAa,GAAG,CAAC,iBAAkB,CAAC,IAAI,GAAG,iBAAiB,CAAC,IAAI,CAAC,CAAC;gBACvE,CAAC;gBACD,IAAI,iBAAiB,CAAC,KAAK,GAAG,iBAAkB,CAAC,KAAK,EAAE,CAAC;oBACvD,SAAS;wBACP,aAAa,GAAG,iBAAiB,CAAC,KAAK,GAAG,iBAAkB,CAAC,KAAK,CAAC;gBACvE,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,IAAI,iBAAiB,CAAC,GAAG,GAAG,iBAAkB,CAAC,GAAG,EAAE,CAAC;oBACnD,SAAS;wBACP,aAAa,GAAG,CAAC,iBAAkB,CAAC,GAAG,GAAG,iBAAiB,CAAC,GAAG,CAAC,CAAC;gBACrE,CAAC;gBACD,IAAI,iBAAiB,CAAC,MAAM,GAAG,iBAAkB,CAAC,MAAM,EAAE,CAAC;oBACzD,SAAS;wBACP,aAAa;4BACb,CAAC,iBAAiB,CAAC,MAAM,GAAG,iBAAkB,CAAC,MAAM,CAAC,CAAC;gBAC3D,CAAC;YACH,CAAC;YACD,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;YACnC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC;QAChD,CAAC,CAAA,CAAC;QAEF,MAAM,MAAM,GAAG,GAAG,EAAE;;YAClB,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE;gBAAE,OAAO;YAE7C,KAAK,CAAC,OAAO,KAAI,MAAA,SAAS,CAAC,GAAG,EAAE,0CAAE,MAAM,EAAE,CAAA,CAAC;YAE3C,MAAM,OAAO,GACX,MAAA,IAAI,CAAC,GAAG,EAAE,0CACR,SAAS,UAAU,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAuB,EAAE,CAC5D,CAAC;YACJ,MAAM,aAAa,GACjB,MAAA,UAAU,CAAC,GAAG,EAAE,0CACd,SAAS,UAAU,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAuB,EAAE,CAC5D,CAAC;YACJ,MAAM,aAAa,GAAG,SAAS,CAAC,GAAG,EAAE,CAAC;YAEtC,IAAI,aAAc,GAAG,OAAQ,EAAE,CAAC;gBAC9B,UAAU,CAAC,GAAG,CAAC,UAAU,CAAC,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC;gBACvC,UAAU,CAAC,GAAG,EAAG,CAAC,IAAI,GAAG,aAAa,CAAC;gBACvC,UAAU,CAAC,GAAG,EAAG,CAAC,IAAI,GAAG,aAAa,GAAG,aAAc,GAAG,OAAQ,CAAC;gBACnE,IAAI,OAAQ,GAAG,aAAa,GAAG,aAAc,EAAE,CAAC;oBAC9C,SAAS,CAAC,GAAG,CAAC,OAAQ,GAAG,aAAc,CAAC,CAAC;gBAC3C,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;gBAC1B,IAAI,aAAa,GAAG,CAAC,EAAE,CAAC;oBACtB,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;gBACnB,CAAC;YACH,CAAC;QACH,CAAC,CAAC;QAEF,MAAM,SAAS,GAAG,CAAC,KAAqB,EAAE,EAAE;YAC1C,IAAI,IAAI,GAAG,CAAC,CAAC;YAEb,QAAQ,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,EAAE,CAAC;gBACpB,KAAK,UAAU,CAAC,IAAI,CAAC;gBACrB,KAAK,UAAU,CAAC,EAAE;oBAChB,IAAI,GAAG,CAAC,CAAC,CAAC;oBACV,MAAM;gBACR,KAAK,UAAU,CAAC,KAAK,CAAC;gBACtB,KAAK,UAAU,CAAC,IAAI;oBAClB,IAAI,GAAG,CAAC,CAAC;oBACT,MAAM;gBACR;oBACE,OAAO;YACX,CAAC;YAED,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAEtB,KAAK,CAAC,aACP,CAAC,gBAAgB,CAAiB,8BAA8B,CAAC,CACnE,CAAC;YACF,MAAM,YAAY,GAAG,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAwB,CAAC,CAAC;YACrE,IAAI,SAAS,GAAG,YAAY,GAAG,IAAI,CAAC;YAEpC,IAAI,SAAS,GAAG,CAAC,EAAE,CAAC;gBAClB,SAAS,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;YACjC,CAAC;iBAAM,IAAI,SAAS,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC;gBACvC,SAAS,GAAG,CAAC,CAAC;YAChB,CAAC;YAED,OAAO,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,SAAS;YAC5D,OAAO,CAAC,SAAS,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,WAAW;YACvC,QAAQ,EAAE,CAAC;QACb,CAAC,CAAC;QAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;YACpB,IAAI,SAAS,CAAC,GAAG,EAAE;gBAAE,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACzC,CAAC,CAAC;QACF,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QAE7C,KAAK,CAAC,UAAU,EAAE,CAAC,UAAU,EAAE,EAAE;YAC/B,IAAI,UAAU,KAAK,QAAQ,EAAE,CAAC;gBAC5B,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;YACvB,CAAC;iBAAM,IAAI,UAAU,KAAK,SAAS,EAAE,CAAC;gBACpC,UAAU,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;YAC5C,CAAC;QACH,CAAC,CAAC,CAAC;QACH,KAAK,CAAC,OAAO,EAAE,CAAC,OAAO,EAAE,EAAE;YACzB,IAAI,OAAO,EAAE,CAAC;gBACZ,UAAU,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;YAC5C,CAAC;iBAAM,CAAC;gBACN,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;YACvB,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,iBAAiB,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;QAE/B,SAAS,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;QAC1D,SAAS,CAAC,GAAG,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC;QAE1B,YAAY,CAAC;YACX,iBAAiB;YACjB,WAAW;SACZ,CAAC,CAAC;QAEH,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,CAAC,CAAC;gBACE,IAAI,IAAI,CAAC;oBACP,IAAI,EAAE,UAAU;oBAChB,KAAK,EAAE;wBACL,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC;wBAChB,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC,CAAA,MAAA,UAAU,CAAC,GAAG,EAAE,0CAAE,IAAI,CAAA,CAAC;qBAC3C;oBACD,MAAM,EAAE;wBACN,KAAK,EAAE,CAAC,GAAG,EAAE,EAAE;4BACb,UAAU,EAAE,CAAC;wBACf,CAAC;qBACF;oBACD,IAAI,EAAE;wBACJ,IAAI,MAAM,CAAC;4BACT,IAAI,EAAE,IAAI,cAAc,EAAE;yBAC3B,CAAC;qBACH;iBACF,CAAC;gBACF,IAAI,IAAI,CAAC;oBACP,IAAI,EAAE,UAAU;oBAChB,KAAK,EAAE;wBACL,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC;wBAChB,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC,CAAA,MAAA,UAAU,CAAC,GAAG,EAAE,0CAAE,IAAI,CAAA,CAAC;qBAC3C;oBACD,MAAM,EAAE;wBACN,KAAK,EAAE,CAAC,GAAG,EAAE,EAAE;4BACb,UAAU,EAAE,CAAC;wBACf,CAAC;qBACF;oBACD,IAAI,EAAE;wBACJ,IAAI,MAAM,CAAC;4BACT,IAAI,EAAE,IAAI,eAAe,EAAE;yBAC5B,CAAC;qBACH;iBACF,CAAC;aACH;YACH,CAAC,CAAC,SAAS,CAAC;QAEd,MAAM,IAAI,GAAG,MAAA,KAAK,CAAC,KAAK,0CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;;YAC5C,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;YACrB,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;YACrC,MAAM,OAAO,GAAG,MAAA,MAAA,IAAI,CAAC,KAAK,CAAC,IAAI,mCAAI,IAAI,CAAC,KAAK,mCAAI,GAAG,KAAK,EAAE,CAAC;YAC5D,MAAM,QAAQ,GAAG,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC;YAClE,IAAI,CAAC,KAAK,GAAG,GAAG,KAAK,EAAE,CAAC;YAExB,MAAM,QAAQ,GAAG,QAAQ;gBACvB,CAAC,CAAC,IAAI,MAAM,CAAC;oBACT,KAAK,EAAE,eAAe;oBACtB,MAAM,EAAE;wBACN,wCAAwC;wBACxC,KAAK,EAAE,CAAC,EAAe,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,EAAE,CAAC;qBACxD;oBACD,IAAI,EAAE,IAAI,UAAU,EAAE;iBACvB,CAAC;gBACJ,CAAC,CAAC,SAAS,CAAC;YAEd,MAAM,eAAe,GAAG,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,KAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;YAC9D,MAAM,QAAQ,GAAG,CAAC,QAAQ,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACnD,OAAO,IAAI,GAAG,CAAC;gBACb,KAAK,EAAE,OAAO,GAAG,EAAE;gBACnB,KAAK,EAAE;oBACL,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC;oBACZ,EAAE,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAY,CAAC;oBAClC,EAAE,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC;oBAClC,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;oBAClC,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;oBAClC,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,GAAG,EAAE,CAAC;iBAC9B;gBACD,OAAO,EAAE;oBACP,EAAE,EAAE,OAAO,OAAO,EAAE;oBACpB,GAAG,EAAE,OAAO,GAAG,EAAE;oBACjB,YAAY,EAAE,QAAQ,OAAO,EAAE;oBAC/B,IAAI,EAAE,KAAK;oBACX,YAAY,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,EAAE;oBAC/B,QAAQ,EAAE,QAAQ;iBACnB;gBACD,MAAM,EAAE;oBACN,KAAK,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE;oBACvB,IAAI,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE;oBACzB,KAAK,EAAE,CAAC,EAAe,EAAE,EAAE;wBACzB,WAAW,EAAE,CAAC;wBACd,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,CAAC,CAAC;oBACtC,CAAC;oBACD,OAAO,EAAE,CAAC,EAAkB,EAAE,EAAE;wBAC9B,IACE,QAAQ;4BACR,CAAC,CAAA,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,IAAI,MAAK,UAAU,CAAC,MAAM;gCAC7B,CAAA,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,IAAI,MAAK,UAAU,CAAC,SAAS,CAAC,EACpC,CAAC;4BACD,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC;wBAC9B,CAAC;oBACH,CAAC;iBACF;gBACD,IAAI,EAAE,CAAC,GAAG,SAAS,CAAC,eAAe,CAAC,EAAE,QAAS,CAAC;aACjD,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,QAAQ,CACX,IAAI,GAAG,CAAC;YACN,MAAM,EAAE,GAAG;YACX,KAAK,EAAE;gBACL,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC;gBAChB,EAAE,CAAC,EAAE,CAAC,YAAY,EAAE,CAAC,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC;gBACvC,EAAE,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAY,CAAC;aACnC;YACD,IAAI,EAAE;gBACJ,GAAG,SAAU;gBACb,IAAI,GAAG,CAAC;oBACN,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC;oBACzB,MAAM,EAAE,UAAU;oBAClB,IAAI,EAAE;wBACJ,IAAI,GAAG,CAAC;4BACN,MAAM,EAAE,IAAI;4BACZ,KAAK,EAAE;gCACL,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;gCACX,EAAE,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAY,CAAC;gCAClC,EAAE,CAAC,EAAE,CACH,SAAS,EACT,KAAK,CAAC,OAAO;oCACX,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAY,CAAC,CAC1D;6BACF;4BACD,OAAO,EAAE;gCACP,IAAI,EAAE,SAAS;6BAChB;4BACD,QAAQ,EAAE,QAAQ;4BAClB,MAAM,EAAE;gCACN,OAAO,EAAE,SAAS;6BACnB;4BACD,IAAI,EAAE,CAAC,GAAG,EAAE,EAAE;gCACZ,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;oCAChB,GAAG,CAAC,QAAQ,CACV,IAAI,QAAQ,CAAC;wCACX,KAAK,EAAE,SAAS;wCAChB,IAAI,EAAE,CAAC,GAAG,KAAK,CAAC,KAAM,CAAC;qCACxB,CAAC,CACH,CAAC;gCACJ,CAAC;gCACD,GAAG,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;4BACzB,CAAC;yBACF,CAAC;qBACH;iBACF,CAAC;aACH;SACF,CAAC,CACH,CAAC;IACJ,CAAC;CACF"}

package/dist/src/components/navigation/td-tabs/td-tab-nav.const.d.ts

@@ -0,0 +1,7 @@
+import { TabsPaneContext } from './constants';
+import { TabPaneName } from './td-tabs.interface';
+export declare const tabNavEmits: {
+    tabClick: (tab: TabsPaneContext, tabName: TabPaneName, ev: Event) => boolean;
+    tabRemove: (tab: TabsPaneContext, ev: Event) => boolean;
+};
+//# sourceMappingURL=td-tab-nav.const.d.ts.map

package/dist/src/components/navigation/td-tabs/td-tab-nav.const.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tab-nav.const.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tab-nav.const.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,eAAO,MAAM,WAAW;oBACN,eAAe,WAAW,WAAW,MAAM,KAAK;qBAE/C,eAAe,MAAM,KAAK;CAC5C,CAAC"}

package/dist/src/components/navigation/td-tabs/td-tab-nav.const.js

@@ -0,0 +1,5 @@
+export const tabNavEmits = {
+    tabClick: (tab, tabName, ev) => ev instanceof Event,
+    tabRemove: (tab, ev) => ev instanceof Event,
+};
+//# sourceMappingURL=td-tab-nav.const.js.map

package/dist/src/components/navigation/td-tabs/td-tab-nav.const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tab-nav.const.js","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tab-nav.const.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,QAAQ,EAAE,CAAC,GAAoB,EAAE,OAAoB,EAAE,EAAS,EAAE,EAAE,CAClE,EAAE,YAAY,KAAK;IACrB,SAAS,EAAE,CAAC,GAAoB,EAAE,EAAS,EAAE,EAAE,CAAC,EAAE,YAAY,KAAK;CACpE,CAAC"}

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

@@ -0,0 +1,24 @@
+import { ITypeDiv, TypeDivProps } from '@type-dom/framework';
+import { TdTabs } from './td-tabs.class';
+import { TabPaneName } from './td-tabs.interface';
+import { TabsPaneContext } from './constants';
+export interface ITdTabNav extends ITypeDiv {
+    className: 'TdTabNav';
+}
+export interface TabNavProps extends TypeDivProps {
+    rootTabs?: TdTabs;
+    panes?: TabsPaneContext[];
+    currentName?: string | number;
+    editable?: boolean;
+    type?: 'card' | 'border-card' | '';
+    stretch?: boolean;
+    emits?: {
+        tabClick?: (tab: TabsPaneContext, tabName: TabPaneName, event: Event) => void;
+        tabRemove?: (tab: TabsPaneContext, evt: Event) => void;
+    };
+}
+export interface Scrollable {
+    next?: boolean;
+    prev?: number;
+}
+//# sourceMappingURL=td-tab-nav.interface.d.ts.map

package/dist/src/components/navigation/td-tabs/td-tab-nav.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tab-nav.interface.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tab-nav.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAE7D,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC,SAAS,EAAE,UAAU,CAAC;CACvB;AAED,MAAM,WAAW,WAAY,SAAQ,YAAY;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAG1B,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,aAAa,GAAG,EAAE,CAAC;IACnC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,KAAK,CAAC,EAAE;QACN,QAAQ,CAAC,EAAE,CACT,GAAG,EAAE,eAAe,EACpB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,KAAK,KACT,IAAI,CAAC;QACV,SAAS,CAAC,EAAE,CAAC,GAAG,EAAE,eAAe,EAAE,GAAG,EAAE,KAAK,KAAK,IAAI,CAAC;KACxD,CAAC;CACH;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;CACf"}

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

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=td-tab-nav.interface.js.map

package/dist/src/components/navigation/td-tabs/td-tab-nav.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tab-nav.interface.js","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tab-nav.interface.ts"],"names":[],"mappings":""}

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

@@ -0,0 +1,11 @@
+import { TypeDiv } from '@type-dom/framework';
+import { Signal } from '@type-dom/signals';
+import { TabPaneName, ITdTabs, TabsProps } from './td-tabs.interface';
+export declare class TdTabs extends TypeDiv implements ITdTabs {
+    className: 'TdTabs';
+    props: TabsProps;
+    currentName?: Signal<TabPaneName>;
+    constructor(params?: TabsProps);
+    setup(): void;
+}
+//# sourceMappingURL=td-tabs.class.d.ts.map

package/dist/src/components/navigation/td-tabs/td-tabs.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.class.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAML,OAAO,EAER,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAY,MAAM,EAAiB,MAAM,mBAAmB,CAAC;AAWpE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAItE,qBAAa,MAAO,SAAQ,OAAQ,YAAW,OAAO;IACpD,SAAS,EAAE,QAAQ,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;gBAEtB,MAAM,GAAE,SAAc;IAYzB,KAAK;CA6Jf"}

package/dist/src/components/navigation/td-tabs/td-tabs.class.js

@@ -0,0 +1,167 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { defineExpose, Div, getCurrentInstance, nextTick, provide, TypeDiv, useSlots, } from '@type-dom/framework';
+import { computed, signal, watch } from '@type-dom/signals';
+import { ElPlusSvg } from '@type-dom/svgs';
+import { isUndefined } from '@type-dom/utils';
+// import { $colorPrimary, $colors, $textColor } from '../../../styles';
+import { useNamespace } from '../../../hooks/use-namespace';
+import { useOrderedChildren } from '../../../hooks/use-ordered-children';
+import { UPDATE_MODEL_EVENT } from '../../../constants/event';
+import { EVENT_CODE } from '../../../constants';
+import { TdIcon } from '../../basic/td-icon/td-icon.class';
+// import { TabPaneProps } from '../td-tab-pane/td-tab-pane.interface';
+import { tabsEmits, tabsProps } from './td-tabs.const';
+import { TdTabNav } from './td-tab-nav.class';
+import { tabsRootContextKey } from './constants';
+export class TdTabs extends TypeDiv {
+    constructor(params = {}) {
+        super();
+        this.className = 'TdTabs';
+        this.attr.addObj({
+            name: 'td-tabs',
+        });
+        this.addEmits(tabsEmits);
+        this.assignProps(tabsProps);
+        this.props = this.useParams(params);
+    }
+    setup() {
+        var _a;
+        const props = this.props;
+        const emit = this.emit;
+        const ns = useNamespace('tabs');
+        const isVertical = computed(() => ['left', 'right'].includes(props.tabPosition));
+        const { children: panes, addChild: sortPane, removeChild: unregisterPane, } = useOrderedChildren(getCurrentInstance(), 'TdTabPane');
+        const nav$ = signal();
+        const currentName = signal((_a = props.modelValue) !== null && _a !== void 0 ? _a : '0');
+        const setCurrentName = (value_1, ...args_1) => __awaiter(this, [value_1, ...args_1], void 0, function* (value, trigger = false) {
+            var _a, _b, _c;
+            // should do nothing.
+            if (currentName.get() === value || isUndefined(value))
+                return;
+            try {
+                const canLeave = yield ((_a = props.beforeLeave) === null || _a === void 0 ? void 0 : _a.call(props, value, currentName.get()));
+                if (canLeave !== false) {
+                    currentName.set(value);
+                    if (trigger) {
+                        emit(UPDATE_MODEL_EVENT, value);
+                        emit('tabChange', value);
+                    }
+                    (_c = (_b = nav$.get()) === null || _b === void 0 ? void 0 : _b.removeFocus) === null || _c === void 0 ? void 0 : _c.call(_b);
+                }
+            }
+            catch (_d) { }
+        });
+        const handleTabClick = (tab, tabName, event) => {
+            if (tab.props.disabled)
+                return;
+            setCurrentName(tabName, true);
+            emit('tabClick', tab, event);
+        };
+        const handleTabRemove = (pane, ev) => {
+            if (pane.props.disabled || isUndefined(pane.props.name))
+                return;
+            ev.stopPropagation();
+            emit('edit', pane.props.name, 'remove');
+            emit('tabRemove', pane.props.name);
+        };
+        const handleTabAdd = () => {
+            emit('edit', undefined, 'add');
+            emit('tabAdd');
+        };
+        watch(() => { var _a; return (_a = props.vModel) === null || _a === void 0 ? void 0 : _a.get(); }, (modelValue) => setCurrentName(modelValue));
+        watch(currentName, () => __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            yield nextTick();
+            (_b = (_a = nav$.get()) === null || _a === void 0 ? void 0 : _a.scrollToActiveTab) === null || _b === void 0 ? void 0 : _b.call(_a);
+        }));
+        provide(tabsRootContextKey, {
+            props,
+            currentName,
+            registerPane: (pane) => {
+                panes.get().push(pane);
+            },
+            sortPane,
+            unregisterPane,
+        });
+        defineExpose({
+            currentName,
+        });
+        // const TabNavRenderer: { render: () => TypeNode } = ({ render}) => {
+        //   return render()
+        // }
+        const slots = useSlots();
+        const addSlot = slots === null || slots === void 0 ? void 0 : slots.addIcon;
+        const newButton = props.editable || props.addable
+            ? new Div({
+                class: [
+                    ns.e('new-tab'),
+                    isVertical.get() && ns.e('new-tab-vertical'),
+                ],
+                attrObj: {
+                    tabindex: '0',
+                },
+                events: {
+                    click: handleTabAdd,
+                    keydown: (ev) => {
+                        if ([EVENT_CODE.enter, EVENT_CODE.numpadEnter].includes(ev === null || ev === void 0 ? void 0 : ev.code))
+                            handleTabAdd();
+                    },
+                },
+                slot: addSlot
+                    ? slots.addIcon
+                    : new TdIcon({
+                        slot: new ElPlusSvg(),
+                    }),
+            })
+            : undefined;
+        const header = new Div({
+            class: [
+                ns.e('header'),
+                isVertical.get() && ns.e('header-vertical'),
+                ns.is(props.tabPosition),
+            ],
+            slot: [
+                new TdTabNav({
+                    refEl: nav$,
+                    panes: panes.get(),
+                    attrObj: {
+                        currentName: currentName.get(),
+                        editable: props.editable,
+                        type: props.type,
+                        stretch: props.stretch,
+                    },
+                    emits: {
+                        tabClick: handleTabClick,
+                        tabRemove: handleTabRemove,
+                    },
+                    slot: [],
+                }),
+                newButton,
+            ],
+        });
+        const panels = new Div({
+            class: ns.e('content'),
+            slot: props.slot || (slots === null || slots === void 0 ? void 0 : slots.default),
+        });
+        this.addChild(new Div({
+            class: [
+                ns.b(),
+                ns.m(props.tabPosition),
+                {
+                    [ns.m('card')]: props.type === 'card',
+                    [ns.m('border-card')]: props.type === 'border-card',
+                },
+            ],
+            slot: [panels, header],
+        }));
+    }
+}
+//# sourceMappingURL=td-tabs.class.js.map

package/dist/src/components/navigation/td-tabs/td-tabs.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.class.js","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.class.ts"],"names":[],"mappings":"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"}

package/dist/src/components/navigation/td-tabs/td-tabs.const.d.ts

@@ -0,0 +1,12 @@
+import { TabPaneName, TabsProps } from './td-tabs.interface';
+import { TabsPaneContext } from './constants';
+export declare const tabsProps: TabsProps;
+export declare const tabsEmits: {
+    "update:modelValue": (name: TabPaneName) => name is string | number;
+    tabClick: (pane: TabsPaneContext, ev: Event) => boolean;
+    tabChange: (name: TabPaneName) => name is string | number;
+    edit: (paneName: TabPaneName | undefined, action: "remove" | "add") => boolean;
+    tabRemove: (name: TabPaneName) => name is string | number;
+    tabAdd: () => boolean;
+};
+//# sourceMappingURL=td-tabs.const.d.ts.map

package/dist/src/components/navigation/td-tabs/td-tabs.const.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.const.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.const.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAE9C,eAAO,MAAM,SAAS,EAAE,SAGvB,CAAC;AAKF,eAAO,MAAM,SAAS;gCACS,WAAW;qBACvB,eAAe,MAAM,KAAK;sBACzB,WAAW;qBACZ,WAAW,GAAG,SAAS,UAAU,QAAQ,GAAG,KAAK;sBAEhD,WAAW;;CAE9B,CAAC"}

package/dist/src/components/navigation/td-tabs/td-tabs.const.js

@@ -0,0 +1,16 @@
+import { isNumber, isString } from '@type-dom/utils';
+import { UPDATE_MODEL_EVENT } from '../../../constants/event';
+export const tabsProps = {
+    tabPosition: 'top',
+    beforeLeave: () => true,
+};
+const isPaneName = (value) => isString(value) || isNumber(value);
+export const tabsEmits = {
+    [UPDATE_MODEL_EVENT]: (name) => isPaneName(name),
+    tabClick: (pane, ev) => ev instanceof Event,
+    tabChange: (name) => isPaneName(name),
+    edit: (paneName, action) => ['remove', 'add'].includes(action),
+    tabRemove: (name) => isPaneName(name),
+    tabAdd: () => true,
+};
+//# sourceMappingURL=td-tabs.const.js.map