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';