@opengis/admin 0.3.24 → 0.3.26

package/server/helpers/core/select.js

@@ -1,48 +1,48 @@
-import { getPG, getSelect } from "@opengis/fastify-table/utils.js";
-const pg = getPG();
-
-export default async function select(ids, options) {
-  if (!ids || (Array.isArray(ids) && ids.length === 0) || ids === '') {
-    return '';
-  }
-
-  const data = options.hash?.data;
-  if (!data && data !== false && data !== 0) return '';
-  try {
-    const idsArray = Array.isArray(ids) ? ids : [ids];
-
-    const classifier = await getSelect(data);
-
-
-
-    if (!classifier) return `Не знайдено класифікатор ${data}`;
-
-    const arr = classifier.arr || []
-    if (classifier.sql && typeof classifier.sql === 'string') {
-
-
-
-      const metaQuery = `SELECT * FROM (${classifier.sql})q LIMIT 0`;
-      const meta = await pg.query(metaQuery);
-      const idColumn = meta.fields[0].name;
-      const textColumn = meta.fields[1].name;
-
-      const sql = `SELECT "${idColumn}" AS id, "${textColumn}" AS text FROM (${classifier.sql}) q WHERE "${idColumn}" = ANY($1::text[])`;
-      const values = [idsArray.map(id => String(id))];
-
-      const { rows } = await pg.query(sql, values);
-      Object.assign(arr, rows)
-
-    }
-    if (!arr.length) return idsArray
-
-    const results = idsArray.map(id => {
-      const result = arr.find(el => String(el.id) == String(id));
-      return result ? result.text : '';
-    });
-
-    return results.filter(Boolean).join(', ');
-  } catch (error) {
-    return `Сталася помилка.<!-- err: ${error.toString()} -->`;
-  }
-}
+import { getPG, getSelect } from "@opengis/fastify-table/utils.js";
+const pg = getPG();
+
+export default async function select(ids, options) {
+  if (!ids || (Array.isArray(ids) && ids.length === 0) || ids === '') {
+    return '';
+  }
+
+  const data = options.hash?.data;
+  if (!data && data !== false && data !== 0) return '';
+  try {
+    const idsArray = Array.isArray(ids) ? ids : [ids];
+
+    const classifier = await getSelect(data);
+
+
+
+    if (!classifier) return `Не знайдено класифікатор ${data}`;
+
+    const arr = classifier.arr || []
+    if (classifier.sql && typeof classifier.sql === 'string') {
+
+
+
+      const metaQuery = `SELECT * FROM (${classifier.sql})q LIMIT 0`;
+      const meta = await pg.query(metaQuery);
+      const idColumn = meta.fields[0].name;
+      const textColumn = meta.fields[1].name;
+
+      const sql = `SELECT "${idColumn}" AS id, "${textColumn}" AS text FROM (${classifier.sql}) q WHERE "${idColumn}" = ANY($1::text[])`;
+      const values = [idsArray.map(id => String(id))];
+
+      const { rows } = await pg.query(sql, values);
+      Object.assign(arr, rows)
+
+    }
+    if (!arr.length) return idsArray
+
+    const results = idsArray.map(id => {
+      const result = arr.find(el => String(el.id) == String(id));
+      return result ? result.text : '';
+    });
+
+    return results.filter(Boolean).join(', ');
+  } catch (error) {
+    return `Сталася помилка.<!-- err: ${error.toString()} -->`;
+  }
+}

package/server/helpers/core/token.js

@@ -1,19 +1,19 @@
-import { setToken } from "@opengis/fastify-table/utils.js";
-
-export default function token(params) {
-
-    const { data, hash } = params;
-
-    if (!data?.root?.user?.uid && !hash.uid) return '-';
-    if (!hash || typeof hash !== 'object') return '-';
-
-    // const id = hash?.edit ? hash?.id : data?.root?.id;
-    // console.log(hash)
-    const [token] = setToken({
-        ids: [JSON.stringify(hash)],
-
-        uid: data?.root?.user?.uid || hash.uid,
-        array: 1,
-    });
-    return token;
+import { setToken } from "@opengis/fastify-table/utils.js";
+
+export default function token(params) {
+
+    const { data, hash } = params;
+
+    if (!data?.root?.user?.uid && !hash.uid) return '-';
+    if (!hash || typeof hash !== 'object') return '-';
+
+    // const id = hash?.edit ? hash?.id : data?.root?.id;
+    // console.log(hash)
+    const [token] = setToken({
+        ids: [JSON.stringify(hash)],
+
+        uid: data?.root?.user?.uid || hash.uid,
+        array: 1,
+    });
+    return token;
 }

package/server/helpers/index.js

@@ -1,40 +1,40 @@
-
-import { handlebars, handlebarsSync } from "@opengis/fastify-table/utils.js";
-
-import token from "./core/token.js";
-import descriptionList from "./list/descriptionList.js";
-import tableList from "./list/tableList.js";
-import buttonHelper from "./core/buttonHelper.js";
-import select from "./core/select.js";
-import badge from "./core/badge.js";
-import coalesce from "./core/coalesce.js";
-import mdToHTML from "./utils/mdToHTML.js";
-
-
-import ifCond from "./temp/ifCond.js";
-import contentList from "./temp/contentList.js";
-import paddingNumber from './utils/paddingNumber.js';
-
-
-
-export default async function route() {
-
-    handlebars.registerHelper('token', token);
-    handlebars.registerHelper('mdToHTML', mdToHTML);
-    handlebars.registerHelper('descriptionList', descriptionList);
-    handlebars.registerHelper('tableList', tableList);
-    handlebars.registerHelper('button', buttonHelper);
-    handlebars.registerHelper('select', select);
-    handlebars.registerHelper('badge', badge);
-    handlebars.registerHelper('contentList', contentList);
-    handlebarsSync.registerHelper('ifCond', ifCond);
-    handlebarsSync.registerHelper('button', buttonHelper);
-    handlebars.registerHelper('ifCond', ifCond);
-    handlebars.registerHelper('empty', () => { });
-    handlebarsSync.registerHelper('empty', () => { });
-    handlebars.registerHelper('coalesce', coalesce);
-    handlebarsSync.registerHelper('coalesce', coalesce);
-
-    handlebarsSync.registerHelper('paddingNumber', paddingNumber);
-    handlebars.registerHelper('paddingNumber', paddingNumber);
-}
+
+import { handlebars, handlebarsSync } from "@opengis/fastify-table/utils.js";
+
+import token from "./core/token.js";
+import descriptionList from "./list/descriptionList.js";
+import tableList from "./list/tableList.js";
+import buttonHelper from "./core/buttonHelper.js";
+import select from "./core/select.js";
+import badge from "./core/badge.js";
+import coalesce from "./core/coalesce.js";
+import mdToHTML from "./utils/mdToHTML.js";
+
+
+import ifCond from "./temp/ifCond.js";
+import contentList from "./temp/contentList.js";
+import paddingNumber from './utils/paddingNumber.js';
+
+
+
+export default async function route() {
+
+    handlebars.registerHelper('token', token);
+    handlebars.registerHelper('mdToHTML', mdToHTML);
+    handlebars.registerHelper('descriptionList', descriptionList);
+    handlebars.registerHelper('tableList', tableList);
+    handlebars.registerHelper('button', buttonHelper);
+    handlebars.registerHelper('select', select);
+    handlebars.registerHelper('badge', badge);
+    handlebars.registerHelper('contentList', contentList);
+    handlebarsSync.registerHelper('ifCond', ifCond);
+    handlebarsSync.registerHelper('button', buttonHelper);
+    handlebars.registerHelper('ifCond', ifCond);
+    handlebars.registerHelper('empty', () => { });
+    handlebarsSync.registerHelper('empty', () => { });
+    handlebars.registerHelper('coalesce', coalesce);
+    handlebarsSync.registerHelper('coalesce', coalesce);
+
+    handlebarsSync.registerHelper('paddingNumber', paddingNumber);
+    handlebars.registerHelper('paddingNumber', paddingNumber);
+}

package/server/helpers/list/buttonHelper.js

@@ -1,21 +1,21 @@
-import buttonAdd from "../utils/buttonAdd.js";
-import buttonDel from "../utils/buttonDel.js";
-import buttonEdit from "../utils/buttonEdit.js";
-import button from "../utils/button.js";
-export default function buttonHelper(data, opt) {
-  const { hash } = opt;
-
-  // console.log(params)
-
-  if (!hash.token) return "token empty";
-  if (hash.add) {
-    return buttonAdd(hash.token, hash.title);
-  }
-  if (hash.del) {
-    return buttonDel(hash.token, hash.title);
-  }
-  if (hash.edit) {
-    return buttonEdit(hash.token, hash.title);
-  }
-  return button(hash.token, hash.title);
-}
+import buttonAdd from "../utils/buttonAdd.js";
+import buttonDel from "../utils/buttonDel.js";
+import buttonEdit from "../utils/buttonEdit.js";
+import button from "../utils/button.js";
+export default function buttonHelper(data, opt) {
+  const { hash } = opt;
+
+  // console.log(params)
+
+  if (!hash.token) return "token empty";
+  if (hash.add) {
+    return buttonAdd(hash.token, hash.title);
+  }
+  if (hash.del) {
+    return buttonDel(hash.token, hash.title);
+  }
+  if (hash.edit) {
+    return buttonEdit(hash.token, hash.title);
+  }
+  return button(hash.token, hash.title);
+}

package/server/helpers/list/descriptionList.js

@@ -1,46 +1,46 @@
-import { config, handlebarsSync, handlebars } from '@opengis/fastify-table/utils.js'
-
-async function format(d, key, data) {
-
-    if (!key?.includes) return '';
-    if (d === true) return 'Так';
-    if (d === false) return 'Ні';
-
-    if (key.includes('{{')) {
-        return await handlebars.compile(key)(data);
-    }
-
-    return d;
-}
-export default async function descriptionList(data, opt) {
-    const { hash } = opt;
-
-    // no data
-    if (hash.nodata && !data) {
-        const noDataText = typeof hash.nodata == 'string' ? hash.nodata : '<div class="bg-gray-200 text-center p-6 rounded-xl"><h3 class="text-lg font-semibold">Інформація відсутня</h3></div>';
-        return noDataText
-    }
-    if (!hash.columns) return 'columns empty'
-    const keys = hash.columns.split(hash.divider || ',').map(el => hash.comma ? el.trim().replace(new RegExp(hash.comma || '#', 'g'), ',') : el.trim());
-
-    const result = [];
-
-    for (let i = 0; i < keys.length; i += 2) {
-        const name = keys[i];
-        const nameHBS = name.includes('{{') ? await handlebars.compile(name)({ ...data, hash }) : false;
-
-        if (!nameHBS && name.includes('{{')) continue;
-
-        const key = keys[i + 1];
-
-        const d1 = await format(data[key], key, data) || '-';
-
-        result.push(`<div class="grid grid-cols-1 gap-1 py-3 sm:grid-cols-3 sm:gap-4 even:bg-gray-50">
-            <dt class="text-gray-900">${nameHBS || name}</dt>
-            <dd class="text-gray-700 sm:col-span-2">${d1}</dd>
-            </div>
-        `);
-
-    }
-    return '<dl class=" divide-y divide-gray-100 py-[5px]">' + result.join('') + '</dl>';
+import { config, handlebarsSync, handlebars } from '@opengis/fastify-table/utils.js'
+
+async function format(d, key, data) {
+
+    if (!key?.includes) return '';
+    if (d === true) return 'Так';
+    if (d === false) return 'Ні';
+
+    if (key.includes('{{')) {
+        return await handlebars.compile(key)(data);
+    }
+
+    return d;
+}
+export default async function descriptionList(data, opt) {
+    const { hash } = opt;
+
+    // no data
+    if (hash.nodata && !data) {
+        const noDataText = typeof hash.nodata == 'string' ? hash.nodata : '<div class="bg-gray-200 text-center p-6 rounded-xl"><h3 class="text-lg font-semibold">Інформація відсутня</h3></div>';
+        return noDataText
+    }
+    if (!hash.columns) return 'columns empty'
+    const keys = hash.columns.split(hash.divider || ',').map(el => hash.comma ? el.trim().replace(new RegExp(hash.comma || '#', 'g'), ',') : el.trim());
+
+    const result = [];
+
+    for (let i = 0; i < keys.length; i += 2) {
+        const name = keys[i];
+        const nameHBS = name.includes('{{') ? await handlebars.compile(name)({ ...data, hash }) : false;
+
+        if (!nameHBS && name.includes('{{')) continue;
+
+        const key = keys[i + 1];
+
+        const d1 = await format(data[key], key, data) || '-';
+
+        result.push(`<div class="grid grid-cols-1 gap-1 py-3 sm:grid-cols-3 sm:gap-4 even:bg-gray-50 text-[12px]">
+            <dt class="text-gray-900">${nameHBS || name}</dt>
+            <dd class="text-gray-700 sm:col-span-2">${d1}</dd>
+            </div>
+        `);
+
+    }
+    return '<dl class=" divide-y divide-gray-100 py-[5px]">' + result.join('') + '</dl>';
 }

package/server/helpers/list/tableList.js

@@ -1,83 +1,83 @@
-import { handlebarsSync, setToken, handlebars } from '@opengis/fastify-table/utils.js'
-
-import buttonEdit from './utils/buttonEdit.js';
-import buttonDel from './utils/buttonDel.js';
-
-function format(d, key, data, hash) {
-    if (!key?.includes) return '';
-    if (d === true) return 'Так';
-    if (d === false) return 'Ні';
-    if (key === 'actions') {
-        return `<div class="flex items-center gap-2">${(hash.form ? buttonEdit(d, 'Редагувати') : '') + buttonDel(d)}</div>`
-    }
-    if (key.startsWith('{{')) {
-        return handlebars.compile(key)(data);
-    } else if (key.startsWith('{{') && key.includes(' ') && !(key.match(/\{\{([^\s]+)/)?.[1] in handlebars.helpers)) {
-        return null;
-    }
-    if (!d) return '-';
-    return d;
-}
-export default async function tableList(data, opt) {
-    const { hash } = opt;
-    // no data
-    // const time = Date.now();
-    if (hash.nodata && !data?.length) {
-        const noDataText = typeof hash.nodata == 'string' ? hash.nodata : '<div class="bg-gray-200 text-center p-6 rounded-xl"><h3 class="text-lg font-semibold">Інформація відсутня</h3></div>';
-        return noDataText
-    }
-    if (!hash.columns) return 'columns empty'
-    const keys = hash.columns.split(hash.divider || ',').map(el => hash.comma ? el.trim().replace(new RegExp(hash.comma, 'g'), ',') : el.trim()).concat(hash.uid && hash.table && hash.id && !hash.noactions ? ['Дії', 'actions'] : []);
-
-    const result = [];
-    result.push('<thead class="text-left"> <tr>');
-
-    // thead 
-    const skip = {}
-    for (let i = 0; i < keys.length; i += 2) {
-        const name = keys[i];
-
-        // check hbs 
-        if (name.includes('{{')) {
-            console.log(hash)
-        }
-        const nameHBS = name.includes('{{') ? handlebarsSync.compile(name)({ ...data, hash }) : false;
-        // console.log(name, data, nameHBS)
-        skip[name] = name.includes('{{') && !nameHBS;
-        if (skip[name]) continue;
-
-        result.push(`<th class="whitespace-nowrap py-3 font-medium text-gray-900 ">
-                    ${nameHBS || name}
-        </th>`)
-    }
-    result.push('</tr></thead><tbody class="divide-y divide-gray-200">');
-
-    // body 
-    for (let k = 0; k < data.length; k += 1) {
-        const row = data[k];
-        result.push('<tr>');
-        const obj = { form: hash.form, table: hash.table, id: row[hash.id] }
-        const token = hash.table ? setToken({ ids: [JSON.stringify(obj)], uid: hash.uid, array: 1 })[0] : null;
-        for (let i = 0; i < keys.length; i += 2) {
-
-            const name = keys[i];
-            const key = keys[i + 1];
-            if (!key) continue;
-            if (skip[name]) continue;
-
-            const tokenData = key == 'actions' ? token : null;
-            const d1 = key.includes('{{') ? await handlebars.compile(key)({ ...row, token, hash }) || '-' : null
-            result.push(`<td class="whitespace-nowrap py-2 text-gray-900">
-                               ${d1 || format(tokenData || row[key], key, row, hash)}
-                            </td>`);
-
-        }
-        // action token 
-
-        result.push('</tr>');
-    }
-    result.push('</tbody>');
-
-    //    console.log(Date.now() - time)
-    return '<table class="min-w-full divide-y-2 divide-gray-200 bg-white min-w-full divide-y-2 divide-gray-200 bg-white "> ' + result.join('') + '</table>';
+import { handlebarsSync, setToken, handlebars } from '@opengis/fastify-table/utils.js'
+
+import buttonEdit from './utils/buttonEdit.js';
+import buttonDel from './utils/buttonDel.js';
+
+function format(d, key, data, hash) {
+    if (!key?.includes) return '';
+    if (d === true) return 'Так';
+    if (d === false) return 'Ні';
+    if (key === 'actions') {
+        return `<div class="flex items-center gap-2">${(hash.form ? buttonEdit(d, 'Редагувати') : '') + buttonDel(d)}</div>`
+    }
+    if (key.startsWith('{{')) {
+        return handlebars.compile(key)(data);
+    } else if (key.startsWith('{{') && key.includes(' ') && !(key.match(/\{\{([^\s]+)/)?.[1] in handlebars.helpers)) {
+        return null;
+    }
+    if (!d) return '-';
+    return d;
+}
+export default async function tableList(data, opt) {
+    const { hash } = opt;
+    // no data
+    // const time = Date.now();
+    if (hash.nodata && !data?.length) {
+        const noDataText = typeof hash.nodata == 'string' ? hash.nodata : '<div class="bg-gray-200 text-center p-6 rounded-xl"><h3 class="text-lg font-semibold">Інформація відсутня</h3></div>';
+        return noDataText
+    }
+    if (!hash.columns) return 'columns empty'
+    const keys = hash.columns.split(hash.divider || ',').map(el => hash.comma ? el.trim().replace(new RegExp(hash.comma, 'g'), ',') : el.trim()).concat(hash.uid && hash.table && hash.id && !hash.noactions ? ['Дії', 'actions'] : []);
+
+    const result = [];
+    result.push('<thead class="text-left font-medium text-gray-700"> <tr>');
+
+    // thead 
+    const skip = {}
+    for (let i = 0; i < keys.length; i += 2) {
+        const name = keys[i];
+
+        // check hbs 
+        if (name.includes('{{')) {
+            console.log(hash)
+        }
+        const nameHBS = name.includes('{{') ? handlebarsSync.compile(name)({ ...data, hash }) : false;
+        // console.log(name, data, nameHBS)
+        skip[name] = name.includes('{{') && !nameHBS;
+        if (skip[name]) continue;
+
+        result.push(`<th class="py-2">
+                    ${nameHBS || name}
+        </th>`)
+    }
+    result.push('</tr></thead><tbody class="divide-y divide-gray-200">');
+
+    // body 
+    for (let k = 0; k < data.length; k += 1) {
+        const row = data[k];
+        result.push('<tr class="odd:bg-gray-50">');
+        const obj = { form: hash.form, table: hash.table, id: row[hash.id] }
+        const token = hash.table ? setToken({ ids: [JSON.stringify(obj)], uid: hash.uid, array: 1 })[0] : null;
+        for (let i = 0; i < keys.length; i += 2) {
+
+            const name = keys[i];
+            const key = keys[i + 1];
+            if (!key) continue;
+            if (skip[name]) continue;
+
+            const tokenData = key == 'actions' ? token : null;
+            const d1 = key.includes('{{') ? await handlebars.compile(key)({ ...row, token, hash }) || '-' : null
+            result.push(`<td class="py-2 pr-5">
+                               ${d1 || format(tokenData || row[key], key, row, hash)}
+                            </td>`);
+
+        }
+        // action token 
+
+        result.push('</tr>');
+    }
+    result.push('</tbody>');
+
+    //    console.log(Date.now() - time)
+    return '<table class="min-w-full divide-y-2 divide-gray-200 bg-white min-w-full divide-y-2 divide-gray-200 bg-white text-[12px] text-gray-600">' + result.join('') + '</table>';
 }

package/server/helpers/list/utils/buttonDel.js

@@ -1,13 +1,13 @@
-// export default function button(token, title) {
-//     return `<button onclick="window.v3plugin.$api({ api: '/api/table/${token}', method:'delete',confirm: { title:'Підтвердити операцію',  text: 'Ви впевнені що хочете вилучити запис?', cancel: 'Скасувати', confirm : 'Виконати'} })"
-//     class="inline-flex items-center px-2 py-1 text-sm font-medium text-white duration-300 bg-red-600 border border-transparent rounded-lg gap-x-2 hover:bg-red-700 hover:text-white">${title || 'Вилучити'}</button>`;
-// }
-
-
-const newColor = 'red'
-export default function button(token, title) {
-    return `<button onclick="window.v3plugin.$api({ api: '/api/table/${token}', method:'delete',confirm: { title:'Підтвердити операцію',  text: 'Ви впевнені що хочете вилучити запис?', cancel: 'Скасувати', confirm : 'Виконати'} })"
-    class="group px-2 py-1 inline-flex border-solid justify-center items-center gap-2 rounded-md font-semibold focus:outline-none text-sm transition-all border border-transparent hover:text-white ring-offset-white bg-${newColor}-100 text-${newColor}-100 hover:bg-${newColor}-500 focus:ring-${newColor}-500">
-    <svg  class="group-hover:fill-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" width="15" height="15" fill="#ef4444"><path d="M135.2 17.7L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-7.2-14.3C307.4 6.8 296.3 0 284.2 0L163.8 0c-12.1 0-23.2 6.8-28.6 17.7zM416 128L32 128 53.2 467c1.6 25.3 22.6 45 47.9 45l245.8 0c25.3 0 46.3-19.7 47.9-45L416 128z"/></svg>
-    </button>`;
+// export default function button(token, title) {
+//     return `<button onclick="window.v3plugin.$api({ api: '/api/table/${token}', method:'delete',confirm: { title:'Підтвердити операцію',  text: 'Ви впевнені що хочете вилучити запис?', cancel: 'Скасувати', confirm : 'Виконати'} })"
+//     class="inline-flex items-center px-2 py-1 text-sm font-medium text-white duration-300 bg-red-600 border border-transparent rounded-lg gap-x-2 hover:bg-red-700 hover:text-white">${title || 'Вилучити'}</button>`;
+// }
+
+
+const newColor = 'red'
+export default function button(token, title) {
+    return `<button onclick="window.v3plugin.$api({ api: '/api/table/${token}', method:'delete',confirm: { title:'Підтвердити операцію',  text: 'Ви впевнені що хочете вилучити запис?', cancel: 'Скасувати', confirm : 'Виконати'} })"
+    class="group px-2 py-1 inline-flex border-solid justify-center items-center gap-2 rounded-md font-semibold focus:outline-none text-sm transition-all border border-transparent hover:text-white ring-offset-white bg-${newColor}-100 text-${newColor}-100 hover:bg-${newColor}-500 focus:ring-${newColor}-500">
+    <svg  class="group-hover:fill-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" width="13" height="13" fill="#ef4444"><path d="M135.2 17.7L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-7.2-14.3C307.4 6.8 296.3 0 284.2 0L163.8 0c-12.1 0-23.2 6.8-28.6 17.7zM416 128L32 128 53.2 467c1.6 25.3 22.6 45 47.9 45l245.8 0c25.3 0 46.3-19.7 47.9-45L416 128z"/></svg>
+    </button>`;
 }

package/server/helpers/list/utils/buttonEdit.js

@@ -1,15 +1,15 @@
-
-
-// export default function button(token, title) {
-//     return `<button onclick="window.v3plugin.$form({ token: '${token}' })"
-//     class="inline-flex items-center px-2 py-1 text-sm font-medium text-white duration-300 bg-blue-600 border border-transparent rounded-lg gap-x-2 hover:bg-blue-700 hover:text-white">${title || 'Редагувати'}</button>`;
-// }
-
-
-const newColor = 'blue'
-export default function button(token, title) {
-    return `<button onclick="window.v3plugin.$form({ token: '${token}' })"
-    class="group px-2 py-1 inline-flex border-solid justify-center items-center gap-2 rounded-md font-semibold focus:outline-none text-sm transition-all border border-transparent hover:text-white ring-offset-white bg-${newColor}-100 text-${newColor}-100 hover:bg-${newColor}-500 focus:ring-${newColor}-500">
-    <svg class="group-hover:fill-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="15" height="15" fill="#3b82f6"><path d="M471.6 21.7c-21.9-21.9-57.3-21.9-79.2 0L362.3 51.7l97.9 97.9 30.1-30.1c21.9-21.9 21.9-57.3 0-79.2L471.6 21.7zm-299.2 220c-6.1 6.1-10.8 13.6-13.5 21.9l-29.6 88.8c-2.9 8.6-.6 18.1 5.8 24.6s15.9 8.7 24.6 5.8l88.8-29.6c8.2-2.7 15.7-7.4 21.9-13.5L437.7 172.3 339.7 74.3 172.4 241.7zM96 64C43 64 0 107 0 160L0 416c0 53 43 96 96 96l256 0c53 0 96-43 96-96l0-96c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 96c0 17.7-14.3 32-32 32L96 448c-17.7 0-32-14.3-32-32l0-256c0-17.7 14.3-32 32-32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L96 64z"/></svg>
-    </button>`;
+
+
+// export default function button(token, title) {
+//     return `<button onclick="window.v3plugin.$form({ token: '${token}' })"
+//     class="inline-flex items-center px-2 py-1 text-sm font-medium text-white duration-300 bg-blue-600 border border-transparent rounded-lg gap-x-2 hover:bg-blue-700 hover:text-white">${title || 'Редагувати'}</button>`;
+// }
+
+
+const newColor = 'blue'
+export default function button(token, title) {
+    return `<button onclick="window.v3plugin.$form({ token: '${token}' })"
+    class="group px-2 py-1 inline-flex border-solid justify-center items-center gap-2 rounded-md font-semibold focus:outline-none text-sm transition-all border border-transparent hover:text-white ring-offset-white bg-${newColor}-100 text-${newColor}-100 hover:bg-${newColor}-500 focus:ring-${newColor}-500">
+    <svg class="group-hover:fill-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="13" height="13" fill="#3b82f6"><path d="M471.6 21.7c-21.9-21.9-57.3-21.9-79.2 0L362.3 51.7l97.9 97.9 30.1-30.1c21.9-21.9 21.9-57.3 0-79.2L471.6 21.7zm-299.2 220c-6.1 6.1-10.8 13.6-13.5 21.9l-29.6 88.8c-2.9 8.6-.6 18.1 5.8 24.6s15.9 8.7 24.6 5.8l88.8-29.6c8.2-2.7 15.7-7.4 21.9-13.5L437.7 172.3 339.7 74.3 172.4 241.7zM96 64C43 64 0 107 0 160L0 416c0 53 43 96 96 96l256 0c53 0 96-43 96-96l0-96c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 96c0 17.7-14.3 32-32 32L96 448c-17.7 0-32-14.3-32-32l0-256c0-17.7 14.3-32 32-32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L96 64z"/></svg>
+    </button>`;
 }