open-index/open-npm huggingface dataset:
npm package: @industry-arts/vue-final-modal
Description: The most powerful yet most light-weight modal library for Vue 3.
Author: Hunter Liu
Latest version: 5.0.0-beta.8

# Vue Final Modal 4

The most powerful yet most light-weight modal library for Vue 3.

<p align="center"><a href="https://vue-final-modal.org" target="_blank" rel="noopener noreferrer"><img src="https://vue-final-modal.org/preview.png" alt="Vue Final Modal Logo"></a></p>

<p align="center">
  <a href="https://npmcharts.com/compare/vue-final-modal?minimal=true"><img src="https://badgen.net/npm/dm/vue-final-modal" alt="Downloads"></a>
  <a href="https://www.npmjs.com/package/vue-final-modal"><img src="https://img.shields.io/npm/l/vue-final-modal.svg?sanitize=true" alt="License"></a>
  <a href="https://app.netlify.com/sites/vue-final-modal/deploys"><img src="https://api.netlify.com/api/v1/badges/444b13a8-540f-4438-94da-80c865c8f103/deploy-status" alt="Netlify Status"></a>
</p>
<p align="center">
  <a href="https://www.npmjs.com/package/vue-final-modal"><img src="https://badgen.net/npm/v/vue-final-modal/latest" alt="Version"></a>
</p>

<p align="right">
  <a href="https://www.buymeacoffee.com/PL2qJIx" target="_blank" rel="noopener noreferrer">
    <img width="200" src="https://cdn.buymeacoffee.com/buttons/v2/default-green.png" alt="Buy Me A Coffee" />
  </a>
</p>

## Playground

- [Stackblitz for Vue 3](https://stackblitz.com/github/vue-final/vue-final-modal/tree/master/examples/vue3)
- [Stackblitz for Nuxt 3](https://stackblitz.com/github/vue-final/vue-final-modal/tree/master/examples/nuxt3)

## [Documentation](https://v4.vue-final-modal.org/)

Checkout [Migration guide from v3](https://v4.vue-final-modal.org/get-started/migration/from-v3).

Looking for old version?

- [vue-final-modal@3.x for Vue 3](https://v3.vue-final-modal.org/)
- [vue-final-modal@2.x for Vue 2](https://v2.vue-final-modal.org/)

## Contribution Guide

```bash [pnpm]
# Install packages
pnpm install --shamefully-hoist

# Build vue-final-modal library first
pnpm build:vfm

# Run both docs and viteplay
pnpm dev

# Run docs: http://localhost:3000/
pnpm dev:docs

# Run viteplay: http://localhost:5173/
pnpm dev:viteplay
```

## Contributors

Thank you to all the people who already contributed to `vue-final-modal`!

<a href="https://github.com/vue-final/vue-final-modal/graphs/contributors" aria-label="contributors">
  <img src="https://contrib.rocks/image?repo=vue-final/vue-final-modal" alt="contributors" />
</a>

Made with [contributors-img](https://contrib.rocks).

🚀 If you have any ideas for optimization of `vue-final-modal`, feel free to open [issues](https://github.com/hunterliu1003/vue-final-modal/issues) or [pull requests](https://github.com/hunterliu1003/vue-final-modal/pulls).
npm package: @industry-theme/localhost-panels
Description: An embedded browser panel for viewing localhost development servers in Electron applications
Author: Principal ADE
Latest version: 0.2.4

# Localhost Browser Panel

An embedded browser panel for viewing localhost development servers in Electron applications. Part of the `@principal-ade` panel framework.

## Features

- **Embedded Webview**: View localhost dev servers (React, Vite, Storybook, etc.) directly in your Electron app
- **Quick Port Selection**: One-click selection for common development ports (3000, 5173, 8080, 6006, etc.)
- **Full Navigation**: Back, forward, reload, and home navigation controls
- **External Browser**: Open the current URL in your default browser
- **Tool Integration**: UTCP-compatible tools for AI agent control

## Installation

```bash
bun add @industry-theme/localhost-panels
# or
npm install @industry-theme/localhost-panels
```

## Usage

### In a Panel Host Application

```tsx
import { panels } from '@industry-theme/localhost-panels';

// Register panels with your panel registry
panelRegistry.registerPackage(panels);
```

### Electron Configuration

The webview functionality requires specific Electron configuration. See `ELECTRON_WEBVIEW_NOTES.md` for details.

**Required `webPreferences`:**

```typescript
webPreferences: {
  webviewTag: true,
}
```

**CSP Configuration:**

Localhost URLs must be excluded from CSP or have appropriate `frame-src` directives:

```typescript
// Exclude localhost from CSP
if (url.hostname === 'localhost' || url.hostname === '127.0.0.1') {
  callback({ responseHeaders: details.responseHeaders });
  return;
}
```

## Available Tools

The panel exposes these UTCP-compatible tools for AI agent integration:

| Tool | Description |
|------|-------------|
| `navigate_to_localhost` | Navigate to a specific port and path |
| `reload_localhost_page` | Reload the current page |
| `localhost_go_back` | Navigate back in history |
| `localhost_go_forward` | Navigate forward in history |

### Tool Examples

```typescript
// Navigate to Storybook
events.emit({
  type: 'principal-ade.localhost-browser:navigate',
  payload: { port: 6006, path: '/' }
});

// Reload the page
events.emit({
  type: 'principal-ade.localhost-browser:reload'
});
```

## Development

```bash
# Install dependencies
bun install

# Start Storybook for development
bun run storybook

# Build for production
bun run build

# Type checking
bun run typecheck
```

## Common Ports

| Port | Server |
|------|--------|
| 3000 | React / Next.js |
| 5173 | Vite |
| 8080 | Webpack |
| 6006 | Storybook |
| 4200 | Angular |
| 8000 | Python / Django |

## Storybook Notes

If Storybook shows "Loading..." indefinitely when viewed through the webview:

1. Disable `crossOriginIsolated` in `.storybook/main.ts`:
   ```typescript
   core: {
     crossOriginIsolated: false,
   }
   ```

2. Ensure no `Cross-Origin-Opener-Policy` or `Cross-Origin-Embedder-Policy` headers are being sent

## License

MIT
npm package: @industry-theme/theme-editor-panel
Description: Theme editor panel for customizing the Industry theme appearance and styling
Author: Principal ADE
Latest version: 0.2.0

# Industry Theme Editor Panel

A panel extension for customizing the Industry theme colors and appearance in real-time. This panel is built with the `@principal-ade/panel-framework-core` and follows the [Panel Extension Store Specification V2](https://github.com/principal-ade/panel-framework/blob/main/PANEL_EXTENSION_STORE_SPECIFICATION_V2.md).

## Features

- **Live Color Customization**: Modify theme colors across different categories in real-time
- **Interactive Color Picker**: Visual hex color picker with manual input support
- **Organized by Category**: Colors grouped into Primary, Background, Text, UI, and Status categories
- **Reset Functionality**: Individual color reset buttons to revert to defaults
- **Industry Theme Integration**: Seamlessly integrates with `@principal-ade/industry-theme`

## Installation

```bash
# Install dependencies
bun install

# Build the panel
bun run build

# Development mode (watch for changes)
bun run dev
```

## Development

### Project Structure

```
src/
├── panels/
│   └── ThemeEditorPanel.tsx       # Main theme editor component
├── components/
│   └── ColorPickerInput.tsx       # Color picker input component
├── types/
│   └── index.ts                   # TypeScript type definitions
└── index.tsx                      # Panel exports and lifecycle hooks
```

### Color Categories

The theme editor organizes colors into the following categories:

- **Primary Colors**: Primary, Secondary, Accent
- **Background Colors**: Background, Background Light/Dark, Secondary, Tertiary
- **Text Colors**: Text, Text Secondary, Text Tertiary
- **UI Colors**: Border, Border Light/Dark
- **Status Colors**: Success, Warning, Error, Info

### Running Storybook

```bash
# Start Storybook for interactive development
bun run storybook

# Build Storybook for deployment
bun run build-storybook
```

## Usage

Once installed in a host application, the Theme Editor panel will be available with:

- **Panel ID**: `industry-theme.theme-editor`
- **Display Name**: Theme Editor
- **Icon**: 🎨

## Dependencies

- **react-colorful**: Hex color picker component
- **lucide-react**: Icon library
- **@principal-ade/industry-theme**: Industry theme package
- **@principal-ade/panel-framework-core**: Panel framework integration

## Building

```bash
# Clean and build
bun run build

# Type checking
bun run typecheck

# Linting
bun run lint
bun run lint:fix

# Formatting
bun run format
bun run format:check
```

## Publishing

```bash
# Build the package
bun run build

# Publish to NPM
npm publish --access public
```

## License

MIT © Principal ADE

## Contributing

Contributions welcome! Please read the contributing guidelines first.
npm package: @indutny/bencher
Description: Simple benchmarking tool
Author: Fedor Indutny
Latest version: 2.1.1

# @indutny/bencher

[![npm](https://img.shields.io/npm/v/@indutny/bencher)](https://www.npmjs.com/package/@indutny/bencher)
![CI Status](https://github.com/indutny/bencher/actions/workflows/test.yml/badge.svg)

Simple JavaScript benchmarking tool inspired by my bad understanding of how
[Criterion.rs](https://github.com/bheisler/criterion.rs/blob/27642b476837753cbb539f269fbbcbefa815bf00/book/src/analysis.md)
works.

## Disclaimer

Let's be honest, I'm terrible at statistics. This approach that I took here is
probably incorrect, but the results appear to be stable enough so I'm happy to
use it for my personal projects.

Any ideas on improving the algorithm are very welcome!

## Installation

```sh
npm install -g @indutny/bencher
```

## Usage

```js
// Function to benchmark
export function benchmarkName() => {
  let sum = 0;
  for (let i = 0; i < 1e6; i++) {
    sum += i;
  }

  // Make sure to return a side-effect value (possibly a result of the
  // run) to ensure that the pure function calls are not optimized out by the
  // JIT compiler.
  return sum;
};
```

```sh
$ bencher benchmark.js
benchmark.js/benchmarkName: 1’037.8 ops/sec (±18.8, p=0.001, n=98)
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/breakpad
Description: Fast symbolication of crash reports using breakpad symbol files
Author: Fedor Indutny
Latest version: 1.2.3

# @indutny/breakpad

[![npm](https://img.shields.io/npm/v/@indutny/breakpad)](https://www.npmjs.com/package/@indutny/breakpad)

Fast symbolication of crash reports using
[breakpad symbol files](https://chromium.googlesource.com/breakpad/breakpad/+/master/docs/symbol_files.md).

## Installation

```sh
npm install @indutny/breakpad
```

## Usage

```js
import { createReadStream } from 'node:fs';

import { symbolicateFrames } from '@indutny/breakpad';

const symbolsFile = createReadStream('/tmp/1.sym');

const result = await symbolicateFrames(
  symbolsFile,
  [
    0x0000000006e21774, 0x00000000035253ac, 0x0000000003521eec,
    0x0000000003521ff8,
  ],
);

console.log(result);
```

## Benchmarks

```sh
$ npm run benchmark
...
Mean Throughput: 689.5mb/s
StdDev: 0.8%
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/breakpad-parser-wasm
Description: WASM parser for breakpad symbol format
Latest version: 1.0.4

# @indutny/breakpad-parser-wasm

[![npm](https://img.shields.io/npm/v/@indutny/breakpad-parser-wasm)](https://www.npmjs.com/package/@indutny/breakpad-parser-wasm)

See [the main repo](https://github.com/indutny/breakpad) for details.

## Building

```sh
wasm-pack build --release --target=nodejs --scope indutny
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/emoji-mart-react
Description: React wrapper for Emoji Mart; the emoji picker for the web.
Latest version: 1.0.1

# `@emoji-mart/react`

A React wrapper for [EmojiMart](https://missiveapp.com/open/emoji-mart).

## 🧑‍💻 Usage
```sh
npm install --save emoji-mart @emoji-mart/data @emoji-mart/react
```

```js
import data from '@emoji-mart/data'
import Picker from '@emoji-mart/react'

function App() {
  return (
    <Picker data={data} onEmojiSelect={console.log} />
  )
}
```

## 📚 Documentation
See https://github.com/missive/emoji-mart#react
npm package: @indutny/inflate
Description: Naive inflate implementation
Author: Fedor Indutny
Latest version: 1.0.5

# @indutny/inflate

[![npm](https://img.shields.io/npm/v/@indutny/inflate)](https://www.npmjs.com/package/@indutny/inflate)

Very naive and unoptimized implementation of Inflate part of the
[DEFLATE spec](https://datatracker.ietf.org/doc/html/rfc1951).

## Installation

```sh
npm install @indutny/inflate
```

## Usage

```js
import Inflate from '@indutny/inflate';

const blocks = [];

const inflate = new Inflate({
  onBlock(block) {
    blocks.push(Buffer.from(block));
  },
});

for (const byte of buffer) {
  inflate.push(byte);
}
inflate.finish();

console.log(Buffer.concat(blocks));
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/mac-av-permissions
Description: Wrapper around authorizationStatusForMediaType API for macOS
Author: Fedor Indutny
Latest version: 1.0.0

# @indutny/mac-av-permissions

[![npm](https://img.shields.io/npm/v/@indutny/mac-av-permissions)](https://www.npmjs.com/package/@indutny/mac-av-permissions)

Bindings for macOS AVFoundation API for querying Microphone/Camera permissions.

## Installation

```sh
npm install @indutny/mac-av-permissions
```

## Usage

```js
import { getVideoAuthorizationStatus } from '@indutny/mac-av-permissions';

console.log(getVideoAuthorizationStatus());
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/mac-screen-share
Description: ScreenCaptureKit bindings for Node.js
Author: Fedor Indutny
Latest version: 1.2.0

# @indutny/mac-screen-share

[![npm](https://img.shields.io/npm/v/@indutny/mac-screen-share)](https://www.npmjs.com/package/@indutny/mac-screen-share)

Bindings for macOS ScreenCaptureKit.

## Installation

```sh
npm install @indutny/mac-screen-share
```

## Usage

```js
import { Stream } from '@indutny/mac-screen-share';

const stream = new Stream({
  width: 1024,
  height: 768,
  frameRate: 10,

  onStart() {},
  onStop(error) {},
  onFrame(frame, width, height, timestamp) {
    // Frame is in Nv12 encoding
    // timestamp is in seconds (not a unix epoch time)
  },
});

// Later
stream.stop();
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/maze
Description: Generate a maze using Prim's algorithm
Author: Fedor Indutny
Latest version: 1.0.0

# Maze
![License](https://img.shields.io/npm/l/@indutny/maze)

Generate a maze using Prim's algorithm.

## Usage

```js
import generate from '@indutny/maze';

const maze = generate({ width: 15, height: 15 });
console.log(maze);
```

## LICENSE

This software is licensed under the MIT License.

Copyright Fedor Indutny, 2020.

Permission is hereby granted, free of charge, to any person obtaining a
copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to permit
persons to whom the Software is furnished to do so, subject to the
following conditions:

The above copyright notice and this permission notice shall be included
in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN
NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE
USE OR OTHER DEALINGS IN THE SOFTWARE.
npm package: @indutny/parallel-prettier
Description: Concurrent prettier runner
Author: Connor Peet
Latest version: 3.0.0

# @mixer/parallel-prettier

A wrapper around [prettier]() that formats files in parallel to speed up large projects.

```
npm install -g @mixer/parallel-prettier
```

After installing the CLI, the `pprettier` command will be available to you.

### Ad-hoc Performance

```
# 300 file project:

prettier --write "src/**/*.{ts,tsx,json,scss}"  6.57s user 0.55s system 131% cpu 5.405 total
pprettier --write "src/**/*.{ts,tsx,json,scss}"  0.41s user 0.08s system 14% cpu 3.455 total

# 1200 file project:

prettier --write "src/**/*.{ts,tsx,json,scss}"  27.09s user 3.26s system 123% cpu 24.496 total
pprettier --write "src/**/*.{ts,tsx,json,scss}"  1.21s user 0.27s system 14% cpu 10.580 total
```
npm package: @indutny/protopiler
Description: Fast zero-dependency protocol buffer parser
Author: Fedor Indutny
Latest version: 4.0.0

# @indutny/protopiler

Just because there are many existing protobuf libraries for JavaScript it
doesn't mean that I'm not allowed to create one more.

## Selling Points

When compared to [protobufjs](https://www.npmjs.com/package/protobufjs) this
library:

- Faster (+5% decode/+32% encode)
- No 3rd party dependencies
- Almost instant compilation
- 2x smaller produced code (after minification)
- Native big integer support
- Native typescript support (via generated .d.ts file)
- Unknown field support
- No classes or prototype inheritance. Just plain JS objects in and out.

## Unsupported features

This is unambitious project so we do not intend to support (at least for now):

- `rpc`
- `map<a, b>`
- protobuf editions
- extensions/custom options
- ...and probably a lot of other things!

However we do support what we consider to be a typical protobuf usage (scalar,
repeated, oneof fields; enums, messages, bytes, strings).

## Installation

```sh
npm install -g @indutny/protopiler
```

## Usage

To compile source protobuf files into javascript run:

```sh
protopiler my.proto --output out.mjs --typedefs out.d.mts
```

If `my.proto` has the following contents:

```proto
package test;

message MyMessage {
  string key = 1;
  repeated uint32 values = 2;
}
```

The following JS snippet could be used to encode/decode the `MyMessage`:

```js
import { test } from './out.mjs';

// Encode JS object into a Uint8Array
const data = test.MyMessage.encode({
  key: 'test-key',
  values: [1, 2, 3],
});

// Decode Uint8Array back into a JS object
const decoded = test.MyMessage.decode(data);
console.log(decoded);
// Prints:
// { '$unknown': [], key: 'test-key', values: [ 1, 2, 3 ] }
```

## Benchmarks

On MacBook Air M2:

```
$ pnpm install
$ cd benchmarks
$ pnpm start -d 60 -s 1000
protobuf.mjs/decode:   2’386’421.9 ops/sec (±9’533.9, p=0.001, o=68/1000) severe outliers=44
protopiler.mjs/decode: 2’922’101.3 ops/sec (±4’707.1, p=0.001, o=17/1000) severe outliers=1
protobuf.mjs/encode:   1’085’274.8 ops/sec (±1’928.4, p=0.001, o=50/1000) severe outliers=29
protopiler.mjs/encode: 1’380’961.1 ops/sec (±1’598.2, p=0.001, o=13/1000) severe outliers=1
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/range-finder
Description: Reuse readable streams while serving range requests
Author: Fedor Indutny
Latest version: 1.3.4

# @indutny/range-finder

[![npm](https://img.shields.io/npm/v/@indutny/range-finder)](https://www.npmjs.com/package/@indutny/range-finder)
![CI Status](https://github.com/indutny/range-finder/actions/workflows/test.yml/badge.svg)

[API docs](https://indutny.github.io/range-finder).

Reuse readable streams while serving range requests.

Typically range requests are made for a data directly available on the file
system. However, for the cases where the data at rest is encrypted and not
easily indexable, serving range request still requires decrypting file from the
beginning. This can become a bottleneck for situations where a video has to be
served to a browser, since for a 100MB video Chromium would typically make
hundreds of requests, turning a 100MB video into tens of gigabytes of read and
decrypted data.

`range-finder` is is an aid for these (perhaps niche) cases. Instead of creating
a brand new stream for every request it stores and tracks previously created
streams that were no fully read, and attempts to reuse them when requesting
subsequent data. For the example of Chromium video loader above, using this
module reduces the created streams from ~200 to ~3.

## Installation

```sh
npm install @indutny/range-finder
```

## Usage

```js
import { RangeFinder, DefaultStorage } from '@indutny/range-finder';
import { createReadStream } from 'node:fs';

const storage = new DefaultStorage(() => createReadStream('/tmp/1.txt'), {
  maxSize: 100,
});

const finder = new RangeFinder(storage);

const startOffset = 123;
finder.get(startOffset).pipe(process.stdout);
```

## Limitations

Because streams are reused between several requests, if one of the requests
gets stalled it might stall all other requests that are based on the same input
stream. Depending on the use case, either more granular contexts could be used
or a timeout could be added to all derived streams.

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/rezip-electron
Description: Re-compress Electron macOS installer zip files for better incremental updates
Author: Fedor Indutny
Latest version: 3.0.2

# @indutny/rezip-electron

[![npm](https://img.shields.io/npm/v/@indutny/rezip-electron)](https://www.npmjs.com/package/@indutny/rezip-electron)

When generating the build files for macOS with
[electron-builder](https://www.electron.build/) the two natural artifacts for
the updates are:

- a compressed zip file with the app
- a blockmap file

Where blockmap file is leveraged for effective incremental downloads, or in
other words downloading only the updated parts of the new version of the app.

While using incremental downloads reduces download size dramatically it behaves
unoptimally with regards to the [asar](https://github.com/electron/asar) package
that contains most app's source files. The reason for this is that in a zip
archive all files are compressed individually, but after compression each file
has a high entropy and looks like mostly different blob when comparing
the blockmaps.

This CLI tool mitigates this by taking in account the asar file structure when
compressing it. Instead of [deflating](https://en.wikipedia.org/wiki/Deflate)
whole file as a single blob, we split it into logical chunks (one for every
sub-file) and flush zlib stream after each chunk. This means that the same
sub-files in asar are likely to result in the same compressed binary chunks in
the resultant optimized .zip file.

## Installation

```sh
npm install -g @indutny/rezip-electron
```

## Usage

```sh
rezip-electron optimize app.zip -o app.opt.zip
```

## Example

Before optimization:

```sh
$ rezip-electron compare signal-desktop-mac-arm64-6.48.0.zip \
    signal-desktop-mac-arm64-6.48.1.zip
# ...A lot of changed files...
Total Download Size: 10.00mb
```

After optimization:

```sh
$ rezip-electron compare signal-desktop-mac-arm64-6.48.0.opt.zip \
    signal-desktop-mac-arm64-6.48.1.opt.zip
# ...Way less changed files...
Total Download Size: 2.87mb
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/simple-windows-notifications
Description: Simple Windows Notifications
Author: Fedor Indutny
Latest version: 2.0.16

# @indutny/simple-windows-notifications

[![npm](https://img.shields.io/npm/v/@indutny/simple-windows-notifications)](https://www.npmjs.com/package/@indutny/simple-windows-notifications)

[API docs](https://indutny.github.io/simple-windows-notifications).

## Installation

```sh
npm install @indutny/simple-windows-notifications
```

## Usage

```js
import { Notifier } from '@indutny/simple-windows-notifications';

const notifier = new Notifier('org.indutny.test');
notifier.clearAll();

notifier.remove({ tag: 'tag', group: 'group' });

const toastXml = `<toast>
  <visual>
    <binding template="ToastText02">
      <text id="1">headlineText</text>
      <text id="2">bodyText</text>
    </binding>
  </visual>
</toast>`;

notifier.show(toastXml, { tag: 'tag', group: 'group' });
```

See https://learn.microsoft.com/en-us/previous-versions/windows/apps/hh761494(v=win.10)

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/sneaky-equals
Description: Sneaky equality check between objects using proxies
Author: Fedor Indutny
Latest version: 3.0.2
Deprecated: Please use @indutny/sneequals instead

# @indutny/sneaky-equals

Sneaky equals comparison between objects that checks only the properties that
were touched.

## Installation

```sh
npm install @indutny/sneaky-equals
```

## Usage

```js
import { wrap } from '@indutny/sneaky-equals';

const originalData = {
  nested: {
    prop: 1,
  },
  avatar: {
    src: 'image.png',
  },
};

const { proxy, changelog } = wrap(originalData);

function doSomethingWithData(data) {
  return {
    prop: data.nested.prop,
    x: data.avatar,
  };
}

const result = changelog.unwrap(doSomethingWithData(proxy));

// Prevent further access to proxy
changelog.freeze();

const sneakyEqualData = {
  nested: {
    prop: 1,
    other: 'ignored',
  },
  avatar: original.avatar,
};

console.log(changelog.isChanged(originalData, sneakyEqualData)); // false

const sneakyDifferentData = {
  nested: {
    prop: 2,
  },
  avatar: {
    ...original.avatar,
  },
};

console.log(changelog.isChanged(originalData, sneakyDifferentData)); // true
```

## LICENSE

This software is licensed under the MIT License.
npm package: @indutny/sneequals
Description: Sneaky equality check between objects using proxies
Author: Fedor Indutny
Latest version: 4.0.0

# @indutny/sneequals

[![npm](https://img.shields.io/npm/v/@indutny/sneequals)](https://www.npmjs.com/package/@indutny/sneequals)
[![size](https://img.shields.io/bundlephobia/minzip/@indutny/sneequals)](https://bundlephobia.com/result?p=@indutny/sneequals)
![CI Status](https://github.com/indutny/sneequals/actions/workflows/test.yml/badge.svg)

[API docs](https://indutny.github.io/sneequals).

Sneaky equals comparison between objects that checks only the properties that
were touched.

Heavily inspired by [proxy-compare](https://github.com/dai-shi/proxy-compare).

## Installation

```sh
npm install @indutny/sneequals
```

## Usage

```js
import { watch } from '@indutny/sneequals';

const originalData = {
  nested: {
    prop: 1,
  },
  avatar: {
    src: 'image.png',
  },
};

const { proxy, watcher } = watch(originalData);

function doSomethingWithData(data) {
  return {
    prop: data.nested.prop,
    x: data.avatar,
  };
}

const result = watcher.unwrap(doSomethingWithData(proxy));

// Prevent further access to proxy
watcher.stop();

const sneakyEqualData = {
  nested: {
    prop: 1,
    other: 'ignored',
  },
  avatar: original.avatar,
};

console.log(watcher.isChanged(originalData, sneakyEqualData)); // false

const sneakyDifferentData = {
  nested: {
    prop: 2,
  },
  avatar: {
    ...original.avatar,
  },
};

console.log(watcher.isChanged(originalData, sneakyDifferentData)); // true
```

## Benchmarks

On M1 Macbook Pro 13:

```sh
% npm run bench -- --duration 30 --ignore-outliers

> @indutny/sneequals@1.3.5 bench
> bencher dist/benchmarks/*.js

isChanged:    4’336’043.2 ops/sec (±28’636.7, p=0.001, o=5/100)
isNotChanged: 7’830’106.8 ops/sec (±53’241.7, p=0.001, o=1/100)
memoize:      7’632’437.7 ops/sec (±49’917.5, p=0.001, o=1/100)
watch+unwrap: 738’642.1 ops/sec (±3’396.8, p=0.001, o=3/100)
```

## Credits

- Based on [proxy-compare](https://github.com/dai-shi/proxy-compare) by
  [dai-shi](https://github.com/dai-shi)
- Name coined by [Scott Nonnenberg](https://github.com/scottnonnenberg/).

## LICENSE

This software is licensed under the MIT License.
npm package: @indux/indux
Description: A modern, lightweight frontend framework with built-in components and utilities
Author: Andrew Matlock
Latest version: 0.5.14

# Indux

Indux is a frontend framework extending HTML for rapid, feature-rich website and web app development, consisting of:

- A collection of plugins built on Alpine JS
- A CSS library, compatible with Tailwind CSS

**With Indux:**
- Skip the build steps
- Use only what you need
- Stack with other frameworks & libraries

<br>

## 💾 Setup

Get [CDN links](https://indux.build/getting-started/setup) for existing projects or try the [starter project](https://indux.build/getting-started/starter-project) for new ones.

<br>

## ✅ Features

**Alpine Plugins:**
- Color Themes
- Components
- Data Sources
- Localization
- SPA Routing

**UX/UI:**
- Global Theme
- Utility Classes
- 20+ Elements

**...and more**

<br>

## 📚 Documentation

For full documentation visit [indux.build](https://indux.build).

<br>

## 📄 License

Indux is provided under MIT license.

<br>

## 🙏 Acknowledgments

- [Alpine.js](https://alpinejs.dev) - Lightweight reactive framework, powering Indux plugins and bundled in `indux.quickstart.js`
- [Tailwind CSS](https://tailwindcss.com) - Utility-first CSS framework, with its Play CDN script bundled in `indux.quickstart.js`
- [Iconify](https://iconify.design) - Collection of all major icon libraries, bundled in Indux
- [highlight.js](https://highlightjs.org) - Syntax highlighter, referenced as needed by Indux
- [js-yaml](https://nodeca.github.io/js-yaml) - YAML parser, references as needed by Indux
- [Marked JS](https://marked.js.org) - Markdown parser, referenced as needed by Indux