CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-primevue--core

Core utilities and base functionality for PrimeVue UI component library

52

1.15x

Quality

Pending

Does it follow best practices?

Impact

52%

1.15x

Average score across 10 eval scenarios

Overview
Eval results
Files

api-services.mddocs/

API Services

Core API services providing data filtering capabilities, UI icon constants, and message severity levels. These services form the foundation for data-driven PrimeVue components.

Capabilities

FilterService

Provides comprehensive data filtering functionality with support for various filter modes and localization.

declare namespace FilterService {
  /**
   * Filter an array of data based on field values and filter criteria
   * @param value - Array of data to filter
   * @param fields - Array of field names to search in
   * @param filterValue - Value to filter by
   * @param filterMatchMode - Type of filter to apply (from FilterMatchMode)
   * @param filterLocale - Optional locale for string comparisons
   * @returns Filtered array
   */
  function filter(
    value: any[], 
    fields: string[], 
    filterValue: any, 
    filterMatchMode: string, 
    filterLocale?: string
  ): any[];

  /**
   * Register a custom filter function
   * @param rule - Name of the custom filter
   * @param fn - Filter function implementation
   */
  function register(rule: string, fn: (...arg: any[]) => boolean): void;

  interface filters {
    startsWith(value: any, filter: string, filterLocale?: string): boolean;
    contains(value: any, filter: string, filterLocale?: string): boolean;
    notContains(value: any, filter: string, filterLocale?: string): boolean;
    endsWith(value: any, filter: string, filterLocale?: string): boolean;
    equals(value: any, filter: string, filterLocale?: string): boolean;
    notEquals(value: any, filter: string, filterLocale?: string): boolean;
    in(value: any, filter: string): boolean;
    between(value: any, filter: string): boolean;
    lt(value: any, filter: string): boolean;
    lte(value: any, filter: string): boolean;
    gt(value: any, filter: string): boolean;
    gte(value: any, filter: string): boolean;
    dateIs(value: any, filter: string): boolean;
    dateIsNot(value: any, filter: string): boolean;
    dateBefore(value: any, filter: string): boolean;
    dateAfter(value: any, filter: string): boolean;
  }
}

Usage Examples:

import { FilterService, FilterMatchMode } from '@primevue/core/api';

// Filter users by name containing 'john'
const users = [
  { name: 'John Doe', email: 'john@example.com' },
  { name: 'Jane Smith', email: 'jane@example.com' },
  { name: 'Johnny Cash', email: 'johnny@example.com' }
];

const filtered = FilterService.filter(
  users,
  ['name'],
  'john',
  FilterMatchMode.CONTAINS
);
// Result: [{ name: 'John Doe', ... }, { name: 'Johnny Cash', ... }]

// Register custom filter
FilterService.register('customMatch', (value, filter) => {
  return value.toLowerCase().includes(filter.toLowerCase());
});

FilterMatchMode

Constants defining available filter matching modes for use with FilterService.

interface FilterMatchModeOptions {
  readonly STARTS_WITH: string;       // 'startsWith'
  readonly CONTAINS: string;          // 'contains'
  readonly NOT_CONTAINS: string;      // 'notContains'
  readonly ENDS_WITH: string;         // 'endsWith'
  readonly EQUALS: string;            // 'equals'
  readonly NOT_EQUALS: string;        // 'notEquals'
  readonly IN: string;                // 'in'
  readonly LESS_THAN: string;         // 'lt'
  readonly LESS_THAN_OR_EQUAL_TO: string;     // 'lte'
  readonly GREATER_THAN: string;      // 'gt'
  readonly GREATER_THAN_OR_EQUAL_TO: string;  // 'gte' 
  readonly BETWEEN: string;           // 'between'
  readonly DATE_IS: string;           // 'dateIs'
  readonly DATE_IS_NOT: string;       // 'dateIsNot'
  readonly DATE_BEFORE: string;       // 'dateBefore'
  readonly DATE_AFTER: string;        // 'dateAfter'
}

declare const FilterMatchMode: FilterMatchModeOptions;

FilterOperator

Logical operators for combining multiple filter conditions.

interface FilterOperatorOptions {
  readonly AND: string;  // 'and'
  readonly OR: string;   // 'or'
}

declare const FilterOperator: FilterOperatorOptions;

PrimeIcons

Comprehensive set of icon constants for PrimeVue UI components (280+ icons).

interface PrimeIconsOptions {
  // Navigation icons (selection)
  readonly ANGLE_DOWN: string;              // 'pi pi-angle-down'
  readonly ANGLE_UP: string;                // 'pi pi-angle-up'
  readonly ANGLE_LEFT: string;              // 'pi pi-angle-left'
  readonly ANGLE_RIGHT: string;             // 'pi pi-angle-right'
  readonly ARROW_DOWN: string;              // 'pi pi-arrow-down'
  readonly ARROW_UP: string;                // 'pi pi-arrow-up'
  readonly ARROW_LEFT: string;              // 'pi pi-arrow-left'
  readonly ARROW_RIGHT: string;             // 'pi pi-arrow-right'
  readonly CHEVRON_DOWN: string;            // 'pi pi-chevron-down'
  readonly CHEVRON_UP: string;              // 'pi pi-chevron-up'
  readonly CHEVRON_LEFT: string;            // 'pi pi-chevron-left'
  readonly CHEVRON_RIGHT: string;           // 'pi pi-chevron-right'
  
  // Action icons (selection)
  readonly CHECK: string;                   // 'pi pi-check'
  readonly TIMES: string;                   // 'pi pi-times'
  readonly PLUS: string;                    // 'pi pi-plus'
  readonly MINUS: string;                   // 'pi pi-minus'
  readonly PENCIL: string;                  // 'pi pi-pencil'
  readonly TRASH: string;                   // 'pi pi-trash'
  readonly SAVE: string;                    // 'pi pi-save'
  readonly COPY: string;                    // 'pi pi-copy'
  readonly DOWNLOAD: string;                // 'pi pi-download'
  readonly UPLOAD: string;                  // 'pi pi-upload'
  readonly REFRESH: string;                 // 'pi pi-refresh'
  readonly SEARCH: string;                  // 'pi pi-search'
  readonly FILTER: string;                  // 'pi pi-filter'
  readonly SORT: string;                    // 'pi pi-sort'
  
  // UI element icons (selection)
  readonly BARS: string;                    // 'pi pi-bars'
  readonly COG: string;                     // 'pi pi-cog'
  readonly HOME: string;                    // 'pi pi-home'
  readonly USER: string;                    // 'pi pi-user'
  readonly CALENDAR: string;                // 'pi pi-calendar'
  readonly CLOCK: string;                   // 'pi pi-clock'
  readonly ENVELOPE: string;                // 'pi pi-envelope'
  readonly PHONE: string;                   // 'pi pi-phone'
  readonly GLOBE: string;                   // 'pi pi-globe'
  readonly INFO: string;                    // 'pi pi-info'
  readonly QUESTION: string;                // 'pi pi-question'
  readonly EXCLAMATION_TRIANGLE: string;    // 'pi pi-exclamation-triangle'
  readonly EXCLAMATION_CIRCLE: string;      // 'pi pi-exclamation-circle'
  
  // Media control icons (selection)
  readonly PLAY: string;                    // 'pi pi-play'
  readonly PAUSE: string;                   // 'pi pi-pause'
  readonly STOP: string;                    // 'pi pi-stop'
  readonly FORWARD: string;                 // 'pi pi-forward'
  readonly BACKWARD: string;                // 'pi pi-backward'
  readonly FAST_FORWARD: string;            // 'pi pi-fast-forward'
  readonly FAST_BACKWARD: string;           // 'pi pi-fast-backward'
  readonly STEP_FORWARD: string;            // 'pi pi-step-forward'
  readonly STEP_BACKWARD: string;           // 'pi pi-step-backward'
  readonly VOLUME_UP: string;               // 'pi pi-volume-up'
  readonly VOLUME_DOWN: string;             // 'pi pi-volume-down'
  readonly VOLUME_OFF: string;              // 'pi pi-volume-off'
  
  // Social media icons (selection)
  readonly FACEBOOK: string;                // 'pi pi-facebook'
  readonly TWITTER: string;                 // 'pi pi-twitter'
  readonly LINKEDIN: string;                // 'pi pi-linkedin'
  readonly GITHUB: string;                  // 'pi pi-github'
  readonly GOOGLE: string;                  // 'pi pi-google'
  readonly INSTAGRAM: string;               // 'pi pi-instagram'
  readonly YOUTUBE: string;                 // 'pi pi-youtube'
  readonly DISCORD: string;                 // 'pi pi-discord'
  readonly SLACK: string;                   // 'pi pi-slack'
  
  // And 230+ more icon constants including:
  // Business: BRIEFCASE, BUILDING, CALCULATOR, CHART_BAR, CHART_LINE, CHART_PIE
  // File operations: FILE, FILE_EDIT, FILE_EXCEL, FILE_PDF, FILE_WORD, FOLDER
  // Shopping: SHOPPING_CART, SHOPPING_BAG, CART_PLUS, MONEY_BILL
  // Communication: COMMENTS, MICROPHONE, BELL, ENVELOPE
  // Technology: DESKTOP, MOBILE, TABLET, WIFI, CODE, DATABASE
  // And many more organized by category
}

declare const PrimeIcons: PrimeIconsOptions;

Usage Examples:

import { PrimeIcons } from '@primevue/core/api';

// Use in templates
const searchIcon = PrimeIcons.SEARCH; // 'pi pi-search'
const saveIcon = PrimeIcons.SAVE;     // 'pi pi-save'

// Common usage in Vue components
<template>
  <button>
    <i :class="PrimeIcons.SEARCH"></i>
    Search
  </button>
</template>

ToastSeverity

Severity level constants for toast notifications and alert messages.

interface ToastSeverityOptions {
  readonly SUCCESS: string;  // 'success'
  readonly INFO: string;     // 'info'
  readonly WARN: string;     // 'warn'
  readonly ERROR: string;    // 'error'
}

declare const ToastSeverity: ToastSeverityOptions;

Usage Examples:

import { ToastSeverity } from '@primevue/core/api';

// Use with toast service
toast.add({
  severity: ToastSeverity.SUCCESS,
  summary: 'Success',
  detail: 'Operation completed successfully'
});

toast.add({
  severity: ToastSeverity.ERROR,
  summary: 'Error',
  detail: 'Something went wrong'
});

Import Patterns

// Named imports from main package
import { FilterService, FilterMatchMode, PrimeIcons, ToastSeverity } from '@primevue/core';

// Modular imports (recommended)
import { FilterService, FilterMatchMode, FilterOperator, PrimeIcons, ToastSeverity } from '@primevue/core/api';

// Individual imports
import FilterService from '@primevue/core/api/FilterService';
import FilterMatchMode from '@primevue/core/api/FilterMatchMode';

Install with Tessl CLI

npx tessl i tessl/npm-primevue--core

docs

api-services.md

base-classes.md

composables.md

configuration.md

index.md

utilities.md

tile.json