@next-degree/pickle-shared-js 0.3.19 → 0.3.20

package/dist/components/ui/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/ListItem.tsx","../../../src/components/ui/Checkbox.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\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"],"mappings":"AAAA,OAA0B,QAAAA,MAAY,OACtC,OAAS,WAAAC,MAAe,iBAEjB,SAASC,KAAMC,EAAsB,CAC1C,OAAOF,EAAQD,EAAKG,CAAM,CAAC,CAC7B,CCJA,OAAS,aAAAC,MAAiB,eCC1B,UAAYC,MAAuB,2BACnC,OAAS,SAAAC,EAAO,SAAAC,MAAa,eAC7B,OAGE,cAAAC,MAEK,QAsCH,OACE,OAAAC,EADF,QAAAC,MAAA,oBAlCJ,IAAMC,EAAiBC,EAGrB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC1BN,EAAmB,OAAlB,CACC,IAAKM,EACL,UAAWC,EACT,QACA,OACA,MACA,MACA,WACA,aACA,SACA,iBACA,UACA,YACA,mBACA,sBACA,uBACA,2BACA,yBACA,8BACA,sBACA,mCACA,yCACA,kCACA,qDACAF,EAAM,UACJ,kFACFD,CACF,EACC,GAAGC,EAEJ,SAAAJ,EAAmB,YAAlB,CAA4B,UAAU,gDACrC,UAAAD,EAACQ,EAAA,CAAM,UAAU,kDAAkD,EACnER,EAACS,EAAA,CAAM,UAAU,wDAAwD,GAC3E,EACF,CACD,EACDP,EAAe,YAAgC,OAAK,YAUpD,IAAMQ,EAAWP,EACf,CAAC,CAAE,WAAAQ,EAAY,SAAAC,EAAU,GAAGP,CAAM,EAAGC,IAAQ,CAC3C,GAAM,CAAE,SAAAO,CAAS,EAAIR,EACfS,EAAKT,EAAM,IAAM,GAAGA,EAAM,MAAQA,EAAM,OAAO,SAAS,CAAC,YACzDU,EAAiBF,EAAW,mCAAqC,GACvE,OACEZ,EAAC,OAAI,UAAWM,EAAG,iBAAkBI,GAAY,OAAO,EACtD,UAAAX,EAACE,EAAA,CAAe,GAAIY,EAAI,SAAUD,EAAU,IAAKP,EAAM,GAAGD,EAAO,EACjEL,EAAC,SAAM,QAASc,EAAI,UAAWP,EAAGQ,EAAgBJ,GAAY,KAAK,EAChE,SAAAC,EACH,GACF,CAEJ,CACF,EACAF,EAAS,YAAc,WAEvB,IAAOM,EAAQN,ED5Ef,OAAS,SAAAO,MAAa,eA0BT,cAAAC,EAoBP,QAAAC,MApBO,oBAbb,SAASC,EAAS,CAChB,KAAAC,EACA,YAAAC,EACA,WAAAC,EACA,UAAAC,EACA,MAAAC,EACA,MAAAC,EACA,YAAAC,EACA,GAAGC,CACL,EAAkB,CAShB,IAAMC,EAAaR,GARKA,GAA4B,CAClD,GAAIA,KAAQJ,EAAO,CACjB,IAAMa,EAAgBb,EAAMI,CAAe,EAC3C,OAAOH,EAACY,EAAA,CAAc,KAAM,GAAI,CAClC,CACA,OAAO,IACT,GAEyCT,CAAI,EAAI,OAEjD,OACEF,EAAC,MACC,UAAWY,EACT,kFACAP,CACF,EACC,GAAGI,EACJ,aAAYL,EAAa,UAAY,YAEpC,UAAAM,GAAcX,EAAC,QAAK,UAAU,OAAQ,SAAAW,EAAW,EACjDP,GACCJ,EAACc,EAAA,CAAS,GAAIN,EAAO,QAASH,EAAY,QAAUU,GAAMA,EAAE,eAAe,EAAG,EAEhFd,EAAC,OACC,UAAAD,EAAC,KAAG,SAAAO,EAAM,EACVP,EAAC,KAAE,UAAU,uBAAwB,SAAAS,EAAY,GACnD,EAEAT,EAACgB,EAAA,CACC,UAAU,gGACV,KAAM,GACR,GACF,CAEJ,CAEA,IAAOC,EAAQf","names":["clsx","twMerge","cn","inputs","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"]}
+{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/ListItem.tsx","../../../src/components/ui/Checkbox.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\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"],"mappings":";AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACJA,SAAS,iBAAiB;;;ACC1B,YAAY,uBAAuB;AACnC,SAAS,OAAO,aAAa;AAC7B;AAAA,EAGE;AAAA,OAEK;AAsCH,SACE,KADF;AAlCJ,IAAM,iBAAiB,WAGrB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAmB;AAAA,EAAlB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM,YACJ;AAAA,MACF;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEJ,+BAAmB,6BAAlB,EAA4B,WAAU,iDACrC;AAAA,0BAAC,SAAM,WAAU,mDAAkD;AAAA,MACnE,oBAAC,SAAM,WAAU,yDAAwD;AAAA,OAC3E;AAAA;AACF,CACD;AACD,eAAe,cAAgC,uBAAK;AAUpD,IAAM,WAAW;AAAA,EACf,CAAC,EAAE,YAAY,UAAU,GAAG,MAAM,GAAG,QAAQ;AAC3C,UAAM,EAAE,SAAS,IAAI;AACrB,UAAM,KAAK,MAAM,MAAM,GAAG,MAAM,QAAQ,MAAM,OAAO,SAAS,CAAC;AAC/D,UAAM,iBAAiB,WAAW,qCAAqC;AACvE,WACE,qBAAC,SAAI,WAAW,GAAG,kBAAkB,YAAY,OAAO,GACtD;AAAA,0BAAC,kBAAe,IAAQ,UAAoB,KAAW,GAAG,OAAO;AAAA,MACjE,oBAAC,WAAM,SAAS,IAAI,WAAW,GAAG,gBAAgB,YAAY,KAAK,GAChE,UACH;AAAA,OACF;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;AAEvB,IAAO,mBAAQ;;;AD5Ef,SAAS,aAAa;AA0BT,gBAAAA,MAoBP,QAAAC,aApBO;AAbb,SAAS,SAAS;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,QAAM,iBAAiB,CAACC,UAA4B;AAClD,QAAIA,SAAQ,OAAO;AACjB,YAAM,gBAAgB,MAAMA,KAAe;AAC3C,aAAO,gBAAAF,KAAC,iBAAc,MAAM,IAAI;AAAA,IAClC;AACA,WAAO;AAAA,EACT;AAEA,QAAM,aAAa,OAAO,eAAe,IAAI,IAAI;AAEjD,SACE,gBAAAC;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MACJ,cAAY,aAAa,YAAY;AAAA,MAEpC;AAAA,sBAAc,gBAAAD,KAAC,UAAK,WAAU,QAAQ,sBAAW;AAAA,QACjD,eACC,gBAAAA,KAAC,oBAAS,IAAI,OAAO,SAAS,YAAY,SAAS,CAAC,MAAM,EAAE,eAAe,GAAG;AAAA,QAEhF,gBAAAC,MAAC,SACC;AAAA,0BAAAD,KAAC,OAAG,iBAAM;AAAA,UACV,gBAAAA,KAAC,OAAE,WAAU,wBAAwB,uBAAY;AAAA,WACnD;AAAA,QAEA,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAM;AAAA;AAAA,QACR;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ;","names":["jsx","jsxs","icon"]}

package/dist/components/ui/Select.cjs

@@ -1,2 +1,247 @@
-"use strict";"use client";var Y=Object.create;var v=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var ee=Object.getPrototypeOf,te=Object.prototype.hasOwnProperty;var re=(t,r)=>{for(var o in r)v(t,o,{get:r[o],enumerable:!0})},E=(t,r,o,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let s of _(r))!te.call(t,s)&&s!==o&&v(t,s,{get:()=>r[s],enumerable:!(n=Z(r,s))||n.enumerable});return t};var P=(t,r,o)=>(o=t!=null?Y(ee(t)):{},E(r||!t||!t.__esModule?v(o,"default",{value:t,enumerable:!0}):o,t)),ae=t=>E(v({},"__esModule",{value:!0}),t);var se={};re(se,{default:()=>le});module.exports=ae(se);var i=P(require("@radix-ui/react-select"),1),d=require("lucide-react"),p=require("react");var V=require("clsx"),z=require("tailwind-merge");function m(...t){return(0,z.twMerge)((0,V.clsx)(t))}var O=require("react/jsx-runtime");function ie({text:t,className:r,...o}){return t?(0,O.jsx)("label",{className:m("text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",r),...o,children:t}):null}var L=ie;var T=require("cva"),D=require("tailwind-merge"),M=require("react/jsx-runtime"),oe=({className:t,variant:r,size:o,...n})=>(0,M.jsx)("div",{className:(0,D.twMerge)(ne({variant:r,size:o,className:t})),...n}),ne=(0,T.cva)(["flex","items-center","rounded-3xl","border","w-fit"],{variants:{variant:{neutral:["text-grey-80","border-grey-10"],primary:["text-purple-100","border-purple-20"],danger:["text-pumpkin-100","border-pumpkin-20"],onboarding:["text-green-100","bg-green-10","cursor-pointer"],onboardingSelected:["text-white","bg-green-90","cursor-pointer"]},size:{small:["text-sm","leading-5","px-2","py-1","gap-1.5"],medium:["text-base","leading-6","px-3","py-2","gap-2"]}},defaultVariants:{variant:"neutral",size:"medium"}}),I=oe;var S=P(require("@radix-ui/react-separator"),1),W=P(require("react"),1);var K=require("react/jsx-runtime"),C=W.forwardRef(({className:t,orientation:r="horizontal",decorative:o=!0,...n},s)=>(0,K.jsx)(S.Root,{ref:s,decorative:o,orientation:r,className:m("shrink-0 bg-grey-10",r==="horizontal"?"h-[1px] w-full":"h-full w-[1px]",t),...n}));C.displayName=S.Root.displayName;var a=require("react/jsx-runtime"),H=(0,p.forwardRef)(({label:t,options:r,placeholder:o,multiselect:n,classNames:s,...A},B)=>{let{value:f,defaultValue:w,dir:G,className:$,onChange:X,...j}=A,[u,b]=(0,p.useState)([]),[q,x]=(0,p.useState)(!1),R=(0,p.useRef)(null);(0,p.useEffect)(()=>{if(!f)return b([]);b(Array.isArray(f)?f:[f])},[f]);let F=()=>x(e=>!e),J=e=>e.key==="Escape"&&x(!1),Q=(e,l)=>e.key==="Enter"&&g(l),k=u?.map(e=>r?.find(({value:l})=>l===e)).filter(Boolean);function N(){return n?u.map(e=>r?.find(l=>l.value===e)?.title).join(", "):r?.find(e=>e.value===u.join())?.title}function U(e){(!n||e)&&x(e)}function g(e){let l=[];b(c=>(l=c.includes(e)?c.filter(y=>y!==e):[...c,e],n?l:[e])),X?.(n?l:e)}return(0,a.jsxs)("div",{className:m("flex flex-col space-y-2",$),ref:R,children:[(0,a.jsx)(L,{text:t,className:s?.label}),(0,a.jsxs)(i.Root,{open:q,value:u.join(","),onOpenChange:U,onValueChange:n?void 0:g,defaultValue:typeof w=="string"?w:void 0,dir:G==="rtl"?"rtl":"ltr",...j,children:[(0,a.jsxs)(i.Trigger,{ref:B,"data-testid":`${t.toLowerCase()}-select-element`,className:"group flex min-w-80 flex-row items-center justify-between gap-3 rounded-lg border border-grey-20 px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40",children:[(0,a.jsx)("span",{className:"truncate",children:(0,a.jsx)(i.Value,{placeholder:o??"Select an option","aria-label":N(),children:N()})}),(0,a.jsx)(d.ChevronDownIcon,{className:"transform text-black group-data-[state=open]:rotate-180",size:"16"})]}),(0,a.jsx)(i.Portal,{container:R.current,children:(0,a.jsx)(i.Content,{hideWhenDetached:!0,className:"z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg",position:"popper",sideOffset:4,onPointerDownOutside:F,onKeyDown:J,children:(0,a.jsxs)(i.Viewport,{children:[n&&!!k?.length&&(0,a.jsx)(i.Group,{className:"mb-2 flex flex-row flex-wrap gap-1 px-2","data-testid":"selected-labels",children:k?.map(e=>e&&(0,a.jsxs)(I,{size:"small",variant:"primary",children:[(0,a.jsx)("span",{children:e.title}),(0,a.jsx)(d.X,{size:18,"data-testid":`chip-remove-${e.value}`,className:"cursor-pointer",onClick:()=>g(e.value)})]},e.title))}),(0,a.jsx)(C,{}),r?.map(({id:e,title:l,value:c})=>(0,a.jsxs)(i.Item,{value:c,className:"group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100","data-state":u.includes(c)?"checked":"unchecked",onKeyDown:y=>Q(y,c),onClick:()=>g(c),children:[(0,a.jsx)(i.ItemText,{children:l}),(0,a.jsx)(d.CheckIcon,{className:"absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block",size:16})]},e))]})})})]})]})});H.displayName="Select";var le=H;
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ui/Select.tsx
+var Select_exports = {};
+__export(Select_exports, {
+  default: () => Select_default
+});
+module.exports = __toCommonJS(Select_exports);
+var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
+var import_lucide_react = require("lucide-react");
+var import_react = require("react");
+
+// src/lib/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/components/ui/Label.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function Label({ text, className, ...props }) {
+  if (!text) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "label",
+    {
+      className: cn(
+        "text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+        className
+      ),
+      ...props,
+      children: text
+    }
+  );
+}
+var Label_default = Label;
+
+// src/components/ui/Chip.tsx
+var import_cva = require("cva");
+var import_tailwind_merge2 = require("tailwind-merge");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Chip = ({ className, variant, size, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: (0, import_tailwind_merge2.twMerge)(chipVariants({ variant, size, className })), ...props });
+var chipVariants = (0, import_cva.cva)(["flex", "items-center", "rounded-3xl", "border", "w-fit"], {
+  variants: {
+    variant: {
+      neutral: ["text-grey-80", "border-grey-10"],
+      primary: ["text-purple-100", "border-purple-20"],
+      danger: ["text-pumpkin-100", "border-pumpkin-20"],
+      onboarding: ["text-green-100", "bg-green-10", "cursor-pointer"],
+      onboardingSelected: ["text-white", "bg-green-90", "cursor-pointer"]
+    },
+    size: {
+      small: ["text-sm", "leading-5", "px-2", "py-1", "gap-1.5"],
+      medium: ["text-base", "leading-6", "px-3", "py-2", "gap-2"]
+    }
+  },
+  defaultVariants: {
+    variant: "neutral",
+    size: "medium"
+  }
+});
+var Chip_default = Chip;
+
+// src/components/primitives/separator.tsx
+var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
+var React = __toESM(require("react"), 1);
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var Separator = React.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  SeparatorPrimitive.Root,
+  {
+    ref,
+    decorative,
+    orientation,
+    className: cn(
+      "shrink-0 bg-grey-10",
+      orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+      className
+    ),
+    ...props
+  }
+));
+Separator.displayName = SeparatorPrimitive.Root.displayName;
+
+// src/components/ui/Select.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Select = (0, import_react.forwardRef)(
+  ({ label, options, placeholder, multiselect, classNames, ...props }, ref) => {
+    const { value, defaultValue, dir, className, onChange, ...rest } = props;
+    const [selected, setSelected] = (0, import_react.useState)([]);
+    const [open, setOpen] = (0, import_react.useState)(false);
+    const containerRef = (0, import_react.useRef)(null);
+    (0, import_react.useEffect)(() => {
+      if (!value) return setSelected([]);
+      setSelected(Array.isArray(value) ? value : [value]);
+    }, [value]);
+    const toggleOpen = () => setOpen((prev) => !prev);
+    const closeOnEscape = (event) => event.key === "Escape" && setOpen(false);
+    const setValueOnEnter = (event, value2) => event.key === "Enter" && handleChange(value2);
+    const chipLabels = selected?.map((s) => options?.find(({ value: value2 }) => value2 === s)).filter(Boolean);
+    function handleLabels() {
+      if (multiselect) {
+        return selected.map((o) => options?.find((option) => option.value === o)?.title).join(", ");
+      }
+      return options?.find((option) => option.value === selected.join())?.title;
+    }
+    function handleOnOpenChange(isOpen) {
+      if (!multiselect || isOpen) setOpen(isOpen);
+    }
+    function handleChange(newValue) {
+      let newSelected = [];
+      setSelected((prev) => {
+        newSelected = prev.includes(newValue) ? prev.filter((item) => item !== newValue) : [...prev, newValue];
+        return multiselect ? newSelected : [newValue];
+      });
+      onChange?.(multiselect ? newSelected : newValue);
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: cn("flex flex-col space-y-2", className), ref: containerRef, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Label_default, { text: label, className: classNames?.label }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+        SelectPrimitive.Root,
+        {
+          open,
+          value: selected.join(","),
+          onOpenChange: handleOnOpenChange,
+          onValueChange: multiselect ? void 0 : handleChange,
+          defaultValue: typeof defaultValue === "string" ? defaultValue : void 0,
+          dir: dir === "rtl" ? "rtl" : "ltr",
+          ...rest,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+              SelectPrimitive.Trigger,
+              {
+                ref,
+                "data-testid": `${label.toLowerCase()}-select-element`,
+                className: "group flex min-w-80 flex-row items-center justify-between gap-3 rounded-lg border border-grey-20 px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "truncate", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                    SelectPrimitive.Value,
+                    {
+                      placeholder: placeholder ?? "Select an option",
+                      "aria-label": handleLabels(),
+                      children: handleLabels()
+                    }
+                  ) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                    import_lucide_react.ChevronDownIcon,
+                    {
+                      className: "transform text-black group-data-[state=open]:rotate-180",
+                      size: "16"
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SelectPrimitive.Portal, { container: containerRef.current, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+              SelectPrimitive.Content,
+              {
+                hideWhenDetached: true,
+                className: "z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg",
+                position: "popper",
+                sideOffset: 4,
+                onPointerDownOutside: toggleOpen,
+                onKeyDown: closeOnEscape,
+                children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(SelectPrimitive.Viewport, { children: [
+                  multiselect && !!chipLabels?.length && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                    SelectPrimitive.Group,
+                    {
+                      className: "mb-2 flex flex-row flex-wrap gap-1 px-2",
+                      "data-testid": "selected-labels",
+                      children: chipLabels?.map(
+                        (chip) => chip && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Chip_default, { size: "small", variant: "primary", children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: chip.title }),
+                          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                            import_lucide_react.X,
+                            {
+                              size: 18,
+                              "data-testid": `chip-remove-${chip.value}`,
+                              className: "cursor-pointer",
+                              onClick: () => handleChange(chip.value)
+                            }
+                          )
+                        ] }, chip.title)
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Separator, {}),
+                  options?.map(({ id, title, value: value2 }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+                    SelectPrimitive.Item,
+                    {
+                      value: value2,
+                      className: "group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100",
+                      "data-state": selected.includes(value2) ? "checked" : "unchecked",
+                      onKeyDown: (e) => setValueOnEnter(e, value2),
+                      onClick: () => handleChange(value2),
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SelectPrimitive.ItemText, { children: title }),
+                        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                          import_lucide_react.CheckIcon,
+                          {
+                            className: "absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block",
+                            size: 16
+                          }
+                        )
+                      ]
+                    },
+                    id
+                  ))
+                ] })
+              }
+            ) })
+          ]
+        }
+      )
+    ] });
+  }
+);
+Select.displayName = "Select";
+var Select_default = Select;
 //# sourceMappingURL=Select.cjs.map

package/dist/components/ui/Select.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/Select.tsx","../../../src/lib/utils.ts","../../../src/components/ui/Label.tsx","../../../src/components/ui/Chip.tsx","../../../src/components/primitives/separator.tsx"],"sourcesContent":["'use client'\n\nimport * as SelectPrimitive from '@radix-ui/react-select'\nimport { CheckIcon, ChevronDownIcon, X } from 'lucide-react'\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type KeyboardEvent,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\n\nimport Label from '@/components/ui/Label'\nimport Chip from '@/components/ui/Chip'\nimport { Separator } from '@/components/primitives/separator'\nimport { cn } from '@/lib/utils'\n\ninterface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onChange'> {\n  label: string\n  value?: string | string[]\n  options?: { id: string | number; value: string; title: string }[]\n  placeholder?: string\n  multiselect?: boolean\n  onChange?: (value: string | string[]) => void\n  classNames?: { label?: string }\n}\n\nconst Select = forwardRef<HTMLButtonElement, Props>(\n  ({ label, options, placeholder, multiselect, classNames, ...props }, ref) => {\n    const { value, defaultValue, dir, className, onChange, ...rest } = props\n    const [selected, setSelected] = useState<string[]>([])\n    const [open, setOpen] = useState(false)\n    const containerRef = useRef<HTMLDivElement>(null)\n\n    useEffect(() => {\n      if (!value) return setSelected([])\n      setSelected(Array.isArray(value) ? value : [value])\n    }, [value])\n\n    const toggleOpen = () => setOpen((prev) => !prev)\n    const closeOnEscape = (event: KeyboardEvent) => event.key === 'Escape' && setOpen(false)\n    const setValueOnEnter = (event: KeyboardEvent, value: string) =>\n      event.key === 'Enter' && handleChange(value)\n\n    const chipLabels = selected\n      ?.map((s) => options?.find(({ value }) => value === s))\n      .filter(Boolean)\n\n    function handleLabels() {\n      if (multiselect) {\n        return selected.map((o) => options?.find((option) => option.value === o)?.title).join(', ')\n      }\n      return options?.find((option) => option.value === selected.join())?.title\n    }\n\n    function handleOnOpenChange(isOpen: boolean) {\n      if (!multiselect || isOpen) setOpen(isOpen)\n    }\n\n    function handleChange(newValue: string) {\n      let newSelected: string[] = []\n      setSelected((prev) => {\n        newSelected = prev.includes(newValue)\n          ? prev.filter((item) => item !== newValue)\n          : [...prev, newValue]\n        return multiselect ? newSelected : [newValue]\n      })\n      onChange?.(multiselect ? newSelected : newValue)\n    }\n\n    return (\n      <div className={cn('flex flex-col space-y-2', className)} ref={containerRef}>\n        <Label text={label} className={classNames?.label} />\n\n        <SelectPrimitive.Root\n          open={open}\n          value={selected.join(',')}\n          onOpenChange={handleOnOpenChange}\n          onValueChange={multiselect ? undefined : handleChange}\n          defaultValue={typeof defaultValue === 'string' ? defaultValue : undefined}\n          dir={dir === 'rtl' ? 'rtl' : 'ltr'}\n          {...rest}\n        >\n          <SelectPrimitive.Trigger\n            ref={ref}\n            data-testid={`${label.toLowerCase()}-select-element`}\n            className=\"group flex min-w-80 flex-row items-center justify-between gap-3 rounded-lg border border-grey-20 px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40\"\n          >\n            <span className=\"truncate\">\n              <SelectPrimitive.Value\n                placeholder={placeholder ?? 'Select an option'}\n                aria-label={handleLabels()}\n              >\n                {handleLabels()}\n              </SelectPrimitive.Value>\n            </span>\n\n            <ChevronDownIcon\n              className=\"transform text-black group-data-[state=open]:rotate-180\"\n              size=\"16\"\n            />\n          </SelectPrimitive.Trigger>\n\n          <SelectPrimitive.Portal container={containerRef.current}>\n            <SelectPrimitive.Content\n              hideWhenDetached\n              className=\"z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg\"\n              position=\"popper\"\n              sideOffset={4}\n              onPointerDownOutside={toggleOpen}\n              onKeyDown={closeOnEscape}\n            >\n              <SelectPrimitive.Viewport>\n                {multiselect && !!chipLabels?.length && (\n                  <SelectPrimitive.Group\n                    className=\"mb-2 flex flex-row flex-wrap gap-1 px-2\"\n                    data-testid=\"selected-labels\"\n                  >\n                    {chipLabels?.map(\n                      (chip) =>\n                        chip && (\n                          <Chip key={chip.title} size=\"small\" variant=\"primary\">\n                            <span>{chip.title}</span>\n                            <X\n                              size={18}\n                              data-testid={`chip-remove-${chip.value}`}\n                              className=\"cursor-pointer\"\n                              onClick={() => handleChange(chip.value)}\n                            />\n                          </Chip>\n                        )\n                    )}\n                  </SelectPrimitive.Group>\n                )}\n                <Separator />\n                {options?.map(({ id, title, value }) => (\n                  <SelectPrimitive.Item\n                    key={id}\n                    value={value}\n                    className=\"group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100\"\n                    data-state={selected.includes(value) ? 'checked' : 'unchecked'}\n                    onKeyDown={(e) => setValueOnEnter(e, value)}\n                    onClick={() => handleChange(value)}\n                  >\n                    <SelectPrimitive.ItemText>{title}</SelectPrimitive.ItemText>\n                    <CheckIcon\n                      className=\"absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block\"\n                      size={16}\n                    />\n                  </SelectPrimitive.Item>\n                ))}\n              </SelectPrimitive.Viewport>\n            </SelectPrimitive.Content>\n          </SelectPrimitive.Portal>\n        </SelectPrimitive.Root>\n      </div>\n    )\n  }\n)\n\nSelect.displayName = 'Select'\n\nexport default Select\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","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 { cva, type VariantProps } from 'cva'\nimport React from 'react'\nimport { twMerge } from 'tailwind-merge'\n\ninterface ChipProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof chipVariants> {}\n\nconst Chip = ({ className, variant, size, ...props }: ChipProps) => (\n  <div className={twMerge(chipVariants({ variant, size, className }))} {...props} />\n)\n\nconst chipVariants = cva(['flex', 'items-center', 'rounded-3xl', 'border', 'w-fit'], {\n  variants: {\n    variant: {\n      neutral: ['text-grey-80', 'border-grey-10'],\n      primary: ['text-purple-100', 'border-purple-20'],\n      danger: ['text-pumpkin-100', 'border-pumpkin-20'],\n      onboarding: ['text-green-100', 'bg-green-10', 'cursor-pointer'],\n      onboardingSelected: ['text-white', 'bg-green-90', 'cursor-pointer'],\n    },\n    size: {\n      small: ['text-sm', 'leading-5', 'px-2', 'py-1', 'gap-1.5'],\n      medium: ['text-base', 'leading-6', 'px-3', 'py-2', 'gap-2'],\n    },\n  },\n  defaultVariants: {\n    variant: 'neutral',\n    size: 'medium',\n  },\n})\n\nexport default Chip\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"],"mappings":"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","names":["Select_exports","__export","Select_default","__toCommonJS","SelectPrimitive","import_lucide_react","import_react","import_clsx","import_tailwind_merge","cn","inputs","import_jsx_runtime","Label","text","className","props","cn","Label_default","import_cva","import_tailwind_merge","import_jsx_runtime","Chip","className","variant","size","props","chipVariants","Chip_default","SeparatorPrimitive","React","import_jsx_runtime","Separator","className","orientation","decorative","props","ref","cn","import_jsx_runtime","Select","label","options","placeholder","multiselect","classNames","props","ref","value","defaultValue","dir","className","onChange","rest","selected","setSelected","open","setOpen","containerRef","toggleOpen","prev","closeOnEscape","event","setValueOnEnter","handleChange","chipLabels","s","handleLabels","o","option","handleOnOpenChange","isOpen","newValue","newSelected","item","cn","Label_default","chip","Chip_default","Separator","id","title","e","Select_default"]}
+{"version":3,"sources":["../../../src/components/ui/Select.tsx","../../../src/lib/utils.ts","../../../src/components/ui/Label.tsx","../../../src/components/ui/Chip.tsx","../../../src/components/primitives/separator.tsx"],"sourcesContent":["'use client'\n\nimport * as SelectPrimitive from '@radix-ui/react-select'\nimport { CheckIcon, ChevronDownIcon, X } from 'lucide-react'\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type KeyboardEvent,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\n\nimport Label from '@/components/ui/Label'\nimport Chip from '@/components/ui/Chip'\nimport { Separator } from '@/components/primitives/separator'\nimport { cn } from '@/lib/utils'\n\ninterface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onChange'> {\n  label: string\n  value?: string | string[]\n  options?: { id: string | number; value: string; title: string }[]\n  placeholder?: string\n  multiselect?: boolean\n  onChange?: (value: string | string[]) => void\n  classNames?: { label?: string }\n}\n\nconst Select = forwardRef<HTMLButtonElement, Props>(\n  ({ label, options, placeholder, multiselect, classNames, ...props }, ref) => {\n    const { value, defaultValue, dir, className, onChange, ...rest } = props\n    const [selected, setSelected] = useState<string[]>([])\n    const [open, setOpen] = useState(false)\n    const containerRef = useRef<HTMLDivElement>(null)\n\n    useEffect(() => {\n      if (!value) return setSelected([])\n      setSelected(Array.isArray(value) ? value : [value])\n    }, [value])\n\n    const toggleOpen = () => setOpen((prev) => !prev)\n    const closeOnEscape = (event: KeyboardEvent) => event.key === 'Escape' && setOpen(false)\n    const setValueOnEnter = (event: KeyboardEvent, value: string) =>\n      event.key === 'Enter' && handleChange(value)\n\n    const chipLabels = selected\n      ?.map((s) => options?.find(({ value }) => value === s))\n      .filter(Boolean)\n\n    function handleLabels() {\n      if (multiselect) {\n        return selected.map((o) => options?.find((option) => option.value === o)?.title).join(', ')\n      }\n      return options?.find((option) => option.value === selected.join())?.title\n    }\n\n    function handleOnOpenChange(isOpen: boolean) {\n      if (!multiselect || isOpen) setOpen(isOpen)\n    }\n\n    function handleChange(newValue: string) {\n      let newSelected: string[] = []\n      setSelected((prev) => {\n        newSelected = prev.includes(newValue)\n          ? prev.filter((item) => item !== newValue)\n          : [...prev, newValue]\n        return multiselect ? newSelected : [newValue]\n      })\n      onChange?.(multiselect ? newSelected : newValue)\n    }\n\n    return (\n      <div className={cn('flex flex-col space-y-2', className)} ref={containerRef}>\n        <Label text={label} className={classNames?.label} />\n\n        <SelectPrimitive.Root\n          open={open}\n          value={selected.join(',')}\n          onOpenChange={handleOnOpenChange}\n          onValueChange={multiselect ? undefined : handleChange}\n          defaultValue={typeof defaultValue === 'string' ? defaultValue : undefined}\n          dir={dir === 'rtl' ? 'rtl' : 'ltr'}\n          {...rest}\n        >\n          <SelectPrimitive.Trigger\n            ref={ref}\n            data-testid={`${label.toLowerCase()}-select-element`}\n            className=\"group flex min-w-80 flex-row items-center justify-between gap-3 rounded-lg border border-grey-20 px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40\"\n          >\n            <span className=\"truncate\">\n              <SelectPrimitive.Value\n                placeholder={placeholder ?? 'Select an option'}\n                aria-label={handleLabels()}\n              >\n                {handleLabels()}\n              </SelectPrimitive.Value>\n            </span>\n\n            <ChevronDownIcon\n              className=\"transform text-black group-data-[state=open]:rotate-180\"\n              size=\"16\"\n            />\n          </SelectPrimitive.Trigger>\n\n          <SelectPrimitive.Portal container={containerRef.current}>\n            <SelectPrimitive.Content\n              hideWhenDetached\n              className=\"z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg\"\n              position=\"popper\"\n              sideOffset={4}\n              onPointerDownOutside={toggleOpen}\n              onKeyDown={closeOnEscape}\n            >\n              <SelectPrimitive.Viewport>\n                {multiselect && !!chipLabels?.length && (\n                  <SelectPrimitive.Group\n                    className=\"mb-2 flex flex-row flex-wrap gap-1 px-2\"\n                    data-testid=\"selected-labels\"\n                  >\n                    {chipLabels?.map(\n                      (chip) =>\n                        chip && (\n                          <Chip key={chip.title} size=\"small\" variant=\"primary\">\n                            <span>{chip.title}</span>\n                            <X\n                              size={18}\n                              data-testid={`chip-remove-${chip.value}`}\n                              className=\"cursor-pointer\"\n                              onClick={() => handleChange(chip.value)}\n                            />\n                          </Chip>\n                        )\n                    )}\n                  </SelectPrimitive.Group>\n                )}\n                <Separator />\n                {options?.map(({ id, title, value }) => (\n                  <SelectPrimitive.Item\n                    key={id}\n                    value={value}\n                    className=\"group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100\"\n                    data-state={selected.includes(value) ? 'checked' : 'unchecked'}\n                    onKeyDown={(e) => setValueOnEnter(e, value)}\n                    onClick={() => handleChange(value)}\n                  >\n                    <SelectPrimitive.ItemText>{title}</SelectPrimitive.ItemText>\n                    <CheckIcon\n                      className=\"absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block\"\n                      size={16}\n                    />\n                  </SelectPrimitive.Item>\n                ))}\n              </SelectPrimitive.Viewport>\n            </SelectPrimitive.Content>\n          </SelectPrimitive.Portal>\n        </SelectPrimitive.Root>\n      </div>\n    )\n  }\n)\n\nSelect.displayName = 'Select'\n\nexport default Select\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","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 { cva, type VariantProps } from 'cva'\nimport React from 'react'\nimport { twMerge } from 'tailwind-merge'\n\ninterface ChipProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof chipVariants> {}\n\nconst Chip = ({ className, variant, size, ...props }: ChipProps) => (\n  <div className={twMerge(chipVariants({ variant, size, className }))} {...props} />\n)\n\nconst chipVariants = cva(['flex', 'items-center', 'rounded-3xl', 'border', 'w-fit'], {\n  variants: {\n    variant: {\n      neutral: ['text-grey-80', 'border-grey-10'],\n      primary: ['text-purple-100', 'border-purple-20'],\n      danger: ['text-pumpkin-100', 'border-pumpkin-20'],\n      onboarding: ['text-green-100', 'bg-green-10', 'cursor-pointer'],\n      onboardingSelected: ['text-white', 'bg-green-90', 'cursor-pointer'],\n    },\n    size: {\n      small: ['text-sm', 'leading-5', 'px-2', 'py-1', 'gap-1.5'],\n      medium: ['text-base', 'leading-6', 'px-3', 'py-2', 'gap-2'],\n    },\n  },\n  defaultVariants: {\n    variant: 'neutral',\n    size: 'medium',\n  },\n})\n\nexport default Chip\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"],"mappings":"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","names":["import_tailwind_merge","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","value"]}

package/dist/components/ui/Select.js

@@ -1,2 +1,222 @@
-"use client";import*as t from"@radix-ui/react-select";import{CheckIcon as Z,ChevronDownIcon as _,X as ee}from"lucide-react";import{forwardRef as te,useEffect as re,useRef as ae,useState as V}from"react";import{clsx as G}from"clsx";import{twMerge as $}from"tailwind-merge";function p(...a){return $(G(a))}import{jsx as j}from"react/jsx-runtime";function X({text:a,className:i,...s}){return a?j("label",{className:p("text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",i),...s,children:a}):null}var k=X;import{cva as q}from"cva";import{twMerge as F}from"tailwind-merge";import{jsx as U}from"react/jsx-runtime";var J=({className:a,variant:i,size:s,...n})=>U("div",{className:F(Q({variant:i,size:s,className:a})),...n}),Q=q(["flex","items-center","rounded-3xl","border","w-fit"],{variants:{variant:{neutral:["text-grey-80","border-grey-10"],primary:["text-purple-100","border-purple-20"],danger:["text-pumpkin-100","border-pumpkin-20"],onboarding:["text-green-100","bg-green-10","cursor-pointer"],onboardingSelected:["text-white","bg-green-90","cursor-pointer"]},size:{small:["text-sm","leading-5","px-2","py-1","gap-1.5"],medium:["text-base","leading-6","px-3","py-2","gap-2"]}},defaultVariants:{variant:"neutral",size:"medium"}}),N=J;import*as y from"@radix-ui/react-separator";import*as E from"react";import{jsx as Y}from"react/jsx-runtime";var P=E.forwardRef(({className:a,orientation:i="horizontal",decorative:s=!0,...n},v)=>Y(y.Root,{ref:v,decorative:s,orientation:i,className:p("shrink-0 bg-grey-10",i==="horizontal"?"h-[1px] w-full":"h-full w-[1px]",a),...n}));P.displayName=y.Root.displayName;import{jsx as r,jsxs as c}from"react/jsx-runtime";var z=te(({label:a,options:i,placeholder:s,multiselect:n,classNames:v,...L},O)=>{let{value:m,defaultValue:S,dir:T,className:D,onChange:I,...M}=L,[d,h]=V([]),[W,b]=V(!1),C=ae(null);re(()=>{if(!m)return h([]);h(Array.isArray(m)?m:[m])},[m]);let K=()=>b(e=>!e),H=e=>e.key==="Escape"&&b(!1),A=(e,o)=>e.key==="Enter"&&f(o),w=d?.map(e=>i?.find(({value:o})=>o===e)).filter(Boolean);function R(){return n?d.map(e=>i?.find(o=>o.value===e)?.title).join(", "):i?.find(e=>e.value===d.join())?.title}function B(e){(!n||e)&&b(e)}function f(e){let o=[];h(l=>(o=l.includes(e)?l.filter(x=>x!==e):[...l,e],n?o:[e])),I?.(n?o:e)}return c("div",{className:p("flex flex-col space-y-2",D),ref:C,children:[r(k,{text:a,className:v?.label}),c(t.Root,{open:W,value:d.join(","),onOpenChange:B,onValueChange:n?void 0:f,defaultValue:typeof S=="string"?S:void 0,dir:T==="rtl"?"rtl":"ltr",...M,children:[c(t.Trigger,{ref:O,"data-testid":`${a.toLowerCase()}-select-element`,className:"group flex min-w-80 flex-row items-center justify-between gap-3 rounded-lg border border-grey-20 px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40",children:[r("span",{className:"truncate",children:r(t.Value,{placeholder:s??"Select an option","aria-label":R(),children:R()})}),r(_,{className:"transform text-black group-data-[state=open]:rotate-180",size:"16"})]}),r(t.Portal,{container:C.current,children:r(t.Content,{hideWhenDetached:!0,className:"z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg",position:"popper",sideOffset:4,onPointerDownOutside:K,onKeyDown:H,children:c(t.Viewport,{children:[n&&!!w?.length&&r(t.Group,{className:"mb-2 flex flex-row flex-wrap gap-1 px-2","data-testid":"selected-labels",children:w?.map(e=>e&&c(N,{size:"small",variant:"primary",children:[r("span",{children:e.title}),r(ee,{size:18,"data-testid":`chip-remove-${e.value}`,className:"cursor-pointer",onClick:()=>f(e.value)})]},e.title))}),r(P,{}),i?.map(({id:e,title:o,value:l})=>c(t.Item,{value:l,className:"group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100","data-state":d.includes(l)?"checked":"unchecked",onKeyDown:x=>A(x,l),onClick:()=>f(l),children:[r(t.ItemText,{children:o}),r(Z,{className:"absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block",size:16})]},e))]})})})]})]})});z.displayName="Select";var Ne=z;export{Ne as default};
+"use client";
+
+// src/components/ui/Select.tsx
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { CheckIcon, ChevronDownIcon, X } from "lucide-react";
+import {
+  forwardRef as forwardRef2,
+  useEffect,
+  useRef,
+  useState
+} from "react";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/ui/Label.tsx
+import { jsx } from "react/jsx-runtime";
+function Label({ text, className, ...props }) {
+  if (!text) return null;
+  return /* @__PURE__ */ jsx(
+    "label",
+    {
+      className: cn(
+        "text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+        className
+      ),
+      ...props,
+      children: text
+    }
+  );
+}
+var Label_default = Label;
+
+// src/components/ui/Chip.tsx
+import { cva } from "cva";
+import { twMerge as twMerge2 } from "tailwind-merge";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Chip = ({ className, variant, size, ...props }) => /* @__PURE__ */ jsx2("div", { className: twMerge2(chipVariants({ variant, size, className })), ...props });
+var chipVariants = cva(["flex", "items-center", "rounded-3xl", "border", "w-fit"], {
+  variants: {
+    variant: {
+      neutral: ["text-grey-80", "border-grey-10"],
+      primary: ["text-purple-100", "border-purple-20"],
+      danger: ["text-pumpkin-100", "border-pumpkin-20"],
+      onboarding: ["text-green-100", "bg-green-10", "cursor-pointer"],
+      onboardingSelected: ["text-white", "bg-green-90", "cursor-pointer"]
+    },
+    size: {
+      small: ["text-sm", "leading-5", "px-2", "py-1", "gap-1.5"],
+      medium: ["text-base", "leading-6", "px-3", "py-2", "gap-2"]
+    }
+  },
+  defaultVariants: {
+    variant: "neutral",
+    size: "medium"
+  }
+});
+var Chip_default = Chip;
+
+// src/components/primitives/separator.tsx
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import * as React from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Separator = React.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx3(
+  SeparatorPrimitive.Root,
+  {
+    ref,
+    decorative,
+    orientation,
+    className: cn(
+      "shrink-0 bg-grey-10",
+      orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+      className
+    ),
+    ...props
+  }
+));
+Separator.displayName = SeparatorPrimitive.Root.displayName;
+
+// src/components/ui/Select.tsx
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
+var Select = forwardRef2(
+  ({ label, options, placeholder, multiselect, classNames, ...props }, ref) => {
+    const { value, defaultValue, dir, className, onChange, ...rest } = props;
+    const [selected, setSelected] = useState([]);
+    const [open, setOpen] = useState(false);
+    const containerRef = useRef(null);
+    useEffect(() => {
+      if (!value) return setSelected([]);
+      setSelected(Array.isArray(value) ? value : [value]);
+    }, [value]);
+    const toggleOpen = () => setOpen((prev) => !prev);
+    const closeOnEscape = (event) => event.key === "Escape" && setOpen(false);
+    const setValueOnEnter = (event, value2) => event.key === "Enter" && handleChange(value2);
+    const chipLabels = selected?.map((s) => options?.find(({ value: value2 }) => value2 === s)).filter(Boolean);
+    function handleLabels() {
+      if (multiselect) {
+        return selected.map((o) => options?.find((option) => option.value === o)?.title).join(", ");
+      }
+      return options?.find((option) => option.value === selected.join())?.title;
+    }
+    function handleOnOpenChange(isOpen) {
+      if (!multiselect || isOpen) setOpen(isOpen);
+    }
+    function handleChange(newValue) {
+      let newSelected = [];
+      setSelected((prev) => {
+        newSelected = prev.includes(newValue) ? prev.filter((item) => item !== newValue) : [...prev, newValue];
+        return multiselect ? newSelected : [newValue];
+      });
+      onChange?.(multiselect ? newSelected : newValue);
+    }
+    return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col space-y-2", className), ref: containerRef, children: [
+      /* @__PURE__ */ jsx4(Label_default, { text: label, className: classNames?.label }),
+      /* @__PURE__ */ jsxs(
+        SelectPrimitive.Root,
+        {
+          open,
+          value: selected.join(","),
+          onOpenChange: handleOnOpenChange,
+          onValueChange: multiselect ? void 0 : handleChange,
+          defaultValue: typeof defaultValue === "string" ? defaultValue : void 0,
+          dir: dir === "rtl" ? "rtl" : "ltr",
+          ...rest,
+          children: [
+            /* @__PURE__ */ jsxs(
+              SelectPrimitive.Trigger,
+              {
+                ref,
+                "data-testid": `${label.toLowerCase()}-select-element`,
+                className: "group flex min-w-80 flex-row items-center justify-between gap-3 rounded-lg border border-grey-20 px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40",
+                children: [
+                  /* @__PURE__ */ jsx4("span", { className: "truncate", children: /* @__PURE__ */ jsx4(
+                    SelectPrimitive.Value,
+                    {
+                      placeholder: placeholder ?? "Select an option",
+                      "aria-label": handleLabels(),
+                      children: handleLabels()
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx4(
+                    ChevronDownIcon,
+                    {
+                      className: "transform text-black group-data-[state=open]:rotate-180",
+                      size: "16"
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx4(SelectPrimitive.Portal, { container: containerRef.current, children: /* @__PURE__ */ jsx4(
+              SelectPrimitive.Content,
+              {
+                hideWhenDetached: true,
+                className: "z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg",
+                position: "popper",
+                sideOffset: 4,
+                onPointerDownOutside: toggleOpen,
+                onKeyDown: closeOnEscape,
+                children: /* @__PURE__ */ jsxs(SelectPrimitive.Viewport, { children: [
+                  multiselect && !!chipLabels?.length && /* @__PURE__ */ jsx4(
+                    SelectPrimitive.Group,
+                    {
+                      className: "mb-2 flex flex-row flex-wrap gap-1 px-2",
+                      "data-testid": "selected-labels",
+                      children: chipLabels?.map(
+                        (chip) => chip && /* @__PURE__ */ jsxs(Chip_default, { size: "small", variant: "primary", children: [
+                          /* @__PURE__ */ jsx4("span", { children: chip.title }),
+                          /* @__PURE__ */ jsx4(
+                            X,
+                            {
+                              size: 18,
+                              "data-testid": `chip-remove-${chip.value}`,
+                              className: "cursor-pointer",
+                              onClick: () => handleChange(chip.value)
+                            }
+                          )
+                        ] }, chip.title)
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsx4(Separator, {}),
+                  options?.map(({ id, title, value: value2 }) => /* @__PURE__ */ jsxs(
+                    SelectPrimitive.Item,
+                    {
+                      value: value2,
+                      className: "group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100",
+                      "data-state": selected.includes(value2) ? "checked" : "unchecked",
+                      onKeyDown: (e) => setValueOnEnter(e, value2),
+                      onClick: () => handleChange(value2),
+                      children: [
+                        /* @__PURE__ */ jsx4(SelectPrimitive.ItemText, { children: title }),
+                        /* @__PURE__ */ jsx4(
+                          CheckIcon,
+                          {
+                            className: "absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block",
+                            size: 16
+                          }
+                        )
+                      ]
+                    },
+                    id
+                  ))
+                ] })
+              }
+            ) })
+          ]
+        }
+      )
+    ] });
+  }
+);
+Select.displayName = "Select";
+var Select_default = Select;
+export {
+  Select_default as default
+};
 //# sourceMappingURL=Select.js.map