@radix-ui/themes/dist/esm/components/select.js

[](https://radix-ui.com/themes)

"use client";import*as e from"react";import i from"classnames";import*as l from"@radix-ui/react-select";import*as a from"@radix-ui/react-scroll-area";import{selectRootPropDefs as P,selectTriggerPropDefs as x,selectContentPropDefs as N}from"./select.props.js";import{extractProps as d}from"../helpers/index.js";import{marginPropDefs as R}from"../props/index.js";import{Theme as b,useThemeContext as w}from"./theme.js";import{ThickCheckIcon as E,ChevronDownIcon as G}from"./icons.js";const f=e.createContext({}),C=r=>{const{children:o,size:t=P.size.default,...s}=r;return e.createElement(l.Root,{...s},e.createElement(f.Provider,{value:e.useMemo(()=>({size:t}),[t])},o))};C.displayName="Select.Root";const u=e.forwardRef((r,o)=>{const t=e.useContext(f),{children:s,className:c,color:n,radius:m,placeholder:p,...S}=d({size:t?.size,...r},{size:P.size},x,R);return e.createElement(l.Trigger,{asChild:!0},e.createElement("button",{"data-accent-color":n,"data-radius":m,...S,ref:o,className:i("rt-reset","rt-SelectTrigger",c)},e.createElement("span",{className:"rt-SelectTriggerInner"},e.createElement(l.Value,{placeholder:p},s)),e.createElement(l.Icon,{asChild:!0},e.createElement(G,{className:"rt-SelectIcon"}))))});u.displayName="Select.Trigger";const g=e.forwardRef((r,o)=>{const t=e.useContext(f),{className:s,children:c,color:n,container:m,...p}=d({size:t?.size,...r},{size:P.size},N),S=w(),T=n||S.accentColor;return e.createElement(l.Portal,{container:m},e.createElement(b,{asChild:!0},e.createElement(l.Content,{"data-accent-color":T,sideOffset:4,...p,asChild:!1,ref:o,className:i({"rt-PopperContent":p.position==="popper"},"rt-SelectContent",s)},e.createElement(a.Root,{type:"auto",className:"rt-ScrollAreaRoot"},e.createElement(l.Viewport,{asChild:!0,className:"rt-SelectViewport"},e.createElement(a.Viewport,{className:"rt-ScrollAreaViewport",style:{overflowY:void 0}},c)),e.createElement(a.Scrollbar,{className:"rt-ScrollAreaScrollbar rt-r-size-1",orientation:"vertical"},e.createElement(a.Thumb,{className:"rt-ScrollAreaThumb"}))))))});g.displayName="Select.Content";const v=e.forwardRef((r,o)=>{const{className:t,children:s,...c}=r;return e.createElement(l.Item,{...c,asChild:!1,ref:o,className:i("rt-SelectItem",t)},e.createElement(l.ItemIndicator,{className:"rt-SelectItemIndicator"},e.createElement(E,{className:"rt-SelectItemIndicatorIcon"})),e.createElement(l.ItemText,null,s))});v.displayName="Select.Item";const y=e.forwardRef(({className:r,...o},t)=>e.createElement(l.Group,{...o,asChild:!1,ref:t,className:i("rt-SelectGroup",r)}));y.displayName="Select.Group";const h=e.forwardRef(({className:r,...o},t)=>e.createElement(l.Label,{...o,asChild:!1,ref:t,className:i("rt-SelectLabel",r)}));h.displayName="Select.Label";const I=e.forwardRef(({className:r,...o},t)=>e.createElement(l.Separator,{...o,asChild:!1,ref:t,className:i("rt-SelectSeparator",r)}));I.displayName="Select.Separator";export{g as Content,y as Group,v as Item,h as Label,C as Root,I as Separator,u as Trigger};
//# sourceMappingURL=select.js.map