{"version":3,"file":"RadioInput.bhs4fxfx.js","sources":["../../../wwwdev/esm/components/shared/inputs/radio/RadioInput.tsx"],"sourcesContent":["import { Spacing4, Spacing8 } from 'autogen/design-tokens/tokens';\r\nimport { Typography } from 'components/generic/typography';\r\nimport {\r\n    InvalidInputFocusStyle,\r\n    InvalidInputStyle,\r\n    ValidInputDisabledStyle,\r\n    ValidInputStyle\r\n} from 'components/shared/inputs/theme';\r\nimport React, { useId, useState } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport type { BaseInputProps } from '../shared/types';\r\nimport Flex from 'components/Layout/components/Flex';\r\nimport HelperText from '../components/HelperText';\r\n\r\nconst Container = styled.div`\r\n    display: inline-flex;\r\n`;\r\n\r\nconst LabelContainer = styled.label`\r\n    display: inline-flex;\r\n    align-items: start;\r\n    gap: ${Spacing8};\r\n    margin: 0;\r\n`;\r\n\r\nconst Input = styled.input`\r\n    position: absolute;\r\n    width: 0;\r\n    height: 0;\r\n    opacity: 0;\r\n`;\r\n\r\nconst Graphics = styled.div<{ isInvalid?: boolean }>`\r\n    position: relative;\r\n    width: 24px;\r\n    height: 24px;\r\n    border-radius: 50%;\r\n    ${ValidInputStyle}\r\n\r\n    ${Input}:hover + & {\r\n        &:after {\r\n            content: '';\r\n            position: absolute;\r\n            left: 50%;\r\n            top: 50%;\r\n            transform: translate(-50%, -50%);\r\n            width: 8px;\r\n            height: 8px;\r\n            border-radius: 50%;\r\n        }\r\n    }\r\n\r\n    ${Input}:focus + & {\r\n        outline: ${({ theme }) => `solid 2px ${theme.ColorBorderFocus};`};\r\n        outline-offset: ${Spacing4};\r\n    }\r\n\r\n    ${Input}:disabled + & {\r\n        ${ValidInputDisabledStyle}\r\n    }\r\n\r\n   \r\n\r\n    ${Input}:checked + & {\r\n        border-color: ${({ theme, isInvalid }) => (!isInvalid ? theme.ColorBorderBrand : theme.ColorBorderError)};\r\n        background-color: ${({ theme, isInvalid }) => (!isInvalid ? theme.ColorBackgroundBrand : theme.ColorBackgroundErrorDark)};\r\n\r\n        &:after {\r\n            content: '';\r\n            position: absolute;\r\n            left: 50%;\r\n            top: 50%;\r\n            transform: translate(-50%, -50%);\r\n            width: 8px;\r\n            height: 8px;\r\n            background-color: ${({ theme }) => theme.ColorIconPrimaryInverted};\r\n            border-radius: 50%;\r\n        }\r\n    }\r\n\r\n    ${({ isInvalid, theme }) =>\r\n        isInvalid &&\r\n        css`\r\n            border: 1px solid ${theme.ColorBorderError};\r\n            ${InvalidInputStyle}\r\n\r\n            ${Input}:required:invalid + & {\r\n                ${InvalidInputStyle}\r\n            }\r\n\r\n            ${Input}:invalid:focus + & {\r\n                ${InvalidInputFocusStyle}\r\n            }\r\n        `}\r\n\r\n    ${Input}:checked:disabled + & {\r\n        ${ValidInputDisabledStyle}\r\n    }\r\n`;\r\n\r\ntype ControlledRadioProps = React.InputHTMLAttributes<HTMLInputElement> & BaseInputProps;\r\n\r\nexport const ControlledRadio = React.forwardRef<HTMLInputElement, ControlledRadioProps>((props, ref) => {\r\n    const { isInvalid: controlledInvalidState, label, helperText } = props;\r\n    const [isInvalidUncontrolledState, setIsInvalidUncontrolledState] = useState<boolean>(false);\r\n    const isInvalid = controlledInvalidState || isInvalidUncontrolledState;\r\n    const helperTextId = useId();\r\n\r\n    const radio = (\r\n        <Container>\r\n            <Input\r\n                ref={ref}\r\n                type=\"radio\"\r\n                onInvalid={() => setIsInvalidUncontrolledState(true)}\r\n                aria-describedby={helperTextId}\r\n                {...props}\r\n            />\r\n            <Graphics isInvalid={isInvalid} />\r\n        </Container>\r\n    );\r\n\r\n    if (label) {\r\n        return (\r\n            <LabelContainer>\r\n                {radio}\r\n                <Flex.Column gap={Spacing4}>\r\n                    <Typography.Label size=\"M\">{label}</Typography.Label>\r\n                    {helperText && <HelperText helperText={helperText} helperTextId={helperTextId} />}\r\n                </Flex.Column>\r\n            </LabelContainer>\r\n        );\r\n    }\r\n\r\n    return radio;\r\n});\r\n\r\nexport default ControlledRadio;\r\n"],"names":["Container","styled","div","withConfig","displayName","componentId","LabelContainer","label","Spacing8","Input","input","Graphics","ValidInputStyle","theme","ColorBorderFocus","Spacing4","ValidInputDisabledStyle","isInvalid","ColorBorderError","ColorBorderBrand","ColorBackgroundErrorDark","ColorBackgroundBrand","ColorIconPrimaryInverted","css","InvalidInputStyle","InvalidInputFocusStyle","ControlledRadio","React","forwardRef","props","ref","controlledInvalidState","helperText","isInvalidUncontrolledState","setIsInvalidUncontrolledState","useState","helperTextId","useId","radio","jsx","jsxs","Flex","Typography","HelperText"],"mappings":"6MAcA,MAAMA,EAAYC,EAAOC,IAAGC,WAAA,CAAAC,YAAA,wBAAAC,YAAA,aAAA,CAE3B,EAAA,CAAA,sBAAA,CAAA,EAEKC,EAAiBL,EAAOM,MAAKJ,WAAA,CAAAC,YAAA,6BAAAC,YAAA,aAAA,CAAA,EAAA,CAAA,6CAAA,YAAA,EAGxBG,CAAQ,EAIbC,EAAQR,EAAOS,MAAKP,WAAA,CAAAC,YAAA,oBAAAC,YAAA,aAAA,CAKzB,EAAA,CAAA,+CAAA,CAAA,EAEKM,EAAWV,EAAOC,IAAGC,WAAA,CAAAC,YAAA,uBAAAC,YAAA,aAAA,CAAA,EAAA,CAAA,8DAAA,IAAA,4IAAA,sBAAA,mBAAA,KAAA,iBAAA,IAAA,6BAAA,qBAAA,+HAAA,wBAAA,IAAA,yBAAA,GAAA,EAKrBO,EAEAH,EAaAA,EACa,CAAC,CAAEI,MAAAA,CAAM,IAAM,aAAaA,EAAMC,gBAAgB,IAC3CC,EAGpBN,EACIO,EAKJP,EACkB,CAAC,CAAEI,MAAAA,EAAOI,UAAAA,CAAU,IAAQA,EAAqCJ,EAAMK,iBAA/BL,EAAMM,iBAC1C,CAAC,CAAEN,MAAAA,EAAOI,UAAAA,CAAU,IAAQA,EAAyCJ,EAAMO,yBAAnCP,EAAMQ,qBAU1C,CAAC,CAAER,MAAAA,CAAM,IAAMA,EAAMS,yBAK/C,CAAC,CAAEL,UAAAA,EAAWJ,MAAAA,CAAM,IAClBI,GACAM,uFACwBV,EAAMK,iBACxBM,EAEAf,EACIe,EAGJf,EACIgB,CAAsB,EAIlChB,EACIO,CAAuB,EAMpBU,EAAkBC,EAAMC,WAAmD,CAACC,EAAOC,IAAQ,CAC9F,KAAA,CAAEb,UAAWc,EAAwBxB,MAAAA,EAAOyB,WAAAA,CAAAA,EAAeH,EAC3D,CAACI,EAA4BC,CAA6B,EAAIC,EAAAA,SAAkB,EAAK,EACrFlB,EAAYc,GAA0BE,EACtCG,EAAeC,EAAAA,MAAM,EAErBC,SACDtC,EACG,CAAA,SAAA,CAAAuC,EAAAA,IAAC9B,EACG,CAAA,IAAAqB,EACA,KAAK,QACL,UAAW,IAAMI,EAA8B,EAAI,EACnD,mBAAkBE,EACdP,GAAAA,CACN,CAAA,EACFU,MAAC5B,GAAS,UAAAM,CAAwB,CAAA,CAAA,EACtC,EAGJ,OAAIV,SAEKD,EACIgC,CAAAA,SAAAA,CAAAA,EACAE,EAAA,KAAAC,EAAK,OAAL,CAAY,IAAK1B,EACd,SAAA,CAAAwB,EAAA,IAACG,EAAW,MAAX,CAAiB,KAAK,IAAKnC,SAAMA,EAAA,EACjCyB,GAAcO,EAAAA,IAACI,EAAW,CAAA,WAAAX,EAAwB,aAAAI,IACvD,CAAA,CAAA,EACJ,EAIDE,CACX,CAAC"}