@ebrains/components 0.6.0-alpha.0 → 0.7.0-alpha.0

package/dist/esm/eds-tab.entry.js

@@ -1,36 +0,0 @@
-import { r as registerInstance, h } from './index-e96badea.js';
-import { c as cva } from './index-39c58238.js';
-
-const EdsTab = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.tabCva = cva([
-            'cursor-pointer',
-            //'px-16 py-12',
-            //'border-b-2',
-            'text-gray-700',
-            'hover:text-black',
-            'focus:outline-none',
-            'focus-visible:ring'
-        ], {
-            variants: {
-                active: {
-                    true: 'border-blue-500 font-bold text-blue-600',
-                    false: 'border-transparent'
-                }
-            },
-            defaultVariants: {
-                active: false
-            }
-        });
-        this.label = undefined;
-        this.url = undefined;
-        this.active = false;
-        this.ariaLabel = undefined;
-    }
-    render() {
-        return (h("a", { key: 'a55be2a07e554ab13a0d7e913710382d6126da57', "aria-label": this.label, "aria-current": this.active, class: this.tabCva({ active: this.active }) }, this.label));
-    }
-};
-
-export { EdsTab as eds_tab };

package/dist/esm/eds-tabs-content.entry.js

@@ -1,129 +0,0 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-e96badea.js';
-import { s as sendAnalytics } from './analytics-44b1416b.js';
-import { c as cva } from './index-39c58238.js';
-
-const EdsTabsContent = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.tabContentChange = createEvent(this, "tabContentChange", 7);
-        // cva configuration
-        this.tabCva = cva([
-            'relative px-16 py-12',
-            'f-ui-03 whitespace-nowrap',
-            'effect-color',
-            'focus-visible:text-default hover:text-default',
-            'border-2',
-            "after:content-[''] after:absolute after:inset-0 after:rounded-t-lg after:border-3 after:border-accent after:opacity-0",
-            'outline-none focus:outline-none focus-visible:outline-none focus-visible:after:opacity-100'
-        ], {
-            variants: {
-                position: {
-                    left: 'rounded-tl-lg border-r-0 pr-28 -mr-16 after:right-16',
-                    right: 'rounded-tr-lg border-l-0 pl-28 -ml-16 after:left-16',
-                    center: '',
-                    first: 'rounded-t-lg'
-                },
-                active: {
-                    false: 'text-lighter bg-dark hover:bg-darker border-softest',
-                    true: [
-                        'bg-default text-default z-99',
-                        'rounded-t-lg',
-                        "before:content-[''] before:absolute before:-bottom-2 z-1 before:inset-x-0 before:h-3 before:bg-default",
-                        'border-[#d2d2d2]'
-                    ]
-                }
-            }
-        });
-        this.navAriaLabel = 'Tabs';
-        this.tabs = undefined;
-        this.parsedTabs = [];
-        this.activeIndex = -1;
-    }
-    componentWillLoad() {
-        this.parseTabs();
-        this.setActiveIndex();
-    }
-    parseTabs() {
-        try {
-            this.parsedTabs = JSON.parse(this.tabs);
-        }
-        catch (error) {
-            //console.error('Invalid JSON format for tabs:', error);
-            this.parsedTabs = [];
-        }
-    }
-    componentDidLoad() {
-        this.initializeTabContentVisibility();
-        this.el.addEventListener('tabContentChange', (e) => {
-            this.updateTabContentVisibility(e.detail.index);
-        });
-        this.scrollToActiveTab();
-    }
-    initializeTabContentVisibility() {
-        const allContent = this.el.querySelectorAll('.tab-content');
-        allContent.forEach((content, index) => {
-            content.setAttribute('style', `display: ${index === this.activeIndex ? 'block' : 'none'}`);
-        });
-    }
-    updateTabContentVisibility(index) {
-        const allContent = this.el.querySelectorAll('.tab-content');
-        allContent.forEach((content, contentIndex) => {
-            content.setAttribute('style', `display: ${contentIndex === index ? 'block' : 'none'}`);
-        });
-    }
-    setActiveIndex() {
-        this.activeIndex = this.parsedTabs.findIndex((tab) => tab.active);
-    }
-    scrollToActiveTab() {
-        var _a;
-        const activeTab = (_a = this.tabContainer) === null || _a === void 0 ? void 0 : _a.querySelector('[data-tab-active]');
-        if (activeTab) {
-            setTimeout(() => {
-                activeTab.scrollIntoView({
-                    inline: 'center',
-                    block: 'nearest'
-                });
-            }, 316);
-        }
-    }
-    getTabOptions(active, index) {
-        const position = active
-            ? 'center'
-            : this.activeIndex === -1 && index === 0
-                ? 'first'
-                : index < this.activeIndex
-                    ? 'left'
-                    : 'right';
-        return Object.assign({ class: this.tabCva({
-                active,
-                position
-            }), style: {
-                zIndex: `${active ? this.parsedTabs.length + 99 : position === 'left' ? index : this.parsedTabs.length + 1 - index}`
-            } }, (active ? { 'data-tab-active': 'true' } : {}));
-    }
-    handleTabClick(index, tabLabel) {
-        // Update the active index and set all tabs' active state accordingly
-        this.activeIndex = index;
-        this.parsedTabs = this.parsedTabs.map((tab, tabIndex) => (Object.assign(Object.assign({}, tab), { active: tabIndex === index })));
-        this.tabContentChange.emit({ index: index, name: tabLabel });
-        sendAnalytics({
-            category: 'ui-component',
-            tag: this.el.tagName.toLowerCase(),
-            name: (tabLabel === null || tabLabel === void 0 ? void 0 : tabLabel.toLowerCase()) || '',
-            action: 'click'
-        });
-    }
-    render() {
-        return (h("div", { key: 'd94df79c55522088de5445587758a5eea028b313', class: "after:border-softest before:bg-gradient-y relative overflow-x-hidden before:absolute before:inset-x-0 before:bottom-0 before:h-12 before:opacity-5 before:content-[''] after:absolute after:inset-x-0 after:bottom-0 after:border-b-2 after:content-['']" }, h("div", { key: 'e7d01a2e6b424c25749c0d70305fb1c8c55bef74', class: "scroller-x max-w-xxxl xxxl:px-0 relative z-[1] mx-auto px-16 pt-8 lg:px-28" }, h("nav", { key: 'ef8ff8a02e570dfcf8143997ace793a65917e6ca', ref: (el) => (this.tabContainer = el), class: "inline-flex", "aria-label": this.navAriaLabel }, this.parsedTabs.map((tab, index) => {
-            //const TabComponent = tab.active ? 'span' : 'a';
-            const tabProps = this.getTabOptions(tab.active, index);
-            return (h("eds-tab", Object.assign({}, tabProps, { label: tab.label, url: tab.url, active: index === this.activeIndex, ariaLabel: tab.ariaLabel, onClick: () => this.handleTabClick(index, tab.label) })));
-        })), h("slot", { key: '8f014081c3bc2a8a3013aea3aff32690d6f71c85' }))));
-    }
-    get el() { return getElement(this); }
-    static get watchers() { return {
-        "tabs": ["parseTabs"]
-    }; }
-};
-
-export { EdsTabsContent as eds_tabs_content };

package/dist/types/components/eds-navigator/eds-navigator.d.ts

@@ -1,42 +0,0 @@
-/**
- * @internal
- */
-export declare class EdsNavigator {
-    /**
-     * Label for the previous navigation link.
-     */
-    prevLabel?: string;
-    /**
-     * Label for the next navigation link.
-     */
-    nextLabel?: string;
-    /**
-     * URL for the previous navigation link. If not provided, the link will be disabled.
-     */
-    prevUrl?: string;
-    /**
-     * URL for the next navigation link. If not provided, the link will be disabled.
-     */
-    nextUrl?: string;
-    /**
-     * Size of the links. Can be 'small', 'medium', or 'large'.
-     * Default is 'small'.
-     */
-    linkSize: 'small' | 'large';
-    /**
-     * Intent of the links. Can be 'ghost', 'primary', 'secondary', etc.
-     * Default is 'ghost'.
-     */
-    linkIntent: 'ghost' | 'primary' | 'secondary' | 'tertiary' | 'ghost';
-    /**
-     * Reference to the host element.
-     */
-    el: HTMLElement;
-    componentDidLoad(): void;
-    /**
-     * Emits a custom event 'parentContext' for a given link element with the component's context.
-     * @param linkElement - The eds-link element to emit the event for.
-     */
-    emitContext(linkElement: HTMLElement): void;
-    render(): any;
-}

package/dist/types/components/eds-navigator/eds-navigator.stories.d.ts

@@ -1,46 +0,0 @@
-declare const _default: {
-    title: string;
-    component: string;
-    includeStories: any[];
-    argTypes: {
-        prevLabel: {
-            control: string;
-            description: string;
-            defaultValue: string;
-        };
-        nextLabel: {
-            control: string;
-            description: string;
-            defaultValue: string;
-        };
-        prevUrl: {
-            control: string;
-            description: string;
-            defaultValue: string;
-        };
-        nextUrl: {
-            control: string;
-            description: string;
-            defaultValue: string;
-        };
-        linkSize: {
-            control: string;
-            options: string[];
-            description: string;
-            defaultValue: string;
-        };
-        linkIntent: {
-            control: string;
-            options: string[];
-            description: string;
-            defaultValue: string;
-        };
-    };
-};
-export default _default;
-export declare const Default: any;
-export declare const MediumPrimaryLinks: any;
-export declare const LargeSecondaryLinks: any;
-export declare const OnlyNextLink: any;
-export declare const OnlyPrevLink: any;
-export declare const DisabledLinks: any;

package/dist/types/components/eds-tab/eds-tab.d.ts

@@ -1,15 +0,0 @@
-/**
- * @internal
- */
-export declare class EdsTab {
-    /** The label of the tab */
-    label: string;
-    /** The URL or href of the tab */
-    url?: string;
-    /** Whether the tab is active */
-    active: boolean;
-    /** Aria label for accessibility */
-    ariaLabel: string;
-    private tabCva;
-    render(): any;
-}

package/dist/types/shared-ui/eds-tabs-content/eds-tabs-content.d.ts

@@ -1,36 +0,0 @@
-import { EventEmitter } from '../../stencil-public-runtime';
-/**
- * @internal
- */
-export declare class EdsTabsContent {
-    el: HTMLElement;
-    /** Aria label for the navigation */
-    navAriaLabel: string;
-    /** JSON string for tabs data */
-    tabs: string;
-    /** State to store parsed tabs */
-    parsedTabs: Array<{
-        label: string;
-        url: string;
-        active: boolean;
-        ariaLabel: string;
-        onClick?: () => void;
-    }>;
-    activeIndex: number;
-    tabContentChange: EventEmitter<{
-        index: number;
-        name: string;
-    }>;
-    tabContainer: HTMLElement;
-    componentWillLoad(): void;
-    parseTabs(): void;
-    componentDidLoad(): void;
-    private initializeTabContentVisibility;
-    private updateTabContentVisibility;
-    private setActiveIndex;
-    private scrollToActiveTab;
-    private getTabOptions;
-    private handleTabClick;
-    private tabCva;
-    render(): any;
-}

package/dist/types/shared-ui/eds-tabs-content/eds-tabs-content.stories.d.ts

@@ -1,16 +0,0 @@
-declare const _default: {
-    title: string;
-    component: string;
-    includeStories: any[];
-    argTypes: {
-        tabs: {
-            control: string;
-            defaultValue: string;
-        };
-    };
-};
-export default _default;
-export declare const Default: any;
-export declare const ProfileActive: any;
-export declare const CustomTabs: any;
-export declare const WithFormTab: any;

package/dist/types/shared-ui/eds-user-modal/eds-user-modal.d.ts

@@ -1,47 +0,0 @@
-interface User {
-    fullname?: string;
-    username?: string;
-    email?: string;
-    firstname?: string;
-    lastname?: string;
-    color?: string;
-}
-interface LinkStyled {
-    label: string;
-    url: string;
-    intent?: 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'strong' | 'weak' | 'inverse' | 'underline';
-    external?: boolean;
-    download?: boolean;
-}
-/**
- * @internal
- */
-export declare class EdsUserModal {
-    /**
-     * The user object containing user information.
-     * Can be passed as an object or a JSON string.
-     */
-    user: User | string;
-    /**
-     * Array of links to be displayed in the modal.
-     * Can be passed as an array or a JSON string.
-     */
-    links?: string;
-    /**
-     * App URL for dynamic link generation.
-    @Prop() appUrl: string = '';
-    */
-    /**
-     * Logout callback function.
-     */
-    onLogout?: () => void;
-    parsedUser: User;
-    parsedLinks: LinkStyled[];
-    parseUserProp(newValue: User | string): void;
-    parseLinksProp(newValue: LinkStyled[] | string): void;
-    componentWillLoad(): void;
-    private get initials();
-    private get hasLogout();
-    render(): any;
-}
-export {};