@tamagui/radio-headless 2.0.0-rc.8 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/dist/cjs/BubbleInput.cjs +45 -40
  2. package/dist/cjs/BubbleInput.native.js +73 -69
  3. package/dist/cjs/BubbleInput.native.js.map +1 -1
  4. package/dist/cjs/index.cjs +7 -5
  5. package/dist/cjs/index.native.js +7 -5
  6. package/dist/cjs/index.native.js.map +1 -1
  7. package/dist/cjs/useRadioGroup.cjs +149 -138
  8. package/dist/cjs/useRadioGroup.native.js +163 -149
  9. package/dist/cjs/useRadioGroup.native.js.map +1 -1
  10. package/dist/cjs/utils.cjs +12 -10
  11. package/dist/cjs/utils.native.js +12 -10
  12. package/dist/cjs/utils.native.js.map +1 -1
  13. package/dist/esm/BubbleInput.mjs +18 -15
  14. package/dist/esm/BubbleInput.mjs.map +1 -1
  15. package/dist/esm/BubbleInput.native.js +18 -16
  16. package/dist/esm/BubbleInput.native.js.map +1 -1
  17. package/dist/esm/index.js +2 -2
  18. package/dist/esm/index.js.map +1 -6
  19. package/dist/esm/useRadioGroup.mjs +128 -118
  20. package/dist/esm/useRadioGroup.mjs.map +1 -1
  21. package/dist/esm/useRadioGroup.native.js +141 -129
  22. package/dist/esm/useRadioGroup.native.js.map +1 -1
  23. package/dist/jsx/BubbleInput.mjs +18 -15
  24. package/dist/jsx/BubbleInput.mjs.map +1 -1
  25. package/dist/jsx/BubbleInput.native.js +73 -69
  26. package/dist/jsx/BubbleInput.native.js.map +1 -1
  27. package/dist/jsx/index.js +2 -2
  28. package/dist/jsx/index.js.map +1 -6
  29. package/dist/jsx/index.native.js +7 -5
  30. package/dist/jsx/useRadioGroup.mjs +128 -118
  31. package/dist/jsx/useRadioGroup.mjs.map +1 -1
  32. package/dist/jsx/useRadioGroup.native.js +163 -149
  33. package/dist/jsx/useRadioGroup.native.js.map +1 -1
  34. package/dist/jsx/utils.native.js +12 -10
  35. package/package.json +16 -20
  36. package/dist/cjs/BubbleInput.js +0 -65
  37. package/dist/cjs/BubbleInput.js.map +0 -6
  38. package/dist/cjs/index.js +0 -16
  39. package/dist/cjs/index.js.map +0 -6
  40. package/dist/cjs/useRadioGroup.js +0 -160
  41. package/dist/cjs/useRadioGroup.js.map +0 -6
  42. package/dist/cjs/utils.js +0 -23
  43. package/dist/cjs/utils.js.map +0 -6
  44. package/dist/esm/BubbleInput.js +0 -43
  45. package/dist/esm/BubbleInput.js.map +0 -6
  46. package/dist/esm/useRadioGroup.js +0 -153
  47. package/dist/esm/useRadioGroup.js.map +0 -6
  48. package/dist/esm/utils.js +0 -7
  49. package/dist/esm/utils.js.map +0 -6
  50. package/dist/jsx/BubbleInput.js +0 -43
  51. package/dist/jsx/BubbleInput.js.map +0 -6
  52. package/dist/jsx/useRadioGroup.js +0 -153
  53. package/dist/jsx/useRadioGroup.js.map +0 -6
  54. package/dist/jsx/utils.js +0 -7
  55. package/dist/jsx/utils.js.map +0 -6
package/dist/cjs/index.js DELETED
@@ -1,16 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __copyProps = (to, from, except, desc) => {
6
- if (from && typeof from == "object" || typeof from == "function")
7
- for (let key of __getOwnPropNames(from))
8
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
9
- return to;
10
- }, __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
11
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
12
- var index_exports = {};
13
- module.exports = __toCommonJS(index_exports);
14
- __reExport(index_exports, require("./useRadioGroup"), module.exports);
15
- __reExport(index_exports, require("./utils"), module.exports);
16
- //# sourceMappingURL=index.js.map
@@ -1,6 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/index.ts"],
4
- "mappings": ";;;;;;;;;;;AAAA;AAAA;AAAA,0BAAc,4BAAd;AACA,0BAAc,oBADd;",
5
- "names": []
6
- }
@@ -1,160 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var useRadioGroup_exports = {};
16
- __export(useRadioGroup_exports, {
17
- useRadioGroup: () => useRadioGroup,
18
- useRadioGroupItem: () => useRadioGroupItem,
19
- useRadioGroupItemIndicator: () => useRadioGroupItemIndicator
20
- });
21
- module.exports = __toCommonJS(useRadioGroup_exports);
22
- var import_compose_refs = require("@tamagui/compose-refs"), import_constants = require("@tamagui/constants"), import_focusable = require("@tamagui/focusable"), import_helpers = require("@tamagui/helpers"), import_label = require("@tamagui/label"), import_use_controllable_state = require("@tamagui/use-controllable-state"), import_react = require("react"), import_BubbleInput = require("./BubbleInput"), import_utils = require("./utils"), import_jsx_runtime = require("react/jsx-runtime");
23
- function useRadioGroup(params) {
24
- const {
25
- value: valueProp,
26
- onValueChange,
27
- defaultValue,
28
- required,
29
- disabled,
30
- name,
31
- native,
32
- accentColor,
33
- orientation,
34
- ref
35
- } = params, [value, setValue] = (0, import_use_controllable_state.useControllableState)({
36
- prop: valueProp,
37
- defaultProp: defaultValue,
38
- onChange: onValueChange
39
- });
40
- return {
41
- providerValue: {
42
- value,
43
- onChange: setValue,
44
- required,
45
- disabled,
46
- name,
47
- native,
48
- accentColor
49
- },
50
- frameAttrs: {
51
- role: "radiogroup",
52
- "aria-orientation": orientation,
53
- "data-disabled": disabled ? "" : void 0
54
- },
55
- rovingFocusGroupAttrs: {
56
- orientation,
57
- loop: !0
58
- }
59
- };
60
- }
61
- const ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], useRadioGroupItem = (params) => {
62
- const {
63
- radioGroupContext,
64
- value,
65
- labelledBy: ariaLabelledby,
66
- disabled: itemDisabled,
67
- ref: refProp,
68
- id,
69
- onPress,
70
- onKeyDown,
71
- onFocus
72
- } = params, {
73
- value: groupValue,
74
- disabled,
75
- required,
76
- onChange,
77
- name,
78
- native,
79
- accentColor
80
- } = (0, import_react.useContext)(radioGroupContext), [button, setButton] = (0, import_react.useState)(null), hasConsumerStoppedPropagationRef = (0, import_react.useRef)(!1), ref = (0, import_react.useRef)(null), composedRefs = (0, import_compose_refs.useComposedRefs)(refProp, (node) => setButton(node), ref), isArrowKeyPressedRef = (0, import_react.useRef)(!1), isFormControl = import_constants.isWeb ? button ? !!button.closest("form") : !0 : !1, checked = groupValue === value, labelId = (0, import_label.useLabelContext)(button), labelledBy = ariaLabelledby || labelId;
81
- (0, import_react.useEffect)(() => {
82
- if (import_constants.isWeb) {
83
- const handleKeyDown = (event) => {
84
- ARROW_KEYS.includes(event.key) && (isArrowKeyPressedRef.current = !0);
85
- }, handleKeyUp = () => {
86
- isArrowKeyPressedRef.current = !1;
87
- };
88
- return document.addEventListener("keydown", handleKeyDown), document.addEventListener("keyup", handleKeyUp), () => {
89
- document.removeEventListener("keydown", handleKeyDown), document.removeEventListener("keyup", handleKeyUp);
90
- };
91
- }
92
- }, []);
93
- const isDisabled = disabled || itemDisabled;
94
- return {
95
- providerValue: {
96
- checked
97
- },
98
- checked,
99
- isFormControl,
100
- bubbleInput: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
101
- import_BubbleInput.BubbleInput,
102
- {
103
- isHidden: !native,
104
- control: button,
105
- bubbles: !hasConsumerStoppedPropagationRef.current,
106
- name,
107
- value,
108
- checked,
109
- required,
110
- disabled: isDisabled,
111
- ...import_constants.isWeb && native && {
112
- accentColor,
113
- id
114
- }
115
- }
116
- ),
117
- native,
118
- frameAttrs: {
119
- "data-state": (0, import_utils.getState)(checked),
120
- "data-disabled": isDisabled ? "" : void 0,
121
- role: "radio",
122
- "aria-labelledby": labelledBy,
123
- "aria-checked": checked,
124
- "aria-required": required,
125
- disabled: isDisabled,
126
- ref: composedRefs,
127
- ...import_constants.isWeb && {
128
- type: "button",
129
- value
130
- },
131
- id,
132
- onPress: (0, import_helpers.composeEventHandlers)(onPress, (event) => {
133
- checked || onChange?.(value), isFormControl && (hasConsumerStoppedPropagationRef.current = event.isPropagationStopped(), hasConsumerStoppedPropagationRef.current || event.stopPropagation());
134
- }),
135
- ...import_constants.isWeb && {
136
- onKeyDown: (0, import_helpers.composeEventHandlers)(onKeyDown, (event) => {
137
- (event.key === "Enter" || event.key === " ") && (checked || onChange?.(value));
138
- }),
139
- onFocus: (0, import_helpers.composeEventHandlers)(onFocus, () => {
140
- isArrowKeyPressedRef.current && ref.current?.click();
141
- })
142
- }
143
- },
144
- rovingFocusGroupAttrs: {
145
- asChild: "except-style",
146
- focusable: !isDisabled,
147
- active: checked
148
- }
149
- };
150
- };
151
- function useRadioGroupItemIndicator(params) {
152
- const { radioGroupItemContext, disabled, ...rest } = params, { checked } = (0, import_react.useContext)(radioGroupItemContext);
153
- return {
154
- checked,
155
- "data-state": (0, import_utils.getState)(checked),
156
- "data-disabled": disabled ? "" : void 0,
157
- ...rest
158
- };
159
- }
160
- //# sourceMappingURL=useRadioGroup.js.map
@@ -1,6 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/useRadioGroup.tsx"],
4
- "mappings": "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",
5
- "names": []
6
- }
package/dist/cjs/utils.js DELETED
@@ -1,23 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var utils_exports = {};
16
- __export(utils_exports, {
17
- getState: () => getState
18
- });
19
- module.exports = __toCommonJS(utils_exports);
20
- function getState(checked) {
21
- return checked ? "checked" : "unchecked";
22
- }
23
- //# sourceMappingURL=utils.js.map
@@ -1,6 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/utils.tsx"],
4
- "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,SAAS,SAAS,SAAkB;AACzC,SAAO,UAAU,YAAY;AAC/B;",
5
- "names": []
6
- }
@@ -1,43 +0,0 @@
1
- import React from "react";
2
- import { usePrevious } from "@tamagui/use-previous";
3
- import { jsx } from "react/jsx-runtime";
4
- const BubbleInput = (props) => {
5
- const { checked, bubbles = !0, control, isHidden, accentColor, ...inputProps } = props, ref = React.useRef(null), prevChecked = usePrevious(checked);
6
- return React.useEffect(() => {
7
- const input = ref.current, inputProto = window.HTMLInputElement.prototype, setChecked = Object.getOwnPropertyDescriptor(
8
- inputProto,
9
- "checked"
10
- ).set;
11
- if (prevChecked !== checked && setChecked) {
12
- const event = new Event("click", { bubbles });
13
- setChecked.call(input, checked), input.dispatchEvent(event);
14
- }
15
- }, [prevChecked, checked, bubbles]), /* @__PURE__ */ jsx(
16
- "input",
17
- {
18
- type: "radio",
19
- defaultChecked: checked,
20
- ...inputProps,
21
- tabIndex: -1,
22
- ref,
23
- "aria-hidden": isHidden,
24
- style: {
25
- ...isHidden ? {
26
- // ...controlSize,
27
- position: "absolute",
28
- pointerEvents: "none",
29
- opacity: 0,
30
- margin: 0
31
- } : {
32
- appearance: "auto",
33
- accentColor
34
- },
35
- ...props.style
36
- }
37
- }
38
- );
39
- };
40
- export {
41
- BubbleInput
42
- };
43
- //# sourceMappingURL=BubbleInput.js.map
@@ -1,6 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/BubbleInput.tsx"],
4
- "mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,mBAAmB;AAgCxB;AAtBG,MAAM,cAAc,CAAC,UAA4B;AACtD,QAAM,EAAE,SAAS,UAAU,IAAM,SAAS,UAAU,aAAa,GAAG,WAAW,IAAI,OAC7E,MAAM,MAAM,OAAyB,IAAI,GACzC,cAAc,YAAY,OAAO;AAGvC,eAAM,UAAU,MAAM;AACpB,UAAM,QAAQ,IAAI,SACZ,aAAa,OAAO,iBAAiB,WAKrC,aAJa,OAAO;AAAA,MACxB;AAAA,MACA;AAAA,IACF,EAC8B;AAC9B,QAAI,gBAAgB,WAAW,YAAY;AACzC,YAAM,QAAQ,IAAI,MAAM,SAAS,EAAE,QAAQ,CAAC;AAC5C,iBAAW,KAAK,OAAO,OAAO,GAC9B,MAAM,cAAc,KAAK;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,aAAa,SAAS,OAAO,CAAC,GAGhC;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,gBAAgB;AAAA,MACf,GAAG;AAAA,MACJ,UAAU;AAAA,MACV;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,GAAI,WACA;AAAA;AAAA,UAEE,UAAU;AAAA,UACV,eAAe;AAAA,UACf,SAAS;AAAA,UACT,QAAQ;AAAA,QACV,IACA;AAAA,UACE,YAAY;AAAA,UACZ;AAAA,QACF;AAAA,QAEJ,GAAG,MAAM;AAAA,MACX;AAAA;AAAA,EACF;AAEJ;",
5
- "names": []
6
- }
@@ -1,153 +0,0 @@
1
- import { useComposedRefs } from "@tamagui/compose-refs";
2
- import { isWeb } from "@tamagui/constants";
3
-
4
- import { composeEventHandlers } from "@tamagui/helpers";
5
- import { useLabelContext } from "@tamagui/label";
6
- import { useControllableState } from "@tamagui/use-controllable-state";
7
- import { useContext, useEffect, useRef, useState } from "react";
8
- import { BubbleInput } from "./BubbleInput";
9
- import { getState } from "./utils";
10
- import { jsx } from "react/jsx-runtime";
11
- function useRadioGroup(params) {
12
- const {
13
- value: valueProp,
14
- onValueChange,
15
- defaultValue,
16
- required,
17
- disabled,
18
- name,
19
- native,
20
- accentColor,
21
- orientation,
22
- ref
23
- } = params, [value, setValue] = useControllableState({
24
- prop: valueProp,
25
- defaultProp: defaultValue,
26
- onChange: onValueChange
27
- });
28
- return {
29
- providerValue: {
30
- value,
31
- onChange: setValue,
32
- required,
33
- disabled,
34
- name,
35
- native,
36
- accentColor
37
- },
38
- frameAttrs: {
39
- role: "radiogroup",
40
- "aria-orientation": orientation,
41
- "data-disabled": disabled ? "" : void 0
42
- },
43
- rovingFocusGroupAttrs: {
44
- orientation,
45
- loop: !0
46
- }
47
- };
48
- }
49
- const ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], useRadioGroupItem = (params) => {
50
- const {
51
- radioGroupContext,
52
- value,
53
- labelledBy: ariaLabelledby,
54
- disabled: itemDisabled,
55
- ref: refProp,
56
- id,
57
- onPress,
58
- onKeyDown,
59
- onFocus
60
- } = params, {
61
- value: groupValue,
62
- disabled,
63
- required,
64
- onChange,
65
- name,
66
- native,
67
- accentColor
68
- } = useContext(radioGroupContext), [button, setButton] = useState(null), hasConsumerStoppedPropagationRef = useRef(!1), ref = useRef(null), composedRefs = useComposedRefs(refProp, (node) => setButton(node), ref), isArrowKeyPressedRef = useRef(!1), isFormControl = isWeb ? button ? !!button.closest("form") : !0 : !1, checked = groupValue === value, labelId = useLabelContext(button), labelledBy = ariaLabelledby || labelId;
69
- useEffect(() => {
70
- if (isWeb) {
71
- const handleKeyDown = (event) => {
72
- ARROW_KEYS.includes(event.key) && (isArrowKeyPressedRef.current = !0);
73
- }, handleKeyUp = () => {
74
- isArrowKeyPressedRef.current = !1;
75
- };
76
- return document.addEventListener("keydown", handleKeyDown), document.addEventListener("keyup", handleKeyUp), () => {
77
- document.removeEventListener("keydown", handleKeyDown), document.removeEventListener("keyup", handleKeyUp);
78
- };
79
- }
80
- }, []);
81
- const isDisabled = disabled || itemDisabled;
82
- return {
83
- providerValue: {
84
- checked
85
- },
86
- checked,
87
- isFormControl,
88
- bubbleInput: /* @__PURE__ */ jsx(
89
- BubbleInput,
90
- {
91
- isHidden: !native,
92
- control: button,
93
- bubbles: !hasConsumerStoppedPropagationRef.current,
94
- name,
95
- value,
96
- checked,
97
- required,
98
- disabled: isDisabled,
99
- ...isWeb && native && {
100
- accentColor,
101
- id
102
- }
103
- }
104
- ),
105
- native,
106
- frameAttrs: {
107
- "data-state": getState(checked),
108
- "data-disabled": isDisabled ? "" : void 0,
109
- role: "radio",
110
- "aria-labelledby": labelledBy,
111
- "aria-checked": checked,
112
- "aria-required": required,
113
- disabled: isDisabled,
114
- ref: composedRefs,
115
- ...isWeb && {
116
- type: "button",
117
- value
118
- },
119
- id,
120
- onPress: composeEventHandlers(onPress, (event) => {
121
- checked || onChange?.(value), isFormControl && (hasConsumerStoppedPropagationRef.current = event.isPropagationStopped(), hasConsumerStoppedPropagationRef.current || event.stopPropagation());
122
- }),
123
- ...isWeb && {
124
- onKeyDown: composeEventHandlers(onKeyDown, (event) => {
125
- (event.key === "Enter" || event.key === " ") && (checked || onChange?.(value));
126
- }),
127
- onFocus: composeEventHandlers(onFocus, () => {
128
- isArrowKeyPressedRef.current && ref.current?.click();
129
- })
130
- }
131
- },
132
- rovingFocusGroupAttrs: {
133
- asChild: "except-style",
134
- focusable: !isDisabled,
135
- active: checked
136
- }
137
- };
138
- };
139
- function useRadioGroupItemIndicator(params) {
140
- const { radioGroupItemContext, disabled, ...rest } = params, { checked } = useContext(radioGroupItemContext);
141
- return {
142
- checked,
143
- "data-state": getState(checked),
144
- "data-disabled": disabled ? "" : void 0,
145
- ...rest
146
- };
147
- }
148
- export {
149
- useRadioGroup,
150
- useRadioGroupItem,
151
- useRadioGroupItemIndicator
152
- };
153
- //# sourceMappingURL=useRadioGroup.js.map
@@ -1,6 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/useRadioGroup.tsx"],
4
- "mappings": "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",
5
- "names": []
6
- }
package/dist/esm/utils.js DELETED
@@ -1,7 +0,0 @@
1
- function getState(checked) {
2
- return checked ? "checked" : "unchecked";
3
- }
4
- export {
5
- getState
6
- };
7
- //# sourceMappingURL=utils.js.map
@@ -1,6 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/utils.tsx"],
4
- "mappings": "AAAO,SAAS,SAAS,SAAkB;AACzC,SAAO,UAAU,YAAY;AAC/B;",
5
- "names": []
6
- }
@@ -1,43 +0,0 @@
1
- import React from "react";
2
- import { usePrevious } from "@tamagui/use-previous";
3
- import { jsx } from "react/jsx-runtime";
4
- const BubbleInput = (props) => {
5
- const { checked, bubbles = !0, control, isHidden, accentColor, ...inputProps } = props, ref = React.useRef(null), prevChecked = usePrevious(checked);
6
- return React.useEffect(() => {
7
- const input = ref.current, inputProto = window.HTMLInputElement.prototype, setChecked = Object.getOwnPropertyDescriptor(
8
- inputProto,
9
- "checked"
10
- ).set;
11
- if (prevChecked !== checked && setChecked) {
12
- const event = new Event("click", { bubbles });
13
- setChecked.call(input, checked), input.dispatchEvent(event);
14
- }
15
- }, [prevChecked, checked, bubbles]), /* @__PURE__ */ jsx(
16
- "input",
17
- {
18
- type: "radio",
19
- defaultChecked: checked,
20
- ...inputProps,
21
- tabIndex: -1,
22
- ref,
23
- "aria-hidden": isHidden,
24
- style: {
25
- ...isHidden ? {
26
- // ...controlSize,
27
- position: "absolute",
28
- pointerEvents: "none",
29
- opacity: 0,
30
- margin: 0
31
- } : {
32
- appearance: "auto",
33
- accentColor
34
- },
35
- ...props.style
36
- }
37
- }
38
- );
39
- };
40
- export {
41
- BubbleInput
42
- };
43
- //# sourceMappingURL=BubbleInput.js.map
@@ -1,6 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/BubbleInput.tsx"],
4
- "mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,mBAAmB;AAgCxB;AAtBG,MAAM,cAAc,CAAC,UAA4B;AACtD,QAAM,EAAE,SAAS,UAAU,IAAM,SAAS,UAAU,aAAa,GAAG,WAAW,IAAI,OAC7E,MAAM,MAAM,OAAyB,IAAI,GACzC,cAAc,YAAY,OAAO;AAGvC,eAAM,UAAU,MAAM;AACpB,UAAM,QAAQ,IAAI,SACZ,aAAa,OAAO,iBAAiB,WAKrC,aAJa,OAAO;AAAA,MACxB;AAAA,MACA;AAAA,IACF,EAC8B;AAC9B,QAAI,gBAAgB,WAAW,YAAY;AACzC,YAAM,QAAQ,IAAI,MAAM,SAAS,EAAE,QAAQ,CAAC;AAC5C,iBAAW,KAAK,OAAO,OAAO,GAC9B,MAAM,cAAc,KAAK;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,aAAa,SAAS,OAAO,CAAC,GAGhC;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,gBAAgB;AAAA,MACf,GAAG;AAAA,MACJ,UAAU;AAAA,MACV;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,GAAI,WACA;AAAA;AAAA,UAEE,UAAU;AAAA,UACV,eAAe;AAAA,UACf,SAAS;AAAA,UACT,QAAQ;AAAA,QACV,IACA;AAAA,UACE,YAAY;AAAA,UACZ;AAAA,QACF;AAAA,QAEJ,GAAG,MAAM;AAAA,MACX;AAAA;AAAA,EACF;AAEJ;",
5
- "names": []
6
- }
@@ -1,153 +0,0 @@
1
- import { useComposedRefs } from "@tamagui/compose-refs";
2
- import { isWeb } from "@tamagui/constants";
3
-
4
- import { composeEventHandlers } from "@tamagui/helpers";
5
- import { useLabelContext } from "@tamagui/label";
6
- import { useControllableState } from "@tamagui/use-controllable-state";
7
- import { useContext, useEffect, useRef, useState } from "react";
8
- import { BubbleInput } from "./BubbleInput";
9
- import { getState } from "./utils";
10
- import { jsx } from "react/jsx-runtime";
11
- function useRadioGroup(params) {
12
- const {
13
- value: valueProp,
14
- onValueChange,
15
- defaultValue,
16
- required,
17
- disabled,
18
- name,
19
- native,
20
- accentColor,
21
- orientation,
22
- ref
23
- } = params, [value, setValue] = useControllableState({
24
- prop: valueProp,
25
- defaultProp: defaultValue,
26
- onChange: onValueChange
27
- });
28
- return {
29
- providerValue: {
30
- value,
31
- onChange: setValue,
32
- required,
33
- disabled,
34
- name,
35
- native,
36
- accentColor
37
- },
38
- frameAttrs: {
39
- role: "radiogroup",
40
- "aria-orientation": orientation,
41
- "data-disabled": disabled ? "" : void 0
42
- },
43
- rovingFocusGroupAttrs: {
44
- orientation,
45
- loop: !0
46
- }
47
- };
48
- }
49
- const ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], useRadioGroupItem = (params) => {
50
- const {
51
- radioGroupContext,
52
- value,
53
- labelledBy: ariaLabelledby,
54
- disabled: itemDisabled,
55
- ref: refProp,
56
- id,
57
- onPress,
58
- onKeyDown,
59
- onFocus
60
- } = params, {
61
- value: groupValue,
62
- disabled,
63
- required,
64
- onChange,
65
- name,
66
- native,
67
- accentColor
68
- } = useContext(radioGroupContext), [button, setButton] = useState(null), hasConsumerStoppedPropagationRef = useRef(!1), ref = useRef(null), composedRefs = useComposedRefs(refProp, (node) => setButton(node), ref), isArrowKeyPressedRef = useRef(!1), isFormControl = isWeb ? button ? !!button.closest("form") : !0 : !1, checked = groupValue === value, labelId = useLabelContext(button), labelledBy = ariaLabelledby || labelId;
69
- useEffect(() => {
70
- if (isWeb) {
71
- const handleKeyDown = (event) => {
72
- ARROW_KEYS.includes(event.key) && (isArrowKeyPressedRef.current = !0);
73
- }, handleKeyUp = () => {
74
- isArrowKeyPressedRef.current = !1;
75
- };
76
- return document.addEventListener("keydown", handleKeyDown), document.addEventListener("keyup", handleKeyUp), () => {
77
- document.removeEventListener("keydown", handleKeyDown), document.removeEventListener("keyup", handleKeyUp);
78
- };
79
- }
80
- }, []);
81
- const isDisabled = disabled || itemDisabled;
82
- return {
83
- providerValue: {
84
- checked
85
- },
86
- checked,
87
- isFormControl,
88
- bubbleInput: /* @__PURE__ */ jsx(
89
- BubbleInput,
90
- {
91
- isHidden: !native,
92
- control: button,
93
- bubbles: !hasConsumerStoppedPropagationRef.current,
94
- name,
95
- value,
96
- checked,
97
- required,
98
- disabled: isDisabled,
99
- ...isWeb && native && {
100
- accentColor,
101
- id
102
- }
103
- }
104
- ),
105
- native,
106
- frameAttrs: {
107
- "data-state": getState(checked),
108
- "data-disabled": isDisabled ? "" : void 0,
109
- role: "radio",
110
- "aria-labelledby": labelledBy,
111
- "aria-checked": checked,
112
- "aria-required": required,
113
- disabled: isDisabled,
114
- ref: composedRefs,
115
- ...isWeb && {
116
- type: "button",
117
- value
118
- },
119
- id,
120
- onPress: composeEventHandlers(onPress, (event) => {
121
- checked || onChange?.(value), isFormControl && (hasConsumerStoppedPropagationRef.current = event.isPropagationStopped(), hasConsumerStoppedPropagationRef.current || event.stopPropagation());
122
- }),
123
- ...isWeb && {
124
- onKeyDown: composeEventHandlers(onKeyDown, (event) => {
125
- (event.key === "Enter" || event.key === " ") && (checked || onChange?.(value));
126
- }),
127
- onFocus: composeEventHandlers(onFocus, () => {
128
- isArrowKeyPressedRef.current && ref.current?.click();
129
- })
130
- }
131
- },
132
- rovingFocusGroupAttrs: {
133
- asChild: "except-style",
134
- focusable: !isDisabled,
135
- active: checked
136
- }
137
- };
138
- };
139
- function useRadioGroupItemIndicator(params) {
140
- const { radioGroupItemContext, disabled, ...rest } = params, { checked } = useContext(radioGroupItemContext);
141
- return {
142
- checked,
143
- "data-state": getState(checked),
144
- "data-disabled": disabled ? "" : void 0,
145
- ...rest
146
- };
147
- }
148
- export {
149
- useRadioGroup,
150
- useRadioGroupItem,
151
- useRadioGroupItemIndicator
152
- };
153
- //# sourceMappingURL=useRadioGroup.js.map