reactive-bulma 1.18.0 → 1.19.0

package/dist/cjs/types/components/atoms/File/index.d.ts

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

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

@@ -10,3 +10,4 @@ export { default as Input } from './Input';
 export { default as TextArea } from './TextArea';
 export { default as Delete } from './Delete';
 export { default as Select } from './Select';
+export { default as File } from './File';

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

@@ -110,4 +110,15 @@ export interface SelectProps extends BasicProps {
     isFocused?: boolean;
     onClick?: () => void;
 }
+export interface FileProps extends BasicProps {
+    fileName?: string;
+    uploadIcon?: IconProps;
+    uploadText?: string;
+    buttonOnRight?: boolean;
+    isFullWidth?: boolean;
+    isBoxed?: boolean;
+    color?: basicColorType;
+    size?: basicSizeType;
+    onClick?: () => void;
+}
 export {};

package/dist/esm/index.js

@@ -3063,5 +3063,39 @@ const Select = ({ testId = null, showOptions = 1, options = [], isMultiple = fal
         React.createElement("select", { multiple: isMultiple, size: showOptions, "data-testid": selectTestId }, options.map(({ id, name, selected }, i) => (React.createElement("option", { "data-testid": `${selectTestId}-option-${i}`, key: id.toString(), selected: selected !== null && selected !== void 0 ? selected : false, onClick: onClick !== null && onClick !== void 0 ? onClick : undefined }, name))))));
 };
 
-export { Block, Box, Button, Column, Delete, Icon, Input, ProgressBar, Select, Tag, TextArea, Title };
+const File = ({ testId = null, fileName = null, uploadIcon = { iconLabel: 'upload' }, uploadText = 'Choose a file…', style = null, buttonOnRight = false, isFullWidth = false, isBoxed = false, color = null, size = null, onClick = null }) => {
+    const fileClasses = parseClasses([
+        'file',
+        fileName ? 'has-name' : null,
+        buttonOnRight ? 'is-right' : null,
+        isFullWidth ? 'is-fullwidth' : null,
+        isBoxed ? 'is-boxed' : null,
+        color,
+        size
+    ]);
+    const fileTestId = testId !== null && testId !== void 0 ? testId : parseTestId({
+        tag: 'file',
+        parsedClasses: fileClasses,
+        rules: [
+            {
+                usedRegExp: /has/gm,
+                regExpReplacer: '-has'
+            },
+            {
+                usedRegExp: /is|file/gm,
+                regExpReplacer: ''
+            }
+        ]
+    });
+    const fileInputTestId = `${fileTestId}-input`;
+    return (React.createElement("section", { "data-testid": fileTestId, className: fileClasses, style: style !== null && style !== void 0 ? style : undefined },
+        React.createElement("label", { className: 'file-label' },
+            React.createElement("input", { "data-testid": fileInputTestId, className: 'file-input', type: 'file', name: 'resume', onClick: onClick !== null && onClick !== void 0 ? onClick : undefined }),
+            React.createElement("span", { className: 'file-cta' },
+                uploadIcon ? React.createElement(Icon, Object.assign({}, uploadIcon)) : null,
+                React.createElement("span", { className: 'file-label' }, uploadText)),
+            fileName ? React.createElement("span", { className: 'file-name' }, fileName) : null)));
+};
+
+export { Block, Box, Button, Column, Delete, File, Icon, Input, ProgressBar, Select, Tag, TextArea, Title };
 //# sourceMappingURL=index.js.map