open-index/open-npm huggingface dataset:
npm package: @moreapp/more-ui
Description: Collection of UI Web Components for MoreApp
Latest version: 0.57.0

![Built With Stencil](https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=flat-square)

## Getting Started

Run:

```bash
yarn install
yarn serve
```

To build the component for production, run:

```bash
yarn build
```

To run the unit tests for the components, run:

```bash
yarn test
```

## Using this component

####Dependencies
MoreApp Web Components are using other component libraries and fonts, so make sure you're including these dependencies when using the MoreApp UI Design System:  
1. Load Ionicons: `<script type="text/javascript" src="https://unpkg.com/ionicons@4.5.8/dist/ionicons.js"></script>`
2. Load Lato font: `<link href='//fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext' rel='stylesheet' type='text/css'>`

### Script tag
- [Publish to NPM](https://docs.npmjs.com/getting-started/publishing-npm-packages)
- Put a script tag similar to this `<script src='https://unpkg.com/@moreapp/more-ui/dist/more-ui.js'></script>` in the head of your index.html
- Then you can use the element anywhere in your template, JSX, html etc

### Node Modules
- Run `yarn add @moreapp/more-ui`
- Put a script tag similar to this `<script src='node_modules/@moreapp/more-ui/dist/more-ui.js'></script>` in the head of your index.html
- Then you can use the element anywhere in your template, JSX, html etc
npm package: @morebec/skeleta-css
Description: Skeleta is a lightweight CSS library that provides a flexible skeleton for 
Author: jwillp
Latest version: 0.2.8

# Skeleta

Skeleta is a CSS library that aims to simplify the process of creating responsive layouts. It provides a set of pre-built classes and components that can be easily customized to create complex designs that look great on any device.

Skeleta is built using modern CSS practices and prioritizes a content-first approach to layout design. This means that instead of relying primarily on breakpoints for responsive design, Skeleta focuses on creating layouts that prioritize the content and adapt to different screen sizes and devices without sacrificing readability or usability.

With Skeleta, you can quickly and easily create responsive designs that are both functional and visually appealing, without the need for extensive custom CSS or complicated media queries.

## Features

- Lightweight and fast
- Built with modern CSS practices
- Content-Flow First
- Fully responsive
- Easy to customize and extend

## Getting Started

Skeleta comes in two flavors:

- CSS: Which only contains the necessary CSS to use Skeleta.
- React: A distribution of Skeleta that uses React Components.

### Install using npm

```bash
# For the css-only version
npm install @morebec/skeleta-css

# For the react version.
npm install @morebec/skeleta-react
```

## License

Skeleta is licensed under the MIT License. See the LICENSE file for more information.
npm package: @morebetterclaw/humanify-mcp
Description: Transform AI-generated copy into human-sounding, GEO-optimised content. MCP server wrapping the Humanify API.
Author: MoreBetter Studios
Latest version: 0.1.0

# @morebetterclaw/humanify-mcp

MCP server for [Humanify](https://humanifyit.ai) — transform AI-generated marketing copy into human-sounding, GEO-optimised content that gets cited by AI search engines.

## What it does

Exposes a single tool (`humanify_transform`) that takes AI-generated copy and returns:
- **Transformed copy** — rewritten to sound human and rank in AI search
- **Score (0–100)** — human-readability rating
- **Improvements** — list of changes made

## Install

```bash
npx @morebetterclaw/humanify-mcp
```

## Configuration

Set your API key as an environment variable:

```bash
export HUMANIFY_API_KEY=hfy_live_xxxx
```

Get a key at [https://humanifyit.ai/api-docs](https://humanifyit.ai/api-docs)

## Claude Desktop

Add to your `claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "humanify": {
      "command": "npx",
      "args": ["-y", "@morebetterclaw/humanify-mcp"],
      "env": {
        "HUMANIFY_API_KEY": "hfy_live_xxxx"
      }
    }
  }
}
```

## Pricing

- **Free:** 50 credits on signup (no card required)
- **Pay-as-you-go:** $10 = 1,000 transforms (~$0.01 each)
- **Pro subscribers:** Unlimited API calls

## License

MIT
npm package: @morebrick/utils
Description: brick utils
Author: test
Latest version: 1.0.1

<p align="center">
@brick/utils   
<br />
常用的工具函数（utils、hooks）
</p>

## 📦 安装

```bash
npm install @morebrick/utils
or
pnpm add @morebrick/utils
```

## 🦄 用法

### `utils`

```ts
import { randomColor } from "@morebrick/utils";
console.log(randomColor({ type: "hex", num: 6 }));
```

### `hooks`

```vue
<script setup lang="ts">
import { ref, type Ref } from "vue";
import { useECharts } from "@morebrick/utils";

const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(
  chartRef as Ref<HTMLDivElement>,
  ref("light")
);

setOptions(
  {
    tooltip: {
      trigger: "item"
    },
    legend: {
      orient: "vertical",
      right: 0
    },
    series: [
      {
        name: "xxx",
        type: "pie",
        radius: "60%",
        center: ["40%", "50%"],
        data: [
          { value: 1, name: "watchers" },
          { value: 2, name: "star" },
          { value: 3, name: "forks" },
          { value: 4, name: "open_issues" }
        ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: "rgba(0, 0, 0, 0.5)"
          }
        }
      }
    ]
  },
  {
    name: "click",
    callback: params => {
      console.log("click", params);
    }
  },
  {
    name: "contextmenu",
    callback: params => {
      console.log("contextmenu", params);
    }
  },
  // 点击空白处
  {
    type: "zrender",
    name: "click",
    callback: params => {
      console.log("点击空白处", params);
    }
  }
);
</script>

<template>
  <div ref="chartRef" style="width: 100%; height: 100%" />
</template>
```
npm package: @moredeal/react-slick
Description:  React port of slick carousel
Author: Kiran Abburi
Latest version: 0.29.3

### react-slick

[![Backers on Open Collective](https://opencollective.com/react-slick/backers/badge.svg)](#backers) [![Sponsors on Open Collective](https://opencollective.com/react-slick/sponsors/badge.svg)](#sponsors) [![Join the chat at https://gitter.im/akiran/react-slick](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/akiran/react-slick?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)

##### Carousel component built with React. It is a react port of [slick carousel](http://kenwheeler.github.io/slick/)

## [Documentation](http://react-slick.neostack.com)

### Installation

**npm**

```bash
npm install react-slick --save
```

**yarn**

```bash
yarn add react-slick
```

**Also install slick-carousel for css and font**

```bash
npm install slick-carousel

// Import css files
import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";
```

or add cdn link in your html

```html
<link
  rel="stylesheet"
  type="text/css"
  charset="UTF-8"
  href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css"
/>
<link
  rel="stylesheet"
  type="text/css"
  href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css"
/>
```

### [PlayGround](https://codesandbox.io/s/ppwkk5l6xx)

### Example

```js
import React from "react";
import Slider from "react-slick";

export default function SimpleSlider() {
  var settings = {
    dots: true,
    infinite: true,
    speed: 500,
    slidesToShow: 1,
    slidesToScroll: 1
  };
  return (
    <Slider {...settings}>
      <div>
        <h3>1</h3>
      </div>
      <div>
        <h3>2</h3>
      </div>
      <div>
        <h3>3</h3>
      </div>
      <div>
        <h3>4</h3>
      </div>
      <div>
        <h3>5</h3>
      </div>
      <div>
        <h3>6</h3>
      </div>
    </Slider>
  );
}
```

### Props

For all available props, go [here](https://react-slick.neostack.com/docs/api/).

### Methods

For all available methods, go [here](https://react-slick.neostack.com/docs/api#methods)

### Development

Want to run demos locally

```bash
git clone https://github.com/akiran/react-slick
cd react-slick
npm install
npm start
open http://localhost:8080
```

## Contributing

Please see the [contributing guidelines](./CONTRIBUTING.md)