@huin-core/react-radio-group 1.0.2 → 1.0.4

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,69 @@
1
+ import * as React from 'react';
2
+ import React__default from 'react';
3
+ import { Primitive } from '@huin-core/react-primitive';
4
+ import * as RovingFocusGroup from '@huin-core/react-roving-focus';
5
+
6
+ type Scope<C = any> = {
7
+ [scopeName: string]: React.Context<C>[];
8
+ } | undefined;
9
+ type ScopeHook = (scope: Scope) => {
10
+ [__scopeProp: string]: Scope;
11
+ };
12
+ interface CreateScope {
13
+ scopeName: string;
14
+ (): ScopeHook;
15
+ }
16
+
17
+ type PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;
18
+ interface RadioProps$1 extends PrimitiveButtonProps {
19
+ checked?: boolean;
20
+ required?: boolean;
21
+ onCheck?(): void;
22
+ }
23
+ declare const Radio: React.ForwardRefExoticComponent<RadioProps$1 & React.RefAttributes<HTMLButtonElement>>;
24
+ type PrimitiveSpanProps = React.ComponentPropsWithoutRef<typeof Primitive.span>;
25
+ interface RadioIndicatorProps$1 extends PrimitiveSpanProps {
26
+ /**
27
+ * Used to force mounting when more control is needed. Useful when
28
+ * controlling animation with React animation libraries.
29
+ */
30
+ forceMount?: true;
31
+ }
32
+ declare const RadioIndicator: React.ForwardRefExoticComponent<RadioIndicatorProps$1 & React.RefAttributes<HTMLSpanElement>>;
33
+
34
+ declare const createRadioGroupScope: CreateScope;
35
+ type RadioGroupContextValue = {
36
+ name?: string;
37
+ required: boolean;
38
+ disabled: boolean;
39
+ value?: string;
40
+ onValueChange(value: string): void;
41
+ };
42
+ type RovingFocusGroupProps = React.ComponentPropsWithoutRef<typeof RovingFocusGroup.Root>;
43
+ type PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;
44
+ interface RadioGroupProps extends PrimitiveDivProps {
45
+ name?: RadioGroupContextValue["name"];
46
+ required?: React.ComponentPropsWithoutRef<typeof Radio>["required"];
47
+ disabled?: React.ComponentPropsWithoutRef<typeof Radio>["disabled"];
48
+ dir?: RovingFocusGroupProps["dir"];
49
+ orientation?: RovingFocusGroupProps["orientation"];
50
+ loop?: RovingFocusGroupProps["loop"];
51
+ defaultValue?: string;
52
+ value?: RadioGroupContextValue["value"];
53
+ onValueChange?: RadioGroupContextValue["onValueChange"];
54
+ }
55
+ declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
56
+ declare const Root: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
57
+
58
+ type RadioProps = React__default.ComponentPropsWithoutRef<typeof Radio>;
59
+ interface RadioGroupItemProps extends Omit<RadioProps, "onCheck" | "name"> {
60
+ value: string;
61
+ }
62
+ declare const RadioGroupItem: React__default.ForwardRefExoticComponent<RadioGroupItemProps & React__default.RefAttributes<HTMLButtonElement>>;
63
+
64
+ type RadioIndicatorProps = React__default.ComponentPropsWithoutRef<typeof RadioIndicator>;
65
+ interface RadioGroupIndicatorProps extends RadioIndicatorProps {
66
+ }
67
+ declare const RadioGroupIndicator: React__default.ForwardRefExoticComponent<RadioGroupIndicatorProps & React__default.RefAttributes<HTMLSpanElement>>;
68
+
69
+ export { Radio, RadioGroup, RadioGroupIndicator, type RadioGroupIndicatorProps, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RadioIndicator, type RadioIndicatorProps$1 as RadioIndicatorProps, type RadioProps$1 as RadioProps, Root, createRadioGroupScope };
@@ -0,0 +1,69 @@
1
+ import * as React from 'react';
2
+ import React__default from 'react';
3
+ import { Primitive } from '@huin-core/react-primitive';
4
+ import * as RovingFocusGroup from '@huin-core/react-roving-focus';
5
+
6
+ type Scope<C = any> = {
7
+ [scopeName: string]: React.Context<C>[];
8
+ } | undefined;
9
+ type ScopeHook = (scope: Scope) => {
10
+ [__scopeProp: string]: Scope;
11
+ };
12
+ interface CreateScope {
13
+ scopeName: string;
14
+ (): ScopeHook;
15
+ }
16
+
17
+ type PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;
18
+ interface RadioProps$1 extends PrimitiveButtonProps {
19
+ checked?: boolean;
20
+ required?: boolean;
21
+ onCheck?(): void;
22
+ }
23
+ declare const Radio: React.ForwardRefExoticComponent<RadioProps$1 & React.RefAttributes<HTMLButtonElement>>;
24
+ type PrimitiveSpanProps = React.ComponentPropsWithoutRef<typeof Primitive.span>;
25
+ interface RadioIndicatorProps$1 extends PrimitiveSpanProps {
26
+ /**
27
+ * Used to force mounting when more control is needed. Useful when
28
+ * controlling animation with React animation libraries.
29
+ */
30
+ forceMount?: true;
31
+ }
32
+ declare const RadioIndicator: React.ForwardRefExoticComponent<RadioIndicatorProps$1 & React.RefAttributes<HTMLSpanElement>>;
33
+
34
+ declare const createRadioGroupScope: CreateScope;
35
+ type RadioGroupContextValue = {
36
+ name?: string;
37
+ required: boolean;
38
+ disabled: boolean;
39
+ value?: string;
40
+ onValueChange(value: string): void;
41
+ };
42
+ type RovingFocusGroupProps = React.ComponentPropsWithoutRef<typeof RovingFocusGroup.Root>;
43
+ type PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;
44
+ interface RadioGroupProps extends PrimitiveDivProps {
45
+ name?: RadioGroupContextValue["name"];
46
+ required?: React.ComponentPropsWithoutRef<typeof Radio>["required"];
47
+ disabled?: React.ComponentPropsWithoutRef<typeof Radio>["disabled"];
48
+ dir?: RovingFocusGroupProps["dir"];
49
+ orientation?: RovingFocusGroupProps["orientation"];
50
+ loop?: RovingFocusGroupProps["loop"];
51
+ defaultValue?: string;
52
+ value?: RadioGroupContextValue["value"];
53
+ onValueChange?: RadioGroupContextValue["onValueChange"];
54
+ }
55
+ declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
56
+ declare const Root: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
57
+
58
+ type RadioProps = React__default.ComponentPropsWithoutRef<typeof Radio>;
59
+ interface RadioGroupItemProps extends Omit<RadioProps, "onCheck" | "name"> {
60
+ value: string;
61
+ }
62
+ declare const RadioGroupItem: React__default.ForwardRefExoticComponent<RadioGroupItemProps & React__default.RefAttributes<HTMLButtonElement>>;
63
+
64
+ type RadioIndicatorProps = React__default.ComponentPropsWithoutRef<typeof RadioIndicator>;
65
+ interface RadioGroupIndicatorProps extends RadioIndicatorProps {
66
+ }
67
+ declare const RadioGroupIndicator: React__default.ForwardRefExoticComponent<RadioGroupIndicatorProps & React__default.RefAttributes<HTMLSpanElement>>;
68
+
69
+ export { Radio, RadioGroup, RadioGroupIndicator, type RadioGroupIndicatorProps, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RadioIndicator, type RadioIndicatorProps$1 as RadioIndicatorProps, type RadioProps$1 as RadioProps, Root, createRadioGroupScope };
package/dist/index.js ADDED
@@ -0,0 +1,323 @@
1
+ "use strict";
2
+ "use client";
3
+ var __create = Object.create;
4
+ var __defProp = Object.defineProperty;
5
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __getOwnPropNames = Object.getOwnPropertyNames;
7
+ var __getProtoOf = Object.getPrototypeOf;
8
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
9
+ var __export = (target, all) => {
10
+ for (var name in all)
11
+ __defProp(target, name, { get: all[name], enumerable: true });
12
+ };
13
+ var __copyProps = (to, from, except, desc) => {
14
+ if (from && typeof from === "object" || typeof from === "function") {
15
+ for (let key of __getOwnPropNames(from))
16
+ if (!__hasOwnProp.call(to, key) && key !== except)
17
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
18
+ }
19
+ return to;
20
+ };
21
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
22
+ // If the importer is in node compatibility mode or this is not an ESM
23
+ // file that has been converted to a CommonJS file using a Babel-
24
+ // compatible transform (i.e. "__esModule" has not been set), then set
25
+ // "default" to the CommonJS "module.exports" for node compatibility.
26
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
27
+ mod
28
+ ));
29
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
30
+
31
+ // packages/react/radio-group/src/index.ts
32
+ var src_exports = {};
33
+ __export(src_exports, {
34
+ Radio: () => Radio,
35
+ RadioGroup: () => RadioGroup,
36
+ RadioGroupIndicator: () => RadioGroupIndicator,
37
+ RadioGroupItem: () => RadioGroupItem,
38
+ RadioIndicator: () => RadioIndicator,
39
+ Root: () => Root2,
40
+ createRadioGroupScope: () => createRadioGroupScope
41
+ });
42
+ module.exports = __toCommonJS(src_exports);
43
+
44
+ // packages/react/radio-group/src/RadioGroup.tsx
45
+ var React2 = __toESM(require("react"));
46
+ var import_react_context2 = require("@huin-core/react-context");
47
+ var import_react_primitive2 = require("@huin-core/react-primitive");
48
+ var RovingFocusGroup = __toESM(require("@huin-core/react-roving-focus"));
49
+ var import_react_roving_focus = require("@huin-core/react-roving-focus");
50
+ var import_react_use_controllable_state = require("@huin-core/react-use-controllable-state");
51
+ var import_react_direction = require("@huin-core/react-direction");
52
+
53
+ // packages/react/radio-group/src/Radio.tsx
54
+ var React = __toESM(require("react"));
55
+ var import_primitive = require("@huin-core/primitive");
56
+ var import_react_compose_refs = require("@huin-core/react-compose-refs");
57
+ var import_react_context = require("@huin-core/react-context");
58
+ var import_react_use_size = require("@huin-core/react-use-size");
59
+ var import_react_use_previous = require("@huin-core/react-use-previous");
60
+ var import_react_presence = require("@huin-core/react-presence");
61
+ var import_react_primitive = require("@huin-core/react-primitive");
62
+ var import_jsx_runtime = require("react/jsx-runtime");
63
+ var RADIO_NAME = "Radio";
64
+ var [createRadioContext, createRadioScope] = (0, import_react_context.createContextScope)(RADIO_NAME);
65
+ var [RadioProvider, useRadioContext] = createRadioContext(RADIO_NAME);
66
+ var Radio = React.forwardRef(
67
+ (props, forwardedRef) => {
68
+ const {
69
+ __scopeRadio,
70
+ name,
71
+ checked = false,
72
+ required,
73
+ disabled,
74
+ value = "on",
75
+ onCheck,
76
+ ...radioProps
77
+ } = props;
78
+ const [button, setButton] = React.useState(null);
79
+ const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, (node) => setButton(node));
80
+ const hasConsumerStoppedPropagationRef = React.useRef(false);
81
+ const isFormControl = button ? Boolean(button.closest("form")) : true;
82
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(RadioProvider, { scope: __scopeRadio, checked, disabled, children: [
83
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
84
+ import_react_primitive.Primitive.button,
85
+ {
86
+ type: "button",
87
+ role: "radio",
88
+ "aria-checked": checked,
89
+ "data-state": getState(checked),
90
+ "data-disabled": disabled ? "" : void 0,
91
+ disabled,
92
+ value,
93
+ ...radioProps,
94
+ ref: composedRefs,
95
+ onClick: (0, import_primitive.composeEventHandlers)(props.onClick, (event) => {
96
+ if (!checked) onCheck?.();
97
+ if (isFormControl) {
98
+ hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
99
+ if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();
100
+ }
101
+ })
102
+ }
103
+ ),
104
+ isFormControl && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
105
+ BubbleInput,
106
+ {
107
+ control: button,
108
+ bubbles: !hasConsumerStoppedPropagationRef.current,
109
+ name,
110
+ value,
111
+ checked,
112
+ required,
113
+ disabled,
114
+ style: { transform: "translateX(-100%)" }
115
+ }
116
+ )
117
+ ] });
118
+ }
119
+ );
120
+ Radio.displayName = RADIO_NAME;
121
+ var INDICATOR_NAME = "RadioIndicator";
122
+ var RadioIndicator = React.forwardRef(
123
+ (props, forwardedRef) => {
124
+ const { __scopeRadio, forceMount, ...indicatorProps } = props;
125
+ const context = useRadioContext(INDICATOR_NAME, __scopeRadio);
126
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_presence.Presence, { present: forceMount || context.checked, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
127
+ import_react_primitive.Primitive.span,
128
+ {
129
+ "data-state": getState(context.checked),
130
+ "data-disabled": context.disabled ? "" : void 0,
131
+ ...indicatorProps,
132
+ ref: forwardedRef
133
+ }
134
+ ) });
135
+ }
136
+ );
137
+ RadioIndicator.displayName = INDICATOR_NAME;
138
+ var BubbleInput = (props) => {
139
+ const { control, checked, bubbles = true, ...inputProps } = props;
140
+ const ref = React.useRef(null);
141
+ const prevChecked = (0, import_react_use_previous.usePrevious)(checked);
142
+ const controlSize = (0, import_react_use_size.useSize)(control);
143
+ React.useEffect(() => {
144
+ const input = ref.current;
145
+ const inputProto = window.HTMLInputElement.prototype;
146
+ const descriptor = Object.getOwnPropertyDescriptor(inputProto, "checked");
147
+ const setChecked = descriptor.set;
148
+ if (prevChecked !== checked && setChecked) {
149
+ const event = new Event("click", { bubbles });
150
+ setChecked.call(input, checked);
151
+ input.dispatchEvent(event);
152
+ }
153
+ }, [prevChecked, checked, bubbles]);
154
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
155
+ "input",
156
+ {
157
+ type: "radio",
158
+ "aria-hidden": true,
159
+ defaultChecked: checked,
160
+ ...inputProps,
161
+ tabIndex: -1,
162
+ ref,
163
+ style: {
164
+ ...props.style,
165
+ ...controlSize,
166
+ position: "absolute",
167
+ pointerEvents: "none",
168
+ opacity: 0,
169
+ margin: 0
170
+ }
171
+ }
172
+ );
173
+ };
174
+ function getState(checked) {
175
+ return checked ? "checked" : "unchecked";
176
+ }
177
+
178
+ // packages/react/radio-group/src/RadioGroup.tsx
179
+ var import_jsx_runtime2 = require("react/jsx-runtime");
180
+ var RADIO_GROUP_NAME = "RadioGroup";
181
+ var [createRadioGroupContext, createRadioGroupScope] = (0, import_react_context2.createContextScope)(
182
+ RADIO_GROUP_NAME,
183
+ [import_react_roving_focus.createRovingFocusGroupScope, createRadioScope]
184
+ );
185
+ var useRovingFocusGroupScope = (0, import_react_roving_focus.createRovingFocusGroupScope)();
186
+ var [RadioGroupProvider, useRadioGroupContext] = createRadioGroupContext(RADIO_GROUP_NAME);
187
+ var RadioGroup = React2.forwardRef(
188
+ (props, forwardedRef) => {
189
+ const {
190
+ __scopeRadioGroup,
191
+ name,
192
+ defaultValue,
193
+ value: valueProp,
194
+ required = false,
195
+ disabled = false,
196
+ orientation,
197
+ dir,
198
+ loop = true,
199
+ onValueChange,
200
+ ...groupProps
201
+ } = props;
202
+ const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);
203
+ const direction = (0, import_react_direction.useDirection)(dir);
204
+ const [value, setValue] = (0, import_react_use_controllable_state.useControllableState)({
205
+ prop: valueProp,
206
+ defaultProp: defaultValue,
207
+ onChange: onValueChange
208
+ });
209
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
210
+ RadioGroupProvider,
211
+ {
212
+ scope: __scopeRadioGroup,
213
+ name,
214
+ required,
215
+ disabled,
216
+ value,
217
+ onValueChange: setValue,
218
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
219
+ RovingFocusGroup.Root,
220
+ {
221
+ asChild: true,
222
+ ...rovingFocusGroupScope,
223
+ orientation,
224
+ dir: direction,
225
+ loop,
226
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
227
+ import_react_primitive2.Primitive.div,
228
+ {
229
+ role: "radiogroup",
230
+ "aria-required": required,
231
+ "aria-orientation": orientation,
232
+ "data-disabled": disabled ? "" : void 0,
233
+ dir: direction,
234
+ ...groupProps,
235
+ ref: forwardedRef
236
+ }
237
+ )
238
+ }
239
+ )
240
+ }
241
+ );
242
+ }
243
+ );
244
+ RadioGroup.displayName = RADIO_GROUP_NAME;
245
+ var Root2 = RadioGroup;
246
+
247
+ // packages/react/radio-group/src/RadioGroupItem.tsx
248
+ var import_react2 = __toESM(require("react"));
249
+
250
+ // packages/react/radio-group/src/RadioGroupIndicator.tsx
251
+ var import_react = __toESM(require("react"));
252
+ var import_jsx_runtime3 = require("react/jsx-runtime");
253
+ var INDICATOR_NAME2 = "RadioGroupIndicator";
254
+ var useRadioScope = createRadioScope();
255
+ var RadioGroupIndicator = import_react.default.forwardRef((props, forwardedRef) => {
256
+ const { __scopeRadioGroup, ...indicatorProps } = props;
257
+ const radioScope = useRadioScope(__scopeRadioGroup);
258
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RadioIndicator, { ...radioScope, ...indicatorProps, ref: forwardedRef });
259
+ });
260
+ RadioGroupIndicator.displayName = INDICATOR_NAME2;
261
+
262
+ // packages/react/radio-group/src/RadioGroupItem.tsx
263
+ var import_react_compose_refs2 = require("@huin-core/react-compose-refs");
264
+ var RovingFocusGroup2 = __toESM(require("@huin-core/react-roving-focus"));
265
+ var import_primitive2 = require("@huin-core/primitive");
266
+ var import_jsx_runtime4 = require("react/jsx-runtime");
267
+ var ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
268
+ var ITEM_NAME = "RadioGroupItem";
269
+ var RadioGroupItem = import_react2.default.forwardRef((props, forwardedRef) => {
270
+ const { __scopeRadioGroup, disabled, ...itemProps } = props;
271
+ const context = useRadioGroupContext(ITEM_NAME, __scopeRadioGroup);
272
+ const isDisabled = context.disabled || disabled;
273
+ const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);
274
+ const radioScope = useRadioScope(__scopeRadioGroup);
275
+ const ref = import_react2.default.useRef(null);
276
+ const composedRefs = (0, import_react_compose_refs2.useComposedRefs)(forwardedRef, ref);
277
+ const checked = context.value === itemProps.value;
278
+ const isArrowKeyPressedRef = import_react2.default.useRef(false);
279
+ import_react2.default.useEffect(() => {
280
+ const handleKeyDown = (event) => {
281
+ if (ARROW_KEYS.includes(event.key)) {
282
+ isArrowKeyPressedRef.current = true;
283
+ }
284
+ };
285
+ const handleKeyUp = () => isArrowKeyPressedRef.current = false;
286
+ document.addEventListener("keydown", handleKeyDown);
287
+ document.addEventListener("keyup", handleKeyUp);
288
+ return () => {
289
+ document.removeEventListener("keydown", handleKeyDown);
290
+ document.removeEventListener("keyup", handleKeyUp);
291
+ };
292
+ }, []);
293
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
294
+ RovingFocusGroup2.Item,
295
+ {
296
+ asChild: true,
297
+ ...rovingFocusGroupScope,
298
+ focusable: !isDisabled,
299
+ active: checked,
300
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
301
+ Radio,
302
+ {
303
+ disabled: isDisabled,
304
+ required: context.required,
305
+ checked,
306
+ ...radioScope,
307
+ ...itemProps,
308
+ name: context.name,
309
+ ref: composedRefs,
310
+ onCheck: () => context.onValueChange(itemProps.value),
311
+ onKeyDown: (0, import_primitive2.composeEventHandlers)((event) => {
312
+ if (event.key === "Enter") event.preventDefault();
313
+ }),
314
+ onFocus: (0, import_primitive2.composeEventHandlers)(itemProps.onFocus, () => {
315
+ if (isArrowKeyPressedRef.current) ref.current?.click();
316
+ })
317
+ }
318
+ )
319
+ }
320
+ );
321
+ });
322
+ RadioGroupItem.displayName = ITEM_NAME;
323
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/index.ts", "../src/RadioGroup.tsx", "../src/Radio.tsx", "../src/RadioGroupItem.tsx", "../src/RadioGroupIndicator.tsx"],
4
+ "sourcesContent": ["\"use client\";\nexport { createRadioGroupScope, RadioGroup, Root } from \"./RadioGroup\";\nexport { RadioGroupItem } from \"./RadioGroupItem\";\nexport { RadioGroupIndicator } from \"./RadioGroupIndicator\";\nexport { Radio, RadioIndicator } from \"./Radio\";\n\nexport type { RadioGroupProps } from \"./RadioGroup\";\nexport type { RadioGroupItemProps } from \"./RadioGroupItem\";\nexport type { RadioGroupIndicatorProps } from \"./RadioGroupIndicator\";\nexport type { RadioProps, RadioIndicatorProps } from \"./Radio\";\n", "import * as React from \"react\";\nimport { createContextScope } from \"@huin-core/react-context\";\nimport { Primitive } from \"@huin-core/react-primitive\";\nimport * as RovingFocusGroup from \"@huin-core/react-roving-focus\";\nimport { createRovingFocusGroupScope } from \"@huin-core/react-roving-focus\";\nimport { useControllableState } from \"@huin-core/react-use-controllable-state\";\nimport { useDirection } from \"@huin-core/react-direction\";\nimport { Radio, createRadioScope } from \"./Radio\";\nimport type { Scope } from \"@huin-core/react-context\";\n\n\n/* -------------------------------------------------------------------------------------------------\n * RadioGroup\n * -----------------------------------------------------------------------------------------------*/\nconst RADIO_GROUP_NAME = \"RadioGroup\";\n\nexport type ScopedProps<P> = P & { __scopeRadioGroup?: Scope };\nconst [createRadioGroupContext, createRadioGroupScope] = createContextScope(\n RADIO_GROUP_NAME,\n [createRovingFocusGroupScope, createRadioScope]\n);\nexport const useRovingFocusGroupScope = createRovingFocusGroupScope();\n\ntype RadioGroupContextValue = {\n name?: string;\n required: boolean;\n disabled: boolean;\n value?: string;\n onValueChange(value: string): void;\n};\n\nexport const [RadioGroupProvider, useRadioGroupContext] =\n createRadioGroupContext<RadioGroupContextValue>(RADIO_GROUP_NAME);\n\ntype RadioGroupElement = React.ElementRef<typeof Primitive.div>;\ntype RovingFocusGroupProps = React.ComponentPropsWithoutRef<\n typeof RovingFocusGroup.Root\n>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface RadioGroupProps extends PrimitiveDivProps {\n name?: RadioGroupContextValue[\"name\"];\n required?: React.ComponentPropsWithoutRef<typeof Radio>[\"required\"];\n disabled?: React.ComponentPropsWithoutRef<typeof Radio>[\"disabled\"];\n dir?: RovingFocusGroupProps[\"dir\"];\n orientation?: RovingFocusGroupProps[\"orientation\"];\n loop?: RovingFocusGroupProps[\"loop\"];\n defaultValue?: string;\n value?: RadioGroupContextValue[\"value\"];\n onValueChange?: RadioGroupContextValue[\"onValueChange\"];\n}\n\nconst RadioGroup = React.forwardRef<RadioGroupElement, RadioGroupProps>(\n (props: ScopedProps<RadioGroupProps>, forwardedRef) => {\n const {\n __scopeRadioGroup,\n name,\n defaultValue,\n value: valueProp,\n required = false,\n disabled = false,\n orientation,\n dir,\n loop = true,\n onValueChange,\n ...groupProps\n } = props;\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);\n const direction = useDirection(dir);\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <RadioGroupProvider\n scope={__scopeRadioGroup}\n name={name}\n required={required}\n disabled={disabled}\n value={value}\n onValueChange={setValue}\n >\n <RovingFocusGroup.Root\n asChild\n {...rovingFocusGroupScope}\n orientation={orientation}\n dir={direction}\n loop={loop}\n >\n <Primitive.div\n role=\"radiogroup\"\n aria-required={required}\n aria-orientation={orientation}\n data-disabled={disabled ? '' : undefined}\n dir={direction}\n {...groupProps}\n ref={forwardedRef}\n />\n </RovingFocusGroup.Root>\n </RadioGroupProvider>\n );\n }\n);\n\nRadioGroup.displayName = RADIO_GROUP_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\nconst Root = RadioGroup;\n\nexport { createRadioGroupScope, RadioGroup, Root };\nexport type { RadioGroupProps };\n", "import * as React from 'react';\nimport { composeEventHandlers } from '@huin-core/primitive';\nimport { useComposedRefs } from '@huin-core/react-compose-refs';\nimport { createContextScope } from '@huin-core/react-context';\nimport { useSize } from '@huin-core/react-use-size';\nimport { usePrevious } from '@huin-core/react-use-previous';\nimport { Presence } from '@huin-core/react-presence';\nimport { Primitive } from '@huin-core/react-primitive';\n\nimport type { Scope } from '@huin-core/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Radio\n * -----------------------------------------------------------------------------------------------*/\n\nconst RADIO_NAME = 'Radio';\n\ntype ScopedProps<P> = P & { __scopeRadio?: Scope };\nconst [createRadioContext, createRadioScope] = createContextScope(RADIO_NAME);\n\ntype RadioContextValue = { checked: boolean; disabled?: boolean };\nconst [RadioProvider, useRadioContext] = createRadioContext<RadioContextValue>(RADIO_NAME);\n\ntype RadioElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface RadioProps extends PrimitiveButtonProps {\n checked?: boolean;\n required?: boolean;\n onCheck?(): void;\n}\n\nconst Radio = React.forwardRef<RadioElement, RadioProps>(\n (props: ScopedProps<RadioProps>, forwardedRef) => {\n const {\n __scopeRadio,\n name,\n checked = false,\n required,\n disabled,\n value = 'on',\n onCheck,\n ...radioProps\n } = props;\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null);\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n const hasConsumerStoppedPropagationRef = React.useRef(false);\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = button ? Boolean(button.closest('form')) : true;\n\n return (\n <RadioProvider scope={__scopeRadio} checked={checked} disabled={disabled}>\n <Primitive.button\n type=\"button\"\n role=\"radio\"\n aria-checked={checked}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n value={value}\n {...radioProps}\n ref={composedRefs}\n onClick={composeEventHandlers(props.onClick, (event) => {\n // radios cannot be unchecked so we only communicate a checked state\n if (!checked) onCheck?.();\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n // if radio is in a form, stop propagation from the button so that we only propagate\n // one click event (from the input). We propagate changes from an input so that native\n // form validation works and form events reflect radio updates.\n if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n }\n })}\n />\n {isFormControl && (\n <BubbleInput\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n // We transform because the input is absolutely positioned but we have\n // rendered it **after** the button. This pulls it back to sit on top\n // of the button.\n style={{ transform: 'translateX(-100%)' }}\n />\n )}\n </RadioProvider>\n );\n }\n);\n\nRadio.displayName = RADIO_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * RadioIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'RadioIndicator';\n\ntype RadioIndicatorElement = React.ElementRef<typeof Primitive.span>;\ntype PrimitiveSpanProps = React.ComponentPropsWithoutRef<typeof Primitive.span>;\nexport interface RadioIndicatorProps extends PrimitiveSpanProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true;\n}\n\nconst RadioIndicator = React.forwardRef<RadioIndicatorElement, RadioIndicatorProps>(\n (props: ScopedProps<RadioIndicatorProps>, forwardedRef) => {\n const { __scopeRadio, forceMount, ...indicatorProps } = props;\n const context = useRadioContext(INDICATOR_NAME, __scopeRadio);\n return (\n <Presence present={forceMount || context.checked}>\n <Primitive.span\n data-state={getState(context.checked)}\n data-disabled={context.disabled ? '' : undefined}\n {...indicatorProps}\n ref={forwardedRef}\n />\n </Presence>\n );\n }\n);\n\nRadioIndicator.displayName = INDICATOR_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = React.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: boolean;\n control: HTMLElement | null;\n bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n const { control, checked, bubbles = true, ...inputProps } = props;\n const ref = React.useRef<HTMLInputElement>(null);\n const prevChecked = usePrevious(checked);\n const controlSize = useSize(control);\n\n // Bubble checked change to parents (e.g form change event)\n React.useEffect(() => {\n const input = ref.current!;\n const inputProto = window.HTMLInputElement.prototype;\n const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n const setChecked = descriptor.set;\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles });\n setChecked.call(input, checked);\n input.dispatchEvent(event);\n }\n }, [prevChecked, checked, bubbles]);\n\n return (\n <input\n type=\"radio\"\n aria-hidden\n defaultChecked={checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n style={{\n ...props.style,\n ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }}\n />\n );\n};\n\nfunction getState(checked: boolean) {\n return checked ? 'checked' : 'unchecked';\n}\n\nexport {\n createRadioScope,\n //\n Radio,\n RadioIndicator,\n};\nexport type { RadioProps };\n", "import React from \"react\";\nimport { Radio } from \"./Radio\";\nimport {\n ScopedProps,\n useRadioGroupContext,\n useRovingFocusGroupScope,\n} from \"./RadioGroup\";\nimport { useRadioScope } from \"./RadioGroupIndicator\";\nimport { useComposedRefs } from \"@huin-core/react-compose-refs\";\nimport * as RovingFocusGroup from \"@huin-core/react-roving-focus\";\nimport { composeEventHandlers } from \"@huin-core/primitive\";\n\nconst ARROW_KEYS = [\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\"];\n\nconst ITEM_NAME = \"RadioGroupItem\";\n\ntype RadioGroupItemElement = React.ElementRef<typeof Radio>;\ntype RadioProps = React.ComponentPropsWithoutRef<typeof Radio>;\ninterface RadioGroupItemProps extends Omit<RadioProps, \"onCheck\" | \"name\"> {\n value: string;\n}\n\nconst RadioGroupItem = React.forwardRef<\n RadioGroupItemElement,\n RadioGroupItemProps\n>((props: ScopedProps<RadioGroupItemProps>, forwardedRef) => {\n const { __scopeRadioGroup, disabled, ...itemProps } = props;\n const context = useRadioGroupContext(ITEM_NAME, __scopeRadioGroup);\n const isDisabled = context.disabled || disabled;\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);\n const radioScope = useRadioScope(__scopeRadioGroup);\n const ref = React.useRef<React.ElementRef<typeof Radio>>(null);\n const composedRefs = useComposedRefs(forwardedRef, ref);\n const checked = context.value === itemProps.value;\n const isArrowKeyPressedRef = React.useRef(false);\n\n React.useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (ARROW_KEYS.includes(event.key)) {\n isArrowKeyPressedRef.current = true;\n }\n };\n const handleKeyUp = () => (isArrowKeyPressedRef.current = false);\n document.addEventListener(\"keydown\", handleKeyDown);\n document.addEventListener(\"keyup\", handleKeyUp);\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n document.removeEventListener(\"keyup\", handleKeyUp);\n };\n }, []);\n\n return (\n <RovingFocusGroup.Item\n asChild\n {...rovingFocusGroupScope}\n focusable={!isDisabled}\n active={checked}\n >\n <Radio\n disabled={isDisabled}\n required={context.required}\n checked={checked}\n {...radioScope}\n {...itemProps}\n name={context.name}\n ref={composedRefs}\n onCheck={() => context.onValueChange(itemProps.value)}\n onKeyDown={composeEventHandlers((event) => {\n // According to WAI ARIA, radio groups don't activate items on enter keypress\n if (event.key === \"Enter\") event.preventDefault();\n })}\n onFocus={composeEventHandlers(itemProps.onFocus, () => {\n /**\n * Our `RovingFocusGroup` will focus the radio when navigating with arrow keys\n * and we need to \"check\" it in that case. We click it to \"check\" it (instead\n * of updating `context.value`) so that the radio change event fires.\n */\n if (isArrowKeyPressedRef.current) ref.current?.click();\n })}\n />\n </RovingFocusGroup.Item>\n );\n});\n\nRadioGroupItem.displayName = ITEM_NAME;\n\nexport { RadioGroupItem };\nexport type { RadioGroupItemProps };\n", "import React from \"react\";\nimport { ScopedProps } from \"./RadioGroup\";\nimport { createRadioScope, RadioIndicator } from \"./Radio\";\n\nconst INDICATOR_NAME = \"RadioGroupIndicator\";\n\ntype RadioGroupIndicatorElement = React.ElementRef<typeof RadioIndicator>;\ntype RadioIndicatorProps = React.ComponentPropsWithoutRef<\n typeof RadioIndicator\n>;\ninterface RadioGroupIndicatorProps extends RadioIndicatorProps {}\nexport const useRadioScope = createRadioScope();\n\nconst RadioGroupIndicator = React.forwardRef<\n RadioGroupIndicatorElement,\n RadioGroupIndicatorProps\n>((props: ScopedProps<RadioGroupIndicatorProps>, forwardedRef) => {\n const { __scopeRadioGroup, ...indicatorProps } = props;\n const radioScope = useRadioScope(__scopeRadioGroup);\n return (\n <RadioIndicator {...radioScope} {...indicatorProps} ref={forwardedRef} />\n );\n});\n\nRadioGroupIndicator.displayName = INDICATOR_NAME;\n\nexport { RadioGroupIndicator };\nexport type { RadioGroupIndicatorProps };\n"],
5
+ "mappings": "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",
6
+ "names": ["Root", "React", "import_react_context", "import_react_primitive", "import_jsx_runtime", "Root", "import_react", "import_jsx_runtime", "INDICATOR_NAME", "React", "import_react_compose_refs", "RovingFocusGroup", "import_primitive", "import_jsx_runtime", "React"]
7
+ }
package/dist/index.mjs ADDED
@@ -0,0 +1,291 @@
1
+ "use client";
2
+
3
+ // packages/react/radio-group/src/RadioGroup.tsx
4
+ import * as React2 from "react";
5
+ import { createContextScope as createContextScope2 } from "@huin-core/react-context";
6
+ import { Primitive as Primitive2 } from "@huin-core/react-primitive";
7
+ import * as RovingFocusGroup from "@huin-core/react-roving-focus";
8
+ import { createRovingFocusGroupScope } from "@huin-core/react-roving-focus";
9
+ import { useControllableState } from "@huin-core/react-use-controllable-state";
10
+ import { useDirection } from "@huin-core/react-direction";
11
+
12
+ // packages/react/radio-group/src/Radio.tsx
13
+ import * as React from "react";
14
+ import { composeEventHandlers } from "@huin-core/primitive";
15
+ import { useComposedRefs } from "@huin-core/react-compose-refs";
16
+ import { createContextScope } from "@huin-core/react-context";
17
+ import { useSize } from "@huin-core/react-use-size";
18
+ import { usePrevious } from "@huin-core/react-use-previous";
19
+ import { Presence } from "@huin-core/react-presence";
20
+ import { Primitive } from "@huin-core/react-primitive";
21
+ import { jsx, jsxs } from "react/jsx-runtime";
22
+ var RADIO_NAME = "Radio";
23
+ var [createRadioContext, createRadioScope] = createContextScope(RADIO_NAME);
24
+ var [RadioProvider, useRadioContext] = createRadioContext(RADIO_NAME);
25
+ var Radio = React.forwardRef(
26
+ (props, forwardedRef) => {
27
+ const {
28
+ __scopeRadio,
29
+ name,
30
+ checked = false,
31
+ required,
32
+ disabled,
33
+ value = "on",
34
+ onCheck,
35
+ ...radioProps
36
+ } = props;
37
+ const [button, setButton] = React.useState(null);
38
+ const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));
39
+ const hasConsumerStoppedPropagationRef = React.useRef(false);
40
+ const isFormControl = button ? Boolean(button.closest("form")) : true;
41
+ return /* @__PURE__ */ jsxs(RadioProvider, { scope: __scopeRadio, checked, disabled, children: [
42
+ /* @__PURE__ */ jsx(
43
+ Primitive.button,
44
+ {
45
+ type: "button",
46
+ role: "radio",
47
+ "aria-checked": checked,
48
+ "data-state": getState(checked),
49
+ "data-disabled": disabled ? "" : void 0,
50
+ disabled,
51
+ value,
52
+ ...radioProps,
53
+ ref: composedRefs,
54
+ onClick: composeEventHandlers(props.onClick, (event) => {
55
+ if (!checked) onCheck?.();
56
+ if (isFormControl) {
57
+ hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
58
+ if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();
59
+ }
60
+ })
61
+ }
62
+ ),
63
+ isFormControl && /* @__PURE__ */ jsx(
64
+ BubbleInput,
65
+ {
66
+ control: button,
67
+ bubbles: !hasConsumerStoppedPropagationRef.current,
68
+ name,
69
+ value,
70
+ checked,
71
+ required,
72
+ disabled,
73
+ style: { transform: "translateX(-100%)" }
74
+ }
75
+ )
76
+ ] });
77
+ }
78
+ );
79
+ Radio.displayName = RADIO_NAME;
80
+ var INDICATOR_NAME = "RadioIndicator";
81
+ var RadioIndicator = React.forwardRef(
82
+ (props, forwardedRef) => {
83
+ const { __scopeRadio, forceMount, ...indicatorProps } = props;
84
+ const context = useRadioContext(INDICATOR_NAME, __scopeRadio);
85
+ return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.checked, children: /* @__PURE__ */ jsx(
86
+ Primitive.span,
87
+ {
88
+ "data-state": getState(context.checked),
89
+ "data-disabled": context.disabled ? "" : void 0,
90
+ ...indicatorProps,
91
+ ref: forwardedRef
92
+ }
93
+ ) });
94
+ }
95
+ );
96
+ RadioIndicator.displayName = INDICATOR_NAME;
97
+ var BubbleInput = (props) => {
98
+ const { control, checked, bubbles = true, ...inputProps } = props;
99
+ const ref = React.useRef(null);
100
+ const prevChecked = usePrevious(checked);
101
+ const controlSize = useSize(control);
102
+ React.useEffect(() => {
103
+ const input = ref.current;
104
+ const inputProto = window.HTMLInputElement.prototype;
105
+ const descriptor = Object.getOwnPropertyDescriptor(inputProto, "checked");
106
+ const setChecked = descriptor.set;
107
+ if (prevChecked !== checked && setChecked) {
108
+ const event = new Event("click", { bubbles });
109
+ setChecked.call(input, checked);
110
+ input.dispatchEvent(event);
111
+ }
112
+ }, [prevChecked, checked, bubbles]);
113
+ return /* @__PURE__ */ jsx(
114
+ "input",
115
+ {
116
+ type: "radio",
117
+ "aria-hidden": true,
118
+ defaultChecked: checked,
119
+ ...inputProps,
120
+ tabIndex: -1,
121
+ ref,
122
+ style: {
123
+ ...props.style,
124
+ ...controlSize,
125
+ position: "absolute",
126
+ pointerEvents: "none",
127
+ opacity: 0,
128
+ margin: 0
129
+ }
130
+ }
131
+ );
132
+ };
133
+ function getState(checked) {
134
+ return checked ? "checked" : "unchecked";
135
+ }
136
+
137
+ // packages/react/radio-group/src/RadioGroup.tsx
138
+ import { jsx as jsx2 } from "react/jsx-runtime";
139
+ var RADIO_GROUP_NAME = "RadioGroup";
140
+ var [createRadioGroupContext, createRadioGroupScope] = createContextScope2(
141
+ RADIO_GROUP_NAME,
142
+ [createRovingFocusGroupScope, createRadioScope]
143
+ );
144
+ var useRovingFocusGroupScope = createRovingFocusGroupScope();
145
+ var [RadioGroupProvider, useRadioGroupContext] = createRadioGroupContext(RADIO_GROUP_NAME);
146
+ var RadioGroup = React2.forwardRef(
147
+ (props, forwardedRef) => {
148
+ const {
149
+ __scopeRadioGroup,
150
+ name,
151
+ defaultValue,
152
+ value: valueProp,
153
+ required = false,
154
+ disabled = false,
155
+ orientation,
156
+ dir,
157
+ loop = true,
158
+ onValueChange,
159
+ ...groupProps
160
+ } = props;
161
+ const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);
162
+ const direction = useDirection(dir);
163
+ const [value, setValue] = useControllableState({
164
+ prop: valueProp,
165
+ defaultProp: defaultValue,
166
+ onChange: onValueChange
167
+ });
168
+ return /* @__PURE__ */ jsx2(
169
+ RadioGroupProvider,
170
+ {
171
+ scope: __scopeRadioGroup,
172
+ name,
173
+ required,
174
+ disabled,
175
+ value,
176
+ onValueChange: setValue,
177
+ children: /* @__PURE__ */ jsx2(
178
+ RovingFocusGroup.Root,
179
+ {
180
+ asChild: true,
181
+ ...rovingFocusGroupScope,
182
+ orientation,
183
+ dir: direction,
184
+ loop,
185
+ children: /* @__PURE__ */ jsx2(
186
+ Primitive2.div,
187
+ {
188
+ role: "radiogroup",
189
+ "aria-required": required,
190
+ "aria-orientation": orientation,
191
+ "data-disabled": disabled ? "" : void 0,
192
+ dir: direction,
193
+ ...groupProps,
194
+ ref: forwardedRef
195
+ }
196
+ )
197
+ }
198
+ )
199
+ }
200
+ );
201
+ }
202
+ );
203
+ RadioGroup.displayName = RADIO_GROUP_NAME;
204
+ var Root2 = RadioGroup;
205
+
206
+ // packages/react/radio-group/src/RadioGroupItem.tsx
207
+ import React4 from "react";
208
+
209
+ // packages/react/radio-group/src/RadioGroupIndicator.tsx
210
+ import React3 from "react";
211
+ import { jsx as jsx3 } from "react/jsx-runtime";
212
+ var INDICATOR_NAME2 = "RadioGroupIndicator";
213
+ var useRadioScope = createRadioScope();
214
+ var RadioGroupIndicator = React3.forwardRef((props, forwardedRef) => {
215
+ const { __scopeRadioGroup, ...indicatorProps } = props;
216
+ const radioScope = useRadioScope(__scopeRadioGroup);
217
+ return /* @__PURE__ */ jsx3(RadioIndicator, { ...radioScope, ...indicatorProps, ref: forwardedRef });
218
+ });
219
+ RadioGroupIndicator.displayName = INDICATOR_NAME2;
220
+
221
+ // packages/react/radio-group/src/RadioGroupItem.tsx
222
+ import { useComposedRefs as useComposedRefs2 } from "@huin-core/react-compose-refs";
223
+ import * as RovingFocusGroup2 from "@huin-core/react-roving-focus";
224
+ import { composeEventHandlers as composeEventHandlers2 } from "@huin-core/primitive";
225
+ import { jsx as jsx4 } from "react/jsx-runtime";
226
+ var ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
227
+ var ITEM_NAME = "RadioGroupItem";
228
+ var RadioGroupItem = React4.forwardRef((props, forwardedRef) => {
229
+ const { __scopeRadioGroup, disabled, ...itemProps } = props;
230
+ const context = useRadioGroupContext(ITEM_NAME, __scopeRadioGroup);
231
+ const isDisabled = context.disabled || disabled;
232
+ const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);
233
+ const radioScope = useRadioScope(__scopeRadioGroup);
234
+ const ref = React4.useRef(null);
235
+ const composedRefs = useComposedRefs2(forwardedRef, ref);
236
+ const checked = context.value === itemProps.value;
237
+ const isArrowKeyPressedRef = React4.useRef(false);
238
+ React4.useEffect(() => {
239
+ const handleKeyDown = (event) => {
240
+ if (ARROW_KEYS.includes(event.key)) {
241
+ isArrowKeyPressedRef.current = true;
242
+ }
243
+ };
244
+ const handleKeyUp = () => isArrowKeyPressedRef.current = false;
245
+ document.addEventListener("keydown", handleKeyDown);
246
+ document.addEventListener("keyup", handleKeyUp);
247
+ return () => {
248
+ document.removeEventListener("keydown", handleKeyDown);
249
+ document.removeEventListener("keyup", handleKeyUp);
250
+ };
251
+ }, []);
252
+ return /* @__PURE__ */ jsx4(
253
+ RovingFocusGroup2.Item,
254
+ {
255
+ asChild: true,
256
+ ...rovingFocusGroupScope,
257
+ focusable: !isDisabled,
258
+ active: checked,
259
+ children: /* @__PURE__ */ jsx4(
260
+ Radio,
261
+ {
262
+ disabled: isDisabled,
263
+ required: context.required,
264
+ checked,
265
+ ...radioScope,
266
+ ...itemProps,
267
+ name: context.name,
268
+ ref: composedRefs,
269
+ onCheck: () => context.onValueChange(itemProps.value),
270
+ onKeyDown: composeEventHandlers2((event) => {
271
+ if (event.key === "Enter") event.preventDefault();
272
+ }),
273
+ onFocus: composeEventHandlers2(itemProps.onFocus, () => {
274
+ if (isArrowKeyPressedRef.current) ref.current?.click();
275
+ })
276
+ }
277
+ )
278
+ }
279
+ );
280
+ });
281
+ RadioGroupItem.displayName = ITEM_NAME;
282
+ export {
283
+ Radio,
284
+ RadioGroup,
285
+ RadioGroupIndicator,
286
+ RadioGroupItem,
287
+ RadioIndicator,
288
+ Root2 as Root,
289
+ createRadioGroupScope
290
+ };
291
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/RadioGroup.tsx", "../src/Radio.tsx", "../src/RadioGroupItem.tsx", "../src/RadioGroupIndicator.tsx"],
4
+ "sourcesContent": ["import * as React from \"react\";\nimport { createContextScope } from \"@huin-core/react-context\";\nimport { Primitive } from \"@huin-core/react-primitive\";\nimport * as RovingFocusGroup from \"@huin-core/react-roving-focus\";\nimport { createRovingFocusGroupScope } from \"@huin-core/react-roving-focus\";\nimport { useControllableState } from \"@huin-core/react-use-controllable-state\";\nimport { useDirection } from \"@huin-core/react-direction\";\nimport { Radio, createRadioScope } from \"./Radio\";\nimport type { Scope } from \"@huin-core/react-context\";\n\n\n/* -------------------------------------------------------------------------------------------------\n * RadioGroup\n * -----------------------------------------------------------------------------------------------*/\nconst RADIO_GROUP_NAME = \"RadioGroup\";\n\nexport type ScopedProps<P> = P & { __scopeRadioGroup?: Scope };\nconst [createRadioGroupContext, createRadioGroupScope] = createContextScope(\n RADIO_GROUP_NAME,\n [createRovingFocusGroupScope, createRadioScope]\n);\nexport const useRovingFocusGroupScope = createRovingFocusGroupScope();\n\ntype RadioGroupContextValue = {\n name?: string;\n required: boolean;\n disabled: boolean;\n value?: string;\n onValueChange(value: string): void;\n};\n\nexport const [RadioGroupProvider, useRadioGroupContext] =\n createRadioGroupContext<RadioGroupContextValue>(RADIO_GROUP_NAME);\n\ntype RadioGroupElement = React.ElementRef<typeof Primitive.div>;\ntype RovingFocusGroupProps = React.ComponentPropsWithoutRef<\n typeof RovingFocusGroup.Root\n>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface RadioGroupProps extends PrimitiveDivProps {\n name?: RadioGroupContextValue[\"name\"];\n required?: React.ComponentPropsWithoutRef<typeof Radio>[\"required\"];\n disabled?: React.ComponentPropsWithoutRef<typeof Radio>[\"disabled\"];\n dir?: RovingFocusGroupProps[\"dir\"];\n orientation?: RovingFocusGroupProps[\"orientation\"];\n loop?: RovingFocusGroupProps[\"loop\"];\n defaultValue?: string;\n value?: RadioGroupContextValue[\"value\"];\n onValueChange?: RadioGroupContextValue[\"onValueChange\"];\n}\n\nconst RadioGroup = React.forwardRef<RadioGroupElement, RadioGroupProps>(\n (props: ScopedProps<RadioGroupProps>, forwardedRef) => {\n const {\n __scopeRadioGroup,\n name,\n defaultValue,\n value: valueProp,\n required = false,\n disabled = false,\n orientation,\n dir,\n loop = true,\n onValueChange,\n ...groupProps\n } = props;\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);\n const direction = useDirection(dir);\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <RadioGroupProvider\n scope={__scopeRadioGroup}\n name={name}\n required={required}\n disabled={disabled}\n value={value}\n onValueChange={setValue}\n >\n <RovingFocusGroup.Root\n asChild\n {...rovingFocusGroupScope}\n orientation={orientation}\n dir={direction}\n loop={loop}\n >\n <Primitive.div\n role=\"radiogroup\"\n aria-required={required}\n aria-orientation={orientation}\n data-disabled={disabled ? '' : undefined}\n dir={direction}\n {...groupProps}\n ref={forwardedRef}\n />\n </RovingFocusGroup.Root>\n </RadioGroupProvider>\n );\n }\n);\n\nRadioGroup.displayName = RADIO_GROUP_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\nconst Root = RadioGroup;\n\nexport { createRadioGroupScope, RadioGroup, Root };\nexport type { RadioGroupProps };\n", "import * as React from 'react';\nimport { composeEventHandlers } from '@huin-core/primitive';\nimport { useComposedRefs } from '@huin-core/react-compose-refs';\nimport { createContextScope } from '@huin-core/react-context';\nimport { useSize } from '@huin-core/react-use-size';\nimport { usePrevious } from '@huin-core/react-use-previous';\nimport { Presence } from '@huin-core/react-presence';\nimport { Primitive } from '@huin-core/react-primitive';\n\nimport type { Scope } from '@huin-core/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Radio\n * -----------------------------------------------------------------------------------------------*/\n\nconst RADIO_NAME = 'Radio';\n\ntype ScopedProps<P> = P & { __scopeRadio?: Scope };\nconst [createRadioContext, createRadioScope] = createContextScope(RADIO_NAME);\n\ntype RadioContextValue = { checked: boolean; disabled?: boolean };\nconst [RadioProvider, useRadioContext] = createRadioContext<RadioContextValue>(RADIO_NAME);\n\ntype RadioElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface RadioProps extends PrimitiveButtonProps {\n checked?: boolean;\n required?: boolean;\n onCheck?(): void;\n}\n\nconst Radio = React.forwardRef<RadioElement, RadioProps>(\n (props: ScopedProps<RadioProps>, forwardedRef) => {\n const {\n __scopeRadio,\n name,\n checked = false,\n required,\n disabled,\n value = 'on',\n onCheck,\n ...radioProps\n } = props;\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null);\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n const hasConsumerStoppedPropagationRef = React.useRef(false);\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = button ? Boolean(button.closest('form')) : true;\n\n return (\n <RadioProvider scope={__scopeRadio} checked={checked} disabled={disabled}>\n <Primitive.button\n type=\"button\"\n role=\"radio\"\n aria-checked={checked}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n value={value}\n {...radioProps}\n ref={composedRefs}\n onClick={composeEventHandlers(props.onClick, (event) => {\n // radios cannot be unchecked so we only communicate a checked state\n if (!checked) onCheck?.();\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n // if radio is in a form, stop propagation from the button so that we only propagate\n // one click event (from the input). We propagate changes from an input so that native\n // form validation works and form events reflect radio updates.\n if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n }\n })}\n />\n {isFormControl && (\n <BubbleInput\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n // We transform because the input is absolutely positioned but we have\n // rendered it **after** the button. This pulls it back to sit on top\n // of the button.\n style={{ transform: 'translateX(-100%)' }}\n />\n )}\n </RadioProvider>\n );\n }\n);\n\nRadio.displayName = RADIO_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * RadioIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'RadioIndicator';\n\ntype RadioIndicatorElement = React.ElementRef<typeof Primitive.span>;\ntype PrimitiveSpanProps = React.ComponentPropsWithoutRef<typeof Primitive.span>;\nexport interface RadioIndicatorProps extends PrimitiveSpanProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true;\n}\n\nconst RadioIndicator = React.forwardRef<RadioIndicatorElement, RadioIndicatorProps>(\n (props: ScopedProps<RadioIndicatorProps>, forwardedRef) => {\n const { __scopeRadio, forceMount, ...indicatorProps } = props;\n const context = useRadioContext(INDICATOR_NAME, __scopeRadio);\n return (\n <Presence present={forceMount || context.checked}>\n <Primitive.span\n data-state={getState(context.checked)}\n data-disabled={context.disabled ? '' : undefined}\n {...indicatorProps}\n ref={forwardedRef}\n />\n </Presence>\n );\n }\n);\n\nRadioIndicator.displayName = INDICATOR_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = React.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: boolean;\n control: HTMLElement | null;\n bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n const { control, checked, bubbles = true, ...inputProps } = props;\n const ref = React.useRef<HTMLInputElement>(null);\n const prevChecked = usePrevious(checked);\n const controlSize = useSize(control);\n\n // Bubble checked change to parents (e.g form change event)\n React.useEffect(() => {\n const input = ref.current!;\n const inputProto = window.HTMLInputElement.prototype;\n const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n const setChecked = descriptor.set;\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles });\n setChecked.call(input, checked);\n input.dispatchEvent(event);\n }\n }, [prevChecked, checked, bubbles]);\n\n return (\n <input\n type=\"radio\"\n aria-hidden\n defaultChecked={checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n style={{\n ...props.style,\n ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }}\n />\n );\n};\n\nfunction getState(checked: boolean) {\n return checked ? 'checked' : 'unchecked';\n}\n\nexport {\n createRadioScope,\n //\n Radio,\n RadioIndicator,\n};\nexport type { RadioProps };\n", "import React from \"react\";\nimport { Radio } from \"./Radio\";\nimport {\n ScopedProps,\n useRadioGroupContext,\n useRovingFocusGroupScope,\n} from \"./RadioGroup\";\nimport { useRadioScope } from \"./RadioGroupIndicator\";\nimport { useComposedRefs } from \"@huin-core/react-compose-refs\";\nimport * as RovingFocusGroup from \"@huin-core/react-roving-focus\";\nimport { composeEventHandlers } from \"@huin-core/primitive\";\n\nconst ARROW_KEYS = [\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\"];\n\nconst ITEM_NAME = \"RadioGroupItem\";\n\ntype RadioGroupItemElement = React.ElementRef<typeof Radio>;\ntype RadioProps = React.ComponentPropsWithoutRef<typeof Radio>;\ninterface RadioGroupItemProps extends Omit<RadioProps, \"onCheck\" | \"name\"> {\n value: string;\n}\n\nconst RadioGroupItem = React.forwardRef<\n RadioGroupItemElement,\n RadioGroupItemProps\n>((props: ScopedProps<RadioGroupItemProps>, forwardedRef) => {\n const { __scopeRadioGroup, disabled, ...itemProps } = props;\n const context = useRadioGroupContext(ITEM_NAME, __scopeRadioGroup);\n const isDisabled = context.disabled || disabled;\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);\n const radioScope = useRadioScope(__scopeRadioGroup);\n const ref = React.useRef<React.ElementRef<typeof Radio>>(null);\n const composedRefs = useComposedRefs(forwardedRef, ref);\n const checked = context.value === itemProps.value;\n const isArrowKeyPressedRef = React.useRef(false);\n\n React.useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (ARROW_KEYS.includes(event.key)) {\n isArrowKeyPressedRef.current = true;\n }\n };\n const handleKeyUp = () => (isArrowKeyPressedRef.current = false);\n document.addEventListener(\"keydown\", handleKeyDown);\n document.addEventListener(\"keyup\", handleKeyUp);\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown);\n document.removeEventListener(\"keyup\", handleKeyUp);\n };\n }, []);\n\n return (\n <RovingFocusGroup.Item\n asChild\n {...rovingFocusGroupScope}\n focusable={!isDisabled}\n active={checked}\n >\n <Radio\n disabled={isDisabled}\n required={context.required}\n checked={checked}\n {...radioScope}\n {...itemProps}\n name={context.name}\n ref={composedRefs}\n onCheck={() => context.onValueChange(itemProps.value)}\n onKeyDown={composeEventHandlers((event) => {\n // According to WAI ARIA, radio groups don't activate items on enter keypress\n if (event.key === \"Enter\") event.preventDefault();\n })}\n onFocus={composeEventHandlers(itemProps.onFocus, () => {\n /**\n * Our `RovingFocusGroup` will focus the radio when navigating with arrow keys\n * and we need to \"check\" it in that case. We click it to \"check\" it (instead\n * of updating `context.value`) so that the radio change event fires.\n */\n if (isArrowKeyPressedRef.current) ref.current?.click();\n })}\n />\n </RovingFocusGroup.Item>\n );\n});\n\nRadioGroupItem.displayName = ITEM_NAME;\n\nexport { RadioGroupItem };\nexport type { RadioGroupItemProps };\n", "import React from \"react\";\nimport { ScopedProps } from \"./RadioGroup\";\nimport { createRadioScope, RadioIndicator } from \"./Radio\";\n\nconst INDICATOR_NAME = \"RadioGroupIndicator\";\n\ntype RadioGroupIndicatorElement = React.ElementRef<typeof RadioIndicator>;\ntype RadioIndicatorProps = React.ComponentPropsWithoutRef<\n typeof RadioIndicator\n>;\ninterface RadioGroupIndicatorProps extends RadioIndicatorProps {}\nexport const useRadioScope = createRadioScope();\n\nconst RadioGroupIndicator = React.forwardRef<\n RadioGroupIndicatorElement,\n RadioGroupIndicatorProps\n>((props: ScopedProps<RadioGroupIndicatorProps>, forwardedRef) => {\n const { __scopeRadioGroup, ...indicatorProps } = props;\n const radioScope = useRadioScope(__scopeRadioGroup);\n return (\n <RadioIndicator {...radioScope} {...indicatorProps} ref={forwardedRef} />\n );\n});\n\nRadioGroupIndicator.displayName = INDICATOR_NAME;\n\nexport { RadioGroupIndicator };\nexport type { RadioGroupIndicatorProps };\n"],
5
+ "mappings": "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",
6
+ "names": ["React", "createContextScope", "Primitive", "jsx", "createContextScope", "Primitive", "Root", "React", "React", "jsx", "INDICATOR_NAME", "React", "useComposedRefs", "RovingFocusGroup", "composeEventHandlers", "jsx", "React"]
7
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@huin-core/react-radio-group",
3
- "version": "1.0.2",
3
+ "version": "1.0.4",
4
4
  "license": "MIT",
5
5
  "exports": {
6
6
  ".": {
@@ -20,7 +20,8 @@
20
20
  "types": "./dist/index.d.ts",
21
21
  "files": [
22
22
  "dist",
23
- "README.md"
23
+ "README.md",
24
+ "package.json"
24
25
  ],
25
26
  "sideEffects": false,
26
27
  "scripts": {