@zag-js/radio-group 2.0.0-next.0 → 2.0.0-next.1

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.
package/dist/index.d.mts CHANGED
@@ -2,7 +2,7 @@ export { anatomy } from './radio-group.anatomy.mjs';
2
2
  export { connect } from './radio-group.connect.mjs';
3
3
  export { machine } from './radio-group.machine.mjs';
4
4
  export { itemProps, props, splitItemProps, splitProps } from './radio-group.props.mjs';
5
- export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.mjs';
5
+ export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RootState, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.mjs';
6
6
  import '@zag-js/anatomy';
7
7
  import '@zag-js/types';
8
8
  import '@zag-js/core';
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ export { anatomy } from './radio-group.anatomy.js';
2
2
  export { connect } from './radio-group.connect.js';
3
3
  export { machine } from './radio-group.machine.js';
4
4
  export { itemProps, props, splitItemProps, splitProps } from './radio-group.props.js';
5
- export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.js';
5
+ export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RootState, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.js';
6
6
  import '@zag-js/anatomy';
7
7
  import '@zag-js/types';
8
8
  import '@zag-js/core';
@@ -41,8 +41,17 @@ var dom = __toESM(require("./radio-group.dom.js"));
41
41
  function connect(service, normalize) {
42
42
  const { context, send, computed, prop, scope } = service;
43
43
  const groupDisabled = computed("isDisabled");
44
- const groupInvalid = prop("invalid");
45
- const readOnly = prop("readOnly");
44
+ const groupInvalid = !!prop("invalid");
45
+ const readOnly = !!prop("readOnly");
46
+ function getRootState() {
47
+ return {
48
+ disabled: groupDisabled,
49
+ invalid: groupInvalid,
50
+ required: !!prop("required"),
51
+ readOnly,
52
+ orientation: prop("orientation")
53
+ };
54
+ }
46
55
  function getItemState(props) {
47
56
  return {
48
57
  value: props.value,
@@ -82,19 +91,21 @@ function connect(service, normalize) {
82
91
  clearValue() {
83
92
  send({ type: "SET_VALUE", value: null, isTrusted: false });
84
93
  },
94
+ getRootState,
85
95
  getRootProps() {
96
+ const rootState = getRootState();
86
97
  return normalize.element({
87
98
  ...import_radio_group.parts.root.attrs(scope.id),
88
99
  role: "radiogroup",
89
100
  "aria-labelledby": dom.getLabelId(scope),
90
- "aria-required": prop("required") || void 0,
91
- "aria-disabled": groupDisabled || void 0,
92
- "aria-readonly": readOnly || void 0,
93
- "data-orientation": prop("orientation"),
94
- "data-disabled": (0, import_dom_query.dataAttr)(groupDisabled),
95
- "data-invalid": (0, import_dom_query.dataAttr)(groupInvalid),
96
- "data-required": (0, import_dom_query.dataAttr)(prop("required")),
97
- "aria-orientation": prop("orientation"),
101
+ "aria-required": rootState.required || void 0,
102
+ "aria-disabled": rootState.disabled || void 0,
103
+ "aria-readonly": rootState.readOnly || void 0,
104
+ "data-orientation": rootState.orientation,
105
+ "data-disabled": (0, import_dom_query.dataAttr)(rootState.disabled),
106
+ "data-invalid": (0, import_dom_query.dataAttr)(rootState.invalid),
107
+ "data-required": (0, import_dom_query.dataAttr)(rootState.required),
108
+ "aria-orientation": rootState.orientation,
98
109
  dir: prop("dir"),
99
110
  style: {
100
111
  position: "relative"
@@ -7,8 +7,17 @@ import * as dom from "./radio-group.dom.mjs";
7
7
  function connect(service, normalize) {
8
8
  const { context, send, computed, prop, scope } = service;
9
9
  const groupDisabled = computed("isDisabled");
10
- const groupInvalid = prop("invalid");
11
- const readOnly = prop("readOnly");
10
+ const groupInvalid = !!prop("invalid");
11
+ const readOnly = !!prop("readOnly");
12
+ function getRootState() {
13
+ return {
14
+ disabled: groupDisabled,
15
+ invalid: groupInvalid,
16
+ required: !!prop("required"),
17
+ readOnly,
18
+ orientation: prop("orientation")
19
+ };
20
+ }
12
21
  function getItemState(props) {
13
22
  return {
14
23
  value: props.value,
@@ -48,19 +57,21 @@ function connect(service, normalize) {
48
57
  clearValue() {
49
58
  send({ type: "SET_VALUE", value: null, isTrusted: false });
50
59
  },
60
+ getRootState,
51
61
  getRootProps() {
62
+ const rootState = getRootState();
52
63
  return normalize.element({
53
64
  ...parts.root.attrs(scope.id),
54
65
  role: "radiogroup",
55
66
  "aria-labelledby": dom.getLabelId(scope),
56
- "aria-required": prop("required") || void 0,
57
- "aria-disabled": groupDisabled || void 0,
58
- "aria-readonly": readOnly || void 0,
59
- "data-orientation": prop("orientation"),
60
- "data-disabled": dataAttr(groupDisabled),
61
- "data-invalid": dataAttr(groupInvalid),
62
- "data-required": dataAttr(prop("required")),
63
- "aria-orientation": prop("orientation"),
67
+ "aria-required": rootState.required || void 0,
68
+ "aria-disabled": rootState.disabled || void 0,
69
+ "aria-readonly": rootState.readOnly || void 0,
70
+ "data-orientation": rootState.orientation,
71
+ "data-disabled": dataAttr(rootState.disabled),
72
+ "data-invalid": dataAttr(rootState.invalid),
73
+ "data-required": dataAttr(rootState.required),
74
+ "aria-orientation": rootState.orientation,
64
75
  dir: prop("dir"),
65
76
  style: {
66
77
  position: "relative"
@@ -168,6 +168,28 @@ interface ItemState {
168
168
  */
169
169
  active: boolean;
170
170
  }
171
+ interface RootState {
172
+ /**
173
+ * Whether the radio group is disabled
174
+ */
175
+ disabled: boolean;
176
+ /**
177
+ * Whether the radio group is invalid
178
+ */
179
+ invalid: boolean;
180
+ /**
181
+ * Whether the radio group is required
182
+ */
183
+ required: boolean;
184
+ /**
185
+ * Whether the radio group is read-only
186
+ */
187
+ readOnly: boolean;
188
+ /**
189
+ * The orientation of the radio group
190
+ */
191
+ orientation: "horizontal" | "vertical" | undefined;
192
+ }
171
193
  interface RadioGroupApi<T extends PropTypes = PropTypes> {
172
194
  /**
173
195
  * The current value of the radio group
@@ -189,6 +211,10 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
189
211
  * Returns the state details of a radio input
190
212
  */
191
213
  getItemState: (props: ItemProps) => ItemState;
214
+ /**
215
+ * Returns the state of the radio group
216
+ */
217
+ getRootState: () => RootState;
192
218
  getRootProps: () => T["element"];
193
219
  getLabelProps: () => T["element"];
194
220
  getItemProps: (props: ItemProps) => T["label"];
@@ -198,4 +224,4 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
198
224
  getIndicatorProps: () => T["element"];
199
225
  }
200
226
 
201
- export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, ValueChangeDetails };
227
+ export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, RootState, ValueChangeDetails };
@@ -168,6 +168,28 @@ interface ItemState {
168
168
  */
169
169
  active: boolean;
170
170
  }
171
+ interface RootState {
172
+ /**
173
+ * Whether the radio group is disabled
174
+ */
175
+ disabled: boolean;
176
+ /**
177
+ * Whether the radio group is invalid
178
+ */
179
+ invalid: boolean;
180
+ /**
181
+ * Whether the radio group is required
182
+ */
183
+ required: boolean;
184
+ /**
185
+ * Whether the radio group is read-only
186
+ */
187
+ readOnly: boolean;
188
+ /**
189
+ * The orientation of the radio group
190
+ */
191
+ orientation: "horizontal" | "vertical" | undefined;
192
+ }
171
193
  interface RadioGroupApi<T extends PropTypes = PropTypes> {
172
194
  /**
173
195
  * The current value of the radio group
@@ -189,6 +211,10 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
189
211
  * Returns the state details of a radio input
190
212
  */
191
213
  getItemState: (props: ItemProps) => ItemState;
214
+ /**
215
+ * Returns the state of the radio group
216
+ */
217
+ getRootState: () => RootState;
192
218
  getRootProps: () => T["element"];
193
219
  getLabelProps: () => T["element"];
194
220
  getItemProps: (props: ItemProps) => T["label"];
@@ -198,4 +224,4 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
198
224
  getIndicatorProps: () => T["element"];
199
225
  }
200
226
 
201
- export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, ValueChangeDetails };
227
+ export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, RootState, ValueChangeDetails };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/radio-group",
3
- "version": "2.0.0-next.0",
3
+ "version": "2.0.0-next.1",
4
4
  "description": "Core logic for the radio group widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -15,7 +15,10 @@
15
15
  "author": "Abraham Aremu <anubra266@gmail.com>",
16
16
  "homepage": "https://github.com/chakra-ui/zag#readme",
17
17
  "license": "MIT",
18
- "repository": "https://github.com/chakra-ui/zag/tree/main/packages/radio-group",
18
+ "repository": {
19
+ "type": "git",
20
+ "url": "https://github.com/chakra-ui/zag/tree/main/packages/radio-group"
21
+ },
19
22
  "sideEffects": false,
20
23
  "files": [
21
24
  "dist"
@@ -27,12 +30,12 @@
27
30
  "url": "https://github.com/chakra-ui/zag/issues"
28
31
  },
29
32
  "dependencies": {
30
- "@zag-js/anatomy": "2.0.0-next.0",
31
- "@zag-js/dom-query": "2.0.0-next.0",
32
- "@zag-js/focus-visible": "2.0.0-next.0",
33
- "@zag-js/utils": "2.0.0-next.0",
34
- "@zag-js/core": "2.0.0-next.0",
35
- "@zag-js/types": "2.0.0-next.0"
33
+ "@zag-js/anatomy": "2.0.0-next.1",
34
+ "@zag-js/dom-query": "2.0.0-next.1",
35
+ "@zag-js/focus-visible": "2.0.0-next.1",
36
+ "@zag-js/utils": "2.0.0-next.1",
37
+ "@zag-js/core": "2.0.0-next.1",
38
+ "@zag-js/types": "2.0.0-next.1"
36
39
  },
37
40
  "devDependencies": {
38
41
  "clean-package": "2.2.0"