love-ui 1.2.9 → 1.2.11

package/dist/index.js

@@ -1,9 +1,15 @@
 #!/usr/bin/env node
-import{spawnSync as I}from"child_process";import{existsSync as $}from"fs";import{mkdir as A,readdir as z,readFile as P,writeFile as S}from"fs/promises";import c from"path";import{pathToFileURL as J,fileURLToPath as B}from"url";var M=c.dirname(B(import.meta.url)),X=c.resolve(M,".."),W=c.join(X,"packages"),H=new Set([".ts",".tsx",".cts",".mts",".js",".jsx",".css",".scss",".sass",".mdx",".md"]),V=new Set(["node_modules","dist",".turbo",".next","build",".cache"]),U=new Set(["accordion","alert","alert-dialog","autocomplete","avatar","badge","breadcrumb","button","card","checkbox","checkbox-group","collapsible","combobox","command","dialog","empty","field","fieldset","form","frame","group","input","label","menu","meter","number-field","pagination","popover","preview-card","progress","radio-group","scroll-area","select","separator","sheet","skeleton","slider","switch","table","tabs","textarea","toast","toggle","toggle-group","toolbar","tooltip"]);function N(e){if(!e)return e;let t=e.split("/");return t[t.length-1]||e}function Y(e){let t=e.trim();return t&&((t.startsWith("@/")||t.startsWith("~/"))&&(t=`src/${t.slice(2)}`),t.startsWith("/")&&(t=t.slice(1)),t=t.replace(/^\.\//,""),t=t.replace(/\/+$/,""),t)}function _(e){let t=N(e);return t==="ui"?"love-ui":t}function q(e){let t=e.loveui??{},n=typeof t.target=="string"?t.target.trim():"",s=t.category;if(n){let i=typeof t.includePackageName=="boolean"?t.includePackageName:!1;return{base:n.replace(/\/+$/,""),includePackageName:i}}return s==="feature"?{base:"components",includePackageName:!0}:s==="block"?{base:"components/blocks",includePackageName:!0}:{base:"components/ui",includePackageName:!0}}function G(e,t,n){let s=e.startsWith("src/")?e.slice(4):e;if(!t.includePackageName){let f=t.base.split("/").filter(Boolean),p=f[f.length-1];p&&s.startsWith(`${p}/`)&&(s=s.slice(p.length+1))}let l=`${(t.includePackageName?`${t.base}/${n}`:t.base).replace(/\/+/g,"/")}/${s}`.replace(/\/+/g,"/");return{cleanedPath:s,target:l}}async function K(e){let t=c.join(e,"components.json");try{let n=await P(t,"utf8"),i=JSON.parse(n).aliases?.components;return i?Y(i):null}catch{return null}}async function Q(e){let t=["tsconfig.json","jsconfig.json"].map(n=>c.join(e,n)).find(n=>$(n));if(t)try{let n=await P(t,"utf8"),i=JSON.parse(n).compilerOptions?.paths;if(i&&typeof i=="object")for(let a of Object.keys(i)){let l=i[a];if(a==="@/*"&&Array.isArray(l)&&l.some(f=>f.startsWith("src/")||f.startsWith("./src/")))return"src/components";if(a==="@/*"&&Array.isArray(l)&&l.some(f=>f.startsWith("app/")||f.startsWith("./app/")))return"app/components"}}catch{}return $(c.join(e,"src"))?"src/components":$(c.join(e,"app"))?"app/components":"components"}function T(e,t,n){let s=a=>{let l=a.startsWith("/"),f=a.endsWith("/"),p=a.split("/").filter(Boolean),m=[];for(let k of p)m[m.length-1]!==k&&m.push(k);let u=m.join("/");return`${l?"/":""}${u}${f?"/":""}`};if(n)return s(e);let i=t.replace(/\/+$/,"");if(e.startsWith("components/")){let a=e.slice(10);return s(`${i}${a}`.replace(/^\//,""))}if(e.startsWith("lib/")){if(i.startsWith("src/"))return s(`src/${e}`);if(i.startsWith("app/"))return s(`app/${e}`)}if(e.startsWith("hooks/")){if(i.startsWith("src/"))return s(`src/${e}`);if(i.startsWith("app/"))return s(`app/${e}`)}return e.startsWith("ui/")?s(`${i}/${e}`):s(e)}async function E(e,t){let n=c.dirname(c.join(t,e));await A(n,{recursive:!0})}async function Z(e,t){let n=c.join(e,"package.json"),s={};try{let p=await P(n,"utf8");s=JSON.parse(p)}catch{}let i=q(s),a=N(t),l=[];async function f(p,m){let u=await z(p,{withFileTypes:!0});for(let k of u){if(V.has(k.name))continue;let j=c.join(p,k.name);if(k.isDirectory()){await f(j,m);continue}let x=c.extname(k.name);if(!H.has(x)||k.name==="package.json")continue;let R=c.relative(m,j).split(c.sep).join("/"),{target:v}=G(R,i,a),F=await P(j,"utf8");l.push({path:R,target:v,content:F})}}return await f(e,e),l}async function ee(e){let t=c.join(W,"love-ui"),n=c.join(t,"src","ui",`${e}.tsx`);if(!$(n))return null;try{let s=[],i=await P(n,"utf8");i=i.replace(/from\s+["']@loveui\/ui\/lib\/utils["']/g,'from "@/lib/utils"'),s.push({path:`src/ui/${e}.tsx`,target:`components/ui/${e}.tsx`,content:i});let a=c.join(t,"src","lib","utils.ts");if($(a)){let l=await P(a,"utf8");s.push({path:"src/lib/utils.ts",target:"lib/utils.ts",content:l})}return s}catch(s){return console.warn(`Warning: unable to read ${e} component`,s),null}}async function te(e){if(U.has(e))return await ee(e);let t=_(e),n=c.join(W,t);if(!$(n))return null;try{return await Z(n,e)}catch(s){return console.warn(`Warning: unable to read bundled sources for ${e}`,s),null}}var ne={"@base-ui-components/react":"1.0.0-beta.4","class-variance-authority":"^0.7.1",clsx:"^2.1.1","tailwind-merge":"^3.3.1"};async function se(e){if(U.has(e))return{...ne};let t=_(e),n=c.join(W,t,"package.json");try{let s=await P(n,"utf8");return JSON.parse(s).dependencies??{}}catch{return{}}}async function ie(e){return $(c.join(e,"bun.lockb"))?"bun":$(c.join(e,"pnpm-lock.yaml"))?"pnpm":$(c.join(e,"yarn.lock"))?"yarn":"npm"}async function re(e,t,n){let s=Object.entries(e);if(s.length===0)return!0;console.log(`
-Installing dependencies...`);let i=s.map(([f,p])=>`${f}@${p}`),a;switch(t){case"bun":a=`bun add ${i.join(" ")}`;break;case"pnpm":a=`pnpm add ${i.join(" ")}`;break;case"yarn":a=`yarn add ${i.join(" ")}`;break;default:a=`npm install ${i.join(" ")}`}let l=I(a,{stdio:"inherit",shell:!0,cwd:n});return l.error||l.status!==0?(console.warn(`
-Failed to install dependencies. You may need to install them manually:`),console.warn(`  ${i.join(`
+import{spawnSync as Y}from"child_process";import{existsSync as p}from"fs";import{mkdir as O,readdir as q,readFile as j,writeFile as A}from"fs/promises";import a from"path";import{pathToFileURL as K,fileURLToPath as Q}from"url";var Z=a.dirname(Q(import.meta.url)),tt=a.resolve(Z,".."),E=a.join(tt,"packages"),et=new Set([".ts",".tsx",".cts",".mts",".js",".jsx",".css",".scss",".sass",".mdx",".md"]),nt=new Set(["node_modules","dist",".turbo",".next","build",".cache"]),B=new Set(["accordion","alert","alert-dialog","autocomplete","avatar","badge","breadcrumb","button","card","checkbox","checkbox-group","collapsible","combobox","command","dialog","empty","field","fieldset","form","frame","group","input","label","menu","meter","number-field","pagination","popover","preview-card","progress","radio-group","scroll-area","select","separator","sheet","skeleton","slider","switch","table","tabs","textarea","toast","toggle","toggle-group","toolbar","tooltip"]),st=[".ts",".tsx",".js",".jsx"],J=/(^|\/)lib\/utils(?:\.[a-z]+)?$/i,it=/@loveui\/ui\/lib\/utils|@loveui\/shadcn-ui\/lib\/utils|@love-ui\/shadcn-ui\/lib\/utils|@\/lib\/utils|~\/lib\/utils|(?:\.\.\/)+ui\/src\/lib\/utils/,rt=`import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
+`;function V(t){if(!t)return t;let e=t.split("/");return e[e.length-1]||t}function X(t){let e=t.trim();return e&&((e.startsWith("@/")||e.startsWith("~/"))&&(e=`src/${e.slice(2)}`),e.startsWith("/")&&(e=e.slice(1)),e=e.replace(/^\.\//,""),e=e.replace(/\/+$/,""),e)}function ot(t){return t.trim().replace(/\/+$/,"")}function k(t){return t.replace(/\.(?:ts|tsx|js|jsx)$/i,"")}function z(t){let e=k(t);return st.map(s=>`${e}${s}`)}function at(t){let e=t.replace(/\/+$/,"");return e==="src"||e.startsWith("src/")?"src":e==="app"||e.startsWith("app/")?"app":null}function G(t){let e=V(t);return e==="ui"?"love-ui":e}function ct(t){let e=t.loveui??{},s=typeof e.target=="string"?e.target.trim():"",n=e.category;if(s){let r=typeof e.includePackageName=="boolean"?e.includePackageName:!1;return{base:s.replace(/\/+$/,""),includePackageName:r}}return n==="feature"?{base:"components",includePackageName:!0}:n==="block"?{base:"components/blocks",includePackageName:!0}:{base:"components/ui",includePackageName:!0}}function lt(t,e,s){let n=t.startsWith("src/")?t.slice(4):t;if(!e.includePackageName){let d=e.base.split("/").filter(Boolean),u=d[d.length-1];u&&n.startsWith(`${u}/`)&&(n=n.slice(u.length+1))}let c=`${(e.includePackageName?`${e.base}/${s}`:e.base).replace(/\/+/g,"/")}/${n}`.replace(/\/+/g,"/");return{cleanedPath:n,target:c}}async function ut(t){let e=a.join(t,"components.json");try{let s=await j(e,"utf8");return JSON.parse(s).aliases??null}catch{return null}}async function gt(t){let e=["tsconfig.json","jsconfig.json"].map(s=>a.join(t,s)).find(s=>p(s));if(!e)return null;try{let s=await j(e,"utf8"),r=JSON.parse(s).compilerOptions?.paths;return!r||typeof r!="object"?null:r}catch{return null}}function pt(t,e){if(typeof t=="string"){if(t.trim().startsWith("~/"))return"~/";if(t.trim().startsWith("@/"))return"@/"}if(e){if(Object.prototype.hasOwnProperty.call(e,"~/*"))return"~/";if(Object.prototype.hasOwnProperty.call(e,"@/*"))return"@/"}return"@/"}async function ft(t,e,s){if(e&&e.length>0)return e;let n=["src/components/ui","app/components/ui","components/ui"];for(let i of n)if(p(a.join(t,i)))return i.replace(/\/ui$/,"");let r=["src/components","app/components","components"];for(let i of r)if(p(a.join(t,i)))return i;if(s){let i=s["@/*"]??s["~/*"]??[];if(Array.isArray(i)&&i.some(c=>/^\.?\/?src\//.test(c)))return"src/components";if(Array.isArray(i)&&i.some(c=>/^\.?\/?app\//.test(c)))return"app/components"}return p(a.join(t,"src"))?"src/components":p(a.join(t,"app"))?"app/components":"components"}async function dt(t,e,s,n){let r=n?.utils??(n?.lib?`${n.lib.replace(/\/+$/,"")}/utils`:void 0);if(r&&r.trim().length>0){let u=k(ot(r)),f=k(X(r));for(let w of z(f))if(p(a.join(t,w)))return{utilsImportPath:u,utilsFilePath:w};return{utilsImportPath:u,utilsFilePath:`${f}.ts`}}let i=at(e),c=i?`${i}/lib/utils`:"lib/utils",d=Array.from(new Set([c,"src/lib/utils","app/lib/utils","lib/utils"]));for(let u of d)for(let f of z(u))if(p(a.join(t,f)))return{utilsImportPath:`${s}lib/utils`,utilsFilePath:f};return{utilsImportPath:`${s}lib/utils`,utilsFilePath:`${c}.ts`}}function M(t,e,s){let n=c=>{let d=c.startsWith("/"),u=c.endsWith("/"),f=c.split("/").filter(Boolean),w=[];for(let $ of f)w[w.length-1]!==$&&w.push($);let x=w.join("/");return`${d?"/":""}${x}${u?"/":""}`},r=e.replace(/\/+$/,""),i=t.replace(/^\.?\//,"");if(J.test(i))return n(s);if(i.startsWith("components/")){let c=i.slice(10);return n(`${r}${c}`.replace(/^\//,""))}if(i.startsWith("lib/")){if(r.startsWith("src/"))return n(`src/${i}`);if(r.startsWith("app/"))return n(`app/${i}`)}if(i.startsWith("hooks/")){if(r.startsWith("src/"))return n(`src/${i}`);if(r.startsWith("app/"))return n(`app/${i}`)}return i.startsWith("ui/")?n(`${r}/${i}`):n(i)}function _(t,e){let s=e.startsWith("~/")?"~/":"@/",n=t;return n=n.replace(/@\/registry\/building-blocks\/default\/components\//g,`${s}components/`),n=n.replace(/@\/registry\/building-blocks\/default\/ui\//g,`${s}components/ui/`),n=n.replace(/@\/registry\/building-blocks\/default\/lib\//g,`${s}lib/`),n=n.replace(/@\/registry\/building-blocks\/default\/hooks\//g,`${s}hooks/`),n=n.replace(/@\/registry\/default\/components\//g,`${s}components/`),n=n.replace(/@\/registry\/default\/ui\//g,`${s}components/ui/`),n=n.replace(/@\/registry\/default\/lib\//g,`${s}lib/`),n=n.replace(/@\/registry\/default\/hooks\//g,`${s}hooks/`),n=n.replace(/from\s+["']@loveui\/ui\/lib\/utils["']/g,`from "${e}"`),n=n.replace(/from\s+["']@loveui\/shadcn-ui\/lib\/utils["']/g,`from "${e}"`),n=n.replace(/from\s+["']@love-ui\/shadcn-ui\/lib\/utils["']/g,`from "${e}"`),n=n.replace(/from\s+["']@\/lib\/utils["']/g,`from "${e}"`),n=n.replace(/from\s+["']~\/lib\/utils["']/g,`from "${e}"`),n=n.replace(/from\s+["'](?:\.\.\/)+ui\/src\/lib\/utils["']/g,`from "${e}"`),n}async function mt(t,e){if(p(a.join(t,e)))return!1;let s=rt,n=a.join(E,"love-ui","src","lib","utils.ts");if(p(n))try{s=await j(n,"utf8")}catch{}return await L(e,t),await A(a.join(t,e),s,"utf8"),!0}async function L(t,e){let s=a.dirname(a.join(e,t));await O(s,{recursive:!0})}async function ht(t,e){let s=a.join(t,"package.json"),n={};try{let u=await j(s,"utf8");n=JSON.parse(u)}catch{}let r=ct(n),i=V(e),c=[];async function d(u,f){let w=await q(u,{withFileTypes:!0});for(let x of w){if(nt.has(x.name))continue;let $=a.join(u,x.name);if(x.isDirectory()){await d($,f);continue}let P=a.extname(x.name);if(!et.has(P)||x.name==="package.json")continue;let g=a.relative(f,$).split(a.sep).join("/"),{target:v}=lt(g,r,i),R=await j($,"utf8");c.push({path:g,target:v,content:R})}}return await d(t,t),c}async function yt(t,e){let s=a.join(E,"love-ui"),n=a.join(s,"src","ui",`${t}.tsx`);if(!p(n))return null;try{let r=[],i=await j(n,"utf8");i=_(i,e),r.push({path:`src/ui/${t}.tsx`,target:`components/ui/${t}.tsx`,content:i});let c=a.join(s,"src","lib","utils.ts");if(p(c)){let d=await j(c,"utf8");r.push({path:"src/lib/utils.ts",target:"lib/utils.ts",content:d})}return r}catch(r){return console.warn(`Warning: unable to read ${t} component`,r),null}}async function bt(t,e){if(B.has(t))return await yt(t,e);let s=G(t),n=a.join(E,s);if(!p(n))return null;try{return await ht(n,t)}catch(r){return console.warn(`Warning: unable to read bundled sources for ${t}`,r),null}}var $t={"@base-ui-components/react":"1.0.0-beta.4","class-variance-authority":"^0.7.1",clsx:"^2.1.1","tailwind-merge":"^3.3.1"};async function wt(t){if(B.has(t))return{...$t};let e=G(t),s=a.join(E,e,"package.json");try{let n=await j(s,"utf8");return JSON.parse(n).dependencies??{}}catch{return{}}}async function Pt(t){return p(a.join(t,"bun.lockb"))?"bun":p(a.join(t,"pnpm-lock.yaml"))?"pnpm":p(a.join(t,"yarn.lock"))?"yarn":"npm"}async function jt(t,e,s){let n=Object.entries(t);if(n.length===0)return!0;console.log(`
+Installing dependencies...`);let r=n.map(([d,u])=>`${d}@${u}`),i;switch(e){case"bun":i=`bun add ${r.join(" ")}`;break;case"pnpm":i=`pnpm add ${r.join(" ")}`;break;case"yarn":i=`yarn add ${r.join(" ")}`;break;default:i=`npm install ${r.join(" ")}`}let c=Y(i,{stdio:"inherit",shell:!0,cwd:s});return c.error||c.status!==0?(console.warn(`
+Failed to install dependencies. You may need to install them manually:`),console.warn(`  ${r.join(`
   `)}`),!1):(console.log(`Dependencies installed successfully!
-`),!0)}async function oe(e=process.argv.slice(2)){(e.length===0||e.length===1&&(e[0]==="--version"||e[0]==="-v"))&&(console.log("love-ui version 1.1.9"),process.exit(0)),(e.length<2||e[0]!=="add")&&(console.log("Usage: npx love-ui add [...packages]"),console.log("       npx love-ui --version"),process.exit(1));let t=e.slice(1),n=process.cwd(),s=await K(n),i=await Q(n),a=s??i,l=s!==null,f=await ie(n),p={};for(let m of t){if(!m.trim())continue;console.log(`
-Adding ${m}...`);let u=null,k=null;if(m.startsWith("http://")||m.startsWith("https://")){let r=m;r.includes("/building-blocks/r/")&&(r=r.replace("/building-blocks/r/","/building-blocks/"),console.log(`Auto-corrected URL to: ${r}`));try{let o=await fetch(r);o.ok?u=await o.json():console.warn(`Failed to fetch ${r}: HTTP ${o.status}`)}catch(o){console.warn(`Failed to fetch from ${r}:`,o)}}else{let r=new URL(`r/${m}.json`,"https://www.loveui.dev/");try{let o=await fetch(r);o.ok&&(u=await o.json())}catch{}k=await te(m)}let j=k??u?.files??[];j=j.map(r=>{let o=r.target||r.path;return o.startsWith("registry/default/")&&(o=o.replace("registry/default/","")),{...r,target:o}});let x=j.find(r=>r.target.match(/^components\/comp-\d+\.tsx$/));if(x){let r=j.filter(o=>o.target.match(/^components\/[^/]+\//)&&o.target!==x.target);if(r.length>0&&r[0]){let o=r[0].target.match(/^components\/([^/]+)\//);if(o&&o[1]){let h=o[1];x.target=`components/${h}-demo.tsx`}}else if(u?.meta?.tags&&Array.isArray(u.meta.tags)&&u.meta.tags.length>0){let h=u.meta.tags.slice(0,2).filter(b=>b.length>0);if(h.length>0){let b=h.join("-").toLowerCase().replace(/\s+/g,"-");x.target=`components/${b}.tsx`}}}if(!j.length){console.warn(`Component "${m}" not found. Available components can be found at https://loveui.dev`);continue}l||await A(c.join(n,a),{recursive:!0});let R=0,v=0;for(let r of j){if(!r.content)continue;let o=T(r.target,a,l),h=c.join(n,o),b=$(h),g=r.content;if(g=g.replace(/@\/registry\/building-blocks\/default\/components\//g,"@/components/"),g=g.replace(/@\/registry\/building-blocks\/default\/ui\//g,"@/components/ui/"),g=g.replace(/@\/registry\/building-blocks\/default\/lib\//g,"@/lib/"),g=g.replace(/@\/registry\/building-blocks\/default\/hooks\//g,"@/hooks/"),g=g.replace(/@\/registry\/default\/components\//g,"@/components/"),g=g.replace(/@\/registry\/default\/ui\//g,"@/components/ui/"),g=g.replace(/@\/registry\/default\/lib\//g,"@/lib/"),g=g.replace(/@\/registry\/default\/hooks\//g,"@/hooks/"),b)try{if(await P(h,"utf8")===g)continue}catch{}await E(o,n),await S(h,g,"utf8"),b?v++:R++}if(R>0&&console.log(`\u2713 Created ${R} file${R>1?"s":""}`),v>0&&console.log(`\u2713 Updated ${v} file${v>1?"s":""}`),u?.registryDependencies&&u.registryDependencies.length>0){console.log(`
-Installing ${u.registryDependencies.length} required component${u.registryDependencies.length>1?"s":""}...`);for(let r of u.registryDependencies){let o=r;r.startsWith("https://loveui.dev/building-blocks/r/")&&(o=`https://ui.loveui.dev/ui/r/${r.split("/").pop()}`);try{let h=await fetch(o);if(h.ok){let b=await h.json(),C=(b?.files??[]).map(y=>{let w=y.target||y.path;return w.startsWith("registry/default/")&&(w=w.replace("registry/default/","")),{...y,target:w}});for(let y of C){if(!y.content)continue;let w=T(y.target,a,l),D=c.join(n,w),L=$(D),d=y.content;if(d=d.replace(/@\/registry\/building-blocks\/default\/components\//g,"@/components/"),d=d.replace(/@\/registry\/building-blocks\/default\/ui\//g,"@/components/ui/"),d=d.replace(/@\/registry\/building-blocks\/default\/lib\//g,"@/lib/"),d=d.replace(/@\/registry\/building-blocks\/default\/hooks\//g,"@/hooks/"),d=d.replace(/@\/registry\/default\/components\//g,"@/components/"),d=d.replace(/@\/registry\/default\/ui\//g,"@/components/ui/"),d=d.replace(/@\/registry\/default\/lib\//g,"@/lib/"),d=d.replace(/@\/registry\/default\/hooks\//g,"@/hooks/"),L)try{if(await P(D,"utf8")===d)continue}catch{}await E(w,n),await S(D,d,"utf8")}let O=["@loveui/shadcn-ui","jotai","lucide-react","react","react-dom"];if(b?.dependencies)if(Array.isArray(b.dependencies))b.dependencies.forEach(y=>{O.includes(y)||(p[y]="latest")});else{let y=b.dependencies;Object.keys(y).forEach(w=>{!O.includes(w)&&y[w]&&(p[w]=y[w])})}}else console.warn(`  \u2717 Failed to fetch ${o}: HTTP ${h.status}`)}catch(h){console.warn(`  \u2717 Failed to install ${o}:`,h.message)}}console.log("\u2713 Installed registry dependencies")}let F={};u?.dependencies?Array.isArray(u.dependencies)?u.dependencies.forEach(r=>{F[r]="latest"}):F=u.dependencies:F=await se(m),Object.assign(p,F)}Object.keys(p).length>0&&await re(p,f,n),console.log(`
-\u2713 Done! You can now import and use the components in your app.`)}var ae=process.argv[1]&&(import.meta.url===J(process.argv[1]).href||process.argv[1].includes("love-ui")||process.argv[1].includes("loveui"));ae&&oe().catch(e=>{console.error(e),process.exit(1)});export{oe as run};
+`),!0)}async function xt(t=process.argv.slice(2)){(t.length===0||t.length===1&&(t[0]==="--version"||t[0]==="-v"))&&(console.log("love-ui version 1.1.9"),process.exit(0)),(t.length<2||t[0]!=="add")&&(console.log("Usage: npx love-ui add [...packages]"),console.log("       npx love-ui --version"),process.exit(1));let e=t.slice(1),s=process.cwd(),n=await ut(s),r=await gt(s),i=n?.components?X(n.components):null,c=await ft(s,i,r),d=pt(n?.components,r),{utilsImportPath:u,utilsFilePath:f}=await dt(s,c,d,n),w=await Pt(s),x=c.endsWith("/ui")?c:`${c}/ui`;await O(a.join(s,c),{recursive:!0}),await O(a.join(s,x),{recursive:!0});let $={};for(let P of e){if(!P.trim())continue;console.log(`
+Adding ${P}...`);let g=null,v=null;if(P.startsWith("http://")||P.startsWith("https://")){let o=P;o.includes("/building-blocks/r/")&&(o=o.replace("/building-blocks/r/","/building-blocks/"),console.log(`Auto-corrected URL to: ${o}`));try{let l=await fetch(o);l.ok?g=await l.json():console.warn(`Failed to fetch ${o}: HTTP ${l.status}`)}catch(l){console.warn(`Failed to fetch from ${o}:`,l)}}else{let o=new URL(`r/${P}.json`,"https://www.loveui.dev/");try{let l=await fetch(o);l.ok&&(g=await l.json())}catch{}v=await bt(P,u)}let R=v??g?.files??[];R=R.map(o=>{let l=o.target||o.path;return l.startsWith("registry/default/")&&(l=l.replace("registry/default/","")),{...o,target:l}});let F=R.find(o=>o.target.match(/^components\/comp-\d+\.tsx$/));if(F){let o=R.filter(l=>l.target.match(/^components\/[^/]+\//)&&l.target!==F.target);if(o.length>0&&o[0]){let l=o[0].target.match(/^components\/([^/]+)\//);if(l&&l[1]){let m=l[1];F.target=`components/${m}-demo.tsx`}}else if(g?.meta?.tags&&Array.isArray(g.meta.tags)&&g.meta.tags.length>0){let m=g.meta.tags.slice(0,2).filter(y=>y.length>0);if(m.length>0){let y=m.join("-").toLowerCase().replace(/\s+/g,"-");F.target=`components/${y}.tsx`}}}if(!R.length){console.warn(`Component "${P}" not found. Available components can be found at https://loveui.dev`);continue}R.some(o=>J.test(o.target)||typeof o.content=="string"&&it.test(o.content))&&await mt(s,f);let T=0,C=0;for(let o of R){if(!o.content)continue;let l=M(o.target,c,f),m=a.join(s,l),y=p(m);if(k(l)===k(f)&&y)continue;let D=_(o.content,u);if(y)try{if(await j(m,"utf8")===D)continue}catch{}await L(l,s),await A(m,D,"utf8"),y?C++:T++}if(T>0&&console.log(`\u2713 Created ${T} file${T>1?"s":""}`),C>0&&console.log(`\u2713 Updated ${C} file${C>1?"s":""}`),g?.registryDependencies&&g.registryDependencies.length>0){console.log(`
+Installing ${g.registryDependencies.length} required component${g.registryDependencies.length>1?"s":""}...`);for(let o of g.registryDependencies){let l=o;o.startsWith("https://loveui.dev/building-blocks/r/")&&(l=`https://ui.loveui.dev/ui/r/${o.split("/").pop()}`);try{let m=await fetch(l);if(m.ok){let y=await m.json(),D=(y?.files??[]).map(h=>{let b=h.target||h.path;return b.startsWith("registry/default/")&&(b=b.replace("registry/default/","")),{...h,target:b}});for(let h of D){if(!h.content)continue;let b=M(h.target,c,f),W=a.join(s,b),N=p(W);if(k(b)===k(f)&&N)continue;let I=_(h.content,u);if(N)try{if(await j(W,"utf8")===I)continue}catch{}await L(b,s),await A(W,I,"utf8")}let S=["@loveui/shadcn-ui","jotai","lucide-react","react","react-dom"];if(y?.dependencies)if(Array.isArray(y.dependencies))y.dependencies.forEach(h=>{S.includes(h)||($[h]="latest")});else{let h=y.dependencies;Object.keys(h).forEach(b=>{!S.includes(b)&&h[b]&&($[b]=h[b])})}}else console.warn(`  \u2717 Failed to fetch ${l}: HTTP ${m.status}`)}catch(m){console.warn(`  \u2717 Failed to install ${l}:`,m.message)}}console.log("\u2713 Installed registry dependencies")}let U={};g?.dependencies?Array.isArray(g.dependencies)?g.dependencies.forEach(o=>{U[o]="latest"}):U=g.dependencies:U=await wt(P),Object.assign($,U)}Object.keys($).length>0&&await jt($,w,s),console.log(`
+\u2713 Done! You can now import and use the components in your app.`)}var Rt=process.argv[1]&&(import.meta.url===K(process.argv[1]).href||process.argv[1].includes("love-ui")||process.argv[1].includes("loveui"));Rt&&xt().catch(t=>{console.error(t),process.exit(1)});export{xt as run};

package/dist/mcp-server.js

@@ -1,2 +1,2 @@
 #!/usr/bin/env node
-import{Server as ge}from"@modelcontextprotocol/sdk/server";var L={name:"love-ui",version:"1.2.8",private:!1,license:"AGPL-3.0-or-later",type:"module",bin:{loveui:"dist/index.js","love-ui":"dist/index.js","loveui-mcp":"dist/mcp-server.js"},files:["dist","packages","*.ts","*.tsx","*.css","*.mdx"],main:"packages/love-ui/index.ts",types:"packages/love-ui/index.ts",exports:{".":{import:"./packages/love-ui/index.ts",require:"./packages/love-ui/index.ts"},"./lib/*":"./packages/love-ui/*","./components/*":"./packages/love-ui/components/*","./shadcn-ui/*":"./packages/shadcn-ui/*","./package.json":"./package.json"},dependencies:{"@modelcontextprotocol/sdk":"^1.18.1",postcss:"^8.5.6","postcss-nested":"^7.0.2"},scripts:{build:"tsup",postbuild:"node ./scripts/copy-packages.mjs",clean:"rimraf dist packages"},devDependencies:{"@types/node":"^20.14.10",rimraf:"^6.0.1",tsup:"^8.5.0"}};import{constants as X}from"fs";import{access as H,readFile as N,readdir as C}from"fs/promises";import D,{extname as W,join as P,relative as V}from"path";import{fileURLToPath as Y}from"url";import A from"postcss";import Q from"postcss-nested";var Z=D.dirname(Y(import.meta.url)),ee=D.resolve(Z,".."),U=D.join(ee,"packages"),te=new Set([".turbo",".next",".git","dist","build","storybook-static","node_modules","__tests__","__mocks__","coverage"]),se=new Set([".ts",".tsx",".js",".jsx",".mjs",".cjs",".json",".css",".scss",".sass",".mdx"]),ne=new Set(["package.json","tsconfig.json","tsconfig.build.json","tsconfig.test.json","README.md",".DS_Store"]),ie=new Set(["shadcn-ui","typescript-config","patterns","loveui","love-ui"]),re=e=>e.replace(/\\/g,"/"),J=async(e,s,t)=>{let n=await C(e,{withFileTypes:!0});for(let i of n){let o=P(e,i.name);if(i.isDirectory()){if(te.has(i.name))continue;await J(o,s,t);continue}let d=W(i.name);!se.has(d)||ne.has(i.name)||i.name.endsWith(".d.ts")||i.name.endsWith(".test.ts")||i.name.endsWith(".test.tsx")||i.name.endsWith(".stories.tsx")||t.push({absolute:o,relative:re(V(s,o))})}},oe=(e,s)=>{let t=e.loveui??{},n=typeof t.target=="string"?t.target.trim():"",i=t.category;if(n.length>0){let o=typeof t.includePackageName=="boolean"?t.includePackageName:!1;return{base:n.replace(/\/+$/,""),includePackageName:o}}return i==="feature"?{base:"components",includePackageName:!0}:i==="block"?{base:"components/blocks",includePackageName:!0}:{base:"components/ui",includePackageName:!0}},ae=e=>{let t=(e.loveui??{}).type;return typeof t=="string"&&t.trim().length>0?t:"registry:ui"},ce=async e=>{try{return await H(e,X.F_OK),!0}catch{return!1}},le=e=>e.startsWith("@loveui/")||e.startsWith("@repo/"),pe=e=>e.replace(/^@repo\//,"").replace(/^@loveui\//,""),G=async()=>(await C(U,{withFileTypes:!0})).filter(s=>s.isDirectory()).map(s=>s.name).filter(s=>!ie.has(s)).sort((s,t)=>s.localeCompare(t)),E=async e=>{let s=P(U,e),t=P(s,"package.json");if(!await ce(t))throw new Error(`Missing package.json for ${e}`);let n=JSON.parse(await N(t,"utf8")),i=ae(n),o=Object.keys(n.dependencies??{}),d=Object.keys(n.peerDependencies??{}),O=Object.keys(n.devDependencies??{}),k=new Set([...o,...d,...O].filter(le).filter(r=>r!=="@loveui/shadcn-ui")),T=[...new Set([...o,...d].filter(r=>!k.has(r)))],_=[...new Set(O.filter(r=>!k.has(r)&&!["@loveui/typescript-config","@types/react","@types/react-dom","typescript"].includes(r)))],w=[];for(let r of k){let m=pe(r);w.push(`https://www.loveui.dev/r/${m}.json`)}let I=[];await J(s,s,I);let u=[],c={},p=oe(n,e);for(let r of I){let m=await N(r.absolute,"utf8"),R=W(r.absolute);if(R===".css"||R===".scss"||R===".sass"){let y=await A([Q]).process(m,{from:void 0});A.parse(y.css).walkAtRules("layer",b=>{let j=`@layer ${b.params}`;c[j]??={},b.walkRules(a=>{if(a.parent&&a.parent.type==="atrule"&&a.parent.name==="media")return;let h=a.selector,l={};a.walkDecls(v=>{l[v.prop]=v.value}),Object.keys(l).length>0&&(c[j][h]=l)}),b.walkAtRules("media",a=>{let h=`@media ${a.params}`,l=c[j];l[h]??={};let v=l[h];a.walkRules($=>{let B=$.selector,x={};$.walkDecls(F=>{x[F.prop]=F.value}),Object.keys(x).length>0&&(v[B]=x)})})});continue}let g=r.relative.startsWith("src/")?r.relative.slice(4):r.relative;if(!p.includePackageName){let y=p.base.split("/").filter(Boolean),f=y[y.length-1];f&&g.startsWith(`${f}/`)&&(g=g.slice(f.length+1))}let q=e.includes("/")?e.split("/").pop()??e:e,z=(p.includePackageName?`${p.base}/${q}`:p.base).replace(/\/+$/,"");u.push({type:i,path:g,target:`${z}/${g}`.replace(/\/+/g,"/"),content:m})}let K=!u.length&&Object.keys(c).length>0?"registry:style":i;return{$schema:"https://ui.shadcn.com/schema/registry-item.json",name:e,type:K,title:n.title??e,description:n.description,author:n.author??"Connor Love <hello@loveconnor.com>",dependencies:T.length?T:void 0,devDependencies:_.length?_:void 0,registryDependencies:w.length?Array.from(new Set(w)):void 0,files:u.length?u:void 0,css:Object.keys(c).length?c:void 0}};var S="loveui://registry/",de=e=>`${S}${e}`;async function ue(){let e=new ge({name:"loveui-mcp",version:L.version??"0.0.0"});e.addResourceProvider({name:"loveui-registry",listResources:async()=>(await G()).map(t=>({uri:de(t),name:t,description:`loveui registry definition for ${t}`,mimeType:"application/json"})),readResource:async s=>{if(!s.startsWith(S))throw new Error(`Unsupported resource URI: ${s}`);let t=s.slice(S.length),n=await E(t);return{contents:[{uri:s,mimeType:"application/json",text:JSON.stringify(n,null,2)}]}}}),e.addTool({name:"get-loveui-package",description:"Fetch a loveui registry definition by package name.",inputSchema:{type:"object",additionalProperties:!1,properties:{name:{type:"string",description:"Package name, e.g. badge"}},required:["name"]},handler:async s=>{let t=s?.name;if(typeof t!="string"||t.trim()==="")throw new Error("Package name is required.");let n=await E(t);return{content:[{type:"text",text:JSON.stringify(n,null,2)}]}}}),await e.start()}ue().catch(e=>{console.error(e),process.exit(1)});
+import{constants as xe}from"fs";import{access as Te,readFile as Q}from"fs/promises";import l from"path";import{fileURLToPath as _e}from"url";import{Server as Ne}from"@modelcontextprotocol/sdk/server/index.js";import{StdioServerTransport as Oe}from"@modelcontextprotocol/sdk/server/stdio.js";import{CallToolRequestSchema as Ae,ErrorCode as u,ListResourceTemplatesRequestSchema as Ce,ListResourcesRequestSchema as Le,ListToolsRequestSchema as $e,McpError as p,ReadResourceRequestSchema as Fe}from"@modelcontextprotocol/sdk/types.js";var F={name:"love-ui",version:"1.2.10",private:!1,license:"AGPL-3.0-or-later",type:"module",bin:{loveui:"dist/index.js","love-ui":"dist/index.js","loveui-mcp":"dist/mcp-server.js"},files:["dist","packages","*.ts","*.tsx","*.css","*.mdx"],main:"packages/love-ui/index.ts",types:"packages/love-ui/index.ts",exports:{".":{import:"./packages/love-ui/index.ts",require:"./packages/love-ui/index.ts"},"./lib/*":"./packages/love-ui/*","./components/*":"./packages/love-ui/components/*","./shadcn-ui/*":"./packages/shadcn-ui/*","./package.json":"./package.json"},dependencies:{"@modelcontextprotocol/sdk":"^1.18.1",postcss:"^8.5.6","postcss-nested":"^7.0.2"},scripts:{build:"tsup",postbuild:"node ./scripts/copy-packages.mjs",clean:"rimraf dist packages"},devDependencies:{"@types/node":"^20.14.10",rimraf:"^6.0.1",tsup:"^8.5.0"}};import{constants as me}from"fs";import{access as ue,readFile as U,readdir as q}from"fs/promises";import x,{extname as W,join as j,relative as ge}from"path";import{fileURLToPath as ye}from"url";import z from"postcss";import fe from"postcss-nested";var he=x.dirname(ye(import.meta.url)),ve=x.resolve(he,".."),G=x.join(ve,"packages"),we=new Set([".turbo",".next",".git","dist","build","storybook-static","node_modules","__tests__","__mocks__","coverage"]),Re=new Set([".ts",".tsx",".js",".jsx",".mjs",".cjs",".json",".css",".scss",".sass",".mdx"]),ke=new Set(["package.json","tsconfig.json","tsconfig.build.json","tsconfig.test.json","README.md",".DS_Store"]),Se=new Set(["shadcn-ui","typescript-config","patterns","loveui","love-ui"]),Ee=e=>e.replace(/\\/g,"/"),H=async(e,t,n)=>{let s=await q(e,{withFileTypes:!0});for(let i of s){let o=j(e,i.name);if(i.isDirectory()){if(we.has(i.name))continue;await H(o,t,n);continue}let a=W(i.name);!Re.has(a)||ke.has(i.name)||i.name.endsWith(".d.ts")||i.name.endsWith(".test.ts")||i.name.endsWith(".test.tsx")||i.name.endsWith(".stories.tsx")||n.push({absolute:o,relative:Ee(ge(t,o))})}},Ie=(e,t)=>{let n=e.loveui??{},s=typeof n.target=="string"?n.target.trim():"",i=n.category;if(s.length>0){let o=typeof n.includePackageName=="boolean"?n.includePackageName:!1;return{base:s.replace(/\/+$/,""),includePackageName:o}}return i==="feature"?{base:"components",includePackageName:!0}:i==="block"?{base:"components/blocks",includePackageName:!0}:{base:"components/ui",includePackageName:!0}},De=e=>{let n=(e.loveui??{}).type;return typeof n=="string"&&n.trim().length>0?n:"registry:ui"},Pe=async e=>{try{return await ue(e,me.F_OK),!0}catch{return!1}},b=e=>e.startsWith("@loveui/")||e.startsWith("@love-ui/")||e.startsWith("@repo/"),be=e=>e.replace(/^@repo\//,"").replace(/^@loveui\//,"").replace(/^@love-ui\//,""),je=new Set(["@loveui/shadcn-ui","@love-ui/shadcn-ui"]),J=async()=>(await q(G,{withFileTypes:!0})).filter(t=>t.isDirectory()).map(t=>t.name).filter(t=>!Se.has(t)).sort((t,n)=>t.localeCompare(n)),K=async e=>{let t=j(G,e),n=j(t,"package.json");if(!await Pe(n))throw new Error(`Missing package.json for ${e}`);let s=JSON.parse(await U(n,"utf8")),i=De(s),o=Object.keys(s.dependencies??{}),a=Object.keys(s.peerDependencies??{}),N=Object.keys(s.devDependencies??{}),oe=new Set([...o,...a,...N].filter(b).filter(r=>!je.has(r))),O=[...new Set([...o,...a].filter(r=>!b(r)))],A=[...new Set(N.filter(r=>!b(r)&&!["@loveui/typescript-config","@types/react","@types/react-dom","typescript"].includes(r)))],S=[];for(let r of oe){let h=be(r);S.push(`https://www.loveui.dev/r/${h}.json`)}let C=[];await H(t,t,C);let f=[],d={},g=Ie(s,e);for(let r of C){let h=await U(r.absolute,"utf8"),E=W(r.absolute);if(E===".css"||E===".scss"||E===".sass"){let v=await z([fe]).process(h,{from:void 0});z.parse(v.css).walkAtRules("layer",I=>{let D=`@layer ${I.params}`;d[D]??={},I.walkRules(c=>{if(c.parent&&c.parent.type==="atrule"&&c.parent.name==="media")return;let R=c.selector,m={};c.walkDecls(k=>{m[k.prop]=k.value}),Object.keys(m).length>0&&(d[D][R]=m)}),I.walkAtRules("media",c=>{let R=`@media ${c.params}`,m=d[D];m[R]??={};let k=m[R];c.walkRules(L=>{let pe=L.selector,P={};L.walkDecls($=>{P[$.prop]=$.value}),Object.keys(P).length>0&&(k[pe]=P)})})});continue}let y=r.relative.startsWith("src/")?r.relative.slice(4):r.relative;if(!g.includePackageName){let v=g.base.split("/").filter(Boolean),w=v[v.length-1];w&&y.startsWith(`${w}/`)&&(y=y.slice(w.length+1))}let ce=e.includes("/")?e.split("/").pop()??e:e,le=(g.includePackageName?`${g.base}/${ce}`:g.base).replace(/\/+$/,"");f.push({type:i,path:y,target:`${le}/${y}`.replace(/\/+/g,"/"),content:h})}let ae=!f.length&&Object.keys(d).length>0?"registry:style":i;return{$schema:"https://ui.shadcn.com/schema/registry-item.json",name:e,type:ae,title:s.title??e,description:s.description,author:s.author??"Connor Love <hello@loveconnor.com>",dependencies:O.length?O:void 0,devDependencies:A.length?A:void 0,registryDependencies:S.length?Array.from(new Set(S)):void 0,files:f.length?f:void 0,css:Object.keys(d).length?d:void 0}};var _="loveui://registry/",Ue="loveui://registry/{package}",M="get-loveui-package",Z=new Set(["shadcn-ui","typescript-config","eslint-config","patterns","loveui","love-ui"]),ze=["@loveui/","@love-ui/","@repo/"],ee=new Set(["@loveui/shadcn-ui","@love-ui/shadcn-ui"]),qe=e=>`${_}${e}`,We=l.dirname(_e(import.meta.url)),X=l.resolve(We,".."),Ge=[l.join(X,"public","r"),l.resolve(X,"..","..","apps","ui","public","r"),l.resolve(process.cwd(),"apps","ui","public","r")],te=async e=>{try{return await Te(e,xe.R_OK),!0}catch{return!1}},ne=e=>ze.some(t=>e.startsWith(t)),He=e=>e.replace(/^@repo\//,"").replace(/^@loveui\//,"").replace(/^@love-ui\//,""),se=e=>Array.isArray(e)?e.filter(t=>typeof t=="string"):e&&typeof e=="object"?Object.keys(e):[],B=e=>{let t=Array.from(new Set(se(e).filter(n=>!ne(n)&&!ee.has(n))));return t.length>0?t:void 0},Je=e=>{let t=Array.from(new Set(se(e).map(n=>n.trim()).filter(Boolean).filter(n=>!ee.has(n)).map(n=>ne(n)?`https://www.loveui.dev/r/${He(n)}.json`:n)));return t.length>0?t:void 0},ie=e=>e.trim().replace(/^@repo\//,"").replace(/^@loveui\//,"").replace(/^@love-ui\//,""),Ke=e=>{let t=ie(e);if(Z.has(t))throw new p(u.InvalidParams,`${t} is an internal package and should not be used directly. Use \`npx love-ui add <component>\` with a public component name.`);return t},Y=e=>{if(!e||typeof e!="object")return{mcpHints:{installPattern:"npx love-ui add <component>",neverInstall:["@loveui/*","@love-ui/*","@repo/*"]}};let t={...e},n=B(t.dependencies),s=B(t.devDependencies),i=Je(t.registryDependencies),o=typeof t.name=="string"&&t.name.trim().length>0?t.name.trim():"<component>",a={...t,mcpHints:{installPattern:"npx love-ui add <component>",installCommand:`npx love-ui add ${o}`,neverInstall:["@loveui/*","@love-ui/*","@repo/*","@loveui/shadcn-ui"]}};return n?a.dependencies=n:delete a.dependencies,s?a.devDependencies=s:delete a.devDependencies,i?a.registryDependencies=i:delete a.registryDependencies,a},T=null,re=async()=>(T||(T=(async()=>{for(let e of Ge){let t=l.join(e,"registry.json");if(await te(t))try{let n=JSON.parse(await Q(t,"utf8")),s=Array.from(new Set((n.items??[]).map(i=>i.name?.trim()).filter(i=>!!i))).sort((i,o)=>i.localeCompare(o));if(s.length===0)continue;return{dir:e,names:s,nameSet:new Set(s)}}catch{continue}}return null})()),T),Me=async()=>{let[e,t]=await Promise.all([re(),J()]),n=new Set(t);for(let s of e?.names??[])n.add(s);return Array.from(n).map(s=>ie(s)).filter(s=>!Z.has(s)).sort((s,i)=>s.localeCompare(i))},Xe=async e=>{let t=await re();if(!t||!t.nameSet.has(e))return null;let n=l.join(t.dir,`${e}.json`);return await te(n)?JSON.parse(await Q(n,"utf8")):null},Be=e=>{if(!e.startsWith(_))throw new p(u.InvalidParams,`Unsupported resource URI: ${e}`);let t=decodeURIComponent(e.slice(_.length)).trim();if(!t)throw new p(u.InvalidParams,"Package name is required.");return t},V=async e=>{try{let t=Ke(e),n=await Xe(t);return Y(n||await K(t))}catch(t){throw t instanceof p?t:new p(u.InvalidParams,t instanceof Error?t.message:String(t))}};async function Ye(){let e=new Ne({name:"loveui-mcp",version:F.version??"0.0.0"},{capabilities:{resources:{listChanged:!0},tools:{listChanged:!0}}});e.setRequestHandler(Le,async()=>({resources:(await Me()).map(s=>({uri:qe(s),name:s,description:`loveui registry definition for ${s}`,mimeType:"application/json"}))})),e.setRequestHandler(Ce,async()=>({resourceTemplates:[{name:"loveui-registry",uriTemplate:Ue,description:"loveui registry definitions by package name",mimeType:"application/json"}]})),e.setRequestHandler(Fe,async n=>{let s=Be(n.params.uri),i=await V(s);return{contents:[{uri:n.params.uri,mimeType:"application/json",text:JSON.stringify(i,null,2)}]}}),e.setRequestHandler($e,async()=>({tools:[{name:M,description:"Fetch a loveui registry definition by package name. Always install with `npx love-ui add <component>` and never install @loveui/* packages directly.",inputSchema:{type:"object",additionalProperties:!1,properties:{name:{type:"string",description:"Package name, e.g. badge"}},required:["name"]}}]})),e.setRequestHandler(Ae,async n=>{if(n.params.name!==M)throw new p(u.InvalidParams,`Tool ${n.params.name} not found`);let s=n.params.arguments?.name;if(typeof s!="string"||s.trim()==="")throw new p(u.InvalidParams,"Package name is required.");let i=await V(s.trim());return{content:[{type:"text",text:JSON.stringify(i,null,2)}]}});let t=new Oe;await e.connect(t)}Ye().catch(e=>{console.error(e),process.exit(1)});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "love-ui",
-  "version": "1.2.9",
+  "version": "1.2.11",
   "private": false,
   "license": "AGPL-3.0-or-later",
   "type": "module",

package/packages/gooey-toast/src/toast.tsx

@@ -11,7 +11,7 @@ import {
 import { Gooey } from "./gooey";
 import "./styles.css";
 import {
-	SILEO_POSITIONS,
+	GOOEY_POSITIONS,
 	type GooeyOptions,
 	type GooeyPosition,
 	type GooeyState,
@@ -394,7 +394,7 @@ export function Toaster({
 	return (
 		<>
 			{children}
-			{SILEO_POSITIONS.map((pos) => {
+			{GOOEY_POSITIONS.map((pos) => {
 				const items = byPosition[pos];
 				if (!items?.length) return null;
 

package/packages/gooey-toast/src/types.ts

@@ -20,7 +20,7 @@ export interface GooeyButton {
 	onClick: () => void;
 }
 
-export const SILEO_POSITIONS = [
+export const GOOEY_POSITIONS = [
 	"top-left",
 	"top-center",
 	"top-right",
@@ -29,7 +29,7 @@ export const SILEO_POSITIONS = [
 	"bottom-right",
 ] as const;
 
-export type GooeyPosition = (typeof SILEO_POSITIONS)[number];
+export type GooeyPosition = (typeof GOOEY_POSITIONS)[number];
 
 export interface GooeyOptions {
 	title?: string;

package/packages/love-ui/src/styles/globals.css

@@ -68,6 +68,8 @@
 }
 
 :root {
+  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  --font-heading: var(--font-sans);
   --radius: 0.625rem;
   --background: oklch(1 0 0);
   --foreground: oklch(0.21 0.006 285.885);

package/packages/love-ui/src/ui/alert-dialog.tsx

@@ -1,3 +1,4 @@
+import type { ComponentPropsWithoutRef } from "react"
 "use client"
 
 import { AlertDialog as AlertDialogPrimitive } from "@base-ui-components/react/alert-dialog"
@@ -61,7 +62,7 @@ function AlertDialogPopup({
 function AlertDialogHeader({
   className,
   ...props
-}: React.ComponentProps<"div">) {
+}: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="alert-dialog-header"
@@ -74,7 +75,7 @@ function AlertDialogHeader({
 function AlertDialogFooter({
   className,
   ...props
-}: React.ComponentProps<"div">) {
+}: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="alert-dialog-footer"

package/packages/love-ui/src/ui/alert.tsx

@@ -1,4 +1,5 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { cva, type VariantProps } from "class-variance-authority"
 
 import { cn } from "@loveui/ui/lib/utils"
@@ -27,7 +28,7 @@ function Alert({
   className,
   variant,
   ...props
-}: React.ComponentProps<"div"> & VariantProps<typeof alertVariants>) {
+}: ComponentPropsWithoutRef<"div"> & VariantProps<typeof alertVariants>) {
   return (
     <div
       data-slot="alert"
@@ -38,7 +39,7 @@ function Alert({
   )
 }
 
-function AlertTitle({ className, ...props }: React.ComponentProps<"div">) {
+function AlertTitle({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="alert-title"
@@ -51,7 +52,7 @@ function AlertTitle({ className, ...props }: React.ComponentProps<"div">) {
 function AlertDescription({
   className,
   ...props
-}: React.ComponentProps<"div">) {
+}: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="alert-description"
@@ -64,7 +65,7 @@ function AlertDescription({
   )
 }
 
-function AlertAction({ className, ...props }: React.ComponentProps<"div">) {
+function AlertAction({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="alert-action"

package/packages/love-ui/src/ui/breadcrumb.tsx

@@ -1,15 +1,16 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { mergeProps } from "@base-ui-components/react/merge-props"
 import { useRender } from "@base-ui-components/react/use-render"
 import { ChevronRight, MoreHorizontal } from "lucide-react"
 
 import { cn } from "@loveui/ui/lib/utils"
 
-function Breadcrumb({ ...props }: React.ComponentProps<"nav">) {
+function Breadcrumb({ ...props }: ComponentPropsWithoutRef<"nav">) {
   return <nav aria-label="breadcrumb" data-slot="breadcrumb" {...props} />
 }
 
-function BreadcrumbList({ className, ...props }: React.ComponentProps<"ol">) {
+function BreadcrumbList({ className, ...props }: ComponentPropsWithoutRef<"ol">) {
   return (
     <ol
       data-slot="breadcrumb-list"
@@ -22,7 +23,7 @@ function BreadcrumbList({ className, ...props }: React.ComponentProps<"ol">) {
   )
 }
 
-function BreadcrumbItem({ className, ...props }: React.ComponentProps<"li">) {
+function BreadcrumbItem({ className, ...props }: ComponentPropsWithoutRef<"li">) {
   return (
     <li
       data-slot="breadcrumb-item"
@@ -49,7 +50,7 @@ function BreadcrumbLink({
   })
 }
 
-function BreadcrumbPage({ className, ...props }: React.ComponentProps<"span">) {
+function BreadcrumbPage({ className, ...props }: ComponentPropsWithoutRef<"span">) {
   return (
     <span
       data-slot="breadcrumb-page"
@@ -66,7 +67,7 @@ function BreadcrumbSeparator({
   children,
   className,
   ...props
-}: React.ComponentProps<"li">) {
+}: ComponentPropsWithoutRef<"li">) {
   return (
     <li
       data-slot="breadcrumb-separator"
@@ -83,7 +84,7 @@ function BreadcrumbSeparator({
 function BreadcrumbEllipsis({
   className,
   ...props
-}: React.ComponentProps<"span">) {
+}: ComponentPropsWithoutRef<"span">) {
   return (
     <span
       data-slot="breadcrumb-ellipsis"

package/packages/love-ui/src/ui/card.tsx

@@ -1,4 +1,5 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { cva, type VariantProps } from "class-variance-authority"
 
 import { cn } from "@loveui/ui/lib/utils"
@@ -35,7 +36,7 @@ function Card({ className, variant, ...props }: CardProps) {
   )
 }
 
-function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
+function CardHeader({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="card-header"
@@ -48,7 +49,7 @@ function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
+function CardTitle({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="card-title"
@@ -58,7 +59,7 @@ function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
+function CardDescription({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="card-description"
@@ -68,7 +69,7 @@ function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function CardAction({ className, ...props }: React.ComponentProps<"div">) {
+function CardAction({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="card-action"
@@ -81,7 +82,7 @@ function CardAction({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function CardPanel({ className, ...props }: React.ComponentProps<"div">) {
+function CardPanel({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="card-content"
@@ -91,7 +92,7 @@ function CardPanel({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
+function CardFooter({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="card-footer"

package/packages/love-ui/src/ui/chart.tsx

@@ -1,6 +1,7 @@
 "use client"
 
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import * as RechartsPrimitive from "recharts"
 
 import { cn } from "@loveui/ui/lib/utils"
@@ -40,7 +41,7 @@ function ChartContainer({
   children,
   config,
   ...props
-}: React.ComponentProps<"div"> & {
+}: ComponentPropsWithoutRef<"div"> & {
   config: ChartConfig
   children: React.ComponentProps<
     typeof RechartsPrimitive.ResponsiveContainer
@@ -118,11 +119,21 @@ function ChartTooltipContent({
   color,
   nameKey,
   labelKey,
-}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
-  React.ComponentProps<"div"> & {
+}: ComponentPropsWithoutRef<"div"> &
+  Partial<
+    Pick<
+      RechartsPrimitive.TooltipContentProps<any, any>,
+      "active" | "payload" | "label"
+    >
+  > &
+  Pick<
+    RechartsPrimitive.TooltipProps<any, any>,
+    "formatter" | "labelFormatter"
+  > & {
     hideLabel?: boolean
     hideIndicator?: boolean
     indicator?: "line" | "dot" | "dashed"
+    labelClassName?: string
     nameKey?: string
     labelKey?: string
   }) {
@@ -255,8 +266,11 @@ function ChartLegendContent({
   payload,
   verticalAlign = "bottom",
   nameKey,
-}: React.ComponentProps<"div"> &
-  Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
+}: ComponentPropsWithoutRef<"div"> &
+  Pick<
+    RechartsPrimitive.DefaultLegendContentProps,
+    "payload" | "verticalAlign"
+  > & {
     hideIcon?: boolean
     nameKey?: string
   }) {

package/packages/love-ui/src/ui/checkbox.tsx

@@ -1,6 +1,7 @@
 "use client"
 
 import { Checkbox as CheckboxPrimitive } from "@base-ui-components/react/checkbox"
+import type { ComponentPropsWithoutRef } from "react"
 
 import { cn } from "@loveui/ui/lib/utils"
 
@@ -17,41 +18,47 @@ function Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props) {
       <CheckboxPrimitive.Indicator
         data-slot="checkbox-indicator"
         className="absolute -inset-px flex items-center justify-center rounded-[0.25rem] text-primary-foreground data-checked:bg-primary data-indeterminate:text-foreground data-unchecked:hidden"
-        render={(props, state) => (
-          <span {...props}>
-            {state.indeterminate ? (
-              <svg
-                className="size-3"
-                xmlns="http://www.w3.org/2000/svg"
-                width="24"
-                height="24"
-                viewBox="0 0 24 24"
-                fill="none"
-                stroke="currentColor"
-                strokeWidth="3"
-                strokeLinecap="round"
-                strokeLinejoin="round"
-              >
-                <path d="M5.252 12h13.496" />
-              </svg>
-            ) : (
-              <svg
-                className="size-3"
-                xmlns="http://www.w3.org/2000/svg"
-                width="24"
-                height="24"
-                viewBox="0 0 24 24"
-                fill="none"
-                stroke="currentColor"
-                strokeWidth="3"
-                strokeLinecap="round"
-                strokeLinejoin="round"
-              >
-                <path d="M5.252 12.7 10.2 18.63 18.748 5.37" />
-              </svg>
-            )}
-          </span>
-        )}
+        render={(props, state) => {
+          const { ref: _ref, ...spanProps } = props as {
+            ref?: unknown
+          } & ComponentPropsWithoutRef<"span">
+
+          return (
+            <span {...spanProps}>
+              {state.indeterminate ? (
+                <svg
+                  className="size-3"
+                  xmlns="http://www.w3.org/2000/svg"
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="3"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <path d="M5.252 12h13.496" />
+                </svg>
+              ) : (
+                <svg
+                  className="size-3"
+                  xmlns="http://www.w3.org/2000/svg"
+                  width="24"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="3"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <path d="M5.252 12.7 10.2 18.63 18.748 5.37" />
+                </svg>
+              )}
+            </span>
+          )
+        }}
       />
     </CheckboxPrimitive.Root>
   )

package/packages/love-ui/src/ui/command.tsx

@@ -1,6 +1,7 @@
 "use client"
 
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { Command as CommandPrimitive } from "cmdk"
 import { SearchIcon } from "lucide-react"
 
@@ -158,7 +159,7 @@ function CommandItem({
 function CommandShortcut({
   className,
   ...props
-}: React.ComponentProps<"span">) {
+}: ComponentPropsWithoutRef<"span">) {
   return (
     <span
       data-slot="command-shortcut"

package/packages/love-ui/src/ui/dialog.tsx

@@ -1,5 +1,6 @@
 "use client"
 
+import type { ComponentPropsWithoutRef } from "react"
 import { Dialog as DialogPrimitive } from "@base-ui-components/react/dialog"
 import { XIcon } from "lucide-react"
 
@@ -72,17 +73,17 @@ function DialogPopup({
   )
 }
 
-function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
+function DialogHeader({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="dialog-header"
       className={cn("flex flex-col gap-1 text-center sm:text-left", className)}
-      {...props}
+      {...(props as any)}
     />
   )
 }
 
-function DialogFooter({ className, ...props }: React.ComponentProps<"div">) {
+function DialogFooter({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="dialog-footer"
@@ -90,7 +91,7 @@ function DialogFooter({ className, ...props }: React.ComponentProps<"div">) {
         "flex flex-col-reverse gap-2 sm:-mx-6 sm:mt-2 sm:-mb-6 sm:flex-row sm:justify-end sm:rounded-b-xl sm:border-t sm:bg-muted/50 sm:px-6 sm:py-4",
         className
       )}
-      {...props}
+      {...(props as any)}
     />
   )
 }

package/packages/love-ui/src/ui/empty.tsx

@@ -1,8 +1,9 @@
+import type { ComponentPropsWithoutRef } from "react"
 import { cva, type VariantProps } from "class-variance-authority"
 
 import { cn } from "@loveui/ui/lib/utils"
 
-function Empty({ className, ...props }: React.ComponentProps<"div">) {
+function Empty({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="empty"
@@ -15,7 +16,7 @@ function Empty({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function EmptyHeader({ className, ...props }: React.ComponentProps<"div">) {
+function EmptyHeader({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="empty-header"
@@ -47,7 +48,7 @@ function EmptyMedia({
   className,
   variant = "default",
   ...props
-}: React.ComponentProps<"div"> & VariantProps<typeof emptyMediaVariants>) {
+}: ComponentPropsWithoutRef<"div"> & VariantProps<typeof emptyMediaVariants>) {
   return (
     <div
       data-slot="empty-media"
@@ -81,7 +82,7 @@ function EmptyMedia({
   )
 }
 
-function EmptyTitle({ className, ...props }: React.ComponentProps<"div">) {
+function EmptyTitle({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="empty-title"
@@ -91,7 +92,7 @@ function EmptyTitle({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function EmptyDescription({ className, ...props }: React.ComponentProps<"p">) {
+function EmptyDescription({ className, ...props }: ComponentPropsWithoutRef<"p">) {
   return (
     <div
       data-slot="empty-description"
@@ -104,7 +105,7 @@ function EmptyDescription({ className, ...props }: React.ComponentProps<"p">) {
   )
 }
 
-function EmptyContent({ className, ...props }: React.ComponentProps<"div">) {
+function EmptyContent({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="empty-content"

package/packages/love-ui/src/ui/frame.tsx

@@ -1,8 +1,9 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 
 import { cn } from "@loveui/ui/lib/utils"
 
-function Frame({ className, ...props }: React.ComponentProps<"div">) {
+function Frame({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="frame"
@@ -15,7 +16,7 @@ function Frame({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function FramePanel({ className, ...props }: React.ComponentProps<"div">) {
+function FramePanel({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="frame-panel"
@@ -28,7 +29,7 @@ function FramePanel({ className, ...props }: React.ComponentProps<"div">) {
   )
 }
 
-function FrameHeader({ className, ...props }: React.ComponentProps<"header">) {
+function FrameHeader({ className, ...props }: ComponentPropsWithoutRef<"header">) {
   return (
     <header
       data-slot="frame-panel-header"
@@ -38,7 +39,7 @@ function FrameHeader({ className, ...props }: React.ComponentProps<"header">) {
   )
 }
 
-function FrameTitle({ className, ...props }: React.ComponentProps<"div">) {
+function FrameTitle({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="frame-panel-title"
@@ -51,7 +52,7 @@ function FrameTitle({ className, ...props }: React.ComponentProps<"div">) {
 function FrameDescription({
   className,
   ...props
-}: React.ComponentProps<"div">) {
+}: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="frame-panel-description"
@@ -61,7 +62,7 @@ function FrameDescription({
   )
 }
 
-function FrameFooter({ className, ...props }: React.ComponentProps<"footer">) {
+function FrameFooter({ className, ...props }: ComponentPropsWithoutRef<"footer">) {
   return (
     <footer
       data-slot="frame-panel-footer"

package/packages/love-ui/src/ui/kbd.tsx

@@ -1,6 +1,7 @@
-import { cn } from "@loveui/ui/lib/utils.js"
+import type { ComponentPropsWithoutRef } from "react"
+import { cn } from "@loveui/ui/lib/utils"
 
-function Kbd({ className, ...props }: React.ComponentProps<"kbd">) {
+function Kbd({ className, ...props }: ComponentPropsWithoutRef<"kbd">) {
   return (
     <kbd
       data-slot="kbd"
@@ -13,7 +14,7 @@ function Kbd({ className, ...props }: React.ComponentProps<"kbd">) {
   )
 }
 
-function KbdGroup({ className, ...props }: React.ComponentProps<"div">) {
+function KbdGroup({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <kbd
       data-slot="kbd-group"

package/packages/love-ui/src/ui/label.tsx

@@ -1,8 +1,9 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 
 import { cn } from "@loveui/ui/lib/utils"
 
-function Label({ className, ...props }: React.ComponentProps<"label">) {
+function Label({ className, ...props }: ComponentPropsWithoutRef<"label">) {
   return (
     <label
       data-slot="label"

package/packages/love-ui/src/ui/menu.tsx

@@ -1,6 +1,7 @@
 "use client"
 
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { Menu as MenuPrimitive } from "@base-ui-components/react/menu"
 import { CheckIcon, ChevronRightIcon } from "lucide-react"
 
@@ -156,7 +157,7 @@ function MenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props) {
   )
 }
 
-function MenuShortcut({ className, ...props }: React.ComponentProps<"span">) {
+function MenuShortcut({ className, ...props }: ComponentPropsWithoutRef<"span">) {
   return (
     <span
       data-slot="menu-shortcut"

package/packages/love-ui/src/ui/number-field.tsx

@@ -1,6 +1,7 @@
 "use client"
 
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { NumberField as NumberFieldPrimitive } from "@base-ui-components/react/number-field"
 import { MinusIcon, PlusIcon } from "lucide-react"
 
@@ -134,7 +135,7 @@ function NumberFieldScrubArea({
   )
 }
 
-function CursorGrowIcon(props: React.ComponentProps<"svg">) {
+function CursorGrowIcon(props: ComponentPropsWithoutRef<"svg">) {
   return (
     <svg
       width="26"

package/packages/love-ui/src/ui/pagination.tsx

@@ -1,4 +1,5 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { mergeProps } from "@base-ui-components/react/merge-props"
 import { useRender } from "@base-ui-components/react/use-render"
 import {
@@ -10,7 +11,7 @@ import {
 import { cn } from "@loveui/ui/lib/utils"
 import { Button, buttonVariants } from "@loveui/ui/ui/button"
 
-function Pagination({ className, ...props }: React.ComponentProps<"nav">) {
+function Pagination({ className, ...props }: ComponentPropsWithoutRef<"nav">) {
   return (
     <nav
       role="navigation"
@@ -25,7 +26,7 @@ function Pagination({ className, ...props }: React.ComponentProps<"nav">) {
 function PaginationContent({
   className,
   ...props
-}: React.ComponentProps<"ul">) {
+}: ComponentPropsWithoutRef<"ul">) {
   return (
     <ul
       data-slot="pagination-content"
@@ -35,7 +36,7 @@ function PaginationContent({
   )
 }
 
-function PaginationItem({ ...props }: React.ComponentProps<"li">) {
+function PaginationItem({ ...props }: ComponentPropsWithoutRef<"li">) {
   return <li data-slot="pagination-item" {...props} />
 }
 
@@ -110,7 +111,7 @@ function PaginationNext({
 function PaginationEllipsis({
   className,
   ...props
-}: React.ComponentProps<"span">) {
+}: ComponentPropsWithoutRef<"span">) {
   return (
     <span
       aria-hidden

package/packages/love-ui/src/ui/popover.tsx

@@ -38,7 +38,10 @@ function PopoverTrigger({
           const { asChild: _childAsChild, ...restChildProps } =
             (child.props ?? {}) as Record<string, unknown>
 
-          const childRef = child.ref as React.Ref<HTMLElement> | null | undefined
+          const childRef = (child as any).ref as
+            | React.Ref<HTMLElement>
+            | null
+            | undefined
 
           const mergedProps = mergeProps(restTriggerProps, restChildProps)
 

package/packages/love-ui/src/ui/select.tsx

@@ -39,13 +39,22 @@ function SelectTrigger({
   )
 }
 
-function SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {
+function SelectValue({
+  className,
+  placeholder,
+  children,
+  ...props
+}: SelectPrimitive.Value.Props & { placeholder?: string }) {
+  const resolvedChildren = children ?? ((value: unknown) => value ?? placeholder)
+
   return (
     <SelectPrimitive.Value
       data-slot="select-value"
       className={cn("truncate", className)}
       {...props}
-    />
+    >
+      {resolvedChildren as any}
+    </SelectPrimitive.Value>
   )
 }
 

package/packages/love-ui/src/ui/sheet.tsx

@@ -1,5 +1,6 @@
 "use client"
 
+import type { ComponentPropsWithoutRef } from "react"
 import { Dialog as SheetPrimitive } from "@base-ui-components/react/dialog"
 import { XIcon } from "lucide-react"
 
@@ -75,22 +76,22 @@ function SheetPopup({
   )
 }
 
-function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
+function SheetHeader({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="sheet-header"
       className={cn("flex flex-col gap-1.5 p-4", className)}
-      {...props}
+      {...(props as any)}
     />
   )
 }
 
-function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
+function SheetFooter({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="sheet-footer"
       className={cn("mt-auto flex flex-col gap-2 p-4", className)}
-      {...props}
+      {...(props as any)}
     />
   )
 }

package/packages/love-ui/src/ui/skeleton.tsx

@@ -1,6 +1,8 @@
+import React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 import { cn } from "@loveui/ui/lib/utils"
 
-function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
+function Skeleton({ className, ...props }: ComponentPropsWithoutRef<"div">) {
   return (
     <div
       data-slot="skeleton"

package/packages/love-ui/src/ui/table.tsx

@@ -1,8 +1,9 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 
 import { cn } from "@loveui/ui/lib/utils"
 
-function Table({ className, ...props }: React.ComponentProps<"table">) {
+function Table({ className, ...props }: ComponentPropsWithoutRef<"table">) {
   return (
     <div
       data-slot="table-container"
@@ -20,7 +21,7 @@ function Table({ className, ...props }: React.ComponentProps<"table">) {
   )
 }
 
-function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
+function TableHeader({ className, ...props }: ComponentPropsWithoutRef<"thead">) {
   return (
     <thead
       data-slot="table-header"
@@ -33,7 +34,7 @@ function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
   )
 }
 
-function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
+function TableBody({ className, ...props }: ComponentPropsWithoutRef<"tbody">) {
   return (
     <tbody
       data-slot="table-body"
@@ -46,7 +47,7 @@ function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
   )
 }
 
-function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
+function TableFooter({ className, ...props }: ComponentPropsWithoutRef<"tfoot">) {
   return (
     <tfoot
       data-slot="table-footer"
@@ -59,7 +60,7 @@ function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
   )
 }
 
-function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
+function TableRow({ className, ...props }: ComponentPropsWithoutRef<"tr">) {
   return (
     <tr
       data-slot="table-row"
@@ -72,7 +73,7 @@ function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
   )
 }
 
-function TableHead({ className, ...props }: React.ComponentProps<"th">) {
+function TableHead({ className, ...props }: ComponentPropsWithoutRef<"th">) {
   return (
     <th
       data-slot="table-head"
@@ -85,7 +86,7 @@ function TableHead({ className, ...props }: React.ComponentProps<"th">) {
   )
 }
 
-function TableCell({ className, ...props }: React.ComponentProps<"td">) {
+function TableCell({ className, ...props }: ComponentPropsWithoutRef<"td">) {
   return (
     <td
       data-slot="table-cell"
@@ -101,7 +102,7 @@ function TableCell({ className, ...props }: React.ComponentProps<"td">) {
 function TableCaption({
   className,
   ...props
-}: React.ComponentProps<"caption">) {
+}: ComponentPropsWithoutRef<"caption">) {
   return (
     <caption
       data-slot="table-caption"

package/packages/love-ui/src/ui/textarea.tsx

@@ -1,4 +1,5 @@
 import * as React from "react"
+import type { ComponentPropsWithoutRef } from "react"
 
 import { cn } from "@loveui/ui/lib/utils"
 
@@ -6,7 +7,7 @@ function Textarea({
   className,
   size = "default",
   ...props
-}: React.ComponentProps<"textarea"> & {
+}: ComponentPropsWithoutRef<"textarea"> & {
   size?: "sm" | "default" | "lg" | number
 }) {
   return (