open-index/open-npm huggingface dataset:
npm package: @ryannerd/ember-toggle-button
Description: Ember CLI ember-toggle-button component add-on.
Author: Ryan Jentzsch
Latest version: 0.1.0

# Ember-toggle-button

This is an Ember add-on for a simple yet powerful toggle button.

## Installation

* From Ember:
	`ember install @ryannerd/ember-toggle-button`

* Using NPM:
	`npm install @ryannerd/ember-toggle-button`

## Using in your Ember Application
	Once installed simply wrap an HTML element in an ember-toggle-button block:

```
<!-- This will add a toggle button to the right of the Test Button element -->
{{#ember-toggle-button}}
	<button>Test Button</button>
{{/ember-toggle-button}}
```

* Properties
	- leftOffset (float) [optional] Tweaks the button position in px. (e.g. a value of -2 will move the toggle button 2px to the left)
	- topOffset (float) [optional] Tweaks the button position in px vertically.
	- useDefaultToggleAction (bool) [optional] Defaults to true.
	- toggleWidth (string) [optional] Default is '5%'.

* Actions
	- `toggleButtonClicked(isOpen, target)` 
		Fires when the toggle button is clicked. 
		`isOpen` (bool) indicates the toggle button's state.
		`target` (Jquery object) This is the element that the toggle button is "attached" to.

## Examples

Table wrapped in ember-toggle-button

```
<!--- table-example.hbs -->
{{#ember-toggle-button
	toggleWidth="-=12px"
	topOffset=43
	leftOffset=0
	toggleButtonClicked=(action "toggleTableClicked")
}}
	<table style="border-width: 3px;border-style:solid;">
		<tr>
			<th style="border-style:solid;">First name</th>
			<th style="border-style:solid;">Last name</th>
		</tr>
		<tr>
			<td style="border-style:solid;">John</td>
			<td style="border-style:solid;">Doe</td>
		</tr>
		<tr>
			<td style="border-style:solid;">Jane</td>
			<td style="border-style:solid;">Doe</td>
		</tr>
	</table>
{{/ember-toggle-button}}
```

```
// table-example.js
actions:
{
	toggleTableClicked(isOpen, target)
	{
		if (isOpen)
		{
			target.css('background-color', 'white');
		}
		else
		{
			target.css('background-color', 'blue');
		}
	}
```

Button wrapped in the ember-toggle-button
```
{{#ember-toggle-button}}
	<button>Really Wide Button That is Super Wide</button>
{{/ember-toggle-button}}
```


## Running (as dummy)

* `ember serve`
* Go to http://localhost:4200.

## Running Tests (as dummy)

* `npm test` (Runs `ember try:testall` will test ember-toggle-button against multiple Ember versions)
* `ember test`
* `ember test --server`

## Building (as dummy)

* `ember build`

For more information on using ember-cli, visit [http://ember-cli.com/](http://ember-cli.com/).
npm package: @ryanpiv/core-styles
Description: Core styles I like to use in most of my front end development
Author: ryanpiveteau@gmail.com
Latest version: 1.0.0

# core-styles
Helpful variables, functions, mixins I like to use in most of my projects

## Local development
To lint and compile Sass: `npm run test`.

## How to publish updates
### First, increment the package version in your branch PR
1. Bump version in `package.json` and `package-lock.json`
2. Add, commit, push

### Second, publish the new package version
1. Merge your (approved) PR into `master`
2. Checkout `master` and pull the latest changes
3. `npm pack`
4. `npm publish`

### Third, make a new release
1. Go to repo page in Github
2. Click "Releases" tab
3. Click "Draft a new release" button
4. Enter tag version (e.g. `v0.0.5`)
5. Enter release title
6. Draft release description
7. Click "Publish release" button
8.
npm package: @ryanpromax/eslint-config
Description: [![npm](https://img.shields.io/npm/v/@ryanpromax/eslint-config)](https://npmjs.com/package/@ryanpromax/eslint-config)
Author: Ryan
Latest version: 2.0.0

# @RyanProMax/eslint-config

[![npm](https://img.shields.io/npm/v/@ryanpromax/eslint-config)](https://npmjs.com/package/@ryanpromax/eslint-config)

## Usage

### 1. Install

```bash
npm i -D eslint @ryanpromax/eslint-config
```

### 2. Config `.eslintrc`

```json
{
  "extends": [
    "@ryanpromax"
  ]
}
```

### 3. Config `.eslintignore`

```txt
dist
public
```

### 4. Add script for package.json

For example:

```json
{
  "scripts": {
    "lint": "eslint \"**/*.{jsx,ts,js}\""
  }
}
```

### 5. Config VSCode auto fix

Create `.vscode/settings.json`

```json
{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}
```
npm package: @ryanpromax/vite-plugin-transfer-mpa
Description: > design for electron project mainly.
Author: Ryan
Latest version: 0.0.5

# vite-plugin-transfer-mpa

> design for electron project mainly.

## Motivation

It will move the entry html file to the root directory, and rename the file with it's directory name.

So you should ensure that `scanDir` is the parent directory of `the entry html file`.

e.g `build/pages/home/index.html` -> `build/home.html`

## Usage

```sh
npm install @ryanpromax/vite-plugin-transfer-mpa
```

```ts
// vite.config.ts
import mpa from '@ryanpromax/vite-plugin-transfer-mpa'

// @see https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    // ...other plugins
    mpa(/* options */),
  ]
})
```

## Options

```ts
{
  /**
   * @description 打包目录
   * package directory
   * @default 'path.resolve(viteConfig.root, viteConfig.build.outDir) || path.resolve(process.cwd(), "dist")'
   */
  buildDir: string
  /**
   * @description 扫描目录
   * where to locate pages
   * @default 'path.resolve(buildDir, "pages")'
   */
  scanDir: string
  /**
   * @description 文件名
   * what is your html file name, e.g. index.html / main.html / entry.html / template.html
   * @default 'index.html'
   */
  filename: string
}
```