open-index/open-npm huggingface dataset:
npm package: @matneyx/livestamp
Description: A simple, unobtrusive jQuery plugin that provides auto-updating timeago text to your timestamped HTML elements using Day.js.
Author: Matt Bradley c/o Dave Matney
Latest version: 3.0.1

This is a fork of https://github.com/matneyx/livestampjs, which appears to be abandoned.

[Livestamp.js](http://matneyx.github.com/livestampjs)
=====================================================

A simple, unobtrusive jQuery plugin that provides auto-updating timeago text to
your timestamped HTML elements using [Day.js](http://day.js.org).

Usage
-----

See the [livestamp documentation](http://matneyx.github.com/livestampjs).

Dependencies
------------

* [jQuery](http://jquery.com): you already know what this is
* [Day.js](http://day.js.org): a great JavaScript library for parsing
  and displaying dates and times

License
-------

Copyright (c) 2015 Matt Bradley

This software is freely distributable under the terms of the
[MIT License](http://www.opensource.org/licenses/MIT).
npm package: @matochondrion/basscss-columns
Description: A basscss/css/postcss component for columns that wrap.
Author: Mat Sachs
Latest version: 1.0.2

#@matochondrion/basscss-columns

A basscss/css/postcss component for columns that wrap. 

## Based on OOCSS principles and frameworks like Basscss.

Columns is an immutable component designed to be skinned with simple module classes.


## Features


### Low Specificity

Low Specificity makes it easy to style the Component without worrying about complicated CSS hierarchies.

### No Preset Styling

Shape, colors, overflow, etc are available to the author to implement in any number of combinations. Ie, The styles have not been preset.
See examples:

## Usage

This module is meant to be an add-on for Basscss. To use, first install a Basscss project ([Basscss](https://github.com/basscss/basscss/), [Bassplate](https://github.com/basscss/bassplate), [Ace](https://github.com/basscss/ace), etc... ) with NPM, then install this component with NPM, and then include `@import 'symmetric-block';` in the source css file.

### Install - NPM
```bash
npm i -D @matochondrion/basscss-columns
```

### PostCSS

```css
@import '@matochondrion/basscss-columns';
```



## Examples
These examples assume the document's box-sizing has been set to _border-box_ using a method similar to [CSS-Tricks](https://css-tricks.com/box-sizing/)...

```css
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
```

_Needs examples._

## Explanation

---

[MIT license](LICENSE.md)
npm package: @matochondrion/basscss-responsive-flexbox
Description: responsive flexbox classes compatible with Basscss.
Author: Mat Sachs
Latest version: 1.0.0

#@matochondrion/basscss-responsive-flexbox

A basscss/css/postcss component for columns that wrap. 

## Based on OOCSS principles and frameworks like Basscss.

basscss-responsive-flexbox is an immutable component designed to be skinned with simple module classes.


## Features
Adds responsive flexbox classes for sm-, md-, and lg- breakpoints

### Low Specificity

Low Specificity makes it easy to style the component without worrying about complicated CSS hierarchies.

### No Preset Styling

Shape, colors, overflow, etc are available to the author to implement in any number of combinations. Ie, The styles have not been preset.
See examples:

## Usage

This module is meant to be an add-on for Basscss. To use, first install a Basscss project ([Basscss](https://github.com/basscss/basscss/), [Bassplate](https://github.com/basscss/bassplate), [Ace](https://github.com/basscss/ace), etc... ) with NPM, then install this component with NPM, and then include `@import '@matochondrion/basscss-responsive-flexbox';` in the source css file.

### Install - NPM
```bash
npm i -D @matochondrion/basscss-responsive-flexbox
```

### PostCSS

```css
@import '@matochondrion/basscss-responsive-flexbox';
```



## Examples
These examples assume the document's box-sizing has been set to _border-box_ using a method similar to [CSS-Tricks](https://css-tricks.com/box-sizing/)...

```css
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
```

_Needs examples._

## Explanation

---

[MIT license](LICENSE.md)
npm package: @matoruru/animal
Description: Cries as the animals you type.
Author: matoruru
Latest version: 1.0.2

# animal

## Installation

#### yarn

```sh
$ yarn global add @matoruru/animal
```

#### npm

```sh
$ npm install -g @matoruru/animal
```

## Usage

```sh
$ animal -h
```

## How I published this as a scoped package

1. [Create a repo on GitHub](https://github.com/new).

1. Clone the repo: `git clone git@github.com:matoruru/animal` and then `cd animal`.

1. Run `npm init --scope=@matoruru`.

    This will show the prompts to initialize your package.

    ```
    $ npm init --scope=@matoruru
    This utility will walk you through creating a package.json file.
    It only covers the most common items, and tries to guess sensible defaults.

    See `npm help init` for definitive documentation on these fields
    and exactly what they do.

    Use `npm install <pkg>` afterwards to install a package and
    save it as a dependency in the package.json file.

    Press ^C at any time to quit.
    package name: (@matoruru/animal)
    ```

1. Run `npm login` to log in on registry.npmjs.org.

1. Run `npm publish --access public` to publish the package.
npm package: @matoz/cursorjs
Description: Interactive material cursor to use on webpage. 
Author: Matoz
Latest version: 1.0.2

# Cursor.js

<div style="display:flex;flex-wrap:wrap; gap:10px;margin:20px 0">
    <img alt="GitHub top language" src="https://img.shields.io/github/languages/top/matozz/cursorjs"/>
    <img alt="GitHub last commit" src="https://img.shields.io/github/last-commit/matozz/cursorjs"/>
    <img alt="GitHub code size in bytes" src="https://img.shields.io/github/languages/code-size/matozz/cursorjs"/>
    <img alt="npm" src="https://img.shields.io/npm/v/@matoz/cursorjs"/>
</div>

iPadOS provides dynamic pointer effects and behaviors that enhance the experience of using a pointing device with iPad.
This experimental library help you to achieve this amazing effect.

[Design - Pointers (iPadOS)](https://developer.apple.com/design/human-interface-guidelines/ios/user-interaction/pointers/)

[Demo Page](https://cursorjs.vercel.app)

![](https://og-image.vercel.app/**Cursor**.js.png?theme=light&md=1&fontSize=100px&images=https%3A%2F%2Fassets.vercel.com%2Fimage%2Fupload%2Ffront%2Fassets%2Fdesign%2Fvercel-triangle-black.svg&images=https%3A%2F%2Fcdn.jsdelivr.net%2Fgh%2Fremojansen%2Flogo.ts%40master%2Fts.svg)

## How to use

1. Use `<script>` tag to load Cursor.js in your HTML file：

- UNPKG CDN:

```html
<script src="//unpkg.com/@matoz/cursorjs" defer></script>
```

- jsDelivr CDN:

```html
<script src="//cdn.jsdelivr.net/npm/@matoz/cursorjs" defer></script>
```
2. Follow the exmaples below.

## Supported Effect:


### Highlight effect:
![Highlight](.github/Highlight.gif)
```html
<button>
  <img src="./assets/airplay.svg" style="margin-right: 6px" />
  Airplay
</button>
<button>Material</button>
<button>Cursor</button>
<button>😂</button>
<button>😊</button>
```
> This experimental version will only work  with the default internal button style, we will make the button customizable in future release. 

### Lift effect:
![Lift](.github/Lift.gif)
```html
<img class="icon" id="icon" src="./assets/Message.svg" alt="Message" />
<img class="icon" id="icon" src="./assets/Phone.svg" alt="Phone" />
```
> Simply add `id="icon"` attribute to `<img>` tag 

### Content effect:
![Content](.github/Content.gif)
```html
<p>
  With a content effect, the UI element or region beneath the pointer can
  also change its appearance when the pointer hovers over it.
</p>
```
> Since there is no way to get each line of text, you need to manually set each line.


### More effects...

## Contribute

Feel free to fork this repository and submit pull requests. Bugs report in [GitHub Issues](https://github.com/matozz/cursorjs/issues).

## License

Cursor.js is [MIT Licensed](LICENSE).
npm package: @matpool/svg-sprite
Description: combine svg files to svg sprite
Author: yuant@8btc.com
Latest version: 1.1.1

# svg-sprite

combine svg files to svg sprite

[![oclif](https://img.shields.io/badge/cli-oclif-brightgreen.svg)](https://oclif.io)
[![Version](https://img.shields.io/npm/v/@matpool/svg-sprite.svg)](https://www.npmjs.com/package/@matpool/svg-sprite)
[![Downloads/week](https://img.shields.io/npm/dw/@matpool/svg-sprite.svg)](https://npmjs.org/package/@matpool/svg-sprite)

[中文文档](https://github.com/matpool/svg-sprite/blob/master/DOC.md)

<!-- toc -->
* [svg-sprite](#svg-sprite)
* [Usage](#usage)
* [Commands](#commands)
<!-- tocstop -->

# Usage

<!-- usage -->
```sh-session
$ npm install -g @matpool/svg-sprite
$ ss COMMAND
running command...
$ ss (-v|--version|version)
@matpool/svg-sprite/1.1.1 darwin-x64 node-v14.19.0
$ ss --help [COMMAND]
USAGE
  $ ss COMMAND
...
```
<!-- usagestop -->

# Commands

<!-- commands -->
* [`ss gen`](#ss-gen)
* [`ss help [COMMAND]`](#ss-help-command)
* [`ss init`](#ss-init)
* [`ss serve`](#ss-serve)

## `ss gen`

auto generate icon script and example html

```
USAGE
  $ ss gen

OPTIONS
  -h, --help  show CLI help
```

_See code: [src/commands/gen.ts](https://github.com/matpool/svg-sprite/blob/v1.1.1/src/commands/gen.ts)_

## `ss help [COMMAND]`

display help for ss

```
USAGE
  $ ss help [COMMAND]

ARGUMENTS
  COMMAND  command to show help for

OPTIONS
  --all  see all commands in CLI
```

_See code: [@oclif/plugin-help](https://github.com/oclif/plugin-help/blob/v3.2.2/src/commands/help.ts)_

## `ss init`

init icons config and directory

```
USAGE
  $ ss init

OPTIONS
  -h, --help  show CLI help
```

_See code: [src/commands/init.ts](https://github.com/matpool/svg-sprite/blob/v1.1.1/src/commands/init.ts)_

## `ss serve`

start a server to manage icons

```
USAGE
  $ ss serve

OPTIONS
  -h, --help       show CLI help
  -p, --port=port  [default: 10086]
```

_See code: [src/commands/serve.ts](https://github.com/matpool/svg-sprite/blob/v1.1.1/src/commands/serve.ts)_
<!-- commandsstop -->
npm package: @matpool/vue-json-view
Description: vue3 component for displaying javascript arrays and JSON objects.
Author: Sam Chai
Latest version: 0.1.8

# vue-json-view
JSON viewer component, for Vue.js 3.

This project is forked from [react-json-view](https://github.com/mac-s-g/react-json-view) and is the vue3 version of that.

**Show only, can’t modify.**


### Install

`npm install --save @matpool/vue-json-view`


### Usage
```js
// import the vue-json-view component
import VueJsonView from '@matpool/vue-json-view'

// use the component in your app!
<VueJsonView src={my_json_object} />
```

### Props
Name|Type|Default|Description
|:---|:---|:---|:---
`src`|`JSON Object`|None|This property contains your input JSON
`name`|`string` or `false`|false|Contains the name of your root node.  Use `null` or `false` for no name.
`theme`|`string`|"monokai"|RJV supports base-16 themes.  Check out the list of supported themes [in the demo](https://mac-s-g.github.io/react-json-view/demo/dist/). A custom "monokai" theme applies by default.
`collapsed`|`boolean` or `integer`|`false`|When set to `true`, all nodes will be collapsed by default.  Use an integer value to collapse at a particular depth.
`sortKeys`|`boolean`|`false`|set to true to sort object keys