reactive-bulma 1.14.0 → 1.16.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 { 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": {