@allxsmith/bestax-bulma 1.0.4 → 1.0.6
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/README.md +11 -4
- package/dist/index.cjs.js +357 -2154
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +357 -2154
- package/dist/index.esm.js.map +1 -1
- package/dist/types/columns/Column.d.ts +0 -43
- package/dist/types/columns/Columns.d.ts +0 -32
- package/dist/types/components/Breadcrumb.d.ts +0 -28
- package/dist/types/components/Card.d.ts +0 -24
- package/dist/types/components/Dropdown.d.ts +0 -42
- package/dist/types/components/Menu.d.ts +0 -48
- package/dist/types/components/Message.d.ts +0 -21
- package/dist/types/components/Modal.d.ts +0 -21
- package/dist/types/components/Navbar.d.ts +0 -146
- package/dist/types/components/Pagination.d.ts +0 -68
- package/dist/types/components/Panel.d.ts +0 -81
- package/dist/types/components/Tab.d.ts +0 -49
- package/dist/types/components/Tabs.d.ts +0 -49
- package/dist/types/elements/Block.d.ts +0 -20
- package/dist/types/elements/Box.d.ts +1 -23
- package/dist/types/elements/Button.d.ts +0 -36
- package/dist/types/elements/Buttons.d.ts +0 -22
- package/dist/types/elements/Content.d.ts +0 -21
- package/dist/types/elements/Delete.d.ts +0 -22
- package/dist/types/elements/Icon.d.ts +0 -24
- package/dist/types/elements/IconText.d.ts +0 -27
- package/dist/types/elements/Image.d.ts +0 -27
- package/dist/types/elements/Notification.d.ts +0 -20
- package/dist/types/elements/Progress.d.ts +0 -20
- package/dist/types/elements/SubTitle.d.ts +0 -24
- package/dist/types/elements/Table.d.ts +0 -25
- package/dist/types/elements/Tag.d.ts +0 -28
- package/dist/types/elements/Tags.d.ts +0 -18
- package/dist/types/elements/Tbody.d.ts +0 -19
- package/dist/types/elements/Td.d.ts +0 -23
- package/dist/types/elements/Tfoot.d.ts +0 -19
- package/dist/types/elements/Th.d.ts +0 -25
- package/dist/types/elements/Thead.d.ts +0 -19
- package/dist/types/elements/Title.d.ts +0 -25
- package/dist/types/elements/Tr.d.ts +0 -21
- package/dist/types/form/Checkbox.d.ts +0 -16
- package/dist/types/form/Checkboxes.d.ts +0 -15
- package/dist/types/form/Control.d.ts +0 -30
- package/dist/types/form/Field.d.ts +0 -57
- package/dist/types/form/File.d.ts +0 -26
- package/dist/types/form/Input.d.ts +0 -22
- package/dist/types/form/Radio.d.ts +0 -16
- package/dist/types/form/Radios.d.ts +0 -15
- package/dist/types/form/Select.d.ts +0 -22
- package/dist/types/form/TextArea.d.ts +0 -25
- package/dist/types/grid/Cell.d.ts +0 -26
- package/dist/types/grid/Grid.d.ts +0 -40
- package/dist/types/helpers/classNames.d.ts +0 -14
- package/dist/types/helpers/useBulmaClasses.d.ts +0 -130
- package/dist/types/layout/Container.d.ts +0 -26
- package/dist/types/layout/Footer.d.ts +0 -19
- package/dist/types/layout/Hero.d.ts +0 -57
- package/dist/types/layout/Level.d.ts +0 -59
- package/dist/types/layout/Media.d.ts +0 -55
- package/dist/types/layout/Section.d.ts +0 -21
- package/package.json +3 -3
|
@@ -1,20 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the Field component.
|
|
5
|
-
*
|
|
6
|
-
* @property {boolean} [horizontal] - Renders the field as horizontal (label and control side by side).
|
|
7
|
-
* @property {boolean|'centered'|'right'|'multiline'} [grouped] - Group controls in a row (optionally centered, right, or multiline).
|
|
8
|
-
* @property {boolean} [hasAddons] - Group controls as addons.
|
|
9
|
-
* @property {React.ReactNode} [label] - Field label.
|
|
10
|
-
* @property {'small'|'normal'|'medium'|'large'} [labelSize] - Size for the label.
|
|
11
|
-
* @property {object} [labelProps] - Props for the label element.
|
|
12
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color for the field.
|
|
13
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color for the field.
|
|
14
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color for the field.
|
|
15
|
-
* @property {string} [className] - Additional CSS classes.
|
|
16
|
-
* @property {React.ReactNode} [children] - Field content.
|
|
17
|
-
*/
|
|
18
3
|
export interface FieldProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
|
|
19
4
|
horizontal?: boolean;
|
|
20
5
|
grouped?: boolean | 'centered' | 'right' | 'multiline';
|
|
@@ -30,16 +15,6 @@ export interface FieldProps extends React.HTMLAttributes<HTMLDivElement>, Omit<B
|
|
|
30
15
|
className?: string;
|
|
31
16
|
children?: React.ReactNode;
|
|
32
17
|
}
|
|
33
|
-
/**
|
|
34
|
-
* Props for the FieldLabel component.
|
|
35
|
-
*
|
|
36
|
-
* @property {'small'|'normal'|'medium'|'large'} [size] - Size for the field label.
|
|
37
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color for the label.
|
|
38
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color for the label.
|
|
39
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color for the label.
|
|
40
|
-
* @property {string} [className] - Additional CSS classes.
|
|
41
|
-
* @property {React.ReactNode} [children] - Field label content.
|
|
42
|
-
*/
|
|
43
18
|
export interface FieldLabelProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
|
|
44
19
|
size?: 'small' | 'normal' | 'medium' | 'large';
|
|
45
20
|
textColor?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
@@ -48,15 +23,6 @@ export interface FieldLabelProps extends React.HTMLAttributes<HTMLDivElement>, O
|
|
|
48
23
|
className?: string;
|
|
49
24
|
children?: React.ReactNode;
|
|
50
25
|
}
|
|
51
|
-
/**
|
|
52
|
-
* Props for the FieldBody component.
|
|
53
|
-
*
|
|
54
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color for the field body.
|
|
55
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color for the field body.
|
|
56
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color for the field body.
|
|
57
|
-
* @property {string} [className] - Additional CSS classes.
|
|
58
|
-
* @property {React.ReactNode} [children] - Field body content.
|
|
59
|
-
*/
|
|
60
26
|
export interface FieldBodyProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
|
|
61
27
|
textColor?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
62
28
|
color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';
|
|
@@ -64,31 +30,8 @@ export interface FieldBodyProps extends React.HTMLAttributes<HTMLDivElement>, Om
|
|
|
64
30
|
className?: string;
|
|
65
31
|
children?: React.ReactNode;
|
|
66
32
|
}
|
|
67
|
-
/**
|
|
68
|
-
* FieldLabel component for rendering a Bulma field label.
|
|
69
|
-
*
|
|
70
|
-
* @function
|
|
71
|
-
* @param {FieldLabelProps} props - Props for the FieldLabel component.
|
|
72
|
-
* @returns {JSX.Element} The rendered field label.
|
|
73
|
-
*/
|
|
74
33
|
declare const FieldLabel: React.FC<FieldLabelProps>;
|
|
75
|
-
/**
|
|
76
|
-
* FieldBody component for rendering Bulma field body.
|
|
77
|
-
*
|
|
78
|
-
* @function
|
|
79
|
-
* @param {FieldBodyProps} props - Props for the FieldBody component.
|
|
80
|
-
* @returns {JSX.Element} The rendered field body.
|
|
81
|
-
*/
|
|
82
34
|
declare const FieldBody: React.FC<FieldBodyProps>;
|
|
83
|
-
/**
|
|
84
|
-
* Field component for rendering a Bulma field container.
|
|
85
|
-
* Supports horizontal, grouped, and labelled fields.
|
|
86
|
-
*
|
|
87
|
-
* @function
|
|
88
|
-
* @param {FieldProps} props - Props for the Field component.
|
|
89
|
-
* @returns {JSX.Element} The rendered field container.
|
|
90
|
-
* @see {@link https://bulma.io/documentation/form/general/#field | Bulma Field documentation}
|
|
91
|
-
*/
|
|
92
35
|
declare const Field: React.FC<FieldProps> & {
|
|
93
36
|
Label: typeof FieldLabel;
|
|
94
37
|
Body: typeof FieldBody;
|
|
@@ -1,22 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the File component.
|
|
5
|
-
*
|
|
6
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'|'black'|'dark'|'light'|'white'} [color] - Bulma color modifier for the file input.
|
|
7
|
-
* @property {'small'|'medium'|'large'} [size] - Size modifier for the file input.
|
|
8
|
-
* @property {boolean} [isBoxed] - Whether the file input is boxed.
|
|
9
|
-
* @property {boolean} [isFullwidth] - Whether the file input expands to full width.
|
|
10
|
-
* @property {boolean} [isRight] - Align file input to the right.
|
|
11
|
-
* @property {boolean} [isCentered] - Center the file input.
|
|
12
|
-
* @property {boolean} [hasName] - Show a file name indicator.
|
|
13
|
-
* @property {React.ReactNode} [label] - Custom label text or node.
|
|
14
|
-
* @property {React.ReactNode} [iconLeft] - Left icon element.
|
|
15
|
-
* @property {React.ReactNode} [iconRight] - Right icon element.
|
|
16
|
-
* @property {string} [className] - Additional CSS classes to apply.
|
|
17
|
-
* @property {string} [inputClassName] - Additional CSS classes for the input.
|
|
18
|
-
* @property {string} [fileName] - File name to display.
|
|
19
|
-
*/
|
|
20
3
|
export interface FileProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'color' | 'type'>, Omit<BulmaClassesProps, 'color'> {
|
|
21
4
|
color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'black' | 'dark' | 'light' | 'white';
|
|
22
5
|
size?: 'small' | 'medium' | 'large';
|
|
@@ -32,14 +15,5 @@ export interface FileProps extends Omit<React.InputHTMLAttributes<HTMLInputEleme
|
|
|
32
15
|
inputClassName?: string;
|
|
33
16
|
fileName?: string;
|
|
34
17
|
}
|
|
35
|
-
/**
|
|
36
|
-
* Bulma File upload component with full Bulma helper class support.
|
|
37
|
-
* isRight and isCentered are mutually exclusive (Bulma spec).
|
|
38
|
-
*
|
|
39
|
-
* @function
|
|
40
|
-
* @param {FileProps} props - Props for the File component.
|
|
41
|
-
* @returns {JSX.Element} The rendered file upload field.
|
|
42
|
-
* @see {@link https://bulma.io/documentation/form/file/ | Bulma File documentation}
|
|
43
|
-
*/
|
|
44
18
|
declare const File: React.ForwardRefExoticComponent<FileProps & React.RefAttributes<HTMLInputElement>>;
|
|
45
19
|
export default File;
|
|
@@ -1,19 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the Input component.
|
|
5
|
-
*
|
|
6
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'|'black'|'dark'|'light'|'white'} [color] - Bulma color modifier for the input.
|
|
7
|
-
* @property {'small'|'medium'|'large'} [size] - Size modifier for the input.
|
|
8
|
-
* @property {boolean} [isRounded] - Renders the input with rounded corners.
|
|
9
|
-
* @property {boolean} [isStatic] - Renders the input as static text.
|
|
10
|
-
* @property {boolean} [isHovered] - Applies the hovered state.
|
|
11
|
-
* @property {boolean} [isFocused] - Applies the focused state.
|
|
12
|
-
* @property {boolean} [isLoading] - Shows loading indicator.
|
|
13
|
-
* @property {string} [className] - Additional CSS classes to apply.
|
|
14
|
-
* @property {boolean} [disabled] - Whether the input is disabled.
|
|
15
|
-
* @property {boolean} [readOnly] - Whether the input is read-only.
|
|
16
|
-
*/
|
|
17
3
|
export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, Omit<BulmaClassesProps, 'color'> {
|
|
18
4
|
color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'black' | 'dark' | 'light' | 'white';
|
|
19
5
|
size?: 'small' | 'medium' | 'large';
|
|
@@ -26,13 +12,5 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
|
|
|
26
12
|
disabled?: boolean;
|
|
27
13
|
readOnly?: boolean;
|
|
28
14
|
}
|
|
29
|
-
/**
|
|
30
|
-
* Bulma Input component with full Bulma helper class support.
|
|
31
|
-
*
|
|
32
|
-
* @function
|
|
33
|
-
* @param {InputProps} props - Props for the Input component.
|
|
34
|
-
* @returns {JSX.Element} The rendered input element.
|
|
35
|
-
* @see {@link https://bulma.io/documentation/form/input/ | Bulma Input documentation}
|
|
36
|
-
*/
|
|
37
15
|
declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
|
|
38
16
|
export default Input;
|
|
@@ -1,25 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the Radio component.
|
|
5
|
-
*
|
|
6
|
-
* @property {boolean} [disabled] - Whether the radio is disabled.
|
|
7
|
-
* @property {string} [className] - Additional CSS classes to apply.
|
|
8
|
-
* @property {React.ReactNode} [children] - The label/content for the radio.
|
|
9
|
-
* @see Bulma Radio documentation: https://bulma.io/documentation/form/radio/
|
|
10
|
-
*/
|
|
11
3
|
export interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'color'>, Omit<BulmaClassesProps, 'color'> {
|
|
12
4
|
disabled?: boolean;
|
|
13
5
|
className?: string;
|
|
14
6
|
children?: React.ReactNode;
|
|
15
7
|
}
|
|
16
|
-
/**
|
|
17
|
-
* Bulma Radio component with Bulma helper classes support.
|
|
18
|
-
* The label is provided via the children prop.
|
|
19
|
-
*
|
|
20
|
-
* @function
|
|
21
|
-
* @param {RadioProps} props - Props for the Radio component.
|
|
22
|
-
* @returns {JSX.Element} The rendered radio element.
|
|
23
|
-
*/
|
|
24
8
|
declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>;
|
|
25
9
|
export default Radio;
|
|
@@ -1,23 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the Radios component.
|
|
5
|
-
*
|
|
6
|
-
* @property {string} [className] - Additional CSS classes to apply.
|
|
7
|
-
* @property {React.ReactNode} children - Radio elements to render in the group.
|
|
8
|
-
*/
|
|
9
3
|
export interface RadiosProps extends Omit<BulmaClassesProps, 'color'> {
|
|
10
4
|
className?: string;
|
|
11
5
|
children: React.ReactNode;
|
|
12
6
|
}
|
|
13
|
-
/**
|
|
14
|
-
* Wraps Radio components inside a Bulma 'radios' wrapper.
|
|
15
|
-
* Leverages useBulmaClasses for consistency with other components.
|
|
16
|
-
*
|
|
17
|
-
* @function
|
|
18
|
-
* @param {RadiosProps} props - Props for the Radios component.
|
|
19
|
-
* @returns {JSX.Element} The rendered radios group.
|
|
20
|
-
* @see {@link https://bulma.io/documentation/form/radio/#grouped-radios | Bulma Radios documentation}
|
|
21
|
-
*/
|
|
22
7
|
declare const Radios: React.FC<RadiosProps>;
|
|
23
8
|
export default Radios;
|
|
@@ -1,19 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the Select component.
|
|
5
|
-
*
|
|
6
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'|'black'|'dark'|'light'|'white'} [color] - Bulma color modifier for the select.
|
|
7
|
-
* @property {'small'|'medium'|'large'} [size] - Size modifier for the select.
|
|
8
|
-
* @property {boolean} [isRounded] - Renders the select with rounded corners.
|
|
9
|
-
* @property {boolean} [isLoading] - Shows loading indicator.
|
|
10
|
-
* @property {boolean} [isActive] - Applies Bulma's is-active modifier.
|
|
11
|
-
* @property {string} [className] - Additional CSS classes to apply.
|
|
12
|
-
* @property {boolean} [disabled] - Whether the select is disabled.
|
|
13
|
-
* @property {boolean} [multiple] - Whether the select allows multiple values.
|
|
14
|
-
* @property {number} [multipleSize] - For multiple select: number of visible options.
|
|
15
|
-
* @property {React.ReactNode} [children] - Option elements.
|
|
16
|
-
*/
|
|
17
3
|
export interface SelectProps extends Omit<React.SelectHTMLAttributes<HTMLSelectElement>, 'size'>, Omit<BulmaClassesProps, 'color'> {
|
|
18
4
|
color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'black' | 'dark' | 'light' | 'white';
|
|
19
5
|
size?: 'small' | 'medium' | 'large';
|
|
@@ -26,13 +12,5 @@ export interface SelectProps extends Omit<React.SelectHTMLAttributes<HTMLSelectE
|
|
|
26
12
|
multipleSize?: number;
|
|
27
13
|
children?: React.ReactNode;
|
|
28
14
|
}
|
|
29
|
-
/**
|
|
30
|
-
* Bulma Select component with full Bulma helper class support.
|
|
31
|
-
*
|
|
32
|
-
* @function
|
|
33
|
-
* @param {SelectProps} props - Props for the Select component.
|
|
34
|
-
* @returns {JSX.Element} The rendered select element.
|
|
35
|
-
* @see {@link https://bulma.io/documentation/form/select/ | Bulma Select documentation}
|
|
36
|
-
*/
|
|
37
15
|
declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLSelectElement>>;
|
|
38
16
|
export default Select;
|
|
@@ -1,22 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the TextArea component.
|
|
5
|
-
*
|
|
6
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'|'black'|'dark'|'light'|'white'} [color] - Bulma color modifier for the textarea.
|
|
7
|
-
* @property {'small'|'medium'|'large'} [size] - Size modifier for the textarea.
|
|
8
|
-
* @property {boolean} [isRounded] - Renders the textarea with rounded corners.
|
|
9
|
-
* @property {boolean} [isStatic] - Renders the textarea as static text.
|
|
10
|
-
* @property {boolean} [isHovered] - Applies the hovered state.
|
|
11
|
-
* @property {boolean} [isFocused] - Applies the focused state.
|
|
12
|
-
* @property {boolean} [isLoading] - Shows loading indicator.
|
|
13
|
-
* @property {boolean} [isActive] - Applies Bulma's is-active modifier.
|
|
14
|
-
* @property {boolean} [hasFixedSize] - Applies Bulma's has-fixed-size modifier.
|
|
15
|
-
* @property {string} [className] - Additional CSS classes to apply.
|
|
16
|
-
* @property {boolean} [disabled] - Whether the textarea is disabled.
|
|
17
|
-
* @property {boolean} [readOnly] - Whether the textarea is read-only.
|
|
18
|
-
* @property {number} [rows] - Number of visible text lines.
|
|
19
|
-
*/
|
|
20
3
|
export interface TextAreaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'>, Omit<BulmaClassesProps, 'color'> {
|
|
21
4
|
color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger' | 'black' | 'dark' | 'light' | 'white';
|
|
22
5
|
size?: 'small' | 'medium' | 'large';
|
|
@@ -32,13 +15,5 @@ export interface TextAreaProps extends Omit<React.TextareaHTMLAttributes<HTMLTex
|
|
|
32
15
|
readOnly?: boolean;
|
|
33
16
|
rows?: number;
|
|
34
17
|
}
|
|
35
|
-
/**
|
|
36
|
-
* Bulma TextArea component with full Bulma helper class support.
|
|
37
|
-
*
|
|
38
|
-
* @function
|
|
39
|
-
* @param {TextAreaProps} props - Props for the TextArea component.
|
|
40
|
-
* @returns {JSX.Element} The rendered textarea element.
|
|
41
|
-
* @see {@link https://bulma.io/documentation/form/textarea/ | Bulma Textarea documentation}
|
|
42
|
-
*/
|
|
43
18
|
declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
44
19
|
export default TextArea;
|
|
@@ -1,24 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Type for grid cell span values.
|
|
5
|
-
*/
|
|
6
3
|
export type CellSpanValue = number;
|
|
7
|
-
/**
|
|
8
|
-
* Props for the Cell component.
|
|
9
|
-
*
|
|
10
|
-
* @property {number} [colStart] - Which column the cell starts at (Bulma: is-col-start-x).
|
|
11
|
-
* @property {number} [colFromEnd] - Which column the cell ends at, counting from the end (Bulma: is-col-from-end-x).
|
|
12
|
-
* @property {CellSpanValue} [colSpan] - How many columns the cell will span (Bulma: is-col-span-x).
|
|
13
|
-
* @property {number} [rowStart] - Which row the cell starts at (Bulma: is-row-start-x).
|
|
14
|
-
* @property {number} [rowFromEnd] - Which row the cell ends at, counting from the end (Bulma: is-row-from-end-x).
|
|
15
|
-
* @property {CellSpanValue} [rowSpan] - How many rows the cell will span (Bulma: is-row-span-x).
|
|
16
|
-
* @property {string} [className] - Additional CSS class names.
|
|
17
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color (Bulma color, 'inherit', or 'current').
|
|
18
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color modifier for the cell.
|
|
19
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color (Bulma color, 'inherit', or 'current').
|
|
20
|
-
* @property {React.ReactNode} [children] - Children to render inside the cell.
|
|
21
|
-
*/
|
|
22
4
|
export interface CellProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
|
|
23
5
|
colStart?: number;
|
|
24
6
|
colFromEnd?: number;
|
|
@@ -32,12 +14,4 @@ export interface CellProps extends React.HTMLAttributes<HTMLDivElement>, Omit<Bu
|
|
|
32
14
|
bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
33
15
|
children?: React.ReactNode;
|
|
34
16
|
}
|
|
35
|
-
/**
|
|
36
|
-
* Bulma Cell component for CSS Grid layouts.
|
|
37
|
-
*
|
|
38
|
-
* @function
|
|
39
|
-
* @param {CellProps} props - Props for the Cell component.
|
|
40
|
-
* @returns {JSX.Element} The rendered grid cell.
|
|
41
|
-
* @see {@link https://bulma.io/documentation/grid/ | Bulma Grid documentation}
|
|
42
|
-
*/
|
|
43
17
|
export declare const Cell: React.FC<CellProps>;
|
|
@@ -1,41 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Allowed gap values for Bulma grid.
|
|
5
|
-
*/
|
|
6
3
|
export type BulmaGapValue = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
|
|
7
|
-
/**
|
|
8
|
-
* Allowed minimum column values for Bulma grid.
|
|
9
|
-
*/
|
|
10
4
|
export type BulmaMinColValue = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32;
|
|
11
|
-
/**
|
|
12
|
-
* Allowed fixed grid columns for Bulma grid.
|
|
13
|
-
*/
|
|
14
5
|
export type BulmaFixedGridCols = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
|
15
|
-
/**
|
|
16
|
-
* Allowed fixed grid columns prop for Bulma grid.
|
|
17
|
-
*/
|
|
18
6
|
export type BulmaFixedGridColsProp = BulmaFixedGridCols | 'auto';
|
|
19
|
-
/**
|
|
20
|
-
* Props for the Grid component.
|
|
21
|
-
*
|
|
22
|
-
* @property {boolean} [isFixed] - Use a fixed grid layout (Bulma's .fixed-grid > .grid).
|
|
23
|
-
* @property {BulmaGapValue} [gap] - Main gap for grid (applies is-gap-X, 0-8).
|
|
24
|
-
* @property {BulmaGapValue} [columnGap] - Column gap for grid (applies is-column-gap-X, 0-8).
|
|
25
|
-
* @property {BulmaGapValue} [rowGap] - Row gap for grid (applies is-row-gap-X, 0-8).
|
|
26
|
-
* @property {BulmaMinColValue} [minCol] - Minimum column width for the grid (applies is-col-min-X, 1-32).
|
|
27
|
-
* @property {BulmaFixedGridColsProp} [fixedCols] - For fixed grid only: explicit column count (applies has-X-cols, 0-12), or 'auto' for has-auto-count.
|
|
28
|
-
* @property {BulmaFixedGridCols} [fixedColsMobile] - For fixed grid only: explicit column count for mobile.
|
|
29
|
-
* @property {BulmaFixedGridCols} [fixedColsTablet] - For fixed grid only: explicit column count for tablet.
|
|
30
|
-
* @property {BulmaFixedGridCols} [fixedColsDesktop] - For fixed grid only: explicit column count for desktop.
|
|
31
|
-
* @property {BulmaFixedGridCols} [fixedColsWidescreen] - For fixed grid only: explicit column count for widescreen.
|
|
32
|
-
* @property {BulmaFixedGridCols} [fixedColsFullhd] - For fixed grid only: explicit column count for fullhd.
|
|
33
|
-
* @property {string} [className] - Additional CSS class names.
|
|
34
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color (Bulma color, 'inherit', or 'current').
|
|
35
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color modifier for the grid.
|
|
36
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color (Bulma color, 'inherit', or 'current').
|
|
37
|
-
* @property {React.ReactNode} [children] - Children to render inside the grid.
|
|
38
|
-
*/
|
|
39
7
|
export interface GridProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
|
|
40
8
|
isFixed?: boolean;
|
|
41
9
|
gap?: BulmaGapValue;
|
|
@@ -54,12 +22,4 @@ export interface GridProps extends React.HTMLAttributes<HTMLDivElement>, Omit<Bu
|
|
|
54
22
|
bgColor?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
55
23
|
children?: React.ReactNode;
|
|
56
24
|
}
|
|
57
|
-
/**
|
|
58
|
-
* Bulma Grid component for CSS Grid layouts, supports both fixed and responsive grid modes.
|
|
59
|
-
*
|
|
60
|
-
* @function
|
|
61
|
-
* @param {GridProps} props - Props for the Grid component.
|
|
62
|
-
* @returns {JSX.Element} The rendered grid.
|
|
63
|
-
* @see {@link https://bulma.io/documentation/grid/ | Bulma Grid documentation}
|
|
64
|
-
*/
|
|
65
25
|
export declare const Grid: React.FC<GridProps>;
|
|
@@ -1,16 +1,2 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Returns a space-separated string of class names based on input arguments.
|
|
3
|
-
*
|
|
4
|
-
* Accepts any mix of strings, numbers, arrays, or objects. Falsy values are ignored.
|
|
5
|
-
* Array and object values are recursively flattened, and object keys are included
|
|
6
|
-
* if their value is truthy. Duplicate class names are removed.
|
|
7
|
-
*
|
|
8
|
-
* @param {...(string | number | undefined | null | false | Record<string, unknown> | unknown[])} args - Class values to join.
|
|
9
|
-
* @returns {string} A space-separated string of unique class names.
|
|
10
|
-
*
|
|
11
|
-
* @example
|
|
12
|
-
* classNames('foo', ['bar', { baz: true }], { qux: false, quux: true });
|
|
13
|
-
* // => 'foo bar baz quux'
|
|
14
|
-
*/
|
|
15
1
|
export declare function classNames(...args: (string | number | undefined | null | false | Record<string, unknown> | unknown[])[]): string;
|
|
16
2
|
export default classNames;
|
|
@@ -1,193 +1,63 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Valid Bulma color classes.
|
|
3
|
-
* @example 'primary', 'link', 'info'
|
|
4
|
-
*/
|
|
5
1
|
export declare const validColors: readonly ["primary", "link", "info", "success", "warning", "danger", "black", "black-bis", "black-ter", "grey-darker", "grey-dark", "grey", "grey-light", "grey-lighter", "white", "light", "dark"];
|
|
6
|
-
/**
|
|
7
|
-
* Valid Bulma color shade suffixes.
|
|
8
|
-
* @example '00', '05', 'invert'
|
|
9
|
-
*/
|
|
10
2
|
export declare const validColorShades: readonly ["00", "05", "10", "15", "20", "25", "30", "35", "40", "45", "50", "55", "60", "65", "70", "75", "80", "85", "90", "95", "invert"];
|
|
11
|
-
/**
|
|
12
|
-
* Valid Bulma size classes for margins and paddings.
|
|
13
|
-
* @example '0', '1', 'auto'
|
|
14
|
-
*/
|
|
15
3
|
export declare const validSizes: readonly ["0", "1", "2", "3", "4", "5", "6", "auto"];
|
|
16
|
-
/**
|
|
17
|
-
* Valid Bulma text size classes.
|
|
18
|
-
* @example '1', '2', '3'
|
|
19
|
-
*/
|
|
20
4
|
export declare const validTextSizes: readonly ["1", "2", "3", "4", "5", "6", "7"];
|
|
21
|
-
/**
|
|
22
|
-
* Valid Bulma text alignment classes.
|
|
23
|
-
* @example 'centered', 'left', 'right'
|
|
24
|
-
*/
|
|
25
5
|
export declare const validAlignments: readonly ["centered", "justified", "left", "right"];
|
|
26
|
-
/**
|
|
27
|
-
* Valid Bulma text transformation classes.
|
|
28
|
-
* @example 'capitalized', 'uppercase', 'italic'
|
|
29
|
-
*/
|
|
30
6
|
export declare const validTextTransforms: readonly ["capitalized", "lowercase", "uppercase", "italic"];
|
|
31
|
-
/**
|
|
32
|
-
* Valid Bulma text weight classes.
|
|
33
|
-
* @example 'light', 'normal', 'bold'
|
|
34
|
-
*/
|
|
35
7
|
export declare const validTextWeights: readonly ["light", "normal", "medium", "semibold", "bold"];
|
|
36
|
-
/**
|
|
37
|
-
* Valid Bulma font family classes.
|
|
38
|
-
* @example 'sans-serif', 'monospace', 'code'
|
|
39
|
-
*/
|
|
40
8
|
export declare const validFontFamilies: readonly ["sans-serif", "monospace", "primary", "secondary", "code"];
|
|
41
|
-
/**
|
|
42
|
-
* Valid Bulma display classes.
|
|
43
|
-
* @example 'block', 'flex', 'inline'
|
|
44
|
-
*/
|
|
45
9
|
export declare const validDisplays: readonly ["block", "flex", "inline", "inline-block", "inline-flex"];
|
|
46
|
-
/**
|
|
47
|
-
* Valid Bulma visibility classes.
|
|
48
|
-
* @example 'hidden', 'sr-only'
|
|
49
|
-
*/
|
|
50
10
|
export declare const validVisibilities: readonly ["hidden", "sr-only"];
|
|
51
|
-
/**
|
|
52
|
-
* Valid Bulma flex direction classes.
|
|
53
|
-
* @example 'row', 'column', 'row-reverse'
|
|
54
|
-
*/
|
|
55
11
|
export declare const validFlexDirections: readonly ["row", "row-reverse", "column", "column-reverse"];
|
|
56
|
-
/**
|
|
57
|
-
* Valid Bulma flex wrap classes.
|
|
58
|
-
* @example 'nowrap', 'wrap', 'wrap-reverse'
|
|
59
|
-
*/
|
|
60
12
|
export declare const validFlexWraps: readonly ["nowrap", "wrap", "wrap-reverse"];
|
|
61
|
-
/**
|
|
62
|
-
* Valid Bulma justify-content classes.
|
|
63
|
-
* @example 'flex-start', 'center', 'space-between'
|
|
64
|
-
*/
|
|
65
13
|
export declare const validJustifyContents: readonly ["flex-start", "flex-end", "center", "space-between", "space-around", "space-evenly", "start", "end", "left", "right"];
|
|
66
|
-
/**
|
|
67
|
-
* Valid Bulma align-content classes.
|
|
68
|
-
* @example 'flex-start', 'center', 'stretch'
|
|
69
|
-
*/
|
|
70
14
|
export declare const validAlignContents: readonly ["flex-start", "flex-end", "center", "space-between", "space-around", "space-evenly", "stretch"];
|
|
71
|
-
/**
|
|
72
|
-
* Valid Bulma align-items classes.
|
|
73
|
-
* @example 'stretch', 'flex-start', 'center'
|
|
74
|
-
*/
|
|
75
15
|
export declare const validAlignItems: readonly ["stretch", "flex-start", "flex-end", "center", "baseline", "start", "end"];
|
|
76
|
-
/**
|
|
77
|
-
* Valid Bulma align-self classes.
|
|
78
|
-
* @example 'auto', 'flex-start', 'center'
|
|
79
|
-
*/
|
|
80
16
|
export declare const validAlignSelfs: readonly ["auto", "flex-start", "flex-end", "center", "baseline", "stretch"];
|
|
81
|
-
/**
|
|
82
|
-
* Valid Bulma flex grow and shrink values.
|
|
83
|
-
* @example '0', '1'
|
|
84
|
-
*/
|
|
85
17
|
export declare const validFlexGrowShrink: readonly ["0", "1"];
|
|
86
|
-
/**
|
|
87
|
-
* Valid Bulma viewport classes for responsive design.
|
|
88
|
-
* @example 'mobile', 'tablet', 'desktop'
|
|
89
|
-
*/
|
|
90
18
|
export declare const validViewports: readonly ["mobile", "tablet", "desktop", "widescreen", "fullhd"];
|
|
91
|
-
/**
|
|
92
|
-
* Props for applying Bulma helper classes to components.
|
|
93
|
-
*/
|
|
94
19
|
export interface BulmaClassesProps {
|
|
95
|
-
/** Text color class (e.g., 'primary', 'info'). */
|
|
96
20
|
color?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
97
|
-
/** Background color class (e.g., 'primary', 'info'). */
|
|
98
21
|
backgroundColor?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
99
|
-
/** Color shade suffix (e.g., '00', 'invert'). */
|
|
100
22
|
colorShade?: (typeof validColorShades)[number];
|
|
101
|
-
/** Margin (e.g., '0', '1'). */
|
|
102
23
|
m?: (typeof validSizes)[number];
|
|
103
|
-
/** Margin top. */
|
|
104
24
|
mt?: (typeof validSizes)[number];
|
|
105
|
-
/** Margin right. */
|
|
106
25
|
mr?: (typeof validSizes)[number];
|
|
107
|
-
/** Margin bottom. */
|
|
108
26
|
mb?: (typeof validSizes)[number];
|
|
109
|
-
/** Margin left. */
|
|
110
27
|
ml?: (typeof validSizes)[number];
|
|
111
|
-
/** Margin horizontal (left and right). */
|
|
112
28
|
mx?: (typeof validSizes)[number];
|
|
113
|
-
/** Margin vertical (top and bottom). */
|
|
114
29
|
my?: (typeof validSizes)[number];
|
|
115
|
-
/** Padding (e.g., '0', '1'). */
|
|
116
30
|
p?: (typeof validSizes)[number];
|
|
117
|
-
/** Padding top. */
|
|
118
31
|
pt?: (typeof validSizes)[number];
|
|
119
|
-
/** Padding right. */
|
|
120
32
|
pr?: (typeof validSizes)[number];
|
|
121
|
-
/** Padding bottom. */
|
|
122
33
|
pb?: (typeof validSizes)[number];
|
|
123
|
-
/** Padding left. */
|
|
124
34
|
pl?: (typeof validSizes)[number];
|
|
125
|
-
/** Padding horizontal (left and right). */
|
|
126
35
|
px?: (typeof validSizes)[number];
|
|
127
|
-
/** Padding vertical (top and bottom). */
|
|
128
36
|
py?: (typeof validSizes)[number];
|
|
129
|
-
/** Text size (e.g., '1', '2'). */
|
|
130
37
|
textSize?: (typeof validTextSizes)[number];
|
|
131
|
-
/** Text alignment (e.g., 'centered', 'left'). */
|
|
132
38
|
textAlign?: (typeof validAlignments)[number];
|
|
133
|
-
/** Text transformation (e.g., 'uppercase', 'italic'). */
|
|
134
39
|
textTransform?: (typeof validTextTransforms)[number];
|
|
135
|
-
/** Text weight (e.g., 'light', 'bold'). */
|
|
136
40
|
textWeight?: (typeof validTextWeights)[number];
|
|
137
|
-
/** Font family (e.g., 'sans-serif', 'code'). */
|
|
138
41
|
fontFamily?: (typeof validFontFamilies)[number];
|
|
139
|
-
/** Display type (e.g., 'block', 'flex'). */
|
|
140
42
|
display?: (typeof validDisplays)[number];
|
|
141
|
-
/** Visibility (e.g., 'hidden', 'sr-only'). */
|
|
142
43
|
visibility?: (typeof validVisibilities)[number];
|
|
143
|
-
/** Flex direction (e.g., 'row', 'column'). */
|
|
144
44
|
flexDirection?: (typeof validFlexDirections)[number];
|
|
145
|
-
/** Flex wrap (e.g., 'wrap', 'nowrap'). */
|
|
146
45
|
flexWrap?: (typeof validFlexWraps)[number];
|
|
147
|
-
/** Justify content (e.g., 'center', 'space-between'). */
|
|
148
46
|
justifyContent?: (typeof validJustifyContents)[number];
|
|
149
|
-
/** Align content (e.g., 'center', 'stretch'). */
|
|
150
47
|
alignContent?: (typeof validAlignContents)[number];
|
|
151
|
-
/** Align items (e.g., 'center', 'flex-start'). */
|
|
152
48
|
alignItems?: (typeof validAlignItems)[number];
|
|
153
|
-
/** Align self (e.g., 'auto', 'center'). */
|
|
154
49
|
alignSelf?: (typeof validAlignSelfs)[number];
|
|
155
|
-
/** Flex grow value (e.g., '0', '1'). */
|
|
156
50
|
flexGrow?: (typeof validFlexGrowShrink)[number];
|
|
157
|
-
/** Flex shrink value (e.g., '0', '1'). */
|
|
158
51
|
flexShrink?: (typeof validFlexGrowShrink)[number];
|
|
159
|
-
/** Float direction (e.g., 'left', 'right'). */
|
|
160
52
|
float?: 'left' | 'right';
|
|
161
|
-
/** Overflow behavior (e.g., 'clipped'). */
|
|
162
53
|
overflow?: 'clipped';
|
|
163
|
-
/** Applies overlay styling if true. */
|
|
164
54
|
overlay?: boolean;
|
|
165
|
-
/** Interaction behavior (e.g., 'unselectable', 'clickable'). */
|
|
166
55
|
interaction?: 'unselectable' | 'clickable';
|
|
167
|
-
/** Border radius style (e.g., 'radiusless'). */
|
|
168
56
|
radius?: 'radiusless';
|
|
169
|
-
/** Shadow style (e.g., 'shadowless'). */
|
|
170
57
|
shadow?: 'shadowless';
|
|
171
|
-
/** Responsive behavior (e.g., 'mobile', 'narrow'). */
|
|
172
58
|
responsive?: 'mobile' | 'narrow';
|
|
173
|
-
/** Viewport for responsive classes (e.g., 'mobile', 'desktop'). */
|
|
174
59
|
viewport?: (typeof validViewports)[number];
|
|
175
60
|
}
|
|
176
|
-
/**
|
|
177
|
-
* A hook that generates Bulma helper classes from props and separates unhandled props.
|
|
178
|
-
*
|
|
179
|
-
* @function useBulmaClasses
|
|
180
|
-
* @param props - Combination of BulmaClassesProps and additional props.
|
|
181
|
-
* @returns An object containing the Bulma helper classes and unhandled props.
|
|
182
|
-
* @example
|
|
183
|
-
* const { bulmaHelperClasses, rest } = useBulmaClasses({
|
|
184
|
-
* color: 'primary',
|
|
185
|
-
* textSize: '3',
|
|
186
|
-
* className: 'custom-class'
|
|
187
|
-
* });
|
|
188
|
-
* // bulmaHelperClasses: 'has-text-primary is-size-3'
|
|
189
|
-
* // rest: { className: 'custom-class' }
|
|
190
|
-
*/
|
|
191
61
|
export declare const useBulmaClasses: <T extends Record<string, unknown>>(props: BulmaClassesProps & T) => {
|
|
192
62
|
bulmaHelperClasses: string;
|
|
193
63
|
rest: Omit<T, keyof BulmaClassesProps>;
|
|
@@ -1,23 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Bulma container breakpoints.
|
|
5
|
-
*/
|
|
6
3
|
export type ContainerBreakpoint = 'tablet' | 'desktop' | 'widescreen';
|
|
7
|
-
/**
|
|
8
|
-
* Props for the Container component.
|
|
9
|
-
*
|
|
10
|
-
* @property {string} [className] - Additional CSS classes.
|
|
11
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color.
|
|
12
|
-
* @property {'primary'|'link'|'info'|'success'|'warning'|'danger'} [color] - Bulma color modifier.
|
|
13
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
|
|
14
|
-
* @property {boolean} [fluid] - Full-width container.
|
|
15
|
-
* @property {boolean} [widescreen] - Container is widescreen.
|
|
16
|
-
* @property {boolean} [fullhd] - Container is fullhd.
|
|
17
|
-
* @property {ContainerBreakpoint} [breakpoint] - Responsive breakpoint.
|
|
18
|
-
* @property {boolean} [isMax] - Use is-max-* class for breakpoint.
|
|
19
|
-
* @property {React.ReactNode} [children] - Content inside the container.
|
|
20
|
-
*/
|
|
21
4
|
export interface ContainerProps extends React.HTMLAttributes<HTMLDivElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
|
|
22
5
|
className?: string;
|
|
23
6
|
textColor?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
@@ -30,14 +13,5 @@ export interface ContainerProps extends React.HTMLAttributes<HTMLDivElement>, Om
|
|
|
30
13
|
isMax?: boolean;
|
|
31
14
|
children?: React.ReactNode;
|
|
32
15
|
}
|
|
33
|
-
/**
|
|
34
|
-
* Container component for Bulma.
|
|
35
|
-
* Adds optional responsive, fluid, and color support, including is-max-* and breakpoint classes.
|
|
36
|
-
*
|
|
37
|
-
* @function
|
|
38
|
-
* @param {ContainerProps} props - Props for the Container component.
|
|
39
|
-
* @returns {JSX.Element} The rendered container.
|
|
40
|
-
* @see {@link https://bulma.io/documentation/layout/container/ | Bulma Container documentation}
|
|
41
|
-
*/
|
|
42
16
|
export declare const Container: React.FC<ContainerProps>;
|
|
43
17
|
export default Container;
|
|
@@ -1,15 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BulmaClassesProps, validColors } from '../helpers/useBulmaClasses';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the Footer component.
|
|
5
|
-
*
|
|
6
|
-
* @property {'footer'|'div'} [as] - The HTML tag to render as.
|
|
7
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [color] - Bulma color modifier.
|
|
8
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [bgColor] - Background color.
|
|
9
|
-
* @property {(typeof validColors)[number] | 'inherit' | 'current'} [textColor] - Text color.
|
|
10
|
-
* @property {string} [className] - Additional CSS classes.
|
|
11
|
-
* @property {React.ReactNode} [children] - Content inside the footer.
|
|
12
|
-
*/
|
|
13
3
|
export interface FooterProps extends React.HTMLAttributes<HTMLElement>, Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {
|
|
14
4
|
as?: 'footer' | 'div';
|
|
15
5
|
color?: (typeof validColors)[number] | 'inherit' | 'current';
|
|
@@ -18,14 +8,5 @@ export interface FooterProps extends React.HTMLAttributes<HTMLElement>, Omit<Bul
|
|
|
18
8
|
className?: string;
|
|
19
9
|
children?: React.ReactNode;
|
|
20
10
|
}
|
|
21
|
-
/**
|
|
22
|
-
* Bulma Footer component.
|
|
23
|
-
*
|
|
24
|
-
* @example
|
|
25
|
-
* <Footer>
|
|
26
|
-
* <div className="content has-text-centered">...</div>
|
|
27
|
-
* </Footer>
|
|
28
|
-
* @see {@link https://bulma.io/documentation/layout/footer/ | Bulma Footer documentation}
|
|
29
|
-
*/
|
|
30
11
|
declare const Footer: React.FC<FooterProps>;
|
|
31
12
|
export default Footer;
|