diff --git a/.gitignore b/.gitignore index d6e4fe053..c7bdfbf52 100644 --- a/.gitignore +++ b/.gitignore @@ -8,3 +8,4 @@ tsconfig.vitest-temp.json website/.vitepress/dist website/.vitepress/cache legacy +.vitepress diff --git a/website/content/guides/overview/getting-started-generated.md b/website/content/guides/overview/getting-started-generated.md index b41d4a169..bff2891c7 100644 --- a/website/content/guides/overview/getting-started-generated.md +++ b/website/content/guides/overview/getting-started-generated.md @@ -166,24 +166,40 @@ console.log(countries) Its worth knowing Graffle also gives you utilities beyond the direct client itself. For example you can build up reusable selection sets: -```ts twoslash -// TODO -// import { Select } from './graffle/__.js' -import { Select } from './graffle/modules/Select.js' +::: code-group + +```ts twoslash [Graffle Namespace] +import { Graffle } from './graffle/__.js' + +const ContinentSelection = Graffle.Select.Continent({ name: true }) +``` + +```ts twoslash [Barrel Import] +import { Select } from './graffle/_.js' const ContinentSelection = Select.Continent({ name: true }) ``` +::: + You can also do the same thing at the type level which can sometimes be handy when you want to define data types based on selection sets. -```ts twoslash -// TODO -// import { type Select } from './graffle/__.js' -import { type Select } from './graffle/modules/Select.js' +::: code-group + +```ts twoslash [Graffle Namespace] +import { type Graffle } from './graffle/__.js' + +type Continent = Graffle.Select.Continent<{ name: true }> +``` + +```ts twoslash [Barrel Import] +import { type Select } from './graffle/_.js' type Continent = Select.Continent<{ name: true }> ``` +::: + ## Conclusion There is more to learn (e.g. how directives, unions, interfaces, custom scalars, ... are modelled into the TypeScript interface) but hopefully this has already given you some confidence to go off and start building. Of course feel free to continue digging deeper into more specific feature guides too. Thanks for taking time to learn Graffle and we're excited to see what you'll build!