open-index/open-npm huggingface dataset:
npm package: @itgkey/keystatic-toolkit
Description: Toolkit for Keystatic + Astro projects.
Latest version: 0.6.0

# @itgkey/keystatic-toolkit

Toolkit for Keystatic + Astro projects.

## What it provides

- Keystatic branding helpers
- Optional blog field blocks
- Astro admin redirect + toolbar shortcuts
- Local file blog content loader (`getKeystaticPosts`, `getKeystaticPost`)

## Install

```bash
pnpm add @itgkey/keystatic-toolkit
```

## One-command setup

After install, run:

```bash
itgkey install
```

This scaffolds and patches:

- `src/pages/posts/index.astro`
- `src/pages/posts/[slug].astro`
- `astro.config.*` when present
- `keystatic.config.*` when present

Use `itgkey install --force` to overwrite existing files.

## Fast setup

### Astro config

```js
import { defineConfig } from 'astro/config';
import { keystaticAdminExperienceIntegration } from '@itgkey/keystatic-toolkit';

export default defineConfig({
  integrations: [keystaticAdminExperienceIntegration()]
});
```

### Keystatic config

```ts
import { config, fields, collection } from '@keystatic/core';
import {
  createKeystaticToolkitUi,
  createKeystaticToolkitBlogOptionalFields
} from '@itgkey/keystatic-toolkit';

const ui = createKeystaticToolkitUi();
const blogOptionalFieldBlocks = createKeystaticToolkitBlogOptionalFields(fields);

export default config({
  storage: {
    kind: 'local'
  },
  ui,
  collections: {
    posts: collection({
      label: 'Posts',
      path: 'src/content/posts/*/',
      slugField: 'slug',
      format: {
        data: 'yaml',
        contentField: 'content'
      },
      previewUrl: '/posts/{slug}',
      schema: {
        title: fields.text({ label: 'Title' }),
        slug: fields.slug({
          name: { label: 'Slug Source' },
          slug: { label: 'Slug' }
        }),
        content: fields.markdoc({ label: 'Content' }),
        optionalFields: fields.blocks(blogOptionalFieldBlocks, {
          label: 'Optional Fields',
          validation: { length: { min: 0 } }
        })
      }
    })
  }
});
```

### Blog page route

Create a dynamic page at `src/pages/posts/[slug].astro` to render each post URL.

## Content loader usage

The toolkit now includes utilities so you do not need to write your own YAML/frontmatter parser.

```ts
import { getKeystaticPosts, getKeystaticPost } from '@itgkey/keystatic-toolkit';

const posts = await getKeystaticPosts();
const single = await getKeystaticPost('my-slug');
```

Default content directory for these helpers is `src/content/posts`.

## Notes

- Toolbar shortcuts run in Astro dev mode.
- If your collection keys differ, pass a custom `routeMap` to `keystaticAdminExperienceIntegration(...)`.
- This package does not auto-generate frontend page files.
npm package: @itgnet/lib-angular-design
Description: This library defines multiple components that follow a common design and should be used in our applications. Components are defined using an approach to atomich design following the pattern Molecules -> Organisms -> Templates.
Latest version: 0.0.10-SNAPSHOT

# Angular Design Library

This library defines multiple components that follow a common design and should be used in our applications. Components are defined using an approach to atomich design following the pattern Molecules -> Organisms -> Templates.

- **Molecules**: This hierarchy level includes basic web elements like buttons, form controls, sliders or containers.
- **Organisms**: Organisms level consists of groups of molecules such as cards, navigation modals or file uploaders.
- **Templates**: At the last level of hierarchy there are templates for unique pages as wizard steps or onboarding questions.

You can find all this components thoroughly docummented in our [Storybook](https://design.itg.es/).

# Using Angular Design Library
#### Installation
`npm install @itgnet/lib-angular-design`