@cerberus-design/react 0.5.2-next-f874d5b → 0.5.2-next-b1fa39d

package/build/legacy/_tsup-dts-rollup.d.ts

@@ -13,9 +13,11 @@ import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { label } from '@cerberus/styled-system/recipes';
 import { MutableRefObject } from 'react';
 import { PropsWithChildren } from 'react';
+import { radio } from '@cerberus-design/styled-system/recipes';
 import { ReactNode } from 'react';
 import { RecipeVariantProps } from '@cerberus/styled-system/css';
-import type { RecipeVariantProps as RecipeVariantProps_2 } from '@cerberus/styled-system/types';
+import type { RecipeVariantProps as RecipeVariantProps_2 } from '@cerberus-design/styled-system/types';
+import type { RecipeVariantProps as RecipeVariantProps_3 } from '@cerberus/styled-system/types';
 import { RefObject } from 'react';
 import { tag } from '@cerberus/styled-system/recipes';
 import type { TextareaHTMLAttributes } from 'react';
@@ -315,6 +317,24 @@ declare type Positions = 'top' | 'right' | 'bottom' | 'left';
 export { Positions }
 export { Positions as Positions_alias_1 }
 
+declare function Radio(props: PropsWithChildren<RadioProps>): JSX_2.Element;
+export { Radio }
+export { Radio as Radio_alias_1 }
+
+declare interface RadioBaseProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    id: string;
+}
+export { RadioBaseProps }
+export { RadioBaseProps as RadioBaseProps_alias_1 }
+
+declare type RadioProps = RadioBaseProps & RadioRecipe;
+export { RadioProps }
+export { RadioProps as RadioProps_alias_1 }
+
+declare type RadioRecipe = RecipeVariantProps_2<typeof radio>;
+export { RadioRecipe }
+export { RadioRecipe as RadioRecipe_alias_1 }
+
 /**
  * Conditionally render its children or an optional fallback component
  * based on the SolidJS component.
@@ -484,7 +504,7 @@ export { TagProps as TagProps_alias_1 }
  * This module contains the tag component.
  * @module
  */
-declare type TagRecipeProps = RecipeVariantProps_2<typeof tag>;
+declare type TagRecipeProps = RecipeVariantProps_3<typeof tag>;
 export { TagRecipeProps }
 export { TagRecipeProps as TagRecipeProps_alias_1 }
 

package/build/legacy/{chunk-V4SA6GNO.js → chunk-MYDNNVMZ.js}

@@ -1,9 +1,9 @@
-import {
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 
 // src/components/Label.tsx
 import { label } from "@cerberus/styled-system/recipes";
@@ -11,16 +11,17 @@ import { css, cx } from "@cerberus/styled-system/css";
 import { hstack } from "@cerberus/styled-system/patterns";
 import { jsx, jsxs } from "react/jsx-runtime";
 function Label(props) {
-  const { hidden, ...nativeProps } = props;
-  const { required } = useFieldContext();
+  const { hidden, size, ...nativeProps } = props;
+  const { required, disabled } = useFieldContext();
   const usage = hidden ? "hidden" : "visible";
   return /* @__PURE__ */ jsxs(
     "label",
     {
       ...nativeProps,
+      "data-disabled": disabled,
       className: cx(
         nativeProps.className,
-        label({ usage }),
+        label({ size, usage }),
         hstack({
           justify: "space-between"
         })
@@ -45,4 +46,4 @@ function Label(props) {
 export {
   Label
 };
-//# sourceMappingURL=chunk-V4SA6GNO.js.map
+//# sourceMappingURL=chunk-MYDNNVMZ.js.map

package/build/legacy/chunk-MYDNNVMZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Label.tsx"],"sourcesContent":["'use client'\n\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\nimport { label } from '@cerberus/styled-system/recipes'\nimport { css, cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { hstack } from '@cerberus/styled-system/patterns'\nimport { useFieldContext } from '../context/field'\nimport { Show } from './Show'\n\n/**\n * This module contains the Label component.\n * @module\n */\n\nexport type LabelRecipeProps = RecipeVariantProps<typeof label>\nexport interface LabelBaseProps extends HTMLAttributes<HTMLLabelElement> {\n  htmlFor: string\n  hidden?: boolean\n}\nexport type LabelProps = LabelBaseProps & LabelRecipeProps\n\n/**\n * A screen ready friendly label component.\n * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)\n * @definition [Label docs](https://cerberus.digitalu.design/react/label)\n * @example\n * ```tsx\n * <Field required>\n *   <Label htmlFor=\"test\">Test Label</Label>\n * </Field>\n * ```\n */\nexport function Label(props: PropsWithChildren<LabelProps>) {\n  const { hidden, size, ...nativeProps } = props\n  const { required, disabled } = useFieldContext()\n  const usage = hidden ? 'hidden' : 'visible'\n\n  return (\n    <label\n      {...nativeProps}\n      data-disabled={disabled}\n      className={cx(\n        nativeProps.className,\n        label({ size, usage }),\n        hstack({\n          justify: 'space-between',\n        }),\n      )}\n    >\n      {props.children}\n      <Show when={required}>\n        <span\n          className={css({\n            color: 'neutral.text.100',\n            fontSize: 'inherit',\n          })}\n        >\n          (required)\n        </span>\n      </Show>\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAa;AACtB,SAAS,KAAK,UAAmC;AACjD,SAAS,cAAc;AAiCnB,SAaI,KAbJ;AANG,SAAS,MAAM,OAAsC;AAC1D,QAAM,EAAE,QAAQ,MAAM,GAAG,YAAY,IAAI;AACzC,QAAM,EAAE,UAAU,SAAS,IAAI,gBAAgB;AAC/C,QAAM,QAAQ,SAAS,WAAW;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,iBAAe;AAAA,MACf,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,MAAM,EAAE,MAAM,MAAM,CAAC;AAAA,QACrB,OAAO;AAAA,UACL,SAAS;AAAA,QACX,CAAC;AAAA,MACH;AAAA,MAEC;AAAA,cAAM;AAAA,QACP,oBAAC,QAAK,MAAM,UACV;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,IAAI;AAAA,cACb,OAAO;AAAA,cACP,UAAU;AAAA,YACZ,CAAC;AAAA,YACF;AAAA;AAAA,QAED,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/legacy/{chunk-AAKHV2IO.js → chunk-SZ2JQBP4.js}

@@ -1,9 +1,9 @@
-import {
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import {
   $cerberusIcons
 } from "./chunk-LQD23PG3.js";
@@ -39,4 +39,4 @@ function Input(props) {
 export {
   Input
 };
-//# sourceMappingURL=chunk-AAKHV2IO.js.map
+//# sourceMappingURL=chunk-SZ2JQBP4.js.map

package/build/legacy/chunk-WE3JNSNO.js

@@ -0,0 +1,33 @@
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
+
+// src/components/Radio.tsx
+import { cx } from "@cerberus-design/styled-system/css";
+import { hstack } from "@cerberus-design/styled-system/patterns";
+import { radio } from "@cerberus-design/styled-system/recipes";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Radio(props) {
+  const { children, size, ...nativeProps } = props;
+  const { invalid, ...state } = useFieldContext();
+  const styles = radio({ size });
+  return /* @__PURE__ */ jsxs("div", { className: cx("group", hstack(), styles.root), tabIndex: 0, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ...nativeProps,
+        ...state,
+        ...invalid && { "aria-invalid": true },
+        className: cx(nativeProps.className, styles.input),
+        tabIndex: -1,
+        type: "radio"
+      }
+    ),
+    children
+  ] });
+}
+
+export {
+  Radio
+};
+//# sourceMappingURL=chunk-WE3JNSNO.js.map

package/build/legacy/chunk-WE3JNSNO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Radio.tsx"],"sourcesContent":["'use client'\n\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { hstack } from '@cerberus-design/styled-system/patterns'\nimport { radio } from '@cerberus-design/styled-system/recipes'\nimport type { RecipeVariantProps } from '@cerberus-design/styled-system/types'\nimport type { InputHTMLAttributes, PropsWithChildren } from 'react'\nimport { useFieldContext } from '../context/field'\n\nexport type RadioRecipe = RecipeVariantProps<typeof radio>\nexport interface RadioBaseProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {\n  id: string\n}\nexport type RadioProps = RadioBaseProps & RadioRecipe\n\nexport function Radio(props: PropsWithChildren<RadioProps>) {\n  const { children, size, ...nativeProps } = props\n  const { invalid, ...state } = useFieldContext()\n  const styles = radio({ size })\n\n  return (\n    <div className={cx('group', hstack(), styles.root)} tabIndex={0}>\n      <input\n        {...nativeProps}\n        {...state}\n        {...(invalid && { 'aria-invalid': true })}\n        className={cx(nativeProps.className, styles.input)}\n        tabIndex={-1}\n        type=\"radio\"\n      />\n      {children}\n    </div>\n  )\n}\n"],"mappings":";;;;;AAEA,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB,SAAS,aAAa;AAkBlB,SACE,KADF;AANG,SAAS,MAAM,OAAsC;AAC1D,QAAM,EAAE,UAAU,MAAM,GAAG,YAAY,IAAI;AAC3C,QAAM,EAAE,SAAS,GAAG,MAAM,IAAI,gBAAgB;AAC9C,QAAM,SAAS,MAAM,EAAE,KAAK,CAAC;AAE7B,SACE,qBAAC,SAAI,WAAW,GAAG,SAAS,OAAO,GAAG,OAAO,IAAI,GAAG,UAAU,GAC5D;AAAA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,QACvC,WAAW,GAAG,YAAY,WAAW,OAAO,KAAK;AAAA,QACjD,UAAU;AAAA,QACV,MAAK;AAAA;AAAA,IACP;AAAA,IACC;AAAA,KACH;AAEJ;","names":[]}

package/build/legacy/components/Input.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   Input
-} from "../chunk-AAKHV2IO.js";
-import "../chunk-ZAU4JVLL.js";
+} from "../chunk-SZ2JQBP4.js";
 import "../chunk-4O4QFF4S.js";
+import "../chunk-ZAU4JVLL.js";
 import "../chunk-LQD23PG3.js";
 import "../chunk-RK5HK6UU.js";
 export {

package/build/legacy/components/Label.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   Label
-} from "../chunk-V4SA6GNO.js";
-import "../chunk-ZAU4JVLL.js";
+} from "../chunk-MYDNNVMZ.js";
 import "../chunk-4O4QFF4S.js";
+import "../chunk-ZAU4JVLL.js";
 export {
   Label
 };

package/build/legacy/components/Radio.js

@@ -0,0 +1,9 @@
+"use client";
+import {
+  Radio
+} from "../chunk-WE3JNSNO.js";
+import "../chunk-ZAU4JVLL.js";
+export {
+  Radio
+};
+//# sourceMappingURL=Radio.js.map

package/build/legacy/components/Radio.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/build/legacy/index.js

@@ -21,14 +21,10 @@ import {
 } from "./chunk-SLHX5K6I.js";
 import {
   Input
-} from "./chunk-AAKHV2IO.js";
+} from "./chunk-SZ2JQBP4.js";
 import {
   Label
-} from "./chunk-V4SA6GNO.js";
-import {
-  Field,
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
+} from "./chunk-MYDNNVMZ.js";
 import {
   NavMenuLink
 } from "./chunk-6DIGPXAD.js";
@@ -46,6 +42,13 @@ import {
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
+import {
+  Radio
+} from "./chunk-WE3JNSNO.js";
+import {
+  Field,
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import "./chunk-55J6XMHW.js";
 import {
   createNavTriggerProps
@@ -86,6 +89,7 @@ export {
   NavMenuLink,
   NavMenuList,
   NavMenuTrigger,
+  Radio,
   Show,
   THEME_KEY,
   Tab,

package/build/modern/_tsup-dts-rollup.d.ts

@@ -13,9 +13,11 @@ import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { label } from '@cerberus/styled-system/recipes';
 import { MutableRefObject } from 'react';
 import { PropsWithChildren } from 'react';
+import { radio } from '@cerberus-design/styled-system/recipes';
 import { ReactNode } from 'react';
 import { RecipeVariantProps } from '@cerberus/styled-system/css';
-import type { RecipeVariantProps as RecipeVariantProps_2 } from '@cerberus/styled-system/types';
+import type { RecipeVariantProps as RecipeVariantProps_2 } from '@cerberus-design/styled-system/types';
+import type { RecipeVariantProps as RecipeVariantProps_3 } from '@cerberus/styled-system/types';
 import { RefObject } from 'react';
 import { tag } from '@cerberus/styled-system/recipes';
 import type { TextareaHTMLAttributes } from 'react';
@@ -315,6 +317,24 @@ declare type Positions = 'top' | 'right' | 'bottom' | 'left';
 export { Positions }
 export { Positions as Positions_alias_1 }
 
+declare function Radio(props: PropsWithChildren<RadioProps>): JSX_2.Element;
+export { Radio }
+export { Radio as Radio_alias_1 }
+
+declare interface RadioBaseProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    id: string;
+}
+export { RadioBaseProps }
+export { RadioBaseProps as RadioBaseProps_alias_1 }
+
+declare type RadioProps = RadioBaseProps & RadioRecipe;
+export { RadioProps }
+export { RadioProps as RadioProps_alias_1 }
+
+declare type RadioRecipe = RecipeVariantProps_2<typeof radio>;
+export { RadioRecipe }
+export { RadioRecipe as RadioRecipe_alias_1 }
+
 /**
  * Conditionally render its children or an optional fallback component
  * based on the SolidJS component.
@@ -484,7 +504,7 @@ export { TagProps as TagProps_alias_1 }
  * This module contains the tag component.
  * @module
  */
-declare type TagRecipeProps = RecipeVariantProps_2<typeof tag>;
+declare type TagRecipeProps = RecipeVariantProps_3<typeof tag>;
 export { TagRecipeProps }
 export { TagRecipeProps as TagRecipeProps_alias_1 }
 

package/build/modern/{chunk-V4SA6GNO.js → chunk-MYDNNVMZ.js}

@@ -1,9 +1,9 @@
-import {
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 
 // src/components/Label.tsx
 import { label } from "@cerberus/styled-system/recipes";
@@ -11,16 +11,17 @@ import { css, cx } from "@cerberus/styled-system/css";
 import { hstack } from "@cerberus/styled-system/patterns";
 import { jsx, jsxs } from "react/jsx-runtime";
 function Label(props) {
-  const { hidden, ...nativeProps } = props;
-  const { required } = useFieldContext();
+  const { hidden, size, ...nativeProps } = props;
+  const { required, disabled } = useFieldContext();
   const usage = hidden ? "hidden" : "visible";
   return /* @__PURE__ */ jsxs(
     "label",
     {
       ...nativeProps,
+      "data-disabled": disabled,
       className: cx(
         nativeProps.className,
-        label({ usage }),
+        label({ size, usage }),
         hstack({
           justify: "space-between"
         })
@@ -45,4 +46,4 @@ function Label(props) {
 export {
   Label
 };
-//# sourceMappingURL=chunk-V4SA6GNO.js.map
+//# sourceMappingURL=chunk-MYDNNVMZ.js.map

package/build/modern/chunk-MYDNNVMZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Label.tsx"],"sourcesContent":["'use client'\n\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\nimport { label } from '@cerberus/styled-system/recipes'\nimport { css, cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { hstack } from '@cerberus/styled-system/patterns'\nimport { useFieldContext } from '../context/field'\nimport { Show } from './Show'\n\n/**\n * This module contains the Label component.\n * @module\n */\n\nexport type LabelRecipeProps = RecipeVariantProps<typeof label>\nexport interface LabelBaseProps extends HTMLAttributes<HTMLLabelElement> {\n  htmlFor: string\n  hidden?: boolean\n}\nexport type LabelProps = LabelBaseProps & LabelRecipeProps\n\n/**\n * A screen ready friendly label component.\n * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)\n * @definition [Label docs](https://cerberus.digitalu.design/react/label)\n * @example\n * ```tsx\n * <Field required>\n *   <Label htmlFor=\"test\">Test Label</Label>\n * </Field>\n * ```\n */\nexport function Label(props: PropsWithChildren<LabelProps>) {\n  const { hidden, size, ...nativeProps } = props\n  const { required, disabled } = useFieldContext()\n  const usage = hidden ? 'hidden' : 'visible'\n\n  return (\n    <label\n      {...nativeProps}\n      data-disabled={disabled}\n      className={cx(\n        nativeProps.className,\n        label({ size, usage }),\n        hstack({\n          justify: 'space-between',\n        }),\n      )}\n    >\n      {props.children}\n      <Show when={required}>\n        <span\n          className={css({\n            color: 'neutral.text.100',\n            fontSize: 'inherit',\n          })}\n        >\n          (required)\n        </span>\n      </Show>\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAa;AACtB,SAAS,KAAK,UAAmC;AACjD,SAAS,cAAc;AAiCnB,SAaI,KAbJ;AANG,SAAS,MAAM,OAAsC;AAC1D,QAAM,EAAE,QAAQ,MAAM,GAAG,YAAY,IAAI;AACzC,QAAM,EAAE,UAAU,SAAS,IAAI,gBAAgB;AAC/C,QAAM,QAAQ,SAAS,WAAW;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,iBAAe;AAAA,MACf,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,MAAM,EAAE,MAAM,MAAM,CAAC;AAAA,QACrB,OAAO;AAAA,UACL,SAAS;AAAA,QACX,CAAC;AAAA,MACH;AAAA,MAEC;AAAA,cAAM;AAAA,QACP,oBAAC,QAAK,MAAM,UACV;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,IAAI;AAAA,cACb,OAAO;AAAA,cACP,UAAU;AAAA,YACZ,CAAC;AAAA,YACF;AAAA;AAAA,QAED,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/modern/{chunk-AAKHV2IO.js → chunk-SZ2JQBP4.js}

@@ -1,9 +1,9 @@
-import {
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import {
   $cerberusIcons
 } from "./chunk-LQD23PG3.js";
@@ -39,4 +39,4 @@ function Input(props) {
 export {
   Input
 };
-//# sourceMappingURL=chunk-AAKHV2IO.js.map
+//# sourceMappingURL=chunk-SZ2JQBP4.js.map

package/build/modern/chunk-WE3JNSNO.js

@@ -0,0 +1,33 @@
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
+
+// src/components/Radio.tsx
+import { cx } from "@cerberus-design/styled-system/css";
+import { hstack } from "@cerberus-design/styled-system/patterns";
+import { radio } from "@cerberus-design/styled-system/recipes";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Radio(props) {
+  const { children, size, ...nativeProps } = props;
+  const { invalid, ...state } = useFieldContext();
+  const styles = radio({ size });
+  return /* @__PURE__ */ jsxs("div", { className: cx("group", hstack(), styles.root), tabIndex: 0, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ...nativeProps,
+        ...state,
+        ...invalid && { "aria-invalid": true },
+        className: cx(nativeProps.className, styles.input),
+        tabIndex: -1,
+        type: "radio"
+      }
+    ),
+    children
+  ] });
+}
+
+export {
+  Radio
+};
+//# sourceMappingURL=chunk-WE3JNSNO.js.map

package/build/modern/chunk-WE3JNSNO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Radio.tsx"],"sourcesContent":["'use client'\n\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { hstack } from '@cerberus-design/styled-system/patterns'\nimport { radio } from '@cerberus-design/styled-system/recipes'\nimport type { RecipeVariantProps } from '@cerberus-design/styled-system/types'\nimport type { InputHTMLAttributes, PropsWithChildren } from 'react'\nimport { useFieldContext } from '../context/field'\n\nexport type RadioRecipe = RecipeVariantProps<typeof radio>\nexport interface RadioBaseProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {\n  id: string\n}\nexport type RadioProps = RadioBaseProps & RadioRecipe\n\nexport function Radio(props: PropsWithChildren<RadioProps>) {\n  const { children, size, ...nativeProps } = props\n  const { invalid, ...state } = useFieldContext()\n  const styles = radio({ size })\n\n  return (\n    <div className={cx('group', hstack(), styles.root)} tabIndex={0}>\n      <input\n        {...nativeProps}\n        {...state}\n        {...(invalid && { 'aria-invalid': true })}\n        className={cx(nativeProps.className, styles.input)}\n        tabIndex={-1}\n        type=\"radio\"\n      />\n      {children}\n    </div>\n  )\n}\n"],"mappings":";;;;;AAEA,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB,SAAS,aAAa;AAkBlB,SACE,KADF;AANG,SAAS,MAAM,OAAsC;AAC1D,QAAM,EAAE,UAAU,MAAM,GAAG,YAAY,IAAI;AAC3C,QAAM,EAAE,SAAS,GAAG,MAAM,IAAI,gBAAgB;AAC9C,QAAM,SAAS,MAAM,EAAE,KAAK,CAAC;AAE7B,SACE,qBAAC,SAAI,WAAW,GAAG,SAAS,OAAO,GAAG,OAAO,IAAI,GAAG,UAAU,GAC5D;AAAA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,QACvC,WAAW,GAAG,YAAY,WAAW,OAAO,KAAK;AAAA,QACjD,UAAU;AAAA,QACV,MAAK;AAAA;AAAA,IACP;AAAA,IACC;AAAA,KACH;AAEJ;","names":[]}

package/build/modern/components/Input.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   Input
-} from "../chunk-AAKHV2IO.js";
-import "../chunk-ZAU4JVLL.js";
+} from "../chunk-SZ2JQBP4.js";
 import "../chunk-4O4QFF4S.js";
+import "../chunk-ZAU4JVLL.js";
 import "../chunk-LQD23PG3.js";
 import "../chunk-RK5HK6UU.js";
 export {

package/build/modern/components/Label.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   Label
-} from "../chunk-V4SA6GNO.js";
-import "../chunk-ZAU4JVLL.js";
+} from "../chunk-MYDNNVMZ.js";
 import "../chunk-4O4QFF4S.js";
+import "../chunk-ZAU4JVLL.js";
 export {
   Label
 };

package/build/modern/components/Radio.js

@@ -0,0 +1,9 @@
+"use client";
+import {
+  Radio
+} from "../chunk-WE3JNSNO.js";
+import "../chunk-ZAU4JVLL.js";
+export {
+  Radio
+};
+//# sourceMappingURL=Radio.js.map

package/build/modern/components/Radio.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/build/modern/index.js

@@ -21,14 +21,10 @@ import {
 } from "./chunk-SLHX5K6I.js";
 import {
   Input
-} from "./chunk-AAKHV2IO.js";
+} from "./chunk-SZ2JQBP4.js";
 import {
   Label
-} from "./chunk-V4SA6GNO.js";
-import {
-  Field,
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
+} from "./chunk-MYDNNVMZ.js";
 import {
   NavMenuLink
 } from "./chunk-6DIGPXAD.js";
@@ -46,6 +42,13 @@ import {
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
+import {
+  Radio
+} from "./chunk-WE3JNSNO.js";
+import {
+  Field,
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import "./chunk-55J6XMHW.js";
 import {
   createNavTriggerProps
@@ -86,6 +89,7 @@ export {
   NavMenuLink,
   NavMenuList,
   NavMenuTrigger,
+  Radio,
   Show,
   THEME_KEY,
   Tab,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cerberus-design/react",
-  "version": "0.5.2-next-f874d5b",
+  "version": "0.5.2-next-b1fa39d",
   "description": "The Cerberus Design React component library.",
   "browserslist": "> 0.25%, not dead",
   "sideEffects": false,
@@ -22,7 +22,7 @@
     "react-dom": "^18",
     "tsup": "^8.1.0",
     "@cerberus-design/configs": "0.0.0",
-    "@cerberus-design/styled-system": "0.5.2-next-f874d5b"
+    "@cerberus-design/styled-system": "0.5.2-next-b1fa39d"
   },
   "publishConfig": {
     "access": "public"

package/src/components/Label.tsx

@@ -3,9 +3,9 @@
 import type { HTMLAttributes, PropsWithChildren } from 'react'
 import { label } from '@cerberus/styled-system/recipes'
 import { css, cx, type RecipeVariantProps } from '@cerberus/styled-system/css'
+import { hstack } from '@cerberus/styled-system/patterns'
 import { useFieldContext } from '../context/field'
 import { Show } from './Show'
-import { hstack } from '@cerberus/styled-system/patterns'
 
 /**
  * This module contains the Label component.
@@ -31,16 +31,17 @@ export type LabelProps = LabelBaseProps & LabelRecipeProps
  * ```
  */
 export function Label(props: PropsWithChildren<LabelProps>) {
-  const { hidden, ...nativeProps } = props
-  const { required } = useFieldContext()
+  const { hidden, size, ...nativeProps } = props
+  const { required, disabled } = useFieldContext()
   const usage = hidden ? 'hidden' : 'visible'
 
   return (
     <label
       {...nativeProps}
+      data-disabled={disabled}
       className={cx(
         nativeProps.className,
-        label({ usage }),
+        label({ size, usage }),
         hstack({
           justify: 'space-between',
         }),

package/src/components/Radio.tsx

@@ -0,0 +1,35 @@
+'use client'
+
+import { cx } from '@cerberus-design/styled-system/css'
+import { hstack } from '@cerberus-design/styled-system/patterns'
+import { radio } from '@cerberus-design/styled-system/recipes'
+import type { RecipeVariantProps } from '@cerberus-design/styled-system/types'
+import type { InputHTMLAttributes, PropsWithChildren } from 'react'
+import { useFieldContext } from '../context/field'
+
+export type RadioRecipe = RecipeVariantProps<typeof radio>
+export interface RadioBaseProps
+  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+  id: string
+}
+export type RadioProps = RadioBaseProps & RadioRecipe
+
+export function Radio(props: PropsWithChildren<RadioProps>) {
+  const { children, size, ...nativeProps } = props
+  const { invalid, ...state } = useFieldContext()
+  const styles = radio({ size })
+
+  return (
+    <div className={cx('group', hstack(), styles.root)} tabIndex={0}>
+      <input
+        {...nativeProps}
+        {...state}
+        {...(invalid && { 'aria-invalid': true })}
+        className={cx(nativeProps.className, styles.input)}
+        tabIndex={-1}
+        type="radio"
+      />
+      {children}
+    </div>
+  )
+}

package/src/index.ts

@@ -13,6 +13,7 @@ export * from './components/Label'
 export * from './components/NavMenuTrigger'
 export * from './components/NavMenuList'
 export * from './components/NavMenuLink'
+export * from './components/Radio'
 export * from './components/Tab'
 export * from './components/TabList'
 export * from './components/TabPanel'

package/build/legacy/chunk-V4SA6GNO.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Label.tsx"],"sourcesContent":["'use client'\n\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\nimport { label } from '@cerberus/styled-system/recipes'\nimport { css, cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport { Show } from './Show'\nimport { hstack } from '@cerberus/styled-system/patterns'\n\n/**\n * This module contains the Label component.\n * @module\n */\n\nexport type LabelRecipeProps = RecipeVariantProps<typeof label>\nexport interface LabelBaseProps extends HTMLAttributes<HTMLLabelElement> {\n  htmlFor: string\n  hidden?: boolean\n}\nexport type LabelProps = LabelBaseProps & LabelRecipeProps\n\n/**\n * A screen ready friendly label component.\n * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)\n * @definition [Label docs](https://cerberus.digitalu.design/react/label)\n * @example\n * ```tsx\n * <Field required>\n *   <Label htmlFor=\"test\">Test Label</Label>\n * </Field>\n * ```\n */\nexport function Label(props: PropsWithChildren<LabelProps>) {\n  const { hidden, ...nativeProps } = props\n  const { required } = useFieldContext()\n  const usage = hidden ? 'hidden' : 'visible'\n\n  return (\n    <label\n      {...nativeProps}\n      className={cx(\n        nativeProps.className,\n        label({ usage }),\n        hstack({\n          justify: 'space-between',\n        }),\n      )}\n    >\n      {props.children}\n      <Show when={required}>\n        <span\n          className={css({\n            color: 'neutral.text.100',\n            fontSize: 'inherit',\n          })}\n        >\n          (required)\n        </span>\n      </Show>\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAa;AACtB,SAAS,KAAK,UAAmC;AAGjD,SAAS,cAAc;AA+BnB,SAYI,KAZJ;AANG,SAAS,MAAM,OAAsC;AAC1D,QAAM,EAAE,QAAQ,GAAG,YAAY,IAAI;AACnC,QAAM,EAAE,SAAS,IAAI,gBAAgB;AACrC,QAAM,QAAQ,SAAS,WAAW;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,MAAM,EAAE,MAAM,CAAC;AAAA,QACf,OAAO;AAAA,UACL,SAAS;AAAA,QACX,CAAC;AAAA,MACH;AAAA,MAEC;AAAA,cAAM;AAAA,QACP,oBAAC,QAAK,MAAM,UACV;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,IAAI;AAAA,cACb,OAAO;AAAA,cACP,UAAU;AAAA,YACZ,CAAC;AAAA,YACF;AAAA;AAAA,QAED,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/modern/chunk-V4SA6GNO.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Label.tsx"],"sourcesContent":["'use client'\n\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\nimport { label } from '@cerberus/styled-system/recipes'\nimport { css, cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport { Show } from './Show'\nimport { hstack } from '@cerberus/styled-system/patterns'\n\n/**\n * This module contains the Label component.\n * @module\n */\n\nexport type LabelRecipeProps = RecipeVariantProps<typeof label>\nexport interface LabelBaseProps extends HTMLAttributes<HTMLLabelElement> {\n  htmlFor: string\n  hidden?: boolean\n}\nexport type LabelProps = LabelBaseProps & LabelRecipeProps\n\n/**\n * A screen ready friendly label component.\n * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)\n * @definition [Label docs](https://cerberus.digitalu.design/react/label)\n * @example\n * ```tsx\n * <Field required>\n *   <Label htmlFor=\"test\">Test Label</Label>\n * </Field>\n * ```\n */\nexport function Label(props: PropsWithChildren<LabelProps>) {\n  const { hidden, ...nativeProps } = props\n  const { required } = useFieldContext()\n  const usage = hidden ? 'hidden' : 'visible'\n\n  return (\n    <label\n      {...nativeProps}\n      className={cx(\n        nativeProps.className,\n        label({ usage }),\n        hstack({\n          justify: 'space-between',\n        }),\n      )}\n    >\n      {props.children}\n      <Show when={required}>\n        <span\n          className={css({\n            color: 'neutral.text.100',\n            fontSize: 'inherit',\n          })}\n        >\n          (required)\n        </span>\n      </Show>\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAa;AACtB,SAAS,KAAK,UAAmC;AAGjD,SAAS,cAAc;AA+BnB,SAYI,KAZJ;AANG,SAAS,MAAM,OAAsC;AAC1D,QAAM,EAAE,QAAQ,GAAG,YAAY,IAAI;AACnC,QAAM,EAAE,SAAS,IAAI,gBAAgB;AACrC,QAAM,QAAQ,SAAS,WAAW;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,MAAM,EAAE,MAAM,CAAC;AAAA,QACf,OAAO;AAAA,UACL,SAAS;AAAA,QACX,CAAC;AAAA,MACH;AAAA,MAEC;AAAA,cAAM;AAAA,QACP,oBAAC,QAAK,MAAM,UACV;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,IAAI;AAAA,cACb,OAAO;AAAA,cACP,UAAU;AAAA,YACZ,CAAC;AAAA,YACF;AAAA;AAAA,QAED,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}