@teamprodevs/appsmith-custom-table 1.1.4 → 1.1.5

package/README.md

@@ -3,33 +3,56 @@
 [![npm version](https://img.shields.io/npm/v/%40teamprodevs/appsmith-custom-table.svg)](https://www.npmjs.com/package/@teamprodevs/appsmith-custom-table)
 [![License](https://img.shields.io/badge/license-MIT-blue.svg)](#license)
 [![Storybook](https://img.shields.io/badge/storybook-live-ff4785.svg)](https://custom-appsmith-table.netlify.app/)
+[![TypeScript](https://img.shields.io/badge/TypeScript-5.x-blue.svg)](https://www.typescriptlang.org/)
 
-A highly configurable table system built for Appsmith custom widgets. It marries React 18, TanStack Table v8, and TailwindCSS to deliver both server-side infinite lists and lightweight client-side tables with the same API surface.
+A highly configurable table component built for Appsmith custom widgets. It combines React 18, TanStack Table v8, and TailwindCSS to deliver a powerful client-side table that integrates seamlessly with Appsmith's data sources including PostgreSQL, MongoDB, Elasticsearch, and REST APIs.
+
+> ⚠️ **Maintenance Notice**: This project was developed as a job task and is **not actively maintained**. If you need additional features or bug fixes, please [fork this repository](https://github.com/smarts-uz/appsmith-custom-table/fork) and maintain your own version.
+
+## 🔗 Quick Links
+
+| Resource | Link |
+|----------|------|
+| 📚 **Storybook Demo** | [custom-appsmith-table.netlify.app](https://custom-appsmith-table.netlify.app/?path=/story/appsmith-table--translated-table) |
+| 📦 **NPM Package** | [npmjs.com/package/@teamprodevs/appsmith-custom-table](https://www.npmjs.com/package/@teamprodevs/appsmith-custom-table) |
+| 🎯 **Appsmith Example** | [Live Appsmith Demo](https://custom-table.appsmith.com/app/appsmith-custom-table/basic-example-695f8fe01bbc1832a1e36e11?environment=production) |
+| 💻 **GitHub Repository** | [github.com/smarts-uz/appsmith-custom-table](https://github.com/smarts-uz/appsmith-custom-table) |
 
 ## Features
 
 - Full Appsmith custom component support (bundled + CDN).
-- Dual rendering modes: SSR infinite loading and client-side in-memory tables.
-- Typed configuration powered by Zod schemas for columns, fetchers, and models.
+- Client-side pagination with infinite scroll support.
+- Tight integration with Appsmith's data models (PostgreSQL, MongoDB, Elasticsearch, REST APIs).
+- Typed configuration powered by Zod schemas for validation.
 - Rich styling hooks with Tailwind-first tokenization.
 - Action hooks, event callbacks, and controlled `updateModel` APIs.
-- Designed for pgrest/dbtorest pagination models.
+- Conditional row styling based on cell values.
+- Multi-language support (i18n) for column headers and action labels.
+- Built-in formatters for phone, date, datetime, and currency.
+- Compatible with pgrest/dbtorest pagination patterns.
 
 ## Table of Contents
 
-1. [Demo](#demo)
+1. [Quick Links](#-quick-links)
 2. [Installation](#installation)
 3. [CDN Usage](#cdn-usage)
 4. [Quick Start](#quick-start)
 5. [Usage](#usage)
-6. [Configuration Schemas](#configuration-schemas)
-7. [Customization](#customization)
-8. [SSR Table Capabilities](#ssr-table-capabilities)
-9. [Client-Side Table Highlights](#client-side-table-highlights)
-10. [Development](#development)
-11. [Contributing](#contributing)
-12. [License](#license)
-13. [Acknowledgements](#acknowledgements)
+6. [API Reference](#api-reference)
+   - [TableModel Props](#tablemodel-props)
+   - [Column Schema](#column-schema)
+   - [Column Types](#column-types)
+7. [Row Actions](#row-actions)
+8. [Conditional Styling](#conditional-styling)
+9. [Translations (i18n)](#translations-i18n)
+10. [Customization](#customization)
+    - [Styles](#styles)
+    - [CSS Variables](#css-variables)
+11. [Events](#events)
+12. [Development](#development)
+13. [Contributing](#contributing)
+14. [License](#license)
+15. [Acknowledgements](#acknowledgements)
 
 ## Demo
 
@@ -54,16 +77,18 @@ Ideal for Appsmith widgets where bundling is not available.
 
 ## Quick Start
 
-1. Define a schema describing each column’s type, filtering, and sorting behavior.
-2. Render the `AppsmithTable` with either `data` (client) or `tableModel` (SSR).
-3. Optionally pass custom styles, actions, events, and an `updateModel` handler for controlled flows.
+1. Define a schema describing each column's type and display options.
+2. Pass your Appsmith query data to the `ClientTable` component.
+3. Wire up `triggerEvent` and `updateModel` callbacks to Appsmith's APIs.
+4. Optionally add custom styles, actions, and conditional formatting.
 
 ## Usage
 
 ### Client-side Table
 
 ```tsx
-import { AppsmithTable } from "@teamprodevs/appsmith-custom-table";
+import { ClientTable } from "@teamprodevs/appsmith-custom-table";
+import "@teamprodevs/appsmith-custom-table/dist/styles.css";
 
 const data = [
   { id: 1, name: "Alice", age: 25 },
@@ -71,83 +96,468 @@ const data = [
 ];
 
 const schema = {
-  id: { type: "text", filter: true, sort: true },
-  name: { type: "text", filter: true, sort: true },
-  age: { type: "number", filter: true, sort: true },
+  id: { type: "text", title: { en: "ID", uz: "ID" } },
+  name: { type: "text", title: { en: "Name", uz: "Ism" } },
+  age: { type: "text", title: { en: "Age", uz: "Yosh" } },
 };
 
-const ClientTable = () => <AppsmithTable schema={schema} data={data} />;
+const MyTable = () => (
+  <ClientTable
+    tableData={data}
+    schema={schema}
+    locale="en"
+    triggerEvent={(event, payload) => console.log(event, payload)}
+    updateModel={(model) => console.log(model)}
+    onModelChange={(model) => console.log(model)}
+  />
+);
 ```
 
-### SSR Infinite Table
+### Infinite Scroll with Appsmith
+
+The table triggers `onLoadMore` events for pagination. Wire this to your Appsmith query:
 
 ```tsx
-import { AppsmithTable } from "@teamprodevs/appsmith-custom-table";
+import { ClientTable } from "@teamprodevs/appsmith-custom-table";
 
+// In your Appsmith custom widget
 const tableModel = {
-  fetcher: {
-    url: "https://api.example.com/users",
-    method: "GET",
-    perPage: 20,
-    paginationKeys: { offset: "offset", limit: "limit" },
-  },
+  tableData: appsmith.model.queryData, // Data from your Appsmith query
   schema,
-  updateModel: (state) => console.log("table state", state),
+  locale: "en",
+  limit: 20,
+  max_count: appsmith.model.totalCount, // Total rows from your API
+  triggerEvent: (event, payload) => appsmith.triggerEvent(event, payload),
+  updateModel: (model) => appsmith.updateModel(model),
+  onModelChange: (model) => console.log("table state", model),
+};
+
+const UsersTable = () => <ClientTable {...tableModel} />;
+```
+
+## API Reference
+
+### TableModel Props
+
+The `ClientTable` component accepts the following props (all validated via Zod schemas):
+
+| Prop | Type | Required | Default | Description |
+|------|------|----------|---------|-------------|
+| `tableData` | `any[]` | Yes | `[]` | Array of row data objects |
+| `schema` | `Schema` | Yes | - | Column definitions (see [Column Schema](#column-schema)) |
+| `locale` | `string` | Yes | - | Active language code for translations (e.g., `"en"`, `"uz"`, `"ru"`) |
+| `triggerEvent` | `TriggerEvent` | Yes | - | Callback to trigger Appsmith events |
+| `updateModel` | `UpdateModel` | Yes | - | Callback to update Appsmith model state |
+| `onModelChange` | `OnModelChange` | Yes | - | Callback fired when table model changes |
+| `limit` | `number` | No | `20` | Number of rows per page |
+| `max_count` | `number` | No | `20` | Maximum total rows (for pagination) |
+| `indexColumn` | `IndexColumn` | No | - | Configuration for row index column |
+| `actionColumn` | `ActionColumn` | No | - | Configuration for action buttons column |
+| `conditionalRowStyles` | `ConditionalRowStyle[]` | No | - | Rules for conditional row styling |
+| `styles` | `AppsmithTableStyles` | No | - | Custom styling configuration |
+| `rowSelectionAction` | `string` | No | - | Event name triggered on row selection |
+
+### Column Schema
+
+Each column in the `schema` object is defined with these options:
+
+```typescript
+const schema = {
+  column_key: {
+    type: "text",           // Column type (see Column Types)
+    size: "md",             // Width: "xs" | "sm" | "md" | "lg"
+    title: {                // Localized column headers
+      en: "English Title",
+      uz: "O'zbek Sarlavha",
+      ru: "Русский заголовок"
+    },
+    className: "custom-class" // Custom CSS classes
+  }
+};
+```
+
+| Option | Type | Required | Default | Description |
+|--------|------|----------|---------|-------------|
+| `type` | `ColumnType` | No | `"text"` | Data type for formatting |
+| `size` | `"xs" \| "sm" \| "md" \| "lg"` | No | `"md"` | Column width preset |
+| `title` | `Record<string, string>` | No | - | Localized headers by language code |
+| `className` | `string` | No | - | Custom CSS classes for column |
+
+### Column Types
+
+The table supports 6 column types with automatic formatting:
+
+| Type | Description | Example Output |
+|------|-------------|----------------|
+| `text` | Plain text display (default) | `"John Doe"` |
+| `url` | Clickable link (special format) | `<a href="...">Display Text</a>` |
+| `phone` | Phone number formatting | `99 123 45 67` |
+| `date` | Date formatting | `15-03-2024` |
+| `datetime` | Date and time formatting | `15-03-2024 14:30` |
+| `currency` | Currency with thousand separators | `1 234 567` |
+
+#### URL Column Format
+
+For URL columns, use the special format `"Display Text|||https://url.com"`:
+
+```typescript
+const data = [
+  { 
+    link: "Visit Site|||https://example.com",
+    // Renders as clickable "Visit Site" link
+  }
+];
+
+const schema = {
+  link: { type: "url", title: { en: "Link" } }
 };
+```
+
+When clicked, triggers `onRedirect` event with the URL.
+
+## Row Actions
+
+Add interactive action buttons to each row using the `actionColumn` configuration:
+
+```typescript
+import { ClientTable } from "@teamprodevs/appsmith-custom-table";
 
-const UsersTable = () => <AppsmithTable tableModel={tableModel} />;
+const tableModel = {
+  tableData: data,
+  schema: schema,
+  locale: "en",
+  actionColumn: {
+    enable: true,
+    pin: "right",              // "left" | "right"
+    type: "outline",           // Button variant
+    icon: "MoreVertical",      // Lucide icon for dropdown trigger
+    actions: [
+      {
+        title: { en: "View", uz: "Ko'rish", ru: "Просмотр" },
+        onClick: "onView",     // Event name to trigger
+        icon: "Eye",           // Lucide icon name
+        className: "text-blue-600"
+      },
+      {
+        title: { en: "Edit", uz: "Tahrirlash", ru: "Редактировать" },
+        onClick: "onEdit",
+        icon: "Pencil"
+      },
+      {
+        title: { en: "Delete", uz: "O'chirish", ru: "Удалить" },
+        onClick: "onDelete",
+        icon: "Trash2",
+        className: "text-red-600"
+      }
+    ]
+  },
+  triggerEvent: (event, payload) => {
+    // payload contains { row: <row data> }
+    console.log(event, payload);
+  },
+  // ... other props
+};
 ```
 
-## Configuration Schemas
+### Action Column Options
+
+| Option | Type | Required | Default | Description |
+|--------|------|----------|---------|-------------|
+| `enable` | `boolean` | Yes | - | Enable/disable action column |
+| `actions` | `RowAction[]` | Yes | - | Array of action definitions |
+| `pin` | `"left" \| "right"` | No | `"right"` | Pin column position |
+| `type` | `string` | No | `"default"` | Button variant |
+| `icon` | `LucideIconName` | No | - | Icon for dropdown trigger |
+
+### Button Variants
 
-Every table is fully typed using Zod schemas. Key primitives include:
+Available button variants: `"default"`, `"destructive"`, `"outline"`, `"secondary"`, `"ghost"`, `"link"`
 
-- **`ColumnItemSchema`**: Describes column type (`text`, `number`, etc.), sorting, filtering, sizing, visibility, and formatting.
-- **`FetcherSchema`**: Encapsulates REST config—method, headers, query/body params, pagination keys, debounce, and optimistic flags.
-- **`TableModelSchema`**: The orchestration layer combining schema, fetcher, selection settings, actions, row styles, and callbacks.
+### Supported Icons
 
-These schemas keep your tables consistent, validated, and shareable across projects.
+All [Lucide React](https://lucide.dev/icons/) icons are supported. Use the icon name as a string (e.g., `"Eye"`, `"Pencil"`, `"Trash2"`, `"Activity"`, `"AlarmClockPlus"`).
+
+## Conditional Styling
+
+Apply dynamic styles to rows based on cell values using `conditionalRowStyles`:
+
+```typescript
+const tableModel = {
+  // ... other props
+  conditionalRowStyles: [
+    // Highlight rows where used_days >= 150
+    {
+      column: "used_days",
+      operator: ">=",
+      value: 150,
+      className: "bg-yellow-200"
+    },
+    // Red background for used_days >= 300
+    {
+      column: "used_days",
+      operator: ">=",
+      value: 300,
+      className: "bg-red-400"
+    },
+    // Compare two columns: highlight when payment < debt
+    {
+      column: "total_payment",
+      operator: "<",
+      value: { columnRef: "debt_amount" },
+      className: "text-red-800 font-bold"
+    },
+    // Green when payment >= debt
+    {
+      column: "total_payment",
+      operator: ">=",
+      value: { columnRef: "debt_amount" },
+      className: "text-green-800 font-bold"
+    }
+  ]
+};
+```
+
+### Conditional Style Options
+
+| Option | Type | Required | Description |
+|--------|------|----------|-------------|
+| `column` | `string` | Yes | Column key to evaluate |
+| `operator` | `RowStyleOperator` | Yes | Comparison operator |
+| `value` | `string \| number \| boolean \| { columnRef: string }` | Yes | Value to compare against (or another column) |
+| `className` | `string` | Yes | Tailwind/CSS classes to apply |
+
+### Supported Operators
+
+| Operator | Description |
+|----------|-------------|
+| `>` | Greater than |
+| `<` | Less than |
+| `>=` | Greater than or equal |
+| `<=` | Less than or equal |
+| `===` | Strict equality |
+| `==` | Loose equality |
+| `!==` | Strict inequality |
+| `!=` | Loose inequality |
+| `contains` | String contains |
+| `startsWith` | String starts with |
+| `endsWith` | String ends with |
+| `isEmpty` | Value is empty |
+| `isNotEmpty` | Value is not empty |
+
+### Column-to-Column Comparison
+
+Use `{ columnRef: "column_name" }` to compare against another column's value:
+
+```typescript
+{
+  column: "actual_amount",
+  operator: "<",
+  value: { columnRef: "expected_amount" },
+  className: "text-red-600"
+}
+```
+
+## Translations (i18n)
+
+The table supports multi-language column headers and action labels:
+
+### Column Header Translations
+
+```typescript
+const schema = {
+  customer_name: {
+    title: {
+      en: "Customer Name",
+      uz: "Mijoz Ismi",
+      ru: "Имя клиента"
+    },
+    type: "text"
+  },
+  phone: {
+    title: {
+      en: "Phone Number",
+      uz: "Telefon Raqam",
+      ru: "Телефон номер"
+    },
+    type: "phone"
+  }
+};
+
+// Set active language
+<ClientTable
+  schema={schema}
+  locale="uz"  // Shows "Mijoz Ismi", "Telefon Raqam"
+  // ...
+/>
+```
+
+### Action Label Translations
+
+```typescript
+const actionColumn = {
+  enable: true,
+  actions: [
+    {
+      title: {
+        en: "View Details",
+        uz: "Batafsil ko'rish",
+        ru: "Посмотреть детали"
+      },
+      onClick: "onView",
+      icon: "Eye"
+    }
+  ]
+};
+```
 
 ## Customization
 
 ### Styles
 
+Apply custom styles to different parts of the table:
+
 ```tsx
-import {
-  AppsmithTable,
-  AppsmithTableStyles,
-} from "@teamprodevs/appsmith-custom-table";
+import { ClientTable } from "@teamprodevs/appsmith-custom-table";
+import type { AppsmithTableStyles } from "@teamprodevs/appsmith-custom-table";
 
 const styles: AppsmithTableStyles = {
-  table: "border border-gray-200 rounded-md",
-  head: { cell: "bg-gray-50 text-gray-700 font-semibold" },
-  body: { cell: "px-3 py-2" },
-  footer: "bg-white border-t",
+  container: "bg-white shadow-md rounded-lg px-1",
+  table: "border border-gray-200",
+  head: {
+    body: "bg-gray-100",
+    row: "hover:bg-gray-200 transition-colors",
+    cell: "border-b border-gray-300 font-semibold"
+  },
+  body: {
+    body: "bg-white",
+    row: "odd:bg-gray-50 even:bg-white hover:bg-blue-50",
+    cell: "border-b border-gray-200 px-3 py-2"
+  }
 };
 
 const StyledTable = () => (
-  <AppsmithTable schema={schema} data={data} styles={styles} />
+  <ClientTable
+    schema={schema}
+    tableData={data}
+    locale="en"
+    styles={styles}
+    // ...other props
+  />
 );
 ```
 
-### Actions & Events
+### Style Options
+
+| Option | Type | Description |
+|--------|------|-------------|
+| `container` | `string` | Wrapper container classes |
+| `table` | `string` | Table element classes |
+| `head.body` | `string` | Table header body classes |
+| `head.row` | `string` | Header row classes |
+| `head.cell` | `string` | Header cell classes |
+| `body.body` | `string` | Table body classes |
+| `body.row` | `string` | Body row classes |
+| `body.cell` | `string` | Body cell classes |
+| `variables` | `Record<string, string>` | CSS custom properties |
 
-- Define per-row action buttons or icons (edit, delete, open modal, etc.).
-- Trigger events with contextual payloads for Appsmith event handlers.
-- Consume `updateModel` to keep external state in sync with table interactions.
+### CSS Variables
 
-## SSR Table Capabilities
+Use CSS variables for theming with design tokens:
 
-- Works seamlessly with infinite-query patterns and cursor or offset pagination.
-- Handles server-driven sorting, filtering, and per-page controls.
-- Compatible with pgrest and dbtorest APIs out of the box.
-- Type-safe update flows ensure controlled mutations across distributed widgets.
+```typescript
+const styles: AppsmithTableStyles = {
+  head: {
+    body: "bg-[var(--primary)] text-[var(--primary-foreground)]",
+    row: "hover:bg-[var(--primary-foreground)] hover:text-[var(--primary)]",
+    cell: "border-b border-[var(--border)]"
+  },
+  body: {
+    body: "bg-[var(--card)] text-[var(--card-foreground)]",
+    row: "odd:bg-[var(--accent)] even:bg-[var(--card)] hover:bg-[var(--muted)]",
+    cell: "border-b border-[var(--border)]"
+  },
+  container: "bg-[var(--card)] shadow-md rounded-lg px-1",
+  variables: {
+    "--primary": "hsl(220 70% 50%)",
+    "--primary-foreground": "hsl(0 0% 100%)",
+    "--card": "hsl(0 0% 100%)",
+    "--card-foreground": "hsl(0 0% 10%)",
+    "--border": "hsl(0 0% 90%)",
+    "--accent": "hsl(43 74% 66%)",
+    "--muted": "hsl(0 0% 96%)"
+  }
+};
+```
 
-## Client-Side Table Highlights
+### Index Column
 
-- Lightweight, in-memory data rendering with the same schema as SSR.
-- Perfect for Appsmith custom components shipped via CDN.
-- Supports local filtering, sorting, row selection, and inline actions without API calls.
+Add a row index column:
+
+```typescript
+const tableModel = {
+  // ...
+  indexColumn: {
+    enable: true,
+    pin: "left",           // "left" | "right"
+    className: "bg-gray-100 font-mono"
+  }
+};
+```
+
+## Events
+
+The table triggers events through the `triggerEvent` callback:
+
+| Event | Payload | Description |
+|-------|---------|-------------|
+| `onLoadMore` | `{ page, limit }` | Infinite scroll pagination request |
+| `onRedirect` | `{ url }` | URL column click |
+| `rowSelectionAction` | `{ row }` | Row selection (if configured) |
+| Custom action events | `{ row }` | Row action button clicks |
+
+### Example Event Handling in Appsmith
+
+```javascript
+// In your Appsmith custom widget
+triggerEvent: (eventName, payload) => {
+  switch(eventName) {
+    case 'onView':
+      appsmith.triggerEvent('onRowView', { data: payload.row });
+      break;
+    case 'onEdit':
+      appsmith.triggerEvent('onRowEdit', { data: payload.row });
+      break;
+    case 'onDelete':
+      appsmith.triggerEvent('onRowDelete', { data: payload.row });
+      break;
+    case 'onLoadMore':
+      // Fetch next page
+      appsmith.triggerEvent('fetchNextPage', { 
+        page: payload.page, 
+        limit: payload.limit 
+      });
+      break;
+  }
+}
+```
+
+## Appsmith Integration
+
+This table is designed for tight integration with Appsmith's ecosystem:
+
+- **Data Sources**: Works with any Appsmith-supported data source (PostgreSQL, MongoDB, Elasticsearch, REST APIs, GraphQL)
+- **Infinite Scroll**: Triggers `onLoadMore` events that you wire to Appsmith queries for pagination
+- **Event System**: All actions flow through Appsmith's `triggerEvent` and `updateModel` APIs
+- **Client-Side Rendering**: All rendering happens in the browser; Appsmith handles data fetching
+- **pgrest/dbtorest Compatible**: Pagination parameters match common REST patterns
+
+### How It Works
+
+1. Your Appsmith query fetches data from any supported source
+2. Data is passed to `ClientTable` via the `tableData` prop
+3. User interactions trigger events (row clicks, actions, load more)
+4. You handle events in Appsmith to update queries or trigger workflows
+5. Updated data flows back to the table
 
 ## Development
 
@@ -156,18 +566,55 @@ const StyledTable = () => (
 3. Add stories, ensure lint/tests pass, then open a PR.
 
 ```bash
-git clone <your-fork>
+git clone https://github.com/smarts-uz/appsmith-custom-table.git
 cd appsmith-custom-table
 npm install
 npm run storybook
 ```
 
+### Available Scripts
+
+| Script | Description |
+|--------|-------------|
+| `npm run storybook` | Start Storybook dev server on port 6006 |
+| `npm run build` | Build the library for production |
+| `npm run build-storybook` | Build static Storybook site |
+| `npm run lint` | Run ESLint |
+
 ## Contributing
 
-- Fork the repository and create a topic branch.
-- Add tests or stories that cover your changes.
-- Ensure formatting/lint pass, then submit a PR with context.
-- Please attribute inspiration to `tablecn`.
+> ⚠️ **Note**: This project is not actively maintained. It was created as a job task to solve a specific problem. If you need new features or extended functionality, **please fork this repository** and develop your own version.
+
+### Forking This Project (Recommended)
+
+Since this project is not actively maintained, forking is the recommended approach:
+
+1. **Fork the repository** — Click the ["Fork" button](https://github.com/smarts-uz/appsmith-custom-table/fork) on GitHub
+2. **Clone your fork**
+   ```bash
+   git clone https://github.com/YOUR_USERNAME/appsmith-custom-table.git
+   cd appsmith-custom-table
+   ```
+3. **Make it your own** — Add features, fix bugs, customize as needed
+4. **Publish your fork** — You can publish to npm under your own package name
+
+### Contributing Back (Critical Fixes Only)
+
+For critical bug fixes that benefit everyone:
+
+1. Create a feature branch from your fork
+2. Make minimal, focused changes
+3. Run checks: `npm run lint && npm run build`
+4. Submit a PR with clear description
+
+> **Note**: Response times may be slow and PRs may not be reviewed promptly.
+
+### Attribution
+
+If you fork and extend this project, please:
+- Keep the MIT license
+- Credit the original `tablecn` project for inspiration
+- Link back to this repository
 
 ## License
 
@@ -175,5 +622,7 @@ MIT © Ramz001
 
 ## Acknowledgements
 
-Huge thanks to the Appsmith community and the `tablecn` project for the foundational inspiration that sparked this library.
+- Thanks to the Appsmith community for the platform that inspired this widget
+- Thanks to the `tablecn` project for foundational inspiration
+- This project was created as a job task at [Smarts](https://github.com/smarts-uz) to demonstrate Appsmith custom widget capabilities
  

package/dist/app.js

@@ -40758,7 +40758,7 @@ function Uge(e) {
     m * l >= c && x(!1);
   }, [m, l, c]), he.useEffect(() => {
     w?.length > 0 && p((R) => {
-      R?.data?.length > 0 && R.data !== w && b(R.data || []);
+      Array.isArray(R?.data) && R.data !== w && b(R.data || []);
     });
   }, [w]), y.success ? /* @__PURE__ */ L1(
     "main",

package/dist/app.umd.cjs

@@ -64,4 +64,4 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   .block-interactivity-`.concat(e,` {pointer-events: none;}
   .allow-interactivity-`).concat(e,` {pointer-events: all;}
 `)},CU=0,ei=[];function zU(e){var t=f.useRef([]),o=f.useRef([0,0]),a=f.useRef(),n=f.useState(CU++)[0],i=f.useState(_P)[0],c=f.useRef(e);f.useEffect(function(){c.current=e},[e]),f.useEffect(function(){if(e.inert){document.body.classList.add("block-interactivity-".concat(n));var _=YE([e.lockRef.current],(e.shards||[]).map(wP),!0).filter(Boolean);return _.forEach(function(m){return m.classList.add("allow-interactivity-".concat(n))}),function(){document.body.classList.remove("block-interactivity-".concat(n)),_.forEach(function(m){return m.classList.remove("allow-interactivity-".concat(n))})}}},[e.inert,e.lockRef.current,e.shards]);var d=f.useCallback(function(_,m){if("touches"in _&&_.touches.length===2||_.type==="wheel"&&_.ctrlKey)return!c.current.allowPinchZoom;var g=ab(_),w=o.current,$="deltaX"in _?_.deltaX:w[0]-g[0],b="deltaY"in _?_.deltaY:w[1]-g[1],N,P=_.target,C=Math.abs($)>Math.abs(b)?"h":"v";if("touches"in _&&C==="h"&&P.type==="range")return!1;var I=gP(C,P);if(!I)return!0;if(I?N=C:(N=C==="v"?"h":"v",I=gP(C,P)),!I)return!1;if(!a.current&&"changedTouches"in _&&($||b)&&(a.current=N),!N)return!0;var T=a.current||N;return IU(T,m,_,T==="h"?$:b)},[]),l=f.useCallback(function(_){var m=_;if(!(!ei.length||ei[ei.length-1]!==i)){var g="deltaY"in m?$P(m):ab(m),w=t.current.filter(function(N){return N.name===m.type&&(N.target===m.target||m.target===N.shadowParent)&&LU(N.delta,g)})[0];if(w&&w.should){m.cancelable&&m.preventDefault();return}if(!w){var $=(c.current.shards||[]).map(wP).filter(Boolean).filter(function(N){return N.contains(m.target)}),b=$.length>0?d(m,$[0]):!c.current.noIsolation;b&&m.cancelable&&m.preventDefault()}}},[]),s=f.useCallback(function(_,m,g,w){var $={name:_,delta:m,target:g,should:w,shadowParent:AU(g)};t.current.push($),setTimeout(function(){t.current=t.current.filter(function(b){return b!==$})},1)},[]),u=f.useCallback(function(_){o.current=ab(_),a.current=void 0},[]),h=f.useCallback(function(_){s(_.type,$P(_),_.target,d(_,e.lockRef.current))},[]),k=f.useCallback(function(_){s(_.type,ab(_),_.target,d(_,e.lockRef.current))},[]);f.useEffect(function(){return ei.push(i),e.setCallbacks({onScrollCapture:h,onWheelCapture:h,onTouchMoveCapture:k}),document.addEventListener("wheel",l,Q1),document.addEventListener("touchmove",l,Q1),document.addEventListener("touchstart",u,Q1),function(){ei=ei.filter(function(_){return _!==i}),document.removeEventListener("wheel",l,Q1),document.removeEventListener("touchmove",l,Q1),document.removeEventListener("touchstart",u,Q1)}},[]);var p=e.removeScrollBar,y=e.inert;return f.createElement(f.Fragment,null,y?f.createElement(i,{styles:SU(n)}):null,p?f.createElement(vU,{noRelative:e.noRelative,gapMode:e.gapMode}):null)}function AU(e){for(var t=null;e!==null;)e instanceof ShadowRoot&&(t=e.host,e=e.host),e=e.parentNode;return t}const jU=cU(kP,zU);var QN=f.forwardRef(function(e,t){return f.createElement(nb,Be({},e,{ref:t,sideCar:jU}))});QN.classNames=nb.classNames;var eI=["Enter"," "],PU=["ArrowDown","PageUp","Home"],bP=["ArrowUp","PageDown","End"],qU=[...PU,...bP],DU={ltr:[...eI,"ArrowRight"],rtl:[...eI,"ArrowLeft"]},OU={ltr:["ArrowLeft"],rtl:["ArrowRight"]},Pi="Menu",[qi,HU,VU]=lj(Pi),[P1,xP]=Z1(Pi,[VU,Xw,iP]),ib=Xw(),NP=iP(),[RU,q1]=P1(Pi),[TU,Di]=P1(Pi),IP=e=>{const{__scopeMenu:t,open:o=!1,children:a,dir:n,onOpenChange:i,modal:c=!0}=e,d=ib(t),[l,s]=f.useState(null),u=f.useRef(!1),h=et(i),k=uj(n);return f.useEffect(()=>{const p=()=>{u.current=!0,document.addEventListener("pointerdown",y,{capture:!0,once:!0}),document.addEventListener("pointermove",y,{capture:!0,once:!0})},y=()=>u.current=!1;return document.addEventListener("keydown",p,{capture:!0}),()=>{document.removeEventListener("keydown",p,{capture:!0}),document.removeEventListener("pointerdown",y,{capture:!0}),document.removeEventListener("pointermove",y,{capture:!0})}},[]),M.jsx(tP,{...d,children:M.jsx(RU,{scope:t,open:o,onOpenChange:h,content:l,onContentChange:s,children:M.jsx(TU,{scope:t,onClose:f.useCallback(()=>h(!1),[h]),isUsingKeyboardRef:u,dir:k,modal:c,children:a})})})};IP.displayName=Pi;var FU="MenuAnchor",tI=f.forwardRef((e,t)=>{const{__scopeMenu:o,...a}=e,n=ib(o);return M.jsx(UN,{...n,...a,ref:t})});tI.displayName=FU;var nI="MenuPortal",[EU,LP]=P1(nI,{forceMount:void 0}),SP=e=>{const{__scopeMenu:t,forceMount:o,children:a,container:n}=e,i=q1(nI,t);return M.jsx(EU,{scope:t,forceMount:o,children:M.jsx(j1,{present:o||i.open,children:M.jsx(BN,{asChild:!0,container:n,children:a})})})};SP.displayName=nI;var be="MenuContent",[UU,oI]=P1(be),CP=f.forwardRef((e,t)=>{const o=LP(be,e.__scopeMenu),{forceMount:a=o.forceMount,...n}=e,i=q1(be,e.__scopeMenu),c=Di(be,e.__scopeMenu);return M.jsx(qi.Provider,{scope:e.__scopeMenu,children:M.jsx(j1,{present:a||i.open,children:M.jsx(qi.Slot,{scope:e.__scopeMenu,children:c.modal?M.jsx(BU,{...n,ref:t}):M.jsx(ZU,{...n,ref:t})})})})}),BU=f.forwardRef((e,t)=>{const o=q1(be,e.__scopeMenu),a=f.useRef(null),n=ue(t,a);return f.useEffect(()=>{const i=a.current;if(i)return uP(i)},[]),M.jsx(aI,{...e,ref:n,trapFocus:o.open,disableOutsidePointerEvents:o.open,disableOutsideScroll:!0,onFocusOutside:U(e.onFocusOutside,i=>i.preventDefault(),{checkForDefaultPrevented:!1}),onDismiss:()=>o.onOpenChange(!1)})}),ZU=f.forwardRef((e,t)=>{const o=q1(be,e.__scopeMenu);return M.jsx(aI,{...e,ref:t,trapFocus:!1,disableOutsidePointerEvents:!1,disableOutsideScroll:!1,onDismiss:()=>o.onOpenChange(!1)})}),GU=Si("MenuContent.ScrollLock"),aI=f.forwardRef((e,t)=>{const{__scopeMenu:o,loop:a=!1,trapFocus:n,onOpenAutoFocus:i,onCloseAutoFocus:c,disableOutsidePointerEvents:d,onEntryFocus:l,onEscapeKeyDown:s,onPointerDownOutside:u,onFocusOutside:h,onInteractOutside:k,onDismiss:p,disableOutsideScroll:y,..._}=e,m=q1(be,o),g=Di(be,o),w=ib(o),$=NP(o),b=HU(o),[N,P]=f.useState(null),C=f.useRef(null),I=ue(t,C,m.onContentChange),T=f.useRef(0),D=f.useRef(""),Z=f.useRef(0),X=f.useRef(null),J=f.useRef("right"),K=f.useRef(0),oe=y?QN:f.Fragment,B=y?{as:GU,allowPinchZoom:!0}:void 0,Y=q=>{const re=D.current+q,$e=b().filter(G=>!G.disabled),Ae=document.activeElement,ie=$e.find(G=>G.ref.current===Ae)?.textValue,de=$e.map(G=>G.textValue),ot=iB(de,re,ie),Ze=$e.find(G=>G.textValue===ot)?.ref.current;(function G(kt){D.current=kt,window.clearTimeout(T.current),kt!==""&&(T.current=window.setTimeout(()=>G(""),1e3))})(re),Ze&&setTimeout(()=>Ze.focus())};f.useEffect(()=>()=>window.clearTimeout(T.current),[]),_j();const S=f.useCallback(q=>J.current===X.current?.side&&cB(q,X.current?.area),[]);return M.jsx(UU,{scope:o,searchRef:D,onItemEnter:f.useCallback(q=>{S(q)&&q.preventDefault()},[S]),onItemLeave:f.useCallback(q=>{S(q)||(C.current?.focus(),P(null))},[S]),onTriggerLeave:f.useCallback(q=>{S(q)&&q.preventDefault()},[S]),pointerGraceTimerRef:Z,onPointerGraceIntentChange:f.useCallback(q=>{X.current=q},[]),children:M.jsx(oe,{...B,children:M.jsx(CN,{asChild:!0,trapped:n,onMountAutoFocus:U(i,q=>{q.preventDefault(),C.current?.focus({preventScroll:!0})}),onUnmountAutoFocus:c,children:M.jsx(NN,{asChild:!0,disableOutsidePointerEvents:d,onEscapeKeyDown:s,onPointerDownOutside:u,onFocusOutside:h,onInteractOutside:k,onDismiss:p,children:M.jsx(GE,{asChild:!0,...$,dir:g.dir,orientation:"vertical",loop:a,currentTabStopId:N,onCurrentTabStopIdChange:P,onEntryFocus:U(l,q=>{g.isUsingKeyboardRef.current||q.preventDefault()}),preventScrollOnEntryFocus:!0,children:M.jsx(nP,{role:"menu","aria-orientation":"vertical","data-state":GP(m.open),"data-radix-menu-content":"",dir:g.dir,...w,..._,ref:I,style:{outline:"none",..._.style},onKeyDown:U(_.onKeyDown,q=>{const $e=q.target.closest("[data-radix-menu-content]")===q.currentTarget,Ae=q.ctrlKey||q.altKey||q.metaKey,ie=q.key.length===1;$e&&(q.key==="Tab"&&q.preventDefault(),!Ae&&ie&&Y(q.key));const de=C.current;if(q.target!==de||!qU.includes(q.key))return;q.preventDefault();const Ze=b().filter(G=>!G.disabled).map(G=>G.ref.current);bP.includes(q.key)&&Ze.reverse(),oB(Ze)}),onBlur:U(e.onBlur,q=>{q.currentTarget.contains(q.target)||(window.clearTimeout(T.current),D.current="")}),onPointerMove:U(e.onPointerMove,Hi(q=>{const re=q.target,$e=K.current!==q.clientX;if(q.currentTarget.contains(re)&&$e){const Ae=q.clientX>K.current?"right":"left";J.current=Ae,K.current=q.clientX}}))})})})})})})});CP.displayName=be;var WU="MenuGroup",iI=f.forwardRef((e,t)=>{const{__scopeMenu:o,...a}=e;return M.jsx(se.div,{role:"group",...a,ref:t})});iI.displayName=WU;var KU="MenuLabel",zP=f.forwardRef((e,t)=>{const{__scopeMenu:o,...a}=e;return M.jsx(se.div,{...a,ref:t})});zP.displayName=KU;var rb="MenuItem",AP="menu.itemSelect",cb=f.forwardRef((e,t)=>{const{disabled:o=!1,onSelect:a,...n}=e,i=f.useRef(null),c=Di(rb,e.__scopeMenu),d=oI(rb,e.__scopeMenu),l=ue(t,i),s=f.useRef(!1),u=()=>{const h=i.current;if(!o&&h){const k=new CustomEvent(AP,{bubbles:!0,cancelable:!0});h.addEventListener(AP,p=>a?.(p),{once:!0}),sj(h,k),k.defaultPrevented?s.current=!1:c.onClose()}};return M.jsx(jP,{...n,ref:l,disabled:o,onClick:U(e.onClick,u),onPointerDown:h=>{e.onPointerDown?.(h),s.current=!0},onPointerUp:U(e.onPointerUp,h=>{s.current||h.currentTarget?.click()}),onKeyDown:U(e.onKeyDown,h=>{const k=d.searchRef.current!=="";o||k&&h.key===" "||eI.includes(h.key)&&(h.currentTarget.click(),h.preventDefault())})})});cb.displayName=rb;var jP=f.forwardRef((e,t)=>{const{__scopeMenu:o,disabled:a=!1,textValue:n,...i}=e,c=oI(rb,o),d=NP(o),l=f.useRef(null),s=ue(t,l),[u,h]=f.useState(!1),[k,p]=f.useState("");return f.useEffect(()=>{const y=l.current;y&&p((y.textContent??"").trim())},[i.children]),M.jsx(qi.ItemSlot,{scope:o,disabled:a,textValue:n??k,children:M.jsx(WE,{asChild:!0,...d,focusable:!a,children:M.jsx(se.div,{role:"menuitem","data-highlighted":u?"":void 0,"aria-disabled":a||void 0,"data-disabled":a?"":void 0,...i,ref:s,onPointerMove:U(e.onPointerMove,Hi(y=>{a?c.onItemLeave(y):(c.onItemEnter(y),y.defaultPrevented||y.currentTarget.focus({preventScroll:!0}))})),onPointerLeave:U(e.onPointerLeave,Hi(y=>c.onItemLeave(y))),onFocus:U(e.onFocus,()=>h(!0)),onBlur:U(e.onBlur,()=>h(!1))})})})}),XU="MenuCheckboxItem",PP=f.forwardRef((e,t)=>{const{checked:o=!1,onCheckedChange:a,...n}=e;return M.jsx(VP,{scope:e.__scopeMenu,checked:o,children:M.jsx(cb,{role:"menuitemcheckbox","aria-checked":db(o)?"mixed":o,...n,ref:t,"data-state":cI(o),onSelect:U(n.onSelect,()=>a?.(db(o)?!0:!o),{checkForDefaultPrevented:!1})})})});PP.displayName=XU;var qP="MenuRadioGroup",[JU,YU]=P1(qP,{value:void 0,onValueChange:()=>{}}),DP=f.forwardRef((e,t)=>{const{value:o,onValueChange:a,...n}=e,i=et(a);return M.jsx(JU,{scope:e.__scopeMenu,value:o,onValueChange:i,children:M.jsx(iI,{...n,ref:t})})});DP.displayName=qP;var OP="MenuRadioItem",HP=f.forwardRef((e,t)=>{const{value:o,...a}=e,n=YU(OP,e.__scopeMenu),i=o===n.value;return M.jsx(VP,{scope:e.__scopeMenu,checked:i,children:M.jsx(cb,{role:"menuitemradio","aria-checked":i,...a,ref:t,"data-state":cI(i),onSelect:U(a.onSelect,()=>n.onValueChange?.(o),{checkForDefaultPrevented:!1})})})});HP.displayName=OP;var rI="MenuItemIndicator",[VP,QU]=P1(rI,{checked:!1}),RP=f.forwardRef((e,t)=>{const{__scopeMenu:o,forceMount:a,...n}=e,i=QU(rI,o);return M.jsx(j1,{present:a||db(i.checked)||i.checked===!0,children:M.jsx(se.span,{...n,ref:t,"data-state":cI(i.checked)})})});RP.displayName=rI;var eB="MenuSeparator",TP=f.forwardRef((e,t)=>{const{__scopeMenu:o,...a}=e;return M.jsx(se.div,{role:"separator","aria-orientation":"horizontal",...a,ref:t})});TP.displayName=eB;var tB="MenuArrow",FP=f.forwardRef((e,t)=>{const{__scopeMenu:o,...a}=e,n=ib(o);return M.jsx(oP,{...n,...a,ref:t})});FP.displayName=tB;var nB="MenuSub",[qme,EP]=P1(nB),Oi="MenuSubTrigger",UP=f.forwardRef((e,t)=>{const o=q1(Oi,e.__scopeMenu),a=Di(Oi,e.__scopeMenu),n=EP(Oi,e.__scopeMenu),i=oI(Oi,e.__scopeMenu),c=f.useRef(null),{pointerGraceTimerRef:d,onPointerGraceIntentChange:l}=i,s={__scopeMenu:e.__scopeMenu},u=f.useCallback(()=>{c.current&&window.clearTimeout(c.current),c.current=null},[]);return f.useEffect(()=>u,[u]),f.useEffect(()=>{const h=d.current;return()=>{window.clearTimeout(h),l(null)}},[d,l]),M.jsx(tI,{asChild:!0,...s,children:M.jsx(jP,{id:n.triggerId,"aria-haspopup":"menu","aria-expanded":o.open,"aria-controls":n.contentId,"data-state":GP(o.open),...e,ref:Li(t,n.onTriggerChange),onClick:h=>{e.onClick?.(h),!(e.disabled||h.defaultPrevented)&&(h.currentTarget.focus(),o.open||o.onOpenChange(!0))},onPointerMove:U(e.onPointerMove,Hi(h=>{i.onItemEnter(h),!h.defaultPrevented&&!e.disabled&&!o.open&&!c.current&&(i.onPointerGraceIntentChange(null),c.current=window.setTimeout(()=>{o.onOpenChange(!0),u()},100))})),onPointerLeave:U(e.onPointerLeave,Hi(h=>{u();const k=o.content?.getBoundingClientRect();if(k){const p=o.content?.dataset.side,y=p==="right",_=y?-5:5,m=k[y?"left":"right"],g=k[y?"right":"left"];i.onPointerGraceIntentChange({area:[{x:h.clientX+_,y:h.clientY},{x:m,y:k.top},{x:g,y:k.top},{x:g,y:k.bottom},{x:m,y:k.bottom}],side:p}),window.clearTimeout(d.current),d.current=window.setTimeout(()=>i.onPointerGraceIntentChange(null),300)}else{if(i.onTriggerLeave(h),h.defaultPrevented)return;i.onPointerGraceIntentChange(null)}})),onKeyDown:U(e.onKeyDown,h=>{const k=i.searchRef.current!=="";e.disabled||k&&h.key===" "||DU[a.dir].includes(h.key)&&(o.onOpenChange(!0),o.content?.focus(),h.preventDefault())})})})});UP.displayName=Oi;var BP="MenuSubContent",ZP=f.forwardRef((e,t)=>{const o=LP(be,e.__scopeMenu),{forceMount:a=o.forceMount,...n}=e,i=q1(be,e.__scopeMenu),c=Di(be,e.__scopeMenu),d=EP(BP,e.__scopeMenu),l=f.useRef(null),s=ue(t,l);return M.jsx(qi.Provider,{scope:e.__scopeMenu,children:M.jsx(j1,{present:a||i.open,children:M.jsx(qi.Slot,{scope:e.__scopeMenu,children:M.jsx(aI,{id:d.contentId,"aria-labelledby":d.triggerId,...n,ref:s,align:"start",side:c.dir==="rtl"?"left":"right",disableOutsidePointerEvents:!1,disableOutsideScroll:!1,trapFocus:!1,onOpenAutoFocus:u=>{c.isUsingKeyboardRef.current&&l.current?.focus(),u.preventDefault()},onCloseAutoFocus:u=>u.preventDefault(),onFocusOutside:U(e.onFocusOutside,u=>{u.target!==d.trigger&&i.onOpenChange(!1)}),onEscapeKeyDown:U(e.onEscapeKeyDown,u=>{c.onClose(),u.preventDefault()}),onKeyDown:U(e.onKeyDown,u=>{const h=u.currentTarget.contains(u.target),k=OU[c.dir].includes(u.key);h&&k&&(i.onOpenChange(!1),d.trigger?.focus(),u.preventDefault())})})})})})});ZP.displayName=BP;function GP(e){return e?"open":"closed"}function db(e){return e==="indeterminate"}function cI(e){return db(e)?"indeterminate":e?"checked":"unchecked"}function oB(e){const t=document.activeElement;for(const o of e)if(o===t||(o.focus(),document.activeElement!==t))return}function aB(e,t){return e.map((o,a)=>e[(t+a)%e.length])}function iB(e,t,o){const n=t.length>1&&Array.from(t).every(s=>s===t[0])?t[0]:t,i=o?e.indexOf(o):-1;let c=aB(e,Math.max(i,0));n.length===1&&(c=c.filter(s=>s!==o));const l=c.find(s=>s.toLowerCase().startsWith(n.toLowerCase()));return l!==o?l:void 0}function rB(e,t){const{x:o,y:a}=e;let n=!1;for(let i=0,c=t.length-1;i<t.length;c=i++){const d=t[i],l=t[c],s=d.x,u=d.y,h=l.x,k=l.y;u>a!=k>a&&o<(h-s)*(a-u)/(k-u)+s&&(n=!n)}return n}function cB(e,t){if(!t)return!1;const o={x:e.clientX,y:e.clientY};return rB(o,t)}function Hi(e){return t=>t.pointerType==="mouse"?e(t):void 0}var dB=IP,sB=tI,lB=SP,uB=CP,hB=iI,pB=zP,yB=cb,kB=PP,_B=DP,fB=HP,mB=RP,gB=TP,vB=FP,MB=UP,$B=ZP,sb="DropdownMenu",[wB]=Z1(sb,[xP]),ye=xP(),[bB,WP]=wB(sb),KP=e=>{const{__scopeDropdownMenu:t,children:o,dir:a,open:n,defaultOpen:i,onOpenChange:c,modal:d=!0}=e,l=ye(t),s=f.useRef(null),[u,h]=bN({prop:n,defaultProp:i??!1,onChange:c,caller:sb});return M.jsx(bB,{scope:t,triggerId:Vw(),triggerRef:s,contentId:Vw(),open:u,onOpenChange:h,onOpenToggle:f.useCallback(()=>h(k=>!k),[h]),modal:d,children:M.jsx(dB,{...l,open:u,onOpenChange:h,dir:a,modal:d,children:o})})};KP.displayName=sb;var XP="DropdownMenuTrigger",JP=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,disabled:a=!1,...n}=e,i=WP(XP,o),c=ye(o);return M.jsx(sB,{asChild:!0,...c,children:M.jsx(se.button,{type:"button",id:i.triggerId,"aria-haspopup":"menu","aria-expanded":i.open,"aria-controls":i.open?i.contentId:void 0,"data-state":i.open?"open":"closed","data-disabled":a?"":void 0,disabled:a,...n,ref:Li(t,i.triggerRef),onPointerDown:U(e.onPointerDown,d=>{!a&&d.button===0&&d.ctrlKey===!1&&(i.onOpenToggle(),i.open||d.preventDefault())}),onKeyDown:U(e.onKeyDown,d=>{a||(["Enter"," "].includes(d.key)&&i.onOpenToggle(),d.key==="ArrowDown"&&i.onOpenChange(!0),["Enter"," ","ArrowDown"].includes(d.key)&&d.preventDefault())})})})});JP.displayName=XP;var xB="DropdownMenuPortal",YP=e=>{const{__scopeDropdownMenu:t,...o}=e,a=ye(t);return M.jsx(lB,{...a,...o})};YP.displayName=xB;var QP="DropdownMenuContent",eq=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=WP(QP,o),i=ye(o),c=f.useRef(!1);return M.jsx(uB,{id:n.contentId,"aria-labelledby":n.triggerId,...i,...a,ref:t,onCloseAutoFocus:U(e.onCloseAutoFocus,d=>{c.current||n.triggerRef.current?.focus(),c.current=!1,d.preventDefault()}),onInteractOutside:U(e.onInteractOutside,d=>{const l=d.detail.originalEvent,s=l.button===0&&l.ctrlKey===!0,u=l.button===2||s;(!n.modal||u)&&(c.current=!0)}),style:{...e.style,"--radix-dropdown-menu-content-transform-origin":"var(--radix-popper-transform-origin)","--radix-dropdown-menu-content-available-width":"var(--radix-popper-available-width)","--radix-dropdown-menu-content-available-height":"var(--radix-popper-available-height)","--radix-dropdown-menu-trigger-width":"var(--radix-popper-anchor-width)","--radix-dropdown-menu-trigger-height":"var(--radix-popper-anchor-height)"}})});eq.displayName=QP;var NB="DropdownMenuGroup",IB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(hB,{...n,...a,ref:t})});IB.displayName=NB;var LB="DropdownMenuLabel",SB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(pB,{...n,...a,ref:t})});SB.displayName=LB;var CB="DropdownMenuItem",tq=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(yB,{...n,...a,ref:t})});tq.displayName=CB;var zB="DropdownMenuCheckboxItem",AB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(kB,{...n,...a,ref:t})});AB.displayName=zB;var jB="DropdownMenuRadioGroup",PB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(_B,{...n,...a,ref:t})});PB.displayName=jB;var qB="DropdownMenuRadioItem",DB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(fB,{...n,...a,ref:t})});DB.displayName=qB;var OB="DropdownMenuItemIndicator",HB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(mB,{...n,...a,ref:t})});HB.displayName=OB;var VB="DropdownMenuSeparator",RB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(gB,{...n,...a,ref:t})});RB.displayName=VB;var TB="DropdownMenuArrow",FB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(vB,{...n,...a,ref:t})});FB.displayName=TB;var EB="DropdownMenuSubTrigger",UB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx(MB,{...n,...a,ref:t})});UB.displayName=EB;var BB="DropdownMenuSubContent",ZB=f.forwardRef((e,t)=>{const{__scopeDropdownMenu:o,...a}=e,n=ye(o);return M.jsx($B,{...n,...a,ref:t,style:{...e.style,"--radix-dropdown-menu-content-transform-origin":"var(--radix-popper-transform-origin)","--radix-dropdown-menu-content-available-width":"var(--radix-popper-available-width)","--radix-dropdown-menu-content-available-height":"var(--radix-popper-available-height)","--radix-dropdown-menu-trigger-width":"var(--radix-popper-anchor-width)","--radix-dropdown-menu-trigger-height":"var(--radix-popper-anchor-height)"}})});ZB.displayName=BB;var GB=KP,WB=JP,KB=YP,XB=eq,JB=tq;function YB({...e}){return M.jsx(GB,{"data-slot":"dropdown-menu",...e})}function QB({...e}){return M.jsx(WB,{"data-slot":"dropdown-menu-trigger",...e})}function eZ({className:e,sideOffset:t=4,...o}){return M.jsx(KB,{children:M.jsx(XB,{"data-slot":"dropdown-menu-content",sideOffset:t,className:ae("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",e),...o})})}function tZ({className:e,inset:t,variant:o="default",...a}){return M.jsx(JB,{"data-slot":"dropdown-menu-item","data-inset":t,"data-variant":o,className:ae("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",e),...a})}function nZ({row:e,type:t,actionColumn:o,triggerEvent:a,locale:n,updateModel:i}){const c=(s,u)=>{u.stopPropagation(),a&&a(s,{row:e.original}),i&&i({triggeredRow:e.original})},d=o?.actions?.length===1,l=s=>{const u=s&&Ow[s]?Ow[s]:Ni;return M.jsx(u,{className:"w-5 h-5 text-inherit"})};if(e.original?.__empty)return null;if(d){const s=o?.actions[0];return M.jsx(dj,{variant:t||"default",size:"icon",className:ae("w-full min-w-8 h-full p-2 flex items-center gap-2",s?.className),onClick:u=>c(s.onClick,u),children:l(s.icon)})}return M.jsxs(YB,{children:[M.jsx(QB,{children:M.jsx(dj,{asChild:!0,size:"icon",variant:t||"default",className:"w-full h-full p-2 min-w-8 mx-auto",children:l(o?.icon||"MoreHorizontal")})}),M.jsx(eZ,{align:"end",className:"w-64",children:o?.actions?.map((s,u)=>M.jsxs(tZ,{className:ae("flex items-center gap-2 text-base font-semibold",s?.className),onClick:h=>c(s.onClick,h),children:[l(s.icon),s.title[n]]},u))})]})}var lb="Popover",[nq]=Z1(lb,[Xw]),Vi=Xw(),[oZ,yt]=nq(lb),oq=e=>{const{__scopePopover:t,children:o,open:a,defaultOpen:n,onOpenChange:i,modal:c=!1}=e,d=Vi(t),l=f.useRef(null),[s,u]=f.useState(!1),[h,k]=bN({prop:a,defaultProp:n??!1,onChange:i,caller:lb});return M.jsx(tP,{...d,children:M.jsx(oZ,{scope:t,contentId:Vw(),triggerRef:l,open:h,onOpenChange:k,onOpenToggle:f.useCallback(()=>k(p=>!p),[k]),hasCustomAnchor:s,onCustomAnchorAdd:f.useCallback(()=>u(!0),[]),onCustomAnchorRemove:f.useCallback(()=>u(!1),[]),modal:c,children:o})})};oq.displayName=lb;var aq="PopoverAnchor",aZ=f.forwardRef((e,t)=>{const{__scopePopover:o,...a}=e,n=yt(aq,o),i=Vi(o),{onCustomAnchorAdd:c,onCustomAnchorRemove:d}=n;return f.useEffect(()=>(c(),()=>d()),[c,d]),M.jsx(UN,{...i,...a,ref:t})});aZ.displayName=aq;var iq="PopoverTrigger",rq=f.forwardRef((e,t)=>{const{__scopePopover:o,...a}=e,n=yt(iq,o),i=Vi(o),c=ue(t,n.triggerRef),d=M.jsx(se.button,{type:"button","aria-haspopup":"dialog","aria-expanded":n.open,"aria-controls":n.contentId,"data-state":uq(n.open),...a,ref:c,onClick:U(e.onClick,n.onOpenToggle)});return n.hasCustomAnchor?d:M.jsx(UN,{asChild:!0,...i,children:d})});rq.displayName=iq;var dI="PopoverPortal",[iZ,rZ]=nq(dI,{forceMount:void 0}),cq=e=>{const{__scopePopover:t,forceMount:o,children:a,container:n}=e,i=yt(dI,t);return M.jsx(iZ,{scope:t,forceMount:o,children:M.jsx(j1,{present:o||i.open,children:M.jsx(BN,{asChild:!0,container:n,children:a})})})};cq.displayName=dI;var ti="PopoverContent",dq=f.forwardRef((e,t)=>{const o=rZ(ti,e.__scopePopover),{forceMount:a=o.forceMount,...n}=e,i=yt(ti,e.__scopePopover);return M.jsx(j1,{present:a||i.open,children:i.modal?M.jsx(dZ,{...n,ref:t}):M.jsx(sZ,{...n,ref:t})})});dq.displayName=ti;var cZ=Si("PopoverContent.RemoveScroll"),dZ=f.forwardRef((e,t)=>{const o=yt(ti,e.__scopePopover),a=f.useRef(null),n=ue(t,a),i=f.useRef(!1);return f.useEffect(()=>{const c=a.current;if(c)return uP(c)},[]),M.jsx(QN,{as:cZ,allowPinchZoom:!0,children:M.jsx(sq,{...e,ref:n,trapFocus:o.open,disableOutsidePointerEvents:!0,onCloseAutoFocus:U(e.onCloseAutoFocus,c=>{c.preventDefault(),i.current||o.triggerRef.current?.focus()}),onPointerDownOutside:U(e.onPointerDownOutside,c=>{const d=c.detail.originalEvent,l=d.button===0&&d.ctrlKey===!0,s=d.button===2||l;i.current=s},{checkForDefaultPrevented:!1}),onFocusOutside:U(e.onFocusOutside,c=>c.preventDefault(),{checkForDefaultPrevented:!1})})})}),sZ=f.forwardRef((e,t)=>{const o=yt(ti,e.__scopePopover),a=f.useRef(!1),n=f.useRef(!1);return M.jsx(sq,{...e,ref:t,trapFocus:!1,disableOutsidePointerEvents:!1,onCloseAutoFocus:i=>{e.onCloseAutoFocus?.(i),i.defaultPrevented||(a.current||o.triggerRef.current?.focus(),i.preventDefault()),a.current=!1,n.current=!1},onInteractOutside:i=>{e.onInteractOutside?.(i),i.defaultPrevented||(a.current=!0,i.detail.originalEvent.type==="pointerdown"&&(n.current=!0));const c=i.target;o.triggerRef.current?.contains(c)&&i.preventDefault(),i.detail.originalEvent.type==="focusin"&&n.current&&i.preventDefault()}})}),sq=f.forwardRef((e,t)=>{const{__scopePopover:o,trapFocus:a,onOpenAutoFocus:n,onCloseAutoFocus:i,disableOutsidePointerEvents:c,onEscapeKeyDown:d,onPointerDownOutside:l,onFocusOutside:s,onInteractOutside:u,...h}=e,k=yt(ti,o),p=Vi(o);return _j(),M.jsx(CN,{asChild:!0,loop:!0,trapped:a,onMountAutoFocus:n,onUnmountAutoFocus:i,children:M.jsx(NN,{asChild:!0,disableOutsidePointerEvents:c,onInteractOutside:u,onEscapeKeyDown:d,onPointerDownOutside:l,onFocusOutside:s,onDismiss:()=>k.onOpenChange(!1),children:M.jsx(nP,{"data-state":uq(k.open),role:"dialog",id:k.contentId,...p,...h,ref:t,style:{...h.style,"--radix-popover-content-transform-origin":"var(--radix-popper-transform-origin)","--radix-popover-content-available-width":"var(--radix-popper-available-width)","--radix-popover-content-available-height":"var(--radix-popper-available-height)","--radix-popover-trigger-width":"var(--radix-popper-anchor-width)","--radix-popover-trigger-height":"var(--radix-popper-anchor-height)"}})})})}),lq="PopoverClose",lZ=f.forwardRef((e,t)=>{const{__scopePopover:o,...a}=e,n=yt(lq,o);return M.jsx(se.button,{type:"button",...a,ref:t,onClick:U(e.onClick,()=>n.onOpenChange(!1))})});lZ.displayName=lq;var uZ="PopoverArrow",hZ=f.forwardRef((e,t)=>{const{__scopePopover:o,...a}=e,n=Vi(o);return M.jsx(oP,{...n,...a,ref:t})});hZ.displayName=uZ;function uq(e){return e?"open":"closed"}var pZ=oq,yZ=rq,kZ=cq,_Z=dq;function fZ({...e}){return M.jsx(pZ,{"data-slot":"popover",...e})}function mZ({...e}){return M.jsx(yZ,{"data-slot":"popover-trigger",...e})}function gZ({className:e,align:t="center",sideOffset:o=4,...a}){return M.jsx(kZ,{children:M.jsx(_Z,{"data-slot":"popover-content",align:t,sideOffset:o,className:ae("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",e),...a})})}function vZ(e){const t=new Date(e);if(isNaN(t.getTime()))return String(e);const o=String(t.getDate()).padStart(2,"0"),a=String(t.getMonth()+1).padStart(2,"0"),n=t.getFullYear();return`${o}-${a}-${n}`}function MZ(e){const t=new Date(e);if(isNaN(t.getTime()))return String(e);const o=String(t.getDate()).padStart(2,"0"),a=String(t.getMonth()+1).padStart(2,"0"),n=t.getFullYear(),i=String(t.getHours()).padStart(2,"0"),c=String(t.getMinutes()).padStart(2,"0");return`${o}-${a}-${n} ${i}:${c}`}function $Z(e){let t=e.replace(/\D/g,"");return t.startsWith("+998")&&(t=t.slice(4)),t.slice(0,9)}function wZ(e){const t=$Z(e);return t.length===0?"":[t.slice(0,2),t.slice(2,5),t.slice(5,7),t.slice(7,9)].filter(Boolean).join(" ")}const bZ=({value:e,type:t,triggerEvent:o,className:a})=>{const n=typeof e=="object"?JSON.stringify(e):String(e),i=ee.useRef(null),[c,d]=ee.useState(!1);if(ee.useEffect(()=>{const s=i.current;s&&d(s.scrollWidth>s.clientWidth)},[n]),e==null||typeof e=="number"&&isNaN(+e))return M.jsx(M.Fragment,{});const l=M.jsx("div",{ref:i,className:ae("truncate text-center max-w-[160px] md:max-w-[256px] lg:max-w-[320px] lg:text-start",a),children:xZ(n,t,o)});return c&&t!=="url"?M.jsxs(fZ,{children:[M.jsx(mZ,{className:"h-min max-w-40 md:max-w-64 lg:max-w-full lg:text-start",onClick:s=>s.stopPropagation(),title:n,children:l}),M.jsx(gZ,{onOpenAutoFocus:s=>s.preventDefault(),align:"center",className:"w-64 lg:w-80 break-words",children:n})]}):l},xZ=(e,t,o)=>{switch(t){case"text":return String(e);case"url":const[a,n]=String(e).split("|||");return M.jsx("div",{className:"text-primary underline cursor-pointer select-none",onClick:i=>{i.stopPropagation(),o&&o("onRedirect",{url:n})},children:a});case"phone":return wZ(String(e));case"date":return vZ(e);case"datetime":return MZ(e);case"currency":return Number(e).toLocaleString("uz-UZ");default:return String(e)}};oj.omit({rowSelectionAction:!0,tableData:!0,limit:!0,max_count:!0,styles:!0,onModelChange:!0});function NZ({schema:e,indexColumn:t,actionColumn:o,updateModel:a,locale:n,triggerEvent:i}){const c=[];t?.enable&&c.push({id:"index",header:"№",meta:{size:ft.xs},cell:({row:s})=>M.jsx("span",{className:t?.className,children:s.index+1})});const d=Object.entries(e).map(([s,u])=>{const{size:h=ft.md,title:k,className:p}=u,y=k?k[n]:s[0].toUpperCase()+s.slice(1);return{accessorKey:s,header:y,meta:{headerText:y,size:h},cell:m=>M.jsx(bZ,{value:m.getValue(),type:u.type||"text",triggerEvent:i,className:p})}}).filter(Boolean),l=[];return o?.enable&&o.actions.length>0&&l.push({id:"actions",header:"",meta:{size:ft.xs},cell:({row:s})=>M.jsx(nZ,{updateModel:a,type:o.type,triggerEvent:i,row:s,locale:n,actionColumn:o})}),[...c,...d,...l]}function IZ(e){try{return oj.parse(e),{success:!0}}catch(t){return console.error(t),t instanceof z.ZodError?{success:!1,error:t.issues.map(a=>a.message).join(`
-`)}:{success:!1,error:t}}}function LZ({className:e,...t}){return M.jsx("div",{"data-slot":"card",className:ae("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",e),...t})}function SZ({className:e,...t}){return M.jsx("div",{"data-slot":"card-header",className:ae("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",e),...t})}function CZ({className:e,...t}){return M.jsx("div",{"data-slot":"card-content",className:ae("px-6",e),...t})}const zZ={info:{text:"text-blue-700",border:"border-blue-300",bg:"bg-blue-100/50",defaultIcon:"ℹ️"},warning:{text:"text-yellow-800",border:"border-yellow-300",bg:"bg-yellow-100/50",defaultIcon:"⚠️"},error:{text:"text-red-700",border:"border-red-400",bg:"bg-red-100/30",defaultIcon:"❌"},success:{text:"text-green-700",border:"border-green-300",bg:"bg-green-100/50",defaultIcon:"✅"}},AZ=({title:e,message:t,variant:o="info",icon:a,className:n=""})=>{const i=zZ[o];return M.jsxs(LZ,{className:`mx-auto max-w-md mt-8 w-full h-full flex flex-col justify-center border ${i.border} ${i.bg} ${n}`,children:[M.jsxs(SZ,{className:`flex items-center gap-2 font-semibold ${i.text}`,children:[a??i.defaultIcon,M.jsx("span",{children:e??o.charAt(0).toUpperCase()+o.slice(1)})]}),M.jsx(CZ,{className:`whitespace-normal break-words ${i.text}`,children:t})]})};function jZ(e){const{schema:t,rowSelectionAction:o,actionColumn:a,indexColumn:n,tableData:i,max_count:c=Ki,styles:d,limit:l=Ki,conditionalRowStyles:s,locale:u,updateModel:h=()=>{},triggerEvent:k=()=>{},onModelChange:p=()=>{}}=e,y=IZ(e),[_,m]=ee.useState(0),[g,w]=ee.useState(!0),[$,b]=ee.useState(i||[]),N=ee.useMemo(()=>{const D=$||[],Z=l-D.length;if(Z>0){const X=Object.fromEntries(Object.keys(t).map(K=>[K,void 0])),J=Array.from({length:Z},()=>({__empty:!0,...X}));return[...D,...J]}return D},[$,l,t]),P=ee.useCallback(()=>{const D=[],Z=[];return n?.enable&&n?.pin&&(n?.pin===Xe.left?D.push("index"):n?.pin===Xe.right&&Z.push("index")),a?.enable&&a?.pin&&a?.actions?.length>0&&(a?.pin===Xe.left?D.push("actions"):a?.pin===Xe.right&&Z.push("actions")),{left:D,right:Z}},[n,a]),C=NZ({schema:t,indexColumn:n,actionColumn:a,updateModel:h,triggerEvent:k,locale:u}),I=tD({data:N,columns:C,getCoreRowModel:Jq(),state:{columnPinning:P()},manualSorting:!0}),T=(D,Z)=>{if(!D||!g||!Z.isIntersecting||$?.length<_*l)return;const X=_+1;m(X),k("onLoadMore",{page:X,limit:l})};return ee.useEffect(()=>{_*l>=c&&w(!1)},[_,l,c]),ee.useEffect(()=>{$?.length>0&&p(D=>{D?.data?.length>0&&D.data!==$&&b(D.data||[])})},[$]),y.success?M.jsxs("main",{className:ae("max-h-[40rem] md:max-h-[48rem] lg:max-h-[56rem] flex flex-col gap-2 overflow-auto font-sans relative ",g&&"pb-2",d?.container),style:{...d?.variables},children:[M.jsxs(ED,{className:ae("w-full min-w-80 h-full table-auto border-collapse",d?.table),children:[M.jsx(ST,{styles:d?.head,table:I}),M.jsx(JD,{rowSelectionAction:o,updateModel:h,triggerEvent:k,styles:d?.body,table:I,conditionalRowStyles:s})]}),g&&M.jsx(vq,{triggerOnce:!1,as:"div",threshold:0,rootMargin:"200px 0px",onChange:(D,Z)=>T(D,Z),className:"h-10 text-muted-foreground relative flex justify-center items-center",children:M.jsx(Ii,{className:"animate-spin "})})]}):M.jsx(AZ,{message:typeof y.error=="string"?y.error:"Table configuration is invalid. Check the errors above.",variant:"error"})}Ge.ClientTable=jZ,Object.defineProperty(Ge,Symbol.toStringTag,{value:"Module"})}));
+`)}:{success:!1,error:t}}}function LZ({className:e,...t}){return M.jsx("div",{"data-slot":"card",className:ae("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",e),...t})}function SZ({className:e,...t}){return M.jsx("div",{"data-slot":"card-header",className:ae("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",e),...t})}function CZ({className:e,...t}){return M.jsx("div",{"data-slot":"card-content",className:ae("px-6",e),...t})}const zZ={info:{text:"text-blue-700",border:"border-blue-300",bg:"bg-blue-100/50",defaultIcon:"ℹ️"},warning:{text:"text-yellow-800",border:"border-yellow-300",bg:"bg-yellow-100/50",defaultIcon:"⚠️"},error:{text:"text-red-700",border:"border-red-400",bg:"bg-red-100/30",defaultIcon:"❌"},success:{text:"text-green-700",border:"border-green-300",bg:"bg-green-100/50",defaultIcon:"✅"}},AZ=({title:e,message:t,variant:o="info",icon:a,className:n=""})=>{const i=zZ[o];return M.jsxs(LZ,{className:`mx-auto max-w-md mt-8 w-full h-full flex flex-col justify-center border ${i.border} ${i.bg} ${n}`,children:[M.jsxs(SZ,{className:`flex items-center gap-2 font-semibold ${i.text}`,children:[a??i.defaultIcon,M.jsx("span",{children:e??o.charAt(0).toUpperCase()+o.slice(1)})]}),M.jsx(CZ,{className:`whitespace-normal break-words ${i.text}`,children:t})]})};function jZ(e){const{schema:t,rowSelectionAction:o,actionColumn:a,indexColumn:n,tableData:i,max_count:c=Ki,styles:d,limit:l=Ki,conditionalRowStyles:s,locale:u,updateModel:h=()=>{},triggerEvent:k=()=>{},onModelChange:p=()=>{}}=e,y=IZ(e),[_,m]=ee.useState(0),[g,w]=ee.useState(!0),[$,b]=ee.useState(i||[]),N=ee.useMemo(()=>{const D=$||[],Z=l-D.length;if(Z>0){const X=Object.fromEntries(Object.keys(t).map(K=>[K,void 0])),J=Array.from({length:Z},()=>({__empty:!0,...X}));return[...D,...J]}return D},[$,l,t]),P=ee.useCallback(()=>{const D=[],Z=[];return n?.enable&&n?.pin&&(n?.pin===Xe.left?D.push("index"):n?.pin===Xe.right&&Z.push("index")),a?.enable&&a?.pin&&a?.actions?.length>0&&(a?.pin===Xe.left?D.push("actions"):a?.pin===Xe.right&&Z.push("actions")),{left:D,right:Z}},[n,a]),C=NZ({schema:t,indexColumn:n,actionColumn:a,updateModel:h,triggerEvent:k,locale:u}),I=tD({data:N,columns:C,getCoreRowModel:Jq(),state:{columnPinning:P()},manualSorting:!0}),T=(D,Z)=>{if(!D||!g||!Z.isIntersecting||$?.length<_*l)return;const X=_+1;m(X),k("onLoadMore",{page:X,limit:l})};return ee.useEffect(()=>{_*l>=c&&w(!1)},[_,l,c]),ee.useEffect(()=>{$?.length>0&&p(D=>{Array.isArray(D?.data)&&D.data!==$&&b(D.data||[])})},[$]),y.success?M.jsxs("main",{className:ae("max-h-[40rem] md:max-h-[48rem] lg:max-h-[56rem] flex flex-col gap-2 overflow-auto font-sans relative ",g&&"pb-2",d?.container),style:{...d?.variables},children:[M.jsxs(ED,{className:ae("w-full min-w-80 h-full table-auto border-collapse",d?.table),children:[M.jsx(ST,{styles:d?.head,table:I}),M.jsx(JD,{rowSelectionAction:o,updateModel:h,triggerEvent:k,styles:d?.body,table:I,conditionalRowStyles:s})]}),g&&M.jsx(vq,{triggerOnce:!1,as:"div",threshold:0,rootMargin:"200px 0px",onChange:(D,Z)=>T(D,Z),className:"h-10 text-muted-foreground relative flex justify-center items-center",children:M.jsx(Ii,{className:"animate-spin "})})]}):M.jsx(AZ,{message:typeof y.error=="string"?y.error:"Table configuration is invalid. Check the errors above.",variant:"error"})}Ge.ClientTable=jZ,Object.defineProperty(Ge,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamprodevs/appsmith-custom-table",
-  "version": "1.1.4",
+  "version": "1.1.5",
   "type": "module",
   "private": false,
   "keywords": [