open-index/open-npm huggingface dataset:
npm package: @sardap/loopback-sqs
Description: a loopback4 component for SQS inspired by https://github.com/alexnfsc175/loopback-rabbitmq#readme
Author: sardap
Latest version: 1.1.9

# Loopback4-SQS

## Where are the tests?
Good news I have chosen given YOU the opportunity to write them. Quickly before I trick someone else into doing it.

## How to use?
```
  const consumer = await app.get<SQSConsumer>(SQSBindings.SQS_CONSUMER);
  await consumer.subscribeToQueue(
    process.env.SQS_QUEUE_NAME,
    HANDLER_FUNCTION,
    err => {
      console.log(err);
    },
    err => {
      console.log(err);
    },
    MESSAGE_ATTR_NAMES,
  );

```
npm package: @sardine/colour
Description: It does things to colours
Author: Hugo Nogueira
Latest version: 4.0.0

<img alt="Sardine logo" src="https://colour.sardine.dev/assets/icons/logo.svg" width="300">

# @sardine/colour

Sardines playing with colours!

## Requirements

- [Node.js](https://nodejs.org/en/download/) 16 and up

## Installation

```bash
npm install --save-dev @sardine/colour
```
## Documentation

You can check our documentation in https://colour.sardine.dev/
npm package: @sardine/eleventy-plugin-code-highlighter
Description: An eleventy plugin to higlight code blocks
Author: Hugo Nogueira
Latest version: 1.2.0

# `@sardine/eleventy-plugin-code-highlighter`

An 11ty plugin to style your `<code>`.

## Features

This plugin uses [Prism](https://prismjs.com/) to style `<code>` blocks at build time and inlines Prism CSS theme in the page `<head>`.

Because styling is done at build time, you don't need to asynchronously load CSS and Javascript on the browser.

## Requirements

- [Node.js](https://nodejs.org/en/download/) 12 and up

- [11ty](https://www.11ty.dev/) 0.11

## Installation

```bash
npm install --save-dev @sardine/eleventy-plugin-code-highlighter
```

## How to use it

```javascript
// .eleventy.js
const codeHighlighter = require('@sardine/eleventy-plugin-code-highlighter');
module.exports = function (eleventyConfig) {
  eleventyConfig.addPlugin(codeHighlighter);
};
```

### Options

By default the [Tomorrow](https://cdnjs.cloudflare.com/ajax/libs/prism/1.19.0/themes/prism-tomorrow.min.css) theme is used. You can use any Prism theme by passing the theme URL as an option.

```javascript
// .eleventy.js
const codeHighlighter = require('@sardine/eleventy-plugin-code-highlighter');

const PRISM_THEME = 'https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/themes/prism-twilight.min.css';

module.exports = function (eleventyConfig) {
  eleventyConfig.addPlugin(codeHighlighter, { urlTheme: PRISM_THEME });
};
```

## License

[MIT](./LICENSE)
npm package: @sardine/eleventy-plugin-external-links
Description: An eleventy plugin to enforce safe external links
Author: Hugo Nogueira
Latest version: 1.4.0

# `@sardine/eleventy-plugin-external-links`

An 11ty plugin to protect you external links.

## Features

Adds `target="_blank" rel="noreferrer"` to all external links to [make them safer](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/noreferrer).

Original Anchor tags:

```html
<html>
  <body>
    <a href="https://www.external.com">Hello to the outside!</a>
    <a href="/internal/link/">Hello to me!</a>
  </body>
</html>
```

Generated Anchor tags:

```html
<html>
  <body>
    <a href="https://www.external.com" target="_blank" rel="noreferrer">Hello to the outside!</a>
    <a href="/internal/link/">Hello to me!</a>
  </body>
</html>
```

## Requirements

- [Node.js](https://nodejs.org/en/download/) 12 and up

- [11ty](https://www.11ty.dev/) 0.11

## Installation

```bash
npm install --save-dev @sardine/eleventy-plugin-external-links
```

## How to use it

```javascript
const safeLinks = require('@sardine/eleventy-plugin-external-links');
module.exports = function (eleventyConfig) {
  eleventyConfig.addPlugin(safeLinks);
};
```

## License

[MIT](./LICENSE)
npm package: @sardine/eleventy-plugin-image-optimiser
Description: An eleventy plugin to optimise images
Author: Hugo Nogueira
Latest version: 1.2.0

# `@sardine/eleventy-plugin-image-optimiser`

An 11ty plugin to optimise your images.

## Features


## Requirements

- [Node.js](https://nodejs.org/en/download/) 12 and up

- [11ty](https://www.11ty.dev/) 0.11.0

## Installation

```bash
npm install --save-dev @sardine/eleventy-plugin-image-optimiser
```

## How to use it

```javascript
// .eleventy.js
const imageOptimiser = require('@sardine/eleventy-plugin-image-optimiser');
module.exports = function (eleventyConfig) {
  eleventyConfig.addPlugin(imageOptimiser);
};
```

### Options

## License

[MIT](./LICENSE)
npm package: @sardine/eleventy-plugin-inline-svg
Description: An eleventy plugin to inline SVG
Author: Hugo Nogueira
Latest version: 0.0.1

# `@sardine/eleventy-plugin-inline-svg`

An 11ty plugin to inline SVG.

## Features

Inlines SVG files and optimises it with [SVGO](https://github.com/svg/svgo) to keep it as small as possible

## Requirements

- [Node.js](https://nodejs.org/en/download/) 12 and up

- [11ty](https://www.11ty.dev/) 0.11

## Installation

```bash
npm install --save-dev @sardine/eleventy-plugin-inline-svg
```

## How to use it

```javascript
const inlineSvg = require('@sardine/eleventy-plugin-inline-svg');
eleventyConfig.addPlugin(inlineSvg, {
  baseUrl: 'site/_assets/svg/',
});
```

## License

[MIT](./LICENSE)
npm package: @sardine/eleventy-plugin-tinyhtml
Description: A plugin for 11ty to minify and optimise HTML
Author: Hugo Nogueira
Latest version: 0.2.0

# eleventy-plugin-tinyHTML

An 11ty plugin to optimise HTML.

## Features


- Uses [html-minifier](https://github.com/kangax/html-minifier) to optimise HTML.

  You can pass [html-minifier configuration object](https://github.com/kangax/html-minifier#options-quick-reference) in the [plugin's options](./Configuration)


## Requirements

- [Node.js](https://nodejs.org/en/download/) 12 and up

- [11ty](https://www.11ty.dev/) 0.11

## Installation

```bash
npm install --save-dev @sardine/eleventy-plugin-tinyhtml
```

## How to use it

```javascript
const tinyHTML = require('@sardine/eleventy-plugin-tinyhtml');
module.exports = function (eleventyConfig) {
  eleventyConfig.addPlugin(tinyHTML);
};
```

## Configuration

```javascript
const tinyHTML = require('@sardine/eleventy-plugin-tinyhtml');
module.exports = function (eleventyConfig) {
  const tinyHTMLOptions = {
    html5: true,
    removeRedundantAttributes : true,
  };

  eleventyConfig.addPlugin(tinyHTML, tinyHTMLOptions);
};
```

### html-minifier options

By default the following options are used:

```javascript
{
  collapseBooleanAttributes: true,
  collapseWhitespace: true,
  decodeEntities: true,
  html5: true,
  removeAttributeQuotes: true,
  removeComments: true,
  removeOptionalTags: true,
  sortAttributes: true,
  sortClassName: true,
};
```

## License

[MIT](./LICENSE)
npm package: @sardine/eleventy-plugin-tinysvg
Description: An eleventy plugin to minify and optimise SVG
Author: Hugo Nogueira
Latest version: 1.2.0

# `@sardine/eleventy-plugin-tinysvg`

An eleventy plugin to minify and optimise SVG

## Features

Inlines SVG files and optimises it with [SVGO](https://github.com/svg/svgo) to keep it as small as possible.

## Requirements

- [Node.js](https://nodejs.org/en/download/) 12 and up

- [11ty](https://www.11ty.dev/) 0.11.0

## Installation

```bash
npm install --save-dev @sardine/eleventy-plugin-tinysvg
```

## How to use it

```javascript
const tinysvg = require('@sardine/eleventy-plugin-tinysvg');
eleventyConfig.addPlugin(tinysvg, {
  baseUrl: 'site/_assets/svg/',
});
```

## License

[MIT](./LICENSE)
npm package: @sardine/lightningcss-plugin-global-composes
Description: A LightningCSS plugin to compose selectors
Author: Hugo Nogueira
Latest version: 1.2.1

# @sardine/lightningcss-plugin-global-composes

A [Lightning CSS](https://lightningcss.dev/) plugin that does things to CSS.

## Use case

A LightningCSS plugin to compose selectors

Similar to the `composes` [property in CSS Modules](https://github.com/css-modules/css-modules/blob/master/docs/composition.md), this plugin allows you to compose selectors in a global context.

Unlike CSS Modules `composes`, this plugin expects a `@` symbol before, `@composes` to avoid any confusion with a possible CSS spec in the future.

## Installation

```bash
npm install --save-dev @sardine/lightningcss-plugin-global-composes
```

## How to use

```js
import { transform } from "lightningcss";
import globalComposes from "@sardine/lightningcss-plugin-global-composes";

const { code } = bundle({
  filename: "style.css",
  minify: true,
  visitor: composeVisitors([globalComposes({ source: "./css/globals.css" })]),
});
```

## Avoiding warnings

By default, LightningCSS will emit a warning when it encounters the `@composes` at-rule: `[lightningcss] Unknown at rule: @composes`. This happens because `@composes` is parsed as an unknown at-rule before the plugin can process it.

To avoid this warning, you can configure LightningCSS to recognize `@composes` as a custom at-rule:

```js
import { transform, composeVisitors } from "lightningcss";
import globalComposes, { globalComposesCustomAtRules } from "@sardine/lightningcss-plugin-global-composes";

const { code } = transform({
  filename: "style.css",
  minify: true,
  code: Buffer.from(css),
  customAtRules: {
    ...globalComposesCustomAtRules,
  },
  visitor: composeVisitors([globalComposes({ source: "./css/globals.css" })]),
});
```

### With Vite

When using Vite with the `lightningcss` CSS transformer:

```js
// vite.config.js
import { defineConfig } from 'vite';
import { globalComposesCustomAtRules } from '@sardine/lightningcss-plugin-global-composes';

export default defineConfig({
  css: {
    transformer: 'lightningcss',
    lightningcss: {
      customAtRules: {
        ...globalComposesCustomAtRules,
      },
    },
  },
});
```

## Development

### Running Tests

```bash
npm test
```

### Running Benchmarks

Benchmarks are available to measure performance characteristics of the plugin:

```bash
npm run bench
```

Or run benchmarks directly with Vitest:

```bash
npx vitest bench --run
```

The benchmark suite includes stress tests with 60+ utility classes to simulate real-world usage patterns and help identify performance bottlenecks.
npm package: @sardine/lightningcss-plugin-global-custom-queries
Description: A LightningCSS that enables Custom Media Queries everywhere
Author: Hugo Nogueira
Latest version: 1.1.0

# @sardine/lightningcss-plugin-global-custom-queries

A [Lightning CSS](https://lightningcss.dev/) plugin that resolves `@custom-media` queries globally. Define your custom media queries once in a shared CSS file and use them anywhere in your project — the plugin rewrites them to their resolved values at build time.

## Use case

[CSS Custom Media Queries](https://www.w3.org/TR/mediaqueries-5/#custom-mq) let you name a media condition and reuse it:

```css
/* tokens.css */
@custom-media --breakpoint (width <= 100em);
@custom-media --large (width >= 120em);
```

```css
/* component.css */
@media (--breakpoint) {
  .card { font-size: 14px; }
}

@media not (--breakpoint) {
  .card { font-size: 16px; }
}

@media (--breakpoint) and (color) {
  .card { color: red; }
}
```

This plugin resolves those references at build time, so the output is valid CSS that all browsers understand:

```css
@media (width <= 100em) {
  .card { font-size: 14px; }
}

@media (width > 100em) {
  .card { font-size: 16px; }
}

@media (width <= 100em) and (color) {
  .card { color: red; }
}
```

## Installation

```bash
npm install --save-dev @sardine/lightningcss-plugin-global-custom-queries
```

## Usage

```ts
import { composeVisitors, transform } from "lightningcss";
import globalCustomQueries from "@sardine/lightningcss-plugin-global-custom-queries";

const { code } = transform({
  filename: "component.css",
  code: Buffer.from(`
    @media (--breakpoint) {
      .card { font-size: 14px; }
    }
  `),
  visitor: composeVisitors([
    globalCustomQueries({ source: "./tokens.css" }),
  ]),
});
```

### With a bundler (e.g. Vite)

```ts
// vite.config.ts
import { composeVisitors } from "lightningcss";
import globalCustomQueries from "@sardine/lightningcss-plugin-global-custom-queries";

export default {
  css: {
    transformer: "lightningcss",
    lightningcss: {
      visitor: composeVisitors([
        globalCustomQueries({ source: "./src/tokens.css" }),
      ]),
    },
  },
};
```

## Options

| Option | Type | Description |
|--------|------|-------------|
| `source` | `string` | Path to the CSS file containing the `@custom-media` definitions to resolve from. |

## Supported query shapes

| Input | Resolved |
|-------|----------|
| `@media (--breakpoint)` | Direct feature reference |
| `@media not (--breakpoint)` | Negated condition |
| `@media (--breakpoint) and (color)` | AND / OR compound condition |
| `@media screen and (--breakpoint)` | Media type combined with custom feature |
| `@media (--unknown)` | Left unchanged — name not found in source file |
| `@media print` | Left unchanged — no custom feature present |
npm package: @sardine/lightningcss-plugin-url-composer
Description: A Lightning CSS plugin to compose strings in the CSS
Author: Hugo Nogueira
Latest version: 1.2.0

# @sardine/lightningcss-plugin-url-composer

A [Lightning CSS](https://lightningcss.dev/) plugin to compose urls in CSS.

## Use case

If you have multiple environments for your website, you may want to load different assets depending on the environment. For example, you may want to load `https://sardine.dev/logo-in-red.svg` in development and `https://sardine.com/logo.svg` in production.

Or you may want to point at different domains, for example, `https://dev.sardine.dev/images/logo.svg` in development and `https://cdn.sardine.com/images/logo.svg` in production.

The sky is the limit.

## Installation

```bash
npm install --save-dev @sardine/lightningcss-plugin-url-composer
```

## How to use

```javascript
import { composeVisitors, transform } from "lightningcss";
import urlComposer from "@sardine/lightningcss-plugin-url-composer";

const res = transform({
  minify: true,
  code: Buffer.from("body { background: url(${URL}/logo.svg); }"),
  visitor: composeVisitors([urlComposer({ URL: "https://sardine.dev" })]),
});

const css = res.code.toString();

console.log(css);
// body{background:url(https://sardine.dev/logo.svg)}
```
npm package: @sardine/srdn
Description: Sardine's favourite build tool for the web
Author: Hugo Nogueira
Latest version: 0.1.0

# srdn
The Sardine CLI

## Run locally

```bash
cargo run -- --option [command]
```

### Builds all files in `tests/src` and outputs them in `tests/dist`
```bash
cargo run -- build -s tests/src -d tests/dist
```

### Builds one file and outputs it in `tests/dist/a/a.css`
```bash
cargo run -- build -f ./tests/src/a/a.module.css -o tests/dist/a/a.css
```
npm package: @sardine/srdn-cli
Description: Sardine's favourite build tool for the web
Author: Hugo Nogueira
Latest version: 0.0.2

# srdn
The Sardine CLI

## Run locally

```bash
cargo run -- --option [command]
```

### Builds all files in `tests/src` and outputs them in `tests/dist`
```bash
cargo run -- build -s tests/src -d tests/dist
```

### Builds one file and outputs it in `tests/dist/a/a.css`
```bash
cargo run -- build -f ./tests/src/a/a.module.css -o tests/dist/a/a.css
```
npm package: @sardine/srdn-cli-darwin-arm64
Description: Sardine's favourite build tool for the web
Author: Hugo Nogueira
Latest version: 0.1.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

This is the aarch64-apple-darwin build of @sardine/srdn. See https://github.com/sardinedev/srdn for details.
npm package: @sardine/srdn-cli-darwin-x64
Description: Sardine's favourite build tool for the web
Author: Hugo Nogueira
Latest version: 0.1.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

This is the x86_64-apple-darwin build of @sardine/srdn. See https://github.com/sardinedev/srdn for details.
npm package: @sardine/srdn-cli-linux-x64-musl
Description: Sardine's favourite build tool for the web
Author: Hugo Nogueira
Latest version: 0.1.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

This is the x86_64-unknown-linux-musl build of @sardine/srdn. See https://github.com/sardinedev/srdn for details.
npm package: @sardis/activepieces
Description: Sardis payment piece for Activepieces - policy-controlled payments for AI agents
Author: Sardis
Latest version: 1.0.0

# @activepieces/piece-sardis

Sardis payment piece for [Activepieces](https://activepieces.com) — policy-controlled payments for AI agents.

## Install

```bash
npm install @activepieces/piece-sardis
```

## Usage

1. Add the Sardis piece to your Activepieces instance
2. Configure your API key in the connection settings
3. Use the **Send Payment** or **Check Balance** actions in your flows

## Actions

| Action | Description |
|--------|-------------|
| Send Payment | Execute a policy-controlled stablecoin payment |
| Check Balance | Check wallet balance and spending limits |

## Authentication

Requires a Sardis API key (`sk_...`). Get one at [sardis.sh](https://sardis.sh).

## Links

- [Sardis Docs](https://sardis.sh/docs)
- [Activepieces Docs](https://activepieces.com/docs)
npm package: @sardis/stagehand
Description: Sardis payment tools for Stagehand browser agents
Author: Sardis
Latest version: 1.0.0

# @sardis/stagehand

Sardis payment tools for [Stagehand](https://github.com/browserbase/stagehand) browser agents. Gives your AI browser agent policy-controlled access to a Sardis wallet for making real payments during web sessions.

## Install

```bash
npm install @sardis/stagehand @sardis/sdk
```

## Quickstart

**1. Configure environment**

```bash
export SARDIS_API_KEY=sk_...
export SARDIS_WALLET_ID=wallet_...
```

**2. Register tools with your Stagehand agent**

```typescript
import { Stagehand } from '@browserbasehq/stagehand';
import { createSardisTools } from '@sardis/stagehand';

const stagehand = new Stagehand({ env: 'BROWSERBASE' });
await stagehand.init();

const tools = createSardisTools({
  apiKey: process.env.SARDIS_API_KEY,
  walletId: process.env.SARDIS_WALLET_ID,
  chain: 'base',   // default
  token: 'USDC',   // default
});
```

**3. Use tools in your agent loop**

```typescript
// Check balance before acting
const balance = await tools.sardis_check_balance.execute({});
console.log(`Available: ${balance.balance} ${balance.token}`);

// Verify policy allows the spend
const policy = await tools.sardis_check_policy.execute({
  amount: 49.99,
  merchant: 'acme-shop.com',
});

if (policy.allowed) {
  // Execute the payment
  const result = await tools.sardis_pay.execute({
    amount: 49.99,
    merchant: 'acme-shop.com',
    purpose: 'SaaS subscription renewal',
  });
  console.log(result.transactionHash);
}
```

## Available Tools

| Tool | Description |
|------|-------------|
| `sardis_pay` | Execute a policy-controlled USDC payment |
| `sardis_check_balance` | Read current wallet balance |
| `sardis_check_policy` | Dry-run a spend against the wallet's spending policy |

## License

MIT
npm package: @sardischain/eslint-config-sardisswap
Description: Eslint config for Sardisswap
Author: RabbitDoge
Latest version: 1.0.0

# eslint-config-sardisswap

Sardisswap Eslint config with:

- Airbnb config
- Typescript
- Prettier

## Usage

```
npx install-peerdeps --dev @sardischain/eslint-config-sardisswap
```

Add `"extends": "@sardischain/eslint-config-sardisswap"` to your eslint config file.
npm package: @sardonyxwt/core
Description: Core
Author: sardonyx.wt@gmail.com
Latest version: 1.0.1

# Core Lib

Core lib provide build in modules for app development. It include:

-   Module manager
-   I18n manager
-   Resource manager
-   Config manager
-   Dependency manager

### Module manager

Provides store for modules, service for module management and hooks for react components.

-   [service /src/service/module.service.ts](./src/service/module.service.ts)
-   [store /src/service/module.store.ts](./src/store/module.store.ts)
-   [hook /src/hook/module.hook.ts](./src/hook/module.hook.ts)

### Resource manager

Provides store for resources, service for resource management and hooks for react components.

-   [service /src/service/resource.service.ts](./src/service/resource.service.ts)
-   [store /src/service/resource.store.ts](./src/store/resource.store.ts)
-   [hook /src/hook/resource.hook.ts](./src/hook/resource.hook.ts)

### Config manager

Provides store for configs, service for config management and hooks for react components.

-   [service /src/service/config.service.ts](./src/service/config.service.ts)
-   [store /src/service/config.store.ts](./src/store/config.store.ts)
-   [hook /src/hook/config.hook.ts](./src/hook/config.hook.ts)

### I18n manager

Provides store for translation units and application localization state, service for localization management and hooks for react components.

-   [service /src/service/internationalization.service.ts](./src/service/internationalization.service.ts)
-   [store /src/service/internationalization.store.ts](./src/store/internationalization.store.ts)
-   [hook /src/hook/internationalization.hook.ts](./src/hook/internationalization.hook.ts)

## Used libs

-   [Mobx] for state management
-   [bottlejs] for dependency injection.

[mobx]: https://mobx.js.org/README.html
[bottlejs]: https://www.npmjs.com/package/bottlejs

## Scripts

-   Install dependencies:

```sh
npm install
```

-   Build lib:

```sh
npm run build
```

-   Start development lib:

```sh
npm run watch
```
npm package: @sardonyxwt/ligui
Description: Ligui
Author: sardonyx.wt@gmail.com
Latest version: 17.0.2

# Core Lib

Core lib provide build in modules for app development. It include:

-   Module manager
-   I18n manager
-   Resource manager
-   Config manager
-   Dependency manager

### Module manager

Provides store for modules, service for module management and hooks for react components.

-   [service /src/service/module.service.ts](./src/service/module.service.ts)
-   [store /src/service/module.store.ts](./src/service/module.store.ts)
-   [hook /src/hook/module.hook.ts](./src/hook/module.hook.ts)

### Resource manager

Provides store for resources, service for resource management and hooks for react components.

-   [service /src/service/resource.service.ts](./src/service/resource.service.ts)
-   [store /src/service/resource.store.ts](./src/service/resource.store.ts)
-   [hook /src/hook/resource.hook.ts](./src/hook/resource.hook.ts)

### Config manager

Provides store for configs, service for config management and hooks for react components.

-   [service /src/service/config.service.ts](./src/service/config.service.ts)
-   [store /src/service/config.store.ts](./src/service/config.store.ts)
-   [hook /src/hook/config.hook.ts](./src/hook/config.hook.ts)

### I18n manager

Provides store for translation units and application localization state, service for localization management and hooks for react components.

-   [service /src/service/internationalization.service.ts](./src/service/internationalization.service.ts)
-   [store /src/service/internationalization.store.ts](./src/service/internationalization.store.ts)
-   [hook /src/hook/internationalization.hook.ts](./src/hook/internationalization.hook.ts)

## Used libs

-   [bottlejs] for dependency injection.
-   [@sardonyxwt/event-bus] for event management
-   [@sardonyxwt/state-store] for state management

[@sardonyxwt/event-bus]: https://www.npmjs.com/package/@sardonyxwt/event-bus
[@sardonyxwt/state-store]: https://www.npmjs.com/package/@sardonyxwt/state-store
[bottlejs]: https://www.npmjs.com/package/bottlejs

## Scripts

-   Install dependencies:

```sh
npm install
```

-   Build lib:

```sh
npm run build
```

-   Start development lib:

```sh
npm run watch
```

-   Run tests:

```sh
npm run test
```
npm package: @sareid/maps
Description: This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.0.6.
Latest version: 0.0.1

# Maps

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.0.6.

## Development server

Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.

## Code scaffolding

Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|module`.

## Build

Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.

## Running unit tests

Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Running end-to-end tests

Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
Before running the tests make sure you are serving the app via `ng serve`.

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
npm package: @sarequl/client-ip-details
Description: You can detect requested client full ip details by this package. (isp, organization, location, residential/data center, proxy, etc)
Author: sarequl
Latest version: 1.1.1

# requested client ip details

### Install the package

npm

```bash
npm install @sarequl/client-ip-details
```

yarn

```
yarn add @sarequl/client-ip-details
```

### example with expressjs

```js
const express = require('express');
const { getIpDetails, getCustomIpDetails } = require('@sarequl/client-ip-details');
const app = express();

app.get('/', async (req, res) => {
	// to get ip details of who requested to the server.
	const details = await getIpDetails(req);
	//
	console.log(details);
	res.send('your message');
});

app.get('/custom', async (req, res) => {
	// to get certain ip details, pass the IP address on the function.
	const details = await getCustomIpDetails('24.48.0.1');
	//
	console.log(details);
	res.send('your message');
});

app.listen(3000, () => {
	console.log('Example app listening on port 3000!');
});
```

### response

```json
{
	"status": "success",
	"continent": "North America",
	"continentCode": "NA",
	"country": "Canada",
	"countryCode": "CA",
	"region": "QC",
	"regionName": "Quebec",
	"city": "Montreal",
	"district": "",
	"zip": "H3G",
	"lat": 45.4995,
	"lon": -73.5848,
	"timezone": "America/Toronto",
	"offset": -14400,
	"currency": "CAD",
	"isp": "Le Groupe Videotron Ltee",
	"org": "Videotron Ltee",
	"as": "AS5769 Videotron Telecom Ltee",
	"asname": "VIDEOTRON",
	"reverse": "modemcable001.0-48-24.mc.videotron.ca",
	"mobile": false,
	"proxy": false,
	"hosting": false,
	"query": "24.48.0.1"
}
```

### Note

Client ip detection from request does not work on localhost.
npm package: @sarfarajey/analytics-logger
Description: GA4 analytics abstraction with debouncing, traffic source detection, and user ID stitching
Author: sarfarajey
Latest version: 1.0.0

# @sarfarajey/analytics-logger

GA4 analytics abstraction for browser apps. Configuration-gated dispatch, debouncing for high-frequency events, traffic source detection, and user ID stitching.

## Install

```bash
npm install @sarfarajey/analytics-logger
```

## Setup

Call `configure()` once at app bootstrap (e.g. in your layout component or `<script>` tag):

```ts
import { configure } from '@sarfarajey/analytics-logger';

configure({
  // Only dispatch on production
  isEnabled: () => window.location.hostname === 'example.com',

  // Optional second provider (Plausible, PostHog, custom endpoint, etc.)
  secondaryDispatch: (name, props) => {
    window.plausible?.(name, { props });
  },

  // Events to debounce (600ms, only last call fires)
  debouncedEvents: ['slider_change', 'simulation_run'],
});
```

## Usage

```ts
import { logEvent, logPageView, setAnalyticsUserId, detectTrafficSource } from '@sarfarajey/analytics-logger';

// Page view (auto-attaches traffic_source)
logPageView({ page: '/dashboard/', title: 'Dashboard' });

// Custom event
logEvent('button_click', { label: 'Export PDF', format: 'A4' });

// Debounced event (configured above) — only last call within 600ms fires
logEvent('slider_change', { value: 42 });

// Stitch an authenticated user to anonymous GA4 events
setAnalyticsUserId('user-abc-123');

// Clear on sign-out
setAnalyticsUserId(null);

// Inspect traffic source directly
const source = detectTrafficSource();
// → 'direct' | 'seo' | 'linkedin' | 'referral:github.com' | 'utm_campaign_value' | 'unknown'
```

## API

### `configure(config)`

Configure the logger. Must be called before `logEvent`.

```ts
interface AnalyticsConfig {
  isEnabled: () => boolean;
  secondaryDispatch?: (name: string, props: EventProps) => void;
  debouncedEvents?: string[]; // default: ['simulation_run', 'cost_override', 'calculate_click']
}
```

### `logEvent(name, props?)`

Dispatch an event. Debounced events are coalesced over 600ms.

### `logPageView(props?)`

Shorthand for `logEvent('page_view', { traffic_source, ...props })`.

### `setAnalyticsUserId(uid)`

Set or clear GA4 `user_id` for anonymous → registered stitching.

### `detectTrafficSource()`

Returns the current traffic source as a string: `'direct'`, `'seo'`, `'linkedin'`, `'internal'`, `'referral:<host>'`, UTM source value, or `'unknown'`.

## License

MIT
npm package: @sarfarajey/fuzzy-match
Description: Token-based fuzzy string matching with Levenshtein distance — zero dependencies
Author: sarfarajey
Latest version: 1.0.0

# @sarfarajey/fuzzy-match

Token-based fuzzy string matching with Levenshtein distance fallback. Zero dependencies.

Designed for entity deduplication and voice/text input matching — mapping raw user input to a known list of canonical candidates.

## Install

```bash
npm install @sarfarajey/fuzzy-match
```

## Usage

```ts
import { findBestMatchId, scoreTerm } from '@sarfarajey/fuzzy-match';

const candidates = [
  { id: 'acme', label: 'Acme Corp', aliases: ['Acme', 'ACME Corporation'] },
  { id: 'globex', label: 'Globex', aliases: ['Globex Corp', 'GlobEx'] },
];

findBestMatchId('acme corp', candidates);     // → 'acme'
findBestMatchId('globex corporation', candidates); // → 'globex'
findBestMatchId('xyz unknown', candidates);   // → null  (below threshold)

// With custom threshold (0–100, default 58)
findBestMatchId('acmee', candidates, 70);     // → 'acme' (typo tolerance)
findBestMatchId('acmee', candidates, 95);     // → null  (strict)

// Score a single term pair
scoreTerm('acme', 'Acme Corp');   // → 86  (substring match)
scoreTerm('acme', 'Acme');        // → 100 (exact after normalization)
scoreTerm('akme', 'Acme');        // → 75  (Levenshtein)
```

## API

### `findBestMatchId(input, candidates, threshold?)`

Returns the `id` of the best-matching candidate, or `null` if no candidate meets the threshold.

| Param | Type | Default | Description |
|-------|------|---------|-------------|
| `input` | `string` | — | Raw input to match |
| `candidates` | `MatchCandidate[]` | — | Known entity list |
| `threshold` | `number` | `58` | Minimum score (0–100) |

### `scoreTerm(input, term)`

Score a single input string against a single candidate term. Returns 0–100.

### `MatchCandidate`

```ts
interface MatchCandidate {
  id: string;       // returned on match
  label: string;    // primary display label
  aliases: string[]; // alternate names / abbreviations
}
```

## Scoring

| Condition | Score |
|-----------|-------|
| Exact match (after normalization) | 100 |
| Substring containment (either direction) | 86 |
| Levenshtein similarity | 0–85 |

Normalization lowercases input, strips non-alphanumeric characters (except spaces), and collapses whitespace.

## License

MIT
npm package: @sarfarajey/pdf-primitives
Description: Low-level browser-side PDF generation utilities — raw PDF 1.4, no jsPDF, no server
Author: sarfarajey
Latest version: 1.0.0

# @sarfarajey/pdf-primitives

Low-level browser-side PDF generation utilities. Generates valid PDF 1.4 from scratch — no jsPDF, no canvas, no server.

## Install

```bash
npm install @sarfarajey/pdf-primitives
```

## Usage

```ts
import {
  buildMultiPagePdf,
  addPageChrome,
  addWrappedBlock,
  textCommand,
  lineCommand,
  MARGIN,
  CONTENT_TOP,
  CONTENT_BOTTOM,
} from '@sarfarajey/pdf-primitives';

// Build a single-page PDF
const page: string[] = [];

// Add branded header + footer (all fields optional)
addPageChrome(page, {
  accentRgb: [0.2, 0.4, 0.9],
  brandLabel: 'My Company | mycompany.com',
  footerLine1: 'mycompany.com | hello@mycompany.com',
  footerLine2: 'Confidential — not for distribution.',
});

// Add a title
page.push(textCommand('Quarterly Report', MARGIN, CONTENT_TOP, 20));

// Add a wrapped paragraph
let y = CONTENT_TOP - 30;
y = addWrappedBlock(page, 'This is a long paragraph that will be wrapped...', MARGIN, y, 11, 85, 15);

// Add a divider
page.push(lineCommand(MARGIN, y, 556, y));

// Produce and download the PDF
const blob = buildMultiPagePdf([page]);
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'report.pdf';
a.click();
URL.revokeObjectURL(url);
```

## API

### Page geometry constants

| Constant | Value | Description |
|----------|-------|-------------|
| `PAGE_WIDTH` | 612 | US Letter width (pt) |
| `PAGE_HEIGHT` | 792 | US Letter height (pt) |
| `MARGIN` | 56 | Left/right margin (pt) |
| `CONTENT_END_X` | 556 | Right edge of content area |
| `CONTENT_TOP` | 740 | Top of content area |
| `CONTENT_BOTTOM` | 70 | Bottom of content area |

### Text

- **`toAscii(input)`** — Normalize Unicode → printable ASCII.
- **`escapePdfText(input)`** — Escape for PDF string literals.
- **`wrapText(text, maxChars)`** — Word-wrap to string array.
- **`textCommand(text, x, y, fontSize)`** — Raw PDF BT…ET command string.
- **`addWrappedBlock(commands, text, x, y, fontSize, maxChars, lineHeight)`** — Append wrapped text, returns Y cursor below last line.

### Graphics

- **`lineCommand(x1, y1, x2, y2)`** — Raw PDF line-draw command.

### Page chrome

- **`addPageChrome(commands, config?)`** — Append configurable header + footer to a page.

```ts
interface PageChromeConfig {
  accentRgb?: [number, number, number]; // RGB 0–1, default black
  brandLabel?: string;
  footerLine1?: string;
  footerLine2?: string;
}
```

### Multi-page builder

- **`buildMultiPagePdf(pages, pageImages?)`** — Produce a `Blob` (application/pdf).

```ts
// Multi-page with images
const blob = buildMultiPagePdf(
  [page1Commands, page2Commands],
  [
    [{ id: 'Im0', hexData: '...', nativeWidth: 800, nativeHeight: 600 }],
    [], // page 2 has no images
  ],
);
```

Images must be JPEG encoded and provided as ASCII hex strings.

## License

MIT
npm package: @sarfarajey/react-ui-primitives
Description: Accessible, keyboard- and touch-aware React UI primitives with Tailwind CSS styling
Author: sarfarajey
Latest version: 1.0.0

# @sarfarajey/react-ui-primitives

Accessible, keyboard- and touch-aware React UI primitives with Tailwind CSS styling.

## Install

```bash
npm install @sarfarajey/react-ui-primitives
```

Requires React 18+ and Tailwind CSS in your project.

---

## Tooltip

Fully accessible tooltip with mouse, keyboard, and touch support.

```tsx
import { Tooltip, InfoIcon, LabelWithTip } from '@sarfarajey/react-ui-primitives';

// Basic usage
<Tooltip text="This is the tooltip content.">
  <InfoIcon />
</Tooltip>

// All positions
<Tooltip text="Above" position="top">...</Tooltip>
<Tooltip text="Below" position="bottom">...</Tooltip>
<Tooltip text="Left" position="left">...</Tooltip>
<Tooltip text="Right" position="right">...</Tooltip>

// Custom styling
<Tooltip
  text="Custom themed tooltip"
  tooltipClassName="bg-blue-900"
>
  <InfoIcon />
</Tooltip>

// Form label with built-in tooltip icon (LabelWithTip)
<LabelWithTip
  htmlFor="provider"
  label="Provider"
  tip="The AI company that trains the model."
  className="text-sm font-medium"
/>
```

### Behavior

| Input | Action |
|-------|--------|
| Mouse hover | Show / hide |
| Tab focus | Show |
| Blur | Hide |
| Escape | Hide |
| Touch long-press (500ms) | Show |
| Touch move | Cancel pending show |
| Second tap while visible | Hide |

### ARIA

- Trigger wrapper: `tabIndex={0}`, `aria-describedby={tooltipId}`
- Tooltip span: `role="tooltip"`, `aria-hidden={!visible}`
- The tooltip is always in the DOM so `aria-describedby` resolves at all times.

### Props

**`<Tooltip>`**

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `text` | `string` | — | Tooltip copy |
| `children` | `ReactNode` | — | Trigger element |
| `position` | `'top' \| 'bottom' \| 'left' \| 'right'` | `'top'` | Bubble position |
| `className` | `string` | `''` | Extra classes on trigger wrapper |
| `tooltipClassName` | `string` | `''` | Extra classes on bubble |

**`<LabelWithTip>`**

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `htmlFor` | `string` | — | Input id to associate |
| `label` | `string` | — | Label text |
| `tip` | `string` | — | Tooltip copy |
| `className` | `string` | `''` | Extra classes on `<label>` |
| `position` | `TooltipPosition` | `'top'` | Tooltip position |

## License

MIT
npm package: @sarfarajey/web-utils
Description: Browser/SSR utility belt for Astro and React projects: theme management, safe redirects, and environment detection
Author: sarfarajey
Latest version: 1.0.0

# @sarfarajey/web-utils

Browser/SSR utility belt for Astro and React projects. Three focused modules, zero runtime dependencies.

## Install

```bash
npm install @sarfarajey/web-utils
```

---

## Theme Management

Full light/dark/device theme system with localStorage persistence, OS preference detection, and cross-tab sync.

```ts
import {
  applyThemeMode,
  getPreferredThemeMode,
  persistThemeMode,
  subscribeToSystemThemeChanges,
  subscribeToThemeStorage,
} from '@sarfarajey/web-utils';

// Read and apply the stored (or document-embedded) theme on load
const mode = getPreferredThemeMode();   // 'light' | 'dark' | 'device'
applyThemeMode(mode);                   // sets data-theme-mode, .dark class, color-scheme

// Persist a user selection
function onThemeChange(selected: 'light' | 'dark' | 'device') {
  persistThemeMode(selected);
  applyThemeMode(selected);
}

// React to OS preference changes when mode === 'device'
const unsubOS = subscribeToSystemThemeChanges(() => applyThemeMode(getPreferredThemeMode()));

// Sync across tabs
const unsubStorage = subscribeToThemeStorage((mode) => applyThemeMode(mode));
```

**DOM side-effects of `applyThemeMode(mode)`:**

| Attribute / property | Value |
|----------------------|-------|
| `html[data-theme-mode]` | `'light'` \| `'dark'` \| `'device'` |
| `html[data-theme-resolved]` | `'light'` \| `'dark'` |
| `html.classList` | `'dark'` class added/removed |
| `html.style.colorScheme` | `'light'` \| `'dark'` |

---

## Safe Redirect Sanitization

Prevent XSS and open-redirect attacks when sending users to a post-login destination.

```ts
import { sanitizeRedirectPath, getPostAuthRedirect } from '@sarfarajey/web-utils';

// On a sign-in page: ?redirect=/dashboard/
const destination = getPostAuthRedirect(window.location.search, '/home/');
// Validates the path, blocks external URLs, // prefixes, backslash bypasses, and /auth/* loops.

// Or validate raw values directly:
sanitizeRedirectPath('/dashboard/')          // → '/dashboard/'
sanitizeRedirectPath('https://evil.com')    // → null
sanitizeRedirectPath('//evil.com')          // → null
sanitizeRedirectPath('/auth/reset')         // → null  (auth prefix blocked)
```

---

## Environment Detection

Distinguish `'development'` / `'preview'` / `'production'` from hostname — works in browser and SSR.

```ts
import { configureEnv, getEnvironment, isCurrentEnv } from '@sarfarajey/web-utils';

// Call once at app bootstrap
configureEnv({
  productionHosts: ['example.com', 'www.example.com'],
  previewHosts: ['preview.example.com'],
});

getEnvironment(); // 'development' | 'preview' | 'production'

// Guard records that belong to a specific environment
isCurrentEnv(record.environment); // true when record.environment matches current env
```

`localhost` and `127.0.0.1` are always `'development'`. Cloudflare Pages `*.pages.dev` aliases are always `'preview'`.

## License

MIT
npm package: @sargamdesign/colors
Description: Colors for designing warm welcoming, caring sites & apps.
Author: @planetabhi
Latest version: 3.1.0

# Sargam Colors
Colors for designing warm welcoming, caring sites & apps.

## Install

```bash
npm i @sargamdesign/colors -D
```

## Usage

```scss
// Place this at the top of your SCSS/CSS file
@import "@sargamdesign/colors";
```

```html
<!-- Add this attribute to the HTML wrapper -->
<html color-scheme="light">
```
npm package: @sargamdesign/icons-react
Description: A collection of open-source icons crafted to match your exquisite designs.
Author: @planetabhi
Latest version: 1.6.7

# Sargam Icons for React

A collection of open-source icons crafted to match your exquisite designs.

Part of [sargamicons.com](https://sargamicons.com/) ♪♪♪ ヽ(ˇ∀ˇ )ゞ

## Features

- **Tree-shakeable**: Modular imports ensure you only bundle what you use.
- **TypeScript**: Full type definitions included.
- **Accessibility**: Built-in support for titles and ARIA attributes.
- **Optimization**: Wrapped in `React.memo` for performance.
- **Theming**: Uses `currentColor` for easy CSS styling.

## Installation

```bash
npm install @sargamdesign/icons-react
# or
yarn add @sargamdesign/icons-react
# or
bun add @sargamdesign/icons-react
```

## Usage

Import icons from their specific style paths (preferred) or the main package.

**Note**: All icon components are prefixed with `Si` (e.g., `SiStar`, `SiHome`).

### Style Imports (Recommended)

```jsx
import { SiStar } from '@sargamdesign/icons-react/line';
import { SiHeart } from '@sargamdesign/icons-react/duotone';
import { SiHome } from '@sargamdesign/icons-react/fill';

function App() {
  return (
    <div style={{ fontSize: '24px', color: '#555' }}>
      <SiStar />
      <SiHeart />
      <SiHome />
    </div>
  );
}
```

### Namespace Imports

```jsx
import * as Icons from '@sargamdesign/icons-react';

function App() {
  return <Icons.Line.SiStar />;
}
```

## Customization

Icons inherit `fontSize` and `color` (via `currentColor`) from their parent. You can also pass props directly.

```jsx
// Inherit styles (2em red icon)
<div style={{ fontSize: '2em', color: 'red' }}>
  <SiStar />
</div>

// Direct props
<SiStar 
  width={32} 
  height={32}
  color="#3b82f6"
  className="my-icon" 
  style={{ margin: '8px' }}
/>
```

## Accessibility

- **Semantic**: Add a `title` prop. The icon will render a `<title>` tag and use `aria-labelledby`.
  ```jsx
  <SiStar title="Add to favorites" />
  ```
- **Decorative**: Omit the `title`. The icon will have `aria-hidden="true"`.
  ```jsx
  <SiStar /> 
  ```

## TypeScript

All components are fully typed with `IconProps`.

```typescript
import { SiStar, IconProps } from '@sargamdesign/icons-react/line';

const MyButton = ({ icon: Icon }: { icon: React.FC<IconProps> }) => (
  <button><Icon /></button>
);
```

### Ref Forwarding

Access the underlying SVG element using standard refs.

```jsx
const iconRef = useRef<SVGSVGElement>(null);
return <SiStar ref={iconRef} />;
```

## Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `title` | `string` | - | Accessible title. If omitted, icon is hidden from screen readers. |
| `width` | `number \| string` | `1em` | Icon width. |
| `height` | `number \| string` | `1em` | Icon height. |
| `color` | `string` | `currentColor` | Icon fill/stroke color. |
| `...props`| `SVGProps` | - | All standard SVG attributes (onClick, style, etc.) |