pallote-react 0.15.10 → 0.15.12

package/dist/index.js

@@ -1517,6 +1517,7 @@ const Button = /*#__PURE__*/React__default.forwardRef(({
   iconRight,
   className,
   children = 'button',
+  type = 'button',
   ...props
 }, ref) => {
   const Component = component || 'button';
@@ -1537,7 +1538,9 @@ const Button = /*#__PURE__*/React__default.forwardRef(({
     }, className]),
     ref: ref,
     disabled: Component === 'button' ? disabled : undefined
-  }, props), content);
+  }, Component === 'button' ? {
+    type
+  } : {}, props), content);
 });
 Button.displayName = 'Button';
 Button.propTypes = {
@@ -1551,6 +1554,7 @@ Button.propTypes = {
   iconLeft: PropTypes.node,
   iconRight: PropTypes.node,
   className: PropTypes.node,
+  type: PropTypes.oneOf(['button', 'submit', 'reset']),
   children: PropTypes.node.isRequired
 };
 
@@ -1717,12 +1721,14 @@ const Checkbox = ({
   checked,
   disabled,
   optional,
+  dense,
   className,
   ...props
 }) => {
   return /*#__PURE__*/React__default.createElement("div", {
     className: classnames(['checkbox', {
-      'checkbox-disabled': disabled
+      'checkbox-disabled': disabled,
+      'checkbox-dense': dense
     }, className])
   }, /*#__PURE__*/React__default.createElement("input", _extends({
     className: classnames('checkbox_control'),
@@ -1746,6 +1752,7 @@ Checkbox.propTypes = {
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
   optional: PropTypes.bool,
+  dense: PropTypes.bool,
   className: PropTypes.node
 };
 
@@ -1754,11 +1761,14 @@ const InputLabel = ({
   htmlFor,
   label = 'Input label',
   hint,
-  error
+  error,
+  hideLabel = false
 }) => {
   const LabelTag = isLegend ? 'legend' : 'label';
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, label && /*#__PURE__*/React__default.createElement(LabelTag, _extends({
-    className: 'input_label'
+    className: classnames('input_label', {
+      'sr-only': hideLabel
+    })
   }, !isLegend && {
     htmlFor
   }), label), hint && /*#__PURE__*/React__default.createElement("p", {
@@ -1778,7 +1788,8 @@ InputLabel.propTypes = {
   },
   label: PropTypes.string.isRequired,
   hint: PropTypes.string,
-  error: PropTypes.string
+  error: PropTypes.string,
+  hideLabel: PropTypes.bool
 };
 
 const Checkboxes = ({
@@ -1789,7 +1800,9 @@ const Checkboxes = ({
   error,
   disabled,
   optional,
+  dense,
   hint,
+  hideLabel,
   children,
   className
 }) => {
@@ -1797,21 +1810,23 @@ const Checkboxes = ({
     className: classnames(['input', {
       'js-error': error,
       'input-disabled': disabled,
-      'input-optional': optional
-    }, className]),
-    onChange: onChange
+      'input-optional': optional,
+      'input-dense': dense
+    }, className])
   }, hint || error ? {
     'aria-describedby': [hint ? `${id}-hint` : null, error ? `${id}-error` : null].filter(Boolean).join(' ')
   } : null), /*#__PURE__*/React__default.createElement(InputLabel, {
     isLegend: true,
     label: label,
     hint: hint,
-    error: error
+    error: error,
+    hideLabel: hideLabel
   }), /*#__PURE__*/React__default.createElement("div", {
     className: classnames(['input_control', 'radios', {
       [`radios-${direction}`]: direction
     }])
   }, React__default.Children.map(children, child => /*#__PURE__*/React__default.isValidElement(child) ? /*#__PURE__*/React__default.cloneElement(child, {
+    onChange,
     optional,
     disabled
   }) : child)));
@@ -1824,7 +1839,9 @@ Checkboxes.propTypes = {
   error: PropTypes.bool,
   disabled: PropTypes.bool,
   optional: PropTypes.bool,
+  dense: PropTypes.bool,
   hint: PropTypes.string,
+  hideLabel: PropTypes.bool,
   children: PropTypes.node.isRequired,
   className: PropTypes.node
 };
@@ -1931,7 +1948,9 @@ const Input = ({
   error,
   disabled,
   optional,
+  dense,
   hint,
+  hideLabel,
   className,
   ...props
 }) => {
@@ -1947,14 +1966,15 @@ const Input = ({
       'js-error': error,
       'input-disabled': disabled,
       'input-optional': optional,
+      'input-dense': dense,
       'input-withIcon': icon
-    }, className]),
-    onChange: onChange
+    }, className])
   }, /*#__PURE__*/React__default.createElement(InputLabel, {
     htmlFor: id,
     label: label,
     hint: hint,
-    error: error
+    error: error,
+    hideLabel: hideLabel
   }), customIcon && /*#__PURE__*/React__default.createElement("div", {
     className: 'input_icon'
   }, customIcon), /*#__PURE__*/React__default.createElement("input", _extends({
@@ -1965,7 +1985,8 @@ const Input = ({
     id: id,
     placeholder: placeholder,
     disabled: disabled,
-    required: !(disabled || optional)
+    required: !(disabled || optional),
+    onChange: onChange
   }, hint || error ? {
     'aria-describedby': [hint ? `${id}-hint` : null, error ? `${id}-error` : null].filter(Boolean).join(' ')
   } : null, props)));
@@ -1981,7 +2002,9 @@ Input.propTypes = {
   error: PropTypes.bool,
   disabled: PropTypes.bool,
   optional: PropTypes.bool,
+  dense: PropTypes.bool,
   hint: PropTypes.string,
+  hideLabel: PropTypes.bool,
   className: PropTypes.node
 };
 
@@ -2274,12 +2297,14 @@ const Radio = ({
   checked,
   disabled,
   optional,
+  dense,
   className,
   ...props
 }) => {
   return /*#__PURE__*/React__default.createElement("div", {
     className: classnames(['radio', {
-      'radio-disabled': disabled
+      'radio-disabled': disabled,
+      'radio-dense': dense
     }, className])
   }, /*#__PURE__*/React__default.createElement("input", _extends({
     className: classnames('radio_control'),
@@ -2304,6 +2329,7 @@ Radio.propTypes = {
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
   optional: PropTypes.bool,
+  dense: PropTypes.bool,
   className: PropTypes.node
 };
 
@@ -2315,7 +2341,9 @@ const RadioButtons = ({
   error,
   disabled,
   optional,
+  dense,
   hint,
+  hideLabel,
   children,
   className
 }) => {
@@ -2323,21 +2351,23 @@ const RadioButtons = ({
     className: classnames(['input', {
       'js-error': error,
       'input-disabled': disabled,
-      'input-optional': optional
-    }, className]),
-    onChange: onChange
+      'input-optional': optional,
+      'input-dense': dense
+    }, className])
   }, hint || error ? {
     'aria-describedby': [hint ? `${id}-hint` : null, error ? `${id}-error` : null].filter(Boolean).join(' ')
   } : null), /*#__PURE__*/React__default.createElement(InputLabel, {
     isLegend: true,
     label: label,
     hint: hint,
-    error: error
+    error: error,
+    hideLabel: hideLabel
   }), /*#__PURE__*/React__default.createElement("div", {
     className: classnames(['input_control', 'radios', {
       [`radios-${direction}`]: direction
     }])
   }, React__default.Children.map(children, child => /*#__PURE__*/React__default.isValidElement(child) ? /*#__PURE__*/React__default.cloneElement(child, {
+    onChange,
     optional,
     disabled
   }) : child)));
@@ -2350,7 +2380,9 @@ RadioButtons.propTypes = {
   error: PropTypes.bool,
   disabled: PropTypes.bool,
   optional: PropTypes.bool,
+  dense: PropTypes.bool,
   hint: PropTypes.string,
+  hideLabel: PropTypes.bool,
   children: PropTypes.node.isRequired,
   className: PropTypes.node
 };
@@ -2383,6 +2415,7 @@ const Select = ({
   optional,
   dense,
   hint,
+  hideLabel,
   children,
   className,
   ...props
@@ -2400,20 +2433,21 @@ const Select = ({
       'input-disabled': disabled,
       'input-optional': optional,
       'input-dense': dense
-    }, className]),
-    onChange: onChange
+    }, className])
   }, /*#__PURE__*/React__default.createElement(InputLabel, {
     htmlFor: id,
     label: label,
     hint: hint,
-    error: error
+    error: error,
+    hideLabel: hideLabel
   }), /*#__PURE__*/React__default.createElement("select", _extends({
     ref: inputRef,
     className: 'input_control',
     name: id,
     id: id,
     disabled: disabled,
-    required: !(disabled || optional)
+    required: !(disabled || optional),
+    onChange: onChange
   }, hint || error ? {
     'aria-describedby': [hint ? `${id}-hint` : null, error ? `${id}-error` : null].filter(Boolean).join(' ')
   } : null, props), children));
@@ -2428,6 +2462,7 @@ Select.propTypes = {
   optional: PropTypes.bool,
   dense: PropTypes.bool,
   hint: PropTypes.string,
+  hideLabel: PropTypes.bool,
   children: PropTypes.any.isRequired,
   className: PropTypes.node
 };
@@ -3023,7 +3058,9 @@ const Textarea = ({
   error,
   disabled,
   optional,
+  dense,
   hint,
+  hideLabel,
   className,
   ...props
 }) => {
@@ -3037,14 +3074,15 @@ const Textarea = ({
     className: classnames(['input', {
       'js-error': error,
       'input-disabled': disabled,
-      'input-optional': optional
-    }, className]),
-    onChange: onChange
+      'input-optional': optional,
+      'input-dense': dense
+    }, className])
   }, /*#__PURE__*/React__default.createElement(InputLabel, {
     htmlFor: id,
     label: label,
     hint: hint,
-    error: error
+    error: error,
+    hideLabel: hideLabel
   }), /*#__PURE__*/React__default.createElement("textarea", _extends({
     ref: inputRef,
     className: 'input_control',
@@ -3053,7 +3091,8 @@ const Textarea = ({
     placeholder: placeholder,
     disabled: disabled,
     required: !(disabled || optional),
-    rows: 4
+    rows: 4,
+    onChange: onChange
   }, hint || error ? {
     'aria-describedby': [hint ? `${id}-hint` : null, error ? `${id}-error` : null].filter(Boolean).join(' ')
   } : null, props)));
@@ -3067,7 +3106,9 @@ Textarea.propTypes = {
   error: PropTypes.bool,
   disabled: PropTypes.bool,
   optional: PropTypes.bool,
+  dense: PropTypes.bool,
   hint: PropTypes.string,
+  hideLabel: PropTypes.bool,
   className: PropTypes.node
 };
 

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pallote-react",
-  "version": "0.15.10",
+  "version": "0.15.12",
   "description": "",
   "main": "dist/index.js",
   "styles": "dist/index.css",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pallote-react",
-  "version": "0.15.10",
+  "version": "0.15.12",
   "description": "",
   "main": "dist/index.js",
   "styles": "dist/index.css",
@@ -23,7 +23,7 @@
     "classnames": "^2.5.1",
     "react-syntax-highlighter": "^15.6.1",
     "sass": "^1.71.1",
-    "pallote-css": "^0.9.10"
+    "pallote-css": "^0.9.11"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^3.2.4",