@forgedevstack/bear 1.0.4 → 1.0.6

package/dist/components/Form/Form.const.js

@@ -0,0 +1,27 @@
+const e = {
+  required: "This field is required",
+  email: "Please enter a valid email address",
+  pattern: "Invalid format"
+}, r = {
+  fields: {},
+  isSubmitting: !1,
+  isValid: !0,
+  isSubmitted: !1,
+  errors: {}
+}, a = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i, l = {
+  vertical: "Bear-Form--vertical bear-flex bear-flex-col bear-gap-4",
+  horizontal: "Bear-Form--horizontal bear-flex bear-flex-col bear-gap-4",
+  inline: "Bear-Form--inline bear-flex bear-flex-wrap bear-items-end bear-gap-4"
+}, i = {
+  vertical: "Bear-FormItem--vertical bear-flex bear-flex-col bear-gap-1.5",
+  horizontal: "Bear-FormItem--horizontal bear-flex bear-flex-row bear-items-start bear-gap-4",
+  inline: "Bear-FormItem--inline bear-flex bear-flex-col bear-gap-1"
+}, t = "bear-w-32 bear-shrink-0";
+export {
+  a as EMAIL_REGEX,
+  e as FORM_DEFAULT_TRANSLATIONS,
+  r as FORM_INITIAL_STATE,
+  i as FORM_ITEM_LAYOUT_CLASSES,
+  t as FORM_LABEL_WIDTH_HORIZONTAL,
+  l as FORM_LAYOUT_CLASSES
+};

package/dist/components/Form/Form.context.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),e=t.createContext(null),n=()=>{const o=t.useContext(e);if(!o)throw new Error("useFormContext must be used within a Form component");return o},r=()=>t.useContext(e);exports.FormContext=e;exports.useFormContext=n;exports.useFormContextSafe=r;

package/dist/components/Form/Form.context.d.ts

@@ -0,0 +1,13 @@
+import { FormContextValue } from './Form.types';
+/**
+ * Form context
+ */
+export declare const FormContext: import('react').Context<FormContextValue | null>;
+/**
+ * Hook to access form context
+ */
+export declare const useFormContext: () => FormContextValue;
+/**
+ * Hook to safely access form context (returns null if not in Form)
+ */
+export declare const useFormContextSafe: () => FormContextValue | null;

package/dist/components/Form/Form.context.js

@@ -0,0 +1,12 @@
+import { createContext as n, useContext as o } from "react";
+const e = n(null), s = () => {
+  const t = o(e);
+  if (!t)
+    throw new Error("useFormContext must be used within a Form component");
+  return t;
+}, m = () => o(e);
+export {
+  e as FormContext,
+  s as useFormContext,
+  m as useFormContextSafe
+};

package/dist/components/Form/Form.d.ts

@@ -0,0 +1,18 @@
+import { FC } from 'react';
+import { FormProps, FormItemProps } from './Form.types';
+/**
+ * Form - Form management component with validation
+ *
+ * @example
+ * ```tsx
+ * <Form onSubmit={handleSubmit} initialValues={{ email: '' }}>
+ *   <Form.Item name="email" label="Email" rules={{ required: true, email: true }}>
+ *     <Input />
+ *   </Form.Item>
+ *   <Button type="submit">Submit</Button>
+ * </Form>
+ * ```
+ */
+export declare const Form: FC<FormProps> & {
+    Item: FC<FormItemProps>;
+};

package/dist/components/Form/Form.js

@@ -0,0 +1,230 @@
+import { jsx as g, jsxs as B } from "react/jsx-runtime";
+import { useState as M, useRef as V, useCallback as u, useMemo as q, isValidElement as z, cloneElement as k } from "react";
+import { cn as E } from "../../utils/cn.js";
+import { FormContext as D, useFormContext as H } from "./Form.context.js";
+import { validateFieldValue as P } from "./Form.utils.js";
+import { FORM_INITIAL_STATE as w, FORM_LAYOUT_CLASSES as U, FORM_LABEL_WIDTH_HORIZONTAL as Y, FORM_ITEM_LAYOUT_CLASSES as p } from "./Form.const.js";
+const W = ({
+  children: I,
+  initialValues: n = {},
+  onSubmit: x,
+  onError: l,
+  layout: F = "vertical",
+  validateOnChange: m = !0,
+  validateOnBlur: h = !0,
+  className: N,
+  testId: S,
+  ...v
+}) => {
+  const [o, i] = M(() => ({
+    ...w,
+    fields: Object.fromEntries(
+      Object.entries(n).map(([e, t]) => [
+        e,
+        { value: t, error: void 0, touched: !1, validating: !1, dirty: !1 }
+      ])
+    )
+  })), a = V({}), b = u((e, t) => {
+    i((r) => ({
+      ...r,
+      fields: {
+        ...r.fields,
+        [e]: {
+          ...r.fields[e],
+          value: t,
+          dirty: !0
+        }
+      }
+    }));
+  }, []), c = u((e) => {
+    var t;
+    return (t = o.fields[e]) == null ? void 0 : t.value;
+  }, [o.fields]), y = u((e, t) => {
+    i((r) => ({
+      ...r,
+      fields: {
+        ...r.fields,
+        [e]: {
+          ...r.fields[e],
+          error: t
+        }
+      },
+      errors: { ...r.errors, [e]: t }
+    }));
+  }, []), A = u((e) => {
+    i((t) => {
+      const r = { ...t.errors };
+      return delete r[e], {
+        ...t,
+        fields: {
+          ...t.fields,
+          [e]: {
+            ...t.fields[e],
+            error: void 0
+          }
+        },
+        errors: r
+      };
+    });
+  }, []), _ = u(async (e) => {
+    var f;
+    const t = a.current[e];
+    if (!t) return !0;
+    i((d) => ({
+      ...d,
+      fields: {
+        ...d.fields,
+        [e]: {
+          ...d.fields[e],
+          validating: !0
+        }
+      }
+    }));
+    const r = (f = o.fields[e]) == null ? void 0 : f.value, s = await P(r, t);
+    return i((d) => ({
+      ...d,
+      fields: {
+        ...d.fields,
+        [e]: {
+          ...d.fields[e],
+          error: s ?? void 0,
+          validating: !1
+        }
+      },
+      errors: s ? { ...d.errors, [e]: s } : (() => {
+        const T = { ...d.errors };
+        return delete T[e], T;
+      })()
+    })), !s;
+  }, [o.fields]), O = u(async () => {
+    const e = Object.keys(a.current);
+    return (await Promise.all(e.map(_))).every(Boolean);
+  }, [_]), L = u((e) => {
+    i({
+      ...w,
+      fields: Object.fromEntries(
+        Object.entries(e ?? n).map(([r, s]) => [
+          r,
+          { value: s, error: void 0, touched: !1, validating: !1, dirty: !1 }
+        ])
+      )
+    });
+  }, [n]), R = u((e, t) => {
+    var r;
+    return t && (a.current[e] = t), o.fields[e] || i((s) => ({
+      ...s,
+      fields: {
+        ...s.fields,
+        [e]: {
+          value: n[e] ?? "",
+          error: void 0,
+          touched: !1,
+          validating: !1,
+          dirty: !1
+        }
+      }
+    })), {
+      name: e,
+      value: ((r = o.fields[e]) == null ? void 0 : r.value) ?? n[e] ?? "",
+      onChange: (s) => {
+        b(e, s), m && t && setTimeout(() => _(e), 0);
+      },
+      onBlur: () => {
+        i((s) => ({
+          ...s,
+          fields: {
+            ...s.fields,
+            [e]: {
+              ...s.fields[e],
+              touched: !0
+            }
+          }
+        })), h && t && _(e);
+      }
+    };
+  }, [o.fields, n, b, _, m, h]), j = u(
+    (e) => async (t) => {
+      if (t.preventDefault(), i((f) => ({ ...f, isSubmitting: !0, isSubmitted: !0 })), !await O()) {
+        i((f) => ({ ...f, isSubmitting: !1 })), l == null || l(o.errors);
+        return;
+      }
+      const s = Object.fromEntries(
+        Object.entries(o.fields).map(([f, d]) => [f, d.value])
+      );
+      try {
+        await e(s);
+      } finally {
+        i((f) => ({ ...f, isSubmitting: !1 }));
+      }
+    },
+    [O, o.fields, o.errors, l]
+  ), C = q(
+    () => ({
+      state: o,
+      register: R,
+      setValue: b,
+      getValue: c,
+      setError: y,
+      clearError: A,
+      validateField: _,
+      validateForm: O,
+      reset: L,
+      handleSubmit: j,
+      layout: F
+    }),
+    [o, R, b, c, y, A, _, O, L, j, F]
+  );
+  return /* @__PURE__ */ g(D.Provider, { value: C, children: /* @__PURE__ */ g(
+    "form",
+    {
+      className: E("Bear-Form", U[F], N),
+      onSubmit: x ? j(x) : void 0,
+      "data-testid": S,
+      ...v,
+      children: I
+    }
+  ) });
+}, Z = ({
+  name: I,
+  label: n,
+  required: x,
+  rules: l,
+  helperText: F,
+  children: m,
+  className: h
+}) => {
+  const { register: N, state: S, layout: v } = H(), o = {
+    ...l,
+    required: x ?? (l == null ? void 0 : l.required)
+  }, i = N(I, o), a = S.fields[I], b = (a == null ? void 0 : a.touched) && (a == null ? void 0 : a.error);
+  return /* @__PURE__ */ B("div", { className: E("Bear-FormItem", p[v], h), children: [
+    n && /* @__PURE__ */ B(
+      "label",
+      {
+        className: E(
+          "Bear-FormItem__label bear-text-sm bear-font-medium bear-text-zinc-300",
+          v === "horizontal" && Y
+        ),
+        children: [
+          n,
+          (x || (l == null ? void 0 : l.required)) && /* @__PURE__ */ g("span", { className: "Bear-FormItem__required bear-text-red-500 bear-ml-0.5", children: "*" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ B("div", { className: "Bear-FormItem__content bear-flex-1", children: [
+      /* @__PURE__ */ g("div", { className: "Bear-FormItem__control", children: typeof m == "function" ? m(i) : z(m) ? k(m, {
+        ...i,
+        onChange: (c) => {
+          const y = c && typeof c == "object" && "target" in c && c.target && typeof c.target.value < "u" ? c.target.value : c;
+          i.onChange(y);
+        }
+      }) : m }),
+      b && /* @__PURE__ */ g("p", { className: "Bear-FormItem__error bear-mt-1 bear-text-xs bear-text-red-400", children: a.error }),
+      F && !b && /* @__PURE__ */ g("p", { className: "Bear-FormItem__helper bear-mt-1 bear-text-xs bear-text-zinc-500", children: F })
+    ] })
+  ] });
+};
+W.Item = Z;
+export {
+  W as Form
+};

package/dist/components/Form/Form.types.d.ts

@@ -0,0 +1,166 @@
+import { ReactNode, FormHTMLAttributes } from 'react';
+/**
+ * Validation rule types
+ */
+export type ValidationRule = {
+    /** Required field validation */
+    required?: boolean | string;
+    /** Minimum length validation */
+    minLength?: {
+        value: number;
+        message: string;
+    };
+    /** Maximum length validation */
+    maxLength?: {
+        value: number;
+        message: string;
+    };
+    /** Minimum value validation (for numbers) */
+    min?: {
+        value: number;
+        message: string;
+    };
+    /** Maximum value validation (for numbers) */
+    max?: {
+        value: number;
+        message: string;
+    };
+    /** Pattern validation (regex) */
+    pattern?: {
+        value: RegExp;
+        message: string;
+    };
+    /** Custom validation function */
+    validate?: (value: unknown) => boolean | string | Promise<boolean | string>;
+    /** Email validation */
+    email?: boolean | string;
+};
+/**
+ * Form field state
+ */
+export interface FormFieldState {
+    /** Current value */
+    value: unknown;
+    /** Error message if validation failed */
+    error?: string;
+    /** Whether field has been touched */
+    touched: boolean;
+    /** Whether field is currently being validated */
+    validating: boolean;
+    /** Whether field is dirty (value changed) */
+    dirty: boolean;
+}
+/**
+ * Form state
+ */
+export interface FormState {
+    /** Field states by name */
+    fields: Record<string, FormFieldState>;
+    /** Whether form is currently submitting */
+    isSubmitting: boolean;
+    /** Whether form is valid */
+    isValid: boolean;
+    /** Whether form has been submitted */
+    isSubmitted: boolean;
+    /** Form-level errors */
+    errors: Record<string, string>;
+}
+/**
+ * Form context value
+ */
+export interface FormContextValue {
+    /** Current form state */
+    state: FormState;
+    /** Register a field */
+    register: (name: string, rules?: ValidationRule) => {
+        name: string;
+        value: unknown;
+        onChange: (value: unknown) => void;
+        onBlur: () => void;
+    };
+    /** Set field value */
+    setValue: (name: string, value: unknown) => void;
+    /** Get field value */
+    getValue: (name: string) => unknown;
+    /** Set field error */
+    setError: (name: string, error: string) => void;
+    /** Clear field error */
+    clearError: (name: string) => void;
+    /** Validate a field */
+    validateField: (name: string) => Promise<boolean>;
+    /** Validate all fields */
+    validateForm: () => Promise<boolean>;
+    /** Reset form */
+    reset: (values?: Record<string, unknown>) => void;
+    /** Handle form submission */
+    handleSubmit: (onSubmit: (data: Record<string, unknown>) => void | Promise<void>) => (e: React.FormEvent) => void;
+    /** Form layout */
+    layout: FormLayout;
+}
+/**
+ * Form layout options
+ */
+export type FormLayout = 'vertical' | 'horizontal' | 'inline';
+/**
+ * Form component props
+ */
+export interface FormProps extends Omit<FormHTMLAttributes<HTMLFormElement>, 'onSubmit' | 'onError'> {
+    /** Child elements */
+    children: ReactNode;
+    /** Initial form values */
+    initialValues?: Record<string, unknown>;
+    /** Form submission handler */
+    onSubmit?: (data: Record<string, unknown>) => void | Promise<void>;
+    /** Form validation error handler */
+    onError?: (errors: Record<string, string>) => void;
+    /** Form layout */
+    layout?: FormLayout;
+    /** Whether to validate on change */
+    validateOnChange?: boolean;
+    /** Whether to validate on blur */
+    validateOnBlur?: boolean;
+    /** Custom class name */
+    className?: string;
+    /** Test ID */
+    testId?: string;
+}
+/**
+ * Field props from register
+ */
+export interface FormFieldProps {
+    name: string;
+    value: unknown;
+    onChange: (value: unknown) => void;
+    onBlur: () => void;
+}
+/**
+ * Form.Item props
+ */
+export interface FormItemProps {
+    /** Field name */
+    name: string;
+    /** Field label */
+    label?: string;
+    /** Required indicator */
+    required?: boolean;
+    /** Validation rules */
+    rules?: ValidationRule;
+    /** Helper text */
+    helperText?: string;
+    /** Children (form control or render prop) */
+    children: ReactNode | ((field: FormFieldProps) => ReactNode);
+    /** Custom class name */
+    className?: string;
+}
+/**
+ * Form translations
+ */
+export interface FormTranslations {
+    required: string;
+    email: string;
+    minLength: string;
+    maxLength: string;
+    min: string;
+    max: string;
+    pattern: string;
+}

package/dist/components/Form/Form.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("./Form.const.cjs"),r=async(i,t)=>{const n=typeof i=="string"?i:String(i??""),e=typeof i=="number"?i:Number(i);if(t.required&&(i==null||n.trim()===""))return typeof t.required=="string"?t.required:m.FORM_DEFAULT_TRANSLATIONS.required;if(i==null||n==="")return null;if(t.email&&!m.EMAIL_REGEX.test(n))return typeof t.email=="string"?t.email:m.FORM_DEFAULT_TRANSLATIONS.email;if(t.minLength&&n.length<t.minLength.value)return t.minLength.message;if(t.maxLength&&n.length>t.maxLength.value)return t.maxLength.message;if(t.min&&!isNaN(e)&&e<t.min.value)return t.min.message;if(t.max&&!isNaN(e)&&e>t.max.value)return t.max.message;if(t.pattern&&!t.pattern.value.test(n))return t.pattern.message;if(t.validate){const a=await t.validate(i);if(typeof a=="string")return a;if(a===!1)return m.FORM_DEFAULT_TRANSLATIONS.pattern}return null};exports.validateFieldValue=r;

package/dist/components/Form/Form.utils.d.ts

@@ -0,0 +1,17 @@
+import { ValidationRule } from './Form.types';
+/**
+ * Validate a single field value against rules
+ */
+export declare const validateFieldValue: (value: unknown, rules: ValidationRule) => Promise<string | null>;
+/**
+ * Deep clone an object
+ */
+export declare const deepClone: <T>(obj: T) => T;
+/**
+ * Get nested value from object by path
+ */
+export declare const getNestedValue: (obj: Record<string, unknown>, path: string) => unknown;
+/**
+ * Set nested value in object by path
+ */
+export declare const setNestedValue: (obj: Record<string, unknown>, path: string, value: unknown) => Record<string, unknown>;

package/dist/components/Form/Form.utils.js

@@ -0,0 +1,31 @@
+import { FORM_DEFAULT_TRANSLATIONS as m, EMAIL_REGEX as f } from "./Form.const.js";
+const g = async (i, t) => {
+  const n = typeof i == "string" ? i : String(i ?? ""), e = typeof i == "number" ? i : Number(i);
+  if (t.required && (i == null || n.trim() === ""))
+    return typeof t.required == "string" ? t.required : m.required;
+  if (i == null || n === "")
+    return null;
+  if (t.email && !f.test(n))
+    return typeof t.email == "string" ? t.email : m.email;
+  if (t.minLength && n.length < t.minLength.value)
+    return t.minLength.message;
+  if (t.maxLength && n.length > t.maxLength.value)
+    return t.maxLength.message;
+  if (t.min && !isNaN(e) && e < t.min.value)
+    return t.min.message;
+  if (t.max && !isNaN(e) && e > t.max.value)
+    return t.max.message;
+  if (t.pattern && !t.pattern.value.test(n))
+    return t.pattern.message;
+  if (t.validate) {
+    const a = await t.validate(i);
+    if (typeof a == "string")
+      return a;
+    if (a === !1)
+      return m.pattern;
+  }
+  return null;
+};
+export {
+  g as validateFieldValue
+};

package/dist/components/Form/index.d.ts

@@ -0,0 +1,3 @@
+export { Form } from './Form';
+export { useFormContext, useFormContextSafe } from './Form.context';
+export type { FormProps, FormItemProps, FormState, FormFieldState, FormContextValue, FormLayout, ValidationRule, FormTranslations, } from './Form.types';

package/dist/components/Input/Input.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),f=require("react"),b=require("../../utils/cn.cjs"),_={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},u=f.forwardRef(({label:s,helperText:n,error:r,size:c="md",leftAddon:a,rightAddon:t,fullWidth:i=!1,className:d,disabled:l,...p},x)=>{const o=!!r;return e.jsxs("div",{className:b.cn("Bear-Input bear-flex bear-flex-col bear-gap-1.5",i&&"bear-w-full"),children:[s&&e.jsx("label",{className:"Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-300",children:s}),e.jsxs("div",{className:"Bear-Input__wrapper bear-relative bear-flex bear-items-center",children:[a&&e.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-400",children:a}),e.jsx("input",{ref:x,disabled:l,className:b.cn("Bear-Input__field","bear-w-full bear-rounded-lg bear-border bear-bg-gray-800","bear-text-white placeholder:bear-text-gray-500","bear-outline-none bear-transition-all bear-duration-200","focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-gray-900",o?"Bear-Input__field--error bear-border-red-500 focus:bear-ring-red-500":"bear-border-gray-600 focus:bear-border-bear-500 focus:bear-ring-bear-500",l&&"Bear-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",a&&"bear-pl-10",t&&"bear-pr-10",_[c],d),...p}),t&&e.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-400",children:t})]}),(n||r)&&e.jsx("p",{className:b.cn("Bear-Input__helper bear-text-sm",o?"Bear-Input__helper--error bear-text-red-500":"bear-text-gray-400"),children:r||n})]})});u.displayName="Input";exports.Input=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),b=require("../../utils/cn.cjs"),f={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},d=g.forwardRef(({label:s,helperText:n,error:r,size:u="md",leftAddon:a,rightAddon:t,fullWidth:c=!1,className:i,disabled:l,...p},x)=>{const o=!!r;return e.jsxs("div",{className:b.cn("Bear-Input bear-flex bear-flex-col bear-gap-1.5",c&&"bear-w-full"),children:[s&&e.jsx("label",{className:"Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",children:s}),e.jsxs("div",{className:"Bear-Input__wrapper bear-relative bear-flex bear-items-center",children:[a&&e.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-500 dark:bear-text-gray-400",children:a}),e.jsx("input",{ref:x,disabled:l,className:b.cn("Bear-Input__field","bear-w-full bear-rounded-lg bear-border bear-outline-none bear-transition-all bear-duration-200","bear-bg-white bear-text-gray-900 placeholder:bear-text-gray-400","bear-border-gray-300 focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-white","dark:bear-bg-gray-800 dark:bear-text-white dark:placeholder:bear-text-gray-500 dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",o?"Bear-Input__field--error bear-border-red-500 focus:bear-ring-red-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",l&&"Bear-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",a&&"bear-pl-10",t&&"bear-pr-10",f[u],i),...p}),t&&e.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-500 dark:bear-text-gray-400",children:t})]}),(n||r)&&e.jsx("p",{className:b.cn("Bear-Input__helper bear-text-sm",o?"Bear-Input__helper--error bear-text-red-500":"bear-text-gray-500 dark:bear-text-gray-400"),children:r||n})]})});d.displayName="Input";exports.Input=d;

package/dist/components/Input/Input.js

@@ -1,65 +1,65 @@
-import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
-import { cn as b } from "../../utils/cn.js";
-const _ = {
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import { cn as t } from "../../utils/cn.js";
+const x = {
   sm: "bear-h-8 bear-text-sm bear-px-3",
   md: "bear-h-10 bear-text-base bear-px-4",
   lg: "bear-h-12 bear-text-lg bear-px-5"
-}, x = m(
+}, m = g(
   ({
-    label: l,
-    helperText: s,
-    error: r,
-    size: p = "md",
+    label: s,
+    helperText: l,
+    error: e,
+    size: i = "md",
     leftAddon: a,
-    rightAddon: t,
+    rightAddon: b,
     fullWidth: u = !1,
-    className: d,
-    disabled: n,
+    className: p,
+    disabled: o,
     ...c
   }, f) => {
-    const o = !!r;
-    return /* @__PURE__ */ i("div", { className: b("Bear-Input bear-flex bear-flex-col bear-gap-1.5", u && "bear-w-full"), children: [
-      l && /* @__PURE__ */ e("label", { className: "Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-300", children: l }),
-      /* @__PURE__ */ i("div", { className: "Bear-Input__wrapper bear-relative bear-flex bear-items-center", children: [
-        a && /* @__PURE__ */ e("div", { className: "Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-400", children: a }),
-        /* @__PURE__ */ e(
+    const d = !!e;
+    return /* @__PURE__ */ n("div", { className: t("Bear-Input bear-flex bear-flex-col bear-gap-1.5", u && "bear-w-full"), children: [
+      s && /* @__PURE__ */ r("label", { className: "Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300", children: s }),
+      /* @__PURE__ */ n("div", { className: "Bear-Input__wrapper bear-relative bear-flex bear-items-center", children: [
+        a && /* @__PURE__ */ r("div", { className: "Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-500 dark:bear-text-gray-400", children: a }),
+        /* @__PURE__ */ r(
           "input",
           {
             ref: f,
-            disabled: n,
-            className: b(
+            disabled: o,
+            className: t(
               "Bear-Input__field",
-              "bear-w-full bear-rounded-lg bear-border bear-bg-gray-800",
-              "bear-text-white placeholder:bear-text-gray-500",
-              "bear-outline-none bear-transition-all bear-duration-200",
-              "focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-gray-900",
-              o ? "Bear-Input__field--error bear-border-red-500 focus:bear-ring-red-500" : "bear-border-gray-600 focus:bear-border-bear-500 focus:bear-ring-bear-500",
-              n && "Bear-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",
+              "bear-w-full bear-rounded-lg bear-border bear-outline-none bear-transition-all bear-duration-200",
+              "bear-bg-white bear-text-gray-900 placeholder:bear-text-gray-400",
+              "bear-border-gray-300 focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-white",
+              "dark:bear-bg-gray-800 dark:bear-text-white dark:placeholder:bear-text-gray-500 dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",
+              d ? "Bear-Input__field--error bear-border-red-500 focus:bear-ring-red-500" : "focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",
+              o && "Bear-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",
               a && "bear-pl-10",
-              t && "bear-pr-10",
-              _[p],
-              d
+              b && "bear-pr-10",
+              x[i],
+              p
             ),
             ...c
           }
         ),
-        t && /* @__PURE__ */ e("div", { className: "Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-400", children: t })
+        b && /* @__PURE__ */ r("div", { className: "Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-500 dark:bear-text-gray-400", children: b })
       ] }),
-      (s || r) && /* @__PURE__ */ e(
+      (l || e) && /* @__PURE__ */ r(
         "p",
         {
-          className: b(
+          className: t(
             "Bear-Input__helper bear-text-sm",
-            o ? "Bear-Input__helper--error bear-text-red-500" : "bear-text-gray-400"
+            d ? "Bear-Input__helper--error bear-text-red-500" : "bear-text-gray-500 dark:bear-text-gray-400"
           ),
-          children: r || s
+          children: e || l
         }
       )
     ] });
   }
 );
-x.displayName = "Input";
+m.displayName = "Input";
 export {
-  x as Input
+  m as Input
 };