open-index/open-npm huggingface dataset:
npm package: @sheetxl/scripting-templates
Description: Default scripting templates for the SheetXL script editor
Author: SheetXL Team
Latest version: 0.1.22

# Scripting Templates

![SheetXL](https://www.sheetxl.com/logo-text.svg)

[![License](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
[![Discord](https://img.shields.io/discord/1141404921246257223)](https://discord.gg/NTKdwUgK9p)

## Overview

This repository contains the source templates that appear in the SheetXL script editor's "New Script" wizard.

## Available Templates

Browse the [`templates/`](./templates/) directory to see all available templates:

### 🧮 Built-in Formulas

For additional examples and patterns, check out the **[Built-in Formulas](https://github.com/sheetxl/sheetxl/tree/main/packages/formulas)** - these follow the same TypeScript patterns as templates and showcase advanced formula implementations.

## Additional Resources

- ⭐ **[Main Github](https://github.com/sheetxl)** - Our main github.
- 💬 **[Join our Discord Community](https://discord.gg/NTKdwUgK9p)** - Get help and connect with the team.
- 🌐 **[Website](https://www.sheetxl.com)** - The official website for SheetXL.
- 📘 **[Developer Docs](https://www.sheetxl.com/docs)** - The official guides and tutorials.

## Usage

Templates added to this repo automatically available in the SheetXL script editor. No manual installation required.

## Contributing

Want to add a new template? See our [Contributing Guide](CONTRIBUTING.md) for detailed instructions.

## License

MIT License - see [LICENSE](LICENSE) file for details.
npm package: @shefing/authors-info
Description: Take the guesswork out of tracking **who created, edited, and published content(and when)** across your **collections and globals**—**automatically**.
Author: shefing
Latest version: 1.0.28

## [Author Info plugin](./src/index.ts)

Take the guesswork out of tracking **who created, edited, and published content(and when)** across your **collections and globals**—**automatically**.

https://github.com/user-attachments/assets/3a23a502-2867-41a8-bd35-506f911c8b41

### Usage
🔹 **Seamless Author Tracking** – This plugin **automatically captures and stores** key authoring details, so you always know **who created, modified, and published** each document.  
🔹 **Enhanced Metadata** – While Payload CMS tracks creation and modification dates, it **doesn’t store publication dates**—but this plugin does! Now, you’ll have a clear **record of the most recent publish date** for every entry.  
🔹 **Integrated Author Data** – A new **"Author Data" tab** is added to the authoring interface, providing a centralized place for all user activity related to the document.

With this **fully automated** tracking system, you'll always have complete visibility into **who did what and when**—**without any extra effort**. 

### Install

Install the plugin using your node package manager, e.g:

`pnpm add @shefing/authors-info`

### Setup

In the payload.config.ts add the following:

```typescript
plugins: [
    ...plugins,
    addAuthorsFields({
      excludedCollections: [],//array of collections names to exclude
      excludedGlobals:[], // array of globals names to exclude
      usernameField: 'fullName', //name field to use from Users collection, 'user' by default
    }),
```
npm package: @shefing/color-picker
Description: Payload CMS doesn’t come with a built-in color picker, so we’ve created a **custom color field** that integrates seamlessly with **Tailwind’s dynamic color palette**. Now, you can effortlessly **select colors, enter HEX codes, or search by color names**—a
Author: shefing
Latest version: 1.0.11

## 🎨 [Color Picker Field](./src/index.ts)

Payload CMS doesn’t come with a built-in color picker, so we’ve created a **custom color field** that integrates seamlessly with **Tailwind’s dynamic color palette**. Now, you can effortlessly **select colors, enter HEX codes, or search by color names**—all within the CMS.

🌈 **Tailwind + ShadCN Integration**  
This color picker is powered by **Tailwind’s design system** combined with **ShadCN’s sleek component library**, ensuring a beautiful and consistent user experience.

https://github.com/user-attachments/assets/a8bae019-ac61-4e64-a2b3-221f24324f3a

---

### ⚙️ **Setup Instructions**

1️⃣ **Install the Color Picker** using your preferred package manager:

```bash
pnpm install @shefing/color-picker
```

2️⃣ **Add the Field to Your Collection:**

```typescript
import { createColorField } from '@shefing/color-picker';
import { createBackgroundColorField } from '@shefing/color-picker'
fields: [
  createColorField({
    name: 'color',       // 🏷️ The name of the field
    label: 'Font Color', // 🎯 The label displayed in the UI
  }),
createBackgroundColorField({
      name: 'backgroundColor', // 🏷️ The name of the field.
      label: 'background-color', // 🎯 The label of the field.
    }),
];

```

3️⃣ **Prerequisite:** Ensure **Tailwind CSS** is installed in your project to take full advantage of the dynamic color palette.

---

💡 **Pro Tip:** The colors you select are directly sourced from your **Tailwind configuration**, ensuring consistency with your design system. Say goodbye to mismatched colors and hello to effortless branding!
npm package: @shefing/comments
Description: This plugin allows users to add comments on text within a RichText field using Lexical.
Author: shefing
Latest version: 1.0.1

### Comments Plugin

This plugin allows users to add comments on text within a RichText field using Lexical.

The user can add a comment on selected text to start a discussion about this content:

![img1.png](./images/img1.png)

Comments section is available on the right side of the screen and users can reply or delete comments

![img2.png](./images/img2.png)

In addition, commented text has a mark

when clicking on the mark, it open the comments panel on the right side with focus on the current comment

![img3.png](./images/img3.png)

### Setup

Install the plugin using your node package manager, e.g:

`npm install @shefing/comments`

In the payload.config.ts add the following:

```javascript
CommentsPlugin({
  excludedCollections: ['posts', 'media'], //array of collections names to exclude
  excludedGlobals: ['aboutus'], //array of collections names to exclude
});
```

### Collection Configuration

#### 1. Enable Comments in Your Collection

In the target collection, add this under admin:

```javascript
admin: {
  custom: {
    comments: true,
  },
},
```

#### 2. Configure the Rich Text Field

For the rich text field, add this editor configuration:

```javascript
import { commentFeature } from '@shefing/comments/feature';
fields: [
  {
    name: 'richText',
    label: 'Rich Text',
    type: 'richText',
    editor: lexicalEditor({
      features: ({}) => [FixedToolbarFeature(), commentFeature()],
    }),
  },
];
```
npm package: @shefing/cover-image
Description: Automatically generates cover images for video uploads in specified collections. This feature was written in a linux environment,  before the payload video component (that has a cover image as well) It can extract any frame from the video for the cover im
Author: shefing
Latest version: 1.0.3

# Payload Video Cover Plugin
Automatically generates cover images for video uploads in specified collections.
This feature was written in a linux environment, 
before the payload video component (that has a cover image as well)
It can extract any frame from the video for the cover image (payload component takes the first frame),
and can be used to extract many frame for any purpose. 
This feature was implemented in the flowing way:

## Setup

### 1. Install the Plugin
```bash
npm add @shefing/cover-image

```
### 2. Payload Config (`payload.config.ts`)
```typescript
  plugins: [
    videoCoverPlugin({
      collections: ['media', 'videos'], // Collections to process
      framePosition: 'middle',          // 'start' | 'middle' | number (seconds)
      imageFormat: 'webp',              // 'webp' | 'jpg' | 'png'
    })
  ]
```
or for default values
```typescript
  plugins: [
    videoCoverPlugin({})
  ]
```
---

## Configuration

### 1. Next.js Config (`next.config.mjs`)
```javascript
/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    serverSourceMaps: true,
  },
  serverExternalPackages: [
    "ffmpeg-static",
    "fluent-ffmpeg"
  ],
};

export default withPayload(nextConfig);
```

### 2. Docker Setup (`Dockerfile`)
```Dockerfile

# Copy ffmpeg-static binaries
COPY --from=builder /app/node_modules/ffmpeg-static/ ./node_modules/ffmpeg-static/
```
### 3. Install Dependencies
```bash
 npm install fluent-ffmpeg@2.1.2 ffmpeg-static@5.1.0
```
---

## How It Works

1. **When a video is uploaded** to a configured collection:
    - Extracts a frame at the specified `framePosition`
    - Generates a cover image in the chosen `imageFormat`
    - Stores the image in your `media` collection

2. **Auto-adds fields** to your collections:
   ```typescript
   {
     coverImage: string | Media;  // Reference to the generated image
     thumbnailURL: string;        // Direct URL to the thumbnail
     startPosition: number;       // Actual frame position used
   }
   ```

---
## Features

- 🎥 **Automatic thumbnail generation** for video uploads
- ⚙️ **Configurable frame capture position** (`start`, `middle`, or custom seconds)
- 🖼️ **Multiple image formats** (WebP, JPEG, PNG)
- 🐳 **Docker-ready configuration**
- 🛠️ **Auto-adds required fields** (`coverImage`, `thumbnailURL`, `startPosition`)

---

## Troubleshooting

### Error: "FFmpeg not found"
- **Fix on Ubuntu/Debian**:
  ```bash
  sudo apt-get install ffmpeg
  ```
- **Fix on MacOS**:
  ```bash
  brew install ffmpeg
  ```
- **Docker Build Fix**:  
  Ensure your `Dockerfile` includes:
  ```Dockerfile
  RUN apt-get update && apt-get install -y ffmpeg
  COPY --from=builder /app/node_modules/ffmpeg-static/ ./node_modules/ffmpeg-static/
  ```

---

## License

MIT © Shefing
```
npm package: @shefing/cross-collection
Author: shefing
Latest version: 1.0.5

## 🔗 [Cross-Collection Config Plugin](./src/index.ts)


This plugin allows you to **override** default Payload CMS component views and inject custom behavior.

## 📦 Installation

Install the plugin via your package manager:

```bash
pnpm add @shefing/cross-collection
```
## ⚙️ Setup

To override a component's view in Payload, add the following to your `payload.config.ts`:

```javascript
```javascript
import { CrossCollectionConfig } from '@shefing/cross-collection';

CrossCollectionConfig({
  customOverrides: {
    // Replace the default edit view
    'admin.components.views.edit.default': CustomCollectionEdit,

    // Replace the versions edit view
    'admin.components.views.edit.versions': CustomCollectionEdit,
    // enable to exclude some collections from permission control
    excludedCollections: ['posts', 'media'],
    // array of globals names to exclude
    excludedGlobals:[], 

  },
});
```



## 🔥 Features

- **Full Control**: Override any Payload component view.
- **Easy Customization**: Replace edit views, list views, and more with custom React components.
- **Flexible**: Override any default view across the CMS.

With this plugin, you have **full control** over how every component view in Payload CMS appears! ✨
npm package: @shefing/custom-version-view
Description: This plugin introduces additional fields to the version view for a more detailed and informative experience:
Author: shefing
Latest version: 1.0.21

## [Custom Version View plugin](./src/index.ts)

This plugin introduces additional fields to the version view for a more detailed and informative experience:

- **🕒 Updated At**: Displays the **relative date** of the last update, making it easy to track when changes were made (e.g., "3 hours ago").

- **👤 Updated By**: Shows the **user** who made the last update.


https://github.com/user-attachments/assets/f3e79c7d-277c-4ec6-b5b9-c91b0e104286

### Install

Install the plugin using your node package manager, e.g:

`pnpm add @shefing/custom-version-view`

### Setup
In the payload.config.ts add the following:

```typescript
  plugins: [
    ...plugins,
    versionsPlugin({
      excludedCollections: [] //array of collections names to exclude
      excludeGlobals:[] //array of globals names to exclude
    })
```

The updated by field in versions relies on the authors-info package.

### Collection Configuration

Add the following configuration to enable versions for a collection:

```javascript
  versions: {
    drafts: true,
  }
```
npm package: @shefing/field-type-component-override
Description: This plugin allows you to dynamically **override all fields of specific types** in Payload CMS — including their default components, admin options, or any other field properties — seamlessly and automatically.
Author: shefing
Latest version: 1.0.8

## 🔗 [Field-type-component-override](./src/index.ts)

This plugin allows you to dynamically **override all fields of specific types** in Payload CMS — including their default components, admin options, or any other field properties — seamlessly and automatically.



## 📦 Installation

Install the plugin via your package manager:

```bash
pnpm add @shefing/field-type-component-override
```

## ⚙️ Setup

With this plugin, you can globally **define overrides for any field type** — whether replacing their admin component, setting default options like filterOptions, or forcing custom configurations.
All overrides are applied automatically across your collections and globals.



Add the following to your `payload.config.ts`:

```javascript
import DynamicFieldOverrides from '@shefing/field-type-component-override';

DynamicFieldOverrides({
  overrides: [
    {
      fieldTypes: ['text'],
      overrides: {
        admin: {
          components: {
            Field: './components/CustomTextField',
          },
        },
        label: 'Custom Label',
      },
    },
    {
      fieldTypes: ['relationship'],
      relationTo: ['someCollection'],
      overrides: {
        filterOptions: {
          where: {
            active: {
              equals: true,
            },
          },
        },
      },
    },
  ],
  excludedCollections: ['media'],
  excludedGlobals: [],
}),
```
👉 **If a field already has a value defined for a property you're trying to override — the plugin will respect the existing value and won't override it.**
This ensures that local field definitions always take precedence over global overrides.


## 🔥 Features

- **Global Field Overrides**: Define a field type in the plugin, and every instance of that type is replaced with your your settings automatically.
- **No Manual Configuration**: No need to modify each field individually—just set it once and it applies everywhere.
- **Seamless Integration**: Works with existing Payload CMS structures without disrupting data or functionality.

With this plugin, you gain **full control** over how Payload CMS fields behave and appear—without the need for repetitive manual overrides! ✨
npm package: @shefing/icon-select
Description: This plugin adds a custom Icon Select field to Payload CMS, utilizing the tailwind icon library for easy selection. Users can search or scroll through icons in the dropdown, with ShadCN UI integration for a seamless, modern experience.
Author: shefing
Latest version: 1.0.2

## [Icon select field ](./src/index.ts)

This plugin adds a custom Icon Select field to Payload CMS, utilizing the tailwind icon library for easy selection. Users can search or scroll through icons in the dropdown, with ShadCN UI integration for a seamless, modern experience.

![img1.png](./images/img1.png)

### Setup

Install the plugin using your node package manager, e.g:

` npm install @shefing/icon-select`

In the collection add the following:

```typescript
import   { createIconSelectField }  from "@shefing/icon-select"

 fields: [ 
 createIconSelectField({ name: 'iconType', label: 'Select Icon' }),
 ]
```

To use this package, you need to install Tailwind CSS in your project.
npm package: @shefing/reset-list-view
Description: Reset List View Preferences
Author: shefing
Latest version: 0.2.13

# Reset List View Plugin for Payload CMS

A plugin for [Payload CMS](https://payloadcms.com) that adds a "Reset Preferences" button to collection list views, allowing users to reset their list view preferences to the default state.

## Features

- Adds a "Reset Preferences" button to the list view menu of collections
- Allows users to quickly reset their list view preferences (columns, filters, pagination, etc.)
- Configurable to include or exclude specific collections

## Installation

```bash
npm install @shefing/reset-list-view
# or
yarn add @shefing/reset-list-view
# or
pnpm add @shefing/reset-list-view
```

## Usage

Add the plugin to your Payload config:

```typescript
import { buildConfig } from 'payload/config'
import { CollectionResetPreferencesPlugin } from '@shefing/reset-list-view'

export default buildConfig({
  plugins: [
    CollectionResetPreferencesPlugin({
      // Plugin options here
    }),
  ],
  // Rest of your Payload config
})
```

## Configuration Options

The plugin accepts the following configuration options:

| Option | Type | Description | Default |
|--------|------|-------------|---------|
| `disabled` | `boolean` | Disable the plugin | `false` |
| `includedCollections` | `string[]` | List of collection slugs to add the reset button to. If provided, only these collections will have the reset button. | `undefined` |
| `excludedCollections` | `string[]` | List of collection slugs to exclude from having the reset button. Only used if `includedCollections` is not provided. | `undefined` |

### Examples

Add the reset button to all collections:

```typescript
CollectionResetPreferencesPlugin()
```

Add the reset button to specific collections:

```typescript
CollectionResetPreferencesPlugin({
  includedCollections: ['posts', 'categories'],
})
```

Exclude specific collections from having the reset button:

```typescript
CollectionResetPreferencesPlugin({
  excludedCollections: ['users', 'media'],
})
```

Disable the plugin:

```typescript
CollectionResetPreferencesPlugin({
  disabled: true,
})
```

## How It Works

The plugin adds a "Reset Preferences" button to the list view menu of collections. When clicked, the button makes a DELETE request to the Payload API to delete the user's preferences for that collection's list view, and then reloads the page. This resets the list view to its default state, clearing any custom column configurations, filters, pagination settings, etc.

## License

MIT
npm package: @shefing/right-panel
Description: This plugin enables opening a relationship field in a right panel, in addition to a pop-up.
Author: shefing
Latest version: 1.0.1

## [Right-panel plugin](./src/index.ts)

This plugin enables opening a relationship field in a right panel, in addition to a pop-up.

This allows working on both of the entities ,original and relationship, at once.

This was done by adding a custom view to the edit view.

For example:

![img1.png](./images/img1.png)

### Setup

Install the plugin using your node package manager, e.g:

`npm add @shefing/right-panel`

In the payload.config.ts add the following:

```javascript
plugins: [
...plugins
RightPanelPlugin({
  excludedCollections: [] //array of collections names to exclude
});
]
```

### Collection Configuration

To add a Right Panel to a Relationship field, include the following in the collection's admin configuration:

```javascript
  admin: {
    custom: {
      rightPanel: true,
    },

  },
```

### Fields Configuration

To enable the Right Panel in the Relationship field, add the following lines to the field configuration:

```javascript
    admin: {
      components: {
        Field:
        components: {
            Field: '@shefing/right-panel/components/RelationInRightPanelField'
        }
      }
    },
```
npm package: @shehabtweel99/functionkit
Description: A package with functions for example, sum 2 numbers
Author: Shehab Ali Tweel
Latest version: 1.0.0

# functionKit ![latest version | npm](https://flat.badgen.net/npm/v/functionKit?icon=npm) ![development dependency security check | David DM](https://flat.badgen.net/david/dev/functionKit/pkg) ![GitHub Workflow Status](https://img.shields.io/github/workflow/status/shahoob/functionKit/Node.js%20Package?style=flat-square?logo=github)
 A package with functions for example, sum 2 numbers

 ## Install
 ```
 npm i functionKit
 ```
 or
 ```
 npm install functionKit
 ```
 ## Usage
 ### Importing
 #### From one file
 ```javascript
 import { sum, subtract, greet, divide } from 'functionKit';
 // Or this
 const { sum, subtract, greet, divide } = require('functionKit');
 ```
 #### From separate files
 ```javascript
 import { greet } from 'functionKit/lib/greeter';
 // Or this
 const { greet } = require('functionKit/lib/greeter');

 //                                                             ^
 // You can put any of them. As long as they look similar above |
 ```
 ## How-to
 ```javascript
 // Greeter
 console.log(greet('Shehab'));
           // Hello Shehab
 // Custom Greeting
 console.log(greet('Shehab', 'Welcome back,'));
                           // Welcome back, Shehab

// Math
 // sum (add)
    console.log(sum(1, 1));
    // 2
    // Same as: 1 + 1
 // subtract (the opposite of sum)
    console.log(subtract(1, 3));
    // 3
    // Same as: 1 - 3
 // Divide (i can't simplify it.)
    console.log(divide(55, 11));
    // 5
    // Same as: 55 / 11
 ```