reactive-bulma 3.1.0 → 4.0.0

package/dist/esm/types/components/atoms/TableCell/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TableCellProps } from '../../../interfaces/atomProps';
+declare const TableCell: React.FC<TableCellProps>;
+export default TableCell;

package/dist/esm/types/components/atoms/TableHeadCell/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TableHeadCellProps } from '../../../interfaces/atomProps';
+declare const TableHeadCell: React.FC<TableHeadCellProps>;
+export default TableHeadCell;

package/dist/esm/types/components/atoms/index.d.ts

@@ -23,3 +23,5 @@ export { default as TabItem } from './TabItem';
 export { default as LevelHeader } from './LevelHeader';
 export { default as Tile } from './Tile';
 export { default as NavBarItem } from './NavBarItem';
+export { default as TableHeadCell } from './TableHeadCell';
+export { default as TableCell } from './TableCell';

package/dist/esm/types/components/molecules/TableRow/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TableRowProps } from '../../../interfaces/moleculeProps';
+declare const TableRow: React.FC<TableRowProps>;
+export default TableRow;

package/dist/esm/types/components/molecules/index.d.ts

@@ -19,3 +19,4 @@ export { default as Media } from './Media';
 export { default as Section } from './Section';
 export { default as NavBarBrand } from './NavBarBrand';
 export { default as NavBarDropdown } from './NavBarDropdown';
+export { default as TableRow } from './TableRow';

package/dist/esm/types/components/organisms/Card/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { CardProps } from '../../../interfaces/organismProps';
+declare const Card: React.FC<CardProps>;
+export default Card;

package/dist/esm/types/components/organisms/Table/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TableProps } from '../../../interfaces/organismProps';
+declare const Table: React.FC<TableProps>;
+export default Table;

package/dist/esm/types/components/organisms/index.d.ts

@@ -4,3 +4,5 @@ export { default as Level } from './Level';
 export { default as Hero } from './Hero';
 export { default as TileGroup } from './TileGroup';
 export { default as NavBar } from './NavBar';
+export { default as Card } from './Card';
+export { default as Table } from './Table';

package/dist/esm/types/functions/jest.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const renderTestingTableContainer: (element: React.ReactElement) => import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>;

package/dist/esm/types/interfaces/atomProps.d.ts

@@ -295,3 +295,11 @@ export interface NavBarItemProps extends ElementProps, ClickeableProps {
     /** `Styling` Used for `NavBarDropdown` styling purpose only. Will mark the item as the one selected among its group */
     isActive?: boolean;
 }
+export interface TableHeadCellProps extends ElementProps, ClickeableProps {
+    /** `Attribute` `Required` It will display cell's content, which could be text, an html tag or a custom component */
+    content: SingleChildType;
+}
+export interface TableCellProps extends ElementProps, ClickeableProps {
+    /** `Attribute` `Required` It will display cell's content, which could be text, an html tag or a custom component */
+    content: SingleChildType;
+}

package/dist/esm/types/interfaces/moleculeProps.d.ts

@@ -1,5 +1,5 @@
 import { ClickeableProps, ComposedElementProps, ElementProps } from './commonProps';
-import { BreadcrumbItemProps, ButtonProps, ColumnProps, DeleteProps, DropdownItemProps, IconProps, ImageProps, InputProps, MenuItemProps, NavBarItemProps, PaginationItemProps, TabItemProps, TileProps } from './atomProps';
+import { BreadcrumbItemProps, ButtonProps, ColumnProps, DeleteProps, DropdownItemProps, IconProps, ImageProps, InputProps, MenuItemProps, NavBarItemProps, PaginationItemProps, TabItemProps, TableCellProps, TableHeadCellProps, TileProps } from './atomProps';
 import { BasicColorType, RightCenteredAlignType, BreadcrumbSeparatorType, ColumnGapType, SizeWithoutNormalType, TabsFormatType, MediumAndLargeSizeType, RightLeftAlignType } from '../types/styleTypes';
 import { ChildrenType, SingleChildType, PanelBlockItemType } from '../types/domTypes';
 export interface ButtonGroupProps extends ElementProps {
@@ -215,9 +215,17 @@ interface BrandConfigProps extends Omit<NavBarItemProps, 'children'> {
     children: ImageProps;
 }
 export interface NavBarBrandProps extends ElementProps {
-    /** `Attribute` `Required` Configuration object to inject a NavBarItem with a Image configuration as its children */
+    /** `Attribute` `Required` Configuration object to inject a `NavBarItem` with a Image configuration as its children */
     brandConfig: BrandConfigProps;
     /** `Styling` It sets brand's burger button as active (changing looks from a burger to a cross) */
     isBurgerActive?: boolean;
 }
+export interface TableRowProps extends ElementProps, ClickeableProps {
+    /** `Attribute` Configuration object to inject a `TableHeaderCell` as row's head */
+    headCell?: TableHeadCellProps;
+    /** `Attribute` `Required` List of `TableCell` that will be rendered on the table */
+    listOfCells: TableCellProps[];
+    /** `Styling` Used for `Table` styling purpose only. Will set row's background color to indicate it has been selected by the user */
+    isSelected?: boolean;
+}
 export {};

package/dist/esm/types/interfaces/organismProps.d.ts

@@ -1,8 +1,8 @@
-import { ElementProps } from './commonProps';
-import { InputControlProps, LevelItemProps, NavBarBrandProps, NavBarDropdownProps, PanelBlockProps, PanelTabsProps } from './moleculeProps';
+import { ClickeableProps, ElementProps } from './commonProps';
+import { InputControlProps, LevelItemProps, NavBarBrandProps, NavBarDropdownProps, PanelBlockProps, PanelTabsProps, TableRowProps } from './moleculeProps';
+import { ImageProps, NavBarItemProps, TableHeadCellProps, TileProps } from './atomProps';
 import { BasicColorType, SizeWithHeightType } from '../types/styleTypes';
 import { ChildrenType, NavBarFixedPositionType } from '../types/domTypes';
-import { NavBarItemProps, TileProps } from './atomProps';
 export interface FormFieldHelperProps {
     text?: string;
     color?: BasicColorType;
@@ -77,3 +77,36 @@ export interface NavBarProps extends ElementProps {
     /** `Styling` Adds a small shadow on navbar's bottom */
     hasShadow?: boolean;
 }
+export interface CardFooterProps extends ClickeableProps {
+    text: string;
+}
+export interface CardProps extends ElementProps {
+    /** `Attribute` It will shot a text on card's top, just a paragraph */
+    headerText?: string;
+    /** `Attribute` A single configuration object that will render an `Image` component */
+    image?: ImageProps;
+    /** `Attribute` `Required` Deisgnated section where you can include a string, a single or list of components (each one separated in its own `content` section) */
+    content: ChildrenType;
+    /** `Attribute` A list of footer links that will be rendered on card's bottom, below its content */
+    footerLinks?: CardFooterProps[];
+}
+export interface TableProps extends ElementProps {
+    /** `Attribute` `Required` Configuration object that will display table's head */
+    head: TableHeadCellProps[];
+    /** `Attribute` `Required` Configuration object that will display table's body */
+    body: TableRowProps[];
+    /** `Attribute` Configuration object that will display table's foot */
+    foot?: TableHeadCellProps[];
+    /** `Styling` It will add a Bordered styling to the table. It can be combined with other mentioned styling properties. */
+    isBordered?: boolean;
+    /** `Styling` It will add a Striped styling to the table. It can be combined with other mentioned styling properties. */
+    isStriped?: boolean;
+    /** `Styling` It will add a Narrow styling to the table. It can be combined with other mentioned styling properties. */
+    isNarrow?: boolean;
+    /** `Styling` It will add a Hoverable styling to the table. It can be combined with other mentioned styling properties. */
+    isHoverable?: boolean;
+    /** `Styling` It will add a Fullwidth styling to the table. It can be combined with other mentioned styling properties. */
+    isFullwidth?: boolean;
+    /** `Styling` Will create a container around the table in order to make it scrollable */
+    isContained?: boolean;
+}

package/dist/index.d.ts

@@ -345,6 +345,14 @@ interface NavBarItemProps extends ElementProps, ClickeableProps {
     /** `Styling` Used for `NavBarDropdown` styling purpose only. Will mark the item as the one selected among its group */
     isActive?: boolean;
 }
+interface TableHeadCellProps extends ElementProps, ClickeableProps {
+    /** `Attribute` `Required` It will display cell's content, which could be text, an html tag or a custom component */
+    content: SingleChildType;
+}
+interface TableCellProps extends ElementProps, ClickeableProps {
+    /** `Attribute` `Required` It will display cell's content, which could be text, an html tag or a custom component */
+    content: SingleChildType;
+}
 
 declare const Button: React$1.FC<ButtonProps>;
 
@@ -396,6 +404,10 @@ declare const Tile: React$1.FC<TileProps>;
 
 declare const NavBarItem: React$1.FC<NavBarItemProps>;
 
+declare const TableHeadCell: React$1.FC<TableHeadCellProps>;
+
+declare const TableCell: React$1.FC<TableCellProps>;
+
 interface ButtonGroupProps extends ElementProps {
     /** `Atribute` `Required` Array of `Button` objects that will be shown */
     buttonList: ButtonProps[];
@@ -609,11 +621,19 @@ interface BrandConfigProps extends Omit<NavBarItemProps, 'children'> {
     children: ImageProps;
 }
 interface NavBarBrandProps extends ElementProps {
-    /** `Attribute` `Required` Configuration object to inject a NavBarItem with a Image configuration as its children */
+    /** `Attribute` `Required` Configuration object to inject a `NavBarItem` with a Image configuration as its children */
     brandConfig: BrandConfigProps;
     /** `Styling` It sets brand's burger button as active (changing looks from a burger to a cross) */
     isBurgerActive?: boolean;
 }
+interface TableRowProps extends ElementProps, ClickeableProps {
+    /** `Attribute` Configuration object to inject a `TableHeaderCell` as row's head */
+    headCell?: TableHeadCellProps;
+    /** `Attribute` `Required` List of `TableCell` that will be rendered on the table */
+    listOfCells: TableCellProps[];
+    /** `Styling` Used for `Table` styling purpose only. Will set row's background color to indicate it has been selected by the user */
+    isSelected?: boolean;
+}
 
 declare const ButtonGroup: React$1.FC<ButtonGroupProps>;
 
@@ -657,6 +677,8 @@ declare const NavBarBrand: React$1.FC<NavBarBrandProps>;
 
 declare const NavBarDropdown: React$1.FC<NavBarDropdownProps>;
 
+declare const TableRow: React$1.FC<TableRowProps>;
+
 interface FormFieldHelperProps {
     text?: string;
     color?: BasicColorType;
@@ -731,6 +753,39 @@ interface NavBarProps extends ElementProps {
     /** `Styling` Adds a small shadow on navbar's bottom */
     hasShadow?: boolean;
 }
+interface CardFooterProps extends ClickeableProps {
+    text: string;
+}
+interface CardProps extends ElementProps {
+    /** `Attribute` It will shot a text on card's top, just a paragraph */
+    headerText?: string;
+    /** `Attribute` A single configuration object that will render an `Image` component */
+    image?: ImageProps;
+    /** `Attribute` `Required` Deisgnated section where you can include a string, a single or list of components (each one separated in its own `content` section) */
+    content: ChildrenType;
+    /** `Attribute` A list of footer links that will be rendered on card's bottom, below its content */
+    footerLinks?: CardFooterProps[];
+}
+interface TableProps extends ElementProps {
+    /** `Attribute` `Required` Configuration object that will display table's head */
+    head: TableHeadCellProps[];
+    /** `Attribute` `Required` Configuration object that will display table's body */
+    body: TableRowProps[];
+    /** `Attribute` Configuration object that will display table's foot */
+    foot?: TableHeadCellProps[];
+    /** `Styling` It will add a Bordered styling to the table. It can be combined with other mentioned styling properties. */
+    isBordered?: boolean;
+    /** `Styling` It will add a Striped styling to the table. It can be combined with other mentioned styling properties. */
+    isStriped?: boolean;
+    /** `Styling` It will add a Narrow styling to the table. It can be combined with other mentioned styling properties. */
+    isNarrow?: boolean;
+    /** `Styling` It will add a Hoverable styling to the table. It can be combined with other mentioned styling properties. */
+    isHoverable?: boolean;
+    /** `Styling` It will add a Fullwidth styling to the table. It can be combined with other mentioned styling properties. */
+    isFullwidth?: boolean;
+    /** `Styling` Will create a container around the table in order to make it scrollable */
+    isContained?: boolean;
+}
 
 declare const FormField: React$1.FC<FormFieldProps>;
 
@@ -744,4 +799,8 @@ declare const TileGroup: React$1.FC<TileGroupProps>;
 
 declare const NavBar: React$1.FC<NavBarProps>;
 
-export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Footer, FormField, Hero, Icon, Image, Input, InputControl, Level, LevelHeader, LevelItem, Media, Menu, MenuItem, MenuList, Message, Modal, NavBar, NavBarBrand, NavBarDropdown, NavBarItem, Notification, Pagination, PaginationItem, Panel, PanelBlock, PanelTabs, ProgressBar, RadioButton, Section, Select, TabItem, Tabs, Tag, TextArea, Tile, TileBox, TileGroup, Title };
+declare const Card: React$1.FC<CardProps>;
+
+declare const Table: React$1.FC<TableProps>;
+
+export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, Card, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Footer, FormField, Hero, Icon, Image, Input, InputControl, Level, LevelHeader, LevelItem, Media, Menu, MenuItem, MenuList, Message, Modal, NavBar, NavBarBrand, NavBarDropdown, NavBarItem, Notification, Pagination, PaginationItem, Panel, PanelBlock, PanelTabs, ProgressBar, RadioButton, Section, Select, TabItem, Table, TableCell, TableHeadCell, TableRow, Tabs, Tag, TextArea, Tile, TileBox, TileGroup, Title };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reactive-bulma",
-  "version": "3.1.0",
+  "version": "4.0.0",
   "description": "A component library based on React, Bulma, Typescript and Rollup",
   "keywords": [
     "typescript",
@@ -67,34 +67,34 @@
     "@semantic-release/github": "^9.2.6",
     "@semantic-release/npm": "^11.0.2",
     "@semantic-release/release-notes-generator": "^12.1.0",
-    "@storybook/addon-actions": "^7.6.10",
-    "@storybook/addon-essentials": "^7.6.10",
-    "@storybook/addon-interactions": "^7.6.10",
-    "@storybook/addon-links": "^7.6.10",
-    "@storybook/addon-mdx-gfm": "^7.6.10",
-    "@storybook/cli": "^7.6.10",
-    "@storybook/react": "^7.6.10",
-    "@storybook/react-webpack5": "^7.6.10",
+    "@storybook/addon-actions": "^7.6.12",
+    "@storybook/addon-essentials": "^7.6.12",
+    "@storybook/addon-interactions": "^7.6.12",
+    "@storybook/addon-links": "^7.6.12",
+    "@storybook/addon-mdx-gfm": "^7.6.12",
+    "@storybook/cli": "^7.6.12",
+    "@storybook/react": "^7.6.12",
+    "@storybook/react-webpack5": "^7.6.12",
     "@storybook/testing-library": "^0.2.2",
-    "@testing-library/jest-dom": "^6.3.0",
-    "@testing-library/react": "^14.1.2",
+    "@testing-library/jest-dom": "^6.4.0",
+    "@testing-library/react": "^14.2.0",
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.11",
     "@types/react": "^18.2.48",
-    "@typescript-eslint/eslint-plugin": "^6.19.1",
-    "@typescript-eslint/parser": "^6.19.1",
+    "@typescript-eslint/eslint-plugin": "^6.20.0",
+    "@typescript-eslint/parser": "^6.20.0",
     "babel-jest": "^29.7.0",
     "babel-loader": "^9.1.3",
     "bulma": "^0.9.4",
     "eslint": "^8.56.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-react": "^7.33.2",
-    "husky": "^9.0.6",
+    "husky": "^9.0.7",
     "hygen": "^6.2.11",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "lint-staged": "^15.2.0",
-    "npm-check-updates": "^16.14.13",
+    "lint-staged": "^15.2.1",
+    "npm-check-updates": "^16.14.14",
     "postcss": "^8.4.33",
     "prettier": "^3.2.4",
     "react": "^18.2.0",
@@ -103,7 +103,7 @@
     "rollup-plugin-dts": "^6.1.0",
     "rollup-plugin-postcss": "^4.0.2",
     "semantic-release": "^23.0.0",
-    "storybook": "^7.6.10",
+    "storybook": "^7.6.12",
     "tslib": "^2.6.2",
     "typescript": "^5.3.3"
   },