reactive-bulma 2.9.0 → 2.10.0
Sign up to get free protection for your applications and to get access to all the features.
- 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';
|