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

package/dist/index.d.mts

@@ -2,7 +2,7 @@ export { anatomy } from './radio-group.anatomy.mjs';
 export { connect } from './radio-group.connect.mjs';
 export { machine } from './radio-group.machine.mjs';
 export { itemProps, props, splitItemProps, splitProps } from './radio-group.props.mjs';
-export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.mjs';
+export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RootState, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.mjs';
 import '@zag-js/anatomy';
 import '@zag-js/types';
 import '@zag-js/core';

package/dist/index.d.ts

@@ -2,7 +2,7 @@ export { anatomy } from './radio-group.anatomy.js';
 export { connect } from './radio-group.connect.js';
 export { machine } from './radio-group.machine.js';
 export { itemProps, props, splitItemProps, splitProps } from './radio-group.props.js';
-export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.js';
+export { RadioGroupApi as Api, ElementIds, ItemProps, ItemState, RadioGroupMachine as Machine, RadioGroupProps as Props, RootState, RadioGroupService as Service, ValueChangeDetails } from './radio-group.types.js';
 import '@zag-js/anatomy';
 import '@zag-js/types';
 import '@zag-js/core';

package/dist/radio-group.connect.js

@@ -41,8 +41,17 @@ var dom = __toESM(require("./radio-group.dom.js"));
 function connect(service, normalize) {
   const { context, send, computed, prop, scope } = service;
   const groupDisabled = computed("isDisabled");
-  const groupInvalid = prop("invalid");
-  const readOnly = prop("readOnly");
+  const groupInvalid = !!prop("invalid");
+  const readOnly = !!prop("readOnly");
+  function getRootState() {
+    return {
+      disabled: groupDisabled,
+      invalid: groupInvalid,
+      required: !!prop("required"),
+      readOnly,
+      orientation: prop("orientation")
+    };
+  }
   function getItemState(props) {
     return {
       value: props.value,
@@ -82,19 +91,21 @@ function connect(service, normalize) {
     clearValue() {
       send({ type: "SET_VALUE", value: null, isTrusted: false });
     },
+    getRootState,
     getRootProps() {
+      const rootState = getRootState();
       return normalize.element({
         ...import_radio_group.parts.root.attrs(scope.id),
         role: "radiogroup",
         "aria-labelledby": dom.getLabelId(scope),
-        "aria-required": prop("required") || void 0,
-        "aria-disabled": groupDisabled || void 0,
-        "aria-readonly": readOnly || void 0,
-        "data-orientation": prop("orientation"),
-        "data-disabled": (0, import_dom_query.dataAttr)(groupDisabled),
-        "data-invalid": (0, import_dom_query.dataAttr)(groupInvalid),
-        "data-required": (0, import_dom_query.dataAttr)(prop("required")),
-        "aria-orientation": prop("orientation"),
+        "aria-required": rootState.required || void 0,
+        "aria-disabled": rootState.disabled || void 0,
+        "aria-readonly": rootState.readOnly || void 0,
+        "data-orientation": rootState.orientation,
+        "data-disabled": (0, import_dom_query.dataAttr)(rootState.disabled),
+        "data-invalid": (0, import_dom_query.dataAttr)(rootState.invalid),
+        "data-required": (0, import_dom_query.dataAttr)(rootState.required),
+        "aria-orientation": rootState.orientation,
         dir: prop("dir"),
         style: {
           position: "relative"

package/dist/radio-group.connect.mjs

@@ -7,8 +7,17 @@ import * as dom from "./radio-group.dom.mjs";
 function connect(service, normalize) {
   const { context, send, computed, prop, scope } = service;
   const groupDisabled = computed("isDisabled");
-  const groupInvalid = prop("invalid");
-  const readOnly = prop("readOnly");
+  const groupInvalid = !!prop("invalid");
+  const readOnly = !!prop("readOnly");
+  function getRootState() {
+    return {
+      disabled: groupDisabled,
+      invalid: groupInvalid,
+      required: !!prop("required"),
+      readOnly,
+      orientation: prop("orientation")
+    };
+  }
   function getItemState(props) {
     return {
       value: props.value,
@@ -48,19 +57,21 @@ function connect(service, normalize) {
     clearValue() {
       send({ type: "SET_VALUE", value: null, isTrusted: false });
     },
+    getRootState,
     getRootProps() {
+      const rootState = getRootState();
       return normalize.element({
         ...parts.root.attrs(scope.id),
         role: "radiogroup",
         "aria-labelledby": dom.getLabelId(scope),
-        "aria-required": prop("required") || void 0,
-        "aria-disabled": groupDisabled || void 0,
-        "aria-readonly": readOnly || void 0,
-        "data-orientation": prop("orientation"),
-        "data-disabled": dataAttr(groupDisabled),
-        "data-invalid": dataAttr(groupInvalid),
-        "data-required": dataAttr(prop("required")),
-        "aria-orientation": prop("orientation"),
+        "aria-required": rootState.required || void 0,
+        "aria-disabled": rootState.disabled || void 0,
+        "aria-readonly": rootState.readOnly || void 0,
+        "data-orientation": rootState.orientation,
+        "data-disabled": dataAttr(rootState.disabled),
+        "data-invalid": dataAttr(rootState.invalid),
+        "data-required": dataAttr(rootState.required),
+        "aria-orientation": rootState.orientation,
         dir: prop("dir"),
         style: {
           position: "relative"

package/dist/radio-group.types.d.mts

@@ -1,18 +1,18 @@
 import { Machine, EventObject, Service } from '@zag-js/core';
-import { PropTypes, RequiredBy, DirectionProperty, CommonProperties, Rect } from '@zag-js/types';
+import { PropTypes, DirectionProperty, CommonProperties, Rect } from '@zag-js/types';
 
 interface ValueChangeDetails {
     value: string | null;
 }
-type ElementIds = Partial<{
-    root: string;
-    label: string;
-    indicator: string;
-    item: (value: string) => string;
-    itemLabel: (value: string) => string;
-    itemControl: (value: string) => string;
-    itemHiddenInput: (value: string) => string;
-}>;
+interface ElementIds {
+    root?: string | undefined;
+    label?: string | undefined;
+    indicator?: string | undefined;
+    item?: ((value: string) => string) | undefined;
+    itemLabel?: ((value: string) => string) | undefined;
+    itemControl?: ((value: string) => string) | undefined;
+    itemHiddenInput?: ((value: string) => string) | undefined;
+}
 interface RadioGroupProps extends DirectionProperty, CommonProperties {
     /**
      * The ids of the elements in the radio. Useful for composition.
@@ -118,7 +118,8 @@ interface Refs {
 }
 interface RadioGroupSchema {
     state: "idle";
-    props: RequiredBy<RadioGroupProps, PropsWithDefault>;
+    props: RadioGroupProps;
+    defaultPropKey: PropsWithDefault;
     context: PrivateContext;
     computed: ComputedContext;
     refs: Refs;
@@ -168,6 +169,28 @@ interface ItemState {
      */
     active: boolean;
 }
+interface RootState {
+    /**
+     * Whether the radio group is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether the radio group is invalid
+     */
+    invalid: boolean;
+    /**
+     * Whether the radio group is required
+     */
+    required: boolean;
+    /**
+     * Whether the radio group is read-only
+     */
+    readOnly: boolean;
+    /**
+     * The orientation of the radio group
+     */
+    orientation: "horizontal" | "vertical" | undefined;
+}
 interface RadioGroupApi<T extends PropTypes = PropTypes> {
     /**
      * The current value of the radio group
@@ -189,6 +212,10 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
      * Returns the state details of a radio input
      */
     getItemState: (props: ItemProps) => ItemState;
+    /**
+     * Returns the state of the radio group
+     */
+    getRootState: () => RootState;
     getRootProps: () => T["element"];
     getLabelProps: () => T["element"];
     getItemProps: (props: ItemProps) => T["label"];
@@ -198,4 +225,4 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
     getIndicatorProps: () => T["element"];
 }
 
-export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, ValueChangeDetails };
+export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, RootState, ValueChangeDetails };

package/dist/radio-group.types.d.ts

@@ -1,18 +1,18 @@
 import { Machine, EventObject, Service } from '@zag-js/core';
-import { PropTypes, RequiredBy, DirectionProperty, CommonProperties, Rect } from '@zag-js/types';
+import { PropTypes, DirectionProperty, CommonProperties, Rect } from '@zag-js/types';
 
 interface ValueChangeDetails {
     value: string | null;
 }
-type ElementIds = Partial<{
-    root: string;
-    label: string;
-    indicator: string;
-    item: (value: string) => string;
-    itemLabel: (value: string) => string;
-    itemControl: (value: string) => string;
-    itemHiddenInput: (value: string) => string;
-}>;
+interface ElementIds {
+    root?: string | undefined;
+    label?: string | undefined;
+    indicator?: string | undefined;
+    item?: ((value: string) => string) | undefined;
+    itemLabel?: ((value: string) => string) | undefined;
+    itemControl?: ((value: string) => string) | undefined;
+    itemHiddenInput?: ((value: string) => string) | undefined;
+}
 interface RadioGroupProps extends DirectionProperty, CommonProperties {
     /**
      * The ids of the elements in the radio. Useful for composition.
@@ -118,7 +118,8 @@ interface Refs {
 }
 interface RadioGroupSchema {
     state: "idle";
-    props: RequiredBy<RadioGroupProps, PropsWithDefault>;
+    props: RadioGroupProps;
+    defaultPropKey: PropsWithDefault;
     context: PrivateContext;
     computed: ComputedContext;
     refs: Refs;
@@ -168,6 +169,28 @@ interface ItemState {
      */
     active: boolean;
 }
+interface RootState {
+    /**
+     * Whether the radio group is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether the radio group is invalid
+     */
+    invalid: boolean;
+    /**
+     * Whether the radio group is required
+     */
+    required: boolean;
+    /**
+     * Whether the radio group is read-only
+     */
+    readOnly: boolean;
+    /**
+     * The orientation of the radio group
+     */
+    orientation: "horizontal" | "vertical" | undefined;
+}
 interface RadioGroupApi<T extends PropTypes = PropTypes> {
     /**
      * The current value of the radio group
@@ -189,6 +212,10 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
      * Returns the state details of a radio input
      */
     getItemState: (props: ItemProps) => ItemState;
+    /**
+     * Returns the state of the radio group
+     */
+    getRootState: () => RootState;
     getRootProps: () => T["element"];
     getLabelProps: () => T["element"];
     getItemProps: (props: ItemProps) => T["label"];
@@ -198,4 +225,4 @@ interface RadioGroupApi<T extends PropTypes = PropTypes> {
     getIndicatorProps: () => T["element"];
 }
 
-export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, ValueChangeDetails };
+export type { ElementIds, ItemProps, ItemState, RadioGroupApi, RadioGroupMachine, RadioGroupProps, RadioGroupSchema, RadioGroupService, RootState, ValueChangeDetails };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/radio-group",
-  "version": "2.0.0-next.0",
+  "version": "2.0.0-next.2",
   "description": "Core logic for the radio group widget implemented as a state machine",
   "keywords": [
     "js",
@@ -15,7 +15,10 @@
   "author": "Abraham Aremu <anubra266@gmail.com>",
   "homepage": "https://github.com/chakra-ui/zag#readme",
   "license": "MIT",
-  "repository": "https://github.com/chakra-ui/zag/tree/main/packages/radio-group",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/chakra-ui/zag/tree/main/packages/radio-group"
+  },
   "sideEffects": false,
   "files": [
     "dist"
@@ -27,12 +30,12 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "2.0.0-next.0",
-    "@zag-js/dom-query": "2.0.0-next.0",
-    "@zag-js/focus-visible": "2.0.0-next.0",
-    "@zag-js/utils": "2.0.0-next.0",
-    "@zag-js/core": "2.0.0-next.0",
-    "@zag-js/types": "2.0.0-next.0"
+    "@zag-js/anatomy": "2.0.0-next.2",
+    "@zag-js/dom-query": "2.0.0-next.2",
+    "@zag-js/focus-visible": "2.0.0-next.2",
+    "@zag-js/utils": "2.0.0-next.2",
+    "@zag-js/core": "2.0.0-next.2",
+    "@zag-js/types": "2.0.0-next.2"
   },
   "devDependencies": {
     "clean-package": "2.2.0"
@@ -66,7 +69,7 @@
   },
   "scripts": {
     "build": "tsup",
-    "lint": "eslint src",
+    "lint": "oxlint src",
     "typecheck": "tsc --noEmit"
   }
 }