open-index/open-npm huggingface dataset:
npm package: @milkfloat/components
Description: This is currently under development.
Latest version: 1.12.0

# The Halo Component Library

This is currently under development.

## Getting Started

You can view and interact with this library using our UI Workshop powered by Storybook.

To contribute, see our guidance documentation at [halo-ui-guidance](https://engineering/bitbucket/projects/CREATIVE/repos/halo-ui-guidance) for some guidance on coding best practice and standards.

## Optional Dependencies

Certain components within the Halo library make use of Moasic (Lowside Stub) components from GLib. To make use of these lowside components you will need to update your `.npmrc` file with the registry location and authToken to allow npm to find the libaries.

```
npm login --registry=<Glib Registry> --scope=@glib
```

## Available Scripts

In the project directory, you can run:

### `npm run storybook`

Runs the UI Workshop for the Library.<br>
Open [http://localhost:9009](http://localhost:9009) to view it in the browser.

The page will reload if you make edits.<br>

### `npm test`

Launches the test runner in the interactive watch mode.<br>
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.

### `npm run build`

Prettifies the codebase to meet coding standards then creates a dist version of the library which will be used by peer projects. Note that you will need to run this for peers to be able to use the updated codebase.

## About the build process

We use kcd-scripts to provide our utility scripts and tools for development. These include babelifying our codebase ready for distribution and linting utility. These are easily extended via the standard configuration files for babel and prettier. See: https://github.com/kentcdodds/kcd-scripts

# TODO

For developers looking to contribute to this project, please consider helping out on the following:

- Add Application Icon style
- Add Breadcrumb component
- Theme override / extension
- Build up documentation
npm package: @milkfloat/generators
Description: Code generators for Halo
Latest version: 1.0.1-rc1

# Frontend Code Generators

![Project Status](https://img.shields.io/badge/Development-In%20Progress-yellow.svg) ![Project Build](https://img.shields.io/badge/Build-%200.0.1-blue.svg)

These are code generators to create code from templates to aid with faster development.

This is part of the Developer Experience (DX) initiative of the Design System - to aid developers working with new and existing projects.

## Getting Started

These generators create code for React projects and are compatible with the design system's starter-kit.

1. Add this repo to your projects dependencies (package.json)
2. Add a script to your package.json to trigger the generators: `"generate": "plop --plopfile ./node_modules/halo-ui-generators/index.js"`
3. Run `npm run generate <component|hook|view> {name}`

You could also create your own plopfile.js to export the file from your node_modules - this allows you to extend with your own configurations if required. This is the method used by the starter-kit.

**plopfile.js**<br />
`module.exports = require("./node_modules/halo-ui-generators")`

**npm scripts (add to package.json)**<br />

```
"generate": "plop",
...
```

## Available Generators

### Component

`plop component <name>`

This creates a new folder, component, unit test file and default README.md with some basic scaffolding.

### View

`plop view <name>`

This creates a new folder, component, provider, unit test file and default README.md with some basic scaffolding.

This is used for the top-level route components (pages). You can use the providers to encapsulate route specific state.

### Context

`plop context <name>`

This creates a file inside the context directory with some basic scaffolding for generic Context API usage. The file will export a `Provider` and a `hook` to use the context in other components.

### Hook

`plop hook <name>`

This creates a js file inside the hooks directory with some basic scaffolding for generic usage.

## Technology

Plop has been used to generate code via templates. https://plopjs.com/
npm package: @milkfloat/halo-components
Description: This is currently under development.
Latest version: 1.12.0-rc5

# The Halo Component Library

This is currently under development.

## Getting Started

You can view and interact with this library using our UI Workshop powered by Storybook.

To contribute, see our guidance documentation at [halo-ui-guidance](https://engineering/bitbucket/projects/CREATIVE/repos/halo-ui-guidance) for some guidance on coding best practice and standards.

## Optional Dependencies

Certain components within the Halo library make use of Moasic (Lowside Stub) components from GLib. To make use of these lowside components you will need to update your `.npmrc` file with the registry location and authToken to allow npm to find the libaries.

```
npm login --registry=<Glib Registry> --scope=@glib
```

## Available Scripts

In the project directory, you can run:

### `npm run storybook`

Runs the UI Workshop for the Library.<br>
Open [http://localhost:9009](http://localhost:9009) to view it in the browser.

The page will reload if you make edits.<br>

### `npm test`

Launches the test runner in the interactive watch mode.<br>
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.

### `npm run build`

Prettifies the codebase to meet coding standards then creates a dist version of the library which will be used by peer projects. Note that you will need to run this for peers to be able to use the updated codebase.

## About the build process

We use kcd-scripts to provide our utility scripts and tools for development. These include babelifying our codebase ready for distribution and linting utility. These are easily extended via the standard configuration files for babel and prettier. See: https://github.com/kentcdodds/kcd-scripts

# TODO

For developers looking to contribute to this project, please consider helping out on the following:

- Add Application Icon style
- Add Breadcrumb component
- Theme override / extension
- Build up documentation
npm package: @milkfloat/halo-generators
Description: Code generators for Halo
Latest version: 1.0.1-rc2

# Frontend Code Generators

![Project Status](https://img.shields.io/badge/Development-In%20Progress-yellow.svg) ![Project Build](https://img.shields.io/badge/Build-%200.0.1-blue.svg)

These are code generators to create code from templates to aid with faster development.

This is part of the Developer Experience (DX) initiative of the Design System - to aid developers working with new and existing projects.

## Getting Started

These generators create code for React projects and are compatible with the design system's starter-kit.

1. Add this repo to your projects dependencies (package.json)
2. Add a script to your package.json to trigger the generators: `"generate": "plop --plopfile ./node_modules/halo-ui-generators/index.js"`
3. Run `npm run generate <component|hook|view> {name}`

You could also create your own plopfile.js to export the file from your node_modules - this allows you to extend with your own configurations if required. This is the method used by the starter-kit.

**plopfile.js**<br />
`module.exports = require("./node_modules/halo-ui-generators")`

**npm scripts (add to package.json)**<br />

```
"generate": "plop",
...
```

## Available Generators

### Component

`plop component <name>`

This creates a new folder, component, unit test file and default README.md with some basic scaffolding.

### View

`plop view <name>`

This creates a new folder, component, provider, unit test file and default README.md with some basic scaffolding.

This is used for the top-level route components (pages). You can use the providers to encapsulate route specific state.

### Context

`plop context <name>`

This creates a file inside the context directory with some basic scaffolding for generic Context API usage. The file will export a `Provider` and a `hook` to use the context in other components.

### Hook

`plop hook <name>`

This creates a js file inside the hooks directory with some basic scaffolding for generic usage.

## Technology

Plop has been used to generate code via templates. https://plopjs.com/
npm package: @milkfloatbae/halo-components
Description: This is currently under development.
Latest version: 2.0.4

# The Halo Component Library

This is currently under development.

## Getting Started

You can view and interact with this library using our UI Workshop powered by Storybook.

To contribute, see our guidance documentation at [halo-ui-guidance](https://engineering/bitbucket/projects/CREATIVE/repos/halo-ui-guidance) for some guidance on coding best practice and standards.

## Optional Dependencies

Certain components within the Halo library make use of Moasic (Lowside Stub) components from GLib. To make use of these lowside components you will need to update your `.npmrc` file with the registry location and authToken to allow npm to find the libaries.

```
npm login --registry=<Glib Registry> --scope=@glib
```

## Available Scripts

In the project directory, you can run:

### `npm run storybook`

Runs the UI Workshop for the Library.<br>
Open [http://localhost:9009](http://localhost:9009) to view it in the browser.

The page will reload if you make edits.<br>

### `npm test`

Launches the test runner in the interactive watch mode.<br>
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.

### `npm run build`

Prettifies the codebase to meet coding standards then creates a dist version of the library which will be used by peer projects. Note that you will need to run this for peers to be able to use the updated codebase.

## About the build process

We use kcd-scripts to provide our utility scripts and tools for development. These include babelifying our codebase ready for distribution and linting utility. These are easily extended via the standard configuration files for babel and prettier. See: https://github.com/kentcdodds/kcd-scripts

# TODO

For developers looking to contribute to this project, please consider helping out on the following:

- Add Application Icon style
- Add Breadcrumb component
- Theme override / extension
- Build up documentation
npm package: @milkfloatbae/halo-generators
Description: Code generators for Halo
Latest version: 2.0.1

# Frontend Code Generators

![Project Status](https://img.shields.io/badge/Development-In%20Progress-yellow.svg) ![Project Build](https://img.shields.io/badge/Build-%200.0.1-blue.svg)

These are code generators to create code from templates to aid with faster development.

This is part of the Developer Experience (DX) initiative of the Design System - to aid developers working with new and existing projects.

## Getting Started

These generators create code for React projects and are compatible with the design system's starter-kit.

1. Add this repo to your projects dependencies (package.json)
2. Add a script to your package.json to trigger the generators: `"generate": "plop --plopfile ./node_modules/halo-ui-generators/index.js"`
3. Run `npm run generate <component|hook|view> {name}`

You could also create your own plopfile.js to export the file from your node_modules - this allows you to extend with your own configurations if required. This is the method used by the starter-kit.

**plopfile.js**<br />
`module.exports = require("./node_modules/halo-ui-generators")`

**npm scripts (add to package.json)**<br />

```
"generate": "plop",
...
```

## Available Generators

### Component

`plop component <name>`

This creates a new folder, component, unit test file and default README.md with some basic scaffolding.

### View

`plop view <name>`

This creates a new folder, component, provider, unit test file and default README.md with some basic scaffolding.

This is used for the top-level route components (pages). You can use the providers to encapsulate route specific state.

### Context

`plop context <name>`

This creates a file inside the context directory with some basic scaffolding for generic Context API usage. The file will export a `Provider` and a `hook` to use the context in other components.

### Hook

`plop hook <name>`

This creates a js file inside the hooks directory with some basic scaffolding for generic usage.

## Technology

Plop has been used to generate code via templates. https://plopjs.com/