Skip to content

Commit 5b38172

Browse files
pheralbpheralb
authored
Merge pull request #16 from pheralb/next
Update Prerequisites + initial @code-blocks/registry package
2 parents be291fe + 19d66a0 commit 5b38172

File tree

13 files changed

+894
-36
lines changed

13 files changed

+894
-36
lines changed

‎apps/website/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
},
3636
"devDependencies": {
3737
"@code-blocks/eslint": "workspace:*",
38+
"@code-blocks/registry": "workspace:*",
3839
"@content-collections/cli": "0.1.9",
3940
"@content-collections/core": "0.14.1",
4041
"@content-collections/mdx": "0.2.2",

‎apps/website/src/components/registry/build-registry.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { ShadcnRegistry } from "@/types/registry";
1+
import type { ShadcnRegistry } from "@code-blocks/registry";
22

33
import chalk from "chalk";
44
import { RegistryData } from "./data";
@@ -83,7 +83,9 @@ const main = () => {
8383
minute: "2-digit",
8484
});
8585

86-
log(chalk.green(`|- ✅ shadcn build completed successfully (${currentDate})`));
86+
log(
87+
chalk.green(`|- ✅ shadcn build completed successfully (${currentDate})`),
88+
);
8789
} catch (error) {
8890
console.log(
8991
chalk.red.bold(

‎apps/website/src/docs/getting-started/prerequisites.mdx‎

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ To create your own custom Code Block component, make sure you have the following
88

99
- [Node.js v20](https://nodejs.org/en/download/current) or higher.
1010
- [Typescript v5](https://www.typescriptlang.org/) or higher.
11-
- If you plan to use the [shadcn/ui CLI](https://ui.shadcn.com/docs/cli), make sure you configure the [`components.json`](https://ui.shadcn.com/docs/components-json) file first.
1211

1312
## Styling
1413

@@ -80,6 +79,30 @@ You'll need to install [@base-ui/react](https://base-ui.com/) to use the Blocks
8079
}
8180
```
8281

82+
## shadcn/ui
83+
84+
[shadcn/ui](https://ui.shadcn.com/) is a collection of accessible and customizable UI components styled with Tailwind CSS. It provides a CLI that you can use it to add components to your project using the [`components.json`](https://ui.shadcn.com/docs/components-json) file.
85+
86+
### Add registry
87+
88+
If you don't have a `components.json` file yet, initialize it by running:
89+
90+
<CodeBlockSelectPkg
91+
title="shadcn/ui Init"
92+
type="dlx"
93+
command="shadcn@latest init"
94+
/>
95+
96+
Then, add the [`registries`](https://ui.shadcn.com/docs/components-json#registries) section to your `components.json` file:
97+
98+
```json {3}
99+
{
100+
"registries": {
101+
"@code-blocks": "https://code-blocks.pheralb.dev/r/{name}.json"
102+
}
103+
}
104+
```
105+
83106
## Utilities
84107

85108
All the utilities are built using TypeScript. You'll only need install the highlighter library you choose to use:

‎apps/website/src/types/registry.ts‎

Lines changed: 3 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,9 @@
11
import type { Languages } from "@/utils/shiki/highlight";
2-
import type { ComponentType, LazyExoticComponent } from "react";
3-
4-
// https://ui.shadcn.com/docs/registry/registry-item-json#type
5-
export type RegistryType =
6-
| "registry:ui"
7-
| "registry:hook"
8-
| "registry:block"
9-
| "registry:lib"
10-
| "registry:file"
11-
| "registry:component";
12-
13-
export type RegistryGroup = "shiki" | "sugar-high" | "blocks";
142

15-
export interface ShadcnRegistry {
16-
name: string;
17-
title?: string;
18-
type: RegistryType;
19-
target?: string;
20-
dependencies?: string[];
21-
devDependencies?: string[];
22-
registryDependencies?: string[];
23-
files?: {
24-
path: string;
25-
target?: string;
26-
type: RegistryType;
27-
}[];
28-
}
3+
import type { BaseRegistry } from "@code-blocks/registry";
4+
import type { ComponentType, LazyExoticComponent } from "react";
295

30-
export interface RegistryComponent {
31-
title: string;
6+
export interface RegistryComponent extends BaseRegistry {
327
fileType: Languages;
33-
shadcnRegistry: ShadcnRegistry;
34-
fileSource: string;
35-
group?: RegistryGroup;
368
reactComponent?: LazyExoticComponent<ComponentType>;
37-
exampleFileSource?: string;
389
}

‎apps/website/tsconfig.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@
2121
],
2222
"paths": {
2323
"@/*": ["./src/*"],
24-
"content-collections": ["./.content-collections/generated"]
24+
"content-collections": ["./.content-collections/generated"],
25+
"@code-blocks/registry": ["../../packages/registry/src/index.ts"]
2526
}
2627
},
2728
"include": [

‎packages/eslint/configs/base.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ export const baseConfig = defineConfig(
1818
extends: [js.configs.recommended, ...ts.configs.recommended],
1919
rules: {
2020
...turbo.configs.recommended.rules,
21+
"turbo/no-undeclared-env-vars": "off",
2122
"@typescript-eslint/no-unused-vars": [
2223
"error",
2324
{ argsIgnorePattern: "^_", varsIgnorePattern: "^_" },

‎packages/registry/eslint.config.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { defineConfig } from "eslint/config";
2+
3+
// Plugins:
4+
import { baseConfig } from "@code-blocks/eslint/base";
5+
6+
const eslintConfig = defineConfig(baseConfig);
7+
8+
export default eslintConfig;

‎packages/registry/package.json‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"name": "@code-blocks/registry",
3+
"type": "module",
4+
"version": "0.0.0",
5+
"private": true,
6+
"license": "MIT",
7+
"files": [
8+
"dist"
9+
],
10+
"exports": {
11+
".": "./dist/index.mjs",
12+
"./types": {
13+
"import": "./dist/types/index.mjs",
14+
"types": "./dist/types/index.d.mts"
15+
}
16+
},
17+
"main": "./dist/index.mjs",
18+
"module": "./dist/index.mjs",
19+
"types": "./dist/index.d.mts",
20+
"scripts": {
21+
"build": "eslint ./src && tsdown",
22+
"dev": "tsdown --watch",
23+
"typecheck": "tsc --noEmit",
24+
"prepublishOnly": "pnpm run build",
25+
"check:lint": "eslint ./src",
26+
"fix:lint": "eslint ./src --fix"
27+
},
28+
"devDependencies": {
29+
"@code-blocks/eslint": "workspace:*",
30+
"@types/node": "22.19.13",
31+
"bumpp": "10.4.1",
32+
"eslint": "9.39.3",
33+
"tsdown": "0.20.3",
34+
"typescript": "5.9.3"
35+
}
36+
}

‎packages/registry/src/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from "./types";

‎packages/registry/src/types/index.ts‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
export type RegistryType =
2+
| "registry:ui"
3+
| "registry:hook"
4+
| "registry:block"
5+
| "registry:lib"
6+
| "registry:file"
7+
| "registry:component";
8+
9+
export type RegistryGroup = "shiki" | "sugar-high" | "blocks";
10+
11+
export interface ShadcnRegistry {
12+
name: string;
13+
title?: string;
14+
type: RegistryType;
15+
target?: string;
16+
dependencies?: string[];
17+
devDependencies?: string[];
18+
registryDependencies?: string[];
19+
files?: {
20+
path: string;
21+
target?: string;
22+
type: RegistryType;
23+
}[];
24+
}
25+
26+
export interface BaseRegistry {
27+
title: string;
28+
fileType: string;
29+
shadcnRegistry: ShadcnRegistry;
30+
fileSource: string;
31+
group?: RegistryGroup;
32+
exampleFileSource?: string;
33+
}

0 commit comments

Comments
 (0)