create-nextblock 0.2.78 → 0.8.1

package/templates/nextblock-template/lib/custom-block-relations.ts

@@ -0,0 +1,279 @@
+import type { SupabaseClient } from '@supabase/supabase-js';
+import type { Database } from '@nextblock-cms/db';
+
+import {
+  clampCustomBlockRelationLimit,
+  getCustomBlockRelationTarget,
+  listCustomBlockRelationTargets,
+  normalizeCustomBlockRelationValue,
+  resolveCustomBlockRelationColumn,
+  type CustomBlockRelationTarget,
+  type CustomBlockRelationTargetSummary,
+} from './custom-block-relation-registry';
+
+export type CustomBlockRelationRow = {
+  description: string | null;
+  label: string;
+  record: Record<string, unknown>;
+  table: string;
+  value: string;
+};
+
+export type CustomBlockRelationSearchInput = {
+  displayColumn?: string | null;
+  filters?: Record<string, unknown> | null;
+  limit?: number | string | null;
+  query?: string | null;
+  table: string;
+  valueColumn?: string | null;
+  values?: unknown[] | null;
+};
+
+export type CustomBlockRelationSearchResult =
+  | {
+      items: CustomBlockRelationRow[];
+      target: CustomBlockRelationTargetSummary;
+    }
+  | {
+      error: string;
+      status: number;
+    };
+
+function buildRelationTargetSummary(
+  target: CustomBlockRelationTarget,
+  valueColumn: string,
+  displayColumn: string
+): CustomBlockRelationTargetSummary {
+  return {
+    descriptionColumns: [...target.descriptionColumns],
+    displayColumn,
+    label: target.label,
+    searchableColumns: [...target.searchableColumns],
+    table: target.table,
+    valueColumn,
+    valueType: target.valueType,
+    selectColumns: [...target.selectColumns],
+  };
+}
+
+function escapePostgrestSearchTerm(query: string) {
+  return query.replace(/[,%]/g, ' ').replace(/_/g, '\\_').trim();
+}
+
+function describeRelationRow(target: CustomBlockRelationTarget, row: Record<string, unknown>) {
+  const parts = target.descriptionColumns
+    .map((column) => row[column])
+    .filter((value) => value !== null && value !== undefined && value !== '')
+    .map((value) => String(value));
+
+  return parts.length > 0 ? parts.join(' - ') : null;
+}
+
+function toRelationRows(
+  target: CustomBlockRelationTarget,
+  rows: Record<string, unknown>[],
+  valueColumn: string,
+  displayColumn: string
+): CustomBlockRelationRow[] {
+  return rows.flatMap((row) => {
+    const value = row[valueColumn];
+    if (value === null || value === undefined) {
+      return [];
+    }
+
+    const record = { ...row };
+    if (target.table === 'products' && Array.isArray(row.product_media)) {
+      const images = row.product_media
+        .map((pm: any) => pm?.media)
+        .filter(Boolean);
+      record.images = images;
+      if (images.length > 0) {
+        record.image = images[0];
+        record.object_key = images[0].object_key;
+        record.main_image = images[0].object_key;
+      }
+    } else if (target.table === 'product_variants') {
+      if (row.media) {
+        record.image = row.media;
+        record.object_key = (row.media as any).object_key;
+        record.main_image = (row.media as any).object_key;
+      } else {
+        const prod = Array.isArray(row.products) ? row.products[0] : row.products;
+        if (prod && Array.isArray(prod.product_media)) {
+          const pm = prod.product_media.find((pm: any) => pm?.media);
+          if (pm?.media) {
+            record.image = pm.media;
+            record.object_key = pm.media.object_key;
+            record.main_image = pm.media.object_key;
+          }
+        }
+      }
+    } else if ((target.table === 'pages' || target.table === 'posts') && row.media) {
+      record.image = row.media;
+      record.object_key = (row.media as any).object_key;
+      record.main_image = (row.media as any).object_key;
+    }
+
+    let labelSource = record[displayColumn] ?? record[target.displayColumn] ?? value;
+    if (target.table === 'product_variants') {
+      const prod = Array.isArray(record.products) ? record.products[0] : record.products;
+      if (prod?.title) {
+        labelSource = `${prod.title} (${record.sku || value})`;
+      }
+    }
+
+    return [
+      {
+        description: describeRelationRow(target, record),
+        label: String(labelSource || value),
+        record,
+        table: target.table,
+        value: String(value),
+      },
+    ];
+  });
+}
+
+function applyExactFilters(
+  query: any,
+  target: CustomBlockRelationTarget,
+  filters?: Record<string, unknown> | null
+) {
+  let nextQuery = query;
+
+  for (const filter of target.activeFilters ?? []) {
+    nextQuery = nextQuery.eq(filter.column, filter.value);
+  }
+
+  if (!filters) {
+    return nextQuery;
+  }
+
+  for (const [column, value] of Object.entries(filters)) {
+    if (
+      value === undefined ||
+      value === null ||
+      column === 'main_image' ||
+      column === 'object_key' ||
+      (column === 'language_id' && target.table === 'product_variants') ||
+      !target.selectColumns.includes(column) ||
+      column === target.valueColumn
+    ) {
+      continue;
+    }
+
+    if (Array.isArray(value)) {
+      const normalizedValues = value
+        .filter((entry) => ['boolean', 'number', 'string'].includes(typeof entry))
+        .map((entry) => String(entry));
+
+      if (normalizedValues.length > 0) {
+        nextQuery = nextQuery.in(column, normalizedValues);
+      }
+      continue;
+    }
+
+    if (['boolean', 'number', 'string'].includes(typeof value)) {
+      nextQuery = nextQuery.eq(column, value);
+    }
+  }
+
+  return nextQuery;
+}
+
+export async function searchCustomBlockRelationRows(
+  supabase: SupabaseClient<Database>,
+  input: CustomBlockRelationSearchInput
+): Promise<CustomBlockRelationSearchResult> {
+  const target = getCustomBlockRelationTarget(input.table);
+  if (!target) {
+    return { error: `Relation table "${input.table}" is not available.`, status: 400 };
+  }
+
+  const valueColumn = resolveCustomBlockRelationColumn(
+    target,
+    input.valueColumn,
+    target.valueColumn
+  );
+  const displayColumn = resolveCustomBlockRelationColumn(
+    target,
+    input.displayColumn,
+    target.displayColumn
+  );
+
+  if (!valueColumn || !displayColumn) {
+    return { error: 'Requested relation columns are not available.', status: 400 };
+  }
+
+  const limit = clampCustomBlockRelationLimit(input.limit);
+  const selectColumns = Array.from(new Set([valueColumn, displayColumn, ...target.selectColumns]));
+  const dbSelectColumns = selectColumns.filter(col => col !== 'object_key' && col !== 'main_image');
+  
+  let selectQueryStr = dbSelectColumns.join(',');
+  if (target.table === 'products') {
+    selectQueryStr += ',product_media(media(id,object_key,file_name,file_type))';
+  } else if (target.table === 'product_variants') {
+    const hasLanguageFilter = input.filters && 'language_id' in input.filters;
+    if (hasLanguageFilter) {
+      selectQueryStr += ',products!inner(id,title,language_id,product_media(media(id,object_key,file_name,file_type)))';
+    } else {
+      selectQueryStr += ',products(id,title,product_media(media(id,object_key,file_name,file_type)))';
+    }
+    selectQueryStr += ',media(id,object_key,file_name,file_type)';
+  } else if (target.table === 'pages' || target.table === 'posts') {
+    selectQueryStr += ',media:feature_image_id(id,object_key,file_name,file_type)';
+  }
+
+  let query = (supabase.from(target.table as any) as any)
+    .select(selectQueryStr)
+    .limit(limit);
+
+  query = applyExactFilters(query, target, input.filters);
+
+  const values = (input.values ?? [])
+    .map((value) => normalizeCustomBlockRelationValue(target, value))
+    .filter((value): value is number | string => value !== null);
+
+  if (values.length > 0) {
+    query = query.in(valueColumn, values);
+  } else if (input.query?.trim()) {
+    const escapedQuery = escapePostgrestSearchTerm(input.query);
+    if (escapedQuery) {
+      let searchExpression = target.searchableColumns
+        .filter((column) => target.selectColumns.includes(column))
+        .map((column) => `${column}.ilike.%${escapedQuery}%`)
+        .join(',');
+
+      if (target.table === 'product_variants') {
+        searchExpression = searchExpression
+          ? `${searchExpression},products.title.ilike.%${escapedQuery}%`
+          : `products.title.ilike.%${escapedQuery}%`;
+      }
+
+      if (searchExpression) {
+        query = query.or(searchExpression);
+      }
+    }
+  }
+
+  if (target.table === 'product_variants' && input.filters?.language_id) {
+    query = query.eq('products.language_id', input.filters.language_id);
+  }
+
+  query = query.order(target.orderBy, { ascending: true });
+
+  const { data, error } = await query;
+  if (error) {
+    console.error('[Custom Block Relations] Failed to query relation rows:', error);
+    return { error: 'Failed to load relation rows.', status: 500 };
+  }
+
+  return {
+    items: toRelationRows(target, (data ?? []) as Record<string, unknown>[], valueColumn, displayColumn),
+    target: buildRelationTargetSummary(target, valueColumn, displayColumn),
+  };
+}
+
+export function getCustomBlockRelationTargetsResponse() {
+  return { tables: listCustomBlockRelationTargets() };
+}

package/templates/nextblock-template/lib/custom-block-safelist.ts

@@ -0,0 +1,14 @@
+/*
+ * AUTO-GENERATED — do not edit by hand.
+ * Regenerate with: node tools/scripts/gen-custom-block-safelist.js
+ *
+ * Custom block layouts store Tailwind classes in the database. Tailwind only
+ * emits CSS for classes it finds while scanning source files, so these color
+ * utility tokens are listed here to force their generation. This module is never
+ * imported at runtime; it exists purely so the Tailwind content scanner sees it.
+ * (Consolidates and replaces the former app/force-styles.tsx.)
+ */
+
+export const CUSTOM_BLOCK_TAILWIND_SAFELIST = `
+bg-slate-50 hover:bg-slate-50 focus:bg-slate-50 text-slate-50 hover:text-slate-50 border-slate-50 hover:border-slate-50 ring-slate-50 focus:ring-slate-50 shadow-slate-50 from-slate-50 via-slate-50 to-slate-50 bg-slate-100 hover:bg-slate-100 focus:bg-slate-100 text-slate-100 hover:text-slate-100 border-slate-100 hover:border-slate-100 ring-slate-100 focus:ring-slate-100 shadow-slate-100 from-slate-100 via-slate-100 to-slate-100 bg-slate-200 hover:bg-slate-200 focus:bg-slate-200 text-slate-200 hover:text-slate-200 border-slate-200 hover:border-slate-200 ring-slate-200 focus:ring-slate-200 shadow-slate-200 from-slate-200 via-slate-200 to-slate-200 bg-slate-300 hover:bg-slate-300 focus:bg-slate-300 text-slate-300 hover:text-slate-300 border-slate-300 hover:border-slate-300 ring-slate-300 focus:ring-slate-300 shadow-slate-300 from-slate-300 via-slate-300 to-slate-300 bg-slate-400 hover:bg-slate-400 focus:bg-slate-400 text-slate-400 hover:text-slate-400 border-slate-400 hover:border-slate-400 ring-slate-400 focus:ring-slate-400 shadow-slate-400 from-slate-400 via-slate-400 to-slate-400 bg-slate-500 hover:bg-slate-500 focus:bg-slate-500 text-slate-500 hover:text-slate-500 border-slate-500 hover:border-slate-500 ring-slate-500 focus:ring-slate-500 shadow-slate-500 from-slate-500 via-slate-500 to-slate-500 bg-slate-600 hover:bg-slate-600 focus:bg-slate-600 text-slate-600 hover:text-slate-600 border-slate-600 hover:border-slate-600 ring-slate-600 focus:ring-slate-600 shadow-slate-600 from-slate-600 via-slate-600 to-slate-600 bg-slate-700 hover:bg-slate-700 focus:bg-slate-700 text-slate-700 hover:text-slate-700 border-slate-700 hover:border-slate-700 ring-slate-700 focus:ring-slate-700 shadow-slate-700 from-slate-700 via-slate-700 to-slate-700 bg-slate-800 hover:bg-slate-800 focus:bg-slate-800 text-slate-800 hover:text-slate-800 border-slate-800 hover:border-slate-800 ring-slate-800 focus:ring-slate-800 shadow-slate-800 from-slate-800 via-slate-800 to-slate-800 bg-slate-900 hover:bg-slate-900 focus:bg-slate-900 text-slate-900 hover:text-slate-900 border-slate-900 hover:border-slate-900 ring-slate-900 focus:ring-slate-900 shadow-slate-900 from-slate-900 via-slate-900 to-slate-900 bg-slate-950 hover:bg-slate-950 focus:bg-slate-950 text-slate-950 hover:text-slate-950 border-slate-950 hover:border-slate-950 ring-slate-950 focus:ring-slate-950 shadow-slate-950 from-slate-950 via-slate-950 to-slate-950 bg-gray-50 hover:bg-gray-50 focus:bg-gray-50 text-gray-50 hover:text-gray-50 border-gray-50 hover:border-gray-50 ring-gray-50 focus:ring-gray-50 shadow-gray-50 from-gray-50 via-gray-50 to-gray-50 bg-gray-100 hover:bg-gray-100 focus:bg-gray-100 text-gray-100 hover:text-gray-100 border-gray-100 hover:border-gray-100 ring-gray-100 focus:ring-gray-100 shadow-gray-100 from-gray-100 via-gray-100 to-gray-100 bg-gray-200 hover:bg-gray-200 focus:bg-gray-200 text-gray-200 hover:text-gray-200 border-gray-200 hover:border-gray-200 ring-gray-200 focus:ring-gray-200 shadow-gray-200 from-gray-200 via-gray-200 to-gray-200 bg-gray-300 hover:bg-gray-300 focus:bg-gray-300 text-gray-300 hover:text-gray-300 border-gray-300 hover:border-gray-300 ring-gray-300 focus:ring-gray-300 shadow-gray-300 from-gray-300 via-gray-300 to-gray-300 bg-gray-400 hover:bg-gray-400 focus:bg-gray-400 text-gray-400 hover:text-gray-400 border-gray-400 hover:border-gray-400 ring-gray-400 focus:ring-gray-400 shadow-gray-400 from-gray-400 via-gray-400 to-gray-400 bg-gray-500 hover:bg-gray-500 focus:bg-gray-500 text-gray-500 hover:text-gray-500 border-gray-500 hover:border-gray-500 ring-gray-500 focus:ring-gray-500 shadow-gray-500 from-gray-500 via-gray-500 to-gray-500 bg-gray-600 hover:bg-gray-600 focus:bg-gray-600 text-gray-600 hover:text-gray-600 border-gray-600 hover:border-gray-600 ring-gray-600 focus:ring-gray-600 shadow-gray-600 from-gray-600 via-gray-600 to-gray-600 bg-gray-700 hover:bg-gray-700 focus:bg-gray-700 text-gray-700 hover:text-gray-700 border-gray-700 hover:border-gray-700 ring-gray-700 focus:ring-gray-700 shadow-gray-700 from-gray-700 via-gray-700 to-gray-700 bg-gray-800 hover:bg-gray-800 focus:bg-gray-800 text-gray-800 hover:text-gray-800 border-gray-800 hover:border-gray-800 ring-gray-800 focus:ring-gray-800 shadow-gray-800 from-gray-800 via-gray-800 to-gray-800 bg-gray-900 hover:bg-gray-900 focus:bg-gray-900 text-gray-900 hover:text-gray-900 border-gray-900 hover:border-gray-900 ring-gray-900 focus:ring-gray-900 shadow-gray-900 from-gray-900 via-gray-900 to-gray-900 bg-gray-950 hover:bg-gray-950 focus:bg-gray-950 text-gray-950 hover:text-gray-950 border-gray-950 hover:border-gray-950 ring-gray-950 focus:ring-gray-950 shadow-gray-950 from-gray-950 via-gray-950 to-gray-950 bg-zinc-50 hover:bg-zinc-50 focus:bg-zinc-50 text-zinc-50 hover:text-zinc-50 border-zinc-50 hover:border-zinc-50 ring-zinc-50 focus:ring-zinc-50 shadow-zinc-50 from-zinc-50 via-zinc-50 to-zinc-50 bg-zinc-100 hover:bg-zinc-100 focus:bg-zinc-100 text-zinc-100 hover:text-zinc-100 border-zinc-100 hover:border-zinc-100 ring-zinc-100 focus:ring-zinc-100 shadow-zinc-100 from-zinc-100 via-zinc-100 to-zinc-100 bg-zinc-200 hover:bg-zinc-200 focus:bg-zinc-200 text-zinc-200 hover:text-zinc-200 border-zinc-200 hover:border-zinc-200 ring-zinc-200 focus:ring-zinc-200 shadow-zinc-200 from-zinc-200 via-zinc-200 to-zinc-200 bg-zinc-300 hover:bg-zinc-300 focus:bg-zinc-300 text-zinc-300 hover:text-zinc-300 border-zinc-300 hover:border-zinc-300 ring-zinc-300 focus:ring-zinc-300 shadow-zinc-300 from-zinc-300 via-zinc-300 to-zinc-300 bg-zinc-400 hover:bg-zinc-400 focus:bg-zinc-400 text-zinc-400 hover:text-zinc-400 border-zinc-400 hover:border-zinc-400 ring-zinc-400 focus:ring-zinc-400 shadow-zinc-400 from-zinc-400 via-zinc-400 to-zinc-400 bg-zinc-500 hover:bg-zinc-500 focus:bg-zinc-500 text-zinc-500 hover:text-zinc-500 border-zinc-500 hover:border-zinc-500 ring-zinc-500 focus:ring-zinc-500 shadow-zinc-500 from-zinc-500 via-zinc-500 to-zinc-500 bg-zinc-600 hover:bg-zinc-600 focus:bg-zinc-600 text-zinc-600 hover:text-zinc-600 border-zinc-600 hover:border-zinc-600 ring-zinc-600 focus:ring-zinc-600 shadow-zinc-600 from-zinc-600 via-zinc-600 to-zinc-600 bg-zinc-700 hover:bg-zinc-700 focus:bg-zinc-700 text-zinc-700 hover:text-zinc-700 border-zinc-700 hover:border-zinc-700 ring-zinc-700 focus:ring-zinc-700 shadow-zinc-700 from-zinc-700 via-zinc-700 to-zinc-700 bg-zinc-800 hover:bg-zinc-800 focus:bg-zinc-800 text-zinc-800 hover:text-zinc-800 border-zinc-800 hover:border-zinc-800 ring-zinc-800 focus:ring-zinc-800 shadow-zinc-800 from-zinc-800 via-zinc-800 to-zinc-800 bg-zinc-900 hover:bg-zinc-900 focus:bg-zinc-900 text-zinc-900 hover:text-zinc-900 border-zinc-900 hover:border-zinc-900 ring-zinc-900 focus:ring-zinc-900 shadow-zinc-900 from-zinc-900 via-zinc-900 to-zinc-900 bg-zinc-950 hover:bg-zinc-950 focus:bg-zinc-950 text-zinc-950 hover:text-zinc-950 border-zinc-950 hover:border-zinc-950 ring-zinc-950 focus:ring-zinc-950 shadow-zinc-950 from-zinc-950 via-zinc-950 to-zinc-950 bg-neutral-50 hover:bg-neutral-50 focus:bg-neutral-50 text-neutral-50 hover:text-neutral-50 border-neutral-50 hover:border-neutral-50 ring-neutral-50 focus:ring-neutral-50 shadow-neutral-50 from-neutral-50 via-neutral-50 to-neutral-50 bg-neutral-100 hover:bg-neutral-100 focus:bg-neutral-100 text-neutral-100 hover:text-neutral-100 border-neutral-100 hover:border-neutral-100 ring-neutral-100 focus:ring-neutral-100 shadow-neutral-100 from-neutral-100 via-neutral-100 to-neutral-100 bg-neutral-200 hover:bg-neutral-200 focus:bg-neutral-200 text-neutral-200 hover:text-neutral-200 border-neutral-200 hover:border-neutral-200 ring-neutral-200 focus:ring-neutral-200 shadow-neutral-200 from-neutral-200 via-neutral-200 to-neutral-200 bg-neutral-300 hover:bg-neutral-300 focus:bg-neutral-300 text-neutral-300 hover:text-neutral-300 border-neutral-300 hover:border-neutral-300 ring-neutral-300 focus:ring-neutral-300 shadow-neutral-300 from-neutral-300 via-neutral-300 to-neutral-300 bg-neutral-400 hover:bg-neutral-400 focus:bg-neutral-400 text-neutral-400 hover:text-neutral-400 border-neutral-400 hover:border-neutral-400 ring-neutral-400 focus:ring-neutral-400 shadow-neutral-400 from-neutral-400 via-neutral-400 to-neutral-400 bg-neutral-500 hover:bg-neutral-500 focus:bg-neutral-500 text-neutral-500 hover:text-neutral-500 border-neutral-500 hover:border-neutral-500 ring-neutral-500 focus:ring-neutral-500 shadow-neutral-500 from-neutral-500 via-neutral-500 to-neutral-500 bg-neutral-600 hover:bg-neutral-600 focus:bg-neutral-600 text-neutral-600 hover:text-neutral-600 border-neutral-600 hover:border-neutral-600 ring-neutral-600 focus:ring-neutral-600 shadow-neutral-600 from-neutral-600 via-neutral-600 to-neutral-600 bg-neutral-700 hover:bg-neutral-700 focus:bg-neutral-700 text-neutral-700 hover:text-neutral-700 border-neutral-700 hover:border-neutral-700 ring-neutral-700 focus:ring-neutral-700 shadow-neutral-700 from-neutral-700 via-neutral-700 to-neutral-700 bg-neutral-800 hover:bg-neutral-800 focus:bg-neutral-800 text-neutral-800 hover:text-neutral-800 border-neutral-800 hover:border-neutral-800 ring-neutral-800 focus:ring-neutral-800 shadow-neutral-800 from-neutral-800 via-neutral-800 to-neutral-800 bg-neutral-900 hover:bg-neutral-900 focus:bg-neutral-900 text-neutral-900 hover:text-neutral-900 border-neutral-900 hover:border-neutral-900 ring-neutral-900 focus:ring-neutral-900 shadow-neutral-900 from-neutral-900 via-neutral-900 to-neutral-900 bg-neutral-950 hover:bg-neutral-950 focus:bg-neutral-950 text-neutral-950 hover:text-neutral-950 border-neutral-950 hover:border-neutral-950 ring-neutral-950 focus:ring-neutral-950 shadow-neutral-950 from-neutral-950 via-neutral-950 to-neutral-950 bg-stone-50 hover:bg-stone-50 focus:bg-stone-50 text-stone-50 hover:text-stone-50 border-stone-50 hover:border-stone-50 ring-stone-50 focus:ring-stone-50 shadow-stone-50 from-stone-50 via-stone-50 to-stone-50 bg-stone-100 hover:bg-stone-100 focus:bg-stone-100 text-stone-100 hover:text-stone-100 border-stone-100 hover:border-stone-100 ring-stone-100 focus:ring-stone-100 shadow-stone-100 from-stone-100 via-stone-100 to-stone-100 bg-stone-200 hover:bg-stone-200 focus:bg-stone-200 text-stone-200 hover:text-stone-200 border-stone-200 hover:border-stone-200 ring-stone-200 focus:ring-stone-200 shadow-stone-200 from-stone-200 via-stone-200 to-stone-200 bg-stone-300 hover:bg-stone-300 focus:bg-stone-300 text-stone-300 hover:text-stone-300 border-stone-300 hover:border-stone-300 ring-stone-300 focus:ring-stone-300 shadow-stone-300 from-stone-300 via-stone-300 to-stone-300 bg-stone-400 hover:bg-stone-400 focus:bg-stone-400 text-stone-400 hover:text-stone-400 border-stone-400 hover:border-stone-400 ring-stone-400 focus:ring-stone-400 shadow-stone-400 from-stone-400 via-stone-400 to-stone-400 bg-stone-500 hover:bg-stone-500 focus:bg-stone-500 text-stone-500 hover:text-stone-500 border-stone-500 hover:border-stone-500 ring-stone-500 focus:ring-stone-500 shadow-stone-500 from-stone-500 via-stone-500 to-stone-500 bg-stone-600 hover:bg-stone-600 focus:bg-stone-600 text-stone-600 hover:text-stone-600 border-stone-600 hover:border-stone-600 ring-stone-600 focus:ring-stone-600 shadow-stone-600 from-stone-600 via-stone-600 to-stone-600 bg-stone-700 hover:bg-stone-700 focus:bg-stone-700 text-stone-700 hover:text-stone-700 border-stone-700 hover:border-stone-700 ring-stone-700 focus:ring-stone-700 shadow-stone-700 from-stone-700 via-stone-700 to-stone-700 bg-stone-800 hover:bg-stone-800 focus:bg-stone-800 text-stone-800 hover:text-stone-800 border-stone-800 hover:border-stone-800 ring-stone-800 focus:ring-stone-800 shadow-stone-800 from-stone-800 via-stone-800 to-stone-800 bg-stone-900 hover:bg-stone-900 focus:bg-stone-900 text-stone-900 hover:text-stone-900 border-stone-900 hover:border-stone-900 ring-stone-900 focus:ring-stone-900 shadow-stone-900 from-stone-900 via-stone-900 to-stone-900 bg-stone-950 hover:bg-stone-950 focus:bg-stone-950 text-stone-950 hover:text-stone-950 border-stone-950 hover:border-stone-950 ring-stone-950 focus:ring-stone-950 shadow-stone-950 from-stone-950 via-stone-950 to-stone-950 bg-red-50 hover:bg-red-50 focus:bg-red-50 text-red-50 hover:text-red-50 border-red-50 hover:border-red-50 ring-red-50 focus:ring-red-50 shadow-red-50 from-red-50 via-red-50 to-red-50 bg-red-100 hover:bg-red-100 focus:bg-red-100 text-red-100 hover:text-red-100 border-red-100 hover:border-red-100 ring-red-100 focus:ring-red-100 shadow-red-100 from-red-100 via-red-100 to-red-100 bg-red-200 hover:bg-red-200 focus:bg-red-200 text-red-200 hover:text-red-200 border-red-200 hover:border-red-200 ring-red-200 focus:ring-red-200 shadow-red-200 from-red-200 via-red-200 to-red-200 bg-red-300 hover:bg-red-300 focus:bg-red-300 text-red-300 hover:text-red-300 border-red-300 hover:border-red-300 ring-red-300 focus:ring-red-300 shadow-red-300 from-red-300 via-red-300 to-red-300 bg-red-400 hover:bg-red-400 focus:bg-red-400 text-red-400 hover:text-red-400 border-red-400 hover:border-red-400 ring-red-400 focus:ring-red-400 shadow-red-400 from-red-400 via-red-400 to-red-400 bg-red-500 hover:bg-red-500 focus:bg-red-500 text-red-500 hover:text-red-500 border-red-500 hover:border-red-500 ring-red-500 focus:ring-red-500 shadow-red-500 from-red-500 via-red-500 to-red-500 bg-red-600 hover:bg-red-600 focus:bg-red-600 text-red-600 hover:text-red-600 border-red-600 hover:border-red-600 ring-red-600 focus:ring-red-600 shadow-red-600 from-red-600 via-red-600 to-red-600 bg-red-700 hover:bg-red-700 focus:bg-red-700 text-red-700 hover:text-red-700 border-red-700 hover:border-red-700 ring-red-700 focus:ring-red-700 shadow-red-700 from-red-700 via-red-700 to-red-700 bg-red-800 hover:bg-red-800 focus:bg-red-800 text-red-800 hover:text-red-800 border-red-800 hover:border-red-800 ring-red-800 focus:ring-red-800 shadow-red-800 from-red-800 via-red-800 to-red-800 bg-red-900 hover:bg-red-900 focus:bg-red-900 text-red-900 hover:text-red-900 border-red-900 hover:border-red-900 ring-red-900 focus:ring-red-900 shadow-red-900 from-red-900 via-red-900 to-red-900 bg-red-950 hover:bg-red-950 focus:bg-red-950 text-red-950 hover:text-red-950 border-red-950 hover:border-red-950 ring-red-950 focus:ring-red-950 shadow-red-950 from-red-950 via-red-950 to-red-950 bg-orange-50 hover:bg-orange-50 focus:bg-orange-50 text-orange-50 hover:text-orange-50 border-orange-50 hover:border-orange-50 ring-orange-50 focus:ring-orange-50 shadow-orange-50 from-orange-50 via-orange-50 to-orange-50 bg-orange-100 hover:bg-orange-100 focus:bg-orange-100 text-orange-100 hover:text-orange-100 border-orange-100 hover:border-orange-100 ring-orange-100 focus:ring-orange-100 shadow-orange-100 from-orange-100 via-orange-100 to-orange-100 bg-orange-200 hover:bg-orange-200 focus:bg-orange-200 text-orange-200 hover:text-orange-200 border-orange-200 hover:border-orange-200 ring-orange-200 focus:ring-orange-200 shadow-orange-200 from-orange-200 via-orange-200 to-orange-200 bg-orange-300 hover:bg-orange-300 focus:bg-orange-300 text-orange-300 hover:text-orange-300 border-orange-300 hover:border-orange-300 ring-orange-300 focus:ring-orange-300 shadow-orange-300 from-orange-300 via-orange-300 to-orange-300 bg-orange-400 hover:bg-orange-400 focus:bg-orange-400 text-orange-400 hover:text-orange-400 border-orange-400 hover:border-orange-400 ring-orange-400 focus:ring-orange-400 shadow-orange-400 from-orange-400 via-orange-400 to-orange-400 bg-orange-500 hover:bg-orange-500 focus:bg-orange-500 text-orange-500 hover:text-orange-500 border-orange-500 hover:border-orange-500 ring-orange-500 focus:ring-orange-500 shadow-orange-500 from-orange-500 via-orange-500 to-orange-500 bg-orange-600 hover:bg-orange-600 focus:bg-orange-600 text-orange-600 hover:text-orange-600 border-orange-600 hover:border-orange-600 ring-orange-600 focus:ring-orange-600 shadow-orange-600 from-orange-600 via-orange-600 to-orange-600 bg-orange-700 hover:bg-orange-700 focus:bg-orange-700 text-orange-700 hover:text-orange-700 border-orange-700 hover:border-orange-700 ring-orange-700 focus:ring-orange-700 shadow-orange-700 from-orange-700 via-orange-700 to-orange-700 bg-orange-800 hover:bg-orange-800 focus:bg-orange-800 text-orange-800 hover:text-orange-800 border-orange-800 hover:border-orange-800 ring-orange-800 focus:ring-orange-800 shadow-orange-800 from-orange-800 via-orange-800 to-orange-800 bg-orange-900 hover:bg-orange-900 focus:bg-orange-900 text-orange-900 hover:text-orange-900 border-orange-900 hover:border-orange-900 ring-orange-900 focus:ring-orange-900 shadow-orange-900 from-orange-900 via-orange-900 to-orange-900 bg-orange-950 hover:bg-orange-950 focus:bg-orange-950 text-orange-950 hover:text-orange-950 border-orange-950 hover:border-orange-950 ring-orange-950 focus:ring-orange-950 shadow-orange-950 from-orange-950 via-orange-950 to-orange-950 bg-amber-50 hover:bg-amber-50 focus:bg-amber-50 text-amber-50 hover:text-amber-50 border-amber-50 hover:border-amber-50 ring-amber-50 focus:ring-amber-50 shadow-amber-50 from-amber-50 via-amber-50 to-amber-50 bg-amber-100 hover:bg-amber-100 focus:bg-amber-100 text-amber-100 hover:text-amber-100 border-amber-100 hover:border-amber-100 ring-amber-100 focus:ring-amber-100 shadow-amber-100 from-amber-100 via-amber-100 to-amber-100 bg-amber-200 hover:bg-amber-200 focus:bg-amber-200 text-amber-200 hover:text-amber-200 border-amber-200 hover:border-amber-200 ring-amber-200 focus:ring-amber-200 shadow-amber-200 from-amber-200 via-amber-200 to-amber-200 bg-amber-300 hover:bg-amber-300 focus:bg-amber-300 text-amber-300 hover:text-amber-300 border-amber-300 hover:border-amber-300 ring-amber-300 focus:ring-amber-300 shadow-amber-300 from-amber-300 via-amber-300 to-amber-300 bg-amber-400 hover:bg-amber-400 focus:bg-amber-400 text-amber-400 hover:text-amber-400 border-amber-400 hover:border-amber-400 ring-amber-400 focus:ring-amber-400 shadow-amber-400 from-amber-400 via-amber-400 to-amber-400 bg-amber-500 hover:bg-amber-500 focus:bg-amber-500 text-amber-500 hover:text-amber-500 border-amber-500 hover:border-amber-500 ring-amber-500 focus:ring-amber-500 shadow-amber-500 from-amber-500 via-amber-500 to-amber-500 bg-amber-600 hover:bg-amber-600 focus:bg-amber-600 text-amber-600 hover:text-amber-600 border-amber-600 hover:border-amber-600 ring-amber-600 focus:ring-amber-600 shadow-amber-600 from-amber-600 via-amber-600 to-amber-600 bg-amber-700 hover:bg-amber-700 focus:bg-amber-700 text-amber-700 hover:text-amber-700 border-amber-700 hover:border-amber-700 ring-amber-700 focus:ring-amber-700 shadow-amber-700 from-amber-700 via-amber-700 to-amber-700 bg-amber-800 hover:bg-amber-800 focus:bg-amber-800 text-amber-800 hover:text-amber-800 border-amber-800 hover:border-amber-800 ring-amber-800 focus:ring-amber-800 shadow-amber-800 from-amber-800 via-amber-800 to-amber-800 bg-amber-900 hover:bg-amber-900 focus:bg-amber-900 text-amber-900 hover:text-amber-900 border-amber-900 hover:border-amber-900 ring-amber-900 focus:ring-amber-900 shadow-amber-900 from-amber-900 via-amber-900 to-amber-900 bg-amber-950 hover:bg-amber-950 focus:bg-amber-950 text-amber-950 hover:text-amber-950 border-amber-950 hover:border-amber-950 ring-amber-950 focus:ring-amber-950 shadow-amber-950 from-amber-950 via-amber-950 to-amber-950 bg-yellow-50 hover:bg-yellow-50 focus:bg-yellow-50 text-yellow-50 hover:text-yellow-50 border-yellow-50 hover:border-yellow-50 ring-yellow-50 focus:ring-yellow-50 shadow-yellow-50 from-yellow-50 via-yellow-50 to-yellow-50 bg-yellow-100 hover:bg-yellow-100 focus:bg-yellow-100 text-yellow-100 hover:text-yellow-100 border-yellow-100 hover:border-yellow-100 ring-yellow-100 focus:ring-yellow-100 shadow-yellow-100 from-yellow-100 via-yellow-100 to-yellow-100 bg-yellow-200 hover:bg-yellow-200 focus:bg-yellow-200 text-yellow-200 hover:text-yellow-200 border-yellow-200 hover:border-yellow-200 ring-yellow-200 focus:ring-yellow-200 shadow-yellow-200 from-yellow-200 via-yellow-200 to-yellow-200 bg-yellow-300 hover:bg-yellow-300 focus:bg-yellow-300 text-yellow-300 hover:text-yellow-300 border-yellow-300 hover:border-yellow-300 ring-yellow-300 focus:ring-yellow-300 shadow-yellow-300 from-yellow-300 via-yellow-300 to-yellow-300 bg-yellow-400 hover:bg-yellow-400 focus:bg-yellow-400 text-yellow-400 hover:text-yellow-400 border-yellow-400 hover:border-yellow-400 ring-yellow-400 focus:ring-yellow-400 shadow-yellow-400 from-yellow-400 via-yellow-400 to-yellow-400 bg-yellow-500 hover:bg-yellow-500 focus:bg-yellow-500 text-yellow-500 hover:text-yellow-500 border-yellow-500 hover:border-yellow-500 ring-yellow-500 focus:ring-yellow-500 shadow-yellow-500 from-yellow-500 via-yellow-500 to-yellow-500 bg-yellow-600 hover:bg-yellow-600 focus:bg-yellow-600 text-yellow-600 hover:text-yellow-600 border-yellow-600 hover:border-yellow-600 ring-yellow-600 focus:ring-yellow-600 shadow-yellow-600 from-yellow-600 via-yellow-600 to-yellow-600 bg-yellow-700 hover:bg-yellow-700 focus:bg-yellow-700 text-yellow-700 hover:text-yellow-700 border-yellow-700 hover:border-yellow-700 ring-yellow-700 focus:ring-yellow-700 shadow-yellow-700 from-yellow-700 via-yellow-700 to-yellow-700 bg-yellow-800 hover:bg-yellow-800 focus:bg-yellow-800 text-yellow-800 hover:text-yellow-800 border-yellow-800 hover:border-yellow-800 ring-yellow-800 focus:ring-yellow-800 shadow-yellow-800 from-yellow-800 via-yellow-800 to-yellow-800 bg-yellow-900 hover:bg-yellow-900 focus:bg-yellow-900 text-yellow-900 hover:text-yellow-900 border-yellow-900 hover:border-yellow-900 ring-yellow-900 focus:ring-yellow-900 shadow-yellow-900 from-yellow-900 via-yellow-900 to-yellow-900 bg-yellow-950 hover:bg-yellow-950 focus:bg-yellow-950 text-yellow-950 hover:text-yellow-950 border-yellow-950 hover:border-yellow-950 ring-yellow-950 focus:ring-yellow-950 shadow-yellow-950 from-yellow-950 via-yellow-950 to-yellow-950 bg-lime-50 hover:bg-lime-50 focus:bg-lime-50 text-lime-50 hover:text-lime-50 border-lime-50 hover:border-lime-50 ring-lime-50 focus:ring-lime-50 shadow-lime-50 from-lime-50 via-lime-50 to-lime-50 bg-lime-100 hover:bg-lime-100 focus:bg-lime-100 text-lime-100 hover:text-lime-100 border-lime-100 hover:border-lime-100 ring-lime-100 focus:ring-lime-100 shadow-lime-100 from-lime-100 via-lime-100 to-lime-100 bg-lime-200 hover:bg-lime-200 focus:bg-lime-200 text-lime-200 hover:text-lime-200 border-lime-200 hover:border-lime-200 ring-lime-200 focus:ring-lime-200 shadow-lime-200 from-lime-200 via-lime-200 to-lime-200 bg-lime-300 hover:bg-lime-300 focus:bg-lime-300 text-lime-300 hover:text-lime-300 border-lime-300 hover:border-lime-300 ring-lime-300 focus:ring-lime-300 shadow-lime-300 from-lime-300 via-lime-300 to-lime-300 bg-lime-400 hover:bg-lime-400 focus:bg-lime-400 text-lime-400 hover:text-lime-400 border-lime-400 hover:border-lime-400 ring-lime-400 focus:ring-lime-400 shadow-lime-400 from-lime-400 via-lime-400 to-lime-400 bg-lime-500 hover:bg-lime-500 focus:bg-lime-500 text-lime-500 hover:text-lime-500 border-lime-500 hover:border-lime-500 ring-lime-500 focus:ring-lime-500 shadow-lime-500 from-lime-500 via-lime-500 to-lime-500 bg-lime-600 hover:bg-lime-600 focus:bg-lime-600 text-lime-600 hover:text-lime-600 border-lime-600 hover:border-lime-600 ring-lime-600 focus:ring-lime-600 shadow-lime-600 from-lime-600 via-lime-600 to-lime-600 bg-lime-700 hover:bg-lime-700 focus:bg-lime-700 text-lime-700 hover:text-lime-700 border-lime-700 hover:border-lime-700 ring-lime-700 focus:ring-lime-700 shadow-lime-700 from-lime-700 via-lime-700 to-lime-700 bg-lime-800 hover:bg-lime-800 focus:bg-lime-800 text-lime-800 hover:text-lime-800 border-lime-800 hover:border-lime-800 ring-lime-800 focus:ring-lime-800 shadow-lime-800 from-lime-800 via-lime-800 to-lime-800 bg-lime-900 hover:bg-lime-900 focus:bg-lime-900 text-lime-900 hover:text-lime-900 border-lime-900 hover:border-lime-900 ring-lime-900 focus:ring-lime-900 shadow-lime-900 from-lime-900 via-lime-900 to-lime-900 bg-lime-950 hover:bg-lime-950 focus:bg-lime-950 text-lime-950 hover:text-lime-950 border-lime-950 hover:border-lime-950 ring-lime-950 focus:ring-lime-950 shadow-lime-950 from-lime-950 via-lime-950 to-lime-950 bg-green-50 hover:bg-green-50 focus:bg-green-50 text-green-50 hover:text-green-50 border-green-50 hover:border-green-50 ring-green-50 focus:ring-green-50 shadow-green-50 from-green-50 via-green-50 to-green-50 bg-green-100 hover:bg-green-100 focus:bg-green-100 text-green-100 hover:text-green-100 border-green-100 hover:border-green-100 ring-green-100 focus:ring-green-100 shadow-green-100 from-green-100 via-green-100 to-green-100 bg-green-200 hover:bg-green-200 focus:bg-green-200 text-green-200 hover:text-green-200 border-green-200 hover:border-green-200 ring-green-200 focus:ring-green-200 shadow-green-200 from-green-200 via-green-200 to-green-200 bg-green-300 hover:bg-green-300 focus:bg-green-300 text-green-300 hover:text-green-300 border-green-300 hover:border-green-300 ring-green-300 focus:ring-green-300 shadow-green-300 from-green-300 via-green-300 to-green-300 bg-green-400 hover:bg-green-400 focus:bg-green-400 text-green-400 hover:text-green-400 border-green-400 hover:border-green-400 ring-green-400 focus:ring-green-400 shadow-green-400 from-green-400 via-green-400 to-green-400 bg-green-500 hover:bg-green-500 focus:bg-green-500 text-green-500 hover:text-green-500 border-green-500 hover:border-green-500 ring-green-500 focus:ring-green-500 shadow-green-500 from-green-500 via-green-500 to-green-500 bg-green-600 hover:bg-green-600 focus:bg-green-600 text-green-600 hover:text-green-600 border-green-600 hover:border-green-600 ring-green-600 focus:ring-green-600 shadow-green-600 from-green-600 via-green-600 to-green-600 bg-green-700 hover:bg-green-700 focus:bg-green-700 text-green-700 hover:text-green-700 border-green-700 hover:border-green-700 ring-green-700 focus:ring-green-700 shadow-green-700 from-green-700 via-green-700 to-green-700 bg-green-800 hover:bg-green-800 focus:bg-green-800 text-green-800 hover:text-green-800 border-green-800 hover:border-green-800 ring-green-800 focus:ring-green-800 shadow-green-800 from-green-800 via-green-800 to-green-800 bg-green-900 hover:bg-green-900 focus:bg-green-900 text-green-900 hover:text-green-900 border-green-900 hover:border-green-900 ring-green-900 focus:ring-green-900 shadow-green-900 from-green-900 via-green-900 to-green-900 bg-green-950 hover:bg-green-950 focus:bg-green-950 text-green-950 hover:text-green-950 border-green-950 hover:border-green-950 ring-green-950 focus:ring-green-950 shadow-green-950 from-green-950 via-green-950 to-green-950 bg-emerald-50 hover:bg-emerald-50 focus:bg-emerald-50 text-emerald-50 hover:text-emerald-50 border-emerald-50 hover:border-emerald-50 ring-emerald-50 focus:ring-emerald-50 shadow-emerald-50 from-emerald-50 via-emerald-50 to-emerald-50 bg-emerald-100 hover:bg-emerald-100 focus:bg-emerald-100 text-emerald-100 hover:text-emerald-100 border-emerald-100 hover:border-emerald-100 ring-emerald-100 focus:ring-emerald-100 shadow-emerald-100 from-emerald-100 via-emerald-100 to-emerald-100 bg-emerald-200 hover:bg-emerald-200 focus:bg-emerald-200 text-emerald-200 hover:text-emerald-200 border-emerald-200 hover:border-emerald-200 ring-emerald-200 focus:ring-emerald-200 shadow-emerald-200 from-emerald-200 via-emerald-200 to-emerald-200 bg-emerald-300 hover:bg-emerald-300 focus:bg-emerald-300 text-emerald-300 hover:text-emerald-300 border-emerald-300 hover:border-emerald-300 ring-emerald-300 focus:ring-emerald-300 shadow-emerald-300 from-emerald-300 via-emerald-300 to-emerald-300 bg-emerald-400 hover:bg-emerald-400 focus:bg-emerald-400 text-emerald-400 hover:text-emerald-400 border-emerald-400 hover:border-emerald-400 ring-emerald-400 focus:ring-emerald-400 shadow-emerald-400 from-emerald-400 via-emerald-400 to-emerald-400 bg-emerald-500 hover:bg-emerald-500 focus:bg-emerald-500 text-emerald-500 hover:text-emerald-500 border-emerald-500 hover:border-emerald-500 ring-emerald-500 focus:ring-emerald-500 shadow-emerald-500 from-emerald-500 via-emerald-500 to-emerald-500 bg-emerald-600 hover:bg-emerald-600 focus:bg-emerald-600 text-emerald-600 hover:text-emerald-600 border-emerald-600 hover:border-emerald-600 ring-emerald-600 focus:ring-emerald-600 shadow-emerald-600 from-emerald-600 via-emerald-600 to-emerald-600 bg-emerald-700 hover:bg-emerald-700 focus:bg-emerald-700 text-emerald-700 hover:text-emerald-700 border-emerald-700 hover:border-emerald-700 ring-emerald-700 focus:ring-emerald-700 shadow-emerald-700 from-emerald-700 via-emerald-700 to-emerald-700 bg-emerald-800 hover:bg-emerald-800 focus:bg-emerald-800 text-emerald-800 hover:text-emerald-800 border-emerald-800 hover:border-emerald-800 ring-emerald-800 focus:ring-emerald-800 shadow-emerald-800 from-emerald-800 via-emerald-800 to-emerald-800 bg-emerald-900 hover:bg-emerald-900 focus:bg-emerald-900 text-emerald-900 hover:text-emerald-900 border-emerald-900 hover:border-emerald-900 ring-emerald-900 focus:ring-emerald-900 shadow-emerald-900 from-emerald-900 via-emerald-900 to-emerald-900 bg-emerald-950 hover:bg-emerald-950 focus:bg-emerald-950 text-emerald-950 hover:text-emerald-950 border-emerald-950 hover:border-emerald-950 ring-emerald-950 focus:ring-emerald-950 shadow-emerald-950 from-emerald-950 via-emerald-950 to-emerald-950 bg-teal-50 hover:bg-teal-50 focus:bg-teal-50 text-teal-50 hover:text-teal-50 border-teal-50 hover:border-teal-50 ring-teal-50 focus:ring-teal-50 shadow-teal-50 from-teal-50 via-teal-50 to-teal-50 bg-teal-100 hover:bg-teal-100 focus:bg-teal-100 text-teal-100 hover:text-teal-100 border-teal-100 hover:border-teal-100 ring-teal-100 focus:ring-teal-100 shadow-teal-100 from-teal-100 via-teal-100 to-teal-100 bg-teal-200 hover:bg-teal-200 focus:bg-teal-200 text-teal-200 hover:text-teal-200 border-teal-200 hover:border-teal-200 ring-teal-200 focus:ring-teal-200 shadow-teal-200 from-teal-200 via-teal-200 to-teal-200 bg-teal-300 hover:bg-teal-300 focus:bg-teal-300 text-teal-300 hover:text-teal-300 border-teal-300 hover:border-teal-300 ring-teal-300 focus:ring-teal-300 shadow-teal-300 from-teal-300 via-teal-300 to-teal-300 bg-teal-400 hover:bg-teal-400 focus:bg-teal-400 text-teal-400 hover:text-teal-400 border-teal-400 hover:border-teal-400 ring-teal-400 focus:ring-teal-400 shadow-teal-400 from-teal-400 via-teal-400 to-teal-400 bg-teal-500 hover:bg-teal-500 focus:bg-teal-500 text-teal-500 hover:text-teal-500 border-teal-500 hover:border-teal-500 ring-teal-500 focus:ring-teal-500 shadow-teal-500 from-teal-500 via-teal-500 to-teal-500 bg-teal-600 hover:bg-teal-600 focus:bg-teal-600 text-teal-600 hover:text-teal-600 border-teal-600 hover:border-teal-600 ring-teal-600 focus:ring-teal-600 shadow-teal-600 from-teal-600 via-teal-600 to-teal-600 bg-teal-700 hover:bg-teal-700 focus:bg-teal-700 text-teal-700 hover:text-teal-700 border-teal-700 hover:border-teal-700 ring-teal-700 focus:ring-teal-700 shadow-teal-700 from-teal-700 via-teal-700 to-teal-700 bg-teal-800 hover:bg-teal-800 focus:bg-teal-800 text-teal-800 hover:text-teal-800 border-teal-800 hover:border-teal-800 ring-teal-800 focus:ring-teal-800 shadow-teal-800 from-teal-800 via-teal-800 to-teal-800 bg-teal-900 hover:bg-teal-900 focus:bg-teal-900 text-teal-900 hover:text-teal-900 border-teal-900 hover:border-teal-900 ring-teal-900 focus:ring-teal-900 shadow-teal-900 from-teal-900 via-teal-900 to-teal-900 bg-teal-950 hover:bg-teal-950 focus:bg-teal-950 text-teal-950 hover:text-teal-950 border-teal-950 hover:border-teal-950 ring-teal-950 focus:ring-teal-950 shadow-teal-950 from-teal-950 via-teal-950 to-teal-950 bg-cyan-50 hover:bg-cyan-50 focus:bg-cyan-50 text-cyan-50 hover:text-cyan-50 border-cyan-50 hover:border-cyan-50 ring-cyan-50 focus:ring-cyan-50 shadow-cyan-50 from-cyan-50 via-cyan-50 to-cyan-50 bg-cyan-100 hover:bg-cyan-100 focus:bg-cyan-100 text-cyan-100 hover:text-cyan-100 border-cyan-100 hover:border-cyan-100 ring-cyan-100 focus:ring-cyan-100 shadow-cyan-100 from-cyan-100 via-cyan-100 to-cyan-100 bg-cyan-200 hover:bg-cyan-200 focus:bg-cyan-200 text-cyan-200 hover:text-cyan-200 border-cyan-200 hover:border-cyan-200 ring-cyan-200 focus:ring-cyan-200 shadow-cyan-200 from-cyan-200 via-cyan-200 to-cyan-200 bg-cyan-300 hover:bg-cyan-300 focus:bg-cyan-300 text-cyan-300 hover:text-cyan-300 border-cyan-300 hover:border-cyan-300 ring-cyan-300 focus:ring-cyan-300 shadow-cyan-300 from-cyan-300 via-cyan-300 to-cyan-300 bg-cyan-400 hover:bg-cyan-400 focus:bg-cyan-400 text-cyan-400 hover:text-cyan-400 border-cyan-400 hover:border-cyan-400 ring-cyan-400 focus:ring-cyan-400 shadow-cyan-400 from-cyan-400 via-cyan-400 to-cyan-400 bg-cyan-500 hover:bg-cyan-500 focus:bg-cyan-500 text-cyan-500 hover:text-cyan-500 border-cyan-500 hover:border-cyan-500 ring-cyan-500 focus:ring-cyan-500 shadow-cyan-500 from-cyan-500 via-cyan-500 to-cyan-500 bg-cyan-600 hover:bg-cyan-600 focus:bg-cyan-600 text-cyan-600 hover:text-cyan-600 border-cyan-600 hover:border-cyan-600 ring-cyan-600 focus:ring-cyan-600 shadow-cyan-600 from-cyan-600 via-cyan-600 to-cyan-600 bg-cyan-700 hover:bg-cyan-700 focus:bg-cyan-700 text-cyan-700 hover:text-cyan-700 border-cyan-700 hover:border-cyan-700 ring-cyan-700 focus:ring-cyan-700 shadow-cyan-700 from-cyan-700 via-cyan-700 to-cyan-700 bg-cyan-800 hover:bg-cyan-800 focus:bg-cyan-800 text-cyan-800 hover:text-cyan-800 border-cyan-800 hover:border-cyan-800 ring-cyan-800 focus:ring-cyan-800 shadow-cyan-800 from-cyan-800 via-cyan-800 to-cyan-800 bg-cyan-900 hover:bg-cyan-900 focus:bg-cyan-900 text-cyan-900 hover:text-cyan-900 border-cyan-900 hover:border-cyan-900 ring-cyan-900 focus:ring-cyan-900 shadow-cyan-900 from-cyan-900 via-cyan-900 to-cyan-900 bg-cyan-950 hover:bg-cyan-950 focus:bg-cyan-950 text-cyan-950 hover:text-cyan-950 border-cyan-950 hover:border-cyan-950 ring-cyan-950 focus:ring-cyan-950 shadow-cyan-950 from-cyan-950 via-cyan-950 to-cyan-950 bg-sky-50 hover:bg-sky-50 focus:bg-sky-50 text-sky-50 hover:text-sky-50 border-sky-50 hover:border-sky-50 ring-sky-50 focus:ring-sky-50 shadow-sky-50 from-sky-50 via-sky-50 to-sky-50 bg-sky-100 hover:bg-sky-100 focus:bg-sky-100 text-sky-100 hover:text-sky-100 border-sky-100 hover:border-sky-100 ring-sky-100 focus:ring-sky-100 shadow-sky-100 from-sky-100 via-sky-100 to-sky-100 bg-sky-200 hover:bg-sky-200 focus:bg-sky-200 text-sky-200 hover:text-sky-200 border-sky-200 hover:border-sky-200 ring-sky-200 focus:ring-sky-200 shadow-sky-200 from-sky-200 via-sky-200 to-sky-200 bg-sky-300 hover:bg-sky-300 focus:bg-sky-300 text-sky-300 hover:text-sky-300 border-sky-300 hover:border-sky-300 ring-sky-300 focus:ring-sky-300 shadow-sky-300 from-sky-300 via-sky-300 to-sky-300 bg-sky-400 hover:bg-sky-400 focus:bg-sky-400 text-sky-400 hover:text-sky-400 border-sky-400 hover:border-sky-400 ring-sky-400 focus:ring-sky-400 shadow-sky-400 from-sky-400 via-sky-400 to-sky-400 bg-sky-500 hover:bg-sky-500 focus:bg-sky-500 text-sky-500 hover:text-sky-500 border-sky-500 hover:border-sky-500 ring-sky-500 focus:ring-sky-500 shadow-sky-500 from-sky-500 via-sky-500 to-sky-500 bg-sky-600 hover:bg-sky-600 focus:bg-sky-600 text-sky-600 hover:text-sky-600 border-sky-600 hover:border-sky-600 ring-sky-600 focus:ring-sky-600 shadow-sky-600 from-sky-600 via-sky-600 to-sky-600 bg-sky-700 hover:bg-sky-700 focus:bg-sky-700 text-sky-700 hover:text-sky-700 border-sky-700 hover:border-sky-700 ring-sky-700 focus:ring-sky-700 shadow-sky-700 from-sky-700 via-sky-700 to-sky-700 bg-sky-800 hover:bg-sky-800 focus:bg-sky-800 text-sky-800 hover:text-sky-800 border-sky-800 hover:border-sky-800 ring-sky-800 focus:ring-sky-800 shadow-sky-800 from-sky-800 via-sky-800 to-sky-800 bg-sky-900 hover:bg-sky-900 focus:bg-sky-900 text-sky-900 hover:text-sky-900 border-sky-900 hover:border-sky-900 ring-sky-900 focus:ring-sky-900 shadow-sky-900 from-sky-900 via-sky-900 to-sky-900 bg-sky-950 hover:bg-sky-950 focus:bg-sky-950 text-sky-950 hover:text-sky-950 border-sky-950 hover:border-sky-950 ring-sky-950 focus:ring-sky-950 shadow-sky-950 from-sky-950 via-sky-950 to-sky-950 bg-blue-50 hover:bg-blue-50 focus:bg-blue-50 text-blue-50 hover:text-blue-50 border-blue-50 hover:border-blue-50 ring-blue-50 focus:ring-blue-50 shadow-blue-50 from-blue-50 via-blue-50 to-blue-50 bg-blue-100 hover:bg-blue-100 focus:bg-blue-100 text-blue-100 hover:text-blue-100 border-blue-100 hover:border-blue-100 ring-blue-100 focus:ring-blue-100 shadow-blue-100 from-blue-100 via-blue-100 to-blue-100 bg-blue-200 hover:bg-blue-200 focus:bg-blue-200 text-blue-200 hover:text-blue-200 border-blue-200 hover:border-blue-200 ring-blue-200 focus:ring-blue-200 shadow-blue-200 from-blue-200 via-blue-200 to-blue-200 bg-blue-300 hover:bg-blue-300 focus:bg-blue-300 text-blue-300 hover:text-blue-300 border-blue-300 hover:border-blue-300 ring-blue-300 focus:ring-blue-300 shadow-blue-300 from-blue-300 via-blue-300 to-blue-300 bg-blue-400 hover:bg-blue-400 focus:bg-blue-400 text-blue-400 hover:text-blue-400 border-blue-400 hover:border-blue-400 ring-blue-400 focus:ring-blue-400 shadow-blue-400 from-blue-400 via-blue-400 to-blue-400 bg-blue-500 hover:bg-blue-500 focus:bg-blue-500 text-blue-500 hover:text-blue-500 border-blue-500 hover:border-blue-500 ring-blue-500 focus:ring-blue-500 shadow-blue-500 from-blue-500 via-blue-500 to-blue-500 bg-blue-600 hover:bg-blue-600 focus:bg-blue-600 text-blue-600 hover:text-blue-600 border-blue-600 hover:border-blue-600 ring-blue-600 focus:ring-blue-600 shadow-blue-600 from-blue-600 via-blue-600 to-blue-600 bg-blue-700 hover:bg-blue-700 focus:bg-blue-700 text-blue-700 hover:text-blue-700 border-blue-700 hover:border-blue-700 ring-blue-700 focus:ring-blue-700 shadow-blue-700 from-blue-700 via-blue-700 to-blue-700 bg-blue-800 hover:bg-blue-800 focus:bg-blue-800 text-blue-800 hover:text-blue-800 border-blue-800 hover:border-blue-800 ring-blue-800 focus:ring-blue-800 shadow-blue-800 from-blue-800 via-blue-800 to-blue-800 bg-blue-900 hover:bg-blue-900 focus:bg-blue-900 text-blue-900 hover:text-blue-900 border-blue-900 hover:border-blue-900 ring-blue-900 focus:ring-blue-900 shadow-blue-900 from-blue-900 via-blue-900 to-blue-900 bg-blue-950 hover:bg-blue-950 focus:bg-blue-950 text-blue-950 hover:text-blue-950 border-blue-950 hover:border-blue-950 ring-blue-950 focus:ring-blue-950 shadow-blue-950 from-blue-950 via-blue-950 to-blue-950 bg-indigo-50 hover:bg-indigo-50 focus:bg-indigo-50 text-indigo-50 hover:text-indigo-50 border-indigo-50 hover:border-indigo-50 ring-indigo-50 focus:ring-indigo-50 shadow-indigo-50 from-indigo-50 via-indigo-50 to-indigo-50 bg-indigo-100 hover:bg-indigo-100 focus:bg-indigo-100 text-indigo-100 hover:text-indigo-100 border-indigo-100 hover:border-indigo-100 ring-indigo-100 focus:ring-indigo-100 shadow-indigo-100 from-indigo-100 via-indigo-100 to-indigo-100 bg-indigo-200 hover:bg-indigo-200 focus:bg-indigo-200 text-indigo-200 hover:text-indigo-200 border-indigo-200 hover:border-indigo-200 ring-indigo-200 focus:ring-indigo-200 shadow-indigo-200 from-indigo-200 via-indigo-200 to-indigo-200 bg-indigo-300 hover:bg-indigo-300 focus:bg-indigo-300 text-indigo-300 hover:text-indigo-300 border-indigo-300 hover:border-indigo-300 ring-indigo-300 focus:ring-indigo-300 shadow-indigo-300 from-indigo-300 via-indigo-300 to-indigo-300 bg-indigo-400 hover:bg-indigo-400 focus:bg-indigo-400 text-indigo-400 hover:text-indigo-400 border-indigo-400 hover:border-indigo-400 ring-indigo-400 focus:ring-indigo-400 shadow-indigo-400 from-indigo-400 via-indigo-400 to-indigo-400 bg-indigo-500 hover:bg-indigo-500 focus:bg-indigo-500 text-indigo-500 hover:text-indigo-500 border-indigo-500 hover:border-indigo-500 ring-indigo-500 focus:ring-indigo-500 shadow-indigo-500 from-indigo-500 via-indigo-500 to-indigo-500 bg-indigo-600 hover:bg-indigo-600 focus:bg-indigo-600 text-indigo-600 hover:text-indigo-600 border-indigo-600 hover:border-indigo-600 ring-indigo-600 focus:ring-indigo-600 shadow-indigo-600 from-indigo-600 via-indigo-600 to-indigo-600 bg-indigo-700 hover:bg-indigo-700 focus:bg-indigo-700 text-indigo-700 hover:text-indigo-700 border-indigo-700 hover:border-indigo-700 ring-indigo-700 focus:ring-indigo-700 shadow-indigo-700 from-indigo-700 via-indigo-700 to-indigo-700 bg-indigo-800 hover:bg-indigo-800 focus:bg-indigo-800 text-indigo-800 hover:text-indigo-800 border-indigo-800 hover:border-indigo-800 ring-indigo-800 focus:ring-indigo-800 shadow-indigo-800 from-indigo-800 via-indigo-800 to-indigo-800 bg-indigo-900 hover:bg-indigo-900 focus:bg-indigo-900 text-indigo-900 hover:text-indigo-900 border-indigo-900 hover:border-indigo-900 ring-indigo-900 focus:ring-indigo-900 shadow-indigo-900 from-indigo-900 via-indigo-900 to-indigo-900 bg-indigo-950 hover:bg-indigo-950 focus:bg-indigo-950 text-indigo-950 hover:text-indigo-950 border-indigo-950 hover:border-indigo-950 ring-indigo-950 focus:ring-indigo-950 shadow-indigo-950 from-indigo-950 via-indigo-950 to-indigo-950 bg-violet-50 hover:bg-violet-50 focus:bg-violet-50 text-violet-50 hover:text-violet-50 border-violet-50 hover:border-violet-50 ring-violet-50 focus:ring-violet-50 shadow-violet-50 from-violet-50 via-violet-50 to-violet-50 bg-violet-100 hover:bg-violet-100 focus:bg-violet-100 text-violet-100 hover:text-violet-100 border-violet-100 hover:border-violet-100 ring-violet-100 focus:ring-violet-100 shadow-violet-100 from-violet-100 via-violet-100 to-violet-100 bg-violet-200 hover:bg-violet-200 focus:bg-violet-200 text-violet-200 hover:text-violet-200 border-violet-200 hover:border-violet-200 ring-violet-200 focus:ring-violet-200 shadow-violet-200 from-violet-200 via-violet-200 to-violet-200 bg-violet-300 hover:bg-violet-300 focus:bg-violet-300 text-violet-300 hover:text-violet-300 border-violet-300 hover:border-violet-300 ring-violet-300 focus:ring-violet-300 shadow-violet-300 from-violet-300 via-violet-300 to-violet-300 bg-violet-400 hover:bg-violet-400 focus:bg-violet-400 text-violet-400 hover:text-violet-400 border-violet-400 hover:border-violet-400 ring-violet-400 focus:ring-violet-400 shadow-violet-400 from-violet-400 via-violet-400 to-violet-400 bg-violet-500 hover:bg-violet-500 focus:bg-violet-500 text-violet-500 hover:text-violet-500 border-violet-500 hover:border-violet-500 ring-violet-500 focus:ring-violet-500 shadow-violet-500 from-violet-500 via-violet-500 to-violet-500 bg-violet-600 hover:bg-violet-600 focus:bg-violet-600 text-violet-600 hover:text-violet-600 border-violet-600 hover:border-violet-600 ring-violet-600 focus:ring-violet-600 shadow-violet-600 from-violet-600 via-violet-600 to-violet-600 bg-violet-700 hover:bg-violet-700 focus:bg-violet-700 text-violet-700 hover:text-violet-700 border-violet-700 hover:border-violet-700 ring-violet-700 focus:ring-violet-700 shadow-violet-700 from-violet-700 via-violet-700 to-violet-700 bg-violet-800 hover:bg-violet-800 focus:bg-violet-800 text-violet-800 hover:text-violet-800 border-violet-800 hover:border-violet-800 ring-violet-800 focus:ring-violet-800 shadow-violet-800 from-violet-800 via-violet-800 to-violet-800 bg-violet-900 hover:bg-violet-900 focus:bg-violet-900 text-violet-900 hover:text-violet-900 border-violet-900 hover:border-violet-900 ring-violet-900 focus:ring-violet-900 shadow-violet-900 from-violet-900 via-violet-900 to-violet-900 bg-violet-950 hover:bg-violet-950 focus:bg-violet-950 text-violet-950 hover:text-violet-950 border-violet-950 hover:border-violet-950 ring-violet-950 focus:ring-violet-950 shadow-violet-950 from-violet-950 via-violet-950 to-violet-950 bg-purple-50 hover:bg-purple-50 focus:bg-purple-50 text-purple-50 hover:text-purple-50 border-purple-50 hover:border-purple-50 ring-purple-50 focus:ring-purple-50 shadow-purple-50 from-purple-50 via-purple-50 to-purple-50 bg-purple-100 hover:bg-purple-100 focus:bg-purple-100 text-purple-100 hover:text-purple-100 border-purple-100 hover:border-purple-100 ring-purple-100 focus:ring-purple-100 shadow-purple-100 from-purple-100 via-purple-100 to-purple-100 bg-purple-200 hover:bg-purple-200 focus:bg-purple-200 text-purple-200 hover:text-purple-200 border-purple-200 hover:border-purple-200 ring-purple-200 focus:ring-purple-200 shadow-purple-200 from-purple-200 via-purple-200 to-purple-200 bg-purple-300 hover:bg-purple-300 focus:bg-purple-300 text-purple-300 hover:text-purple-300 border-purple-300 hover:border-purple-300 ring-purple-300 focus:ring-purple-300 shadow-purple-300 from-purple-300 via-purple-300 to-purple-300 bg-purple-400 hover:bg-purple-400 focus:bg-purple-400 text-purple-400 hover:text-purple-400 border-purple-400 hover:border-purple-400 ring-purple-400 focus:ring-purple-400 shadow-purple-400 from-purple-400 via-purple-400 to-purple-400 bg-purple-500 hover:bg-purple-500 focus:bg-purple-500 text-purple-500 hover:text-purple-500 border-purple-500 hover:border-purple-500 ring-purple-500 focus:ring-purple-500 shadow-purple-500 from-purple-500 via-purple-500 to-purple-500 bg-purple-600 hover:bg-purple-600 focus:bg-purple-600 text-purple-600 hover:text-purple-600 border-purple-600 hover:border-purple-600 ring-purple-600 focus:ring-purple-600 shadow-purple-600 from-purple-600 via-purple-600 to-purple-600 bg-purple-700 hover:bg-purple-700 focus:bg-purple-700 text-purple-700 hover:text-purple-700 border-purple-700 hover:border-purple-700 ring-purple-700 focus:ring-purple-700 shadow-purple-700 from-purple-700 via-purple-700 to-purple-700 bg-purple-800 hover:bg-purple-800 focus:bg-purple-800 text-purple-800 hover:text-purple-800 border-purple-800 hover:border-purple-800 ring-purple-800 focus:ring-purple-800 shadow-purple-800 from-purple-800 via-purple-800 to-purple-800 bg-purple-900 hover:bg-purple-900 focus:bg-purple-900 text-purple-900 hover:text-purple-900 border-purple-900 hover:border-purple-900 ring-purple-900 focus:ring-purple-900 shadow-purple-900 from-purple-900 via-purple-900 to-purple-900 bg-purple-950 hover:bg-purple-950 focus:bg-purple-950 text-purple-950 hover:text-purple-950 border-purple-950 hover:border-purple-950 ring-purple-950 focus:ring-purple-950 shadow-purple-950 from-purple-950 via-purple-950 to-purple-950 bg-fuchsia-50 hover:bg-fuchsia-50 focus:bg-fuchsia-50 text-fuchsia-50 hover:text-fuchsia-50 border-fuchsia-50 hover:border-fuchsia-50 ring-fuchsia-50 focus:ring-fuchsia-50 shadow-fuchsia-50 from-fuchsia-50 via-fuchsia-50 to-fuchsia-50 bg-fuchsia-100 hover:bg-fuchsia-100 focus:bg-fuchsia-100 text-fuchsia-100 hover:text-fuchsia-100 border-fuchsia-100 hover:border-fuchsia-100 ring-fuchsia-100 focus:ring-fuchsia-100 shadow-fuchsia-100 from-fuchsia-100 via-fuchsia-100 to-fuchsia-100 bg-fuchsia-200 hover:bg-fuchsia-200 focus:bg-fuchsia-200 text-fuchsia-200 hover:text-fuchsia-200 border-fuchsia-200 hover:border-fuchsia-200 ring-fuchsia-200 focus:ring-fuchsia-200 shadow-fuchsia-200 from-fuchsia-200 via-fuchsia-200 to-fuchsia-200 bg-fuchsia-300 hover:bg-fuchsia-300 focus:bg-fuchsia-300 text-fuchsia-300 hover:text-fuchsia-300 border-fuchsia-300 hover:border-fuchsia-300 ring-fuchsia-300 focus:ring-fuchsia-300 shadow-fuchsia-300 from-fuchsia-300 via-fuchsia-300 to-fuchsia-300 bg-fuchsia-400 hover:bg-fuchsia-400 focus:bg-fuchsia-400 text-fuchsia-400 hover:text-fuchsia-400 border-fuchsia-400 hover:border-fuchsia-400 ring-fuchsia-400 focus:ring-fuchsia-400 shadow-fuchsia-400 from-fuchsia-400 via-fuchsia-400 to-fuchsia-400 bg-fuchsia-500 hover:bg-fuchsia-500 focus:bg-fuchsia-500 text-fuchsia-500 hover:text-fuchsia-500 border-fuchsia-500 hover:border-fuchsia-500 ring-fuchsia-500 focus:ring-fuchsia-500 shadow-fuchsia-500 from-fuchsia-500 via-fuchsia-500 to-fuchsia-500 bg-fuchsia-600 hover:bg-fuchsia-600 focus:bg-fuchsia-600 text-fuchsia-600 hover:text-fuchsia-600 border-fuchsia-600 hover:border-fuchsia-600 ring-fuchsia-600 focus:ring-fuchsia-600 shadow-fuchsia-600 from-fuchsia-600 via-fuchsia-600 to-fuchsia-600 bg-fuchsia-700 hover:bg-fuchsia-700 focus:bg-fuchsia-700 text-fuchsia-700 hover:text-fuchsia-700 border-fuchsia-700 hover:border-fuchsia-700 ring-fuchsia-700 focus:ring-fuchsia-700 shadow-fuchsia-700 from-fuchsia-700 via-fuchsia-700 to-fuchsia-700 bg-fuchsia-800 hover:bg-fuchsia-800 focus:bg-fuchsia-800 text-fuchsia-800 hover:text-fuchsia-800 border-fuchsia-800 hover:border-fuchsia-800 ring-fuchsia-800 focus:ring-fuchsia-800 shadow-fuchsia-800 from-fuchsia-800 via-fuchsia-800 to-fuchsia-800 bg-fuchsia-900 hover:bg-fuchsia-900 focus:bg-fuchsia-900 text-fuchsia-900 hover:text-fuchsia-900 border-fuchsia-900 hover:border-fuchsia-900 ring-fuchsia-900 focus:ring-fuchsia-900 shadow-fuchsia-900 from-fuchsia-900 via-fuchsia-900 to-fuchsia-900 bg-fuchsia-950 hover:bg-fuchsia-950 focus:bg-fuchsia-950 text-fuchsia-950 hover:text-fuchsia-950 border-fuchsia-950 hover:border-fuchsia-950 ring-fuchsia-950 focus:ring-fuchsia-950 shadow-fuchsia-950 from-fuchsia-950 via-fuchsia-950 to-fuchsia-950 bg-pink-50 hover:bg-pink-50 focus:bg-pink-50 text-pink-50 hover:text-pink-50 border-pink-50 hover:border-pink-50 ring-pink-50 focus:ring-pink-50 shadow-pink-50 from-pink-50 via-pink-50 to-pink-50 bg-pink-100 hover:bg-pink-100 focus:bg-pink-100 text-pink-100 hover:text-pink-100 border-pink-100 hover:border-pink-100 ring-pink-100 focus:ring-pink-100 shadow-pink-100 from-pink-100 via-pink-100 to-pink-100 bg-pink-200 hover:bg-pink-200 focus:bg-pink-200 text-pink-200 hover:text-pink-200 border-pink-200 hover:border-pink-200 ring-pink-200 focus:ring-pink-200 shadow-pink-200 from-pink-200 via-pink-200 to-pink-200 bg-pink-300 hover:bg-pink-300 focus:bg-pink-300 text-pink-300 hover:text-pink-300 border-pink-300 hover:border-pink-300 ring-pink-300 focus:ring-pink-300 shadow-pink-300 from-pink-300 via-pink-300 to-pink-300 bg-pink-400 hover:bg-pink-400 focus:bg-pink-400 text-pink-400 hover:text-pink-400 border-pink-400 hover:border-pink-400 ring-pink-400 focus:ring-pink-400 shadow-pink-400 from-pink-400 via-pink-400 to-pink-400 bg-pink-500 hover:bg-pink-500 focus:bg-pink-500 text-pink-500 hover:text-pink-500 border-pink-500 hover:border-pink-500 ring-pink-500 focus:ring-pink-500 shadow-pink-500 from-pink-500 via-pink-500 to-pink-500 bg-pink-600 hover:bg-pink-600 focus:bg-pink-600 text-pink-600 hover:text-pink-600 border-pink-600 hover:border-pink-600 ring-pink-600 focus:ring-pink-600 shadow-pink-600 from-pink-600 via-pink-600 to-pink-600 bg-pink-700 hover:bg-pink-700 focus:bg-pink-700 text-pink-700 hover:text-pink-700 border-pink-700 hover:border-pink-700 ring-pink-700 focus:ring-pink-700 shadow-pink-700 from-pink-700 via-pink-700 to-pink-700 bg-pink-800 hover:bg-pink-800 focus:bg-pink-800 text-pink-800 hover:text-pink-800 border-pink-800 hover:border-pink-800 ring-pink-800 focus:ring-pink-800 shadow-pink-800 from-pink-800 via-pink-800 to-pink-800 bg-pink-900 hover:bg-pink-900 focus:bg-pink-900 text-pink-900 hover:text-pink-900 border-pink-900 hover:border-pink-900 ring-pink-900 focus:ring-pink-900 shadow-pink-900 from-pink-900 via-pink-900 to-pink-900 bg-pink-950 hover:bg-pink-950 focus:bg-pink-950 text-pink-950 hover:text-pink-950 border-pink-950 hover:border-pink-950 ring-pink-950 focus:ring-pink-950 shadow-pink-950 from-pink-950 via-pink-950 to-pink-950 bg-rose-50 hover:bg-rose-50 focus:bg-rose-50 text-rose-50 hover:text-rose-50 border-rose-50 hover:border-rose-50 ring-rose-50 focus:ring-rose-50 shadow-rose-50 from-rose-50 via-rose-50 to-rose-50 bg-rose-100 hover:bg-rose-100 focus:bg-rose-100 text-rose-100 hover:text-rose-100 border-rose-100 hover:border-rose-100 ring-rose-100 focus:ring-rose-100 shadow-rose-100 from-rose-100 via-rose-100 to-rose-100 bg-rose-200 hover:bg-rose-200 focus:bg-rose-200 text-rose-200 hover:text-rose-200 border-rose-200 hover:border-rose-200 ring-rose-200 focus:ring-rose-200 shadow-rose-200 from-rose-200 via-rose-200 to-rose-200 bg-rose-300 hover:bg-rose-300 focus:bg-rose-300 text-rose-300 hover:text-rose-300 border-rose-300 hover:border-rose-300 ring-rose-300 focus:ring-rose-300 shadow-rose-300 from-rose-300 via-rose-300 to-rose-300 bg-rose-400 hover:bg-rose-400 focus:bg-rose-400 text-rose-400 hover:text-rose-400 border-rose-400 hover:border-rose-400 ring-rose-400 focus:ring-rose-400 shadow-rose-400 from-rose-400 via-rose-400 to-rose-400 bg-rose-500 hover:bg-rose-500 focus:bg-rose-500 text-rose-500 hover:text-rose-500 border-rose-500 hover:border-rose-500 ring-rose-500 focus:ring-rose-500 shadow-rose-500 from-rose-500 via-rose-500 to-rose-500 bg-rose-600 hover:bg-rose-600 focus:bg-rose-600 text-rose-600 hover:text-rose-600 border-rose-600 hover:border-rose-600 ring-rose-600 focus:ring-rose-600 shadow-rose-600 from-rose-600 via-rose-600 to-rose-600 bg-rose-700 hover:bg-rose-700 focus:bg-rose-700 text-rose-700 hover:text-rose-700 border-rose-700 hover:border-rose-700 ring-rose-700 focus:ring-rose-700 shadow-rose-700 from-rose-700 via-rose-700 to-rose-700 bg-rose-800 hover:bg-rose-800 focus:bg-rose-800 text-rose-800 hover:text-rose-800 border-rose-800 hover:border-rose-800 ring-rose-800 focus:ring-rose-800 shadow-rose-800 from-rose-800 via-rose-800 to-rose-800 bg-rose-900 hover:bg-rose-900 focus:bg-rose-900 text-rose-900 hover:text-rose-900 border-rose-900 hover:border-rose-900 ring-rose-900 focus:ring-rose-900 shadow-rose-900 from-rose-900 via-rose-900 to-rose-900 bg-rose-950 hover:bg-rose-950 focus:bg-rose-950 text-rose-950 hover:text-rose-950 border-rose-950 hover:border-rose-950 ring-rose-950 focus:ring-rose-950 shadow-rose-950 from-rose-950 via-rose-950 to-rose-950 bg-gradient-to-t bg-gradient-to-tr bg-gradient-to-r bg-gradient-to-br bg-gradient-to-b bg-gradient-to-bl bg-gradient-to-l bg-gradient-to-tl bg-linear-to-t bg-linear-to-tr bg-linear-to-r bg-linear-to-br bg-linear-to-b bg-linear-to-bl bg-linear-to-l bg-linear-to-tl mt-10 p-8 p-10 p-12 gap-4 grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-8 dark:text-slate-200 dark:text-slate-400 dark:text-white text-sm font-semibold text-center text-white uppercase tracking-[0.3em] tracking-wide tracking-widest bg-white/5 bg-white/10 border-white/10 border-white/20 bg-slate-50 hover:bg-slate-100 dark:bg-white/5 dark:hover:bg-white/10 from-blue-400 to-cyan-400 from-blue-500/10 to-purple-500/10
+`;

package/templates/nextblock-template/lib/editor/dynamic-extension-core.test.ts

@@ -0,0 +1,172 @@
+// @vitest-environment jsdom
+
+import { Editor } from '@tiptap/core';
+import StarterKit from '@tiptap/starter-kit';
+import { describe, expect, it } from 'vitest';
+
+import {
+  buildDynamicCustomBlockInsertContent,
+  createDynamicCustomBlockExtensions,
+  getDynamicCustomBlockAttributeNames,
+  getDynamicCustomBlockNodeName,
+  type DynamicCustomBlockEditorDefinition,
+} from './dynamic-extension-core';
+
+const testimonialDefinition: DynamicCustomBlockEditorDefinition = {
+  fields: [
+    { key: 'quote', label: 'Quote', required: false, type: 'rich-text' },
+    { key: 'author_name', label: 'Author Name', required: false, type: 'text' },
+    {
+      key: 'portrait',
+      label: 'Portrait',
+      required: false,
+      type: 'image_r2',
+    },
+    {
+      display_column: 'full_name',
+      key: 'customer',
+      label: 'Customer',
+      multiple: false,
+      required: false,
+      table: 'profiles',
+      type: 'db_relation',
+      value_column: 'id',
+    },
+  ],
+  id: '11111111-1111-4111-8111-111111111111',
+  layout_schema: {
+    children: [
+      {
+        children: [
+          { field_key: 'quote', type: 'field_render' },
+          { field_key: 'author_name', type: 'field_render' },
+        ],
+        type: 'container',
+      },
+    ],
+    type: 'container',
+  },
+  name: 'Testimonial Card',
+  slug: 'testimonial-card',
+};
+
+function createEditor(content: Record<string, unknown>) {
+  return new Editor({
+    content,
+    extensions: [
+      StarterKit.configure({
+        undoRedo: false,
+      }),
+      ...createDynamicCustomBlockExtensions([testimonialDefinition]),
+    ],
+  });
+}
+
+describe('dynamic custom block Tiptap extensions', () => {
+  it('creates a stable ProseMirror node name and schema attributes for every field', () => {
+    expect(getDynamicCustomBlockNodeName('testimonial-card')).toBe(
+      'customBlock_testimonial_card'
+    );
+    expect(getDynamicCustomBlockAttributeNames(testimonialDefinition)).toEqual([
+      'customBlockId',
+      'customBlockSlug',
+      'customBlockName',
+      'customBlockLayoutSchema',
+      'quote',
+      'author_name',
+      'portrait',
+      'customer',
+    ]);
+  });
+
+  it('allows deeply nested custom block nodes alongside fixed rich-text blocks', () => {
+    const nodeName = getDynamicCustomBlockNodeName(testimonialDefinition.slug);
+    const editor = createEditor({
+      content: [
+        {
+          attrs: {
+            author_name: 'Ada Lovelace',
+            customer: 'profile-1',
+            quote: '<p>Blocks can nest.</p>',
+          },
+          content: [
+            {
+              content: [{ text: 'Fixed paragraph inside a generated block.', type: 'text' }],
+              type: 'paragraph',
+            },
+            buildDynamicCustomBlockInsertContent(testimonialDefinition, {
+              author_name: 'Grace Hopper',
+              customer: 'profile-2',
+              quote: 'Nested dynamic block',
+            }),
+          ],
+          type: nodeName,
+        },
+      ],
+      type: 'doc',
+    });
+
+    const json = editor.getJSON();
+    expect(json.content?.[0]?.type).toBe(nodeName);
+    expect(json.content?.[0]?.content?.[0]?.type).toBe('paragraph');
+    expect(json.content?.[0]?.content?.[1]?.type).toBe(nodeName);
+    expect(json.content?.[0]?.attrs).toMatchObject({
+      author_name: 'Ada Lovelace',
+      customer: 'profile-1',
+      customBlockSlug: 'testimonial-card',
+      quote: '<p>Blocks can nest.</p>',
+    });
+
+    editor.destroy();
+  });
+
+  it('round-trips generated data attributes through Tiptap HTML parsing', () => {
+    const nodeName = getDynamicCustomBlockNodeName(testimonialDefinition.slug);
+    const editor = createEditor({
+      content: [
+        buildDynamicCustomBlockInsertContent(
+          testimonialDefinition,
+          {
+            author_name: 'Katherine Johnson',
+            customer: 'profile-3',
+            portrait: {
+              object_key: 'custom-blocks/portraits/katherine.webp',
+              url: '/custom-blocks/portraits/katherine.webp',
+            },
+            quote: 'Math made the mission possible.',
+          },
+          [
+            {
+              content: [{ text: 'Nested editable content survives.', type: 'text' }],
+              type: 'paragraph',
+            },
+          ]
+        ),
+      ],
+      type: 'doc',
+    });
+    const html = editor.getHTML();
+
+    expect(html).toContain('data-nextblock-custom-block');
+    expect(html).toContain('data-field-author_name="Katherine Johnson"');
+    expect(html).toContain('data-field-customer="profile-3"');
+    expect(html).toContain('data-field-portrait="{&quot;object_key&quot;');
+
+    editor.commands.setContent(html, { emitUpdate: false });
+    const parsed = editor.getJSON();
+
+    expect(parsed.content?.[0]?.type).toBe(nodeName);
+    expect(parsed.content?.[0]?.attrs).toMatchObject({
+      author_name: 'Katherine Johnson',
+      customer: 'profile-3',
+      portrait: {
+        object_key: 'custom-blocks/portraits/katherine.webp',
+        url: '/custom-blocks/portraits/katherine.webp',
+      },
+      quote: 'Math made the mission possible.',
+    });
+    expect(parsed.content?.[0]?.content?.[0]?.type).toBe('paragraph');
+
+    editor.destroy();
+  });
+});