open-index/open-npm huggingface dataset:
npm package: @myevery/prettier
Description: Prettier Configuration for myevery
Author: @myevery
Latest version: 0.0.1

# @myevery/prettier

## Install
```
npm install --save-dev prettier @myevery/prettier
```

## Usage
Add `.prettierrc.js` file in the project root with the following content:

```js
module.exports = require("@myevery/prettier");
```
npm package: @myevery/stylelint
Description: Stylelint config
Author: @myevery
Latest version: 0.0.0

# @myevery/stylelint

## Install
```
npm install --save-dev stylelint postcss @myevery/stylelint
```

## Usage
Add `.stylelintrc` file in the project root with the following content:

```json
{
    "extends": "@myevery/stylelint"
}
```

### Prettier
If you are using Prettier, extend root config with the additional rules:

```json
{
    "extends": ["@myevery/stylelint", "@myevery/stylelint/prettier"]
}
```

### Order
If you want to order properties in your css files, extend root config with the additional rules:

```json
{
    "extends": ["@myevery/stylelint", "@myevery/stylelint/order"]
}
```
npm package: @myevery/tailwind
Description: <p align="center">   <a href="https://myevery.ai" title="Our official website">by <strong>myevery.ai</strong></a> </p>
Author: myevery
Latest version: 0.1.1


<p align="center">
  <a href="https://myevery.ai" title="Our official website">by <strong>myevery.ai</strong></a>
</p>

---

## My UI - Tailwind CSS 

This package contains the Tailwind CSS preset, components, and shared utils like custom colors used in My UI.

## Installation

```bash
pnpm install -D @myevery/tailwind
```

## Usage

The simplest way to register My UI is to use `withMyUI` helper function.

```ts
// tailwind.config.ts
import { withMyUI } from '@myevery/tailwind'

export default withMyUI({
  // your config
})
```


You can also direcly import the preset and use it in your config.

```ts
// tailwind.config.ts
import type { Config } from 'tailwindcss'
import preset from '@myevery/tailwind/preset'

export default {
  presets: [myUIPreset],
  // your config
} satisfies Config
```

## Customization

My UI is fully customizable. You can override components by using the `theme` option.

```ts
export default withMyUI({
  theme: {
    extend: {
      myUi: {
        dropdownDivider: {
          space: '2',
          border: 'muted-200', // you can use arbitrary value like '[#fff]'
          borderDark: 'muted-600',
        },
        focus: {
          offset: '2',
          width: '1',
          style: 'dashed',
          color: 'muted-300',
          colorDark: 'muted-600',
        },
        label: {
          font: 'alt',
          text: 'muted-400',
          textDark: 'muted-400/80',
        },
        mark: {
          bg: 'primary-100',
          bgDark: 'primary-800',
          text: 'primary-800',
          textDark: 'primary-200',
        },
        slimscroll: {
          width: '[6px]',
          bg: 'black/5',
          bgDark: 'white/5',
          bgHover: 'black/20',
          bgHoverDark: 'white/20',
        },
        tooltip: {
          font: 'sans',
          bg: '[#1e293b]',
          bgDark: '[#ec4899]',
          text: '[#fff]',
          textDark: '[#fff]',
          minWidth: '3rem',
          maxWidth: '21rem',
        },
      },
    },
  },
})
```
npm package: @myfarms/mf-mask
Description: Playground: <https://stackblitz.com/edit/mf-mask>
Author: Adam Keenan
Latest version: 1.0.5

# @myfarms/mf-mask

Playground: <https://stackblitz.com/edit/mf-mask>

## Getting started

### Step 1: Install `@myfarms/mf-mask`

```bash
$ npm install @myfarms/mf-mask --save
```

### Step 2: Import the MfMaskModule

```typescript
import { NgModule } from '@angular/core';

import { MfMaskModule } from '@myfarms/mf-mask';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    MfMaskModule.forRoot(),
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }
```

### Step3: Use the component in your template

```xml
<input type='text' mfMask='(999) 999-9999' [(ngModel)]='model' />
```

## API
### Inputs

| Input  | Type | Default | Description |
| ------------- | ------------- | ------------- | ------------- |
| mfMask | `string` | `""` | The input mask |

### Options
You can pass in configuration options into the modules `forRoot` method.
```typescript
    /* Types and defaults */
    interface IPatterns {
      [pattern: string]: RegExp;
    }

    interface IMasks {
      [name: string]: string;
    }

    interface IConfig {
      patterns: IPatterns;
      preparedMasks: IMasks;
    }

    const initialConfig: IConfig = {
      patterns: {
        a: new RegExp(/[a-z]/),
        A: new RegExp(/[A-Z]/),
        Z: new RegExp(/[a-zA-Z]/),
        9: new RegExp(/[0-9]/)
      },
      preparedMasks: {
        PHONE: "(999) 999-9999"
      }
    };

    /* In your module */
    MfMaskModule.forRoot({
        patterns: {
            N: new RegExp(/[a-zA-Z0-9/),
        },
        preparedMasks: {
            PHONE: '999 999 9999',
            CODE: 'NNNNN',
        },
    })
```

## Development

To generate all `*.js`, `*.d.ts` and `*.metadata.json` files:

```bash
$ npm run build
```

To lint all `*.ts` files:

```bash
$ npm run lint
```

## License

MIT © [Adam Keenan](mailto:adam.keenan@myfarms.com)
npm package: @myfer/gitapi
Description: A library that simplifies the usage of the GitHub api.
Author: myfer
Latest version: 1.0.1

# Welcome to gitapi 👋

![Version](https://img.shields.io/badge/version-1.0.0-blue.svg?cacheSeconds=2592000)
[![Documentation](https://img.shields.io/badge/documentation-yes-brightgreen.svg)](https://github.com/myferr/gitapi#readme)
[![Maintenance](https://img.shields.io/badge/Maintained%3F-yes-green.svg)](https://github.com/myferr/gitapi/graphs/commit-activity)
[![License: MIT](https://img.shields.io/github/license/myferr/gitapi)](https://github.com/myferr/gitapi/blob/master/LICENSE)

> A library that simplifies the usage of the GitHub api.

### 🏠 [Homepage](https://github.com/myferr/gitapi#readme)

## Install

```sh
npm install @myfer/gitapi
```

## Author

👤 **Myfer**

- Website: https://myferr.foo.ng
- Github: [@myferr](https://github.com/myferr)

## 🤝 Contributing

Contributions, issues and feature requests are welcome!

Feel free to check [issues page](https://github.com/myferr/gitapi/issues).

## Show your support

Give a ⭐️ if this project helped you!

## 📝 License

Copyright © 2024 [Myfer](https://github.com/myferr).

This project is [MIT](https://github.com/myferr/gitapi/blob/master/LICENSE) licensed.

---
npm package: @myflows/play-context
Description: @myflows/play-context 项目是一个 npm 公共依赖包，用于为应用组件提供共享上下文，包括：
Author: Tiger Zhang
Latest version: 2.7.0

# 项目介绍

@myflows/play-context 项目是一个 npm 公共依赖包，用于为应用组件提供共享上下文，包括：

 * 事件交互 - 通过事件触发和侦听机制，实现组件间松耦合方式下的交互。

 * 数据交换 - 通过公共数据存储，实现组件间的数据交换。通过订阅数据改变事件，实现数据绑定。

 * 公共接口 - 比如：网络请求、路由跳转、本地存储、环境信息等。公共接口实现了统一的调用接口，这些接口的在不同平台的具体实现，由相应的 app-runner 提供，比如：H5、小程序、APP。
npm package: @myfrom/iron-swipeable-pages
Description: Polymer element that enables switching between different pages by swiping gesture.
Author: Pascal Gula aka MeTaNoV
Latest version: 2.0.0

[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg?style=flat-square)](https://www.webcomponents.org/element/@myfrom/iron-swipeable-pages)
[![Build Status](https://img.shields.io/travis/rust-lang/rust.svg?style=flat-square)](https://travis-ci.org/myfrom/iron-swipeable-pages)
[![npm](https://img.shields.io/npm/v/@myfrom/iron-swipeable-pages.svg?style=flat-square)](https://www.npmjs.com/package/@myfrom/iron-swipeable-pages)

**This is a fork** because the [original element](https://github.com/GeoloeG/iron-swipeable-pages) seems to no longer be maintained for newer Polymer versions.


# `<iron-swipeable-pages>`

`<iron-swipeable-pages>` is a Polymer 3 element that manages a set of pages and provides the ability to switch between them by swiping gesture.

## Install

Install the component using NPM:

```sh
$ npm install iron-swipeable-pages --save
```

## Usage

Import Custom Element:

```js
import 'iron-swipeable-pages/iron-swipeable-pages.js';
```

And then use it:

<!---
```
<custom-element-demo>
  <template>
    <link rel="import" href="iron-swipeable-pages.html">
	  <next-code-block></next-code-block>
  </template>
</custom-element-demo>
```
-->
```html
<iron-swipeable-pages selected="0">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
</iron-swipeable-pages>
```

See the [Documentation](https://geoloeg.github.io/iron-swipeable-pages/) for more options.

## More Demos

 - [Declarative](https://myfrom.github.io/iron-swipeable-pages/components/iron-swipeable-pages/demo/index.html)

 - [Conditional with dom-if's](https://myfrom.github.io/iron-swipeable-pages/components/iron-swipeable-pages/demo/conditional.html)

 - [Disabled](https://myfrom.github.io/iron-swipeable-pages/components/iron-swipeable-pages/demo/disabled.html)

 - [Alongside <paper-drawer-panel>](https://myfrom.github.io/iron-swipeable-pages/components/iron-swipeable-pages/demo/drawerpanel.html) *(Might not work due to deprecation of paper-drawer-panel)*

 - [Mobile](https://myfrom.github.io/iron-swipeable-pages/components/iron-swipeable-pages/demo/mobile.html)

 - [With routing](https://myfrom.github.io/iron-swipeable-pages/components/iron-swipeable-pages/demo/routing.html)


## Discussing

You can also find the original creator on the [Polymer Slack Channel](https://polymer.slack.com/) under nickname of *@MeTaNoV*

## Contributing

Please submit your PRs to `myfrom` branch if you have any new feature ideas.

For best development experience, it's recommended to have **[Polymer CLI](https://www.polymer-project.org/3.0/docs/tools/polymer-cli)** installed. It provides functionality such as serving element docs locally and testing framework.
npm package: @myfrom/paper-calendar
Description: An useful MD calendar widget that you can use in various situations
Author: Wiktor Olejniczak
Latest version: 0.3.0

:warning::construction: **ELEMENT IS WORK IN PROGRESS** :warning::construction:  
The element needs a lot of optimisation and polish to be done. I don't recommend using it in production at its current stage

[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg?style=flat-square)](https://www.webcomponents.org/element/@myfrom/paper-calendar)
[![Build Status](https://img.shields.io/travis/myfrom/paper-calendar.svg?style=flat-square)](https://travis-ci.org/myfrom/paper-calendar)
[![npm](https://img.shields.io/npm/v/@myfrom/paper-calendar.svg?style=flat-square)](https://www.npmjs.com/package/@myfrom/paper-calendar)

# paper-calendar

A useful calendar widget that you can use in various situations. Provides support for selecting dates, swiping between months and displaying events as dots below dates. All in Material Design style 🎨

## Installation

Make sure you have installed NPM, then simply run  
`$ npm install --save @myfrom/paper-calendar`

Newer versions of this element work only with Polymer 3.  
For backwards compatibility use versions 0.1

## Usage

The simplest way is to just import the element and then use it.
<!--
```
<custom-element-demo>
  <template>
    <script type="module" src="paper-calendar.js"></script>
    <next-code-block></next-code-block>
  </template>
</custom-element-demo>
```
-->
```
<paper-calendar></paper-calendar>
```
Check docs for more info and examples

## Contributing

The element is still WIP so help (issues and PRs) are much appreciated :wink:

1. Fork it!
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -am 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Credits

Inspiration form Google Calendar Android app.

## License

Shared on MIT license, check LICENSE
npm package: @myfrom/paper-pager
Description: A light and accesible Material Design page indicator
Author: Wiktor Olejniczak
Latest version: 2.0.0

[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg?style=flat-square)](https://www.webcomponents.org/element/myfrom/paper-pager)
[![Build Status](https://img.shields.io/travis/rust-lang/rust.svg?style=flat-square)](https://travis-ci.org/myfrom/paper-pager)
[![npm](https://img.shields.io/npm/v/@myfrom/paper-pager.svg?style=flat-square)](https://www.npmjs.com/package/@myfrom/paper-pager)

# paper-pager

`paper-pager` is a Material Design page indicator that is easy to customise and allows controlling the selected page by clicking on the pager.

## Installation

Make sure you have installed NPM, then simply run  
`$ npm install --save @myfrom/paper-pager`

Newer versions of this element work only with Polymer 3.  
For backwards compatibility use versions 1.x

## Usage

Import the element
```js
import '@myfrom/paper-pager';
```
 and then just use it as normal element.
<!--
```
<custom-element-demo>
  <template>
    <link rel="import" href="paper-pager.html">
    <next-code-block></next-code-block>
  </template>
</custom-element-demo>
```
-->
```html
<paper-pager dark></paper-pager>
<!-- `dark` attribute is only for visibility on white background -->
```

**If you want it to work on older browsers you must compile it from ES6 to ES5.**

The default item count is 3, you can set it either by specyfing `itemsCount` property (takes a number) or binding an Array of items to `items` property (this will basically set `itemsCount` to length of provided array).
Property `selected` is the index of currently selected page, can be updated by clicking on dots representing each page.

**Check out [documentation](https://www.webcomponents.org/element/myfrom/paper-pager/elements/paper-pager) for more info**

## Contributing

If you found a bug or have an idea for a new feature, be sure to open an issue **but first check if there isn't one open already**. I'm also very happy to see any Pull Requests, but to save you and me some work, comment on issues if you are planning to work on them - that way you make sure two people won't do the same thing :wink:

### Local development and testing

For local development use **[Polymer CLI](https://www.polymer-project.org/3.0/docs/tools/polymer-cli)**. It's a very easy tool for working on Polymer apps and elements. Serve your element with `$ polymer serve` and **before you submit a PR** run
```bash
$ polymer lint
$ polymer test
```

## Credits

Made by me, inspired by Google's Material Design page indicator that can be seen in different places across Android N.
Other resources:
- http://stackoverflow.com/questions/26423335

## License

Shared on MIT license, check [LICENSE](LICENSE)