asheeui 0.6.2 → 0.6.3

package/dist/components/field/field-styles.d.ts

@@ -1,8 +1,30 @@
 import { FieldSizeKey, FieldStatus, LabelAlign } from './field-config';
+/**
+ * CSS classes for label alignment.
+ * Controls the text alignment of field labels.
+ */
 export declare const FIELD_LABEL_ALIGN_CLASS: Record<LabelAlign, string>;
+/**
+ * CSS classes for status message text colors.
+ * Maps status values to Tailwind text color classes.
+ */
 export declare const FIELD_STATUS_TEXT_CLASS: Record<FieldStatus, string>;
+/**
+ * CSS classes for label font size based on field size.
+ */
 export declare const FIELD_LABEL_SIZE_CLASS: Record<FieldSizeKey, string>;
+/**
+ * CSS classes for description font size based on field size.
+ */
 export declare const FIELD_DESCRIPTION_SIZE_CLASS: Record<FieldSizeKey, string>;
+/**
+ * CSS classes for message font size based on field size.
+ */
 export declare const FIELD_MESSAGE_SIZE_CLASS: Record<FieldSizeKey, string>;
+/**
+ * CSS classes for field shell gap based on field size.
+ * Controls the spacing between field elements.
+ */
 export declare const FIELD_SHELL_GAP_CLASS: Record<FieldSizeKey, string>;
+export declare const FIELD_STATUS_BORDER_CLASS: Record<FieldStatus, string>;
 //# sourceMappingURL=field-styles.d.ts.map

package/dist/components/field/field-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field-styles.d.ts","sourceRoot":"","sources":["../../../src/components/field/field-styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5E,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAI9D,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAK/D,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAI/D,CAAC;AAEF,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIrE,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIjE,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAI9D,CAAC"}
+{"version":3,"file":"field-styles.d.ts","sourceRoot":"","sources":["../../../src/components/field/field-styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5E;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAI9D,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAK/D,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAI/D,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIrE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,wBAAwB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIjE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAI9D,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAQjE,CAAC"}

package/dist/components/field/field-styles.js

@@ -0,0 +1,10 @@
+"use client";
+const r = {
+  default: "",
+  error: "border-danger focus-visible:border-danger focus-visible:ring-danger/20",
+  warning: "border-warning focus-visible:border-warning focus-visible:ring-warning/20",
+  success: "border-success focus-visible:border-success focus-visible:ring-success/20"
+};
+export {
+  r as FIELD_STATUS_BORDER_CLASS
+};

package/dist/components/field/index.js

@@ -1,2 +1,3 @@
 export * from "./FieldShell.js";
 export * from "./field-config.js";
+export * from "./field-styles.js";

package/dist/components/image/Image.d.ts

@@ -1,38 +1,20 @@
 import { ElementType, ImgHTMLAttributes } from 'react';
-import { Radius } from '../../shared/radius';
-import { ImageFit, ImageRatioKey } from './image-config';
+import { ImageConfig } from './image-config';
+type BaseImageProps = ImageConfig & ImgHTMLAttributes<HTMLImageElement>;
 /**
  * Configuration options for the Image component.
  */
-export interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "children" | "alt"> {
-    /** Accessible alternative text describing the image. */
-    alt: string;
-    /** Object-fit behaviour of the image inside its ratio box.
-     *
-     * @default "cover"
-     */
-    fit?: ImageFit;
-    /** Container aspect ratio.
-     *
-     * @default "auto"
-     */
-    ratio?: ImageRatioKey;
-    /** Corner rounding.
-     *
-     * @default "md"
+export interface ImageProps extends BaseImageProps {
+    /**
+     * Fallback source shown when the primary `src` fails to load.
+     * When the primary image fails to load, this source is used instead.
      */
-    radius?: Radius;
-    /** Fallback source shown when the primary `src` fails to load. */
     fallbackSrc?: string;
-    /** Shows a shimmering placeholder until the image loads.
-     *
-     * @default true
+    /**
+     * Custom image component to use instead of the native `<img>` tag
+     * (e.g. `next/image`).
+     * When provided, the component renders this instead of img.
      */
-    showSkeleton?: boolean;
-    /** Extra classes merged with internal styles. */
-    className?: string;
-    /** Custom image component to use instead of the native `<img>` tag
-     * (e.g. `next/image`). */
     imageComponent?: ElementType;
     /**
      * Additional props to pass to the custom image component
@@ -55,6 +37,11 @@ export interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "c
  * Visual tokens (`fit`, `ratio`, `radius`, `showSkeleton`, `loading`)
  * resolve through the standard AsheeUI cascade.
  *
+ * The component handles edge cases including cached images, error
+ * fallbacks, and proper cleanup of loading states. When using a
+ * custom image component, it automatically applies fill behavior
+ * for Next.js compatibility.
+ *
  * @param props - Image configuration options and native img attributes.
  * @param props.alt - Accessible alternative text.
  * @param props.fit - Object-fit behaviour. Defaults to "cover".
@@ -65,6 +52,9 @@ export interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "c
  * @param props.className - Extra classes for the image element.
  * @param props.imageComponent - Custom image component.
  * @param props.imageProps - Props forwarded to the image component.
+ * @param props.src - The image source URL.
+ * @param props.onLoad - Callback fired when the image loads.
+ * @param props.onError - Callback fired when the image fails to load.
  *
  * @example
  * ```tsx
@@ -83,6 +73,23 @@ export interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "c
  *   );
  * }
  * ```
+ *
+ * @example
+ * ```tsx
+ * // With Next.js Image component
+ * import NextImage from "next/image";
+ *
+ * <Image
+ *   src="/hero.png"
+ *   alt="Hero image"
+ *   imageComponent={NextImage}
+ *   imageProps={{ priority: true, sizes: "100vw" }}
+ * />
+ * ```
+ *
+ * @see ImageConfig - The configuration type for component defaults.
+ * @see useAsheeConfig - Hook for accessing the global configuration.
  */
 export declare const Image: import('react').ForwardRefExoticComponent<ImageProps & import('react').RefAttributes<HTMLImageElement>>;
+export {};
 //# sourceMappingURL=Image.d.ts.map

package/dist/components/image/Image.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../src/components/image/Image.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAgB,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAOhE,OAAO,EAGL,KAAK,QAAQ,EACb,KAAK,aAAa,EACnB,MAAM,gBAAgB,CAAC;AAGxB;;GAEG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,EAAE,UAAU,GAAG,KAAK,CAAC;IACrE,wDAAwD;IACxD,GAAG,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kEAAkE;IAClE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;8BAC0B;IAC1B,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACtC;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,eAAO,MAAM,KAAK,yGAsNjB,CAAC"}
+{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../src/components/image/Image.tsx"],"names":[],"mappings":"AAUA,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AASf,OAAO,EAEL,KAAK,WAAW,EAGjB,MAAM,gBAAgB,CAAC;AAGxB,KAAK,cAAc,GAAG,WAAW,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;AAExE;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC;IAE7B;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACtC;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+DG;AACH,eAAO,MAAM,KAAK,yGAsNjB,CAAC"}

package/dist/components/image/Image.js

@@ -2,10 +2,10 @@
 import { jsxs as P, jsx as _ } from "react/jsx-runtime";
 import { forwardRef as tt, useState as N, useRef as et, useEffect as z } from "react";
 import { useAsheeConfig as st } from "../../libs/context.js";
-import { RADIUS_CLASS as it } from "../../shared/radius.js";
-import { resolveCascade as o, resolveRadiusKey as nt, resolveClassKey as v } from "../../utils/resolve-token.js";
+import { resolveCascade as o, resolveRadiusKey as it, resolveClassKey as v } from "../../utils/resolve-token.js";
 import { FALLBACK_IMAGE_CONFIG as i } from "./image-config.js";
-import { IMAGE_FIT_CLASS as lt, IMAGE_RATIO_CLASS as at } from "./image-styles.js";
+import { IMAGE_FIT_CLASS as nt, IMAGE_RATIO_CLASS as lt } from "./image-styles.js";
+import { RADIUS_CLASS as at } from "../../shared/radius.js";
 import { cn as I } from "../../utils/cn.js";
 function F(l) {
   return typeof l == "string" && l.trim().length > 0;
@@ -55,7 +55,7 @@ const dt = tt(
       e == null ? void 0 : e.ratio,
       void 0,
       i.ratio
-    ), D = nt(
+    ), D = it(
       K,
       e == null ? void 0 : e.radius,
       A.defaultRadius,
@@ -72,15 +72,15 @@ const dt = tt(
       i.showSkeleton
     ), $ = v(
       T,
-      lt,
+      nt,
       i.fit
     ), g = v(
       V,
-      at,
+      lt,
       i.ratio
     ), m = v(
       D,
-      it,
+      at,
       i.radius
     ), q = S || "img", y = !!S, H = F(n), J = (t == null ? void 0 : t.width) !== void 0 || (t == null ? void 0 : t.height) !== void 0 || (t == null ? void 0 : t.fill) !== void 0, Q = y && !J ? { fill: !0, sizes: "100%" } : {}, X = I(
       "h-full w-full transition-opacity duration-300",

package/dist/components/image/image-config.d.ts

@@ -1,4 +1,4 @@
-import { Radius } from '../../shared/radius';
+import { Radius } from '../../shared';
 /**
  * Object-fit behaviour of the image inside its ratio box.
  *
@@ -25,27 +25,37 @@ export type ImageRatioKey = "auto" | "square" | "video" | "portrait";
  * component-level fallback tier of the theme cascade.
  */
 export interface ImageConfig {
-    /** Object-fit strategy.
+    /**
+     * Object-fit strategy.
+     * Controls how the image fills its container.
      *
      * @default "cover"
      */
     fit?: ImageFit;
-    /** Container aspect ratio.
+    /**
+     * Container aspect ratio.
+     * Controls the proportional dimensions of the image container.
      *
      * @default "auto"
      */
     ratio?: ImageRatioKey;
-    /** Corner rounding.
+    /**
+     * Corner rounding.
+     * Controls the border-radius of the image container.
      *
      * @default "md"
      */
     radius?: Radius;
-    /** Native image loading strategy.
+    /**
+     * Native image loading strategy.
+     * Controls when the browser loads the image resource.
      *
      * @default "lazy"
      */
     loading?: "lazy" | "eager";
-    /** Shows a shimmering placeholder until the image loads.
+    /**
+     * Shows a shimmering placeholder until the image loads.
+     * Displays a subtle loading animation while the image is loading.
      *
      * @default true
      */
@@ -57,8 +67,16 @@ export interface ImageConfig {
 export declare const defaultImageConfig: ImageConfig;
 /**
  * Hard fallback values used when no config tier provides a value.
+ * These values are used when instance props, component config,
+ * and global defaults are all undefined.
  */
-export declare const FALLBACK_IMAGE_CONFIG: Required<ImageConfig>;
+export declare const FALLBACK_IMAGE_CONFIG: {
+    readonly fit: "cover";
+    readonly ratio: "auto";
+    readonly radius: "md";
+    readonly loading: "lazy";
+    readonly showSkeleton: true;
+};
 declare module "../../libs/registry" {
     interface ComponentTypeConfigRegistry {
         image: ImageConfig;

package/dist/components/image/image-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-config.d.ts","sourceRoot":"","sources":["../../../src/components/image/image-config.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAElD;;;;;;;;GAQG;AACH,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,YAAY,CAAC;AAE5E;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;AAErE;;;;;GAKG;AACH,MAAM,WAAW,WAAW;IAC1B;;;OAGG;IACH,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,EAAE,WAMhC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,EAAE,QAAQ,CAAC,WAAW,CAM9C,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,KAAK,EAAE,WAAW,CAAC;KACpB;CACF"}
+{"version":3,"file":"image-config.d.ts","sourceRoot":"","sources":["../../../src/components/image/image-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAE3C;;;;;;;;GAQG;AACH,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,YAAY,CAAC;AAE5E;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;AAErE;;;;;GAKG;AACH,MAAM,WAAW,WAAW;IAC1B;;;;;OAKG;IACH,GAAG,CAAC,EAAE,QAAQ,CAAC;IAEf;;;;;OAKG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAE3B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,EAAE,WAMhC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB;;;;;;CAMxB,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,KAAK,EAAE,WAAW,CAAC;KACpB;CACF"}

package/dist/components/image/image-styles.d.ts

@@ -1,4 +1,13 @@
 import { ImageFit, ImageRatioKey } from './image-config';
+/**
+ * CSS classes for image object-fit.
+ * Maps fit strategies to Tailwind object-fit utility classes.
+ */
 export declare const IMAGE_FIT_CLASS: Record<ImageFit, string>;
+/**
+ * CSS classes for image aspect ratio.
+ * Maps ratio keys to Tailwind aspect-ratio utility classes.
+ * The "auto" ratio uses the image's intrinsic dimensions.
+ */
 export declare const IMAGE_RATIO_CLASS: Record<ImageRatioKey, string>;
 //# sourceMappingURL=image-styles.d.ts.map

package/dist/components/image/image-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-styles.d.ts","sourceRoot":"","sources":["../../../src/components/image/image-styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE9D,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAMpD,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAK3D,CAAC"}
+{"version":3,"file":"image-styles.d.ts","sourceRoot":"","sources":["../../../src/components/image/image-styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE9D;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAMpD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAK3D,CAAC"}

package/dist/components/input/Input.d.ts

@@ -1,22 +1,129 @@
 import { default as React, InputHTMLAttributes, ReactNode } from 'react';
-import { Radius } from '../../shared/radius';
-import { Color, Variant } from '../../shared/variant';
-import { FieldSizeKey, FieldStatus, LabelAlign } from '../field/field-config';
-export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "color" | "children"> {
-    size?: FieldSizeKey;
-    radius?: Radius;
-    variant?: Variant;
-    color?: Color;
-    status?: FieldStatus;
+import { InputConfig } from './input-config';
+type BaseInputProps = InputConfig & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "color" | "children">;
+/**
+ * Configuration options for the Input component.
+ */
+export interface InputProps extends BaseInputProps {
+    /**
+     * Label text for the input.
+     * Displayed above the input field.
+     */
     label?: string;
-    labelAlign?: LabelAlign;
+    /**
+     * Whether the input is in a loading state.
+     * Shows a loading spinner next to the label.
+     *
+     * @default false
+     */
     isLoading?: boolean;
+    /**
+     * Description text shown below the label.
+     * Provides additional context about the input.
+     */
     description?: string;
+    /**
+     * Validation message shown below the input.
+     * Color is determined by the status prop.
+     */
     message?: string;
+    /**
+     * Whether the field is required.
+     * Adds a required indicator (*) to the label.
+     *
+     * @default false
+     */
     required?: boolean;
+    /**
+     * Content rendered at the start of the input.
+     * Typically an icon or adornment.
+     */
     startContent?: ReactNode;
+    /**
+     * Content rendered at the end of the input.
+     * Typically an icon, button, or adornment.
+     */
     endContent?: ReactNode;
+    /**
+     * Whether the virtual keyboard should be enabled for mobile devices.
+     * Controls the inputmode attribute.
+     *
+     * @default true
+     */
     enableVirtualKeyboard?: boolean;
 }
+/**
+ * A form input field with label, description, validation message,
+ * and content slot support.
+ *
+ * Input renders a text input with consistent styling and field layout.
+ * It supports start and end content slots for icons and adornments,
+ * validation states, loading state, and the standard AsheeUI cascade
+ * for visual tokens. The component integrates with FieldShell for
+ * label, description, and message handling.
+ *
+ * The component automatically handles accessibility attributes including
+ * aria-invalid, aria-describedby, and proper focus management. It also
+ * supports mobile virtual keyboard control via the enableVirtualKeyboard
+ * prop.
+ *
+ * @param props - Input configuration options and native input props.
+ * @param props.label - Label text for the input.
+ * @param props.isLoading - Loading state. Defaults to false.
+ * @param props.description - Description text.
+ * @param props.message - Validation message.
+ * @param props.required - Whether the field is required. Defaults to false.
+ * @param props.startContent - Content at the start of the input.
+ * @param props.endContent - Content at the end of the input.
+ * @param props.enableVirtualKeyboard - Enable mobile virtual keyboard. Defaults to true.
+ * @param props.size - Size of the input. Defaults to "md".
+ * @param props.radius - Corner rounding. Defaults to "md".
+ * @param props.variant - Visual style variant. Defaults to "bordered".
+ * @param props.color - Theme accent color. Defaults to "primary".
+ * @param props.status - Validation status.
+ * @param props.labelAlign - Alignment of the label. Defaults to "left".
+ * @param props.disabled - Whether the input is disabled.
+ * @param props.className - Extra CSS classes for the input.
+ * @param props.id - Optional ID for the field.
+ * @param props.style - Inline styles for the input.
+ *
+ * @example
+ * ```tsx
+ * import { Input } from "asheeui";
+ * import { useState } from "react";
+ *
+ * export function Example() {
+ *   const [value, setValue] = useState("");
+ *
+ *   return (
+ *     <Input
+ *       label="Email Address"
+ *       description="We'll never share your email."
+ *       placeholder="you@example.com"
+ *       value={value}
+ *       onChange={(e) => setValue(e.target.value)}
+ *       startContent={<MailIcon />}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // With validation state
+ * <Input
+ *   label="Password"
+ *   type="password"
+ *   status="error"
+ *   message="Password must be at least 8 characters"
+ *   required
+ * />
+ * ```
+ *
+ * @see InputConfig - The configuration type for component defaults.
+ * @see FieldShell - The wrapper component for label and validation.
+ * @see useAsheeConfig - Hook for accessing the global configuration.
+ */
 export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+export {};
 //# sourceMappingURL=Input.d.ts.map

package/dist/components/input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/input/Input.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAEZ,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAgB,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,EACL,KAAK,KAAK,EAEV,KAAK,OAAO,EACb,MAAM,sBAAsB,CAAC;AAQ9B,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,UAAU,EAChB,MAAM,uBAAuB,CAAC;AAK/B,MAAM,WAAW,UACf,SAAQ,IAAI,CACV,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,OAAO,GAAG,UAAU,CAC9B;IACD,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,eAAO,MAAM,KAAK,qFA4LjB,CAAC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/input/Input.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,EAEZ,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAqBf,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAKlD,KAAK,cAAc,GAAG,WAAW,GAC/B,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,CAAC,CAAC;AAE7E;;GAEG;AACH,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuEG;AACH,eAAO,MAAM,KAAK,qFA4LjB,CAAC"}

package/dist/components/input/Input.js

@@ -1,15 +1,15 @@
 "use client";
 import { jsx as n, jsxs as X } from "react/jsx-runtime";
-import Y, { forwardRef as q, useRef as ee, useImperativeHandle as se, useId as re, useCallback as x } from "react";
+import Y, { forwardRef as q, useRef as ee, useImperativeHandle as se, useId as re, useCallback as R } from "react";
 import { useAsheeConfig as ae } from "../../libs/context.js";
-import { RADIUS_CLASS as le } from "../../shared/radius.js";
-import { resolveVariantClass as oe } from "../../shared/variant.js";
-import { resolveCascade as c, resolveRadiusKey as te, resolveClassKey as ie } from "../../utils/resolve-token.js";
-import { FieldShell as de } from "../field/FieldShell.js";
+import { resolveCascade as c, resolveRadiusKey as le, resolveClassKey as oe } from "../../utils/resolve-token.js";
+import { FieldShell as te } from "../field/FieldShell.js";
 import { FALLBACK_FIELD_CONFIG as r } from "../field/field-config.js";
-import { INPUT_STATUS_BORDER_CLASS as ne, INPUT_SIZE_CLASS as ce } from "./input-styles.js";
-import { useKeyboardField as ue } from "../keyboard/use-keyboard-field.js";
-import { cn as K } from "../../utils/cn.js";
+import { INPUT_STATUS_BORDER_CLASS as ie, INPUT_SIZE_CLASS as de } from "./input-styles.js";
+import { useKeyboardField as ne } from "../keyboard/use-keyboard-field.js";
+import { resolveVariantClass as ce } from "../../shared/variant.js";
+import { RADIUS_CLASS as ue } from "../../shared/radius.js";
+import { cn as x } from "../../utils/cn.js";
 const me = q(
   ({
     size: N,
@@ -34,15 +34,15 @@ const me = q(
     enableVirtualKeyboard: j = !0,
     ...B
   }, D) => {
-    var R;
-    const i = ae(), e = (R = i.components) == null ? void 0 : R.input, m = ee(null);
+    var K;
+    const i = ae(), e = (K = i.components) == null ? void 0 : K.input, m = ee(null);
     se(D, () => m.current);
-    const k = re(), l = F ?? k, h = f ? `${l}-description` : void 0, I = v ? `${l}-message` : void 0, O = [h, I].filter(Boolean).join(" ") || void 0, { handleFocus: S, handleBlur: A } = ue(l, m, j), P = x(
+    const k = re(), l = F ?? k, h = f ? `${l}-description` : void 0, I = v ? `${l}-message` : void 0, O = [h, I].filter(Boolean).join(" ") || void 0, { handleFocus: S, handleBlur: A } = ne(l, m, j), P = R(
       (d) => {
         S(d), o == null || o(d);
       },
       [S, o]
-    ), $ = x(
+    ), $ = R(
       (d) => {
         A(), t == null || t(d);
       },
@@ -62,7 +62,7 @@ const me = q(
       e == null ? void 0 : e.color,
       i.defaultColor,
       r.color
-    ), H = te(
+    ), H = le(
       typeof p == "string" ? p : void 0,
       typeof (e == null ? void 0 : e.radius) == "string" ? e.radius : void 0,
       i.defaultRadius,
@@ -72,16 +72,16 @@ const me = q(
       e == null ? void 0 : e.labelAlign,
       void 0,
       r.labelAlign
-    ), M = oe(
+    ), M = ce(
       g,
       Z
-    ), Q = s !== "default" ? ne[s] : "", W = g === "underlined" ? "rounded-none" : ie(
+    ), Q = s !== "default" ? ie[s] : "", W = g === "underlined" ? "rounded-none" : oe(
       H,
-      le,
+      ue,
       r.radius
     );
     return /* @__PURE__ */ n(
-      de,
+      te,
       {
         id: l,
         label: z,
@@ -108,11 +108,11 @@ const me = q(
               "aria-busy": y,
               onFocus: P,
               onBlur: $,
-              className: K(
+              className: x(
                 "w-full text-foreground outline-none transition-colors shrink-0",
                 "focus-visible:ring-2 focus-visible:ring-offset-2",
                 "disabled:pointer-events-none disabled:opacity-50",
-                ce[C],
+                de[C],
                 M,
                 Q,
                 W,
@@ -127,7 +127,7 @@ const me = q(
           a && /* @__PURE__ */ n(
             "span",
             {
-              className: K(
+              className: x(
                 "absolute right-3 z-10 flex items-center",
                 typeof a == "string" || Y.isValidElement(a) && a.type === "span" ? "pointer-events-none" : "",
                 "text-foreground/50"

package/dist/components/input/PasswordInput.d.ts

@@ -1,9 +1,57 @@
 import { ReactNode } from 'react';
 import { InputProps } from './Input';
+/**
+ * Configuration options for the PasswordInput component.
+ */
 export interface PasswordInputProps extends Omit<InputProps, "type" | "endContent"> {
+    /**
+     * Function that returns the aria-label for the toggle button.
+     * Receives the current visibility state and returns a label string.
+     */
     toggleAriaLabel?: (show: boolean) => string;
+    /**
+     * Icon shown when password is hidden (show button).
+     * Defaults to EyeIcon.
+     */
     offIcon?: ReactNode;
+    /**
+     * Icon shown when password is visible (hide button).
+     * Defaults to EyeOffIcon.
+     */
     onIcon?: ReactNode;
 }
+/**
+ * A password input field with a toggleable visibility button.
+ *
+ * PasswordInput extends the Input component with a built-in toggle
+ * button that shows or hides the password text. It manages its own
+ * visibility state and provides appropriate aria-label handling for
+ * accessibility.
+ *
+ * @param props - PasswordInput configuration options.
+ * @param props.disabled - Whether the input is disabled.
+ * @param props.className - Extra CSS classes for the input.
+ * @param props.toggleAriaLabel - Function for toggle button aria-label.
+ * @param props.offIcon - Icon shown when password is hidden.
+ * @param props.onIcon - Icon shown when password is visible.
+ * @param props.autoComplete - Autocomplete attribute. Defaults to "current-password".
+ *
+ * @example
+ * ```tsx
+ * import { PasswordInput } from "asheeui";
+ *
+ * export function Example() {
+ *   return (
+ *     <PasswordInput
+ *       label="Password"
+ *       placeholder="Enter your password"
+ *       required
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * @see Input - The base input component.
+ */
 export declare const PasswordInput: import('react').ForwardRefExoticComponent<PasswordInputProps & import('react').RefAttributes<HTMLInputElement>>;
 //# sourceMappingURL=PasswordInput.d.ts.map

package/dist/components/input/PasswordInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordInput.d.ts","sourceRoot":"","sources":["../../../src/components/input/PasswordInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAc,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAI7D,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEjD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,YAAY,CAAC;IAC/C,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,CAAC;IAC5C,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,iHAiDzB,CAAC"}
+{"version":3,"file":"PasswordInput.d.ts","sourceRoot":"","sources":["../../../src/components/input/PasswordInput.tsx"],"names":[],"mappings":"AASA,OAAO,EAAc,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAI7D,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEjD;;GAEG;AACH,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,YAAY,CAAC;IAC/C;;;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,CAAC;IAE5C;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,aAAa,iHAiDzB,CAAC"}

package/dist/components/input/input-config.d.ts

@@ -1,7 +1,16 @@
 import { FieldConfig } from '../field/field-config';
+/**
+ * Theme configuration options for the Input component.
+ * Extends the shared FieldConfig with input-specific options.
+ * Set under `components.input` in the AsheeUI config.
+ */
 export interface InputConfig extends FieldConfig {
 }
-export declare const defaultInputConfig: InputConfig;
+/**
+ * Default config values registered for the Input component.
+ * Inherits the default field configuration.
+ */
+export declare const defaultInputConfig: FieldConfig;
 declare module "../../libs/registry" {
     interface ComponentTypeConfigRegistry {
         input: InputConfig;

package/dist/components/input/input-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-config.d.ts","sourceRoot":"","sources":["../../../src/components/input/input-config.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,MAAM,WAAW,WAAY,SAAQ,WAAW;CAAG;AAEnD,eAAO,MAAM,kBAAkB,EAAE,WAIhC,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,KAAK,EAAE,WAAW,CAAC;KACpB;CACF"}
+{"version":3,"file":"input-config.d.ts","sourceRoot":"","sources":["../../../src/components/input/input-config.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,EAAsB,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAE7E;;;;GAIG;AACH,MAAM,WAAW,WAAY,SAAQ,WAAW;CAAG;AAEnD;;;GAGG;AACH,eAAO,MAAM,kBAAkB,aAAqB,CAAC;AAErD,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,KAAK,EAAE,WAAW,CAAC;KACpB;CACF"}

package/dist/components/input/input-config.js

@@ -1,11 +1,8 @@
 "use client";
-import { registerComponentDefaults as e } from "../../libs/registry.js";
-const t = {
-  size: "md",
-  labelAlign: "left",
-  variant: "bordered"
-};
-e("input", t);
+import { registerComponentDefaults as t } from "../../libs/registry.js";
+import { defaultFieldConfig as e } from "../field/field-config.js";
+const o = e;
+t("input", o);
 export {
-  t as defaultInputConfig
+  o as defaultInputConfig
 };