reactive-bulma 2.9.0 → 2.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { TabItemProps } from '../../../interfaces/atomProps';
3
+ declare const TabItem: React.FC<TabItemProps>;
4
+ export default TabItem;
@@ -19,3 +19,4 @@ export { default as DropdownItem } from './DropdownItem';
19
19
  export { default as MenuItem } from './MenuItem';
20
20
  export { default as Image } from './Image';
21
21
  export { default as PaginationItem } from './PaginationItem';
22
+ export { default as TabItem } from './TabItem';
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { TabsProps } from '../../../interfaces/moleculeProps';
3
+ declare const Tabs: React.FC<TabsProps>;
4
+ export default Tabs;
@@ -8,3 +8,4 @@ export { default as Menu } from './Menu';
8
8
  export { default as MenuList } from './MenuList';
9
9
  export { default as Pagination } from './Pagination';
10
10
  export { default as Modal } from './Modal';
11
+ export { default as Tabs } from './Tabs';
@@ -1,3 +1,4 @@
1
+ import { GenericObjectProps } from '../interfaces/commonProps';
1
2
  import { ParseTestIdProps } from '../interfaces/functionProps';
2
3
  /**
3
4
  * @param { Array<string | null> } _classes `Required`. Array of classNames on `string` (or `null`) values
@@ -13,3 +14,9 @@ export declare const parseClasses: (_classes: Array<string | null | undefined>)
13
14
  */
14
15
  export declare const parseTestId: (config: ParseTestIdProps) => string;
15
16
  export declare const parseKey: (max?: number, min?: number) => string;
17
+ interface CreateObjArrayProps {
18
+ numberOfItems?: number;
19
+ externalParser?: (i: number) => GenericObjectProps;
20
+ }
21
+ export declare const createObjArray: <ImportedProps>({ numberOfItems, externalParser }?: CreateObjArrayProps) => ImportedProps[] | GenericObjectProps[];
22
+ export {};
@@ -257,3 +257,11 @@ export interface PaginationItemProps extends ElementProps, ClickeableProps {
257
257
  /** `Styling` Makes the item the selected one, changing its background to blue */
258
258
  isSelected?: boolean;
259
259
  }
260
+ export interface TabItemProps extends ComposedElementProps, ClickeableProps {
261
+ /** `Attribute` `Required` The text will be shown in the `TabItem` */
262
+ text: string;
263
+ /** `Attribute` Adds an `Icon` component before the text */
264
+ icon?: IconProps;
265
+ /** `Styling` Used for Tabs styling purpose only. Will mark the tab as the one selected among its group */
266
+ isActive?: boolean;
267
+ }
@@ -21,3 +21,6 @@ export interface ClickeableProps {
21
21
  /** `Function` Click function, alone does not nothing, but can be reused for other components */
22
22
  onClick?: () => void;
23
23
  }
24
+ export interface GenericObjectProps {
25
+ [key: string]: string | number | boolean;
26
+ }
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import { ClickeableProps, ComposedElementProps, ElementProps } from './commonProps';
3
- import { BreadcrumbItemProps, ButtonProps, ColumnProps, DeleteProps, DropdownItemProps, MenuItemProps, PaginationItemProps } from './atomProps';
4
- import { basicColorType, elementAlignType, breadcrumbSeparatorType, columnGapType, reducedSizeType } from '../types/styleTypes';
3
+ import { BreadcrumbItemProps, ButtonProps, ColumnProps, DeleteProps, DropdownItemProps, MenuItemProps, PaginationItemProps, TabItemProps } from './atomProps';
4
+ import { basicColorType, elementAlignType, breadcrumbSeparatorType, columnGapType, reducedSizeType, tabsFormatType } from '../types/styleTypes';
5
5
  export interface ButtonGroupProps extends ElementProps {
6
6
  /** `Atribute` `Required` Array of `Button` objects that will be shown */
7
7
  buttonList: ButtonProps[];
@@ -115,4 +115,18 @@ export interface ModalProps extends ComposedElementProps {
115
115
  /** `Function` Custom function related to the modal's close button to inject custom code if needed */
116
116
  onCloseClick?: () => void;
117
117
  }
118
+ export interface TabsProps extends ElementProps {
119
+ /** `Attribute` `Required` List of tabs that will be shown in order */
120
+ tabs: TabItemProps[];
121
+ /** `Styling` Will adjust the tabs position on screen */
122
+ alignment?: elementAlignType;
123
+ /** `Styling` Set tab's size on bulma's size tokens */
124
+ size?: reducedSizeType;
125
+ /** `Styling` Set tab's size on bulma's size tokens */
126
+ format?: tabsFormatType;
127
+ /** `Styling` Will add round tabs borders. Only visible if `format` is set to `is-toggle` */
128
+ isRounded?: boolean;
129
+ /** `Styling` The whole container will occupy its parent container width */
130
+ isFullWidth?: boolean;
131
+ }
118
132
  export {};
@@ -10,3 +10,4 @@ export type iconColorModeType = 'light' | 'dark';
10
10
  export type columnGapType = 'is-0' | 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6' | 'is-7' | 'is-8';
11
11
  export type elementAlignType = 'is-centered' | 'is-right';
12
12
  export type breadcrumbSeparatorType = 'has-arrow-separator' | 'has-bullet-separator' | 'has-dot-separator' | 'has-succeeds-separator';
13
+ export type tabsFormatType = 'is-boxed' | 'is-toggle';
package/dist/index.d.ts CHANGED
@@ -36,6 +36,7 @@ type iconColorModeType = 'light' | 'dark';
36
36
  type columnGapType = 'is-0' | 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6' | 'is-7' | 'is-8';
37
37
  type elementAlignType = 'is-centered' | 'is-right';
38
38
  type breadcrumbSeparatorType = 'has-arrow-separator' | 'has-bullet-separator' | 'has-dot-separator' | 'has-succeeds-separator';
39
+ type tabsFormatType = 'is-boxed' | 'is-toggle';
39
40
 
40
41
  type inputTypes = 'text' | 'password' | 'email' | 'tel';
41
42
  type DropdownItemType = 'item' | 'link' | 'divider';
@@ -295,6 +296,14 @@ interface PaginationItemProps extends ElementProps, ClickeableProps {
295
296
  /** `Styling` Makes the item the selected one, changing its background to blue */
296
297
  isSelected?: boolean;
297
298
  }
299
+ interface TabItemProps extends ComposedElementProps, ClickeableProps {
300
+ /** `Attribute` `Required` The text will be shown in the `TabItem` */
301
+ text: string;
302
+ /** `Attribute` Adds an `Icon` component before the text */
303
+ icon?: IconProps;
304
+ /** `Styling` Used for Tabs styling purpose only. Will mark the tab as the one selected among its group */
305
+ isActive?: boolean;
306
+ }
298
307
 
299
308
  declare const Button: React$1.FC<ButtonProps>;
300
309
 
@@ -338,6 +347,8 @@ declare const Image: React$1.FC<ImageProps>;
338
347
 
339
348
  declare const PaginationItem: React$1.FC<PaginationItemProps>;
340
349
 
350
+ declare const TabItem: React$1.FC<TabItemProps>;
351
+
341
352
  interface ButtonGroupProps extends ElementProps {
342
353
  /** `Atribute` `Required` Array of `Button` objects that will be shown */
343
354
  buttonList: ButtonProps[];
@@ -451,6 +462,20 @@ interface ModalProps extends ComposedElementProps {
451
462
  /** `Function` Custom function related to the modal's close button to inject custom code if needed */
452
463
  onCloseClick?: () => void;
453
464
  }
465
+ interface TabsProps extends ElementProps {
466
+ /** `Attribute` `Required` List of tabs that will be shown in order */
467
+ tabs: TabItemProps[];
468
+ /** `Styling` Will adjust the tabs position on screen */
469
+ alignment?: elementAlignType;
470
+ /** `Styling` Set tab's size on bulma's size tokens */
471
+ size?: reducedSizeType;
472
+ /** `Styling` Set tab's size on bulma's size tokens */
473
+ format?: tabsFormatType;
474
+ /** `Styling` Will add round tabs borders. Only visible if `format` is set to `is-toggle` */
475
+ isRounded?: boolean;
476
+ /** `Styling` The whole container will occupy its parent container width */
477
+ isFullWidth?: boolean;
478
+ }
454
479
 
455
480
  declare const ButtonGroup: React$1.FC<ButtonGroupProps>;
456
481
 
@@ -472,4 +497,6 @@ declare const Pagination: React$1.FC<PaginationProps>;
472
497
 
473
498
  declare const Modal: React$1.FC<ModalProps>;
474
499
 
475
- export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Icon, Image, Input, Menu, MenuItem, MenuList, Message, Modal, Notification, Pagination, PaginationItem, ProgressBar, RadioButton, Select, Tag, TextArea, Title };
500
+ declare const Tabs: React$1.FC<TabsProps>;
501
+
502
+ export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Icon, Image, Input, Menu, MenuItem, MenuList, Message, Modal, Notification, Pagination, PaginationItem, ProgressBar, RadioButton, Select, TabItem, Tabs, Tag, TextArea, Title };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "reactive-bulma",
3
- "version": "2.9.0",
3
+ "version": "2.10.0",
4
4
  "description": "A component library based on React, Bulma, Typescript and Rollup",
5
5
  "keywords": [
6
6
  "typescript",
@@ -52,41 +52,41 @@
52
52
  "update:doctor": "npm run lint && npm run test && npm run build"
53
53
  },
54
54
  "devDependencies": {
55
- "@babel/core": "^7.23.5",
56
- "@babel/preset-env": "^7.23.5",
55
+ "@babel/core": "^7.23.7",
56
+ "@babel/preset-env": "^7.23.8",
57
57
  "@babel/preset-react": "^7.23.3",
58
58
  "@babel/preset-typescript": "^7.23.3",
59
- "@mdi/font": "^7.3.67",
59
+ "@mdi/font": "^7.4.47",
60
60
  "@rollup/plugin-commonjs": "^25.0.7",
61
61
  "@rollup/plugin-node-resolve": "^15.2.3",
62
- "@rollup/plugin-typescript": "^11.1.5",
62
+ "@rollup/plugin-typescript": "^11.1.6",
63
63
  "@semantic-release/changelog": "^6.0.3",
64
64
  "@semantic-release/commit-analyzer": "^11.1.0",
65
65
  "@semantic-release/exec": "^6.0.3",
66
66
  "@semantic-release/git": "^10.0.1",
67
- "@semantic-release/github": "^9.2.5",
67
+ "@semantic-release/github": "^9.2.6",
68
68
  "@semantic-release/npm": "^11.0.2",
69
69
  "@semantic-release/release-notes-generator": "^12.1.0",
70
- "@storybook/addon-actions": "^7.6.4",
71
- "@storybook/addon-essentials": "^7.6.4",
72
- "@storybook/addon-interactions": "^7.6.4",
73
- "@storybook/addon-links": "^7.6.4",
74
- "@storybook/addon-mdx-gfm": "^7.6.4",
75
- "@storybook/cli": "^7.6.4",
76
- "@storybook/react": "^7.6.4",
77
- "@storybook/react-webpack5": "^7.6.4",
70
+ "@storybook/addon-actions": "^7.6.8",
71
+ "@storybook/addon-essentials": "^7.6.8",
72
+ "@storybook/addon-interactions": "^7.6.8",
73
+ "@storybook/addon-links": "^7.6.8",
74
+ "@storybook/addon-mdx-gfm": "^7.6.8",
75
+ "@storybook/cli": "^7.6.8",
76
+ "@storybook/react": "^7.6.8",
77
+ "@storybook/react-webpack5": "^7.6.8",
78
78
  "@storybook/testing-library": "^0.2.2",
79
- "@testing-library/jest-dom": "^6.1.5",
79
+ "@testing-library/jest-dom": "^6.2.0",
80
80
  "@testing-library/react": "^14.1.2",
81
- "@testing-library/user-event": "^14.5.1",
81
+ "@testing-library/user-event": "^14.5.2",
82
82
  "@types/jest": "^29.5.11",
83
- "@types/react": "^18.2.43",
84
- "@typescript-eslint/eslint-plugin": "^6.13.2",
85
- "@typescript-eslint/parser": "^6.13.2",
83
+ "@types/react": "^18.2.48",
84
+ "@typescript-eslint/eslint-plugin": "^6.19.0",
85
+ "@typescript-eslint/parser": "^6.19.0",
86
86
  "babel-jest": "^29.7.0",
87
87
  "babel-loader": "^9.1.3",
88
88
  "bulma": "^0.9.4",
89
- "eslint": "^8.55.0",
89
+ "eslint": "^8.56.0",
90
90
  "eslint-config-prettier": "^9.1.0",
91
91
  "eslint-plugin-react": "^7.33.2",
92
92
  "husky": "^8.0.3",
@@ -94,16 +94,16 @@
94
94
  "jest": "^29.7.0",
95
95
  "jest-environment-jsdom": "^29.7.0",
96
96
  "lint-staged": "^15.2.0",
97
- "npm-check-updates": "^16.14.11",
98
- "postcss": "^8.4.32",
99
- "prettier": "^3.1.0",
97
+ "npm-check-updates": "^16.14.12",
98
+ "postcss": "^8.4.33",
99
+ "prettier": "^3.2.2",
100
100
  "react": "^18.2.0",
101
101
  "react-dom": "^18.2.0",
102
- "rollup": "^4.7.0",
102
+ "rollup": "^4.9.5",
103
103
  "rollup-plugin-dts": "^6.1.0",
104
104
  "rollup-plugin-postcss": "^4.0.2",
105
- "semantic-release": "^22.0.10",
106
- "storybook": "^7.6.4",
105
+ "semantic-release": "^23.0.0",
106
+ "storybook": "^7.6.8",
107
107
  "tslib": "^2.6.2",
108
108
  "typescript": "^5.3.3"
109
109
  },