@cerberus-design/react 0.10.4-next-8007762 → 0.10.4-next-4e536c0

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

@@ -55,6 +55,7 @@ import { DroppableContainers } from '@dnd-kit/core';
 import { DroppableMeasuring } from '@dnd-kit/core';
 import { ElementType } from 'react';
 import { FieldMessageVariantProps } from '@cerberus/styled-system/recipes';
+import type { FieldsetHTMLAttributes } from 'react';
 import { FileStatusVariantProps } from '@cerberus/styled-system/recipes';
 import { ForwardRefExoticComponent } from 'react';
 import { getClientRect } from '@dnd-kit/core';
@@ -74,6 +75,7 @@ import { KeyboardSensor } from '@dnd-kit/core';
 import { KeyboardSensorOptions } from '@dnd-kit/core';
 import { KeyboardSensorProps } from '@dnd-kit/core';
 import { LabelVariantProps } from '@cerberus/styled-system/recipes';
+import { LabelVariantProps as LabelVariantProps_2 } from '@cerberus-design/styled-system/recipes';
 import { MeasuringConfiguration } from '@dnd-kit/core';
 import { MeasuringFrequency } from '@dnd-kit/core';
 import { MeasuringStrategy } from '@dnd-kit/core';
@@ -687,6 +689,96 @@ declare type FieldMessageProps = FieldMessageBaseProps & FieldMessageVariantProp
 export { FieldMessageProps }
 export { FieldMessageProps as FieldMessageProps_alias_1 }
 
+/**
+ * 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>
+ *   )
+ * }
+ */
+declare function Fieldset(props: FieldsetProps): JSX_2.Element;
+export { Fieldset }
+export { Fieldset as Fieldset_alias_1 }
+
+/**
+ * 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>
+ *   )
+ * }
+ * ```
+ */
+declare function FieldsetLabel(props: FieldsetLabelProps): JSX_2.Element;
+export { FieldsetLabel }
+export { FieldsetLabel as FieldsetLabel_alias_1 }
+
+/**
+ * This module contains the FieldsetLabel component.
+ * @module FieldsetLabel
+ */
+declare type FieldsetLabelProps = LabelProps & LabelVariantProps;
+export { FieldsetLabelProps }
+export { FieldsetLabelProps as FieldsetLabelProps_alias_1 }
+
+/**
+ * This module contains the Fieldset component.
+ * @module Fieldset
+ */
+declare type FieldsetProps = FieldsetHTMLAttributes<HTMLFieldSetElement>;
+export { FieldsetProps }
+export { FieldsetProps as FieldsetProps_alias_1 }
+
 declare interface FileBaseStatusProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick'> {
     /**
      * A unique identifier for the file status. Required for accessibility.
@@ -958,6 +1050,52 @@ declare type LabelProps = LabelBaseProps & LabelVariantProps;
 export { LabelProps }
 export { LabelProps as LabelProps_alias_1 }
 
+/**
+ * A component to provide a global label for a group of related elements in a form (for accessibility).
+ * @memberof Fieldset
+ * @see https://cerberus.digitalu.com/react/fieldset
+ * @description [A11y Form Checklist](https://www.a11yproject.com/checklist/#forms)
+ * @description [MDN Web Docs: Legend](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/legend)
+ * @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>
+ *   )
+ * }
+ * ```
+ */
+declare function Legend(props: LegendProps): JSX_2.Element;
+export { Legend }
+export { Legend as Legend_alias_1 }
+
+/**
+ * This module contains the Fieldset component.
+ * @module Fieldset
+ */
+declare type LegendProps = HTMLAttributes<HTMLLegendElement> & LabelVariantProps_2;
+export { LegendProps }
+export { LegendProps as LegendProps_alias_1 }
+
 export { MeasuringConfiguration }
 
 export { MeasuringFrequency }

package/build/modern/chunk-3ZDFQO25.js

@@ -0,0 +1,31 @@
+import {
+  useFieldContext
+} from "./chunk-UZDVOIW5.js";
+
+// src/components/Fieldset.tsx
+import { css, cx } from "@cerberus/styled-system/css";
+import { jsx } from "react/jsx-runtime";
+function Fieldset(props) {
+  const { invalid, ...formState } = useFieldContext();
+  return /* @__PURE__ */ jsx(
+    "fieldset",
+    {
+      ...props,
+      ...formState,
+      ...invalid && { "aria-invalid": true },
+      className: cx(
+        props.className,
+        css({
+          border: "none",
+          pt: 2,
+          margin: 0
+        })
+      )
+    }
+  );
+}
+
+export {
+  Fieldset
+};
+//# sourceMappingURL=chunk-3ZDFQO25.js.map

package/build/modern/chunk-3ZDFQO25.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Fieldset.tsx"],"sourcesContent":["'use client'\n\nimport { css, cx } from '@cerberus/styled-system/css'\nimport type { FieldsetHTMLAttributes } from 'react'\nimport { useFieldContext } from '../context/field'\n\n/**\n * This module contains the Fieldset component.\n * @module Fieldset\n */\n\nexport type FieldsetProps = FieldsetHTMLAttributes<HTMLFieldSetElement>\n\n/**\n * A component to group related elements in a form for accessibility.\n * @memberof Field\n * @see https://cerberus.digitalu.com/react/fieldset\n * @description [A11y Form Checklist](https://www.a11yproject.com/checklist/#forms)\n * @description [MDN Web Docs: Fieldset](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/fieldset)\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 *          <Label htmlFor=\"yes\">Yes</Label>\n *        </Field>\n *      </Hstack>\n *      <Hstack>\n *        <Field>\n *         <Radio id=\"no\" name=\"cats\" value=\"no\" />\n *         <Label htmlFor=\"no\">No</Label>\n *        </Field>\n *      </Hstack>\n *     </Fieldset>\n *    </form>\n *   )\n * }\n */\nexport function Fieldset(props: FieldsetProps) {\n  const { invalid, ...formState } = useFieldContext()\n\n  return (\n    <fieldset\n      {...props}\n      {...formState}\n      {...(invalid && { 'aria-invalid': true })}\n      className={cx(\n        props.className,\n        css({\n          border: 'none',\n          pt: 2,\n          margin: 0,\n        }),\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;AAEA,SAAS,KAAK,UAAU;AAgDpB;AAJG,SAAS,SAAS,OAAsB;AAC7C,QAAM,EAAE,SAAS,GAAG,UAAU,IAAI,gBAAgB;AAElD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,MACvC,WAAW;AAAA,QACT,MAAM;AAAA,QACN,IAAI;AAAA,UACF,QAAQ;AAAA,UACR,IAAI;AAAA,UACJ,QAAQ;AAAA,QACV,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}

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

@@ -0,0 +1,54 @@
+import {
+  useFieldContext
+} from "./chunk-UZDVOIW5.js";
+import {
+  Show
+} from "./chunk-BUVVRQLZ.js";
+
+// src/components/Legend.tsx
+import { css, cx } from "@cerberus/styled-system/css";
+import {
+  label
+} from "@cerberus-design/styled-system/recipes";
+import { hstack } from "@cerberus-design/styled-system/patterns";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Legend(props) {
+  const { size, ...nativeProps } = props;
+  const { invalid, ...formState } = useFieldContext();
+  return /* @__PURE__ */ jsxs(
+    "legend",
+    {
+      ...nativeProps,
+      ...formState,
+      ...invalid && { "aria-invalid": true },
+      className: cx(
+        nativeProps.className,
+        hstack({
+          justify: "space-between",
+          w: "full"
+        }),
+        label({
+          size
+        })
+      ),
+      children: [
+        nativeProps.children,
+        /* @__PURE__ */ jsx(Show, { when: formState.required, children: /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: css({
+              color: "page.text.100",
+              fontSize: "inherit"
+            }),
+            children: "(required)"
+          }
+        ) })
+      ]
+    }
+  );
+}
+
+export {
+  Legend
+};
+//# sourceMappingURL=chunk-6TTN2JMY.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Legend.tsx"],"sourcesContent":["'use client'\n\nimport { css, cx } from '@cerberus/styled-system/css'\nimport { type HTMLAttributes } from 'react'\nimport { useFieldContext } from '../context/field'\nimport { Show } from './Show'\nimport {\n  label,\n  type LabelVariantProps,\n} from '@cerberus-design/styled-system/recipes'\nimport { hstack } from '@cerberus-design/styled-system/patterns'\n\n/**\n * This module contains the Fieldset component.\n * @module Fieldset\n */\n\nexport type LegendProps = HTMLAttributes<HTMLLegendElement> & LabelVariantProps\n\n/**\n * A component to provide a global label for a group of related elements in a form (for accessibility).\n * @memberof Fieldset\n * @see https://cerberus.digitalu.com/react/fieldset\n * @description [A11y Form Checklist](https://www.a11yproject.com/checklist/#forms)\n * @description [MDN Web Docs: Legend](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/legend)\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 *          <Label htmlFor=\"yes\">Yes</Label>\n *        </Field>\n *      </Hstack>\n *      <Hstack>\n *        <Field>\n *         <Radio id=\"no\" name=\"cats\" value=\"no\" />\n *         <Label htmlFor=\"no\">No</Label>\n *        </Field>\n *      </Hstack>\n *     </Fieldset>\n *    </form>\n *   )\n * }\n * ```\n */\nexport function Legend(props: LegendProps) {\n  const { size, ...nativeProps } = props\n  const { invalid, ...formState } = useFieldContext()\n\n  return (\n    <legend\n      {...nativeProps}\n      {...formState}\n      {...(invalid && { 'aria-invalid': true })}\n      className={cx(\n        nativeProps.className,\n        hstack({\n          justify: 'space-between',\n          w: 'full',\n        }),\n        label({\n          size,\n        }),\n      )}\n    >\n      {nativeProps.children}\n      <Show when={formState.required}>\n        <span\n          className={css({\n            color: 'page.text.100',\n            fontSize: 'inherit',\n          })}\n        >\n          (required)\n        </span>\n      </Show>\n    </legend>\n  )\n}\n"],"mappings":";;;;;;;;AAEA,SAAS,KAAK,UAAU;AAIxB;AAAA,EACE;AAAA,OAEK;AACP,SAAS,cAAc;AAgDnB,SAiBI,KAjBJ;AALG,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,MAAM,GAAG,YAAY,IAAI;AACjC,QAAM,EAAE,SAAS,GAAG,UAAU,IAAI,gBAAgB;AAElD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,MACvC,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,OAAO;AAAA,UACL,SAAS;AAAA,UACT,GAAG;AAAA,QACL,CAAC;AAAA,QACD,MAAM;AAAA,UACJ;AAAA,QACF,CAAC;AAAA,MACH;AAAA,MAEC;AAAA,oBAAY;AAAA,QACb,oBAAC,QAAK,MAAM,UAAU,UACpB;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-LKFXUM3Z.js → chunk-77LI5SP3.js}

@@ -1,6 +1,12 @@
 import {
   Portal
 } from "./chunk-GLY7GU5S.js";
+import {
+  Modal
+} from "./chunk-BE4EOU2P.js";
+import {
+  ModalDescription
+} from "./chunk-Q7BRMIBR.js";
 import {
   ModalHeader
 } from "./chunk-WLEX22KS.js";
@@ -12,13 +18,7 @@ import {
 } from "./chunk-WZOYPFUU.js";
 import {
   Label
-} from "./chunk-I35HMGJQ.js";
-import {
-  Modal
-} from "./chunk-BE4EOU2P.js";
-import {
-  ModalDescription
-} from "./chunk-Q7BRMIBR.js";
+} from "./chunk-NMF2HYWO.js";
 import {
   Avatar
 } from "./chunk-477G5ZEL.js";
@@ -229,4 +229,4 @@ export {
   PromptModal,
   usePromptModal
 };
-//# sourceMappingURL=chunk-LKFXUM3Z.js.map
+//# sourceMappingURL=chunk-77LI5SP3.js.map

package/build/modern/{chunk-6YUB3ITX.js → chunk-BGBCJ2W2.js}

@@ -1,18 +1,18 @@
 import {
   Portal
 } from "./chunk-GLY7GU5S.js";
-import {
-  ModalHeader
-} from "./chunk-WLEX22KS.js";
-import {
-  ModalHeading
-} from "./chunk-2UXE5PDG.js";
 import {
   Modal
 } from "./chunk-BE4EOU2P.js";
 import {
   ModalDescription
 } from "./chunk-Q7BRMIBR.js";
+import {
+  ModalHeader
+} from "./chunk-WLEX22KS.js";
+import {
+  ModalHeading
+} from "./chunk-2UXE5PDG.js";
 import {
   Avatar
 } from "./chunk-477G5ZEL.js";
@@ -176,4 +176,4 @@ export {
   ConfirmModal,
   useConfirmModal
 };
-//# sourceMappingURL=chunk-6YUB3ITX.js.map
+//# sourceMappingURL=chunk-BGBCJ2W2.js.map

package/build/modern/{chunk-I35HMGJQ.js → chunk-NMF2HYWO.js}

@@ -33,7 +33,7 @@ function Label(props) {
           "span",
           {
             className: css({
-              color: "inherit",
+              color: "page.text.100",
               fontSize: "inherit"
             }),
             children: "(required)"
@@ -47,4 +47,4 @@ function Label(props) {
 export {
   Label
 };
-//# sourceMappingURL=chunk-I35HMGJQ.js.map
+//# sourceMappingURL=chunk-NMF2HYWO.js.map

package/build/modern/{chunk-I35HMGJQ.js.map → chunk-NMF2HYWO.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/Label.tsx"],"sourcesContent":["'use client'\n\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\nimport { label, type LabelVariantProps } from '@cerberus/styled-system/recipes'\nimport { css, cx } 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 */\nexport interface LabelBaseProps extends HTMLAttributes<HTMLLabelElement> {\n  /**\n   * The unique identifier for the input element. Required for accessibility.\n   */\n  htmlFor: string\n  /**\n   * Used to hide the label from the UI while keeping it accessible to screen readers. Typically used for global search inputs that have no visible label.\n   */\n  hidden?: boolean\n}\nexport type LabelProps = LabelBaseProps & LabelVariantProps\n\n/**\n * A a11y compliant label component.\n * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)\n * @see https://cerberus.digitalu.design/react/label\n * @example\n * ```tsx\n * <Field required>\n *   <Label htmlFor=\"search\" hidden>Search everything</Label>\n *   <Input id=\"search\" startIcon={Search} type=\"text\" />\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      {...(disabled && { 'data-disabled': true })}\n      className={cx(\n        nativeProps.className,\n        label({ size, usage }),\n        hstack({\n          justify: 'space-between',\n          w: 'full',\n        }),\n      )}\n    >\n      {props.children}\n      <Show when={required}>\n        <span\n          className={css({\n            color: 'inherit',\n            fontSize: 'inherit',\n          })}\n        >\n          (required)\n        </span>\n      </Show>\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAqC;AAC9C,SAAS,KAAK,UAAU;AACxB,SAAS,cAAc;AAsCnB,SAcI,KAdJ;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,MACH,GAAI,YAAY,EAAE,iBAAiB,KAAK;AAAA,MACzC,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,MAAM,EAAE,MAAM,MAAM,CAAC;AAAA,QACrB,OAAO;AAAA,UACL,SAAS;AAAA,UACT,GAAG;AAAA,QACL,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":[]}
+{"version":3,"sources":["../../src/components/Label.tsx"],"sourcesContent":["'use client'\n\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\nimport { label, type LabelVariantProps } from '@cerberus/styled-system/recipes'\nimport { css, cx } 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 */\nexport interface LabelBaseProps extends HTMLAttributes<HTMLLabelElement> {\n  /**\n   * The unique identifier for the input element. Required for accessibility.\n   */\n  htmlFor: string\n  /**\n   * Used to hide the label from the UI while keeping it accessible to screen readers. Typically used for global search inputs that have no visible label.\n   */\n  hidden?: boolean\n}\nexport type LabelProps = LabelBaseProps & LabelVariantProps\n\n/**\n * A a11y compliant label component.\n * @definition [ARIA Forms](https://www.a11yproject.com/checklist/#forms)\n * @see https://cerberus.digitalu.design/react/label\n * @example\n * ```tsx\n * <Field required>\n *   <Label htmlFor=\"search\" hidden>Search everything</Label>\n *   <Input id=\"search\" startIcon={Search} type=\"text\" />\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      {...(disabled && { 'data-disabled': true })}\n      className={cx(\n        nativeProps.className,\n        label({ size, usage }),\n        hstack({\n          justify: 'space-between',\n          w: 'full',\n        }),\n      )}\n    >\n      {props.children}\n      <Show when={required}>\n        <span\n          className={css({\n            color: 'page.text.100',\n            fontSize: 'inherit',\n          })}\n        >\n          (required)\n        </span>\n      </Show>\n    </label>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,aAAqC;AAC9C,SAAS,KAAK,UAAU;AACxB,SAAS,cAAc;AAsCnB,SAcI,KAdJ;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,MACH,GAAI,YAAY,EAAE,iBAAiB,KAAK;AAAA,MACzC,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,MAAM,EAAE,MAAM,MAAM,CAAC;AAAA,QACrB,OAAO;AAAA,UACL,SAAS;AAAA,UACT,GAAG;AAAA,QACL,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-PZAZKQMO.js

@@ -0,0 +1,25 @@
+// src/components/FieldsetLabel.tsx
+import { cx } from "@cerberus/styled-system/css";
+import { label } from "@cerberus/styled-system/recipes";
+import { jsx } from "react/jsx-runtime";
+function FieldsetLabel(props) {
+  const { size, usage, ...nativeProps } = props;
+  return /* @__PURE__ */ jsx(
+    "label",
+    {
+      ...nativeProps,
+      className: cx(
+        nativeProps.className,
+        label({
+          size,
+          usage
+        })
+      )
+    }
+  );
+}
+
+export {
+  FieldsetLabel
+};
+//# sourceMappingURL=chunk-PZAZKQMO.js.map

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

@@ -0,0 +1 @@
+{"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 './Label'\n\n/**\n * This module contains the FieldsetLabel component.\n * @module FieldsetLabel\n */\n\nexport type FieldsetLabelProps = LabelProps & LabelVariantProps\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;AA8C1C;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/{chunk-EZNGCXVJ.js → chunk-SP6O64KQ.js}

@@ -1,6 +1,3 @@
-import {
-  Portal
-} from "./chunk-GLY7GU5S.js";
 import {
   Notification
 } from "./chunk-CMUFJU4S.js";
@@ -10,6 +7,9 @@ import {
 import {
   NotificationHeading
 } from "./chunk-SXIXDXG3.js";
+import {
+  Portal
+} from "./chunk-GLY7GU5S.js";
 import {
   Button
 } from "./chunk-EXGKZGML.js";
@@ -159,4 +159,4 @@ export {
   NotificationCenter,
   useNotificationCenter
 };
-//# sourceMappingURL=chunk-EZNGCXVJ.js.map
+//# sourceMappingURL=chunk-SP6O64KQ.js.map

package/build/modern/components/Fieldset.js

@@ -0,0 +1,9 @@
+"use client";
+import {
+  Fieldset
+} from "../chunk-3ZDFQO25.js";
+import "../chunk-UZDVOIW5.js";
+export {
+  Fieldset
+};
+//# sourceMappingURL=Fieldset.js.map

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

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

package/build/modern/components/FieldsetLabel.js

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

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

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

package/build/modern/components/Label.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   Label
-} from "../chunk-I35HMGJQ.js";
+} from "../chunk-NMF2HYWO.js";
 import "../chunk-UZDVOIW5.js";
 import "../chunk-BUVVRQLZ.js";
 export {

package/build/modern/components/Legend.js

@@ -0,0 +1,10 @@
+"use client";
+import {
+  Legend
+} from "../chunk-6TTN2JMY.js";
+import "../chunk-UZDVOIW5.js";
+import "../chunk-BUVVRQLZ.js";
+export {
+  Legend
+};
+//# sourceMappingURL=Legend.js.map

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

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

package/build/modern/context/confirm-modal.js

@@ -2,12 +2,12 @@
 import {
   ConfirmModal,
   useConfirmModal
-} from "../chunk-6YUB3ITX.js";
+} from "../chunk-BGBCJ2W2.js";
 import "../chunk-GLY7GU5S.js";
-import "../chunk-WLEX22KS.js";
-import "../chunk-2UXE5PDG.js";
 import "../chunk-BE4EOU2P.js";
 import "../chunk-Q7BRMIBR.js";
+import "../chunk-WLEX22KS.js";
+import "../chunk-2UXE5PDG.js";
 import "../chunk-477G5ZEL.js";
 import "../chunk-EXGKZGML.js";
 import "../chunk-BUVVRQLZ.js";

package/build/modern/context/notification-center.js

@@ -2,11 +2,11 @@
 import {
   NotificationCenter,
   useNotificationCenter
-} from "../chunk-EZNGCXVJ.js";
-import "../chunk-GLY7GU5S.js";
+} from "../chunk-SP6O64KQ.js";
 import "../chunk-CMUFJU4S.js";
 import "../chunk-XEW6TJJ4.js";
 import "../chunk-SXIXDXG3.js";
+import "../chunk-GLY7GU5S.js";
 import "../chunk-EXGKZGML.js";
 import "../chunk-BUVVRQLZ.js";
 import "../chunk-JIZQFTW6.js";

package/build/modern/context/prompt-modal.js

@@ -2,14 +2,14 @@
 import {
   PromptModal,
   usePromptModal
-} from "../chunk-LKFXUM3Z.js";
+} from "../chunk-77LI5SP3.js";
 import "../chunk-GLY7GU5S.js";
+import "../chunk-BE4EOU2P.js";
+import "../chunk-Q7BRMIBR.js";
 import "../chunk-WLEX22KS.js";
 import "../chunk-2UXE5PDG.js";
 import "../chunk-WZOYPFUU.js";
-import "../chunk-I35HMGJQ.js";
-import "../chunk-BE4EOU2P.js";
-import "../chunk-Q7BRMIBR.js";
+import "../chunk-NMF2HYWO.js";
 import "../chunk-477G5ZEL.js";
 import "../chunk-EXGKZGML.js";
 import "../chunk-UZDVOIW5.js";

package/build/modern/index.js

@@ -1,22 +1,40 @@
+import {
+  NotificationCenter,
+  useNotificationCenter
+} from "./chunk-SP6O64KQ.js";
+import {
+  PromptModal,
+  usePromptModal
+} from "./chunk-77LI5SP3.js";
 import {
   ThemeProvider,
   useThemeContext
 } from "./chunk-EB37HRCN.js";
+import {
+  Textarea
+} from "./chunk-JIJM6JFJ.js";
+import {
+  Th
+} from "./chunk-7K6PZBHN.js";
+import {
+  Thead
+} from "./chunk-PKY46RRA.js";
 import {
   Toggle
 } from "./chunk-GMG3B34U.js";
 import {
   ConfirmModal,
   useConfirmModal
-} from "./chunk-6YUB3ITX.js";
+} from "./chunk-BGBCJ2W2.js";
 import {
-  NotificationCenter,
-  useNotificationCenter
-} from "./chunk-EZNGCXVJ.js";
+  Spinner
+} from "./chunk-7SYJFI5E.js";
 import {
-  PromptModal,
-  usePromptModal
-} from "./chunk-LKFXUM3Z.js";
+  Tab
+} from "./chunk-SLF6SIPB.js";
+import {
+  TabList
+} from "./chunk-UKPF7JOB.js";
 import {
   TabPanel
 } from "./chunk-AYIRV5CL.js";
@@ -34,14 +52,14 @@ import {
   Td
 } from "./chunk-HPM2XRWT.js";
 import {
-  Textarea
-} from "./chunk-JIJM6JFJ.js";
+  Notification
+} from "./chunk-CMUFJU4S.js";
 import {
-  Th
-} from "./chunk-7K6PZBHN.js";
+  NotificationDescription
+} from "./chunk-XEW6TJJ4.js";
 import {
-  Thead
-} from "./chunk-PKY46RRA.js";
+  NotificationHeading
+} from "./chunk-SXIXDXG3.js";
 import {
   Portal
 } from "./chunk-GLY7GU5S.js";
@@ -53,14 +71,14 @@ import {
   Select
 } from "./chunk-O6JYYVO7.js";
 import {
-  Spinner
-} from "./chunk-7SYJFI5E.js";
+  Legend
+} from "./chunk-6TTN2JMY.js";
 import {
-  Tab
-} from "./chunk-SLF6SIPB.js";
+  Modal
+} from "./chunk-BE4EOU2P.js";
 import {
-  TabList
-} from "./chunk-UKPF7JOB.js";
+  ModalDescription
+} from "./chunk-Q7BRMIBR.js";
 import {
   ModalHeader
 } from "./chunk-WLEX22KS.js";
@@ -82,14 +100,11 @@ import {
   useNavMenuContext
 } from "./chunk-O75QAT4Z.js";
 import {
-  Notification
-} from "./chunk-CMUFJU4S.js";
+  Fieldset
+} from "./chunk-3ZDFQO25.js";
 import {
-  NotificationDescription
-} from "./chunk-XEW6TJJ4.js";
-import {
-  NotificationHeading
-} from "./chunk-SXIXDXG3.js";
+  FieldsetLabel
+} from "./chunk-PZAZKQMO.js";
 import {
   FileStatus,
   processStatus
@@ -111,13 +126,7 @@ import {
 } from "./chunk-WZOYPFUU.js";
 import {
   Label
-} from "./chunk-I35HMGJQ.js";
-import {
-  Modal
-} from "./chunk-BE4EOU2P.js";
-import {
-  ModalDescription
-} from "./chunk-Q7BRMIBR.js";
+} from "./chunk-NMF2HYWO.js";
 import {
   MODE_KEY,
   THEME_KEY,
@@ -194,11 +203,14 @@ export {
   FeatureFlags,
   Field,
   FieldMessage,
+  Fieldset,
+  FieldsetLabel,
   FileStatus,
   FileUploader,
   IconButton,
   Input,
   Label,
+  Legend,
   MODE_KEY,
   Modal,
   ModalDescription,