93:I[903690,["/chat-static/_next/static/chunks/3i9cwkv75ap-1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/393dq-lwgv9wd.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3x2qrc8_ae_y8.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1v3tu-ayeqrg_.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/24itveg68o90k.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0u7q9wyops2xg.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/38howswsjvgon.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3xsve9e9fxw9u.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0pmkowhwh3_ey.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ir8jf7_bfjoy.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kl3thuqyhpdu.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3dh9b5rhes-_3.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lpc1gu9jkwbr.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3pk_lm2pt6hw5.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3qbqqz-30yf_e.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/349enaxmn4q3i.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2oig3hoirmj64.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2htqlxu9398j9.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2yoqavhumda_r.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kku96d2ka1lz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/09bjmvlsdgntt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3i-97b1o6hit-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ffzcp23_gird.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2iu_2gtqlb9fh.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/191-4imsl9qwa.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2nnss2enfb-e6.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3z0af037uy3y2.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3axpbmdw7c30d.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3g02y25nur6on.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3ahsd2taw-yce.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2z73sh9fd4fk1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lw8fcfgn79qw.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/346rh7hczex73.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0ite474mxrjfz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0rr2h1ez7ud1-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/05gop4ul8i8kb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2tg7uu9je15bl.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q"],"ExplicitChatIdProvider"] 94:I[838238,["/chat-static/_next/static/chunks/3i9cwkv75ap-1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/393dq-lwgv9wd.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3x2qrc8_ae_y8.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1v3tu-ayeqrg_.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/24itveg68o90k.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0u7q9wyops2xg.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/38howswsjvgon.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3xsve9e9fxw9u.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0pmkowhwh3_ey.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ir8jf7_bfjoy.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kl3thuqyhpdu.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3dh9b5rhes-_3.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lpc1gu9jkwbr.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3pk_lm2pt6hw5.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3qbqqz-30yf_e.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/349enaxmn4q3i.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2oig3hoirmj64.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2htqlxu9398j9.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2yoqavhumda_r.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kku96d2ka1lz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/09bjmvlsdgntt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3i-97b1o6hit-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ffzcp23_gird.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2iu_2gtqlb9fh.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/191-4imsl9qwa.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2nnss2enfb-e6.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3z0af037uy3y2.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3axpbmdw7c30d.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3g02y25nur6on.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3ahsd2taw-yce.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2z73sh9fd4fk1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lw8fcfgn79qw.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/346rh7hczex73.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0ite474mxrjfz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0rr2h1ez7ud1-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/05gop4ul8i8kb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2tg7uu9je15bl.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q"],"SWRDataProvider"] 97:I[589831,["/chat-static/_next/static/chunks/3i9cwkv75ap-1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/393dq-lwgv9wd.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3x2qrc8_ae_y8.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1v3tu-ayeqrg_.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/24itveg68o90k.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0u7q9wyops2xg.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/38howswsjvgon.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3xsve9e9fxw9u.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0pmkowhwh3_ey.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ir8jf7_bfjoy.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kl3thuqyhpdu.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3dh9b5rhes-_3.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lpc1gu9jkwbr.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3pk_lm2pt6hw5.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3qbqqz-30yf_e.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/349enaxmn4q3i.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2oig3hoirmj64.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2htqlxu9398j9.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2yoqavhumda_r.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kku96d2ka1lz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/09bjmvlsdgntt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3i-97b1o6hit-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ffzcp23_gird.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2iu_2gtqlb9fh.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/191-4imsl9qwa.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2nnss2enfb-e6.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3z0af037uy3y2.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3axpbmdw7c30d.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3g02y25nur6on.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3ahsd2taw-yce.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2z73sh9fd4fk1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lw8fcfgn79qw.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/346rh7hczex73.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0ite474mxrjfz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0rr2h1ez7ud1-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/05gop4ul8i8kb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2tg7uu9je15bl.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q"],"TemplateImage"] 98:I[507037,["/chat-static/_next/static/chunks/3i9cwkv75ap-1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/393dq-lwgv9wd.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3x2qrc8_ae_y8.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1v3tu-ayeqrg_.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/24itveg68o90k.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0u7q9wyops2xg.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/38howswsjvgon.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3xsve9e9fxw9u.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0pmkowhwh3_ey.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ir8jf7_bfjoy.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kl3thuqyhpdu.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3dh9b5rhes-_3.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lpc1gu9jkwbr.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3pk_lm2pt6hw5.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3qbqqz-30yf_e.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/349enaxmn4q3i.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2oig3hoirmj64.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2htqlxu9398j9.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2yoqavhumda_r.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3kku96d2ka1lz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/09bjmvlsdgntt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3i-97b1o6hit-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2ffzcp23_gird.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2iu_2gtqlb9fh.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/191-4imsl9qwa.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2nnss2enfb-e6.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3z0af037uy3y2.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3axpbmdw7c30d.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3g02y25nur6on.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/3ahsd2taw-yce.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2z73sh9fd4fk1.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2lw8fcfgn79qw.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/346rh7hczex73.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0ite474mxrjfz.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/0rr2h1ez7ud1-.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/05gop4ul8i8kb.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q","/chat-static/_next/static/chunks/2tg7uu9je15bl.js?dpl=dpl_5M41LU15VJruYVowGop3zvU8vm3Q"],"PrefetchLinkAndRefreshOnHover"] 95:T4d19,[V0_FILE]javascriptreact:file="components/file-tree-labs.tsx" isMerged="true" "use client" import React, { useState } from "react" import { motion, AnimatePresence } from "framer-motion" const FileTreeLabs = () => { const [expanded, setExpanded] = useState({ project: true, src: false, public: false, }) const [selected, setSelected] = useState(null) const [animatingFolder, setAnimatingFolder] = useState(null) // Fixed animation values const staggerDelay = 0.08 const initialDelay = 0.1 const itemDuration = 0.4 const blurAmount = 8 const slideDistance = 12 const containerDuration = 0.4 const toggle = (id) => { setAnimatingFolder(id) setExpanded((prev) => ({ ...prev, [id]: !prev[id] })) setTimeout( () => { setAnimatingFolder(null) }, (initialDelay + staggerDelay * 5 + itemDuration + containerDuration) * 1000, ) } const FolderIcon = ({ isOpen }) => ( ) const FileIcon = ({ name }) => { const ext = name.split(".").pop() let opacity = "0.5" if (ext === "md") opacity = "0.7" if (ext === "json") opacity = "0.7" return ( ) } const ChevronIcon = ({ isExpanded }) => ( ) const TreeItem = ({ id, name, type, depth = 0, children, parentId = null }) => { const isExpanded = expanded[id] const isSelected = selected === id const isFolder = type === "folder" const childArray = React.Children.toArray(children) const hasChildren = childArray.length > 0 const shouldAnimateChildren = animatingFolder === id const totalChildrenExitTime = initialDelay + childArray.length * staggerDelay + itemDuration const containerVariants = { hidden: { height: 0, opacity: 0, transition: { height: { duration: containerDuration, ease: [0.4, 0, 0.2, 1], delay: totalChildrenExitTime }, opacity: { duration: containerDuration * 0.5, delay: totalChildrenExitTime }, }, }, visible: { height: "auto", opacity: 1, transition: { height: { duration: containerDuration, ease: [0.4, 0, 0.2, 1] }, opacity: { duration: containerDuration * 0.5 }, }, }, } const getChildVariants = (index, total) => ({ hidden: { opacity: 0, x: -slideDistance, filter: `blur(${blurAmount}px)`, transition: { duration: itemDuration, delay: initialDelay + (total - 1 - index) * staggerDelay, ease: [0.4, 0, 0.2, 1], }, }, visible: { opacity: 1, x: 0, filter: "blur(0px)", transition: { duration: itemDuration, delay: initialDelay + index * staggerDelay, ease: [0.4, 0, 0.2, 1], }, }, }) return (

{ setSelected(id) if (isFolder) toggle(id) }} whileHover={{ backgroundColor: "rgba(255, 255, 255, 0.03)" }} whileTap={{ scale: 0.99 }} style={{ display: "flex", alignItems: "center", gap: "8px", padding: "6px 12px", paddingLeft: `${depth * 20 + 12}px`, cursor: "pointer", backgroundColor: isSelected ? "rgba(255, 255, 255, 0.05)" : "transparent", borderLeft: isSelected ? "1px solid rgba(255,255,255,0.3)" : "1px solid transparent", userSelect: "none", transition: "border-color 0.2s ease", }} > {isFolder ? : } {name} {isExpanded && hasChildren && ( {childArray.map((child, index) => { const variants = getChildVariants(index, childArray.length) return ( {React.cloneElement(child, { parentId: id })} ) })} )}

) } // Geometric icons const IconBracket = () => ( ) const IconStar = () => ( ) const IconCircle = () => ( ) return (

{/* Top metadata */}

FT-2025

TECHNICAL TESTING

FILE.TREE.SYS

{/* Icon row */}

File Tree

EXPERIMENTAL INTERFACE

{/* File tree */}

{/* Bottom metadata */}

FT-2025

TECHNICAL TESTING

LABS.FILESYSTEM

) } export default FileTreeLabs [V0_FILE]css:file="app/globals.css" isMerged="true" @import 'tailwindcss'; @import 'tw-animate-css'; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); } .dark { --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { --font-sans: 'Geist', 'Geist Fallback'; --font-mono: 'Geist Mono', 'Geist Mono Fallback'; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "eslint ." }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.10", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^1.1.2", "zod": "3.25.76", "framer-motion": "12.23.26" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" isQuickEdit="true" isMerged="true" import type React from "react" import type { Metadata } from "next" import { Geist, Geist_Mono } from "next/font/google" import { Analytics } from "@vercel/analytics/next" import "./globals.css" const _geist = Geist({ subsets: ["latin"] }) const _geistMono = Geist_Mono({ subsets: ["latin"] }) export const metadata: Metadata = { title: "File Tree Labs - Experimental Interface", description: "An experimental file tree component with smooth animations", generator: "v0.app", icons: { icon: [ { url: "/icon-light-32x32.png", media: "(prefers-color-scheme: light)", }, { url: "/icon-dark-32x32.png", media: "(prefers-color-scheme: dark)", }, { url: "/icon.svg", type: "image/svg+xml", }, ], apple: "/apple-icon.png", }, } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" import FileTreeLabs from "@/components/file-tree-labs" export default function Page() { return (

) }89:["$","$L93",null,{"chatId":"n573OOo832H","children":["$","$L94",null,{"data":{"@\"active-block\",\"n573OOo832H\",":{"id":"b_qO8SsVRopiw","messageId":"Q6r5lpvJwmsw7vKmO3aIP3x8IytJcchz","source":"$95","language":"typescriptreact","type":"code-project","closed":true,"meta":{"type":"code-project","project":"Code","taskNameActive":"Adding gray background","taskNameComplete":"Added gray background"},"hasSourceBeenEdited":false,"forkedFromBlockId":"$undefined"},"@\"chat:vm-mode\",\"n573OOo832H\",":false,"":null},"children":"$L96"}]}] 8d:["$","$L7a","Hij423DAE0R",{"value":{"fallback":{"template:Hij423DAE0R:likes":{"likeCount":27,"isLiked":false}}},"children":["$","div",null,{"className":"has-focus-visible:ring-offset-background relative flex w-full flex-col gap-2 text-sm sm:min-w-0","children":[["$","div",null,{"className":"shadow-base bg-v0-background-200 relative aspect-video w-full overflow-hidden rounded-lg text-sm has-focus-visible:outline-hidden has-focus-visible:ring-2 has-focus-visible:ring-v0-blue-700 has-focus-visible:ring-offset-1","children":[["$","$L97",null,{"index":0,"src":"https://gvsmhepiuiax2e6y.public.blob.vercel-storage.com/templates/assets/20260104154020-3X4pwjtovGYl0X4gD579PTKK28cGdX.png","alt":"","templateCanonId":"Hij423DAE0R","blockId":"b_y3AI9OEir2O"}],false,["$","div",null,{"className":"absolute inset-0 flex items-center justify-center bg-linear-to-b from-[hsla(0,0%,100%,0.3)] to-[hsla(0,0%,40%,0.3)] opacity-0 transition-opacity focus-within:opacity-100 hover:opacity-100 has-data-[pending=true]:opacity-100","children":[[["$","$L98",null,{"href":"/templates/Hij423DAE0R","className":"absolute inset-0 sm:hidden","prefetch":false}],["$","$L98",null,{"href":"/templates/Hij423DAE0R","tabIndex":-1,"className":"absolute inset-0 hidden sm:block","prefetch":false}]],["$","div",null,{"className":"z-10 hidden w-32 flex-col items-center justify-center gap-2 sm:flex","children":["$","$L98",null,{"href":"/templates/Hij423DAE0R","prefetch":false,"children":"View Details","className":"focus-visible:ring-offset-background outline-hidden has-focus-visible:ring-2 inline-flex shrink-0 cursor-pointer select-none items-center justify-center gap-1.5 whitespace-nowrap text-nowrap border font-medium ring-v0-caveat-focus-ring-tab transition focus-visible:ring-2 focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:bg-v0-gray-100 disabled:text-v0-gray-500 disabled:ring-0 aria-disabled:cursor-not-allowed aria-disabled:bg-v0-gray-100 aria-disabled:text-v0-gray-500 aria-disabled:ring-0 [&>svg]:pointer-events-none [&>svg]:size-4 [&_svg]:shrink-0 disabled:border-v0-alpha-400 text-v0-background-100 aria-disabled:border-v0-alpha-400 border-v0-gray-1000 bg-v0-gray-1000 hover:border-v0-gray-900 hover:bg-v0-gray-900 focus:border-v0-gray-900 focus:bg-v0-gray-900 focus-visible:border-v0-gray-900 focus-visible:bg-v0-gray-900 h-8 px-3 text-sm has-[>kbd]:gap-2 has-[>svg]:px-2 has-[>kbd]:pr-[6px] rounded-lg w-full","disabled":"$undefined","ref":null}]}]]}]]}],["$","div",null,{"className":"flex items-center gap-3 pr-1 w-full","children":[["$","$L7f",null,{"teamId":"$undefined","authorId":"6aIJ0YKm2inuX2TPVWEe91dl"}],["$","$L98",null,{"className":"flex flex-1 min-w-0 items-center gap-3","href":"/templates/Hij423DAE0R","tabIndex":-1,"prefetch":false,"data-testid":"template-card-link","children":["$","div",null,{"className":"flex flex-1 min-w-0 flex-col gap-1.5","children":[["$","div",null,{"className":"line-clamp-1 font-medium leading-none text-v0-gray-1000","children":"Chatbot UI"}],null,["$","div",null,{"className":"flex flex-row items-center gap-1.5 text-v0-gray-900","children":[["$","div",null,{"className":"flex flex-row whitespace-nowrap items-center gap-1.5","children":[["$","svg",null,{"className":"size-3","dangerouslySetInnerHTML":{"__html":""},"data-testid":"geist-icon","height":16,"strokeLinejoin":"round","style":{"verticalAlign":"$undefined","width":"$undefined","height":"$undefined","color":"currentColor"},"viewBox":"0 0 16 16","width":16}],"$L99"]}],"$L9a","$L9b"]}]]}]}]]}]]}]}] 8e:["$","$L7a","EdD4Xpeoo0w",{"value":{"fallback":{"template:EdD4Xpeoo0w:likes":{"likeCount":16,"isLiked":false}}},"children":["$","div",null,{"className":"has-focus-visible:ring-offset-background relative flex w-full flex-col gap-2 text-sm sm:min-w-0","children":[["$","div",null,{"className":"shadow-base bg-v0-background-200 relative aspect-video w-full overflow-hidden rounded-lg text-sm has-focus-visible:outline-hidden has-focus-visible:ring-2 has-focus-visible:ring-v0-blue-700 has-focus-visible:ring-offset-1","children":[["$","$L97",null,{"index":1,"src":"https://gvsmhepiuiax2e6y.public.blob.vercel-storage.com/templates/assets/20260105105657-V5QghqeZmf42PwMEy93cHHkW2n3iVp.png","alt":"","templateCanonId":"EdD4Xpeoo0w","blockId":"b_7naMlc4GlmS"}],false,["$","div",null,{"className":"absolute inset-0 flex items-center justify-center bg-linear-to-b from-[hsla(0,0%,100%,0.3)] to-[hsla(0,0%,40%,0.3)] opacity-0 transition-opacity focus-within:opacity-100 hover:opacity-100 has-data-[pending=true]:opacity-100","children":[[["$","$L98",null,{"href":"/templates/EdD4Xpeoo0w","className":"absolute inset-0 sm:hidden","prefetch":false}],["$","$L98",null,{"href":"/templates/EdD4Xpeoo0w","tabIndex":-1,"className":"absolute inset-0 hidden sm:block","prefetch":false}]],["$","div",null,{"className":"z-10 hidden w-32 flex-col items-center justify-center gap-2 sm:flex","children":["$","$L98",null,{"href":"/templates/EdD4Xpeoo0w","prefetch":false,"children":"View Details","className":"focus-visible:ring-offset-background outline-hidden has-focus-visible:ring-2 inline-flex shrink-0 cursor-pointer select-none items-center justify-center gap-1.5 whitespace-nowrap text-nowrap border font-medium ring-v0-caveat-focus-ring-tab transition focus-visible:ring-2 focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:bg-v0-gray-100 disabled:text-v0-gray-500 disabled:ring-0 aria-disabled:cursor-not-allowed aria-disabled:bg-v0-gray-100 aria-disabled:text-v0-gray-500 aria-disabled:ring-0 [&>svg]:pointer-events-none [&>svg]:size-4 [&_svg]:shrink-0 disabled:border-v0-alpha-400 text-v0-background-100 aria-disabled:border-v0-alpha-400 border-v0-gray-1000 bg-v0-gray-1000 hover:border-v0-gray-900 hover:bg-v0-gray-900 focus:border-v0-gray-900 focus:bg-v0-gray-900 focus-visible:border-v0-gray-900 focus-visible:bg-v0-gray-900 h-8 px-3 text-sm has-[>kbd]:gap-2 has-[>svg]:px-2 has-[>kbd]:pr-[6px] rounded-lg w-full","disabled":"$undefined","ref":null}]}]]}]]}],["$","div",null,{"className":"flex items-center gap-3 pr-1 w-full","children":[["$","$L7f",null,{"teamId":"$undefined","authorId":"6aIJ0YKm2inuX2TPVWEe91dl"}],["$","$L98",null,{"className":"flex flex-1 min-w-0 items-center gap-3","href":"/templates/EdD4Xpeoo0w","tabIndex":-1,"prefetch":false,"data-testid":"template-card-link","children":["$","div",null,{"className":"flex flex-1 min-w-0 flex-col gap-1.5","children":[["$","div",null,{"className":"line-clamp-1 font-medium leading-none text-v0-gray-1000","children":"Text Reveal Animation"}],null,["$","div",null,{"className":"flex flex-row items-center gap-1.5 text-v0-gray-900","children":[["$","div",null,{"className":"flex flex-row whitespace-nowrap items-center gap-1.5","children":[["$","svg",null,{"className":"size-3","dangerouslySetInnerHTML":{"__html":""},"data-testid":"geist-icon","height":16,"strokeLinejoin":"round","style":{"verticalAlign":"$undefined","width":"$undefined","height":"$undefined","color":"currentColor"},"viewBox":"0 0 16 16","width":16}],"$L9c"]}],"$L9d","$L9e"]}]]}]}]]}]]}]}]

About

Tags

Share

About

Tags

Share

More from mosedesmoulins-9225

More Templates Like This