@pega/cosmos-react-core 9.0.0-build.24.4 → 9.0.0-build.24.6

package/lib/components/Drawer/ResizeHandle.d.ts

@@ -2,6 +2,7 @@ import type { MouseEvent as ReactMouseEvent, KeyboardEvent as ReactKeyboardEvent
 export interface ResizeHandleProps {
     onKeyDown: (e: ReactKeyboardEvent, grabbed: boolean) => void;
     onMouseDown: (e: ReactMouseEvent) => void;
+    contextualLabel?: string;
 }
 export declare const StyledResizeHandle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 declare const ResizeHandle: import("react").ForwardRefExoticComponent<ResizeHandleProps & import("react").RefAttributes<HTMLDivElement>>;

package/lib/components/Drawer/ResizeHandle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResizeHandle.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/ResizeHandle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAGV,UAAU,IAAI,eAAe,EAC7B,aAAa,IAAI,kBAAkB,EACpC,MAAM,OAAO,CAAC;AAef,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,CAAC,CAAC,EAAE,kBAAkB,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7D,WAAW,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;CAC3C;AAyBD,eAAO,MAAM,kBAAkB,6NA8B7B,CAAC;AAIH,QAAA,MAAM,YAAY,8GAqEhB,CAAC;AAEH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ResizeHandle.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/ResizeHandle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAGV,UAAU,IAAI,eAAe,EAC7B,aAAa,IAAI,kBAAkB,EACpC,MAAM,OAAO,CAAC;AAef,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,CAAC,CAAC,EAAE,kBAAkB,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7D,WAAW,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAyBD,eAAO,MAAM,kBAAkB,6NA8B7B,CAAC;AAIH,QAAA,MAAM,YAAY,8GAuEhB,CAAC;AAEH,eAAe,YAAY,CAAC"}

package/lib/components/Drawer/ResizeHandle.js

@@ -63,7 +63,7 @@ export const StyledResizeHandle = styled.div(({ theme }) => {
   `;
 });
 StyledResizeHandle.defaultProps = defaultThemeProp;
-const ResizeHandle = forwardRef(function ResizeHandle({ onMouseDown, onKeyDown }, ref) {
+const ResizeHandle = forwardRef(function ResizeHandle({ onMouseDown, onKeyDown, contextualLabel }, ref) {
     const resizeHandleRef = useConsolidatedRef(ref);
     const t = useI18n();
     const [mouseGrabbed, setMouseGrabbed] = useState(false);
@@ -99,7 +99,8 @@ const ResizeHandle = forwardRef(function ResizeHandle({ onMouseDown, onKeyDown }
         targetNode.style.removeProperty('user-select');
         setMouseGrabbed(false);
     };
-    return (_jsx(StyledResizeHandle, { onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, ref: resizeHandleRef, children: _jsx(StyledResizeButton, { tabIndex: 0, icon: true, label: !mouseGrabbed && !keyboardGrabbed ? t('resize') : undefined, "aria-label": !mouseGrabbed && !keyboardGrabbed
+    const label = contextualLabel || t('resize');
+    return (_jsx(StyledResizeHandle, { onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, ref: resizeHandleRef, children: _jsx(StyledResizeButton, { tabIndex: 0, icon: true, label: !mouseGrabbed && !keyboardGrabbed ? label : undefined, "aria-label": !mouseGrabbed && !keyboardGrabbed
                 ? t('drag_handle_activate_description')
                 : t('drag_handle_cancel_description'), onMouseDown: handleMouseDown, onKeyDown: handleKeyDown, onBlur: () => {
                 setKeyboardGrabbed(false);

package/lib/components/Drawer/ResizeHandle.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResizeHandle.js","sourceRoot":"","sources":["../../../src/components/Drawer/ResizeHandle.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type {\n  PropsWithoutRef,\n  Ref,\n  MouseEvent as ReactMouseEvent,\n  KeyboardEvent as ReactKeyboardEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport Button, { StyledButton } from '../Button';\nimport Icon, { registerIcon, StyledIcon } from '../Icon';\nimport { useConsolidatedRef, useEscape, useI18n } from '../../hooks';\nimport { getChildOfRootNode } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\nimport * as DragIcon from '../Icon/icons/drag.icon';\nimport * as ArrowUpDownIcon from '../Icon/icons/arrow-micro-up-down.icon';\n\nregisterIcon(DragIcon);\nregisterIcon(ArrowUpDownIcon);\n\nexport interface ResizeHandleProps {\n  onKeyDown: (e: ReactKeyboardEvent, grabbed: boolean) => void;\n  onMouseDown: (e: ReactMouseEvent) => void;\n}\n\nconst StyledResizeButton = styled(Button)<{\n  rotateIcon?: boolean;\n}>(({ rotateIcon }) => {\n  return css`\n    cursor: grab;\n\n    &:active {\n      cursor: grabbing;\n    }\n\n    &:not(:focus) {\n      ${hideVisually};\n    }\n\n    ${rotateIcon &&\n    css`\n      ${StyledIcon} {\n        transform: rotate(90deg);\n      }\n    `}\n  `;\n});\n\nexport const StyledResizeHandle = styled.div(({ theme }) => {\n  return css`\n    position: absolute;\n    inset-inline-start: 0;\n    inset-block: 0;\n    inline-size: 0.125rem;\n    background-color: transparent;\n    transition: background-color ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n    cursor: ew-resize;\n    z-index: ${theme.base['z-index'].max};\n\n    ::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      width: calc(${theme.base['hit-area'].compact} * 0.75);\n    }\n\n    &:hover {\n      background-color: ${theme.base.palette.interactive};\n    }\n\n    ${StyledButton} {\n      position: absolute;\n      inset-block-start: 50%;\n      inset-inline-start: calc(-2 * ${theme.base.spacing});\n      translate: 0 -50%;\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledResizeHandle.defaultProps = defaultThemeProp;\n\nconst ResizeHandle = forwardRef(function ResizeHandle(\n  { onMouseDown, onKeyDown }: PropsWithoutRef<ResizeHandleProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const resizeHandleRef = useConsolidatedRef<HTMLDivElement>(ref);\n  const t = useI18n();\n\n  const [mouseGrabbed, setMouseGrabbed] = useState(false);\n  const [keyboardGrabbed, setKeyboardGrabbed] = useState(false);\n\n  useEscape(() => {\n    setMouseGrabbed(false);\n    setKeyboardGrabbed(false);\n  });\n\n  const handleKeyDown = (e: ReactKeyboardEvent) => {\n    if (e.code === 'Space') {\n      e.preventDefault();\n      if (keyboardGrabbed) {\n        setKeyboardGrabbed(false);\n      } else {\n        setKeyboardGrabbed(true);\n      }\n    }\n\n    onKeyDown?.(e, keyboardGrabbed);\n  };\n\n  const handleMouseDown = (e: ReactMouseEvent) => {\n    const targetNode = getChildOfRootNode(resizeHandleRef);\n    if (!targetNode) return;\n    targetNode.style.setProperty('user-select', 'none');\n    setMouseGrabbed(true);\n    onMouseDown?.(e);\n  };\n\n  const handleMouseUp = () => {\n    const targetNode = getChildOfRootNode(resizeHandleRef);\n    if (!targetNode) return;\n    targetNode.style.removeProperty('user-select');\n    setMouseGrabbed(false);\n  };\n\n  return (\n    <StyledResizeHandle\n      onMouseDown={handleMouseDown}\n      onMouseUp={handleMouseUp}\n      ref={resizeHandleRef}\n    >\n      <StyledResizeButton\n        tabIndex={0}\n        icon\n        label={!mouseGrabbed && !keyboardGrabbed ? t('resize') : undefined}\n        aria-label={\n          !mouseGrabbed && !keyboardGrabbed\n            ? t('drag_handle_activate_description')\n            : t('drag_handle_cancel_description')\n        }\n        onMouseDown={handleMouseDown}\n        onKeyDown={handleKeyDown}\n        onBlur={() => {\n          setKeyboardGrabbed(false);\n        }}\n        rotateIcon={keyboardGrabbed}\n      >\n        <Icon name={keyboardGrabbed ? 'arrow-micro-up-down' : 'drag'} />\n      </StyledResizeButton>\n    </StyledResizeHandle>\n  );\n});\n\nexport default ResizeHandle;\n"]}
+{"version":3,"file":"ResizeHandle.js","sourceRoot":"","sources":["../../../src/components/Drawer/ResizeHandle.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type {\n  PropsWithoutRef,\n  Ref,\n  MouseEvent as ReactMouseEvent,\n  KeyboardEvent as ReactKeyboardEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport Button, { StyledButton } from '../Button';\nimport Icon, { registerIcon, StyledIcon } from '../Icon';\nimport { useConsolidatedRef, useEscape, useI18n } from '../../hooks';\nimport { getChildOfRootNode } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\nimport * as DragIcon from '../Icon/icons/drag.icon';\nimport * as ArrowUpDownIcon from '../Icon/icons/arrow-micro-up-down.icon';\n\nregisterIcon(DragIcon);\nregisterIcon(ArrowUpDownIcon);\n\nexport interface ResizeHandleProps {\n  onKeyDown: (e: ReactKeyboardEvent, grabbed: boolean) => void;\n  onMouseDown: (e: ReactMouseEvent) => void;\n  contextualLabel?: string;\n}\n\nconst StyledResizeButton = styled(Button)<{\n  rotateIcon?: boolean;\n}>(({ rotateIcon }) => {\n  return css`\n    cursor: grab;\n\n    &:active {\n      cursor: grabbing;\n    }\n\n    &:not(:focus) {\n      ${hideVisually};\n    }\n\n    ${rotateIcon &&\n    css`\n      ${StyledIcon} {\n        transform: rotate(90deg);\n      }\n    `}\n  `;\n});\n\nexport const StyledResizeHandle = styled.div(({ theme }) => {\n  return css`\n    position: absolute;\n    inset-inline-start: 0;\n    inset-block: 0;\n    inline-size: 0.125rem;\n    background-color: transparent;\n    transition: background-color ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n    cursor: ew-resize;\n    z-index: ${theme.base['z-index'].max};\n\n    ::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      width: calc(${theme.base['hit-area'].compact} * 0.75);\n    }\n\n    &:hover {\n      background-color: ${theme.base.palette.interactive};\n    }\n\n    ${StyledButton} {\n      position: absolute;\n      inset-block-start: 50%;\n      inset-inline-start: calc(-2 * ${theme.base.spacing});\n      translate: 0 -50%;\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledResizeHandle.defaultProps = defaultThemeProp;\n\nconst ResizeHandle = forwardRef(function ResizeHandle(\n  { onMouseDown, onKeyDown, contextualLabel }: PropsWithoutRef<ResizeHandleProps>,\n  ref: Ref<HTMLDivElement>\n) {\n  const resizeHandleRef = useConsolidatedRef<HTMLDivElement>(ref);\n  const t = useI18n();\n\n  const [mouseGrabbed, setMouseGrabbed] = useState(false);\n  const [keyboardGrabbed, setKeyboardGrabbed] = useState(false);\n\n  useEscape(() => {\n    setMouseGrabbed(false);\n    setKeyboardGrabbed(false);\n  });\n\n  const handleKeyDown = (e: ReactKeyboardEvent) => {\n    if (e.code === 'Space') {\n      e.preventDefault();\n      if (keyboardGrabbed) {\n        setKeyboardGrabbed(false);\n      } else {\n        setKeyboardGrabbed(true);\n      }\n    }\n\n    onKeyDown?.(e, keyboardGrabbed);\n  };\n\n  const handleMouseDown = (e: ReactMouseEvent) => {\n    const targetNode = getChildOfRootNode(resizeHandleRef);\n    if (!targetNode) return;\n    targetNode.style.setProperty('user-select', 'none');\n    setMouseGrabbed(true);\n    onMouseDown?.(e);\n  };\n\n  const handleMouseUp = () => {\n    const targetNode = getChildOfRootNode(resizeHandleRef);\n    if (!targetNode) return;\n    targetNode.style.removeProperty('user-select');\n    setMouseGrabbed(false);\n  };\n\n  const label = contextualLabel || t('resize');\n\n  return (\n    <StyledResizeHandle\n      onMouseDown={handleMouseDown}\n      onMouseUp={handleMouseUp}\n      ref={resizeHandleRef}\n    >\n      <StyledResizeButton\n        tabIndex={0}\n        icon\n        label={!mouseGrabbed && !keyboardGrabbed ? label : undefined}\n        aria-label={\n          !mouseGrabbed && !keyboardGrabbed\n            ? t('drag_handle_activate_description')\n            : t('drag_handle_cancel_description')\n        }\n        onMouseDown={handleMouseDown}\n        onKeyDown={handleKeyDown}\n        onBlur={() => {\n          setKeyboardGrabbed(false);\n        }}\n        rotateIcon={keyboardGrabbed}\n      >\n        <Icon name={keyboardGrabbed ? 'arrow-micro-up-down' : 'drag'} />\n      </StyledResizeButton>\n    </StyledResizeHandle>\n  );\n});\n\nexport default ResizeHandle;\n"]}

package/lib/components/RadioCheck/RadioCheck.d.ts

@@ -35,7 +35,9 @@ export type RadioCheckProps = WithAttributes<'input', NoChildrenProp & TestIdPro
     /** Suppresses announcements for status changes. */
     suppressAnnouncements?: FormFieldProps['suppressAnnouncements'];
 }>;
-export declare const StyledPseudoRadioCheck: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<RadioCheckProps, "readOnly" | "status">>> & string;
+export declare const StyledPseudoRadioCheck: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<RadioCheckProps, "readOnly" | "status"> & {
+    $labelEmpty?: boolean;
+}>> & string;
 export declare const StyledRadioCheckInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;
 export declare const StyledRadioCheck: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<RadioCheckProps, "disabled" | "readOnly">>> & string;
 export declare const StyledRadioCheckCard: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, Pick<RadioCheckProps, "disabled" | "readOnly" | "status">>> & string;

package/lib/components/RadioCheck/RadioCheck.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCheck.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAA8C,kBAAkB,EAAE,MAAM,OAAO,CAAC;AAK5F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAc,UAAU,EAAE,MAAM,aAAa,CAAC;AAK1F,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAIhE,MAAM,MAAM,eAAe,GAAG,cAAc,CAC1C,OAAO,EACP,cAAc,GACZ,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,8BAA8B;IAC9B,IAAI,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yEAAyE;IACzE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,iDAAiD;IACjD,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,sEAAsE;IACtE,QAAQ,CAAC,EAAE,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAChD,sDAAsD;IACtD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mDAAmD;IACnD,qBAAqB,CAAC,EAAE,cAAc,CAAC,uBAAuB,CAAC,CAAC;CACjE,CACJ,CAAC;AAEF,eAAO,MAAM,sBAAsB,iRAwClC,CAAC;AAIF,eAAO,MAAM,qBAAqB,sOAuGhC,CAAC;AAIH,eAAO,MAAM,gBAAgB,mRA8C5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,uSAyD/B,CAAC;;;;AAoIH,wBAA6D"}
+{"version":3,"file":"RadioCheck.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAA8C,kBAAkB,EAAE,MAAM,OAAO,CAAC;AAK5F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAc,UAAU,EAAE,MAAM,aAAa,CAAC;AAK1F,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAIhE,MAAM,MAAM,eAAe,GAAG,cAAc,CAC1C,OAAO,EACP,cAAc,GACZ,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,8BAA8B;IAC9B,IAAI,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yEAAyE;IACzE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,iDAAiD;IACjD,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,sEAAsE;IACtE,QAAQ,CAAC,EAAE,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAChD,sDAAsD;IACtD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mDAAmD;IACnD,qBAAqB,CAAC,EAAE,cAAc,CAAC,uBAAuB,CAAC,CAAC;CACjE,CACJ,CAAC;AAEF,eAAO,MAAM,sBAAsB;kBAC8B,OAAO;YAuCtE,CAAC;AAIH,eAAO,MAAM,qBAAqB,sOAuGhC,CAAC;AAIH,eAAO,MAAM,gBAAgB,mRA8C5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,uSAyD/B,CAAC;;;;AAuIH,wBAA6D"}

package/lib/components/RadioCheck/RadioCheck.js

@@ -11,32 +11,32 @@ import { StyledLabel } from '../Label';
 import { calculateFontSize, readableColor, getReadableStatusColor } from '../../styles';
 import HiddenText from '../HiddenText';
 import { getRadioCheckTestIds } from './RadioCheck.test-ids';
-export const StyledPseudoRadioCheck = styled.div(({ theme, status }) => {
+export const StyledPseudoRadioCheck = styled.div(({ theme, status, $labelEmpty }) => {
     const { components: { 'radio-check': { size, 'touch-size': touchSize, 'background-color': backgroundColor, 'border-color': borderColor, 'border-width': borderWidth } } } = theme;
     let statusBorderColor = borderColor;
     if (status === 'error' || status === 'warning') {
         statusBorderColor = getReadableStatusColor(theme, status);
     }
     return css `
-      display: flex;
-      flex-shrink: 0;
-      position: relative;
-      width: ${size};
-      height: ${size};
-      margin-inline-end: 1ch;
-      border: ${borderWidth} solid ${statusBorderColor};
-      background-color: ${backgroundColor};
+    display: flex;
+    flex-shrink: 0;
+    position: relative;
+    width: ${size};
+    height: ${size};
+    margin-inline-end: ${$labelEmpty ? '0' : '1ch'};
+    border: ${borderWidth} solid ${statusBorderColor};
+    background-color: ${backgroundColor};
 
-      @media (pointer: coarse) {
-        width: ${touchSize};
-        height: ${touchSize};
-      }
+    @media (pointer: coarse) {
+      width: ${touchSize};
+      height: ${touchSize};
+    }
 
-      &::after {
-        content: '';
-        display: none;
-      }
-    `;
+    &::after {
+      content: '';
+      display: none;
+    }
+  `;
 });
 StyledPseudoRadioCheck.defaultProps = defaultThemeProp;
 export const StyledRadioCheckInput = styled.input(({ theme, disabled, readOnly }) => {
@@ -233,7 +233,8 @@ const RadioCheck = forwardRef(function RadioCheck(props, ref) {
             ac.abort();
         };
     }, []);
-    return (_jsx(FormField, { testId: testIds, as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly }), label, readOnly && _jsx(HiddenText, { id: readonlyDescId, children: t('read_only') })] }), labelAs: card || ariaLabelledBy ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, info: info, isRadioCheck: true, inline: true, labelAfter: true, additionalInfo: additionalInfo, suppressAnnouncements: suppressAnnouncements, children: _jsx(StyledRadioCheckInput, { "data-testid": testIds.control, ...restProps, className: createClassName('radio-check', className, {
+    const labelEmpty = label === null || label === undefined || label === '';
+    return (_jsx(FormField, { testId: testIds, as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly, "$labelEmpty": labelEmpty }), label, readOnly && _jsx(HiddenText, { id: readonlyDescId, children: t('read_only') })] }), labelAs: card || ariaLabelledBy ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, info: info, isRadioCheck: true, inline: true, labelAfter: true, additionalInfo: additionalInfo, suppressAnnouncements: suppressAnnouncements, children: _jsx(StyledRadioCheckInput, { "data-testid": testIds.control, ...restProps, className: createClassName('radio-check', className, {
                 variant,
                 type
             }), id: id, "aria-labelledby": ariaLabelledBy, type: type, required: required, checked: checked, defaultChecked: defaultChecked, "aria-describedby": readOnly ? `${ariaDescribedby} ${readonlyDescId}` : ariaDescribedby, disabled: disabled, readOnly: readOnly, onChange: onChange, onClick: (e) => {

package/lib/components/RadioCheck/RadioCheck.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect } from 'react';\nimport type { MouseEvent, KeyboardEvent, PropsWithoutRef, ChangeEventHandler } from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport FormField, { StyledFormFieldInfo } from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { createClassName, getActiveElement, tryCatch, withTestIds } from '../../utils';\nimport type { NoChildrenProp, WithAttributes, RefElement, TestIdProp } from '../../types';\nimport { useConsolidatedRef, useDirection, useI18n, useTestIds, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize, readableColor, getReadableStatusColor } from '../../styles';\nimport HiddenText from '../HiddenText';\nimport type { elements } from '../FormField/FormField.test-ids';\n\nimport { getRadioCheckTestIds } from './RadioCheck.test-ids';\n\nexport type RadioCheckProps = WithAttributes<\n  'input',\n  NoChildrenProp &\n    TestIdProp<typeof elements> & {\n      /** Pass a string or a fragment with an Icon and string. */\n      label?: FormControlProps['label'];\n      /** Set visual state based on a validation state. */\n      status?: FormControlProps['status'];\n      /** Sets the type of input. */\n      type: 'radio' | 'checkbox';\n      /**\n       * Sets control to an [indeterminate state](https://css-tricks.com/almanac/selectors/i/indeterminate/#indeterminate-checkboxes).\n       * @default false\n       */\n      indeterminate?: boolean;\n      /** Sets checked prop via onChange when using as controlled component. */\n      checked?: boolean;\n      /** Initialize checked prop when using as uncontrolled component. */\n      defaultChecked?: boolean;\n      /**\n       * Controls the styling of the RadioCheck.\n       * @default 'simple'\n       */\n      variant?: 'simple' | 'card';\n      /** Pass a heading and content to show additional information on the field. */\n      additionalInfo?: FormControlProps['additionalInfo'];\n      /** info like error, success, warning messages */\n      info?: FormControlProps['info'];\n      /** Callback invoked when this particular radio button is selected. */\n      onChange?: ChangeEventHandler<HTMLInputElement>;\n      /** Pass a string used as input's aria-describedby. */\n      ariaDescribedby?: string;\n      /** Suppresses announcements for status changes. */\n      suppressAnnouncements?: FormFieldProps['suppressAnnouncements'];\n    }\n>;\n\nexport const StyledPseudoRadioCheck = styled.div<Pick<RadioCheckProps, 'readOnly' | 'status'>>(\n  ({ theme, status }) => {\n    const {\n      components: {\n        'radio-check': {\n          size,\n          'touch-size': touchSize,\n          'background-color': backgroundColor,\n          'border-color': borderColor,\n          'border-width': borderWidth\n        }\n      }\n    } = theme;\n\n    let statusBorderColor = borderColor;\n    if (status === 'error' || status === 'warning') {\n      statusBorderColor = getReadableStatusColor(theme, status);\n    }\n\n    return css`\n      display: flex;\n      flex-shrink: 0;\n      position: relative;\n      width: ${size};\n      height: ${size};\n      margin-inline-end: 1ch;\n      border: ${borderWidth} solid ${statusBorderColor};\n      background-color: ${backgroundColor};\n\n      @media (pointer: coarse) {\n        width: ${touchSize};\n        height: ${touchSize};\n      }\n\n      &::after {\n        content: '';\n        display: none;\n      }\n    `;\n  }\n);\n\nStyledPseudoRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckInput = styled.input(({ theme, disabled, readOnly }) => {\n  const {\n    base: { 'border-radius': baseBorderRadius },\n    components: {\n      'form-control': {\n        ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n        ':read-only': { 'background-color': readOnlyBackgroundColor }\n      },\n      'radio-check': {\n        size,\n        ':checked': {\n          'background-color': checkedBackgroundColor,\n          'border-color': checkedBorderColor\n        }\n      },\n      checkbox: { 'border-radius': checkRadius },\n      'radio-button': { 'border-radius': radioRadius }\n    }\n  } = theme;\n\n  const backgroundColor = readOnly ? readOnlyBackgroundColor : checkedBackgroundColor;\n  const foreground = tryCatch(() => readableColor(backgroundColor));\n\n  const prcSelector = `+ ${StyledLabel} ${StyledPseudoRadioCheck}`;\n  const { ltr } = useDirection();\n\n  return css`\n    ${hideVisually}\n    margin: 0;\n\n    /* Sets rect size for JAWS focus outline */\n    width: ${size};\n    height: ${size};\n\n    ${!disabled &&\n    css`\n      &:focus ${prcSelector} {\n        box-shadow: ${shadow};\n        border-color: ${focusBorderColor};\n      }\n    `}\n    &:checked\n      ${prcSelector},\n      &:checked:disabled\n      ${prcSelector},\n      &[type='checkbox']:indeterminate\n      ${prcSelector},\n      &[type='checkbox']:indeterminate:disabled\n      ${prcSelector} {\n      border-color: ${readOnly ? 'inherit' : checkedBorderColor};\n      background-color: ${backgroundColor};\n\n      &::after {\n        display: block;\n      }\n    }\n\n    &[type='radio'] ${prcSelector}, &[type='radio'] ${prcSelector}::after {\n      border-radius: ${radioRadius};\n    }\n\n    &[type='radio'] ${prcSelector}::after {\n      content: '';\n      position: absolute;\n      inset: 0;\n      margin: auto;\n      width: calc(${size} * 0.3);\n      height: calc(${size} * 0.3);\n      border-radius: ${radioRadius};\n      border: calc(${size} * 0.2) solid ${foreground};\n    }\n\n    &[type='checkbox'] ${prcSelector} {\n      border-radius: min(calc(${baseBorderRadius} * ${checkRadius}), 0.25rem);\n    }\n\n    &[type='checkbox']:not(:indeterminate) ${prcSelector} {\n      &::after {\n        width: 40%;\n        height: 75%;\n        ${ltr\n          ? css`\n              transform: rotate(45deg) translate(50%, -30%);\n            `\n          : css`\n              transform: rotate(45deg) translate(-50%, 30%);\n            `}\n        border-right: 0.15em solid ${foreground};\n        border-bottom: 0.15em solid ${foreground};\n      }\n    }\n\n    &[type='checkbox']:indeterminate ${prcSelector} {\n      display: flex;\n\n      &::after {\n        width: 90%;\n        height: 0.15em;\n        margin: auto;\n        background-color: ${foreground};\n      }\n    }\n  `;\n});\n\nStyledRadioCheckInput.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheck = styled.div<Pick<RadioCheckProps, 'disabled' | 'readOnly'>>(\n  ({ theme, disabled, readOnly }) => {\n    const {\n      base,\n      components: {\n        'radio-check': {\n          label: { color: labelColor, 'font-weight': labelFontWeight }\n        },\n        'form-control': {\n          ':hover': { 'border-color': hoverBorderColor }\n        }\n      }\n    } = theme;\n\n    const fontSize = calculateFontSize(base['font-size'], base['font-scale']);\n\n    return css`\n      > ${StyledLabel} {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        font-weight: ${labelFontWeight};\n        word-break: break-word;\n        font-size: ${fontSize.s};\n        color: ${labelColor};\n        margin: 0;\n        min-height: ${base['hit-area']['mouse-min']};\n\n        @media (pointer: coarse) {\n          min-height: ${base['hit-area']['finger-min']};\n        }\n      }\n\n      > ${StyledFormFieldInfo} {\n        margin: 0;\n        padding-inline-start: calc(${base.spacing} / 4);\n      }\n\n      ${!(disabled || readOnly) &&\n      css`\n        &:not(:focus-within) > ${StyledLabel}:hover ${StyledPseudoRadioCheck} {\n          border-color: ${hoverBorderColor};\n        }\n      `}\n    `;\n  }\n);\n\nStyledRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckCard = styled.label<\n  Pick<RadioCheckProps, 'disabled' | 'readOnly' | 'status'>\n>(({ theme, disabled, readOnly, status }) => {\n  const {\n    base: { palette, shadow, spacing },\n    components: {\n      card,\n      'radio-check': { label },\n      'form-control': {\n        ':hover': { 'border-color': hoverBorderColor }\n      }\n    }\n  } = theme;\n\n  const useBorderColor =\n    status === 'error' ? getReadableStatusColor(theme, 'error') : palette['border-line'];\n\n  return css`\n    min-width: min-content;\n    cursor: pointer;\n    background-color: ${card.background};\n    border-radius: ${card['border-radius']};\n    border: 0.0625rem solid ${useBorderColor};\n    padding: ${spacing};\n\n    ${disabled &&\n    css`\n      cursor: not-allowed;\n    `}\n    ${!(disabled || readOnly) &&\n    css`\n      :hover:not(:focus-within) {\n        border-color: ${hoverBorderColor};\n\n        ${StyledLabel} ${StyledPseudoRadioCheck} {\n          border-color: ${hoverBorderColor};\n        }\n      }\n\n      :focus-within {\n        box-shadow: ${shadow.focus};\n        border-color: transparent;\n      }\n    `}\n        > ${StyledLabel} {\n      display: flex;\n      align-items: center;\n      color: ${label.color};\n      font-weight: ${label['font-weight']};\n      margin: 0;\n    }\n\n    > ${StyledFormFieldInfo} {\n      margin: 0;\n      padding-inline-start: calc(${spacing} / 4);\n    }\n  `;\n});\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck = forwardRef<RefElement<RadioCheckProps>, PropsWithoutRef<RadioCheckProps>>(\n  function RadioCheck(props, ref) {\n    const uid = useUID();\n    const t = useI18n();\n\n    const {\n      testId,\n      type,\n      id = uid,\n      label,\n      'aria-labelledby': ariaLabelledBy,\n      required = false,\n      disabled = false,\n      readOnly = false,\n      indeterminate = false,\n      checked,\n      defaultChecked,\n      variant = 'simple',\n      onClick,\n      onKeyDown,\n      onChange,\n      status,\n      info,\n      additionalInfo,\n      ariaDescribedby,\n      suppressAnnouncements,\n      className,\n      ...restProps\n    } = props;\n\n    const testIds = useTestIds(testId, getRadioCheckTestIds);\n    const isRadio = type === 'radio';\n    const card = variant === 'card';\n    const inputRef = useConsolidatedRef(ref);\n    const readonlyDescId = useUID();\n\n    useEffect(() => {\n      if (!isRadio && inputRef.current) inputRef.current.indeterminate = !!indeterminate;\n    }, [inputRef, indeterminate, isRadio]);\n\n    // Prevents blur when a user mouse clicks the label to select an input that is actively focused.\n    useEffect(() => {\n      if (!inputRef.current) return;\n\n      const labelEl = inputRef.current.nextSibling;\n\n      if (labelEl?.nodeName.toUpperCase() !== 'LABEL') return;\n\n      const ac = new AbortController();\n\n      labelEl.addEventListener(\n        'mousedown',\n        e => {\n          if (inputRef.current === getActiveElement()) {\n            e.preventDefault();\n          }\n        },\n        { signal: ac.signal }\n      );\n\n      return () => {\n        ac.abort();\n      };\n    }, []);\n\n    return (\n      <FormField\n        testId={testIds}\n        as={card ? StyledRadioCheckCard : StyledRadioCheck}\n        label={\n          <>\n            <StyledPseudoRadioCheck\n              status={status}\n              as={StyledFormControl}\n              required={required}\n              disabled={disabled}\n              readOnly={readOnly}\n            />\n            {label}\n            {readOnly && <HiddenText id={readonlyDescId}>{t('read_only')}</HiddenText>}\n          </>\n        }\n        labelAs={card || ariaLabelledBy ? 'div' : undefined}\n        id={id}\n        required={required}\n        disabled={disabled}\n        readOnly={readOnly}\n        status={status}\n        info={info}\n        isRadioCheck\n        inline\n        labelAfter\n        additionalInfo={additionalInfo}\n        suppressAnnouncements={suppressAnnouncements}\n      >\n        <StyledRadioCheckInput\n          data-testid={testIds.control}\n          {...restProps}\n          className={createClassName('radio-check', className, {\n            variant,\n            type\n          })}\n          id={id}\n          aria-labelledby={ariaLabelledBy}\n          type={type}\n          required={required}\n          checked={checked}\n          defaultChecked={defaultChecked}\n          aria-describedby={readOnly ? `${ariaDescribedby} ${readonlyDescId}` : ariaDescribedby}\n          disabled={disabled}\n          readOnly={readOnly}\n          onChange={onChange}\n          onClick={(e: MouseEvent<HTMLInputElement>) => {\n            if (readOnly) e.preventDefault();\n            onClick?.(e);\n          }}\n          onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n            if (type === 'checkbox' && readOnly && e.key === ' ') e.preventDefault();\n            if (type === 'radio' && readOnly && e.key.includes('Arrow')) e.preventDefault();\n            onKeyDown?.(e);\n          }}\n          ref={inputRef}\n        />\n      </FormField>\n    );\n  }\n);\n\nexport default withTestIds(RadioCheck, getRadioCheckTestIds);\n"]}
+{"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect } from 'react';\nimport type { MouseEvent, KeyboardEvent, PropsWithoutRef, ChangeEventHandler } from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport FormField, { StyledFormFieldInfo } from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { createClassName, getActiveElement, tryCatch, withTestIds } from '../../utils';\nimport type { NoChildrenProp, WithAttributes, RefElement, TestIdProp } from '../../types';\nimport { useConsolidatedRef, useDirection, useI18n, useTestIds, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize, readableColor, getReadableStatusColor } from '../../styles';\nimport HiddenText from '../HiddenText';\nimport type { elements } from '../FormField/FormField.test-ids';\n\nimport { getRadioCheckTestIds } from './RadioCheck.test-ids';\n\nexport type RadioCheckProps = WithAttributes<\n  'input',\n  NoChildrenProp &\n    TestIdProp<typeof elements> & {\n      /** Pass a string or a fragment with an Icon and string. */\n      label?: FormControlProps['label'];\n      /** Set visual state based on a validation state. */\n      status?: FormControlProps['status'];\n      /** Sets the type of input. */\n      type: 'radio' | 'checkbox';\n      /**\n       * Sets control to an [indeterminate state](https://css-tricks.com/almanac/selectors/i/indeterminate/#indeterminate-checkboxes).\n       * @default false\n       */\n      indeterminate?: boolean;\n      /** Sets checked prop via onChange when using as controlled component. */\n      checked?: boolean;\n      /** Initialize checked prop when using as uncontrolled component. */\n      defaultChecked?: boolean;\n      /**\n       * Controls the styling of the RadioCheck.\n       * @default 'simple'\n       */\n      variant?: 'simple' | 'card';\n      /** Pass a heading and content to show additional information on the field. */\n      additionalInfo?: FormControlProps['additionalInfo'];\n      /** info like error, success, warning messages */\n      info?: FormControlProps['info'];\n      /** Callback invoked when this particular radio button is selected. */\n      onChange?: ChangeEventHandler<HTMLInputElement>;\n      /** Pass a string used as input's aria-describedby. */\n      ariaDescribedby?: string;\n      /** Suppresses announcements for status changes. */\n      suppressAnnouncements?: FormFieldProps['suppressAnnouncements'];\n    }\n>;\n\nexport const StyledPseudoRadioCheck = styled.div<\n  Pick<RadioCheckProps, 'readOnly' | 'status'> & { $labelEmpty?: boolean }\n>(({ theme, status, $labelEmpty }) => {\n  const {\n    components: {\n      'radio-check': {\n        size,\n        'touch-size': touchSize,\n        'background-color': backgroundColor,\n        'border-color': borderColor,\n        'border-width': borderWidth\n      }\n    }\n  } = theme;\n\n  let statusBorderColor = borderColor;\n  if (status === 'error' || status === 'warning') {\n    statusBorderColor = getReadableStatusColor(theme, status);\n  }\n\n  return css`\n    display: flex;\n    flex-shrink: 0;\n    position: relative;\n    width: ${size};\n    height: ${size};\n    margin-inline-end: ${$labelEmpty ? '0' : '1ch'};\n    border: ${borderWidth} solid ${statusBorderColor};\n    background-color: ${backgroundColor};\n\n    @media (pointer: coarse) {\n      width: ${touchSize};\n      height: ${touchSize};\n    }\n\n    &::after {\n      content: '';\n      display: none;\n    }\n  `;\n});\n\nStyledPseudoRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckInput = styled.input(({ theme, disabled, readOnly }) => {\n  const {\n    base: { 'border-radius': baseBorderRadius },\n    components: {\n      'form-control': {\n        ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n        ':read-only': { 'background-color': readOnlyBackgroundColor }\n      },\n      'radio-check': {\n        size,\n        ':checked': {\n          'background-color': checkedBackgroundColor,\n          'border-color': checkedBorderColor\n        }\n      },\n      checkbox: { 'border-radius': checkRadius },\n      'radio-button': { 'border-radius': radioRadius }\n    }\n  } = theme;\n\n  const backgroundColor = readOnly ? readOnlyBackgroundColor : checkedBackgroundColor;\n  const foreground = tryCatch(() => readableColor(backgroundColor));\n\n  const prcSelector = `+ ${StyledLabel} ${StyledPseudoRadioCheck}`;\n  const { ltr } = useDirection();\n\n  return css`\n    ${hideVisually}\n    margin: 0;\n\n    /* Sets rect size for JAWS focus outline */\n    width: ${size};\n    height: ${size};\n\n    ${!disabled &&\n    css`\n      &:focus ${prcSelector} {\n        box-shadow: ${shadow};\n        border-color: ${focusBorderColor};\n      }\n    `}\n    &:checked\n      ${prcSelector},\n      &:checked:disabled\n      ${prcSelector},\n      &[type='checkbox']:indeterminate\n      ${prcSelector},\n      &[type='checkbox']:indeterminate:disabled\n      ${prcSelector} {\n      border-color: ${readOnly ? 'inherit' : checkedBorderColor};\n      background-color: ${backgroundColor};\n\n      &::after {\n        display: block;\n      }\n    }\n\n    &[type='radio'] ${prcSelector}, &[type='radio'] ${prcSelector}::after {\n      border-radius: ${radioRadius};\n    }\n\n    &[type='radio'] ${prcSelector}::after {\n      content: '';\n      position: absolute;\n      inset: 0;\n      margin: auto;\n      width: calc(${size} * 0.3);\n      height: calc(${size} * 0.3);\n      border-radius: ${radioRadius};\n      border: calc(${size} * 0.2) solid ${foreground};\n    }\n\n    &[type='checkbox'] ${prcSelector} {\n      border-radius: min(calc(${baseBorderRadius} * ${checkRadius}), 0.25rem);\n    }\n\n    &[type='checkbox']:not(:indeterminate) ${prcSelector} {\n      &::after {\n        width: 40%;\n        height: 75%;\n        ${ltr\n          ? css`\n              transform: rotate(45deg) translate(50%, -30%);\n            `\n          : css`\n              transform: rotate(45deg) translate(-50%, 30%);\n            `}\n        border-right: 0.15em solid ${foreground};\n        border-bottom: 0.15em solid ${foreground};\n      }\n    }\n\n    &[type='checkbox']:indeterminate ${prcSelector} {\n      display: flex;\n\n      &::after {\n        width: 90%;\n        height: 0.15em;\n        margin: auto;\n        background-color: ${foreground};\n      }\n    }\n  `;\n});\n\nStyledRadioCheckInput.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheck = styled.div<Pick<RadioCheckProps, 'disabled' | 'readOnly'>>(\n  ({ theme, disabled, readOnly }) => {\n    const {\n      base,\n      components: {\n        'radio-check': {\n          label: { color: labelColor, 'font-weight': labelFontWeight }\n        },\n        'form-control': {\n          ':hover': { 'border-color': hoverBorderColor }\n        }\n      }\n    } = theme;\n\n    const fontSize = calculateFontSize(base['font-size'], base['font-scale']);\n\n    return css`\n      > ${StyledLabel} {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        font-weight: ${labelFontWeight};\n        word-break: break-word;\n        font-size: ${fontSize.s};\n        color: ${labelColor};\n        margin: 0;\n        min-height: ${base['hit-area']['mouse-min']};\n\n        @media (pointer: coarse) {\n          min-height: ${base['hit-area']['finger-min']};\n        }\n      }\n\n      > ${StyledFormFieldInfo} {\n        margin: 0;\n        padding-inline-start: calc(${base.spacing} / 4);\n      }\n\n      ${!(disabled || readOnly) &&\n      css`\n        &:not(:focus-within) > ${StyledLabel}:hover ${StyledPseudoRadioCheck} {\n          border-color: ${hoverBorderColor};\n        }\n      `}\n    `;\n  }\n);\n\nStyledRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckCard = styled.label<\n  Pick<RadioCheckProps, 'disabled' | 'readOnly' | 'status'>\n>(({ theme, disabled, readOnly, status }) => {\n  const {\n    base: { palette, shadow, spacing },\n    components: {\n      card,\n      'radio-check': { label },\n      'form-control': {\n        ':hover': { 'border-color': hoverBorderColor }\n      }\n    }\n  } = theme;\n\n  const useBorderColor =\n    status === 'error' ? getReadableStatusColor(theme, 'error') : palette['border-line'];\n\n  return css`\n    min-width: min-content;\n    cursor: pointer;\n    background-color: ${card.background};\n    border-radius: ${card['border-radius']};\n    border: 0.0625rem solid ${useBorderColor};\n    padding: ${spacing};\n\n    ${disabled &&\n    css`\n      cursor: not-allowed;\n    `}\n    ${!(disabled || readOnly) &&\n    css`\n      :hover:not(:focus-within) {\n        border-color: ${hoverBorderColor};\n\n        ${StyledLabel} ${StyledPseudoRadioCheck} {\n          border-color: ${hoverBorderColor};\n        }\n      }\n\n      :focus-within {\n        box-shadow: ${shadow.focus};\n        border-color: transparent;\n      }\n    `}\n        > ${StyledLabel} {\n      display: flex;\n      align-items: center;\n      color: ${label.color};\n      font-weight: ${label['font-weight']};\n      margin: 0;\n    }\n\n    > ${StyledFormFieldInfo} {\n      margin: 0;\n      padding-inline-start: calc(${spacing} / 4);\n    }\n  `;\n});\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck = forwardRef<RefElement<RadioCheckProps>, PropsWithoutRef<RadioCheckProps>>(\n  function RadioCheck(props, ref) {\n    const uid = useUID();\n    const t = useI18n();\n\n    const {\n      testId,\n      type,\n      id = uid,\n      label,\n      'aria-labelledby': ariaLabelledBy,\n      required = false,\n      disabled = false,\n      readOnly = false,\n      indeterminate = false,\n      checked,\n      defaultChecked,\n      variant = 'simple',\n      onClick,\n      onKeyDown,\n      onChange,\n      status,\n      info,\n      additionalInfo,\n      ariaDescribedby,\n      suppressAnnouncements,\n      className,\n      ...restProps\n    } = props;\n\n    const testIds = useTestIds(testId, getRadioCheckTestIds);\n    const isRadio = type === 'radio';\n    const card = variant === 'card';\n    const inputRef = useConsolidatedRef(ref);\n    const readonlyDescId = useUID();\n\n    useEffect(() => {\n      if (!isRadio && inputRef.current) inputRef.current.indeterminate = !!indeterminate;\n    }, [inputRef, indeterminate, isRadio]);\n\n    // Prevents blur when a user mouse clicks the label to select an input that is actively focused.\n    useEffect(() => {\n      if (!inputRef.current) return;\n\n      const labelEl = inputRef.current.nextSibling;\n\n      if (labelEl?.nodeName.toUpperCase() !== 'LABEL') return;\n\n      const ac = new AbortController();\n\n      labelEl.addEventListener(\n        'mousedown',\n        e => {\n          if (inputRef.current === getActiveElement()) {\n            e.preventDefault();\n          }\n        },\n        { signal: ac.signal }\n      );\n\n      return () => {\n        ac.abort();\n      };\n    }, []);\n\n    const labelEmpty = label === null || label === undefined || label === '';\n\n    return (\n      <FormField\n        testId={testIds}\n        as={card ? StyledRadioCheckCard : StyledRadioCheck}\n        label={\n          <>\n            <StyledPseudoRadioCheck\n              status={status}\n              as={StyledFormControl}\n              required={required}\n              disabled={disabled}\n              readOnly={readOnly}\n              $labelEmpty={labelEmpty}\n            />\n            {label}\n            {readOnly && <HiddenText id={readonlyDescId}>{t('read_only')}</HiddenText>}\n          </>\n        }\n        labelAs={card || ariaLabelledBy ? 'div' : undefined}\n        id={id}\n        required={required}\n        disabled={disabled}\n        readOnly={readOnly}\n        status={status}\n        info={info}\n        isRadioCheck\n        inline\n        labelAfter\n        additionalInfo={additionalInfo}\n        suppressAnnouncements={suppressAnnouncements}\n      >\n        <StyledRadioCheckInput\n          data-testid={testIds.control}\n          {...restProps}\n          className={createClassName('radio-check', className, {\n            variant,\n            type\n          })}\n          id={id}\n          aria-labelledby={ariaLabelledBy}\n          type={type}\n          required={required}\n          checked={checked}\n          defaultChecked={defaultChecked}\n          aria-describedby={readOnly ? `${ariaDescribedby} ${readonlyDescId}` : ariaDescribedby}\n          disabled={disabled}\n          readOnly={readOnly}\n          onChange={onChange}\n          onClick={(e: MouseEvent<HTMLInputElement>) => {\n            if (readOnly) e.preventDefault();\n            onClick?.(e);\n          }}\n          onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n            if (type === 'checkbox' && readOnly && e.key === ' ') e.preventDefault();\n            if (type === 'radio' && readOnly && e.key.includes('Arrow')) e.preventDefault();\n            onKeyDown?.(e);\n          }}\n          ref={inputRef}\n        />\n      </FormField>\n    );\n  }\n);\n\nexport default withTestIds(RadioCheck, getRadioCheckTestIds);\n"]}

package/lib/components/RadioCheckGroup/RadioCheckGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCheckGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,GAAG,EAEH,YAAY,EACZ,WAAW,EAEZ,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAc,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAiBrD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAKhE,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAC/C,UAAU,EACV,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG;IAC5B,sDAAsD;IACtD,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtD,mGAAmG;IACnG,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC;;;OAGG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,GAAG,WAAW,CAAC;IACnD,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB,CACF,CAAC;AAEF,eAAO,MAAM,qBAAqB,+OAuBhC,CAAC;;;;AAyJH,wBAAuE"}
+{"version":3,"file":"RadioCheckGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,GAAG,EAEH,YAAY,EACZ,WAAW,EAEZ,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAc,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAUrD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAKhE,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAC/C,UAAU,EACV,UAAU,CAAC,OAAO,QAAQ,CAAC,GAAG;IAC5B,sDAAsD;IACtD,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtD,mGAAmG;IACnG,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC;;;OAGG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,GAAG,WAAW,CAAC;IACnD,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB,CACF,CAAC;AAEF,eAAO,MAAM,qBAAqB,+OAwBhC,CAAC;;;;AAkMH,wBAAuE"}

package/lib/components/RadioCheckGroup/RadioCheckGroup.js

@@ -4,14 +4,15 @@ import styled, { css } from 'styled-components';
 import FormField from '../FormField';
 import { StyledFormField, StyledFormFieldInfo } from '../FormField/FormField';
 import Flex from '../Flex';
-import { useArrows, useConsolidatedRef, useElement, useTestIds, useTheme, useUID } from '../../hooks';
-import Grid from '../Grid';
+import { defaultThemeProp } from '../../theme';
+import { useArrows, useConsolidatedRef, useElement, useTestIds, useUID } from '../../hooks';
 import { StyledImageContainer, StyledSelectionCard, StyledSelectionCardInline } from '../SelectionCard/SelectionCard.styles';
 import { getActiveElement, withTestIds } from '../../utils';
 import { StyledRadioCheck } from '../RadioCheck/RadioCheck';
 import { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';
 export const StyledRadioCheckGroup = styled.fieldset(() => {
     return css `
+    container-type: inline-size;
     flex-wrap: nowrap;
 
     &[disabled] {
@@ -34,11 +35,50 @@ export const StyledRadioCheckGroup = styled.fieldset(() => {
     }
   `;
 });
+const getCardGridContainerStyles = (theme) => {
+    const cardWidth = theme.base['content-width'].md;
+    return css `
+    display: grid;
+    gap: ${theme.base.spacing};
+    grid-template-columns: 1fr;
+    grid-auto-rows: 1fr;
+
+    @container (min-width: calc(2 * ${cardWidth})) {
+      grid-template-columns: repeat(2, 1fr);
+    }
+
+    @container (min-width: calc(3 * ${cardWidth})) {
+      grid-template-columns: repeat(3, 1fr);
+    }
+
+    @container (min-width: calc(4 * ${cardWidth})) {
+      grid-template-columns: repeat(4, 1fr);
+    }
+  `;
+};
+const StyledCardGrid = styled.div(({ theme, renderInline, autoStack, childCount }) => {
+    if (!renderInline) {
+        return css `
+      display: grid;
+      gap: ${theme.base.spacing};
+      grid-template-columns: minmax(min-content, max-content);
+      grid-auto-rows: 1fr;
+    `;
+    }
+    return autoStack
+        ? getCardGridContainerStyles(theme)
+        : css `
+        display: grid;
+        gap: ${theme.base.spacing};
+        grid-template-columns: repeat(${childCount}, 1fr);
+        grid-auto-rows: 1fr;
+      `;
+});
+StyledCardGrid.defaultProps = defaultThemeProp;
 const RadioCheckGroup = forwardRef(function RadioCheckGroup(props, ref) {
     const uid = useUID();
     const { testId, children, name = uid, disabled = false, required = false, onChange, readOnly, inline = false, autoStack = true, variant = 'simple', arrowNavigation = true, onClear, ...restProps } = props;
     const testIds = useTestIds(testId, getRadioCheckGroupTestIds);
-    const theme = useTheme();
     const [optionsEl, setOptionsEl] = useElement();
     const [renderInline, setRenderInline] = useState(inline);
     const renderInlineRef = useRef(inline);
@@ -102,17 +142,7 @@ const RadioCheckGroup = forwardRef(function RadioCheckGroup(props, ref) {
             if (!(e.target instanceof Element) || !e.target.closest('label'))
                 return;
             e.preventDefault();
-        }, children: variant === 'card-grid' ? (_jsx(Grid, { container: {
-                gap: 1,
-                cols: (() => {
-                    if (!renderInline)
-                        return 'minmax(min-content, max-content)';
-                    if (autoStack)
-                        return `repeat(auto-fit, minmax(min(${theme.base['content-width'].md}, 100%), 1fr))`;
-                    return `repeat(${Children.count(children)}, 1fr)`;
-                })(),
-                autoRows: '1fr'
-            }, children: mapChildren })) : (_jsx(Flex, { ref: setOptionsEl, container: {
+        }, children: variant === 'card-grid' ? (_jsx(StyledCardGrid, { ref: setOptionsEl, renderInline: renderInline, autoStack: autoStack, childCount: Children.count(children), children: mapChildren })) : (_jsx(Flex, { ref: setOptionsEl, container: {
                 direction: renderInline ? 'row' : 'column',
                 colGap: renderInline ? 1.5 : 2,
                 rowGap: variant === 'card' ? 1 : 0,

package/lib/components/RadioCheckGroup/RadioCheckGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, Children, cloneElement, useState, useEffect, useRef, useMemo } from 'react';\nimport type {\n  Ref,\n  PropsWithoutRef,\n  ReactElement,\n  ChangeEvent,\n  MouseEvent as ReactMouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { RefElement, TestIdProp, WithAttributes } from '../../types';\nimport FormField from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormField, StyledFormFieldInfo } from '../FormField/FormField';\nimport type { FormControlProps } from '../FormControl';\nimport type { RadioCheckProps } from '../RadioCheck';\nimport Flex from '../Flex';\nimport {\n  useArrows,\n  useConsolidatedRef,\n  useElement,\n  useTestIds,\n  useTheme,\n  useUID\n} from '../../hooks';\nimport Grid from '../Grid';\nimport {\n  StyledImageContainer,\n  StyledSelectionCard,\n  StyledSelectionCardInline\n} from '../SelectionCard/SelectionCard.styles';\nimport { getActiveElement, withTestIds } from '../../utils';\nimport type { elements } from '../FormField/FormField.test-ids';\nimport { StyledRadioCheck } from '../RadioCheck/RadioCheck';\n\nimport { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';\n\nexport type RadioCheckGroupProps = WithAttributes<\n  'fieldset',\n  TestIdProp<typeof elements> & {\n    /** Accepts Checkboxes or RadioButtons as children. */\n    children: ReactElement | ReactElement[];\n    /**\n     * Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n     * Additionally, onChange can be passed to individual children.\n     * Both handlers will be called, child followed by group.\n     */\n    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n    /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n    onClear?: FormFieldProps['onClear'];\n    /** Set visual state based on a validation state. */\n    status?: FormControlProps['status'];\n    /** Pass a string or a fragment with an Icon and string. */\n    label?: FormControlProps['label'];\n    /** Visually hides the label region. */\n    labelHidden?: FormControlProps['labelHidden'];\n    /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n    info?: FormControlProps['info'];\n    /** Indicate if the field is required. The browser defaults to false. */\n    required?: FormControlProps['required'];\n    /** Disable the control. The browser defaults to false. */\n    disabled?: FormControlProps['disabled'];\n    /** Makes the input non editable and non clickable. The browser defaults to false. */\n    readOnly?: FormControlProps['readOnly'];\n    /**\n     * Layout field elements inline in a row.\n     * @default false\n     */\n    inline?: FormFieldProps['inline'];\n    /** Used to toggle the auto stacking feature of an inlined group.\n     * @default true\n     */\n    autoStack?: boolean;\n    /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n    name?: FormControlProps['name'];\n    /**\n     * Controls the styling of the child RadioChecks.\n     * @default 'simple'\n     */\n    variant?: RadioCheckProps['variant'] | 'card-grid';\n    /** Pass a heading and content to show additional information on the field. */\n    additionalInfo?: FormControlProps['additionalInfo'];\n    /**\n     * Enables arrow key navigation between options in the group.\n     * Disable for checkbox groups where each option is independently selectable.\n     * @default true\n     */\n    arrowNavigation?: boolean;\n    /** Ref forwarded to the wrapping element. */\n    ref?: Ref<HTMLElement>;\n  }\n>;\n\nexport const StyledRadioCheckGroup = styled.fieldset(() => {\n  return css`\n    flex-wrap: nowrap;\n\n    &[disabled] {\n      > ${StyledFormField} {\n        opacity: unset;\n      }\n    }\n\n    ${StyledSelectionCard} {\n      max-width: 100%;\n    }\n\n    ${StyledSelectionCardInline} ${StyledImageContainer} {\n      /* To enlarge the image containers to the size of the biggest one */\n      min-height: 100%;\n    }\n\n    ${StyledRadioCheck} > ${StyledFormFieldInfo} {\n      display: none;\n    }\n  `;\n});\n\nconst RadioCheckGroup = forwardRef<\n  RefElement<RadioCheckGroupProps>,\n  PropsWithoutRef<RadioCheckGroupProps>\n>(function RadioCheckGroup(props, ref) {\n  const uid = useUID();\n  const {\n    testId,\n    children,\n    name = uid,\n    disabled = false,\n    required = false,\n    onChange,\n    readOnly,\n    inline = false,\n    autoStack = true,\n    variant = 'simple',\n    arrowNavigation = true,\n    onClear,\n    ...restProps\n  } = props;\n\n  const testIds = useTestIds(testId, getRadioCheckGroupTestIds);\n  const theme = useTheme();\n  const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n  const [renderInline, setRenderInline] = useState(inline);\n  const renderInlineRef = useRef(inline);\n  const minInlineWidth = useRef(0);\n  const containerRef = useConsolidatedRef(ref);\n  const skipRef = useRef<HTMLElement>(null);\n\n  useArrows(\n    arrowNavigation ? containerRef : skipRef,\n    {\n      selector: '[data-main-focus]',\n      cycle: false,\n      dir: 'both'\n    },\n    [children]\n  );\n\n  useEffect(() => {\n    setRenderInline(inline);\n    if (inline && optionsEl && optionsEl.lastChild && autoStack) {\n      const intersectionObserver = new IntersectionObserver(\n        entries => {\n          if (entries[0].intersectionRatio < 1) {\n            if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n            renderInlineRef.current = false;\n            setRenderInline(false);\n          }\n        },\n        { root: optionsEl, threshold: 1 }\n      );\n\n      const resizeObserver = new ResizeObserver(entries => {\n        if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n          renderInlineRef.current = true;\n          setRenderInline(true);\n        }\n      });\n\n      intersectionObserver.observe(optionsEl.lastChild as Element);\n      resizeObserver.observe(optionsEl);\n\n      return () => {\n        intersectionObserver.disconnect();\n        resizeObserver.disconnect();\n      };\n    }\n  }, [optionsEl, inline, autoStack]);\n\n  const mapChildren = useMemo(\n    () =>\n      Children.map(children, child =>\n        cloneElement(child, {\n          name,\n          status: restProps.status,\n          disabled: disabled || child.props.disabled,\n          readOnly: readOnly || child.props.readOnly,\n          variant: variant === 'card-grid' ? 'card' : variant,\n          suppressAnnouncements: true,\n          onChange: onChange\n            ? (e: ChangeEvent<HTMLInputElement>) => {\n                if (!(readOnly || child.props.readOnly)) {\n                  child.props.onChange?.(e);\n                  onChange(e);\n                }\n              }\n            : child.props.onChange\n        })\n      ),\n    [children, name, disabled, readOnly, variant, onChange]\n  );\n\n  return (\n    <FormField\n      testId={testIds}\n      as={StyledRadioCheckGroup}\n      labelAs='legend'\n      ref={containerRef}\n      name={name}\n      disabled={disabled}\n      required={required}\n      {...restProps}\n      isRadioCheck\n      onClear={onClear}\n      // Prevents blur when any input within the group is actively focused.\n      onMouseDown={(e: ReactMouseEvent<HTMLFieldSetElement>) => {\n        restProps.onMouseDown?.(e);\n\n        if (!containerRef.current) return;\n\n        if (!containerRef.current.contains(getActiveElement())) return;\n\n        if (!(e.target instanceof Element) || !e.target.closest('label')) return;\n\n        e.preventDefault();\n      }}\n    >\n      {variant === 'card-grid' ? (\n        <Grid\n          container={{\n            gap: 1,\n            cols: (() => {\n              if (!renderInline) return 'minmax(min-content, max-content)';\n              if (autoStack)\n                return `repeat(auto-fit, minmax(min(${theme.base['content-width'].md}, 100%), 1fr))`;\n              return `repeat(${Children.count(children)}, 1fr)`;\n            })(),\n            autoRows: '1fr'\n          }}\n        >\n          {mapChildren}\n        </Grid>\n      ) : (\n        <Flex\n          ref={setOptionsEl}\n          container={{\n            direction: renderInline ? 'row' : 'column',\n            colGap: renderInline ? 1.5 : 2,\n            rowGap: variant === 'card' ? 1 : 0,\n            wrap: 'wrap'\n          }}\n        >\n          {mapChildren}\n        </Flex>\n      )}\n    </FormField>\n  );\n});\n\nexport default withTestIds(RadioCheckGroup, getRadioCheckGroupTestIds);\n"]}
+{"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, Children, cloneElement, useState, useEffect, useRef, useMemo } from 'react';\nimport type {\n  Ref,\n  PropsWithoutRef,\n  ReactElement,\n  ChangeEvent,\n  MouseEvent as ReactMouseEvent\n} from 'react';\nimport styled, { css, type DefaultTheme } from 'styled-components';\n\nimport type { RefElement, TestIdProp, WithAttributes } from '../../types';\nimport FormField from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormField, StyledFormFieldInfo } from '../FormField/FormField';\nimport type { FormControlProps } from '../FormControl';\nimport type { RadioCheckProps } from '../RadioCheck';\nimport Flex from '../Flex';\nimport { defaultThemeProp } from '../../theme';\nimport { useArrows, useConsolidatedRef, useElement, useTestIds, useUID } from '../../hooks';\nimport {\n  StyledImageContainer,\n  StyledSelectionCard,\n  StyledSelectionCardInline\n} from '../SelectionCard/SelectionCard.styles';\nimport { getActiveElement, withTestIds } from '../../utils';\nimport type { elements } from '../FormField/FormField.test-ids';\nimport { StyledRadioCheck } from '../RadioCheck/RadioCheck';\n\nimport { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';\n\nexport type RadioCheckGroupProps = WithAttributes<\n  'fieldset',\n  TestIdProp<typeof elements> & {\n    /** Accepts Checkboxes or RadioButtons as children. */\n    children: ReactElement | ReactElement[];\n    /**\n     * Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n     * Additionally, onChange can be passed to individual children.\n     * Both handlers will be called, child followed by group.\n     */\n    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n    /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n    onClear?: FormFieldProps['onClear'];\n    /** Set visual state based on a validation state. */\n    status?: FormControlProps['status'];\n    /** Pass a string or a fragment with an Icon and string. */\n    label?: FormControlProps['label'];\n    /** Visually hides the label region. */\n    labelHidden?: FormControlProps['labelHidden'];\n    /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n    info?: FormControlProps['info'];\n    /** Indicate if the field is required. The browser defaults to false. */\n    required?: FormControlProps['required'];\n    /** Disable the control. The browser defaults to false. */\n    disabled?: FormControlProps['disabled'];\n    /** Makes the input non editable and non clickable. The browser defaults to false. */\n    readOnly?: FormControlProps['readOnly'];\n    /**\n     * Layout field elements inline in a row.\n     * @default false\n     */\n    inline?: FormFieldProps['inline'];\n    /** Used to toggle the auto stacking feature of an inlined group.\n     * @default true\n     */\n    autoStack?: boolean;\n    /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n    name?: FormControlProps['name'];\n    /**\n     * Controls the styling of the child RadioChecks.\n     * @default 'simple'\n     */\n    variant?: RadioCheckProps['variant'] | 'card-grid';\n    /** Pass a heading and content to show additional information on the field. */\n    additionalInfo?: FormControlProps['additionalInfo'];\n    /**\n     * Enables arrow key navigation between options in the group.\n     * Disable for checkbox groups where each option is independently selectable.\n     * @default true\n     */\n    arrowNavigation?: boolean;\n    /** Ref forwarded to the wrapping element. */\n    ref?: Ref<HTMLElement>;\n  }\n>;\n\nexport const StyledRadioCheckGroup = styled.fieldset(() => {\n  return css`\n    container-type: inline-size;\n    flex-wrap: nowrap;\n\n    &[disabled] {\n      > ${StyledFormField} {\n        opacity: unset;\n      }\n    }\n\n    ${StyledSelectionCard} {\n      max-width: 100%;\n    }\n\n    ${StyledSelectionCardInline} ${StyledImageContainer} {\n      /* To enlarge the image containers to the size of the biggest one */\n      min-height: 100%;\n    }\n\n    ${StyledRadioCheck} > ${StyledFormFieldInfo} {\n      display: none;\n    }\n  `;\n});\n\nconst getCardGridContainerStyles = (theme: DefaultTheme) => {\n  const cardWidth = theme.base['content-width'].md;\n  return css`\n    display: grid;\n    gap: ${theme.base.spacing};\n    grid-template-columns: 1fr;\n    grid-auto-rows: 1fr;\n\n    @container (min-width: calc(2 * ${cardWidth})) {\n      grid-template-columns: repeat(2, 1fr);\n    }\n\n    @container (min-width: calc(3 * ${cardWidth})) {\n      grid-template-columns: repeat(3, 1fr);\n    }\n\n    @container (min-width: calc(4 * ${cardWidth})) {\n      grid-template-columns: repeat(4, 1fr);\n    }\n  `;\n};\n\nconst StyledCardGrid = styled.div<{\n  renderInline: boolean;\n  autoStack: boolean;\n  childCount: number;\n}>(({ theme, renderInline, autoStack, childCount }) => {\n  if (!renderInline) {\n    return css`\n      display: grid;\n      gap: ${theme.base.spacing};\n      grid-template-columns: minmax(min-content, max-content);\n      grid-auto-rows: 1fr;\n    `;\n  }\n\n  return autoStack\n    ? getCardGridContainerStyles(theme)\n    : css`\n        display: grid;\n        gap: ${theme.base.spacing};\n        grid-template-columns: repeat(${childCount}, 1fr);\n        grid-auto-rows: 1fr;\n      `;\n});\n\nStyledCardGrid.defaultProps = defaultThemeProp;\n\nconst RadioCheckGroup = forwardRef<\n  RefElement<RadioCheckGroupProps>,\n  PropsWithoutRef<RadioCheckGroupProps>\n>(function RadioCheckGroup(props, ref) {\n  const uid = useUID();\n  const {\n    testId,\n    children,\n    name = uid,\n    disabled = false,\n    required = false,\n    onChange,\n    readOnly,\n    inline = false,\n    autoStack = true,\n    variant = 'simple',\n    arrowNavigation = true,\n    onClear,\n    ...restProps\n  } = props;\n\n  const testIds = useTestIds(testId, getRadioCheckGroupTestIds);\n  const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n  const [renderInline, setRenderInline] = useState(inline);\n  const renderInlineRef = useRef(inline);\n  const minInlineWidth = useRef(0);\n  const containerRef = useConsolidatedRef(ref);\n  const skipRef = useRef<HTMLElement>(null);\n\n  useArrows(\n    arrowNavigation ? containerRef : skipRef,\n    {\n      selector: '[data-main-focus]',\n      cycle: false,\n      dir: 'both'\n    },\n    [children]\n  );\n\n  useEffect(() => {\n    setRenderInline(inline);\n    if (inline && optionsEl && optionsEl.lastChild && autoStack) {\n      const intersectionObserver = new IntersectionObserver(\n        entries => {\n          if (entries[0].intersectionRatio < 1) {\n            if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n            renderInlineRef.current = false;\n            setRenderInline(false);\n          }\n        },\n        { root: optionsEl, threshold: 1 }\n      );\n\n      const resizeObserver = new ResizeObserver(entries => {\n        if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n          renderInlineRef.current = true;\n          setRenderInline(true);\n        }\n      });\n\n      intersectionObserver.observe(optionsEl.lastChild as Element);\n      resizeObserver.observe(optionsEl);\n\n      return () => {\n        intersectionObserver.disconnect();\n        resizeObserver.disconnect();\n      };\n    }\n  }, [optionsEl, inline, autoStack]);\n\n  const mapChildren = useMemo(\n    () =>\n      Children.map(children, child =>\n        cloneElement(child, {\n          name,\n          status: restProps.status,\n          disabled: disabled || child.props.disabled,\n          readOnly: readOnly || child.props.readOnly,\n          variant: variant === 'card-grid' ? 'card' : variant,\n          suppressAnnouncements: true,\n          onChange: onChange\n            ? (e: ChangeEvent<HTMLInputElement>) => {\n                if (!(readOnly || child.props.readOnly)) {\n                  child.props.onChange?.(e);\n                  onChange(e);\n                }\n              }\n            : child.props.onChange\n        })\n      ),\n    [children, name, disabled, readOnly, variant, onChange]\n  );\n\n  return (\n    <FormField\n      testId={testIds}\n      as={StyledRadioCheckGroup}\n      labelAs='legend'\n      ref={containerRef}\n      name={name}\n      disabled={disabled}\n      required={required}\n      {...restProps}\n      isRadioCheck\n      onClear={onClear}\n      // Prevents blur when any input within the group is actively focused.\n      onMouseDown={(e: ReactMouseEvent<HTMLFieldSetElement>) => {\n        restProps.onMouseDown?.(e);\n\n        if (!containerRef.current) return;\n\n        if (!containerRef.current.contains(getActiveElement())) return;\n\n        if (!(e.target instanceof Element) || !e.target.closest('label')) return;\n\n        e.preventDefault();\n      }}\n    >\n      {variant === 'card-grid' ? (\n        <StyledCardGrid\n          ref={setOptionsEl}\n          renderInline={renderInline}\n          autoStack={autoStack}\n          childCount={Children.count(children)}\n        >\n          {mapChildren}\n        </StyledCardGrid>\n      ) : (\n        <Flex\n          ref={setOptionsEl}\n          container={{\n            direction: renderInline ? 'row' : 'column',\n            colGap: renderInline ? 1.5 : 2,\n            rowGap: variant === 'card' ? 1 : 0,\n            wrap: 'wrap'\n          }}\n        >\n          {mapChildren}\n        </Flex>\n      )}\n    </FormField>\n  );\n});\n\nexport default withTestIds(RadioCheckGroup, getRadioCheckGroupTestIds);\n"]}

package/lib/hooks/useFocusWithin.js

@@ -1,5 +1,5 @@
 import { useState, useEffect, useCallback, useRef } from 'react';
-import { getAllPopovers, isInstance, normalizeTargets } from '../utils';
+import { getAllPopovers, getParentWindow, isInstance, normalizeTargets } from '../utils';
 import useConfiguration from './useConfiguration';
 const getElements = (els) => normalizeTargets(els)
     .flatMap(el => [el, ...getAllPopovers(el)])
@@ -78,11 +78,11 @@ const useFocusWithin = (els, onFocusChange) => {
         };
         try {
             // When in iframe, we need to listen to parent window events as well.
-            window.parent?.document.addEventListener('focusin', parentWindowHandler, {
+            getParentWindow()?.document.addEventListener('focusin', parentWindowHandler, {
                 once: true,
                 signal: handlerAbortController.signal
             });
-            window.parent?.document.addEventListener('mouseup', parentWindowHandler, {
+            getParentWindow()?.document.addEventListener('mouseup', parentWindowHandler, {
                 once: true,
                 signal: handlerAbortController.signal
             });

package/lib/hooks/useFocusWithin.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFocusWithin.js","sourceRoot":"","sources":["../../src/hooks/useFocusWithin.ts"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useCallback, useRef } from 'react';\nimport type { RefObject } from 'react';\n\nimport { getAllPopovers, isInstance, normalizeTargets } from '../utils';\n\nimport useConfiguration from './useConfiguration';\n\nconst getElements = <T extends HTMLElement = HTMLElement>(\n  els: (T | null | RefObject<T | null>)[]\n) =>\n  normalizeTargets(els)\n    .flatMap(el => [el, ...getAllPopovers(el)])\n    .filter((el): el is HTMLElement => isInstance(el, HTMLElement));\n\n/** Hook for properly handling focus state of children components.\n * @example const hasFocus = useFocusWithin([containerRef, ...], (isFocused, element) => { doSomething; });\n * @param onFocusChange Callback function that is invoked with the current focus state and the current element when any child elements takes focus or all of them lose focus.\n * @returns * hasFocus:: A boolean indicating if the ref element has focus or not.\n */\nconst useFocusWithin = <T extends HTMLElement = HTMLElement>(\n  els: (T | null | RefObject<T | null>)[],\n  onFocusChange?: (isFocused: boolean, element: T | Element | null) => void\n): boolean => {\n  const [hasFocus, setFocus] = useState(false);\n  const focusedElRef = useRef<T | Element | null>(null);\n  const { portalTarget } = useConfiguration();\n\n  const handlerAbortControllerRef = useRef<AbortController>();\n  useEffect(() => {\n    return () => {\n      handlerAbortControllerRef.current?.abort();\n    };\n  }, []);\n\n  const onBlur = useCallback(\n    (e: FocusEvent | Event) => {\n      if (!hasFocus) return;\n\n      const relatedTarget = isInstance(e, FocusEvent) ? e.relatedTarget : null;\n\n      // Gather observed elements along with their popovers to probe for element which gains focus.\n      const elements = normalizeTargets(els).flatMap(el => [el, ...getAllPopovers(el)]);\n\n      if (isInstance(relatedTarget, Node)) {\n        // changing focus to another relevant child doesn't count\n        const focusedEl = elements.find(el => el?.contains(relatedTarget));\n        if (focusedEl) {\n          // ... just update the currently focused item\n          focusedElRef.current = focusedEl;\n          return;\n        }\n      }\n\n      // Code below is similar to the useOuterEvent hook, but single-shot only and need to be attached\n      // after blur event only. Due to various order of events between browsers and OSes, we need to\n      // postpone calling 'onBlur' callback until next element gets focus or on outer click to check\n      // if the relevant element contains the target element, which means the focus is retained.\n      const handlerAbortController = new AbortController();\n      const handler = (fe: Event | FocusEvent | MouseEvent) => {\n        if (\n          !elements.some(el => {\n            return fe.composedPath().some(target => {\n              return isInstance(target, Node) && el.contains(target);\n            });\n          })\n        ) {\n          setFocus(false);\n          onFocusChange?.(false, focusedElRef.current);\n          focusedElRef.current = null;\n        }\n        handlerAbortController.abort();\n      };\n\n      // For keyboard and SR navigation - wait for 'focusin'.\n      // attach to root node of the first element is enough, since all should share the same root\n      (elements[0] ?? portalTarget)\n        ?.getRootNode({ composed: false })\n        .addEventListener('focusin', handler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n\n      // For mouse and touch navigation - wait for 'mouseup'.\n      // The chosen event need to occur before 'click' to allow the given callback code finish before\n      // 'click' handlers.\n      // attach to root node of the first element is enough, since all should share the same root\n      (elements[0] ?? portalTarget)\n        ?.getRootNode({ composed: true })\n        .addEventListener('mouseup', handler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n\n      // For parent window we do not need to verify element placement in DOM.\n      const parentWindowHandler = () => {\n        setFocus(false);\n        onFocusChange?.(false, focusedElRef.current);\n        focusedElRef.current = null;\n        handlerAbortController.abort();\n      };\n\n      try {\n        // When in iframe, we need to listen to parent window events as well.\n        window.parent?.document.addEventListener('focusin', parentWindowHandler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n        window.parent?.document.addEventListener('mouseup', parentWindowHandler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n      } catch {\n        // IFrame parent document is not accessible when cross-origin.\n        // Don't attach handlers in that case.\n      }\n\n      handlerAbortControllerRef.current = handlerAbortController;\n    },\n    [hasFocus, onFocusChange, els]\n  );\n\n  const onFocus = useCallback(\n    (e: Event | FocusEvent) => {\n      if (!hasFocus) {\n        setFocus(true);\n        const targetEl = e.currentTarget as T;\n        onFocusChange?.(true, targetEl);\n        focusedElRef.current = targetEl;\n      }\n    },\n    [hasFocus, onFocusChange]\n  );\n\n  useEffect(() => {\n    const elements = getElements(els);\n\n    // Programmatically trigger focus callback on initial render to handle autoFocus\n    elements.forEach(el => {\n      if (el?.contains(document.activeElement)) {\n        onFocus(new FocusEvent('focusin', { relatedTarget: document.activeElement }));\n      }\n    });\n  }, []);\n\n  useEffect(() => {\n    const elements = normalizeTargets(els);\n\n    elements.forEach(el => {\n      el?.addEventListener('focusin', onFocus);\n      el?.addEventListener('popover:focusin', onFocus);\n      el?.addEventListener('focusout', onBlur);\n      el?.addEventListener('popover:focusout', onBlur);\n    });\n    return () => {\n      elements.forEach(el => {\n        el?.removeEventListener('focusin', onFocus);\n        el?.removeEventListener('popover:focusin', onFocus);\n        el?.removeEventListener('focusout', onBlur);\n        el?.removeEventListener('popover:focusout', onBlur);\n      });\n    };\n  }, [els, onFocus, onBlur]);\n\n  return hasFocus;\n};\n\nexport default useFocusWithin;\n"]}
+{"version":3,"file":"useFocusWithin.js","sourceRoot":"","sources":["../../src/hooks/useFocusWithin.ts"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useCallback, useRef } from 'react';\nimport type { RefObject } from 'react';\n\nimport { getAllPopovers, getParentWindow, isInstance, normalizeTargets } from '../utils';\n\nimport useConfiguration from './useConfiguration';\n\nconst getElements = <T extends HTMLElement = HTMLElement>(\n  els: (T | null | RefObject<T | null>)[]\n) =>\n  normalizeTargets(els)\n    .flatMap(el => [el, ...getAllPopovers(el)])\n    .filter((el): el is HTMLElement => isInstance(el, HTMLElement));\n\n/** Hook for properly handling focus state of children components.\n * @example const hasFocus = useFocusWithin([containerRef, ...], (isFocused, element) => { doSomething; });\n * @param onFocusChange Callback function that is invoked with the current focus state and the current element when any child elements takes focus or all of them lose focus.\n * @returns * hasFocus:: A boolean indicating if the ref element has focus or not.\n */\nconst useFocusWithin = <T extends HTMLElement = HTMLElement>(\n  els: (T | null | RefObject<T | null>)[],\n  onFocusChange?: (isFocused: boolean, element: T | Element | null) => void\n): boolean => {\n  const [hasFocus, setFocus] = useState(false);\n  const focusedElRef = useRef<T | Element | null>(null);\n  const { portalTarget } = useConfiguration();\n\n  const handlerAbortControllerRef = useRef<AbortController>();\n  useEffect(() => {\n    return () => {\n      handlerAbortControllerRef.current?.abort();\n    };\n  }, []);\n\n  const onBlur = useCallback(\n    (e: FocusEvent | Event) => {\n      if (!hasFocus) return;\n\n      const relatedTarget = isInstance(e, FocusEvent) ? e.relatedTarget : null;\n\n      // Gather observed elements along with their popovers to probe for element which gains focus.\n      const elements = normalizeTargets(els).flatMap(el => [el, ...getAllPopovers(el)]);\n\n      if (isInstance(relatedTarget, Node)) {\n        // changing focus to another relevant child doesn't count\n        const focusedEl = elements.find(el => el?.contains(relatedTarget));\n        if (focusedEl) {\n          // ... just update the currently focused item\n          focusedElRef.current = focusedEl;\n          return;\n        }\n      }\n\n      // Code below is similar to the useOuterEvent hook, but single-shot only and need to be attached\n      // after blur event only. Due to various order of events between browsers and OSes, we need to\n      // postpone calling 'onBlur' callback until next element gets focus or on outer click to check\n      // if the relevant element contains the target element, which means the focus is retained.\n      const handlerAbortController = new AbortController();\n      const handler = (fe: Event | FocusEvent | MouseEvent) => {\n        if (\n          !elements.some(el => {\n            return fe.composedPath().some(target => {\n              return isInstance(target, Node) && el.contains(target);\n            });\n          })\n        ) {\n          setFocus(false);\n          onFocusChange?.(false, focusedElRef.current);\n          focusedElRef.current = null;\n        }\n        handlerAbortController.abort();\n      };\n\n      // For keyboard and SR navigation - wait for 'focusin'.\n      // attach to root node of the first element is enough, since all should share the same root\n      (elements[0] ?? portalTarget)\n        ?.getRootNode({ composed: false })\n        .addEventListener('focusin', handler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n\n      // For mouse and touch navigation - wait for 'mouseup'.\n      // The chosen event need to occur before 'click' to allow the given callback code finish before\n      // 'click' handlers.\n      // attach to root node of the first element is enough, since all should share the same root\n      (elements[0] ?? portalTarget)\n        ?.getRootNode({ composed: true })\n        .addEventListener('mouseup', handler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n\n      // For parent window we do not need to verify element placement in DOM.\n      const parentWindowHandler = () => {\n        setFocus(false);\n        onFocusChange?.(false, focusedElRef.current);\n        focusedElRef.current = null;\n        handlerAbortController.abort();\n      };\n\n      try {\n        // When in iframe, we need to listen to parent window events as well.\n        getParentWindow()?.document.addEventListener('focusin', parentWindowHandler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n        getParentWindow()?.document.addEventListener('mouseup', parentWindowHandler, {\n          once: true,\n          signal: handlerAbortController.signal\n        });\n      } catch {\n        // IFrame parent document is not accessible when cross-origin.\n        // Don't attach handlers in that case.\n      }\n\n      handlerAbortControllerRef.current = handlerAbortController;\n    },\n    [hasFocus, onFocusChange, els]\n  );\n\n  const onFocus = useCallback(\n    (e: Event | FocusEvent) => {\n      if (!hasFocus) {\n        setFocus(true);\n        const targetEl = e.currentTarget as T;\n        onFocusChange?.(true, targetEl);\n        focusedElRef.current = targetEl;\n      }\n    },\n    [hasFocus, onFocusChange]\n  );\n\n  useEffect(() => {\n    const elements = getElements(els);\n\n    // Programmatically trigger focus callback on initial render to handle autoFocus\n    elements.forEach(el => {\n      if (el?.contains(document.activeElement)) {\n        onFocus(new FocusEvent('focusin', { relatedTarget: document.activeElement }));\n      }\n    });\n  }, []);\n\n  useEffect(() => {\n    const elements = normalizeTargets(els);\n\n    elements.forEach(el => {\n      el?.addEventListener('focusin', onFocus);\n      el?.addEventListener('popover:focusin', onFocus);\n      el?.addEventListener('focusout', onBlur);\n      el?.addEventListener('popover:focusout', onBlur);\n    });\n    return () => {\n      elements.forEach(el => {\n        el?.removeEventListener('focusin', onFocus);\n        el?.removeEventListener('popover:focusin', onFocus);\n        el?.removeEventListener('focusout', onBlur);\n        el?.removeEventListener('popover:focusout', onBlur);\n      });\n    };\n  }, [els, onFocus, onBlur]);\n\n  return hasFocus;\n};\n\nexport default useFocusWithin;\n"]}

package/lib/hooks/useI18n.d.ts

@@ -74,6 +74,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     critical: string;
     similarity_score: string;
     workflow: string;
+    panel: string;
     remove: string;
     follow: string;
     unfollow: string;
@@ -157,6 +158,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     create_noun: string;
     choose_noun: string;
     select_noun: string;
+    resize_noun: string;
     actions_for: string;
     edited: string;
     deleted: string;
@@ -463,6 +465,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     thinking: string;
     analyzing_data_sources: string;
     generating_response: string;
+    generation_stopped: string;
     double_checking_results: string;
     finalizing_response: string;
     preparing_content: string;
@@ -487,7 +490,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     modify_details: string;
     confirm_details: string;
     current_details: string;
-    agent_reasoning: string;
+    semantic_discovery_results: string;
     reasoning_disclaimer: string;
     candidates: string;
     agent_message: string;

package/lib/hooks/useI18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/i18n/default.d.ts

@@ -70,6 +70,7 @@ declare const _default: {
     critical: string;
     similarity_score: string;
     workflow: string;
+    panel: string;
     remove: string;
     follow: string;
     unfollow: string;
@@ -153,6 +154,7 @@ declare const _default: {
     create_noun: string;
     choose_noun: string;
     select_noun: string;
+    resize_noun: string;
     actions_for: string;
     edited: string;
     deleted: string;
@@ -459,6 +461,7 @@ declare const _default: {
     thinking: string;
     analyzing_data_sources: string;
     generating_response: string;
+    generation_stopped: string;
     double_checking_results: string;
     finalizing_response: string;
     preparing_content: string;
@@ -483,7 +486,7 @@ declare const _default: {
     modify_details: string;
     confirm_details: string;
     current_details: string;
-    agent_reasoning: string;
+    semantic_discovery_results: string;
     reasoning_disclaimer: string;
     candidates: string;
     agent_message: string;