open-index/open-npm huggingface dataset:
npm package: @jshawn/utils
Description: [![Greenkeeper badge](https://badges.greenkeeper.io/rollup/rollup-starter-lib.svg)](https://greenkeeper.io/)
Latest version: 1.0.6

# rollup-starter-lib

[![Greenkeeper badge](https://badges.greenkeeper.io/rollup/rollup-starter-lib.svg)](https://greenkeeper.io/)

This repo contains a bare-bones example of how to create a library using Rollup, including importing a module from `node_modules` and converting it from CommonJS.

We're creating a library called `utils`, which usefully tells us how long we have to wait until lunch, using the [ms](https://github.com/zeit/ms) package:

```js
console.log('it will be lunchtime in ' + howLongTillLunch());
```

## Getting started

Clone this repository and install its dependencies:

```bash
git clone https://github.com/rollup/rollup-starter-lib
cd rollup-starter-lib
npm install
```

`npm run build` builds the library to `dist`, generating three files:

* `dist/utils.cjs.js`
    A CommonJS bundle, suitable for use in Node.js, that `require`s the external dependency. This corresponds to the `"main"` field in package.json
* `dist/utils.esm.js`
    an ES module bundle, suitable for use in other people's libraries and applications, that `import`s the external dependency. This corresponds to the `"module"` field in package.json
* `dist/utils.umd.js`
    a UMD build, suitable for use in any environment (including the browser, as a `<script>` tag), that includes the external dependency. This corresponds to the `"browser"` field in package.json

`npm run dev` builds the library, then keeps rebuilding it whenever the source files change using [rollup-watch](https://github.com/rollup/rollup-watch).

`npm test` builds the library, then tests it.

## Variations

* [babel](https://github.com/rollup/rollup-starter-lib/tree/babel) — illustrates writing the source code in ES2015 and transpiling it for older environments with [Babel](https://babeljs.io/)
* [buble](https://github.com/rollup/rollup-starter-lib/tree/buble) — similar, but using [Bublé](https://buble.surge.sh/) which is a faster alternative with less configuration
* [TypeScript](https://github.com/rollup/rollup-starter-lib/tree/typescript) — uses [TypeScript](https://www.typescriptlang.org/) for type-safe code and transpiling



## License

[MIT](LICENSE).
npm package: @jsheaven/case-converter
Description: A versatile JavaScript library for converting strings between camel case, Pascal case, snake case, underscore and other.
Author: Michael Mannseicher
Latest version: 0.0.1

<h1 align="center">@jsheaven/case-converter</h1>

This package provides utility functions for converting strings between various text casing formats in JavaScript/TypeScript. It supports conversion between camelCase, PascalCase, snake_case, and kebab-case. The package can be used to standardize the casing of strings, particularly when dealing with APIs, file names, or data serialization.

<h2 align="center">User Stories</h2>

1. As a developer, I want to convert strings from one casing format to another.
2. As a developer, I want to ensure consistency in the casing of strings within my application.
3. As a developer, I want to have a library that is easy to use and integrates well with my existing codebase.

<h2 align="center">Features</h2>

- ✅ Supports conversion between camelCase, PascalCase, snake_case, and kebab-case.
- ✅ Provides functions for both converting strings from one format to another and vice versa.
- ✅ Lightweight and easy to integrate into existing projects.
- ✅ Provides TypeScript support with type definitions.
- ✅ Just `600 byte` nano sized (ESM, gizpped)
- ✅ Tree-shakable and side-effect free
- ✅ Runs on Windows, Mac, Linux, CI tested
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage

<h2 align="center">Example Usage</h2>

<h3 align="center">Setup</h3>

- yarn: `yarn add @jsheaven/case-converter`
- npm: `npm install @jsheaven/case-converter`

<h3 align="center">Usage in JavaScript/TypeScript</h3>

```typescript
import { convert } from '@jsheaven/case-converter'

const inputString = 'hello_world'
const convertedString = convert('SnakeCase', 'CamelCase', inputString)

console.log(convertedString) // Output: helloWorld
```

<h3 align="center">CommonJS</h3>

```javascript
const { convert } = require('@jsheaven/case-converter')

const inputString = 'hello_world'
const convertedString = convert('SnakeCase', 'CamelCase', inputString)

console.log(convertedString) // Output: helloWorld
```
npm package: @jsheaven/equal
Description: Deep comparison of two values (objects, primitives or arrays)
Author: Michael Mannseicher
Latest version: 0.0.1

<h1 align="center">@jsheaven/equal</h1>

> this package provides a utility for deep comparison of two values (objects, primitives or arrays) in JavaScript /
> Typescript. It can be used to check if two objects are equal in value, even if they have different references in memory.
> The isEqual function recursively compares each property of the objects, using the === operator to compare primitive
> values and recursively calling itself to compare nested objects and arrays. The package also provides an option to
> perform a strict comparison, which will check that the objects have the same prototype chain, constructor, and other
> characteristics. The package is commonly used in testing frameworks, such as Jest, to compare the expected and actual
> values of test results.

<h2 align="center">User Stories</h2>

1. As a developer, i want to use isEqual for comparing two values

2. As a developer, i don't want to create a custom comparator

<h2 align="center">Features</h2>

- ✅ Compares two values for equality.
- ✅ Include Array, Date, Error, RegExp, DomNode, Primitives or Objects.
- ✅ Includes also circular references.
- ✅ Available as a simple API and simple to use CLI
- ✅ Just `775 byte` nano sized (ESM, gizpped)
- ✅ Tree-shakable and side-effect free
- ✅ Runs on Windows, Mac, Linux, CI tested
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage

<h2 align="center">Example usage (API, as a library)</h2>

<h3 align="center">Setup</h3>

- yarn: `yarn add @jsheaven/equal`
- npm: `npm install @jsheaven/equal`

<h3 align="center">ESM</h3>

```ts
import { isEqual } from '@jsheaven/equal'

const equal = isEqual({ date: new Date('2023-02-02') }, { date: new Date('2023-02-02') })
if (equal) {
  //logic if result is equal
} else {
  //logic if result is not equal
}
```

<h3 align="center">CommonJS</h3>

```ts
const { isEqual } = require('@jsheaven/equal')

// same API like ESM variant
```
npm package: @jsheaven/reactive
Description: Nano library for functional, opt-in reactive programming
Author: Aron Homberg
Latest version: 1.0.0

<h1 align="center">@jsheaven/reactive</h1>

> Nano library for functional, opt-in reactive programming

<h2 align="center">User Stories</h2>

1. As a developer, I (sometimes) want a function to re-run when the data that it depends on, changes

<h2 align="center">Features</h2>

- ✅ Makes `Function`s reactive so that they re-run when data in reactive objects they use, changes
- ✅ Makes `Object`s reactive so that when values in them are changed, reactive `Functions` re-run
- ✅ Available as a simple API
- ✅ Just `397 byte` nano sized (ESM, gizpped)
- ✅ Tree-shakable and side-effect free
- ✅ One `@jsheaeven` dependency: `@jsheaven/observed`
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage

<h2 align="center">Example usage</h2>

<h3 align="center">Setup</h3>

- yarn: `yarn add @jsheaven/reactive`
- npm: `npm install @jsheaven/reactive`

<h3 align="center">ESM</h3>

```ts
import { reactive, on } from '@jsheaven/reactive'

const state = reactive({ rand: 0 })
const otherState = reactive({ rand: 0 })

reactive(() => {
  // using state.rand makes this function re-run when setInterval changes it
  console.log('Next random value', on(state.rand))

  // but using a state like otherState.rand, that isn't maked for reactivity, will never trigger
  console.log('Prev random value (lags behind)', otherState.rand)
})

let i = 0
const interval = setInterval(() => {
  state.rand = otherState.rand // this mutation causes the reactive function to re-run
  otherState.rand = Math.random() // this however, is numb

  if (i === 9) {
    clearInterval(interval) // stops re-running the reactive function
  }
}, 1000)
```

<h3 align="center">CommonJS</h3>

```ts
const { reactive, on } = require('@jsheaven/reactive')

// same API like ESM variant
```
npm package: @jsheaven/read-config-file
Description: Tiny library to read config files like your.config.js, your.config.mjs your.config.ts, your.conifg.json and your.config.json5 from disk.
Author: Aron Homberg
Latest version: 1.0.1

<h1 align="center">@jsheaven/read-config-file</h1>

> Tiny library to read config files like `your.config.js`, `your.config.mjs`, `your.config.ts`, `your.conifg.json` or `your.config.json5` from disk.

<h2 align="center">User Stories</h2>

1. As a developer, I want to read config files for my project/library/framework
2. As a developer, I don't want to write that code again and again

<h2 align="center">Features</h2>

- ✅ Reads and evalutates config files from disk: `.js`, `.mjs`, `.ts`, `.json` and `.json5`
- ✅ Available as a simple API and simple to use CLI
- ✅ Just `636 bytes` nano sized (ESM, gizpped)
- ✅ Tree-shakable and side-effect free
- ✅ Runs on Windows, Mac, Linux, CI tested
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage

<h2 align="center">Example usage (CLI)</h2>

`NODE_OPTIONS='--experimental-vm-modules' npx @jsheaven/read-config-file --config ./test/some.config.ts`

> You need at least version 18 of [Node.js](https://www.nodejs.org) installed.

<h2 align="center">Example usage (API, as a library)</h2>

<h3 align="center">Setup</h2>

- yarn: `yarn add @jsheaven/read-config-file`
- npm: `npm install @jsheaven/read-config-file`

<h3 align="center">ESM</h2>

```ts
import { readConfigFile } from '@jsheaven/read-config-file'

const result = await readConfigFile({
  configFilePath: './test/some.config.ts',
})
```

<h3 align="center">CommonJS</h2>

```ts
const { readConfigFile } = require('@jsheaven/read-config-file')

// same API like ESM variant
```
npm package: @jsheaven/render
Description: Nano library for isomorphic rendering of JSX into a DOM tree and serialized HTML.
Author: Aron Homberg
Latest version: 1.1.1

<h1 align="center">@jsheaven/render</h1>

> Nano library to render JSX isomorphic

<h2 align="center">User Stories</h2>

1. As a developer, I want to render JSX/TSX on client and server likewise

2. As a developer, I want support for functional components and web components likewise

3. As a developer, I don't want to use a framework for that

<h2 align="center">Features</h2>

- ✅ Does render JSX/TSX on client and server - DOM (`render`) and HTML (`renderToString`)
- ✅ Allows to render `Function`al components like `<Foo />`
- ✅ Supports every JSX feature you know, including Fragments `<></>`, Refs `ref={}` and `onMount={fn}`
- ✅ Allows to render a whole HTML document server-side, starting with `<html>`
- ✅ Available as a simple API
- ✅ Supports `dangerouslySetInnerHTML={{ __html: '<... />' }`
- ✅ Just `1113 byte` nano sized (ESM, gizpped) on client
- ✅ Just `1254 byte` nano sized (ESM, gizpped) on server
- ✅ Tree-shakable and side-effect free
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage

<img src="./coverage_report.png"  />

<h2 align="center">Example usage</h2>

<h3 align="center">Setup</h3>

- yarn: `yarn add @jsheaven/render`
- npm: `npm install @jsheaven/render`

<h3 align="center">ESM</h3>

Configure the following values in your `tsconfig.json` or likewise,
in the configuration options of your favourite bundler:

```json
{
  ...
  "jsx": "react",
  "jsxFactory": "tsx",
  "jsxFragmentFactory": "Fragment",
  ...
}
```

This will make sure that the JSX syntax is correctly transformed into a
JavaScript object tree (AOT, at compile time) that can be rendered by this library
at runtime (SSG, SSR or even, if desired, in-browser).

<h4 align="center">Server-side usage:</h4>

```tsx
import { render, renderToString, tsx, Fragment } from '@jsheaven/render/dist/server.esm.js'

// HTMLElement
const dom: Node = render(
  <html>
    <head></head>
    <body></body>
  </html>,
)

// <html><head></head><body></body></html>
const html: string = renderToString(dom)
```

<h4 align="center">Client-side/in-browser usage:</h4>

```tsx
import { render, renderToString, tsx, Fragment } from '@jsheaven/render/dist/client.esm.js'

// HTMLParagraphElement
const dom: Node = render(<p>Some paragraph</p>)

// <p>Some paragraph</p>
const html: string = renderToString(dom)
```

<h3 align="center">CommonJS</h3>

```ts
const { render, renderToString, tsx } = require('@jsheaven/render/client.cjs.js')

// same API like ESM variant
```
npm package: @jsheaven/status-message
Description: Prints colorful status messages to the console
Author: Aron Homberg
Latest version: 1.1.2

<h1 align="center">@jsheaven/status-message</h1>

> Prints colorful status messages to the console

<h2 align="center">User Stories</h2>

1. As a developer, I don't want to format log messages again and again using tags, ASCII color and `console` API

<h2 align="center">Features</h2>

- ✅ Does offer colorful logging function
- ✅ Severities are: `error(...)`, `warn(...)`, `log(...)`, `info(...)`, `debug(...)`, `trace(...)`
- ✅ Duration time measurements: `time(label: string)`, `timeEnd(label: string)`
- ✅ Uses the correct `console` API functions automatically (per severity)
- ✅ Beautiful loading spinner animation
- ✅ Ability to rewind and clear the previous line (custom animations)
- ✅ Available as a simple API
- ✅ Just `535 byte` nano sized (ESM, gizpped)
- ✅ Tree-shakable and side-effect free
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage

<h2 align="center">Example usage (API)</h2>

<h3 align="center">Setup</h3>

- yarn: `yarn add @jsheaven/status-message`
- npm: `npm install @jsheaven/status-message`

<h3 align="center">ESM</h3>

```ts
import { log, error, warn, info, debug, trace, time, timeEnd, spinner } from '@jsheaven/status-message'

time('Log every feature')

error('FATAL', 'You did not use this library yet')
warn('DANGER', 'Other logging libraries do not support arbitrary args', { right: true }, process.version)
log('SUCCESS', 'But this lib is only 361 bytes and has it all')
info('NOTE', 'It even has 100% test coverage')
debug('DEBUG', 'It is even tree-shakable')
trace('DURATION', 'You can trace the runtime of a task easily too:')

timeEnd('Log every feature')
```

<h3 align="center">Advanced use-cases</h3>

<h4 align="center">Loading spinner</h4>

```ts
const stopAnimation = spinner('Loading...')
await(async () => new Promise((resolve) => setTimeout(resolve, 2000)))()
stopAnimation()
```

<h4 align="center">Updating a value by clearing the previous line</h4>

```ts
let i = 1
const countTo100 = setInterval(() => {
  if (i > 1) clearPrevLine()
  info('COUNT', i)
  i++
  if (i > 100) clearInterval(countTo100)
}, 25)
```

<h4 align="center">Clearing 20 lines of the screen</h4>

```ts
for (let i = 0; i < 20; i++) clearPrevLine()
```

<img src="output.png" height="400px" />

<h3 align="center">CommonJS</h3>

```ts
const { log, logTime, logTimeEnd } = require('@jsheaven/status-message')

// same API like ESM variant
```
npm package: @jsheaven/store
Description: A reactive, observed and auto-persisted object store
Author: Aron Homberg
Latest version: 1.0.2

<h1 align="center">@jsheaven/store</h1>

> A reactive, observed and auto-persisted object store

<h2 align="center">User Stories</h2>

1. As a developer, I want to have an object store simply persisted
2. As a developer, I want to hook into changes at every depth reactively

<h2 align="center">Features</h2>

- ✅ Offers the `@jsheaven/observed` reactive object API
- ✅ Integrates with `simply-persist` to save on any change
- ✅ Middleware function API allows to hook what is read and written (e.g. for encryption)
- ✅ Available as a simple API
- ✅ Just `387 byte` nano sized (ESM, gizpped)
- ✅ Tree-shakable and side-effect free
- ✅ Runs on Windows, Mac, Linux, CI tested
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage

<h2 align="center">Example usage</h2>

<h3 align="center">Setup</h3>

- yarn: `yarn add @jsheaven/store`
- npm: `npm install @jsheaven/store`

<h3 align="center">ESM</h3>

```ts
import { store } from '@jsheaven/store'

export interface MyStore {
  a: boolean
  b: number
  c: {
    foo: string
  }
}

const myStore = await store<MyStore>({
  name: 'myStore',
  initialValue: { a: true, b: 1, c: { foo: 'nice!' }} },
  provider: 'session' // from `simply-persist`; persists to SessionStorage
})
```

<h3 align="center">CommonJS</h3>

```ts
const { store } = require('@jsheaven/store')

// same API like ESM variant
```