@next-degree/pickle-shared-js 0.3.12 → 0.3.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/app/page.cjs +1 -1
- package/dist/app/page.cjs.map +1 -1
- package/dist/app/page.js +1 -1
- package/dist/app/page.js.map +1 -1
- package/dist/components/demos/ComboboxDemo.cjs +1 -1
- package/dist/components/demos/ComboboxDemo.cjs.map +1 -1
- package/dist/components/demos/ComboboxDemo.js +1 -1
- package/dist/components/demos/ComboboxDemo.js.map +1 -1
- package/dist/components/demos/index.cjs +1 -1
- package/dist/components/demos/index.cjs.map +1 -1
- package/dist/components/demos/index.js +1 -1
- package/dist/components/demos/index.js.map +1 -1
- package/dist/components/ui/Combobox.cjs +1 -1
- package/dist/components/ui/Combobox.cjs.map +1 -1
- package/dist/components/ui/Combobox.js +1 -1
- package/dist/components/ui/Combobox.js.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{useState as he}from"react";import{forwardRef as Ke,useEffect as Ue,useState as ge}from"react";import{ChevronDownIcon as Xe,CircleX as $e,icons as qe}from"lucide-react";import{cva as Qe}from"cva";import{clsx as Ne}from"clsx";import{twMerge as ke}from"tailwind-merge";function a(...e){return ke(Ne(e))}import{Command as m}from"cmdk";import{Search as Le}from"lucide-react";import*as y from"react";import*as i from"@radix-ui/react-dialog";import{X as we}from"lucide-react";import*as N from"react";import{jsx as v,jsxs as M}from"react/jsx-runtime";var De=i.Portal;var Z=N.forwardRef(({className:e,...t},o)=>v(i.Overlay,{ref:o,className:a("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",e),...t}));Z.displayName=i.Overlay.displayName;var j=N.forwardRef(({className:e,children:t,...o},r)=>M(De,{children:[v(Z,{}),M(i.Content,{ref:r,className:a("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950",e),...o,children:[t,M(i.Close,{className:"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-neutral-950 focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-neutral-100 data-[state=open]:text-neutral-500 dark:ring-offset-neutral-950 dark:focus:ring-neutral-300 dark:data-[state=open]:bg-neutral-800 dark:data-[state=open]:text-neutral-400",children:[v(we,{className:"h-4 w-4"}),v("span",{className:"sr-only",children:"Close"})]})]})]}));j.displayName=i.Content.displayName;var Se=({className:e,...t})=>v("div",{className:a("flex flex-col space-y-1.5 text-center sm:text-left",e),...t});Se.displayName="DialogHeader";var Ie=({className:e,...t})=>v("div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...t});Ie.displayName="DialogFooter";var Ee=N.forwardRef(({className:e,...t},o)=>v(i.Title,{ref:o,className:a("text-lg font-semibold leading-none tracking-tight",e),...t}));Ee.displayName=i.Title.displayName;var Te=N.forwardRef(({className:e,...t},o)=>v(i.Description,{ref:o,className:a("text-sm text-neutral-500 dark:text-neutral-400",e),...t}));Te.displayName=i.Description.displayName;import{jsx as u,jsxs as ze}from"react/jsx-runtime";var B=y.forwardRef(({className:e,...t},o)=>u(m,{ref:o,className:a("flex h-full w-full flex-col overflow-hidden rounded-xl bg-white text-neutral-950",e),...t}));B.displayName=m.displayName;var H=y.forwardRef(({className:e,...t},o)=>ze("div",{className:"m-1 flex items-center rounded-xl border px-3","cmdk-input-wrapper":"",children:[u(Le,{className:"mr-2 h-4 w-4 shrink-0 opacity-50"}),u(m.Input,{ref:o,className:a("flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-neutral-500 disabled:cursor-not-allowed disabled:opacity-50",e),...t})]}));H.displayName=m.Input.displayName;var A=y.forwardRef(({className:e,...t},o)=>u(m.List,{ref:o,className:a("overflow-y-auto overflow-x-hidden",e),...t}));A.displayName=m.List.displayName;var O=y.forwardRef((e,t)=>u(m.Empty,{ref:t,className:"py-6 text-center text-sm",...e}));O.displayName=m.Empty.displayName;var G=y.forwardRef(({className:e,...t},o)=>u(m.Group,{ref:o,className:a("overflow-hidden p-1 text-neutral-950 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500",e),...t}));G.displayName=m.Group.displayName;var We=y.forwardRef(({className:e,...t},o)=>u(m.Separator,{ref:o,className:a("-mx-1 h-px bg-neutral-200",e),...t}));We.displayName=m.Separator.displayName;var F=y.forwardRef(({className:e,...t},o)=>u(m.Item,{ref:o,className:a("relative flex cursor-pointer select-none items-center rounded-xl px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected='true']:bg-neutral-100 data-[selected=true]:text-neutral-900 data-[disabled=true]:opacity-50",e),...t}));F.displayName=m.Item.displayName;var Ve=({className:e,...t})=>u("span",{className:a("ml-auto text-xs tracking-widest text-neutral-500",e),...t});Ve.displayName="CommandShortcut";import*as te from"react";import*as g from"@radix-ui/react-popover";import{jsx as ee}from"react/jsx-runtime";var oe=g.Root,ae=g.Trigger,Y=te.forwardRef(({className:e,align:t="center",sideOffset:o=4,...r},n)=>ee(g.Portal,{children:ee(g.Content,{ref:n,align:t,sideOffset:o,className:a("z-50 rounded-2xl border bg-white p-4 text-black shadow-md outline-none 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",e),...r})}));Y.displayName=g.Content.displayName;import*as J from"@radix-ui/react-separator";import*as ie from"react";import{jsx as _e}from"react/jsx-runtime";var K=ie.forwardRef(({className:e,orientation:t="horizontal",decorative:o=!0,...r},n)=>_e(J.Root,{ref:n,decorative:o,orientation:t,className:a("shrink-0 bg-grey-10",t==="horizontal"?"h-[1px] w-full":"h-full w-[1px]",e),...r}));K.displayName=J.Root.displayName;import{CheckIcon as He}from"lucide-react";import*as w from"@radix-ui/react-checkbox";import{Check as Me,Minus as Be}from"lucide-react";import{forwardRef as re}from"react";import{jsx as k,jsxs as me}from"react/jsx-runtime";var ne=re(({className:e,...t},o)=>k(w.Root,{ref:o,className:a("group","peer","h-5","w-5","shrink-0","rounded-md","border","border-grey-10","outline","outline-1","outline-offset-2","outline-transparent","hover:border-grey-20","focus:outline-purple-100","active:border-green-80","disabled:cursor-not-allowed","disabled:opacity-50","data-[state=checked]:bg-green-80","data-[state=indeterminate]:bg-green-80","data-[state=checked]:text-white","data-[state=indeterminate]:text-primary-foreground",t.disabled&&"data-[state=checked]:text-foreground bg-grey-20 data-[state=checked]:bg-grey-20",e),...t,children:me(w.Indicator,{className:"flex items-center justify-center text-current",children:[k(Me,{className:"hidden h-4 w-4 group-data-[state=checked]:block"}),k(Be,{className:"hidden h-4 w-4 group-data-[state=indeterminate]:block"})]})}));ne.displayName=w.Root.displayName;var le=re(({classNames:e,children:t,...o},r)=>{let{disabled:n}=o,p=o.id??`${o.name??o.value?.toString()}-checkbox`,s=n?"text-grey-40 pointer-events-none":"";return me("div",{className:a("flex space-x-2",e?.wrapper),children:[k(ne,{id:p,disabled:n,ref:r,...o}),k("label",{htmlFor:p,className:a(s,e?.label),children:t})]})});le.displayName="Checkbox";var se=le;import{icons as pe}from"lucide-react";import{jsx as P,jsxs as de}from"react/jsx-runtime";function Ae({icon:e,hasCheckbox:t,isSelected:o,className:r,title:n,value:p,description:s,...V}){let E=e?(b=>{if(b in pe){let z=pe[b];return P(z,{size:14})}return null})(e):void 0;return de("li",{className:a("group relative flex w-72 cursor-pointer flex-row items-center text-left text-sm",r),...V,"data-state":o?"checked":"unchecked",children:[E&&P("span",{className:"mr-2",children:E}),t&&P(se,{id:p,checked:o,onClick:b=>b.preventDefault()}),de("div",{children:[P("p",{children:n}),P("p",{className:"text-xs text-grey-80",children:s})]}),P(He,{className:"absolute inset-y-0 right-0 my-auto hidden w-6 text-green-100 group-data-[state=checked]:block",size:16})]})}var ce=Ae;import{cva as Oe}from"cva";import{jsx as Fe}from"react/jsx-runtime";var Ge=Oe("rounded-full px-2 py-0.5 text-xs font-semibold",{variants:{variant:{green:"bg-green-90 text-white",pickle:"bg-pickle-100 text-black",purple:"bg-purple-100 text-white"}},defaultVariants:{variant:"green"}});function fe({className:e,variant:t,...o}){return Fe("div",{className:a(Ge({variant:t}),e),...o})}import{jsx as Je}from"react/jsx-runtime";function Ye({text:e,className:t,...o}){return e?Je("label",{className:a("text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",t),...o,children:e}):null}var ue=Ye;import{jsx as l,jsxs as D}from"react/jsx-runtime";var S=Ke((e,t)=>{let{value:o,label:r,options:n,classNames:p,multiselect:s,placeholder:V,variant:I="default",size:E,icon:b,className:z,onChange:T,children:_}=e,[h,L]=ge([]),[U,X]=ge(!1),$=b&&qe[b],ye=n?.length<=5,R=I==="default",be=I==="chip",q=()=>X(!1);Ue(()=>{L(s?o??[]:o?[o]:[])},[o]);let xe=f=>{if(s)return L(x=>{let Q=x.includes(f)?x.filter(Re=>Re!==f):[...x,f];return T?.(Q),Q});L([f]),T?.(f),q()},Ce=()=>{L([]),T?.(s?[]:"")},Pe=()=>{let f=h.length>0?h.join(", "):V;return R?f:r};return D("div",{className:a("flex flex-col gap-2",z),children:[R&&r&&l(ue,{text:r,className:p?.label}),D(oe,{open:U,onOpenChange:X,children:[l(ae,{asChild:!0,disabled:n.length===0,children:D("div",{ref:t,className:a(Ze({variant:I,size:E}),p?.trigger),"aria-expanded":U,children:[R&&$&&l($,{className:"h-4 w-4 shrink-0"}),be&&h.length>0&&l(fe,{variant:"purple",children:h.length}),l("span",{className:a("w-full truncate leading-normal",R&&h.length==0&&"text-grey-40"),children:Pe()}),h.length==0&&l(Xe,{className:"shrink-0 transform group-data-[state=open]:rotate-180",size:"16"}),R&&h.length>0&&l("button",{type:"button",className:"flex h-8 w-8 shrink-0 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20",onClick:Ce,children:l($e,{className:"h-4 w-4 text-green-100"})})]})}),l(B,{children:D(Y,{className:a("flex w-full max-w-xs flex-col overflow-hidden p-0","max-h-[--radix-popover-content-available-height]",p?.content),collisionPadding:8,sideOffset:4,align:"start",children:[!ye&&l(H,{placeholder:"Search..."}),D(A,{children:[l(O,{children:"No results"}),l(G,{children:n.map(({id:f,...x})=>l(F,{value:x.value,onSelect:xe,children:l(ce,{className:a(p?.items,"truncate py-1"),isSelected:h?.includes(x.value),hasCheckbox:s,...x})},f))})]}),!!_&&l(K,{}),_&&_({close:q})]})})]})]})});S.displayName="Combobox";var Ze=Qe("group relative cursor-pointer text-green-100 flex flex-row items-center justify-between gap-2 border border-grey-20 focus:outline-green-80 disabled:bg-grey-5",{variants:{variant:{default:["w-full","max-w-80","rounded-lg"],chip:["font-bold","rounded-3xl","data-[state=open]:bg-black","data-[state=open]:text-white"]},size:{small:["h-8","p-1","pl-2","text-xs"],normal:["h-9","p-2","pl-3","text-sm"],large:["h-10","p-3","pl-4","text-base"]}},defaultVariants:{variant:"default",size:"normal"}});import{Slot as je}from"@radix-ui/react-slot";import{cva as et}from"cva";import{forwardRef as tt}from"react";import{jsx as at}from"react/jsx-runtime";var W=tt(({className:e,variant:t,size:o,asChild:r=!1,...n},p)=>at(r?je:"button",{className:a(ot({variant:t,size:o,className:e})),ref:p,...n}));W.displayName="Button";var ot=et(["flex","items-center","justify-center","gap-2","rounded-full","font-bold","outline-2","outline-offset-2","outline-dashed","outline-transparent"],{variants:{variant:{neutral:["bg-black","text-white","hover:bg-grey-90","active:bg-grey-80","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],primary:["bg-pickle-100","text-black","hover:bg-pickle-80","active:bg-pickle-60","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],secondary:["bg-green-80","text-white","hover:bg-green-90","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40","disabled:bg-grey-10"],transparent:["text-white","hover:bg-green-80","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40"],link:["leading-tight","text-black","underline","hover:text-purple-100","focus:text-black","focus:outline-purple-100","active:text-purple-80"]},size:{small:["h-10","text-sm","px-4","py-2"],medium:["h-12","text-base","px-6","py-3"],large:["h-14","text-lg","px-8","py-4"]}},defaultVariants:{variant:"neutral",size:"medium"},compoundVariants:[{variant:"link",size:"small",class:["h-3","text-xs","p-0"]},{variant:"link",size:"medium",class:["h-4","text-sm","p-0"]},{variant:"link",size:"large",class:["h-6","text-base","p-0"]}]});import{jsx as C,jsxs as ve}from"react/jsx-runtime";function it(){let[e,t]=he([]),[o,r]=he(""),n=[{title:"Nirvana",value:"Nirvana",description:"Come As You Are",id:1},{title:"Pearl Jam",value:"Pearl Jam",description:"Jeremy",id:2},{title:"Soundgarden",value:"Soundgarden",description:"Rusty Cage",id:3},{title:"Alice in Chains",value:"Alice in Chains",description:"Would?",id:4},{title:"Stone Temple Pilots",value:"Stone Temple Pilots",id:5},{title:"Hole",value:"Hole",id:6},{title:"Mudhoney",value:"Mudhoney",id:7},{title:"Screaming Trees",value:"Screaming Trees",id:8},{title:"L7",value:"L7",id:9},{title:"Sonic Youth",value:"Sonic Youth",id:10},{title:"And You Will Know Us by the Trail of Dead",value:"And You Will Know Us by the Trail of Dead",id:11}];return ve("div",{className:"flex flex-row flex-wrap items-center gap-4 p-4",children:[C(S,{label:"US bands from the 90's",placeholder:"Select a band",icon:"Music",options:n,multiselect:!0,onChange:t,value:e}),C(S,{label:"US bands from the 90's",options:n,variant:"chip",multiselect:!0,onChange:t,value:e}),C(S,{label:"Fruit label",variant:"chip",options:[{title:"Cherry",value:"Cherry",id:1,icon:"Cherry"},{title:"Grape",value:"Grape",id:2,icon:"Grape"}],value:o,onChange:r,children:({close:s})=>ve("div",{className:"flex flex-row items-center justify-between bg-white p-2 pl-4",children:[C(W,{variant:"link",tabIndex:-1,onClick:s,children:"Clear"}),C(W,{variant:"primary",size:"small",tabIndex:-1,children:"Apply"})]})}),e.map(s=>C("span",{className:"text-green-80",children:s},s)),C("span",{className:"text-purple-100",children:o})]})}var No=it;export{No as default};
|
|
1
|
+
"use client";import{useState as ye}from"react";import{forwardRef as Ue,useEffect as Xe,useState as he}from"react";import{ChevronDownIcon as $e,CircleX as qe,icons as Qe}from"lucide-react";import{cva as Ze}from"cva";import{clsx as ke}from"clsx";import{twMerge as we}from"tailwind-merge";function a(...e){return we(ke(e))}import{Command as p}from"cmdk";import{Search as We}from"lucide-react";import*as b from"react";import*as r from"@radix-ui/react-dialog";import{X as De}from"lucide-react";import*as w from"react";import{jsx as y,jsxs as H}from"react/jsx-runtime";var Se=r.Portal;var ee=w.forwardRef(({className:e,...t},o)=>y(r.Overlay,{ref:o,className:a("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",e),...t}));ee.displayName=r.Overlay.displayName;var te=w.forwardRef(({className:e,children:t,...o},n)=>H(Se,{children:[y(ee,{}),H(r.Content,{ref:n,className:a("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950",e),...o,children:[t,H(r.Close,{className:"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-neutral-950 focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-neutral-100 data-[state=open]:text-neutral-500 dark:ring-offset-neutral-950 dark:focus:ring-neutral-300 dark:data-[state=open]:bg-neutral-800 dark:data-[state=open]:text-neutral-400",children:[y(De,{className:"h-4 w-4"}),y("span",{className:"sr-only",children:"Close"})]})]})]}));te.displayName=r.Content.displayName;var Ie=({className:e,...t})=>y("div",{className:a("flex flex-col space-y-1.5 text-center sm:text-left",e),...t});Ie.displayName="DialogHeader";var Ee=({className:e,...t})=>y("div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...t});Ee.displayName="DialogFooter";var Te=w.forwardRef(({className:e,...t},o)=>y(r.Title,{ref:o,className:a("text-lg font-semibold leading-none tracking-tight",e),...t}));Te.displayName=r.Title.displayName;var Le=w.forwardRef(({className:e,...t},o)=>y(r.Description,{ref:o,className:a("text-sm text-neutral-500 dark:text-neutral-400",e),...t}));Le.displayName=r.Description.displayName;import{jsx as g,jsxs as _e}from"react/jsx-runtime";var A=b.forwardRef(({className:e,...t},o)=>g(p,{ref:o,className:a("flex h-full w-full flex-col overflow-hidden rounded-xl bg-white text-neutral-950",e),...t}));A.displayName=p.displayName;var O=b.forwardRef(({className:e,...t},o)=>_e("div",{className:"m-1 flex items-center rounded-xl border px-3","cmdk-input-wrapper":"",children:[g(We,{className:"mr-2 h-4 w-4 shrink-0 opacity-50"}),g(p.Input,{ref:o,className:a("flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-neutral-500 disabled:cursor-not-allowed disabled:opacity-50",e),...t})]}));O.displayName=p.Input.displayName;var G=b.forwardRef(({className:e,...t},o)=>g(p.List,{ref:o,className:a("overflow-y-auto overflow-x-hidden",e),...t}));G.displayName=p.List.displayName;var F=b.forwardRef((e,t)=>g(p.Empty,{ref:t,className:"py-6 text-center text-sm",...e}));F.displayName=p.Empty.displayName;var Y=b.forwardRef(({className:e,...t},o)=>g(p.Group,{ref:o,className:a("overflow-hidden p-1 text-neutral-950 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500",e),...t}));Y.displayName=p.Group.displayName;var Ve=b.forwardRef(({className:e,...t},o)=>g(p.Separator,{ref:o,className:a("-mx-1 h-px bg-neutral-200",e),...t}));Ve.displayName=p.Separator.displayName;var J=b.forwardRef(({className:e,...t},o)=>g(p.Item,{ref:o,className:a("relative flex cursor-pointer select-none items-center rounded-xl px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected='true']:bg-neutral-100 data-[selected=true]:text-neutral-900 data-[disabled=true]:opacity-50",e),...t}));J.displayName=p.Item.displayName;var ze=({className:e,...t})=>g("span",{className:a("ml-auto text-xs tracking-widest text-neutral-500",e),...t});ze.displayName="CommandShortcut";import*as ae from"react";import*as v from"@radix-ui/react-popover";import{jsx as oe}from"react/jsx-runtime";var ie=v.Root,re=v.Trigger,K=ae.forwardRef(({className:e,align:t="center",sideOffset:o=4,...n},i)=>oe(v.Portal,{children:oe(v.Content,{ref:i,align:t,sideOffset:o,className:a("z-50 rounded-2xl border bg-white p-4 text-black shadow-md outline-none 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",e),...n})}));K.displayName=v.Content.displayName;import*as U from"@radix-ui/react-separator";import*as ne from"react";import{jsx as Me}from"react/jsx-runtime";var X=ne.forwardRef(({className:e,orientation:t="horizontal",decorative:o=!0,...n},i)=>Me(U.Root,{ref:i,decorative:o,orientation:t,className:a("shrink-0 bg-grey-10",t==="horizontal"?"h-[1px] w-full":"h-full w-[1px]",e),...n}));X.displayName=U.Root.displayName;import{CheckIcon as Ae}from"lucide-react";import*as S from"@radix-ui/react-checkbox";import{Check as Be,Minus as He}from"lucide-react";import{forwardRef as le}from"react";import{jsx as D,jsxs as de}from"react/jsx-runtime";var se=le(({className:e,...t},o)=>D(S.Root,{ref:o,className:a("group","peer","h-5","w-5","shrink-0","rounded-md","border","border-grey-10","outline","outline-1","outline-offset-2","outline-transparent","hover:border-grey-20","focus:outline-purple-100","active:border-green-80","disabled:cursor-not-allowed","disabled:opacity-50","data-[state=checked]:bg-green-80","data-[state=indeterminate]:bg-green-80","data-[state=checked]:text-white","data-[state=indeterminate]:text-primary-foreground",t.disabled&&"data-[state=checked]:text-foreground bg-grey-20 data-[state=checked]:bg-grey-20",e),...t,children:de(S.Indicator,{className:"flex items-center justify-center text-current",children:[D(Be,{className:"hidden h-4 w-4 group-data-[state=checked]:block"}),D(He,{className:"hidden h-4 w-4 group-data-[state=indeterminate]:block"})]})}));se.displayName=S.Root.displayName;var me=le(({classNames:e,children:t,...o},n)=>{let{disabled:i}=o,d=o.id??`${o.name??o.value?.toString()}-checkbox`,m=i?"text-grey-40 pointer-events-none":"";return de("div",{className:a("flex space-x-2",e?.wrapper),children:[D(se,{id:d,disabled:i,ref:n,...o}),D("label",{htmlFor:d,className:a(m,e?.label),children:t})]})});me.displayName="Checkbox";var pe=me;import{icons as ce}from"lucide-react";import{jsx as R,jsxs as fe}from"react/jsx-runtime";function Oe({icon:e,hasCheckbox:t,isSelected:o,className:n,title:i,value:d,description:m,..._}){let L=e?(x=>{if(x in ce){let M=ce[x];return R(M,{size:14})}return null})(e):void 0;return fe("li",{className:a("group relative flex w-72 cursor-pointer flex-row items-center text-left text-sm",n),..._,"data-state":o?"checked":"unchecked",children:[L&&R("span",{className:"mr-2",children:L}),t&&R(pe,{id:d,checked:o,onClick:x=>x.preventDefault()}),fe("div",{children:[R("p",{children:i}),R("p",{className:"text-xs text-grey-80",children:m})]}),R(Ae,{className:"absolute inset-y-0 right-0 my-auto hidden w-6 text-green-100 group-data-[state=checked]:block",size:16})]})}var ue=Oe;import{cva as Ge}from"cva";import{jsx as Ye}from"react/jsx-runtime";var Fe=Ge("rounded-full px-2 py-0.5 text-xs font-semibold",{variants:{variant:{green:"bg-green-90 text-white",pickle:"bg-pickle-100 text-black",purple:"bg-purple-100 text-white"}},defaultVariants:{variant:"green"}});function ge({className:e,variant:t,...o}){return Ye("div",{className:a(Fe({variant:t}),e),...o})}import{jsx as Ke}from"react/jsx-runtime";function Je({text:e,className:t,...o}){return e?Ke("label",{className:a("text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",t),...o,children:e}):null}var ve=Je;import{jsx as s,jsxs as I}from"react/jsx-runtime";var E=Ue((e,t)=>{let{value:o,label:n,options:i,classNames:d,multiselect:m,placeholder:_,variant:T="default",size:L,icon:x,className:M,onChange:W,children:B}=e,[h,V]=he([]),[$,q]=he(!1),Q=x&&Qe[x],xe=i?.length<=5,N=T==="default",Ce=T==="chip",Z=()=>q(!1);Xe(()=>{V((m?o??[]:o?[o]:[]).map(l=>i.find(u=>u.value===l)).filter(l=>l!==void 0))},[o]);let Pe=C=>{let l=i.find(u=>u.value===C);if(l){if(m)return V(u=>{let j=u.some(k=>k.value===C)?u.filter(k=>k!==l):[...u,l];return W?.(j.map(k=>k.value)),j});V([l]),W?.(l.value),Z()}},Re=()=>{V([]),W?.(m?[]:"")},Ne=()=>{let C=h.length>0?h.map(l=>l.title).join(", "):_;return N?C:n};return I("div",{className:a("flex flex-col gap-2",M),children:[N&&n&&s(ve,{text:n,className:d?.label}),I(ie,{open:$,onOpenChange:q,children:[s(re,{asChild:!0,disabled:i.length===0,children:I("div",{ref:t,className:a(je({variant:T,size:L}),d?.trigger),"aria-expanded":$,children:[N&&Q&&s(Q,{className:"h-4 w-4 shrink-0"}),Ce&&h.length>0&&s(ge,{variant:"purple",children:h.length}),s("span",{className:a("w-full truncate leading-normal",N&&h.length==0&&"text-grey-40"),children:Ne()}),h.length==0&&s($e,{className:"shrink-0 transform group-data-[state=open]:rotate-180",size:"16"}),N&&h.length>0&&s("button",{type:"button",className:"flex h-8 w-8 shrink-0 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20",onClick:Re,children:s(qe,{className:"h-4 w-4 text-green-100"})})]})}),s(A,{children:I(K,{className:a("flex w-full max-w-xs flex-col overflow-hidden p-0","max-h-[--radix-popover-content-available-height]",d?.content),collisionPadding:8,sideOffset:4,align:"start",children:[!xe&&s(O,{placeholder:"Search..."}),I(G,{children:[s(F,{children:"No results"}),s(Y,{children:i.map(({id:C,...l})=>s(J,{value:l.value,onSelect:Pe,children:s(ue,{className:a(d?.items,"truncate py-1"),isSelected:h.some(u=>u.value===l.value),hasCheckbox:m,...l})},C))})]}),!!B&&s(X,{}),B&&B({close:Z})]})})]})]})});E.displayName="Combobox";var je=Ze("group relative cursor-pointer text-green-100 flex flex-row items-center justify-between gap-2 border border-grey-20 focus:outline-green-80 disabled:bg-grey-5",{variants:{variant:{default:["w-full","max-w-80","rounded-lg"],chip:["font-bold","rounded-3xl","data-[state=open]:bg-black","data-[state=open]:text-white"]},size:{small:["h-8","p-1","pl-2","text-xs"],normal:["h-9","p-2","pl-3","text-sm"],large:["h-10","p-3","pl-4","text-base"]}},defaultVariants:{variant:"default",size:"normal"}});import{Slot as et}from"@radix-ui/react-slot";import{cva as tt}from"cva";import{forwardRef as ot}from"react";import{jsx as it}from"react/jsx-runtime";var z=ot(({className:e,variant:t,size:o,asChild:n=!1,...i},d)=>it(n?et:"button",{className:a(at({variant:t,size:o,className:e})),ref:d,...i}));z.displayName="Button";var at=tt(["flex","items-center","justify-center","gap-2","rounded-full","font-bold","outline-2","outline-offset-2","outline-dashed","outline-transparent"],{variants:{variant:{neutral:["bg-black","text-white","hover:bg-grey-90","active:bg-grey-80","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],primary:["bg-pickle-100","text-black","hover:bg-pickle-80","active:bg-pickle-60","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],secondary:["bg-green-80","text-white","hover:bg-green-90","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40","disabled:bg-grey-10"],transparent:["text-white","hover:bg-green-80","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40"],link:["leading-tight","text-black","underline","hover:text-purple-100","focus:text-black","focus:outline-purple-100","active:text-purple-80"]},size:{small:["h-10","text-sm","px-4","py-2"],medium:["h-12","text-base","px-6","py-3"],large:["h-14","text-lg","px-8","py-4"]}},defaultVariants:{variant:"neutral",size:"medium"},compoundVariants:[{variant:"link",size:"small",class:["h-3","text-xs","p-0"]},{variant:"link",size:"medium",class:["h-4","text-sm","p-0"]},{variant:"link",size:"large",class:["h-6","text-base","p-0"]}]});import{jsx as P,jsxs as be}from"react/jsx-runtime";function rt(){let[e,t]=ye([]),[o,n]=ye(""),i=[{title:"Nirvana",value:"Nirvana",description:"Come As You Are",id:1},{title:"Pearl Jam",value:"Pearl Jam",description:"Jeremy",id:2},{title:"Soundgarden",value:"Soundgarden",description:"Rusty Cage",id:3},{title:"Alice in Chains",value:"Alice in Chains",description:"Would?",id:4},{title:"Stone Temple Pilots",value:"Stone Temple Pilots",id:5},{title:"Hole",value:"Hole",id:6},{title:"Mudhoney",value:"Mudhoney",id:7},{title:"Screaming Trees",value:"Screaming Trees",id:8},{title:"L7",value:"L7",id:9},{title:"Sonic Youth",value:"Sonic Youth",id:10},{title:"And You Will Know Us by the Trail of Dead",value:"And You Will Know Us by the Trail of Dead",id:11}];return be("div",{className:"flex flex-row flex-wrap items-center gap-4 p-4",children:[P(E,{label:"US bands from the 90's",placeholder:"Select a band",icon:"Music",options:i,multiselect:!0,onChange:t,value:e}),P(E,{label:"US bands from the 90's",options:i,variant:"chip",multiselect:!0,onChange:t,value:e}),P(E,{label:"Fruit label",variant:"chip",options:[{title:"Cherry",value:"Cherry",id:1,icon:"Cherry"},{title:"Grape",value:"Grape",id:2,icon:"Grape"}],value:o,onChange:n,children:({close:m})=>be("div",{className:"flex flex-row items-center justify-between bg-white p-2 pl-4",children:[P(z,{variant:"link",tabIndex:-1,onClick:m,children:"Clear"}),P(z,{variant:"primary",size:"small",tabIndex:-1,children:"Apply"})]})}),e.map(m=>P("span",{className:"text-green-80",children:m},m)),P("span",{className:"text-purple-100",children:o})]})}var ko=rt;export{ko as default};
|
|
2
2
|
//# sourceMappingURL=ComboboxDemo.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/demos/ComboboxDemo.tsx","../../../src/components/ui/Combobox.tsx","../../../src/lib/utils.ts","../../../src/components/primitives/command.tsx","../../../src/components/primitives/dialog.tsx","../../../src/components/primitives/popover.tsx","../../../src/components/primitives/separator.tsx","../../../src/components/ui/ListItem.tsx","../../../src/components/ui/Checkbox.tsx","../../../src/components/ui/Badge.tsx","../../../src/components/ui/Label.tsx","../../../src/components/ui/Button.tsx"],"sourcesContent":["'use client'\n\nimport { useState } from 'react'\nimport { Combobox } from '@/components/ui/Combobox'\nimport { Button } from '@/components/ui/Button'\n\nfunction ComboboxDemo() {\n const [selectedBands, setSelectedBands] = useState<string[]>([])\n const [selectedFruit, setSelectedFruit] = useState<string>('')\n\n const bands = [\n {\n title: 'Nirvana',\n value: 'Nirvana',\n description: 'Come As You Are',\n id: 1,\n },\n { title: 'Pearl Jam', value: 'Pearl Jam', description: 'Jeremy', id: 2 },\n {\n title: 'Soundgarden',\n value: 'Soundgarden',\n description: 'Rusty Cage',\n id: 3,\n },\n {\n title: 'Alice in Chains',\n value: 'Alice in Chains',\n description: 'Would?',\n id: 4,\n },\n { title: 'Stone Temple Pilots', value: 'Stone Temple Pilots', id: 5 },\n { title: 'Hole', value: 'Hole', id: 6 },\n { title: 'Mudhoney', value: 'Mudhoney', id: 7 },\n { title: 'Screaming Trees', value: 'Screaming Trees', id: 8 },\n { title: 'L7', value: 'L7', id: 9 },\n { title: 'Sonic Youth', value: 'Sonic Youth', id: 10 },\n {\n title: 'And You Will Know Us by the Trail of Dead',\n value: 'And You Will Know Us by the Trail of Dead',\n id: 11,\n },\n ]\n\n const fruits = [\n { title: 'Cherry', value: 'Cherry', id: 1, icon: 'Cherry' },\n { title: 'Grape', value: 'Grape', id: 2, icon: 'Grape' },\n ]\n\n return (\n <div className=\"flex flex-row flex-wrap items-center gap-4 p-4\">\n <Combobox\n label=\"US bands from the 90's\"\n placeholder=\"Select a band\"\n icon=\"Music\"\n options={bands}\n multiselect\n onChange={setSelectedBands}\n value={selectedBands}\n />\n <Combobox\n label=\"US bands from the 90's\"\n options={bands}\n variant=\"chip\"\n multiselect\n onChange={setSelectedBands}\n value={selectedBands}\n />\n <Combobox\n label=\"Fruit label\"\n variant=\"chip\"\n options={fruits}\n value={selectedFruit}\n onChange={setSelectedFruit}\n >\n {({ close }) => (\n <div className=\"flex flex-row items-center justify-between bg-white p-2 pl-4\">\n <Button variant=\"link\" tabIndex={-1} onClick={close}>\n Clear\n </Button>\n <Button variant=\"primary\" size=\"small\" tabIndex={-1}>\n Apply\n </Button>\n </div>\n )}\n </Combobox>\n {selectedBands.map((band) => (\n <span key={band} className=\"text-green-80\">\n {band}\n </span>\n ))}\n <span className=\"text-purple-100\">{selectedFruit}</span>\n </div>\n )\n}\n\nexport default ComboboxDemo\n","'use client'\n\nimport { ComponentProps, forwardRef, useEffect, useState } from 'react'\nimport { ChevronDownIcon, CircleX, icons } from 'lucide-react'\nimport { cva, type VariantProps } from 'cva'\nimport { cn } from '@/lib/utils'\nimport {\n Command,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n} from '@/components/primitives/command'\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/primitives/popover'\nimport { Separator } from '@/components/primitives/separator'\n\nimport ListItem from '@/components/ui/ListItem'\nimport { Badge } from '@/components/ui/Badge'\nimport Label from '@/components/ui/Label'\n\ntype Icon = { icon?: keyof typeof icons }\ntype Children = { children?: (props: { close: () => void }) => JSX.Element }\ntype Option = { id: number; value: string; title: string; description?: string; icon?: string }\ntype ClassNames = { label?: string; trigger?: string; items?: string; content?: string }\ntype Shared = { label?: string; options: Option[]; classNames?: ClassNames; placeholder?: string }\ntype MultiSelect = { multiselect: true; value?: string[]; onChange?: (v: string[]) => void }\ntype SingleSelect = { multiselect?: false; value?: string; onChange?: (v: string) => void }\ntype TriggerVariants = VariantProps<typeof triggerVariants>\ntype SelectProps = Omit<ComponentProps<'select'>, 'value' | 'onChange' | 'size' | 'children'>\ntype Props = TriggerVariants & SelectProps & Children & Shared & Icon\ntype MultiSelectProps = Props & MultiSelect\ntype SingleSelectProps = Props & SingleSelect\ntype ComboboxProps = MultiSelectProps | SingleSelectProps\n\nexport const Combobox = forwardRef<HTMLDivElement, ComboboxProps>((props, ref) => {\n const {\n value,\n label,\n options,\n classNames,\n multiselect,\n placeholder,\n variant = 'default',\n size,\n icon,\n className,\n onChange: handleChange,\n children: footer,\n } = props\n const [selected, setSelected] = useState<string[]>([])\n const [open, setOpen] = useState(false)\n const IconComponent = icon && icons[icon]\n const hideSearchBox = options?.length <= 5\n const isDefault = variant === 'default'\n const isChip = variant === 'chip'\n const close = () => setOpen(false)\n\n useEffect(() => {\n const valueArray = multiselect ? (value ?? []) : value ? [value] : []\n setSelected(valueArray)\n }, [value])\n\n const handleSelect = (option: string) => {\n if (multiselect) {\n return setSelected((prev) => {\n const newSelected = prev.includes(option)\n ? prev.filter((v) => v !== option)\n : [...prev, option]\n handleChange?.(newSelected)\n return newSelected\n })\n }\n setSelected([option])\n handleChange?.(option)\n close()\n }\n\n const handleClear = () => {\n setSelected([])\n multiselect ? handleChange?.([]) : handleChange?.('')\n }\n\n const handleDisplayValue = () => {\n const defaultLabel = selected.length > 0 ? selected.join(', ') : placeholder\n return isDefault ? defaultLabel : label\n }\n\n return (\n <div className={cn('flex flex-col gap-2', className)}>\n {isDefault && label && <Label text={label} className={classNames?.label} />}\n\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild disabled={options.length === 0}>\n <div\n ref={ref}\n className={cn(triggerVariants({ variant, size }), classNames?.trigger)}\n aria-expanded={open}\n >\n {isDefault && IconComponent && <IconComponent className=\"h-4 w-4 shrink-0\" />}\n {isChip && selected.length > 0 && <Badge variant=\"purple\">{selected.length}</Badge>}\n\n <span\n className={cn(\n 'w-full truncate leading-normal',\n isDefault && selected.length == 0 && 'text-grey-40'\n )}\n >\n {handleDisplayValue()}\n </span>\n\n {selected.length == 0 && (\n <ChevronDownIcon\n className=\"shrink-0 transform group-data-[state=open]:rotate-180\"\n size=\"16\"\n />\n )}\n\n {isDefault && selected.length > 0 && (\n <button\n type=\"button\"\n className=\"flex h-8 w-8 shrink-0 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20\"\n onClick={handleClear}\n >\n <CircleX className=\"h-4 w-4 text-green-100\" />\n </button>\n )}\n </div>\n </PopoverTrigger>\n\n <Command>\n <PopoverContent\n className={cn(\n 'flex w-full max-w-xs flex-col overflow-hidden p-0',\n 'max-h-[--radix-popover-content-available-height]',\n classNames?.content\n )}\n collisionPadding={8}\n sideOffset={4}\n align=\"start\"\n >\n {!hideSearchBox && <CommandInput placeholder=\"Search...\" />}\n\n <CommandList>\n <CommandEmpty>No results</CommandEmpty>\n <CommandGroup>\n {options.map(({ id, ...option }) => (\n <CommandItem key={id} value={option.value} onSelect={handleSelect}>\n <ListItem\n className={cn(classNames?.items, 'truncate py-1')}\n isSelected={selected?.includes(option.value)}\n hasCheckbox={multiselect}\n {...option}\n />\n </CommandItem>\n ))}\n </CommandGroup>\n </CommandList>\n\n {!!footer && <Separator />}\n {footer && footer({ close })}\n </PopoverContent>\n </Command>\n </Popover>\n </div>\n )\n})\nCombobox.displayName = 'Combobox'\n\nconst triggerVariants = cva(\n 'group relative cursor-pointer text-green-100 flex flex-row items-center justify-between gap-2 border border-grey-20 focus:outline-green-80 disabled:bg-grey-5',\n {\n variants: {\n variant: {\n default: ['w-full', 'max-w-80', 'rounded-lg'],\n chip: [\n 'font-bold',\n 'rounded-3xl',\n 'data-[state=open]:bg-black',\n 'data-[state=open]:text-white',\n ],\n },\n size: {\n small: ['h-8', 'p-1', 'pl-2', 'text-xs'],\n normal: ['h-9', 'p-2', 'pl-3', 'text-sm'],\n large: ['h-10', 'p-3', 'pl-4', 'text-base'],\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'normal',\n },\n }\n)\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","'use client'\n\nimport { type DialogProps } from '@radix-ui/react-dialog'\nimport { Command as CommandPrimitive } from 'cmdk'\nimport { Search } from 'lucide-react'\nimport * as React from 'react'\n\nimport { Dialog, DialogContent } from '@/components/primitives/dialog'\n\nimport { cn } from '@/lib/utils'\n\nconst Command = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive\n ref={ref}\n className={cn(\n 'flex h-full w-full flex-col overflow-hidden rounded-xl bg-white text-neutral-950',\n className\n )}\n {...props}\n />\n))\nCommand.displayName = CommandPrimitive.displayName\n\ntype CommandDialogProps = DialogProps\n\nconst CommandDialog = ({ children, ...props }: CommandDialogProps) => {\n return (\n <Dialog {...props}>\n <DialogContent className=\"overflow-hidden p-0 shadow-lg\">\n <Command className=\"[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\">\n {children}\n </Command>\n </DialogContent>\n </Dialog>\n )\n}\n\nconst CommandInput = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Input>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(({ className, ...props }, ref) => (\n <div className=\"m-1 flex items-center rounded-xl border px-3\" cmdk-input-wrapper=\"\">\n <Search className=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n <CommandPrimitive.Input\n ref={ref}\n className={cn(\n 'flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-neutral-500 disabled:cursor-not-allowed disabled:opacity-50',\n className\n )}\n {...props}\n />\n </div>\n))\n\nCommandInput.displayName = CommandPrimitive.Input.displayName\n\nconst CommandList = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.List\n ref={ref}\n className={cn('overflow-y-auto overflow-x-hidden', className)}\n {...props}\n />\n))\n\nCommandList.displayName = CommandPrimitive.List.displayName\n\nconst CommandEmpty = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Empty>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => (\n <CommandPrimitive.Empty ref={ref} className=\"py-6 text-center text-sm\" {...props} />\n))\n\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName\n\nconst CommandGroup = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Group>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.Group\n ref={ref}\n className={cn(\n 'overflow-hidden p-1 text-neutral-950 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500',\n className\n )}\n {...props}\n />\n))\n\nCommandGroup.displayName = CommandPrimitive.Group.displayName\n\nconst CommandSeparator = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.Separator\n ref={ref}\n className={cn('-mx-1 h-px bg-neutral-200', className)}\n {...props}\n />\n))\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName\n\nconst CommandItem = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.Item\n ref={ref}\n className={cn(\n \"relative flex cursor-pointer select-none items-center rounded-xl px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected='true']:bg-neutral-100 data-[selected=true]:text-neutral-900 data-[disabled=true]:opacity-50\",\n className\n )}\n {...props}\n />\n))\n\nCommandItem.displayName = CommandPrimitive.Item.displayName\n\nconst CommandShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={cn('ml-auto text-xs tracking-widest text-neutral-500', className)}\n {...props}\n />\n )\n}\nCommandShortcut.displayName = 'CommandShortcut'\n\nexport {\n Command,\n CommandDialog,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n CommandSeparator,\n CommandShortcut,\n}\n","'use client'\n\nimport { cn } from '@/lib/utils'\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\nimport { X } from 'lucide-react'\nimport * as React from 'react'\n\nconst Dialog = DialogPrimitive.Root\n\nconst DialogTrigger = DialogPrimitive.Trigger\n\nconst DialogPortal = DialogPrimitive.Portal\n\nconst DialogClose = DialogPrimitive.Close\n\nconst DialogOverlay = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Overlay\n ref={ref}\n className={cn(\n 'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n className\n )}\n {...props}\n />\n))\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName\n\nconst DialogContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <DialogPortal>\n <DialogOverlay />\n <DialogPrimitive.Content\n ref={ref}\n className={cn(\n 'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950',\n className\n )}\n {...props}\n >\n {children}\n <DialogPrimitive.Close className=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-neutral-950 focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-neutral-100 data-[state=open]:text-neutral-500 dark:ring-offset-neutral-950 dark:focus:ring-neutral-300 dark:data-[state=open]:bg-neutral-800 dark:data-[state=open]:text-neutral-400\">\n <X className=\"h-4 w-4\" />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n </DialogPrimitive.Content>\n </DialogPortal>\n))\nDialogContent.displayName = DialogPrimitive.Content.displayName\n\nconst DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />\n)\nDialogHeader.displayName = 'DialogHeader'\n\nconst DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}\n {...props}\n />\n)\nDialogFooter.displayName = 'DialogFooter'\n\nconst DialogTitle = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Title\n ref={ref}\n className={cn('text-lg font-semibold leading-none tracking-tight', className)}\n {...props}\n />\n))\nDialogTitle.displayName = DialogPrimitive.Title.displayName\n\nconst DialogDescription = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Description\n ref={ref}\n className={cn('text-sm text-neutral-500 dark:text-neutral-400', className)}\n {...props}\n />\n))\nDialogDescription.displayName = DialogPrimitive.Description.displayName\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger,\n}\n","'use client'\n\nimport * as React from 'react'\nimport * as PopoverPrimitive from '@radix-ui/react-popover'\n\nimport { cn } from '@/lib/utils'\n\nconst Popover = PopoverPrimitive.Root\n\nconst PopoverTrigger = PopoverPrimitive.Trigger\n\nconst PopoverContent = React.forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n ref={ref}\n align={align}\n sideOffset={sideOffset}\n className={cn(\n 'z-50 rounded-2xl border bg-white p-4 text-black shadow-md outline-none 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',\n className\n )}\n {...props}\n />\n </PopoverPrimitive.Portal>\n))\nPopoverContent.displayName = PopoverPrimitive.Content.displayName\n\nexport { Popover, PopoverTrigger, PopoverContent }\n","'use client'\r\n\r\nimport * as SeparatorPrimitive from '@radix-ui/react-separator'\r\nimport * as React from 'react'\r\n\r\nimport { cn } from '@/lib/utils'\r\n\r\nconst Separator = React.forwardRef<\r\n React.ElementRef<typeof SeparatorPrimitive.Root>,\r\n React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>\r\n>(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => (\r\n <SeparatorPrimitive.Root\r\n ref={ref}\r\n decorative={decorative}\r\n orientation={orientation}\r\n className={cn(\r\n 'shrink-0 bg-grey-10',\r\n orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',\r\n className\r\n )}\r\n {...props}\r\n />\r\n))\r\nSeparator.displayName = SeparatorPrimitive.Root.displayName\r\n\r\nexport { Separator }\r\n","import { cn } from '@/lib/utils'\nimport { CheckIcon } from 'lucide-react'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\nimport Checkbox from '@/components/ui/Checkbox'\nimport { icons } from 'lucide-react'\n\ntype IconKey = keyof typeof icons\n\ninterface ListItemProps extends ComponentPropsWithoutRef<'li'> {\n icon?: string\n hasCheckbox?: boolean\n isSelected?: boolean\n title: string\n value: string\n description?: string\n}\n\nfunction ListItem({\n icon,\n hasCheckbox,\n isSelected,\n className,\n title,\n value,\n description,\n ...props\n}: ListItemProps) {\n const getIconIfValid = (icon: string): ReactNode => {\n if (icon in icons) {\n const IconComponent = icons[icon as IconKey]\n return <IconComponent size={14} />\n }\n return null\n }\n\n const optionIcon = icon ? getIconIfValid(icon) : undefined\n\n return (\n <li\n className={cn(\n 'group relative flex w-72 cursor-pointer flex-row items-center text-left text-sm',\n className\n )}\n {...props}\n data-state={isSelected ? 'checked' : 'unchecked'}\n >\n {optionIcon && <span className=\"mr-2\">{optionIcon}</span>}\n {hasCheckbox && (\n <Checkbox id={value} checked={isSelected} onClick={(e) => e.preventDefault()} />\n )}\n <div>\n <p>{title}</p>\n <p className=\"text-xs text-grey-80\">{description}</p>\n </div>\n\n <CheckIcon\n className=\"absolute inset-y-0 right-0 my-auto hidden w-6 text-green-100 group-data-[state=checked]:block\"\n size={16}\n />\n </li>\n )\n}\n\nexport default ListItem\n","'use client'\n\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\nimport { Check, Minus } from 'lucide-react'\nimport {\n type ComponentPropsWithoutRef,\n type ElementRef,\n forwardRef,\n type PropsWithChildren,\n} from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst CheckboxToggle = forwardRef<\n ElementRef<typeof CheckboxPrimitive.Root>,\n ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>\n>(({ className, ...props }, ref) => (\n <CheckboxPrimitive.Root\n ref={ref}\n className={cn(\n 'group',\n 'peer',\n 'h-5',\n 'w-5',\n 'shrink-0',\n 'rounded-md',\n 'border',\n 'border-grey-10',\n 'outline',\n 'outline-1',\n 'outline-offset-2',\n 'outline-transparent',\n 'hover:border-grey-20',\n 'focus:outline-purple-100',\n 'active:border-green-80',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'data-[state=checked]:bg-green-80',\n 'data-[state=indeterminate]:bg-green-80',\n 'data-[state=checked]:text-white',\n 'data-[state=indeterminate]:text-primary-foreground',\n props.disabled &&\n 'data-[state=checked]:text-foreground bg-grey-20 data-[state=checked]:bg-grey-20',\n className\n )}\n {...props}\n >\n <CheckboxPrimitive.Indicator className=\"flex items-center justify-center text-current\">\n <Check className=\"hidden h-4 w-4 group-data-[state=checked]:block\" />\n <Minus className=\"hidden h-4 w-4 group-data-[state=indeterminate]:block\" />\n </CheckboxPrimitive.Indicator>\n </CheckboxPrimitive.Root>\n))\nCheckboxToggle.displayName = CheckboxPrimitive.Root.displayName\n\ninterface Props extends CheckboxPrimitive.CheckboxProps, PropsWithChildren {\n error?: string\n classNames?: {\n wrapper?: string\n label?: string\n }\n}\n\nconst Checkbox = forwardRef<ElementRef<typeof CheckboxPrimitive.Root>, Props>(\n ({ classNames, children, ...props }, ref) => {\n const { disabled } = props\n const id = props.id ?? `${props.name ?? props.value?.toString()}-checkbox`\n const labelClassName = disabled ? 'text-grey-40 pointer-events-none' : ''\n return (\n <div className={cn('flex space-x-2', classNames?.wrapper)}>\n <CheckboxToggle id={id} disabled={disabled} ref={ref} {...props} />\n <label htmlFor={id} className={cn(labelClassName, classNames?.label)}>\n {children}\n </label>\n </div>\n )\n }\n)\nCheckbox.displayName = 'Checkbox'\n\nexport default Checkbox\n","import { cva, type VariantProps } from 'cva'\nimport * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst badgeVariants = cva('rounded-full px-2 py-0.5 text-xs font-semibold', {\n variants: {\n variant: {\n green: 'bg-green-90 text-white',\n pickle: 'bg-pickle-100 text-black',\n purple: 'bg-purple-100 text-white',\n },\n },\n defaultVariants: {\n variant: 'green',\n },\n})\n\nexport interface BadgeProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof badgeVariants> {}\n\nfunction Badge({ className, variant, ...props }: BadgeProps) {\n return <div className={cn(badgeVariants({ variant }), className)} {...props} />\n}\n\nexport { Badge, badgeVariants }\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ninterface Props extends ComponentPropsWithoutRef<'label'> {\n text?: string\n}\n\nfunction Label({ text, className, ...props }: Readonly<Props>) {\n if (!text) return null\n\n return (\n <label\n className={cn(\n 'text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n className\n )}\n {...props}\n >\n {text}\n </label>\n )\n}\n\nexport default Label\n","import { cn } from '@/lib/utils'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'cva'\nimport React, { forwardRef } from 'react'\n\ninterface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n VariantProps<typeof buttonVariants> {\n asChild?: boolean\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n ({ className, variant, size, asChild = false, ...props }, ref) => {\n const Component = asChild ? Slot : 'button'\n\n return (\n <Component\n className={cn(buttonVariants({ variant, size, className }))}\n ref={ref}\n {...props}\n />\n )\n }\n)\nButton.displayName = 'Button'\n\nconst buttonVariants = cva(\n [\n 'flex',\n 'items-center',\n 'justify-center',\n 'gap-2',\n 'rounded-full',\n 'font-bold',\n 'outline-2',\n 'outline-offset-2',\n 'outline-dashed',\n 'outline-transparent',\n ],\n {\n variants: {\n variant: {\n neutral: [\n 'bg-black',\n 'text-white',\n 'hover:bg-grey-90',\n 'active:bg-grey-80',\n 'focus:outline-purple-100',\n 'disabled:text-grey-40',\n 'disabled:bg-grey-10',\n ],\n primary: [\n 'bg-pickle-100',\n 'text-black',\n 'hover:bg-pickle-80',\n 'active:bg-pickle-60',\n 'focus:outline-purple-100',\n 'disabled:text-grey-40',\n 'disabled:bg-grey-10',\n ],\n secondary: [\n 'bg-green-80',\n 'text-white',\n 'hover:bg-green-90',\n 'active:bg-green-100',\n 'focus:outline-pickle-100',\n 'disabled:text-grey-40',\n 'disabled:bg-grey-10',\n ],\n transparent: [\n 'text-white',\n 'hover:bg-green-80',\n 'active:bg-green-100',\n 'focus:outline-pickle-100',\n 'disabled:text-grey-40',\n ],\n link: [\n 'leading-tight',\n 'text-black',\n 'underline',\n 'hover:text-purple-100',\n 'focus:text-black',\n 'focus:outline-purple-100',\n 'active:text-purple-80',\n ],\n },\n size: {\n small: ['h-10', 'text-sm', 'px-4', 'py-2'],\n medium: ['h-12', 'text-base', 'px-6', 'py-3'],\n large: ['h-14', 'text-lg', 'px-8', 'py-4'],\n },\n },\n defaultVariants: {\n variant: 'neutral',\n size: 'medium',\n },\n compoundVariants: [\n {\n variant: 'link',\n size: 'small',\n class: ['h-3', 'text-xs', 'p-0'],\n },\n {\n variant: 'link',\n size: 'medium',\n class: ['h-4', 'text-sm', 'p-0'],\n },\n {\n variant: 'link',\n size: 'large',\n class: ['h-6', 'text-base', 'p-0'],\n },\n ],\n }\n)\n"],"mappings":"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","names":["useState","forwardRef","useEffect","useState","ChevronDownIcon","CircleX","icons","cva","clsx","twMerge","cn","inputs","CommandPrimitive","Search","React","DialogPrimitive","X","React","jsx","jsxs","DialogPortal","DialogOverlay","className","props","ref","jsx","cn","DialogContent","children","jsxs","DialogPortal","X","DialogHeader","DialogFooter","DialogTitle","DialogDescription","jsx","jsxs","Command","className","props","ref","CommandPrimitive","cn","CommandInput","className","props","ref","jsxs","jsx","Search","CommandPrimitive","cn","CommandList","CommandEmpty","CommandGroup","CommandSeparator","CommandItem","CommandShortcut","React","PopoverPrimitive","jsx","Popover","PopoverTrigger","PopoverContent","className","align","sideOffset","props","ref","cn","SeparatorPrimitive","React","jsx","Separator","className","orientation","decorative","props","ref","cn","CheckIcon","CheckboxPrimitive","Check","Minus","forwardRef","jsx","jsxs","CheckboxToggle","forwardRef","className","props","ref","cn","Check","Minus","Checkbox","classNames","children","disabled","id","labelClassName","Checkbox_default","icons","jsx","jsxs","ListItem","icon","hasCheckbox","isSelected","className","title","value","description","props","optionIcon","IconComponent","cn","Checkbox_default","e","CheckIcon","ListItem_default","cva","jsx","badgeVariants","cva","Badge","className","variant","props","cn","jsx","Label","text","className","props","cn","Label_default","jsx","jsxs","Combobox","forwardRef","props","ref","value","label","options","classNames","multiselect","placeholder","variant","size","icon","className","handleChange","footer","selected","setSelected","useState","open","setOpen","IconComponent","icons","hideSearchBox","isDefault","isChip","close","useEffect","handleSelect","option","prev","newSelected","v","handleClear","handleDisplayValue","defaultLabel","cn","Label_default","Popover","PopoverTrigger","triggerVariants","Badge","ChevronDownIcon","CircleX","Command","PopoverContent","CommandInput","CommandList","CommandEmpty","CommandGroup","id","CommandItem","ListItem_default","Separator","cva","Slot","cva","forwardRef","jsx","Button","className","variant","size","asChild","props","ref","cn","buttonVariants","jsx","jsxs","ComboboxDemo","selectedBands","setSelectedBands","useState","selectedFruit","setSelectedFruit","bands","Combobox","close","Button","band","ComboboxDemo_default"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/demos/ComboboxDemo.tsx","../../../src/components/ui/Combobox.tsx","../../../src/lib/utils.ts","../../../src/components/primitives/command.tsx","../../../src/components/primitives/dialog.tsx","../../../src/components/primitives/popover.tsx","../../../src/components/primitives/separator.tsx","../../../src/components/ui/ListItem.tsx","../../../src/components/ui/Checkbox.tsx","../../../src/components/ui/Badge.tsx","../../../src/components/ui/Label.tsx","../../../src/components/ui/Button.tsx"],"sourcesContent":["'use client'\n\nimport { useState } from 'react'\nimport { Combobox } from '@/components/ui/Combobox'\nimport { Button } from '@/components/ui/Button'\n\nfunction ComboboxDemo() {\n const [selectedBands, setSelectedBands] = useState<string[]>([])\n const [selectedFruit, setSelectedFruit] = useState<string>('')\n\n const bands = [\n {\n title: 'Nirvana',\n value: 'Nirvana',\n description: 'Come As You Are',\n id: 1,\n },\n { title: 'Pearl Jam', value: 'Pearl Jam', description: 'Jeremy', id: 2 },\n {\n title: 'Soundgarden',\n value: 'Soundgarden',\n description: 'Rusty Cage',\n id: 3,\n },\n {\n title: 'Alice in Chains',\n value: 'Alice in Chains',\n description: 'Would?',\n id: 4,\n },\n { title: 'Stone Temple Pilots', value: 'Stone Temple Pilots', id: 5 },\n { title: 'Hole', value: 'Hole', id: 6 },\n { title: 'Mudhoney', value: 'Mudhoney', id: 7 },\n { title: 'Screaming Trees', value: 'Screaming Trees', id: 8 },\n { title: 'L7', value: 'L7', id: 9 },\n { title: 'Sonic Youth', value: 'Sonic Youth', id: 10 },\n {\n title: 'And You Will Know Us by the Trail of Dead',\n value: 'And You Will Know Us by the Trail of Dead',\n id: 11,\n },\n ]\n\n const fruits = [\n { title: 'Cherry', value: 'Cherry', id: 1, icon: 'Cherry' },\n { title: 'Grape', value: 'Grape', id: 2, icon: 'Grape' },\n ]\n\n return (\n <div className=\"flex flex-row flex-wrap items-center gap-4 p-4\">\n <Combobox\n label=\"US bands from the 90's\"\n placeholder=\"Select a band\"\n icon=\"Music\"\n options={bands}\n multiselect\n onChange={setSelectedBands}\n value={selectedBands}\n />\n <Combobox\n label=\"US bands from the 90's\"\n options={bands}\n variant=\"chip\"\n multiselect\n onChange={setSelectedBands}\n value={selectedBands}\n />\n <Combobox\n label=\"Fruit label\"\n variant=\"chip\"\n options={fruits}\n value={selectedFruit}\n onChange={setSelectedFruit}\n >\n {({ close }) => (\n <div className=\"flex flex-row items-center justify-between bg-white p-2 pl-4\">\n <Button variant=\"link\" tabIndex={-1} onClick={close}>\n Clear\n </Button>\n <Button variant=\"primary\" size=\"small\" tabIndex={-1}>\n Apply\n </Button>\n </div>\n )}\n </Combobox>\n {selectedBands.map((band) => (\n <span key={band} className=\"text-green-80\">\n {band}\n </span>\n ))}\n <span className=\"text-purple-100\">{selectedFruit}</span>\n </div>\n )\n}\n\nexport default ComboboxDemo\n","'use client'\n\nimport { ComponentProps, forwardRef, useEffect, useState } from 'react'\nimport { ChevronDownIcon, CircleX, icons } from 'lucide-react'\nimport { cva, type VariantProps } from 'cva'\nimport { cn } from '@/lib/utils'\nimport {\n Command,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n} from '@/components/primitives/command'\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/primitives/popover'\nimport { Separator } from '@/components/primitives/separator'\n\nimport ListItem from '@/components/ui/ListItem'\nimport { Badge } from '@/components/ui/Badge'\nimport Label from '@/components/ui/Label'\n\ntype Icon = { icon?: keyof typeof icons }\ntype Children = { children?: (props: { close: () => void }) => JSX.Element }\ntype Option = { id: number; value: string; title: string; description?: string; icon?: string }\ntype ClassNames = { label?: string; trigger?: string; items?: string; content?: string }\ntype Shared = { label?: string; options: Option[]; classNames?: ClassNames; placeholder?: string }\ntype MultiSelect = { multiselect: true; value?: string[]; onChange?: (v: string[]) => void }\ntype SingleSelect = { multiselect?: false; value?: string; onChange?: (v: string) => void }\ntype TriggerVariants = VariantProps<typeof triggerVariants>\ntype SelectProps = Omit<ComponentProps<'select'>, 'value' | 'onChange' | 'size' | 'children'>\ntype Props = TriggerVariants & SelectProps & Children & Shared & Icon\ntype MultiSelectProps = Props & MultiSelect\ntype SingleSelectProps = Props & SingleSelect\ntype ComboboxProps = MultiSelectProps | SingleSelectProps\n\nexport const Combobox = forwardRef<HTMLDivElement, ComboboxProps>((props, ref) => {\n const {\n value,\n label,\n options,\n classNames,\n multiselect,\n placeholder,\n variant = 'default',\n size,\n icon,\n className,\n onChange: handleChange,\n children: footer,\n } = props\n const [selected, setSelected] = useState<Option[]>([])\n const [open, setOpen] = useState(false)\n const IconComponent = icon && icons[icon]\n const hideSearchBox = options?.length <= 5\n const isDefault = variant === 'default'\n const isChip = variant === 'chip'\n const close = () => setOpen(false)\n\n useEffect(() => {\n const valueArray = multiselect ? (value ?? []) : value ? [value] : []\n setSelected(\n valueArray.map((v) => options.find((o) => o.value === v)).filter((v) => v !== undefined)\n )\n }, [value])\n\n const handleSelect = (value: string) => {\n const option = options.find((o) => o.value === value)\n if (!option) return\n if (multiselect) {\n return setSelected((prev) => {\n const newSelected = prev.some((o) => o.value === value)\n ? prev.filter((v) => v !== option)\n : [...prev, option]\n handleChange?.(newSelected.map((o) => o.value))\n return newSelected\n })\n }\n setSelected([option])\n handleChange?.(option.value)\n close()\n }\n\n const handleClear = () => {\n setSelected([])\n multiselect ? handleChange?.([]) : handleChange?.('')\n }\n\n const handleDisplayValue = () => {\n const defaultLabel = selected.length > 0 ? selected.map((s) => s.title).join(', ') : placeholder\n return isDefault ? defaultLabel : label\n }\n\n return (\n <div className={cn('flex flex-col gap-2', className)}>\n {isDefault && label && <Label text={label} className={classNames?.label} />}\n\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild disabled={options.length === 0}>\n <div\n ref={ref}\n className={cn(triggerVariants({ variant, size }), classNames?.trigger)}\n aria-expanded={open}\n >\n {isDefault && IconComponent && <IconComponent className=\"h-4 w-4 shrink-0\" />}\n {isChip && selected.length > 0 && <Badge variant=\"purple\">{selected.length}</Badge>}\n\n <span\n className={cn(\n 'w-full truncate leading-normal',\n isDefault && selected.length == 0 && 'text-grey-40'\n )}\n >\n {handleDisplayValue()}\n </span>\n\n {selected.length == 0 && (\n <ChevronDownIcon\n className=\"shrink-0 transform group-data-[state=open]:rotate-180\"\n size=\"16\"\n />\n )}\n\n {isDefault && selected.length > 0 && (\n <button\n type=\"button\"\n className=\"flex h-8 w-8 shrink-0 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20\"\n onClick={handleClear}\n >\n <CircleX className=\"h-4 w-4 text-green-100\" />\n </button>\n )}\n </div>\n </PopoverTrigger>\n\n <Command>\n <PopoverContent\n className={cn(\n 'flex w-full max-w-xs flex-col overflow-hidden p-0',\n 'max-h-[--radix-popover-content-available-height]',\n classNames?.content\n )}\n collisionPadding={8}\n sideOffset={4}\n align=\"start\"\n >\n {!hideSearchBox && <CommandInput placeholder=\"Search...\" />}\n\n <CommandList>\n <CommandEmpty>No results</CommandEmpty>\n <CommandGroup>\n {options.map(({ id, ...option }) => (\n <CommandItem key={id} value={option.value} onSelect={handleSelect}>\n <ListItem\n className={cn(classNames?.items, 'truncate py-1')}\n isSelected={selected.some((s) => s.value === option.value)}\n hasCheckbox={multiselect}\n {...option}\n />\n </CommandItem>\n ))}\n </CommandGroup>\n </CommandList>\n\n {!!footer && <Separator />}\n {footer && footer({ close })}\n </PopoverContent>\n </Command>\n </Popover>\n </div>\n )\n})\nCombobox.displayName = 'Combobox'\n\nconst triggerVariants = cva(\n 'group relative cursor-pointer text-green-100 flex flex-row items-center justify-between gap-2 border border-grey-20 focus:outline-green-80 disabled:bg-grey-5',\n {\n variants: {\n variant: {\n default: ['w-full', 'max-w-80', 'rounded-lg'],\n chip: [\n 'font-bold',\n 'rounded-3xl',\n 'data-[state=open]:bg-black',\n 'data-[state=open]:text-white',\n ],\n },\n size: {\n small: ['h-8', 'p-1', 'pl-2', 'text-xs'],\n normal: ['h-9', 'p-2', 'pl-3', 'text-sm'],\n large: ['h-10', 'p-3', 'pl-4', 'text-base'],\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'normal',\n },\n }\n)\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","'use client'\n\nimport { type DialogProps } from '@radix-ui/react-dialog'\nimport { Command as CommandPrimitive } from 'cmdk'\nimport { Search } from 'lucide-react'\nimport * as React from 'react'\n\nimport { Dialog, DialogContent } from '@/components/primitives/dialog'\n\nimport { cn } from '@/lib/utils'\n\nconst Command = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive\n ref={ref}\n className={cn(\n 'flex h-full w-full flex-col overflow-hidden rounded-xl bg-white text-neutral-950',\n className\n )}\n {...props}\n />\n))\nCommand.displayName = CommandPrimitive.displayName\n\ntype CommandDialogProps = DialogProps\n\nconst CommandDialog = ({ children, ...props }: CommandDialogProps) => {\n return (\n <Dialog {...props}>\n <DialogContent className=\"overflow-hidden p-0 shadow-lg\">\n <Command className=\"[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\">\n {children}\n </Command>\n </DialogContent>\n </Dialog>\n )\n}\n\nconst CommandInput = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Input>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(({ className, ...props }, ref) => (\n <div className=\"m-1 flex items-center rounded-xl border px-3\" cmdk-input-wrapper=\"\">\n <Search className=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n <CommandPrimitive.Input\n ref={ref}\n className={cn(\n 'flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-neutral-500 disabled:cursor-not-allowed disabled:opacity-50',\n className\n )}\n {...props}\n />\n </div>\n))\n\nCommandInput.displayName = CommandPrimitive.Input.displayName\n\nconst CommandList = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.List\n ref={ref}\n className={cn('overflow-y-auto overflow-x-hidden', className)}\n {...props}\n />\n))\n\nCommandList.displayName = CommandPrimitive.List.displayName\n\nconst CommandEmpty = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Empty>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => (\n <CommandPrimitive.Empty ref={ref} className=\"py-6 text-center text-sm\" {...props} />\n))\n\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName\n\nconst CommandGroup = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Group>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.Group\n ref={ref}\n className={cn(\n 'overflow-hidden p-1 text-neutral-950 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500',\n className\n )}\n {...props}\n />\n))\n\nCommandGroup.displayName = CommandPrimitive.Group.displayName\n\nconst CommandSeparator = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.Separator\n ref={ref}\n className={cn('-mx-1 h-px bg-neutral-200', className)}\n {...props}\n />\n))\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName\n\nconst CommandItem = React.forwardRef<\n React.ElementRef<typeof CommandPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <CommandPrimitive.Item\n ref={ref}\n className={cn(\n \"relative flex cursor-pointer select-none items-center rounded-xl px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected='true']:bg-neutral-100 data-[selected=true]:text-neutral-900 data-[disabled=true]:opacity-50\",\n className\n )}\n {...props}\n />\n))\n\nCommandItem.displayName = CommandPrimitive.Item.displayName\n\nconst CommandShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={cn('ml-auto text-xs tracking-widest text-neutral-500', className)}\n {...props}\n />\n )\n}\nCommandShortcut.displayName = 'CommandShortcut'\n\nexport {\n Command,\n CommandDialog,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n CommandSeparator,\n CommandShortcut,\n}\n","'use client'\n\nimport { cn } from '@/lib/utils'\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\nimport { X } from 'lucide-react'\nimport * as React from 'react'\n\nconst Dialog = DialogPrimitive.Root\n\nconst DialogTrigger = DialogPrimitive.Trigger\n\nconst DialogPortal = DialogPrimitive.Portal\n\nconst DialogClose = DialogPrimitive.Close\n\nconst DialogOverlay = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Overlay\n ref={ref}\n className={cn(\n 'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n className\n )}\n {...props}\n />\n))\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName\n\nconst DialogContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <DialogPortal>\n <DialogOverlay />\n <DialogPrimitive.Content\n ref={ref}\n className={cn(\n 'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950',\n className\n )}\n {...props}\n >\n {children}\n <DialogPrimitive.Close className=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-neutral-950 focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-neutral-100 data-[state=open]:text-neutral-500 dark:ring-offset-neutral-950 dark:focus:ring-neutral-300 dark:data-[state=open]:bg-neutral-800 dark:data-[state=open]:text-neutral-400\">\n <X className=\"h-4 w-4\" />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n </DialogPrimitive.Content>\n </DialogPortal>\n))\nDialogContent.displayName = DialogPrimitive.Content.displayName\n\nconst DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />\n)\nDialogHeader.displayName = 'DialogHeader'\n\nconst DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}\n {...props}\n />\n)\nDialogFooter.displayName = 'DialogFooter'\n\nconst DialogTitle = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Title\n ref={ref}\n className={cn('text-lg font-semibold leading-none tracking-tight', className)}\n {...props}\n />\n))\nDialogTitle.displayName = DialogPrimitive.Title.displayName\n\nconst DialogDescription = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Description\n ref={ref}\n className={cn('text-sm text-neutral-500 dark:text-neutral-400', className)}\n {...props}\n />\n))\nDialogDescription.displayName = DialogPrimitive.Description.displayName\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger,\n}\n","'use client'\n\nimport * as React from 'react'\nimport * as PopoverPrimitive from '@radix-ui/react-popover'\n\nimport { cn } from '@/lib/utils'\n\nconst Popover = PopoverPrimitive.Root\n\nconst PopoverTrigger = PopoverPrimitive.Trigger\n\nconst PopoverContent = React.forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n ref={ref}\n align={align}\n sideOffset={sideOffset}\n className={cn(\n 'z-50 rounded-2xl border bg-white p-4 text-black shadow-md outline-none 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',\n className\n )}\n {...props}\n />\n </PopoverPrimitive.Portal>\n))\nPopoverContent.displayName = PopoverPrimitive.Content.displayName\n\nexport { Popover, PopoverTrigger, PopoverContent }\n","'use client'\r\n\r\nimport * as SeparatorPrimitive from '@radix-ui/react-separator'\r\nimport * as React from 'react'\r\n\r\nimport { cn } from '@/lib/utils'\r\n\r\nconst Separator = React.forwardRef<\r\n React.ElementRef<typeof SeparatorPrimitive.Root>,\r\n React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>\r\n>(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => (\r\n <SeparatorPrimitive.Root\r\n ref={ref}\r\n decorative={decorative}\r\n orientation={orientation}\r\n className={cn(\r\n 'shrink-0 bg-grey-10',\r\n orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',\r\n className\r\n )}\r\n {...props}\r\n />\r\n))\r\nSeparator.displayName = SeparatorPrimitive.Root.displayName\r\n\r\nexport { Separator }\r\n","import { cn } from '@/lib/utils'\nimport { CheckIcon } from 'lucide-react'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\nimport Checkbox from '@/components/ui/Checkbox'\nimport { icons } from 'lucide-react'\n\ntype IconKey = keyof typeof icons\n\ninterface ListItemProps extends ComponentPropsWithoutRef<'li'> {\n icon?: string\n hasCheckbox?: boolean\n isSelected?: boolean\n title: string\n value: string\n description?: string\n}\n\nfunction ListItem({\n icon,\n hasCheckbox,\n isSelected,\n className,\n title,\n value,\n description,\n ...props\n}: ListItemProps) {\n const getIconIfValid = (icon: string): ReactNode => {\n if (icon in icons) {\n const IconComponent = icons[icon as IconKey]\n return <IconComponent size={14} />\n }\n return null\n }\n\n const optionIcon = icon ? getIconIfValid(icon) : undefined\n\n return (\n <li\n className={cn(\n 'group relative flex w-72 cursor-pointer flex-row items-center text-left text-sm',\n className\n )}\n {...props}\n data-state={isSelected ? 'checked' : 'unchecked'}\n >\n {optionIcon && <span className=\"mr-2\">{optionIcon}</span>}\n {hasCheckbox && (\n <Checkbox id={value} checked={isSelected} onClick={(e) => e.preventDefault()} />\n )}\n <div>\n <p>{title}</p>\n <p className=\"text-xs text-grey-80\">{description}</p>\n </div>\n\n <CheckIcon\n className=\"absolute inset-y-0 right-0 my-auto hidden w-6 text-green-100 group-data-[state=checked]:block\"\n size={16}\n />\n </li>\n )\n}\n\nexport default ListItem\n","'use client'\n\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\nimport { Check, Minus } from 'lucide-react'\nimport {\n type ComponentPropsWithoutRef,\n type ElementRef,\n forwardRef,\n type PropsWithChildren,\n} from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst CheckboxToggle = forwardRef<\n ElementRef<typeof CheckboxPrimitive.Root>,\n ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>\n>(({ className, ...props }, ref) => (\n <CheckboxPrimitive.Root\n ref={ref}\n className={cn(\n 'group',\n 'peer',\n 'h-5',\n 'w-5',\n 'shrink-0',\n 'rounded-md',\n 'border',\n 'border-grey-10',\n 'outline',\n 'outline-1',\n 'outline-offset-2',\n 'outline-transparent',\n 'hover:border-grey-20',\n 'focus:outline-purple-100',\n 'active:border-green-80',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'data-[state=checked]:bg-green-80',\n 'data-[state=indeterminate]:bg-green-80',\n 'data-[state=checked]:text-white',\n 'data-[state=indeterminate]:text-primary-foreground',\n props.disabled &&\n 'data-[state=checked]:text-foreground bg-grey-20 data-[state=checked]:bg-grey-20',\n className\n )}\n {...props}\n >\n <CheckboxPrimitive.Indicator className=\"flex items-center justify-center text-current\">\n <Check className=\"hidden h-4 w-4 group-data-[state=checked]:block\" />\n <Minus className=\"hidden h-4 w-4 group-data-[state=indeterminate]:block\" />\n </CheckboxPrimitive.Indicator>\n </CheckboxPrimitive.Root>\n))\nCheckboxToggle.displayName = CheckboxPrimitive.Root.displayName\n\ninterface Props extends CheckboxPrimitive.CheckboxProps, PropsWithChildren {\n error?: string\n classNames?: {\n wrapper?: string\n label?: string\n }\n}\n\nconst Checkbox = forwardRef<ElementRef<typeof CheckboxPrimitive.Root>, Props>(\n ({ classNames, children, ...props }, ref) => {\n const { disabled } = props\n const id = props.id ?? `${props.name ?? props.value?.toString()}-checkbox`\n const labelClassName = disabled ? 'text-grey-40 pointer-events-none' : ''\n return (\n <div className={cn('flex space-x-2', classNames?.wrapper)}>\n <CheckboxToggle id={id} disabled={disabled} ref={ref} {...props} />\n <label htmlFor={id} className={cn(labelClassName, classNames?.label)}>\n {children}\n </label>\n </div>\n )\n }\n)\nCheckbox.displayName = 'Checkbox'\n\nexport default Checkbox\n","import { cva, type VariantProps } from 'cva'\nimport * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst badgeVariants = cva('rounded-full px-2 py-0.5 text-xs font-semibold', {\n variants: {\n variant: {\n green: 'bg-green-90 text-white',\n pickle: 'bg-pickle-100 text-black',\n purple: 'bg-purple-100 text-white',\n },\n },\n defaultVariants: {\n variant: 'green',\n },\n})\n\nexport interface BadgeProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof badgeVariants> {}\n\nfunction Badge({ className, variant, ...props }: BadgeProps) {\n return <div className={cn(badgeVariants({ variant }), className)} {...props} />\n}\n\nexport { Badge, badgeVariants }\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ninterface Props extends ComponentPropsWithoutRef<'label'> {\n text?: string\n}\n\nfunction Label({ text, className, ...props }: Readonly<Props>) {\n if (!text) return null\n\n return (\n <label\n className={cn(\n 'text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n className\n )}\n {...props}\n >\n {text}\n </label>\n )\n}\n\nexport default Label\n","import { cn } from '@/lib/utils'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'cva'\nimport React, { forwardRef } from 'react'\n\ninterface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n VariantProps<typeof buttonVariants> {\n asChild?: boolean\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n ({ className, variant, size, asChild = false, ...props }, ref) => {\n const Component = asChild ? Slot : 'button'\n\n return (\n <Component\n className={cn(buttonVariants({ variant, size, className }))}\n ref={ref}\n {...props}\n />\n )\n }\n)\nButton.displayName = 'Button'\n\nconst buttonVariants = cva(\n [\n 'flex',\n 'items-center',\n 'justify-center',\n 'gap-2',\n 'rounded-full',\n 'font-bold',\n 'outline-2',\n 'outline-offset-2',\n 'outline-dashed',\n 'outline-transparent',\n ],\n {\n variants: {\n variant: {\n neutral: [\n 'bg-black',\n 'text-white',\n 'hover:bg-grey-90',\n 'active:bg-grey-80',\n 'focus:outline-purple-100',\n 'disabled:text-grey-40',\n 'disabled:bg-grey-10',\n ],\n primary: [\n 'bg-pickle-100',\n 'text-black',\n 'hover:bg-pickle-80',\n 'active:bg-pickle-60',\n 'focus:outline-purple-100',\n 'disabled:text-grey-40',\n 'disabled:bg-grey-10',\n ],\n secondary: [\n 'bg-green-80',\n 'text-white',\n 'hover:bg-green-90',\n 'active:bg-green-100',\n 'focus:outline-pickle-100',\n 'disabled:text-grey-40',\n 'disabled:bg-grey-10',\n ],\n transparent: [\n 'text-white',\n 'hover:bg-green-80',\n 'active:bg-green-100',\n 'focus:outline-pickle-100',\n 'disabled:text-grey-40',\n ],\n link: [\n 'leading-tight',\n 'text-black',\n 'underline',\n 'hover:text-purple-100',\n 'focus:text-black',\n 'focus:outline-purple-100',\n 'active:text-purple-80',\n ],\n },\n size: {\n small: ['h-10', 'text-sm', 'px-4', 'py-2'],\n medium: ['h-12', 'text-base', 'px-6', 'py-3'],\n large: ['h-14', 'text-lg', 'px-8', 'py-4'],\n },\n },\n defaultVariants: {\n variant: 'neutral',\n size: 'medium',\n },\n compoundVariants: [\n {\n variant: 'link',\n size: 'small',\n class: ['h-3', 'text-xs', 'p-0'],\n },\n {\n variant: 'link',\n size: 'medium',\n class: ['h-4', 'text-sm', 'p-0'],\n },\n {\n variant: 'link',\n size: 'large',\n class: ['h-6', 'text-base', 'p-0'],\n },\n ],\n }\n)\n"],"mappings":"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","names":["useState","forwardRef","useEffect","useState","ChevronDownIcon","CircleX","icons","cva","clsx","twMerge","cn","inputs","CommandPrimitive","Search","React","DialogPrimitive","X","React","jsx","jsxs","DialogPortal","DialogOverlay","className","props","ref","jsx","cn","DialogContent","children","jsxs","DialogPortal","X","DialogHeader","DialogFooter","DialogTitle","DialogDescription","jsx","jsxs","Command","className","props","ref","CommandPrimitive","cn","CommandInput","className","props","ref","jsxs","jsx","Search","CommandPrimitive","cn","CommandList","CommandEmpty","CommandGroup","CommandSeparator","CommandItem","CommandShortcut","React","PopoverPrimitive","jsx","Popover","PopoverTrigger","PopoverContent","className","align","sideOffset","props","ref","cn","SeparatorPrimitive","React","jsx","Separator","className","orientation","decorative","props","ref","cn","CheckIcon","CheckboxPrimitive","Check","Minus","forwardRef","jsx","jsxs","CheckboxToggle","forwardRef","className","props","ref","cn","Check","Minus","Checkbox","classNames","children","disabled","id","labelClassName","Checkbox_default","icons","jsx","jsxs","ListItem","icon","hasCheckbox","isSelected","className","title","value","description","props","optionIcon","IconComponent","cn","Checkbox_default","e","CheckIcon","ListItem_default","cva","jsx","badgeVariants","cva","Badge","className","variant","props","cn","jsx","Label","text","className","props","cn","Label_default","jsx","jsxs","Combobox","forwardRef","props","ref","value","label","options","classNames","multiselect","placeholder","variant","size","icon","className","handleChange","footer","selected","setSelected","useState","open","setOpen","IconComponent","icons","hideSearchBox","isDefault","isChip","close","useEffect","v","o","handleSelect","option","prev","newSelected","handleClear","handleDisplayValue","defaultLabel","s","cn","Label_default","Popover","PopoverTrigger","triggerVariants","Badge","ChevronDownIcon","CircleX","Command","PopoverContent","CommandInput","CommandList","CommandEmpty","CommandGroup","id","CommandItem","ListItem_default","Separator","cva","Slot","cva","forwardRef","jsx","Button","className","variant","size","asChild","props","ref","cn","buttonVariants","jsx","jsxs","ComboboxDemo","selectedBands","setSelectedBands","useState","selectedFruit","setSelectedFruit","bands","Combobox","close","Button","band","ComboboxDemo_default"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var He=Object.create;var V=Object.defineProperty;var Ae=Object.getOwnPropertyDescriptor;var Oe=Object.getOwnPropertyNames;var Ge=Object.getPrototypeOf,Fe=Object.prototype.hasOwnProperty;var Ye=(e,t)=>{for(var o in t)V(e,o,{get:t[o],enumerable:!0})},re=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of Oe(t))!Fe.call(e,i)&&i!==o&&V(e,i,{get:()=>t[i],enumerable:!(n=Ae(t,i))||n.enumerable});return e};var x=(e,t,o)=>(o=e!=null?He(Ge(e)):{},re(t||!e||!e.__esModule?V(o,"default",{value:e,enumerable:!0}):o,e)),Je=e=>re(V({},"__esModule",{value:!0}),e);var lt={};Ye(lt,{default:()=>nt});module.exports=Je(lt);var Z=require("react");var N=require("react"),k=require("lucide-react"),De=require("cva");var ne=require("clsx"),le=require("tailwind-merge");function a(...e){return(0,le.twMerge)((0,ne.clsx)(e))}var s=require("cmdk"),de=require("lucide-react"),C=x(require("react"),1);var l=x(require("@radix-ui/react-dialog"),1),se=require("lucide-react"),D=x(require("react"),1),p=require("react/jsx-runtime");var Ke=l.Portal;var me=D.forwardRef(({className:e,...t},o)=>(0,p.jsx)(l.Overlay,{ref:o,className:a("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",e),...t}));me.displayName=l.Overlay.displayName;var pe=D.forwardRef(({className:e,children:t,...o},n)=>(0,p.jsxs)(Ke,{children:[(0,p.jsx)(me,{}),(0,p.jsxs)(l.Content,{ref:n,className:a("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950",e),...o,children:[t,(0,p.jsxs)(l.Close,{className:"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-neutral-950 focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-neutral-100 data-[state=open]:text-neutral-500 dark:ring-offset-neutral-950 dark:focus:ring-neutral-300 dark:data-[state=open]:bg-neutral-800 dark:data-[state=open]:text-neutral-400",children:[(0,p.jsx)(se.X,{className:"h-4 w-4"}),(0,p.jsx)("span",{className:"sr-only",children:"Close"})]})]})]}));pe.displayName=l.Content.displayName;var Ue=({className:e,...t})=>(0,p.jsx)("div",{className:a("flex flex-col space-y-1.5 text-center sm:text-left",e),...t});Ue.displayName="DialogHeader";var Xe=({className:e,...t})=>(0,p.jsx)("div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...t});Xe.displayName="DialogFooter";var $e=D.forwardRef(({className:e,...t},o)=>(0,p.jsx)(l.Title,{ref:o,className:a("text-lg font-semibold leading-none tracking-tight",e),...t}));$e.displayName=l.Title.displayName;var qe=D.forwardRef(({className:e,...t},o)=>(0,p.jsx)(l.Description,{ref:o,className:a("text-sm text-neutral-500 dark:text-neutral-400",e),...t}));qe.displayName=l.Description.displayName;var f=require("react/jsx-runtime"),A=C.forwardRef(({className:e,...t},o)=>(0,f.jsx)(s.Command,{ref:o,className:a("flex h-full w-full flex-col overflow-hidden rounded-xl bg-white text-neutral-950",e),...t}));A.displayName=s.Command.displayName;var O=C.forwardRef(({className:e,...t},o)=>(0,f.jsxs)("div",{className:"m-1 flex items-center rounded-xl border px-3","cmdk-input-wrapper":"",children:[(0,f.jsx)(de.Search,{className:"mr-2 h-4 w-4 shrink-0 opacity-50"}),(0,f.jsx)(s.Command.Input,{ref:o,className:a("flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-neutral-500 disabled:cursor-not-allowed disabled:opacity-50",e),...t})]}));O.displayName=s.Command.Input.displayName;var G=C.forwardRef(({className:e,...t},o)=>(0,f.jsx)(s.Command.List,{ref:o,className:a("overflow-y-auto overflow-x-hidden",e),...t}));G.displayName=s.Command.List.displayName;var F=C.forwardRef((e,t)=>(0,f.jsx)(s.Command.Empty,{ref:t,className:"py-6 text-center text-sm",...e}));F.displayName=s.Command.Empty.displayName;var Y=C.forwardRef(({className:e,...t},o)=>(0,f.jsx)(s.Command.Group,{ref:o,className:a("overflow-hidden p-1 text-neutral-950 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500",e),...t}));Y.displayName=s.Command.Group.displayName;var Qe=C.forwardRef(({className:e,...t},o)=>(0,f.jsx)(s.Command.Separator,{ref:o,className:a("-mx-1 h-px bg-neutral-200",e),...t}));Qe.displayName=s.Command.Separator.displayName;var J=C.forwardRef(({className:e,...t},o)=>(0,f.jsx)(s.Command.Item,{ref:o,className:a("relative flex cursor-pointer select-none items-center rounded-xl px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected='true']:bg-neutral-100 data-[selected=true]:text-neutral-900 data-[disabled=true]:opacity-50",e),...t}));J.displayName=s.Command.Item.displayName;var Ze=({className:e,...t})=>(0,f.jsx)("span",{className:a("ml-auto text-xs tracking-widest text-neutral-500",e),...t});Ze.displayName="CommandShortcut";var ce=x(require("react"),1),h=x(require("@radix-ui/react-popover"),1);var K=require("react/jsx-runtime"),fe=h.Root,ue=h.Trigger,U=ce.forwardRef(({className:e,align:t="center",sideOffset:o=4,...n},i)=>(0,K.jsx)(h.Portal,{children:(0,K.jsx)(h.Content,{ref:i,align:t,sideOffset:o,className:a("z-50 rounded-2xl border bg-white p-4 text-black shadow-md outline-none 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",e),...n})}));U.displayName=h.Content.displayName;var X=x(require("@radix-ui/react-separator"),1),ge=x(require("react"),1);var ve=require("react/jsx-runtime"),$=ge.forwardRef(({className:e,orientation:t="horizontal",decorative:o=!0,...n},i)=>(0,ve.jsx)(X.Root,{ref:i,decorative:o,orientation:t,className:a("shrink-0 bg-grey-10",t==="horizontal"?"h-[1px] w-full":"h-full w-[1px]",e),...n}));$.displayName=X.Root.displayName;var xe=require("lucide-react");var S=x(require("@radix-ui/react-checkbox"),1),z=require("lucide-react"),q=require("react");var y=require("react/jsx-runtime"),he=(0,q.forwardRef)(({className:e,...t},o)=>(0,y.jsx)(S.Root,{ref:o,className:a("group","peer","h-5","w-5","shrink-0","rounded-md","border","border-grey-10","outline","outline-1","outline-offset-2","outline-transparent","hover:border-grey-20","focus:outline-purple-100","active:border-green-80","disabled:cursor-not-allowed","disabled:opacity-50","data-[state=checked]:bg-green-80","data-[state=indeterminate]:bg-green-80","data-[state=checked]:text-white","data-[state=indeterminate]:text-primary-foreground",t.disabled&&"data-[state=checked]:text-foreground bg-grey-20 data-[state=checked]:bg-grey-20",e),...t,children:(0,y.jsxs)(S.Indicator,{className:"flex items-center justify-center text-current",children:[(0,y.jsx)(z.Check,{className:"hidden h-4 w-4 group-data-[state=checked]:block"}),(0,y.jsx)(z.Minus,{className:"hidden h-4 w-4 group-data-[state=indeterminate]:block"})]})}));he.displayName=S.Root.displayName;var ye=(0,q.forwardRef)(({classNames:e,children:t,...o},n)=>{let{disabled:i}=o,d=o.id??`${o.name??o.value?.toString()}-checkbox`,m=i?"text-grey-40 pointer-events-none":"";return(0,y.jsxs)("div",{className:a("flex space-x-2",e?.wrapper),children:[(0,y.jsx)(he,{id:d,disabled:i,ref:n,...o}),(0,y.jsx)("label",{htmlFor:d,className:a(m,e?.label),children:t})]})});ye.displayName="Checkbox";var be=ye;var Q=require("lucide-react"),v=require("react/jsx-runtime");function je({icon:e,hasCheckbox:t,isSelected:o,className:n,title:i,value:d,description:m,...M}){let T=e?(P=>{if(P in Q.icons){let B=Q.icons[P];return(0,v.jsx)(B,{size:14})}return null})(e):void 0;return(0,v.jsxs)("li",{className:a("group relative flex w-72 cursor-pointer flex-row items-center text-left text-sm",n),...M,"data-state":o?"checked":"unchecked",children:[T&&(0,v.jsx)("span",{className:"mr-2",children:T}),t&&(0,v.jsx)(be,{id:d,checked:o,onClick:P=>P.preventDefault()}),(0,v.jsxs)("div",{children:[(0,v.jsx)("p",{children:i}),(0,v.jsx)("p",{className:"text-xs text-grey-80",children:m})]}),(0,v.jsx)(xe.CheckIcon,{className:"absolute inset-y-0 right-0 my-auto hidden w-6 text-green-100 group-data-[state=checked]:block",size:16})]})}var Ce=je;var Pe=require("cva");var Ne=require("react/jsx-runtime"),et=(0,Pe.cva)("rounded-full px-2 py-0.5 text-xs font-semibold",{variants:{variant:{green:"bg-green-90 text-white",pickle:"bg-pickle-100 text-black",purple:"bg-purple-100 text-white"}},defaultVariants:{variant:"green"}});function Re({className:e,variant:t,...o}){return(0,Ne.jsx)("div",{className:a(et({variant:t}),e),...o})}var we=require("react/jsx-runtime");function tt({text:e,className:t,...o}){return e?(0,we.jsx)("label",{className:a("text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",t),...o,children:e}):null}var ke=tt;var r=require("react/jsx-runtime"),I=(0,N.forwardRef)((e,t)=>{let{value:o,label:n,options:i,classNames:d,multiselect:m,placeholder:M,variant:E="default",size:T,icon:P,className:B,onChange:L,children:H}=e,[b,W]=(0,N.useState)([]),[ee,te]=(0,N.useState)(!1),oe=P&&k.icons[P],We=i?.length<=5,w=E==="default",Ve=E==="chip",ae=()=>te(!1);(0,N.useEffect)(()=>{W(m?o??[]:o?[o]:[])},[o]);let ze=g=>{if(m)return W(R=>{let ie=R.includes(g)?R.filter(Be=>Be!==g):[...R,g];return L?.(ie),ie});W([g]),L?.(g),ae()},_e=()=>{W([]),L?.(m?[]:"")},Me=()=>{let g=b.length>0?b.join(", "):M;return w?g:n};return(0,r.jsxs)("div",{className:a("flex flex-col gap-2",B),children:[w&&n&&(0,r.jsx)(ke,{text:n,className:d?.label}),(0,r.jsxs)(fe,{open:ee,onOpenChange:te,children:[(0,r.jsx)(ue,{asChild:!0,disabled:i.length===0,children:(0,r.jsxs)("div",{ref:t,className:a(ot({variant:E,size:T}),d?.trigger),"aria-expanded":ee,children:[w&&oe&&(0,r.jsx)(oe,{className:"h-4 w-4 shrink-0"}),Ve&&b.length>0&&(0,r.jsx)(Re,{variant:"purple",children:b.length}),(0,r.jsx)("span",{className:a("w-full truncate leading-normal",w&&b.length==0&&"text-grey-40"),children:Me()}),b.length==0&&(0,r.jsx)(k.ChevronDownIcon,{className:"shrink-0 transform group-data-[state=open]:rotate-180",size:"16"}),w&&b.length>0&&(0,r.jsx)("button",{type:"button",className:"flex h-8 w-8 shrink-0 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20",onClick:_e,children:(0,r.jsx)(k.CircleX,{className:"h-4 w-4 text-green-100"})})]})}),(0,r.jsx)(A,{children:(0,r.jsxs)(U,{className:a("flex w-full max-w-xs flex-col overflow-hidden p-0","max-h-[--radix-popover-content-available-height]",d?.content),collisionPadding:8,sideOffset:4,align:"start",children:[!We&&(0,r.jsx)(O,{placeholder:"Search..."}),(0,r.jsxs)(G,{children:[(0,r.jsx)(F,{children:"No results"}),(0,r.jsx)(Y,{children:i.map(({id:g,...R})=>(0,r.jsx)(J,{value:R.value,onSelect:ze,children:(0,r.jsx)(Ce,{className:a(d?.items,"truncate py-1"),isSelected:b?.includes(R.value),hasCheckbox:m,...R})},g))})]}),!!H&&(0,r.jsx)($,{}),H&&H({close:ae})]})})]})]})});I.displayName="Combobox";var ot=(0,De.cva)("group relative cursor-pointer text-green-100 flex flex-row items-center justify-between gap-2 border border-grey-20 focus:outline-green-80 disabled:bg-grey-5",{variants:{variant:{default:["w-full","max-w-80","rounded-lg"],chip:["font-bold","rounded-3xl","data-[state=open]:bg-black","data-[state=open]:text-white"]},size:{small:["h-8","p-1","pl-2","text-xs"],normal:["h-9","p-2","pl-3","text-sm"],large:["h-10","p-3","pl-4","text-base"]}},defaultVariants:{variant:"default",size:"normal"}});var Se=require("@radix-ui/react-slot"),Ie=require("cva"),Ee=require("react"),Te=require("react/jsx-runtime"),_=(0,Ee.forwardRef)(({className:e,variant:t,size:o,asChild:n=!1,...i},d)=>(0,Te.jsx)(n?Se.Slot:"button",{className:a(at({variant:t,size:o,className:e})),ref:d,...i}));_.displayName="Button";var at=(0,Ie.cva)(["flex","items-center","justify-center","gap-2","rounded-full","font-bold","outline-2","outline-offset-2","outline-dashed","outline-transparent"],{variants:{variant:{neutral:["bg-black","text-white","hover:bg-grey-90","active:bg-grey-80","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],primary:["bg-pickle-100","text-black","hover:bg-pickle-80","active:bg-pickle-60","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],secondary:["bg-green-80","text-white","hover:bg-green-90","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40","disabled:bg-grey-10"],transparent:["text-white","hover:bg-green-80","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40"],link:["leading-tight","text-black","underline","hover:text-purple-100","focus:text-black","focus:outline-purple-100","active:text-purple-80"]},size:{small:["h-10","text-sm","px-4","py-2"],medium:["h-12","text-base","px-6","py-3"],large:["h-14","text-lg","px-8","py-4"]}},defaultVariants:{variant:"neutral",size:"medium"},compoundVariants:[{variant:"link",size:"small",class:["h-3","text-xs","p-0"]},{variant:"link",size:"medium",class:["h-4","text-sm","p-0"]},{variant:"link",size:"large",class:["h-6","text-base","p-0"]}]});var u=require("react/jsx-runtime");function it(){let[e,t]=(0,Z.useState)([]),[o,n]=(0,Z.useState)(""),i=[{title:"Nirvana",value:"Nirvana",description:"Come As You Are",id:1},{title:"Pearl Jam",value:"Pearl Jam",description:"Jeremy",id:2},{title:"Soundgarden",value:"Soundgarden",description:"Rusty Cage",id:3},{title:"Alice in Chains",value:"Alice in Chains",description:"Would?",id:4},{title:"Stone Temple Pilots",value:"Stone Temple Pilots",id:5},{title:"Hole",value:"Hole",id:6},{title:"Mudhoney",value:"Mudhoney",id:7},{title:"Screaming Trees",value:"Screaming Trees",id:8},{title:"L7",value:"L7",id:9},{title:"Sonic Youth",value:"Sonic Youth",id:10},{title:"And You Will Know Us by the Trail of Dead",value:"And You Will Know Us by the Trail of Dead",id:11}];return(0,u.jsxs)("div",{className:"flex flex-row flex-wrap items-center gap-4 p-4",children:[(0,u.jsx)(I,{label:"US bands from the 90's",placeholder:"Select a band",icon:"Music",options:i,multiselect:!0,onChange:t,value:e}),(0,u.jsx)(I,{label:"US bands from the 90's",options:i,variant:"chip",multiselect:!0,onChange:t,value:e}),(0,u.jsx)(I,{label:"Fruit label",variant:"chip",options:[{title:"Cherry",value:"Cherry",id:1,icon:"Cherry"},{title:"Grape",value:"Grape",id:2,icon:"Grape"}],value:o,onChange:n,children:({close:m})=>(0,u.jsxs)("div",{className:"flex flex-row items-center justify-between bg-white p-2 pl-4",children:[(0,u.jsx)(_,{variant:"link",tabIndex:-1,onClick:m,children:"Clear"}),(0,u.jsx)(_,{variant:"primary",size:"small",tabIndex:-1,children:"Apply"})]})}),e.map(m=>(0,u.jsx)("span",{className:"text-green-80",children:m},m)),(0,u.jsx)("span",{className:"text-purple-100",children:o})]})}var Le=it;var j=require("react/jsx-runtime");function rt(){return(0,j.jsx)("div",{children:(0,j.jsx)(Le,{})})}var nt=rt;
|
|
1
|
+
"use strict";var Ae=Object.create;var _=Object.defineProperty;var Oe=Object.getOwnPropertyDescriptor;var Ge=Object.getOwnPropertyNames;var Fe=Object.getPrototypeOf,Ye=Object.prototype.hasOwnProperty;var Je=(e,t)=>{for(var o in t)_(e,o,{get:t[o],enumerable:!0})},le=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of Ge(t))!Ye.call(e,i)&&i!==o&&_(e,i,{get:()=>t[i],enumerable:!(n=Oe(t,i))||n.enumerable});return e};var C=(e,t,o)=>(o=e!=null?Ae(Fe(e)):{},le(t||!e||!e.__esModule?_(o,"default",{value:e,enumerable:!0}):o,e)),Ke=e=>le(_({},"__esModule",{value:!0}),e);var st={};Je(st,{default:()=>lt});module.exports=Ke(st);var ee=require("react");var k=require("react"),w=require("lucide-react"),Ie=require("cva");var se=require("clsx"),me=require("tailwind-merge");function a(...e){return(0,me.twMerge)((0,se.clsx)(e))}var m=require("cmdk"),fe=require("lucide-react"),P=C(require("react"),1);var l=C(require("@radix-ui/react-dialog"),1),pe=require("lucide-react"),I=C(require("react"),1),d=require("react/jsx-runtime");var Ue=l.Portal;var de=I.forwardRef(({className:e,...t},o)=>(0,d.jsx)(l.Overlay,{ref:o,className:a("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",e),...t}));de.displayName=l.Overlay.displayName;var ce=I.forwardRef(({className:e,children:t,...o},n)=>(0,d.jsxs)(Ue,{children:[(0,d.jsx)(de,{}),(0,d.jsxs)(l.Content,{ref:n,className:a("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950",e),...o,children:[t,(0,d.jsxs)(l.Close,{className:"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-neutral-950 focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-neutral-100 data-[state=open]:text-neutral-500 dark:ring-offset-neutral-950 dark:focus:ring-neutral-300 dark:data-[state=open]:bg-neutral-800 dark:data-[state=open]:text-neutral-400",children:[(0,d.jsx)(pe.X,{className:"h-4 w-4"}),(0,d.jsx)("span",{className:"sr-only",children:"Close"})]})]})]}));ce.displayName=l.Content.displayName;var Xe=({className:e,...t})=>(0,d.jsx)("div",{className:a("flex flex-col space-y-1.5 text-center sm:text-left",e),...t});Xe.displayName="DialogHeader";var $e=({className:e,...t})=>(0,d.jsx)("div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...t});$e.displayName="DialogFooter";var qe=I.forwardRef(({className:e,...t},o)=>(0,d.jsx)(l.Title,{ref:o,className:a("text-lg font-semibold leading-none tracking-tight",e),...t}));qe.displayName=l.Title.displayName;var Qe=I.forwardRef(({className:e,...t},o)=>(0,d.jsx)(l.Description,{ref:o,className:a("text-sm text-neutral-500 dark:text-neutral-400",e),...t}));Qe.displayName=l.Description.displayName;var u=require("react/jsx-runtime"),G=P.forwardRef(({className:e,...t},o)=>(0,u.jsx)(m.Command,{ref:o,className:a("flex h-full w-full flex-col overflow-hidden rounded-xl bg-white text-neutral-950",e),...t}));G.displayName=m.Command.displayName;var F=P.forwardRef(({className:e,...t},o)=>(0,u.jsxs)("div",{className:"m-1 flex items-center rounded-xl border px-3","cmdk-input-wrapper":"",children:[(0,u.jsx)(fe.Search,{className:"mr-2 h-4 w-4 shrink-0 opacity-50"}),(0,u.jsx)(m.Command.Input,{ref:o,className:a("flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-neutral-500 disabled:cursor-not-allowed disabled:opacity-50",e),...t})]}));F.displayName=m.Command.Input.displayName;var Y=P.forwardRef(({className:e,...t},o)=>(0,u.jsx)(m.Command.List,{ref:o,className:a("overflow-y-auto overflow-x-hidden",e),...t}));Y.displayName=m.Command.List.displayName;var J=P.forwardRef((e,t)=>(0,u.jsx)(m.Command.Empty,{ref:t,className:"py-6 text-center text-sm",...e}));J.displayName=m.Command.Empty.displayName;var K=P.forwardRef(({className:e,...t},o)=>(0,u.jsx)(m.Command.Group,{ref:o,className:a("overflow-hidden p-1 text-neutral-950 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-neutral-500",e),...t}));K.displayName=m.Command.Group.displayName;var Ze=P.forwardRef(({className:e,...t},o)=>(0,u.jsx)(m.Command.Separator,{ref:o,className:a("-mx-1 h-px bg-neutral-200",e),...t}));Ze.displayName=m.Command.Separator.displayName;var U=P.forwardRef(({className:e,...t},o)=>(0,u.jsx)(m.Command.Item,{ref:o,className:a("relative flex cursor-pointer select-none items-center rounded-xl px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected='true']:bg-neutral-100 data-[selected=true]:text-neutral-900 data-[disabled=true]:opacity-50",e),...t}));U.displayName=m.Command.Item.displayName;var je=({className:e,...t})=>(0,u.jsx)("span",{className:a("ml-auto text-xs tracking-widest text-neutral-500",e),...t});je.displayName="CommandShortcut";var ue=C(require("react"),1),y=C(require("@radix-ui/react-popover"),1);var X=require("react/jsx-runtime"),ge=y.Root,ve=y.Trigger,$=ue.forwardRef(({className:e,align:t="center",sideOffset:o=4,...n},i)=>(0,X.jsx)(y.Portal,{children:(0,X.jsx)(y.Content,{ref:i,align:t,sideOffset:o,className:a("z-50 rounded-2xl border bg-white p-4 text-black shadow-md outline-none 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",e),...n})}));$.displayName=y.Content.displayName;var q=C(require("@radix-ui/react-separator"),1),he=C(require("react"),1);var ye=require("react/jsx-runtime"),Q=he.forwardRef(({className:e,orientation:t="horizontal",decorative:o=!0,...n},i)=>(0,ye.jsx)(q.Root,{ref:i,decorative:o,orientation:t,className:a("shrink-0 bg-grey-10",t==="horizontal"?"h-[1px] w-full":"h-full w-[1px]",e),...n}));Q.displayName=q.Root.displayName;var Pe=require("lucide-react");var E=C(require("@radix-ui/react-checkbox"),1),M=require("lucide-react"),Z=require("react");var b=require("react/jsx-runtime"),be=(0,Z.forwardRef)(({className:e,...t},o)=>(0,b.jsx)(E.Root,{ref:o,className:a("group","peer","h-5","w-5","shrink-0","rounded-md","border","border-grey-10","outline","outline-1","outline-offset-2","outline-transparent","hover:border-grey-20","focus:outline-purple-100","active:border-green-80","disabled:cursor-not-allowed","disabled:opacity-50","data-[state=checked]:bg-green-80","data-[state=indeterminate]:bg-green-80","data-[state=checked]:text-white","data-[state=indeterminate]:text-primary-foreground",t.disabled&&"data-[state=checked]:text-foreground bg-grey-20 data-[state=checked]:bg-grey-20",e),...t,children:(0,b.jsxs)(E.Indicator,{className:"flex items-center justify-center text-current",children:[(0,b.jsx)(M.Check,{className:"hidden h-4 w-4 group-data-[state=checked]:block"}),(0,b.jsx)(M.Minus,{className:"hidden h-4 w-4 group-data-[state=indeterminate]:block"})]})}));be.displayName=E.Root.displayName;var xe=(0,Z.forwardRef)(({classNames:e,children:t,...o},n)=>{let{disabled:i}=o,c=o.id??`${o.name??o.value?.toString()}-checkbox`,p=i?"text-grey-40 pointer-events-none":"";return(0,b.jsxs)("div",{className:a("flex space-x-2",e?.wrapper),children:[(0,b.jsx)(be,{id:c,disabled:i,ref:n,...o}),(0,b.jsx)("label",{htmlFor:c,className:a(p,e?.label),children:t})]})});xe.displayName="Checkbox";var Ce=xe;var j=require("lucide-react"),v=require("react/jsx-runtime");function et({icon:e,hasCheckbox:t,isSelected:o,className:n,title:i,value:c,description:p,...H}){let W=e?(R=>{if(R in j.icons){let A=j.icons[R];return(0,v.jsx)(A,{size:14})}return null})(e):void 0;return(0,v.jsxs)("li",{className:a("group relative flex w-72 cursor-pointer flex-row items-center text-left text-sm",n),...H,"data-state":o?"checked":"unchecked",children:[W&&(0,v.jsx)("span",{className:"mr-2",children:W}),t&&(0,v.jsx)(Ce,{id:c,checked:o,onClick:R=>R.preventDefault()}),(0,v.jsxs)("div",{children:[(0,v.jsx)("p",{children:i}),(0,v.jsx)("p",{className:"text-xs text-grey-80",children:p})]}),(0,v.jsx)(Pe.CheckIcon,{className:"absolute inset-y-0 right-0 my-auto hidden w-6 text-green-100 group-data-[state=checked]:block",size:16})]})}var Re=et;var Ne=require("cva");var we=require("react/jsx-runtime"),tt=(0,Ne.cva)("rounded-full px-2 py-0.5 text-xs font-semibold",{variants:{variant:{green:"bg-green-90 text-white",pickle:"bg-pickle-100 text-black",purple:"bg-purple-100 text-white"}},defaultVariants:{variant:"green"}});function ke({className:e,variant:t,...o}){return(0,we.jsx)("div",{className:a(tt({variant:t}),e),...o})}var Se=require("react/jsx-runtime");function ot({text:e,className:t,...o}){return e?(0,Se.jsx)("label",{className:a("text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",t),...o,children:e}):null}var De=ot;var r=require("react/jsx-runtime"),T=(0,k.forwardRef)((e,t)=>{let{value:o,label:n,options:i,classNames:c,multiselect:p,placeholder:H,variant:L="default",size:W,icon:R,className:A,onChange:V,children:O}=e,[x,z]=(0,k.useState)([]),[oe,ae]=(0,k.useState)(!1),ie=R&&w.icons[R],ze=i?.length<=5,D=L==="default",_e=L==="chip",re=()=>ae(!1);(0,k.useEffect)(()=>{z((p?o??[]:o?[o]:[]).map(s=>i.find(h=>h.value===s)).filter(s=>s!==void 0))},[o]);let Me=N=>{let s=i.find(h=>h.value===N);if(s){if(p)return z(h=>{let ne=h.some(S=>S.value===N)?h.filter(S=>S!==s):[...h,s];return V?.(ne.map(S=>S.value)),ne});z([s]),V?.(s.value),re()}},Be=()=>{z([]),V?.(p?[]:"")},He=()=>{let N=x.length>0?x.map(s=>s.title).join(", "):H;return D?N:n};return(0,r.jsxs)("div",{className:a("flex flex-col gap-2",A),children:[D&&n&&(0,r.jsx)(De,{text:n,className:c?.label}),(0,r.jsxs)(ge,{open:oe,onOpenChange:ae,children:[(0,r.jsx)(ve,{asChild:!0,disabled:i.length===0,children:(0,r.jsxs)("div",{ref:t,className:a(at({variant:L,size:W}),c?.trigger),"aria-expanded":oe,children:[D&&ie&&(0,r.jsx)(ie,{className:"h-4 w-4 shrink-0"}),_e&&x.length>0&&(0,r.jsx)(ke,{variant:"purple",children:x.length}),(0,r.jsx)("span",{className:a("w-full truncate leading-normal",D&&x.length==0&&"text-grey-40"),children:He()}),x.length==0&&(0,r.jsx)(w.ChevronDownIcon,{className:"shrink-0 transform group-data-[state=open]:rotate-180",size:"16"}),D&&x.length>0&&(0,r.jsx)("button",{type:"button",className:"flex h-8 w-8 shrink-0 cursor-pointer items-center justify-center rounded-full hover:bg-pickle-20",onClick:Be,children:(0,r.jsx)(w.CircleX,{className:"h-4 w-4 text-green-100"})})]})}),(0,r.jsx)(G,{children:(0,r.jsxs)($,{className:a("flex w-full max-w-xs flex-col overflow-hidden p-0","max-h-[--radix-popover-content-available-height]",c?.content),collisionPadding:8,sideOffset:4,align:"start",children:[!ze&&(0,r.jsx)(F,{placeholder:"Search..."}),(0,r.jsxs)(Y,{children:[(0,r.jsx)(J,{children:"No results"}),(0,r.jsx)(K,{children:i.map(({id:N,...s})=>(0,r.jsx)(U,{value:s.value,onSelect:Me,children:(0,r.jsx)(Re,{className:a(c?.items,"truncate py-1"),isSelected:x.some(h=>h.value===s.value),hasCheckbox:p,...s})},N))})]}),!!O&&(0,r.jsx)(Q,{}),O&&O({close:re})]})})]})]})});T.displayName="Combobox";var at=(0,Ie.cva)("group relative cursor-pointer text-green-100 flex flex-row items-center justify-between gap-2 border border-grey-20 focus:outline-green-80 disabled:bg-grey-5",{variants:{variant:{default:["w-full","max-w-80","rounded-lg"],chip:["font-bold","rounded-3xl","data-[state=open]:bg-black","data-[state=open]:text-white"]},size:{small:["h-8","p-1","pl-2","text-xs"],normal:["h-9","p-2","pl-3","text-sm"],large:["h-10","p-3","pl-4","text-base"]}},defaultVariants:{variant:"default",size:"normal"}});var Ee=require("@radix-ui/react-slot"),Te=require("cva"),Le=require("react"),We=require("react/jsx-runtime"),B=(0,Le.forwardRef)(({className:e,variant:t,size:o,asChild:n=!1,...i},c)=>(0,We.jsx)(n?Ee.Slot:"button",{className:a(it({variant:t,size:o,className:e})),ref:c,...i}));B.displayName="Button";var it=(0,Te.cva)(["flex","items-center","justify-center","gap-2","rounded-full","font-bold","outline-2","outline-offset-2","outline-dashed","outline-transparent"],{variants:{variant:{neutral:["bg-black","text-white","hover:bg-grey-90","active:bg-grey-80","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],primary:["bg-pickle-100","text-black","hover:bg-pickle-80","active:bg-pickle-60","focus:outline-purple-100","disabled:text-grey-40","disabled:bg-grey-10"],secondary:["bg-green-80","text-white","hover:bg-green-90","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40","disabled:bg-grey-10"],transparent:["text-white","hover:bg-green-80","active:bg-green-100","focus:outline-pickle-100","disabled:text-grey-40"],link:["leading-tight","text-black","underline","hover:text-purple-100","focus:text-black","focus:outline-purple-100","active:text-purple-80"]},size:{small:["h-10","text-sm","px-4","py-2"],medium:["h-12","text-base","px-6","py-3"],large:["h-14","text-lg","px-8","py-4"]}},defaultVariants:{variant:"neutral",size:"medium"},compoundVariants:[{variant:"link",size:"small",class:["h-3","text-xs","p-0"]},{variant:"link",size:"medium",class:["h-4","text-sm","p-0"]},{variant:"link",size:"large",class:["h-6","text-base","p-0"]}]});var g=require("react/jsx-runtime");function rt(){let[e,t]=(0,ee.useState)([]),[o,n]=(0,ee.useState)(""),i=[{title:"Nirvana",value:"Nirvana",description:"Come As You Are",id:1},{title:"Pearl Jam",value:"Pearl Jam",description:"Jeremy",id:2},{title:"Soundgarden",value:"Soundgarden",description:"Rusty Cage",id:3},{title:"Alice in Chains",value:"Alice in Chains",description:"Would?",id:4},{title:"Stone Temple Pilots",value:"Stone Temple Pilots",id:5},{title:"Hole",value:"Hole",id:6},{title:"Mudhoney",value:"Mudhoney",id:7},{title:"Screaming Trees",value:"Screaming Trees",id:8},{title:"L7",value:"L7",id:9},{title:"Sonic Youth",value:"Sonic Youth",id:10},{title:"And You Will Know Us by the Trail of Dead",value:"And You Will Know Us by the Trail of Dead",id:11}];return(0,g.jsxs)("div",{className:"flex flex-row flex-wrap items-center gap-4 p-4",children:[(0,g.jsx)(T,{label:"US bands from the 90's",placeholder:"Select a band",icon:"Music",options:i,multiselect:!0,onChange:t,value:e}),(0,g.jsx)(T,{label:"US bands from the 90's",options:i,variant:"chip",multiselect:!0,onChange:t,value:e}),(0,g.jsx)(T,{label:"Fruit label",variant:"chip",options:[{title:"Cherry",value:"Cherry",id:1,icon:"Cherry"},{title:"Grape",value:"Grape",id:2,icon:"Grape"}],value:o,onChange:n,children:({close:p})=>(0,g.jsxs)("div",{className:"flex flex-row items-center justify-between bg-white p-2 pl-4",children:[(0,g.jsx)(B,{variant:"link",tabIndex:-1,onClick:p,children:"Clear"}),(0,g.jsx)(B,{variant:"primary",size:"small",tabIndex:-1,children:"Apply"})]})}),e.map(p=>(0,g.jsx)("span",{className:"text-green-80",children:p},p)),(0,g.jsx)("span",{className:"text-purple-100",children:o})]})}var Ve=rt;var te=require("react/jsx-runtime");function nt(){return(0,te.jsx)("div",{children:(0,te.jsx)(Ve,{})})}var lt=nt;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|