@mrshmllw/smores-react 3.0.5 → 3.0.6

package/dist/Accordion/Accordion.d.ts

@@ -5,9 +5,9 @@ export type AccordionProps = {
     subTitle?: string;
     filledBackground?: boolean;
     borderTop?: boolean;
-    borderColor?: 'oatmeal' | 'custard' | 'cream';
+    borderColor?: 'oatmeal' | 'custard' | 'cream' | 'coconut';
     fullBorder?: boolean;
-    backgroundColor?: 'oatmeal' | 'custard' | 'cream';
+    backgroundColor?: 'oatmeal' | 'custard' | 'cream' | 'coconut';
     onToggle?: (isOpen: boolean) => void;
     children: ReactNode;
     defaultIsOpen?: boolean;

package/dist/Button/LegacyButton.d.ts

@@ -0,0 +1,15 @@
+import React, { FC, ReactNode } from 'react';
+import { Color } from '../theme';
+type Props = {
+    children: ReactNode;
+    id?: string;
+    className?: string;
+    color?: Color;
+    block?: boolean;
+    inverted?: boolean;
+    disabled?: boolean;
+    outlined?: boolean;
+    handleClick: (e: React.FormEvent<HTMLButtonElement>) => void;
+};
+export declare const LegacyButton: FC<Props>;
+export {};

package/dist/Button/LegacyButton.js

@@ -0,0 +1,50 @@
+import React from 'react';
+import styled, { css } from 'styled-components';
+import { theme } from '../theme';
+export const LegacyButton = ({ children, id, className = '', color = 'secondary', block = false, inverted = false, disabled = false, outlined = false, handleClick, }) => (React.createElement(Container, { id: id, className: className, color: color, block: block, inverted: inverted, disabled: disabled, outlined: outlined, onClick: handleClick }, children));
+const Container = styled.button(({ block, color, inverted, outlined }) => css `
+    position: relative;
+    display: inline-block;
+    box-sizing: border-box;
+    border: none;
+    border-radius: 8px;
+    font-size: 16px;
+    padding: 18px 16px 14px;
+    outline: none;
+    cursor: pointer;
+    width: ${block ? '100%' : 'auto'};
+    background-color: ${theme.colors[color]};
+    color: ${theme.colors.white};
+    font-weight: ${theme.font.weight.medium};
+
+    &:hover:not([disabled]) {
+      background-color: ${theme.colors[color]};
+    }
+    &:active:not([disabled]) {
+      background-color: ${theme.colors[color]};
+    }
+    &:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    ${(inverted || outlined) &&
+    css `
+      background-color: transparent;
+      border: 1px solid ${outlined ? theme.colors.outline : 'transparent'};
+      color: ${outlined ? theme.colors.secondary : theme.colors[color]};
+
+      &:hover:not([disabled]) {
+        background-color: ${theme.colors.background};
+      }
+      &:active:not([disabled]) {
+        background-color: ${theme.colors.background};
+      }
+    `};
+
+    @media (min-width: 768px) {
+      padding: 16px 16px 15px;
+      font-size: 16px;
+    }
+  `);
+//# sourceMappingURL=LegacyButton.js.map

package/dist/Button/LegacyButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LegacyButton.js","sourceRoot":"","sources":["../../src/Button/LegacyButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAS,KAAK,EAAE,MAAM,UAAU,CAAA;AA+BvC,MAAM,CAAC,MAAM,YAAY,GAAc,CAAC,EACtC,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,WAAW,EACnB,KAAK,GAAG,KAAK,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,WAAW,GACZ,EAAE,EAAE,CAAC,CACJ,oBAAC,SAAS,IACR,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,WAAW,IAEnB,QAAQ,CACC,CACb,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAC7B,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;;;;;;;;aAUlC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;wBACZ,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;aAC9B,KAAK,CAAC,MAAM,CAAC,KAAK;mBACZ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM;;;0BAGjB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;;;0BAGnB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;;;;;;;MAOvC,CAAC,QAAQ,IAAI,QAAQ,CAAC;IACxB,GAAG,CAAA;;0BAEmB,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa;eAC1D,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;;;4BAG1C,KAAK,CAAC,MAAM,CAAC,UAAU;;;4BAGvB,KAAK,CAAC,MAAM,CAAC,UAAU;;KAE9C;;;;;;GAMF,CACF,CAAA"}

package/dist/ConfirmationRadioButtons/Confirmation.d.ts

@@ -0,0 +1,17 @@
+import { FC, FocusEvent, ReactElement } from 'react';
+import { MarginProps } from '../utils/space';
+export type ConfirmationProps = {
+    onChange(value?: boolean): void;
+    checked?: boolean;
+    id?: string;
+    error?: boolean;
+    errorMsg?: string;
+    label?: string;
+    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+    sublabel?: string | ReactElement;
+    yesLabel?: string | ReactElement;
+    noLabel?: string | ReactElement;
+    required?: boolean;
+    disabled?: boolean;
+} & MarginProps;
+export declare const Confirmation: FC<ConfirmationProps>;

package/dist/ConfirmationRadioButtons/Confirmation.js

@@ -0,0 +1,100 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import styled, { css } from 'styled-components';
+import { theme } from '../theme';
+import { Box } from '../Box';
+import { Text } from '../Text';
+import { RadioButton } from './RadioButtonStyled';
+import { useUniqueId } from '../utils/id';
+import { useDeprecatedWarning } from '../utils/deprecated';
+export const Confirmation = (props) => {
+    const { checked, onChange, id: idProp, error = false, errorMsg = '', label, onBlur, sublabel, yesLabel = 'Yes', noLabel = 'No', required = false, disabled = false } = props, marginProps = __rest(props, ["checked", "onChange", "id", "error", "errorMsg", "label", "onBlur", "sublabel", "yesLabel", "noLabel", "required", "disabled"]);
+    useDeprecatedWarning({
+        title: 'Confirmation',
+        message: 'The Confirmation component has been deprecated. Please use the new RadioGroup component instead.',
+        componentProps: props,
+    });
+    const id = useUniqueId(idProp);
+    return (React.createElement(ConfirmationWrapper, Object.assign({}, marginProps),
+        (label || sublabel) && (React.createElement(TextWrapper, null,
+            label && (React.createElement(SectionHeadingText, { tag: "h3" },
+                label,
+                required && React.createElement(Asterisk, null, "*"))),
+            sublabel && (React.createElement(Text, { tag: "p", typo: "base-small", color: "subtext" }, sublabel)))),
+        React.createElement(RadioButtonGroupWrapper, null,
+            React.createElement(RadioButtonGroup, null,
+                React.createElement(RadioButtonWrapper, { checked: checked === true, error: error, disabled: disabled },
+                    React.createElement(RadioButton, { id: id, label: yesLabel, checked: checked === true, onChange: () => onChange(true), value: id, onBlur: onBlur, disabled: disabled })),
+                React.createElement(RadioButtonWrapper, { checked: checked === false, error: error, disabled: disabled },
+                    React.createElement(RadioButton, { id: `${id}-1`, label: noLabel, checked: checked === false, onChange: () => onChange(false), value: `${id}-1`, onBlur: onBlur, disabled: disabled }))),
+            error && React.createElement(ErrorBox, null, errorMsg))));
+};
+const RadioButtonGroupWrapper = styled.div `
+  display: flex;
+  flex-direction: column;
+`;
+const RadioButtonGroup = styled.div `
+  display: flex;
+  flex-direction: row;
+`;
+const getColor = (checked, error) => {
+    if (error) {
+        return `2px solid ${theme.colors.error}`;
+    }
+    else if (checked) {
+        return `2px solid ${theme.colors.secondary}`;
+    }
+    else {
+        return 'none';
+    }
+};
+const RadioButtonWrapper = styled.div `
+  background-color: ${({ checked }) => !checked && `${theme.colors.background}`};
+  border: ${({ checked, error }) => getColor(checked, error)};
+  margin-right: 10px;
+  width: 139px;
+  display: flex;
+  align-items: center;
+  height: 56px;
+  padding-left: 12px;
+  border-radius: 5px;
+  font-weight: bold;
+  ${({ disabled }) => disabled &&
+    css `
+      border-color: ${theme.colors.secondary};
+      opacity: 0.5;
+    `}
+`;
+const ErrorBox = styled.span `
+  margin-top: 7px;
+  margin-left: 12px;
+  font-size: 12px;
+  color: ${theme.colors.error};
+`;
+const ConfirmationWrapper = styled(Box) `
+  display: flex;
+  flex-direction: column;
+`;
+const SectionHeadingText = styled(Text) `
+  font-weight: bold;
+`;
+const TextWrapper = styled.div `
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 8px;
+`;
+const Asterisk = styled.span `
+  font-size: 14px;
+  color: ${theme.colors.error};
+`;
+//# sourceMappingURL=Confirmation.js.map

package/dist/ConfirmationRadioButtons/Confirmation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.tsx"],"names":[],"mappings":"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"}

package/dist/ConfirmationRadioButtons/Confirmation.stories.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { ConfirmationProps } from './Confirmation';
+declare const _default: {
+    title: string;
+    component: React.FC<ConfirmationProps>;
+    argTypes: {
+        onChange: {
+            action: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: any;
+export declare const WithError: any;
+export declare const WithSublabel: any;
+export declare const WorkingExample: any;
+export declare const WithCustomLabel: any;
+export declare const WithNoLabel: any;
+export declare const Required: any;
+export declare const RequiredWithLongLabel: any;
+export declare const Disabled: any;

package/dist/ConfirmationRadioButtons/Confirmation.stories.js

@@ -0,0 +1,76 @@
+import React from 'react';
+import { noop } from '../utils/noop';
+import { Confirmation } from './Confirmation';
+import { Container } from './Container';
+export default {
+    title: 'Confirmation Radio Button',
+    component: Confirmation,
+    argTypes: { onChange: { action: 'clicked' } },
+};
+const Template = (props) => React.createElement(Confirmation, Object.assign({}, props));
+export const Default = Template.bind({});
+Default.args = {
+    id: 'radioButton',
+    onChange: noop,
+    checked: false,
+    label: 'Do you like marshmallows?',
+};
+export const WithError = Template.bind({});
+WithError.args = {
+    id: 'radioButton',
+    onChange: noop,
+    checked: undefined,
+    label: 'Do you like marshmallows?',
+    error: true,
+    errorMsg: 'This field is required.',
+};
+export const WithSublabel = Template.bind({});
+WithSublabel.args = {
+    id: 'radioButton',
+    onChange: noop,
+    checked: undefined,
+    label: 'Do you like marshmallows?',
+    sublabel: 'This includes smores and hot chocolate topped with marshmallows.',
+};
+const ContainerTemplate = () => React.createElement(Container, null);
+export const WorkingExample = ContainerTemplate.bind({});
+export const WithCustomLabel = Template.bind({});
+WithCustomLabel.args = {
+    id: 'radioButton',
+    onChange: noop,
+    checked: undefined,
+    label: 'Do you like marshmallows?',
+    yesLabel: 'Correct',
+};
+export const WithNoLabel = Template.bind({});
+WithNoLabel.args = {
+    id: 'radioButton',
+    onChange: noop,
+    checked: undefined,
+    yesLabel: 'Yes',
+};
+export const Required = Template.bind({});
+Required.args = {
+    id: 'radioButton',
+    label: 'Do you like ice cream?',
+    onChange: noop,
+    checked: undefined,
+    required: true,
+};
+export const RequiredWithLongLabel = Template.bind({});
+RequiredWithLongLabel.args = {
+    id: 'radioButton',
+    label: 'This is a really long label to test the placement of the required asterisk. Do you like ice cream, pie, marshmallows, smores, cupcakes, cookies, and muffins?',
+    onChange: noop,
+    checked: undefined,
+    required: true,
+};
+export const Disabled = Template.bind({});
+Disabled.args = {
+    id: 'radioButton',
+    label: 'Do you like marshmallows?',
+    onChange: noop,
+    checked: true,
+    disabled: true,
+};
+//# sourceMappingURL=Confirmation.stories.js.map

package/dist/ConfirmationRadioButtons/Confirmation.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Confirmation.stories.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.stories.tsx"],"names":[],"mappings":"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"}

package/dist/ConfirmationRadioButtons/Container.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Container: () => JSX.Element;

package/dist/ConfirmationRadioButtons/Container.js

@@ -0,0 +1,8 @@
+import React, { useState } from 'react';
+import { Confirmation } from './Confirmation';
+export const Container = () => {
+    const [checked, setChecked] = useState(undefined);
+    return (React.createElement("form", null,
+        React.createElement(Confirmation, { id: "radioButton", onChange: (selection) => setChecked(selection), checked: checked, label: 'Do you like marshmallows?', error: checked === undefined, errorMsg: "This field is required." })));
+};
+//# sourceMappingURL=Container.js.map

package/dist/ConfirmationRadioButtons/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAsB,SAAS,CAAC,CAAA;IAEtE,OAAO,CACL;QACE,oBAAC,YAAY,IACX,EAAE,EAAC,aAAa,EAChB,QAAQ,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,UAAU,CAAC,SAAS,CAAC,EAC9C,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,2BAA2B,EAClC,KAAK,EAAE,OAAO,KAAK,SAAS,EAC5B,QAAQ,EAAC,yBAAyB,GAClC,CACG,CACR,CAAA;AACH,CAAC,CAAA"}

package/dist/ConfirmationRadioButtons/RadioButtonStyled.d.ts

@@ -0,0 +1,17 @@
+import { FC, ChangeEvent, FocusEvent, ReactElement } from 'react';
+export interface FakeInput {
+    checked?: boolean;
+    error?: boolean;
+    disabled?: boolean;
+}
+type RadioButtonProps = {
+    id: string;
+    label: string | ReactElement;
+    checked?: boolean;
+    value: string;
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
+    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+    disabled?: boolean;
+};
+export declare const RadioButton: FC<RadioButtonProps>;
+export {};

package/dist/ConfirmationRadioButtons/RadioButtonStyled.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import styled from 'styled-components';
+import { theme } from '../theme';
+import { Box } from '../Box';
+export const RadioButton = ({ id, label, checked, value, onChange, onBlur, disabled = false, }) => (React.createElement(Box, { flex: true, alignItems: "center" },
+    React.createElement(RadioInput, { id: id, type: "radio", checked: checked, value: value, onChange: onChange, onBlur: onBlur, disabled: disabled }),
+    React.createElement(RadioLabel, { htmlFor: id },
+        React.createElement(FakeInput, { checked: checked }),
+        React.createElement(Text, null, label))));
+const FakeInput = styled.div `
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  background-color: ${theme.colors.white};
+  margin-right: 10px;
+  border: ${({ checked }) => checked
+    ? `8px solid ${theme.colors.secondary}`
+    : `1px solid ${theme.colors.secondary}`};
+`;
+const RadioInput = styled.input `
+  position: absolute;
+  opacity: 0;
+  height: 0;
+  width: 0;
+`;
+const RadioLabel = styled.label `
+  font-family: 'Gordita', sans-serif;
+  text-transform: none;
+  font-size: 16px;
+  line-height: 17px;
+  color: ${theme.colors.secondary};
+  margin-bottom: 0;
+  display: flex;
+  cursor: pointer;
+`;
+// needed because the text is top aligned in its viewbox
+const Text = styled.span `
+  position: relative;
+  bottom: -5px;
+`;
+//# sourceMappingURL=RadioButtonStyled.js.map

package/dist/ConfirmationRadioButtons/RadioButtonStyled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonStyled.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/RadioButtonStyled.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAA;AACxE,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAkB5B,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAChD,EAAE,EACF,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,MAAM,EACN,QAAQ,GAAG,KAAK,GACC,EAAE,EAAE,CAAC,CACtB,oBAAC,GAAG,IAAC,IAAI,QAAC,UAAU,EAAC,QAAQ;IAC3B,oBAAC,UAAU,IACT,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,GAClB;IACF,oBAAC,UAAU,IAAC,OAAO,EAAE,EAAE;QACrB,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO,GAAI;QAC/B,oBAAC,IAAI,QAAE,KAAK,CAAQ,CACT,CACT,CACP,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAW;;;;sBAIjB,KAAK,CAAC,MAAM,CAAC,KAAK;;YAE5B,CAAC,EAAE,OAAO,EAAa,EAAE,EAAE,CACnC,OAAO;IACL,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE;IACvC,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE;CAC5C,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;CAK9B,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;WAKpB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;CAIhC,CAAA;AAED,wDAAwD;AACxD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAGvB,CAAA"}

package/dist/ConfirmationRadioButtons/__tests__/Confirmation.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Confirmation } from '../Confirmation';
+test('renders', () => {
+    const { container } = render(React.createElement(Confirmation, null));
+    expect(container.firstChild).toMatchSnapshot();
+});
+//# sourceMappingURL=Confirmation.js.map

package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../../src/ConfirmationRadioButtons/__tests__/Confirmation.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAE/C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE;IACnB,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,YAAY,OAAG,CAAC,CAAA;IAC9C,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAA;AAChD,CAAC,CAAC,CAAA"}

package/dist/ConfirmationRadioButtons/index.d.ts

@@ -0,0 +1 @@
+export { Confirmation } from './Confirmation';

package/dist/ConfirmationRadioButtons/index.js

@@ -0,0 +1,2 @@
+export { Confirmation } from './Confirmation';
+//# sourceMappingURL=index.js.map

package/dist/ConfirmationRadioButtons/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA"}

package/dist/Datepicker/DatesList.js

@@ -18,7 +18,7 @@ export const DatesList = ({ items, handleDateSelect, showDayLabels, }) => {
         Array(getBlankDaysCount(items[0].date))
             .fill(null)
             .map((_, index) => (React.createElement(ListButton, { key: `blankItem-${index}`, disabled: true }))),
-        items.map((item, i) => (React.createElement(ListButton, { key: i, disabled: item.disabled, className: `ListButton ${item.active ? 'active' : ''}`, onClick: () => handleDateSelect(item.date), onKeyDown: (e) => {
+        items.map((item, i) => (React.createElement(ListButton, { key: i, type: "button", disabled: item.disabled, className: `ListButton ${item.active ? 'active' : ''}`, onClick: () => handleDateSelect(item.date), onKeyDown: (e) => {
                 if (e.key === 'Enter') {
                     handleDateSelect(item.date);
                 }

package/dist/Datepicker/DatesList.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatesList.js","sourceRoot":"","sources":["../../src/Datepicker/DatesList.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DatesList.js","sourceRoot":"","sources":["../../src/Datepicker/DatesList.tsx"],"names":[],"mappings":"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"}

package/dist/Message/Message.d.ts

@@ -0,0 +1,21 @@
+import { FC, ReactNode } from 'react';
+type BorderProps = {
+    hasBorder?: false;
+    borderColor?: never;
+} | {
+    hasBorder: true;
+    borderColor: string;
+};
+export type MessageProps = {
+    className?: string;
+    children: ReactNode;
+    type?: 'info' | 'warning' | 'warning-bubble' | string;
+    alignIcon?: 'center' | 'flex-start' | 'flex-end';
+    backgroundColor?: string;
+    sizeSmall?: boolean;
+} & BorderProps;
+/**
+ * @deprecated Use Support Message instead
+ */
+export declare const Message: FC<MessageProps>;
+export {};

package/dist/Message/Message.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import styled, { css } from 'styled-components';
+import { Box } from '../Box';
+import { Icon } from '../Icon';
+import { theme } from '../theme';
+import { useDeprecatedWarning } from '../utils/deprecated';
+/**
+ * @deprecated Use Support Message instead
+ */
+export const Message = ({ className, children, type = 'info', alignIcon = 'center', backgroundColor, sizeSmall, hasBorder, borderColor, }) => {
+    useDeprecatedWarning({
+        title: 'Legacy Message component',
+        message: "You're using the legacy Message component. Please use the new Support Message component.",
+    });
+    return (React.createElement(Wrapper, { className: className, type: type, backgroundColor: backgroundColor, sizeSmall: sizeSmall, hasBorder: hasBorder, borderColor: borderColor },
+        React.createElement(IconWrapper, { alignIcon: alignIcon },
+            React.createElement(Icon, { size: sizeSmall ? 24 : 32, render: type, color: type === 'warning' ? 'error' : 'secondary' })),
+        children));
+};
+const IconWrapper = styled(Box) `
+  align-self: ${({ alignIcon }) => alignIcon};
+`;
+const Wrapper = styled.div(({ type, backgroundColor, sizeSmall, hasBorder, borderColor }) => css `
+    align-items: center;
+    background-color: ${backgroundColor
+    ? backgroundColor
+    : type === 'warning'
+        ? theme.colors.white
+        : theme.colors.background};
+    box-sizing: border-box;
+    ${type === 'warning'
+    ? `border: 1px solid ${theme.colors.error};`
+    : hasBorder && `border: 1px solid ${borderColor};`}
+    border-radius: 8px;
+    margin-bottom: 24px;
+    padding: 16px;
+    display: flex;
+    font-family: ${theme.font.system};
+    color: ${type === 'warning' ? theme.colors.error : theme.colors.secondary};
+    font-size: ${sizeSmall ? '12px' : '16px'};
+    span {
+      margin: 0 16px 0 0;
+    }
+  `);
+//# sourceMappingURL=Message.js.map

package/dist/Message/Message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.js","sourceRoot":"","sources":["../../src/Message/Message.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAe1D;;GAEG;AAEH,MAAM,CAAC,MAAM,OAAO,GAAqB,CAAC,EACxC,SAAS,EACT,QAAQ,EACR,IAAI,GAAG,MAAM,EACb,SAAS,GAAG,QAAQ,EACpB,eAAe,EACf,SAAS,EACT,SAAS,EACT,WAAW,GACZ,EAAE,EAAE;IACH,oBAAoB,CAAC;QACnB,KAAK,EAAE,0BAA0B;QACjC,OAAO,EACL,0FAA0F;KAC7F,CAAC,CAAA;IACF,OAAO,CACL,oBAAC,OAAO,IACN,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW;QAExB,oBAAC,WAAW,IAAC,SAAS,EAAE,SAAS;YAC/B,oBAAC,IAAI,IACH,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EACzB,MAAM,EAAE,IAAI,EACZ,KAAK,EAAE,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,GACjD,CACU;QAEb,QAAQ,CACD,CACX,CAAA;AACH,CAAC,CAAA;AAcD,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAAc;gBAC7B,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,SAAS;CAC3C,CAAA;AAED,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CACxB,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;wBAE/C,eAAe;IACjC,CAAC,CAAC,eAAe;IACjB,CAAC,CAAC,IAAI,KAAK,SAAS;QACpB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK;QACpB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU;;MAEzB,IAAI,KAAK,SAAS;IAClB,CAAC,CAAC,qBAAqB,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG;IAC5C,CAAC,CAAC,SAAS,IAAI,qBAAqB,WAAW,GAAG;;;;;mBAKrC,KAAK,CAAC,IAAI,CAAC,MAAM;aACvB,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS;iBAC5D,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;;;;GAIzC,CACF,CAAA"}

package/dist/Message/Message.stories.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { MessageProps } from './Message';
+declare const _default: {
+    title: string;
+    component: React.FC<MessageProps>;
+};
+export default _default;
+export declare const Default: any;
+export declare const Info: any;
+export declare const Warning: any;
+export declare const WarningBubbleSmall: any;
+export declare const InfoBubbleSmall: any;
+export declare const CardWithBorder: any;

package/dist/Message/Message.stories.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import { Message } from './Message';
+import { theme } from '../theme';
+export default {
+    title: 'Message',
+    component: Message,
+};
+const Template = (props) => (React.createElement(Message, Object.assign({}, props), "Customer currently in BACS queue"));
+export const Default = Template.bind({});
+export const Info = Template.bind({});
+Info.args = {
+    type: 'info',
+};
+export const Warning = Template.bind({});
+Warning.args = {
+    type: 'warning',
+};
+export const WarningBubbleSmall = Template.bind({});
+WarningBubbleSmall.args = {
+    type: 'warning',
+    backgroundColor: theme.colors.bgSecondary,
+    sizeSmall: true,
+};
+export const InfoBubbleSmall = Template.bind({});
+InfoBubbleSmall.args = {
+    type: 'info',
+    backgroundColor: theme.colors.bgSecondary,
+    sizeSmall: true,
+};
+export const CardWithBorder = Template.bind({});
+CardWithBorder.args = {
+    type: 'card',
+    alignIcon: 'flex-start',
+    backgroundColor: theme.colors.white,
+    hasBorder: true,
+    borderColor: theme.colors.secondary,
+};
+//# sourceMappingURL=Message.stories.js.map

package/dist/Message/Message.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.stories.js","sourceRoot":"","sources":["../../src/Message/Message.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,OAAO,EAAgB,MAAM,WAAW,CAAA;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,eAAe;IACb,KAAK,EAAE,SAAS;IAChB,SAAS,EAAE,OAAO;CACnB,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,CACxC,oBAAC,OAAO,oBAAK,KAAK,sCAA4C,CAC/D,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,MAAM,CAAC,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAErC,IAAI,CAAC,IAAI,GAAG;IACV,IAAI,EAAE,MAAM;CACb,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,SAAS;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEnD,kBAAkB,CAAC,IAAI,GAAG;IACxB,IAAI,EAAE,SAAS;IACf,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,WAAW;IACzC,SAAS,EAAE,IAAI;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEhD,eAAe,CAAC,IAAI,GAAG;IACrB,IAAI,EAAE,MAAM;IACZ,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,WAAW;IACzC,SAAS,EAAE,IAAI;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE/C,cAAc,CAAC,IAAI,GAAG;IACpB,IAAI,EAAE,MAAM;IACZ,SAAS,EAAE,YAAY;IACvB,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK;IACnC,SAAS,EAAE,IAAI;IACf,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,SAAS;CACpC,CAAA"}

package/dist/Message/__tests__/Message.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Message/__tests__/Message.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import 'jest-styled-components';
+import { Message } from '../Message';
+it('default renders correctly', () => {
+    const { container } = render(React.createElement(Message, null, "This is an infomation message for the customer!"));
+    expect(container).toMatchSnapshot();
+});
+it('warning renders correctly', () => {
+    const { container } = render(React.createElement(Message, { type: "warning", sizeSmall: false }, "This is a warning message for the customer!"));
+    expect(container).toMatchSnapshot();
+});
+it('info renders correctly', () => {
+    const { container } = render(React.createElement(Message, { type: "info" }, "This is a infomational message for the customer!"));
+    expect(container).toMatchSnapshot();
+});
+it('icon prop render correctly', () => {
+    const { container } = render(React.createElement(Message, { type: "warning" }, "This is a warning message for the customer!"));
+    expect(container).toHaveTextContent('This is a warning message for the customer!');
+});
+it('warning bubble size small renders correctly', () => {
+    const { container } = render(React.createElement(Message, { type: "warning-bubble", backgroundColor: "#FAF3EE", sizeSmall: true }, "This is a warning bubble message for the customer!"));
+    expect(container).toHaveTextContent('This is a warning bubble message for the customer!');
+});
+//# sourceMappingURL=Message.js.map

package/dist/Message/__tests__/Message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.js","sourceRoot":"","sources":["../../../src/Message/__tests__/Message.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,yCAAyC,CAAA;AAChD,OAAO,wBAAwB,CAAA;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AAEpC,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACnC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,0DAA0D,CACnE,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAA;AACrC,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACnC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,SAAS,EAAC,SAAS,EAAE,KAAK,kDAE9B,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAA;AACrC,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,wBAAwB,EAAE,GAAG,EAAE;IAChC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,MAAM,uDAEV,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAA;AACrC,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,4BAA4B,EAAE,GAAG,EAAE;IACpC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,SAAS,kDAEb,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,iBAAiB,CACjC,6CAA6C,CAC9C,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,6CAA6C,EAAE,GAAG,EAAE;IACrD,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,gBAAgB,EAAC,eAAe,EAAC,SAAS,EAAC,SAAS,EAAE,IAAI,yDAE9D,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,iBAAiB,CACjC,oDAAoD,CACrD,CAAA;AACH,CAAC,CAAC,CAAA"}

package/dist/Message/index.d.ts

@@ -0,0 +1 @@
+export * from './Message';

package/dist/Message/index.js

@@ -0,0 +1,2 @@
+export * from './Message';
+//# sourceMappingURL=index.js.map

package/dist/Message/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Message/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA"}

package/dist/RadioButton/Container.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Container: () => JSX.Element;

package/dist/RadioButton/Container.js

@@ -0,0 +1,9 @@
+import React, { useState } from 'react';
+import { RadioButton } from './RadioButton';
+export const Container = () => {
+    const [checked, setChecked] = useState('');
+    return (React.createElement("form", null,
+        React.createElement(RadioButton, { id: "radioButtonOne", label: "What a lovely label", value: checked, onChange: () => setChecked('radioButtonOne'), checked: checked === 'radioButtonOne' }),
+        React.createElement(RadioButton, { id: "radioButtonTwo", label: "What a lovely second label", value: checked, onChange: () => setChecked('radioButtonTwo'), checked: checked === 'radioButtonTwo' })));
+};
+//# sourceMappingURL=Container.js.map

package/dist/RadioButton/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/RadioButton/Container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAA;IAE1C,OAAO,CACL;QACE,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAC5C,OAAO,EAAE,OAAO,KAAK,gBAAgB,GACrC;QAEF,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAC5C,OAAO,EAAE,OAAO,KAAK,gBAAgB,GACrC,CACG,CACR,CAAA;AACH,CAAC,CAAA"}

package/dist/RadioButton/RadioButton.d.ts

@@ -0,0 +1,10 @@
+import { FC, ChangeEvent } from 'react';
+import { MarginProps } from '../utils/space';
+export type RadioButtonProps = {
+    id?: string;
+    label: string;
+    checked?: boolean;
+    value: string;
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
+} & MarginProps;
+export declare const RadioButton: FC<RadioButtonProps>;

package/dist/RadioButton/RadioButton.js

@@ -0,0 +1,68 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import styled from 'styled-components';
+import { focusOutline } from '../utils/focusOutline';
+import { Box } from '../Box';
+import { theme } from '../theme';
+import { useUniqueId } from '../utils/id';
+import { useDeprecatedWarning } from '../utils/deprecated';
+export const RadioButton = (props) => {
+    const { id: idProp, label, checked, value, onChange } = props, marginProps = __rest(props, ["id", "label", "checked", "value", "onChange"]);
+    useDeprecatedWarning({
+        title: 'RadioButton',
+        message: 'The RadioButton component has been deprecated. Please use the new RadioGroup component instead.',
+        componentProps: props,
+    });
+    const id = useUniqueId(idProp);
+    return (React.createElement(Box, Object.assign({ flex: true, alignItems: "center" }, marginProps),
+        React.createElement(RadioInput, { id: id, type: "radio", checked: checked, value: value, onChange: onChange }),
+        React.createElement(RadioLabel, { htmlFor: id },
+            React.createElement(FakeInput, { checked: checked }),
+            React.createElement(Text, null, label))));
+};
+const FakeInput = styled.div `
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  background-color: ${theme.colors.white};
+  margin-right: 10px;
+  border: ${({ checked }) => checked
+    ? `8px solid ${theme.colors.success}`
+    : `1px solid ${theme.colors.outline}`};
+`;
+const RadioLabel = styled.label `
+  font-family: 'Gordita', sans-serif;
+  text-transform: none;
+  font-size: 16px;
+  line-height: 17px;
+  color: ${theme.colors.secondary};
+  margin-bottom: 0;
+  display: flex;
+  cursor: pointer;
+`;
+const RadioInput = styled.input `
+  position: absolute;
+  opacity: 0;
+  height: 0;
+  width: 0;
+
+  ${focusOutline({
+    selector: `&:focus-visible ~ ${RadioLabel} ${FakeInput}`,
+})}
+`;
+// needed because the text is top aligned in its viewbox
+const Text = styled.span `
+  position: relative;
+  bottom: -5px;
+`;
+//# sourceMappingURL=RadioButton.js.map

package/dist/RadioButton/RadioButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.js","sourceRoot":"","sources":["../../src/RadioButton/RadioButton.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAA0B,MAAM,OAAO,CAAA;AAC9C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAEpD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAE5B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAEzC,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAc1D,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,KAAK,EAAE,EAAE;IACzD,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,KAAqB,KAAK,EAArB,WAAW,UAAK,KAAK,EAAvE,+CAA+D,CAAQ,CAAA;IAE7E,oBAAoB,CAAC;QACnB,KAAK,EAAE,aAAa;QACpB,OAAO,EACL,iGAAiG;QACnG,cAAc,EAAE,KAAK;KACtB,CAAC,CAAA;IAEF,MAAM,EAAE,GAAG,WAAW,CAAC,MAAM,CAAC,CAAA;IAE9B,OAAO,CACL,oBAAC,GAAG,kBAAC,IAAI,QAAC,UAAU,EAAC,QAAQ,IAAK,WAAW;QAC3C,oBAAC,UAAU,IACT,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,GAClB;QAEF,oBAAC,UAAU,IAAC,OAAO,EAAE,EAAE;YACrB,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO,GAAI;YAC/B,oBAAC,IAAI,QAAE,KAAK,CAAQ,CACT,CACT,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAY;;;;sBAIlB,KAAK,CAAC,MAAM,CAAC,KAAK;;YAE5B,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CACxB,OAAO;IACL,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;IACrC,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;CAC1C,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;WAKpB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;CAIhC,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;;IAM3B,YAAY,CAAC;IACb,QAAQ,EAAE,qBAAqB,UAAU,IAAI,SAAS,EAAE;CACzD,CAAC;CACH,CAAA;AAED,wDAAwD;AACxD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAGvB,CAAA"}

package/dist/RadioButton/RadioButton.stories.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { RadioButtonProps } from './RadioButton';
+declare const _default: {
+    title: string;
+    component: React.FC<RadioButtonProps>;
+    argTypes: {
+        onChange: {
+            action: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: any;
+export declare const Checked: any;
+export declare const WorkingExample: any;

package/dist/RadioButton/RadioButton.stories.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { RadioButton } from './RadioButton';
+import { Container } from './Container';
+import { noop } from '../utils/noop';
+export default {
+    title: 'Radio Button',
+    component: RadioButton,
+    argTypes: { onChange: { action: 'clicked' } },
+};
+const Template = (props) => React.createElement(RadioButton, Object.assign({}, props));
+export const Default = Template.bind({});
+Default.args = {
+    id: 'radioButton',
+    label: 'What a lovely label',
+    value: 'radioButton',
+    onChange: noop,
+    checked: false,
+};
+export const Checked = Template.bind({});
+Checked.args = {
+    id: 'radioButton',
+    label: 'What a lovely label',
+    value: 'radioButton',
+    onChange: noop,
+    checked: true,
+};
+const ContainerTemplate = () => React.createElement(Container, null);
+export const WorkingExample = ContainerTemplate.bind({});
+//# sourceMappingURL=RadioButton.stories.js.map

package/dist/RadioButton/RadioButton.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.stories.js","sourceRoot":"","sources":["../../src/RadioButton/RadioButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAEpC,eAAe;IACb,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAuB,EAAE,EAAE,CAAC,oBAAC,WAAW,oBAAK,KAAK,EAAI,CAAA;AAExE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,qBAAqB;IAC5B,KAAK,EAAE,aAAa;IACpB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,KAAK;CACf,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,qBAAqB;IAC5B,KAAK,EAAE,aAAa;IACpB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,IAAI;CACd,CAAA;AAED,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,oBAAC,SAAS,OAAG,CAAA;AAE7C,MAAM,CAAC,MAAM,cAAc,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/RadioButton/__tests__/RadioButton.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/RadioButton/__tests__/RadioButton.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import 'jest-styled-components';
+import { RadioButton } from '../RadioButton';
+test('renders - checked', () => {
+    const { container } = render(React.createElement(RadioButton, { id: "radioButtonOne", label: "What a lovely label", value: true, checked: true, onChange: str => { } }));
+    expect(container.firstChild).toMatchSnapshot();
+});
+test('renders - unchecked', () => {
+    const { container } = render(React.createElement(RadioButton, { id: "radioButtonOne", label: "What a lovely label", value: false, checked: false, onChange: str => { } }));
+    expect(container.firstChild).toMatchSnapshot();
+});
+//# sourceMappingURL=RadioButton.js.map

package/dist/RadioButton/__tests__/RadioButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.js","sourceRoot":"","sources":["../../../src/RadioButton/__tests__/RadioButton.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,wBAAwB,CAAC;AAC9C,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAE3C,IAAI,CAAC,mBAAmB,EAAE,GAAG,EAAE;IAC7B,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CACxB,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,IAAI,EACX,OAAO,EAAE,IAAI,EACb,QAAQ,EAAE,GAAG,CAAC,EAAE,GAAE,CAAC,GACnB,CACH,CAAC;IACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAC;AACjD,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,qBAAqB,EAAE,GAAG,EAAE;IAC/B,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CACxB,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,GAAG,CAAC,EAAE,GAAE,CAAC,GACnB,CACH,CAAC;IACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAC;AACjD,CAAC,CAAC,CAAC"}

package/dist/RadioButton/index.d.ts

@@ -0,0 +1 @@
+export { RadioButton } from './RadioButton';

package/dist/RadioButton/index.js

@@ -0,0 +1,2 @@
+export { RadioButton } from './RadioButton';
+//# sourceMappingURL=index.js.map

package/dist/RadioButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/RadioButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrshmllw/smores-react",
-  "version": "3.0.5",
+  "version": "3.0.6",
   "main": "./dist/index.js",
   "description": "Collection of React components used by Marshmallow Technology",
   "keywords": [