reactive-bulma 1.14.0 → 1.16.0

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.
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { InputProps } from '../../../interfaces/atomProps';
3
+ declare const Input: React.FC<InputProps>;
4
+ export default Input;
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { TextAreaProps } from '../../../interfaces/atomProps';
3
+ declare const TextArea: React.FC<TextAreaProps>;
4
+ export default TextArea;
@@ -6,3 +6,5 @@ export { default as Tag } from './Tag';
6
6
  export { default as Box } from './Box';
7
7
  export { default as Title } from './Title';
8
8
  export { default as Icon } from './Icon';
9
+ export { default as Input } from './Input';
10
+ export { default as TextArea } from './TextArea';
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
- import { basicColorType, columnOffsetType, columnSizeType, fixedImageSizeType, iconColorModeType, sizeType, textColorType, titleSize } from '../types/styleTypes';
2
+ import { basicColorType, columnOffsetType, columnSizeType, fixedImageSizeType, iconColorModeType, basicSizeType, textColorType, titleSizeType } from '../types/styleTypes';
3
+ import { inputTypes } from '../types/domTypes';
3
4
  interface BasicProps {
4
5
  testId?: string;
5
6
  style?: React.CSSProperties;
@@ -20,7 +21,7 @@ export interface ButtonProps extends BasicProps, React.ComponentPropsWithoutRef<
20
21
  isLoading?: boolean;
21
22
  isDisabled?: boolean;
22
23
  isStatic?: boolean;
23
- size?: sizeType;
24
+ size?: basicSizeType;
24
25
  onClick?: () => void;
25
26
  }
26
27
  export interface ProgressBarProps extends BasicProps, React.ComponentPropsWithoutRef<'progress'> {
@@ -28,7 +29,7 @@ export interface ProgressBarProps extends BasicProps, React.ComponentPropsWithou
28
29
  max?: number;
29
30
  style?: React.CSSProperties;
30
31
  color?: basicColorType;
31
- size?: sizeType;
32
+ size?: basicSizeType;
32
33
  isLoading?: boolean;
33
34
  }
34
35
  export interface BlockProps extends BasicProps, React.ComponentPropsWithoutRef<'section'> {
@@ -39,7 +40,7 @@ export interface TagProps extends BasicProps, React.ComponentPropsWithoutRef<'sp
39
40
  color?: basicColorType;
40
41
  isLight?: boolean;
41
42
  isRounded?: boolean;
42
- size?: Exclude<sizeType, 'is-normal'>;
43
+ size?: Exclude<basicSizeType, 'is-normal'>;
43
44
  withDelete?: boolean;
44
45
  withAddon?: boolean;
45
46
  addonText?: string;
@@ -55,7 +56,7 @@ export interface BoxProps extends BasicProps, React.ComponentPropsWithoutRef<'se
55
56
  }
56
57
  export interface TitleSectionProps extends BasicProps, React.ComponentPropsWithoutRef<'p'> {
57
58
  text: string;
58
- size?: titleSize;
59
+ size?: titleSizeType;
59
60
  prop: 'title' | 'subtitle';
60
61
  isSpaced?: boolean;
61
62
  }
@@ -67,8 +68,26 @@ export interface IconProps extends BasicProps {
67
68
  iconLabel: string;
68
69
  text?: string;
69
70
  color?: textColorType;
70
- size?: Exclude<sizeType, 'is-normal'>;
71
+ size?: Exclude<basicSizeType, 'is-normal'>;
71
72
  colorMode?: iconColorModeType;
72
73
  isSpinning?: boolean;
73
74
  }
75
+ export interface InputProps extends BasicProps {
76
+ type: inputTypes;
77
+ text?: string;
78
+ isDisabled?: boolean;
79
+ isReadonly?: boolean;
80
+ color?: basicColorType;
81
+ size?: basicSizeType;
82
+ isRounded?: boolean;
83
+ isHovered?: boolean;
84
+ isFocused?: boolean;
85
+ onClick?: () => void;
86
+ onChange?: () => void;
87
+ }
88
+ export interface TextAreaProps extends Omit<InputProps, 'isRounded' | 'type'> {
89
+ cols?: number;
90
+ rows?: number;
91
+ isFixedSize?: boolean;
92
+ }
74
93
  export {};
@@ -1 +1,2 @@
1
1
  export type buttonType = 'submit' | 'reset' | 'button';
2
+ export type inputTypes = 'text' | 'password' | 'email' | 'tel';
@@ -1,8 +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
+ export type titleSizeType = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6';
3
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';
4
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
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';
6
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';
7
- export type sizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
7
+ export type basicSizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
8
8
  export type iconColorModeType = 'light' | 'dark';
package/dist/index.d.ts CHANGED
@@ -1,13 +1,15 @@
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
+ type titleSizeType = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6';
5
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';
6
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
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';
8
- type sizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
8
+ type basicSizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
9
9
  type iconColorModeType = 'light' | 'dark';
10
10
 
11
+ type inputTypes = 'text' | 'password' | 'email' | 'tel';
12
+
11
13
  interface BasicProps {
12
14
  testId?: string;
13
15
  style?: React.CSSProperties;
@@ -28,7 +30,7 @@ interface ButtonProps extends BasicProps, React.ComponentPropsWithoutRef<'button
28
30
  isLoading?: boolean;
29
31
  isDisabled?: boolean;
30
32
  isStatic?: boolean;
31
- size?: sizeType;
33
+ size?: basicSizeType;
32
34
  onClick?: () => void;
33
35
  }
34
36
  interface ProgressBarProps extends BasicProps, React.ComponentPropsWithoutRef<'progress'> {
@@ -36,7 +38,7 @@ interface ProgressBarProps extends BasicProps, React.ComponentPropsWithoutRef<'p
36
38
  max?: number;
37
39
  style?: React.CSSProperties;
38
40
  color?: basicColorType;
39
- size?: sizeType;
41
+ size?: basicSizeType;
40
42
  isLoading?: boolean;
41
43
  }
42
44
  interface BlockProps extends BasicProps, React.ComponentPropsWithoutRef<'section'> {
@@ -47,7 +49,7 @@ interface TagProps extends BasicProps, React.ComponentPropsWithoutRef<'span'> {
47
49
  color?: basicColorType;
48
50
  isLight?: boolean;
49
51
  isRounded?: boolean;
50
- size?: Exclude<sizeType, 'is-normal'>;
52
+ size?: Exclude<basicSizeType, 'is-normal'>;
51
53
  withDelete?: boolean;
52
54
  withAddon?: boolean;
53
55
  addonText?: string;
@@ -58,7 +60,7 @@ interface BoxProps extends BasicProps, React.ComponentPropsWithoutRef<'section'>
58
60
  }
59
61
  interface TitleSectionProps extends BasicProps, React.ComponentPropsWithoutRef<'p'> {
60
62
  text: string;
61
- size?: titleSize;
63
+ size?: titleSizeType;
62
64
  prop: 'title' | 'subtitle';
63
65
  isSpaced?: boolean;
64
66
  }
@@ -70,10 +72,28 @@ interface IconProps extends BasicProps {
70
72
  iconLabel: string;
71
73
  text?: string;
72
74
  color?: textColorType;
73
- size?: Exclude<sizeType, 'is-normal'>;
75
+ size?: Exclude<basicSizeType, 'is-normal'>;
74
76
  colorMode?: iconColorModeType;
75
77
  isSpinning?: boolean;
76
78
  }
79
+ interface InputProps extends BasicProps {
80
+ type: inputTypes;
81
+ text?: string;
82
+ isDisabled?: boolean;
83
+ isReadonly?: boolean;
84
+ color?: basicColorType;
85
+ size?: basicSizeType;
86
+ isRounded?: boolean;
87
+ isHovered?: boolean;
88
+ isFocused?: boolean;
89
+ onClick?: () => void;
90
+ onChange?: () => void;
91
+ }
92
+ interface TextAreaProps extends Omit<InputProps, 'isRounded' | 'type'> {
93
+ cols?: number;
94
+ rows?: number;
95
+ isFixedSize?: boolean;
96
+ }
77
97
 
78
98
  declare const Button: React.FC<ButtonProps>;
79
99
 
@@ -91,4 +111,8 @@ declare const Title: React.FC<TitleProps>;
91
111
 
92
112
  declare const Icon: React.FC<IconProps>;
93
113
 
94
- export { Block, Box, Button, Column, Icon, ProgressBar, Tag, Title };
114
+ declare const Input: React.FC<InputProps>;
115
+
116
+ declare const TextArea: React.FC<TextAreaProps>;
117
+
118
+ export { Block, Box, Button, Column, Icon, Input, ProgressBar, Tag, TextArea, Title };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "reactive-bulma",
3
- "version": "1.14.0",
3
+ "version": "1.16.0",
4
4
  "description": "A typescript-react-based component library based on bulma",
5
5
  "keywords": [
6
6
  "typescript",
@@ -31,7 +31,8 @@
31
31
  ],
32
32
  "types": "dist/index.d.ts",
33
33
  "scripts": {
34
- "start": "storybook dev",
34
+ "start": "storybook dev -p 6006",
35
+ "start:off": "npm start -- --no-open",
35
36
  "test": "jest --watchAll=false --verbose",
36
37
  "test:ci": "npm test -- --coverage",
37
38
  "lint": "eslint src/**/*.tsx",
@@ -44,40 +45,40 @@
44
45
  "semantic-release": "semantic-release"
45
46
  },
46
47
  "devDependencies": {
47
- "@babel/core": "^7.21.4",
48
- "@babel/preset-env": "^7.21.4",
49
- "@babel/preset-react": "^7.18.6",
50
- "@babel/preset-typescript": "^7.21.4",
48
+ "@babel/core": "^7.22.1",
49
+ "@babel/preset-env": "^7.22.2",
50
+ "@babel/preset-react": "^7.22.3",
51
+ "@babel/preset-typescript": "^7.21.5",
51
52
  "@mdi/font": "^7.2.96",
52
- "@rollup/plugin-commonjs": "^24.1.0",
53
- "@rollup/plugin-node-resolve": "^15.0.1",
54
- "@rollup/plugin-typescript": "^11.1.0",
55
- "@semantic-release/changelog": "^6.0.2",
53
+ "@rollup/plugin-commonjs": "^25.0.0",
54
+ "@rollup/plugin-node-resolve": "^15.0.2",
55
+ "@rollup/plugin-typescript": "^11.1.1",
56
+ "@semantic-release/changelog": "^6.0.3",
56
57
  "@semantic-release/commit-analyzer": "^9.0.2",
57
58
  "@semantic-release/exec": "^6.0.3",
58
59
  "@semantic-release/git": "^10.0.1",
59
- "@semantic-release/github": "^8.0.7",
60
+ "@semantic-release/github": "^8.0.8",
60
61
  "@semantic-release/npm": "^10.0.3",
61
62
  "@semantic-release/release-notes-generator": "^11.0.1",
62
- "@storybook/addon-actions": "^7.0.8",
63
- "@storybook/addon-essentials": "^7.0.8",
64
- "@storybook/addon-interactions": "^7.0.8",
65
- "@storybook/addon-links": "^7.0.8",
66
- "@storybook/addon-mdx-gfm": "^7.0.8",
67
- "@storybook/cli": "^7.0.8",
68
- "@storybook/react": "^7.0.8",
69
- "@storybook/react-webpack5": "^7.0.8",
63
+ "@storybook/addon-actions": "^7.0.18",
64
+ "@storybook/addon-essentials": "^7.0.18",
65
+ "@storybook/addon-interactions": "^7.0.18",
66
+ "@storybook/addon-links": "^7.0.18",
67
+ "@storybook/addon-mdx-gfm": "^7.0.18",
68
+ "@storybook/cli": "^7.0.18",
69
+ "@storybook/react": "^7.0.18",
70
+ "@storybook/react-webpack5": "^7.0.18",
70
71
  "@storybook/testing-library": "^0.1.0",
71
72
  "@testing-library/jest-dom": "^5.16.5",
72
73
  "@testing-library/react": "^14.0.0",
73
74
  "@types/jest": "^29.5.1",
74
- "@types/react": "^18.2.2",
75
- "@typescript-eslint/eslint-plugin": "^5.59.2",
76
- "@typescript-eslint/parser": "^5.59.2",
75
+ "@types/react": "^18.2.7",
76
+ "@typescript-eslint/eslint-plugin": "^5.59.7",
77
+ "@typescript-eslint/parser": "^5.59.7",
77
78
  "babel-jest": "^29.5.0",
78
79
  "babel-loader": "^9.1.2",
79
80
  "bulma": "^0.9.4",
80
- "eslint": "^8.39.0",
81
+ "eslint": "^8.41.0",
81
82
  "eslint-config-prettier": "^8.8.0",
82
83
  "eslint-plugin-react": "^7.32.2",
83
84
  "husky": "^8.0.3",
@@ -88,12 +89,12 @@
88
89
  "prettier": "^2.8.8",
89
90
  "react": "^18.2.0",
90
91
  "react-dom": "^18.2.0",
91
- "rollup": "^3.21.4",
92
+ "rollup": "^3.23.0",
92
93
  "rollup-plugin-dts": "^5.3.0",
93
94
  "rollup-plugin-postcss": "^4.0.2",
94
95
  "semantic-release": "^21.0.2",
95
- "storybook": "^7.0.8",
96
- "tslib": "^2.5.0",
96
+ "storybook": "^7.0.18",
97
+ "tslib": "^2.5.2",
97
98
  "typescript": "^5.0.4"
98
99
  },
99
100
  "lint-staged": {