@xploreu/components 0.4.42 → 0.4.44
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/chunk-A5644ETE.js +2 -0
- package/dist/chunk-A5644ETE.js.map +1 -0
- package/dist/chunk-DL6MI55G.js +2 -0
- package/dist/chunk-DL6MI55G.js.map +1 -0
- package/dist/chunk-DNAWFZ7O.js +2 -0
- package/dist/chunk-DNAWFZ7O.js.map +1 -0
- package/dist/{chunk-YB74L6RO.js → chunk-H6ETV455.js} +2 -2
- package/dist/{chunk-YB74L6RO.js.map → chunk-H6ETV455.js.map} +1 -1
- package/dist/{chunk-IT4LPPTN.js → chunk-HGLHAEGH.js} +2 -2
- package/dist/{chunk-IT4LPPTN.js.map → chunk-HGLHAEGH.js.map} +1 -1
- package/dist/chunk-MO7LQLS4.js +2 -0
- package/dist/chunk-MO7LQLS4.js.map +1 -0
- package/dist/chunk-OHLNKXSV.js +2 -0
- package/dist/chunk-OHLNKXSV.js.map +1 -0
- package/dist/{chunk-WV5OCKQK.js → chunk-RAVBRPQS.js} +2 -2
- package/dist/{chunk-WV5OCKQK.js.map → chunk-RAVBRPQS.js.map} +1 -1
- package/dist/{chunk-IZQFTYJD.js → chunk-RHWRIE3E.js} +2 -2
- package/dist/{chunk-IZQFTYJD.js.map → chunk-RHWRIE3E.js.map} +1 -1
- package/dist/{chunk-VHPUQQ6L.js → chunk-V2PW53KI.js} +2 -2
- package/dist/{chunk-VHPUQQ6L.js.map → chunk-V2PW53KI.js.map} +1 -1
- package/dist/chunk-VIBM666E.js +2 -0
- package/dist/chunk-VIBM666E.js.map +1 -0
- package/dist/{chunk-CDHMNEJ5.js → chunk-WN22TTEL.js} +2 -2
- package/dist/{chunk-CDHMNEJ5.js.map → chunk-WN22TTEL.js.map} +1 -1
- package/dist/{chunk-UR3YD2QR.js → chunk-XZN4XT6V.js} +2 -2
- package/dist/chunk-XZN4XT6V.js.map +1 -0
- package/dist/chunk-Y6TKCAAJ.js +2 -0
- package/dist/chunk-Y6TKCAAJ.js.map +1 -0
- package/dist/{chunk-ON7PUZWI.js → chunk-YNJZ2P52.js} +2 -2
- package/dist/{chunk-ON7PUZWI.js.map → chunk-YNJZ2P52.js.map} +1 -1
- package/dist/composites/combobox-chip-outside.js +1 -1
- package/dist/composites/combobox-chip.js +1 -1
- package/dist/composites/combobox-simple.js +1 -1
- package/dist/composites/filter-combobox.js +1 -1
- package/dist/composites/index.js +1 -1
- package/dist/composites/phone-input.js +1 -1
- package/dist/form/form-input.d.ts +3 -3
- package/dist/form/form-input.js +1 -1
- package/dist/form/form-textarea.d.ts +5 -3
- package/dist/form/form-textarea.js +1 -1
- package/dist/form/form.d.ts +1 -1
- package/dist/form/form.js +1 -1
- package/dist/form/index.js +1 -1
- package/dist/ui/button.d.ts +2 -2
- package/dist/ui/combobox.js +1 -1
- package/dist/ui/index.d.ts +1 -1
- package/dist/ui/index.js +1 -1
- package/dist/ui/input.d.ts +1 -1
- package/dist/ui/input.js +1 -1
- package/dist/ui/label.d.ts +2 -2
- package/dist/ui/label.js +1 -1
- package/dist/ui/pagination.js +1 -1
- package/dist/ui/tabs.js +1 -1
- package/dist/ui/textarea.d.ts +7 -2
- package/dist/ui/textarea.js +1 -1
- package/package.json +1 -1
- package/dist/chunk-3ASGRRVT.js +0 -2
- package/dist/chunk-3ASGRRVT.js.map +0 -1
- package/dist/chunk-4PIKXPNO.js +0 -2
- package/dist/chunk-4PIKXPNO.js.map +0 -1
- package/dist/chunk-G6HDEOYZ.js +0 -2
- package/dist/chunk-G6HDEOYZ.js.map +0 -1
- package/dist/chunk-JH6RZ3QH.js +0 -2
- package/dist/chunk-JH6RZ3QH.js.map +0 -1
- package/dist/chunk-K2BMQ2TN.js +0 -2
- package/dist/chunk-K2BMQ2TN.js.map +0 -1
- package/dist/chunk-K7GGFR7W.js +0 -2
- package/dist/chunk-K7GGFR7W.js.map +0 -1
- package/dist/chunk-PJYKUR4F.js +0 -2
- package/dist/chunk-PJYKUR4F.js.map +0 -1
- package/dist/chunk-UR3YD2QR.js.map +0 -1
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import {b as b$1}from'./chunk-DL6MI55G.js';import {b,d,e,f,g,h}from'./chunk-OHLNKXSV.js';import'react';import {jsx,jsxs}from'react/jsx-runtime';function C({name:p,label:t,control:F,rules:d$1,description:T,size:r,className:c,classNameTextarea:u,...x}){return jsx(b,{control:F,name:p,rules:d$1,render:({field:P})=>jsxs(d,{className:c,children:[t&&jsx(e,{size:r,children:t}),jsx(f,{children:jsx(b$1,{className:u,size:r,...x,...P})}),jsx(g,{size:r,children:T}),jsx(h,{size:r})]})})}export{C as a};//# sourceMappingURL=chunk-A5644ETE.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-A5644ETE.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/form/form-textarea.tsx"],"names":["FormTextarea","name","label","control","rules","description","size","className","classNameTextarea","props","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","Textarea","FormDescription","FormMessage"],"mappings":"gJAmCA,SAASA,CAAAA,CAAsF,CAC7F,KAAAC,CAAAA,CACA,KAAA,CAAAC,EACA,OAAA,CAAAC,CAAAA,CACA,MAAAC,GAAAA,CACA,WAAA,CAAAC,EACA,IAAA,CAAAC,CAAAA,CACA,UAAAC,CAAAA,CACA,iBAAA,CAAAC,EACA,GAAGC,CACL,EAA2C,CACzC,OACEC,IAACC,CAAAA,CAAA,CACC,QAASR,CAAAA,CACT,IAAA,CAAMF,EACN,KAAA,CAAOG,GAAAA,CACP,OAAQ,CAAC,CAAE,MAAAQ,CAAM,CAAA,GAEbC,KAACC,CAAAA,CAAA,CAAS,UAAWP,CAAAA,CAClB,QAAA,CAAA,CAAAL,GACCQ,GAAAA,CAACK,CAAAA,CAAA,CAAU,IAAA,CAAMT,CAAAA,CACd,SAAAJ,CAAAA,CACH,CAAA,CAEFQ,IAACM,CAAAA,CAAA,CACC,SAAAN,GAAAA,CAACO,GAAAA,CAAA,CACC,SAAA,CAAWT,CAAAA,CACX,KAAMF,CAAAA,CACL,GAAGG,EACH,GAAGG,CAAAA,CACN,EACF,CAAA,CACAF,GAAAA,CAACQ,EAAA,CAAgB,IAAA,CAAMZ,EACpB,QAAA,CAAAD,CAAAA,CACH,EACAK,GAAAA,CAACS,CAAAA,CAAA,CAAY,IAAA,CAAMb,CAAAA,CAAM,CAAA,CAAA,CAC3B,CAAA,CAGN,CAEJ","file":"chunk-A5644ETE.js","sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport type {\r\n ControllerRenderProps,\r\n FieldPath,\r\n FieldValues,\r\n UseControllerProps\r\n} from \"react-hook-form\"\r\n\r\nimport {\r\n FormControl,\r\n FormDescription,\r\n FormField,\r\n FormItem,\r\n FormLabel,\r\n FormMessage,\r\n} from \"./form\"\r\nimport { Textarea, type textareaVariants } from \"../ui/textarea\"\r\nimport type { VariantProps } from \"class-variance-authority\"\r\n\r\ntype FormTextareaProps<\r\n TFieldValues extends FieldValues,\r\n TName extends FieldPath<TFieldValues>\r\n> = {\r\n label?: string;\r\n description?: string;\r\n placeholder?: string;\r\n type?: React.HTMLInputTypeAttribute;\r\n className?: string;\r\n classNameTextarea?: string;\r\n size?: VariantProps<typeof textareaVariants>[\"size\"];\r\n} & Pick<UseControllerProps<TFieldValues, TName>, \"name\" | \"control\" | \"rules\">\r\n & Omit<React.ComponentProps<typeof Textarea>, keyof ControllerRenderProps | \"size\">\r\n\r\nfunction FormTextarea<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({\r\n name,\r\n label,\r\n control,\r\n rules,\r\n description,\r\n size,\r\n className,\r\n classNameTextarea,\r\n ...props\r\n}: FormTextareaProps<TFieldValues, TName>) {\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n rules={rules}\r\n render={({ field }) => {\r\n return (\r\n <FormItem className={className}>\r\n {label && (\r\n <FormLabel size={size}>\r\n {label}\r\n </FormLabel>\r\n )}\r\n <FormControl>\r\n <Textarea\r\n className={classNameTextarea}\r\n size={size}\r\n {...props}\r\n {...field}\r\n />\r\n </FormControl>\r\n <FormDescription size={size}>\r\n {description}\r\n </FormDescription>\r\n <FormMessage size={size} />\r\n </FormItem>\r\n )\r\n }}\r\n />\r\n )\r\n}\r\n\r\nexport { FormTextarea }\r\nexport type { FormTextareaProps }\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import'react';import {cva}from'class-variance-authority';import {cn}from'@xploreu/lib/cn';import {jsx}from'react/jsx-runtime';var i=cva("border-border-primary placeholder:text-text-placeholder focus-visible:border-border-brand focus-visible:ring-2 focus-visible:ring-border-brand/20 aria-invalid:border-content-on-error-subtle-action flex w-full rounded-xp-card-base border bg-bg-primary transition-[color,box-shadow,border] outline-none disabled:cursor-not-allowed disabled:bg-bg-disabled disabled:text-text-disabled",{variants:{size:{"3xs":"min-h-10 p-1.5 text-label-regular-4","2xs":"min-h-12 p-2 text-label-regular-4",xs:"min-h-14 p-2 text-body-regular-3",sm:"min-h-16 p-2.5 text-body-regular-3",md:"min-h-20 p-3 text-body-regular-2",lg:"min-h-24 p-3.5 text-body-regular-2",xl:"min-h-28 p-4 text-body-regular-2"}},defaultVariants:{size:"md"}});function b({className:r,size:e,...a}){return jsx("textarea",{className:cn(i({size:e}),r),"data-slot":"textarea",...a})}export{i as a,b};//# sourceMappingURL=chunk-DL6MI55G.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-DL6MI55G.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/ui/textarea.tsx"],"names":["textareaVariants","cva","Textarea","className","size","props","jsx","cn"],"mappings":"8HAKA,IAAMA,CAAAA,CAAmBC,IACvB,8XAAA,CACA,CACE,QAAA,CAAU,CACR,IAAA,CAAM,CACJ,KAAA,CAAO,qCAAA,CACP,MAAO,mCAAA,CACP,EAAA,CAAI,kCAAA,CACJ,EAAA,CAAI,qCACJ,EAAA,CAAI,kCAAA,CACJ,EAAA,CAAI,oCAAA,CACJ,GAAI,kCACN,CACF,CAAA,CACA,eAAA,CAAiB,CACf,IAAA,CAAM,IACR,CACF,CACF,EAEA,SAASC,CAAAA,CAAS,CAChB,UAAAC,CAAAA,CACA,IAAA,CAAAC,CAAAA,CACA,GAAGC,CACL,CAAA,CAA6E,CAC3E,OACEC,GAAAA,CAAC,UAAA,CAAA,CACC,SAAA,CAAWC,EAAAA,CAAGP,CAAAA,CAAiB,CAAE,IAAA,CAAAI,CAAK,CAAC,CAAA,CAAGD,CAAS,CAAA,CACnD,WAAA,CAAU,UAAA,CACT,GAAGE,EACN,CAEJ","file":"chunk-DL6MI55G.js","sourcesContent":["import * as React from \"react\"\r\nimport { cva, type VariantProps } from \"class-variance-authority\"\r\n\r\nimport { cn } from \"@xploreu/lib/cn\"\r\n\r\nconst textareaVariants = cva(\r\n \"border-border-primary placeholder:text-text-placeholder focus-visible:border-border-brand focus-visible:ring-2 focus-visible:ring-border-brand/20 aria-invalid:border-content-on-error-subtle-action flex w-full rounded-xp-card-base border bg-bg-primary transition-[color,box-shadow,border] outline-none disabled:cursor-not-allowed disabled:bg-bg-disabled disabled:text-text-disabled\",\r\n {\r\n variants: {\r\n size: {\r\n \"3xs\": \"min-h-10 p-1.5 text-label-regular-4\",\r\n \"2xs\": \"min-h-12 p-2 text-label-regular-4\",\r\n xs: \"min-h-14 p-2 text-body-regular-3\",\r\n sm: \"min-h-16 p-2.5 text-body-regular-3\",\r\n md: \"min-h-20 p-3 text-body-regular-2\",\r\n lg: \"min-h-24 p-3.5 text-body-regular-2\",\r\n xl: \"min-h-28 p-4 text-body-regular-2\",\r\n },\r\n },\r\n defaultVariants: {\r\n size: \"md\",\r\n },\r\n }\r\n)\r\n\r\nfunction Textarea({\r\n className,\r\n size,\r\n ...props\r\n}: React.ComponentProps<\"textarea\"> & VariantProps<typeof textareaVariants>) {\r\n return (\r\n <textarea\r\n className={cn(textareaVariants({ size }), className)}\r\n data-slot=\"textarea\"\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nexport { Textarea, textareaVariants }\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import*as t from'react';import*as e from'@radix-ui/react-label';import {cva}from'class-variance-authority';import {cn}from'@xploreu/lib/cn';import {jsx}from'react/jsx-runtime';var m=cva("text-text-primary peer-disabled:cursor-not-allowed peer-disabled:opacity-70",{variants:{size:{"3xs":"text-label-semibold-4","2xs":"text-label-semibold-4",xs:"text-label-semibold-3",sm:"text-label-semibold-3",md:"text-label-semibold-2",lg:"text-label-semibold-1",xl:"text-label-semibold-1"}},defaultVariants:{size:"md"}}),b=t.forwardRef(({className:a,size:l,...i},o)=>jsx(e.Root,{ref:o,className:cn(m({size:l}),a),...i}));b.displayName=e.Root.displayName;export{m as a,b};//# sourceMappingURL=chunk-DNAWFZ7O.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-DNAWFZ7O.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/ui/label.tsx"],"names":["labelVariants","cva","Label","className","size","props","ref","jsx","cn"],"mappings":"oLAQMA,CAAAA,CAAgBC,GAAAA,CACpB,6EAAA,CACA,CACE,SAAU,CACR,IAAA,CAAM,CACJ,KAAA,CAAO,wBACP,KAAA,CAAO,uBAAA,CACP,EAAA,CAAI,uBAAA,CACJ,GAAI,uBAAA,CACJ,EAAA,CAAI,wBACJ,EAAA,CAAI,uBAAA,CACJ,GAAI,uBACN,CACF,CAAA,CACA,eAAA,CAAiB,CACf,IAAA,CAAM,IACR,CACF,CACF,EAEMC,CAAAA,CAAc,CAAA,CAAA,UAAA,CAIlB,CAAC,CAAE,UAAAC,CAAAA,CAAW,IAAA,CAAAC,EAAM,GAAGC,CAAM,EAAGC,CAAAA,GAChCC,GAAAA,CAAgB,CAAA,CAAA,IAAA,CAAf,CACC,IAAKD,CAAAA,CACL,SAAA,CAAWE,GAAGR,CAAAA,CAAc,CAAE,KAAAI,CAAK,CAAC,CAAA,CAAGD,CAAS,EAC/C,GAAGE,CAAAA,CACN,CACD,EACDH,CAAAA,CAAM,YAA6B,CAAA,CAAA,IAAA,CAAK,WAAA","file":"chunk-DNAWFZ7O.js","sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\r\nimport { cva, type VariantProps } from \"class-variance-authority\"\r\n\r\nimport { cn } from \"@xploreu/lib/cn\"\r\n\r\nconst labelVariants = cva(\r\n \"text-text-primary peer-disabled:cursor-not-allowed peer-disabled:opacity-70\",\r\n {\r\n variants: {\r\n size: {\r\n \"3xs\": \"text-label-semibold-4\",\r\n \"2xs\": \"text-label-semibold-4\",\r\n xs: \"text-label-semibold-3\",\r\n sm: \"text-label-semibold-3\",\r\n md: \"text-label-semibold-2\",\r\n lg: \"text-label-semibold-1\",\r\n xl: \"text-label-semibold-1\",\r\n },\r\n },\r\n defaultVariants: {\r\n size: \"md\",\r\n },\r\n }\r\n)\r\n\r\nconst Label = React.forwardRef<\r\n React.ElementRef<typeof LabelPrimitive.Root>,\r\n React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &\r\n VariantProps<typeof labelVariants>\r\n>(({ className, size, ...props }, ref) => (\r\n <LabelPrimitive.Root\r\n ref={ref}\r\n className={cn(labelVariants({ size }), className)}\r\n {...props}\r\n />\r\n))\r\nLabel.displayName = LabelPrimitive.Root.displayName\r\n\r\nexport { Label, labelVariants }\r\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {a as a$1,b,m,e,q,s,w}from'./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import {a as a$1,b,m,e,q,s,w}from'./chunk-RHWRIE3E.js';import {a}from'./chunk-Y6TKCAAJ.js';import*as t from'react';import*as C from'react-phone-number-input';import Y from'react-phone-number-input/flags';import {cn}from'@xploreu/lib/cn';import'@base-ui/react/combobox';import {ChevronsUpDownIcon}from'lucide-react';import {jsx,jsxs}from'react/jsx-runtime';var R=({country:l,countryName:o})=>{let s=l?Y[l]:void 0;return jsx("span",{className:"flex h-4 w-6 shrink-0 overflow-hidden rounded-sm bg-fg-quaternary/20 [&_svg:not([class*='size-'])]:size-full",children:s&&jsx(s,{title:o})})},d=44,k=288,H=6;function D({disabled:l,value:o,options:s$1,onChange:i}){let[c,r]=t.useState(false),[b$1,g]=t.useState(""),[y,N]=t.useState(0),v=t.useRef(null),m$1=t.useMemo(()=>s$1.filter(e=>!!e.value),[s$1]),u=t.useMemo(()=>{let e=b$1.trim().toLowerCase();return e?m$1.filter(a=>{let f=C.getCountryCallingCode(a.value);return a.label.toLowerCase().includes(e)||a.value.toLowerCase().includes(e)||f.includes(e.replace(/^\+/,""))}):m$1},[b$1,m$1]),_=t.useMemo(()=>m$1.find(e=>e.value===o)??null,[m$1,o]);t.useEffect(()=>{N(0),v.current&&(v.current.scrollTop=0);},[b$1]);let z=Math.min(u.length*d,k),h=t.useMemo(()=>{let e=Math.floor(y/d),a=Math.max(0,e-H),f=Math.ceil(k/d),P=Math.min(u.length,e+f+H);return {startIndex:a,endIndex:P,items:u.slice(a,P)}},[u,y]),F=h.startIndex*d,U=Math.max(0,(u.length-h.endIndex)*d),q$1=t.useCallback(e=>{e?.value&&(i(e.value),g(""),r(false));},[i]);return jsxs(a$1,{behavior:"default",disabled:l,inputValue:b$1,items:u,open:c,value:_,virtualized:true,filter:null,isItemEqualToValue:(e,a)=>e.value===a.value,openOnInputClick:false,onValueChange:q$1,onInputValueChange:g,onOpenChange:e=>{r(e),e||g("");},children:[jsx(b,{render:jsxs("button",{type:"button",className:cn(a(),"h-11 w-18 shrink-0 justify-between gap-1 rounded-r-none border-r-0 px-3","hover:bg-bg-primary-hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-brand","disabled:pointer-events-none disabled:opacity-50"),disabled:l,children:[jsxs("span",{className:"flex items-center gap-1.5 overflow-hidden",children:[jsx(R,{country:o,countryName:o}),o&&jsx("span",{className:"text-body-medium-3 text-text-primary",children:o})]}),jsx(ChevronsUpDownIcon,{className:"size-3.5 shrink-0 text-fg-quaternary"})]})}),jsxs(m,{className:"w-72",children:[jsx(e,{placeholder:"Search country...","aria-label":"Search country"}),jsx(q,{status:u.length===0?"empty":null}),jsx(s,{ref:v,className:"relative gap-0",style:{height:z},onScroll:e=>N(e.currentTarget.scrollTop),children:jsx("div",{className:"flex w-full shrink-0 flex-col",style:{paddingTop:F,paddingBottom:U},children:h.items.map((e,a)=>{let f=h.startIndex+a;return jsx(w,{index:f,value:e,children:jsxs("div",{className:"flex items-center gap-2 w-full min-w-0",children:[jsx(R,{country:e.value,countryName:e.label}),jsx("span",{className:"flex-1 text-sm truncate",children:e.label}),jsxs("span",{className:"text-sm text-text-tertiary shrink-0",children:["+",C.getCountryCallingCode(e.value)]})]})},e.value)})})})]})]})}var L=t.forwardRef(({className:l,onChange:o,...s},i)=>{let c=t.useCallback(r=>{r.currentTarget.value==="+"&&(r.currentTarget.value=""),o?.(r);},[o]);return jsx("input",{className:cn(a(),"h-11 flex-1 rounded-l-none text-body-regular-2",l),ref:i,type:"tel",onChange:c,...s})});L.displayName="InputComponent";var G=t.forwardRef(({className:l,onChange:o,value:s,...i},c)=>jsx(C.default,{ref:c,className:cn("flex w-full min-w-0 items-center",l),flagComponent:R,countrySelectComponent:D,inputComponent:L,smartCaret:false,value:s||void 0,onChange:r=>o?.(r||""),...i}));G.displayName="PhoneInput";export{G as a};//# sourceMappingURL=chunk-H6ETV455.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-H6ETV455.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/composites/phone-input.tsx"],"names":["FlagComponent","country","countryName","Flag","flags","jsx","COUNTRY_ROW_HEIGHT","COUNTRY_LIST_HEIGHT","COUNTRY_OVERSCAN","CountrySelect","disabled","selectedCountry","countryList","onChange","open","setOpen","inputValue","setInputValue","scrollTop","setScrollTop","listRef","items","item","filteredItems","search","callingCode","value","listHeight","virtualRange","visibleStartIndex","startIndex","visibleCount","endIndex","paddingTop","paddingBottom","handleValueChange","jsxs","Combobox","a","b","ComboboxTrigger","cn","inputVariants","ChevronsUpDownIcon","ComboboxPopup","ComboboxInput","ComboboxStatus","ComboboxList","event","virtualIndex","index","ComboboxItem","InputComponent","className","props","ref","handleChange","PhoneInput"],"mappings":"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","file":"chunk-YB74L6RO.js","sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as RPNInput from \"react-phone-number-input\"\r\nimport flags from \"react-phone-number-input/flags\"\r\n\r\nimport { cn } from \"@xploreu/lib/cn\"\r\nimport { Combobox as ComboboxPrimitive } from \"@base-ui/react/combobox\"\r\nimport {\r\n Combobox,\r\n ComboboxInput,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxPopup,\r\n ComboboxStatus,\r\n ComboboxTrigger,\r\n} from \"../ui/combobox\"\r\nimport { inputVariants } from \"../ui/input\"\r\nimport { ChevronsUpDownIcon } from \"lucide-react\"\r\n\r\n// ---------------------------------------------------------------------------\r\n// Types\r\n// ---------------------------------------------------------------------------\r\n\r\ntype PhoneInputProps = Omit<\r\n React.ComponentProps<\"input\">,\r\n \"onChange\" | \"value\" | \"ref\"\r\n> &\r\n Omit<RPNInput.Props<typeof RPNInput.default>, \"onChange\"> & {\r\n onChange?: (value: RPNInput.Value) => void\r\n }\r\n\r\n// ---------------------------------------------------------------------------\r\n// Flag\r\n// ---------------------------------------------------------------------------\r\n\r\nconst FlagComponent = ({ country, countryName }: RPNInput.FlagProps) => {\r\n const Flag = country ? flags[country] : undefined\r\n\r\n return (\r\n <span className=\"flex h-4 w-6 shrink-0 overflow-hidden rounded-sm bg-fg-quaternary/20 [&_svg:not([class*='size-'])]:size-full\">\r\n {Flag && <Flag title={countryName} />}\r\n </span>\r\n )\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Country Select — uses base-ui Combobox\r\n// ---------------------------------------------------------------------------\r\n\r\ntype CountryEntry = { label: string; value: RPNInput.Country | undefined }\r\ntype CountryItem = { label: string; value: RPNInput.Country }\r\n\r\nconst COUNTRY_ROW_HEIGHT = 44\r\nconst COUNTRY_LIST_HEIGHT = 288\r\nconst COUNTRY_OVERSCAN = 6\r\n\r\ntype CountrySelectProps = {\r\n disabled?: boolean\r\n value: RPNInput.Country\r\n options: CountryEntry[]\r\n onChange: (country: RPNInput.Country) => void\r\n}\r\n\r\nfunction CountrySelect({\r\n disabled,\r\n value: selectedCountry,\r\n options: countryList,\r\n onChange,\r\n}: CountrySelectProps) {\r\n const [open, setOpen] = React.useState(false)\r\n const [inputValue, setInputValue] = React.useState(\"\")\r\n const [scrollTop, setScrollTop] = React.useState(0)\r\n const listRef = React.useRef<HTMLDivElement>(null)\r\n\r\n const items = React.useMemo(\r\n () => countryList.filter((item): item is CountryItem => Boolean(item.value)),\r\n [countryList]\r\n )\r\n\r\n const filteredItems = React.useMemo(() => {\r\n const search = inputValue.trim().toLowerCase()\r\n\r\n if (!search) return items\r\n\r\n return items.filter((item) => {\r\n const callingCode = RPNInput.getCountryCallingCode(item.value)\r\n\r\n return item.label.toLowerCase().includes(search)\r\n || item.value.toLowerCase().includes(search)\r\n || callingCode.includes(search.replace(/^\\+/, \"\"))\r\n })\r\n }, [inputValue, items])\r\n\r\n const value = React.useMemo(\r\n () => items.find((item) => item.value === selectedCountry) ?? null,\r\n [items, selectedCountry]\r\n )\r\n\r\n React.useEffect(() => {\r\n setScrollTop(0)\r\n if (listRef.current) listRef.current.scrollTop = 0\r\n }, [inputValue])\r\n\r\n const listHeight = Math.min(\r\n filteredItems.length * COUNTRY_ROW_HEIGHT,\r\n COUNTRY_LIST_HEIGHT\r\n )\r\n\r\n const virtualRange = React.useMemo(() => {\r\n const visibleStartIndex = Math.floor(scrollTop / COUNTRY_ROW_HEIGHT)\r\n const startIndex = Math.max(\r\n 0,\r\n visibleStartIndex - COUNTRY_OVERSCAN\r\n )\r\n const visibleCount = Math.ceil(COUNTRY_LIST_HEIGHT / COUNTRY_ROW_HEIGHT)\r\n const endIndex = Math.min(\r\n filteredItems.length,\r\n visibleStartIndex + visibleCount + COUNTRY_OVERSCAN\r\n )\r\n\r\n return {\r\n startIndex,\r\n endIndex,\r\n items: filteredItems.slice(startIndex, endIndex),\r\n }\r\n }, [filteredItems, scrollTop])\r\n\r\n const paddingTop = virtualRange.startIndex * COUNTRY_ROW_HEIGHT\r\n const paddingBottom = Math.max(\r\n 0,\r\n (filteredItems.length - virtualRange.endIndex) * COUNTRY_ROW_HEIGHT\r\n )\r\n\r\n const handleValueChange = React.useCallback(\r\n (item: CountryItem | null) => {\r\n if (!item?.value) return\r\n\r\n onChange(item.value)\r\n setInputValue(\"\")\r\n setOpen(false)\r\n },\r\n [onChange]\r\n )\r\n\r\n return (\r\n <Combobox\r\n behavior=\"default\"\r\n disabled={disabled}\r\n inputValue={inputValue}\r\n items={filteredItems}\r\n open={open}\r\n value={value}\r\n virtualized\r\n filter={null}\r\n isItemEqualToValue={(a, b) => a.value === b.value}\r\n openOnInputClick={false}\r\n onValueChange={handleValueChange}\r\n onInputValueChange={setInputValue}\r\n onOpenChange={(open) => {\r\n setOpen(open)\r\n if (!open) setInputValue(\"\")\r\n }}\r\n >\r\n {/* Visible trigger button styled as part of the input */}\r\n <ComboboxTrigger\r\n render={\r\n <button\r\n type=\"button\"\r\n className={cn(\r\n inputVariants(),\r\n \"h-11 w-18 shrink-0 justify-between gap-1 rounded-r-none border-r-0 px-3\",\r\n \"hover:bg-bg-primary-hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-brand\",\r\n \"disabled:pointer-events-none disabled:opacity-50\"\r\n )}\r\n disabled={disabled}\r\n >\r\n <span className=\"flex items-center gap-1.5 overflow-hidden\">\r\n <FlagComponent\r\n country={selectedCountry}\r\n countryName={selectedCountry}\r\n />\r\n {selectedCountry && (\r\n <span className=\"text-body-medium-3 text-text-primary\">\r\n {selectedCountry}\r\n </span>\r\n )}\r\n </span>\r\n <ChevronsUpDownIcon className=\"size-3.5 shrink-0 text-fg-quaternary\" />\r\n </button>\r\n }\r\n />\r\n\r\n {/* Dropdown content */}\r\n <ComboboxPopup className=\"w-72\">\r\n <ComboboxInput\r\n placeholder=\"Search country...\"\r\n aria-label=\"Search country\"\r\n />\r\n <ComboboxStatus status={filteredItems.length === 0 ? \"empty\" : null} />\r\n <ComboboxList\r\n ref={listRef}\r\n className=\"relative gap-0\"\r\n style={{ height: listHeight }}\r\n onScroll={(event) => setScrollTop(event.currentTarget.scrollTop)}\r\n >\r\n <div\r\n className=\"flex w-full shrink-0 flex-col\"\r\n style={{ paddingTop, paddingBottom }}\r\n >\r\n {virtualRange.items.map((item, virtualIndex) => {\r\n const index = virtualRange.startIndex + virtualIndex\r\n\r\n return (\r\n <ComboboxItem\r\n key={item.value}\r\n index={index}\r\n value={item}\r\n >\r\n <div className=\"flex items-center gap-2 w-full min-w-0\">\r\n <FlagComponent country={item.value} countryName={item.label} />\r\n <span className=\"flex-1 text-sm truncate\">{item.label}</span>\r\n <span className=\"text-sm text-text-tertiary shrink-0\">\r\n +{RPNInput.getCountryCallingCode(item.value)}\r\n </span>\r\n </div>\r\n </ComboboxItem>\r\n )\r\n })}\r\n </div>\r\n </ComboboxList>\r\n </ComboboxPopup>\r\n </Combobox >\r\n )\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Input Component\r\n// ---------------------------------------------------------------------------\r\n\r\nconst InputComponent = React.forwardRef<\r\n HTMLInputElement,\r\n React.ComponentProps<\"input\">\r\n>(({ className, onChange, ...props }, ref) => {\r\n const handleChange = React.useCallback(\r\n (event: React.ChangeEvent<HTMLInputElement>) => {\r\n if (event.currentTarget.value === \"+\") {\r\n event.currentTarget.value = \"\"\r\n }\r\n\r\n onChange?.(event)\r\n },\r\n [onChange]\r\n )\r\n\r\n return (\r\n <input\r\n className={cn(\r\n inputVariants(),\r\n \"h-11 flex-1 rounded-l-none text-body-regular-2\",\r\n className\r\n )}\r\n ref={ref}\r\n type=\"tel\"\r\n onChange={handleChange}\r\n {...props}\r\n />\r\n )\r\n})\r\nInputComponent.displayName = \"InputComponent\"\r\n\r\n// ---------------------------------------------------------------------------\r\n// Phone Input\r\n// ---------------------------------------------------------------------------\r\n\r\nconst PhoneInput: React.ForwardRefExoticComponent<PhoneInputProps> =\r\n React.forwardRef<\r\n React.ElementRef<typeof RPNInput.default>,\r\n PhoneInputProps\r\n >(({\r\n className,\r\n onChange,\r\n value,\r\n ...props\r\n }, ref) => {\r\n return (\r\n <RPNInput.default\r\n ref={ref}\r\n className={cn(\r\n \"flex w-full min-w-0 items-center\",\r\n className\r\n )}\r\n flagComponent={FlagComponent}\r\n countrySelectComponent={CountrySelect}\r\n inputComponent={InputComponent}\r\n smartCaret={false}\r\n value={value || undefined}\r\n onChange={(value) => onChange?.(value || (\"\" as RPNInput.Value))}\r\n {...props}\r\n />\r\n )\r\n })\r\nPhoneInput.displayName = \"PhoneInput\"\r\n\r\nexport { PhoneInput, type PhoneInputProps }\r\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/composites/phone-input.tsx"],"names":["FlagComponent","country","countryName","Flag","flags","jsx","COUNTRY_ROW_HEIGHT","COUNTRY_LIST_HEIGHT","COUNTRY_OVERSCAN","CountrySelect","disabled","selectedCountry","countryList","onChange","open","setOpen","inputValue","setInputValue","scrollTop","setScrollTop","listRef","items","item","filteredItems","search","callingCode","value","listHeight","virtualRange","visibleStartIndex","startIndex","visibleCount","endIndex","paddingTop","paddingBottom","handleValueChange","jsxs","Combobox","a","b","ComboboxTrigger","cn","inputVariants","ChevronsUpDownIcon","ComboboxPopup","ComboboxInput","ComboboxStatus","ComboboxList","event","virtualIndex","index","ComboboxItem","InputComponent","className","props","ref","handleChange","PhoneInput"],"mappings":"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","file":"chunk-H6ETV455.js","sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as RPNInput from \"react-phone-number-input\"\r\nimport flags from \"react-phone-number-input/flags\"\r\n\r\nimport { cn } from \"@xploreu/lib/cn\"\r\nimport { Combobox as ComboboxPrimitive } from \"@base-ui/react/combobox\"\r\nimport {\r\n Combobox,\r\n ComboboxInput,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxPopup,\r\n ComboboxStatus,\r\n ComboboxTrigger,\r\n} from \"../ui/combobox\"\r\nimport { inputVariants } from \"../ui/input\"\r\nimport { ChevronsUpDownIcon } from \"lucide-react\"\r\n\r\n// ---------------------------------------------------------------------------\r\n// Types\r\n// ---------------------------------------------------------------------------\r\n\r\ntype PhoneInputProps = Omit<\r\n React.ComponentProps<\"input\">,\r\n \"onChange\" | \"value\" | \"ref\"\r\n> &\r\n Omit<RPNInput.Props<typeof RPNInput.default>, \"onChange\"> & {\r\n onChange?: (value: RPNInput.Value) => void\r\n }\r\n\r\n// ---------------------------------------------------------------------------\r\n// Flag\r\n// ---------------------------------------------------------------------------\r\n\r\nconst FlagComponent = ({ country, countryName }: RPNInput.FlagProps) => {\r\n const Flag = country ? flags[country] : undefined\r\n\r\n return (\r\n <span className=\"flex h-4 w-6 shrink-0 overflow-hidden rounded-sm bg-fg-quaternary/20 [&_svg:not([class*='size-'])]:size-full\">\r\n {Flag && <Flag title={countryName} />}\r\n </span>\r\n )\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Country Select — uses base-ui Combobox\r\n// ---------------------------------------------------------------------------\r\n\r\ntype CountryEntry = { label: string; value: RPNInput.Country | undefined }\r\ntype CountryItem = { label: string; value: RPNInput.Country }\r\n\r\nconst COUNTRY_ROW_HEIGHT = 44\r\nconst COUNTRY_LIST_HEIGHT = 288\r\nconst COUNTRY_OVERSCAN = 6\r\n\r\ntype CountrySelectProps = {\r\n disabled?: boolean\r\n value: RPNInput.Country\r\n options: CountryEntry[]\r\n onChange: (country: RPNInput.Country) => void\r\n}\r\n\r\nfunction CountrySelect({\r\n disabled,\r\n value: selectedCountry,\r\n options: countryList,\r\n onChange,\r\n}: CountrySelectProps) {\r\n const [open, setOpen] = React.useState(false)\r\n const [inputValue, setInputValue] = React.useState(\"\")\r\n const [scrollTop, setScrollTop] = React.useState(0)\r\n const listRef = React.useRef<HTMLDivElement>(null)\r\n\r\n const items = React.useMemo(\r\n () => countryList.filter((item): item is CountryItem => Boolean(item.value)),\r\n [countryList]\r\n )\r\n\r\n const filteredItems = React.useMemo(() => {\r\n const search = inputValue.trim().toLowerCase()\r\n\r\n if (!search) return items\r\n\r\n return items.filter((item) => {\r\n const callingCode = RPNInput.getCountryCallingCode(item.value)\r\n\r\n return item.label.toLowerCase().includes(search)\r\n || item.value.toLowerCase().includes(search)\r\n || callingCode.includes(search.replace(/^\\+/, \"\"))\r\n })\r\n }, [inputValue, items])\r\n\r\n const value = React.useMemo(\r\n () => items.find((item) => item.value === selectedCountry) ?? null,\r\n [items, selectedCountry]\r\n )\r\n\r\n React.useEffect(() => {\r\n setScrollTop(0)\r\n if (listRef.current) listRef.current.scrollTop = 0\r\n }, [inputValue])\r\n\r\n const listHeight = Math.min(\r\n filteredItems.length * COUNTRY_ROW_HEIGHT,\r\n COUNTRY_LIST_HEIGHT\r\n )\r\n\r\n const virtualRange = React.useMemo(() => {\r\n const visibleStartIndex = Math.floor(scrollTop / COUNTRY_ROW_HEIGHT)\r\n const startIndex = Math.max(\r\n 0,\r\n visibleStartIndex - COUNTRY_OVERSCAN\r\n )\r\n const visibleCount = Math.ceil(COUNTRY_LIST_HEIGHT / COUNTRY_ROW_HEIGHT)\r\n const endIndex = Math.min(\r\n filteredItems.length,\r\n visibleStartIndex + visibleCount + COUNTRY_OVERSCAN\r\n )\r\n\r\n return {\r\n startIndex,\r\n endIndex,\r\n items: filteredItems.slice(startIndex, endIndex),\r\n }\r\n }, [filteredItems, scrollTop])\r\n\r\n const paddingTop = virtualRange.startIndex * COUNTRY_ROW_HEIGHT\r\n const paddingBottom = Math.max(\r\n 0,\r\n (filteredItems.length - virtualRange.endIndex) * COUNTRY_ROW_HEIGHT\r\n )\r\n\r\n const handleValueChange = React.useCallback(\r\n (item: CountryItem | null) => {\r\n if (!item?.value) return\r\n\r\n onChange(item.value)\r\n setInputValue(\"\")\r\n setOpen(false)\r\n },\r\n [onChange]\r\n )\r\n\r\n return (\r\n <Combobox\r\n behavior=\"default\"\r\n disabled={disabled}\r\n inputValue={inputValue}\r\n items={filteredItems}\r\n open={open}\r\n value={value}\r\n virtualized\r\n filter={null}\r\n isItemEqualToValue={(a, b) => a.value === b.value}\r\n openOnInputClick={false}\r\n onValueChange={handleValueChange}\r\n onInputValueChange={setInputValue}\r\n onOpenChange={(open) => {\r\n setOpen(open)\r\n if (!open) setInputValue(\"\")\r\n }}\r\n >\r\n {/* Visible trigger button styled as part of the input */}\r\n <ComboboxTrigger\r\n render={\r\n <button\r\n type=\"button\"\r\n className={cn(\r\n inputVariants(),\r\n \"h-11 w-18 shrink-0 justify-between gap-1 rounded-r-none border-r-0 px-3\",\r\n \"hover:bg-bg-primary-hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-brand\",\r\n \"disabled:pointer-events-none disabled:opacity-50\"\r\n )}\r\n disabled={disabled}\r\n >\r\n <span className=\"flex items-center gap-1.5 overflow-hidden\">\r\n <FlagComponent\r\n country={selectedCountry}\r\n countryName={selectedCountry}\r\n />\r\n {selectedCountry && (\r\n <span className=\"text-body-medium-3 text-text-primary\">\r\n {selectedCountry}\r\n </span>\r\n )}\r\n </span>\r\n <ChevronsUpDownIcon className=\"size-3.5 shrink-0 text-fg-quaternary\" />\r\n </button>\r\n }\r\n />\r\n\r\n {/* Dropdown content */}\r\n <ComboboxPopup className=\"w-72\">\r\n <ComboboxInput\r\n placeholder=\"Search country...\"\r\n aria-label=\"Search country\"\r\n />\r\n <ComboboxStatus status={filteredItems.length === 0 ? \"empty\" : null} />\r\n <ComboboxList\r\n ref={listRef}\r\n className=\"relative gap-0\"\r\n style={{ height: listHeight }}\r\n onScroll={(event) => setScrollTop(event.currentTarget.scrollTop)}\r\n >\r\n <div\r\n className=\"flex w-full shrink-0 flex-col\"\r\n style={{ paddingTop, paddingBottom }}\r\n >\r\n {virtualRange.items.map((item, virtualIndex) => {\r\n const index = virtualRange.startIndex + virtualIndex\r\n\r\n return (\r\n <ComboboxItem\r\n key={item.value}\r\n index={index}\r\n value={item}\r\n >\r\n <div className=\"flex items-center gap-2 w-full min-w-0\">\r\n <FlagComponent country={item.value} countryName={item.label} />\r\n <span className=\"flex-1 text-sm truncate\">{item.label}</span>\r\n <span className=\"text-sm text-text-tertiary shrink-0\">\r\n +{RPNInput.getCountryCallingCode(item.value)}\r\n </span>\r\n </div>\r\n </ComboboxItem>\r\n )\r\n })}\r\n </div>\r\n </ComboboxList>\r\n </ComboboxPopup>\r\n </Combobox >\r\n )\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Input Component\r\n// ---------------------------------------------------------------------------\r\n\r\nconst InputComponent = React.forwardRef<\r\n HTMLInputElement,\r\n React.ComponentProps<\"input\">\r\n>(({ className, onChange, ...props }, ref) => {\r\n const handleChange = React.useCallback(\r\n (event: React.ChangeEvent<HTMLInputElement>) => {\r\n if (event.currentTarget.value === \"+\") {\r\n event.currentTarget.value = \"\"\r\n }\r\n\r\n onChange?.(event)\r\n },\r\n [onChange]\r\n )\r\n\r\n return (\r\n <input\r\n className={cn(\r\n inputVariants(),\r\n \"h-11 flex-1 rounded-l-none text-body-regular-2\",\r\n className\r\n )}\r\n ref={ref}\r\n type=\"tel\"\r\n onChange={handleChange}\r\n {...props}\r\n />\r\n )\r\n})\r\nInputComponent.displayName = \"InputComponent\"\r\n\r\n// ---------------------------------------------------------------------------\r\n// Phone Input\r\n// ---------------------------------------------------------------------------\r\n\r\nconst PhoneInput: React.ForwardRefExoticComponent<PhoneInputProps> =\r\n React.forwardRef<\r\n React.ElementRef<typeof RPNInput.default>,\r\n PhoneInputProps\r\n >(({\r\n className,\r\n onChange,\r\n value,\r\n ...props\r\n }, ref) => {\r\n return (\r\n <RPNInput.default\r\n ref={ref}\r\n className={cn(\r\n \"flex w-full min-w-0 items-center\",\r\n className\r\n )}\r\n flagComponent={FlagComponent}\r\n countrySelectComponent={CountrySelect}\r\n inputComponent={InputComponent}\r\n smartCaret={false}\r\n value={value || undefined}\r\n onChange={(value) => onChange?.(value || (\"\" as RPNInput.Value))}\r\n {...props}\r\n />\r\n )\r\n })\r\nPhoneInput.displayName = \"PhoneInput\"\r\n\r\nexport { PhoneInput, type PhoneInputProps }\r\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {a,b,i,m,s,w}from'./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import {a,b,i,m,s,w}from'./chunk-RHWRIE3E.js';import*as l from'react';import {ChevronDownIcon,ChevronLeftIcon,ChevronRightIcon}from'lucide-react';import {cn}from'@xploreu/lib/cn';import {jsxs,Fragment,jsx}from'react/jsx-runtime';function j({page:r,pageSize:a$1,total:i$1,onPageChange:b$1,onPageSizeChange:n,pageSizeOptions:m$1=[10,20,50,100],showPageSize:c=true,showRange:d=true,className:C,...N}){let u=Math.max(1,Math.ceil(i$1/a$1)),h=i$1===0?0:(r-1)*a$1+1,P=Math.min(r*a$1,i$1),s$1=l.useMemo(()=>m$1.map(e=>({label:String(e),value:e})),[m$1]),I=l.useMemo(()=>s$1.find(e=>e.value===a$1)??s$1[0],[s$1,a$1]);return jsxs("div",{className:cn("flex w-full flex-col-reverse gap-3 mt-4 sm:flex-row sm:items-center sm:justify-between border-t border-border-primary pt-3 text-body-regular-2 text-text-secondary",C),"data-slot":"pagination",...N,children:[jsxs("div",{className:"flex items-center gap-2",children:[c&&n&&jsxs(Fragment,{children:[jsx("span",{className:"text-label-regular-3 text-text-tertiary",children:"Rows per page"}),jsxs(a,{items:s$1,value:I,onValueChange:e=>{e&&n&&n(e.value);},isItemEqualToValue:(e,w)=>e.value===w.value,children:[jsxs(b,{className:"h-8 gap-2 rounded-lg border border-border-primary bg-bg-primary px-3 text-label-semibold-3 text-text-primary hover:bg-bg-secondary focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border-brand-primary","aria-label":"Rows per page",children:[jsx(i,{children:e=>e?e.label:String(a$1)}),jsx(ChevronDownIcon,{className:"size-3.5 text-text-tertiary"})]}),jsx(m,{className:"w-24",children:jsx(s,{children:s$1.map(e=>jsx(w,{value:e,children:e.label},e.value))})})]})]}),c&&d&&jsx("span",{className:"text-text-tertiary",children:"\xB7"}),d&&jsxs("span",{className:"text-label-regular-3 text-text-tertiary",children:[h,"\u2013",P," of ",i$1]})]}),jsxs("div",{className:"flex items-center gap-1",children:[jsx("button",{type:"button",disabled:r<=1,onClick:()=>b$1(r-1),className:"inline-flex size-8 cursor-pointer items-center justify-center rounded-lg border border-border-primary bg-bg-primary text-text-secondary transition-colors hover:bg-bg-secondary hover:text-text-primary disabled:cursor-not-allowed disabled:opacity-40","aria-label":"Previous page",children:jsx(ChevronLeftIcon,{className:"size-4"})}),jsxs("span",{className:"px-2 text-label-semibold-3 text-text-primary",children:["Page ",r," / ",u]}),jsx("button",{type:"button",disabled:r>=u,onClick:()=>b$1(r+1),className:"inline-flex size-8 cursor-pointer items-center justify-center rounded-lg border border-border-primary bg-bg-primary text-text-secondary transition-colors hover:bg-bg-secondary hover:text-text-primary disabled:cursor-not-allowed disabled:opacity-40","aria-label":"Next page",children:jsx(ChevronRightIcon,{className:"size-4"})})]})]})}export{j as a};//# sourceMappingURL=chunk-HGLHAEGH.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-HGLHAEGH.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/ui/pagination.tsx"],"names":["Pagination","page","pageSize","total","onPageChange","onPageSizeChange","pageSizeOptions","showPageSize","showRange","className","props","totalPages","startItem","endItem","items","opt","selectedItem","item","jsxs","cn","Fragment","jsx","Combobox","a","b","ComboboxTrigger","ComboboxValue","val","ChevronDownIcon","ComboboxPopup","ComboboxList","ComboboxItem","ChevronLeftIcon","ChevronRightIcon"],"mappings":"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","file":"chunk-
|
|
1
|
+
{"version":3,"sources":["../src/ui/pagination.tsx"],"names":["Pagination","page","pageSize","total","onPageChange","onPageSizeChange","pageSizeOptions","showPageSize","showRange","className","props","totalPages","startItem","endItem","items","opt","selectedItem","item","jsxs","cn","Fragment","jsx","Combobox","a","b","ComboboxTrigger","ComboboxValue","val","ChevronDownIcon","ComboboxPopup","ComboboxList","ComboboxItem","ChevronLeftIcon","ChevronRightIcon"],"mappings":"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","file":"chunk-HGLHAEGH.js","sourcesContent":["import * as React from \"react\"\r\nimport { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon } from \"lucide-react\"\r\n\r\nimport { cn } from \"@xploreu/lib/cn\"\r\nimport {\r\n Combobox,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxPopup,\r\n ComboboxTrigger,\r\n ComboboxValue,\r\n} from \"./combobox\"\r\n\r\nexport interface PaginationProps extends React.ComponentProps<\"div\"> {\r\n page: number\r\n pageSize: number\r\n total: number\r\n onPageChange: (page: number) => void\r\n onPageSizeChange?: (pageSize: number) => void\r\n pageSizeOptions?: number[]\r\n showPageSize?: boolean\r\n showRange?: boolean\r\n}\r\n\r\ntype PageSizeOptionItem = {\r\n label: string\r\n value: number\r\n}\r\n\r\nexport function Pagination({\r\n page,\r\n pageSize,\r\n total,\r\n onPageChange,\r\n onPageSizeChange,\r\n pageSizeOptions = [10, 20, 50, 100],\r\n showPageSize = true,\r\n showRange = true,\r\n className,\r\n ...props\r\n}: PaginationProps) {\r\n const totalPages = Math.max(1, Math.ceil(total / pageSize))\r\n const startItem = total === 0 ? 0 : (page - 1) * pageSize + 1\r\n const endItem = Math.min(page * pageSize, total)\r\n\r\n const items: PageSizeOptionItem[] = React.useMemo(\r\n () => pageSizeOptions.map((opt) => ({ label: String(opt), value: opt })),\r\n [pageSizeOptions]\r\n )\r\n\r\n const selectedItem = React.useMemo(\r\n () => items.find((item) => item.value === pageSize) ?? items[0],\r\n [items, pageSize]\r\n )\r\n\r\n return (\r\n <div\r\n className={cn(\r\n \"flex w-full flex-col-reverse gap-3 mt-4 sm:flex-row sm:items-center sm:justify-between border-t border-border-primary pt-3 text-body-regular-2 text-text-secondary\",\r\n className\r\n )}\r\n data-slot=\"pagination\"\r\n {...props}\r\n >\r\n {/* Left: Rows per page & range */}\r\n <div className=\"flex items-center gap-2\">\r\n {showPageSize && onPageSizeChange && (\r\n <>\r\n <span className=\"text-label-regular-3 text-text-tertiary\">\r\n Rows per page\r\n </span>\r\n <Combobox<PageSizeOptionItem>\r\n items={items}\r\n value={selectedItem}\r\n onValueChange={(item) => {\r\n if (item && onPageSizeChange) {\r\n onPageSizeChange(item.value)\r\n }\r\n }}\r\n isItemEqualToValue={(a, b) => a.value === b.value}\r\n >\r\n <ComboboxTrigger\r\n className=\"h-8 gap-2 rounded-lg border border-border-primary bg-bg-primary px-3 text-label-semibold-3 text-text-primary hover:bg-bg-secondary focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border-brand-primary\"\r\n aria-label=\"Rows per page\"\r\n >\r\n <ComboboxValue>\r\n {(val) => (val ? val.label : String(pageSize))}\r\n </ComboboxValue>\r\n <ChevronDownIcon className=\"size-3.5 text-text-tertiary\" />\r\n </ComboboxTrigger>\r\n\r\n <ComboboxPopup className=\"w-24\">\r\n <ComboboxList>\r\n {items.map((item) => (\r\n <ComboboxItem\r\n key={item.value}\r\n value={item}\r\n >\r\n {item.label}\r\n </ComboboxItem>\r\n ))}\r\n </ComboboxList>\r\n </ComboboxPopup>\r\n </Combobox>\r\n </>\r\n )}\r\n\r\n {showPageSize && showRange && (\r\n <span className=\"text-text-tertiary\">·</span>\r\n )}\r\n\r\n {showRange && (\r\n <span className=\"text-label-regular-3 text-text-tertiary\">\r\n {startItem}–{endItem} of {total}\r\n </span>\r\n )}\r\n </div>\r\n\r\n {/* Right: Page controls */}\r\n <div className=\"flex items-center gap-1\">\r\n <button\r\n type=\"button\"\r\n disabled={page <= 1}\r\n onClick={() => onPageChange(page - 1)}\r\n className=\"inline-flex size-8 cursor-pointer items-center justify-center rounded-lg border border-border-primary bg-bg-primary text-text-secondary transition-colors hover:bg-bg-secondary hover:text-text-primary disabled:cursor-not-allowed disabled:opacity-40\"\r\n aria-label=\"Previous page\"\r\n >\r\n <ChevronLeftIcon className=\"size-4\" />\r\n </button>\r\n\r\n <span className=\"px-2 text-label-semibold-3 text-text-primary\">\r\n Page {page} / {totalPages}\r\n </span>\r\n\r\n <button\r\n type=\"button\"\r\n disabled={page >= totalPages}\r\n onClick={() => onPageChange(page + 1)}\r\n className=\"inline-flex size-8 cursor-pointer items-center justify-center rounded-lg border border-border-primary bg-bg-primary text-text-secondary transition-colors hover:bg-bg-secondary hover:text-text-primary disabled:cursor-not-allowed disabled:opacity-40\"\r\n aria-label=\"Next page\"\r\n >\r\n <ChevronRightIcon className=\"size-4\" />\r\n </button>\r\n </div>\r\n </div>\r\n )\r\n}\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import {b,d,e,f,g,h}from'./chunk-OHLNKXSV.js';import {b as b$1}from'./chunk-Y6TKCAAJ.js';import'react';import {jsx,jsxs}from'react/jsx-runtime';function L({inputRef:t,name:d$1,label:s,control:c,description:f$1,size:r,type:T,variant:V,startContent:y,endContent:I,className:P,classNameInput:N,placeholder:h$1,disabled:C}){return jsx(b,{control:c,name:d$1,render:({field:a})=>jsxs(d,{className:P,children:[s&&jsx(e,{size:r,children:s}),jsx(f,{children:jsx(b$1,{className:N,disabled:C,endContent:I,placeholder:h$1,size:r,startContent:y,type:T,variant:V,...a,ref:o=>{a.ref(o),t&&(typeof t=="function"?t(o):t.current=o);}})}),jsx(g,{size:r,children:f$1}),jsx(h,{size:r})]})})}export{L as a};//# sourceMappingURL=chunk-MO7LQLS4.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-MO7LQLS4.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/form/form-input.tsx"],"names":["FormInput","inputRef","name","label","control","description","size","type","variant","startContent","endContent","className","classNameInput","placeholder","disabled","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","Input","e","FormDescription","FormMessage"],"mappings":"gJAmCA,SAASA,CAAAA,CAAmF,CAC1F,QAAA,CAAAC,CAAAA,CACA,IAAA,CAAAC,GAAAA,CACA,KAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CACA,WAAA,CAAAC,GAAAA,CACA,IAAA,CAAAC,CAAAA,CACA,IAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CACA,YAAA,CAAAC,CAAAA,CACA,WAAAC,CAAAA,CACA,SAAA,CAAAC,CAAAA,CACA,cAAA,CAAAC,CAAAA,CACA,WAAA,CAAAC,GAAAA,CACA,QAAA,CAAAC,CACF,CAAA,CAAwC,CACtC,OACEC,GAAAA,CAACC,CAAAA,CAAA,CACC,OAAA,CAASZ,CAAAA,CACT,IAAA,CAAMF,GAAAA,CACN,MAAA,CAAQ,CAAC,CAAE,KAAA,CAAAe,CAAM,CAAA,GAEbC,IAAAA,CAACC,CAAAA,CAAA,CAAS,SAAA,CAAWR,CAAAA,CAClB,QAAA,CAAA,CAAAR,CAAAA,EACCY,IAACK,CAAAA,CAAA,CAAU,IAAA,CAAMd,CAAAA,CACd,QAAA,CAAAH,CAAAA,CACH,CAAA,CAEFY,GAAAA,CAACM,CAAAA,CAAA,CACC,QAAA,CAAAN,GAAAA,CAACO,GAAAA,CAAA,CACC,SAAA,CAAWV,CAAAA,CACX,QAAA,CAAUE,CAAAA,CACV,UAAA,CAAYJ,CAAAA,CACZ,WAAA,CAAaG,GAAAA,CACb,IAAA,CAAMP,CAAAA,CACN,YAAA,CAAcG,CAAAA,CACd,IAAA,CAAMF,CAAAA,CACN,OAAA,CAASC,CAAAA,CACR,GAAGS,CAAAA,CACJ,IAAMM,CAAAA,EAAM,CACVN,CAAAA,CAAM,GAAA,CAAIM,CAAC,CAAA,CACPtB,CAAAA,GACE,OAAOA,CAAAA,EAAa,UAAA,CACtBA,CAAAA,CAASsB,CAAC,CAAA,CAEVtB,CAAAA,CAAS,OAAA,CAAUsB,CAAAA,EAGzB,EACF,CAAA,CACF,CAAA,CACAR,GAAAA,CAACS,CAAAA,CAAA,CAAgB,IAAA,CAAMlB,CAAAA,CACpB,QAAA,CAAAD,GAAAA,CACH,CAAA,CACAU,GAAAA,CAACU,CAAAA,CAAA,CAAY,IAAA,CAAMnB,CAAAA,CAAM,CAAA,CAAA,CAC3B,EAGN,CAEJ","file":"chunk-MO7LQLS4.js","sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport type {\r\n FieldPath,\r\n FieldValues,\r\n UseControllerProps\r\n} from \"react-hook-form\"\r\n\r\nimport {\r\n FormControl,\r\n FormDescription,\r\n FormField,\r\n FormItem,\r\n FormLabel,\r\n FormMessage,\r\n} from \"./form\"\r\nimport { Input, type inputVariants } from \"../ui/input\"\r\nimport type { VariantProps } from \"class-variance-authority\"\r\n\r\ntype FormInputProps<\r\n TFieldValues extends FieldValues,\r\n TName extends FieldPath<TFieldValues>\r\n> = {\r\n inputRef?: React.Ref<HTMLInputElement>;\r\n label?: string;\r\n description?: string;\r\n placeholder?: string;\r\n type?: React.HTMLInputTypeAttribute;\r\n className?: string;\r\n classNameInput?: string;\r\n size?: VariantProps<typeof inputVariants>[\"size\"];\r\n} & UseControllerProps<TFieldValues, TName>\r\n & Omit<React.ComponentProps<typeof Input>, \"size\">\r\n\r\nfunction FormInput<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({\r\n inputRef,\r\n name,\r\n label,\r\n control,\r\n description,\r\n size,\r\n type,\r\n variant,\r\n startContent,\r\n endContent,\r\n className,\r\n classNameInput,\r\n placeholder,\r\n disabled,\r\n}: FormInputProps<TFieldValues, TName>) {\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n render={({ field }) => {\r\n return (\r\n <FormItem className={className}>\r\n {label && (\r\n <FormLabel size={size}>\r\n {label}\r\n </FormLabel>\r\n )}\r\n <FormControl>\r\n <Input\r\n className={classNameInput}\r\n disabled={disabled}\r\n endContent={endContent}\r\n placeholder={placeholder}\r\n size={size}\r\n startContent={startContent}\r\n type={type}\r\n variant={variant}\r\n {...field}\r\n ref={(e) => {\r\n field.ref(e)\r\n if (inputRef) {\r\n if (typeof inputRef === \"function\") {\r\n inputRef(e)\r\n } else {\r\n inputRef.current = e\r\n }\r\n }\r\n }}\r\n />\r\n </FormControl>\r\n <FormDescription size={size}>\r\n {description}\r\n </FormDescription>\r\n <FormMessage size={size} />\r\n </FormItem>\r\n )\r\n }}\r\n />\r\n )\r\n}\r\n\r\nexport { FormInput }\r\nexport type { FormInputProps }\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import {b}from'./chunk-DNAWFZ7O.js';import*as i from'react';import {Slot}from'@radix-ui/react-slot';import {cva}from'class-variance-authority';import {InfoIcon}from'lucide-react';import {FormProvider,Controller,useFormContext,useFormState}from'react-hook-form';import {cn}from'@xploreu/lib/cn';import {jsx,jsxs}from'react/jsx-runtime';var z=FormProvider,u=i.createContext({}),N=({...e})=>jsx(u.Provider,{value:{name:e.name},children:jsx(Controller,{...e})}),m=()=>{let e=i.useContext(u),o=i.useContext(f),t=useFormContext(),r=useFormState({name:e.name});if(!e)throw new Error("useFormField should be used within <FormField>");let n=t?t.getFieldState(e.name,r):{error:void 0,invalid:false,isDirty:false,isTouched:false},{id:s}=o;return {id:s,name:e.name,formItemId:`${s}-form-item`,formDescriptionId:`${s}-form-item-description`,formMessageId:`${s}-form-item-message`,...n}},f=i.createContext({});function S({className:e,...o}){let t=i.useId();return jsx(f.Provider,{value:{id:t},children:jsx("div",{className:cn("grid gap-1",e),"data-slot":"form-item",...o})})}function $({className:e,size:o,...t}){let{error:r,formItemId:n}=m();return jsx(b,{className:cn("data-[error=true]:text-text-error-primary",e),"data-error":!!r,"data-slot":"form-label",htmlFor:n,size:o,...t})}function w({...e}){let{error:o,formItemId:t,formDescriptionId:r,formMessageId:n}=m();return jsx(Slot,{"aria-describedby":o?`${r} ${n}`:`${r}`,"aria-invalid":!!o,"data-slot":"form-control",id:t,...e})}var F=cva("inline-flex items-center gap-1 w-full [&>svg]:min-w-min",{variants:{color:{default:"text-text-disabled",danger:"text-text-error-primary"},size:{"3xs":"text-label-regular-4 [&>svg]:size-2.5","2xs":"text-label-regular-4 [&>svg]:size-2.5",xs:"text-body-regular-3 [&>svg]:size-2.5",sm:"text-body-regular-3 [&>svg]:size-2.5",md:"text-body-regular-3 [&>svg]:size-3",lg:"text-body-regular-2 [&>svg]:size-3.5",xl:"text-body-regular-2 [&>svg]:size-3.5"}},defaultVariants:{color:"default",size:"md"}});function D({className:e,size:o,...t}){let{formDescriptionId:r}=m();return t.children?jsxs("div",{className:cn(F({size:o}),e),children:[jsx(InfoIcon,{}),jsx("p",{"data-slot":"form-description",id:r,...t})]}):null}function M({className:e,size:o,...t}){let{error:r,formMessageId:n}=m(),s=r?String(r?.message??""):t.children;return s?jsxs("div",{className:cn(F({size:o,color:"danger"}),e),children:[jsx(InfoIcon,{}),jsx("p",{"data-slot":"form-message",id:n,...t,children:s})]}):null}export{z as a,N as b,m as c,S as d,$ as e,w as f,D as g,M as h};//# sourceMappingURL=chunk-OHLNKXSV.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-OHLNKXSV.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/form/form.tsx"],"names":["Form","FormProvider","FormFieldContext","FormField","props","jsx","Controller","useFormField","fieldContext","itemContext","FormItemContext","context","useFormContext","formState","useFormState","fieldState","id","FormItem","className","cn","FormLabel","size","error","formItemId","Label","FormControl","formDescriptionId","formMessageId","Slot","formInformationVariants","cva","FormDescription","jsxs","InfoIcon","FormMessage","body"],"mappings":"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","file":"chunk-OHLNKXSV.js","sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport { Slot } from \"@radix-ui/react-slot\"\r\nimport { cva, type VariantProps } from \"class-variance-authority\"\r\nimport { InfoIcon } from \"lucide-react\"\r\nimport {\r\n Controller,\r\n type ControllerProps,\r\n type FieldPath,\r\n type FieldValues,\r\n FormProvider,\r\n useFormContext,\r\n useFormState,\r\n} from \"react-hook-form\"\r\n\r\nimport { Label } from \"../ui/label\"\r\nimport { cn } from \"@xploreu/lib/cn\"\r\n\r\nconst Form = FormProvider\r\n\r\ntype FormFieldContextValue<\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n> = {\r\n name: TName\r\n}\r\n\r\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\r\n {} as FormFieldContextValue\r\n)\r\n\r\nconst FormField = <\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n>({\r\n ...props\r\n}: ControllerProps<TFieldValues, TName>) => {\r\n return (\r\n <FormFieldContext.Provider value={{ name: props.name }}>\r\n <Controller {...props} />\r\n </FormFieldContext.Provider>\r\n )\r\n}\r\n\r\nconst useFormField = () => {\r\n const fieldContext = React.useContext(FormFieldContext)\r\n const itemContext = React.useContext(FormItemContext)\r\n const context = useFormContext()\r\n const formState = useFormState({ name: fieldContext.name })\r\n\r\n if (!fieldContext) {\r\n throw new Error(\"useFormField should be used within <FormField>\")\r\n }\r\n\r\n const fieldState = context ? context.getFieldState(fieldContext.name, formState) : { error: undefined, invalid: false, isDirty: false, isTouched: false }\r\n const { id } = itemContext\r\n\r\n return {\r\n id,\r\n name: fieldContext.name,\r\n formItemId: `${id}-form-item`,\r\n formDescriptionId: `${id}-form-item-description`,\r\n formMessageId: `${id}-form-item-message`,\r\n ...fieldState,\r\n }\r\n}\r\n\r\ntype FormItemContextValue = {\r\n id: string\r\n}\r\n\r\nconst FormItemContext = React.createContext<FormItemContextValue>(\r\n {} as FormItemContextValue\r\n)\r\n\r\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\r\n const id = React.useId()\r\n\r\n return (\r\n <FormItemContext.Provider value={{ id }}>\r\n <div\r\n className={cn(\"grid gap-1\", className)}\r\n data-slot=\"form-item\"\r\n {...props}\r\n />\r\n </FormItemContext.Provider>\r\n )\r\n}\r\n\r\nfunction FormLabel({\r\n className,\r\n size,\r\n ...props\r\n}: React.ComponentProps<typeof Label>) {\r\n const { error, formItemId } = useFormField()\r\n\r\n return (\r\n <Label\r\n className={cn(\"data-[error=true]:text-text-error-primary\", className)}\r\n data-error={!!error}\r\n data-slot=\"form-label\"\r\n htmlFor={formItemId}\r\n size={size}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction FormControl({ ...props }: React.ComponentProps<typeof Slot>) {\r\n const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\r\n\r\n return (\r\n <Slot\r\n aria-describedby={\r\n !error\r\n ? `${formDescriptionId}`\r\n : `${formDescriptionId} ${formMessageId}`\r\n }\r\n aria-invalid={!!error}\r\n data-slot=\"form-control\"\r\n id={formItemId}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nconst formInformationVariants = cva(\"inline-flex items-center gap-1 w-full [&>svg]:min-w-min\", {\r\n variants: {\r\n color: {\r\n default: \"text-text-disabled\",\r\n danger: \"text-text-error-primary\",\r\n },\r\n size: {\r\n \"3xs\": \"text-label-regular-4 [&>svg]:size-2.5\",\r\n \"2xs\": \"text-label-regular-4 [&>svg]:size-2.5\",\r\n xs: \"text-body-regular-3 [&>svg]:size-2.5\",\r\n sm: \"text-body-regular-3 [&>svg]:size-2.5\",\r\n md: \"text-body-regular-3 [&>svg]:size-3\",\r\n lg: \"text-body-regular-2 [&>svg]:size-3.5\",\r\n xl: \"text-body-regular-2 [&>svg]:size-3.5\",\r\n },\r\n },\r\n defaultVariants: {\r\n color: \"default\",\r\n size: \"md\",\r\n }\r\n})\r\n\r\nfunction FormDescription({ className, size, ...props }: React.ComponentProps<\"p\"> &\r\n VariantProps<typeof formInformationVariants>\r\n) {\r\n const { formDescriptionId } = useFormField()\r\n\r\n if (!props.children) {\r\n return null\r\n }\r\n\r\n return (\r\n <div className={cn(formInformationVariants({ size }), className)}>\r\n <InfoIcon />\r\n <p\r\n data-slot=\"form-description\"\r\n id={formDescriptionId}\r\n {...props}\r\n />\r\n </div>\r\n )\r\n}\r\n\r\nfunction FormMessage({ className, size, ...props }: React.ComponentProps<\"p\"> &\r\n VariantProps<typeof formInformationVariants>\r\n) {\r\n const { error, formMessageId } = useFormField()\r\n const body = error ? String(error?.message ?? \"\") : props.children\r\n\r\n if (!body) {\r\n return null\r\n }\r\n\r\n return (\r\n <div className={cn(formInformationVariants({ size, color: \"danger\" }), className)}>\r\n <InfoIcon />\r\n <p\r\n data-slot=\"form-message\"\r\n id={formMessageId}\r\n {...props}\r\n >\r\n {body}\r\n </p>\r\n </div>\r\n )\r\n}\r\n\r\nexport {\r\n Form,\r\n FormControl,\r\n FormDescription,\r\n FormField,\r\n FormItem,\r\n FormLabel,\r\n FormMessage,\r\n useFormField,\r\n}\r\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {a,j,i,k,l,m,q,s,w,A,x,H}from'./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import {a,j,i,k,l,m,q,s,w,A,x,H}from'./chunk-RHWRIE3E.js';import {f,g}from'./chunk-HHG7BSWN.js';import {a as a$1}from'./chunk-Y6TKCAAJ.js';import*as r from'react';import {cn}from'@xploreu/lib/cn';import {useControlledState}from'@xploreu/hooks/use-controlled-state';import {jsxs,jsx,Fragment}from'react/jsx-runtime';function $({multiple:G=true,inputPlaceholder:j$1="Search...",container:q$1,items:s$1,infiniteScroll:z,isPending:B,taggable:C=false,maxVisible:b,...m$1}){let[O,F]=useControlledState({value:m$1?.inputValue?.toString(),defaultValue:m$1?.defaultInputValue?.toString(),onChange:m$1?.onInputValueChange}),[i$1,h]=useControlledState({value:m$1?.value??[],defaultValue:m$1?.defaultValue??[],onChange:m$1?.onValueChange}),[I,V]=r.useState([]),p=r.useRef(new Set);r.useEffect(()=>{let e=new Set(i$1.map(a=>a.value));V(a=>{let l=a.filter(o=>e.has(o.value));return l.length===a.length?a:(p.current=new Set(l.map(o=>o.value)),l)});},[i$1]);let t=O?.toString().trim()??"",v=r.useMemo(()=>t?i$1.some(e=>e.value.toLowerCase()===t.toLowerCase()):false,[t,i$1]),c=r.useMemo(()=>!C||!t?false:!s$1?.some(e=>e.label.toLowerCase()===t.toLowerCase()),[C,t,s$1]),H$1=r.useMemo(()=>{let e=[...s$1??[],...I];return c?[...e,{label:t,value:t,tag:true}]:e},[s$1,I,c,t]);return jsxs(a,{...m$1,behavior:"chip-outside",multiple:true,items:C?H$1:s$1,isItemEqualToValue:(e,a)=>e.value===a.value,onValueChange:(e,a)=>{if(C){let l=e.filter(o=>o?.tag===true&&!p.current.has(o.value));if(l.length>0){for(let o of l)p.current.add(o.value);V(o=>[...o,...l]);}}h(G?e:[e[e.length-1]],a);},onInputValueChange:F,children:[jsx(f,{className:cn(a$1(),"h-auto min-h-13 flex flex-wrap items-center gap-1.5 px-3 py-1.5 cursor-text"),children:jsxs(j,{className:cn("contents",b!==void 0&&"flex-nowrap overflow-hidden"),children:[jsx(i,{children:e=>{let a=b!==void 0?e.slice(0,b):e,l$1=b!==void 0?e.length-b:0;return jsxs(Fragment,{children:[a?.map(o=>jsxs(k,{className:cn(b!==void 0&&"min-w-0 shrink"),children:[o?.image&&jsx("img",{src:o.image,alt:o?.label||"",className:"size-4 rounded-full object-cover shrink-0 mr-1"}),b!==void 0?jsx("span",{className:"truncate",children:o?.label||""}):o?.label||"",jsx(l,{})]},o?.value||"")),l$1>0&&jsxs(k,{className:"shrink-0",children:["+",l$1]})]})}}),jsx(g,{render:jsx("input",{className:"flex-1 min-w-[80px] bg-transparent outline-none text-body-regular-1 text-text-primary placeholder:text-text-placeholder",placeholder:i$1.length===0?j$1:void 0})})]})}),jsxs(m,{container:q$1,children:[jsx(q,{status:B||s$1===void 0?"pending":s$1?.length===0&&!c?"empty":null}),jsxs(s,{children:[s$1?.map(e=>jsxs(w,{value:e,children:[e.image!==void 0&&jsx(A,{src:e.image,fallbackText:[e.label?.[0],e.label?.split(" ")?.[1]?.[0]].filter(Boolean).join(""),imageAlt:e.label}),jsx(x,{children:e.label})]},e.value)),c&&jsxs(w,{value:{label:t,value:t,tag:true},children:[!v&&jsxs("span",{className:"text-text-secondary text-body-medium-3 col-start-2",children:["Create: ",t]}),v&&jsx(x,{children:t})]}),jsx(H,{...z})]})]})]})}export{$ as a};//# sourceMappingURL=chunk-RAVBRPQS.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-RAVBRPQS.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/composites/combobox-chip.tsx"],"names":["ComboboxChip","multiple","inputPlaceholder","container","items","infiniteScroll","isPending","taggable","maxVisible","props","inputValue","setInputValue","useControlledState","value","setValue","createdItems","setCreatedItems","createdValuesRef","currentValues","v","prev","next","item","trimmedInput","isInputSelected","isCreatingItem","combinedItems","base","jsxs","Combobox","a","b","eventDetails","newTags","tag","jsx","ComboboxInputGroup","cn","inputVariants","ComboboxChips","ComboboxValue","visible","overflow","Fragment","ComboboxChipRemove","ComboboxInput","ComboboxPopup","ComboboxStatus","ComboboxList","ComboboxItem","ComboboxItemAvatar","ComboboxItemTitle","ComboboxInfiniteScroll"],"mappings":"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","file":"chunk-WV5OCKQK.js","sourcesContent":["import * as React from \"react\"\r\n\r\nimport { cn } from \"@xploreu/lib/cn\"\r\nimport {\r\n ComboboxInput as ComboboxInputPrimitive,\r\n ComboboxInputGroup,\r\n} from \"../primitives/combobox\"\r\nimport {\r\n Combobox,\r\n ComboboxChip as ComboboxChipUI,\r\n ComboboxChipRemove,\r\n ComboboxChips,\r\n ComboboxInfiniteScroll,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxPortal,\r\n ComboboxPopup,\r\n ComboboxStatus,\r\n ComboboxValue,\r\n type ComboboxProps,\r\n ComboboxItemTitle,\r\n ComboboxItemAvatar\r\n} from \"../ui/combobox\"\r\nimport { useControlledState } from \"@xploreu/hooks/use-controlled-state\"\r\nimport { inputVariants } from \"../ui/input\"\r\n\r\ntype ComboboxChipProps<Value extends { label: string; value: string; image?: string; tag?: true }> = Omit<ComboboxProps<Value, true>, \"multiple\" | \"items\"> & {\r\n multiple?: boolean\r\n inputPlaceholder?: string\r\n container?: React.ComponentProps<typeof ComboboxPortal>[\"container\"]\r\n items?: Value[] | undefined\r\n infiniteScroll?: React.ComponentProps<typeof ComboboxInfiniteScroll>\r\n isPending?: boolean\r\n /**\r\n * When true, enables creatable / taggable mode.\r\n * If the typed value has no exact match in the current item list,\r\n * a \"Create \\\"…\\\"\" option is shown at the top of the dropdown.\r\n * Created items are appended to the value with `{ label, value, tag: true }`.\r\n */\r\n taggable?: boolean\r\n /**\r\n * Maximum number of chips to show before collapsing the rest into a \"+N\" chip.\r\n * When undefined, all chips are shown.\r\n */\r\n maxVisible?: number\r\n}\r\n\r\nfunction ComboboxChip<Value extends { label: string; value: string; image?: string; tag?: true }>({\r\n multiple = true,\r\n inputPlaceholder = \"Search...\",\r\n container,\r\n items,\r\n infiniteScroll,\r\n isPending,\r\n taggable = false,\r\n maxVisible,\r\n ...props\r\n}: ComboboxChipProps<Value>) {\r\n const [inputValue, setInputValue] = useControlledState({\r\n value: props?.inputValue?.toString(),\r\n defaultValue: props?.defaultInputValue?.toString(),\r\n onChange: props?.onInputValueChange,\r\n })\r\n\r\n const [value, setValue] = useControlledState({\r\n value: props?.value ?? [],\r\n defaultValue: props?.defaultValue ?? [],\r\n onChange: props?.onValueChange,\r\n })\r\n\r\n // Track items created via taggable mode\r\n // Sync with value to avoid stale tags when controlled value is reset from outside\r\n const [createdItems, setCreatedItems] = React.useState<Value[]>([])\r\n const createdValuesRef = React.useRef<Set<string>>(new Set())\r\n\r\n React.useEffect(() => {\r\n const currentValues = new Set(value.map((v) => v.value))\r\n setCreatedItems((prev) => {\r\n const next = prev.filter((item) => currentValues.has(item.value))\r\n if (next.length === prev.length) return prev\r\n createdValuesRef.current = new Set(next.map((v) => v.value))\r\n return next\r\n })\r\n }, [value])\r\n\r\n const trimmedInput = inputValue?.toString().trim() ?? \"\"\r\n const isInputSelected = React.useMemo(() => {\r\n if (!trimmedInput) return false\r\n return value.some(\r\n (item) => item.value.toLowerCase() === trimmedInput.toLowerCase()\r\n )\r\n }, [trimmedInput, value])\r\n\r\n // true = show the taggable item in dropdown (either as \"Create:\" or as checked item)\r\n const isCreatingItem = React.useMemo(() => {\r\n if (!taggable || !trimmedInput) return false\r\n return !items?.some(\r\n (item) => item.label.toLowerCase() === trimmedInput.toLowerCase()\r\n )\r\n }, [taggable, trimmedInput, items])\r\n\r\n // Merge server items with locally created tags + the \"Create\" placeholder\r\n const combinedItems = React.useMemo(() => {\r\n const base: Value[] = [\r\n ...items ?? [],\r\n ...createdItems,\r\n ]\r\n\r\n if (isCreatingItem) {\r\n return [...base, { label: trimmedInput, value: trimmedInput, tag: true } as unknown as Value]\r\n }\r\n\r\n return base\r\n }, [items, createdItems, isCreatingItem, trimmedInput])\r\n\r\n const handleValueChange: ComboboxProps<Value, true>[\"onValueChange\"] = (value, eventDetails) => {\r\n if (taggable) {\r\n const newTags = value.filter(\r\n (v) => v?.tag === true && !createdValuesRef.current.has(v.value)\r\n )\r\n if (newTags.length > 0) {\r\n for (const tag of newTags) {\r\n createdValuesRef.current.add(tag.value)\r\n }\r\n setCreatedItems((prev) => [...prev, ...newTags])\r\n }\r\n }\r\n\r\n if (!multiple) {\r\n setValue([value[value.length - 1]], eventDetails)\r\n } else {\r\n setValue(value, eventDetails)\r\n }\r\n }\r\n\r\n return (\r\n <Combobox\r\n {...props}\r\n behavior=\"chip-outside\"\r\n multiple\r\n items={taggable ? combinedItems : items}\r\n isItemEqualToValue={(a, b) => a.value === b.value}\r\n onValueChange={handleValueChange}\r\n onInputValueChange={setInputValue}\r\n >\r\n {/* Input box with chips inside */}\r\n <ComboboxInputGroup\r\n className={cn(\r\n inputVariants(),\r\n \"h-auto min-h-13 flex flex-wrap items-center gap-1.5 px-3 py-1.5 cursor-text\"\r\n )}\r\n >\r\n {/* Chips inside the input box */}\r\n <ComboboxChips\r\n className={cn(\r\n \"contents\",\r\n maxVisible !== undefined && \"flex-nowrap overflow-hidden\"\r\n )}\r\n >\r\n <ComboboxValue>\r\n {(value: Value[]) => {\r\n const visible = maxVisible !== undefined ? value.slice(0, maxVisible) : value\r\n const overflow = maxVisible !== undefined ? value.length - maxVisible : 0\r\n return (\r\n <>\r\n {visible?.map((item) => (\r\n <ComboboxChipUI\r\n key={item?.value || \"\"}\r\n className={cn(maxVisible !== undefined && \"min-w-0 shrink\")}\r\n >\r\n {item?.image && (\r\n <img\r\n src={item.image}\r\n alt={item?.label || \"\"}\r\n className=\"size-4 rounded-full object-cover shrink-0 mr-1\"\r\n />\r\n )}\r\n {maxVisible !== undefined\r\n ? <span className=\"truncate\">{item?.label || \"\"}</span>\r\n : (item?.label || \"\")\r\n }\r\n <ComboboxChipRemove />\r\n </ComboboxChipUI>\r\n ))}\r\n {overflow > 0 && (\r\n <ComboboxChipUI className=\"shrink-0\">\r\n +{overflow}\r\n </ComboboxChipUI>\r\n )}\r\n </>\r\n )\r\n }}\r\n </ComboboxValue>\r\n {/* Text input — shrinks to fit remaining space (inside Chips so backspace works) */}\r\n <ComboboxInputPrimitive\r\n render={\r\n <input\r\n className=\"flex-1 min-w-[80px] bg-transparent outline-none text-body-regular-1 text-text-primary placeholder:text-text-placeholder\"\r\n placeholder={value.length === 0 ? inputPlaceholder : undefined}\r\n />\r\n }\r\n />\r\n </ComboboxChips>\r\n </ComboboxInputGroup>\r\n\r\n <ComboboxPopup container={container}>\r\n <ComboboxStatus\r\n status={\r\n isPending || items === undefined\r\n ? \"pending\"\r\n : items?.length === 0 && !isCreatingItem\r\n ? \"empty\"\r\n : null\r\n }\r\n />\r\n <ComboboxList>\r\n {items?.map((item) => (\r\n <ComboboxItem\r\n key={item.value}\r\n value={item as Value}\r\n >\r\n {(item.image !== undefined) && (\r\n <ComboboxItemAvatar\r\n src={item.image}\r\n fallbackText={[item.label?.[0], item.label?.split(\" \")?.[1]?.[0]].filter(Boolean).join(\"\")}\r\n imageAlt={item.label}\r\n />\r\n )}\r\n <ComboboxItemTitle>{item.label}</ComboboxItemTitle>\r\n </ComboboxItem>\r\n ))}\r\n {isCreatingItem && (\r\n <ComboboxItem\r\n value={{ label: trimmedInput, value: trimmedInput, tag: true }}\r\n >\r\n {!isInputSelected && (\r\n <span className=\"text-text-secondary text-body-medium-3 col-start-2\">Create: {trimmedInput}</span>\r\n )}\r\n {isInputSelected && (\r\n <ComboboxItemTitle>{trimmedInput}</ComboboxItemTitle>\r\n )}\r\n </ComboboxItem>\r\n )}\r\n <ComboboxInfiniteScroll {...infiniteScroll} />\r\n </ComboboxList>\r\n </ComboboxPopup>\r\n </Combobox>\r\n )\r\n}\r\n\r\nexport { ComboboxChip }\r\nexport type { ComboboxChipProps }\r\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/composites/combobox-chip.tsx"],"names":["ComboboxChip","multiple","inputPlaceholder","container","items","infiniteScroll","isPending","taggable","maxVisible","props","inputValue","setInputValue","useControlledState","value","setValue","createdItems","setCreatedItems","createdValuesRef","currentValues","v","prev","next","item","trimmedInput","isInputSelected","isCreatingItem","combinedItems","base","jsxs","Combobox","a","b","eventDetails","newTags","tag","jsx","ComboboxInputGroup","cn","inputVariants","ComboboxChips","ComboboxValue","visible","overflow","Fragment","ComboboxChipRemove","ComboboxInput","ComboboxPopup","ComboboxStatus","ComboboxList","ComboboxItem","ComboboxItemAvatar","ComboboxItemTitle","ComboboxInfiniteScroll"],"mappings":"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","file":"chunk-RAVBRPQS.js","sourcesContent":["import * as React from \"react\"\r\n\r\nimport { cn } from \"@xploreu/lib/cn\"\r\nimport {\r\n ComboboxInput as ComboboxInputPrimitive,\r\n ComboboxInputGroup,\r\n} from \"../primitives/combobox\"\r\nimport {\r\n Combobox,\r\n ComboboxChip as ComboboxChipUI,\r\n ComboboxChipRemove,\r\n ComboboxChips,\r\n ComboboxInfiniteScroll,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxPortal,\r\n ComboboxPopup,\r\n ComboboxStatus,\r\n ComboboxValue,\r\n type ComboboxProps,\r\n ComboboxItemTitle,\r\n ComboboxItemAvatar\r\n} from \"../ui/combobox\"\r\nimport { useControlledState } from \"@xploreu/hooks/use-controlled-state\"\r\nimport { inputVariants } from \"../ui/input\"\r\n\r\ntype ComboboxChipProps<Value extends { label: string; value: string; image?: string; tag?: true }> = Omit<ComboboxProps<Value, true>, \"multiple\" | \"items\"> & {\r\n multiple?: boolean\r\n inputPlaceholder?: string\r\n container?: React.ComponentProps<typeof ComboboxPortal>[\"container\"]\r\n items?: Value[] | undefined\r\n infiniteScroll?: React.ComponentProps<typeof ComboboxInfiniteScroll>\r\n isPending?: boolean\r\n /**\r\n * When true, enables creatable / taggable mode.\r\n * If the typed value has no exact match in the current item list,\r\n * a \"Create \\\"…\\\"\" option is shown at the top of the dropdown.\r\n * Created items are appended to the value with `{ label, value, tag: true }`.\r\n */\r\n taggable?: boolean\r\n /**\r\n * Maximum number of chips to show before collapsing the rest into a \"+N\" chip.\r\n * When undefined, all chips are shown.\r\n */\r\n maxVisible?: number\r\n}\r\n\r\nfunction ComboboxChip<Value extends { label: string; value: string; image?: string; tag?: true }>({\r\n multiple = true,\r\n inputPlaceholder = \"Search...\",\r\n container,\r\n items,\r\n infiniteScroll,\r\n isPending,\r\n taggable = false,\r\n maxVisible,\r\n ...props\r\n}: ComboboxChipProps<Value>) {\r\n const [inputValue, setInputValue] = useControlledState({\r\n value: props?.inputValue?.toString(),\r\n defaultValue: props?.defaultInputValue?.toString(),\r\n onChange: props?.onInputValueChange,\r\n })\r\n\r\n const [value, setValue] = useControlledState({\r\n value: props?.value ?? [],\r\n defaultValue: props?.defaultValue ?? [],\r\n onChange: props?.onValueChange,\r\n })\r\n\r\n // Track items created via taggable mode\r\n // Sync with value to avoid stale tags when controlled value is reset from outside\r\n const [createdItems, setCreatedItems] = React.useState<Value[]>([])\r\n const createdValuesRef = React.useRef<Set<string>>(new Set())\r\n\r\n React.useEffect(() => {\r\n const currentValues = new Set(value.map((v) => v.value))\r\n setCreatedItems((prev) => {\r\n const next = prev.filter((item) => currentValues.has(item.value))\r\n if (next.length === prev.length) return prev\r\n createdValuesRef.current = new Set(next.map((v) => v.value))\r\n return next\r\n })\r\n }, [value])\r\n\r\n const trimmedInput = inputValue?.toString().trim() ?? \"\"\r\n const isInputSelected = React.useMemo(() => {\r\n if (!trimmedInput) return false\r\n return value.some(\r\n (item) => item.value.toLowerCase() === trimmedInput.toLowerCase()\r\n )\r\n }, [trimmedInput, value])\r\n\r\n // true = show the taggable item in dropdown (either as \"Create:\" or as checked item)\r\n const isCreatingItem = React.useMemo(() => {\r\n if (!taggable || !trimmedInput) return false\r\n return !items?.some(\r\n (item) => item.label.toLowerCase() === trimmedInput.toLowerCase()\r\n )\r\n }, [taggable, trimmedInput, items])\r\n\r\n // Merge server items with locally created tags + the \"Create\" placeholder\r\n const combinedItems = React.useMemo(() => {\r\n const base: Value[] = [\r\n ...items ?? [],\r\n ...createdItems,\r\n ]\r\n\r\n if (isCreatingItem) {\r\n return [...base, { label: trimmedInput, value: trimmedInput, tag: true } as unknown as Value]\r\n }\r\n\r\n return base\r\n }, [items, createdItems, isCreatingItem, trimmedInput])\r\n\r\n const handleValueChange: ComboboxProps<Value, true>[\"onValueChange\"] = (value, eventDetails) => {\r\n if (taggable) {\r\n const newTags = value.filter(\r\n (v) => v?.tag === true && !createdValuesRef.current.has(v.value)\r\n )\r\n if (newTags.length > 0) {\r\n for (const tag of newTags) {\r\n createdValuesRef.current.add(tag.value)\r\n }\r\n setCreatedItems((prev) => [...prev, ...newTags])\r\n }\r\n }\r\n\r\n if (!multiple) {\r\n setValue([value[value.length - 1]], eventDetails)\r\n } else {\r\n setValue(value, eventDetails)\r\n }\r\n }\r\n\r\n return (\r\n <Combobox\r\n {...props}\r\n behavior=\"chip-outside\"\r\n multiple\r\n items={taggable ? combinedItems : items}\r\n isItemEqualToValue={(a, b) => a.value === b.value}\r\n onValueChange={handleValueChange}\r\n onInputValueChange={setInputValue}\r\n >\r\n {/* Input box with chips inside */}\r\n <ComboboxInputGroup\r\n className={cn(\r\n inputVariants(),\r\n \"h-auto min-h-13 flex flex-wrap items-center gap-1.5 px-3 py-1.5 cursor-text\"\r\n )}\r\n >\r\n {/* Chips inside the input box */}\r\n <ComboboxChips\r\n className={cn(\r\n \"contents\",\r\n maxVisible !== undefined && \"flex-nowrap overflow-hidden\"\r\n )}\r\n >\r\n <ComboboxValue>\r\n {(value: Value[]) => {\r\n const visible = maxVisible !== undefined ? value.slice(0, maxVisible) : value\r\n const overflow = maxVisible !== undefined ? value.length - maxVisible : 0\r\n return (\r\n <>\r\n {visible?.map((item) => (\r\n <ComboboxChipUI\r\n key={item?.value || \"\"}\r\n className={cn(maxVisible !== undefined && \"min-w-0 shrink\")}\r\n >\r\n {item?.image && (\r\n <img\r\n src={item.image}\r\n alt={item?.label || \"\"}\r\n className=\"size-4 rounded-full object-cover shrink-0 mr-1\"\r\n />\r\n )}\r\n {maxVisible !== undefined\r\n ? <span className=\"truncate\">{item?.label || \"\"}</span>\r\n : (item?.label || \"\")\r\n }\r\n <ComboboxChipRemove />\r\n </ComboboxChipUI>\r\n ))}\r\n {overflow > 0 && (\r\n <ComboboxChipUI className=\"shrink-0\">\r\n +{overflow}\r\n </ComboboxChipUI>\r\n )}\r\n </>\r\n )\r\n }}\r\n </ComboboxValue>\r\n {/* Text input — shrinks to fit remaining space (inside Chips so backspace works) */}\r\n <ComboboxInputPrimitive\r\n render={\r\n <input\r\n className=\"flex-1 min-w-[80px] bg-transparent outline-none text-body-regular-1 text-text-primary placeholder:text-text-placeholder\"\r\n placeholder={value.length === 0 ? inputPlaceholder : undefined}\r\n />\r\n }\r\n />\r\n </ComboboxChips>\r\n </ComboboxInputGroup>\r\n\r\n <ComboboxPopup container={container}>\r\n <ComboboxStatus\r\n status={\r\n isPending || items === undefined\r\n ? \"pending\"\r\n : items?.length === 0 && !isCreatingItem\r\n ? \"empty\"\r\n : null\r\n }\r\n />\r\n <ComboboxList>\r\n {items?.map((item) => (\r\n <ComboboxItem\r\n key={item.value}\r\n value={item as Value}\r\n >\r\n {(item.image !== undefined) && (\r\n <ComboboxItemAvatar\r\n src={item.image}\r\n fallbackText={[item.label?.[0], item.label?.split(\" \")?.[1]?.[0]].filter(Boolean).join(\"\")}\r\n imageAlt={item.label}\r\n />\r\n )}\r\n <ComboboxItemTitle>{item.label}</ComboboxItemTitle>\r\n </ComboboxItem>\r\n ))}\r\n {isCreatingItem && (\r\n <ComboboxItem\r\n value={{ label: trimmedInput, value: trimmedInput, tag: true }}\r\n >\r\n {!isInputSelected && (\r\n <span className=\"text-text-secondary text-body-medium-3 col-start-2\">Create: {trimmedInput}</span>\r\n )}\r\n {isInputSelected && (\r\n <ComboboxItemTitle>{trimmedInput}</ComboboxItemTitle>\r\n )}\r\n </ComboboxItem>\r\n )}\r\n <ComboboxInfiniteScroll {...infiniteScroll} />\r\n </ComboboxList>\r\n </ComboboxPopup>\r\n </Combobox>\r\n )\r\n}\r\n\r\nexport { ComboboxChip }\r\nexport type { ComboboxChipProps }\r\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {c,d,e,f,g,a,h,i,j,k,l,m,n,o,p,q,r,s,E,t,u,v,w,x,y,z,A,B,C,D}from'./chunk-HHG7BSWN.js';import {a as a$3}from'./chunk-TED2PUK6.js';import {b}from'./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import {c,d,e,f,g,a,h,i,j,k,l,m,n,o,p,q,r,s,E,t,u,v,w,x,y,z,A,B,C,D}from'./chunk-HHG7BSWN.js';import {a as a$3}from'./chunk-TED2PUK6.js';import {b}from'./chunk-Y6TKCAAJ.js';import {a as a$1}from'./chunk-7P4PFMCM.js';import {a as a$2}from'./chunk-XG3W7QMP.js';import {b as b$2,c as c$1,d as d$1}from'./chunk-BES6JPWQ.js';import {b as b$1,e as e$1}from'./chunk-JLZNZFOO.js';import'react';import {SearchIcon,XIcon,Loader2Icon,CheckCircle2Icon}from'lucide-react';import {cn}from'@xploreu/lib/cn';import {jsx,jsxs,Fragment}from'react/jsx-runtime';function No(o){return jsx(c,{...o})}function bo(o){let{className:t,...r}=o;return jsx(d,{className:cn("group/combobox-trigger flex items-center gap-2",t),...r})}function wo(o){let{className:t,...r}=o;return jsx(e,{className:cn("text-label-semibold-2 text-text-secondary",t),...r})}function ko(o){let{className:t,...r}=o;return jsx(f,{className:cn("flex w-full items-center gap-2",t),...r})}function Lo({className:o,wrapperClassName:t,...r}){return jsx("div",{className:cn("p-3 border-b border-border-primary",t),children:jsx(g,{className:o,render:jsx(b,{size:"sm",startContent:jsx(SearchIcon,{})}),...r})})}function Ro({className:o,displayValueKey:t={label:"label",value:"value"},placeholder:r="Search and Select Company",inputProps:m,...i}){let{inputValue:s,setInputValue:p}=a(),{className:n,startContent:x,...to}=m||{};return jsx("div",{className:cn("flex flex-col gap-2",o),children:jsxs(mo,{onMouseDown:C=>C.preventBaseUIHandler(),className:"flex-col",children:[jsx(g,{render:jsx(b,{className:cn("h-9 text-body-regular-3 pl-9 pr-7",n),endContent:jsx(bo,{nativeButton:false,render:jsx(XIcon,{className:"!size-5 !right-1.5 data-[hidden=true]:opacity-0 opacity-100 transition-opacity duration-300 cursor-pointer","data-hidden":!s,"data-slot":"combobox-clear-input",onClick:C=>{p("",{reason:"none",event:C.nativeEvent,cancel:()=>{},allowPropagation:()=>{},isCanceled:false,isPropagationAllowed:true,trigger:void 0});}})}),placeholder:r,startContent:x??jsx(SearchIcon,{className:"!size-4 !text-fg-tertiary-hover"}),...to}),...i}),jsx(io,{children:C=>C?.map(y=>jsxs(so,{children:[y?.[t.label]||"",jsx(po,{})]},y?.[t.value]||""))})]})})}function So(o){let{className:t,...r}=o;return jsx(h,{className:cn("text-text-secondary",t),...r})}function Go(o){return jsx(i,{render:jsx(XIcon,{}),...o})}function io(o){return jsx(j,{...o})}function mo({className:o,...t}){return jsx(k,{className:cn("flex flex-wrap gap-2",o),...t})}function so({className:o,...t}){return jsx(b$1,{className:cn("ring-1 ring-border-brand text-body-medium-3",o),color:"brand",render:jsx(l,{...t}),size:"lg"})}function po({className:o,...t}){return jsx(e$1,{className:cn("text-fg-quaternary",o),render:jsx(m,{...t})})}function Ao({className:o$1,align:t="start",sideOffset:r=4,container:m,initialFocus:i,finalFocus:s,style:p$1,children:n$1,...x}){return jsx(n,{container:m,children:jsx(o,{align:t,className:"isolate z-50",sideOffset:r,...x,children:jsx(p,{className:cn("group/combobox-popup bg-bg-primary text-text-primary max-h-(--available-height) w-72 max-w-(--available-width) origin-(--transform-origin) rounded-md border border-border-primary shadow-md outline-hidden",o$1),finalFocus:s,initialFocus:i,style:p$1,children:jsx(ao,{children:n$1})})})})}function Ho(o){return jsx(n,{...o})}function Vo(o$1){return jsx(o,{...o$1})}function To(o){let{className:t,...r}=o;return jsx(q,{className:cn("bg-black/30",t),...r})}function zo({className:o,status:t,...r$1}){let{inputValue:m}=a(),i=m?.toString().trim(),p=t==="empty"&&i?`No matches for "${i}".`:t==="empty"&&!i?"No results.":t==="pending"?jsxs(Fragment,{children:[jsx(Loader2Icon,{className:"animate-spin size-4"}),jsx("span",{children:"Searching..."})]}):null;return jsx(r,{className:cn("px-2 py-2.5 text-body-regular-2 text-text-disabled flex items-center gap-2",!p&&"hidden",o),...r$1,children:p})}function Bo({className:o,...t}){return jsx(s,{className:cn("px-3 py-2 text-body-regular-2 text-text-secondary",o),...t})}function Eo({className:o,children:t$1,...r}){let m=E();return jsx(a$1,{size:"sm",viewportRender:jsx(t,{className:cn("max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] flex flex-col p-1 focus-visible:outline-none data-[empty]:hidden",o),...r,children:typeof t$1=="function"?(i,s)=>t$1(i,s,m.length):t$1})})}function ao(o){let{className:t,...r}=o;return jsx(u,{className:cn("absolute inset-0 bg-bg-primary-hover",t),...r})}function no(o){return jsx(v,{...o})}function Fo(o){let{className:t,...r}=o;return jsx(w,{className:cn("group/combobox-row",t),...r})}function Mo({className:o,children:t,indicator:r="check-circle",...m}){let{disabled:i}=m;return jsx(no,{activeClassName:"bg-bg-primary-hover rounded-md",disabled:i,children:jsxs(x,{"data-indicator":r,className:cn("group/combobox-item relative grid grid-cols-[auto_1fr] items-center gap-x-2 my-px p-xp-md cursor-default outline-none select-none [[data-indicator=check-circle][data-selected]]:pr-8 data-[indicator=checkbox]:pl-8",o),...m,children:[t,jsx(xo,{className:"absolute group-data-[indicator=check-circle]/combobox-item:right-2 group-data-[indicator=checkbox]/combobox-item:left-2",keepMounted:r==="checkbox",render:(s,p)=>jsxs("span",{...s,children:[r==="check-circle"&&jsx(CheckCircle2Icon,{className:"size-4 text-fg-brand-primary shrink-0"}),r==="checkbox"&&jsx(a$2,{checked:p.selected})]})})]})})}function Do({className:o,...t}){return jsx("span",{"data-slot":"combobox-item-title",className:cn("col-start-2 text-body-medium-3 text-text-primary truncate row-span-2 group-has-[[data-slot=combobox-item-description]]/combobox-item:row-span-1",o),...t})}function Oo({className:o,...t}){return jsx("span",{"data-slot":"combobox-item-description",className:cn("col-start-2 text-body-regular-3 text-text-secondary truncate",o),...t})}function qo({className:o,...t}){return jsx("div",{"data-slot":"combobox-item-icon",className:cn("row-span-2 col-start-1 flex items-center justify-center size-6 rounded-md bg-bg-brand-solid text-fg-white shrink-0 [&_svg]:size-3.5",o),...t})}function _o({src:o,imageSrc:t,className:r,avatarClassName:m,imageAlt:i,fallbackText:s,children:p,...n}){let x=o??t;return jsx("div",{"data-slot":"combobox-item-avatar",className:cn("row-span-2 col-start-1 size-6 rounded-full overflow-hidden shrink-0",r),children:jsxs(b$2,{className:cn("size-full shrink-0",m),...n,children:[jsx(c$1,{alt:i,src:x}),jsx(d$1,{className:"flex aspect-square size-full items-center justify-center bg-bg-tertiary text-label-semibold-2 text-text-quaternary",children:s??p})]})})}function xo(o){return jsx(y,{...o})}function jo(o){let{className:t,...r}=o;return jsx(z,{className:cn("my-1 h-px bg-border-primary",t),...r})}function Uo(o){let{className:t,...r}=o;return jsx(A,{className:cn("py-1",t),...r})}function Xo(o){let{className:t,...r}=o;return jsx(B,{className:cn("px-3 py-1 text-body-semibold-sm text-text-secondary",t),...r})}function $o(o){return jsx(C,{...o})}function Jo(o){let{className:t,...r}=o;return jsx(D,{className:cn("fill-bg-primary",t),...r})}function Ko({hasMore:o,threshold:t=.5,...r}){return jsx(a$3,{hasMore:o,threshold:t,...r,children:o&&jsxs("div",{className:"px-2 py-2.5 text-body-regular-2 text-text-disabled flex items-center gap-2",children:[jsx(Loader2Icon,{className:"animate-spin size-4"}),jsx("span",{children:"Loading more..."})]})})}export{_o as A,xo as B,jo as C,Uo as D,Xo as E,$o as F,Jo as G,Ko as H,No as a,bo as b,wo as c,ko as d,Lo as e,Ro as f,So as g,Go as h,io as i,mo as j,so as k,po as l,Ao as m,Ho as n,Vo as o,To as p,zo as q,Bo as r,Eo as s,ao as t,no as u,Fo as v,Mo as w,Do as x,Oo as y,qo as z};//# sourceMappingURL=chunk-RHWRIE3E.js.map
|
|
2
|
+
//# sourceMappingURL=chunk-RHWRIE3E.js.map
|