@flipdish/portal-library 7.5.0 → 7.5.2

package/dist/components/atoms/CircularProgress/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/CircularProgress/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/sort-type-constituents */\n/* eslint-disable react/jsx-sort-props */\n// atoms/CircularProgress/CircularProgress.tsx\nimport { useId } from 'react'\n\nimport Box from '@mui/material/Box';\nimport MuiCircularProgress, { type CircularProgressProps as MuiCircularProgressProps } from '@mui/material/CircularProgress';\nimport { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\n/*\n    Key Features:\n    ✅ Based on MUI CircularProgress - Extends the base component\n    ✅ Light & Dark mode support - Uses conic gradient provided in Figma design specs\n    ✅ Optional status text - Pass text prop to display below spinner\n    ✅ Determinate progress - Set variant=\"determinate\" and value when duration is known\n    ✅ Custom sizes - small=20px, medium=40px, large=60px\n    ✅ ARIA compliant - Includes proper aria labels and live regions\n    ✅ Simple API - Only size, value, text, and variant props\n*/\n\ntype CircularProgressSize = 'small' | 'medium' | 'large';\n\nconst SIZE_MAP: Record<CircularProgressSize, number> = {\n    small: 20,\n    medium: 40,\n    large: 60,\n};\n\nexport interface CircularProgressProps extends Omit<MuiCircularProgressProps, 'color' | 'size'>\n{\n    /**\n     * The size of the circular progress\n     * @default 'medium'\n     */\n    size?: CircularProgressSize;\n    /**\n     * Optional text to display below the progress indicator\n     */\n    text?: string;\n    /**\n     * The value of the progress indicator for determinate variant\n     * Value between 0 and 100\n     */\n    value?: number;\n    /**\n     * The variant of the progress indicator\n     * @default 'indeterminate'\n     */\n    variant?: 'determinate' | 'indeterminate';\n}\n\nconst ProgressWrapper = styled(Box)({\n    display: 'inline-flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    gap: 8,\n});\n\nconst StyledCircularProgress = styled(MuiCircularProgress, { shouldForwardProp: (prop) => prop !== 'gradientId' })\n    <{ gradientId: string }>(({ variant, theme, gradientId }) =>\n    {\n        const isDark = theme.palette.mode === 'dark';\n        const isDeterminate = variant === 'determinate';\n        const progressGradientId = `${gradientId}-${isDark ? 'dark' : 'light'}-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n        return {\n            '& .MuiCircularProgress-svg': {\n                animation: `${isDeterminate ? 'none' : 'rotate-circular 1.4s linear infinite'}`,        // Smooth continuous rotation for indeterminate\n                filter: isDark\n                    ? 'drop-shadow(0px 2px 4px rgba(255, 255, 255, 0.1))'\n                    : 'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.1))',\n            },\n            '& .MuiCircularProgress-circle': {\n                stroke: `url(#${progressGradientId})`,\n                strokeLinecap: 'round',\n                strokeDasharray: '110, 200',    // Adjust the gap - increase first value to reduce gap\n                strokeDashoffset: 0,\n                animation: 'none'               // Suppress default animation as we handle rotation at SVG level\n            },\n            '@keyframes rotate-circular': {\n                '0%': {\n                    transform: 'rotate(0deg)',\n                },\n                '100%': {\n                    transform: 'rotate(360deg)',\n                },\n            },\n        };\n    });\n\n/**\n * CircularProgress component for showing process progress on buttons or UI elements.\n * Supports light and dark themes with conic gradient styling.\n */\n\nexport const CircularProgress: React.FC<CircularProgressProps> = ({\n    size = 'medium',\n    text,\n    value,\n    variant = 'indeterminate',\n    ...props\n}) =>\n{\n    const uniqueId = useId().replace(/:/g, '');\n    const isDeterminate = variant === 'determinate';\n    const sizeInPixels = SIZE_MAP[size];\n\n    if (isDeterminate)\n    {\n        // Clamp value between 0 and 100 for determinate variant\n        value = Math.min(100, Math.max(0, Number(value) || 0));\n    }\n\n    // Define unique gradient IDs based on theme and variant to support simultaneous instances (avoid DOM gradient ID conflicts)\n    const progressGradientLightId = `${uniqueId}-light-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n    const progressGradientDarkId = `${uniqueId}-dark-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n    return (\n        <ProgressWrapper>\n            {/* Hidden SVG for gradient definitions */}\n            <svg width=\"0\" height=\"0\" style={{ position: 'absolute' }}>\n                <defs>\n                    {/* Light mode gradient */}\n                    <linearGradient id={progressGradientLightId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n                        <stop offset=\"0%\" stopColor=\"rgba(0, 0, 0, 1)\" />\n                        <stop offset=\"100%\" stopColor={`${isDeterminate ? 'rgba(0, 0, 0, 1)' : 'rgba(0, 0, 0, 0)'}`} />\n                    </linearGradient>\n\n                    {/* Dark mode gradient */}\n                    <linearGradient id={progressGradientDarkId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n                        <stop offset=\"0%\" stopColor=\"rgba(255, 255, 255, 1)\" />\n                        <stop offset=\"100%\" stopColor={`${isDeterminate ? 'rgba(255, 255, 255, 1)' : 'rgba(255, 255, 255, 0)'}`} />\n                    </linearGradient>\n                </defs>\n            </svg>\n\n            <StyledCircularProgress\n                gradientId={uniqueId}\n                size={sizeInPixels}\n                variant={variant}\n                value={value}\n                aria-label={text || 'Loading'}\n                aria-valuenow={variant === 'determinate' ? value : undefined}\n                aria-valuemin={variant === 'determinate' ? 0 : undefined}\n                aria-valuemax={variant === 'determinate' ? 100 : undefined}\n                {...props}\n            />\n\n            {text && (\n                <Typography\n                    variant=\"caption\"\n                    color=\"text.secondary\"\n                    aria-live=\"polite\"\n                >\n                    {text}\n                </Typography>\n            )}\n        </ProgressWrapper>\n    );\n};\n\nexport default CircularProgress;"],"names":["SIZE_MAP","small","medium","large","ProgressWrapper","styled","Box","display","flexDirection","alignItems","gap","StyledCircularProgress","MuiCircularProgress","shouldForwardProp","prop","variant","theme","gradientId","isDark","palette","mode","isDeterminate","animation","filter","stroke","strokeLinecap","strokeDasharray","strokeDashoffset","transform","CircularProgress","size","text","value","props","uniqueId","useId","replace","sizeInPixels","Math","min","max","Number","progressGradientLightId","progressGradientDarkId","_jsxs","children","_jsx","width","height","style","position","id","x1","y1","x2","y2","offset","stopColor","undefined","Typography","color"],"mappings":"6QAwBA,MAAMA,EAAiD,CACnDC,MAAO,GACPC,OAAQ,GACRC,MAAO,IA0BLC,EAAkBC,EAAAA,OAAOC,EAAPD,CAAY,CAChCE,QAAS,cACTC,cAAe,SACfC,WAAY,SACZC,IAAK,IAGHC,EAAyBN,EAAAA,OAAOO,EAAqB,CAAEC,kBAAoBC,GAAkB,eAATA,GAA3DT,EACF,EAAGU,UAASC,QAAOC,iBAExC,MAAMC,EAAgC,SAAvBF,EAAMG,QAAQC,KACvBC,EAA4B,gBAAZN,EAGtB,MAAO,CACH,6BAA8B,CAC1BO,UAAW,IAAGD,EAAgB,OAAS,wCACvCE,OAAQL,EACF,oDACA,+CAEV,gCAAiC,CAC7BM,OAAQ,QAVW,GAAGP,KAAcC,EAAS,OAAS,WAAWG,EAAgB,cAAgB,qBAWjGI,cAAe,QACfC,gBAAiB,WACjBC,iBAAkB,EAClBL,UAAW,QAEf,6BAA8B,CAC1B,KAAM,CACFM,UAAW,gBAEf,OAAQ,CACJA,UAAW,uBAWlBC,EAAoD,EAC7DC,OAAO,SACPC,OACAC,QACAjB,UAAU,mBACPkB,MAGH,MAAMC,EAAWC,EAAAA,QAAQC,QAAQ,KAAM,IACjCf,EAA4B,gBAAZN,EAChBsB,EAAerC,EAAS8B,GAE1BT,IAGAW,EAAQM,KAAKC,IAAI,IAAKD,KAAKE,IAAI,EAAGC,OAAOT,IAAU,KAIvD,MAAMU,EAA0B,GAAGR,WAAkBb,EAAgB,cAAgB,kBAC/EsB,EAAyB,GAAGT,UAAiBb,EAAgB,cAAgB,kBAEnF,OACIuB,EAAAA,KAACxC,EAAe,CAAAyC,SAAA,CAEZC,EAAAA,WAAKC,MAAM,IAAIC,OAAO,IAAIC,MAAO,CAAEC,SAAU,YAAYL,SACrDD,EAAAA,KAAA,OAAA,CAAAC,SAAA,CAEID,EAAAA,KAAA,iBAAA,CAAgBO,GAAIT,EAAyBU,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC7EC,EAAAA,IAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,qBAC5BX,EAAAA,IAAA,OAAA,CAAMU,OAAO,OAAOC,UAAW,IAAGpC,EAAgB,mBAAqB,yBAI3EuB,EAAAA,KAAA,iBAAA,CAAgBO,GAAIR,EAAwBS,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC5EC,EAAAA,IAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,2BAC5BX,EAAAA,YAAMU,OAAO,OAAOC,UAAW,IAAGpC,EAAgB,yBAA2B,oCAKzFyB,EAAAA,IAACnC,EAAsB,CACnBM,WAAYiB,EACZJ,KAAMO,EACNtB,QAASA,EACTiB,MAAOA,EAAK,aACAD,GAAQ,UAAS,gBACF,gBAAZhB,EAA4BiB,OAAQ0B,kBACxB,gBAAZ3C,EAA4B,OAAI2C,EAAS,gBAC7B,gBAAZ3C,EAA4B,SAAM2C,KAC7CzB,IAGPF,GACGe,EAAAA,IAACa,EAAU,CACP5C,QAAQ,UACR6C,MAAM,iBAAgB,YACZ,SAAQf,SAEjBd"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/CircularProgress/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/sort-type-constituents */\n/* eslint-disable react/jsx-sort-props */\n// atoms/CircularProgress/CircularProgress.tsx\nimport { useId } from 'react';\n\nimport Box from '@mui/material/Box';\nimport MuiCircularProgress, {\n  type CircularProgressProps as MuiCircularProgressProps,\n} from '@mui/material/CircularProgress';\nimport { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\n/*\n    Key Features:\n    ✅ Based on MUI CircularProgress - Extends the base component\n    ✅ Light & Dark mode support - Uses conic gradient provided in Figma design specs\n    ✅ Optional status text - Pass text prop to display below spinner\n    ✅ Determinate progress - Set variant=\"determinate\" and value when duration is known\n    ✅ Custom sizes - small=20px, medium=40px, large=60px\n    ✅ ARIA compliant - Includes proper aria labels and live regions\n    ✅ Simple API - Only size, value, text, and variant props\n*/\n\ntype CircularProgressSize = 'small' | 'medium' | 'large';\n\nconst SIZE_MAP: Record<CircularProgressSize, number> = {\n  small: 20,\n  medium: 40,\n  large: 60,\n};\n\nexport interface CircularProgressProps extends Omit<MuiCircularProgressProps, 'color' | 'size'> {\n  /**\n   * The size of the circular progress\n   * @default 'medium'\n   */\n  size?: CircularProgressSize;\n  /**\n   * Optional text to display below the progress indicator\n   */\n  text?: string;\n  /**\n   * The value of the progress indicator for determinate variant\n   * Value between 0 and 100\n   */\n  value?: number;\n  /**\n   * The variant of the progress indicator\n   * @default 'indeterminate'\n   */\n  variant?: 'determinate' | 'indeterminate';\n}\n\nconst ProgressWrapper = styled(Box)({\n  display: 'inline-flex',\n  flexDirection: 'column',\n  alignItems: 'center',\n  gap: 8,\n});\n\nconst StyledCircularProgress = styled(MuiCircularProgress, {\n  shouldForwardProp: (prop) => prop !== 'gradientId',\n})<{ gradientId: string }>(({ variant, theme, gradientId }) => {\n  const isDark = theme.palette.mode === 'dark';\n  const isDeterminate = variant === 'determinate';\n  const progressGradientId = `${gradientId}-${isDark ? 'dark' : 'light'}-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n  return {\n    '& .MuiCircularProgress-svg': {\n      animation: `${isDeterminate ? 'none' : 'rotate-circular 1.4s linear infinite'}`, // Smooth continuous rotation for indeterminate\n      filter: isDark\n        ? 'drop-shadow(0px 2px 4px rgba(255, 255, 255, 0.1))'\n        : 'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.1))',\n    },\n    '& .MuiCircularProgress-circle': {\n      stroke: `url(#${progressGradientId})`,\n      strokeLinecap: 'round',\n      strokeDasharray: '110, 200', // Adjust the gap - increase first value to reduce gap\n      strokeDashoffset: 0,\n      animation: 'none', // Suppress default animation as we handle rotation at SVG level\n    },\n    '@keyframes rotate-circular': {\n      '0%': {\n        transform: 'rotate(0deg)',\n      },\n      '100%': {\n        transform: 'rotate(360deg)',\n      },\n    },\n  };\n});\n\n/**\n * CircularProgress component for showing process progress on buttons or UI elements.\n * Supports light and dark themes with conic gradient styling.\n */\n\nexport const CircularProgress: React.FC<CircularProgressProps> = ({\n  size = 'medium',\n  text,\n  value,\n  variant = 'indeterminate',\n  ...props\n}) => {\n  const uniqueId = useId().replace(/:/g, '');\n  const isDeterminate = variant === 'determinate';\n  const sizeInPixels = SIZE_MAP[size];\n\n  if (isDeterminate) {\n    // Clamp value between 0 and 100 for determinate variant\n    value = Math.min(100, Math.max(0, Number(value) || 0));\n  }\n\n  // Define unique gradient IDs based on theme and variant to support simultaneous instances (avoid DOM gradient ID conflicts)\n  const progressGradientLightId = `${uniqueId}-light-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n  const progressGradientDarkId = `${uniqueId}-dark-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n  return (\n    <ProgressWrapper>\n      {/* Hidden SVG for gradient definitions */}\n      <svg width=\"0\" height=\"0\" style={{ position: 'absolute' }}>\n        <defs>\n          {/* Light mode gradient */}\n          <linearGradient id={progressGradientLightId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n            <stop offset=\"0%\" stopColor=\"rgba(0, 0, 0, 1)\" />\n            <stop offset=\"100%\" stopColor={`${isDeterminate ? 'rgba(0, 0, 0, 1)' : 'rgba(0, 0, 0, 0)'}`} />\n          </linearGradient>\n\n          {/* Dark mode gradient */}\n          <linearGradient id={progressGradientDarkId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n            <stop offset=\"0%\" stopColor=\"rgba(255, 255, 255, 1)\" />\n            <stop\n              offset=\"100%\"\n              stopColor={`${isDeterminate ? 'rgba(255, 255, 255, 1)' : 'rgba(255, 255, 255, 0)'}`}\n            />\n          </linearGradient>\n        </defs>\n      </svg>\n\n      <StyledCircularProgress\n        gradientId={uniqueId}\n        size={sizeInPixels}\n        variant={variant}\n        value={value}\n        aria-label={text || 'Loading'}\n        aria-valuenow={variant === 'determinate' ? value : undefined}\n        aria-valuemin={variant === 'determinate' ? 0 : undefined}\n        aria-valuemax={variant === 'determinate' ? 100 : undefined}\n        {...props}\n      />\n\n      {text && (\n        <Typography variant=\"caption\" color=\"text.secondary\" aria-live=\"polite\">\n          {text}\n        </Typography>\n      )}\n    </ProgressWrapper>\n  );\n};\n\nexport default CircularProgress;\n"],"names":["SIZE_MAP","small","medium","large","ProgressWrapper","styled","Box","display","flexDirection","alignItems","gap","StyledCircularProgress","MuiCircularProgress","shouldForwardProp","prop","variant","theme","gradientId","isDark","palette","mode","isDeterminate","animation","filter","stroke","strokeLinecap","strokeDasharray","strokeDashoffset","transform","CircularProgress","size","text","value","props","uniqueId","useId","replace","sizeInPixels","Math","min","max","Number","progressGradientLightId","progressGradientDarkId","_jsxs","children","_jsx","width","height","style","position","id","x1","y1","x2","y2","offset","stopColor","undefined","Typography","color"],"mappings":"6QA0BA,MAAMA,EAAiD,CACrDC,MAAO,GACPC,OAAQ,GACRC,MAAO,IAyBHC,EAAkBC,EAAAA,OAAOC,EAAPD,CAAY,CAClCE,QAAS,cACTC,cAAe,SACfC,WAAY,SACZC,IAAK,IAGDC,EAAyBN,EAAAA,OAAOO,EAAqB,CACzDC,kBAAoBC,GAAkB,eAATA,GADAT,EAEJ,EAAGU,UAASC,QAAOC,iBAC5C,MAAMC,EAAgC,SAAvBF,EAAMG,QAAQC,KACvBC,EAA4B,gBAAZN,EAGtB,MAAO,CACL,6BAA8B,CAC5BO,UAAW,IAAGD,EAAgB,OAAS,wCACvCE,OAAQL,EACJ,oDACA,+CAEN,gCAAiC,CAC/BM,OAAQ,QAVe,GAAGP,KAAcC,EAAS,OAAS,WAAWG,EAAgB,cAAgB,qBAWrGI,cAAe,QACfC,gBAAiB,WACjBC,iBAAkB,EAClBL,UAAW,QAEb,6BAA8B,CAC5B,KAAM,CACJM,UAAW,gBAEb,OAAQ,CACNA,UAAW,uBAWNC,EAAoD,EAC/DC,OAAO,SACPC,OACAC,QACAjB,UAAU,mBACPkB,MAEH,MAAMC,EAAWC,EAAAA,QAAQC,QAAQ,KAAM,IACjCf,EAA4B,gBAAZN,EAChBsB,EAAerC,EAAS8B,GAE1BT,IAEFW,EAAQM,KAAKC,IAAI,IAAKD,KAAKE,IAAI,EAAGC,OAAOT,IAAU,KAIrD,MAAMU,EAA0B,GAAGR,WAAkBb,EAAgB,cAAgB,kBAC/EsB,EAAyB,GAAGT,UAAiBb,EAAgB,cAAgB,kBAEnF,OACEuB,EAAAA,KAACxC,EAAe,CAAAyC,SAAA,CAEdC,EAAAA,WAAKC,MAAM,IAAIC,OAAO,IAAIC,MAAO,CAAEC,SAAU,YAAYL,SACvDD,EAAAA,KAAA,OAAA,CAAAC,SAAA,CAEED,EAAAA,KAAA,iBAAA,CAAgBO,GAAIT,EAAyBU,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC/EC,EAAAA,IAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,qBAC5BX,EAAAA,IAAA,OAAA,CAAMU,OAAO,OAAOC,UAAW,IAAGpC,EAAgB,mBAAqB,yBAIzEuB,EAAAA,KAAA,iBAAA,CAAgBO,GAAIR,EAAwBS,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC9EC,EAAAA,IAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,2BAC5BX,EAAAA,YACEU,OAAO,OACPC,UAAW,IAAGpC,EAAgB,yBAA2B,oCAMjEyB,EAAAA,IAACnC,EAAsB,CACrBM,WAAYiB,EACZJ,KAAMO,EACNtB,QAASA,EACTiB,MAAOA,EAAK,aACAD,GAAQ,UAAS,gBACF,gBAAZhB,EAA4BiB,OAAQ0B,kBACxB,gBAAZ3C,EAA4B,OAAI2C,EAAS,gBAC7B,gBAAZ3C,EAA4B,SAAM2C,KAC7CzB,IAGLF,GACCe,EAAAA,IAACa,EAAU,CAAC5C,QAAQ,UAAU6C,MAAM,iBAAgB,YAAW,SAAQf,SACpEd"}

package/dist/components/atoms/CircularProgress/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/CircularProgress/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/sort-type-constituents */\n/* eslint-disable react/jsx-sort-props */\n// atoms/CircularProgress/CircularProgress.tsx\nimport { useId } from 'react'\n\nimport Box from '@mui/material/Box';\nimport MuiCircularProgress, { type CircularProgressProps as MuiCircularProgressProps } from '@mui/material/CircularProgress';\nimport { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\n/*\n    Key Features:\n    ✅ Based on MUI CircularProgress - Extends the base component\n    ✅ Light & Dark mode support - Uses conic gradient provided in Figma design specs\n    ✅ Optional status text - Pass text prop to display below spinner\n    ✅ Determinate progress - Set variant=\"determinate\" and value when duration is known\n    ✅ Custom sizes - small=20px, medium=40px, large=60px\n    ✅ ARIA compliant - Includes proper aria labels and live regions\n    ✅ Simple API - Only size, value, text, and variant props\n*/\n\ntype CircularProgressSize = 'small' | 'medium' | 'large';\n\nconst SIZE_MAP: Record<CircularProgressSize, number> = {\n    small: 20,\n    medium: 40,\n    large: 60,\n};\n\nexport interface CircularProgressProps extends Omit<MuiCircularProgressProps, 'color' | 'size'>\n{\n    /**\n     * The size of the circular progress\n     * @default 'medium'\n     */\n    size?: CircularProgressSize;\n    /**\n     * Optional text to display below the progress indicator\n     */\n    text?: string;\n    /**\n     * The value of the progress indicator for determinate variant\n     * Value between 0 and 100\n     */\n    value?: number;\n    /**\n     * The variant of the progress indicator\n     * @default 'indeterminate'\n     */\n    variant?: 'determinate' | 'indeterminate';\n}\n\nconst ProgressWrapper = styled(Box)({\n    display: 'inline-flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    gap: 8,\n});\n\nconst StyledCircularProgress = styled(MuiCircularProgress, { shouldForwardProp: (prop) => prop !== 'gradientId' })\n    <{ gradientId: string }>(({ variant, theme, gradientId }) =>\n    {\n        const isDark = theme.palette.mode === 'dark';\n        const isDeterminate = variant === 'determinate';\n        const progressGradientId = `${gradientId}-${isDark ? 'dark' : 'light'}-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n        return {\n            '& .MuiCircularProgress-svg': {\n                animation: `${isDeterminate ? 'none' : 'rotate-circular 1.4s linear infinite'}`,        // Smooth continuous rotation for indeterminate\n                filter: isDark\n                    ? 'drop-shadow(0px 2px 4px rgba(255, 255, 255, 0.1))'\n                    : 'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.1))',\n            },\n            '& .MuiCircularProgress-circle': {\n                stroke: `url(#${progressGradientId})`,\n                strokeLinecap: 'round',\n                strokeDasharray: '110, 200',    // Adjust the gap - increase first value to reduce gap\n                strokeDashoffset: 0,\n                animation: 'none'               // Suppress default animation as we handle rotation at SVG level\n            },\n            '@keyframes rotate-circular': {\n                '0%': {\n                    transform: 'rotate(0deg)',\n                },\n                '100%': {\n                    transform: 'rotate(360deg)',\n                },\n            },\n        };\n    });\n\n/**\n * CircularProgress component for showing process progress on buttons or UI elements.\n * Supports light and dark themes with conic gradient styling.\n */\n\nexport const CircularProgress: React.FC<CircularProgressProps> = ({\n    size = 'medium',\n    text,\n    value,\n    variant = 'indeterminate',\n    ...props\n}) =>\n{\n    const uniqueId = useId().replace(/:/g, '');\n    const isDeterminate = variant === 'determinate';\n    const sizeInPixels = SIZE_MAP[size];\n\n    if (isDeterminate)\n    {\n        // Clamp value between 0 and 100 for determinate variant\n        value = Math.min(100, Math.max(0, Number(value) || 0));\n    }\n\n    // Define unique gradient IDs based on theme and variant to support simultaneous instances (avoid DOM gradient ID conflicts)\n    const progressGradientLightId = `${uniqueId}-light-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n    const progressGradientDarkId = `${uniqueId}-dark-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n    return (\n        <ProgressWrapper>\n            {/* Hidden SVG for gradient definitions */}\n            <svg width=\"0\" height=\"0\" style={{ position: 'absolute' }}>\n                <defs>\n                    {/* Light mode gradient */}\n                    <linearGradient id={progressGradientLightId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n                        <stop offset=\"0%\" stopColor=\"rgba(0, 0, 0, 1)\" />\n                        <stop offset=\"100%\" stopColor={`${isDeterminate ? 'rgba(0, 0, 0, 1)' : 'rgba(0, 0, 0, 0)'}`} />\n                    </linearGradient>\n\n                    {/* Dark mode gradient */}\n                    <linearGradient id={progressGradientDarkId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n                        <stop offset=\"0%\" stopColor=\"rgba(255, 255, 255, 1)\" />\n                        <stop offset=\"100%\" stopColor={`${isDeterminate ? 'rgba(255, 255, 255, 1)' : 'rgba(255, 255, 255, 0)'}`} />\n                    </linearGradient>\n                </defs>\n            </svg>\n\n            <StyledCircularProgress\n                gradientId={uniqueId}\n                size={sizeInPixels}\n                variant={variant}\n                value={value}\n                aria-label={text || 'Loading'}\n                aria-valuenow={variant === 'determinate' ? value : undefined}\n                aria-valuemin={variant === 'determinate' ? 0 : undefined}\n                aria-valuemax={variant === 'determinate' ? 100 : undefined}\n                {...props}\n            />\n\n            {text && (\n                <Typography\n                    variant=\"caption\"\n                    color=\"text.secondary\"\n                    aria-live=\"polite\"\n                >\n                    {text}\n                </Typography>\n            )}\n        </ProgressWrapper>\n    );\n};\n\nexport default CircularProgress;"],"names":["SIZE_MAP","small","medium","large","ProgressWrapper","styled","Box","display","flexDirection","alignItems","gap","StyledCircularProgress","MuiCircularProgress","shouldForwardProp","prop","variant","theme","gradientId","isDark","palette","mode","isDeterminate","animation","filter","stroke","strokeLinecap","strokeDasharray","strokeDashoffset","transform","CircularProgress","size","text","value","props","uniqueId","useId","replace","sizeInPixels","Math","min","max","Number","progressGradientDarkId","_jsxs","children","_jsx","width","height","style","position","id","x1","y1","x2","y2","offset","stopColor","undefined","Typography","color"],"mappings":"qPAwBA,MAAMA,EAAiD,CACnDC,MAAO,GACPC,OAAQ,GACRC,MAAO,IA0BLC,EAAkBC,EAAOC,EAAPD,CAAY,CAChCE,QAAS,cACTC,cAAe,SACfC,WAAY,SACZC,IAAK,IAGHC,EAAyBN,EAAOO,EAAqB,CAAEC,kBAAoBC,GAAkB,eAATA,GAA3DT,EACF,EAAGU,UAASC,QAAOC,iBAExC,MAAMC,EAAgC,SAAvBF,EAAMG,QAAQC,KACvBC,EAA4B,gBAAZN,EAGtB,MAAO,CACH,6BAA8B,CAC1BO,UAAW,IAAGD,EAAgB,OAAS,wCACvCE,OAAQL,EACF,oDACA,+CAEV,gCAAiC,CAC7BM,OAAQ,QAVW,GAAGP,KAAcC,EAAS,OAAS,WAAWG,EAAgB,cAAgB,qBAWjGI,cAAe,QACfC,gBAAiB,WACjBC,iBAAkB,EAClBL,UAAW,QAEf,6BAA8B,CAC1B,KAAM,CACFM,UAAW,gBAEf,OAAQ,CACJA,UAAW,uBAWlBC,EAAoD,EAC7DC,OAAO,SACPC,OACAC,QACAjB,UAAU,mBACPkB,MAGH,MAAMC,EAAWC,IAAQC,QAAQ,KAAM,IACjCf,EAA4B,gBAAZN,EAChBsB,EAAerC,EAAS8B,GAE1BT,IAGAW,EAAQM,KAAKC,IAAI,IAAKD,KAAKE,IAAI,EAAGC,OAAOT,IAAU,KAIvD,MACMU,EAAyB,GAAGR,UAAiBb,EAAgB,cAAgB,kBAEnF,OACIsB,EAACvC,EAAe,CAAAwC,SAAA,CAEZC,SAAKC,MAAM,IAAIC,OAAO,IAAIC,MAAO,CAAEC,SAAU,YAAYL,SACrDD,EAAA,OAAA,CAAAC,SAAA,CAEID,EAAA,iBAAA,CAAgBO,GATA,GAAGhB,WAAkBb,EAAgB,cAAgB,kBASxB8B,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC7EC,EAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,qBAC5BX,EAAA,OAAA,CAAMU,OAAO,OAAOC,UAAW,IAAGnC,EAAgB,mBAAqB,yBAI3EsB,EAAA,iBAAA,CAAgBO,GAAIR,EAAwBS,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC5EC,EAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,2BAC5BX,UAAMU,OAAO,OAAOC,UAAW,IAAGnC,EAAgB,yBAA2B,oCAKzFwB,EAAClC,EAAsB,CACnBM,WAAYiB,EACZJ,KAAMO,EACNtB,QAASA,EACTiB,MAAOA,EAAK,aACAD,GAAQ,UAAS,gBACF,gBAAZhB,EAA4BiB,OAAQyB,kBACxB,gBAAZ1C,EAA4B,OAAI0C,EAAS,gBAC7B,gBAAZ1C,EAA4B,SAAM0C,KAC7CxB,IAGPF,GACGc,EAACa,EAAU,CACP3C,QAAQ,UACR4C,MAAM,iBAAgB,YACZ,SAAQf,SAEjBb"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/CircularProgress/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/sort-type-constituents */\n/* eslint-disable react/jsx-sort-props */\n// atoms/CircularProgress/CircularProgress.tsx\nimport { useId } from 'react';\n\nimport Box from '@mui/material/Box';\nimport MuiCircularProgress, {\n  type CircularProgressProps as MuiCircularProgressProps,\n} from '@mui/material/CircularProgress';\nimport { styled } from '@mui/material/styles';\n\nimport Typography from '../Typography';\n\n/*\n    Key Features:\n    ✅ Based on MUI CircularProgress - Extends the base component\n    ✅ Light & Dark mode support - Uses conic gradient provided in Figma design specs\n    ✅ Optional status text - Pass text prop to display below spinner\n    ✅ Determinate progress - Set variant=\"determinate\" and value when duration is known\n    ✅ Custom sizes - small=20px, medium=40px, large=60px\n    ✅ ARIA compliant - Includes proper aria labels and live regions\n    ✅ Simple API - Only size, value, text, and variant props\n*/\n\ntype CircularProgressSize = 'small' | 'medium' | 'large';\n\nconst SIZE_MAP: Record<CircularProgressSize, number> = {\n  small: 20,\n  medium: 40,\n  large: 60,\n};\n\nexport interface CircularProgressProps extends Omit<MuiCircularProgressProps, 'color' | 'size'> {\n  /**\n   * The size of the circular progress\n   * @default 'medium'\n   */\n  size?: CircularProgressSize;\n  /**\n   * Optional text to display below the progress indicator\n   */\n  text?: string;\n  /**\n   * The value of the progress indicator for determinate variant\n   * Value between 0 and 100\n   */\n  value?: number;\n  /**\n   * The variant of the progress indicator\n   * @default 'indeterminate'\n   */\n  variant?: 'determinate' | 'indeterminate';\n}\n\nconst ProgressWrapper = styled(Box)({\n  display: 'inline-flex',\n  flexDirection: 'column',\n  alignItems: 'center',\n  gap: 8,\n});\n\nconst StyledCircularProgress = styled(MuiCircularProgress, {\n  shouldForwardProp: (prop) => prop !== 'gradientId',\n})<{ gradientId: string }>(({ variant, theme, gradientId }) => {\n  const isDark = theme.palette.mode === 'dark';\n  const isDeterminate = variant === 'determinate';\n  const progressGradientId = `${gradientId}-${isDark ? 'dark' : 'light'}-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n  return {\n    '& .MuiCircularProgress-svg': {\n      animation: `${isDeterminate ? 'none' : 'rotate-circular 1.4s linear infinite'}`, // Smooth continuous rotation for indeterminate\n      filter: isDark\n        ? 'drop-shadow(0px 2px 4px rgba(255, 255, 255, 0.1))'\n        : 'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.1))',\n    },\n    '& .MuiCircularProgress-circle': {\n      stroke: `url(#${progressGradientId})`,\n      strokeLinecap: 'round',\n      strokeDasharray: '110, 200', // Adjust the gap - increase first value to reduce gap\n      strokeDashoffset: 0,\n      animation: 'none', // Suppress default animation as we handle rotation at SVG level\n    },\n    '@keyframes rotate-circular': {\n      '0%': {\n        transform: 'rotate(0deg)',\n      },\n      '100%': {\n        transform: 'rotate(360deg)',\n      },\n    },\n  };\n});\n\n/**\n * CircularProgress component for showing process progress on buttons or UI elements.\n * Supports light and dark themes with conic gradient styling.\n */\n\nexport const CircularProgress: React.FC<CircularProgressProps> = ({\n  size = 'medium',\n  text,\n  value,\n  variant = 'indeterminate',\n  ...props\n}) => {\n  const uniqueId = useId().replace(/:/g, '');\n  const isDeterminate = variant === 'determinate';\n  const sizeInPixels = SIZE_MAP[size];\n\n  if (isDeterminate) {\n    // Clamp value between 0 and 100 for determinate variant\n    value = Math.min(100, Math.max(0, Number(value) || 0));\n  }\n\n  // Define unique gradient IDs based on theme and variant to support simultaneous instances (avoid DOM gradient ID conflicts)\n  const progressGradientLightId = `${uniqueId}-light-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n  const progressGradientDarkId = `${uniqueId}-dark-${isDeterminate ? 'determinate' : 'indeterminate'}`;\n\n  return (\n    <ProgressWrapper>\n      {/* Hidden SVG for gradient definitions */}\n      <svg width=\"0\" height=\"0\" style={{ position: 'absolute' }}>\n        <defs>\n          {/* Light mode gradient */}\n          <linearGradient id={progressGradientLightId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n            <stop offset=\"0%\" stopColor=\"rgba(0, 0, 0, 1)\" />\n            <stop offset=\"100%\" stopColor={`${isDeterminate ? 'rgba(0, 0, 0, 1)' : 'rgba(0, 0, 0, 0)'}`} />\n          </linearGradient>\n\n          {/* Dark mode gradient */}\n          <linearGradient id={progressGradientDarkId} x1=\"0%\" y1=\"95%\" x2=\"100%\" y2=\"100%\">\n            <stop offset=\"0%\" stopColor=\"rgba(255, 255, 255, 1)\" />\n            <stop\n              offset=\"100%\"\n              stopColor={`${isDeterminate ? 'rgba(255, 255, 255, 1)' : 'rgba(255, 255, 255, 0)'}`}\n            />\n          </linearGradient>\n        </defs>\n      </svg>\n\n      <StyledCircularProgress\n        gradientId={uniqueId}\n        size={sizeInPixels}\n        variant={variant}\n        value={value}\n        aria-label={text || 'Loading'}\n        aria-valuenow={variant === 'determinate' ? value : undefined}\n        aria-valuemin={variant === 'determinate' ? 0 : undefined}\n        aria-valuemax={variant === 'determinate' ? 100 : undefined}\n        {...props}\n      />\n\n      {text && (\n        <Typography variant=\"caption\" color=\"text.secondary\" aria-live=\"polite\">\n          {text}\n        </Typography>\n      )}\n    </ProgressWrapper>\n  );\n};\n\nexport default CircularProgress;\n"],"names":["SIZE_MAP","small","medium","large","ProgressWrapper","styled","Box","display","flexDirection","alignItems","gap","StyledCircularProgress","MuiCircularProgress","shouldForwardProp","prop","variant","theme","gradientId","isDark","palette","mode","isDeterminate","animation","filter","stroke","strokeLinecap","strokeDasharray","strokeDashoffset","transform","CircularProgress","size","text","value","props","uniqueId","useId","replace","sizeInPixels","Math","min","max","Number","progressGradientDarkId","_jsxs","children","_jsx","width","height","style","position","id","x1","y1","x2","y2","offset","stopColor","undefined","Typography","color"],"mappings":"qPA0BA,MAAMA,EAAiD,CACrDC,MAAO,GACPC,OAAQ,GACRC,MAAO,IAyBHC,EAAkBC,EAAOC,EAAPD,CAAY,CAClCE,QAAS,cACTC,cAAe,SACfC,WAAY,SACZC,IAAK,IAGDC,EAAyBN,EAAOO,EAAqB,CACzDC,kBAAoBC,GAAkB,eAATA,GADAT,EAEJ,EAAGU,UAASC,QAAOC,iBAC5C,MAAMC,EAAgC,SAAvBF,EAAMG,QAAQC,KACvBC,EAA4B,gBAAZN,EAGtB,MAAO,CACL,6BAA8B,CAC5BO,UAAW,IAAGD,EAAgB,OAAS,wCACvCE,OAAQL,EACJ,oDACA,+CAEN,gCAAiC,CAC/BM,OAAQ,QAVe,GAAGP,KAAcC,EAAS,OAAS,WAAWG,EAAgB,cAAgB,qBAWrGI,cAAe,QACfC,gBAAiB,WACjBC,iBAAkB,EAClBL,UAAW,QAEb,6BAA8B,CAC5B,KAAM,CACJM,UAAW,gBAEb,OAAQ,CACNA,UAAW,uBAWNC,EAAoD,EAC/DC,OAAO,SACPC,OACAC,QACAjB,UAAU,mBACPkB,MAEH,MAAMC,EAAWC,IAAQC,QAAQ,KAAM,IACjCf,EAA4B,gBAAZN,EAChBsB,EAAerC,EAAS8B,GAE1BT,IAEFW,EAAQM,KAAKC,IAAI,IAAKD,KAAKE,IAAI,EAAGC,OAAOT,IAAU,KAIrD,MACMU,EAAyB,GAAGR,UAAiBb,EAAgB,cAAgB,kBAEnF,OACEsB,EAACvC,EAAe,CAAAwC,SAAA,CAEdC,SAAKC,MAAM,IAAIC,OAAO,IAAIC,MAAO,CAAEC,SAAU,YAAYL,SACvDD,EAAA,OAAA,CAAAC,SAAA,CAEED,EAAA,iBAAA,CAAgBO,GATQ,GAAGhB,WAAkBb,EAAgB,cAAgB,kBAShC8B,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC/EC,EAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,qBAC5BX,EAAA,OAAA,CAAMU,OAAO,OAAOC,UAAW,IAAGnC,EAAgB,mBAAqB,yBAIzEsB,EAAA,iBAAA,CAAgBO,GAAIR,EAAwBS,GAAG,KAAKC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAMV,SAAA,CAC9EC,EAAA,OAAA,CAAMU,OAAO,KAAKC,UAAU,2BAC5BX,UACEU,OAAO,OACPC,UAAW,IAAGnC,EAAgB,yBAA2B,oCAMjEwB,EAAClC,EAAsB,CACrBM,WAAYiB,EACZJ,KAAMO,EACNtB,QAASA,EACTiB,MAAOA,EAAK,aACAD,GAAQ,UAAS,gBACF,gBAAZhB,EAA4BiB,OAAQyB,kBACxB,gBAAZ1C,EAA4B,OAAI0C,EAAS,gBAC7B,gBAAZ1C,EAA4B,SAAM0C,KAC7CxB,IAGLF,GACCc,EAACa,EAAU,CAAC3C,QAAQ,UAAU4C,MAAM,iBAAgB,YAAW,SAAQf,SACpEb"}

package/dist/components/molecules/RadioGroup/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),i=require("@mui/material/FormHelperText"),l=require("@mui/material/FormLabel"),a=require("@mui/material/RadioGroup"),t=require("@mui/material/styles"),n=require("@mui/material/Box");require("@mui/material/FormControlLabel");var o=require("../../../icons/CancelCircle/index.cjs.js");const s=t.styled(n)((({theme:e})=>({marginTop:e.spacing(2),marginBottom:0}))),d=t.styled(n)((({theme:e})=>({display:"flex",flexDirection:"column",marginBottom:e.spacing(.5)}))),c=t.styled(n)((({theme:e})=>({display:"flex",flexDirection:"column",gap:e.spacing(.5),borderLeft:`4px solid ${e.palette.semantic.stroke["stroke-weak"]}`,marginTop:e.spacing(2),marginLeft:e.spacing(1.75),paddingLeft:e.spacing(3.25)}))),m=t.styled("span")((({theme:e})=>({color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(.5)}))),u=({fdKey:t="radio-default",value:u="",onChange:p,label:x,required:h=!1,helperText:g,errorText:f,children:j,...v})=>{const y=`${t}-label`,b=g?`${t}-helper`:void 0,q=f?`${t}-error`:void 0,C=[b,q].filter(Boolean).join(" ")||void 0;return e.jsxs(n,{children:[e.jsxs(d,{children:[e.jsxs(l,{id:y,children:[x," ",h&&e.jsx(m,{children:" *"})]}),g?e.jsx(i,{id:b,children:g}):null,!!f&&e.jsxs(i,{error:!0,id:q,children:[e.jsx(o,{size:"md"}),f]})]}),e.jsx(a,{"aria-describedby":C,"aria-invalid":!!f||void 0,"aria-labelledby":y,name:t,onChange:(e,r)=>p(e,r),value:u,...v,children:r.Children.map(j,(i=>{if(!r.isValidElement(i))return i;const l=i.props;if(!("value"in l)||!("control"in l))return i;const a=l,n="string"==typeof a.value?a.value:String(a.value??""),o=u===n,d=a.control,m=a.children,p=r.isValidElement(d)?r.cloneElement(d,{...d.props,checked:o,error:!!f,name:t}):d;return e.jsxs(s,{children:[r.cloneElement(i,{...a,children:void 0,control:p}),o&&m&&e.jsx(c,{children:m})]},n)}))})]})};exports.RadioGroup=u,exports.default=u;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),i=require("@mui/material/FormHelperText"),l=require("@mui/material/FormLabel"),a=require("@mui/material/RadioGroup"),n=require("@mui/material/styles"),t=require("@mui/material/Box");require("@mui/material/FormControlLabel");var o=require("../../../icons/CancelCircle/index.cjs.js");const s=n.styled(t)((({theme:e})=>({marginTop:e.spacing(2),marginBottom:0}))),d=n.styled(t)((({theme:e})=>({display:"flex",flexDirection:"column",marginBottom:e.spacing(.5)}))),c=n.styled(t)((({theme:e})=>({display:"flex",flexDirection:"column",gap:e.spacing(.5),borderLeft:`4px solid ${e.palette.semantic.stroke["stroke-weak"]}`,marginTop:e.spacing(2),marginLeft:e.spacing(1.75),paddingLeft:e.spacing(3.25)}))),m=n.styled("span")((({theme:e})=>({color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(.5)}))),u=({fdKey:n="radio-default",name:u,value:p="",onChange:x,label:h,required:g=!1,helperText:f,errorText:j,children:v,...y})=>{const b=`${n}-label`,q=f?`${n}-helper`:void 0,C=j?`${n}-error`:void 0,L=[q,C].filter(Boolean).join(" ")||void 0;return e.jsxs(t,{children:[e.jsxs(d,{children:[e.jsxs(l,{id:b,children:[h," ",g&&e.jsx(m,{children:" *"})]}),f?e.jsx(i,{id:q,children:f}):null,!!j&&e.jsxs(i,{error:!0,id:C,children:[e.jsx(o,{size:"md"}),j]})]}),e.jsx(a,{"aria-describedby":L,"aria-invalid":!!j||void 0,"aria-labelledby":b,name:u??n,onChange:(e,r)=>x(e,r),value:p,...y,children:r.Children.map(v,(i=>{if(!r.isValidElement(i))return i;const l=i.props;if(!("value"in l)||!("control"in l))return i;const a=l,t="string"==typeof a.value?a.value:String(a.value??""),o=p===t,d=a.control,m=a.children,x=r.isValidElement(d)?r.cloneElement(d,{...d.props,checked:o,error:!!j,name:u??n}):d;return e.jsxs(s,{children:[r.cloneElement(i,{...a,children:void 0,control:x}),o&&m&&e.jsx(c,{children:m})]},t)}))})]})};exports.RadioGroup=u,exports.default=u;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/molecules/RadioGroup/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/RadioGroup/index.tsx"],"sourcesContent":["import React, { isValidElement, type ReactElement } from 'react';\n\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport FormLabel from '@mui/material/FormLabel';\nimport MuiRadioGroup, { type RadioGroupProps as MuiRadioGroupProps } from '@mui/material/RadioGroup';\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport { type FormControlLabelProps } from '@fd/components/molecules/FormControlLabel';\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\n\nconst StyledBox = styled(Box)(({ theme }) => ({\n  ...{ marginTop: theme.spacing(2), marginBottom: 0 },\n}));\n\nconst StyledLabelContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginBottom: theme.spacing(0.5),\n}));\n\nconst ConditionalContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  borderLeft: `4px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  marginTop: theme.spacing(2),\n  marginLeft: theme.spacing(1.75),\n  paddingLeft: theme.spacing(3.25),\n}));\n\nconst WeakText = styled('span')(({ theme }) => ({\n  color: theme.palette.semantic.text['text-weak'],\n  marginLeft: theme.spacing(0.5),\n}));\n\n/** Props for a radio group */\nexport interface RadioGroupProps extends Omit<MuiRadioGroupProps, 'name' | 'onChange' | 'value'> {\n  /** Identifier applied to the radio group; also used for the radio name attribute. */\n  fdKey?: string;\n  /** Currently selected option value; use null or undefined when no option should be selected. */\n  value?: string | null;\n  /** Callback fired whenever the selection changes with the event and newly selected value. */\n  onChange: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;\n  /** Label rendered above the group; accepts plain text or a custom node. */\n  label: React.ReactNode;\n  /** Marks the radio group as required and surfaces the required indicator. */\n  required?: boolean;\n  /** Helper text displayed below the label to provide additional guidance. */\n  helperText?: string;\n  /** Error message shown below the helper text and marks the inputs as invalid. */\n  errorText?: string;\n  /** The children of the radio group. */\n  children?: React.ReactNode;\n}\n\n/**\n * RadioGroup component is a wrapper component for a radio group.\n *\n * @param fdKey - Identifier applied to the radio group; also used for the radio name attribute.\n * @param value - Currently selected option value; use null or undefined when no option should be selected.\n * @param onChange - Callback fired whenever the selection changes with the event and newly selected value.\n * @param label - Label rendered above the group; accepts plain text or a custom node.\n * @param required - Marks the radio group as required and surfaces the required indicator.\n * @param helperText - Helper text displayed below the label to provide additional guidance.\n * @param errorText - Error message shown below the helper text and marks the inputs as invalid.\n * @param children - The children of the radio group.\n * @param groupProps - Additional props to pass to the underlying MUI RadioGroup component.\n * @returns The RadioGroup component.\n */\n\nexport const RadioGroup = ({\n  fdKey = 'radio-default',\n  value = '',\n  onChange,\n  label,\n  required = false,\n  helperText,\n  errorText,\n  children,\n  ...groupProps\n}: RadioGroupProps): React.ReactElement => {\n  const labelId = `${fdKey}-label`;\n  const helperId = helperText ? `${fdKey}-helper` : undefined;\n  const errorId = errorText ? `${fdKey}-error` : undefined;\n  const describedBy = [helperId, errorId].filter(Boolean).join(' ') || undefined;\n\n  const handleChange: MuiRadioGroupProps['onChange'] = (e, newVal) => onChange(e, newVal);\n\n  return (\n    <Box>\n      <StyledLabelContainer>\n        <FormLabel id={labelId}>\n          {label} {required && <WeakText>{' *'}</WeakText>}\n        </FormLabel>\n        {helperText ? <MuiFormHelperText id={helperId}>{helperText}</MuiFormHelperText> : null}\n\n        {!!errorText && (\n          <MuiFormHelperText error id={errorId}>\n            <CancelCircleIcon size={'md'} />\n            {errorText}\n          </MuiFormHelperText>\n        )}\n      </StyledLabelContainer>\n\n      <MuiRadioGroup\n        aria-describedby={describedBy}\n        aria-invalid={errorText ? true : undefined}\n        aria-labelledby={labelId}\n        name={fdKey}\n        onChange={handleChange}\n        value={value}\n        {...groupProps}\n      >\n        {React.Children.map(children, (child) => {\n          if (!isValidElement(child)) {\n            return child;\n          }\n\n          // Check if child has FormControlLabel-specific props (value and control)\n          // This ensures we only process FormControlLabel components, not arbitrary elements like <Box>\n          const childProps = child.props as Partial<FormControlLabelProps>;\n          if (!('value' in childProps) || !('control' in childProps)) {\n            return child;\n          }\n\n          const formControlLabelProps = childProps as FormControlLabelProps;\n          const radioValue =\n            typeof formControlLabelProps.value === 'string'\n              ? formControlLabelProps.value\n              : String(formControlLabelProps.value ?? '');\n          const isSelected = value === radioValue;\n\n          // Extract Radio component from FormControlLabel's control prop\n          const radioControl = formControlLabelProps.control;\n\n          const optionConditionalChildren = formControlLabelProps.children;\n\n          // Clone the Radio component with updated children and checked state\n          const updatedRadio = isValidElement(radioControl)\n            ? React.cloneElement(radioControl, {\n                ...(radioControl.props as Record<string, unknown>),\n                checked: isSelected,\n                error: !!errorText,\n                name: fdKey,\n              } as Partial<unknown>)\n            : radioControl;\n\n          return (\n            <StyledBox key={radioValue}>\n              {React.cloneElement(child as ReactElement<FormControlLabelProps>, {\n                ...formControlLabelProps,\n                children: undefined,\n                control: updatedRadio,\n              })}\n\n              {/* conditional block under the selected option */}\n              {isSelected && optionConditionalChildren && (\n                <ConditionalContainer>{optionConditionalChildren}</ConditionalContainer>\n              )}\n            </StyledBox>\n          );\n        })}\n      </MuiRadioGroup>\n    </Box>\n  );\n};\n\nexport default RadioGroup;\n"],"names":["StyledBox","styled","Box","theme","marginTop","spacing","marginBottom","StyledLabelContainer","display","flexDirection","ConditionalContainer","gap","borderLeft","palette","semantic","stroke","marginLeft","paddingLeft","WeakText","color","text","RadioGroup","fdKey","value","onChange","label","required","helperText","errorText","children","groupProps","labelId","helperId","undefined","errorId","describedBy","filter","Boolean","join","_jsxs","FormLabel","id","_jsx","MuiFormHelperText","error","CancelCircleIcon","size","MuiRadioGroup","name","e","newVal","React","Children","map","child","isValidElement","childProps","props","formControlLabelProps","radioValue","String","isSelected","radioControl","control","optionConditionalChildren","updatedRadio","cloneElement","checked"],"mappings":"oZAWA,MAAMA,EAAYC,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjCC,UAAWD,EAAME,QAAQ,GAAIC,aAAc,MAG5CC,EAAuBN,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfH,aAAcH,EAAME,QAAQ,QAGxBK,EAAuBT,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfE,IAAKR,EAAME,QAAQ,IACnBO,WAAY,aAAaT,EAAMU,QAAQC,SAASC,OAAO,iBACvDX,UAAWD,EAAME,QAAQ,GACzBW,WAAYb,EAAME,QAAQ,MAC1BY,YAAad,EAAME,QAAQ,UAGvBa,EAAWjB,EAAAA,OAAO,OAAPA,EAAe,EAAGE,YAAO,CACxCgB,MAAOhB,EAAMU,QAAQC,SAASM,KAAK,aACnCJ,WAAYb,EAAME,QAAQ,QAsCfgB,EAAa,EACxBC,QAAQ,gBACRC,QAAQ,GACRC,WACAC,QACAC,YAAW,EACXC,aACAC,YACAC,cACGC,MAEH,MAAMC,EAAU,GAAGT,UACbU,EAAWL,EAAa,GAAGL,gBAAiBW,EAC5CC,EAAUN,EAAY,GAAGN,eAAgBW,EACzCE,EAAc,CAACH,EAAUE,GAASE,OAAOC,SAASC,KAAK,WAAQL,EAIrE,OACEM,EAAAA,KAACrC,EAAG,CAAA2B,SAAA,CACFU,EAAAA,KAAChC,EAAoB,CAAAsB,SAAA,CACnBU,EAAAA,KAACC,EAAS,CAACC,GAAIV,EAAOF,SAAA,CACnBJ,EAAK,IAAGC,GAAYgB,MAACxB,EAAQ,CAAAW,SAAE,UAEjCF,EAAae,EAAAA,IAACC,EAAiB,CAACF,GAAIT,EAAQH,SAAGF,IAAkC,OAE/EC,GACDW,EAAAA,KAACI,EAAiB,CAACC,OAAK,EAACH,GAAIP,YAC3BQ,EAAAA,IAACG,EAAgB,CAACC,KAAM,OACvBlB,QAKPc,EAAAA,IAACK,EAAa,CAAA,mBACMZ,EAAW,iBACfP,QAAmBK,EAAS,kBACzBF,EACjBiB,KAAM1B,EACNE,SAvB+C,CAACyB,EAAGC,IAAW1B,EAASyB,EAAGC,GAwB1E3B,MAAOA,KACHO,EAAUD,SAEbsB,EAAMC,SAASC,IAAIxB,GAAWyB,IAC7B,IAAKC,EAAAA,eAAeD,GAClB,OAAOA,EAKT,MAAME,EAAaF,EAAMG,MACzB,KAAM,UAAWD,MAAiB,YAAaA,GAC7C,OAAOF,EAGT,MAAMI,EAAwBF,EACxBG,EACmC,iBAAhCD,EAAsBnC,MACzBmC,EAAsBnC,MACtBqC,OAAOF,EAAsBnC,OAAS,IACtCsC,EAAatC,IAAUoC,EAGvBG,EAAeJ,EAAsBK,QAErCC,EAA4BN,EAAsB7B,SAGlDoC,EAAeV,EAAAA,eAAeO,GAChCX,EAAMe,aAAaJ,EAAc,IAC3BA,EAAaL,MACjBU,QAASN,EACTjB,QAAShB,EACToB,KAAM1B,IAERwC,EAEJ,OACEvB,EAAAA,KAACvC,EAAS,CAAA6B,SAAA,CACPsB,EAAMe,aAAaZ,EAA8C,IAC7DI,EACH7B,cAAUI,EACV8B,QAASE,IAIVJ,GAAcG,GACbtB,EAAAA,IAAChC,EAAoB,CAAAmB,SAAEmC,MATXL"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/RadioGroup/index.tsx"],"sourcesContent":["import React, { isValidElement, type ReactElement } from 'react';\n\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport FormLabel from '@mui/material/FormLabel';\nimport MuiRadioGroup, { type RadioGroupProps as MuiRadioGroupProps } from '@mui/material/RadioGroup';\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport { type FormControlLabelProps } from '@fd/components/molecules/FormControlLabel';\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\n\nconst StyledBox = styled(Box)(({ theme }) => ({\n  ...{ marginTop: theme.spacing(2), marginBottom: 0 },\n}));\n\nconst StyledLabelContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginBottom: theme.spacing(0.5),\n}));\n\nconst ConditionalContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  borderLeft: `4px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  marginTop: theme.spacing(2),\n  marginLeft: theme.spacing(1.75),\n  paddingLeft: theme.spacing(3.25),\n}));\n\nconst WeakText = styled('span')(({ theme }) => ({\n  color: theme.palette.semantic.text['text-weak'],\n  marginLeft: theme.spacing(0.5),\n}));\n\n/** Props for a radio group */\nexport interface RadioGroupProps extends Omit<MuiRadioGroupProps, 'name' | 'onChange' | 'value'> {\n  /** Identifier applied to the radio group; also used for the radio name attribute. */\n  fdKey?: string;\n  /** The name used to reference the value of the control. If not provided, falls back to `fdKey`. */\n  name?: string;\n  /** Currently selected option value; use null or undefined when no option should be selected. */\n  value?: string | null;\n  /** Callback fired whenever the selection changes with the event and newly selected value. */\n  onChange: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;\n  /** Label rendered above the group; accepts plain text or a custom node. */\n  label: React.ReactNode;\n  /** Marks the radio group as required and surfaces the required indicator. */\n  required?: boolean;\n  /** Helper text displayed below the label to provide additional guidance. */\n  helperText?: string;\n  /** Error message shown below the helper text and marks the inputs as invalid. */\n  errorText?: string;\n  /** The children of the radio group. */\n  children?: React.ReactNode;\n}\n\n/**\n * RadioGroup component is a wrapper component for a radio group.\n *\n * @param fdKey - Identifier applied to the radio group; also used for the radio name attribute.\n * @param name - The name used to reference the value of the control. If not provided, falls back to fdKey.\n * @param value - Currently selected option value; use null or undefined when no option should be selected.\n * @param onChange - Callback fired whenever the selection changes with the event and newly selected value.\n * @param label - Label rendered above the group; accepts plain text or a custom node.\n * @param required - Marks the radio group as required and surfaces the required indicator.\n * @param helperText - Helper text displayed below the label to provide additional guidance.\n * @param errorText - Error message shown below the helper text and marks the inputs as invalid.\n * @param children - The children of the radio group.\n * @param groupProps - Additional props to pass to the underlying MUI RadioGroup component.\n * @returns The RadioGroup component.\n */\n\nexport const RadioGroup = ({\n  fdKey = 'radio-default',\n  name,\n  value = '',\n  onChange,\n  label,\n  required = false,\n  helperText,\n  errorText,\n  children,\n  ...groupProps\n}: RadioGroupProps): React.ReactElement => {\n  const labelId = `${fdKey}-label`;\n  const helperId = helperText ? `${fdKey}-helper` : undefined;\n  const errorId = errorText ? `${fdKey}-error` : undefined;\n  const describedBy = [helperId, errorId].filter(Boolean).join(' ') || undefined;\n\n  const handleChange: MuiRadioGroupProps['onChange'] = (e, newVal) => onChange(e, newVal);\n\n  return (\n    <Box>\n      <StyledLabelContainer>\n        <FormLabel id={labelId}>\n          {label} {required && <WeakText>{' *'}</WeakText>}\n        </FormLabel>\n        {helperText ? <MuiFormHelperText id={helperId}>{helperText}</MuiFormHelperText> : null}\n\n        {!!errorText && (\n          <MuiFormHelperText error id={errorId}>\n            <CancelCircleIcon size={'md'} />\n            {errorText}\n          </MuiFormHelperText>\n        )}\n      </StyledLabelContainer>\n\n      <MuiRadioGroup\n        aria-describedby={describedBy}\n        aria-invalid={errorText ? true : undefined}\n        aria-labelledby={labelId}\n        name={name ?? fdKey}\n        onChange={handleChange}\n        value={value}\n        {...groupProps}\n      >\n        {React.Children.map(children, (child) => {\n          if (!isValidElement(child)) {\n            return child;\n          }\n\n          // Check if child has FormControlLabel-specific props (value and control)\n          // This ensures we only process FormControlLabel components, not arbitrary elements like <Box>\n          const childProps = child.props as Partial<FormControlLabelProps>;\n          if (!('value' in childProps) || !('control' in childProps)) {\n            return child;\n          }\n\n          const formControlLabelProps = childProps as FormControlLabelProps;\n          const radioValue =\n            typeof formControlLabelProps.value === 'string'\n              ? formControlLabelProps.value\n              : String(formControlLabelProps.value ?? '');\n          const isSelected = value === radioValue;\n\n          // Extract Radio component from FormControlLabel's control prop\n          const radioControl = formControlLabelProps.control;\n\n          const optionConditionalChildren = formControlLabelProps.children;\n\n          // Clone the Radio component with updated children and checked state\n          const updatedRadio = isValidElement(radioControl)\n            ? React.cloneElement(radioControl, {\n                ...(radioControl.props as Record<string, unknown>),\n                checked: isSelected,\n                error: !!errorText,\n                name: name ?? fdKey,\n              } as Partial<unknown>)\n            : radioControl;\n\n          return (\n            <StyledBox key={radioValue}>\n              {React.cloneElement(child as ReactElement<FormControlLabelProps>, {\n                ...formControlLabelProps,\n                children: undefined,\n                control: updatedRadio,\n              })}\n\n              {/* conditional block under the selected option */}\n              {isSelected && optionConditionalChildren && (\n                <ConditionalContainer>{optionConditionalChildren}</ConditionalContainer>\n              )}\n            </StyledBox>\n          );\n        })}\n      </MuiRadioGroup>\n    </Box>\n  );\n};\n\nexport default RadioGroup;\n"],"names":["StyledBox","styled","Box","theme","marginTop","spacing","marginBottom","StyledLabelContainer","display","flexDirection","ConditionalContainer","gap","borderLeft","palette","semantic","stroke","marginLeft","paddingLeft","WeakText","color","text","RadioGroup","fdKey","name","value","onChange","label","required","helperText","errorText","children","groupProps","labelId","helperId","undefined","errorId","describedBy","filter","Boolean","join","_jsxs","FormLabel","id","_jsx","MuiFormHelperText","error","CancelCircleIcon","size","MuiRadioGroup","e","newVal","React","Children","map","child","isValidElement","childProps","props","formControlLabelProps","radioValue","String","isSelected","radioControl","control","optionConditionalChildren","updatedRadio","cloneElement","checked"],"mappings":"oZAWA,MAAMA,EAAYC,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjCC,UAAWD,EAAME,QAAQ,GAAIC,aAAc,MAG5CC,EAAuBN,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfH,aAAcH,EAAME,QAAQ,QAGxBK,EAAuBT,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfE,IAAKR,EAAME,QAAQ,IACnBO,WAAY,aAAaT,EAAMU,QAAQC,SAASC,OAAO,iBACvDX,UAAWD,EAAME,QAAQ,GACzBW,WAAYb,EAAME,QAAQ,MAC1BY,YAAad,EAAME,QAAQ,UAGvBa,EAAWjB,EAAAA,OAAO,OAAPA,EAAe,EAAGE,YAAO,CACxCgB,MAAOhB,EAAMU,QAAQC,SAASM,KAAK,aACnCJ,WAAYb,EAAME,QAAQ,QAyCfgB,EAAa,EACxBC,QAAQ,gBACRC,OACAC,QAAQ,GACRC,WACAC,QACAC,YAAW,EACXC,aACAC,YACAC,cACGC,MAEH,MAAMC,EAAU,GAAGV,UACbW,EAAWL,EAAa,GAAGN,gBAAiBY,EAC5CC,EAAUN,EAAY,GAAGP,eAAgBY,EACzCE,EAAc,CAACH,EAAUE,GAASE,OAAOC,SAASC,KAAK,WAAQL,EAIrE,OACEM,EAAAA,KAACtC,EAAG,CAAA4B,SAAA,CACFU,EAAAA,KAACjC,EAAoB,CAAAuB,SAAA,CACnBU,EAAAA,KAACC,EAAS,CAACC,GAAIV,EAAOF,SAAA,CACnBJ,EAAK,IAAGC,GAAYgB,MAACzB,EAAQ,CAAAY,SAAE,UAEjCF,EAAae,EAAAA,IAACC,EAAiB,CAACF,GAAIT,EAAQH,SAAGF,IAAkC,OAE/EC,GACDW,EAAAA,KAACI,EAAiB,CAACC,OAAK,EAACH,GAAIP,EAAOL,SAAA,CAClCa,EAAAA,IAACG,EAAgB,CAACC,KAAM,OACvBlB,QAKPc,EAAAA,IAACK,EAAa,CAAA,mBACMZ,EAAW,iBACfP,QAAmBK,EAAS,kBACzBF,EACjBT,KAAMA,GAAQD,EACdG,SAvB+C,CAACwB,EAAGC,IAAWzB,EAASwB,EAAGC,GAwB1E1B,MAAOA,KACHO,EAAUD,SAEbqB,EAAMC,SAASC,IAAIvB,GAAWwB,IAC7B,IAAKC,EAAAA,eAAeD,GAClB,OAAOA,EAKT,MAAME,EAAaF,EAAMG,MACzB,KAAM,UAAWD,MAAiB,YAAaA,GAC7C,OAAOF,EAGT,MAAMI,EAAwBF,EACxBG,EACmC,iBAAhCD,EAAsBlC,MACzBkC,EAAsBlC,MACtBoC,OAAOF,EAAsBlC,OAAS,IACtCqC,EAAarC,IAAUmC,EAGvBG,EAAeJ,EAAsBK,QAErCC,EAA4BN,EAAsB5B,SAGlDmC,EAAeV,EAAAA,eAAeO,GAChCX,EAAMe,aAAaJ,EAAc,IAC3BA,EAAaL,MACjBU,QAASN,EACThB,QAAShB,EACTN,KAAMA,GAAQD,IAEhBwC,EAEJ,OACEtB,EAAAA,KAACxC,EAAS,CAAA8B,SAAA,CACPqB,EAAMe,aAAaZ,EAA8C,IAC7DI,EACH5B,cAAUI,EACV6B,QAASE,IAIVJ,GAAcG,GACbrB,EAAAA,IAACjC,EAAoB,CAAAoB,SAAEkC,MATXL"}

package/dist/components/molecules/RadioGroup/index.d.ts

@@ -5,6 +5,8 @@ import { RadioGroupProps as RadioGroupProps$1 } from '@mui/material/RadioGroup';
 interface RadioGroupProps extends Omit<RadioGroupProps$1, 'name' | 'onChange' | 'value'> {
     /** Identifier applied to the radio group; also used for the radio name attribute. */
     fdKey?: string;
+    /** The name used to reference the value of the control. If not provided, falls back to `fdKey`. */
+    name?: string;
     /** Currently selected option value; use null or undefined when no option should be selected. */
     value?: string | null;
     /** Callback fired whenever the selection changes with the event and newly selected value. */
@@ -24,6 +26,7 @@ interface RadioGroupProps extends Omit<RadioGroupProps$1, 'name' | 'onChange' |
  * RadioGroup component is a wrapper component for a radio group.
  *
  * @param fdKey - Identifier applied to the radio group; also used for the radio name attribute.
+ * @param name - The name used to reference the value of the control. If not provided, falls back to fdKey.
  * @param value - Currently selected option value; use null or undefined when no option should be selected.
  * @param onChange - Callback fired whenever the selection changes with the event and newly selected value.
  * @param label - Label rendered above the group; accepts plain text or a custom node.
@@ -34,7 +37,7 @@ interface RadioGroupProps extends Omit<RadioGroupProps$1, 'name' | 'onChange' |
  * @param groupProps - Additional props to pass to the underlying MUI RadioGroup component.
  * @returns The RadioGroup component.
  */
-declare const RadioGroup: ({ fdKey, value, onChange, label, required, helperText, errorText, children, ...groupProps }: RadioGroupProps) => react__default.ReactElement;
+declare const RadioGroup: ({ fdKey, name, value, onChange, label, required, helperText, errorText, children, ...groupProps }: RadioGroupProps) => react__default.ReactElement;
 
 export { RadioGroup, RadioGroup as default };
 export type { RadioGroupProps };

package/dist/components/molecules/RadioGroup/index.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import i,{isValidElement as o}from"react";import t from"@mui/material/FormHelperText";import a from"@mui/material/FormLabel";import n from"@mui/material/RadioGroup";import{styled as l}from"@mui/material/styles";import m from"@mui/material/Box";import"@mui/material/FormControlLabel";import c from"../../../icons/CancelCircle/index.js";const d=l(m)((({theme:e})=>({marginTop:e.spacing(2),marginBottom:0}))),p=l(m)((({theme:e})=>({display:"flex",flexDirection:"column",marginBottom:e.spacing(.5)}))),s=l(m)((({theme:e})=>({display:"flex",flexDirection:"column",gap:e.spacing(.5),borderLeft:`4px solid ${e.palette.semantic.stroke["stroke-weak"]}`,marginTop:e.spacing(2),marginLeft:e.spacing(1.75),paddingLeft:e.spacing(3.25)}))),u=l("span")((({theme:e})=>({color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(.5)}))),f=({fdKey:l="radio-default",value:f="",onChange:h,label:g,required:x=!1,helperText:v,errorText:b,children:y,...C})=>{const L=`${l}-label`,k=v?`${l}-helper`:void 0,T=b?`${l}-error`:void 0,B=[k,T].filter(Boolean).join(" ")||void 0;return e(m,{children:[e(p,{children:[e(a,{id:L,children:[g," ",x&&r(u,{children:" *"})]}),v?r(t,{id:k,children:v}):null,!!b&&e(t,{error:!0,id:T,children:[r(c,{size:"md"}),b]})]}),r(n,{"aria-describedby":B,"aria-invalid":!!b||void 0,"aria-labelledby":L,name:l,onChange:(e,r)=>h(e,r),value:f,...C,children:i.Children.map(y,(t=>{if(!o(t))return t;const a=t.props;if(!("value"in a)||!("control"in a))return t;const n=a,m="string"==typeof n.value?n.value:String(n.value??""),c=f===m,p=n.control,u=n.children,h=o(p)?i.cloneElement(p,{...p.props,checked:c,error:!!b,name:l}):p;return e(d,{children:[i.cloneElement(t,{...n,children:void 0,control:h}),c&&u&&r(s,{children:u})]},m)}))})]})};export{f as RadioGroup,f as default};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import i,{isValidElement as o}from"react";import a from"@mui/material/FormHelperText";import n from"@mui/material/FormLabel";import t from"@mui/material/RadioGroup";import{styled as l}from"@mui/material/styles";import m from"@mui/material/Box";import"@mui/material/FormControlLabel";import c from"../../../icons/CancelCircle/index.js";const d=l(m)((({theme:e})=>({marginTop:e.spacing(2),marginBottom:0}))),p=l(m)((({theme:e})=>({display:"flex",flexDirection:"column",marginBottom:e.spacing(.5)}))),s=l(m)((({theme:e})=>({display:"flex",flexDirection:"column",gap:e.spacing(.5),borderLeft:`4px solid ${e.palette.semantic.stroke["stroke-weak"]}`,marginTop:e.spacing(2),marginLeft:e.spacing(1.75),paddingLeft:e.spacing(3.25)}))),u=l("span")((({theme:e})=>({color:e.palette.semantic.text["text-weak"],marginLeft:e.spacing(.5)}))),f=({fdKey:l="radio-default",name:f,value:h="",onChange:g,label:x,required:v=!1,helperText:b,errorText:y,children:C,...L})=>{const k=`${l}-label`,T=b?`${l}-helper`:void 0,B=y?`${l}-error`:void 0,$=[T,B].filter(Boolean).join(" ")||void 0;return e(m,{children:[e(p,{children:[e(n,{id:k,children:[x," ",v&&r(u,{children:" *"})]}),b?r(a,{id:T,children:b}):null,!!y&&e(a,{error:!0,id:B,children:[r(c,{size:"md"}),y]})]}),r(t,{"aria-describedby":$,"aria-invalid":!!y||void 0,"aria-labelledby":k,name:f??l,onChange:(e,r)=>g(e,r),value:h,...L,children:i.Children.map(C,(a=>{if(!o(a))return a;const n=a.props;if(!("value"in n)||!("control"in n))return a;const t=n,m="string"==typeof t.value?t.value:String(t.value??""),c=h===m,p=t.control,u=t.children,g=o(p)?i.cloneElement(p,{...p.props,checked:c,error:!!y,name:f??l}):p;return e(d,{children:[i.cloneElement(a,{...t,children:void 0,control:g}),c&&u&&r(s,{children:u})]},m)}))})]})};export{f as RadioGroup,f as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/RadioGroup/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/RadioGroup/index.tsx"],"sourcesContent":["import React, { isValidElement, type ReactElement } from 'react';\n\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport FormLabel from '@mui/material/FormLabel';\nimport MuiRadioGroup, { type RadioGroupProps as MuiRadioGroupProps } from '@mui/material/RadioGroup';\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport { type FormControlLabelProps } from '@fd/components/molecules/FormControlLabel';\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\n\nconst StyledBox = styled(Box)(({ theme }) => ({\n  ...{ marginTop: theme.spacing(2), marginBottom: 0 },\n}));\n\nconst StyledLabelContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginBottom: theme.spacing(0.5),\n}));\n\nconst ConditionalContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  borderLeft: `4px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  marginTop: theme.spacing(2),\n  marginLeft: theme.spacing(1.75),\n  paddingLeft: theme.spacing(3.25),\n}));\n\nconst WeakText = styled('span')(({ theme }) => ({\n  color: theme.palette.semantic.text['text-weak'],\n  marginLeft: theme.spacing(0.5),\n}));\n\n/** Props for a radio group */\nexport interface RadioGroupProps extends Omit<MuiRadioGroupProps, 'name' | 'onChange' | 'value'> {\n  /** Identifier applied to the radio group; also used for the radio name attribute. */\n  fdKey?: string;\n  /** Currently selected option value; use null or undefined when no option should be selected. */\n  value?: string | null;\n  /** Callback fired whenever the selection changes with the event and newly selected value. */\n  onChange: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;\n  /** Label rendered above the group; accepts plain text or a custom node. */\n  label: React.ReactNode;\n  /** Marks the radio group as required and surfaces the required indicator. */\n  required?: boolean;\n  /** Helper text displayed below the label to provide additional guidance. */\n  helperText?: string;\n  /** Error message shown below the helper text and marks the inputs as invalid. */\n  errorText?: string;\n  /** The children of the radio group. */\n  children?: React.ReactNode;\n}\n\n/**\n * RadioGroup component is a wrapper component for a radio group.\n *\n * @param fdKey - Identifier applied to the radio group; also used for the radio name attribute.\n * @param value - Currently selected option value; use null or undefined when no option should be selected.\n * @param onChange - Callback fired whenever the selection changes with the event and newly selected value.\n * @param label - Label rendered above the group; accepts plain text or a custom node.\n * @param required - Marks the radio group as required and surfaces the required indicator.\n * @param helperText - Helper text displayed below the label to provide additional guidance.\n * @param errorText - Error message shown below the helper text and marks the inputs as invalid.\n * @param children - The children of the radio group.\n * @param groupProps - Additional props to pass to the underlying MUI RadioGroup component.\n * @returns The RadioGroup component.\n */\n\nexport const RadioGroup = ({\n  fdKey = 'radio-default',\n  value = '',\n  onChange,\n  label,\n  required = false,\n  helperText,\n  errorText,\n  children,\n  ...groupProps\n}: RadioGroupProps): React.ReactElement => {\n  const labelId = `${fdKey}-label`;\n  const helperId = helperText ? `${fdKey}-helper` : undefined;\n  const errorId = errorText ? `${fdKey}-error` : undefined;\n  const describedBy = [helperId, errorId].filter(Boolean).join(' ') || undefined;\n\n  const handleChange: MuiRadioGroupProps['onChange'] = (e, newVal) => onChange(e, newVal);\n\n  return (\n    <Box>\n      <StyledLabelContainer>\n        <FormLabel id={labelId}>\n          {label} {required && <WeakText>{' *'}</WeakText>}\n        </FormLabel>\n        {helperText ? <MuiFormHelperText id={helperId}>{helperText}</MuiFormHelperText> : null}\n\n        {!!errorText && (\n          <MuiFormHelperText error id={errorId}>\n            <CancelCircleIcon size={'md'} />\n            {errorText}\n          </MuiFormHelperText>\n        )}\n      </StyledLabelContainer>\n\n      <MuiRadioGroup\n        aria-describedby={describedBy}\n        aria-invalid={errorText ? true : undefined}\n        aria-labelledby={labelId}\n        name={fdKey}\n        onChange={handleChange}\n        value={value}\n        {...groupProps}\n      >\n        {React.Children.map(children, (child) => {\n          if (!isValidElement(child)) {\n            return child;\n          }\n\n          // Check if child has FormControlLabel-specific props (value and control)\n          // This ensures we only process FormControlLabel components, not arbitrary elements like <Box>\n          const childProps = child.props as Partial<FormControlLabelProps>;\n          if (!('value' in childProps) || !('control' in childProps)) {\n            return child;\n          }\n\n          const formControlLabelProps = childProps as FormControlLabelProps;\n          const radioValue =\n            typeof formControlLabelProps.value === 'string'\n              ? formControlLabelProps.value\n              : String(formControlLabelProps.value ?? '');\n          const isSelected = value === radioValue;\n\n          // Extract Radio component from FormControlLabel's control prop\n          const radioControl = formControlLabelProps.control;\n\n          const optionConditionalChildren = formControlLabelProps.children;\n\n          // Clone the Radio component with updated children and checked state\n          const updatedRadio = isValidElement(radioControl)\n            ? React.cloneElement(radioControl, {\n                ...(radioControl.props as Record<string, unknown>),\n                checked: isSelected,\n                error: !!errorText,\n                name: fdKey,\n              } as Partial<unknown>)\n            : radioControl;\n\n          return (\n            <StyledBox key={radioValue}>\n              {React.cloneElement(child as ReactElement<FormControlLabelProps>, {\n                ...formControlLabelProps,\n                children: undefined,\n                control: updatedRadio,\n              })}\n\n              {/* conditional block under the selected option */}\n              {isSelected && optionConditionalChildren && (\n                <ConditionalContainer>{optionConditionalChildren}</ConditionalContainer>\n              )}\n            </StyledBox>\n          );\n        })}\n      </MuiRadioGroup>\n    </Box>\n  );\n};\n\nexport default RadioGroup;\n"],"names":["StyledBox","styled","Box","theme","marginTop","spacing","marginBottom","StyledLabelContainer","display","flexDirection","ConditionalContainer","gap","borderLeft","palette","semantic","stroke","marginLeft","paddingLeft","WeakText","color","text","RadioGroup","fdKey","value","onChange","label","required","helperText","errorText","children","groupProps","labelId","helperId","undefined","errorId","describedBy","filter","Boolean","join","_jsxs","FormLabel","id","_jsx","MuiFormHelperText","error","CancelCircleIcon","size","MuiRadioGroup","name","e","newVal","React","Children","map","child","isValidElement","childProps","props","formControlLabelProps","radioValue","String","isSelected","radioControl","control","optionConditionalChildren","updatedRadio","cloneElement","checked"],"mappings":"iYAWA,MAAMA,EAAYC,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjCC,UAAWD,EAAME,QAAQ,GAAIC,aAAc,MAG5CC,EAAuBN,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfH,aAAcH,EAAME,QAAQ,QAGxBK,EAAuBT,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfE,IAAKR,EAAME,QAAQ,IACnBO,WAAY,aAAaT,EAAMU,QAAQC,SAASC,OAAO,iBACvDX,UAAWD,EAAME,QAAQ,GACzBW,WAAYb,EAAME,QAAQ,MAC1BY,YAAad,EAAME,QAAQ,UAGvBa,EAAWjB,EAAO,OAAPA,EAAe,EAAGE,YAAO,CACxCgB,MAAOhB,EAAMU,QAAQC,SAASM,KAAK,aACnCJ,WAAYb,EAAME,QAAQ,QAsCfgB,EAAa,EACxBC,QAAQ,gBACRC,QAAQ,GACRC,WACAC,QACAC,YAAW,EACXC,aACAC,YACAC,cACGC,MAEH,MAAMC,EAAU,GAAGT,UACbU,EAAWL,EAAa,GAAGL,gBAAiBW,EAC5CC,EAAUN,EAAY,GAAGN,eAAgBW,EACzCE,EAAc,CAACH,EAAUE,GAASE,OAAOC,SAASC,KAAK,WAAQL,EAIrE,OACEM,EAACrC,EAAG,CAAA2B,SAAA,CACFU,EAAChC,EAAoB,CAAAsB,SAAA,CACnBU,EAACC,EAAS,CAACC,GAAIV,EAAOF,SAAA,CACnBJ,EAAK,IAAGC,GAAYgB,EAACxB,EAAQ,CAAAW,SAAE,UAEjCF,EAAae,EAACC,EAAiB,CAACF,GAAIT,EAAQH,SAAGF,IAAkC,OAE/EC,GACDW,EAACI,EAAiB,CAACC,OAAK,EAACH,GAAIP,YAC3BQ,EAACG,EAAgB,CAACC,KAAM,OACvBlB,QAKPc,EAACK,EAAa,CAAA,mBACMZ,EAAW,iBACfP,QAAmBK,EAAS,kBACzBF,EACjBiB,KAAM1B,EACNE,SAvB+C,CAACyB,EAAGC,IAAW1B,EAASyB,EAAGC,GAwB1E3B,MAAOA,KACHO,EAAUD,SAEbsB,EAAMC,SAASC,IAAIxB,GAAWyB,IAC7B,IAAKC,EAAeD,GAClB,OAAOA,EAKT,MAAME,EAAaF,EAAMG,MACzB,KAAM,UAAWD,MAAiB,YAAaA,GAC7C,OAAOF,EAGT,MAAMI,EAAwBF,EACxBG,EACmC,iBAAhCD,EAAsBnC,MACzBmC,EAAsBnC,MACtBqC,OAAOF,EAAsBnC,OAAS,IACtCsC,EAAatC,IAAUoC,EAGvBG,EAAeJ,EAAsBK,QAErCC,EAA4BN,EAAsB7B,SAGlDoC,EAAeV,EAAeO,GAChCX,EAAMe,aAAaJ,EAAc,IAC3BA,EAAaL,MACjBU,QAASN,EACTjB,QAAShB,EACToB,KAAM1B,IAERwC,EAEJ,OACEvB,EAACvC,EAAS,CAAA6B,SAAA,CACPsB,EAAMe,aAAaZ,EAA8C,IAC7DI,EACH7B,cAAUI,EACV8B,QAASE,IAIVJ,GAAcG,GACbtB,EAAChC,EAAoB,CAAAmB,SAAEmC,MATXL"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/RadioGroup/index.tsx"],"sourcesContent":["import React, { isValidElement, type ReactElement } from 'react';\n\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport FormLabel from '@mui/material/FormLabel';\nimport MuiRadioGroup, { type RadioGroupProps as MuiRadioGroupProps } from '@mui/material/RadioGroup';\nimport { styled } from '@mui/material/styles';\n\nimport Box from '@fd/components/atoms/Box';\nimport { type FormControlLabelProps } from '@fd/components/molecules/FormControlLabel';\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\n\nconst StyledBox = styled(Box)(({ theme }) => ({\n  ...{ marginTop: theme.spacing(2), marginBottom: 0 },\n}));\n\nconst StyledLabelContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  marginBottom: theme.spacing(0.5),\n}));\n\nconst ConditionalContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  borderLeft: `4px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n  marginTop: theme.spacing(2),\n  marginLeft: theme.spacing(1.75),\n  paddingLeft: theme.spacing(3.25),\n}));\n\nconst WeakText = styled('span')(({ theme }) => ({\n  color: theme.palette.semantic.text['text-weak'],\n  marginLeft: theme.spacing(0.5),\n}));\n\n/** Props for a radio group */\nexport interface RadioGroupProps extends Omit<MuiRadioGroupProps, 'name' | 'onChange' | 'value'> {\n  /** Identifier applied to the radio group; also used for the radio name attribute. */\n  fdKey?: string;\n  /** The name used to reference the value of the control. If not provided, falls back to `fdKey`. */\n  name?: string;\n  /** Currently selected option value; use null or undefined when no option should be selected. */\n  value?: string | null;\n  /** Callback fired whenever the selection changes with the event and newly selected value. */\n  onChange: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;\n  /** Label rendered above the group; accepts plain text or a custom node. */\n  label: React.ReactNode;\n  /** Marks the radio group as required and surfaces the required indicator. */\n  required?: boolean;\n  /** Helper text displayed below the label to provide additional guidance. */\n  helperText?: string;\n  /** Error message shown below the helper text and marks the inputs as invalid. */\n  errorText?: string;\n  /** The children of the radio group. */\n  children?: React.ReactNode;\n}\n\n/**\n * RadioGroup component is a wrapper component for a radio group.\n *\n * @param fdKey - Identifier applied to the radio group; also used for the radio name attribute.\n * @param name - The name used to reference the value of the control. If not provided, falls back to fdKey.\n * @param value - Currently selected option value; use null or undefined when no option should be selected.\n * @param onChange - Callback fired whenever the selection changes with the event and newly selected value.\n * @param label - Label rendered above the group; accepts plain text or a custom node.\n * @param required - Marks the radio group as required and surfaces the required indicator.\n * @param helperText - Helper text displayed below the label to provide additional guidance.\n * @param errorText - Error message shown below the helper text and marks the inputs as invalid.\n * @param children - The children of the radio group.\n * @param groupProps - Additional props to pass to the underlying MUI RadioGroup component.\n * @returns The RadioGroup component.\n */\n\nexport const RadioGroup = ({\n  fdKey = 'radio-default',\n  name,\n  value = '',\n  onChange,\n  label,\n  required = false,\n  helperText,\n  errorText,\n  children,\n  ...groupProps\n}: RadioGroupProps): React.ReactElement => {\n  const labelId = `${fdKey}-label`;\n  const helperId = helperText ? `${fdKey}-helper` : undefined;\n  const errorId = errorText ? `${fdKey}-error` : undefined;\n  const describedBy = [helperId, errorId].filter(Boolean).join(' ') || undefined;\n\n  const handleChange: MuiRadioGroupProps['onChange'] = (e, newVal) => onChange(e, newVal);\n\n  return (\n    <Box>\n      <StyledLabelContainer>\n        <FormLabel id={labelId}>\n          {label} {required && <WeakText>{' *'}</WeakText>}\n        </FormLabel>\n        {helperText ? <MuiFormHelperText id={helperId}>{helperText}</MuiFormHelperText> : null}\n\n        {!!errorText && (\n          <MuiFormHelperText error id={errorId}>\n            <CancelCircleIcon size={'md'} />\n            {errorText}\n          </MuiFormHelperText>\n        )}\n      </StyledLabelContainer>\n\n      <MuiRadioGroup\n        aria-describedby={describedBy}\n        aria-invalid={errorText ? true : undefined}\n        aria-labelledby={labelId}\n        name={name ?? fdKey}\n        onChange={handleChange}\n        value={value}\n        {...groupProps}\n      >\n        {React.Children.map(children, (child) => {\n          if (!isValidElement(child)) {\n            return child;\n          }\n\n          // Check if child has FormControlLabel-specific props (value and control)\n          // This ensures we only process FormControlLabel components, not arbitrary elements like <Box>\n          const childProps = child.props as Partial<FormControlLabelProps>;\n          if (!('value' in childProps) || !('control' in childProps)) {\n            return child;\n          }\n\n          const formControlLabelProps = childProps as FormControlLabelProps;\n          const radioValue =\n            typeof formControlLabelProps.value === 'string'\n              ? formControlLabelProps.value\n              : String(formControlLabelProps.value ?? '');\n          const isSelected = value === radioValue;\n\n          // Extract Radio component from FormControlLabel's control prop\n          const radioControl = formControlLabelProps.control;\n\n          const optionConditionalChildren = formControlLabelProps.children;\n\n          // Clone the Radio component with updated children and checked state\n          const updatedRadio = isValidElement(radioControl)\n            ? React.cloneElement(radioControl, {\n                ...(radioControl.props as Record<string, unknown>),\n                checked: isSelected,\n                error: !!errorText,\n                name: name ?? fdKey,\n              } as Partial<unknown>)\n            : radioControl;\n\n          return (\n            <StyledBox key={radioValue}>\n              {React.cloneElement(child as ReactElement<FormControlLabelProps>, {\n                ...formControlLabelProps,\n                children: undefined,\n                control: updatedRadio,\n              })}\n\n              {/* conditional block under the selected option */}\n              {isSelected && optionConditionalChildren && (\n                <ConditionalContainer>{optionConditionalChildren}</ConditionalContainer>\n              )}\n            </StyledBox>\n          );\n        })}\n      </MuiRadioGroup>\n    </Box>\n  );\n};\n\nexport default RadioGroup;\n"],"names":["StyledBox","styled","Box","theme","marginTop","spacing","marginBottom","StyledLabelContainer","display","flexDirection","ConditionalContainer","gap","borderLeft","palette","semantic","stroke","marginLeft","paddingLeft","WeakText","color","text","RadioGroup","fdKey","name","value","onChange","label","required","helperText","errorText","children","groupProps","labelId","helperId","undefined","errorId","describedBy","filter","Boolean","join","_jsxs","FormLabel","id","_jsx","MuiFormHelperText","error","CancelCircleIcon","size","MuiRadioGroup","e","newVal","React","Children","map","child","isValidElement","childProps","props","formControlLabelProps","radioValue","String","isSelected","radioControl","control","optionConditionalChildren","updatedRadio","cloneElement","checked"],"mappings":"iYAWA,MAAMA,EAAYC,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjCC,UAAWD,EAAME,QAAQ,GAAIC,aAAc,MAG5CC,EAAuBN,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfH,aAAcH,EAAME,QAAQ,QAGxBK,EAAuBT,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACjDK,QAAS,OACTC,cAAe,SACfE,IAAKR,EAAME,QAAQ,IACnBO,WAAY,aAAaT,EAAMU,QAAQC,SAASC,OAAO,iBACvDX,UAAWD,EAAME,QAAQ,GACzBW,WAAYb,EAAME,QAAQ,MAC1BY,YAAad,EAAME,QAAQ,UAGvBa,EAAWjB,EAAO,OAAPA,EAAe,EAAGE,YAAO,CACxCgB,MAAOhB,EAAMU,QAAQC,SAASM,KAAK,aACnCJ,WAAYb,EAAME,QAAQ,QAyCfgB,EAAa,EACxBC,QAAQ,gBACRC,OACAC,QAAQ,GACRC,WACAC,QACAC,YAAW,EACXC,aACAC,YACAC,cACGC,MAEH,MAAMC,EAAU,GAAGV,UACbW,EAAWL,EAAa,GAAGN,gBAAiBY,EAC5CC,EAAUN,EAAY,GAAGP,eAAgBY,EACzCE,EAAc,CAACH,EAAUE,GAASE,OAAOC,SAASC,KAAK,WAAQL,EAIrE,OACEM,EAACtC,EAAG,CAAA4B,SAAA,CACFU,EAACjC,EAAoB,CAAAuB,SAAA,CACnBU,EAACC,EAAS,CAACC,GAAIV,EAAOF,SAAA,CACnBJ,EAAK,IAAGC,GAAYgB,EAACzB,EAAQ,CAAAY,SAAE,UAEjCF,EAAae,EAACC,EAAiB,CAACF,GAAIT,EAAQH,SAAGF,IAAkC,OAE/EC,GACDW,EAACI,EAAiB,CAACC,OAAK,EAACH,GAAIP,EAAOL,SAAA,CAClCa,EAACG,EAAgB,CAACC,KAAM,OACvBlB,QAKPc,EAACK,EAAa,CAAA,mBACMZ,EAAW,iBACfP,QAAmBK,EAAS,kBACzBF,EACjBT,KAAMA,GAAQD,EACdG,SAvB+C,CAACwB,EAAGC,IAAWzB,EAASwB,EAAGC,GAwB1E1B,MAAOA,KACHO,EAAUD,SAEbqB,EAAMC,SAASC,IAAIvB,GAAWwB,IAC7B,IAAKC,EAAeD,GAClB,OAAOA,EAKT,MAAME,EAAaF,EAAMG,MACzB,KAAM,UAAWD,MAAiB,YAAaA,GAC7C,OAAOF,EAGT,MAAMI,EAAwBF,EACxBG,EACmC,iBAAhCD,EAAsBlC,MACzBkC,EAAsBlC,MACtBoC,OAAOF,EAAsBlC,OAAS,IACtCqC,EAAarC,IAAUmC,EAGvBG,EAAeJ,EAAsBK,QAErCC,EAA4BN,EAAsB5B,SAGlDmC,EAAeV,EAAeO,GAChCX,EAAMe,aAAaJ,EAAc,IAC3BA,EAAaL,MACjBU,QAASN,EACThB,QAAShB,EACTN,KAAMA,GAAQD,IAEhBwC,EAEJ,OACEtB,EAACxC,EAAS,CAAA8B,SAAA,CACPqB,EAAMe,aAAaZ,EAA8C,IAC7DI,EACH5B,cAAUI,EACV6B,QAASE,IAIVJ,GAAcG,GACbrB,EAACjC,EAAoB,CAAAoB,SAAEkC,MATXL"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flipdish/portal-library",
-  "version": "7.5.0",
+  "version": "7.5.2",
   "files": [
     "dist"
   ],