@yamada-ui/radio 1.2.8-dev-20240915031944 → 1.2.8-dev-20240917033401

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,14 @@
1
+ import * as react from 'react';
2
+ import { ChangeEvent } from 'react';
3
+ import { ThemeProps } from '@yamada-ui/core';
4
+ import { FormControlOptions } from '@yamada-ui/form-control';
5
+
6
+ interface RadioGroupContext extends ThemeProps<"Radio">, FormControlOptions {
7
+ name: string;
8
+ value: string | number;
9
+ onChange: (evOrValue: ChangeEvent<HTMLInputElement> | string | number) => void;
10
+ }
11
+ declare const RadioGroupProvider: react.Provider<RadioGroupContext | undefined>;
12
+ declare const useRadioGroupContext: () => RadioGroupContext | undefined;
13
+
14
+ export { type RadioGroupContext, RadioGroupProvider, useRadioGroupContext };
@@ -0,0 +1,38 @@
1
+ "use client"
2
+ "use strict";
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
+
21
+ // src/radio-context.ts
22
+ var radio_context_exports = {};
23
+ __export(radio_context_exports, {
24
+ RadioGroupProvider: () => RadioGroupProvider,
25
+ useRadioGroupContext: () => useRadioGroupContext
26
+ });
27
+ module.exports = __toCommonJS(radio_context_exports);
28
+ var import_utils = require("@yamada-ui/utils");
29
+ var [RadioGroupProvider, useRadioGroupContext] = (0, import_utils.createContext)({
30
+ strict: false,
31
+ name: "RadioGroupContext"
32
+ });
33
+ // Annotate the CommonJS export names for ESM import in node:
34
+ 0 && (module.exports = {
35
+ RadioGroupProvider,
36
+ useRadioGroupContext
37
+ });
38
+ //# sourceMappingURL=radio-context.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/radio-context.ts"],"sourcesContent":["import type { ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { createContext } from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\n\nexport interface RadioGroupContext\n extends ThemeProps<\"Radio\">,\n FormControlOptions {\n name: string\n value: string | number\n onChange: (evOrValue: ChangeEvent<HTMLInputElement> | string | number) => void\n}\n\nexport const [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA8B;AAWvB,IAAM,CAAC,oBAAoB,oBAAoB,QAAI,4BAExD;AAAA,EACA,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;","names":[]}
@@ -0,0 +1,10 @@
1
+ "use client"
2
+ import {
3
+ RadioGroupProvider,
4
+ useRadioGroupContext
5
+ } from "./chunk-YWRIETVW.mjs";
6
+ export {
7
+ RadioGroupProvider,
8
+ useRadioGroupContext
9
+ };
10
+ //# sourceMappingURL=radio-context.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -1,15 +1,15 @@
1
1
  import { RadioProps } from './radio.mjs';
2
2
  import * as react from 'react';
3
- import { ChangeEvent, Ref } from 'react';
4
- import { UIPropGetter, ThemeProps, ComponentArgs } from '@yamada-ui/core';
3
+ import { ChangeEvent, RefAttributes } from 'react';
4
+ import { PropGetter, ThemeProps, ComponentArgs } from '@yamada-ui/core';
5
5
  import { FormControlOptions } from '@yamada-ui/form-control';
6
6
  import { FlexProps } from '@yamada-ui/layouts';
7
- import { Dict, PropGetter } from '@yamada-ui/utils';
7
+ import { Dict } from '@yamada-ui/utils';
8
8
 
9
9
  type RadioItem<Y extends string | number = string> = RadioProps<Y> & {
10
10
  label?: string;
11
11
  };
12
- type UseRadioGroupProps<Y extends string | number = string> = {
12
+ interface UseRadioGroupProps<Y extends string | number = string> {
13
13
  /**
14
14
  * The top-level id string that will be applied to the radios.
15
15
  * The index of the radio will be appended to this top-level id.
@@ -39,8 +39,8 @@ type UseRadioGroupProps<Y extends string | number = string> = {
39
39
  * @default false
40
40
  */
41
41
  isNative?: boolean;
42
- };
43
- declare const useRadioGroup: <Y extends string | number = string, M extends Dict = Dict>({ id, name, isNative, value: valueProp, defaultValue, onChange: onChangeProp, ...props }: UseRadioGroupProps<Y> & M) => {
42
+ }
43
+ declare const useRadioGroup: <Y extends string | number, M extends Dict = Dict<any>>({ id, name, isNative, value: valueProp, defaultValue, onChange: onChangeProp, ...props }: UseRadioGroupProps<Y> & M) => {
44
44
  props: Omit<UseRadioGroupProps<Y> & M, "value" | "name" | "defaultValue" | "id" | "onChange" | "isNative">;
45
45
  id: string;
46
46
  name: string;
@@ -48,33 +48,26 @@ declare const useRadioGroup: <Y extends string | number = string, M extends Dict
48
48
  setValue: react.Dispatch<react.SetStateAction<Y>>;
49
49
  onChange: (evOrValue: ChangeEvent<HTMLInputElement> | Y) => void;
50
50
  onFocus: () => void;
51
- getContainerProps: PropGetter;
52
- getRadioProps: UIPropGetter<"input", {
51
+ getContainerProps: PropGetter<"div", undefined>;
52
+ getRadioProps: PropGetter<{
53
53
  value?: Y;
54
54
  }, {
55
55
  value?: Y;
56
+ checked?: boolean;
57
+ isChecked?: boolean;
56
58
  }>;
57
59
  };
58
60
  type UseRadioGroupReturn<Y extends string | number = string> = ReturnType<typeof useRadioGroup<Y>>;
59
- type RadioGroupProps<Y extends string | number = string> = ThemeProps<"Radio"> & Omit<FlexProps, "onChange"> & UseRadioGroupProps<Y> & FormControlOptions & {
61
+ interface RadioGroupProps<Y extends string | number = string> extends ThemeProps<"Radio">, Omit<FlexProps, "defaultValue" | "onChange">, UseRadioGroupProps<Y>, FormControlOptions {
60
62
  /**
61
63
  * If provided, generate radios based on items.
62
64
  *
63
65
  * @default '[]'
64
66
  */
65
67
  items?: RadioItem<Y>[];
66
- };
67
- type RadioGroupContext = ThemeProps<"Radio"> & FormControlOptions & {
68
- name: string;
69
- value: string | number;
70
- onChange: (evOrValue: ChangeEvent<HTMLInputElement> | string | number) => void;
71
- };
72
- declare const useRadioGroupContext: () => RadioGroupContext | undefined;
73
-
68
+ }
74
69
  declare const RadioGroup: {
75
- <Y extends string | number = string>(props: RadioGroupProps<Y> & {
76
- ref?: Ref<HTMLDivElement>;
77
- }): JSX.Element;
70
+ <Y extends string | number = string>(props: RadioGroupProps<Y> & RefAttributes<HTMLDivElement>): JSX.Element;
78
71
  } & ComponentArgs;
79
72
 
80
- export { RadioGroup, type RadioGroupProps, type RadioItem, type UseRadioGroupProps, type UseRadioGroupReturn, useRadioGroup, useRadioGroupContext };
73
+ export { RadioGroup, type RadioGroupProps, type RadioItem, type UseRadioGroupProps, type UseRadioGroupReturn, useRadioGroup };
@@ -1,15 +1,15 @@
1
1
  import { RadioProps } from './radio.js';
2
2
  import * as react from 'react';
3
- import { ChangeEvent, Ref } from 'react';
4
- import { UIPropGetter, ThemeProps, ComponentArgs } from '@yamada-ui/core';
3
+ import { ChangeEvent, RefAttributes } from 'react';
4
+ import { PropGetter, ThemeProps, ComponentArgs } from '@yamada-ui/core';
5
5
  import { FormControlOptions } from '@yamada-ui/form-control';
6
6
  import { FlexProps } from '@yamada-ui/layouts';
7
- import { Dict, PropGetter } from '@yamada-ui/utils';
7
+ import { Dict } from '@yamada-ui/utils';
8
8
 
9
9
  type RadioItem<Y extends string | number = string> = RadioProps<Y> & {
10
10
  label?: string;
11
11
  };
12
- type UseRadioGroupProps<Y extends string | number = string> = {
12
+ interface UseRadioGroupProps<Y extends string | number = string> {
13
13
  /**
14
14
  * The top-level id string that will be applied to the radios.
15
15
  * The index of the radio will be appended to this top-level id.
@@ -39,8 +39,8 @@ type UseRadioGroupProps<Y extends string | number = string> = {
39
39
  * @default false
40
40
  */
41
41
  isNative?: boolean;
42
- };
43
- declare const useRadioGroup: <Y extends string | number = string, M extends Dict = Dict>({ id, name, isNative, value: valueProp, defaultValue, onChange: onChangeProp, ...props }: UseRadioGroupProps<Y> & M) => {
42
+ }
43
+ declare const useRadioGroup: <Y extends string | number, M extends Dict = Dict<any>>({ id, name, isNative, value: valueProp, defaultValue, onChange: onChangeProp, ...props }: UseRadioGroupProps<Y> & M) => {
44
44
  props: Omit<UseRadioGroupProps<Y> & M, "value" | "name" | "defaultValue" | "id" | "onChange" | "isNative">;
45
45
  id: string;
46
46
  name: string;
@@ -48,33 +48,26 @@ declare const useRadioGroup: <Y extends string | number = string, M extends Dict
48
48
  setValue: react.Dispatch<react.SetStateAction<Y>>;
49
49
  onChange: (evOrValue: ChangeEvent<HTMLInputElement> | Y) => void;
50
50
  onFocus: () => void;
51
- getContainerProps: PropGetter;
52
- getRadioProps: UIPropGetter<"input", {
51
+ getContainerProps: PropGetter<"div", undefined>;
52
+ getRadioProps: PropGetter<{
53
53
  value?: Y;
54
54
  }, {
55
55
  value?: Y;
56
+ checked?: boolean;
57
+ isChecked?: boolean;
56
58
  }>;
57
59
  };
58
60
  type UseRadioGroupReturn<Y extends string | number = string> = ReturnType<typeof useRadioGroup<Y>>;
59
- type RadioGroupProps<Y extends string | number = string> = ThemeProps<"Radio"> & Omit<FlexProps, "onChange"> & UseRadioGroupProps<Y> & FormControlOptions & {
61
+ interface RadioGroupProps<Y extends string | number = string> extends ThemeProps<"Radio">, Omit<FlexProps, "defaultValue" | "onChange">, UseRadioGroupProps<Y>, FormControlOptions {
60
62
  /**
61
63
  * If provided, generate radios based on items.
62
64
  *
63
65
  * @default '[]'
64
66
  */
65
67
  items?: RadioItem<Y>[];
66
- };
67
- type RadioGroupContext = ThemeProps<"Radio"> & FormControlOptions & {
68
- name: string;
69
- value: string | number;
70
- onChange: (evOrValue: ChangeEvent<HTMLInputElement> | string | number) => void;
71
- };
72
- declare const useRadioGroupContext: () => RadioGroupContext | undefined;
73
-
68
+ }
74
69
  declare const RadioGroup: {
75
- <Y extends string | number = string>(props: RadioGroupProps<Y> & {
76
- ref?: Ref<HTMLDivElement>;
77
- }): JSX.Element;
70
+ <Y extends string | number = string>(props: RadioGroupProps<Y> & RefAttributes<HTMLDivElement>): JSX.Element;
78
71
  } & ComponentArgs;
79
72
 
80
- export { RadioGroup, type RadioGroupProps, type RadioItem, type UseRadioGroupProps, type UseRadioGroupReturn, useRadioGroup, useRadioGroupContext };
73
+ export { RadioGroup, type RadioGroupProps, type RadioItem, type UseRadioGroupProps, type UseRadioGroupReturn, useRadioGroup };
@@ -22,22 +22,30 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
22
22
  var radio_group_exports = {};
23
23
  __export(radio_group_exports, {
24
24
  RadioGroup: () => RadioGroup,
25
- useRadioGroup: () => useRadioGroup,
26
- useRadioGroupContext: () => useRadioGroupContext
25
+ useRadioGroup: () => useRadioGroup
27
26
  });
28
27
  module.exports = __toCommonJS(radio_group_exports);
29
28
  var import_form_control2 = require("@yamada-ui/form-control");
30
29
  var import_layouts = require("@yamada-ui/layouts");
31
30
  var import_use_controllable_state = require("@yamada-ui/use-controllable-state");
32
- var import_utils2 = require("@yamada-ui/utils");
31
+ var import_utils3 = require("@yamada-ui/utils");
33
32
  var import_react2 = require("react");
34
33
 
35
34
  // src/radio.tsx
36
35
  var import_core = require("@yamada-ui/core");
37
36
  var import_form_control = require("@yamada-ui/form-control");
38
37
  var import_use_focus_visible = require("@yamada-ui/use-focus-visible");
39
- var import_utils = require("@yamada-ui/utils");
38
+ var import_utils2 = require("@yamada-ui/utils");
40
39
  var import_react = require("react");
40
+
41
+ // src/radio-context.ts
42
+ var import_utils = require("@yamada-ui/utils");
43
+ var [RadioGroupProvider, useRadioGroupContext] = (0, import_utils.createContext)({
44
+ strict: false,
45
+ name: "RadioGroupContext"
46
+ });
47
+
48
+ // src/radio.tsx
41
49
  var import_jsx_runtime = require("react/jsx-runtime");
42
50
  var useRadio = ({
43
51
  id,
@@ -64,7 +72,7 @@ var useRadio = ({
64
72
  ...formControlProps
65
73
  },
66
74
  rest
67
- ] = (0, import_utils.splitObject)(computedProps, import_form_control.formControlProperties);
75
+ ] = (0, import_utils2.splitObject)(computedProps, import_form_control.formControlProperties);
68
76
  const [isFocusVisible, setIsFocusVisible] = (0, import_react.useState)(false);
69
77
  const [isFocused, setFocused] = (0, import_react.useState)(false);
70
78
  const [isHovered, setHovered] = (0, import_react.useState)(false);
@@ -75,7 +83,7 @@ var useRadio = ({
75
83
  (0, import_react.useEffect)(() => {
76
84
  return (0, import_use_focus_visible.trackFocusVisible)(setIsFocusVisible);
77
85
  }, []);
78
- const onChange = (0, import_utils.useCallbackRef)(
86
+ const onChange = (0, import_utils2.useCallbackRef)(
79
87
  (ev) => {
80
88
  if (readOnly || disabled) {
81
89
  ev.preventDefault();
@@ -86,8 +94,8 @@ var useRadio = ({
86
94
  },
87
95
  [readOnly, disabled, isControlled]
88
96
  );
89
- const onFocus = (0, import_utils.useCallbackRef)(onFocusProp);
90
- const onBlur = (0, import_utils.useCallbackRef)(onBlurProp);
97
+ const onFocus = (0, import_utils2.useCallbackRef)(onFocusProp);
98
+ const onBlur = (0, import_utils2.useCallbackRef)(onBlurProp);
91
99
  const onKeyDown = (0, import_react.useCallback)(
92
100
  ({ key }) => {
93
101
  if (key === " ") setActive(true);
@@ -105,7 +113,7 @@ var useRadio = ({
105
113
  ...formControlProps,
106
114
  ...props2,
107
115
  ref,
108
- "data-checked": (0, import_utils.dataAttr)(checked)
116
+ "data-checked": (0, import_utils2.dataAttr)(checked)
109
117
  }),
110
118
  [checked, formControlProps]
111
119
  );
@@ -114,16 +122,16 @@ var useRadio = ({
114
122
  ...formControlProps,
115
123
  ...props2,
116
124
  ref,
117
- "data-active": (0, import_utils.dataAttr)(isActive),
118
- "data-hover": (0, import_utils.dataAttr)(isHovered),
119
- "data-checked": (0, import_utils.dataAttr)(checked),
120
- "data-focus": (0, import_utils.dataAttr)(isFocused),
121
- "data-focus-visible": (0, import_utils.dataAttr)(isFocused && isFocusVisible),
125
+ "data-active": (0, import_utils2.dataAttr)(isActive),
126
+ "data-hover": (0, import_utils2.dataAttr)(isHovered),
127
+ "data-checked": (0, import_utils2.dataAttr)(checked),
128
+ "data-focus": (0, import_utils2.dataAttr)(isFocused),
129
+ "data-focus-visible": (0, import_utils2.dataAttr)(isFocused && isFocusVisible),
122
130
  "aria-hidden": true,
123
- onMouseDown: (0, import_utils.handlerAll)(props2.onMouseDown, () => setActive(true)),
124
- onMouseUp: (0, import_utils.handlerAll)(props2.onMouseUp, () => setActive(false)),
125
- onMouseEnter: (0, import_utils.handlerAll)(props2.onMouseEnter, () => setHovered(true)),
126
- onMouseLeave: (0, import_utils.handlerAll)(props2.onMouseLeave, () => setHovered(false))
131
+ onMouseDown: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onMouseDown, () => setActive(true)),
132
+ onMouseUp: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onMouseUp, () => setActive(false)),
133
+ onMouseEnter: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onMouseEnter, () => setHovered(true)),
134
+ onMouseLeave: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onMouseLeave, () => setHovered(false))
127
135
  }),
128
136
  [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps]
129
137
  );
@@ -152,11 +160,11 @@ var useRadio = ({
152
160
  whiteSpace: "nowrap",
153
161
  position: "absolute"
154
162
  },
155
- onChange: (0, import_utils.handlerAll)(props2.onChange, onChange),
156
- onBlur: (0, import_utils.handlerAll)(props2.onBlur, onBlur, () => setFocused(false)),
157
- onFocus: (0, import_utils.handlerAll)(props2.onFocus, onFocus, () => setFocused(true)),
158
- onKeyDown: (0, import_utils.handlerAll)(props2.onKeyDown, onKeyDown),
159
- onKeyUp: (0, import_utils.handlerAll)(props2.onKeyUp, onKeyUp)
163
+ onChange: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onChange, onChange),
164
+ onBlur: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onBlur, onBlur, () => setFocused(false)),
165
+ onFocus: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onFocus, onFocus, () => setFocused(true)),
166
+ onKeyDown: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onKeyDown, onKeyDown),
167
+ onKeyUp: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onKeyUp, onKeyUp)
160
168
  }),
161
169
  [
162
170
  formControlProps,
@@ -179,15 +187,15 @@ var useRadio = ({
179
187
  ...formControlProps,
180
188
  ...props2,
181
189
  ref,
182
- onMouseDown: (0, import_utils.handlerAll)(props2.onMouseDown, (ev) => {
190
+ onMouseDown: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onMouseDown, (ev) => {
183
191
  ev.preventDefault();
184
192
  ev.stopPropagation();
185
193
  }),
186
- onTouchStart: (0, import_utils.handlerAll)(props2.onTouchStart, (ev) => {
194
+ onTouchStart: (0, import_utils2.handlerAll)(props2 == null ? void 0 : props2.onTouchStart, (ev) => {
187
195
  ev.preventDefault();
188
196
  ev.stopPropagation();
189
197
  }),
190
- "data-checked": (0, import_utils.dataAttr)(checked)
198
+ "data-checked": (0, import_utils2.dataAttr)(checked)
191
199
  }),
192
200
  [checked, formControlProps]
193
201
  );
@@ -210,7 +218,7 @@ var Radio = (0, import_react.forwardRef)(
210
218
  const group = useRadioGroupContext();
211
219
  const { value: groupValue, ...groupProps } = { ...group };
212
220
  const control = (0, import_form_control.useFormControl)(props);
213
- const [styles, mergedProps] = (0, import_core.useMultiComponentStyle)("Radio", {
221
+ const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("Radio", {
214
222
  ...groupProps,
215
223
  ...props
216
224
  });
@@ -228,7 +236,7 @@ var Radio = (0, import_react.forwardRef)(
228
236
  ...computedProps
229
237
  } = (0, import_core.omitThemeProps)(mergedProps);
230
238
  const isCheckedProp = groupValue && computedProps.value ? groupValue === computedProps.value : computedProps.isChecked;
231
- const onChange = groupProps.onChange && computedProps.value ? (0, import_utils.funcAll)(groupProps.onChange, computedProps.onChange) : computedProps.onChange;
239
+ const onChange = groupProps.onChange && computedProps.value ? (0, import_utils2.funcAll)(groupProps.onChange, computedProps.onChange) : computedProps.onChange;
232
240
  const {
233
241
  isChecked,
234
242
  getContainerProps,
@@ -249,7 +257,7 @@ var Radio = (0, import_react.forwardRef)(
249
257
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
250
258
  import_core.ui.label,
251
259
  {
252
- className: (0, import_utils.cx)("ui-radio", className),
260
+ className: (0, import_utils2.cx)("ui-radio", className),
253
261
  ...getContainerProps(rest),
254
262
  __css: {
255
263
  cursor: "pointer",
@@ -305,7 +313,7 @@ Radio.displayName = "Radio";
305
313
 
306
314
  // src/radio-group.tsx
307
315
  var import_jsx_runtime2 = require("react/jsx-runtime");
308
- var isEvent = (value) => value && (0, import_utils2.isObject)(value) && (0, import_utils2.isObject)(value.target);
316
+ var isEvent = (value) => value && (0, import_utils3.isObject)(value) && (0, import_utils3.isObject)(value.target);
309
317
  var useRadioGroup = ({
310
318
  id,
311
319
  name,
@@ -317,7 +325,7 @@ var useRadioGroup = ({
317
325
  }) => {
318
326
  id != null ? id : id = (0, import_react2.useId)();
319
327
  name != null ? name : name = `radio-${id}`;
320
- const onChangeRef = (0, import_utils2.useCallbackRef)(onChangeProp);
328
+ const onChangeRef = (0, import_utils3.useCallbackRef)(onChangeProp);
321
329
  const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
322
330
  value: valueProp,
323
331
  defaultValue,
@@ -348,7 +356,7 @@ var useRadioGroup = ({
348
356
  (props2 = {}, ref = null) => ({
349
357
  role: "radiogroup",
350
358
  ...props2,
351
- ref: (0, import_utils2.mergeRefs)(ref, containerRef)
359
+ ref: (0, import_utils3.mergeRefs)(ref, containerRef)
352
360
  }),
353
361
  []
354
362
  );
@@ -378,10 +386,6 @@ var useRadioGroup = ({
378
386
  getRadioProps
379
387
  };
380
388
  };
381
- var [RadioGroupProvider, useRadioGroupContext] = (0, import_utils2.createContext)({
382
- strict: false,
383
- name: "RadioGroupContext"
384
- });
385
389
  var RadioGroup = (0, import_react2.forwardRef)(
386
390
  ({
387
391
  id: idProp,
@@ -414,7 +418,7 @@ var RadioGroup = (0, import_react2.forwardRef)(
414
418
  getContainerProps,
415
419
  props: rest
416
420
  } = useRadioGroup(computedProps);
417
- const validChildren = (0, import_utils2.getValidChildren)(children);
421
+ const validChildren = (0, import_utils3.getValidChildren)(children);
418
422
  let computedChildren = [];
419
423
  if (!validChildren.length && items.length) {
420
424
  computedChildren = items.map(({ label, value: value2, ...props2 }, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Radio, { value: value2, ...props2, children: label }, i));
@@ -438,7 +442,7 @@ var RadioGroup = (0, import_react2.forwardRef)(
438
442
  import_layouts.Flex,
439
443
  {
440
444
  ref,
441
- className: (0, import_utils2.cx)("ui-radio-group", className),
445
+ className: (0, import_utils3.cx)("ui-radio-group", className),
442
446
  gap: gap != null ? gap : direction === "row" ? "1rem" : void 0,
443
447
  ...getContainerProps({
444
448
  id,
@@ -457,7 +461,6 @@ RadioGroup.displayName = "RadioGroup";
457
461
  // Annotate the CommonJS export names for ESM import in node:
458
462
  0 && (module.exports = {
459
463
  RadioGroup,
460
- useRadioGroup,
461
- useRadioGroupContext
464
+ useRadioGroup
462
465
  });
463
466
  //# sourceMappingURL=radio-group.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/radio-group.tsx","../src/radio.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n role: \"radiogroup\",\n ...props,\n ref: mergeRefs(ref, containerRef),\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => {\n const isChecked = props.value === value\n\n return {\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? isChecked : undefined,\n \"aria-checked\": isChecked,\n onChange,\n }\n },\n [name, value, onChange, isNative],\n )\n\n return {\n props,\n id,\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n id: idProp,\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const {\n labelId,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n ...computedProps\n } = useFormControl({\n id: idProp,\n ...props,\n })\n const {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: rest,\n } = useRadioGroup(computedProps)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps({\n id,\n \"aria-labelledby\": labelId,\n ...rest,\n } as DOMAttributes<HTMLElement>)}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n required,\n disabled,\n readOnly,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps],\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n \"aria-checked\": checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n formControlProps,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n return {\n props: rest,\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isCheckedProp =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n isChecked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked: isCheckedProp,\n onChange,\n })\n\n const tabIndex = !groupValue ? 0 : isChecked ? 0 : -1\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps(rest)}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(\n {\n ...inputProps,\n tabIndex,\n },\n ref,\n )}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps as DOMAttributes<HTMLElement>)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","import_jsx_runtime","props","value","props"]}
1
+ {"version":3,"sources":["../src/radio-group.tsx","../src/radio.tsx","../src/radio-context.ts"],"sourcesContent":["import type { ComponentArgs, ThemeProps, PropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport {\n cx,\n isObject,\n useCallbackRef,\n getValidChildren,\n mergeRefs,\n} from \"@yamada-ui/utils\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ForwardedRef,\n ReactElement,\n RefAttributes,\n} from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\nimport type { RadioGroupContext } from \"./radio-context\"\nimport { RadioGroupProvider } from \"./radio-context\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport interface UseRadioGroupProps<Y extends string | number = string> {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <\n Y extends string | number,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n role: \"radiogroup\",\n ...props,\n ref: mergeRefs(ref, containerRef),\n }),\n [],\n )\n\n const getRadioProps: PropGetter<\n { value?: Y },\n { value?: Y; checked?: boolean; isChecked?: boolean }\n > = useCallback(\n (props = {}, ref = null) => {\n const isChecked = props.value === value\n\n return {\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? isChecked : undefined,\n \"aria-checked\": isChecked,\n onChange,\n }\n },\n [name, value, onChange, isNative],\n )\n\n return {\n props,\n id,\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport interface RadioGroupProps<Y extends string | number = string>\n extends ThemeProps<\"Radio\">,\n Omit<FlexProps, \"defaultValue\" | \"onChange\">,\n UseRadioGroupProps<Y>,\n FormControlOptions {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n}\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n id: idProp,\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const {\n labelId,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n ...computedProps\n } = useFormControl({\n id: idProp,\n ...props,\n })\n const {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: rest,\n } = useRadioGroup(computedProps)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps({\n id,\n \"aria-labelledby\": labelId,\n ...rest,\n })}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & RefAttributes<HTMLDivElement>,\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n PropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useComponentMultiStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n RefAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-context\"\n\nexport interface UseRadioProps<Y extends string | number = string>\n extends FormControlOptions {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n required,\n disabled,\n readOnly,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: PropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n const getIconProps: PropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props?.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props?.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props?.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props?.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n \"aria-checked\": checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props?.onChange, onChange),\n onBlur: handlerAll(props?.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props?.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props?.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props?.onKeyUp, onKeyUp),\n }),\n [\n formControlProps,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n onMouseDown: handlerAll(props?.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props?.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n return {\n props: rest,\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ninterface RadioOptions {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport interface RadioProps<Y extends string | number = string>\n extends Omit<HTMLUIProps<\"label\">, keyof UseRadioProps>,\n ThemeProps<\"Radio\">,\n UseRadioProps<Y>,\n RadioOptions {}\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useComponentMultiStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isCheckedProp =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n isChecked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked: isCheckedProp,\n onChange,\n })\n\n const tabIndex = !groupValue ? 0 : isChecked ? 0 : -1\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps(rest)}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(\n {\n ...inputProps,\n tabIndex,\n },\n ref,\n )}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & RefAttributes<HTMLInputElement>,\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n","import type { ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { createContext } from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\n\nexport interface RadioGroupContext\n extends ThemeProps<\"Radio\">,\n FormControlOptions {\n name: string\n value: string | number\n onChange: (evOrValue: ChangeEvent<HTMLInputElement> | string | number) => void\n}\n\nexport const [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,uBAA+B;AAE/B,qBAAqB;AACrB,oCAAqC;AACrC,IAAAC,gBAMO;AAQP,IAAAC,gBAAuD;;;ACdvD,kBAA2D;AAE3D,0BAIO;AACP,+BAAkC;AAElC,IAAAC,gBAOO;AAUP,mBAAoE;;;AC9BpE,mBAA8B;AAWvB,IAAM,CAAC,oBAAoB,oBAAoB,QAAI,4BAExD;AAAA,EACA,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;;;ADoTK;AAnQC,IAAM,WAAW,CAGtB;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4B;AAC1B,6BAAO,oBAAM;AACb,QAAM;AAAA,IACJ,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,UAAU;AAAA,IACV,GAAG;AAAA,EACL,QAAI,yCAAoB,EAAE,IAAI,GAAG,MAAM,CAAC;AACxC,QAAM;AAAA,IACJ;AAAA,MACE,iBAAiB;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,GAAG;AAAA,IACL;AAAA,IACA;AAAA,EACF,QAAI,2BAAY,eAAe,yCAAqB;AAEpD,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,uBAAkB,KAAK;AACnE,QAAM,CAAC,WAAW,UAAU,QAAI,uBAAkB,KAAK;AACvD,QAAM,CAAC,WAAW,UAAU,QAAI,uBAAkB,KAAK;AACvD,QAAM,CAAC,UAAU,SAAS,QAAI,uBAAkB,KAAK;AAErD,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAkB,CAAC,CAAC,gBAAgB;AAEtE,QAAM,eAAe,kBAAkB;AACvC,QAAM,UAAU,eAAgB,gBAA4B;AAE5D,8BAAU,MAAM;AACd,eAAO,4CAAkB,iBAAiB;AAAA,EAC5C,GAAG,CAAC,CAAC;AAEL,QAAM,eAAW;AAAA,IACf,CAAC,OAAsC;AACrC,UAAI,YAAY,UAAU;AACxB,WAAG,eAAe;AAElB;AAAA,MACF;AAEA,UAAI,CAAC,aAAc,cAAa,GAAG,OAAO,OAAO;AAEjD,mDAAe;AAAA,IACjB;AAAA,IACA,CAAC,UAAU,UAAU,YAAY;AAAA,EACnC;AACA,QAAM,cAAU,8BAAe,WAAW;AAC1C,QAAM,aAAS,8BAAe,UAAU;AAExC,QAAM,gBAAY;AAAA,IAChB,CAAC,EAAE,IAAI,MAAqB;AAC1B,UAAI,QAAQ,IAAK,WAAU,IAAI;AAAA,IACjC;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,cAAU;AAAA,IACd,CAAC,EAAE,IAAI,MAAqB;AAC1B,UAAI,QAAQ,IAAK,WAAU,KAAK;AAAA,IAClC;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,wBAAyC;AAAA,IAC7C,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA,oBAAgB,wBAAS,OAAO;AAAA,IAClC;AAAA,IACA,CAAC,SAAS,gBAAgB;AAAA,EAC5B;AAEA,QAAM,mBAAmC;AAAA,IACvC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA,mBAAe,wBAAS,QAAQ;AAAA,MAChC,kBAAc,wBAAS,SAAS;AAAA,MAChC,oBAAgB,wBAAS,OAAO;AAAA,MAChC,kBAAc,wBAAS,SAAS;AAAA,MAChC,0BAAsB,wBAAS,aAAa,cAAc;AAAA,MAC1D,eAAe;AAAA,MACf,iBAAa,0BAAWA,UAAA,gBAAAA,OAAO,aAAa,MAAM,UAAU,IAAI,CAAC;AAAA,MACjE,eAAW,0BAAWA,UAAA,gBAAAA,OAAO,WAAW,MAAM,UAAU,KAAK,CAAC;AAAA,MAC9D,kBAAc,0BAAWA,UAAA,gBAAAA,OAAO,cAAc,MAAM,WAAW,IAAI,CAAC;AAAA,MACpE,kBAAc,0BAAWA,UAAA,gBAAAA,OAAO,cAAc,MAAM,WAAW,KAAK,CAAC;AAAA,IACvE;AAAA,IACA,CAAC,SAAS,UAAU,WAAW,gBAAgB,WAAW,gBAAgB;AAAA,EAC5E;AAEA,QAAM,oBAAqC;AAAA,IACzC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,MAChB,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,UAAU;AAAA,MACZ;AAAA,MACA,cAAU,0BAAWA,UAAA,gBAAAA,OAAO,UAAU,QAAQ;AAAA,MAC9C,YAAQ,0BAAWA,UAAA,gBAAAA,OAAO,QAAQ,QAAQ,MAAM,WAAW,KAAK,CAAC;AAAA,MACjE,aAAS,0BAAWA,UAAA,gBAAAA,OAAO,SAAS,SAAS,MAAM,WAAW,IAAI,CAAC;AAAA,MACnE,eAAW,0BAAWA,UAAA,gBAAAA,OAAO,WAAW,SAAS;AAAA,MACjD,aAAS,0BAAWA,UAAA,gBAAAA,OAAO,SAAS,OAAO;AAAA,IAC7C;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAAoC;AAAA,IACxC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA,iBAAa,0BAAWA,UAAA,gBAAAA,OAAO,aAAa,CAAC,OAAuB;AAClE,WAAG,eAAe;AAClB,WAAG,gBAAgB;AAAA,MACrB,CAAC;AAAA,MACD,kBAAc,0BAAWA,UAAA,gBAAAA,OAAO,cAAc,CAAC,OAAuB;AACpE,WAAG,eAAe;AAClB,WAAG,gBAAgB;AAAA,MACrB,CAAC;AAAA,MACD,oBAAgB,wBAAS,OAAO;AAAA,IAClC;AAAA,IACA,CAAC,SAAS,gBAAgB;AAAA,EAC5B;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAqBO,IAAM,YAAQ;AAAA,EACnB,CACE,OACA,QACG;AAlRP;AAmRI,UAAM,QAAQ,qBAAqB;AACnC,UAAM,EAAE,OAAO,YAAY,GAAG,WAAW,IAAI,EAAE,GAAG,MAAM;AACxD,UAAM,cAAU,oCAAe,KAAK;AACpC,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,SAAS;AAAA,MAC5D,GAAG;AAAA,MACH,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA,MAAM;AAAA,MACN,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,aAAY,gBAAW,cAAX,YAAwB,QAAQ;AAAA,MAC5C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAE9B,UAAM,gBACJ,cAAc,cAAc,QACxB,eAAe,cAAc,QAC7B,cAAc;AAEpB,UAAM,WACJ,WAAW,YAAY,cAAc,YACjC,uBAAQ,WAAW,UAAU,cAAc,QAAQ,IACnD,cAAc;AAEpB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,SAAS;AAAA,MACX,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,IACF,CAAC;AAED,UAAM,WAAW,CAAC,aAAa,IAAI,YAAY,IAAI;AAEnD,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,eAAW,kBAAG,YAAY,SAAS;AAAA,QAClC,GAAG,kBAAkB,IAAI;AAAA,QAC1B,OAAO;AAAA,UACL,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,eAAe;AAAA,UACf;AAAA,UACA,GAAG,OAAO;AAAA,QACZ;AAAA,QAEA;AAAA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG;AAAA,gBACF;AAAA,kBACE,GAAG;AAAA,kBACH;AAAA,gBACF;AAAA,gBACA;AAAA,cACF;AAAA;AAAA,UACF;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,aAAa,SAAS;AAAA,cAC1B,OAAO;AAAA,gBACL,UAAU;AAAA,gBACV,SAAS;AAAA,gBACT,YAAY;AAAA,gBACZ,GAAG,OAAO;AAAA,cACZ;AAAA;AAAA,UACF;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,cAAc,UAAU;AAAA,cAC5B,OAAO,EAAE,GAAG,OAAO,MAAM;AAAA,cAExB;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,MAAM,cAAc;;;AD9JZ,IAAAC,sBAAA;AA7LR,IAAM,UAAU,CAAC,UACf,aAAS,wBAAS,KAAK,SAAK,wBAAS,MAAM,MAAM;AAkC5C,IAAM,gBAAgB,CAG3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAiC;AAC/B,6BAAO,qBAAM;AACb,+BAAS,SAAS,EAAE;AAEpB,QAAM,kBAAc,8BAAe,YAAY;AAE/C,QAAM,CAAC,OAAO,QAAQ,QAAI,oDAAqB;AAAA,IAC7C,OAAO;AAAA,IACP;AAAA,IACA,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,mBAAe,sBAAY,IAAI;AAErC,QAAM,cAAU,2BAAY,MAAM;AAChC,UAAM,YAAY,aAAa;AAE/B,QAAI,CAAC,UAAW;AAEhB,QAAI,QAAQ;AAEZ,QAAI,aAAa,UAAU,cAAc,KAAK;AAE9C,QAAI,YAAY;AACd,iBAAW,MAAM;AAAA,IACnB,OAAO;AACL,cAAQ;AACR,mBAAa,UAAU,cAAc,KAAK;AAE1C,+CAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,eAAW;AAAA,IACf,CAAC,cAAiD;AAChD,YAAM,YACJ,QAAQ,SAAS,IAAI,UAAU,OAAO,QAAQ;AAGhD,eAAS,SAAS;AAAA,IACpB;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,wBAAgC;AAAA,IACpC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,MAAM;AAAA,MACN,GAAGA;AAAA,MACH,SAAK,yBAAU,KAAK,YAAY;AAAA,IAClC;AAAA,IACA,CAAC;AAAA,EACH;AAEA,QAAM,oBAGF;AAAA,IACF,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAC1B,YAAM,YAAYA,OAAM,UAAU;AAElC,aAAO;AAAA,QACL,GAAGA;AAAA,QACH;AAAA,QACA;AAAA,QACA,CAAC,WAAW,YAAY,WAAW,GACjC,SAAS,OAAO,YAAY;AAAA,QAC9B,gBAAgB;AAAA,QAChB;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,MAAM,OAAO,UAAU,QAAQ;AAAA,EAClC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAkBO,IAAM,iBAAa;AAAA,EACxB,CACE;AAAA,IACE,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ,CAAC;AAAA,IACT,YAAY;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,qCAAe;AAAA,MACjB,IAAI;AAAA,MACJ,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,cAAc,aAAa;AAE/B,UAAM,oBAAgB,gCAAiB,QAAQ;AAC/C,QAAI,mBAAmC,CAAC;AAExC,QAAI,CAAC,cAAc,UAAU,MAAM,QAAQ;AACzC,yBAAmB,MAAM,IAAI,CAAC,EAAE,OAAO,OAAAC,QAAO,GAAGD,OAAM,GAAG,MACxD,6CAAC,SAAc,OAAOC,QAAQ,GAAGD,QAC9B,mBADS,CAEZ,CACD;AAAA,IACH;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OACE;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QAGF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAW,kBAAG,kBAAkB,SAAS;AAAA,YACzC,KAAK,oBAAQ,cAAc,QAAQ,SAAS;AAAA,YAC3C,GAAG,kBAAkB;AAAA,cACpB;AAAA,cACA,mBAAmB;AAAA,cACnB,GAAG;AAAA,YACL,CAAC;AAAA,YACD;AAAA,YAEC,wCAAY;AAAA;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,WAAW,cAAc;","names":["import_form_control","import_utils","import_react","import_utils","props","import_jsx_runtime","props","value"]}
@@ -1,12 +1,12 @@
1
1
  "use client"
2
2
  import {
3
3
  RadioGroup,
4
- useRadioGroup,
5
- useRadioGroupContext
6
- } from "./chunk-Q2UUIUFI.mjs";
4
+ useRadioGroup
5
+ } from "./chunk-JUEGICB4.mjs";
6
+ import "./chunk-VT4XEFV3.mjs";
7
+ import "./chunk-YWRIETVW.mjs";
7
8
  export {
8
9
  RadioGroup,
9
- useRadioGroup,
10
- useRadioGroupContext
10
+ useRadioGroup
11
11
  };
12
12
  //# sourceMappingURL=radio-group.mjs.map