@popsure/dirty-swan 0.41.14 → 0.41.16

package/dist/cjs/lib/components/input/radio/index.d.ts

@@ -18,5 +18,6 @@ export interface RadioProps<ValueType extends string> {
         option?: string;
     };
     bordered?: boolean;
+    disabled?: boolean;
 }
-export declare const Radio: <ValueType extends string>({ options, value, onChange, wide, inlineLayout, inlineIcon, classNames: classNamesObj, bordered, }: RadioProps<ValueType>) => JSX.Element;
+export declare const Radio: <ValueType extends string>({ options, value, onChange, wide, inlineLayout, inlineIcon, classNames: classNamesObj, bordered, disabled, }: RadioProps<ValueType>) => JSX.Element;

package/dist/cjs/lib/components/input/radio/index.stories.d.ts

@@ -1,7 +1,7 @@
 import { RadioProps } from '.';
 declare const story: {
     title: string;
-    component: <ValueType extends string>({ options, value, onChange, wide, inlineLayout, inlineIcon, classNames: classNamesObj, bordered, }: RadioProps<ValueType>) => JSX.Element;
+    component: <ValueType extends string>({ options, value, onChange, wide, inlineLayout, inlineIcon, classNames: classNamesObj, bordered, disabled, }: RadioProps<ValueType>) => JSX.Element;
     argTypes: {
         options: {
             description: string;
@@ -50,17 +50,21 @@ declare const story: {
             description: string;
             defaultValue: boolean;
         };
+        disabled: {
+            description: string;
+            defaultValue: boolean;
+        };
     };
 };
 export declare const RadioStory: {
-    ({ onChange, options, wide, classNames, inlineLayout, bordered, }: RadioProps<string>): JSX.Element;
+    ({ onChange, options, wide, classNames, inlineLayout, bordered, disabled, }: RadioProps<string>): JSX.Element;
     storyName: string;
 };
-export declare const RadioWithCustomWrapperStyles: ({ onChange }: RadioProps<string>) => JSX.Element;
-export declare const RadioWithCustomOptionStyles: ({ onChange }: RadioProps<string>) => JSX.Element;
-export declare const RadioWithCustomLabelStyles: ({ onChange }: RadioProps<string>) => JSX.Element;
+export declare const RadioWithCustomWrapperStyles: ({ onChange, }: RadioProps<string>) => JSX.Element;
+export declare const RadioWithCustomOptionStyles: ({ onChange, }: RadioProps<string>) => JSX.Element;
+export declare const RadioWithCustomLabelStyles: ({ onChange, }: RadioProps<string>) => JSX.Element;
 export declare const RadioWithInlineLayout: ({ onChange }: RadioProps<string>) => JSX.Element;
-export declare const RadioWithCustomLabel: ({ onChange, wide, classNames, inlineLayout }: RadioProps<string>) => JSX.Element;
-export declare const RadioWithCustomLabelInline: ({ onChange, wide, classNames, inlineLayout }: RadioProps<string>) => JSX.Element;
+export declare const RadioWithCustomLabel: ({ onChange, wide, classNames, inlineLayout, }: RadioProps<string>) => JSX.Element;
+export declare const RadioWithCustomLabelInline: ({ onChange, wide, classNames, inlineLayout, }: RadioProps<string>) => JSX.Element;
 export declare const RadioIconOnly: ({ onChange }: RadioProps<string>) => JSX.Element;
 export default story;

package/dist/cjs/lib/components/toast/index.d.ts

@@ -1,4 +1,10 @@
 import { ReactNode } from 'react';
+export interface ToasterProps {
+    classNames?: {
+        wrapper?: string;
+        toast?: string;
+    };
+}
 export declare type ToastType = 'warning' | 'error' | 'success' | 'information';
 export interface ToastOptions {
     type?: ToastType;
@@ -13,7 +19,7 @@ export interface ToastProps extends ToastOptions {
     onDismiss: () => void;
     title: string;
 }
-declare const Toaster: () => JSX.Element;
+declare const Toaster: ({ classNames: toasterClassNames }: ToasterProps) => JSX.Element;
 declare const Toast: ({ action, description, onDismiss, title, type }: ToastProps) => JSX.Element;
 declare const toast: (title: string, { duration, ...toastOptions }: ToastOptions) => string;
 export { Toaster, Toast, toast };

package/dist/cjs/lib/components/toast/index.stories.d.ts

@@ -1,4 +1,4 @@
-import { ToastProps } from '.';
+import { ToasterProps, ToastProps } from '.';
 declare const story: {
     title: string;
     component: ({ action, description, onDismiss, title, type }: ToastProps) => JSX.Element;
@@ -28,6 +28,12 @@ declare const story: {
                 disable: boolean;
             };
         };
+        classNames: {
+            description: string;
+            table: {
+                category: string;
+            };
+        };
     };
     args: {
         title: string;
@@ -38,10 +44,14 @@ declare const story: {
         };
         type: string;
         duration: number;
+        classNames: {
+            toast: string;
+            wrapper: string;
+        };
     };
 };
 export declare const ToastStory: {
-    ({ title, description, action, type, duration }: ToastProps): JSX.Element;
+    ({ title, description, action, type, duration, classNames: toasterClassNames }: ToastProps & ToasterProps): JSX.Element;
     storyName: string;
 };
 export declare const ToastTypes: (props: ToastProps) => JSX.Element;

package/dist/esm/components/input/radio/index.js

@@ -9,7 +9,7 @@ styleInject(css_248z);
 
 var Radio = function (_a) {
     var _b;
-    var options = _a.options, value = _a.value, onChange = _a.onChange, _c = _a.wide, wide = _c === void 0 ? false : _c, _d = _a.inlineLayout, inlineLayout = _d === void 0 ? false : _d, _e = _a.inlineIcon, inlineIcon = _e === void 0 ? false : _e, classNamesObj = _a.classNames, _f = _a.bordered, bordered = _f === void 0 ? true : _f;
+    var options = _a.options, value = _a.value, onChange = _a.onChange, _c = _a.wide, wide = _c === void 0 ? false : _c, _d = _a.inlineLayout, inlineLayout = _d === void 0 ? false : _d, _e = _a.inlineIcon, inlineIcon = _e === void 0 ? false : _e, classNamesObj = _a.classNames, _f = _a.bordered, bordered = _f === void 0 ? true : _f, _g = _a.disabled, disabled = _g === void 0 ? false : _g;
     var entries = Object.entries(options);
     return (jsx("div", __assign({ className: classNames(classNamesObj === null || classNamesObj === void 0 ? void 0 : classNamesObj.container, styles.container, 'd-flex gap8', (_b = {},
             _b[styles.wide] = wide,
@@ -29,12 +29,12 @@ var Radio = function (_a) {
             return (jsxs("div", __assign({ className: classNamesObj === null || classNamesObj === void 0 ? void 0 : classNamesObj.option }, { children: [jsx("input", { className: classNames('p-radio', {
                             'p-radio--no-icon': customIcon || hideIcon,
                             'p-radio--centered': !label,
-                        }), id: currentValue, type: "radio", value: currentValue, onChange: function () { return onChange(currentValue); }, checked: checked, "data-testid": "radio-input-" + currentValue }, void 0),
+                        }), id: currentValue, type: "radio", value: currentValue, onChange: function () { return onChange(currentValue); }, checked: checked, "data-testid": "radio-input-" + currentValue, disabled: disabled }, void 0),
                     jsxs("label", __assign({ htmlFor: currentValue, className: classNames(classNamesObj === null || classNamesObj === void 0 ? void 0 : classNamesObj.label, 'p-label', {
                             'jc-center': customIcon && !inlineIcon,
                             'fd-column': customIcon && !inlineIcon,
                             'p-label--bordered': bordered,
-                        }), "data-cy": "radio-" + currentValue, "data-testid": "radio-" + currentValue }, { children: [customIcon && (jsx("div", __assign({ className: classNames("d-inline-flex ai-center jc-center", inlineIcon ? "mr8" : "mt8") }, { children: customIcon === null || customIcon === void 0 ? void 0 : customIcon(checked) }), void 0)),
+                        }), "data-cy": "radio-" + currentValue, "data-testid": "radio-" + currentValue }, { children: [customIcon && (jsx("div", __assign({ className: classNames('d-inline-flex ai-center jc-center', inlineIcon ? 'mr8' : 'mt8') }, { children: customIcon === null || customIcon === void 0 ? void 0 : customIcon(checked) }), void 0)),
                             isRadioLabelObject(label) ? (jsxs("div", { children: [jsx("p", __assign({ className: "p-p" }, { children: label.title }), void 0),
                                     jsx("span", __assign({ className: "d-block p-p p-p--small tc-grey-600" }, { children: label.description }), void 0)] }, void 0)) : (label)] }), void 0)] }), currentValue));
         }) }), void 0));

package/dist/esm/components/input/radio/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../src/lib/components/input/radio/index.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { ReactNode } from 'react';\n\nimport styles from './styles.module.scss';\nexport interface RadioWithDescription {\n  title: ReactNode;\n  description?: string;\n  icon?: (selected: boolean) => ReactNode;\n  hideBox?: boolean;\n}\n\nexport interface RadioProps<ValueType extends string> {\n  options: Record<ValueType, ReactNode | RadioWithDescription>;\n  value?: ValueType;\n  onChange: (value: ValueType) => void;\n  wide?: boolean;\n  inlineLayout?: boolean;\n  inlineIcon?: boolean;\n  classNames?: {\n    container?: string;\n    label?: string;\n    option?: string;\n  };\n  bordered?: boolean;\n}\n\nexport const Radio = <ValueType extends string>({\n  options,\n  value,\n  onChange,\n  wide = false,\n  inlineLayout = false,\n  inlineIcon = false,\n  classNames: classNamesObj,\n  bordered = true,\n}: RadioProps<ValueType>) => {\n  const entries = Object.entries(options) as [\n    ValueType,\n    ReactNode | RadioWithDescription\n  ][];\n\n  return (\n    <div\n      className={classNames(\n        classNamesObj?.container,\n        styles.container,\n        'd-flex gap8',\n        {\n          [styles.wide]: wide,\n          [styles.narrow]: !wide,\n          'fd-row': inlineLayout,\n          'f-wrap': inlineLayout,\n          'fd-column': !inlineLayout,\n        }\n      )}\n    >\n      {entries.map(([currentValue, label]) => {\n        const checked = value === currentValue;\n        const customIcon = (label as RadioWithDescription)?.icon;\n        const hideIcon = (label as RadioWithDescription)?.hideBox;\n\n        const isRadioLabelObject = (\n          label: ReactNode | RadioWithDescription\n        ): label is RadioWithDescription => {\n          return (label as RadioWithDescription).title !== undefined;\n        };\n\n        return (\n          <div className={classNamesObj?.option} key={currentValue}>\n            <input\n              className={classNames('p-radio', {\n                'p-radio--no-icon': customIcon || hideIcon,\n                'p-radio--centered': !label,\n              })}\n              id={currentValue}\n              type=\"radio\"\n              value={currentValue}\n              onChange={() => onChange(currentValue)}\n              checked={checked}\n              data-testid={`radio-input-${currentValue}`}\n            />\n\n            <label\n              htmlFor={currentValue}\n              className={classNames(classNamesObj?.label, 'p-label', {\n                'jc-center': customIcon && !inlineIcon,\n                'fd-column': customIcon && !inlineIcon,\n                'p-label--bordered': bordered,\n              })}\n              data-cy={`radio-${currentValue}`}\n              data-testid={`radio-${currentValue}`}\n            >\n              {customIcon && (\n                <div \n                  className={classNames(\n                    \"d-inline-flex ai-center jc-center\", \n                    inlineIcon ? \"mr8\" : \"mt8\"\n                  )}\n                >\n                  {customIcon?.(checked)}\n                </div>\n              )}\n\n              {isRadioLabelObject(label) ? (\n                <div>\n                  <p className=\"p-p\">{label.title}</p>\n                  <span className=\"d-block p-p p-p--small tc-grey-600\">\n                    {label.description}\n                  </span>\n                </div>\n              ) : (\n                label\n              )}\n            </label>\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;IA0Ba,KAAK,GAAG,UAA2B,EASxB;;QARtB,OAAO,aAAA,EACP,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,YAAY,EAAZ,IAAI,mBAAG,KAAK,KAAA,EACZ,oBAAoB,EAApB,YAAY,mBAAG,KAAK,KAAA,EACpB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EACN,aAAa,gBAAA,EACzB,gBAAe,EAAf,QAAQ,mBAAG,IAAI,KAAA;IAEf,IAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAGnC,CAAC;IAEJ,QACEA,sBACE,SAAS,EAAE,UAAU,CACnB,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,EACxB,MAAM,CAAC,SAAS,EAChB,aAAa;YAEX,GAAC,MAAM,CAAC,IAAI,IAAG,IAAI;YACnB,GAAC,MAAM,CAAC,MAAM,IAAG,CAAC,IAAI;YACtB,YAAQ,GAAE,YAAY;YACtB,YAAQ,GAAE,YAAY;YACtB,eAAW,GAAE,CAAC,YAAY;gBAE7B,gBAEA,OAAO,CAAC,GAAG,CAAC,UAAC,EAAqB;;gBAApB,YAAY,QAAA,EAAE,KAAK,QAAA;YAChC,IAAM,OAAO,GAAG,KAAK,KAAK,YAAY,CAAC;YACvC,IAAM,UAAU,GAAG,MAAC,KAA8B,0CAAE,IAAI,CAAC;YACzD,IAAM,QAAQ,GAAG,MAAC,KAA8B,0CAAE,OAAO,CAAC;YAE1D,IAAM,kBAAkB,GAAG,UACzB,KAAuC;gBAEvC,OAAQ,KAA8B,CAAC,KAAK,KAAK,SAAS,CAAC;aAC5D,CAAC;YAEF,QACEC,uBAAK,SAAS,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,MAAM,iBACnCD,eACE,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;4BAC/B,kBAAkB,EAAE,UAAU,IAAI,QAAQ;4BAC1C,mBAAmB,EAAE,CAAC,KAAK;yBAC5B,CAAC,EACF,EAAE,EAAE,YAAY,EAChB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,cAAM,OAAA,QAAQ,CAAC,YAAY,CAAC,GAAA,EACtC,OAAO,EAAE,OAAO,iBACH,iBAAe,YAAc,WAC1C;oBAEFC,yBACE,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,UAAU,CAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,EAAE,SAAS,EAAE;4BACrD,WAAW,EAAE,UAAU,IAAI,CAAC,UAAU;4BACtC,WAAW,EAAE,UAAU,IAAI,CAAC,UAAU;4BACtC,mBAAmB,EAAE,QAAQ;yBAC9B,CAAC,aACO,WAAS,YAAc,iBACnB,WAAS,YAAc,iBAEnC,UAAU,KACTD,sBACE,SAAS,EAAE,UAAU,CACnB,mCAAmC,EACnC,UAAU,GAAG,KAAK,GAAG,KAAK,CAC3B,gBAEA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAG,OAAO,CAAC,YAClB,CACP;4BAEA,kBAAkB,CAAC,KAAK,CAAC,IACxBC,yBACED,oBAAG,SAAS,EAAC,KAAK,gBAAE,KAAK,CAAC,KAAK,YAAK;oCACpCA,uBAAM,SAAS,EAAC,oCAAoC,gBACjD,KAAK,CAAC,WAAW,YACb,YACH,KAEN,KAAK,CACN,aACK,MA7CkC,YAAY,CA8ClD,EACN;SACH,CAAC,YACE,EACN;AACJ;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../../src/lib/components/input/radio/index.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { ReactNode } from 'react';\n\nimport styles from './styles.module.scss';\nexport interface RadioWithDescription {\n  title: ReactNode;\n  description?: string;\n  icon?: (selected: boolean) => ReactNode;\n  hideBox?: boolean;\n}\n\nexport interface RadioProps<ValueType extends string> {\n  options: Record<ValueType, ReactNode | RadioWithDescription>;\n  value?: ValueType;\n  onChange: (value: ValueType) => void;\n  wide?: boolean;\n  inlineLayout?: boolean;\n  inlineIcon?: boolean;\n  classNames?: {\n    container?: string;\n    label?: string;\n    option?: string;\n  };\n  bordered?: boolean;\n  disabled?: boolean;\n}\n\nexport const Radio = <ValueType extends string>({\n  options,\n  value,\n  onChange,\n  wide = false,\n  inlineLayout = false,\n  inlineIcon = false,\n  classNames: classNamesObj,\n  bordered = true,\n  disabled = false,\n}: RadioProps<ValueType>) => {\n  const entries = Object.entries(options) as [\n    ValueType,\n    ReactNode | RadioWithDescription\n  ][];\n\n  return (\n    <div\n      className={classNames(\n        classNamesObj?.container,\n        styles.container,\n        'd-flex gap8',\n        {\n          [styles.wide]: wide,\n          [styles.narrow]: !wide,\n          'fd-row': inlineLayout,\n          'f-wrap': inlineLayout,\n          'fd-column': !inlineLayout,\n        }\n      )}\n    >\n      {entries.map(([currentValue, label]) => {\n        const checked = value === currentValue;\n        const customIcon = (label as RadioWithDescription)?.icon;\n        const hideIcon = (label as RadioWithDescription)?.hideBox;\n\n        const isRadioLabelObject = (\n          label: ReactNode | RadioWithDescription\n        ): label is RadioWithDescription => {\n          return (label as RadioWithDescription).title !== undefined;\n        };\n\n        return (\n          <div className={classNamesObj?.option} key={currentValue}>\n            <input\n              className={classNames('p-radio', {\n                'p-radio--no-icon': customIcon || hideIcon,\n                'p-radio--centered': !label,\n              })}\n              id={currentValue}\n              type=\"radio\"\n              value={currentValue}\n              onChange={() => onChange(currentValue)}\n              checked={checked}\n              data-testid={`radio-input-${currentValue}`}\n              disabled={disabled}\n            />\n\n            <label\n              htmlFor={currentValue}\n              className={classNames(classNamesObj?.label, 'p-label', {\n                'jc-center': customIcon && !inlineIcon,\n                'fd-column': customIcon && !inlineIcon,\n                'p-label--bordered': bordered,\n              })}\n              data-cy={`radio-${currentValue}`}\n              data-testid={`radio-${currentValue}`}\n            >\n              {customIcon && (\n                <div\n                  className={classNames(\n                    'd-inline-flex ai-center jc-center',\n                    inlineIcon ? 'mr8' : 'mt8'\n                  )}\n                >\n                  {customIcon?.(checked)}\n                </div>\n              )}\n\n              {isRadioLabelObject(label) ? (\n                <div>\n                  <p className=\"p-p\">{label.title}</p>\n                  <span className=\"d-block p-p p-p--small tc-grey-600\">\n                    {label.description}\n                  </span>\n                </div>\n              ) : (\n                label\n              )}\n            </label>\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;IA2Ba,KAAK,GAAG,UAA2B,EAUxB;;QATtB,OAAO,aAAA,EACP,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,YAAY,EAAZ,IAAI,mBAAG,KAAK,KAAA,EACZ,oBAAoB,EAApB,YAAY,mBAAG,KAAK,KAAA,EACpB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EACN,aAAa,gBAAA,EACzB,gBAAe,EAAf,QAAQ,mBAAG,IAAI,KAAA,EACf,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA;IAEhB,IAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAGnC,CAAC;IAEJ,QACEA,sBACE,SAAS,EAAE,UAAU,CACnB,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,EACxB,MAAM,CAAC,SAAS,EAChB,aAAa;YAEX,GAAC,MAAM,CAAC,IAAI,IAAG,IAAI;YACnB,GAAC,MAAM,CAAC,MAAM,IAAG,CAAC,IAAI;YACtB,YAAQ,GAAE,YAAY;YACtB,YAAQ,GAAE,YAAY;YACtB,eAAW,GAAE,CAAC,YAAY;gBAE7B,gBAEA,OAAO,CAAC,GAAG,CAAC,UAAC,EAAqB;;gBAApB,YAAY,QAAA,EAAE,KAAK,QAAA;YAChC,IAAM,OAAO,GAAG,KAAK,KAAK,YAAY,CAAC;YACvC,IAAM,UAAU,GAAG,MAAC,KAA8B,0CAAE,IAAI,CAAC;YACzD,IAAM,QAAQ,GAAG,MAAC,KAA8B,0CAAE,OAAO,CAAC;YAE1D,IAAM,kBAAkB,GAAG,UACzB,KAAuC;gBAEvC,OAAQ,KAA8B,CAAC,KAAK,KAAK,SAAS,CAAC;aAC5D,CAAC;YAEF,QACEC,uBAAK,SAAS,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,MAAM,iBACnCD,eACE,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;4BAC/B,kBAAkB,EAAE,UAAU,IAAI,QAAQ;4BAC1C,mBAAmB,EAAE,CAAC,KAAK;yBAC5B,CAAC,EACF,EAAE,EAAE,YAAY,EAChB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,cAAM,OAAA,QAAQ,CAAC,YAAY,CAAC,GAAA,EACtC,OAAO,EAAE,OAAO,iBACH,iBAAe,YAAc,EAC1C,QAAQ,EAAE,QAAQ,WAClB;oBAEFC,yBACE,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,UAAU,CAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,EAAE,SAAS,EAAE;4BACrD,WAAW,EAAE,UAAU,IAAI,CAAC,UAAU;4BACtC,WAAW,EAAE,UAAU,IAAI,CAAC,UAAU;4BACtC,mBAAmB,EAAE,QAAQ;yBAC9B,CAAC,aACO,WAAS,YAAc,iBACnB,WAAS,YAAc,iBAEnC,UAAU,KACTD,sBACE,SAAS,EAAE,UAAU,CACnB,mCAAmC,EACnC,UAAU,GAAG,KAAK,GAAG,KAAK,CAC3B,gBAEA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAG,OAAO,CAAC,YAClB,CACP;4BAEA,kBAAkB,CAAC,KAAK,CAAC,IACxBC,yBACED,oBAAG,SAAS,EAAC,KAAK,gBAAE,KAAK,CAAC,KAAK,YAAK;oCACpCA,uBAAM,SAAS,EAAC,oCAAoC,gBACjD,KAAK,CAAC,WAAW,YACb,YACH,KAEN,KAAK,CACN,aACK,MA9CkC,YAAY,CA+ClD,EACN;SACH,CAAC,YACE,EACN;AACJ;;;;"}

package/dist/esm/components/input/radio/index.stories.js

@@ -15,17 +15,17 @@ var story = {
             defaultValue: {
                 CAT: {
                     title: 'Cat',
-                    description: 'At least 1'
+                    description: 'At least 1',
                 },
                 DOG: {
                     title: 'Dog',
-                    description: 'At least 2'
+                    description: 'At least 2',
                 },
                 NONE: {
                     title: 'None',
-                    description: 'No pets'
-                }
-            }
+                    description: 'No pets',
+                },
+            },
         },
         value: {
             description: 'Current checked values.',
@@ -34,39 +34,43 @@ var story = {
             description: 'Function called everytime a value changes.',
             action: true,
             table: {
-                category: "Callbacks",
+                category: 'Callbacks',
             },
         },
         wide: {
             description: 'Property that defines if options should fill 100% of available horizontal space',
-            defaultValue: false
+            defaultValue: false,
         },
         inlineLayout: {
             description: 'Property that defines if options should show inline instead of block. Check inline radio options story for examples.',
-            defaultValue: false
+            defaultValue: false,
         },
         classNames: {
             description: 'ClassNames for custom styling',
             defaultValue: {
                 container: '',
                 label: '',
-                option: ''
-            }
+                option: '',
+            },
         },
         bordered: {
             description: 'Property that defines if option should show with border',
-            defaultValue: true
+            defaultValue: true,
         },
-    }
+        disabled: {
+            description: 'Property that defines if the input and corresponding label are disabled and not clickable',
+            defaultValue: false,
+        },
+    },
 };
 var RadioStory = function (_a) {
-    var onChange = _a.onChange, options = _a.options, wide = _a.wide, classNames = _a.classNames, inlineLayout = _a.inlineLayout, bordered = _a.bordered;
+    var onChange = _a.onChange, options = _a.options, wide = _a.wide, classNames = _a.classNames, inlineLayout = _a.inlineLayout, bordered = _a.bordered, disabled = _a.disabled;
     var _b = useState(), checkedValues = _b[0], setCheckedValues = _b[1];
     var handleOnChange = function (newValue) {
         setCheckedValues(newValue);
         onChange(newValue);
     };
-    return (jsx(Radio, { wide: wide, options: options, onChange: handleOnChange, value: checkedValues, classNames: classNames, inlineLayout: inlineLayout, bordered: bordered }, void 0));
+    return (jsx(Radio, { wide: wide, options: options, onChange: handleOnChange, value: checkedValues, classNames: classNames, inlineLayout: inlineLayout, bordered: bordered, disabled: disabled }, void 0));
 };
 var RadioWithCustomWrapperStyles = function (_a) {
     var onChange = _a.onChange;
@@ -78,7 +82,7 @@ var RadioWithCustomWrapperStyles = function (_a) {
     return (jsx(Radio, { onChange: handleOnChange, value: checkedValues, options: {
             CAT1: 'Cat',
             DOG1: 'Dog',
-        }, classNames: { container: "p32 bg-primary-300 br24 bs-lg" } }, void 0));
+        }, classNames: { container: 'p32 bg-primary-300 br24 bs-lg' } }, void 0));
 };
 var RadioWithCustomOptionStyles = function (_a) {
     var onChange = _a.onChange;
@@ -90,7 +94,7 @@ var RadioWithCustomOptionStyles = function (_a) {
     return (jsx(Radio, { onChange: handleOnChange, value: checkedValues, options: {
             CAT2: 'Cat',
             DOG2: 'Dog',
-        }, classNames: { option: "mb32 p24 bg-green-100 br12 bs-lg" } }, void 0));
+        }, classNames: { option: 'mb32 p24 bg-green-100 br12 bs-lg' } }, void 0));
 };
 var RadioWithCustomLabelStyles = function (_a) {
     var onChange = _a.onChange;
@@ -102,7 +106,7 @@ var RadioWithCustomLabelStyles = function (_a) {
     return (jsx(Radio, { onChange: handleOnChange, value: checkedValues, options: {
             CAT3: 'Cat',
             DOG3: 'Dog',
-        }, classNames: { label: "bg-grey-900 tc-white" } }, void 0));
+        }, classNames: { label: 'bg-grey-900 tc-white' } }, void 0));
 };
 var RadioWithInlineLayout = function (_a) {
     var onChange = _a.onChange;
@@ -118,7 +122,7 @@ var RadioWithInlineLayout = function (_a) {
             RABBIT: 'Rabbit',
             RAT: 'Rat',
             ANOTHER: 'Other',
-        }, classNames: { option: "w30" }, inlineLayout: true, wide: true }, void 0));
+        }, classNames: { option: 'w30' }, inlineLayout: true, wide: true }, void 0));
 };
 var RadioWithCustomLabel = function (_a) {
     var onChange = _a.onChange; _a.wide; _a.classNames; _a.inlineLayout;
@@ -129,18 +133,18 @@ var RadioWithCustomLabel = function (_a) {
     };
     return (jsx(Radio, { options: {
             BIGDOG: {
-                icon: function () { return jsx("img", { src: images.bigDog, alt: '' }, void 0); },
+                icon: function () { return jsx("img", { src: images.bigDog, alt: "" }, void 0); },
                 title: 'Dog',
             },
             FISH: {
-                icon: function () { return jsx("img", { src: images.brokenAquarium, alt: '' }, void 0); },
+                icon: function () { return jsx("img", { src: images.brokenAquarium, alt: "" }, void 0); },
                 title: 'Fish',
             },
             OTHER: {
-                icon: function () { return jsx("img", { src: images.brokenGlass, alt: '' }, void 0); },
+                icon: function () { return jsx("img", { src: images.brokenGlass, alt: "" }, void 0); },
                 title: 'Other',
-            }
-        }, onChange: handleOnChange, value: checkedValues, classNames: { option: "w30" }, inlineLayout: true }, void 0));
+            },
+        }, onChange: handleOnChange, value: checkedValues, classNames: { option: 'w30' }, inlineLayout: true }, void 0));
 };
 var RadioWithCustomLabelInline = function (_a) {
     var onChange = _a.onChange; _a.wide; _a.classNames; _a.inlineLayout;
@@ -151,18 +155,18 @@ var RadioWithCustomLabelInline = function (_a) {
     };
     return (jsx(Radio, { options: {
             BIGDOG: {
-                icon: function () { return jsx("img", { src: images.bigDog, alt: '' }, void 0); },
+                icon: function () { return jsx("img", { src: images.bigDog, alt: "" }, void 0); },
                 title: 'Dog',
             },
             FISH: {
-                icon: function () { return jsx("img", { src: images.brokenAquarium, alt: '' }, void 0); },
+                icon: function () { return jsx("img", { src: images.brokenAquarium, alt: "" }, void 0); },
                 title: 'Fish',
             },
             OTHER: {
-                icon: function () { return jsx("img", { src: images.brokenGlass, alt: '' }, void 0); },
+                icon: function () { return jsx("img", { src: images.brokenGlass, alt: "" }, void 0); },
                 title: 'Other',
-            }
-        }, onChange: handleOnChange, inlineIcon: true, value: checkedValues, classNames: { option: "w30" }, inlineLayout: true }, void 0));
+            },
+        }, onChange: handleOnChange, inlineIcon: true, value: checkedValues, classNames: { option: 'w30' }, inlineLayout: true }, void 0));
 };
 RadioStory.storyName = 'Radio';
 var RadioIconOnly = function (_a) {

package/dist/esm/components/input/radio/index.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.stories.js","sources":["../../../../../../src/lib/components/input/radio/index.stories.tsx"],"sourcesContent":["\nimport { useState } from 'react';\nimport { Radio, RadioProps } from '.';\nimport { images } from '../../../util/images';\n\nconst story = {\n  title: 'JSX/Inputs/Radio',\n  component: Radio,\n  argTypes: {\n    options: {\n      description: 'Object that contains the possible options for rendering in the input.',\n      defaultValue: {\n        CAT:{\n          title: 'Cat',\n          description: 'At least 1'\n        },\n        DOG:{\n          title: 'Dog',\n          description: 'At least 2'\n        },\n        NONE:{\n          title: 'None',\n          description: 'No pets'\n        }\n      }\n    },\n    value: {\n      description: 'Current checked values.',\n    },\n    onChange: {\n      description: 'Function called everytime a value changes.',\n      action: true,\n      table: {\n        category: \"Callbacks\",\n      },\n    },\n    wide: {\n      description: 'Property that defines if options should fill 100% of available horizontal space',\n      defaultValue: false\n    },\n    inlineLayout: {\n      description: 'Property that defines if options should show inline instead of block. Check inline radio options story for examples.',\n      defaultValue: false\n    },\n    classNames: {\n      description: 'ClassNames for custom styling',\n      defaultValue: {\n        container: '',\n        label: '',\n        option: ''\n      }\n    },\n    bordered: {\n      description: 'Property that defines if option should show with border',\n      defaultValue: true\n    },\n  }\n};\n\nexport const RadioStory = ({ \n  onChange,\n  options,\n  wide,\n  classNames,\n  inlineLayout,\n  bordered,\n}: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      wide={wide}\n      options={options} \n      onChange={handleOnChange}\n      value={checkedValues}\n      classNames={classNames}\n      inlineLayout={inlineLayout}\n      bordered={bordered}\n    />\n  );\n}\n\nexport const RadioWithCustomWrapperStyles = ({ onChange }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT1: 'Cat',\n        DOG1: 'Dog',\n      }} \n      classNames={{ container: \"p32 bg-primary-300 br24 bs-lg\" }}\n    />\n  );\n}\n\nexport const RadioWithCustomOptionStyles = ({ onChange }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT2: 'Cat',\n        DOG2: 'Dog',\n      }} \n      classNames={{ option: \"mb32 p24 bg-green-100 br12 bs-lg\" }}\n    />\n  );\n}\n\nexport const RadioWithCustomLabelStyles = ({ onChange }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string  ) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT3: 'Cat',\n        DOG3: 'Dog',\n      }} \n      classNames={{ label: \"bg-grey-900 tc-white\" }}\n    />\n  );\n}\n\nexport const RadioWithInlineLayout = ({ onChange }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT4: 'Cat',\n        DOG4: 'Dog',\n        FISHER: 'Fish',\n        RABBIT: 'Rabbit',\n        RAT: 'Rat',\n        ANOTHER: 'Other',\n      }} \n      classNames={{ option: \"w30\" }}\n      inlineLayout\n      wide\n    />\n  );\n}\n\nexport const RadioWithCustomLabel = ({ onChange, wide, classNames, inlineLayout }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      options={{\n        BIGDOG: {\n          icon: () => <img src={images.bigDog} alt='' />,\n          title: 'Dog',\n        },\n        FISH:{\n          icon: () => <img src={images.brokenAquarium} alt='' />,\n          title: 'Fish',\n        },\n        OTHER:{\n          icon: () => <img src={images.brokenGlass} alt='' />,\n          title: 'Other',\n        }\n      }} \n      onChange={handleOnChange}\n      value={checkedValues}\n      classNames={{ option: \"w30\" }}\n      inlineLayout\n    />\n  );\n}\n\nexport const RadioWithCustomLabelInline = ({ onChange, wide, classNames, inlineLayout }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      options={{\n        BIGDOG: {\n          icon: () => <img src={images.bigDog} alt='' />,\n          title: 'Dog',\n        },\n        FISH:{\n          icon: () => <img src={images.brokenAquarium} alt='' />,\n          title: 'Fish',\n        },\n        OTHER:{\n          icon: () => <img src={images.brokenGlass} alt='' />,\n          title: 'Other',\n        }\n      }} \n      onChange={handleOnChange}\n      inlineIcon\n      value={checkedValues}\n      classNames={{ option: \"w30\" }}\n      inlineLayout\n    />\n  );\n}\n\nRadioStory.storyName = 'Radio';\n\nexport const RadioIconOnly = ({ onChange }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  }\n\n  return (\n    <Radio \n      options={{ NOTHING: '' }} \n      onChange={handleOnChange}\n      classNames={{ label: 'jc-start' }}\n      value={checkedValues}\n      bordered={false}\n    />\n  );\n}\n\nRadioStory.storyName = 'Radio';\n\nexport default story;\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"index.stories.js","sources":["../../../../../../src/lib/components/input/radio/index.stories.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { Radio, RadioProps } from '.';\nimport { images } from '../../../util/images';\n\nconst story = {\n  title: 'JSX/Inputs/Radio',\n  component: Radio,\n  argTypes: {\n    options: {\n      description:\n        'Object that contains the possible options for rendering in the input.',\n      defaultValue: {\n        CAT: {\n          title: 'Cat',\n          description: 'At least 1',\n        },\n        DOG: {\n          title: 'Dog',\n          description: 'At least 2',\n        },\n        NONE: {\n          title: 'None',\n          description: 'No pets',\n        },\n      },\n    },\n    value: {\n      description: 'Current checked values.',\n    },\n    onChange: {\n      description: 'Function called everytime a value changes.',\n      action: true,\n      table: {\n        category: 'Callbacks',\n      },\n    },\n    wide: {\n      description:\n        'Property that defines if options should fill 100% of available horizontal space',\n      defaultValue: false,\n    },\n    inlineLayout: {\n      description:\n        'Property that defines if options should show inline instead of block. Check inline radio options story for examples.',\n      defaultValue: false,\n    },\n    classNames: {\n      description: 'ClassNames for custom styling',\n      defaultValue: {\n        container: '',\n        label: '',\n        option: '',\n      },\n    },\n    bordered: {\n      description: 'Property that defines if option should show with border',\n      defaultValue: true,\n    },\n    disabled: {\n      description:\n        'Property that defines if the input and corresponding label are disabled and not clickable',\n      defaultValue: false,\n    },\n  },\n};\n\nexport const RadioStory = ({\n  onChange,\n  options,\n  wide,\n  classNames,\n  inlineLayout,\n  bordered,\n  disabled,\n}: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      wide={wide}\n      options={options}\n      onChange={handleOnChange}\n      value={checkedValues}\n      classNames={classNames}\n      inlineLayout={inlineLayout}\n      bordered={bordered}\n      disabled={disabled}\n    />\n  );\n};\n\nexport const RadioWithCustomWrapperStyles = ({\n  onChange,\n}: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT1: 'Cat',\n        DOG1: 'Dog',\n      }}\n      classNames={{ container: 'p32 bg-primary-300 br24 bs-lg' }}\n    />\n  );\n};\n\nexport const RadioWithCustomOptionStyles = ({\n  onChange,\n}: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT2: 'Cat',\n        DOG2: 'Dog',\n      }}\n      classNames={{ option: 'mb32 p24 bg-green-100 br12 bs-lg' }}\n    />\n  );\n};\n\nexport const RadioWithCustomLabelStyles = ({\n  onChange,\n}: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT3: 'Cat',\n        DOG3: 'Dog',\n      }}\n      classNames={{ label: 'bg-grey-900 tc-white' }}\n    />\n  );\n};\n\nexport const RadioWithInlineLayout = ({ onChange }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      onChange={handleOnChange}\n      value={checkedValues}\n      options={{\n        CAT4: 'Cat',\n        DOG4: 'Dog',\n        FISHER: 'Fish',\n        RABBIT: 'Rabbit',\n        RAT: 'Rat',\n        ANOTHER: 'Other',\n      }}\n      classNames={{ option: 'w30' }}\n      inlineLayout\n      wide\n    />\n  );\n};\n\nexport const RadioWithCustomLabel = ({\n  onChange,\n  wide,\n  classNames,\n  inlineLayout,\n}: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      options={{\n        BIGDOG: {\n          icon: () => <img src={images.bigDog} alt=\"\" />,\n          title: 'Dog',\n        },\n        FISH: {\n          icon: () => <img src={images.brokenAquarium} alt=\"\" />,\n          title: 'Fish',\n        },\n        OTHER: {\n          icon: () => <img src={images.brokenGlass} alt=\"\" />,\n          title: 'Other',\n        },\n      }}\n      onChange={handleOnChange}\n      value={checkedValues}\n      classNames={{ option: 'w30' }}\n      inlineLayout\n    />\n  );\n};\n\nexport const RadioWithCustomLabelInline = ({\n  onChange,\n  wide,\n  classNames,\n  inlineLayout,\n}: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      options={{\n        BIGDOG: {\n          icon: () => <img src={images.bigDog} alt=\"\" />,\n          title: 'Dog',\n        },\n        FISH: {\n          icon: () => <img src={images.brokenAquarium} alt=\"\" />,\n          title: 'Fish',\n        },\n        OTHER: {\n          icon: () => <img src={images.brokenGlass} alt=\"\" />,\n          title: 'Other',\n        },\n      }}\n      onChange={handleOnChange}\n      inlineIcon\n      value={checkedValues}\n      classNames={{ option: 'w30' }}\n      inlineLayout\n    />\n  );\n};\n\nRadioStory.storyName = 'Radio';\n\nexport const RadioIconOnly = ({ onChange }: RadioProps<string>) => {\n  const [checkedValues, setCheckedValues] = useState<string>();\n\n  const handleOnChange = (newValue: string) => {\n    setCheckedValues(newValue);\n    onChange(newValue);\n  };\n\n  return (\n    <Radio\n      options={{ NOTHING: '' }}\n      onChange={handleOnChange}\n      classNames={{ label: 'jc-start' }}\n      value={checkedValues}\n      bordered={false}\n    />\n  );\n};\n\nRadioStory.storyName = 'Radio';\n\nexport default story;\n"],"names":["_jsx"],"mappings":"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"}

package/dist/esm/components/input/radio/index.test.js

@@ -83,5 +83,19 @@ describe('Radio component', function () {
             }, onChange: mockOnChange }, void 0)).getByText;
         expect(getByText('Cat')).toBeInTheDocument();
     });
+    it('Should disable the input', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var getByTestId, radioInput;
+        return __generator(this, function (_a) {
+            getByTestId = customRender(jsx(Radio, { options: {
+                    CAT: {
+                        title: 'Cat',
+                        description: 'Cat description',
+                    },
+                }, onChange: mockOnChange, disabled: true }, void 0)).getByTestId;
+            radioInput = getByTestId('radio-input-CAT');
+            expect(radioInput).toBeDisabled();
+            return [2 /*return*/];
+        });
+    }); });
 });
 //# sourceMappingURL=index.test.js.map

package/dist/esm/components/input/radio/index.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.test.js","sources":["../../../../../../src/lib/components/input/radio/index.test.tsx"],"sourcesContent":["import { render } from '../../../util/testUtils';\n\nimport { Radio, RadioProps } from '.';\n\nconst mockOnChange = jest.fn();\n\nconst setup = (onChange: RadioProps<string>['onChange'], value?: string) => {\n  const utils = render(\n    <Radio\n      options={{\n        CAT: 'Cat',\n        DOG: 'Dog',\n        NONE: 'None',\n      }}\n      onChange={onChange}\n      value={value}\n    />\n  );\n\n  return utils;\n};\n\ndescribe('Radio component', () => {\n  it('Should render options', () => {\n    const { getByText } = setup(mockOnChange);\n\n    expect(getByText('Cat')).toBeInTheDocument();\n    expect(getByText('Dog')).toBeInTheDocument();\n    expect(getByText('None')).toBeInTheDocument();\n  });\n\n  it('Should call onchange on selecting an option', async () => {\n    const { getByTestId, user } = setup(mockOnChange);\n\n    await user.click(getByTestId('radio-DOG'));\n\n    expect(mockOnChange).toBeCalledWith('DOG');\n  });\n\n  it('Should render checked items when value is passed', async () => {\n    const { getByTestId } = setup(mockOnChange, 'CAT');\n\n    expect(getByTestId('radio-input-CAT')).toBeChecked();\n  });\n\n  it('Should render custom description', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: 'Cat',\n            description: 'Cat description',\n          },\n        }}\n        onChange={mockOnChange}\n      />\n    );\n\n    expect(getByText('Cat description')).toBeInTheDocument();\n  });\n\n  it('Should render custom icon', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: 'Cat',\n            icon: () => 'ICON',\n          },\n        }}\n        onChange={mockOnChange}\n      />\n    );\n\n    expect(getByText('ICON')).toBeInTheDocument();\n  });\n\n  it('Should render custom icon with selected', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: 'Cat',\n            icon: (selected) => (selected ? 'SELECTED-ICON' : 'ICON'),\n          },\n        }}\n        onChange={mockOnChange}\n        value={'CAT'}\n      />\n    );\n\n    expect(getByText('SELECTED-ICON')).toBeInTheDocument();\n  });\n\n  it('Should render label text passed in HTML format', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: <p>Cat</p>,\n            description: 'Cat description',\n          },\n        }}\n        onChange={mockOnChange}\n      />\n    );\n\n    expect(getByText('Cat')).toBeInTheDocument();\n  });\n});\n"],"names":["render","_jsx"],"mappings":"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"}
+{"version":3,"file":"index.test.js","sources":["../../../../../../src/lib/components/input/radio/index.test.tsx"],"sourcesContent":["import { render } from '../../../util/testUtils';\n\nimport { Radio, RadioProps } from '.';\n\nconst mockOnChange = jest.fn();\n\nconst setup = (onChange: RadioProps<string>['onChange'], value?: string) => {\n  const utils = render(\n    <Radio\n      options={{\n        CAT: 'Cat',\n        DOG: 'Dog',\n        NONE: 'None',\n      }}\n      onChange={onChange}\n      value={value}\n    />\n  );\n\n  return utils;\n};\n\ndescribe('Radio component', () => {\n  it('Should render options', () => {\n    const { getByText } = setup(mockOnChange);\n\n    expect(getByText('Cat')).toBeInTheDocument();\n    expect(getByText('Dog')).toBeInTheDocument();\n    expect(getByText('None')).toBeInTheDocument();\n  });\n\n  it('Should call onchange on selecting an option', async () => {\n    const { getByTestId, user } = setup(mockOnChange);\n\n    await user.click(getByTestId('radio-DOG'));\n\n    expect(mockOnChange).toBeCalledWith('DOG');\n  });\n\n  it('Should render checked items when value is passed', async () => {\n    const { getByTestId } = setup(mockOnChange, 'CAT');\n\n    expect(getByTestId('radio-input-CAT')).toBeChecked();\n  });\n\n  it('Should render custom description', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: 'Cat',\n            description: 'Cat description',\n          },\n        }}\n        onChange={mockOnChange}\n      />\n    );\n\n    expect(getByText('Cat description')).toBeInTheDocument();\n  });\n\n  it('Should render custom icon', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: 'Cat',\n            icon: () => 'ICON',\n          },\n        }}\n        onChange={mockOnChange}\n      />\n    );\n\n    expect(getByText('ICON')).toBeInTheDocument();\n  });\n\n  it('Should render custom icon with selected', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: 'Cat',\n            icon: (selected) => (selected ? 'SELECTED-ICON' : 'ICON'),\n          },\n        }}\n        onChange={mockOnChange}\n        value={'CAT'}\n      />\n    );\n\n    expect(getByText('SELECTED-ICON')).toBeInTheDocument();\n  });\n\n  it('Should render label text passed in HTML format', () => {\n    const { getByText } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: <p>Cat</p>,\n            description: 'Cat description',\n          },\n        }}\n        onChange={mockOnChange}\n      />\n    );\n\n    expect(getByText('Cat')).toBeInTheDocument();\n  });\n\n  it('Should disable the input', async () => {\n    const { getByTestId } = render(\n      <Radio\n        options={{\n          CAT: {\n            title: 'Cat',\n            description: 'Cat description',\n          },\n        }}\n        onChange={mockOnChange}\n        disabled\n      />\n    );\n\n    const radioInput = getByTestId('radio-input-CAT');\n\n    expect(radioInput).toBeDisabled();\n  });\n});\n"],"names":["render","_jsx"],"mappings":"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"}

package/dist/esm/components/toast/index.js

@@ -1,7 +1,7 @@
 import '../../tslib.es6-5bc94358.js';
 import 'react/jsx-runtime';
 import '../../index-6ea95111.js';
-export { T as Toast, a as Toaster, t as toast } from '../../index-2c193605.js';
+export { T as Toast, a as Toaster, t as toast } from '../../index-d81b8748.js';
 import '../icon/icons/X.js';
 import '../../style-inject.es-1f59c1d0.js';
 import 'react';

package/dist/esm/components/toast/index.stories.js

@@ -1,8 +1,8 @@
 import { _ as __assign } from '../../tslib.es6-5bc94358.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { c as classNames } from '../../index-6ea95111.js';
-import { T as Toast, a as Toaster, s as styles, t as toast } from '../../index-2c193605.js';
+import { T as Toast, a as Toaster, s as styles, t as toast } from '../../index-d81b8748.js';
 import { Button } from '../button/index.js';
+import { c as classNames } from '../../index-6ea95111.js';
 import '../../style-inject.es-1f59c1d0.js';
 import 'react';
 import '../../_commonjsHelpers-e7f67fd8.js';
@@ -36,7 +36,13 @@ var story = {
             table: {
                 disable: true,
             },
-        }
+        },
+        classNames: {
+            description: 'Allows customization of toast and toast wrapper (named as Toaster)',
+            table: {
+                category: 'Toaster props',
+            },
+        },
     },
     args: {
         title: 'We couldn’t open the chat',
@@ -47,6 +53,10 @@ var story = {
         },
         type: 'success',
         duration: 3000,
+        classNames: {
+            toast: "",
+            wrapper: ""
+        }
     },
 };
 var FakeInlineToast = function (_a) {
@@ -56,7 +66,7 @@ var FakeInlineToast = function (_a) {
             } }, { children: jsx(Toast, { title: title, onDismiss: function () { }, description: description, action: action, type: type }, void 0) }), void 0) }), void 0));
 };
 var ToastStory = function (_a) {
-    var title = _a.title, description = _a.description, action = _a.action, type = _a.type, duration = _a.duration;
+    var title = _a.title, description = _a.description, action = _a.action, type = _a.type, duration = _a.duration, toasterClassNames = _a.classNames;
     var showToast = function () { return toast(title, {
         description: description,
         duration: duration,
@@ -65,7 +75,7 @@ var ToastStory = function (_a) {
     }); };
     return (jsxs(Fragment, { children: [jsxs("div", __assign({ className: 'mb16' }, { children: [jsx("div", { children: "Show a toast using the following code:" }, void 0),
                     jsx("pre", __assign({ className: 'bg-grey-300 br4 d-inline-flex p8 mt8' }, { children: "() => toast(title, { description, type, action })" }), void 0)] }), void 0),
-            jsx(Toaster, {}, void 0),
+            jsx(Toaster, { classNames: toasterClassNames }, void 0),
             jsx(Button, __assign({ onClick: showToast }, { children: "Click here to trigger toast" }), void 0)] }, void 0));
 };
 ToastStory.storyName = "Toast";

package/dist/esm/components/toast/index.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/toast/index.stories.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { Toast, ToastProps, ToastType, Toaster, toast } from '.';\nimport { Button } from '../button';\nimport styles from './style.module.scss';\n\nconst toastTypes: ToastType[] = ['success', 'warning', 'error', 'information'];\n\nconst story = {\n  title: 'JSX/Toast',\n  component: Toast,\n  argTypes: {\n    title: {\n      description: 'Title of the toast.',\n    },\n    description: {\n      description: 'Additional description content to be displayed inside the toast.',\n    },\n    type: {\n      description: 'Type of toast to display. This changes the styles/colors of the toast.',\n    },\n    action: {\n      description: 'Object containing a possible action button inside the toast.',\n    },\n    duration: {\n      description: 'Duration in ms that the toast should be displayed.',\n      table: {\n        defaultValue: { summary: 3000 },\n      }\n    },\n    onDismiss: {\n      table: {\n        disable: true,\n      },\n    }\n  },\n  args: {\n    title: 'We couldn’t open the chat',\n    description: \"We couldn't open the chat description. We couldn't open the chat description.\",\n    action: {\n      title: 'Send an email',\n      onClick: () => {}\n    },\n    type: 'success',\n    duration: 3000,\n  },\n};\n\nconst FakeInlineToast = ({ \n  title, \n  description, \n  action, \n  type\n}: Omit<ToastProps, 'onDismiss'>) => (\n  <div className='mb32'>\n    <div\n      className={classNames(styles.toast, 'br8 bs-lg d-inline-flex')}\n      style={{\n        padding: \"12px 20px\"\n      }}\n    >\n      <Toast \n        title={title}\n        onDismiss={() => {}}\n        description={description}\n        action={action}\n        type={type}\n      />\n    </div>\n  </div>\n);\n\nexport const ToastStory = ({ title, description, action, type, duration }: ToastProps) => {\n  const showToast = () => toast(\n    title, \n    {\n      description,\n      duration,\n      type,\n      action\n    }\n  );\n\n  return (\n    <>\n      <div className='mb16'>\n        <div>\n          Show a toast using the following code:\n        </div>\n        <pre className='bg-grey-300 br4 d-inline-flex p8 mt8'>\n          {\"() => toast(title, { description, type, action })\"}\n        </pre>\n      </div>\n      <Toaster />\n\n      <Button onClick={showToast}>Click here to trigger toast</Button>\n    </>\n  );\n};\n\nToastStory.storyName = \"Toast\";\n\nexport const ToastTypes = (props: ToastProps) => {\n  return (\n    <>\n      {toastTypes.map((toastType) => (\n        <div key={toastType} className='d-flex fd-column'>\n          <h3 className='p-h3 mb16'>{toastType}</h3>\n          <FakeInlineToast {...props} type={toastType} />\n        </div>\n      ))}\n    </>\n  );\n};\n\nexport const ToastContent = ({ title, description, action }: ToastProps) => {\n  return (\n    <div className='d-flex fd-column'>\n      <FakeInlineToast title={title} />\n      <FakeInlineToast title={title} description={description} />\n      <FakeInlineToast title={title} description={description} action={action} />\n      <FakeInlineToast title={title} action={action} />\n    </div>\n  );\n};\n\nexport default story;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/toast/index.stories.tsx"],"sourcesContent":["import { ToasterProps, Toast, ToastProps, ToastType, Toaster, toast } from '.';\nimport { Button } from '../button';\nimport styles from './style.module.scss';\nimport classNames from 'classnames';\n\nconst toastTypes: ToastType[] = ['success', 'warning', 'error', 'information'];\n\nconst story = {\n  title: 'JSX/Toast',\n  component: Toast,\n  argTypes: {\n    title: {\n      description: 'Title of the toast.',\n    },\n    description: {\n      description: 'Additional description content to be displayed inside the toast.',\n    },\n    type: {\n      description: 'Type of toast to display. This changes the styles/colors of the toast.',\n    },\n    action: {\n      description: 'Object containing a possible action button inside the toast.',\n    },\n    duration: {\n      description: 'Duration in ms that the toast should be displayed.',\n      table: {\n        defaultValue: { summary: 3000 },\n      }\n    },\n    onDismiss: {\n      table: {\n        disable: true,\n      },\n    },\n    classNames: {\n      description: 'Allows customization of toast and toast wrapper (named as Toaster)',\n      table: {\n        category: 'Toaster props',\n      },\n    },\n  },\n  args: {\n    title: 'We couldn’t open the chat',\n    description: \"We couldn't open the chat description. We couldn't open the chat description.\",\n    action: {\n      title: 'Send an email',\n      onClick: () => {}\n    },\n    type: 'success',\n    duration: 3000,\n    classNames: {\n      toast: \"\",\n      wrapper: \"\"\n    }\n  },\n};\n\nconst FakeInlineToast = ({ \n  title, \n  description, \n  action, \n  type,\n}: Omit<ToastProps, 'onDismiss'>) => (\n  <div className='mb32'>\n    <div\n      className={classNames(styles.toast, 'br8 bs-lg d-inline-flex')}\n      style={{\n        padding: \"12px 20px\"\n      }}\n    >\n      <Toast \n        title={title}\n        onDismiss={() => {}}\n        description={description}\n        action={action}\n        type={type}\n      />\n    </div>\n  </div>\n);\n\nexport const ToastStory = ({ \n  title, \n  description, \n  action, \n  type, \n  duration, \n  classNames: toasterClassNames \n}: ToastProps & ToasterProps) => {\n  const showToast = () => toast(\n    title, \n    {\n      description,\n      duration,\n      type,\n      action\n    }\n  );\n\n  return (\n    <>\n      <div className='mb16'>\n        <div>\n          Show a toast using the following code:\n        </div>\n        <pre className='bg-grey-300 br4 d-inline-flex p8 mt8'>\n          {\"() => toast(title, { description, type, action })\"}\n        </pre>\n      </div>\n      <Toaster classNames={toasterClassNames} />\n\n      <Button onClick={showToast}>Click here to trigger toast</Button>\n    </>\n  );\n};\n\nToastStory.storyName = \"Toast\";\n\nexport const ToastTypes = (props: ToastProps) => {\n  return (\n    <>\n      {toastTypes.map((toastType) => (\n        <div key={toastType} className='d-flex fd-column'>\n          <h3 className='p-h3 mb16'>{toastType}</h3>\n          <FakeInlineToast {...props} type={toastType} />\n        </div>\n      ))}\n    </>\n  );\n};\n\nexport const ToastContent = ({ title, description, action }: ToastProps) => {\n  return (\n    <div className='d-flex fd-column'>\n      <FakeInlineToast title={title} />\n      <FakeInlineToast title={title} description={description} />\n      <FakeInlineToast title={title} description={description} action={action} />\n      <FakeInlineToast title={title} action={action} />\n    </div>\n  );\n};\n\nexport default story;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/esm/components/toast/index.test.js

@@ -1,7 +1,7 @@
 import { b as __awaiter, c as __generator } from '../../tslib.es6-5bc94358.js';
 import { jsx } from 'react/jsx-runtime';
 import { c as customRender, s as screen } from '../../customRender-9fd06f5b.js';
-import { T as Toast } from '../../index-2c193605.js';
+import { T as Toast } from '../../index-d81b8748.js';
 import 'react';
 import 'react-dom';
 import '../../_commonjsHelpers-e7f67fd8.js';

package/dist/esm/{index-2c193605.js → index-d81b8748.js}

@@ -202,9 +202,12 @@ to {
   }
 `,L=16,J=({reverseOrder:e,position:t="top-center",toastOptions:o,gutter:s,children:r,containerStyle:a,containerClassName:c})=>{let{toasts:i,handlers:d}=V(o);return f.createElement("div",{style:{position:"fixed",zIndex:9999,top:L,left:L,right:L,bottom:L,pointerEvents:"none",...a},className:c,onMouseEnter:d.startPause,onMouseLeave:d.endPause},i.map(p=>{let g=p.position||t,z=d.calculateOffset(p,{reverseOrder:e,gutter:s,defaultPosition:t}),O=De(g,z);return f.createElement(Ie,{id:p.id,key:p.id,onHeightUpdate:d.updateHeight,className:p.visible?ke:"",style:O},p.type==="custom"?u(p.message,p):r?r(p):f.createElement($,{toast:p,position:g}))}))};var _e=n;
 
-var Toaster = function () { return (jsx(dist.Toaster, { toastOptions: {
-        className: classNames(styles.toast, 'bs-lg'),
-    } }, void 0)); };
+var Toaster = function (_a) {
+    var toasterClassNames = _a.classNames;
+    return (jsx(dist.Toaster, { containerClassName: toasterClassNames === null || toasterClassNames === void 0 ? void 0 : toasterClassNames.wrapper, toastOptions: {
+            className: classNames(styles.toast, 'bs-lg', toasterClassNames === null || toasterClassNames === void 0 ? void 0 : toasterClassNames.toast),
+        } }, void 0));
+};
 var Toast = function (_a) {
     var action = _a.action, description = _a.description, onDismiss = _a.onDismiss, title = _a.title, _b = _a.type, type = _b === void 0 ? "success" : _b;
     return (jsxs("div", __assign({ className: classNames(styles.toastContent, 'd-flex jc-between w100') }, { children: [jsx("div", { className: classNames(styles.toastSidebar, styles["toastSidebar--" + type]) }, void 0),
@@ -222,4 +225,4 @@ var toast = function (title, _a) {
 };
 
 export { Toast as T, Toaster as a, styles as s, toast as t };
-//# sourceMappingURL=index-2c193605.js.map
+//# sourceMappingURL=index-d81b8748.js.map