open-index/open-npm huggingface dataset:
npm package: @gikdev/tx
Description: Helps you do tasks in tmplx projects...
Author: gikdev
Latest version: 0.2.1-beta

# tx

> This readme is automatically generated by [create-pastel-app](https://github.com/vadimdemedes/create-pastel-app)

## Install

```bash
$ npm install --global tx
```

## CLI

```
$ tx --help

  Usage
    $ tx

  Options
    --name  Your name

  Examples
    $ tx --name=Jane
    Hello, Jane
```
npm package: @gikiapp/react-native-calendar-heatmap
Description: Github like Calendar Heatmap
Author: [Kuray
Latest version: 0.2.4

## React-native Calendar Heatmap

<img alt="React Native Calendar Heatmap" src="assets/logo.png" width="1050"/>

[![A calendar heatmap component built on SVG. The component expands to size of container and is super configurable.](https://img.shields.io/badge/-A%20calendar%20heatmap%20component%20built%20on%20SVG.%20The%20component%20expands%20to%20size%20of%20container%20and%20is%20super%20configurable.-lightgrey?style=for-the-badge)](https://github.com/ayooby/react-native-calendar-heatmap)

[![npm version](https://img.shields.io/npm/v/react-native-calendar-heatmap.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-calendar-heatmap)
[![npm](https://img.shields.io/npm/dt/react-native-calendar-heatmap.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-calendar-heatmap)
![Platform - Android and iOS](https://img.shields.io/badge/platform-Android%20%7C%20iOS-blue.svg?style=for-the-badge)
[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=for-the-badge)](https://opensource.org/licenses/MIT)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=for-the-badge)](https://github.com/prettier/prettier)

<p align="center">
  <img alt="React Native Calendar Heatmap" src="assets/Screenshots/example.png" width="49.7%"/>
</p>
</br>
<p align="center">
  <img alt="React Native Calendar Heatmap" src="assets/Screenshots/example-old.png" width="49.7%" />
</p>

## Installation

Add the dependency:

### React Native:

```ruby
npm i react-native-calendar-heatmap
```

## Peer Dependencies

###### IMPORTANT! You need install them.

```
"react": ">= 16.x.x",
"react-native": ">= 0.55.x",
"lodash": ">= 4.17.10",
"react-native-svg": ">= 6.5.2"
```

## Usage


Import the component:

```javascript
import CalendarHeatmap from 'react-native-calendar-heatmap';
```

To show a basic heatmap of 100 days ending on April 1st:

```js
<CalendarHeatmap
  endDate={new Date('2016-04-01')}
  numDays={100}
  values={[
    { date: '2016-01-01' },
    { date: '2016-01-22' },
    { date: '2016-01-30' },
    // ...and so on
  ]}
/>
```

## Custom Colorized Usage

You can check the example for the advanced usage

```js
<CalendarHeatmap
  endDate={new Date("2019-03-25")}
  numDays={100}
  colorArray={["#eee", "#D44B79", "#6B1928", "#9F3251", "#360000"]}
  values={[
    { date: '2016-01-01' },
    { date: '2016-01-22' },
    { date: '2016-01-30' },
    // ...and so on
  ]}
/>
```

## Credits

It inspired by Github's commit calendar graph and [React Calendar Heatmap](https://github.com/patientslikeme/react-calendar-heatmap).

## License

React Native Calendar Heatmap Library is available under the MIT license. See the LICENSE file for more info.
npm package: @gikiapp/react-native-contribution-calendar
Description: Github like Calendar Heatmap
Author: [Kuray
Latest version: 0.2.5

## React-native Calendar Heatmap

<img alt="React Native Calendar Heatmap" src="assets/logo.png" width="1050"/>

[![A calendar heatmap component built on SVG. The component expands to size of container and is super configurable.](https://img.shields.io/badge/-A%20calendar%20heatmap%20component%20built%20on%20SVG.%20The%20component%20expands%20to%20size%20of%20container%20and%20is%20super%20configurable.-lightgrey?style=for-the-badge)](https://github.com/ayooby/react-native-calendar-heatmap)

[![npm version](https://img.shields.io/npm/v/react-native-calendar-heatmap.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-calendar-heatmap)
[![npm](https://img.shields.io/npm/dt/react-native-calendar-heatmap.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-calendar-heatmap)
![Platform - Android and iOS](https://img.shields.io/badge/platform-Android%20%7C%20iOS-blue.svg?style=for-the-badge)
[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=for-the-badge)](https://opensource.org/licenses/MIT)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=for-the-badge)](https://github.com/prettier/prettier)

<p align="center">
  <img alt="React Native Calendar Heatmap" src="assets/Screenshots/example.png" width="49.7%"/>
</p>
</br>
<p align="center">
  <img alt="React Native Calendar Heatmap" src="assets/Screenshots/example-old.png" width="49.7%" />
</p>

## Installation

Add the dependency:

### React Native:

```ruby
npm i react-native-calendar-heatmap
```

## Peer Dependencies

###### IMPORTANT! You need install them.

```
"react": ">= 16.x.x",
"react-native": ">= 0.55.x",
"lodash": ">= 4.17.10",
"react-native-svg": ">= 6.5.2"
```

## Usage


Import the component:

```javascript
import CalendarHeatmap from 'react-native-calendar-heatmap';
```

To show a basic heatmap of 100 days ending on April 1st:

```js
<CalendarHeatmap
  endDate={new Date('2016-04-01')}
  numDays={100}
  values={[
    { date: '2016-01-01' },
    { date: '2016-01-22' },
    { date: '2016-01-30' },
    // ...and so on
  ]}
/>
```

## Custom Colorized Usage

You can check the example for the advanced usage

```js
<CalendarHeatmap
  endDate={new Date("2019-03-25")}
  numDays={100}
  colorArray={["#eee", "#D44B79", "#6B1928", "#9F3251", "#360000"]}
  values={[
    { date: '2016-01-01' },
    { date: '2016-01-22' },
    { date: '2016-01-30' },
    // ...and so on
  ]}
/>
```

## Credits

It inspired by Github's commit calendar graph and [React Calendar Heatmap](https://github.com/patientslikeme/react-calendar-heatmap).

## License

React Native Calendar Heatmap Library is available under the MIT license. See the LICENSE file for more info.
npm package: @giladappsforce/react-modal-provider
Description: Modal provider for react
Author: giladvarsano
Latest version: 1.0.8

![Logo](https://media.licdn.com/dms/image/D4D1BAQEZz57ySlKcrg/company-background_10000/0/1660384837380?e=1686751200&v=beta&t=0o9IytvL41a2Bo0AdnHXCJhmx0at95aqGInjWhxuHnc)

# React modal provider

This package is used to simplify the use of modals across your app

## Installation

Install react modal provider with npm

```bash
npm install @giladappsforce/react-modal-provider
```

or yarn

```bash
yarn add @giladappsforce/react-modal-provider
```

## Usage/Examples

```javascript
// modalProvider.tsx
import { createModalProvider } from "@giladappsforce/react-modal-provider";
import { ConfirmModal, InfoModal } from "./modals";

export const modals = {
  confirm: ConfirmModal,
  info: InfoModal,
  // rest of modals
};

export const { useModal, ModalProvider } = createModalProvider(modals);
```

```javascript
// main.tsx / app.tsx
import ReactDOM from 'react-dom/client';
import {ModalProvider} from '../modalProvider';
import App from '../App';

ReactDOM.createRoot(document.getElementById('root') as HTMKElement).render(
    <ModalProvider>
        <App />
    </ModalProvider>
)
```

```javascript
// ConfirmModal.tsx

// This example uses MUI Dialog

import { Button, Dialog, DialogActions, DialogTitle } from "@mui/material";
import { BaseModalProps } from "@giladappsforce/react-modal-provider/src/types";

interface Props extends BaseModalProps {
  onConfirm: () => void;
  title?: string;
  confirmText?: string;
  cancelText?: string;
}

export const ConfirmModal = ({
  open,
  onClose,
  onConfirm,
  title,
  confirmText,
  cancelText,
}: Props) => {
  const handleConfirm = () => {
    onConfirm();
    onClose?.();
  };

  return (
    <Dialog open={open || false} onClose={onClose}>
      <DialogTitle>{title || "Are you sure?"}</DialogTitle>
      <DialogActions>
        <Button onClick={onClose}>{cancelText || "Cancel"}</Button>
        <Button onClick={handleConfirm}>{confirmText || "Confirm"}</Button>
      </DialogActions>
    </Dialog>
  );
};
```

```javascript
// In component
import { useModal } from "@giladappsforce/react-modal-provider/src";

interface Props {}

export const MyComponent = (props: Props) => {
  const { openModal } = useModal();
  return (
    <div>
      <h1>Example component</h1>
    </div>
  );
};
```

## Authors

- [gilad varsano](https://github.com/giladappsforce)
- [shalve sharabi](https://www.linkedin.com/in/shalev-sharabi-163988187/?originalSubdomain=il)

## License

[MIT](https://choosealicense.com/licenses/mit/)
npm package: @giladgray/node-sass-import
Description: Allows usage of @include (of .scss) akin to require (of .js) in node.js
Latest version: 1.2.0

# node-sass-import 

[![npm][npm-image]][npm-url] [![Build Status][travis-image]][travis-url]  [![Coverage Status][coveralls-image]][coveralls-url] [![js-standard-style][standard-image]][standard-url]

Allows usage of `@import "some-sass-npm-module"` akin to `require("some-npm-module")` in node.js

## Install

```sh
$ npm install --save node-sass-import
```

## Usage

Used in conjunction with node-sass. In a simple npm-only build setup, the example below in package.json should suffice.

```json
{
  "name": "your-package",
  "description": "fun package",
  "main": "index.js",
  "scripts": {
    "build-css": "node-sass test.scss dist/test.css --importer node_modules/node-sass-import"
  }
}

```
You can now build your scss files as follows

```sh
$ npm run build-css
```

## Example

@import in sass can now be used just like a require statement. The example below imports the main scss file from the newsapps-syles npm module. At build time, all @import statements will be resolved locally or like npm modules. Also includes support for partial (e.g. _partial.scss).

```scss
@import "newsapps-styles";

.some-style {
  color: $primary-blue;
}
```

## API

Coming soon...

## License

2016 MIT © [Emmanuel (Manny) Narh]()

[travis-image]: https://travis-ci.org/anarh/node-sass-import.svg?branch=master
[travis-url]: https://travis-ci.org/anarh/node-sass-import
[npm-image]: https://img.shields.io/npm/v/node-sass-import.svg?style=flat
[npm-url]: https://npmjs.org/package/node-sass-import
[standard-image]: https://img.shields.io/badge/code%20style-standard-brightgreen.svg?style=flat
[standard-url]: http://standardjs.com/
[coveralls-image]: https://coveralls.io/repos/anarh/node-sass-import/badge.svg?branch=master&service=github
[coveralls-url]: https://coveralls.io/r/anarh/node-sass-import
npm package: @giladno/acme
Description: A simple ACME client for Node.js
Author: Gilad Novik
Latest version: 1.0.3

# ACME

A simple ACME client for Node.js

## Installation

```
$ npm install @giladno/acme --save
```

## Usage

```js
const ACME = require('@giladno/acme');

let account;
const client = new ACME(ACME.letsencrypt.staging, account);

account = await client.createAccount({email: 'email@domain.com'}); // you might want to persist account

app.use(client.middleware()); // for expressjs based apps

const {privateKey, cert, chain} = await client.register({domain: ['domain.com']});
```

## TODO

-   [ ] Add method to update account key
-   [ ] Finish documentation
-   [ ] Add tests

## Contributing

PR's are more than welcome! You can also drop me a line at gilad@novik.ca

## License

MIT
npm package: @giladno/dynamodb
Description: Simple DynamoDB wrapper for Node.js
Author: Gilad Novik
Latest version: 1.0.2

# dynamodb

Simple DynamoDB wrapper for Node.js

> Note: This is still under active development

## Installation

Requires Node.js 8.6.0+.

```
$ npm install @giladno/dynamodb --save
```

## Usage

```js
const dynamodb = require('@giladno/dynamodb');
const {User} = dynamodb();

User.define({
    attributes: {username: {type: 'S'}},
    throughput: 5,
});

await User.put({username: 'bob', age: 42});
await User.put({username: 'alice', age: 38});

console.log(await User.scan());
```

## API

#### dynamodb([options])

Creates a database instance

-   `options`
    -   `AWS` AWS sdk to use. Defaults to `require('aws-sdk')`.
    -   `waitForActive` How long to wait for an `ACTIVE` state when creating a new table. Defaults to `180000` (3 minutes). Use `0` to disable waiting and `-1` to wait indefinitely.
-   returns: a database instance

#### database

The database instance will automatically create a table instance simply by accessing it:

```js
db.User.get(...);
db.Post.put(...);
```

> Names are case-sensitive. `db.user` and `db.User` will create **different** table names!

#### table.define(schema)

Defines a schema for that table

-   `schema`
    -   `attributes` An object representing attributes/keys for table creation
        -   `type` DynamoDB type (`S`, `N`, `B`)
        -   `range` Set to `true` for `RANGE` key type (default to `HASH` type)
    -   `throughput` Provisioned throughput. Can use a single number for both read/write capacity or an object with `read`/`write` keys. When `throughput` is not defined, this will set billing mode to `PAY_PER_REQUEST`.
        > `PAY_PER_REQUEST` is not supported when testing locally using **dynamodb-local**
    -   `kms` Optional KMS master key to use.

> This method is only required if you want to allow the database to create tables implicitly when required. It is not required if you create them yourself (using the CLI/CloudFormation or by calling `table.init`).

#### table.init(schema)

Creates a table in DynamoDB

-   `schema` Same as [table.define](#table.define)

> This method will be called automatically when trying to access a table which does not exist.

#### table.scan()

Returns all items in the table

#### table.get(key, [options])

Finds a single item by key

#### table.put(data, [options])

Create/update a single item

#### table.update(key, data, [options])

Updates a single item

#### table.delete(data, [options])

Deletes a single item

#### table.destroy([options])

Deletes the table

## TODO

-   [ ] Finish documentation
-   [ ] Add query/filter/projection support

## Contributing

PR's are more than welcome! You can also drop me a line at gilad@novik.ca

## License

MIT
npm package: @gilak/background-candy
Description: A reusable background component with animated effects
Author: Gilak
Latest version: 1.0.0

# @gilak/background-candy

A reusable background component with animated effects for React applications.

## Installation

```bash
npm install @gilak/background-candy
```

## Usage

```tsx
import { BackgroundCandy } from '@gilak/background-candy';
import '@gilak/background-candy/style';

function App() {
  return (
    <div style={{ width: '100vw', height: '100vh' }}>
      <BackgroundCandy />
    </div>
  );
}
```

## Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `className` | `string` | - | Additional CSS class name |
| `style` | `React.CSSProperties` | - | Additional inline styles |

## Features

- Animated background effects
- Responsive design
- Customizable styling
- TypeScript support

## License

MIT
npm package: @gilak/dimension-arrow
Description: A reusable React component for displaying dimension line arrows
Author: Gilak
Latest version: 1.0.0

# @gilak/dimension-arrow

A reusable React component for displaying dimension line arrows.

## Installation

```bash
npm install @gilak/dimension-arrow
```

## Usage

```tsx
import { Dimension } from '@gilak/dimension-arrow';
import '@gilak/dimension-arrow/style';

function App() {
  return (
    <div style={{ width: '500px', height: '300px', position: 'relative' }}>
      <Dimension dimension="w" />
      <Dimension dimension="h" />
    </div>
  );
}
```

## Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `dimension` | `"w" \| "h"` | - | Dimension type (width or height) |
| `children` | `React.ReactNode` | - | Content to render inside the arrow |
| `arrowColor` | `string` | `"#dcdcdc"` | Color of the arrow |
| `textColor` | `string` | `"#333333"` | Color of the text |
| `className` | `string` | - | Additional CSS class name |
| `style` | `React.CSSProperties` | - | Additional inline styles |
| `valueClassName` | `string` | - | CSS class for the value display |
| `debounceMs` | `number` | `16` | Debounce time for dimension updates |
| `observeParents` | `boolean` | `true` | Whether to observe parent elements |
| `position` | `"relative" \| "absolute"` | `"absolute"` | Positioning mode |
| `size` | `number` | `40` | Size of the arrow |

## Features

- Automatic dimension measurement
- Responsive arrows
- Customizable styling
- TypeScript support
- Accessibility features

## License

MIT
npm package: @gilak/utils
Description: A collection of utility functions for React applications
Author: Gilak
Latest version: 1.0.0

# @gilak/utils

A collection of utility functions for React applications.

## Installation

```bash
npm install @gilak/utils
```

## Usage

```tsx
import { getContrastColor, debounce, throttle } from '@gilak/utils';

// Get contrasting color for text
const textColor = getContrastColor('#ff0000');

// Create debounced function
const debouncedSearch = debounce((query) => {
  // Search logic
}, 300);

// Create throttled function
const throttledScroll = throttle((event) => {
  // Scroll logic
}, 16);
```

## Available Utilities

### Color Utilities
- `getContrastColor(color: string): string` - Get contrasting color for text

### Timing Utilities
- `debounce(func: Function, wait: number, options?: DebounceOptions): Function`
- `throttle(func: Function, wait: number, options?: ThrottleOptions): Function`
- `throttleEvent(func: Function, wait: number, options?: ThrottleOptions): Function`

### DOM Utilities
- `createResizeObserver(callback: ResizeObserverCallback): ResizeObserver`
- `getDimensionValue(value: string | number): number`
- `getParentElements(element: Element): Element[]`

### Accessibility Utilities
- `generateId(prefix?: string): string`
- `announceToScreenReader(message: string): void`

### Breakpoint Utilities
- `calculateSize(baseSize: number, breakpoint: string): number`
- `getBreakpointsFromCSS(): BreakpointInfo[]`
- `getCurrentBreakpointInfo(): BreakpointInfo`

## Features

- TypeScript support
- Tree-shakable exports
- Comprehensive utilities
- Performance optimized

## License

MIT
npm package: @gilangjavier/agent-taskfile
Description: Validate and normalize AI agent task files (JSON/YAML) with deterministic lint rules.
Author: Gilang Javier
Latest version: 0.1.0

# @gilangjavier/agent-taskfile

Validate and normalize AI agent task files (JSON/YAML) with deterministic lint rules.

## Why
Agent task files are often hand-written and drift into footguns: missing timeouts, duplicate step ids, dangerous shell snippets, and hardcoded secrets. `agent-taskfile` gives a small, deterministic validator + normalizer usable by both AI agents and humans.

---

## 1) For AI agents (copy-paste friendly)

### Install (ephemeral)
```bash
npm i -D @gilangjavier/agent-taskfile
```

### Validate with deterministic machine-readable output
```bash
npx agent-taskfile validate ./task.yaml --strict --format json
```

Expected behavior:
- Exit code `0` => no errors/warnings in strict mode.
- Exit code `1` => at least one error or warning.
- JSON output contains: `valid`, `summary`, `issueCount`, `issues[]`.

### Normalize then validate again
```bash
npx agent-taskfile normalize ./task.yaml --write
npx agent-taskfile validate ./task.yaml --strict --format json
```

---

## 2) For humans

### Install
```bash
npm i -g @gilangjavier/agent-taskfile
```

### Usage
```bash
agent-taskfile validate ./task.yaml
agent-taskfile normalize ./task.yaml --write
```

### Commands
```text
agent-taskfile validate <file> [--strict] [--format text|json]
agent-taskfile normalize <file> [--write] [--format json|yaml]
```

### Example task file
```yaml
title: Release prep
goal: Validate and run release checks safely
deterministic: true
env:
  GITHUB_TOKEN:
    fromEnv: GITHUB_TOKEN
steps:
  - id: test
    run: npm test
    timeoutSec: 600
  - uses: npm/publish
    with:
      tag: next
```

---

## Lint rules included (MVP)
- Required fields: `title`, `goal`, non-empty `steps`.
- Step action rules: exactly one of `run` or `uses`.
- Duplicate `steps[].id` detection.
- Missing `timeoutSec` warning (normalize defaults to `300`).
- Dangerous command heuristic warnings.
- Hardcoded secret heuristic warnings in `env` values.
- Non-deterministic command warnings when `deterministic` is true.

## Library usage
```ts
import { validateTask, normalizeTask } from "@gilangjavier/agent-taskfile";

const result = validateTask(taskObject, { strict: true });
if (!result.valid) {
  console.error(result.issues);
}

const normalized = normalizeTask(result.task!);
```

## Development
```bash
npm ci
npm run typecheck
npm test
npm run build
```

## License
MIT
npm package: @gilangjavier/lockscript-guard
Description: Detect newly introduced npm lifecycle scripts across lockfile changes.
Author: Gilang Javier
Latest version: 0.1.0

# lockscript-guard

Detect newly introduced npm lifecycle scripts (`preinstall`, `install`, `postinstall`, `prepare`) when dependencies change.

`lockscript-guard` helps teams review lockfile-heavy pull requests by surfacing script changes that can execute during install.

## Why this exists

Dependency updates can silently introduce install-time code. Reviewing this manually in large `package-lock.json` diffs is painful and error-prone.

`lockscript-guard` turns that diff into a focused report.

## Install

```bash
npm i -D @gilangjavier/lockscript-guard
```

Or run without installing:

```bash
npx @gilangjavier/lockscript-guard scan
```

## CLI usage

```bash
lockscript scan [--lockfile package-lock.json] [--format text|json] [--fail-on-risk medium|high]

lockscript diff --base <git-ref> [--head <git-ref>] \
  [--lockfile package-lock.json] \
  [--format text|json] \
  [--fail-on-change] \
  [--fail-on-risk medium|high]
```

### Example: fail CI if new lifecycle scripts appear

```bash
lockscript diff --base origin/main --fail-on-change
```

### Example: fail CI on medium/high risk scripts

```bash
lockscript diff --base origin/main --fail-on-risk medium
```

## Library API

```ts
import {
  parseLockfile,
  collectLifecycleScripts,
  diffLifecycleScripts,
} from "@gilangjavier/lockscript-guard";

const base = collectLifecycleScripts(parseLockfile(baseLockfileText));
const head = collectLifecycleScripts(parseLockfile(headLockfileText));
const issues = diffLifecycleScripts(base, head);
```

## For AI agents

- Use `lockscript diff --base <trusted-ref> --format json`.
- If `count > 0`, inspect `issues[]` and include only changed packages in your report.
- For strict gates, run with `--fail-on-change` or `--fail-on-risk medium`.

Example:

```bash
lockscript diff --base origin/main --format json --fail-on-risk medium
```

## For humans

- Run this in dependency-update PRs (Renovate/Dependabot or manual updates).
- Prefer `diff` over `scan` in CI, because it focuses on *newly introduced* behavior.
- If a package is flagged, review the script command and changelog before merging.

Example:

```bash
lockscript diff --base origin/main
```

## GitHub Actions example

```yaml
- name: Detect new lifecycle scripts
  run: npx @gilangjavier/lockscript-guard diff --base origin/main --fail-on-change
```

## License

MIT
npm package: @gilangjavier/prfa
Description: PR Follow-up Assistant CLI for tracking open/stale pull requests and drafting follow-up messages.
Latest version: 0.1.0

# PR Follow-up Assistant (`prfa`)

A small cross-platform Node.js CLI to scan your open GitHub PRs, highlight stale ones, and generate follow-up message templates.

## Features

- Scan open PRs authored by a GitHub user
- Detect stale PRs by inactivity threshold (`--days`)
- Output markdown summary for easy posting into issues/chats/notes
- Generate follow-up templates for stale PRs

## Requirements

- Node.js 18+
- GitHub CLI (`gh`) installed and authenticated (`gh auth status`)

## Install

Global install:

```bash
npm i -g @gilangjavier/prfa
```

Or run without installing:

```bash
npx @gilangjavier/prfa scan --user gilangjavier --days 7
```

## Usage

```bash
prfa scan --user gilangjavier --days 7
```

(If you used npx, replace `prfa` with `npx @gilangjavier/prfa`.)

Or via npm script (for contributors):

```bash
npm run scan -- --user gilangjavier --days 7
```

## Example Output

```markdown
# PR Follow-up Summary for @gilangjavier

Generated: 2026-03-17T03:43:00.000Z
Stale threshold: 7 days

## Open PRs (2)
- [owner/repo#12](https://github.com/owner/repo/pull/12) — feat: improve parser _(inactive 2d)_

## Stale PRs (1)
- [owner/repo#11](https://github.com/owner/repo/pull/11) — fix: flaky tests _(inactive 10d)_

## Suggested follow-up templates
### owner/repo#11
Hi maintainers, friendly follow-up on this PR 👋

- Is there anything I should adjust to move this forward?
- Happy to update tests/docs if needed.

Thanks for your time!
```

## Development

```bash
npm test
```

## Release readiness

Dry-run package publish:

```bash
npm publish --dry-run
```

> Publishing to npm is not done automatically. You need `npm login` and publish rights.

## License

MIT
npm package: @gilbarbara/components
Description: A collection of imperfect React components
Author: Gil Barbara
Latest version: 0.15.5

<p align="center">
  <a href="https://components.gilbarbara.dev">
      <img src="https://files.gilbarbara.dev/logos/components-icon.svg" alt="@gilbarbara/components" height="240" width="256" />
  </a>
  <h1 align="center">@gilbarbara/components</h1>
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@gilbarbara/components" target="_blank">
    <img alt="NPM" src="https://badge.fury.io/js/%40gilbarbara%2Fcomponents.svg" />
  </a>
  <a href="https://github.com/gilbarbara/components/actions/workflows/main.yml" target="_blank">
    <img alt="CI" src="https://github.com/gilbarbara/components/actions/workflows/main.yml/badge.svg" />
  </a>
  <a href="https://sonarcloud.io/summary/new_code?id=gilbarbara_components" target="_blank">
    <img alt="Quality Gate Status" src="https://sonarcloud.io/api/project_badges/measure?project=gilbarbara_components&metric=alert_status" />
  </a>
</p>

A library of composable React components to simplify web application development. Use it to create complex user interfaces while following accessibility best practices.

## Documentation

Go to https://components.gilbarbara.dev  
Demo: https://codesandbox.io/p/sandbox/gilbarbara-components-2j37hj

## Installation

```shell
npm i @gilbarbara/components @emotion/react @emotion/styled
```

### Usage

```tsx
import { Button } from '@gilbarbara/components';

function App() {
  return <Button>Hello</Button>
}
```

> You can access the props for all components under the namespace `Props`.

### License

MIT
npm package: @gilbarbara/deep-equal
Description: Tiny deep equal comparator
Author: Gil Barbara
Latest version: 0.4.1

# @gilbarbara/deep-equal

[![npm version](https://badge.fury.io/js/%40gilbarbara%2Fdeep-equal.svg)](https://badge.fury.io/js/%40gilbarbara%2Fdeep-equal) [![CI](https://github.com/gilbarbara/deep-equal/actions/workflows/main.yml/badge.svg)](https://github.com/gilbarbara/deep-equal/actions/workflows/main.yml) [![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=gilbarbara_deep-equal&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=gilbarbara_deep-equal)

Lightweight deep equal comparator.

## Features
- Written in TypeScript
- ESM ready
- Works with Map, Set, and Typed Arrays
- Works with React component (avoid circular references)

## Usage

```shell
npm i @gilbarbara/deep-equal
```

```typescript
import equal from '@gilbarbara/deep-equal';

equal({ a: 1 }, { a: 1 }); // true

```

## Credits

Inspired by [fast-deep-equal](https://github.com/epoberezkin/fast-deep-equal) package. Thanks! ❤️

## License

MIT
npm package: @gilbarbara/esbuilder
Description: Opinionated wrapper for esbuild
Author: Gil Barbara
Latest version: 0.2.0

# @gilbarbara/esbuilder

[![npm version](https://badge.fury.io/js/@gilbarbara%2Fesbuilder.svg)](https://badge.fury.io/js/@gilbarbara%2Fesbuilder) [![CI](https://github.com/gilbarbara/esbuilder/actions/workflows/main.yml/badge.svg)](https://github.com/gilbarbara/esbuilder/actions/workflows/main.yml) [![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=gilbarbara_esbuilder&metric=sqale_rating)](https://sonarcloud.io/summary/new_code?id=gilbarbara_esbuilder) [![Coverage](https://sonarcloud.io/api/project_badges/measure?project=gilbarbara_esbuilder&metric=coverage)](https://sonarcloud.io/summary/new_code?id=gilbarbara_esbuilder)

Opinionated wrapper for esbuild

## Setup

```bash
npm install @gilbarbara/esbuilder
```

## Usage

```bash
esbuilder --cjs --esm
```

## Options

```bash
Targets:
  --cjs            Build CommonJS module
  --esm            Build ESM module

Build Options:
  --input          Input files (default: ./src/index.ts)
  --externals      Add external packages to the bundle
  --noBundle       Skip bundling dependencies
  --noSourcemap    Skip the sourcemap
  --outDirectory   Output directory (default: ./dist)
  --platform       The platform (default: node)
  --target         The target environment (default: node16)
  --watch          Watch for changes (default: false)
```

## Contributing

Contributions, issues and feature requests are welcome!  
Feel free to check [issues page](https://github.com/gilbarbara/esbuilder/issues).

## Show your support

Give a ⭐️ if this project helped you!

## License

Copyright © 2022 [Gil Barbara](https://github.com/gilbarbara).  
This project is [MIT](https://github.com/gilbarbara/esbuilder/blob/main/LICENSE) licensed.
npm package: @gilbarbara/node-helpers
Description: Collection of useful functions for node
Author: Gil Barbara
Latest version: 0.1.0

# Node Helpers

Collection of useful functions for node.

## Usage

```bash
$ npm install @gilbarbara/node-helpers
```

## API

**replaceContent(options: ReplaceContentOptions): Promise<string[]>**  
Replace content in files.

<details>
  <summary>Type Definition</summary>

  ```typescript
type ReplaceActionResult = string | false | undefined;

interface ReplaceContentOptions {
  callback(content: string): Promise<ReplaceActionResult> | ReplaceActionResult;
  directory?: string;
  globOptions?: fg.Options;
  name?: string;
  pattern: fg.Pattern | fg.Pattern[];
  silent?: boolean;
}
  ```
</details>

<details>
  <summary>Example</summary>

  ```typescript
async function fixCjsDts() {
  const results = await replaceContent({
      directory: 'dist',
      name: 'fix-cjs-dts',
      pattern: '**/*.d.ts',
      callback: content => {
        const { exp, named } =
          /(?<exp>export (?<named>.+) from 'some-packages';)/u.exec(content)?.groups ?? {};
        const { exportDefault } =
          /(?<exportDefault>export \{ somePackage as default \};)/u.exec(content)?.groups ?? {};
        
        if (exp && named) {
        	const statement = `declare namespace SomePackage {
  export ${named.replace('default as somePackage', 'somePackage')};

  ${exportDefault}
}

export = SomePackage;`;

          return (
            content
              .replace(`\n${exp}`, '')
              .replace(`\n${exportDefault}`, '') + statement
          );
        }
        
        return false;
      }
  });
  
  // results is an array with the replace files content.
  console.log(result);
}
  ```
</details>
npm package: @gilbarbara/package-starter
Description: [![npm version](https://badge.fury.io/js/%40gilbarbara%2Fpackage-starter.svg)](https://badge.fury.io/js/%40gilbarbara%2Fpackage-starter) [![CI](https://github.com/gilbarbara/package-starter/actions/workflows/ci.yml/badge.svg)](https://github.com/gilbarbar
Author: Gil Barbara
Latest version: 0.4.0

# @gilbarbara/package-starter

[![npm version](https://badge.fury.io/js/%40gilbarbara%2Fpackage-starter.svg)](https://badge.fury.io/js/%40gilbarbara%2Fpackage-starter) [![CI](https://github.com/gilbarbara/package-starter/actions/workflows/ci.yml/badge.svg)](https://github.com/gilbarbara/package-starter/actions/workflows/ci.yml)

Scaffold a new NPM package.

## Highlights

- 🏖  **Easy to use:** Just run the command.
- 💫  **Customizable:** Create a Typescript-only package or a TypeScript + React one.
- 🛠 **Compatible:** Uses **tsup** to generate **esm** and **commonjs** bundles.
- 🚧 **Ready for tests:** Uses **vitest** (with **@testing-library/react** in the **TypeScript + React** option) for testing.
- 🚀 **CI/CD:** Includes a workflow for GitHub Actions.

## Usage

With NPM:

```bash
npx @gilbarbara/package-starter
```

With Yarn:

```bash
yarn dlx @gilbarbara/package-starter
```

With PNPM:

```bash
pnpx @gilbarbara/package-starter
```

With Bun:

```bash
bunx @gilbarbara/package-starter
```


Then follow the prompts!

You can also specify the package name you want to use:

```bash
# npm 7+, extra double-dash is needed:
npx @gilbarbara/package-starter my-package

# yarn
yarn dlx @gilbarbara/package-starter my-package

# pnpm
pnpx @gilbarbara/package-starter my-package

# Bun
bunx @gilbarbara/package-starter my-package
```

Currently supported templates are:

- typescript
- typescript-react

> You can use . for the project name to scaffold in the current directory.

## License

MIT
npm package: @gilbarbara/prettier-config
Description: Shared prettier config
Author: Gil Barbara
Latest version: 1.0.0

# @gilbarbara/prettier-config

[![npm version](https://badge.fury.io/js/%40gilbarbara%2Fprettier-config.svg)](https://badge.fury.io/js/%40gilbarbara%2Fprettier-config)

Shared [Prettier](https://prettier.io) configuration.

## Usage

**Install**:

```sh
$ npm install -D @gilbarbara/prettier-config
```

**Edit `package.json`**:

```jsonc
{
  // ...
  "prettier": "@gilbarbara/prettier-config"
}
```

[Read more on sharing configurations.](https://prettier.io/docs/en/configuration.html#sharing-configurations)

## Philosophy

> By far the biggest reason for adopting Prettier is to stop all the on-going debates over styles.
>
> – [Prettier's Option Philosophy](https://prettier.io/docs/en/option-philosophy.html)

This configuration is intended to provide consistent, automatic formatting throughout a project and pairs well with [eslint-config](https://github.com/gilbarbara/eslint-config).
npm package: @gilbarbara/react-range-slider
Description: A range slider component for React
Author: Gil Barbara
Latest version: 0.7.0

# react-range-slider

[![npm version](https://badge.fury.io/js/%40gilbarbara%2Freact-range-slider.svg)](https://badge.fury.io/js/%40gilbarbara%2Freact-range-slider) [![CI](https://github.com/gilbarbara/react-range-slider/actions/workflows/main.yml/badge.svg)](https://github.com/gilbarbara/react-range-slider/actions/workflows/main.yml) [![Maintainability](https://api.codeclimate.com/v1/badges/cc1a3d9dd8e9731beeaf/maintainability)](https://codeclimate.com/github/gilbarbara/react-range-slider/maintainability) [![Test Coverage](https://api.codeclimate.com/v1/badges/cc1a3d9dd8e9731beeaf/test_coverage)](https://codeclimate.com/github/gilbarbara/react-range-slider/test_coverage)

A range slider component for React

View the [demo](https://codesandbox.io/s/github/gilbarbara/react-range-slider/tree/main/demo)

## Installation

```sh
npm i @gilbarbara/react-range-slider
```

## Usage

```typescript
import React, { useState } from 'react';
import RangeSlider, { RangeSliderPosition, RangeSliderProps } from '@gilbarbara/react-range-slider';

export default function App() {
	const [x, setX] = useState(10);

	const handleChange = (position: RangeSliderPosition, props: RangeSliderProps) => {
		setX(position.x);
	};

	return <RangeSlider axis="x" x={x} onChange={handleChange} />;
}
```

## Props

**axis** {'x' | 'y' | 'xy'} ▶︎`x`  
Type of slider

**x** {number}  
Use with axis `x` or `xy`

**xMin** {number} ▶︎`0`  
Min value of X

**xMax** {number} ▶︎`100`  
Max value of X

**xStep** {number} ▶︎`1`  
Step of X

**y** {number}  
Use with axis `y` or `xy`

**yMin** {number} ▶︎`0`  
Min value of Y

**yMax** {number} ▶︎`100`  
Max value of Y

**yStep** {number} ▶︎`1`  
Step of Y

**onAfterEnd** {function}  
It is called after the slider changed (click or drag)

**onChange** {function}  
It is called for each step

**onDragEnd** {function}  
It is called after dragging the thumb

## Customization

You can customize the UI with a `styles` prop.
Check out [styles.ts](src/styles.ts) for more information.

```jsx
<RangeSlider
  ...
  styles={{
    height: '10px',
    trackBorderRadius: 0,
  }}
/>
```

## License

MIT
npm package: @gilbarbara/tsconfig
Description: Shared Typescript config
Author: Gil Barbara
Latest version: 1.0.0

# tsconfig [![npm version](https://badge.fury.io/js/%40gilbarbara%2Ftsconfig.svg)](https://badge.fury.io/js/%40gilbarbara%2Ftsconfig)

Shared [TypeScript config](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html)

## Install

```
$ npm install --save-dev @gilbarbara/tsconfig
```

## Usage

`tsconfig.json`

```json
{
	"extends": "@gilbarbara/tsconfig",
	"compilerOptions": {
		"outDir": "build",
		"target": "es5"
	}
}
```

## License

MIT
npm package: @gilbarbara/types
Description: Reusable typescript typings
Author: Gil Barbara
Latest version: 0.2.2

# @gilbarbara/types

[![npm version](https://badge.fury.io/js/%40gilbarbara%2Ftypes.svg)](https://badge.fury.io/js/%40gilbarbara%2Ftypes) [![CI](https://github.com/gilbarbara/types/actions/workflows/main.yml/badge.svg)](https://github.com/gilbarbara/types/actions/workflows/main.yml)

Reusable typescript typings.

## Setup

```sh
npm i @gilbarbara/types
```

For convenience, the `type-fest` package is re-exported.

## Types

### Aliases

```typescript
type NumberOrNull = number | null;
type StringOrNull = string | null;
type StringOrNumber = string | number;

type PlainObject<T = unknown> = Record<string, T>;

type GenericFunction<T = unknown> = (...arguments_: any[]) => T;
type VoidFunction = () => void;
```


### Common

```typescript
type AsyncStatus = 'IDLE' | 'PENDING' | 'SUCCESS' | 'ERROR';

interface AsyncFlow {
  message: string;
  status: AsyncStatus;
}

interface AsyncFlowWithCache extends AsyncFlow {
  updatedAt: number;
}

interface AsyncFlowWithData<T = any> extends AsyncFlow {
  data: T;
}

interface AsyncFlowWithDataAndCache<T = any> extends AsyncFlowWithData<T> {
  updatedAt: number;
}

type HttpMethods =
  | 'CONNECT'
  | 'DELETE'
  | 'GET'
  | 'HEAD'
  | 'OPTIONS'
  | 'PATCH'
  | 'POST'
  | 'PUT';

interface IdName {
  id: string;
  name: string;
}

interface LabelValue {
  label: string;
  value: string;
}
```

### Utilities

```typescript
/**
 * Narrow down a Record to a plain object.
 */
type NarrowPlainObject<T extends Record<string, any>> = Exclude<
  T,
  Array<unknown> | Function | Map<unknown, unknown> | Set<unknown>
>;
```

```typescript
/**
 * An object without excluded types.
 */
type RemoveType<TObject, TExclude = undefined> = {
  [Key in keyof TObject as TObject[Key] extends TExclude ? never : Key]: TObject[Key];
};
```

```typescript
/**
 * A strict plain object with a specific set of keys.
 */
type StrictObject<TObject extends Record<PropertyKey, unknown>, TExpected> = TExpected & {
  [Key in keyof TObject]: Key extends keyof TExpected ? TExpected[Key] : never;
};
```
npm package: @gilbert2017/simple-timer
Description: A simple timer to use anytime anywhere!
Author: gilbert2017
Latest version: 0.0.8

#Simple Timer
simple-timer is a basic, easy-to-use timer for your projects.

#Installation

Install your timer via npm

```bash
npm install -g @gilbert2017/simple-timer
```

or you can also call the timer in a script tag:

```bash
<script src="https://cdn.rawgit.com/GilTorch/simple-timer/master/simple-timer-client/js/index_production.js"></script>
```
#Example
After installation, you can then call your timer like so:
```bash
var timer=new Timer();
timer.setMiliseconds(5000);
timer.start();
var ouput=document.getElementById("timer-output");//output can be a paragraph htmlelement
timer.setVue(ouput);
```

#License
[MIT](https://codepen.io/BlessedCamper/full/JOdWEL/)


[npm-image]: https://img.shields.io/npm/v/live-xxx.svg
[npm-url]: https://npmjs.org/package/live-xxx
[travis-image]: https://img.shields.io/travis/live-js/live-xxx/master.svg
[travis-url]: https://travis-ci.org/live-js/live-xxx
[coveralls-image]: https://img.shields.io/coveralls/live-js/live-xxx/master.svg
[coveralls-url]: https://coveralls.io/r/live-js/live-xxx?branch=master
npm package: @gilbertco/config
Description: The purpose of this project is to suggest the use of ENV variables for configuration around a node based application. This way the server always has easy control without having to update configuration files.
Author: Kevin Gilbert
Latest version: 0.1.4

# Node Gilbert Config
```
npm i -S @gilbertco/config
```

## CI Build Status

[![CircleCI](https://circleci.com/gh/gilbertandco/node-gilbert-config.svg?style=svg)](https://circleci.com/gh/gilbertandco/node-gilbert-config)

## Code Style

[![js-standard-style](https://cdn.rawgit.com/feross/standard/master/badge.svg)](http://standardjs.com)

## Basic Example

To load configuration files into process.env for the configuration module to consume a helper function has been provided.

See example use-case.

```javascript
const config = require('@gilbertco/config');

config.load(process.cwd()+'/config');

let configValue = config.get('SOME_CONFIG_VALUE');
```

## get method

```javascript
const config = require('@gilbertco/config');

config.get('NODE_ENV'); // returns String
config.get('NODE_ENV', String); // Returns String

config.get('SOME_NUMBER'); // Returns String
config.get('SOME_NUMBER', Number); // Returns Number

config.get('TRUE_OR_FALSE', Boolean); // Returns Boolean
```

## Configuration Directory

- the get method is optional, thus configuration files/directory is optional
- configuration file to load is determined based on ```NODE_ENV```... default NODE_ENV=development
- supported file extensions are `````(.yaml, .yml, .js, .json)`````
- default.yml/yaml/js/json file will also be loaded if it exists

Configuration Directory Structure
```
├── package.json
├── server.js
├── config
|   ├── production.yml
|   ├── test.yml
|   ├── staging.yml
|   └── development.yml
```

## .env Example

A ```.env``` file will be automatically be loaded from your process current working directory. (usually where your ```package.json``` file is). The contents will be merged into your process.env in your active node process.

**.env files are optional**

.env file contents example
```
SOME_ENV_VARIABLE_1=somevalue1
SOME_ENV_VARIABLE_2=somevalue2
```
npm package: @gilbertco/restify-async-wrap
Description: Wrap Restify ES7 Await functions to maintain Restify default error handling.
Author: Kevin Gilbert
Latest version: 0.1.2

# Node Restify Async Wrap
```
npm i -S @gilbertco/restify-async-wrap
```

The only issue with using ES7 Async functions within Restify is dealing with un-caught exceptions. This can cause the route to hang, the client then timing out without error notification, which can also lead to possible denial of service attacks by blocking the Node.js event loop.

This module is mentioned within the following blog entry: https://blog.gilbertco.xyz/node-js-cleaner-api-routes-with-async-await/

## CI Build Status

[![CircleCI](https://circleci.com/gh/gilbertandco/node-restify-async-wrap.svg?style=svg)](https://circleci.com/gh/gilbertandco/node-restify-async-wrap)

## Basic Example

```javascript
const restifyAsyncWrap = require('@gilbertco/restify-async-wrap');
const restify = require('restify');

const server = restify.createServer();

// Default Restify Error Handling
server.get('/', restifyAsyncWrap(async () => {
  throw new Error('Caught error and used default 500 Restify error handling method.');
}));

// Custom Error Handling
server.get('/test', restifyAsyncWrap(async () => {
  throw new Error('Caught error and returned 404.');
}), customErrorHandler);

function customErrorHandler(request, response, next, error) {
  response.send(404, {error});
  return next();
}
```
npm package: @gildembergleite/eslint-config
Description: ESLint configurations used in my projects.
Author: Gildemberg Leite
Latest version: 1.5.2

## Package @gildembergleite/eslint-config

This package contains ESLint configurations for JavaScript and TypeScript projects with React.js and Next.js. It defines linting rules to help maintain clean and consistent code. Here are the configurations and plugins included in this package:

### ESLint Configurations

The package includes the following configurations:

- Environment:
  - browser: true
  - es2021: true
  - jest: true

- Extended from:
  - 'standard'
  - 'plugin:react/recommended'
  - 'plugin:react-hooks/recommended'
  - 'plugin:prettier/recommended'

- Plugins:
  - 'react'
  - 'jsx-a11y'
  - '@typescript-eslint'
  - '@next/eslint-plugin-next' (for Next.js projects)

### Additional Configurations

The `@gildembergleite/eslint-config` package also includes the following configurations:

- settings.react: { version: 'detect' }
- 'import/parsers':
  - '@typescript-eslint/parser': ['.ts', '.tsx', '.d.ts'],

### Installation and Configuration

To use the `@gildembergleite/eslint-config` package in your project, follow the steps below:

1. Install the package as a dev dependency:
   ```
   npm install --save-dev @gildembergleite/eslint-config
   ```

2. Make sure you have ESLint installed in your project:
   ```
   npm install --save-dev eslint
   ```

3. Create an `.eslintrc.json` file in the root of your project (or update the existing one) and add the following content:

   For Next.js projects:
   ```javascript
   {
     "extends": [
       "@gildembergleite/eslint-config/next",
       "next/core-web-vitals"
     ]
   }
   ```

   For React.js projects:
   ```javascript
   {
     "extends": [
       "@gildembergleite/eslint-config/react"
     ]
   }
   ```

4. You also need to have Prettier installed to leverage the configurations provided by the package. If you don't have Prettier installed yet, run the following command:
   ```
   npm install --save-dev prettier
   ```

5. Great! Now you can run ESLint on your code using the following command:
   ```
   npx eslint .
   ```

   This will run linting on all files in the current directory.

Remember that you can further customize the ESLint configurations as needed to meet the specific requirements of your project.
npm package: @gilg/theme-lint
Description: A linter for Shopify theme localization written in Node
Author: Shopify Inc.
Latest version: 3.0.0

# Theme Lint [![Build status](https://badge.buildkite.com/94fbd194b3af65972b61c68407238f576490b65395cea6219f.svg)](https://buildkite.com/shopify/theme-lint)

A linter for Shopify theme localization written in Node.

## Getting started

Add `theme-lint` as a devDependency to a Shopify theme by running the following command inside of the theme directory:

```bash
$ npm install --save-dev @shopify/theme-lint
```

Add a new NPM script to your theme's `package.json` like so:

```js
"scripts": {
  "lint": "theme-lint ./dist"
}
```

Finally, run `npm run lint` to run the translation tests.

## License

MIT, see [LICENSE.md](http://github.com/Shopify/theme-lint/blob/master/LICENSE.md) for details.

<img src="https://cdn.shopify.com/shopify-marketing_assets/builds/19.0.0/shopify-full-color-black.svg" width="200" />