asheeui 0.6.7 → 0.6.9

package/dist/components/autocomplete/Autocomplete.d.ts

@@ -1,12 +1,14 @@
 import { ReactNode } from 'react';
 import { InputProps } from '../input/Input';
 import { SelectMenuOption } from '../select-menu';
+import { MenuProps } from '../select-menu/SelectMenu';
 import { AutocompleteConfig } from './autocomplete-config';
-type BaseAutocompleteProps = AutocompleteConfig & Omit<InputProps, "value" | "onChange">;
 /**
  * Configuration options for the Autocomplete component.
+ * Extends InputProps to inherit all input field capabilities including
+ * label, description, validation, and content slots.
  */
-export interface AutocompleteProps extends BaseAutocompleteProps {
+export interface AutocompleteProps extends Omit<InputProps, "value" | "onChange" | "children">, Omit<AutocompleteConfig, "menu"> {
     /**
      * Suggestions shown while the user types.
      * Each option must have a label and a unique value.
@@ -45,9 +47,10 @@ export interface AutocompleteProps extends BaseAutocompleteProps {
      */
     belowList?: ReactNode;
     /**
-     * Extra classes applied to the floating dropdown.
+     * Menu configuration overrides including portal, portalTarget, className, and visual styles.
+     * All menu-related props should be passed through this object.
      */
-    dropdownClassName?: string;
+    menu?: MenuProps;
 }
 /**
  * A text input with a filterable suggestion dropdown.
@@ -65,26 +68,31 @@ export interface AutocompleteProps extends BaseAutocompleteProps {
  * By default, the dropdown menu uses React's createPortal to render at the
  * document body level. This ensures the menu escapes CSS containment, overflow
  * clipping, and stacking context issues. The portal can be disabled via the
- * `portal` prop or `components.autocomplete.portal` in the config if the menu
- * needs to stay within a specific parent container.
+ * `menu.portal` prop or `components.autocomplete.menu.portal` in the config
+ * if the menu needs to stay within a specific parent container.
  *
  * @param props - Autocomplete configuration options and input props.
- * @param props.options - Suggestion list.
+ * @param props.options - Suggestion list. Defaults to [].
  * @param props.value - Controlled selected value.
  * @param props.onValueChange - Selection callback.
  * @param props.onInputChange - Raw input change callback.
  * @param props.allowCustomValue - Allow free-form values. Defaults to false.
  * @param props.belowList - Content below the options list.
- * @param props.dropdownClassName - Extra dropdown classes.
- * @param props.menuVariant - Dropdown variant. Defaults to "solid".
- * @param props.color - Dropdown color. Defaults to "default".
- * @param props.radius - Dropdown radius. Defaults to "md".
- * @param props.size - Dropdown density. Defaults to "sm".
+ * @param props.menu - Menu configuration overrides including className, portal, portalTarget, and visual styles.
+ * @param props.variant - Visual style variant. Defaults to "bordered".
+ * @param props.color - Theme accent color. Defaults to "primary".
+ * @param props.radius - Corner rounding. Defaults to "md".
+ * @param props.size - Size of the input. Defaults to "md".
  * @param props.disabled - Whether the input is disabled.
- * @param props.placeholder - Placeholder text for the input.
+ * @param props.placeholder - Placeholder text. Defaults to "Type to search...".
  * @param props.className - Extra classes for the input.
- * @param props.portal - Whether to render the dropdown in a portal. Defaults to true.
- * @param props.portalTarget - Custom portal target element. Defaults to document.body.
+ * @param props.label - Label text for the input.
+ * @param props.description - Description text.
+ * @param props.message - Validation message.
+ * @param props.required - Whether the field is required. Defaults to false.
+ * @param props.status - Validation status.
+ * @param props.startContent - Content at the start of the input.
+ * @param props.endContent - Content at the end of the input.
  *
  * @example
  * ```tsx
@@ -99,6 +107,8 @@ export interface AutocompleteProps extends BaseAutocompleteProps {
  *         { label: "Svelte", value: "svelte" },
  *       ]}
  *       onValueChange={(value) => console.log(value)}
+ *       label="Framework"
+ *       description="Choose your preferred framework"
  *     />
  *   );
  * }
@@ -106,19 +116,26 @@ export interface AutocompleteProps extends BaseAutocompleteProps {
  *
  * @example
  * ```tsx
- * // With free-form values
+ * // With free-form values, custom content, and menu configuration
  * <Autocomplete
  *   allowCustomValue
  *   options={fruits}
  *   onValueChange={(value) => console.log('Selected:', value)}
  *   placeholder="Type a fruit name..."
+ *   belowList={<button onClick={addNew}>Add new fruit</button>}
+ *   isClearable
+ *   menu={{
+ *     className: "custom-dropdown",
+ *     portal: false,
+ *     itemVariant: "solid"
+ *   }}
  * />
  * ```
  *
  * @see AutocompleteConfig - The configuration type for component defaults.
+ * @see Input - The underlying input component for the trigger.
  * @see SelectMenu - The dropdown component used for suggestions.
  * @see useAsheeConfig - Hook for accessing the global configuration.
  */
 export declare const Autocomplete: import('react').ForwardRefExoticComponent<AutocompleteProps & import('react').RefAttributes<HTMLInputElement>>;
-export {};
 //# sourceMappingURL=Autocomplete.d.ts.map

package/dist/components/autocomplete/Autocomplete.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAKf,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,KAAK,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAE1E,OAAO,EACL,KAAK,kBAAkB,EAExB,MAAM,uBAAuB,CAAC;AAI/B,KAAK,qBAAqB,GAAG,kBAAkB,GAC7C,IAAI,CAAC,UAAU,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC;AAEzC;;GAEG;AACH,MAAM,WAAW,iBAAkB,SAAQ,qBAAqB;IAC9D;;;;;OAKG;IACH,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAE5B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,MAAM,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAE5E;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAE7C;;;;;;;;OAQG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqEG;AACH,eAAO,MAAM,YAAY,gHA+MxB,CAAC"}
+{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAKf,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,KAAK,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAC1E,OAAO,EAAE,KAAK,SAAS,EAAc,MAAM,2BAA2B,CAAC;AACvE,OAAO,EACL,KAAK,kBAAkB,EAExB,MAAM,uBAAuB,CAAC;AAI/B;;;;GAIG;AACH,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,UAAU,EAAE,OAAO,GAAG,UAAU,GAAG,UAAU,CAAC,EACzD,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC;IAClC;;;;;OAKG;IACH,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAE5B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,MAAM,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAE5E;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAE7C;;;;;;;;OAQG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,eAAO,MAAM,YAAY,gHAiMxB,CAAC"}

package/dist/components/autocomplete/Autocomplete.js

@@ -1,152 +1,136 @@
 "use client";
-import { jsxs as te, jsx as b } from "react/jsx-runtime";
-import { useFocus as re, useDismiss as se, useRole as oe, useInteractions as le } from "@floating-ui/react";
-import { forwardRef as ae, useMemo as F, useState as A, useEffect as ce, useCallback as K } from "react";
-import { useAsheeConfig as ie } from "../../libs/context.js";
-import { resolveCascade as c, resolveRadiusKey as me } from "../../utils/resolve-token.js";
-import { Input as pe } from "../input/Input.js";
-import { SelectMenu as de } from "../select-menu/SelectMenu.js";
-import { FALLBACK_AUTOCOMPLETE_CONFIG as o } from "./autocomplete-config.js";
-import { useSelectFloating as fe } from "../select-menu/use-select-floating.js";
-const ue = ae(
+import { jsxs as h, jsx as A } from "react/jsx-runtime";
+import { useFocus as V, useDismiss as g, useRole as C, useInteractions as ee } from "@floating-ui/react";
+import { forwardRef as te, useMemo as F, useState as K, useEffect as se, useCallback as L } from "react";
+import { useAsheeConfig as re } from "../../libs/context.js";
+import { resolveCascade as v, resolveRadiusKey as oe } from "../../utils/resolve-token.js";
+import { Input as le } from "../input/Input.js";
+import { SelectMenu as ie } from "../select-menu/SelectMenu.js";
+import { FALLBACK_AUTOCOMPLETE_CONFIG as p } from "./autocomplete-config.js";
+import { useSelectFloating as ce } from "../select-menu/use-select-floating.js";
+const fe = te(
   ({
-    options: l = [],
-    value: r,
-    onValueChange: s,
+    options: o = [],
+    value: s,
+    onValueChange: r,
     onInputChange: i,
     allowCustomValue: R = !1,
-    belowList: P,
-    dropdownClassName: L,
+    belowList: M,
     menu: z,
-    variant: w,
-    color: E,
-    radius: M,
+    variant: P,
+    color: w,
+    radius: E,
     size: N,
-    endContent: j,
-    onClick: v,
+    endContent: T,
+    onClick: n,
     disabled: O,
-    placeholder: _ = "Type to search...",
-    className: B,
-    portal: D,
-    portalTarget: G,
-    ...I
-  }, m) => {
-    var x;
-    const p = ie(), e = (x = p.components) == null ? void 0 : x.autocomplete, U = c(
-      w,
+    placeholder: j = "Type to search...",
+    className: _,
+    ...B
+  }, c) => {
+    var b;
+    const f = re(), e = (b = f.components) == null ? void 0 : b.autocomplete, D = v(
+      P,
       e == null ? void 0 : e.variant,
-      p.defaultVariant,
-      o.variant
-    ), q = c(
-      E,
+      f.defaultVariant,
+      p.variant
+    ), G = v(
+      w,
       e == null ? void 0 : e.color,
-      p.defaultColor,
-      o.color
-    ), H = me(
-      M,
+      f.defaultColor,
+      p.color
+    ), I = oe(
+      E,
       e == null ? void 0 : e.radius,
-      p.defaultRadius,
-      o.radius
-    ), J = c(
+      f.defaultRadius,
+      p.radius
+    ), U = v(
       N,
       e == null ? void 0 : e.size,
       void 0,
-      o.size
-    ), Q = c(
-      D,
-      e == null ? void 0 : e.portal,
-      void 0,
-      o.portal
-    ), W = c(
-      G,
-      e == null ? void 0 : e.portalTarget,
-      void 0,
-      o.portalTarget
-    ), a = F(
-      () => l.find((t) => t.value === r),
-      [l, r]
-    ), [S, d] = A(!1), [f, u] = A(
-      () => a ? a.label : String(r ?? "")
+      p.size
+    ), l = F(
+      () => o.find((t) => t.value === s),
+      [o, s]
+    ), [S, m] = K(!1), [a, u] = K(
+      () => l ? l.label : String(s ?? "")
     );
-    ce(() => {
-      a ? u(a.label) : r != null && u(String(r));
-    }, [a, r]);
-    const { refs: T, floatingStyles: X, context: n } = fe({
+    se(() => {
+      l ? u(l.label) : s != null && u(String(s));
+    }, [l, s]);
+    const { refs: x, floatingStyles: q, context: d } = ce({
       isOpen: S,
-      onOpenChange: d,
+      onOpenChange: m,
       disabled: O
-    }), Y = re(n), Z = se(n), $ = oe(n, { role: "combobox" }), { getReferenceProps: k, getFloatingProps: h } = le([
-      Y,
-      Z,
-      $
-    ]), V = F(() => f.trim() ? l.filter(
-      (t) => t.label.toLowerCase().includes(f.toLowerCase())
-    ) : l, [l, f]), g = K(
+    }), H = V(d), J = g(d), Q = C(d, { role: "combobox" }), { getReferenceProps: W, getFloatingProps: X } = ee([
+      H,
+      J,
+      Q
+    ]), Y = F(() => a.trim() ? o.filter(
+      (t) => t.label.toLowerCase().includes(a.toLowerCase())
+    ) : o, [o, a]), Z = L(
       (t) => {
         const y = t.target.value;
-        u(y), i == null || i(y), d(!0), R && (s == null || s(y));
+        u(y), i == null || i(y), m(!0), R && (r == null || r(y));
       },
-      [R, i, s]
-    ), C = K(
+      [R, i, r]
+    ), $ = L(
       (t) => {
-        u(t.label), s == null || s(t.value, t), d(!1);
+        u(t.label), r == null || r(t.value, t), m(!1);
       },
-      [s]
-    ), ee = F(
-      () => r != null ? [r] : [],
       [r]
+    ), k = F(
+      () => s != null ? [s] : [],
+      [s]
     );
-    return /* @__PURE__ */ te("div", { className: "w-full relative inline-block", children: [
-      /* @__PURE__ */ b(
-        pe,
+    return /* @__PURE__ */ h("div", { className: "w-full relative inline-block", children: [
+      /* @__PURE__ */ A(
+        le,
         {
           ref: (t) => {
-            T.setReference(t), typeof m == "function" ? m(t) : m && (m.current = t);
+            x.setReference(t), typeof c == "function" ? c(t) : c && (c.current = t);
           },
-          variant: U,
-          radius: H,
-          color: q,
-          size: J,
+          variant: D,
+          radius: I,
+          color: G,
+          size: U,
           disabled: O,
-          placeholder: _,
-          value: f,
-          onChange: g,
+          placeholder: j,
+          value: a,
+          onChange: Z,
           onClick: (t) => {
-            O || d(!0), v == null || v(t);
+            O || m(!0), n == null || n(t);
           },
           "aria-expanded": S,
           "aria-autocomplete": "none",
-          endContent: j,
-          className: B,
-          ...k(I)
+          endContent: T,
+          className: _,
+          ...W(B)
         }
       ),
-      /* @__PURE__ */ b(
-        de,
+      /* @__PURE__ */ A(
+        ie,
         {
           isOpen: S,
-          context: n,
-          floatingStyles: X,
-          getFloatingProps: h,
-          setFloatingRef: T.setFloating,
-          options: V,
-          selectedValues: ee,
-          onSelectOption: C,
+          context: d,
+          floatingStyles: q,
+          getFloatingProps: X,
+          setFloatingRef: x.setFloating,
+          options: Y,
+          selectedValues: k,
+          onSelectMenuOption: $,
           isSearch: !1,
-          belowList: P,
-          dropdownClassName: L,
+          belowList: M,
           menuProps: z,
           menuConfig: e == null ? void 0 : e.menu,
           initialFocus: -1,
-          returnFocus: !1,
-          portal: Q,
-          portalTarget: W
+          returnFocus: !1
         }
       )
     ] });
   }
 );
-ue.displayName = "Autocomplete";
+fe.displayName = "Autocomplete";
 export {
-  ue as Autocomplete
+  fe as Autocomplete
 };

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

@@ -1,5 +1,5 @@
 import { FieldConfig } from '../field/field-config';
-import { SelectMenuConfig } from '../select-menu';
+import { MenuConfig } from '../select-menu';
 /**
  * Theme configuration options for the Autocomplete component.
  *
@@ -12,23 +12,7 @@ export interface AutocompleteConfig extends FieldConfig {
      * Configuration for the dropdown menu that displays suggestions.
      * Controls the menu's visual appearance and behavior.
      */
-    menu?: SelectMenuConfig;
-    /**
-     * Whether to render the dropdown menu in a React portal.
-     * When true, the menu is rendered at the document body level,
-     * escaping any parent DOM hierarchy. This prevents CSS containment
-     * and stacking context issues. Defaults to true because dropdowns
-     * should always appear above other content.
-     *
-     * @default true
-     */
-    portal?: boolean;
-    /**
-     * Custom portal target element for the dropdown menu.
-     * When portal is enabled, the menu is rendered into this element.
-     * Defaults to document.body.
-     */
-    portalTarget?: HTMLElement | null;
+    menu?: MenuConfig;
 }
 /**
  * Default config values registered for the Autocomplete component.
@@ -42,8 +26,6 @@ export declare const defaultAutocompleteConfig: AutocompleteConfig;
  * and global defaults are all undefined.
  */
 export declare const FALLBACK_AUTOCOMPLETE_CONFIG: {
-    readonly portal: true;
-    readonly portalTarget: null;
     readonly size: import('../field').FieldSizeKey;
     readonly radius: import('../..').Radius;
     readonly variant: import('../..').Variant;

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

@@ -1 +1 @@
-{"version":3,"file":"autocomplete-config.d.ts","sourceRoot":"","sources":["../../../src/components/autocomplete/autocomplete-config.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD;;;;;;GAMG;AACH,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IAExB;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CACnC;AAED;;;;GAIG;AACH,eAAO,MAAM,yBAAyB,EAAE,kBAIvC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,4BAA4B;;;;;;;;;;CAI/B,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,YAAY,EAAE,kBAAkB,CAAC;KAClC;CACF"}
+{"version":3,"file":"autocomplete-config.d.ts","sourceRoot":"","sources":["../../../src/components/autocomplete/autocomplete-config.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED;;;;GAIG;AACH,eAAO,MAAM,yBAAyB,EAAE,kBAEvC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,4BAA4B;;;;;;;;CAE/B,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,YAAY,EAAE,kBAAkB,CAAC;KAClC;CACF"}

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

@@ -1,17 +1,13 @@
 "use client";
-import { registerComponentDefaults as t } from "../../libs/registry.js";
-import { FALLBACK_FIELD_CONFIG as o, defaultFieldConfig as e } from "../field/field-config.js";
-const l = {
-  ...e,
-  portal: !0,
-  portalTarget: null
-}, p = {
-  ...o,
-  portal: !0,
-  portalTarget: null
+import { registerComponentDefaults as o } from "../../libs/registry.js";
+import { FALLBACK_FIELD_CONFIG as t, defaultFieldConfig as e } from "../field/field-config.js";
+const C = {
+  ...e
+}, l = {
+  ...t
 };
-t("autocomplete", l);
+o("autocomplete", C);
 export {
-  p as FALLBACK_AUTOCOMPLETE_CONFIG,
-  l as defaultAutocompleteConfig
+  l as FALLBACK_AUTOCOMPLETE_CONFIG,
+  C as defaultAutocompleteConfig
 };

package/dist/components/button/Button.d.ts

@@ -1,15 +1,16 @@
+import { ReactNode } from 'react';
 import { ButtonConfig } from './button-config';
 /**
  * Visual and behavioural options shared by button-like elements.
  * This type combines the ButtonConfig with native button HTML attributes.
  */
-export type BaseButtonProps = ButtonConfig & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color" | "disabled">;
+type BaseButtonProps = ButtonConfig & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color" | "disabled">;
 /**
  * Configuration options for the Button component.
  *
  * @see {@link ButtonCommonProps} for the shared visual props.
  */
-interface ButtonProps extends BaseButtonProps {
+export interface ButtonProps extends BaseButtonProps {
     /**
      * Whether the button is in a disabled state.
      * Disabled buttons cannot be interacted with and appear dimmed.
@@ -38,14 +39,25 @@ interface ButtonProps extends BaseButtonProps {
      * @default false
      */
     icon?: boolean;
+    /**
+     * Content rendered at the start of the button.
+     * Typically an icon or adornment.
+     */
+    startContent?: ReactNode;
+    /**
+     * Content rendered at the end of the button.
+     * Typically an icon, badge, or adornment.
+     */
+    endContent?: ReactNode;
 }
 /**
  * A clickable element that triggers an action or event.
  *
  * Button supports multiple visual variants, theme colors, density and
- * radius scales, icon-only mode, loading state, and a press animation.
- * Visual tokens resolve through the standard AsheeUI cascade: prop,
- * component config, global theme defaults, and the built-in fallback.
+ * radius scales, icon-only mode, loading state, press animation, and
+ * start/end content slots for icons and adornments. Visual tokens resolve
+ * through the standard AsheeUI cascade: prop, component config, global
+ * theme defaults, and the built-in fallback.
  *
  * The component automatically handles accessibility attributes including
  * aria-disabled, aria-busy for loading states, and proper focus management.
@@ -62,6 +74,8 @@ interface ButtonProps extends BaseButtonProps {
  * @param props.isLoading - Loading state. Defaults to false.
  * @param props.type - Native button type. Defaults to "button".
  * @param props.icon - Icon-only compact layout. Defaults to false.
+ * @param props.startContent - Content at the start of the button.
+ * @param props.endContent - Content at the end of the button.
  * @param props.children - Button label content.
  * @param props.className - Extra CSS classes for the button.
  *
@@ -75,6 +89,7 @@ interface ButtonProps extends BaseButtonProps {
  *       variant="solid"
  *       color="primary"
  *       onClick={() => console.log("Clicked")}
+ *       startContent={<Icon />}
  *     >
  *       Click me
  *     </Button>
@@ -95,6 +110,17 @@ interface ButtonProps extends BaseButtonProps {
  * </Button>
  * ```
  *
+ * @example
+ * ```tsx
+ * // With end content badge
+ * <Button
+ *   variant="bordered"
+ *   endContent={<Badge count={5} />}
+ * >
+ *   Notifications
+ * </Button>
+ * ```
+ *
  * @see ButtonConfig - The configuration type for component defaults.
  * @see resolveVariantClass - Utility for resolving variant and color styles.
  * @see useAsheeConfig - Hook for accessing the global configuration.

package/dist/components/button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAE,KAAK,YAAY,EAA0B,MAAM,iBAAiB,CAAC;AAG5E;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,YAAY,GACxC,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC;AAE5E;;;;GAIG;AACH,UAAU,WAAY,SAAQ,eAAe;IAC3C;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IAErC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2DG;AACH,eAAO,MAAM,MAAM,2GAgHlB,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAWA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAiBpE,OAAO,EAAE,KAAK,YAAY,EAA0B,MAAM,iBAAiB,CAAC;AAK5E;;;GAGG;AACH,KAAK,eAAe,GAAG,YAAY,GACjC,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC;AAE5E;;;;GAIG;AACH,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IAErC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0EG;AACH,eAAO,MAAM,MAAM,2GAoHlB,CAAC"}