@czi-sds/components 22.13.1 → 22.13.2

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.
@@ -1507,12 +1507,22 @@ interface RadioExtraProps extends CommonThemeProps {
1507
1507
  disabled?: boolean;
1508
1508
  }
1509
1509
  interface RadioContentProps extends Omit<MUIRadioProps, "color" | "defaultChecked"> {
1510
- caption?: string;
1510
+ caption?: React.ReactNode;
1511
1511
  intent?: "default" | "negative" | "notice" | "positive";
1512
1512
  label?: React.ReactNode;
1513
1513
  radioProps?: Partial<MUIRadioProps>;
1514
1514
  stage?: "checked" | "unchecked";
1515
1515
  value?: string;
1516
+ classes?: {
1517
+ root?: string;
1518
+ labelCaptionContainer?: string;
1519
+ label?: string;
1520
+ caption?: string;
1521
+ radioButton?: string;
1522
+ radioCheckedIcon?: string;
1523
+ radioCheckedIconDot?: string;
1524
+ radioDefaultIcon?: string;
1525
+ };
1516
1526
  }
1517
1527
  type RadioProps = RadioContentProps & RadioExtraProps;
1518
1528
  /**
package/dist/index.cjs.js CHANGED
@@ -8004,10 +8004,11 @@ var templateObject_1$x, templateObject_2$k, templateObject_3$f, templateObject_4
8004
8004
  * @see https://mui.com/material-ui/react-radio-button/
8005
8005
  */
8006
8006
  var InputRadio = function (props) {
8007
- var caption = props.caption, disabled = props.disabled, _a = props.intent, intent = _a === void 0 ? "default" : _a, radioProps = props.radioProps, stage = props.stage, value = props.value;
8007
+ var caption = props.caption, disabled = props.disabled, _a = props.intent, intent = _a === void 0 ? "default" : _a, radioProps = props.radioProps, stage = props.stage, value = props.value, _b = props.classes, classes = _b === void 0 ? EMPTY_OBJECT : _b;
8008
8008
  // (masoudmanson): We don't need to pass the label prop to the radio component
8009
8009
  // so we are destructuring it here.
8010
8010
  var label = props.label, restProps = __rest(props, ["label"]);
8011
+ var root = classes.root, labelCaptionContainer = classes.labelCaptionContainer, labelClassName = classes.label, captionClassName = classes.caption, radioButtonClassName = classes.radioButton, radioCheckedIconClassName = classes.radioCheckedIcon, radioCheckedIconDotClassName = classes.radioCheckedIconDot, radioDefaultIconClassName = classes.radioDefaultIcon;
8011
8012
  var newProps;
8012
8013
  switch (stage) {
8013
8014
  case "checked":
@@ -8023,8 +8024,8 @@ var InputRadio = function (props) {
8023
8024
  // Otherwise, the screen reader will read the label twice!
8024
8025
  var labelId = "".concat(value, "-label");
8025
8026
  var captionId = caption ? "".concat(value, "-caption") : undefined;
8026
- var finalLabel = caption ? (jsxRuntime.jsxs(StyledLabelContainer, { children: [jsxRuntime.jsx(StyledRadioLabel, { id: labelId, children: label }), jsxRuntime.jsx(StyledRadioCaption, { id: captionId, children: caption })] })) : (jsxRuntime.jsx(StyledLabelContainer, { children: jsxRuntime.jsx(StyledRadioLabel, { id: labelId, children: label }) }));
8027
- return (jsxRuntime.jsx(StyledFormControlLabel, { control: jsxRuntime.jsx(StyledRadioButton, __assign({ checkedIcon: jsxRuntime.jsx(StyledRadioCheckedIcon, { children: jsxRuntime.jsx(StyledRadioDot, {}) }), icon: jsxRuntime.jsx(StyledRadioDefaultIcon, { intent: intent }), intent: intent }, radioProps, newProps)), disabled: disabled, label: finalLabel, value: value }));
8027
+ var finalLabel = caption ? (jsxRuntime.jsxs(StyledLabelContainer, { className: labelCaptionContainer, children: [jsxRuntime.jsx(StyledRadioLabel, { id: labelId, className: labelClassName, children: label }), jsxRuntime.jsx(StyledRadioCaption, { id: captionId, className: captionClassName, children: caption })] })) : (jsxRuntime.jsx(StyledLabelContainer, { className: labelCaptionContainer, children: jsxRuntime.jsx(StyledRadioLabel, { id: labelId, className: labelClassName, children: label }) }));
8028
+ return (jsxRuntime.jsx(StyledFormControlLabel, { control: jsxRuntime.jsx(StyledRadioButton, __assign({ className: radioButtonClassName, checkedIcon: jsxRuntime.jsx(StyledRadioCheckedIcon, { className: radioCheckedIconClassName, children: jsxRuntime.jsx(StyledRadioDot, { className: radioCheckedIconDotClassName }) }), icon: jsxRuntime.jsx(StyledRadioDefaultIcon, { intent: intent, className: radioDefaultIconClassName }), intent: intent }, radioProps, newProps)), disabled: disabled, label: finalLabel, value: value, className: root }));
8028
8029
  };
8029
8030
 
8030
8031
  var inputSlider = function (props) {
@@ -1507,12 +1507,22 @@ interface RadioExtraProps extends CommonThemeProps {
1507
1507
  disabled?: boolean;
1508
1508
  }
1509
1509
  interface RadioContentProps extends Omit<MUIRadioProps, "color" | "defaultChecked"> {
1510
- caption?: string;
1510
+ caption?: React.ReactNode;
1511
1511
  intent?: "default" | "negative" | "notice" | "positive";
1512
1512
  label?: React.ReactNode;
1513
1513
  radioProps?: Partial<MUIRadioProps>;
1514
1514
  stage?: "checked" | "unchecked";
1515
1515
  value?: string;
1516
+ classes?: {
1517
+ root?: string;
1518
+ labelCaptionContainer?: string;
1519
+ label?: string;
1520
+ caption?: string;
1521
+ radioButton?: string;
1522
+ radioCheckedIcon?: string;
1523
+ radioCheckedIconDot?: string;
1524
+ radioDefaultIcon?: string;
1525
+ };
1516
1526
  }
1517
1527
  type RadioProps = RadioContentProps & RadioExtraProps;
1518
1528
  /**
package/dist/index.esm.js CHANGED
@@ -7981,10 +7981,11 @@ var templateObject_1$x, templateObject_2$k, templateObject_3$f, templateObject_4
7981
7981
  * @see https://mui.com/material-ui/react-radio-button/
7982
7982
  */
7983
7983
  var InputRadio = function (props) {
7984
- var caption = props.caption, disabled = props.disabled, _a = props.intent, intent = _a === void 0 ? "default" : _a, radioProps = props.radioProps, stage = props.stage, value = props.value;
7984
+ var caption = props.caption, disabled = props.disabled, _a = props.intent, intent = _a === void 0 ? "default" : _a, radioProps = props.radioProps, stage = props.stage, value = props.value, _b = props.classes, classes = _b === void 0 ? EMPTY_OBJECT : _b;
7985
7985
  // (masoudmanson): We don't need to pass the label prop to the radio component
7986
7986
  // so we are destructuring it here.
7987
7987
  var label = props.label, restProps = __rest(props, ["label"]);
7988
+ var root = classes.root, labelCaptionContainer = classes.labelCaptionContainer, labelClassName = classes.label, captionClassName = classes.caption, radioButtonClassName = classes.radioButton, radioCheckedIconClassName = classes.radioCheckedIcon, radioCheckedIconDotClassName = classes.radioCheckedIconDot, radioDefaultIconClassName = classes.radioDefaultIcon;
7988
7989
  var newProps;
7989
7990
  switch (stage) {
7990
7991
  case "checked":
@@ -8000,8 +8001,8 @@ var InputRadio = function (props) {
8000
8001
  // Otherwise, the screen reader will read the label twice!
8001
8002
  var labelId = "".concat(value, "-label");
8002
8003
  var captionId = caption ? "".concat(value, "-caption") : undefined;
8003
- var finalLabel = caption ? (jsxs(StyledLabelContainer, { children: [jsx(StyledRadioLabel, { id: labelId, children: label }), jsx(StyledRadioCaption, { id: captionId, children: caption })] })) : (jsx(StyledLabelContainer, { children: jsx(StyledRadioLabel, { id: labelId, children: label }) }));
8004
- return (jsx(StyledFormControlLabel, { control: jsx(StyledRadioButton, __assign({ checkedIcon: jsx(StyledRadioCheckedIcon, { children: jsx(StyledRadioDot, {}) }), icon: jsx(StyledRadioDefaultIcon, { intent: intent }), intent: intent }, radioProps, newProps)), disabled: disabled, label: finalLabel, value: value }));
8004
+ var finalLabel = caption ? (jsxs(StyledLabelContainer, { className: labelCaptionContainer, children: [jsx(StyledRadioLabel, { id: labelId, className: labelClassName, children: label }), jsx(StyledRadioCaption, { id: captionId, className: captionClassName, children: caption })] })) : (jsx(StyledLabelContainer, { className: labelCaptionContainer, children: jsx(StyledRadioLabel, { id: labelId, className: labelClassName, children: label }) }));
8005
+ return (jsx(StyledFormControlLabel, { control: jsx(StyledRadioButton, __assign({ className: radioButtonClassName, checkedIcon: jsx(StyledRadioCheckedIcon, { className: radioCheckedIconClassName, children: jsx(StyledRadioDot, { className: radioCheckedIconDotClassName }) }), icon: jsx(StyledRadioDefaultIcon, { intent: intent, className: radioDefaultIconClassName }), intent: intent }, radioProps, newProps)), disabled: disabled, label: finalLabel, value: value, className: root }));
8005
8006
  };
8006
8007
 
8007
8008
  var inputSlider = function (props) {