Skip to content

Commit 28134ad

Browse files
KevinVandySeanCassiere
KevinVandy
and
SeanCassiere
authored
feat: add pacer library (#374)
* feat: add pacer library * run format --------- Co-authored-by: Sean Cassiere <33615041+SeanCassiere@users.noreply.github.com>
1 parent 5be1523 commit 28134ad

14 files changed

+397
-13
lines changed

‎app/libraries/index.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import { tableProject } from './table'
1515
import { virtualProject } from './virtual'
1616
import { rangerProject } from './ranger'
1717
import { storeProject } from './store'
18+
import { pacerProject } from './pacer'
1819

1920
export const frameworkOptions = [
2021
{ label: 'React', value: 'react', logo: reactLogo },
@@ -39,6 +40,7 @@ export type Library = {
3940
| 'virtual'
4041
| 'ranger'
4142
| 'store'
43+
| 'pacer'
4244
| 'config'
4345
| 'react-charts'
4446
name: string
@@ -88,8 +90,9 @@ export const libraries = [
8890
tableProject,
8991
formProject,
9092
virtualProject,
91-
rangerProject,
9293
storeProject,
94+
rangerProject,
95+
pacerProject,
9396
configProject,
9497
] satisfies Library[]
9598

‎app/libraries/pacer.tsx‎

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
import { VscPreview, VscWand } from 'react-icons/vsc'
2+
import { Library } from '.'
3+
import { FaGithub, FaBolt, FaCogs } from 'react-icons/fa'
4+
import { BiBookAlt } from 'react-icons/bi'
5+
import { twMerge } from 'tailwind-merge'
6+
7+
const repo = 'tanstack/pacer'
8+
9+
const textStyles = `text-lime-600 dark:text-lime-500`
10+
11+
export const pacerProject = {
12+
id: 'pacer',
13+
name: 'TanStack Pacer',
14+
cardStyles: `shadow-xl shadow-lime-700/20 dark:shadow-lg dark:shadow-lime-500/20 text-lime-500 dark:text-lime-400 border-2 border-transparent hover:border-current`,
15+
to: '/pacer',
16+
tagline: `Framework agnostic debouncing, throttling, and queueing utilities`,
17+
description: `Set the pace of interactions in your applications. Limit the rate at which functions can fire, or intelligently queue long-running tasks with Concurrency Control.`,
18+
ogImage: 'https://github.com/tanstack/pacer/raw/main/media/repo-header.png',
19+
badge: 'soon',
20+
bgStyle: `bg-lime-700`,
21+
textStyle: `text-lime-500`,
22+
repo,
23+
latestBranch: 'main',
24+
latestVersion: 'v0',
25+
availableVersions: ['v0'],
26+
colorFrom: `from-lime-500`,
27+
colorTo: `to-lime-700`,
28+
textColor: `text-lime-700`,
29+
frameworks: ['react', 'solid'],
30+
scarfId: '302d0fef-cb3f-43c6-b45c-f055b9745edb',
31+
defaultDocs: 'overview',
32+
menu: [
33+
{
34+
icon: <VscPreview />,
35+
label: 'Examples',
36+
to: '/pacer/latest/docs/framework/react/examples/simple',
37+
},
38+
{
39+
icon: <BiBookAlt />,
40+
label: 'Docs',
41+
to: '/pacer/latest/docs',
42+
},
43+
{
44+
icon: <FaGithub />,
45+
label: 'Github',
46+
to: `https://github.com/${repo}`,
47+
},
48+
],
49+
featureHighlights: [
50+
{
51+
title: 'Framework Agnostic & Type-Safe',
52+
icon: <VscWand className={twMerge(textStyles)} />,
53+
description: (
54+
<div>
55+
TanStack Pacer provides an intuitive and flexible API that works
56+
across any JavaScript framework.{' '}
57+
<span className={twMerge('font-semibold', textStyles)}>
58+
Every utility is fully type-safe with reactive framework adapters
59+
</span>{' '}
60+
that seamlessly connect to your state management of choice. Choose
61+
from multiple layers of abstraction to confidently control timing in
62+
your applications.
63+
</div>
64+
),
65+
},
66+
{
67+
title: 'Flexible Rate Limiting Controls',
68+
icon: <FaBolt className={twMerge(textStyles)} />,
69+
description: (
70+
<div>
71+
Take control of your application's timing with powerful utilities for{' '}
72+
<span className={twMerge('font-semibold', textStyles)}>
73+
rate limiting, throttling, and debouncing
74+
</span>
75+
. Leverage built-in cleanup and cancellation capabilities to help you
76+
manage execution timing with precision while preventing memory leaks.
77+
Flexible configuration options let you fine-tune the behavior to match
78+
your needs.
79+
</div>
80+
),
81+
},
82+
{
83+
title: 'Async/Sync Queue Management',
84+
icon: <FaCogs className={twMerge(textStyles)} />,
85+
description: (
86+
<div>
87+
Handle complex asynchronous workflows with intelligent queuing and
88+
concurrency control.{' '}
89+
<span className={twMerge('font-semibold', textStyles)}>
90+
Manage long-running tasks with FIFO/LIFO ordering, priority queuing,
91+
and parallel execution
92+
</span>
93+
. Built-in pause, resume and cancel capabilities give you complete
94+
control over your queue's lifecycle. Perfect for managing API calls,
95+
animations, and other sequential operations.
96+
</div>
97+
),
98+
},
99+
],
100+
} satisfies Library

‎app/routeTree.gen.ts‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ import { Route as LibrariesStartVersionIndexImport } from './routes/_libraries/s
3737
import { Route as LibrariesRouterVersionIndexImport } from './routes/_libraries/router.$version.index'
3838
import { Route as LibrariesRangerVersionIndexImport } from './routes/_libraries/ranger.$version.index'
3939
import { Route as LibrariesQueryVersionIndexImport } from './routes/_libraries/query.$version.index'
40+
import { Route as LibrariesPacerVersionIndexImport } from './routes/_libraries/pacer.$version.index'
4041
import { Route as LibrariesFormVersionIndexImport } from './routes/_libraries/form.$version.index'
4142
import { Route as LibrariesConfigVersionIndexImport } from './routes/_libraries/config.$version.index'
4243
import { Route as LibraryIdVersionDocsIndexImport } from './routes/$libraryId/$version.docs.index'
@@ -212,6 +213,14 @@ const LibrariesQueryVersionIndexRoute = LibrariesQueryVersionIndexImport.update(
212213
} as any,
213214
)
214215

216+
const LibrariesPacerVersionIndexRoute = LibrariesPacerVersionIndexImport.update(
217+
{
218+
id: '/pacer/$version/',
219+
path: '/pacer/$version/',
220+
getParentRoute: () => LibrariesRouteRoute,
221+
} as any,
222+
)
223+
215224
const LibrariesFormVersionIndexRoute = LibrariesFormVersionIndexImport.update({
216225
id: '/form/$version/',
217226
path: '/form/$version/',
@@ -416,6 +425,13 @@ declare module '@tanstack/react-router' {
416425
preLoaderRoute: typeof LibrariesFormVersionIndexImport
417426
parentRoute: typeof LibrariesRouteImport
418427
}
428+
'/_libraries/pacer/$version/': {
429+
id: '/_libraries/pacer/$version/'
430+
path: '/pacer/$version'
431+
fullPath: '/pacer/$version'
432+
preLoaderRoute: typeof LibrariesPacerVersionIndexImport
433+
parentRoute: typeof LibrariesRouteImport
434+
}
419435
'/_libraries/query/$version/': {
420436
id: '/_libraries/query/$version/'
421437
path: '/query/$version'
@@ -553,6 +569,7 @@ interface LibrariesRouteRouteChildren {
553569
LibrariesIndexRoute: typeof LibrariesIndexRoute
554570
LibrariesConfigVersionIndexRoute: typeof LibrariesConfigVersionIndexRoute
555571
LibrariesFormVersionIndexRoute: typeof LibrariesFormVersionIndexRoute
572+
LibrariesPacerVersionIndexRoute: typeof LibrariesPacerVersionIndexRoute
556573
LibrariesQueryVersionIndexRoute: typeof LibrariesQueryVersionIndexRoute
557574
LibrariesRangerVersionIndexRoute: typeof LibrariesRangerVersionIndexRoute
558575
LibrariesRouterVersionIndexRoute: typeof LibrariesRouterVersionIndexRoute
@@ -573,6 +590,7 @@ const LibrariesRouteRouteChildren: LibrariesRouteRouteChildren = {
573590
LibrariesIndexRoute: LibrariesIndexRoute,
574591
LibrariesConfigVersionIndexRoute: LibrariesConfigVersionIndexRoute,
575592
LibrariesFormVersionIndexRoute: LibrariesFormVersionIndexRoute,
593+
LibrariesPacerVersionIndexRoute: LibrariesPacerVersionIndexRoute,
576594
LibrariesQueryVersionIndexRoute: LibrariesQueryVersionIndexRoute,
577595
LibrariesRangerVersionIndexRoute: LibrariesRangerVersionIndexRoute,
578596
LibrariesRouterVersionIndexRoute: LibrariesRouterVersionIndexRoute,
@@ -610,6 +628,7 @@ export interface FileRoutesByFullPath {
610628
'/$libraryId/$version/docs/': typeof LibraryIdVersionDocsIndexRoute
611629
'/config/$version': typeof LibrariesConfigVersionIndexRoute
612630
'/form/$version': typeof LibrariesFormVersionIndexRoute
631+
'/pacer/$version': typeof LibrariesPacerVersionIndexRoute
613632
'/query/$version': typeof LibrariesQueryVersionIndexRoute
614633
'/ranger/$version': typeof LibrariesRangerVersionIndexRoute
615634
'/router/$version': typeof LibrariesRouterVersionIndexRoute
@@ -641,6 +660,7 @@ export interface FileRoutesByTo {
641660
'/$libraryId/$version/docs': typeof LibraryIdVersionDocsIndexRoute
642661
'/config/$version': typeof LibrariesConfigVersionIndexRoute
643662
'/form/$version': typeof LibrariesFormVersionIndexRoute
663+
'/pacer/$version': typeof LibrariesPacerVersionIndexRoute
644664
'/query/$version': typeof LibrariesQueryVersionIndexRoute
645665
'/ranger/$version': typeof LibrariesRangerVersionIndexRoute
646666
'/router/$version': typeof LibrariesRouterVersionIndexRoute
@@ -677,6 +697,7 @@ export interface FileRoutesById {
677697
'/$libraryId/$version/docs/': typeof LibraryIdVersionDocsIndexRoute
678698
'/_libraries/config/$version/': typeof LibrariesConfigVersionIndexRoute
679699
'/_libraries/form/$version/': typeof LibrariesFormVersionIndexRoute
700+
'/_libraries/pacer/$version/': typeof LibrariesPacerVersionIndexRoute
680701
'/_libraries/query/$version/': typeof LibrariesQueryVersionIndexRoute
681702
'/_libraries/ranger/$version/': typeof LibrariesRangerVersionIndexRoute
682703
'/_libraries/router/$version/': typeof LibrariesRouterVersionIndexRoute
@@ -714,6 +735,7 @@ export interface FileRouteTypes {
714735
| '/$libraryId/$version/docs/'
715736
| '/config/$version'
716737
| '/form/$version'
738+
| '/pacer/$version'
717739
| '/query/$version'
718740
| '/ranger/$version'
719741
| '/router/$version'
@@ -744,6 +766,7 @@ export interface FileRouteTypes {
744766
| '/$libraryId/$version/docs'
745767
| '/config/$version'
746768
| '/form/$version'
769+
| '/pacer/$version'
747770
| '/query/$version'
748771
| '/ranger/$version'
749772
| '/router/$version'
@@ -778,6 +801,7 @@ export interface FileRouteTypes {
778801
| '/$libraryId/$version/docs/'
779802
| '/_libraries/config/$version/'
780803
| '/_libraries/form/$version/'
804+
| '/_libraries/pacer/$version/'
781805
| '/_libraries/query/$version/'
782806
| '/_libraries/ranger/$version/'
783807
| '/_libraries/router/$version/'
@@ -846,6 +870,7 @@ export const routeTree = rootRoute
846870
"/_libraries/",
847871
"/_libraries/config/$version/",
848872
"/_libraries/form/$version/",
873+
"/_libraries/pacer/$version/",
849874
"/_libraries/query/$version/",
850875
"/_libraries/ranger/$version/",
851876
"/_libraries/router/$version/",
@@ -948,6 +973,10 @@ export const routeTree = rootRoute
948973
"filePath": "_libraries/form.$version.index.tsx",
949974
"parent": "/_libraries"
950975
},
976+
"/_libraries/pacer/$version/": {
977+
"filePath": "_libraries/pacer.$version.index.tsx",
978+
"parent": "/_libraries"
979+
},
951980
"/_libraries/query/$version/": {
952981
"filePath": "_libraries/query.$version.index.tsx",
953982
"parent": "/_libraries"

‎app/routes/_libraries/config.$version.index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ export default function FormVersionIndex() {
3333
const { version } = Route.useParams()
3434
const library = getLibrary('config')
3535

36-
const gradientText = `inline-block leading-snug text-transparent bg-clip-text bg-gradient-to-r ${configProject.colorFrom} ${configProject.colorTo}`
36+
const gradientText = `pr-1 inline-block leading-snug text-transparent bg-clip-text bg-gradient-to-r ${configProject.colorFrom} ${configProject.colorTo}`
3737

3838
return (
3939
<>

‎app/routes/_libraries/form.$version.index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export default function FormVersionIndex() {
4343
setIsDark(window.matchMedia?.(`(prefers-color-scheme: dark)`).matches)
4444
}, [])
4545

46-
const gradientText = `inline-block text-transparent bg-clip-text bg-gradient-to-r ${formProject.colorFrom} ${formProject.colorTo}`
46+
const gradientText = `pr-1 inline-block text-transparent bg-clip-text bg-gradient-to-r ${formProject.colorFrom} ${formProject.colorTo}`
4747

4848
return (
4949
<>

0 commit comments

Comments
 (0)