glints-aries 4.0.376 → 4.0.377

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.
@@ -1,7 +1,7 @@
1
- import React from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
  export interface RadioButtonProps extends Omit<React.HTMLAttributes<HTMLInputElement>, 'onChange'> {
3
- label?: string;
4
- helperText?: string;
3
+ label?: ReactNode;
4
+ helperText?: ReactNode;
5
5
  disabled?: boolean;
6
6
  name?: string;
7
7
  checked?: boolean;
@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
3
3
  var _excluded = ["label", "helperText", "disabled", "name", "checked", "value", "onChange"];
4
4
  import React from 'react';
5
- import { LabelWrapper, RadioButtonInput, RadioButtonWrapper } from './RadioButtonStyle';
6
- import { Typography } from '../Typography';
7
5
  import { Colors } from '..';
6
+ import { Typography } from '../Typography';
7
+ import { LabelWrapper, RadioButtonInput, RadioButtonWrapper } from './RadioButtonStyle';
8
8
  /**
9
9
  * This is a controlled component, so you need to pass in the `checked` and `onChange` prop to make it work.
10
10
  */
@@ -17,6 +17,22 @@ export var RadioButton = /*#__PURE__*/React.forwardRef(function RadioButton(_ref
17
17
  value = _ref.value,
18
18
  onChange = _ref.onChange,
19
19
  props = _objectWithoutPropertiesLoose(_ref, _excluded);
20
+ var renderLabel = function renderLabel() {
21
+ if (!label) return null;
22
+ return /*#__PURE__*/React.createElement(Typography, {
23
+ variant: "body1",
24
+ as: typeof label === 'string' ? 'span' : 'div',
25
+ color: Colors.Neutral.B18
26
+ }, label);
27
+ };
28
+ var renderHelperText = function renderHelperText() {
29
+ if (!helperText) return null;
30
+ return /*#__PURE__*/React.createElement(Typography, {
31
+ variant: "subtitle2",
32
+ as: typeof label === 'string' ? 'span' : 'div',
33
+ color: Colors.Neutral.B40
34
+ }, helperText);
35
+ };
20
36
  return /*#__PURE__*/React.createElement(RadioButtonWrapper, null, /*#__PURE__*/React.createElement(RadioButtonInput, _extends({
21
37
  ref: ref,
22
38
  disabled: disabled,
@@ -30,13 +46,5 @@ export var RadioButton = /*#__PURE__*/React.forwardRef(function RadioButton(_ref
30
46
  }
31
47
  }, props)), /*#__PURE__*/React.createElement(LabelWrapper, {
32
48
  "data-disabled": disabled
33
- }, /*#__PURE__*/React.createElement(Typography, {
34
- variant: "body1",
35
- as: "span",
36
- color: Colors.Neutral.B18
37
- }, label), /*#__PURE__*/React.createElement(Typography, {
38
- variant: "subtitle2",
39
- as: "span",
40
- color: Colors.Neutral.B40
41
- }, helperText)));
49
+ }, renderLabel(), renderHelperText()));
42
50
  });
@@ -13,4 +13,4 @@ export var RadioButtonInput = styled.input.withConfig({
13
13
  export var LabelWrapper = styled.div.withConfig({
14
14
  displayName: "RadioButtonStyle__LabelWrapper",
15
15
  componentId: "sc-138orlx-2"
16
- })(["cursor:pointer;display:flex;flex-direction:column;gap:", ";&[data-disabled='true']{span{color:", ";}cursor:not-allowed;}"], space4, Colors.Neutral.B85);
16
+ })(["cursor:pointer;display:flex;flex-direction:column;gap:", ";&[data-disabled='true']{span,div{color:", ";}cursor:not-allowed;}"], space4, Colors.Neutral.B85);
@@ -1,7 +1,7 @@
1
- import React from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
  export interface RadioButtonProps extends Omit<React.HTMLAttributes<HTMLInputElement>, 'onChange'> {
3
- label?: string;
4
- helperText?: string;
3
+ label?: ReactNode;
4
+ helperText?: ReactNode;
5
5
  disabled?: boolean;
6
6
  name?: string;
7
7
  checked?: boolean;
@@ -6,9 +6,9 @@ exports.RadioButton = void 0;
6
6
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
7
7
  var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _RadioButtonStyle = require("./RadioButtonStyle");
10
- var _Typography = require("../Typography");
11
9
  var _ = require("..");
10
+ var _Typography = require("../Typography");
11
+ var _RadioButtonStyle = require("./RadioButtonStyle");
12
12
  var _excluded = ["label", "helperText", "disabled", "name", "checked", "value", "onChange"];
13
13
  /**
14
14
  * This is a controlled component, so you need to pass in the `checked` and `onChange` prop to make it work.
@@ -22,6 +22,22 @@ var RadioButton = /*#__PURE__*/_react["default"].forwardRef(function RadioButton
22
22
  value = _ref.value,
23
23
  onChange = _ref.onChange,
24
24
  props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, _excluded);
25
+ var renderLabel = function renderLabel() {
26
+ if (!label) return null;
27
+ return /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
28
+ variant: "body1",
29
+ as: typeof label === 'string' ? 'span' : 'div',
30
+ color: _.Colors.Neutral.B18
31
+ }, label);
32
+ };
33
+ var renderHelperText = function renderHelperText() {
34
+ if (!helperText) return null;
35
+ return /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
36
+ variant: "subtitle2",
37
+ as: typeof label === 'string' ? 'span' : 'div',
38
+ color: _.Colors.Neutral.B40
39
+ }, helperText);
40
+ };
25
41
  return /*#__PURE__*/_react["default"].createElement(_RadioButtonStyle.RadioButtonWrapper, null, /*#__PURE__*/_react["default"].createElement(_RadioButtonStyle.RadioButtonInput, (0, _extends2["default"])({
26
42
  ref: ref,
27
43
  disabled: disabled,
@@ -35,14 +51,6 @@ var RadioButton = /*#__PURE__*/_react["default"].forwardRef(function RadioButton
35
51
  }
36
52
  }, props)), /*#__PURE__*/_react["default"].createElement(_RadioButtonStyle.LabelWrapper, {
37
53
  "data-disabled": disabled
38
- }, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
39
- variant: "body1",
40
- as: "span",
41
- color: _.Colors.Neutral.B18
42
- }, label), /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
43
- variant: "subtitle2",
44
- as: "span",
45
- color: _.Colors.Neutral.B40
46
- }, helperText)));
54
+ }, renderLabel(), renderHelperText()));
47
55
  });
48
56
  exports.RadioButton = RadioButton;
@@ -20,5 +20,5 @@ exports.RadioButtonInput = RadioButtonInput;
20
20
  var LabelWrapper = _styledComponents["default"].div.withConfig({
21
21
  displayName: "RadioButtonStyle__LabelWrapper",
22
22
  componentId: "sc-138orlx-2"
23
- })(["cursor:pointer;display:flex;flex-direction:column;gap:", ";&[data-disabled='true']{span{color:", ";}cursor:not-allowed;}"], _spacing.space4, _.Colors.Neutral.B85);
23
+ })(["cursor:pointer;display:flex;flex-direction:column;gap:", ";&[data-disabled='true']{span,div{color:", ";}cursor:not-allowed;}"], _spacing.space4, _.Colors.Neutral.B85);
24
24
  exports.LabelWrapper = LabelWrapper;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "glints-aries",
3
- "version": "4.0.376",
3
+ "version": "4.0.377",
4
4
  "description": "Glints ui-kit for frontend",
5
5
  "main": "./lib/index.js",
6
6
  "module": "./es/index.js",