@g3nomaly/ui 0.3.2 → 0.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +123 -0
  2. package/dist/components.json +20 -20
  3. package/package.json +2 -2
package/README.md ADDED
@@ -0,0 +1,123 @@
1
+ # @g3nomaly/ui
2
+
3
+ `g3nui` copies React components into your project as source files, the way shadcn does. You own the copied files and can edit them. The g3n components ship with this package and are always available. The CLI can also install shadcn components, and you can register other sources: a git repository, an npm package or a local folder.
4
+
5
+ ## Requirements
6
+
7
+ - [Bun](https://bun.sh). The CLI runs on Bun only.
8
+ - A git repository. `g3nui` anchors every command to the repository root.
9
+ - React. Each g3n component is a `.tsx` file that imports its own `.css` file, so your bundler must handle CSS imports.
10
+
11
+ For shadcn components you also need:
12
+
13
+ - the `shadcn` package next to `@g3nomaly/ui` in your project: `bun add -d @g3nomaly/ui shadcn@latest`
14
+ - Tailwind CSS, because shadcn components are styled with Tailwind classes
15
+ - network access, since `g3nui` reads the component list from `ui.shadcn.com`
16
+
17
+ No `components.json` is needed. `g3nui` keeps its own config.
18
+
19
+ ## Install components
20
+
21
+ Run these from the root of your project:
22
+
23
+ ```sh
24
+ bunx @g3nomaly/ui init # writes .g3n.config.json and asks where components go
25
+ bunx @g3nomaly/ui ls # lists the components you can install
26
+ bunx @g3nomaly/ui add button # installs one component
27
+ bunx @g3nomaly/ui add basic # or every component in the basic group
28
+ bunx @g3nomaly/ui add # or pick from a list
29
+ ```
30
+
31
+ `init` asks for the install directory, `src/components/ui` by default, and whether to copy the `.debug.ts` and `.meta.ts` files that come with each component. Pass `--install-dir <path>` to skip the questions, or `-f` to reconfigure without being asked first.
32
+
33
+ `add` installs the dependencies of a component too, so `add cardheader` also installs `card`. Files keep their group folder: `button` lands in `src/components/ui/input/Button.tsx`. The `--debug` and `--meta` flags include the optional files for one run.
34
+
35
+ `g3nui` records what it installed in `.g3n/.g3nui-manifest.json`. Commit it with `.g3n.config.json` so your team gets the same components.
36
+
37
+ ## The g3n components
38
+
39
+ | Key | Group | What it is | Needs |
40
+ |---|---|---|---|
41
+ | `button` | `input` | A button with `primary`, `secondary` and `ghost` variants | |
42
+ | `card` | `basic` | A card container | |
43
+ | `cardheader` | `basic` | The header section of a card | `card` |
44
+ | `cardfooter` | `basic` | The footer section of a card | `card` |
45
+
46
+ The CSS of every component sits under the `.g3nui` class, so it does not leak into the rest of your styles.
47
+
48
+ ## shadcn components
49
+
50
+ shadcn is off until you turn it on. Add `"shadcn"` to `registeredPackages` in `.g3n.config.json`:
51
+
52
+ ```json
53
+ {
54
+ "g3nui": {
55
+ "settings": {
56
+ "registeredPackages": ["shadcn"]
57
+ }
58
+ }
59
+ }
60
+ ```
61
+
62
+ shadcn components then show up in `ls` with an `@shadcn/` prefix:
63
+
64
+ ```sh
65
+ bunx @g3nomaly/ui ls --source shadcn
66
+ bunx @g3nomaly/ui add @shadcn/button @shadcn/dialog
67
+ ```
68
+
69
+ Every shadcn file goes to a `shadcn/` folder in your install directory, for example `src/components/ui/shadcn/button.tsx`. `g3nui` writes each file as the shadcn registry serves it and installs the shadcn components it depends on. It does not install npm packages, so add the ones the files import, such as `class-variance-authority` or `radix-ui`, with `bun add`.
70
+
71
+ ## Keep components up to date
72
+
73
+ ```sh
74
+ bunx @g3nomaly/ui update # every installed component
75
+ bunx @g3nomaly/ui update button # one component
76
+ bunx @g3nomaly/ui update --dry-run # shows what would change
77
+ bunx @g3nomaly/ui remove cardheader
78
+ bunx @g3nomaly/ui ls --installed
79
+ ```
80
+
81
+ `update` reinstalls each component from the source it came from. When you have changed an installed file, `update` asks whether to restore the source version, fork the component under a new key that updates leave alone, or skip it and ask again next time. Pass `-f` to restore without asking. `add -f` does the same for files `add` would overwrite.
82
+
83
+ `remove` offers to remove the installed components that depend on the one you remove. It asks before deleting a file you changed, unless you pass `-f`.
84
+
85
+ If the manifest is lost or out of date, `manifest` scans the install directory and records every component it finds there that a source offers:
86
+
87
+ ```sh
88
+ bunx @g3nomaly/ui manifest
89
+ ```
90
+
91
+ ## Other sources
92
+
93
+ ```sh
94
+ bunx @g3nomaly/ui source add owner/repo # a GitHub repository
95
+ bunx @g3nomaly/ui source add https://git.example.com/ui.git --ref v1
96
+ bunx @g3nomaly/ui source add npm:some-components # an npm package
97
+ bunx @g3nomaly/ui source add ./my-components --name mine # a local folder
98
+ bunx @g3nomaly/ui source ls
99
+ bunx @g3nomaly/ui add card@mine # a component from one source
100
+ bunx @g3nomaly/ui source remove mine
101
+ ```
102
+
103
+ The built-in `g3nui` source cannot be removed. `source remove` also refuses a source that installed components came from, unless you pass `-f`.
104
+
105
+ A source must hold a built `dist/components.json` next to its files in `dist/components/<group>/`. Each component has a `.meta.ts` file that lists its files and dependencies. `writeComponentsJson` from `@g3nomaly/ui/registry` scans those files and writes `components.json`, and `PackagedComponent` from `@g3nomaly/ui/types` types them.
106
+
107
+ ## Development
108
+
109
+ Run `bun install` at the repository root first, then every command from this directory.
110
+
111
+ ```sh
112
+ bun run g3nui -- ls # the CLI from source
113
+ bun run typecheck
114
+ bun run lint
115
+ bun test tests/unit
116
+ bun run build # types, components and dist/components.json into dist/
117
+ ```
118
+
119
+ `@g3nomaly/ui` depends on [`@g3nomaly/core`](https://www.npmjs.com/package/@g3nomaly/core), which holds the install logic it shares with [`@g3nomaly/skills`](https://www.npmjs.com/package/@g3nomaly/skills) and [`@g3nomaly/mods`](https://www.npmjs.com/package/@g3nomaly/mods).
120
+
121
+ ## License
122
+
123
+ Elastic License 2.0. The full text is in the `LICENSE` file of this package.
package/dist/components.json CHANGED
@@ -8,29 +8,29 @@
8
8
  {
9
9
  "path": "input/Button.tsx",
10
10
  "type": "component",
11
- "version": "0.3.2",
11
+ "version": "0.3.3",
12
12
  "hash": "4911cf7ade40890c2bc1ee9eba65b9297f33cc0c1287c550701780295ed16086"
13
13
  },
14
14
  {
15
15
  "path": "input/Button.css",
16
16
  "type": "style",
17
- "version": "0.3.2",
17
+ "version": "0.3.3",
18
18
  "hash": "eaff21a3e7afa0e48210f146e6558df6997ff31fa8d239031ea110914d5ff208"
19
19
  },
20
20
  {
21
21
  "path": "input/Button.debug.ts",
22
22
  "type": "util",
23
- "version": "0.3.2",
23
+ "version": "0.3.3",
24
24
  "hash": "f7be8d51584045a3dd712741922c9009fd1879db06915fcf1f11b9b4152d1441"
25
25
  },
26
26
  {
27
27
  "path": "input/button.meta.ts",
28
28
  "type": "meta",
29
- "version": "0.3.2",
29
+ "version": "0.3.3",
30
30
  "hash": "51294b1c334186be2378259245c3a444b509328785f7ceee6d555ccc99ad05c6"
31
31
  }
32
32
  ],
33
- "version": "0.3.2"
33
+ "version": "0.3.3"
34
34
  },
35
35
  "card": {
36
36
  "name": "Card",
@@ -41,29 +41,29 @@
41
41
  {
42
42
  "path": "basic/Card.tsx",
43
43
  "type": "component",
44
- "version": "0.3.2",
44
+ "version": "0.3.3",
45
45
  "hash": "2602d00902b38c45d4a6409febe47bdb9e79657d83d7da3bc4dff3c7a3ebea6d"
46
46
  },
47
47
  {
48
48
  "path": "basic/Card.css",
49
49
  "type": "style",
50
- "version": "0.3.2",
50
+ "version": "0.3.3",
51
51
  "hash": "5315468962112167dd37b4893e7d38404c19a7f2ba76bf51372bc30d67d5dc42"
52
52
  },
53
53
  {
54
54
  "path": "basic/Card.debug.ts",
55
55
  "type": "util",
56
- "version": "0.3.2",
56
+ "version": "0.3.3",
57
57
  "hash": "acecf600200a49337f65714f0b2b4efc5325446b11fa49d5360f1aee88f1023f"
58
58
  },
59
59
  {
60
60
  "path": "basic/card.meta.ts",
61
61
  "type": "meta",
62
- "version": "0.3.2",
62
+ "version": "0.3.3",
63
63
  "hash": "4ffcfd020601e222f26961ac595f478d6e8907ad894cdba992ea2b34a8ba6b92"
64
64
  }
65
65
  ],
66
- "version": "0.3.2"
66
+ "version": "0.3.3"
67
67
  },
68
68
  "cardfooter": {
69
69
  "name": "CardFooter",
@@ -76,29 +76,29 @@
76
76
  {
77
77
  "path": "basic/CardFooter.tsx",
78
78
  "type": "component",
79
- "version": "0.3.2",
79
+ "version": "0.3.3",
80
80
  "hash": "bfd4e73de6b16b529c22ca69e4661c30bd4be1237a5972eefce45cd6deb7dff5"
81
81
  },
82
82
  {
83
83
  "path": "basic/CardFooter.css",
84
84
  "type": "style",
85
- "version": "0.3.2",
85
+ "version": "0.3.3",
86
86
  "hash": "751573c89dc46e83c9f240e58895f42652399f0519907c058568b14aaa52cb4d"
87
87
  },
88
88
  {
89
89
  "path": "basic/CardFooter.debug.ts",
90
90
  "type": "util",
91
- "version": "0.3.2",
91
+ "version": "0.3.3",
92
92
  "hash": "3226f24e154a19daf4f0d9828245ff0cdf7b2e8bb75f10d785a33c1234578484"
93
93
  },
94
94
  {
95
95
  "path": "basic/cardfooter.meta.ts",
96
96
  "type": "meta",
97
- "version": "0.3.2",
97
+ "version": "0.3.3",
98
98
  "hash": "1e9d82552826862ca25f13e71f80301b61fa8b9c3c8d0dc3ed51038db5b0f94c"
99
99
  }
100
100
  ],
101
- "version": "0.3.2"
101
+ "version": "0.3.3"
102
102
  },
103
103
  "cardheader": {
104
104
  "name": "CardHeader",
@@ -111,28 +111,28 @@
111
111
  {
112
112
  "path": "basic/CardHeader.tsx",
113
113
  "type": "component",
114
- "version": "0.3.2",
114
+ "version": "0.3.3",
115
115
  "hash": "fac021c0f55b4c115b0b9fcc3e6f452aea7403e99b4b7a1287861de5653c9eb5"
116
116
  },
117
117
  {
118
118
  "path": "basic/CardHeader.css",
119
119
  "type": "style",
120
- "version": "0.3.2",
120
+ "version": "0.3.3",
121
121
  "hash": "e36cf86636d2e7619dd69725faaedac9604a9605be11c0e2a6aa3663db8c3b53"
122
122
  },
123
123
  {
124
124
  "path": "basic/CardHeader.debug.ts",
125
125
  "type": "util",
126
- "version": "0.3.2",
126
+ "version": "0.3.3",
127
127
  "hash": "e5879c6caebc2d14ffaf49b8d630a32a23c1c5a1c3877288d7ea4333e333c9e7"
128
128
  },
129
129
  {
130
130
  "path": "basic/cardheader.meta.ts",
131
131
  "type": "meta",
132
- "version": "0.3.2",
132
+ "version": "0.3.3",
133
133
  "hash": "46d85bb6e00d8fa518548b89a89deb53c2e27304fc5f808f7e4cd5472a51871a"
134
134
  }
135
135
  ],
136
- "version": "0.3.2"
136
+ "version": "0.3.3"
137
137
  }
138
138
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@g3nomaly/ui",
3
- "version": "0.3.2",
3
+ "version": "0.3.3",
4
4
  "description": "Component library with CLI installer for g3n projects.",
5
5
  "type": "module",
6
6
  "bin": {
@@ -47,7 +47,7 @@
47
47
  },
48
48
  "dependencies": {
49
49
  "@clack/prompts": "^1.7.0",
50
- "@g3nomaly/core": "^0.3.2",
50
+ "@g3nomaly/core": "^0.3.3",
51
51
  "chalk": "^6.0.0",
52
52
  "commander": "^15.0.0",
53
53
  "glob": "^13.0.6",