@cube-dev/ui-kit 0.0.0-canary-619b8e3 → 0.0.0-canary-7bfcbc3

package/dist/components/fields/RadioGroup/RadioGroup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-619b8e3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7bfcbc3 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { castNullableStringValue } from "../../../utils/react/nullableValue.js";
@@ -8,11 +8,11 @@ import { wrapWithField } from "../../form/wrapper.js";
 import { RadioContext } from "./context.js";
 import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
-import { forwardRef, useRef } from "react";
+import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import { useFocusRing, useRadioGroup } from "react-aria";
 import { useRadioGroupState } from "react-stately";
-import { getActiveElement, useObjectRef } from "@react-aria/utils";
+import { useObjectRef } from "@react-aria/utils";
 
 //#region src/components/fields/RadioGroup/RadioGroup.tsx
 const RadioGroupElement = tasty({
@@ -50,17 +50,8 @@ const RadioGroupElement = tasty({
 		}
 	}
 });
-/**
-* Whether focus rests on the radio with this value while it is disabled. Only
-* a radio kept focusable for its tooltip can be: a natively disabled one never
-* takes focus (see `Radio`).
-*/
-function isFocusedDisabledRadio(value) {
-	let element = getActiveElement();
-	return element instanceof HTMLInputElement && element.type === "radio" && element.value === value && element.getAttribute("aria-disabled") === "true";
-}
 function RadioGroup(rawProps, ref) {
-	const $ = c(52);
+	const $ = c(47);
 	let orientation = rawProps.orientation;
 	let t0;
 	if ($[0] !== rawProps) {
@@ -79,95 +70,67 @@ function RadioGroup(rawProps, ref) {
 	const labelPosition = t2 === void 0 ? "top" : t2;
 	const domRef = useObjectRef(ref);
 	styles = extractStyles(otherProps, CONTAINER_STYLES, styles);
-	const baseState = useRadioGroupState(props);
-	const isArrowKeyRef = useRef(false);
+	const state = useRadioGroupState(props);
+	if (orientation == null) orientation = type === "button" || type === "tabs" ? "horizontal" : "vertical";
 	let t3;
-	if ($[3] !== baseState) {
+	if ($[3] !== orientation || $[4] !== props) {
 		t3 = {
-			...baseState,
-			setSelectedValue(value) {
-				if (isArrowKeyRef.current && isFocusedDisabledRadio(value)) return;
-				baseState.setSelectedValue(value);
-			}
-		};
-		$[3] = baseState;
-		$[4] = t3;
-	} else t3 = $[4];
-	const state = t3;
-	if (orientation == null) orientation = type === "button" || type === "tabs" ? "horizontal" : "vertical";
-	let t4;
-	if ($[5] !== orientation || $[6] !== props) {
-		t4 = {
 			...props,
 			orientation,
 			form: void 0
 		};
-		$[5] = orientation;
-		$[6] = props;
-		$[7] = t4;
-	} else t4 = $[7];
-	const { radioGroupProps, labelProps } = useRadioGroup(t4, state);
-	const { onKeyDown: onArrowKey, ...groupProps } = radioGroupProps;
-	let t5;
-	if ($[8] !== onArrowKey) {
-		t5 = (event) => {
-			isArrowKeyRef.current = true;
-			onArrowKey?.(event);
-			isArrowKeyRef.current = false;
-		};
-		$[8] = onArrowKey;
-		$[9] = t5;
-	} else t5 = $[9];
-	const onKeyDown = t5;
-	let t6;
-	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
-		t6 = { within: true };
-		$[10] = t6;
-	} else t6 = $[10];
-	const { isFocusVisible: isFocusWithinVisible, focusProps: groupFocusProps } = useFocusRing(t6);
-	const T0 = RadioGroupElement;
-	const t7 = mergeProps$1(groupProps, groupFocusProps);
-	const t8 = qa || "RadioGroup";
-	const t9 = type === "button" ? "" : void 0;
-	const t10 = orientation === "horizontal";
-	const t11 = labelPosition === "side";
-	const t12 = type === "button";
-	const t13 = type === "tabs";
-	let t14;
-	if ($[11] !== insideForm || $[12] !== isFocusWithinVisible || $[13] !== t10 || $[14] !== t11 || $[15] !== t12 || $[16] !== t13) {
-		t14 = {
-			horizontal: t10,
+		$[3] = orientation;
+		$[4] = props;
+		$[5] = t3;
+	} else t3 = $[5];
+	const { radioGroupProps: fieldProps, labelProps } = useRadioGroup(t3, state);
+	let t4;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = { within: true };
+		$[6] = t4;
+	} else t4 = $[6];
+	const { isFocusVisible: isFocusWithinVisible, focusProps: groupFocusProps } = useFocusRing(t4);
+	const t5 = qa || "RadioGroup";
+	const t6 = type === "button" ? "" : void 0;
+	const t7 = orientation === "horizontal";
+	const t8 = labelPosition === "side";
+	const t9 = type === "button";
+	const t10 = type === "tabs";
+	let t11;
+	if ($[7] !== insideForm || $[8] !== isFocusWithinVisible || $[9] !== t10 || $[10] !== t7 || $[11] !== t8 || $[12] !== t9) {
+		t11 = {
+			horizontal: t7,
 			"inside-form": insideForm,
-			"side-label": t11,
-			button: t12,
-			tabs: t13,
+			"side-label": t8,
+			button: t9,
+			tabs: t10,
 			focused: isFocusWithinVisible
 		};
-		$[11] = insideForm;
-		$[12] = isFocusWithinVisible;
-		$[13] = t10;
-		$[14] = t11;
-		$[15] = t12;
-		$[16] = t13;
-		$[17] = t14;
-	} else t14 = $[17];
-	let t15;
-	if ($[18] !== isDisabled || $[19] !== isInvalid || $[20] !== isRequired || $[21] !== isValid) {
-		t15 = {
+		$[7] = insideForm;
+		$[8] = isFocusWithinVisible;
+		$[9] = t10;
+		$[10] = t7;
+		$[11] = t8;
+		$[12] = t9;
+		$[13] = t11;
+	} else t11 = $[13];
+	let t12;
+	if ($[14] !== isDisabled || $[15] !== isInvalid || $[16] !== isRequired || $[17] !== isValid) {
+		t12 = {
 			isRequired,
 			isInvalid,
 			isValid,
 			isDisabled
 		};
-		$[18] = isDisabled;
-		$[19] = isInvalid;
-		$[20] = isRequired;
-		$[21] = isValid;
-		$[22] = t15;
-	} else t15 = $[22];
-	let t16;
-	if ($[23] !== buttonType || $[24] !== isDisabled || $[25] !== props.name || $[26] !== size || $[27] !== state || $[28] !== type) {
-		t16 = {
+		$[14] = isDisabled;
+		$[15] = isInvalid;
+		$[16] = isRequired;
+		$[17] = isValid;
+		$[18] = t12;
+	} else t12 = $[18];
+	let t13;
+	if ($[19] !== buttonType || $[20] !== isDisabled || $[21] !== props.name || $[22] !== size || $[23] !== state || $[24] !== type) {
+		t13 = {
 			state,
 			name: props.name,
 			size,
@@ -175,73 +138,72 @@ function RadioGroup(rawProps, ref) {
 			type,
 			isDisabled
 		};
-		$[23] = buttonType;
-		$[24] = isDisabled;
-		$[25] = props.name;
-		$[26] = size;
-		$[27] = state;
-		$[28] = type;
-		$[29] = t16;
-	} else t16 = $[29];
-	let t17;
-	if ($[30] !== children || $[31] !== t16) {
-		t17 = /* @__PURE__ */ jsx(RadioContext.Provider, {
-			value: t16,
+		$[19] = buttonType;
+		$[20] = isDisabled;
+		$[21] = props.name;
+		$[22] = size;
+		$[23] = state;
+		$[24] = type;
+		$[25] = t13;
+	} else t13 = $[25];
+	let t14;
+	if ($[26] !== children || $[27] !== t13) {
+		t14 = /* @__PURE__ */ jsx(RadioContext.Provider, {
+			value: t13,
 			children
 		});
-		$[30] = children;
-		$[31] = t16;
-		$[32] = t17;
-	} else t17 = $[32];
-	let t18;
-	if ($[33] !== t15 || $[34] !== t17) {
-		t18 = /* @__PURE__ */ jsx(FormScopeMask, {
-			value: t15,
-			children: t17
+		$[26] = children;
+		$[27] = t13;
+		$[28] = t14;
+	} else t14 = $[28];
+	let t15;
+	if ($[29] !== t12 || $[30] !== t14) {
+		t15 = /* @__PURE__ */ jsx(FormScopeMask, {
+			value: t12,
+			children: t14
 		});
-		$[33] = t15;
-		$[34] = t17;
-		$[35] = t18;
-	} else t18 = $[35];
-	let t19;
-	if ($[36] !== T0 || $[37] !== id || $[38] !== onKeyDown || $[39] !== styles || $[40] !== t14 || $[41] !== t18 || $[42] !== t7 || $[43] !== t8 || $[44] !== t9) {
-		t19 = /* @__PURE__ */ jsx(T0, {
-			...t7,
-			onKeyDown,
+		$[29] = t12;
+		$[30] = t14;
+		$[31] = t15;
+	} else t15 = $[31];
+	let t16;
+	if ($[32] !== groupFocusProps || $[33] !== id || $[34] !== styles || $[35] !== t11 || $[36] !== t15 || $[37] !== t5 || $[38] !== t6) {
+		t16 = /* @__PURE__ */ jsx(RadioGroupElement, {
 			id,
-			qa: t8,
+			qa: t5,
 			styles,
 			"data-input-type": "radiogroup",
-			"data-radio-button-group": t9,
-			mods: t14,
-			children: t18
+			"data-radio-button-group": t6,
+			mods: t11,
+			...groupFocusProps,
+			children: t15
 		});
-		$[36] = T0;
-		$[37] = id;
-		$[38] = onKeyDown;
-		$[39] = styles;
-		$[40] = t14;
-		$[41] = t18;
-		$[42] = t7;
-		$[43] = t8;
-		$[44] = t9;
-		$[45] = t19;
-	} else t19 = $[45];
-	const radioGroup = t19;
-	let t20;
-	if ($[46] !== baseLabelProps || $[47] !== domRef || $[48] !== labelProps || $[49] !== props || $[50] !== radioGroup) {
-		t20 = wrapWithField(radioGroup, domRef, {
+		$[32] = groupFocusProps;
+		$[33] = id;
+		$[34] = styles;
+		$[35] = t11;
+		$[36] = t15;
+		$[37] = t5;
+		$[38] = t6;
+		$[39] = t16;
+	} else t16 = $[39];
+	const radioGroup = t16;
+	let t17;
+	if ($[40] !== baseLabelProps || $[41] !== domRef || $[42] !== fieldProps || $[43] !== labelProps || $[44] !== props || $[45] !== radioGroup) {
+		t17 = wrapWithField(radioGroup, domRef, {
 			...props,
+			fieldProps,
 			labelProps: mergeProps$1(baseLabelProps, labelProps)
 		});
-		$[46] = baseLabelProps;
-		$[47] = domRef;
-		$[48] = labelProps;
-		$[49] = props;
-		$[50] = radioGroup;
-		$[51] = t20;
-	} else t20 = $[51];
-	return t20;
+		$[40] = baseLabelProps;
+		$[41] = domRef;
+		$[42] = fieldProps;
+		$[43] = labelProps;
+		$[44] = props;
+		$[45] = radioGroup;
+		$[46] = t17;
+	} else t17 = $[46];
+	return t17;
 }
 /**
 * Radio groups allow users to select a single option from a list of mutually exclusive options.

package/dist/components/fields/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","names":["getActiveElement","useObjectRef","BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","forwardRef","useRef","AriaRadioGroupProps","useFocusRing","useRadioGroup","RadioGroupState","useRadioGroupState","FieldBaseProps","mergeProps","castNullableStringValue","WithNullableValue","extractStyles","CubeItemProps","FormScopeMask","useFieldProps","wrapWithField","RadioContext","KeyboardEvent","CubeRadioGroupProps","Omit","groupStyles","orientation","value","defaultValue","onChange","size","Exclude","buttonType","type","RadioGroupElement","qa","styles","display","placeItems","placeContent","flow","horizontal","padding","tabs","boxSizing","radius","fill","width","flexShrink","gap","button","whiteSpace","outline","isFocusedDisabledRadio","element","HTMLInputElement","getAttribute","RadioGroup","rawProps","ref","$","_c","t0","t1","Symbol","for","defaultValidationTrigger","props","id","isDisabled","isRequired","labelPosition","t2","isInvalid","isValid","children","insideForm","labelProps","baseLabelProps","form","otherProps","undefined","domRef","baseState","isArrowKeyRef","t3","setSelectedValue","current","state","t4","radioGroupProps","onKeyDown","onArrowKey","groupProps","t5","event","t6","within","isFocusVisible","isFocusWithinVisible","focusProps","groupFocusProps","T0","t7","t8","t9","t10","t11","t12","t13","t14","focused","t15","t16","name","t17","t18","t19","radioGroup","t20","_RadioGroup","cubeInputType","displayName"],"sources":["../../../../src/components/fields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { getActiveElement, useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useRef } from 'react';\nimport { AriaRadioGroupProps, useFocusRing, useRadioGroup } from 'react-aria';\nimport { RadioGroupState, useRadioGroupState } from 'react-stately';\n\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport {\n  castNullableStringValue,\n  WithNullableValue,\n} from '../../../utils/react/nullableValue';\nimport { extractStyles } from '../../../utils/styles';\nimport { CubeItemProps } from '../../content/Item/Item';\nimport { FormScopeMask, useFieldProps, wrapWithField } from '../../form';\n\nimport { RadioContext } from './context';\n\nimport type { KeyboardEvent } from 'react';\n\nexport interface CubeRadioGroupProps\n  extends BaseProps,\n    Omit<AriaRadioGroupProps, 'errorMessage' | 'form' | 'name'>,\n    ContainerStyleProps,\n    FieldBaseProps<string | null | undefined> {\n  groupStyles?: Styles;\n  orientation?: 'horizontal' | 'vertical';\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  /* Size for all radio buttons in the group */\n  size?: Exclude<CubeItemProps['size'], 'inline'>;\n  /* Button type for all button-style radios (ignored in tabs mode). When set to 'primary', selected buttons use 'primary' and non-selected use 'outline' with isSelected appearance */\n  buttonType?: CubeItemProps['type'];\n  /* Visual type for all radios in the group: radio (default), button, or tabs */\n  type?: 'radio' | 'button' | 'tabs';\n}\n\nconst RadioGroupElement = tasty({\n  qa: 'RadioGroup',\n  styles: {\n    display: 'flex',\n    placeItems: 'stretch',\n    placeContent: 'stretch',\n    flow: {\n      '': 'column',\n      horizontal: 'row wrap',\n      'horizontal & tabs': 'row',\n    },\n    padding: {\n      '': '0',\n      tabs: '.5x',\n    },\n    // The tabs layout is the only one with padding, and a caller that gives the\n    // group an explicit width (`width: 100%` inside a popover, say) means the\n    // box it can see. Without this the padding is added on top and the group\n    // overhangs its container by `1x`.\n    boxSizing: 'border-box',\n    radius: true,\n    fill: {\n      '': '#clear',\n      'tabs | disabled': '#surface-4',\n    },\n    width: 'max-content max-content initial',\n    flexShrink: 0,\n    gap: {\n      '': '1x',\n      button: 0,\n      tabs: '.5x',\n    },\n    whiteSpace: 'nowrap',\n    // Keyboard focus ring on the group, shown only for button/tabs layouts\n    // where individual items are visually merged (button-group) or share a\n    // single chrome (tabs) — the classic vertical radio list already shows\n    // a per-item focus ring on the radio circle.\n    outline: {\n      '': '1bw #primary-text.0 / 1bw',\n      'focused & (button | tabs)': '1bw #primary-text / 1bw',\n    },\n  },\n});\n\n/**\n * Whether focus rests on the radio with this value while it is disabled. Only\n * a radio kept focusable for its tooltip can be: a natively disabled one never\n * takes focus (see `Radio`).\n */\nfunction isFocusedDisabledRadio(value: string | null) {\n  let element = getActiveElement();\n\n  return (\n    element instanceof HTMLInputElement &&\n    element.type === 'radio' &&\n    element.value === value &&\n    element.getAttribute('aria-disabled') === 'true'\n  );\n}\n\nfunction RadioGroup(rawProps: WithNullableValue<CubeRadioGroupProps>, ref) {\n  let orientation = rawProps.orientation;\n\n  rawProps = castNullableStringValue(rawProps);\n  let props = useFieldProps(rawProps, { defaultValidationTrigger: 'onChange' });\n\n  let {\n    qa,\n    id,\n    isDisabled,\n    isRequired,\n    labelPosition = 'top',\n    isInvalid,\n    isValid,\n    children,\n    styles,\n    groupStyles,\n    insideForm,\n    // orientation, // ignore orientation since it came from the form context\n    labelProps: baseLabelProps,\n    size,\n    buttonType,\n    type,\n    form,\n    ...otherProps\n  } = props;\n  let domRef = useObjectRef(ref);\n\n  styles = extractStyles(otherProps, CONTAINER_STYLES, styles);\n\n  let baseState = useRadioGroupState(props);\n  // The arrow keys focus the next radio and select it. A disabled radio that\n  // keeps focus for its tooltip is reached that way too, and has to stop the\n  // selection the way a read-only group does: focus moves, the value stays.\n  // Only the arrow keys: a click elsewhere or a form reset still selects.\n  let isArrowKeyRef = useRef(false);\n  let state: RadioGroupState = {\n    ...baseState,\n    setSelectedValue(value) {\n      if (isArrowKeyRef.current && isFocusedDisabledRadio(value)) return;\n\n      baseState.setSelectedValue(value);\n    },\n  };\n\n  // Set default orientation based on type\n  if (orientation == null) {\n    orientation =\n      type === 'button' || type === 'tabs' ? 'horizontal' : 'vertical';\n  }\n\n  // React Aria hands `form` to every radio's input as the id of its `<form>`,\n  // so the form instance would render as `form=\"[object Object]\"` on each.\n  let { radioGroupProps, labelProps } = useRadioGroup(\n    { ...props, orientation, form: undefined },\n    state,\n  );\n\n  let { onKeyDown: onArrowKey, ...groupProps } = radioGroupProps;\n  let onKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    isArrowKeyRef.current = true;\n    onArrowKey?.(event);\n    isArrowKeyRef.current = false;\n  };\n\n  // Keyboard-only focus ring on the group container (button/tabs layouts).\n  // `within: true` tracks focus on any descendant radio. We read\n  // `isFocusVisible` (not `isFocused`), which is keyboard-gated — mouse\n  // clicks on a radio focus the input but leave `isFocusVisible` false.\n  let { isFocusVisible: isFocusWithinVisible, focusProps: groupFocusProps } =\n    useFocusRing({ within: true });\n\n  let radioGroup = (\n    <RadioGroupElement\n      // On the group, not on the field wrapper: without a visible label there\n      // is no wrapper, and the group would lose its role, its name, the arrow\n      // keys and its focus handling with it.\n      {...mergeProps(groupProps, groupFocusProps)}\n      onKeyDown={onKeyDown}\n      // `useRadioGroup` seeds its id once; the current one follows the form\n      // binding.\n      id={id}\n      qa={qa || 'RadioGroup'}\n      styles={styles}\n      data-input-type=\"radiogroup\"\n      data-radio-button-group={type === 'button' ? '' : undefined}\n      mods={{\n        horizontal: orientation === 'horizontal',\n        'inside-form': insideForm,\n        'side-label': labelPosition === 'side',\n        button: type === 'button',\n        tabs: type === 'tabs',\n        focused: isFocusWithinVisible,\n      }}\n    >\n      <FormScopeMask\n        value={{\n          isRequired,\n          isInvalid,\n          isValid,\n          isDisabled,\n        }}\n      >\n        <RadioContext.Provider\n          value={{\n            state,\n            name: props.name,\n            size,\n            buttonType,\n            type,\n            isDisabled,\n          }}\n        >\n          {children}\n        </RadioContext.Provider>\n      </FormScopeMask>\n    </RadioGroupElement>\n  );\n\n  return wrapWithField(radioGroup, domRef, {\n    ...props,\n    labelProps: mergeProps(baseLabelProps, labelProps),\n  });\n}\n\n/**\n * Radio groups allow users to select a single option from a list of mutually exclusive options.\n * All possible options are exposed up front for users to compare.\n */\nconst _RadioGroup = forwardRef(RadioGroup);\n\n(_RadioGroup as any).cubeInputType = 'RadioGroup';\n_RadioGroup.displayName = 'RadioGroup';\n\nexport { _RadioGroup as RadioGroup };\n"],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","names":["useObjectRef","BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","forwardRef","AriaRadioGroupProps","useFocusRing","useRadioGroup","useRadioGroupState","FieldBaseProps","mergeProps","castNullableStringValue","WithNullableValue","extractStyles","CubeItemProps","FormScopeMask","useFieldProps","wrapWithField","RadioContext","CubeRadioGroupProps","Omit","groupStyles","orientation","value","defaultValue","onChange","size","Exclude","buttonType","type","RadioGroupElement","qa","styles","display","placeItems","placeContent","flow","horizontal","padding","tabs","boxSizing","radius","fill","width","flexShrink","gap","button","whiteSpace","outline","RadioGroup","rawProps","ref","$","_c","t0","t1","Symbol","for","defaultValidationTrigger","props","id","isDisabled","isRequired","labelPosition","t2","isInvalid","isValid","children","insideForm","labelProps","baseLabelProps","form","otherProps","undefined","domRef","state","t3","radioGroupProps","fieldProps","t4","within","isFocusVisible","isFocusWithinVisible","focusProps","groupFocusProps","t5","t6","t7","t8","t9","t10","t11","focused","t12","t13","name","t14","t15","t16","radioGroup","t17","_RadioGroup","cubeInputType","displayName"],"sources":["../../../../src/components/fields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\nimport { AriaRadioGroupProps, useFocusRing, useRadioGroup } from 'react-aria';\nimport { useRadioGroupState } from 'react-stately';\n\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport {\n  castNullableStringValue,\n  WithNullableValue,\n} from '../../../utils/react/nullableValue';\nimport { extractStyles } from '../../../utils/styles';\nimport { CubeItemProps } from '../../content/Item/Item';\nimport { FormScopeMask, useFieldProps, wrapWithField } from '../../form';\n\nimport { RadioContext } from './context';\n\nexport interface CubeRadioGroupProps\n  extends BaseProps,\n    Omit<AriaRadioGroupProps, 'errorMessage' | 'form' | 'name'>,\n    ContainerStyleProps,\n    FieldBaseProps<string | null | undefined> {\n  groupStyles?: Styles;\n  orientation?: 'horizontal' | 'vertical';\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  /* Size for all radio buttons in the group */\n  size?: Exclude<CubeItemProps['size'], 'inline'>;\n  /* Button type for all button-style radios (ignored in tabs mode). When set to 'primary', selected buttons use 'primary' and non-selected use 'outline' with isSelected appearance */\n  buttonType?: CubeItemProps['type'];\n  /* Visual type for all radios in the group: radio (default), button, or tabs */\n  type?: 'radio' | 'button' | 'tabs';\n}\n\nconst RadioGroupElement = tasty({\n  qa: 'RadioGroup',\n  styles: {\n    display: 'flex',\n    placeItems: 'stretch',\n    placeContent: 'stretch',\n    flow: {\n      '': 'column',\n      horizontal: 'row wrap',\n      'horizontal & tabs': 'row',\n    },\n    padding: {\n      '': '0',\n      tabs: '.5x',\n    },\n    // The tabs layout is the only one with padding, and a caller that gives the\n    // group an explicit width (`width: 100%` inside a popover, say) means the\n    // box it can see. Without this the padding is added on top and the group\n    // overhangs its container by `1x`.\n    boxSizing: 'border-box',\n    radius: true,\n    fill: {\n      '': '#clear',\n      'tabs | disabled': '#surface-4',\n    },\n    width: 'max-content max-content initial',\n    flexShrink: 0,\n    gap: {\n      '': '1x',\n      button: 0,\n      tabs: '.5x',\n    },\n    whiteSpace: 'nowrap',\n    // Keyboard focus ring on the group, shown only for button/tabs layouts\n    // where individual items are visually merged (button-group) or share a\n    // single chrome (tabs) — the classic vertical radio list already shows\n    // a per-item focus ring on the radio circle.\n    outline: {\n      '': '1bw #primary-text.0 / 1bw',\n      'focused & (button | tabs)': '1bw #primary-text / 1bw',\n    },\n  },\n});\n\nfunction RadioGroup(rawProps: WithNullableValue<CubeRadioGroupProps>, ref) {\n  let orientation = rawProps.orientation;\n\n  rawProps = castNullableStringValue(rawProps);\n  let props = useFieldProps(rawProps, { defaultValidationTrigger: 'onChange' });\n\n  let {\n    qa,\n    id,\n    isDisabled,\n    isRequired,\n    labelPosition = 'top',\n    isInvalid,\n    isValid,\n    children,\n    styles,\n    groupStyles,\n    insideForm,\n    // orientation, // ignore orientation since it came from the form context\n    labelProps: baseLabelProps,\n    size,\n    buttonType,\n    type,\n    form,\n    ...otherProps\n  } = props;\n  let domRef = useObjectRef(ref);\n\n  styles = extractStyles(otherProps, CONTAINER_STYLES, styles);\n\n  let state = useRadioGroupState(props);\n\n  // Set default orientation based on type\n  if (orientation == null) {\n    orientation =\n      type === 'button' || type === 'tabs' ? 'horizontal' : 'vertical';\n  }\n\n  // React Aria hands `form` to every radio's input as the id of its `<form>`,\n  // so the form instance would render as `form=\"[object Object]\"` on each.\n  let { radioGroupProps: fieldProps, labelProps } = useRadioGroup(\n    { ...props, orientation, form: undefined },\n    state,\n  );\n\n  // Keyboard-only focus ring on the group container (button/tabs layouts).\n  // `within: true` tracks focus on any descendant radio. We read\n  // `isFocusVisible` (not `isFocused`), which is keyboard-gated — mouse\n  // clicks on a radio focus the input but leave `isFocusVisible` false.\n  let { isFocusVisible: isFocusWithinVisible, focusProps: groupFocusProps } =\n    useFocusRing({ within: true });\n\n  let radioGroup = (\n    <RadioGroupElement\n      id={id}\n      qa={qa || 'RadioGroup'}\n      styles={styles}\n      data-input-type=\"radiogroup\"\n      data-radio-button-group={type === 'button' ? '' : undefined}\n      mods={{\n        horizontal: orientation === 'horizontal',\n        'inside-form': insideForm,\n        'side-label': labelPosition === 'side',\n        button: type === 'button',\n        tabs: type === 'tabs',\n        focused: isFocusWithinVisible,\n      }}\n      {...groupFocusProps}\n    >\n      <FormScopeMask\n        value={{\n          isRequired,\n          isInvalid,\n          isValid,\n          isDisabled,\n        }}\n      >\n        <RadioContext.Provider\n          value={{\n            state,\n            name: props.name,\n            size,\n            buttonType,\n            type,\n            isDisabled,\n          }}\n        >\n          {children}\n        </RadioContext.Provider>\n      </FormScopeMask>\n    </RadioGroupElement>\n  );\n\n  return wrapWithField(radioGroup, domRef, {\n    ...props,\n    fieldProps,\n    labelProps: mergeProps(baseLabelProps, labelProps),\n  });\n}\n\n/**\n * Radio groups allow users to select a single option from a list of mutually exclusive options.\n * All possible options are exposed up front for users to compare.\n */\nconst _RadioGroup = forwardRef(RadioGroup);\n\n(_RadioGroup as any).cubeInputType = 'RadioGroup';\n_RadioGroup.displayName = 'RadioGroup';\n\nexport { _RadioGroup as RadioGroup };\n"],"mappings":"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"}

package/dist/components/fields/RadioGroup/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-619b8e3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7bfcbc3 | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/fields/RadioGroup/context.ts

package/dist/components/fields/SearchComboBox/SearchComboBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-619b8e3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-7bfcbc3 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
@@ -248,67 +248,71 @@ const SearchComboBox = forwardRef(function SearchComboBox(props, ref) {
 		onBlur: handleCompositeBlur,
 		isDisabled
 	});
-	const { keyboardProps } = useKeyboard({ onKeyDown: (e_1) => {
-		onKeyDown?.(e_1);
-		if (e_1.isDefaultPrevented()) return;
-		if (e_1.key === "ArrowDown" || e_1.key === "ArrowUp") {
-			e_1.preventDefault();
-			if (!shouldShowPopover) {
-				if (!isPopoverOpen) {
-					if (!hasResults) setIsFilterActive(false);
-					setIsPopoverOpen(true);
-				}
-				return;
-			}
-			const listState = listStateRef.current;
-			if (!listState) return;
-			const nextKey = getNextVisibleKey(listState, e_1.key === "ArrowDown" ? 1 : -1);
-			if (nextKey != null) {
-				markKeyboardFocus(listState);
-				listState.selectionManager.setFocusedKey(nextKey);
-				bumpFocus();
-			}
-		} else if (e_1.key === "Enter") {
-			if (shouldShowPopover) {
-				const listState_0 = listStateRef.current;
-				const visibleKeys = listState_0 ? getVisibleKeys(listState_0) : visibleItemKeys;
-				const focusedKey = listState_0?.selectionManager.focusedKey;
-				const keyToSelect = focusedKey != null && visibleKeys.includes(focusedKey) ? focusedKey : visibleKeys[0] ?? null;
-				if (keyToSelect != null) {
-					e_1.preventDefault();
-					if (listState_0) listState_0.selectionManager.select(keyToSelect, e_1);
-					else handleSelectionChange(keyToSelect);
-					return;
-				}
-			}
-			const value_1 = trimmedInput;
-			if (onSubmit && value_1) {
-				e_1.preventDefault();
-				handleSubmit(value_1);
-				return;
-			}
-			e_1.preventDefault();
-		} else if (e_1.key === "Escape") {
-			if (isPopoverOpen) {
-				e_1.preventDefault();
-				setIsPopoverOpen(false);
-				inputRef.current?.focus();
-			} else if (effectiveInputValue) {
-				e_1.preventDefault();
-				if (isClearable) clearValue();
-			}
-		} else if (e_1.key === "Home" || e_1.key === "End") {
-			if (shouldShowPopover) {
-				e_1.preventDefault();
-				const listState_1 = listStateRef.current;
-				if (!listState_1) return;
-				const targetKey = getEdgeVisibleKey(listState_1, e_1.key === "Home" ? "first" : "last");
-				if (targetKey != null) {
-					markKeyboardFocus(listState_1);
-					listState_1.selectionManager.setFocusedKey(targetKey);
-					bumpFocus();
-				}
+	const focusOption = (listState, key_1) => {
+		if (key_1 == null) return;
+		markKeyboardFocus(listState);
+		listState.selectionManager.setFocusedKey(key_1);
+		bumpFocus();
+	};
+	const handleArrowKey = (e_1) => {
+		e_1.preventDefault();
+		if (!shouldShowPopover) {
+			if (!isPopoverOpen) {
+				if (!hasResults) setIsFilterActive(false);
+				setIsPopoverOpen(true);
 			}
+			return;
+		}
+		const listState_0 = listStateRef.current;
+		if (listState_0) focusOption(listState_0, getNextVisibleKey(listState_0, e_1.key === "ArrowDown" ? 1 : -1));
+	};
+	const getKeyToSelect = (listState_1) => {
+		const visibleKeys = listState_1 ? getVisibleKeys(listState_1) : visibleItemKeys;
+		const focusedKey = listState_1?.selectionManager.focusedKey;
+		return focusedKey != null && visibleKeys.includes(focusedKey) ? focusedKey : visibleKeys[0] ?? null;
+	};
+	const handleEnterKey = (e_2) => {
+		e_2.preventDefault();
+		const listState_2 = listStateRef.current;
+		const keyToSelect = shouldShowPopover ? getKeyToSelect(listState_2) : null;
+		if (keyToSelect != null) if (listState_2) listState_2.selectionManager.select(keyToSelect, e_2);
+		else handleSelectionChange(keyToSelect);
+		else if (onSubmit && trimmedInput) handleSubmit(trimmedInput);
+	};
+	const handleEscapeKey = (e_3) => {
+		if (isPopoverOpen) {
+			e_3.preventDefault();
+			setIsPopoverOpen(false);
+			inputRef.current?.focus();
+		} else if (effectiveInputValue) {
+			e_3.preventDefault();
+			if (isClearable) clearValue();
+		}
+	};
+	const handleEdgeKey = (e_4) => {
+		if (!shouldShowPopover) return;
+		e_4.preventDefault();
+		const listState_3 = listStateRef.current;
+		if (listState_3) focusOption(listState_3, getEdgeVisibleKey(listState_3, e_4.key === "Home" ? "first" : "last"));
+	};
+	const { keyboardProps } = useKeyboard({ onKeyDown: (e_5) => {
+		onKeyDown?.(e_5);
+		if (e_5.isDefaultPrevented()) return;
+		switch (e_5.key) {
+			case "ArrowDown":
+			case "ArrowUp":
+				handleArrowKey(e_5);
+				break;
+			case "Enter":
+				handleEnterKey(e_5);
+				break;
+			case "Escape":
+				handleEscapeKey(e_5);
+				break;
+			case "Home":
+			case "End":
+				handleEdgeKey(e_5);
+				break;
 		}
 	} });
 	if (icon === void 0) icon = /* @__PURE__ */ jsx(SearchIcon, {});
@@ -349,14 +353,14 @@ const SearchComboBox = forwardRef(function SearchComboBox(props, ref) {
 		let timer;
 		const applyFocus = () => {
 			if (!shouldShowPopover) return;
-			const listState_2 = listStateRef.current;
-			if (listState_2) {
-				const keys_0 = getVisibleKeys(listState_2);
+			const listState_4 = listStateRef.current;
+			if (listState_4) {
+				const keys_0 = getVisibleKeys(listState_4);
 				if (keys_0.length > 0) {
-					const focusedKey_0 = listState_2.selectionManager.focusedKey;
+					const focusedKey_0 = listState_4.selectionManager.focusedKey;
 					if (!(focusedKey_0 != null && keys_0.includes(focusedKey_0))) {
-						markKeyboardFocus(listState_2);
-						listState_2.selectionManager.setFocusedKey(keys_0[0]);
+						markKeyboardFocus(listState_4);
+						listState_4.selectionManager.setFocusedKey(keys_0[0]);
 						bumpFocus();
 					}
 					return;