asheeui 0.6.7 → 0.6.9

package/dist/components/select/Select.d.ts

@@ -1,11 +1,18 @@
 import { ReactNode } from 'react';
-import { SelectMenuOption } from '../select-menu/select-menu-config';
+import { InputProps } from '../input/Input';
+import { MenuConfig, SelectMenuOption } from '../select-menu/select-menu-config';
 import { SelectConfig } from './select-config';
-type BaseSelectProps = SelectConfig & Omit<React.SelectHTMLAttributes<HTMLSelectElement>, "color" | "size" | "value" | "onChange">;
+/**
+ * Field-related props that Select inherits from Input.
+ * Picked to avoid conflicts with Button-specific props.
+ */
+type SelectFieldProps = Pick<InputProps, "label" | "description" | "message" | "required" | "isLoading" | "status" | "labelAlign" | "className" | "id" | "style">;
 /**
  * Configuration options for the Select component.
+ * Extends field props from Input, and SelectConfig for
+ * component-specific options. Uses Button for trigger styling.
  */
-export interface SelectProps extends BaseSelectProps {
+export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"> {
     /**
      * Available options to select from.
      * Each option must have a label and a unique value.
@@ -25,40 +32,21 @@ export interface SelectProps extends BaseSelectProps {
      * Receives the new selected value directly.
      */
     onValueChange?: (value: string | number) => void;
-    /**
-     * Label text for the field.
-     */
-    label?: string;
-    /**
-     * Description text shown below the label.
-     */
-    description?: string;
-    /**
-     * Validation message shown below the field.
-     */
-    message?: string;
-    /**
-     * Whether the field is required.
-     * @default false
-     */
-    required?: boolean;
-    /**
-     * Whether the field is in a loading state.
-     * @default false
-     */
-    isLoading?: boolean;
     /**
      * Whether search input is shown in the dropdown.
+     *
      * @default false
      */
     isSearch?: boolean;
     /**
      * Placeholder text for the search input.
+     *
      * @default "Search options..."
      */
     searchPlaceholder?: string;
     /**
      * Name attribute for the search input.
+     *
      * @default "select-search"
      */
     searchInputName?: string;
@@ -68,46 +56,59 @@ export interface SelectProps extends BaseSelectProps {
     initialValue?: string | number;
     /**
      * Content rendered below the options list.
+     * Useful for adding "Add new" buttons or status messages.
      */
     belowList?: ReactNode;
     /**
      * Placeholder text shown when no value is selected.
+     *
      * @default "Select..."
      */
     placeholder?: string;
     /**
-     * Extra CSS classes for the trigger button.
+     * Name attribute for the select.
+     */
+    name?: string;
+    /**
+     * Content rendered at the start of the button.
+     * Typically an icon or adornment.
      */
-    className?: string;
+    startContent?: ReactNode;
     /**
-     * Extra CSS classes for the dropdown.
+     * Content rendered at the end of the button.
+     * Typically an icon, badge, or adornment.
      */
-    dropdownClassName?: string;
+    endContent?: ReactNode;
     /**
-     * Optional ID for the field.
+     * Whether the select is disabled.
+     *
+     * @default false
      */
-    id?: string;
+    disabled?: boolean;
     /**
-     * Name attribute for the select.
+     * Menu configuration overrides including portal, portalTarget, className, and visual styles.
+     * All menu-related props should be passed through this object.
      */
-    name?: string;
+    menu?: MenuConfig;
 }
 /**
  * A dropdown selector with search, label, validation, and configurable styles.
  *
  * Select renders a dropdown that allows selecting a single option from a list.
  * It supports search filtering, controlled and uncontrolled selection state,
- * validation states, and custom menu and trigger styles. Visual tokens resolve
- * through the standard AsheeUI cascade system.
+ * validation states, custom menu and trigger styles, and start/end content
+ * slots. Visual tokens resolve through the standard AsheeUI cascade system.
  *
- * The component uses Floating UI for positioning and accessibility, and
- * integrates with the FieldShell for consistent label and validation handling.
+ * The component uses a Button component as the trigger, which provides
+ * consistent button styling and behavior. It integrates with FieldShell for
+ * label, description, and message handling, and uses Floating UI for
+ * positioning and accessibility.
  *
  * 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.select.portal` in the config if the menu needs
- * to stay within a specific parent container.
+ * `menu.portal` prop or `components.select.menu.portal` in the config if the
+ * menu needs to stay within a specific parent container.
  *
  * @param props - Select configuration options.
  * @param props.options - Available options to select from.
@@ -117,11 +118,12 @@ export interface SelectProps extends BaseSelectProps {
  * @param props.label - Field label text.
  * @param props.description - Description text.
  * @param props.message - Validation message.
- * @param props.required - Whether the field is required.
- * @param props.isLoading - Loading state.
- * @param props.disabled - Disabled state.
+ * @param props.required - Whether the field is required. Defaults to false.
+ * @param props.isLoading - Loading state. Defaults to false.
+ * @param props.disabled - Disabled state. Defaults to false.
  * @param props.isSearch - Whether search is enabled. Defaults to false.
  * @param props.searchPlaceholder - Search placeholder. Defaults to "Search options...".
+ * @param props.searchInputName - Name attribute for the search input. Defaults to "select-search".
  * @param props.initialValue - Initial value for uncontrolled usage.
  * @param props.belowList - Content below the options list.
  * @param props.placeholder - Placeholder text. Defaults to "Select...".
@@ -131,8 +133,12 @@ export interface SelectProps extends BaseSelectProps {
  * @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.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.startContent - Content at the start of the trigger button.
+ * @param props.endContent - Content at the end of the trigger button.
+ * @param props.menu - Menu configuration overrides including className, portal, portalTarget, and visual styles.
+ * @param props.name - Name attribute for the select.
+ * @param props.className - Extra classes for the trigger button.
+ * @param props.id - HTML id attribute.
  *
  * @example
  * ```tsx
@@ -162,7 +168,7 @@ export interface SelectProps extends BaseSelectProps {
  *
  * @example
  * ```tsx
- * // With search and validation
+ * // With search, validation, and menu configuration
  * <Select
  *   options={fruits}
  *   label="Favorite Fruit"
@@ -170,10 +176,19 @@ export interface SelectProps extends BaseSelectProps {
  *   status="error"
  *   message="Please select a fruit"
  *   required
+ *   startContent={<FruitIcon />}
+ *   menu={{
+ *     className: "custom-dropdown",
+ *     portal: false,
+ *     itemVariant: "solid",
+ *     activeItemColor: "success"
+ *   }}
  * />
  * ```
  *
  * @see SelectConfig - The configuration type for component defaults.
+ * @see Input - The input component that provides field capabilities.
+ * @see Button - The button component used as the trigger.
  * @see SelectMenu - The dropdown menu component.
  * @see FieldShell - The wrapper component for label and validation.
  */

package/dist/components/select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAmBf,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAC1E,OAAO,EAA0B,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAK5E,KAAK,eAAe,GAAG,YAAY,GACjC,IAAI,CACF,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,CACxC,CAAC;AAEJ;;GAEG;AACH,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD;;;OAGG;IACH,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAE5B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE7D;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEjD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,eAAO,MAAM,MAAM,2GAsPlB,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAGjD,OAAO,KAAK,EACV,UAAU,EACV,gBAAgB,EACjB,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAA0B,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAK5E;;;GAGG;AACH,KAAK,gBAAgB,GAAG,IAAI,CAC1B,UAAU,EACR,OAAO,GACP,aAAa,GACb,SAAS,GACT,UAAU,GACV,WAAW,GACX,QAAQ,GACR,YAAY,GACZ,WAAW,GACX,IAAI,GACJ,OAAO,CACV,CAAC;AAEF;;;;GAIG;AACH,MAAM,WAAW,WACf,SAAQ,gBAAgB,EACtB,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAE5B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE7D;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEjD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoGG;AACH,eAAO,MAAM,MAAM,2GAyPlB,CAAC"}

package/dist/components/select/Select.js

@@ -1,197 +1,185 @@
 "use client";
-import { jsx as f, jsxs as T } from "react/jsx-runtime";
-import { useClick as ye, useDismiss as xe, useRole as Ae, useInteractions as Re } from "@floating-ui/react";
-import { forwardRef as ge, useId as he, useState as I, useMemo as b, useCallback as Le } from "react";
-import { ChevronDownIcon as Te } from "../../icons/ChevronDownIcon.js";
+import { jsx as l, jsxs as g, Fragment as pe } from "react/jsx-runtime";
+import { useClick as ve, useDismiss as Se, useRole as be, useInteractions as ye } from "@floating-ui/react";
+import { forwardRef as he, useId as xe, useState as k, useMemo as h, useCallback as Re } from "react";
+import { ChevronDownIcon as Ae } from "../../icons/ChevronDownIcon.js";
 import { useAsheeConfig as Ie } from "../../libs/context.js";
-import { resolveCascade as l, resolveRadiusKey as Ee, resolveClassKey as _e } from "../../utils/resolve-token.js";
-import { FieldShell as Fe } from "../field/FieldShell.js";
-import { SelectMenu as Ke } from "../select-menu/SelectMenu.js";
-import { FALLBACK_SELECT_CONFIG as t } from "./select-config.js";
-import { SELECT_STATUS_BORDER_CLASS as ke, SELECT_SIZE_CLASS as we } from "./select-styles.js";
-import { resolveVariantClass as Ne } from "../../shared/variant.js";
-import { RADIUS_CLASS as Oe } from "../../shared/radius.js";
-import { useSelectFloating as Pe } from "../select-menu/use-select-floating.js";
-import { cn as E } from "../../utils/cn.js";
-const De = ge(
+import { resolveCascade as p, resolveRadiusKey as Fe } from "../../utils/resolve-token.js";
+import { Button as Ke } from "../button/Button.js";
+import { FieldShell as Le } from "../field/FieldShell.js";
+import { SelectMenu as Ne } from "../select-menu/SelectMenu.js";
+import { FALLBACK_SELECT_CONFIG as o } from "./select-config.js";
+import { SELECT_STATUS_BORDER_CLASS as Oe } from "./select-styles.js";
+import { useSelectFloating as ge } from "../select-menu/use-select-floating.js";
+import { cn as x } from "../../utils/cn.js";
+const ke = he(
   ({
-    options: p = [],
-    value: s,
+    options: v = [],
+    value: r,
     onChange: S,
     onValueChange: a,
-    size: _,
-    radius: F,
-    variant: K,
-    color: k,
-    status: w,
-    label: N,
-    labelAlign: O,
-    description: P,
-    message: D,
-    required: j,
-    isLoading: z,
-    disabled: v,
-    isSearch: C = !1,
-    searchPlaceholder: B = "Search options...",
-    searchInputName: M = "select-search",
+    size: E,
+    radius: _,
+    variant: j,
+    color: w,
+    status: z,
+    label: B,
+    labelAlign: D,
+    description: b,
+    message: R,
+    required: M,
+    isLoading: A,
+    disabled: y,
+    isSearch: P = !1,
+    searchPlaceholder: T = "Search options...",
+    searchInputName: $ = "select-search",
     initialValue: n,
     belowList: Q,
-    placeholder: y = "Select...",
-    className: U,
-    dropdownClassName: G,
-    id: Z,
-    name: x,
-    menu: q,
-    portal: H,
-    portalTarget: J,
-    style: W
+    placeholder: I = "Select...",
+    className: G,
+    id: U,
+    name: F,
+    menu: W,
+    style: q,
+    startContent: H,
+    endContent: J
   }, i) => {
-    var L;
-    const c = Ie(), e = (L = c.components) == null ? void 0 : L.select, X = he(), Y = Z ?? X, [d, A] = I(!1), [$, R] = I(""), V = l(
-      _,
+    var O;
+    const c = Ie(), e = (O = c.components) == null ? void 0 : O.select, X = xe(), d = U ?? X, [u, K] = k(!1), [Y, L] = k(""), Z = p(
+      E,
       e == null ? void 0 : e.size,
       void 0,
-      t.size
-    ), g = l(
-      K,
+      o.size
+    ), C = p(
+      j,
       e == null ? void 0 : e.variant,
       c.defaultVariant,
-      t.variant
-    ), ee = l(
-      k,
+      o.variant
+    ), V = p(
+      w,
       e == null ? void 0 : e.color,
       c.defaultColor,
-      t.color
-    ), te = Ee(
-      F,
+      o.color
+    ), ee = Fe(
+      _,
       e == null ? void 0 : e.radius,
       c.defaultRadius,
-      t.radius
-    ), u = w ?? t.status, re = l(
-      O,
+      o.radius
+    ), m = z ?? o.status, te = p(
+      D,
       e == null ? void 0 : e.labelAlign,
       void 0,
-      t.labelAlign
-    ), se = l(
-      H,
-      e == null ? void 0 : e.portal,
-      void 0,
-      t.portal
-    ), oe = l(
-      J,
-      e == null ? void 0 : e.portalTarget,
-      void 0,
-      t.portalTarget
-    ), le = Ne(
-      g,
-      ee
-    ), ae = u !== "default" ? ke[u] : "", ne = g === "underlined" ? "rounded-none" : _e(
-      te,
-      Oe,
-      t.radius
-    ), o = b(
-      () => p.find((r) => r.value === s),
-      [p, s]
-    ), { refs: h, floatingStyles: ie, context: m } = Pe({
-      isOpen: d,
-      onOpenChange: A,
-      disabled: v
-    }), ce = ye(m, { enabled: !v }), de = xe(m), ue = Ae(m, { role: "listbox" }), { getReferenceProps: me, getFloatingProps: fe } = Re([
-      ce,
-      de,
-      ue
-    ]), pe = Le(
-      (r) => {
-        if (a == null || a(r.value), S) {
-          const be = {
-            target: { value: r.value, name: x ?? "" }
+      o.labelAlign
+    ), re = m !== "default" ? Oe[m] : "", s = h(
+      () => v.find((t) => t.value === r),
+      [v, r]
+    ), { refs: N, floatingStyles: se, context: f } = ge({
+      isOpen: u,
+      onOpenChange: K,
+      disabled: y
+    }), oe = ve(f, { enabled: !y }), le = Se(f), ae = be(f, { role: "listbox" }), { getReferenceProps: ne, getFloatingProps: ie } = ye([
+      oe,
+      le,
+      ae
+    ]), ce = Re(
+      (t) => {
+        if (a == null || a(t.value), S) {
+          const fe = {
+            target: { value: t.value, name: F ?? "" }
           };
-          S(be);
+          S(fe);
         }
-        A(!1), R("");
+        K(!1), L("");
       },
-      [x, S, a]
-    ), Se = b(() => o != null && o.label ? o.label : n !== void 0 ? String(n) : y, [o, n, y]), ve = b(
-      () => s != null ? [s] : [],
-      [s]
-    );
-    return /* @__PURE__ */ f(
-      Fe,
+      [F, S, a]
+    ), de = h(() => s != null && s.label ? s.label : n !== void 0 ? String(n) : I, [s, n, I]), ue = h(
+      () => r != null ? [r] : [],
+      [r]
+    ), me = ne();
+    return /* @__PURE__ */ l(
+      Le,
       {
-        id: Y,
-        label: N,
-        labelAlign: re,
-        description: P,
-        message: D,
-        status: u,
-        required: j,
-        isLoading: z,
-        children: /* @__PURE__ */ T("div", { className: "w-full relative inline-block", children: [
-          /* @__PURE__ */ T(
-            "button",
+        id: d,
+        label: B,
+        labelAlign: te,
+        description: b,
+        descriptionId: b ? `${d}-description` : void 0,
+        message: R,
+        messageId: R ? `${d}-message` : void 0,
+        status: m,
+        required: M,
+        isLoading: A,
+        children: /* @__PURE__ */ g("div", { className: "w-full relative inline-block", children: [
+          /* @__PURE__ */ l(
+            Ke,
             {
-              ref: (r) => {
-                h.setReference(r), typeof i == "function" ? i(r) : i && (i.current = r);
+              ref: (t) => {
+                N.setReference(t), typeof i == "function" ? i(t) : i && (i.current = t);
               },
               type: "button",
-              disabled: v,
-              "aria-expanded": d,
+              variant: C,
+              color: V,
+              animate: !1,
+              size: Z,
+              radius: ee,
+              isDisabled: y,
+              isLoading: A,
+              fullWidth: !0,
+              "aria-expanded": u,
               "aria-haspopup": "listbox",
-              "aria-invalid": u === "error",
-              className: E(
-                "w-full flex items-center justify-between font-normal text-left text-foreground transition-colors outline-none select-none cursor-pointer shrink-0",
-                "focus-visible:ring-2 focus-visible:ring-offset-2",
-                "disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed",
-                we[V],
-                le,
-                ae,
-                ne,
-                U
+              "aria-invalid": m === "error",
+              "aria-describedby": [b ? `${d}-description` : void 0].filter(Boolean).join(" ") || void 0,
+              className: x(
+                "font-normal text-left justify-between",
+                re,
+                G
               ),
-              style: W,
-              ...me(),
-              children: [
-                /* @__PURE__ */ f(
-                  "span",
-                  {
-                    className: o || n ? "text-foreground" : "text-foreground/70",
-                    children: Se
-                  }
-                ),
-                /* @__PURE__ */ f(
-                  Te,
+              style: q,
+              startContent: H,
+              endContent: /* @__PURE__ */ g(pe, { children: [
+                J,
+                /* @__PURE__ */ l(
+                  Ae,
                   {
-                    className: E(
-                      "ml-2 shrink-0 text-foreground/70 transition-transform duration-200",
-                      d && "rotate-180"
+                    className: x(
+                      "shrink-0 text-foreground/70 transition-transform duration-200",
+                      u && "rotate-180"
                     )
                   }
                 )
-              ]
+              ] }),
+              ...me,
+              children: /* @__PURE__ */ l(
+                "span",
+                {
+                  className: x(
+                    "truncate",
+                    s || n ? "text-foreground" : "text-foreground/70"
+                  ),
+                  children: de
+                }
+              )
             }
           ),
-          /* @__PURE__ */ f(
-            Ke,
+          /* @__PURE__ */ l(
+            Ne,
             {
-              isOpen: d,
-              context: m,
-              floatingStyles: ie,
-              getFloatingProps: fe,
-              setFloatingRef: h.setFloating,
-              options: p,
-              selectedValues: ve,
-              onSelectOption: pe,
-              isSearch: C,
-              searchPlaceholder: B,
-              searchInputName: M,
-              searchQuery: $,
-              onSearchChange: R,
+              isOpen: u,
+              context: f,
+              floatingStyles: se,
+              getFloatingProps: ie,
+              setFloatingRef: N.setFloating,
+              options: v,
+              selectedValues: ue,
+              onSelectMenuOption: ce,
+              isSearch: P,
+              searchPlaceholder: T,
+              searchInputName: $,
+              searchQuery: Y,
+              onSearchChange: L,
               belowList: Q,
-              dropdownClassName: G,
-              menuProps: q,
-              menuConfig: e,
-              portal: se,
-              portalTarget: oe
+              menuProps: W,
+              menuConfig: e == null ? void 0 : e.menu
             }
           )
         ] })
@@ -199,7 +187,7 @@ const De = ge(
     );
   }
 );
-De.displayName = "Select";
+ke.displayName = "Select";
 export {
-  De as Select
+  ke as Select
 };

package/dist/components/select/select-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 Select component.
  *
@@ -12,23 +12,7 @@ export interface SelectConfig extends FieldConfig {
      * Configuration for the dropdown menu.
      * 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 Select component.
@@ -41,17 +25,7 @@ export declare const defaultSelectConfig: SelectConfig;
  * These values are used when instance props, component config,
  * and global defaults are all undefined.
  */
-export declare const FALLBACK_SELECT_CONFIG: {
-    readonly portal: true;
-    readonly portalTarget: null;
-    readonly size: import('../field').FieldSizeKey;
-    readonly radius: import('../..').Radius;
-    readonly variant: import('../..').Variant;
-    readonly color: import('../..').Color;
-    readonly labelAlign: import('../field').LabelAlign;
-    readonly fullWidth: boolean;
-    readonly status: import('../field').FieldStatus;
-};
+export declare const FALLBACK_SELECT_CONFIG: Required<FieldConfig>;
 declare module "../../libs/registry" {
     interface ComponentTypeConfigRegistry {
         select: SelectConfig;

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

@@ -1 +1 @@
-{"version":3,"file":"select-config.d.ts","sourceRoot":"","sources":["../../../src/components/select/select-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD;;;;;;GAMG;AACH,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C;;;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,mBAAmB,EAAE,YAIjC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;CAIzB,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,MAAM,EAAE,YAAY,CAAC;KACtB;CACF"}
+{"version":3,"file":"select-config.d.ts","sourceRoot":"","sources":["../../../src/components/select/select-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,YAAiC,CAAC;AAEpE;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,uBAAwB,CAAC;AAE5D,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,MAAM,EAAE,YAAY,CAAC;KACtB;CACF"}

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

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

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

@@ -1,11 +1,6 @@
 "use client";
 import { FIELD_STATUS_BORDER_CLASS as S } from "../field/field-styles.js";
-const x = {
-  sm: "h-8 px-2.5 text-xs",
-  md: "h-10 px-3 text-sm",
-  lg: "h-12 px-4 text-base"
-}, E = S;
+const E = S;
 export {
-  x as SELECT_SIZE_CLASS,
   E as SELECT_STATUS_BORDER_CLASS
 };