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.
- package/dist/cjs/index.js +35 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/atoms/TabItem/index.d.ts +4 -0
- package/dist/cjs/types/components/atoms/index.d.ts +1 -0
- package/dist/cjs/types/components/molecules/Tabs/index.d.ts +4 -0
- package/dist/cjs/types/components/molecules/index.d.ts +1 -0
- package/dist/cjs/types/functions/parsers.d.ts +7 -0
- package/dist/cjs/types/interfaces/atomProps.d.ts +8 -0
- package/dist/cjs/types/interfaces/commonProps.d.ts +3 -0
- package/dist/cjs/types/interfaces/moleculeProps.d.ts +16 -2
- package/dist/cjs/types/types/styleTypes.d.ts +1 -0
- package/dist/esm/index.js +34 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/atoms/TabItem/index.d.ts +4 -0
- package/dist/esm/types/components/atoms/index.d.ts +1 -0
- package/dist/esm/types/components/molecules/Tabs/index.d.ts +4 -0
- package/dist/esm/types/components/molecules/index.d.ts +1 -0
- package/dist/esm/types/functions/parsers.d.ts +7 -0
- package/dist/esm/types/interfaces/atomProps.d.ts +8 -0
- package/dist/esm/types/interfaces/commonProps.d.ts +3 -0
- package/dist/esm/types/interfaces/moleculeProps.d.ts +16 -2
- package/dist/esm/types/types/styleTypes.d.ts +1 -0
- package/dist/index.d.ts +28 -1
- package/package.json +26 -26
@@ -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';
|
@@ -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
|
+
}
|
@@ -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
|
-
|
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.
|
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.
|
56
|
-
"@babel/preset-env": "^7.23.
|
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.
|
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.
|
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.
|
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.
|
71
|
-
"@storybook/addon-essentials": "^7.6.
|
72
|
-
"@storybook/addon-interactions": "^7.6.
|
73
|
-
"@storybook/addon-links": "^7.6.
|
74
|
-
"@storybook/addon-mdx-gfm": "^7.6.
|
75
|
-
"@storybook/cli": "^7.6.
|
76
|
-
"@storybook/react": "^7.6.
|
77
|
-
"@storybook/react-webpack5": "^7.6.
|
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.
|
79
|
+
"@testing-library/jest-dom": "^6.2.0",
|
80
80
|
"@testing-library/react": "^14.1.2",
|
81
|
-
"@testing-library/user-event": "^14.5.
|
81
|
+
"@testing-library/user-event": "^14.5.2",
|
82
82
|
"@types/jest": "^29.5.11",
|
83
|
-
"@types/react": "^18.2.
|
84
|
-
"@typescript-eslint/eslint-plugin": "^6.
|
85
|
-
"@typescript-eslint/parser": "^6.
|
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.
|
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.
|
98
|
-
"postcss": "^8.4.
|
99
|
-
"prettier": "^3.
|
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.
|
102
|
+
"rollup": "^4.9.5",
|
103
103
|
"rollup-plugin-dts": "^6.1.0",
|
104
104
|
"rollup-plugin-postcss": "^4.0.2",
|
105
|
-
"semantic-release": "^
|
106
|
-
"storybook": "^7.6.
|
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
|
},
|