claritykit-svelte
Version:
A comprehensive Svelte component library focused on accessibility, ADHD-optimized design, developer experience, and full SSR compatibility
97 lines (96 loc) • 4.82 kB
JavaScript
// Default column configurations for different entity types
export const DEFAULT_COLUMNS = {
block: [
{ field: 'type', label: 'Type', width: 80, sortable: true, columnType: 'entity-type' },
{ field: 'title', label: 'Title', sortable: true, editable: true, required: true },
{ field: 'content', label: 'Content', width: 300, editable: true, columnType: 'content' },
{ field: 'tags', label: 'Tags', width: 150, filterable: true, columnType: 'tags' },
{ field: 'relationships', label: 'Links', width: 120, columnType: 'relationships' },
{ field: 'similarity', label: 'Similar', width: 100, columnType: 'similarity' },
{ field: 'schema', label: 'Schema', width: 80, filterable: true, columnType: 'schema' },
{ field: 'modified', label: 'Modified', width: 120, sortable: true },
],
concept: [
{ field: 'type', label: 'Type', width: 80, sortable: true, columnType: 'entity-type' },
{ field: 'title', label: 'Concept', sortable: true, editable: true, required: true },
{ field: 'conceptData.definition', label: 'Definition', width: 250, editable: true },
{ field: 'conceptData.category', label: 'Category', width: 120, filterable: true, filterType: 'select' },
{ field: 'conceptData.confidence', label: 'Confidence', width: 100, sortable: true },
{ field: 'conceptData.usageCount', label: 'Usage', width: 80, sortable: true },
{ field: 'relationships', label: 'Related', width: 120, columnType: 'relationships' },
{ field: 'schema', label: 'Schema', width: 80, filterable: true, columnType: 'schema' },
],
person: [
{ field: 'type', label: 'Type', width: 80, sortable: true, columnType: 'entity-type' },
{ field: 'personData.firstName', label: 'First Name', sortable: true, editable: true },
{ field: 'personData.lastName', label: 'Last Name', sortable: true, editable: true },
{ field: 'personData.email', label: 'Email', width: 200, editable: true },
{ field: 'personData.role', label: 'Role', width: 120, filterable: true, filterType: 'select' },
{ field: 'relationships', label: 'Connections', width: 120, columnType: 'relationships' },
{ field: 'schema', label: 'Schema', width: 80, filterable: true, columnType: 'schema' },
],
project: [
{ field: 'type', label: 'Type', width: 80, sortable: true, columnType: 'entity-type' },
{ field: 'title', label: 'Project', sortable: true, editable: true, required: true },
{ field: 'description', label: 'Description', width: 250, editable: true },
{ field: 'projectData.status', label: 'Status', width: 100, filterable: true, filterType: 'select' },
{ field: 'projectData.priority', label: 'Priority', width: 100, filterable: true, filterType: 'select' },
{ field: 'projectData.progress', label: 'Progress', width: 100, sortable: true },
{ field: 'projectData.dueDate', label: 'Due Date', width: 120, sortable: true, filterType: 'date' },
{ field: 'relationships', label: 'Related', width: 120, columnType: 'relationships' },
{ field: 'schema', label: 'Schema', width: 80, filterable: true, columnType: 'schema' },
],
};
// Utility functions for working with entities
export function getEntityDisplayName(entity) {
if (entity.title)
return entity.title;
switch (entity.type) {
case 'person':
const firstName = entity.personData?.firstName || '';
const lastName = entity.personData?.lastName || '';
return `${firstName} ${lastName}`.trim() || entity.id;
case 'place':
return entity.placeData?.address || entity.id;
default:
return entity.id;
}
}
export function getEntityIcon(entity) {
const icons = {
block: '📄',
concept: '💡',
person: '👤',
place: '📍',
object: '🔷',
project: '📁',
task: '✓',
area: '🏷️',
goal: '🎯',
note: '📝',
journal: '📖',
tag: '🏷️'
};
return icons[entity.type] || '📄';
}
export function getSchemaColor(schema) {
const colors = {
staging: '#f59e0b', // amber
catalog: '#3b82f6', // blue
pages: '#10b981', // emerald
core: '#8b5cf6' // violet
};
return colors[schema];
}
export function formatSimilarityScore(score) {
return `${Math.round(score * 100)}%`;
}
export function getSimilarityColor(score) {
if (score >= 0.8)
return '#10b981'; // high similarity - green
if (score >= 0.6)
return '#f59e0b'; // medium similarity - amber
if (score >= 0.4)
return '#ef4444'; // low similarity - red
return '#6b7280'; // very low similarity - gray
}