reactive-bulma 1.12.0 → 1.14.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { IconProps } from '../../../interfaces/atomProps';
3
+ declare const Icon: React.FC<IconProps>;
4
+ export default Icon;
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { TitleProps } from '../../../interfaces/atomProps';
3
+ declare const Title: React.FC<TitleProps>;
4
+ export default Title;
@@ -3,3 +3,6 @@ export { default as Column } from './Column';
3
3
  export { default as ProgressBar } from './ProgressBar';
4
4
  export { default as Block } from './Block';
5
5
  export { default as Tag } from './Tag';
6
+ export { default as Box } from './Box';
7
+ export { default as Title } from './Title';
8
+ export { default as Icon } from './Icon';
@@ -8,7 +8,7 @@ export declare const parseClasses: (_classes: Array<string | null>) => string;
8
8
  * @param { ParseTestIdProps } config Configuration object
9
9
  * @param { string } config.tag Required. Component tag used between to build the final testId string.
10
10
  * @param { string } config.parsedClasses Required. A single string of previously parsed classes what will be joined with `tag` property.
11
- * @param { string } config.separator Optional. `''` by default. Will replace final string empty spaces with a configurable string.
11
+ * @param { { usedRegExp?: RegExp, regExpReplacer?: string }[] } config.rules Optional. An array of objects used with a regular expression to check each case and a replacer for each one, giving oportunity to handle specific cases of component class names.
12
12
  * @returns A single string product of merge all classNames, separated by `separator` value
13
13
  */
14
14
  export declare const parseTestId: (config: ParseTestIdProps) => string;
@@ -1,2 +1,3 @@
1
1
  import '../node_modules/bulma/css/bulma.min.css';
2
+ import '../node_modules/@mdi/font/css/materialdesignicons.min.css';
2
3
  export * from './components/atoms';
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { basicColorType, columnOffsetType, columnSizeType, fixedImageSizeType, sizeType } from '../types/styleTypes';
2
+ import { basicColorType, columnOffsetType, columnSizeType, fixedImageSizeType, iconColorModeType, sizeType, textColorType, titleSize } from '../types/styleTypes';
3
3
  interface BasicProps {
4
4
  testId?: string;
5
5
  style?: React.CSSProperties;
@@ -53,4 +53,22 @@ export interface ImageProps extends BasicProps, React.ComponentPropsWithoutRef<'
53
53
  }
54
54
  export interface BoxProps extends BasicProps, React.ComponentPropsWithoutRef<'section'> {
55
55
  }
56
+ export interface TitleSectionProps extends BasicProps, React.ComponentPropsWithoutRef<'p'> {
57
+ text: string;
58
+ size?: titleSize;
59
+ prop: 'title' | 'subtitle';
60
+ isSpaced?: boolean;
61
+ }
62
+ export interface TitleProps {
63
+ main?: TitleSectionProps;
64
+ secondary?: TitleSectionProps;
65
+ }
66
+ export interface IconProps extends BasicProps {
67
+ iconLabel: string;
68
+ text?: string;
69
+ color?: textColorType;
70
+ size?: Exclude<sizeType, 'is-normal'>;
71
+ colorMode?: iconColorModeType;
72
+ isSpinning?: boolean;
73
+ }
56
74
  export {};
@@ -1,5 +1,11 @@
1
+ interface RegExpRule {
2
+ usedRegExp?: RegExp;
3
+ regExpReplacer?: string;
4
+ }
1
5
  export interface ParseTestIdProps {
2
6
  tag: string;
3
7
  parsedClasses: string;
8
+ rules?: RegExpRule[];
4
9
  separator?: string;
5
10
  }
11
+ export {};
@@ -0,0 +1,5 @@
1
+ export declare enum IconSizeEnum {
2
+ 'is-small' = 24,
3
+ 'is-medium' = 36,
4
+ 'is-large' = 48
5
+ }
@@ -1,5 +1,8 @@
1
1
  export type columnSizeType = 'is-three-quarters' | 'is-two-thirds' | 'is-half' | 'is-one-third' | 'is-one-quarter' | 'is-full' | 'is-four-fifths' | 'is-three-fifths' | 'is-two-fifths' | 'is-one-fifth' | 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6' | 'is-7' | 'is-8' | 'is-9' | 'is-10' | 'is-11' | 'is-12';
2
+ export type titleSize = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6';
2
3
  export type columnOffsetType = 'is-offset-1' | 'is-offset-2' | 'is-offset-3' | 'is-offset-4' | 'is-offset-5' | 'is-offset-6' | 'is-offset-7' | 'is-offset-8' | 'is-offset-9' | 'is-offset-10' | 'is-offset-11' | 'is-offset-12';
3
4
  export type basicColorType = 'is-white' | 'is-light' | 'is-dark' | 'is-black' | 'is-text' | 'is-ghost' | 'is-primary' | 'is-link' | 'is-info' | 'is-success' | 'is-warning' | 'is-danger';
5
+ export type textColorType = 'has-text-white' | 'has-text-black' | 'has-text-light' | 'has-text-dark' | 'has-text-primary' | 'has-text-link' | 'has-text-info' | 'has-text-success' | 'has-text-warning' | 'has-text-danger';
4
6
  export type fixedImageSizeType = 'is-16x16' | 'is-24x24' | 'is-32x32' | 'is-48x48' | 'is-64x64' | 'is-96x96' | 'is-128x128' | 'is-square' | 'is-1by1' | 'is-5by4' | 'is-4by3' | 'is-3by2' | 'is-5by3' | 'is-16by9' | 'is-2by1' | 'is-3by1' | 'is-4by5' | 'is-3by4' | 'is-2by3' | 'is-3by5' | 'is-9by16' | 'is-1by2' | 'is-1by3';
5
7
  export type sizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
8
+ export type iconColorModeType = 'light' | 'dark';
package/dist/index.d.ts CHANGED
@@ -1,9 +1,12 @@
1
1
  import React from 'react';
2
2
 
3
3
  type columnSizeType = 'is-three-quarters' | 'is-two-thirds' | 'is-half' | 'is-one-third' | 'is-one-quarter' | 'is-full' | 'is-four-fifths' | 'is-three-fifths' | 'is-two-fifths' | 'is-one-fifth' | 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6' | 'is-7' | 'is-8' | 'is-9' | 'is-10' | 'is-11' | 'is-12';
4
+ type titleSize = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6';
4
5
  type columnOffsetType = 'is-offset-1' | 'is-offset-2' | 'is-offset-3' | 'is-offset-4' | 'is-offset-5' | 'is-offset-6' | 'is-offset-7' | 'is-offset-8' | 'is-offset-9' | 'is-offset-10' | 'is-offset-11' | 'is-offset-12';
5
6
  type basicColorType = 'is-white' | 'is-light' | 'is-dark' | 'is-black' | 'is-text' | 'is-ghost' | 'is-primary' | 'is-link' | 'is-info' | 'is-success' | 'is-warning' | 'is-danger';
7
+ type textColorType = 'has-text-white' | 'has-text-black' | 'has-text-light' | 'has-text-dark' | 'has-text-primary' | 'has-text-link' | 'has-text-info' | 'has-text-success' | 'has-text-warning' | 'has-text-danger';
6
8
  type sizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
9
+ type iconColorModeType = 'light' | 'dark';
7
10
 
8
11
  interface BasicProps {
9
12
  testId?: string;
@@ -51,6 +54,26 @@ interface TagProps extends BasicProps, React.ComponentPropsWithoutRef<'span'> {
51
54
  addonColor?: basicColorType;
52
55
  onDeleteClick?: () => void;
53
56
  }
57
+ interface BoxProps extends BasicProps, React.ComponentPropsWithoutRef<'section'> {
58
+ }
59
+ interface TitleSectionProps extends BasicProps, React.ComponentPropsWithoutRef<'p'> {
60
+ text: string;
61
+ size?: titleSize;
62
+ prop: 'title' | 'subtitle';
63
+ isSpaced?: boolean;
64
+ }
65
+ interface TitleProps {
66
+ main?: TitleSectionProps;
67
+ secondary?: TitleSectionProps;
68
+ }
69
+ interface IconProps extends BasicProps {
70
+ iconLabel: string;
71
+ text?: string;
72
+ color?: textColorType;
73
+ size?: Exclude<sizeType, 'is-normal'>;
74
+ colorMode?: iconColorModeType;
75
+ isSpinning?: boolean;
76
+ }
54
77
 
55
78
  declare const Button: React.FC<ButtonProps>;
56
79
 
@@ -62,4 +85,10 @@ declare const Block: React.FC<BlockProps>;
62
85
 
63
86
  declare const Tag: React.FC<TagProps>;
64
87
 
65
- export { Block, Button, Column, ProgressBar, Tag };
88
+ declare const Box: React.FC<BoxProps>;
89
+
90
+ declare const Title: React.FC<TitleProps>;
91
+
92
+ declare const Icon: React.FC<IconProps>;
93
+
94
+ export { Block, Box, Button, Column, Icon, ProgressBar, Tag, Title };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "reactive-bulma",
3
- "version": "1.12.0",
3
+ "version": "1.14.0",
4
4
  "description": "A typescript-react-based component library based on bulma",
5
5
  "keywords": [
6
6
  "typescript",
@@ -48,6 +48,7 @@
48
48
  "@babel/preset-env": "^7.21.4",
49
49
  "@babel/preset-react": "^7.18.6",
50
50
  "@babel/preset-typescript": "^7.21.4",
51
+ "@mdi/font": "^7.2.96",
51
52
  "@rollup/plugin-commonjs": "^24.1.0",
52
53
  "@rollup/plugin-node-resolve": "^15.0.1",
53
54
  "@rollup/plugin-typescript": "^11.1.0",