UNPKG

@fork2e/umbrella

Version:

☂️ Umbrella UI React components based on @shadcn-ui

3 lines (2 loc) 3.16 kB
import*as e from"react";import*as a from"@radix-ui/react-select";import{ChevronDown as t,Check as l,ChevronUp as r}from"lucide-react";import{c as s}from"./utils.js";const o=a.Root,i=a.Value,n=e.forwardRef((({className:l,children:r,...o},i)=>e.createElement(a.Trigger,{ref:i,className:s("flex w-full items-center justify-between rounded-ui border border-input bg-white px-4 py-3 text-sm ring-offset-white placeholder:text-black/50 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",l),...o},r,e.createElement(a.Icon,{asChild:!0},e.createElement(t,{className:"h-4 w-4 opacity-50"})))));n.displayName=a.Trigger.displayName;const m=e.forwardRef((({className:t,...l},o)=>e.createElement(a.ScrollUpButton,{ref:o,className:s("flex cursor-default items-center justify-center py-1",t),...l},e.createElement(r,{className:"h-4 w-4"}))));m.displayName=a.ScrollUpButton.displayName;const c=e.forwardRef((({className:l,...r},o)=>e.createElement(a.ScrollDownButton,{ref:o,className:s("flex cursor-default items-center justify-center py-1",l),...r},e.createElement(t,{className:"h-4 w-4"}))));c.displayName=a.ScrollDownButton.displayName;const d=e.forwardRef((({className:t,children:l,position:r="popper",...o},i)=>e.createElement(a.Portal,null,e.createElement(a.Content,{ref:i,className:s("relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-ui border border-input bg-white text-black data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2","popper"===r&&"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",t),position:r,...o},e.createElement(m,null),e.createElement(a.Viewport,{className:s("p-1","popper"===r&&"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]")},l),e.createElement(c,null)))));d.displayName=a.Content.displayName;e.forwardRef((({className:t,...l},r)=>e.createElement(a.Label,{ref:r,className:s("py-1.5 pl-8 pr-2 text-sm font-semibold",t),...l}))).displayName=a.Label.displayName;const p=e.forwardRef((({className:t,children:r,...o},i)=>e.createElement(a.Item,{ref:i,className:s("relative flex w-full cursor-default select-none items-center rounded-md py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-input focus:text-black data-[disabled]:pointer-events-none data-[disabled]:opacity-50",t),...o},e.createElement("span",{className:"absolute left-2 flex h-3.5 w-3.5 items-center justify-center"},e.createElement(a.ItemIndicator,null,e.createElement(l,{className:"h-4 w-4"}))),e.createElement(a.ItemText,null,r))));p.displayName=a.Item.displayName;e.forwardRef((({className:t,...l},r)=>e.createElement(a.Separator,{ref:r,className:s("-mx-1 my-1 h-px bg-black/10",t),...l}))).displayName=a.Separator.displayName;export{o as S,d as a,p as b,n as c,i as d}; //# sourceMappingURL=select.js.map