@ebrains/components 0.9.0-beta → 0.9.2-beta

package/dist/collection/components/eds-table/eds-table.stories.js

@@ -1,99 +0,0 @@
-export default {
-    title: 'Components/Table',
-    component: 'eds-table',
-    argTypes: {
-        data: {
-            control: 'object',
-            description: 'Data array to display in the table'
-        },
-        config: {
-            control: 'object',
-            description: 'Column configurations (hiding and formatting)'
-        },
-        endpoint: {
-            control: 'text',
-            description: 'API endpoint to fetch data from'
-        },
-        rowsPerPage: {
-            control: { type: 'number' },
-            description: 'Number of rows displayed per page'
-        },
-        paginationEnabled: {
-            control: { type: 'boolean' },
-            description: 'Toggle pagination on or off'
-        },
-        searchEnabled: {
-            control: { type: 'boolean' },
-            description: 'Enable search input for filtering'
-        },
-        columnSize: { control: 'select', options: ['default', 'medium', 'large'] }
-    },
-    args: {
-        data: [
-            { Property: 'username', Type: 'string', Required: 'Yes' },
-            { Property: 'password', Type: 'string', Required: 'Yes' },
-            { Property: 'email', Type: 'string', Required: 'Yes' }
-        ],
-        config: {
-            Required: { hidden: true },
-            Type: { format: 'uppercase' },
-            Property: { format: 'code' }
-        },
-        rowsPerPage: 5,
-        paginationEnabled: true,
-        searchEnabled: true,
-        columnSize: 'default'
-    }
-};
-// Sample data for the table
-const sampleData = [
-    { name: 'Alice', age: 25, occupation: 'Engineer' },
-    { name: 'Bob', age: 30, occupation: 'Designer' },
-    { name: 'Charlie', age: 35, occupation: 'Manager' },
-    { name: 'Daisy', age: 28, occupation: 'Developer' },
-    { name: 'Edward', age: 40, occupation: 'Architect' },
-    { name: 'Fiona', age: 22, occupation: 'Analyst' },
-    { name: 'George', age: 29, occupation: 'Technician' },
-    { name: 'Hannah', age: 31, occupation: 'Scientist' },
-    { name: 'Ian', age: 27, occupation: 'Developer' },
-    { name: 'Jackie', age: 33, occupation: 'Consultant' }
-];
-export const Default = {
-    render: (args) => `
-    <eds-table
-      table-data='${JSON.stringify(args.data)}'
-      config='${JSON.stringify(args.config)}'
-      rows-per-page="${args.rowsPerPage}"
-      pagination-enabled="${args.paginationEnabled}"
-      search-enabled="${args.searchEnabled}"
-      endpoint="${args.endpoint || ''}"
-      column-size="${args.columnSize}"
-    ></eds-table>
-  `,
-    args: {
-        data: sampleData,
-        config: {
-            name: { format: 'bold' },
-            occupation: { format: 'uppercase' }
-        },
-        rowsPerPage: 5,
-        paginationEnabled: true,
-        searchEnabled: true,
-        endpoint: '', // Leave empty for manual data entry
-        columnSize: 'default'
-    }
-};
-export const WithEndpoint = {
-    render: (args) => `
-    <eds-table 
-      endpoint="${args.endpoint}"
-      rows-per-page="${args.rowsPerPage}"
-      pagination-enabled="${args.paginationEnabled}"
-      search-enabled="${args.searchEnabled}"
-      host-width="600"
-      column-size="${args.columnSize}"
-    ></eds-table>`,
-    args: {
-        endpoint: 'http://127.0.0.1:5001/api/catalogue'
-    }
-};

package/dist/collection/components/eds-tag/eds-tag.css

@@ -1,56 +0,0 @@
-  .f-ui-05 {
-    font-family: var(--f-ui-05-fontFamily);
-    font-weight: var(--f-ui-05-fontWeight);
-    font-size: var(--f-ui-05-fontSize);
-    line-height: var(--f-ui-05-lineHeight);
-    letter-spacing: var(--f-ui-05-letterSpacing);
-  }
-  .py-1 {
-    padding-top: 0.0625rem;
-    padding-bottom: 0.0625rem;
-  }
-  .px-4 {
-    padding-left: 0.25rem;
-    padding-right: 0.25rem;
-  }
-  .border-2 {
-    border-width: 2px;
-  }
-  .rounded-pill {
-    border-radius: 100px;
-  }
-  .border-default {
-    border: 2px solid var(--black);
-  }
-  .text-inverse {
-    color: var(--white);
-  }
-  .bg-strongest {
-    background-color: var(--black);
-  }
-  .text-\[\#0034CB\] {
-    --tw-text-opacity: 1;
-    color: rgb(0 52 203 / var(--tw-text-opacity));
-  }
-  .border-\[\#0034CB\] {
-    --tw-border-opacity: 1;
-    border: 2px solid rgb(0 52 203 / var(--tw-border-opacity));
-  }
-  .text-light {
-    color: var(--grey-700);
-  }
-  .bg-strongest-soft {
-    background-color: rgba(0, 0, 0, .05);
-  }
-  .border-transparent {
-    border-color: var(--transparent);
-  }
-  .border-inverse {
-    border-color: var(--white);
-  }
-  .bg-inverse {
-    background-color: var(--white);
-  }
-  .text-lighter {
-    color: var(--grey-600);
-  }

package/dist/collection/components/eds-tag/eds-tag.js

@@ -1,84 +0,0 @@
-import { h } from "@stencil/core";
-import { cva } from "class-variance-authority";
-// Define the CVA for the tag styles
-const tagStyles = cva(['f-ui-05 py-1 px-4 border-2 rounded-pill'], // Base classes
-{
-    variants: {
-        intent: {
-            default: 'border-default',
-            strong: 'text-inverse bg-strongest border-default',
-            accent: 'text-[#0034CB] border-[#0034CB]',
-            weak: 'text-light bg-strongest-soft border-transparent',
-            inverse: 'border-inverse text-inverse',
-            'inverse-strong': 'bg-inverse border-inverse text-lighter'
-        }
-    },
-    defaultVariants: {
-        intent: 'default'
-    }
-});
-/**
- * `EdsTag` is a stylized label component designed to display short, categorical information.
- * It supports multiple visual styles defined by the `intent` prop.
- */
-export class EdsTag {
-    constructor() {
-        this.label = undefined;
-        this.intent = 'default';
-    }
-    render() {
-        const classes = tagStyles({ intent: this.intent });
-        return h("span", { key: '55a6039b040436e5dded9aaf1007668b97091ba3', class: classes }, this.label);
-    }
-    static get is() { return "eds-tag"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["eds-tag.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["eds-tag.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The label to be displayed inside the tag."
-                },
-                "attribute": "label",
-                "reflect": false
-            },
-            "intent": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'default' | 'strong' | 'accent' | 'weak' | 'inverse' | 'inverse-strong'",
-                    "resolved": "\"accent\" | \"default\" | \"inverse\" | \"inverse-strong\" | \"strong\" | \"weak\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The visual style or intent of the tag."
-                },
-                "attribute": "intent",
-                "reflect": false,
-                "defaultValue": "'default'"
-            }
-        };
-    }
-}

package/dist/collection/components/eds-tag/eds-tag.stories.js

@@ -1,27 +0,0 @@
-export default {
-    title: 'Components/Tag',
-    component: 'eds-tag',
-    argTypes: {
-        label: {
-            control: 'text',
-            description: 'The label text for the tag'
-        },
-        intent: {
-            control: 'select',
-            options: ['default', 'strong', 'accent', 'weak', 'inverse', 'inverse-strong'],
-            description: 'The visual intent style for the tag'
-        }
-    },
-    args: {
-        label: 'Default Tag',
-        intent: 'default'
-    },
-    parameters: {}
-};
-export const Default = {
-    render: (args) => `<eds-tag label="${args.label}" intent="${args.intent}"></eds-tag>`,
-    args: {
-        label: 'Default Tag',
-        intent: 'default'
-    }
-};