@cerberus-design/react 0.15.0-next-5d7dc1e → 0.15.0-next-7a184be

package/build/modern/chunk-6WOJAMZV.js

@@ -1,40 +0,0 @@
-// src/components/Radio.tsx
-import { Field } from "@ark-ui/react/field";
-import { cx } from "@cerberus/styled-system/css";
-import { hstack } from "@cerberus/styled-system/patterns";
-import { radio } from "@cerberus/styled-system/recipes";
-import { jsx, jsxs } from "react/jsx-runtime";
-function Radio(props) {
-  const { children, size, ...nativeProps } = props;
-  const styles = radio({ size });
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cx(
-        "group",
-        hstack({
-          gap: "sm"
-        }),
-        styles.root
-      ),
-      tabIndex: 0,
-      children: [
-        /* @__PURE__ */ jsx(
-          Field.Input,
-          {
-            ...nativeProps,
-            className: cx(nativeProps.className, styles.input),
-            tabIndex: -1,
-            type: "radio"
-          }
-        ),
-        children
-      ]
-    }
-  );
-}
-
-export {
-  Radio
-};
-//# sourceMappingURL=chunk-6WOJAMZV.js.map

package/build/modern/chunk-6WOJAMZV.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Radio.tsx"],"sourcesContent":["import { Field } from '@ark-ui/react/field'\nimport { cx } from '@cerberus/styled-system/css'\nimport { hstack } from '@cerberus/styled-system/patterns'\nimport { radio } from '@cerberus/styled-system/recipes'\nimport type { RecipeVariantProps } from '@cerberus/styled-system/types'\nimport type { InputHTMLAttributes, PropsWithChildren } from 'react'\n\n/**\n * This module contains the Radio component.\n * @module\n */\n\nexport type RadioRecipe = RecipeVariantProps<typeof radio>\nexport interface RadioBaseProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {\n  /**\n   * A unique identifier for the radio button. Required for accessibility.\n   */\n  id: string\n}\nexport type RadioProps = RadioBaseProps & RadioRecipe\n\n/**\n * The Radio component is used to allow users to select a single option from a list of options.\n * @see https://cerberus.digitalu.design/react/radio\n * @memberof module:Field\n * @example\n * ```tsx\n * <Field>\n *  <fieldset name=\"fruit\">\n *    <Radio id=\"radio-1\" name=\"fruit\" value=\"1\">\n *     Option 1\n *    </Radio>\n *    <Radio id=\"radio-2\" name=\"fruit\" value=\"2\">\n *     Option 2\n *    </Radio>\n *    <Radio id=\"radio-3\" name=\"fruit\" value=\"3\">\n *     Option 3\n *    </Radio>\n *   </fieldset>\n * </Field>\n * ```\n */\nexport function Radio(props: PropsWithChildren<RadioProps>) {\n  const { children, size, ...nativeProps } = props\n  const styles = radio({ size })\n\n  return (\n    <div\n      className={cx(\n        'group',\n        hstack({\n          gap: 'sm',\n        }),\n        styles.root,\n      )}\n      tabIndex={0}\n    >\n      <Field.Input\n        {...nativeProps}\n        className={cx(nativeProps.className, styles.input)}\n        tabIndex={-1}\n        type=\"radio\"\n      />\n      {children}\n    </div>\n  )\n}\n"],"mappings":";AAAA,SAAS,aAAa;AACtB,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB,SAAS,aAAa;AA6ClB,SAUE,KAVF;AALG,SAAS,MAAM,OAAsC;AAC1D,QAAM,EAAE,UAAU,MAAM,GAAG,YAAY,IAAI;AAC3C,QAAM,SAAS,MAAM,EAAE,KAAK,CAAC;AAE7B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,OAAO;AAAA,UACL,KAAK;AAAA,QACP,CAAC;AAAA,QACD,OAAO;AAAA,MACT;AAAA,MACA,UAAU;AAAA,MAEV;AAAA;AAAA,UAAC,MAAM;AAAA,UAAN;AAAA,YACE,GAAG;AAAA,YACJ,WAAW,GAAG,YAAY,WAAW,OAAO,KAAK;AAAA,YACjD,UAAU;AAAA,YACV,MAAK;AAAA;AAAA,QACP;AAAA,QACC;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/FieldsetLabel.tsx"],"sourcesContent":["import { cx } from '@cerberus/styled-system/css'\nimport { label, type LabelVariantProps } from '@cerberus/styled-system/recipes'\nimport type { LabelProps } from './deprecated/Label'\n\n/**\n * This module contains the FieldsetLabel component.\n * @module FieldsetLabel\n */\n\nexport type FieldsetLabelProps = LabelProps &\n  LabelVariantProps & {\n    htmlFor?: string\n  }\n\n/**\n * Used for labeling inputs that are children of a Fieldset group.\n * @memberof Fieldset\n * @see https://cerberus.digitalu.design/react/fieldset\n * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)\n * @example\n * ```tsx\n * import { Fieldset, Legend, Field, Radio, Label } from '@cerberus/react'\n * import { Hstack } from '@cerberus/styled-system/jsx'\n *\n * function SomeForm() {\n *   return (\n *    <form>\n *     <Fieldset>\n *      <Legend>Do you like cats?</Legend>\n *      <Hstack>\n *        <Field>\n *          <Radio id=\"yes\" name=\"cats\" value=\"yes\" />\n *          <FieldsetLabel htmlFor=\"yes\">Yes</FieldsetLabel>\n *        </Field>\n *      </Hstack>\n *      <Hstack>\n *        <Field>\n *         <Radio id=\"no\" name=\"cats\" value=\"no\" />\n *         <FieldsetLabel htmlFor=\"no\">No</FieldsetLabel>\n *        </Field>\n *      </Hstack>\n *     </Fieldset>\n *    </form>\n *   )\n * }\n * ```\n */\nexport function FieldsetLabel(props: FieldsetLabelProps) {\n  const { size, usage, ...nativeProps } = props\n  return (\n    <label\n      {...nativeProps}\n      className={cx(\n        nativeProps.className,\n        label({\n          size,\n          usage,\n        }),\n      )}\n    />\n  )\n}\n"],"mappings":";AAAA,SAAS,UAAU;AACnB,SAAS,aAAqC;AAiD1C;AAHG,SAAS,cAAc,OAA2B;AACvD,QAAM,EAAE,MAAM,OAAO,GAAG,YAAY,IAAI;AACxC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,MAAM;AAAA,UACJ;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/modern/components/Fieldset.js

@@ -1,8 +0,0 @@
-"use client";
-import {
-  Fieldset
-} from "../chunk-6EUC3SUI.js";
-export {
-  Fieldset
-};
-//# sourceMappingURL=Fieldset.js.map

package/build/modern/components/FieldsetLabel.js

@@ -1,7 +0,0 @@
-import {
-  FieldsetLabel
-} from "../chunk-OYT7RGC7.js";
-export {
-  FieldsetLabel
-};
-//# sourceMappingURL=FieldsetLabel.js.map

package/build/modern/components/Radio.js

@@ -1,7 +0,0 @@
-import {
-  Radio
-} from "../chunk-6WOJAMZV.js";
-export {
-  Radio
-};
-//# sourceMappingURL=Radio.js.map

package/src/components/Fieldset.tsx

@@ -1,65 +0,0 @@
-'use client'
-
-import { useFieldContext } from '@ark-ui/react/field'
-import { css, cx } from '@cerberus/styled-system/css'
-import type { FieldsetHTMLAttributes } from 'react'
-
-/**
- * This module contains the Fieldset component.
- * @module Fieldset
- */
-
-export type FieldsetProps = FieldsetHTMLAttributes<HTMLFieldSetElement>
-
-/**
- * A component to group related elements in a form for accessibility.
- * @memberof Field
- * @see https://cerberus.digitalu.com/react/fieldset
- * @description [A11y Form Checklist](https://www.a11yproject.com/checklist/#forms)
- * @description [MDN Web Docs: Fieldset](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/fieldset)
- * @example
- * ```tsx
- * import { Fieldset, Legend, Field, Radio, Label } from '@cerberus/react'
- * import { Hstack } from '@cerberus/styled-system/jsx'
- *
- * function SomeForm() {
- *   return (
- *    <form>
- *     <Fieldset>
- *      <Legend>Do you like cats?</Legend>
- *      <Hstack>
- *        <Field>
- *          <Radio id="yes" name="cats" value="yes" />
- *          <Label htmlFor="yes">Yes</Label>
- *        </Field>
- *      </Hstack>
- *      <Hstack>
- *        <Field>
- *         <Radio id="no" name="cats" value="no" />
- *         <Label htmlFor="no">No</Label>
- *        </Field>
- *      </Hstack>
- *     </Fieldset>
- *    </form>
- *   )
- * }
- */
-export function Fieldset(props: FieldsetProps) {
-  const { invalid, disabled } = useFieldContext()
-
-  return (
-    <fieldset
-      {...props}
-      disabled={disabled}
-      {...(invalid && { 'aria-invalid': true })}
-      className={cx(
-        props.className,
-        css({
-          border: 'none',
-          pt: 2,
-          margin: 0,
-        }),
-      )}
-    />
-  )
-}

package/src/components/FieldsetLabel.tsx

@@ -1,62 +0,0 @@
-import { cx } from '@cerberus/styled-system/css'
-import { label, type LabelVariantProps } from '@cerberus/styled-system/recipes'
-import type { LabelProps } from './deprecated/Label'
-
-/**
- * This module contains the FieldsetLabel component.
- * @module FieldsetLabel
- */
-
-export type FieldsetLabelProps = LabelProps &
-  LabelVariantProps & {
-    htmlFor?: string
-  }
-
-/**
- * Used for labeling inputs that are children of a Fieldset group.
- * @memberof Fieldset
- * @see https://cerberus.digitalu.design/react/fieldset
- * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)
- * @example
- * ```tsx
- * import { Fieldset, Legend, Field, Radio, Label } from '@cerberus/react'
- * import { Hstack } from '@cerberus/styled-system/jsx'
- *
- * function SomeForm() {
- *   return (
- *    <form>
- *     <Fieldset>
- *      <Legend>Do you like cats?</Legend>
- *      <Hstack>
- *        <Field>
- *          <Radio id="yes" name="cats" value="yes" />
- *          <FieldsetLabel htmlFor="yes">Yes</FieldsetLabel>
- *        </Field>
- *      </Hstack>
- *      <Hstack>
- *        <Field>
- *         <Radio id="no" name="cats" value="no" />
- *         <FieldsetLabel htmlFor="no">No</FieldsetLabel>
- *        </Field>
- *      </Hstack>
- *     </Fieldset>
- *    </form>
- *   )
- * }
- * ```
- */
-export function FieldsetLabel(props: FieldsetLabelProps) {
-  const { size, usage, ...nativeProps } = props
-  return (
-    <label
-      {...nativeProps}
-      className={cx(
-        nativeProps.className,
-        label({
-          size,
-          usage,
-        }),
-      )}
-    />
-  )
-}

package/src/components/Radio.tsx

@@ -1,68 +0,0 @@
-import { Field } from '@ark-ui/react/field'
-import { cx } from '@cerberus/styled-system/css'
-import { hstack } from '@cerberus/styled-system/patterns'
-import { radio } from '@cerberus/styled-system/recipes'
-import type { RecipeVariantProps } from '@cerberus/styled-system/types'
-import type { InputHTMLAttributes, PropsWithChildren } from 'react'
-
-/**
- * This module contains the Radio component.
- * @module
- */
-
-export type RadioRecipe = RecipeVariantProps<typeof radio>
-export interface RadioBaseProps
-  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
-  /**
-   * A unique identifier for the radio button. Required for accessibility.
-   */
-  id: string
-}
-export type RadioProps = RadioBaseProps & RadioRecipe
-
-/**
- * The Radio component is used to allow users to select a single option from a list of options.
- * @see https://cerberus.digitalu.design/react/radio
- * @memberof module:Field
- * @example
- * ```tsx
- * <Field>
- *  <fieldset name="fruit">
- *    <Radio id="radio-1" name="fruit" value="1">
- *     Option 1
- *    </Radio>
- *    <Radio id="radio-2" name="fruit" value="2">
- *     Option 2
- *    </Radio>
- *    <Radio id="radio-3" name="fruit" value="3">
- *     Option 3
- *    </Radio>
- *   </fieldset>
- * </Field>
- * ```
- */
-export function Radio(props: PropsWithChildren<RadioProps>) {
-  const { children, size, ...nativeProps } = props
-  const styles = radio({ size })
-
-  return (
-    <div
-      className={cx(
-        'group',
-        hstack({
-          gap: 'sm',
-        }),
-        styles.root,
-      )}
-      tabIndex={0}
-    >
-      <Field.Input
-        {...nativeProps}
-        className={cx(nativeProps.className, styles.input)}
-        tabIndex={-1}
-        type="radio"
-      />
-      {children}
-    </div>
-  )
-}