primevuelab 4.0.0-beta.4

package/tabmenu/TabMenu.vue

@@ -0,0 +1,262 @@
+<template>
+    <div :class="cx('root')" v-bind="ptmi('root')">
+        <ul ref="nav" :class="cx('tablist')" role="menubar" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="ptm('tablist')">
+            <template v-for="(item, i) of model" :key="label(item) + '_' + i.toString()">
+                <li
+                    v-if="visible(item)"
+                    ref="tab"
+                    :class="[cx('item', { item, index: i }), item.class]"
+                    role="presentation"
+                    @click="onItemClick($event, item, i)"
+                    @keydown="onKeydownItem($event, item, i)"
+                    v-bind="getPTOptions('item', item, i)"
+                    :data-p-active="d_activeIndex === i"
+                    :data-p-disabled="disabled(item)"
+                >
+                    <template v-if="!$slots.item">
+                        <a ref="tabLink" v-ripple role="menuitem" :href="item.url" :class="cx('itemLink')" :target="item.target" :aria-label="label(item)" :aria-disabled="disabled(item)" :tabindex="-1" v-bind="getPTOptions('itemLink', item, i)">
+                            <component v-if="$slots.itemicon" :is="$slots.itemicon" :item="item" :class="cx('itemIcon')" />
+                            <span v-else-if="item.icon" :class="[cx('itemIcon'), item.icon]" v-bind="getPTOptions('itemIcon', item, i)" />
+                            <span :class="cx('itemLabel')" v-bind="getPTOptions('itemLabel', item, i)">{{ label(item) }}</span>
+                        </a>
+                    </template>
+                    <component v-else :is="$slots.item" :item="item" :index="i" :active="i === d_activeIndex" :label="label(item)" :props="getMenuItemProps(item, i)"></component>
+                </li>
+            </template>
+            <li ref="inkbar" role="none" :class="cx('activeBar')" v-bind="ptm('activeBar')"></li>
+        </ul>
+    </div>
+</template>
+
+<script>
+import { DomHandler } from '@primevuelab/core/utils';
+import Ripple from 'primevuelab/ripple';
+import { mergeProps } from 'vue';
+import BaseTabMenu from './BaseTabMenu.vue';
+
+export default {
+    name: 'TabMenu',
+    extends: BaseTabMenu,
+    inheritAttrs: false,
+    emits: ['update:activeIndex', 'tab-change'],
+    data() {
+        return {
+            d_activeIndex: this.activeIndex
+        };
+    },
+    watch: {
+        activeIndex: {
+            flush: 'post',
+            handler(newValue) {
+                this.d_activeIndex = newValue;
+                this.updateInkBar();
+            }
+        }
+    },
+    mounted() {
+        this.$nextTick(() => {
+            this.updateInkBar();
+        });
+
+        const activeItem = this.findActiveItem();
+
+        activeItem && (activeItem.tabIndex = '0');
+    },
+    updated() {
+        this.updateInkBar();
+    },
+    methods: {
+        getPTOptions(key, item, index) {
+            return this.ptm(key, {
+                context: {
+                    item,
+                    index
+                }
+            });
+        },
+        onItemClick(event, item, index) {
+            if (this.disabled(item)) {
+                event.preventDefault();
+
+                return;
+            }
+
+            if (item.command) {
+                item.command({
+                    originalEvent: event,
+                    item: item
+                });
+            }
+
+            if (index !== this.d_activeIndex) {
+                this.d_activeIndex = index;
+                this.$emit('update:activeIndex', this.d_activeIndex);
+            }
+
+            this.$emit('tab-change', {
+                originalEvent: event,
+                index: index
+            });
+        },
+        onKeydownItem(event, item, index) {
+            switch (event.code) {
+                case 'ArrowRight': {
+                    this.navigateToNextItem(event.target);
+                    event.preventDefault();
+                    break;
+                }
+
+                case 'ArrowLeft': {
+                    this.navigateToPrevItem(event.target);
+                    event.preventDefault();
+                    break;
+                }
+
+                case 'Home': {
+                    this.navigateToFirstItem(event.target);
+                    event.preventDefault();
+                    break;
+                }
+
+                case 'End': {
+                    this.navigateToLastItem(event.target);
+                    event.preventDefault();
+                    break;
+                }
+
+                case 'Space':
+                case 'NumpadEnter':
+
+                case 'Enter': {
+                    this.onItemClick(event, item, index);
+                    event.preventDefault();
+                    break;
+                }
+
+                case 'Tab': {
+                    this.onTabKey();
+                    break;
+                }
+
+                default:
+                    break;
+            }
+        },
+        navigateToNextItem(target) {
+            const nextItem = this.findNextItem(target);
+
+            nextItem && this.setFocusToMenuitem(target, nextItem);
+        },
+        navigateToPrevItem(target) {
+            const prevItem = this.findPrevItem(target);
+
+            prevItem && this.setFocusToMenuitem(target, prevItem);
+        },
+        navigateToFirstItem(target) {
+            const firstItem = this.findFirstItem(target);
+
+            firstItem && this.setFocusToMenuitem(target, firstItem);
+        },
+        navigateToLastItem(target) {
+            const lastItem = this.findLastItem(target);
+
+            lastItem && this.setFocusToMenuitem(target, lastItem);
+        },
+        findNextItem(item) {
+            const nextItem = item.parentElement.nextElementSibling;
+
+            return nextItem ? (DomHandler.getAttribute(nextItem, 'data-p-disabled') === true ? this.findNextItem(nextItem.children[0]) : nextItem.children[0]) : null;
+        },
+        findPrevItem(item) {
+            const prevItem = item.parentElement.previousElementSibling;
+
+            return prevItem ? (DomHandler.getAttribute(prevItem, 'data-p-disabled') === true ? this.findPrevItem(prevItem.children[0]) : prevItem.children[0]) : null;
+        },
+        findFirstItem() {
+            const firstSibling = DomHandler.findSingle(this.$refs.nav, '[data-pc-section="item"][data-p-disabled="false"]');
+
+            return firstSibling ? firstSibling.children[0] : null;
+        },
+        findLastItem() {
+            const siblings = DomHandler.find(this.$refs.nav, '[data-pc-section="item"][data-p-disabled="false"]');
+
+            return siblings ? siblings[siblings.length - 1].children[0] : null;
+        },
+        findActiveItem() {
+            const activeItem = DomHandler.findSingle(this.$refs.nav, '[data-pc-section="item"][data-p-disabled="false"][data-p-active="true"]');
+
+            return activeItem ? activeItem.children[0] : null;
+        },
+        setFocusToMenuitem(target, focusableItem) {
+            target.tabIndex = '-1';
+            focusableItem.tabIndex = '0';
+            focusableItem.focus();
+        },
+        onTabKey() {
+            const activeItem = DomHandler.findSingle(this.$refs.nav, '[data-pc-section="item"][data-p-disabled="false"][data-p-active="true"]');
+            const focusedItem = DomHandler.findSingle(this.$refs.nav, '[data-pc-section="itemlink"][tabindex="0"]');
+
+            if (focusedItem !== activeItem.children[0]) {
+                activeItem && (activeItem.children[0].tabIndex = '0');
+                focusedItem.tabIndex = '-1';
+            }
+        },
+        visible(item) {
+            return typeof item.visible === 'function' ? item.visible() : item.visible !== false;
+        },
+        disabled(item) {
+            return typeof item.disabled === 'function' ? item.disabled() : item.disabled === true;
+        },
+        label(item) {
+            return typeof item.label === 'function' ? item.label() : item.label;
+        },
+        updateInkBar() {
+            let tabs = this.$refs.nav.children;
+            let inkHighlighted = false;
+
+            for (let i = 0; i < tabs.length; i++) {
+                let tab = tabs[i];
+
+                if (DomHandler.getAttribute(tab, 'data-p-active')) {
+                    this.$refs.inkbar.style.width = DomHandler.getWidth(tab) + 'px';
+                    this.$refs.inkbar.style.left = DomHandler.getOffset(tab).left - DomHandler.getOffset(this.$refs.nav).left + 'px';
+                    inkHighlighted = true;
+                }
+            }
+
+            if (!inkHighlighted) {
+                this.$refs.inkbar.style.width = '0px';
+                this.$refs.inkbar.style.left = '0px';
+            }
+        },
+        getMenuItemProps(item, index) {
+            return {
+                action: mergeProps(
+                    {
+                        class: this.cx('itemLink'),
+                        tabindex: -1,
+                        onClick: ($event) => this.onItemClick($event, item, index),
+                        onKeyDown: ($event) => this.onKeydownItem($event, item, index)
+                    },
+                    this.getPTOptions('itemLink', item, index)
+                ),
+                icon: mergeProps(
+                    {
+                        class: [this.cx('itemIcon'), item.icon]
+                    },
+                    this.getPTOptions('itemIcon', item, index)
+                ),
+                label: mergeProps(
+                    {
+                        class: this.cx('itemLabel')
+                    },
+                    this.getPTOptions('itemLabel', item, index)
+                )
+            };
+        }
+    },
+    directives: {
+        ripple: Ripple
+    }
+};
+</script>

package/tabmenu/package.json

@@ -0,0 +1,11 @@
+{
+    "main": "tabmenu.mjs",
+    "module": "tabmenu.mjs",
+    "types": "./TabMenu.d.ts",
+    "browser": {
+        "./sfc": "./TabMenu.vue"
+    },
+    "sideEffects": [
+        "*.vue"
+    ]
+}

package/tabmenu/style/TabMenuStyle.d.ts

@@ -0,0 +1,43 @@
+/**
+ *
+ * TabMenu is a navigation component that displays items as tab headers. Example below uses nested routes with TabMenu.
+ *
+ * [Live Demo](https://www.primevuelab.org/tabmenu/)
+ *
+ * @module tabmenustyle
+ *
+ */
+import { BaseStyle } from '../../base/style';
+
+export enum TabMenuClasses {
+    /**
+     * Class name of the root element
+     */
+    root = 'p-tabmenu',
+    /**
+     * Class name of the tablist element
+     */
+    tablist = 'p-tabmenu-tablist',
+    /**
+     * Class name of the item element
+     */
+    item = 'p-tabmenu-item',
+    /**
+     * Class name of the item link element
+     */
+    itemLink = 'p-tabmenu-item-link',
+    /**
+     * Class name of the item icon element
+     */
+    itemIcon = 'p-tabmenu-item-icon',
+    /**
+     * Class name of the item label element
+     */
+    itemLabel = 'p-tabmenu-item-label',
+    /**
+     * Class name of the inkbar element
+     */
+    inkbar = 'p-tabmenu-ink-bar'
+}
+
+export interface TabMenuStyle extends BaseStyle {}

package/tabmenu/style/package.json

@@ -0,0 +1,6 @@
+{
+    "main": "tabmenustyle.mjs",
+    "module": "tabmenustyle.mjs",
+    "types": "./TabMenuStyle.d.ts",
+    "sideEffects": false
+}

package/tabmenu/style/tabmenustyle.mjs

@@ -0,0 +1,31 @@
+import BaseStyle from '@primevuelab/core/base/style';
+
+var theme = function theme(_ref) {
+  var dt = _ref.dt;
+  return "\n.p-tabmenu {\n    overflow-x: auto;\n}\n\n.p-tabmenu-tablist {\n    display: flex;\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    background: ".concat(dt('tabmenu.tablist.background'), ";\n    border-style: solid;\n    border-color: ").concat(dt('tabmenu.tablist.border.color'), ";\n    border-width: ").concat(dt('tabmenu.tablist.border.width'), ";\n    position: relative;\n}\n\n.p-tabmenu-item-link {\n    cursor: pointer;\n    user-select: none;\n    display: flex;\n    align-items: center;\n    text-decoration: none;\n    position: relative;\n    overflow: hidden;\n    background: ").concat(dt('tabmenu.item.background'), ";\n    border-style: solid;\n    border-width: ").concat(dt('tabmenu.item.border.width'), ";\n    border-color: ").concat(dt('tabmenu.item.border.color'), ";\n    color: ").concat(dt('tabmenu.item.color'), ";\n    padding: ").concat(dt('tabmenu.item.padding'), ";\n    font-weight: ").concat(dt('tabmenu.item.font.weight'), ";\n    transition: background ").concat(dt('tabmenu.transition.duration'), ", border-color ").concat(dt('tabmenu.transition.duration'), ", color ").concat(dt('tabmenu.transition.duration'), ", outline-color ").concat(dt('tabmenu.transition.duration'), ", box-shadow ").concat(dt('tabmenu.transition.duration'), ";\n    margin: ").concat(dt('tabmenu.item.margin'), ";\n    outline-color: transparent;\n    gap: ").concat(dt('tabmenu.item.gap'), ";\n}\n\n.p-tabmenu-item-link:focus-visible {\n    z-index: 1;\n    box-shadow: ").concat(dt('tabmenu.item.focus.ring.shadow'), ";\n    outline: ").concat(dt('tabmenu.item.focus.ring.width'), " ").concat(dt('tabmenu.item.focus.ring.style'), " ").concat(dt('tabmenu.item.focus.ring.color'), ";\n    outline-offset: ").concat(dt('tabmenu.item.focus.ring.offset'), ";\n}\n\n.p-tabmenu-item-icon {\n    color: ").concat(dt('tabmenu.item.icon.color'), ";\n    transition: background ").concat(dt('tabmenu.transition.duration'), ", border-color ").concat(dt('tabmenu.transition.duration'), ", color ").concat(dt('tabmenu.transition.duration'), ", outline-color ").concat(dt('tabmenu.transition.duration'), ", box-shadow ").concat(dt('tabmenu.transition.duration'), ";\n}\n\n.p-tabmenu-item-label {\n    line-height: 1;\n}\n\n.p-tabmenu-item:not(.p-tabmenu-item-active):not(.p-disabled):hover .p-tabmenu-item-link {\n    background: ").concat(dt('tabmenu.item.hover.background'), ";\n    border-color: ").concat(dt('tabmenu.item.hover.border.color'), ";\n    color: ").concat(dt('tabmenu.item.hover.color'), ";\n}\n\n.p-tabmenu-item:not(.p-tabmenu-item-active):not(.p-disabled):hover .p-tabmenu-item-icon {\n    color: ").concat(dt('tabmenu.item.icon.hover.color'), ";\n}\n\n.p-tabmenu-item-active .p-tabmenu-item-link {\n    background: ").concat(dt('tabmenu.item.active.background'), ";\n    border-color: ").concat(dt('tabmenu.item.active.border.color'), ";\n    color: ").concat(dt('tabmenu.item.active.color'), ";\n}\n\n.p-tabmenu-item-active .p-tabmenu-item-icon {\n    color: ").concat(dt('tabmenu.item.icon.active.color'), ";\n}\n\n.p-tabmenu-active-bar {\n    z-index: 1;\n    display: block;\n    position: absolute;\n    bottom: ").concat(dt('tabmenu.active.bar.bottom'), ";\n    height: ").concat(dt('tabmenu.active.bar.height'), ";\n    background: ").concat(dt('tabmenu.active.bar.background'), ";\n    transition: 250ms cubic-bezier(0.35, 0, 0.25, 1);\n}\n\n.p-tabmenu::-webkit-scrollbar {\n    display: none;\n}\n");
+};
+var classes = {
+  root: 'p-tabmenu p-component',
+  tablist: 'p-tabmenu-tablist',
+  item: function item(_ref2) {
+    var instance = _ref2.instance,
+      index = _ref2.index,
+      _item = _ref2.item;
+    return ['p-tabmenu-item', {
+      'p-tabmenu-item-active': instance.d_activeIndex === index,
+      'p-disabled': instance.disabled(_item)
+    }];
+  },
+  itemLink: 'p-tabmenu-item-link',
+  itemIcon: 'p-tabmenu-item-icon',
+  itemLabel: 'p-tabmenu-item-label',
+  activeBar: 'p-tabmenu-active-bar'
+};
+var TabMenuStyle = BaseStyle.extend({
+  name: 'tabmenu',
+  theme: theme,
+  classes: classes
+});
+
+export { TabMenuStyle as default };
+//# sourceMappingURL=tabmenustyle.mjs.map

package/tabmenu/style/tabmenustyle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabmenustyle.mjs","sources":["../../../src/tabmenu/style/TabMenuStyle.js"],"sourcesContent":["import BaseStyle from '@primevuelab/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-tabmenu {\n    overflow-x: auto;\n}\n\n.p-tabmenu-tablist {\n    display: flex;\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    background: ${dt('tabmenu.tablist.background')};\n    border-style: solid;\n    border-color: ${dt('tabmenu.tablist.border.color')};\n    border-width: ${dt('tabmenu.tablist.border.width')};\n    position: relative;\n}\n\n.p-tabmenu-item-link {\n    cursor: pointer;\n    user-select: none;\n    display: flex;\n    align-items: center;\n    text-decoration: none;\n    position: relative;\n    overflow: hidden;\n    background: ${dt('tabmenu.item.background')};\n    border-style: solid;\n    border-width: ${dt('tabmenu.item.border.width')};\n    border-color: ${dt('tabmenu.item.border.color')};\n    color: ${dt('tabmenu.item.color')};\n    padding: ${dt('tabmenu.item.padding')};\n    font-weight: ${dt('tabmenu.item.font.weight')};\n    transition: background ${dt('tabmenu.transition.duration')}, border-color ${dt('tabmenu.transition.duration')}, color ${dt('tabmenu.transition.duration')}, outline-color ${dt('tabmenu.transition.duration')}, box-shadow ${dt(\n        'tabmenu.transition.duration'\n    )};\n    margin: ${dt('tabmenu.item.margin')};\n    outline-color: transparent;\n    gap: ${dt('tabmenu.item.gap')};\n}\n\n.p-tabmenu-item-link:focus-visible {\n    z-index: 1;\n    box-shadow: ${dt('tabmenu.item.focus.ring.shadow')};\n    outline: ${dt('tabmenu.item.focus.ring.width')} ${dt('tabmenu.item.focus.ring.style')} ${dt('tabmenu.item.focus.ring.color')};\n    outline-offset: ${dt('tabmenu.item.focus.ring.offset')};\n}\n\n.p-tabmenu-item-icon {\n    color: ${dt('tabmenu.item.icon.color')};\n    transition: background ${dt('tabmenu.transition.duration')}, border-color ${dt('tabmenu.transition.duration')}, color ${dt('tabmenu.transition.duration')}, outline-color ${dt('tabmenu.transition.duration')}, box-shadow ${dt(\n        'tabmenu.transition.duration'\n    )};\n}\n\n.p-tabmenu-item-label {\n    line-height: 1;\n}\n\n.p-tabmenu-item:not(.p-tabmenu-item-active):not(.p-disabled):hover .p-tabmenu-item-link {\n    background: ${dt('tabmenu.item.hover.background')};\n    border-color: ${dt('tabmenu.item.hover.border.color')};\n    color: ${dt('tabmenu.item.hover.color')};\n}\n\n.p-tabmenu-item:not(.p-tabmenu-item-active):not(.p-disabled):hover .p-tabmenu-item-icon {\n    color: ${dt('tabmenu.item.icon.hover.color')};\n}\n\n.p-tabmenu-item-active .p-tabmenu-item-link {\n    background: ${dt('tabmenu.item.active.background')};\n    border-color: ${dt('tabmenu.item.active.border.color')};\n    color: ${dt('tabmenu.item.active.color')};\n}\n\n.p-tabmenu-item-active .p-tabmenu-item-icon {\n    color: ${dt('tabmenu.item.icon.active.color')};\n}\n\n.p-tabmenu-active-bar {\n    z-index: 1;\n    display: block;\n    position: absolute;\n    bottom: ${dt('tabmenu.active.bar.bottom')};\n    height: ${dt('tabmenu.active.bar.height')};\n    background: ${dt('tabmenu.active.bar.background')};\n    transition: 250ms cubic-bezier(0.35, 0, 0.25, 1);\n}\n\n.p-tabmenu::-webkit-scrollbar {\n    display: none;\n}\n`;\n\nconst classes = {\n    root: 'p-tabmenu p-component',\n    tablist: 'p-tabmenu-tablist',\n    item: ({ instance, index, item }) => [\n        'p-tabmenu-item',\n        {\n            'p-tabmenu-item-active': instance.d_activeIndex === index,\n            'p-disabled': instance.disabled(item)\n        }\n    ],\n    itemLink: 'p-tabmenu-item-link',\n    itemIcon: 'p-tabmenu-item-icon',\n    itemLabel: 'p-tabmenu-item-label',\n    activeBar: 'p-tabmenu-active-bar'\n};\n\nexport default BaseStyle.extend({\n    name: 'tabmenu',\n    theme,\n    classes\n});\n"],"names":["theme","_ref","dt","concat","classes","root","tablist","item","_ref2","instance","index","d_activeIndex","disabled","itemLink","itemIcon","itemLabel","activeBar","BaseStyle","extend","name"],"mappings":"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"}