reactive-bulma 1.13.0 → 1.14.0

package/dist/esm/types/components/atoms/Icon/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IconProps } from '../../../interfaces/atomProps';
+declare const Icon: React.FC<IconProps>;
+export default Icon;

package/dist/esm/types/components/atoms/index.d.ts

@@ -5,3 +5,4 @@ export { default as Block } from './Block';
 export { default as Tag } from './Tag';
 export { default as Box } from './Box';
 export { default as Title } from './Title';
+export { default as Icon } from './Icon';

package/dist/esm/types/functions/parsers.d.ts

@@ -8,7 +8,7 @@ export declare const parseClasses: (_classes: Array<string | null>) => string;
  * @param { ParseTestIdProps } config Configuration object
  * @param { string } config.tag Required. Component tag used between to build the final testId string.
  * @param { string } config.parsedClasses Required. A single string of previously parsed classes what will be joined with `tag` property.
- * @param { string } config.separator Optional. `''` by default. Will replace final string empty spaces with a configurable string.
+ * @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.
  * @returns A single string product of merge all classNames, separated by `separator` value
  */
 export declare const parseTestId: (config: ParseTestIdProps) => string;

package/dist/esm/types/index.d.ts

@@ -1,2 +1,3 @@
 import '../node_modules/bulma/css/bulma.min.css';
+import '../node_modules/@mdi/font/css/materialdesignicons.min.css';
 export * from './components/atoms';

package/dist/esm/types/interfaces/atomProps.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { basicColorType, columnOffsetType, columnSizeType, fixedImageSizeType, sizeType, titleSize } from '../types/styleTypes';
+import { basicColorType, columnOffsetType, columnSizeType, fixedImageSizeType, iconColorModeType, sizeType, textColorType, titleSize } from '../types/styleTypes';
 interface BasicProps {
     testId?: string;
     style?: React.CSSProperties;
@@ -63,4 +63,12 @@ export interface TitleProps {
     main?: TitleSectionProps;
     secondary?: TitleSectionProps;
 }
+export interface IconProps extends BasicProps {
+    iconLabel: string;
+    text?: string;
+    color?: textColorType;
+    size?: Exclude<sizeType, 'is-normal'>;
+    colorMode?: iconColorModeType;
+    isSpinning?: boolean;
+}
 export {};

package/dist/esm/types/interfaces/functionProps.d.ts

@@ -1,5 +1,11 @@
+interface RegExpRule {
+    usedRegExp?: RegExp;
+    regExpReplacer?: string;
+}
 export interface ParseTestIdProps {
     tag: string;
     parsedClasses: string;
+    rules?: RegExpRule[];
     separator?: string;
 }
+export {};

package/dist/esm/types/types/componentEnums.d.ts

@@ -0,0 +1,5 @@
+export declare enum IconSizeEnum {
+    'is-small' = 24,
+    'is-medium' = 36,
+    'is-large' = 48
+}

package/dist/esm/types/types/styleTypes.d.ts

@@ -2,5 +2,7 @@ export type columnSizeType = 'is-three-quarters' | 'is-two-thirds' | 'is-half' |
 export type titleSize = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6';
 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';
 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';
+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';
 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';
 export type sizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
+export type iconColorModeType = 'light' | 'dark';

package/dist/index.d.ts

@@ -4,7 +4,9 @@ type columnSizeType = 'is-three-quarters' | 'is-two-thirds' | 'is-half' | 'is-on
 type titleSize = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6';
 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';
 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';
+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';
 type sizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
+type iconColorModeType = 'light' | 'dark';
 
 interface BasicProps {
     testId?: string;
@@ -64,6 +66,14 @@ interface TitleProps {
     main?: TitleSectionProps;
     secondary?: TitleSectionProps;
 }
+interface IconProps extends BasicProps {
+    iconLabel: string;
+    text?: string;
+    color?: textColorType;
+    size?: Exclude<sizeType, 'is-normal'>;
+    colorMode?: iconColorModeType;
+    isSpinning?: boolean;
+}
 
 declare const Button: React.FC<ButtonProps>;
 
@@ -79,4 +89,6 @@ declare const Box: React.FC<BoxProps>;
 
 declare const Title: React.FC<TitleProps>;
 
-export { Block, Box, Button, Column, ProgressBar, Tag, Title };
+declare const Icon: React.FC<IconProps>;
+
+export { Block, Box, Button, Column, Icon, ProgressBar, Tag, Title };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reactive-bulma",
-  "version": "1.13.0",
+  "version": "1.14.0",
   "description": "A typescript-react-based component library based on bulma",
   "keywords": [
     "typescript",
@@ -48,6 +48,7 @@
     "@babel/preset-env": "^7.21.4",
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.21.4",
+    "@mdi/font": "^7.2.96",
     "@rollup/plugin-commonjs": "^24.1.0",
     "@rollup/plugin-node-resolve": "^15.0.1",
     "@rollup/plugin-typescript": "^11.1.0",