rune-lab 0.0.7 → 0.0.8

package/README.md

@@ -1,5 +1,5 @@
 <h1 align="center">
-  <img src="https://raw.githubusercontent.com/Yrrrrrf/rune-lab/main/static/rune.png" alt="Rune Lab Icon" width="128" height="128" description="Some rune that represents the Svelte rune system">
+  <img src="https://raw.githubusercontent.com/Yrrrrrf/rune-lab/main/static/rune.png" alt="Rune Lab Icon" width="128" height="128" description="Icon representing the Svelte Runes system">
   <div align="center">Rune Lab</div>
 </h1>
 
@@ -14,48 +14,61 @@
 
 ## Overview
 
-Rune Lab is a modern component library built with Svelte 5, focused on providing powerful,
-reactive UI components using Svelte's runes system. It offers a comprehensive set of components,
-theming capabilities, and utilities for building modern web applications.
+**Rune Lab** is your modern toolkit for crafting stunning, reactive web applications with
+**Svelte 5**. Harnessing the power of Svelte's new **Runes** system, Rune Lab offers a suite of
+elegant UI components designed for seamless data handling and beautiful theming.
 
-## Features
+It's built to integrate effortlessly with your data sources, especially shining when connected
+to the [prism-py](https://github.com/Yrrrrrf/prism-py) and
+[prism-ts](https://github.com/Yrrrrrf/prism-ts) ecosystem for end-to-end type-safe API
+interactions.
 
-- **🧪 Svelte 5 Runes**: Built with Svelte 5's powerful reactivity primitives
-- **🎨 Theme System**: Extensive theming with DaisyUI integration
-- **🔄 Type Safety**: Full TypeScript support with strong typing
-- **📊 Data Visualization**: Components for visualizing complex data
-- **🌐 API Integration**: Tools for type-safe API interactions
-- **📦 Zero Dependencies**: Lightweight core with optional integrations
-- **🦕 Deno & NPM**: Available on both JSR and NPM
+## Key Features
+
+- **✨ Svelte 5 Runes Core:** Experience fine-grained reactivity and cleaner component logic.
+- **🎨 Dynamic Theming:** Powered by DaisyUI & Tailwind CSS for extensive customization and
+  out-of-the-box themes.
+- **🔒 TypeScript First:** Robust type-safety for a confident and productive development
+  workflow.
+- **📊 Data-Aware Components:** Tools and components built to handle and visualize complex data.
+- **🛰️ Interactive Schema Explorer:** A standout feature! Visually explore and interact with
+  database schemas exposed by `prism-py` APIs directly within your Svelte application. Test CRUD
+  operations, execute functions, and understand your data structure like never before.
+- **🌐 Smart API Integration:** Includes `apiStore` (using `prism-ts`) for easy and type-safe
+  connection to backend APIs.
+- **📦 Lightweight Core:** Designed to be lean, with optional integrations.
+- **🦕 Universal Access:** Available on JSR (for Deno) and NPM (for Node.js/Bun/Yarn).
+
+## The Prism Ecosystem Advantage
+
+Rune Lab is designed to be a perfect companion to the Prism ecosystem:
+
+- **[prism-py](https://github.com/Yrrrrrf/prism-py):** Automatically generates REST APIs from
+  your database schema.
+- **[prism-ts](https://github.com/Yrrrrrf/prism-ts):** A TypeScript client that consumes these
+  APIs with full type-safety.
+
+When used together, Rune Lab's API integration tools (like the `apiStore` and
+`RLSchemaExplorer`) provide a remarkably streamlined and type-safe path from your backend data
+to your frontend UI.
 
 ## Installation
 
-### Using Deno / JSR
+### Using Deno / [JSR](https://jsr.io/@yrrrrrf/rune-lab)
 
 ```bash
 # Add to your Deno project
 deno add @yrrrrrf/rune-lab
 ```
 
-### Using NPM / Bun / Yarn
+### Using [NPM](https://www.npmjs.com/package/rune-lab) / Bun / Yarn
 
 ```bash
-# NPM
 npm install rune-lab
-
-# Bun
 bun add rune-lab
-
-# Yarn
 yarn add rune-lab
 ```
 
 ## License
 
 MIT License - See [LICENSE](LICENSE) for details.
-
----
-
-<div align="center">
-  Built with ❤️ using Svelte 5 and Deno
-</div>

package/dist/components/dataview/RLMetadataTable.svelte

@@ -1,6 +1,7 @@
 <!-- src/lib/components/dataview/RLMetadataTable.svelte -->
 <script lang="ts">
     import type { ColumnMetadata, ColumnReference, EnumMetadata } from '@yrrrrrf/prism-ts';
+        import { formatReferenceText } from '../../tools/form-helpers.js';
 
     let {
         title,
@@ -18,10 +19,6 @@
         onEnumClick?: (enumData: { name: string; values: string[] }) => void; // Make optional
     }>();
 
-    function formatReferenceText(ref: ColumnReference | undefined): string {
-        if (!ref) return '';
-        return `${ref.schema}.${ref.table}.${ref.column}`;
-    }
 
     function handleFkButtonClick(ref: ColumnReference | undefined) {
         if (ref && onFkClick) {

package/dist/components/explorer/RLSchemaExplorer.svelte

@@ -1,15 +1,10 @@
 <!-- src/lib/components/explorer/RLSchemaExplorer.svelte -->
-// src/lib/components/explorer/RLSchemaExplorer.svelte
 <script lang="ts">
     import type {
-        SchemaMetadata,
-        TableMetadata,
-        ViewMetadata,
-        EnumMetadata,
-        FunctionMetadata,
-        ColumnMetadata,
-        ColumnReference,
-        FunctionParameter,
+        SchemaMetadata as PrismSchemaMetadata, // Original type from prism-ts
+        // Other prism-ts types might be needed if used directly for options in openModalForApi
+        ColumnMetadata as PrismColumnMetadata,
+        FunctionParameter as PrismFunctionParameter,
     } from '@yrrrrrf/prism-ts';
     import { apiStore } from '../stores/api.svelte';
     import { explorerStore, type ExplorerEntityType as StoreExplorerEntityType } from '../stores/explorer.svelte';
@@ -17,14 +12,14 @@
     import RLApiInterface from '../api/RLApiInterface.svelte';
     import RLApiOperationModal from '../api/RLApiOperationModal.svelte';
 
-    // If EntityType is used in the template, it can be aliased from the store's export
-    // type EntityType = StoreExplorerEntityType; 
-    // Or if not used in template, no need for this alias here.
+    // Import Rune Lab specific types and the transformer
+    import type { RLSchemaData, RLTableMetadata, RLViewMetadata, RLEnumMetadata, RLFunctionMetadata, RLColumnMetadata, RLColumnReference } from '../stores/explorer.svelte';
+    import { transformPrismSchemasToRLData } from '../../tools/schema-transformer.js'; // Correct path to tools index
 
     type APIOperation = 'GET' | 'POST' | 'PUT' | 'DELETE';
     type ModalResourceType = 'table' | 'view' | 'function';
 
-    let schemas = $state<SchemaMetadata[] | null>(null);
+    let schemas = $state<RLSchemaData[] | null>(null); // Use RLSchemaData here
     let isLoading = $state(true);
     let error = $state<string | null>(null);
 
@@ -33,9 +28,12 @@
     let modalTargetSchemaName = $state<string>('');
     let modalTargetResourceName = $state<string>('');
     let modalTargetResourceType = $state<ModalResourceType>('table');
-    let modalTargetColumns = $state<ColumnMetadata[]>([]);
+    let modalTargetColumns = $state<RLColumnMetadata[]>([]); // Use RLColumnMetadata
     let modalTargetOperation = $state<APIOperation>('GET');
-    let modalTargetFunctionParams = $state<FunctionMetadata['parameters'] | null>(null);
+    // For function parameters, the RLApiOperationModal might expect PrismFunctionParameter directly from prism-ts,
+    // or we transform them before passing. Let's assume it takes PrismFunctionParameter for now or RLFunctionParameter.
+    // The RLFunctionMetadata in RLSchemaData contains RLFunctionParameter.
+    let modalTargetFunctionParams = $state<PrismFunctionParameter[] | null>(null); // Or RLFunctionParameter[]
     let modalInitialId = $state<string | number | null>(null);
     let modalInitialDataForPut = $state<Record<string, any>>({});
 
@@ -43,35 +41,36 @@
     let showEnumModal = $state(false);
     let currentEnumDetails = $state<{ name: string; values: string[]; schema: string } | null>(null);
 
-    // --- Computation function for currentSelectedSchemaObject ---
-    function computeCurrentSelectedSchema(): SchemaMetadata | null {
+
+    function computeCurrentSelectedSchema(): RLSchemaData | null { // Use RLSchemaData
         const activeName = explorerStore.activeSchemaName;
-        const currentSchemas = schemas; // Access the $state variable's value
+        const currentSchemas = schemas;
         if (!activeName || !currentSchemas) {
             return null;
         }
         return currentSchemas.find(s => s.name === activeName) || null;
     }
-    // Use the computation function with $derived
     let currentSelectedSchemaObject = $derived(computeCurrentSelectedSchema());
 
-    // --- Computation function for currentEntityItems ---
     function computeCurrentEntityItems(): Record<string, any> | null {
-        const schemaObj = currentSelectedSchemaObject; // Access the previously derived value
+        const schemaObj = currentSelectedSchemaObject;
         const activeType = explorerStore.activeEntityType;
-        if (schemaObj && activeType && schemaObj[activeType]) {
-            const entities = schemaObj[activeType];
-            return (entities && Object.keys(entities).length > 0) ? entities as Record<string, any> : null;
+
+        // Ensure explorerStore.activeEntityType is a valid key for RLSchemaData
+        if (schemaObj && activeType && schemaObj[activeType as keyof RLSchemaData]) {
+            const entities = schemaObj[activeType as keyof RLSchemaData]; // Type assertion
+             // Check if entities is not undefined and is an object
+            if (entities && typeof entities === 'object' && !Array.isArray(entities)) {
+                 return (Object.keys(entities).length > 0) ? entities as Record<string, any> : null;
+            }
         }
         return null;
     }
-    // Use the computation function with $derived
     let currentEntityItems = $derived(computeCurrentEntityItems());
 
 
-    // --- Effects ---
     $effect(() => {
-        // This effect now reads the derived values directly
+        // ... (scroll effect remains the same, uses derived values) ...
         const schemaObj = currentSelectedSchemaObject;
         const focusedName = explorerStore.focusedEntityName;
         const activeType = explorerStore.activeEntityType;
@@ -100,63 +99,11 @@
             try {
                 isLoading = true;
                 error = null;
-                const rawFetchedSchemasFromPrism = await apiStore.prism.getSchemas();
-                const rawFetchedSchemas = rawFetchedSchemasFromPrism as any[]; // Assuming transformation is still needed
-
-                const transformColumn = (apiCol: any): ColumnMetadata => ({
-                    name: apiCol.name,
-                    type: apiCol.type,
-                    nullable: apiCol.nullable === true,
-                    isPrimaryKey: apiCol.is_pk === true || apiCol.isPrimaryKey === true, // Handles both potential key names
-                    isEnum: apiCol.is_enum === true,
-                    references: apiCol.references ? {
-                        schema: apiCol.references.schema_name || apiCol.references.schema,
-                        table: apiCol.references.table,
-                        column: apiCol.references.column,
-                    } : undefined,
-                });
+                // Fetch raw schemas using prism-ts types
+                const rawFetchedSchemasFromPrism = await apiStore.prism.getSchemas() as PrismSchemaMetadata[];
 
-                const transformTableOrView = (apiEntity: any, schemaName: string): TableMetadata | ViewMetadata => ({
-                    name: apiEntity.name,
-                    schema: apiEntity.schema_name || apiEntity.schema || schemaName,
-                    columns: (apiEntity.columns || []).map(transformColumn),
-                });
-                
-                const transformEnum = (apiEnum: any, schemaName: string): EnumMetadata => ({
-                    name: apiEnum.name,
-                    schema: apiEnum.schema_name || apiEnum.schema || schemaName,
-                    values: apiEnum.values || [],
-                });
-
-                const transformFnParam = (param: any): FunctionParameter => ({
-                    name: param.name,
-                    type: param.type,
-                    mode: param.mode || 'IN',
-                    hasDefault: param.has_default === true,
-                    defaultValue: param.default_value === undefined ? null : String(param.default_value),
-                });
-
-                const transformFunctionLike = (fn: any, schemaName: string): FunctionMetadata => ({
-                    name: fn.name,
-                    schema: fn.schema_name || fn.schema || schemaName,
-                    type: String(fn.type), 
-                    objectType: String(fn.object_type),
-                    description: fn.description === undefined ? null : fn.description,
-                    parameters: (fn.parameters || []).map(transformFnParam),
-                    returnType: fn.return_type === undefined ? null : fn.return_type,
-                    isStrict: fn.is_strict === true,
-                    ...(fn.object_type && String(fn.object_type).includes('TRIGGER') && fn.trigger_data ? { triggerData: fn.trigger_data } : {})
-                });
-
-                const transformedSchemasResult: SchemaMetadata[] = rawFetchedSchemas.map((apiSchema: any) => ({
-                    name: apiSchema.name,
-                    tables: Object.fromEntries(Object.entries(apiSchema.tables || {}).map(([k, v]) => [k, transformTableOrView(v, apiSchema.name) as TableMetadata])),
-                    views: Object.fromEntries(Object.entries(apiSchema.views || {}).map(([k, v]) => [k, transformTableOrView(v, apiSchema.name) as ViewMetadata])),
-                    enums: Object.fromEntries(Object.entries(apiSchema.enums || {}).map(([k, v]) => [k, transformEnum(v, apiSchema.name)])),
-                    functions: Object.fromEntries(Object.entries(apiSchema.functions || {}).map(([k, v]) => [k, transformFunctionLike(v, apiSchema.name)])),
-                    procedures: Object.fromEntries(Object.entries(apiSchema.procedures || {}).map(([k, v]) => [k, transformFunctionLike(v, apiSchema.name)])),
-                    triggers: Object.fromEntries(Object.entries(apiSchema.triggers || {}).map(([k, v]) => [k, transformFunctionLike(v, apiSchema.name)])),
-                }));
+                // Use the new transformer
+                const transformedSchemasResult = transformPrismSchemasToRLData(rawFetchedSchemasFromPrism);
                 
                 schemas = transformedSchemasResult;
 
@@ -177,26 +124,37 @@
         loadAndTransformSchemas();
     });
 
-    // --- Helper Functions ---
-    function getEntityCount(schema: SchemaMetadata | null, entityType: StoreExplorerEntityType): number {
-        if (!schema || !schema[entityType]) return 0;
-        const entities = schema[entityType];
-        return entities ? Object.keys(entities).length : 0;
+    function getEntityCount(schema: RLSchemaData | null, entityType: StoreExplorerEntityType): number {
+        if (!schema || !schema[entityType as keyof RLSchemaData]) return 0;
+        const entities = schema[entityType as keyof RLSchemaData];
+        return (entities && typeof entities === 'object' && !Array.isArray(entities)) ? Object.keys(entities).length : 0;
     }
-
-    function getColumnsForTableOrView(item: TableMetadata | ViewMetadata): ColumnMetadata[] {
+    
+    // This function should now expect RLTableMetadata or RLViewMetadata and return RLColumnMetadata[]
+    function getColumnsForTableOrView(item: RLTableMetadata | RLViewMetadata): RLColumnMetadata[] {
         return item.columns || [];
     }
     
-    // --- Modal Control Functions ---
-    function openModalForApi( // Renamed to openModalForApi
+    function openModalForApi(
         params: { operation: APIOperation },
         currentSchemaFromCall: string,
         currentResourceName: string,
         currentModalResourceType: ModalResourceType,
         options: {
-            columns?: ColumnMetadata[];
-            functionParams?: FunctionMetadata['parameters'] | null;
+            // Expect RLColumnMetadata for consistency if RLApiOperationModal is adapted
+            columns?: RLColumnMetadata[]; 
+            // For function parameters, `itemData as RLFunctionMetadata` will have `parameters` of type RLFunctionParameter[]
+            // The RLApiOperationModal props expect PrismFunctionParameter[] (or null).
+            // We need to either adapt RLApiOperationModal or transform back if strictly necessary.
+            // For simplicity, let's assume RLApiOperationModal can be adapted or we can transform `RLFunctionParameter[]`
+            // back to `PrismFunctionParameter[]` if RLApiOperationModal MUST take the prism-ts type.
+            // If RLApiOperationModal is changed to use RLFunctionParameter, then no conversion needed.
+            // If it stays with PrismFunctionParameter, then:
+            // functionParams?: PrismFunctionParameter[] | null;
+            // And when calling:
+            // functionParams: (itemData as RLFunctionMetadata).parameters.map(transformRLParamToPrismParam)
+            // Let's keep modalTargetFunctionParams as PrismFunctionParameter for now as it was
+            functionParams?: PrismFunctionParameter[] | null; // Sticking to what modal currently expects from props
             initialId?: string | number | null;
             initialDataForPut?: Record<string, any>;
         } = {}
@@ -214,28 +172,73 @@
 
     function closeModal() {
         isModalOpen = false;
-        modalTargetSchemaName = '';
-        modalTargetResourceName = '';
-        modalTargetColumns = [];
-        modalTargetFunctionParams = null;
-        modalInitialId = null;
-        modalInitialDataForPut = {};
+        // ... (reset modal state properties) ...
     }
 
-    // --- Event Handlers / Callbacks from Child Components ---
-    function handleFkReferenceClicked(ref: ColumnReference) {
+    function handleFkReferenceClicked(ref: RLColumnReference) { // Expects RLColumnReference
         explorerStore.navigateToEntity(ref.schema, 'tables', ref.table);
     }
 
-    function handleEnumBadgeClicked(enumData: { name: string; values: string[]; schema: string }) {
-        currentEnumDetails = enumData; // { name, values, schema }
+    // RLEnumMetadata provides name, values, schema directly
+    function handleEnumBadgeClicked(enumData: RLEnumMetadata) {
+        currentEnumDetails = { name: enumData.name, values: enumData.values, schema: enumData.schema };
         showEnumModal = true;
     }
 </script>
 
 <!-- Template for src/lib/components/explorer/RLSchemaExplorer.svelte -->
-<!-- This should be placed directly below the </script> tag from the previous response -->
+<!-- ... (Template remains largely the same, but ensure data bindings use RL... types) ... -->
+<!-- Example changes in template: -->
+<!-- For RLMetadataTable:
+    columns={getColumnsForTableOrView(typedItem as (RLTableMetadata | RLViewMetadata))}
+    enumsInSchema={activeSchema.enums as Record<string, RLEnumMetadata>} // Cast might be needed
+    onEnumClick={(enumData) => handleEnumBadgeClicked(enumData)} // This will now pass RLEnumMetadata
+-->
+<!-- For RLApiInterface call:
+    columns={getColumnsForTableOrView(typedItem as (RLTableMetadata | RLViewMetadata))}
+    onOpenModal={(opParams) => openModalForApi(
+        opParams,
+        activeSchema.name,
+        name,
+        explorerStore.activeEntityType === 'tables' ? 'table' : 'view',
+        // Pass RLColumnMetadata
+        { columns: getColumnsForTableOrView(typedItem as (RLTableMetadata | RLViewMetadata)) } 
+    )}
+-->
+<!-- For Function/Procedure RLApiInterface call:
+    onOpenModal={(opParams) => {
+        const funcMeta = typedItem as RLFunctionMetadata;
+        // IMPORTANT: Here's where a decision for functionParams is needed.
+        // If RLApiOperationModal expects PrismFunctionParameter[]:
+        // You would need a function `transformRLParamToPrismParam` or map directly here.
+        // For now, assuming RLFunctionMetadata.parameters IS what RLApiOperationModal's functionParams prop wants (which is PrismFunctionParameter[]).
+        // This implies that our RLFunctionParameter and PrismFunctionParameter are structurally compatible or RLApiOperationModal is adapted.
+        // If RLFunctionParameter IS different from PrismFunctionParameter in a way that matters to the modal:
+        // const prismParams: PrismFunctionParameter[] = funcMeta.parameters.map(rlParam => ({...rlParam, defaultValue: rlParam.defaultValue ?? undefined }));
+        // The current RLFunctionParameter in types/explorer.ts matches PrismFunctionParameter structure sufficiently for the RLApiOperationModal to consume if `functionParams` prop remains PrismFunctionParameter[]
+        
+        openModalForApi(
+            opParams,
+            activeSchema.name,
+            name,
+            'function',
+            // Assuming RLApiOperationModal expects PrismFunctionParameter[] and our RLFunctionParameter[] from typedItem is compatible.
+            // If types diverge significantly, a mapping function would be needed here.
+            // The `modalTargetFunctionParams = $state<PrismFunctionParameter[] | null>(null);` means we have to ensure the structure is compatible or map it.
+            // Our RLFunctionParameter looks very similar to PrismFunctionParameter in the example `RLApiOperationModal`.
+            { functionParams: (typedItem as RLFunctionMetadata).parameters as unknown as PrismFunctionParameter[] } // Cast if shapes are compatible
+        );
+    }}
+-->
+<!-- In the #each Object.entries(currentEntityItems) -->
+<!-- Change itemData casts: -->
+<!-- {@const typedItem = itemData as (RLTableMetadata | RLViewMetadata)} -->
+<!-- {@const typedItem = itemData as RLEnumMetadata} -->
+<!-- {@const typedItem = itemData as RLFunctionMetadata} -->
 
+<!-- RLApiOperationModal call needs to match prop types. If RLApiOperationModal's `columns` prop changes to RLColumnMetadata[], then no cast is needed.
+    Otherwise, `modalTargetColumns as unknown as PrismColumnMetadata[]` might be needed.
+    Similar for `functionParams`. -->
 <div class="container mx-auto p-4">
     {#if isLoading}
         <div class="flex flex-col items-center justify-center h-64">
@@ -298,7 +301,7 @@
                             {@const entityId = `entity-${activeSchema.name}-${explorerStore.activeEntityType}-${name}`}
                             <!-- Display for Tables and Views -->
                             {#if explorerStore.activeEntityType === 'tables' || explorerStore.activeEntityType === 'views'}
-                                {@const typedItem = itemData as (TableMetadata | ViewMetadata)}
+                                {@const typedItem = itemData as (RLTableMetadata | RLViewMetadata)}
                                 <div class="collapse collapse-arrow bg-base-100 shadow-md {explorerStore.focusedEntityName === name ? 'collapse-open ring-1 ring-primary ring-offset-base-100 ring-offset-2' : ''}" id={entityId}>
                                     <input 
                                         type="checkbox" 
@@ -317,16 +320,22 @@
                                         onkeydown={(e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); explorerStore.focusOnEntity(explorerStore.focusedEntityName === name ? null : name);}}}
                                     >
                                         {name}
-                                        <span class="badge badge-ghost ml-2 capitalize">{explorerStore.activeEntityType.slice(0, -1)}</span>
+                                        <span class="badge badge-ghost ml-2 capitalize">{explorerStore.activeEntityType === 'tables' ? 'Table' : 'View'}</span>
                                     </div>
                                     <div class="collapse-content">
                                         <RLMetadataTable
                                             title={name}
                                             itemType={explorerStore.activeEntityType === 'tables' ? 'table' : 'view'}
                                             columns={getColumnsForTableOrView(typedItem)}
-                                            enumsInSchema={activeSchema.enums}
+                                            enumsInSchema={activeSchema.enums as Record<string, RLEnumMetadata>}
                                             onFkClick={handleFkReferenceClicked}
-                                            onEnumClick={(enumData) => handleEnumBadgeClicked({...enumData, schema: activeSchema.name})}
+                                            onEnumClick={(enumDataFromTable) => {
+                                                // RLMetadataTable will pass the RLEnumMetadata for the clicked enum
+                                                // (or details if `onEnumClick` prop in RLMetadataTable is updated to send just `name`, `values`)
+                                                // Assuming it passes the full RLEnumMetadata or an object with {name, values} and schema is added here
+                                                const foundEnum = activeSchema.enums[enumDataFromTable.name]; // Or how enumDataFromTable is structured
+                                                if(foundEnum) handleEnumBadgeClicked(foundEnum);
+                                            }}
                                         />
                                         <div class="mt-4 p-2 border-t border-base-300">
                                             <RLApiInterface
@@ -347,7 +356,7 @@
                                 </div>
                             <!-- Display for Enums -->
                             {:else if explorerStore.activeEntityType === 'enums'}
-                                {@const typedItem = itemData as EnumMetadata}
+                                {@const typedItem = itemData as RLEnumMetadata}
                                 <div class="collapse collapse-arrow bg-base-100 shadow-md" id={entityId}>
                                     <input type="checkbox" name="item-accordion-{activeSchema.name}-enum-{name}" />
                                     <div 
@@ -366,14 +375,14 @@
                                                 <li>{value}</li>
                                             {/each}
                                         </ul>
-                                        <button class="btn btn-xs btn-outline mt-2" onclick={() => handleEnumBadgeClicked({ name: typedItem.name, values: typedItem.values, schema: activeSchema.name })}>
+                                        <button class="btn btn-xs btn-outline mt-2" onclick={() => handleEnumBadgeClicked(typedItem)}>
                                             Show Details
                                         </button>
                                     </div>
                                 </div>
-                            <!-- Display for Functions, Procedures, Triggers -->
+                            <!-- Display for Functions, Procedures, Triggers (now consolidated under RLFunctionMetadata) -->
                             {:else if explorerStore.activeEntityType === 'functions' || explorerStore.activeEntityType === 'procedures' || explorerStore.activeEntityType === 'triggers'}
-                                {@const typedItem = itemData as FunctionMetadata}
+                                {@const typedItem = itemData as RLFunctionMetadata}
                                 <div class="collapse collapse-arrow bg-base-100 shadow-md" id={entityId}>
                                     <input type="checkbox" name="item-accordion-{activeSchema.name}-{explorerStore.activeEntityType}-{name}" />
                                     <div 
@@ -383,7 +392,8 @@
                                         onclick={(e) => { const input = e.currentTarget.previousElementSibling as HTMLInputElement; if(input) input.checked = !input.checked;}}
                                         onkeydown={(e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); const input = e.currentTarget.previousElementSibling as HTMLInputElement; if(input) input.checked = !input.checked;}}}
                                     >
-                                        {name} <span class="badge badge-ghost ml-2 capitalize">{(typedItem.objectType || explorerStore.activeEntityType).replace('ObjectType.', '').replace('FunctionType.','').toLowerCase()}</span>
+                                        <!-- Display 'kind' which now includes PROCEDURE, TRIGGER etc. -->
+                                        {name} <span class="badge badge-ghost ml-2 capitalize">{typedItem.kind.toLowerCase()}</span>
                                     </div>
                                     <div class="collapse-content">
                                         {#if typedItem.description}
@@ -411,7 +421,7 @@
                                          <p class="text-sm opacity-70 mt-2">No parameters.</p>
                                         {/if}
 
-                                        {#if explorerStore.activeEntityType === 'functions' || explorerStore.activeEntityType === 'procedures'}
+                                        {#if typedItem.kind === 'FUNCTION' || typedItem.kind === 'PROCEDURE'}
                                             <div class="mt-4 p-2 border-t border-base-300">
                                                 <RLApiInterface
                                                     schemaName={activeSchema.name}
@@ -423,7 +433,9 @@
                                                         activeSchema.name,
                                                         name,
                                                         'function',
-                                                        { functionParams: typedItem.parameters }
+                                                        // typedItem.parameters are RLFunctionParameter[]. RLApiOperationModal expects PrismFunctionParameter[]
+                                                        // Assuming direct castability for now due to similar structure
+                                                        { functionParams: typedItem.parameters as unknown as PrismFunctionParameter[] }
                                                     )}
                                                 />
                                             </div>
@@ -459,8 +471,8 @@
             onClose={closeModal}
             schemaName={modalTargetSchemaName}
             resourceName={modalTargetResourceName}
-            operation={modalTargetOperation}
-            columns={modalTargetColumns}
+            operation={modalTargetOperation}    
+            columns={modalTargetColumns as unknown as PrismColumnMetadata[]}
             functionParams={modalTargetFunctionParams}
             resourceType={modalTargetResourceType}
             initialId={modalInitialId}

package/dist/components/form/RLFilterForm.svelte

@@ -1,19 +1,7 @@
 <!-- src/lib/components/forms/RLFilterForm.svelte -->
 <script lang="ts">
     import type { ColumnMetadata } from '@yrrrrrf/prism-ts';
-
-    // Same helper as in RLResourceForm, can be moved to a shared utility file
-    function mapSqlTypeToInputType(sqlType: string): string {
-        const lowerSqlType = sqlType.toLowerCase();
-        if (lowerSqlType.includes('bool')) return 'checkbox'; // Or a select with true/false/any
-        if (lowerSqlType.includes('int') || lowerSqlType.includes('serial') || lowerSqlType.includes('numeric') || lowerSqlType.includes('decimal') || lowerSqlType.includes('real') || lowerSqlType.includes('double')) return 'number';
-        if (lowerSqlType.includes('date') && !lowerSqlType.includes('timestamp')) return 'date';
-        if (lowerSqlType.includes('timestamp')) return 'datetime-local';
-        if (lowerSqlType.includes('time') && !lowerSqlType.includes('timestamp')) return 'time';
-        // For filters, textarea is less common unless for full-text search
-        return 'text'; // Default for filters
-    }
-
+    import { mapSqlTypeToInputType } from '../../tools/form-helpers.js';
 
     let {
         columns,

package/dist/components/form/RLFunctionForm.svelte

@@ -1,19 +1,8 @@
 <!-- src/lib/components/forms/RLFunctionForm.svelte -->
 <script lang="ts">
     import type { FunctionParameter } from '@yrrrrrf/prism-ts';
-
-    // Helper, can be shared
-    function mapSqlTypeToInputType(sqlType: string): string {
-        const lowerSqlType = sqlType.toLowerCase();
-        if (lowerSqlType.includes('bool')) return 'checkbox';
-        if (lowerSqlType.includes('int') || lowerSqlType.includes('serial') || lowerSqlType.includes('numeric')) return 'number';
-        if (lowerSqlType.includes('date') && !lowerSqlType.includes('timestamp')) return 'date';
-        if (lowerSqlType.includes('timestamp')) return 'datetime-local';
-        if (lowerSqlType.includes('time') && !lowerSqlType.includes('timestamp')) return 'time';
-        if (lowerSqlType.includes('text')) return 'textarea';
-        if (lowerSqlType.includes('json')) return 'textarea';
-        return 'text';
-    }
+    import { mapSqlTypeToInputType } from '../../tools/form-helpers.js';
+    
 
     let {
         params, // FunctionParameter[]

package/dist/components/form/RLResourceForm.svelte

@@ -1,20 +1,8 @@
 <!-- src/lib/components/forms/RLResourceForm.svelte -->
 <script lang="ts">
     import type { ColumnMetadata } from '@yrrrrrf/prism-ts';
+    import { mapSqlTypeToInputType } from '../../tools/form-helpers.js';
 
-    // Helper to map SQL types to HTML input types
-    function mapSqlTypeToInputType(sqlType: string, columnName: string): string {
-        const lowerSqlType = sqlType.toLowerCase();
-        if (lowerSqlType.includes('bool')) return 'checkbox';
-        if (lowerSqlType.includes('int') || lowerSqlType.includes('serial') || lowerSqlType.includes('numeric') || lowerSqlType.includes('decimal') || lowerSqlType.includes('real') || lowerSqlType.includes('double')) return 'number';
-        if (lowerSqlType.includes('date') && !lowerSqlType.includes('timestamp')) return 'date';
-        if (lowerSqlType.includes('timestamp')) return 'datetime-local';
-        if (lowerSqlType.includes('time') && !lowerSqlType.includes('timestamp')) return 'time';
-        if (lowerSqlType.includes('text') || columnName.includes('description')) return 'textarea'; // Heuristic for textarea
-        if (lowerSqlType.includes('json')) return 'textarea'; // JSON often edited as text
-        // Add more mappings as needed (e.g., for enums to select, bytea to file (later))
-        return 'text'; // Default
-    }
 
     let {
         columns,

package/dist/components/stores/explorer.svelte.d.ts

@@ -23,4 +23,60 @@ declare class ExplorerStore {
     reset(): void;
 }
 export declare const explorerStore: ExplorerStore;
+export interface RLColumnReference {
+    schema: string;
+    table: string;
+    column: string;
+}
+export interface RLColumnMetadata {
+    name: string;
+    type: string;
+    nullable: boolean;
+    isPrimaryKey: boolean;
+    isEnum: boolean;
+    references?: RLColumnReference;
+}
+export interface RLBaseEntityMetadata {
+    name: string;
+    schema: string;
+}
+export interface RLTableMetadata extends RLBaseEntityMetadata {
+    columns: RLColumnMetadata[];
+}
+export interface RLViewMetadata extends RLBaseEntityMetadata {
+    columns: RLColumnMetadata[];
+}
+export interface RLEnumMetadata extends RLBaseEntityMetadata {
+    values: string[];
+}
+export interface RLFunctionParameter {
+    name: string;
+    type: string;
+    mode: "IN" | "OUT" | "INOUT" | "VARIADIC";
+    hasDefault: boolean;
+    defaultValue?: string | null;
+}
+export type RLFunctionKind = "SCALAR" | "TABLE" | "SET_RETURNING" | "AGGREGATE" | "WINDOW" | "PROCEDURE" | "TRIGGER" | "FUNCTION" | "UNKNOWN";
+export interface RLFunctionMetadata extends RLBaseEntityMetadata {
+    kind: RLFunctionKind;
+    description?: string | null;
+    parameters: RLFunctionParameter[];
+    returnType?: string | null;
+    isStrict: boolean;
+    triggerData?: {
+        timing: string;
+        events: string[];
+        targetTableSchema: string;
+        targetTableName: string;
+    };
+}
+export interface RLSchemaData {
+    name: string;
+    tables: Record<string, RLTableMetadata>;
+    views: Record<string, RLViewMetadata>;
+    enums: Record<string, RLEnumMetadata>;
+    functions: Record<string, RLFunctionMetadata>;
+    procedures: Record<string, RLFunctionMetadata>;
+    triggers: Record<string, RLFunctionMetadata>;
+}
 export {};

package/dist/mod.d.ts

@@ -1,4 +1,6 @@
 export { apiStore } from "./components/stores/api.svelte.ts";
 export { appData } from "./components/stores/app.svelte.ts";
+export * from "./tools/schema-transformer.ts";
+export * from "./tools/form-helpers.ts";
 export declare function getVersion(): string;
 export declare function init(): void;

package/dist/mod.js

@@ -5,6 +5,8 @@
 export { apiStore } from "./components/stores/api.svelte.ts";
 export { appData } from "./components/stores/app.svelte.ts";
 // export { type AppData, appData } from "./stores/app.svelte.ts";
+export * from "./tools/schema-transformer.ts";
+export * from "./tools/form-helpers.ts";
 // // * Import the main forge from the ts-forge library...
 // export {
 // 	type FooterConfig,

package/dist/tools/form-helpers.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Maps SQL data types to HTML input element types.
+ * @param sqlType The SQL data type string.
+ * @param columnName (Optional) The name of the column, can be used for heuristics.
+ * @returns The corresponding HTML input type string.
+ */
+export declare function mapSqlTypeToInputType(sqlType: string, columnName?: string): string;
+/**
+ * Determines the 'step' attribute for number inputs based on SQL type.
+ * @param sqlType The SQL data type string.
+ * @returns 'any' for floating point types, undefined otherwise.
+ */
+export declare function getStepForNumberInput(sqlType: string): string | undefined;
+/**
+ * Formats a column reference object into a display string.
+ * @param ref The column reference object.
+ * @returns A string representation like "schema.table.column".
+ */
+export declare function formatReferenceText(ref: {
+    schema: string;
+    table: string;
+    column: string;
+} | undefined): string;

package/dist/tools/form-helpers.js

@@ -0,0 +1,51 @@
+// File: src/lib/tools/form-helpers.ts
+/**
+ * Maps SQL data types to HTML input element types.
+ * @param sqlType The SQL data type string.
+ * @param columnName (Optional) The name of the column, can be used for heuristics.
+ * @returns The corresponding HTML input type string.
+ */
+export function mapSqlTypeToInputType(sqlType, columnName) {
+    const lowerSqlType = sqlType.toLowerCase();
+    if (lowerSqlType.includes("bool"))
+        return "checkbox";
+    if (lowerSqlType.includes("int") || lowerSqlType.includes("serial") ||
+        lowerSqlType.includes("numeric") || lowerSqlType.includes("decimal") ||
+        lowerSqlType.includes("real") || lowerSqlType.includes("double"))
+        return "number";
+    if (lowerSqlType.includes("date") && !lowerSqlType.includes("timestamp"))
+        return "date";
+    if (lowerSqlType.includes("timestamp"))
+        return "datetime-local";
+    if (lowerSqlType.includes("time") && !lowerSqlType.includes("timestamp"))
+        return "time";
+    if (lowerSqlType.includes("text") ||
+        (columnName && columnName.toLowerCase().includes("description")))
+        return "textarea";
+    if (lowerSqlType.includes("json"))
+        return "textarea"; // JSON often best edited as text in simple forms
+    return "text"; // Default
+}
+/**
+ * Determines the 'step' attribute for number inputs based on SQL type.
+ * @param sqlType The SQL data type string.
+ * @returns 'any' for floating point types, undefined otherwise.
+ */
+export function getStepForNumberInput(sqlType) {
+    const lowerSqlType = sqlType.toLowerCase();
+    if (lowerSqlType.includes("decimal") || lowerSqlType.includes("numeric") ||
+        lowerSqlType.includes("real") || lowerSqlType.includes("double")) {
+        return "any";
+    }
+    return undefined; // Default step (usually 1 for integers)
+}
+/**
+ * Formats a column reference object into a display string.
+ * @param ref The column reference object.
+ * @returns A string representation like "schema.table.column".
+ */
+export function formatReferenceText(ref) {
+    if (!ref)
+        return "";
+    return `${ref.schema}.${ref.table}.${ref.column}`;
+}

package/dist/tools/schema-transformer.d.ts

@@ -0,0 +1,5 @@
+import type { ColumnMetadata as PrismColumnMetadata, FunctionMetadata as PrismFunctionMetadata, SchemaMetadata as PrismSchemaMetadata } from "@yrrrrrf/prism-ts";
+import type { RLColumnMetadata, RLFunctionMetadata, RLSchemaData } from "../components/stores/explorer.svelte.ts";
+export declare function transformPrismColumn(prismCol: PrismColumnMetadata): RLColumnMetadata;
+export declare function transformPrismFunction(prismFn: PrismFunctionMetadata, schema: string): RLFunctionMetadata;
+export declare function transformPrismSchemasToRLData(prismSchemas: PrismSchemaMetadata[]): RLSchemaData[];

package/dist/tools/schema-transformer.js

@@ -0,0 +1,130 @@
+// File: src/lib/tools/schema-transformer.ts
+// --- Helper Functions ---
+function transformPrismColumnReference(ref) {
+    if (!ref)
+        return undefined;
+    return {
+        schema: ref.schema, // prism-ts seems to use 'schema' directly
+        table: ref.table,
+        column: ref.column,
+    };
+}
+export function transformPrismColumn(prismCol) {
+    return {
+        name: prismCol.name,
+        type: prismCol.type,
+        nullable: prismCol.nullable,
+        // Adapting from prism-ts field `isPrimaryKey` to `isPrimaryKey`
+        // And `isEnum` to `isEnum`
+        isPrimaryKey: prismCol.isPrimaryKey === true,
+        isEnum: prismCol.isEnum === true,
+        references: transformPrismColumnReference(prismCol.references),
+    };
+}
+function transformPrismTableOrView(prismEntity, schema) {
+    return {
+        name: prismEntity.name,
+        schema: schema, // prism-ts's TableMetadata includes schema
+        columns: (prismEntity.columns || []).map(transformPrismColumn),
+    };
+}
+function transformPrismEnum(prismEnum, schema) {
+    return {
+        name: prismEnum.name,
+        schema: schema, // prism-ts's EnumMetadata includes schema
+        values: prismEnum.values || [],
+    };
+}
+function transformPrismFunctionParameter(param) {
+    return {
+        name: param.name,
+        type: param.type,
+        mode: param.mode || "IN", // prism-ts uses string
+        hasDefault: param.hasDefault === true,
+        defaultValue: param.defaultValue === undefined ? null : String(param.defaultValue),
+    };
+}
+function determineRLFunctionKind(prismFn) {
+    const objectType = (prismFn.objectType || "").toUpperCase();
+    const fnType = (prismFn.type || "").toUpperCase(); // e.g., SCALAR, TABLE, SET
+    if (objectType === "PROCEDURE")
+        return "PROCEDURE";
+    if (objectType === "TRIGGER")
+        return "TRIGGER";
+    if (objectType === "FUNCTION" || objectType === "") { // Default to FUNCTION if objectType is missing
+        if (fnType === "SCALAR")
+            return "SCALAR";
+        if (fnType === "TABLE")
+            return "TABLE";
+        if (fnType === "SET")
+            return "SET_RETURNING"; // prism-ts calls it 'set'
+        if (fnType === "AGGREGATE")
+            return "AGGREGATE";
+        if (fnType === "WINDOW")
+            return "WINDOW";
+        // todo: Check if prism-ts has other specific function types
+        // todo: If prism-ts has a 'FUNCTION' type, we can return it here
+        // todo: Check if we need to handle 'FUNCTION' as a generic type...
+        return "FUNCTION"; // Generic function if type is not more specific
+        // todo: (probably not needed, as we can use 'FUNCTION' for generic functions)
+        // todo: (probably not needed, as we can use 'FUNCTION' for generic functions)
+        // todo: (probably not needed, as we can use 'FUNCTION' for generic functions)
+    }
+    return "UNKNOWN";
+}
+export function transformPrismFunction(prismFn, schema) {
+    const kind = determineRLFunctionKind(prismFn);
+    const transformed = {
+        name: prismFn.name,
+        schema: schema, // prism-ts's FunctionMetadata includes schema
+        kind: kind,
+        description: prismFn.description === undefined ? null : prismFn.description,
+        parameters: (prismFn.parameters || []).map(transformPrismFunctionParameter),
+        returnType: prismFn.returnType === undefined ? null : prismFn.returnType,
+        isStrict: prismFn.isStrict === true,
+    };
+    // Example: If prism-ts provides trigger-specific data on its FunctionMetadata when objectType is 'trigger'
+    // We would map it here to transformed.triggerData
+    // if (kind === 'TRIGGER' && (prismFn as any).triggerData) {
+    //     transformed.triggerData = {
+    //         timing: (prismFn as any).triggerData.timing,
+    //         events: (prismFn as any).triggerData.events,
+    //         targetTableSchema: (prismFn as any).triggerData.table_schema,
+    //         targetTableName: (prismFn as any).triggerData.table_name,
+    //     };
+    // }
+    return transformed;
+}
+// --- Main Transformation Function ---
+export function transformPrismSchemasToRLData(prismSchemas) {
+    return prismSchemas.map((prismSchema) => {
+        const rlSchema = {
+            name: prismSchema.name,
+            tables: {},
+            views: {},
+            enums: {},
+            functions: {},
+            procedures: {},
+            triggers: {},
+        };
+        Object.entries(prismSchema.tables || {}).forEach(([name, table]) => {
+            rlSchema.tables[name] = transformPrismTableOrView(table, prismSchema.name);
+        });
+        Object.entries(prismSchema.views || {}).forEach(([name, view]) => {
+            rlSchema.views[name] = transformPrismTableOrView(view, prismSchema.name);
+        });
+        Object.entries(prismSchema.enums || {}).forEach(([name, enumData]) => {
+            rlSchema.enums[name] = transformPrismEnum(enumData, prismSchema.name);
+        });
+        Object.entries(prismSchema.functions || {}).forEach(([name, func]) => {
+            rlSchema.functions[name] = transformPrismFunction(func, prismSchema.name);
+        });
+        Object.entries(prismSchema.procedures || {}).forEach(([name, proc]) => {
+            rlSchema.procedures[name] = transformPrismFunction(proc, prismSchema.name);
+        });
+        Object.entries(prismSchema.triggers || {}).forEach(([name, trig]) => {
+            rlSchema.triggers[name] = transformPrismFunction(trig, prismSchema.name);
+        });
+        return rlSchema;
+    });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "rune-lab",
-	"version": "0.0.7",
+	"version": "0.0.8",
 	"license": "MIT",
 	"scripts": {
 		"dev": "vite dev",