reactive-bulma 1.5.0 → 1.7.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (29) hide show
  1. package/README.md +24 -5
  2. package/dist/cjs/index.js +27 -1
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/cjs/types/components/{Button/Button.d.ts → atoms/Button/index.d.ts} +1 -3
  5. package/dist/cjs/types/components/atoms/Column/index.d.ts +4 -0
  6. package/dist/cjs/types/components/atoms/index.d.ts +2 -0
  7. package/dist/cjs/types/functions/persers.d.ts +1 -0
  8. package/dist/cjs/types/functions/tests/parsers.test.d.ts +1 -0
  9. package/dist/cjs/types/index.d.ts +2 -1
  10. package/dist/cjs/types/interfaces/atomProps.d.ts +21 -0
  11. package/dist/cjs/types/types/domTypes.d.ts +1 -0
  12. package/dist/cjs/types/types/styleTypes.d.ts +4 -0
  13. package/dist/esm/index.js +27 -2
  14. package/dist/esm/index.js.map +1 -1
  15. package/dist/esm/types/components/{Button/Button.d.ts → atoms/Button/index.d.ts} +1 -3
  16. package/dist/esm/types/components/atoms/Column/index.d.ts +4 -0
  17. package/dist/esm/types/components/atoms/index.d.ts +2 -0
  18. package/dist/esm/types/functions/persers.d.ts +1 -0
  19. package/dist/esm/types/functions/tests/parsers.test.d.ts +1 -0
  20. package/dist/esm/types/index.d.ts +2 -1
  21. package/dist/esm/types/interfaces/atomProps.d.ts +21 -0
  22. package/dist/esm/types/types/domTypes.d.ts +1 -0
  23. package/dist/esm/types/types/styleTypes.d.ts +4 -0
  24. package/dist/index.d.ts +29 -4
  25. package/package.json +4 -3
  26. package/dist/cjs/types/components/Button/index.d.ts +0 -1
  27. package/dist/cjs/types/components/index.d.ts +0 -2
  28. package/dist/esm/types/components/Button/index.d.ts +0 -1
  29. package/dist/esm/types/components/index.d.ts +0 -2
@@ -1,6 +1,4 @@
1
1
  import React from 'react';
2
- interface ButtonProps {
3
- text?: string;
4
- }
2
+ import { ButtonProps } from '../../../interfaces/atomProps';
5
3
  declare const Button: React.FC<ButtonProps>;
6
4
  export default Button;
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { ColumnProps } from '../../../interfaces/atomProps';
3
+ declare const Column: React.FC<ColumnProps>;
4
+ export default Column;
@@ -0,0 +1,2 @@
1
+ export { default as Button } from './Button';
2
+ export { default as Column } from './Column';
@@ -0,0 +1 @@
1
+ export declare const parseClasses: (_classes: Array<string | null>) => string;
@@ -0,0 +1 @@
1
+ export {};
@@ -1 +1,2 @@
1
- export * from './components';
1
+ import '../node_modules/bulma/css/bulma.min.css';
2
+ export * from './components/atoms';
@@ -0,0 +1,21 @@
1
+ /// <reference types="react" />
2
+ import { basicColorType, columnOffsetType, columnSizeType, sizeType } from '../types/styleTypes';
3
+ export interface ButtonProps extends React.ComponentPropsWithoutRef<'button'> {
4
+ text?: string;
5
+ style?: React.CSSProperties;
6
+ color?: basicColorType;
7
+ isLightColor?: boolean;
8
+ isInvertedColor?: boolean;
9
+ isOutlined?: boolean;
10
+ isRounded?: boolean;
11
+ isLoading?: boolean;
12
+ isDisabled?: boolean;
13
+ isStatic?: boolean;
14
+ size?: sizeType;
15
+ onClick?: () => void;
16
+ }
17
+ export interface ColumnProps extends React.ComponentPropsWithoutRef<'section'> {
18
+ size?: columnSizeType;
19
+ offset?: columnOffsetType;
20
+ isNarrow?: boolean;
21
+ }
@@ -0,0 +1 @@
1
+ export type buttonType = 'submit' | 'reset' | 'button';
@@ -0,0 +1,4 @@
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 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
+ 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';
4
+ export type sizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
package/dist/esm/index.js CHANGED
@@ -2838,7 +2838,32 @@ function requireReact_development () {
2838
2838
 
2839
2839
  var React = /*@__PURE__*/getDefaultExportFromCjs(reactExports);
2840
2840
 
2841
- const Button = ({ text = '' }) => (React.createElement("button", { className: 'button' }, text));
2841
+ const parseClasses = (_classes) => _classes.filter(_class => _class).join(' ');
2842
+
2843
+ const Button = ({ text = null, type = 'button', style = null, color = 'is-white', isLightColor = false, isInvertedColor = false, isOutlined = false, isRounded = false, isLoading = false, isDisabled = false, isStatic = false, size = null, onClick = null }) => {
2844
+ const buttonClasses = parseClasses([
2845
+ 'button',
2846
+ color,
2847
+ isLightColor ? 'is-light' : null,
2848
+ isInvertedColor ? 'is-inverted' : null,
2849
+ isOutlined ? 'is-outlined' : null,
2850
+ isRounded ? 'is-rounded' : null,
2851
+ isLoading ? 'is-loading' : null,
2852
+ isStatic ? 'is-static' : null,
2853
+ size
2854
+ ]);
2855
+ return (React.createElement("button", { "data-testid": 'test-button', type: type, className: buttonClasses, style: style !== null && style !== void 0 ? style : undefined, disabled: isDisabled !== null && isDisabled !== void 0 ? isDisabled : false, onClick: onClick !== null && onClick !== void 0 ? onClick : undefined }, text));
2856
+ };
2857
+
2858
+ const Column = ({ size = null, offset = null, isNarrow = false, children = null }) => {
2859
+ const classes = parseClasses([
2860
+ 'column',
2861
+ size,
2862
+ offset,
2863
+ isNarrow ? 'is-narrow' : null
2864
+ ]);
2865
+ return (React.createElement("section", { "data-testid": 'test-column', className: classes }, children));
2866
+ };
2842
2867
 
2843
- export { Button };
2868
+ export { Button, Column };
2844
2869
  //# sourceMappingURL=index.js.map