open-index/open-npm huggingface dataset:
npm package: @hyrious/utils
Description: Common JS/TS utils by hyrious
Author: hyrious
Latest version: 0.0.6

## @hyrious/utils

Utility functions I often use.

### Contents

Most of the utils are quite simple, I'd suggest you to read the source code directly.
Some interesting parts will be documented here.

#### observable(sample?)

<details><summary>
Create a emitter that <code>on()</code> returns a disposer.
</summary>

```js
let emitter = observable({ a: 1, b: "" });
let dispose = emitter.on("a", (a) => console.log(a));
emitter.emit("a", 2); // logs: 2
dispose();
```

To use it in typescript:

```ts
let emitter = observable<{ a: number; b: string }>();
```

</details>

#### writable(initial?)

<details><summary>
Create a reactive value (an instance of <code>Val</code>) that can be subscribed.
</summary>

<!-- prettier-ignore -->
```js
let count$ = writable(0);
count$.subscribe(console.log); // logs: 0
count$.set(1);                 // logs: 1
count$.value;                  // 1
```

To create a readonly value (i.e. no `set()`), you just type-cast it to `Readable`.

```ts
let count$ = writable(0);
let readonlyCount$: Readable<number> = count$;
```

This is super useful for using in UI frameworks.

```jsx
import { useSyncExternalStore } from "use-sync-external-store/shim";
const foo$ = writable(0);
const subscribeFoo = foo$.subscribe.bind(foo$);
function App() {
  const foo = useSyncExternalStore(subscribeFoo, () => foo$.value);
  return <button onClick={() => foo$.set(foo$.value + 1)}>{foo}</button>;
}
```

Feature, not bug:

```js
let foo$ = writable(-0);
foo$.set(+0); // won't trigger listeners because -0 === +0, same as NaN === NaN
let obj = [];
foo$.set(obj); // triggers listener(obj)
foo$.set(obj); // triggers listener(obj) again, because the object may be modified

let bar$ = writable();
bar$.subscribe(console.log); // no log, because bar$ is not ready
bar$.set(1); // logs: 1
bar$.set(undefined); // logs: undefined
```

</details>

#### batch(render)

<details><summary>
Batch multiple calls to one to happen in next micro task.
</summary>

```js
const schedule = batch(render);
times(10, () => schedule()); // run 10 times synchronously
await tick();
expect(render).toBeCalledTimes(1); // only render once
```

</details>

### Coding Style

<details><summary>1. Make sure to only export pure variables.</summary>

<!-- prettier-ignore -->
```js
export let a = 1;           // pure
export let a = 1 << 1;      // maybe not pure (need constant folding)
export let a = {}; a.b = 1; // not pure
export function f() {}      // pure
```

</details>

<details><summary>2. Correctly export isomorphic modules.</summary>

```js
"exports": {
   "./module": {
      "node": "./module-node.js",
      "default": "./module.js" // bundlers will be happy to see this
   }
}
```

</details>

3. No fool-proofing checks, use typescript to call attention.

## License

MIT @ [hyrious](https://github.com/hyrious)
npm package: @hyrious/version
Description: Add --version to your cli.
Author: hyrious
Latest version: 0.1.0

## @hyrious/version

### Usage

```js
import { version } from "@hyrious/version";
version();
// if process.argv.includes('--version'), print version and exit
```

```bash
node ./bin.js --version
0.1.0
```

**Configuration**

```js
import { version } from "@hyrious/version";
// manually set version number instead of infering from package.json.
version("0.1.0");
// get version number from another place, you can use async function here.
version(() => JSON.parse(fs.readFileSync(__dirname + "/package.json", "utf8")).version);
```

### License

MIT @ [hyrious](https://github.com/hyrious)
npm package: @hyrious/vite-plugin-svga
Description: SVGA plugin for vite.
Author: hyrious
Latest version: 0.1.0

# vite-plugin-svga

> A vite plugin to load [svga](https://github.com/svga/SVGAPlayer-Web) file. Based on [svga-loader](https://github.com/Adamwu1992/svga-loader).

## Usage

```
npm i -D @hyrious/vite-plugin-svga
```

vite.config.ts

```ts
import svga from "@hyrious/vite-plugin-svga";

export default {
  plugins: [svga()],
};
```

main.ts

```ts
import { Player } from "svgaplayerweb";
import PinJump from "./assets/PinJump.svga";

const player = new Player("#app");

player.setVideoItem(PinJump);
player.startAnimation();
```

**Recommend**: shim.d.ts

```ts
declare module "*.svga" {
  const content: import("svgaplayerweb").VideoEntity;
  export default content;
}
```

## License

MIT @ [hyrious](https://github.com/hyrious)
npm package: @hyrious/w7
Description: Serve the pure html, update the browser on change.
Author: hyrious
Latest version: 0.2.0

## @hyrious/w7

Serve a folder / file, with auto reload.

### Usage

```bash
npm i -g @hyrious/w7
w7 --help

  Description
    Serve the pure html, update the browser on change.

  Usage
    $ w7 [entry] [options]

  Options
    -c, --cors       Enable "CORS" headers
    -s, --single     Serve as single-page application
    -q, --quiet      Disable logging to terminal
    -H, --host       Hostname to bind  (default localhost)
    -p, --port       Port to bind  (default 5000)
    -v, --version    Displays current version
    -h, --help       Displays this message

  Examples
    $ w7
    $ w7 index.html
    $ w7 dist
    $ w7 app.html --port 4000
    $ w7 --cors --quiet --open
```

### Alternatives

- [w7](https://github.com/ulivz/w7)
- [sirv](https://github.com/lukeed/sirv)
- [vite](https://vitejs.dev)

### License

The MIT License.
npm package: @hyrious/xml-js
Description: A converter between XML text and Javascript object / JSON text.
Author: Yousuf Almarzooqi
Latest version: 1.6.14


This fork moves "sax" to "devDependencies" and bundles it with
rollup ([rollup-plugin-node-polyfills](https://github.com/ionic-team/rollup-plugin-node-polyfills)).

([rollup-plugin-polyfill-node](https://github.com/snowpackjs/rollup-plugin-polyfill-node) doesn't work, don't know why)

I also removed tests and coverage for faster setup. :sweat_smile:

Applied these [_useful forks_](https://useful-forks.github.io/?repo=nashwaan%2Fxml-js):

- [Escape `&` `<` in attributes](https://github.com/melody-universe/xml-js)
- [Add nativeTypeAttributes type definition](https://github.com/mariuseis/xml-js/commit/aec4986298b3270ee8f429871907d65d9859b0da)
- [Handling errors with onErrorFn instead of throwing exception on first error](https://github.com/drdmitry/xml-js/commit/3476bb3a7917c6a2f7f464427a2dfd8f479d53c3)
- ... Need more? PR on me!

Install: `npm i @hyrious/xml-js`.

Replace it in **package.json**:

```json
"dependencies": {
  "xml-js": "npm:@hyrious/xml-js"
}
```

Replace it in **vite.config.js**:

```js
export default defineConfig({
  alias: {
    "xml-js": "@hyrious/xml-js"
  }
})
````

Replace it in **webpack.config.js**

```js
{
  "resolve": {
    "alias": {
      "xml-js": "@hyrious/xml-js"
    }
  }
}
````

Other ways: [see how preact does](https://preactjs.com/guide/v8/switching-to-preact/).

## Changelog

### 1.6.14

- Use named export, for tree shaking purpose.

- - -

Read the original [README](https://github.com/nashwaan/xml-js).
npm package: @hyron/cli
Description: Work easier with the hyron framework
Latest version: 1.0.4

<img src='https://i.imgur.com/mAjPWAu.png' width='240px'/>



# Installation

```sh
$ npm install -g @hyron/cli
```

# Usage

The below commands are all supported by [inquirer](https://www.npmjs.com/package/inquirer) extremely user friendly

## 1. Init a module/app used template
```
hyron init [app|services|plugins|addons] [path]
```

## 2. Start app using JSON build file
```
hyron start [path]
```

<!-- ## 3. Manager extension

### 1. Install extension
```
hyron ext <install> [name]
```

### 2. Remove extension
```
hyron ext <remove> [name]
```

### 3. List installed extension
```
hyron ext list
``` -->
npm package: @hyron/viewer
Description: view engine for nodejs for hyron framework
Author: thangphung
Latest version: 1.0.0

used to render views using popular view engines. include
- pug
- ejs
- hbs

# Usage

## 1. Install plugins
@hyron/viewer is normal plugins. so you need to declared like another hyron plugins to used

app.json
```json
{
    "base_url" : "http://localhost:3000",
    "plugins" : {
        "viewer": "@hyron/viewer"
    }
}
```

after that run build file to install plugins. Using @hyron/cli

```bash
hyron start
```

you also install using `npm` or `yarn` engine

## 2. create view file

By default, @hyron/viewer will read file inside `./views` dir from root to parser view file

you also custom this path used appcfg using `root` properties

appcfg.yaml
```yaml
# 'viewer' that name was declared above
viewer:
  root: '/public'
```

Example
```pug
<!DOCTYPE html>
html(lang="en")
    head
        meta(charset="UTF-8")
        meta(name="viewport", content="width=device-width, initial-scale=1.0")
        meta(http-equiv="X-UA-Compatible", content="ie=edge")
        title hello world
    body
        h1 hello, this is @hyron/viewer demo
```

## 3. declare for view router

To allow a router render a view, you need to declare it in `requestConfig`. and using **$render**( string | object ) properties to pass data to render view

/services/ViewDemo.js
```js
module.exports = class ViewDemo {

    static requestConfig(){
        return {
            $all : {
                plugins: ["viewer"]
            },
            getView : "get"
        }
    }

    getView(){
        return {
            $render : {
                path : "/demo.pug"
            }
        }
    }
}
```
npm package: @hyrosrc/providers
Description: Package that contains all the providers of sussy-code
Author: sussy-code
Latest version: 2.3.0

# @sussy-code/providers

package that holds all providers of sussy-code.
Feel free to use for your own projects.

features:
- scrape popular streaming websites
- works in both browser and server-side

Visit documentation here: https://sussy-code.github.io/providers/

## How to run locally or test my changes

These topics are also covered in the documentation, [read about it here](https://sussy-code.github.io/providers/extra-topics/development).
npm package: @hysh/sff
Description: command line tool to download attachments from SalesForce Case
Author: S.Hayashi
Latest version: 0.0.5

# sff
Simple command line tool to download Attachments from Salesforce Case.

## Intallation
```bash
$ npm install -g @hysh/sff
```
# User /  Pass +Token
USERNAME and PASSWORD+TOKEN hash to be set as Environment Variable to download files.
TOKEN is available from here. (https://help.salesforce.com/articleView?id=user_security_token.htm&type=5)

Note: This tool uses REST API to Salesforce. Please refere [here](https://developer.salesforce.com/docs/atlas.en-us.salesforce_app_limits_cheatsheet.meta/salesforce_app_limits_cheatsheet/salesforce_app_limits_platform_api.htm) for the limits.

```bash
- Mac/Unix
$ export SFF_USERNAME=yourname@company.com
$ export SFF_PASSROKEN=passwordtoken

- Windows powershell
> set $env:SFF_USERNMAE="username"
> set $env:SFF_PASSTOKEN="passwordtoken"

- Windows CMD
> set SFF_USERNMAE="username"
> set SFF_PASSTOKEN="passwordtoken"
```

```bash
$ sff
 sff .. Downloads attachments from SalesForce to current directory
 == USAGE ==
 # sff <CaseNumber> [-a] [file1 file2 file3...]
 # sff 00001234                 ........  List Attachment
 # sff 00001234 file1 file2     ........  Download Attachments
 # sff 00001234 -a              ........  Download All Attachments
```
npm package: @hysight/scroll-table
Description: 基于css3效果的滚动新闻列表/走马灯效果
Author: lovewinders
Latest version: 1.0.5

<!--
 * @Author: zhangb
 * @Date: 2019-09-18 16:26:25
 * @Email: lovewinders@163.com
 * @Last Modified by: zhangb
 * @Last Modified time: 2019-12-04 16:07:22
 * @Description: 
 -->
# @hysight/scroll-table

@hysight/scroll-table uses react hooks and typescript to write a scrolling list plugin

## Install
```
$ npm install @hysight/scroll-table --save
```

```
$ yarn add @hysight/scroll-table
```

## Usage
```
import ScrollTable from '@hysight/scroll-table';
const { LevelScroll } = ScrollTable;

// Scroll up

<ScrollTable
    // scrollSpeed='linear'
    scrollSpeed='ease'
    scrollTime={1000}
    scrollHeight={54}
    scrollRows={5}
    delayTime={2000}
    count={4}
>
    <div style={{height: '54px'}}>list1</div>
    <div style={{height: '54px'}}>list1</div>
    <div style={{height: '54px'}}>list1</div>
    <div style={{height: '54px'}}>list1</div>
    or
    <ScrollContent />
</ScrollTable>

// Scroll left
<LevelScroll>
    <span style={{'marginLeft': '20px'}}>list1</span>
    <span style={{'marginLeft': '20px'}}>list1</span>
    <span style={{'marginLeft': '20px'}}>list1</span>
    <span style={{'marginLeft': '20px'}}>list1</span>
    or
    <ScrollContent />
</LevelScroll>

```
### TypeScript

`@hysight/scroll-table` is written in TypeScript with complete definitions

## ScrollTable Props

> Scroll up

Prop|Default|Type|Description
:----|:-----|:-----|:-----
className|''|string|组件追加的className名称
scrollSpeed|'linear'|string| [linear] [ease] [ease-in] [ease-out] [ease-in-out] [cubic-bezier(n,n,n,n)]
scrollTime|2000|number|单个滚动所用时间，单位ms
scrollHeight|27|number|单个滚动所需高度，单位px
scrollRows|5|number|可视区域显示N个元素
delayTime|1000|number|滚动间隔延迟时间，单位ms
count|Infinity|number|数据总条数


## LevelScroll Props

> Scroll left

Prop|Default|Type|Description
:----|:-----|:-----|:-----
无|无|无|无

## keywords

react scroll

# change logs

### 1.0.4
  + fix 数据切换时，滚动失效

### 1.0.3
  + fix scroll

### 1.0.1
  + fix readme
  + 
### 1.0.0
  + use react hooks

### 0.0.4
  + 发布到公网npm

### 0.0.3
  + 增加className名称

### 0.0.2
  + 增加列表总count不超过scrollRows时，默认不滚动

### 0.0.1
  + 初始化项目
npm package: @hysryt/postcss-bundle-mediaquery
Description: PostCSS plugin to bundle media query
Latest version: 1.0.1

# PostCSS Bundle MediaQuery
PostCSS plugin to bundle media queries that have same rules.

## Example
```css
/* Input example */
@media (max-width: 400px) {
  .box1 {
    width: 200px;
  }
}

@media (max-width: 400px) {
  .box2 {
    width: 200px;
  }
}
```
```css
/* Output example */
@media (max-width: 400px) {
  .box1 {
    width: 200px;
  }
  .box2 {
    width: 200px;
  }
}
```

## Add Comments
```js
/* postcss.config.js */
module.exports = () => ({
  plugins: {
    '@hysryt/postcss-bundle-mediaquery': {
      'comments': {
        '(max-width: 767px)': 'for smartphone',
        '(min-width: 768px)': 'for pc',
      }
    }
  }
})
```
```css
/* Input */
.box1 {
  background-color: red;
}

@media (max-width: 767px) {
  .box1 {
    width: 800px;
  }
}

@media (min-width: 768px) {
  .box1 {
    width: 200px;
  }
}
```
```css
/* Output */
.box1 {
  background-color: red;
}

/* 
 * for smartphone
 */

@media (max-width: 767px) {
  .box1 {
    width: 800px;
  }
}

/* 
 * for pc
 */

@media (min-width: 768px) {
  .box1 {
    width: 200px;
  }
}
```