@cerberus-design/react 0.5.2-next-f5feb6d → 0.5.2-next-94987e7

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

@@ -1,6 +1,7 @@
 import type { AnchorHTMLAttributes } from 'react';
 import { button } from '@cerberus/styled-system/recipes';
 import { ButtonHTMLAttributes } from 'react';
+import { CarbonIconType } from '@cerberus/icons';
 import { Context } from 'react';
 import { ElementType } from 'react';
 import { fieldMessage } from '@cerberus/styled-system/recipes';
@@ -19,6 +20,10 @@ import { RefObject } from 'react';
 import { tag } from '@cerberus/styled-system/recipes';
 import type { TextareaHTMLAttributes } from 'react';
 
+declare let $cerberusIcons: DefinedIcons;
+export { $cerberusIcons }
+export { $cerberusIcons as $cerberusIcons_alias_1 }
+
 /**
  * A component that allows the user to perform actions
  * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx
@@ -57,10 +62,20 @@ declare type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K;
 export { CustomThemes }
 export { CustomThemes as CustomThemes_alias_1 }
 
+export declare const defaultIcons: DefinedIcons;
+
 declare type DefaultThemes = 'cerberus';
 export { DefaultThemes }
 export { DefaultThemes as DefaultThemes_alias_1 }
 
+export declare interface DefinedIcons {
+    invalid: CarbonIconType | ElementType;
+}
+
+declare function defineIcons(icons: DefinedIcons): DefinedIcons;
+export { defineIcons }
+export { defineIcons as defineIcons_alias_1 }
+
 declare function Field(props: PropsWithChildren<FieldContextValue>): JSX.Element;
 export { Field }
 export { Field as Field_alias_1 }

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

@@ -1,12 +1,14 @@
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
 import {
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
+  $cerberusIcons
+} from "./chunk-LQD23PG3.js";
 
 // src/components/Input.tsx
-import { WarningFilled } from "@cerberus/icons";
 import { input } from "@cerberus/styled-system/recipes";
 import { cx } from "@cerberus/styled-system/css";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -15,6 +17,7 @@ function Input(props) {
   const inputStyles = input({ size });
   const { invalid, ...fieldStates } = useFieldContext();
   const hasEndIcon = Boolean(endIcon);
+  const { invalid: InvalidIcon } = $cerberusIcons;
   return /* @__PURE__ */ jsxs("div", { className: inputStyles.root, children: [
     /* @__PURE__ */ jsx(Show, { when: Boolean(startIcon), children: /* @__PURE__ */ jsx("span", { className: inputStyles.startIcon, children: startIcon }) }),
     /* @__PURE__ */ jsx(
@@ -28,7 +31,7 @@ function Input(props) {
         className: cx("peer", nativeProps.className, inputStyles.input)
       }
     ),
-    /* @__PURE__ */ jsx(Show, { when: invalid, children: /* @__PURE__ */ jsx(WarningFilled, { className: inputStyles.icon }) }),
+    /* @__PURE__ */ jsx(Show, { when: invalid, children: /* @__PURE__ */ jsx(InvalidIcon, { className: inputStyles.icon }) }),
     /* @__PURE__ */ jsx(Show, { when: hasEndIcon && !invalid, children: /* @__PURE__ */ jsx("span", { className: inputStyles.icon, children: endIcon }) })
   ] });
 }
@@ -36,4 +39,4 @@ function Input(props) {
 export {
   Input
 };
-//# sourceMappingURL=chunk-PEWG443T.js.map
+//# sourceMappingURL=chunk-AAKHV2IO.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Input.tsx"],"sourcesContent":["'use client'\n\nimport type { InputHTMLAttributes, ReactNode } from 'react'\nimport { input } from '@cerberus/styled-system/recipes'\nimport { cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport { $cerberusIcons } from '../config/defineIcons'\nimport { Show } from './Show'\n\nexport type InputRecipeProps = RecipeVariantProps<typeof input>\nexport interface InputBaseProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'size'> {\n  describedBy?: string\n  id: string\n  startIcon?: ReactNode\n  endIcon?: ReactNode\n}\nexport type InputProps = InputBaseProps & InputRecipeProps\n\nexport function Input(props: InputProps) {\n  const { describedBy, size, startIcon, endIcon, ...nativeProps } = props\n  const inputStyles = input({ size })\n  const { invalid, ...fieldStates } = useFieldContext()\n  const hasEndIcon = Boolean(endIcon)\n  const { invalid: InvalidIcon } = $cerberusIcons\n\n  return (\n    <div className={inputStyles.root}>\n      <Show when={Boolean(startIcon)}>\n        <span className={inputStyles.startIcon}>{startIcon}</span>\n      </Show>\n\n      <input\n        {...nativeProps}\n        {...fieldStates}\n        {...(describedBy && { 'aria-describedby': describedBy })}\n        {...(invalid && { 'aria-invalid': true })}\n        data-start-icon={Boolean(startIcon)}\n        className={cx('peer', nativeProps.className, inputStyles.input)}\n      />\n\n      <Show when={invalid}>\n        <InvalidIcon className={inputStyles.icon} />\n      </Show>\n      <Show when={hasEndIcon && !invalid}>\n        <span className={inputStyles.icon}>{endIcon}</span>\n      </Show>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAGA,SAAS,aAAa;AACtB,SAAS,UAAmC;AAuBxC,SAEI,KAFJ;AARG,SAAS,MAAM,OAAmB;AACvC,QAAM,EAAE,aAAa,MAAM,WAAW,SAAS,GAAG,YAAY,IAAI;AAClE,QAAM,cAAc,MAAM,EAAE,KAAK,CAAC;AAClC,QAAM,EAAE,SAAS,GAAG,YAAY,IAAI,gBAAgB;AACpD,QAAM,aAAa,QAAQ,OAAO;AAClC,QAAM,EAAE,SAAS,YAAY,IAAI;AAEjC,SACE,qBAAC,SAAI,WAAW,YAAY,MAC1B;AAAA,wBAAC,QAAK,MAAM,QAAQ,SAAS,GAC3B,8BAAC,UAAK,WAAW,YAAY,WAAY,qBAAU,GACrD;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAI,eAAe,EAAE,oBAAoB,YAAY;AAAA,QACrD,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,QACvC,mBAAiB,QAAQ,SAAS;AAAA,QAClC,WAAW,GAAG,QAAQ,YAAY,WAAW,YAAY,KAAK;AAAA;AAAA,IAChE;AAAA,IAEA,oBAAC,QAAK,MAAM,SACV,8BAAC,eAAY,WAAW,YAAY,MAAM,GAC5C;AAAA,IACA,oBAAC,QAAK,MAAM,cAAc,CAAC,SACzB,8BAAC,UAAK,WAAW,YAAY,MAAO,mBAAQ,GAC9C;AAAA,KACF;AAEJ;","names":[]}

package/build/legacy/chunk-LQD23PG3.js

@@ -0,0 +1,24 @@
+import {
+  defaultIcons
+} from "./chunk-RK5HK6UU.js";
+
+// src/config/defineIcons.ts
+function _validateIconsProperties(icons) {
+  if (!icons.invalid) {
+    throw new Error(
+      "The an invalid property must be defined in your custom icons library."
+    );
+  }
+}
+function defineIcons(icons) {
+  _validateIconsProperties(icons);
+  $cerberusIcons = icons;
+  return $cerberusIcons;
+}
+var $cerberusIcons = defaultIcons;
+
+export {
+  defineIcons,
+  $cerberusIcons
+};
+//# sourceMappingURL=chunk-LQD23PG3.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/config/defineIcons.ts"],"sourcesContent":["import { defaultIcons, type DefinedIcons } from './cerbIcons'\n\nfunction _validateIconsProperties(icons: DefinedIcons) {\n  if (!icons.invalid) {\n    throw new Error(\n      'The an invalid property must be defined in your custom icons library.',\n    )\n  }\n}\n\nexport function defineIcons(icons: DefinedIcons): DefinedIcons {\n  _validateIconsProperties(icons)\n  $cerberusIcons = icons\n  return $cerberusIcons\n}\n\n// Default icons\n\nexport let $cerberusIcons: DefinedIcons = defaultIcons\n"],"mappings":";;;;;AAEA,SAAS,yBAAyB,OAAqB;AACrD,MAAI,CAAC,MAAM,SAAS;AAClB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;AAEO,SAAS,YAAY,OAAmC;AAC7D,2BAAyB,KAAK;AAC9B,mBAAiB;AACjB,SAAO;AACT;AAIO,IAAI,iBAA+B;","names":[]}

package/build/legacy/chunk-RK5HK6UU.js

@@ -0,0 +1,10 @@
+// src/config/cerbIcons.ts
+import { WarningFilled } from "@cerberus/icons";
+var defaultIcons = {
+  invalid: WarningFilled
+};
+
+export {
+  defaultIcons
+};
+//# sourceMappingURL=chunk-RK5HK6UU.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/config/cerbIcons.ts"],"sourcesContent":["import { WarningFilled, type CarbonIconType } from '@cerberus/icons'\nimport type { ElementType } from 'react'\n\nexport interface DefinedIcons {\n  invalid: CarbonIconType | ElementType\n}\n\nexport const defaultIcons: DefinedIcons = {\n  invalid: WarningFilled,\n}\n"],"mappings":";AAAA,SAAS,qBAA0C;AAO5C,IAAM,eAA6B;AAAA,EACxC,SAAS;AACX;","names":[]}

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

@@ -1,9 +1,9 @@
-import {
-  Show
-} from "./chunk-4O4QFF4S.js";
 import {
   useFieldContext
 } from "./chunk-ZAU4JVLL.js";
+import {
+  Show
+} from "./chunk-4O4QFF4S.js";
 
 // src/components/Label.tsx
 import { label } from "@cerberus/styled-system/recipes";
@@ -45,4 +45,4 @@ function Label(props) {
 export {
   Label
 };
-//# sourceMappingURL=chunk-CINUA3C7.js.map
+//# sourceMappingURL=chunk-V4SA6GNO.js.map

package/build/legacy/components/Input.js

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

package/build/legacy/components/Label.js

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

package/build/legacy/config/cerbIcons.js

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

package/build/legacy/config/cerbIcons.js.map

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

package/build/legacy/config/defineIcons.js

@@ -0,0 +1,10 @@
+import {
+  $cerberusIcons,
+  defineIcons
+} from "../chunk-LQD23PG3.js";
+import "../chunk-RK5HK6UU.js";
+export {
+  $cerberusIcons,
+  defineIcons
+};
+//# sourceMappingURL=defineIcons.js.map

package/build/legacy/config/defineIcons.js.map

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

package/build/legacy/index.js

@@ -1,3 +1,9 @@
+import {
+  Tab
+} from "./chunk-YA2UV2AB.js";
+import {
+  TabList
+} from "./chunk-5GSXIYD3.js";
 import {
   TabPanel
 } from "./chunk-YJCWUN33.js";
@@ -7,12 +13,22 @@ import {
 import {
   Textarea
 } from "./chunk-TCO46FK7.js";
+import {
+  FieldMessage
+} from "./chunk-VGHVH2T3.js";
+import {
+  IconButton
+} from "./chunk-SLHX5K6I.js";
 import {
   Input
-} from "./chunk-PEWG443T.js";
+} from "./chunk-AAKHV2IO.js";
 import {
   Label
-} from "./chunk-CINUA3C7.js";
+} from "./chunk-V4SA6GNO.js";
+import {
+  Field,
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import {
   NavMenuLink
 } from "./chunk-6DIGPXAD.js";
@@ -30,12 +46,6 @@ import {
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
-import {
-  Tab
-} from "./chunk-YA2UV2AB.js";
-import {
-  TabList
-} from "./chunk-5GSXIYD3.js";
 import "./chunk-55J6XMHW.js";
 import {
   createNavTriggerProps
@@ -48,6 +58,11 @@ import {
   TabsContext,
   useTabsContext
 } from "./chunk-DQOYTLGB.js";
+import {
+  $cerberusIcons,
+  defineIcons
+} from "./chunk-LQD23PG3.js";
+import "./chunk-RK5HK6UU.js";
 import {
   MODE_KEY,
   THEME_KEY,
@@ -58,17 +73,8 @@ import {
 import {
   Button
 } from "./chunk-2ATICEW3.js";
-import {
-  FieldMessage
-} from "./chunk-VGHVH2T3.js";
-import {
-  Field,
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
-import {
-  IconButton
-} from "./chunk-SLHX5K6I.js";
 export {
+  $cerberusIcons,
   Button,
   Field,
   FieldMessage,
@@ -91,6 +97,7 @@ export {
   Textarea,
   ThemeProvider,
   createNavTriggerProps,
+  defineIcons,
   getPosition,
   useFieldContext,
   useNavMenuContext,

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

@@ -1,6 +1,7 @@
 import type { AnchorHTMLAttributes } from 'react';
 import { button } from '@cerberus/styled-system/recipes';
 import { ButtonHTMLAttributes } from 'react';
+import { CarbonIconType } from '@cerberus/icons';
 import { Context } from 'react';
 import { ElementType } from 'react';
 import { fieldMessage } from '@cerberus/styled-system/recipes';
@@ -19,6 +20,10 @@ import { RefObject } from 'react';
 import { tag } from '@cerberus/styled-system/recipes';
 import type { TextareaHTMLAttributes } from 'react';
 
+declare let $cerberusIcons: DefinedIcons;
+export { $cerberusIcons }
+export { $cerberusIcons as $cerberusIcons_alias_1 }
+
 /**
  * A component that allows the user to perform actions
  * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx
@@ -57,10 +62,20 @@ declare type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K;
 export { CustomThemes }
 export { CustomThemes as CustomThemes_alias_1 }
 
+export declare const defaultIcons: DefinedIcons;
+
 declare type DefaultThemes = 'cerberus';
 export { DefaultThemes }
 export { DefaultThemes as DefaultThemes_alias_1 }
 
+export declare interface DefinedIcons {
+    invalid: CarbonIconType | ElementType;
+}
+
+declare function defineIcons(icons: DefinedIcons): DefinedIcons;
+export { defineIcons }
+export { defineIcons as defineIcons_alias_1 }
+
 declare function Field(props: PropsWithChildren<FieldContextValue>): JSX.Element;
 export { Field }
 export { Field as Field_alias_1 }

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

@@ -1,12 +1,14 @@
+import {
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
 import {
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
+  $cerberusIcons
+} from "./chunk-LQD23PG3.js";
 
 // src/components/Input.tsx
-import { WarningFilled } from "@cerberus/icons";
 import { input } from "@cerberus/styled-system/recipes";
 import { cx } from "@cerberus/styled-system/css";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -15,6 +17,7 @@ function Input(props) {
   const inputStyles = input({ size });
   const { invalid, ...fieldStates } = useFieldContext();
   const hasEndIcon = Boolean(endIcon);
+  const { invalid: InvalidIcon } = $cerberusIcons;
   return /* @__PURE__ */ jsxs("div", { className: inputStyles.root, children: [
     /* @__PURE__ */ jsx(Show, { when: Boolean(startIcon), children: /* @__PURE__ */ jsx("span", { className: inputStyles.startIcon, children: startIcon }) }),
     /* @__PURE__ */ jsx(
@@ -28,7 +31,7 @@ function Input(props) {
         className: cx("peer", nativeProps.className, inputStyles.input)
       }
     ),
-    /* @__PURE__ */ jsx(Show, { when: invalid, children: /* @__PURE__ */ jsx(WarningFilled, { className: inputStyles.icon }) }),
+    /* @__PURE__ */ jsx(Show, { when: invalid, children: /* @__PURE__ */ jsx(InvalidIcon, { className: inputStyles.icon }) }),
     /* @__PURE__ */ jsx(Show, { when: hasEndIcon && !invalid, children: /* @__PURE__ */ jsx("span", { className: inputStyles.icon, children: endIcon }) })
   ] });
 }
@@ -36,4 +39,4 @@ function Input(props) {
 export {
   Input
 };
-//# sourceMappingURL=chunk-PEWG443T.js.map
+//# sourceMappingURL=chunk-AAKHV2IO.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Input.tsx"],"sourcesContent":["'use client'\n\nimport type { InputHTMLAttributes, ReactNode } from 'react'\nimport { input } from '@cerberus/styled-system/recipes'\nimport { cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport { $cerberusIcons } from '../config/defineIcons'\nimport { Show } from './Show'\n\nexport type InputRecipeProps = RecipeVariantProps<typeof input>\nexport interface InputBaseProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'size'> {\n  describedBy?: string\n  id: string\n  startIcon?: ReactNode\n  endIcon?: ReactNode\n}\nexport type InputProps = InputBaseProps & InputRecipeProps\n\nexport function Input(props: InputProps) {\n  const { describedBy, size, startIcon, endIcon, ...nativeProps } = props\n  const inputStyles = input({ size })\n  const { invalid, ...fieldStates } = useFieldContext()\n  const hasEndIcon = Boolean(endIcon)\n  const { invalid: InvalidIcon } = $cerberusIcons\n\n  return (\n    <div className={inputStyles.root}>\n      <Show when={Boolean(startIcon)}>\n        <span className={inputStyles.startIcon}>{startIcon}</span>\n      </Show>\n\n      <input\n        {...nativeProps}\n        {...fieldStates}\n        {...(describedBy && { 'aria-describedby': describedBy })}\n        {...(invalid && { 'aria-invalid': true })}\n        data-start-icon={Boolean(startIcon)}\n        className={cx('peer', nativeProps.className, inputStyles.input)}\n      />\n\n      <Show when={invalid}>\n        <InvalidIcon className={inputStyles.icon} />\n      </Show>\n      <Show when={hasEndIcon && !invalid}>\n        <span className={inputStyles.icon}>{endIcon}</span>\n      </Show>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAGA,SAAS,aAAa;AACtB,SAAS,UAAmC;AAuBxC,SAEI,KAFJ;AARG,SAAS,MAAM,OAAmB;AACvC,QAAM,EAAE,aAAa,MAAM,WAAW,SAAS,GAAG,YAAY,IAAI;AAClE,QAAM,cAAc,MAAM,EAAE,KAAK,CAAC;AAClC,QAAM,EAAE,SAAS,GAAG,YAAY,IAAI,gBAAgB;AACpD,QAAM,aAAa,QAAQ,OAAO;AAClC,QAAM,EAAE,SAAS,YAAY,IAAI;AAEjC,SACE,qBAAC,SAAI,WAAW,YAAY,MAC1B;AAAA,wBAAC,QAAK,MAAM,QAAQ,SAAS,GAC3B,8BAAC,UAAK,WAAW,YAAY,WAAY,qBAAU,GACrD;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAI,eAAe,EAAE,oBAAoB,YAAY;AAAA,QACrD,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,QACvC,mBAAiB,QAAQ,SAAS;AAAA,QAClC,WAAW,GAAG,QAAQ,YAAY,WAAW,YAAY,KAAK;AAAA;AAAA,IAChE;AAAA,IAEA,oBAAC,QAAK,MAAM,SACV,8BAAC,eAAY,WAAW,YAAY,MAAM,GAC5C;AAAA,IACA,oBAAC,QAAK,MAAM,cAAc,CAAC,SACzB,8BAAC,UAAK,WAAW,YAAY,MAAO,mBAAQ,GAC9C;AAAA,KACF;AAEJ;","names":[]}

package/build/modern/chunk-LQD23PG3.js

@@ -0,0 +1,24 @@
+import {
+  defaultIcons
+} from "./chunk-RK5HK6UU.js";
+
+// src/config/defineIcons.ts
+function _validateIconsProperties(icons) {
+  if (!icons.invalid) {
+    throw new Error(
+      "The an invalid property must be defined in your custom icons library."
+    );
+  }
+}
+function defineIcons(icons) {
+  _validateIconsProperties(icons);
+  $cerberusIcons = icons;
+  return $cerberusIcons;
+}
+var $cerberusIcons = defaultIcons;
+
+export {
+  defineIcons,
+  $cerberusIcons
+};
+//# sourceMappingURL=chunk-LQD23PG3.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/config/defineIcons.ts"],"sourcesContent":["import { defaultIcons, type DefinedIcons } from './cerbIcons'\n\nfunction _validateIconsProperties(icons: DefinedIcons) {\n  if (!icons.invalid) {\n    throw new Error(\n      'The an invalid property must be defined in your custom icons library.',\n    )\n  }\n}\n\nexport function defineIcons(icons: DefinedIcons): DefinedIcons {\n  _validateIconsProperties(icons)\n  $cerberusIcons = icons\n  return $cerberusIcons\n}\n\n// Default icons\n\nexport let $cerberusIcons: DefinedIcons = defaultIcons\n"],"mappings":";;;;;AAEA,SAAS,yBAAyB,OAAqB;AACrD,MAAI,CAAC,MAAM,SAAS;AAClB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;AAEO,SAAS,YAAY,OAAmC;AAC7D,2BAAyB,KAAK;AAC9B,mBAAiB;AACjB,SAAO;AACT;AAIO,IAAI,iBAA+B;","names":[]}

package/build/modern/chunk-RK5HK6UU.js

@@ -0,0 +1,10 @@
+// src/config/cerbIcons.ts
+import { WarningFilled } from "@cerberus/icons";
+var defaultIcons = {
+  invalid: WarningFilled
+};
+
+export {
+  defaultIcons
+};
+//# sourceMappingURL=chunk-RK5HK6UU.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/config/cerbIcons.ts"],"sourcesContent":["import { WarningFilled, type CarbonIconType } from '@cerberus/icons'\nimport type { ElementType } from 'react'\n\nexport interface DefinedIcons {\n  invalid: CarbonIconType | ElementType\n}\n\nexport const defaultIcons: DefinedIcons = {\n  invalid: WarningFilled,\n}\n"],"mappings":";AAAA,SAAS,qBAA0C;AAO5C,IAAM,eAA6B;AAAA,EACxC,SAAS;AACX;","names":[]}

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

@@ -1,9 +1,9 @@
-import {
-  Show
-} from "./chunk-4O4QFF4S.js";
 import {
   useFieldContext
 } from "./chunk-ZAU4JVLL.js";
+import {
+  Show
+} from "./chunk-4O4QFF4S.js";
 
 // src/components/Label.tsx
 import { label } from "@cerberus/styled-system/recipes";
@@ -45,4 +45,4 @@ function Label(props) {
 export {
   Label
 };
-//# sourceMappingURL=chunk-CINUA3C7.js.map
+//# sourceMappingURL=chunk-V4SA6GNO.js.map

package/build/modern/components/Input.js

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

package/build/modern/components/Label.js

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

package/build/modern/config/cerbIcons.js

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

package/build/modern/config/cerbIcons.js.map

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

package/build/modern/config/defineIcons.js

@@ -0,0 +1,10 @@
+import {
+  $cerberusIcons,
+  defineIcons
+} from "../chunk-LQD23PG3.js";
+import "../chunk-RK5HK6UU.js";
+export {
+  $cerberusIcons,
+  defineIcons
+};
+//# sourceMappingURL=defineIcons.js.map

package/build/modern/config/defineIcons.js.map

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

package/build/modern/index.js

@@ -1,3 +1,9 @@
+import {
+  Tab
+} from "./chunk-SUP7U42W.js";
+import {
+  TabList
+} from "./chunk-5GSXIYD3.js";
 import {
   TabPanel
 } from "./chunk-YJCWUN33.js";
@@ -7,12 +13,22 @@ import {
 import {
   Textarea
 } from "./chunk-TCO46FK7.js";
+import {
+  FieldMessage
+} from "./chunk-VGHVH2T3.js";
+import {
+  IconButton
+} from "./chunk-SLHX5K6I.js";
 import {
   Input
-} from "./chunk-PEWG443T.js";
+} from "./chunk-AAKHV2IO.js";
 import {
   Label
-} from "./chunk-CINUA3C7.js";
+} from "./chunk-V4SA6GNO.js";
+import {
+  Field,
+  useFieldContext
+} from "./chunk-ZAU4JVLL.js";
 import {
   NavMenuLink
 } from "./chunk-6DIGPXAD.js";
@@ -30,12 +46,6 @@ import {
 import {
   Show
 } from "./chunk-4O4QFF4S.js";
-import {
-  Tab
-} from "./chunk-SUP7U42W.js";
-import {
-  TabList
-} from "./chunk-5GSXIYD3.js";
 import "./chunk-55J6XMHW.js";
 import {
   createNavTriggerProps
@@ -48,6 +58,11 @@ import {
   TabsContext,
   useTabsContext
 } from "./chunk-DQOYTLGB.js";
+import {
+  $cerberusIcons,
+  defineIcons
+} from "./chunk-LQD23PG3.js";
+import "./chunk-RK5HK6UU.js";
 import {
   MODE_KEY,
   THEME_KEY,
@@ -58,17 +73,8 @@ import {
 import {
   Button
 } from "./chunk-2ATICEW3.js";
-import {
-  FieldMessage
-} from "./chunk-VGHVH2T3.js";
-import {
-  Field,
-  useFieldContext
-} from "./chunk-ZAU4JVLL.js";
-import {
-  IconButton
-} from "./chunk-SLHX5K6I.js";
 export {
+  $cerberusIcons,
   Button,
   Field,
   FieldMessage,
@@ -91,6 +97,7 @@ export {
   Textarea,
   ThemeProvider,
   createNavTriggerProps,
+  defineIcons,
   getPosition,
   useFieldContext,
   useNavMenuContext,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cerberus-design/react",
-  "version": "0.5.2-next-f5feb6d",
+  "version": "0.5.2-next-94987e7",
   "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-f5feb6d"
+    "@cerberus-design/styled-system": "0.5.2-next-94987e7"
   },
   "publishConfig": {
     "access": "public"

package/src/components/Input.tsx

@@ -1,10 +1,10 @@
 'use client'
 
 import type { InputHTMLAttributes, ReactNode } from 'react'
-import { WarningFilled } from '@cerberus/icons'
 import { input } from '@cerberus/styled-system/recipes'
 import { cx, type RecipeVariantProps } from '@cerberus/styled-system/css'
 import { useFieldContext } from '../context/field'
+import { $cerberusIcons } from '../config/defineIcons'
 import { Show } from './Show'
 
 export type InputRecipeProps = RecipeVariantProps<typeof input>
@@ -22,6 +22,7 @@ export function Input(props: InputProps) {
   const inputStyles = input({ size })
   const { invalid, ...fieldStates } = useFieldContext()
   const hasEndIcon = Boolean(endIcon)
+  const { invalid: InvalidIcon } = $cerberusIcons
 
   return (
     <div className={inputStyles.root}>
@@ -39,7 +40,7 @@ export function Input(props: InputProps) {
       />
 
       <Show when={invalid}>
-        <WarningFilled className={inputStyles.icon} />
+        <InvalidIcon className={inputStyles.icon} />
       </Show>
       <Show when={hasEndIcon && !invalid}>
         <span className={inputStyles.icon}>{endIcon}</span>

package/src/config/cerbIcons.ts

@@ -0,0 +1,10 @@
+import { WarningFilled, type CarbonIconType } from '@cerberus/icons'
+import type { ElementType } from 'react'
+
+export interface DefinedIcons {
+  invalid: CarbonIconType | ElementType
+}
+
+export const defaultIcons: DefinedIcons = {
+  invalid: WarningFilled,
+}

package/src/config/defineIcons.ts

@@ -0,0 +1,19 @@
+import { defaultIcons, type DefinedIcons } from './cerbIcons'
+
+function _validateIconsProperties(icons: DefinedIcons) {
+  if (!icons.invalid) {
+    throw new Error(
+      'The an invalid property must be defined in your custom icons library.',
+    )
+  }
+}
+
+export function defineIcons(icons: DefinedIcons): DefinedIcons {
+  _validateIconsProperties(icons)
+  $cerberusIcons = icons
+  return $cerberusIcons
+}
+
+// Default icons
+
+export let $cerberusIcons: DefinedIcons = defaultIcons

package/src/index.ts

@@ -36,6 +36,10 @@ export * from './hooks/useTheme'
 export * from './aria-helpers/nav-menu.aria'
 export * from './aria-helpers/tabs.aria'
 
+// utils
+
+export * from './config/defineIcons'
+
 // shared types
 
 export * from './types'

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Input.tsx"],"sourcesContent":["'use client'\n\nimport type { InputHTMLAttributes, ReactNode } from 'react'\nimport { WarningFilled } from '@cerberus/icons'\nimport { input } from '@cerberus/styled-system/recipes'\nimport { cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport { Show } from './Show'\n\nexport type InputRecipeProps = RecipeVariantProps<typeof input>\nexport interface InputBaseProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'size'> {\n  describedBy?: string\n  id: string\n  startIcon?: ReactNode\n  endIcon?: ReactNode\n}\nexport type InputProps = InputBaseProps & InputRecipeProps\n\nexport function Input(props: InputProps) {\n  const { describedBy, size, startIcon, endIcon, ...nativeProps } = props\n  const inputStyles = input({ size })\n  const { invalid, ...fieldStates } = useFieldContext()\n  const hasEndIcon = Boolean(endIcon)\n\n  return (\n    <div className={inputStyles.root}>\n      <Show when={Boolean(startIcon)}>\n        <span className={inputStyles.startIcon}>{startIcon}</span>\n      </Show>\n\n      <input\n        {...nativeProps}\n        {...fieldStates}\n        {...(describedBy && { 'aria-describedby': describedBy })}\n        {...(invalid && { 'aria-invalid': true })}\n        data-start-icon={Boolean(startIcon)}\n        className={cx('peer', nativeProps.className, inputStyles.input)}\n      />\n\n      <Show when={invalid}>\n        <WarningFilled className={inputStyles.icon} />\n      </Show>\n      <Show when={hasEndIcon && !invalid}>\n        <span className={inputStyles.icon}>{endIcon}</span>\n      </Show>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,qBAAqB;AAC9B,SAAS,aAAa;AACtB,SAAS,UAAmC;AAqBxC,SAEI,KAFJ;AAPG,SAAS,MAAM,OAAmB;AACvC,QAAM,EAAE,aAAa,MAAM,WAAW,SAAS,GAAG,YAAY,IAAI;AAClE,QAAM,cAAc,MAAM,EAAE,KAAK,CAAC;AAClC,QAAM,EAAE,SAAS,GAAG,YAAY,IAAI,gBAAgB;AACpD,QAAM,aAAa,QAAQ,OAAO;AAElC,SACE,qBAAC,SAAI,WAAW,YAAY,MAC1B;AAAA,wBAAC,QAAK,MAAM,QAAQ,SAAS,GAC3B,8BAAC,UAAK,WAAW,YAAY,WAAY,qBAAU,GACrD;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAI,eAAe,EAAE,oBAAoB,YAAY;AAAA,QACrD,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,QACvC,mBAAiB,QAAQ,SAAS;AAAA,QAClC,WAAW,GAAG,QAAQ,YAAY,WAAW,YAAY,KAAK;AAAA;AAAA,IAChE;AAAA,IAEA,oBAAC,QAAK,MAAM,SACV,8BAAC,iBAAc,WAAW,YAAY,MAAM,GAC9C;AAAA,IACA,oBAAC,QAAK,MAAM,cAAc,CAAC,SACzB,8BAAC,UAAK,WAAW,YAAY,MAAO,mBAAQ,GAC9C;AAAA,KACF;AAEJ;","names":[]}

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Input.tsx"],"sourcesContent":["'use client'\n\nimport type { InputHTMLAttributes, ReactNode } from 'react'\nimport { WarningFilled } from '@cerberus/icons'\nimport { input } from '@cerberus/styled-system/recipes'\nimport { cx, type RecipeVariantProps } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport { Show } from './Show'\n\nexport type InputRecipeProps = RecipeVariantProps<typeof input>\nexport interface InputBaseProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'size'> {\n  describedBy?: string\n  id: string\n  startIcon?: ReactNode\n  endIcon?: ReactNode\n}\nexport type InputProps = InputBaseProps & InputRecipeProps\n\nexport function Input(props: InputProps) {\n  const { describedBy, size, startIcon, endIcon, ...nativeProps } = props\n  const inputStyles = input({ size })\n  const { invalid, ...fieldStates } = useFieldContext()\n  const hasEndIcon = Boolean(endIcon)\n\n  return (\n    <div className={inputStyles.root}>\n      <Show when={Boolean(startIcon)}>\n        <span className={inputStyles.startIcon}>{startIcon}</span>\n      </Show>\n\n      <input\n        {...nativeProps}\n        {...fieldStates}\n        {...(describedBy && { 'aria-describedby': describedBy })}\n        {...(invalid && { 'aria-invalid': true })}\n        data-start-icon={Boolean(startIcon)}\n        className={cx('peer', nativeProps.className, inputStyles.input)}\n      />\n\n      <Show when={invalid}>\n        <WarningFilled className={inputStyles.icon} />\n      </Show>\n      <Show when={hasEndIcon && !invalid}>\n        <span className={inputStyles.icon}>{endIcon}</span>\n      </Show>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;AAGA,SAAS,qBAAqB;AAC9B,SAAS,aAAa;AACtB,SAAS,UAAmC;AAqBxC,SAEI,KAFJ;AAPG,SAAS,MAAM,OAAmB;AACvC,QAAM,EAAE,aAAa,MAAM,WAAW,SAAS,GAAG,YAAY,IAAI;AAClE,QAAM,cAAc,MAAM,EAAE,KAAK,CAAC;AAClC,QAAM,EAAE,SAAS,GAAG,YAAY,IAAI,gBAAgB;AACpD,QAAM,aAAa,QAAQ,OAAO;AAElC,SACE,qBAAC,SAAI,WAAW,YAAY,MAC1B;AAAA,wBAAC,QAAK,MAAM,QAAQ,SAAS,GAC3B,8BAAC,UAAK,WAAW,YAAY,WAAY,qBAAU,GACrD;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAI,eAAe,EAAE,oBAAoB,YAAY;AAAA,QACrD,GAAI,WAAW,EAAE,gBAAgB,KAAK;AAAA,QACvC,mBAAiB,QAAQ,SAAS;AAAA,QAClC,WAAW,GAAG,QAAQ,YAAY,WAAW,YAAY,KAAK;AAAA;AAAA,IAChE;AAAA,IAEA,oBAAC,QAAK,MAAM,SACV,8BAAC,iBAAc,WAAW,YAAY,MAAM,GAC9C;AAAA,IACA,oBAAC,QAAK,MAAM,cAAc,CAAC,SACzB,8BAAC,UAAK,WAAW,YAAY,MAAO,mBAAQ,GAC9C;AAAA,KACF;AAEJ;","names":[]}