@seekora-ai/ui-sdk-angular 0.2.11 → 0.2.13

package/dist/index.d.ts

@@ -1,11 +1,51 @@
+import { OnInit, OnDestroy, Injector, ElementRef, OnChanges, TemplateRef } from '@angular/core';
 import { SeekoraClient, SearchResponse, SearchContext, SearchOptions } from '@seekora-ai/search-sdk';
 import * as _seekora_ai_ui_sdk_types from '@seekora-ai/ui-sdk-types';
 import { Theme, ThemeConfig, SuggestionItem, ViewMode, FieldMapping, ResultItem } from '@seekora-ai/ui-sdk-types';
 export { FieldMapping, ResultItem, SuggestionItem, Theme, ThemeConfig, ViewMode } from '@seekora-ai/ui-sdk-types';
 import { Observable } from 'rxjs';
-import { OnInit, OnDestroy, Injector, ElementRef, OnChanges, TemplateRef } from '@angular/core';
 export { mergeThemes } from '@seekora-ai/ui-sdk-core';
 
+type RatingVariant = 'stars-only' | 'compact' | 'full' | 'inline';
+type RatingSize = 'small' | 'medium' | 'large';
+declare class RatingDisplayComponent implements OnInit {
+    rating: number;
+    reviewCount?: number;
+    variant: RatingVariant;
+    size: RatingSize;
+    maxRating: number;
+    showNumeric: boolean;
+    showHalfStars: boolean;
+    interactive: boolean;
+    starColor: string;
+    emptyStarColor: string;
+    textColor: string;
+    showReviewCount: boolean;
+    reviewCountFormat?: (count: number) => string;
+    className: string;
+    ratingChange: any;
+    hoverRating: number | null;
+    private sizeMap;
+    private fontSizeMap;
+    ngOnInit(): void;
+    get starSize(): number;
+    get fontSize(): string;
+    get clampedRating(): number;
+    get displayRating(): number;
+    get stars(): number[];
+    isStarFilled(index: number): boolean;
+    isStarHalf(index: number): boolean;
+    formatReviewCount(count: number): string;
+    onStarHover(rating: number): void;
+    onStarClick(rating: number): void;
+    onMouseLeave(): void;
+    getStarSVG(filled: boolean, half: boolean): string;
+    get containerClasses(): string;
+    get containerStyles(): {
+        [key: string]: string;
+    };
+}
+
 /**
  * SearchContext Service
  *
@@ -429,5 +469,5 @@ declare const minimalTheme: Theme;
 
 declare const createTheme: (config: ThemeConfig) => _seekora_ai_ui_sdk_types.Theme;
 
-export { CurrentRefinementsComponent, FacetsComponent, PaginationComponent, QuerySuggestionsComponent, QuerySuggestionsService, RangeInputComponent, SEEKORA_CLIENT, SEEKORA_THEME_CONFIG, SearchBarComponent, SearchContextService, SearchLayoutComponent, SearchProviderComponent, SearchResultsComponent, SeekoraSearchService, SortByComponent, StatsComponent, createTheme, darkTheme, defaultTheme, minimalTheme };
-export type { Facet, FacetCount, Refinement, SearchState, SortOption, SuggestionsState };
+export { CurrentRefinementsComponent, FacetsComponent, PaginationComponent, QuerySuggestionsComponent, QuerySuggestionsService, RangeInputComponent, RatingDisplayComponent, SEEKORA_CLIENT, SEEKORA_THEME_CONFIG, SearchBarComponent, SearchContextService, SearchLayoutComponent, SearchProviderComponent, SearchResultsComponent, SeekoraSearchService, SortByComponent, StatsComponent, createTheme, darkTheme, defaultTheme, minimalTheme };
+export type { Facet, FacetCount, RatingSize, RatingVariant, Refinement, SearchState, SortOption, SuggestionsState };

package/dist/index.esm.js

@@ -1,4 +1,5 @@
-import { InjectionToken, Injectable, Component, Input, Output, ViewChild, EventEmitter, ContentChild } from '@angular/core';
+import { Component, Input, Output, EventEmitter, InjectionToken, Injectable, ViewChild, ContentChild } from '@angular/core';
+import { CommonModule } from '@angular/common';
 import { createTheme as createTheme$1, log, extractField, formatPrice } from '@seekora-ai/ui-sdk-core';
 export { mergeThemes } from '@seekora-ai/ui-sdk-core';
 import { BehaviorSubject, from, Subject, Subscription } from 'rxjs';
@@ -64,6 +65,241 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
+let RatingDisplayComponent = (() => {
+    let _classDecorators = [Component({
+            selector: 'seekora-rating-display',
+            standalone: true,
+            imports: [CommonModule],
+            templateUrl: './rating-display.component.html',
+            styleUrls: ['./rating-display.component.css']
+        })];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _rating_decorators;
+    let _rating_initializers = [];
+    let _rating_extraInitializers = [];
+    let _reviewCount_decorators;
+    let _reviewCount_initializers = [];
+    let _reviewCount_extraInitializers = [];
+    let _variant_decorators;
+    let _variant_initializers = [];
+    let _variant_extraInitializers = [];
+    let _size_decorators;
+    let _size_initializers = [];
+    let _size_extraInitializers = [];
+    let _maxRating_decorators;
+    let _maxRating_initializers = [];
+    let _maxRating_extraInitializers = [];
+    let _showNumeric_decorators;
+    let _showNumeric_initializers = [];
+    let _showNumeric_extraInitializers = [];
+    let _showHalfStars_decorators;
+    let _showHalfStars_initializers = [];
+    let _showHalfStars_extraInitializers = [];
+    let _interactive_decorators;
+    let _interactive_initializers = [];
+    let _interactive_extraInitializers = [];
+    let _starColor_decorators;
+    let _starColor_initializers = [];
+    let _starColor_extraInitializers = [];
+    let _emptyStarColor_decorators;
+    let _emptyStarColor_initializers = [];
+    let _emptyStarColor_extraInitializers = [];
+    let _textColor_decorators;
+    let _textColor_initializers = [];
+    let _textColor_extraInitializers = [];
+    let _showReviewCount_decorators;
+    let _showReviewCount_initializers = [];
+    let _showReviewCount_extraInitializers = [];
+    let _reviewCountFormat_decorators;
+    let _reviewCountFormat_initializers = [];
+    let _reviewCountFormat_extraInitializers = [];
+    let _className_decorators;
+    let _className_initializers = [];
+    let _className_extraInitializers = [];
+    let _ratingChange_decorators;
+    let _ratingChange_initializers = [];
+    let _ratingChange_extraInitializers = [];
+    _classThis = class {
+        constructor() {
+            this.rating = __runInitializers(this, _rating_initializers, 0);
+            this.reviewCount = (__runInitializers(this, _rating_extraInitializers), __runInitializers(this, _reviewCount_initializers, void 0));
+            this.variant = (__runInitializers(this, _reviewCount_extraInitializers), __runInitializers(this, _variant_initializers, 'compact'));
+            this.size = (__runInitializers(this, _variant_extraInitializers), __runInitializers(this, _size_initializers, 'medium'));
+            this.maxRating = (__runInitializers(this, _size_extraInitializers), __runInitializers(this, _maxRating_initializers, 5));
+            this.showNumeric = (__runInitializers(this, _maxRating_extraInitializers), __runInitializers(this, _showNumeric_initializers, false));
+            this.showHalfStars = (__runInitializers(this, _showNumeric_extraInitializers), __runInitializers(this, _showHalfStars_initializers, true));
+            this.interactive = (__runInitializers(this, _showHalfStars_extraInitializers), __runInitializers(this, _interactive_initializers, false));
+            this.starColor = (__runInitializers(this, _interactive_extraInitializers), __runInitializers(this, _starColor_initializers, '#f59e0b'));
+            this.emptyStarColor = (__runInitializers(this, _starColor_extraInitializers), __runInitializers(this, _emptyStarColor_initializers, '#d1d5db'));
+            this.textColor = (__runInitializers(this, _emptyStarColor_extraInitializers), __runInitializers(this, _textColor_initializers, 'var(--seekora-text-secondary, #6b7280)'));
+            this.showReviewCount = (__runInitializers(this, _textColor_extraInitializers), __runInitializers(this, _showReviewCount_initializers, true));
+            this.reviewCountFormat = (__runInitializers(this, _showReviewCount_extraInitializers), __runInitializers(this, _reviewCountFormat_initializers, void 0));
+            this.className = (__runInitializers(this, _reviewCountFormat_extraInitializers), __runInitializers(this, _className_initializers, ''));
+            this.ratingChange = (__runInitializers(this, _className_extraInitializers), __runInitializers(this, _ratingChange_initializers, new EventEmitter()));
+            this.hoverRating = (__runInitializers(this, _ratingChange_extraInitializers), null);
+            this.sizeMap = {
+                small: 14,
+                medium: 18,
+                large: 24,
+            };
+            this.fontSizeMap = {
+                small: '0.75rem',
+                medium: '0.875rem',
+                large: '1rem',
+            };
+        }
+        ngOnInit() { }
+        get starSize() {
+            return this.sizeMap[this.size];
+        }
+        get fontSize() {
+            return this.fontSizeMap[this.size];
+        }
+        get clampedRating() {
+            return Math.max(0, Math.min(this.maxRating, this.rating));
+        }
+        get displayRating() {
+            return this.interactive && this.hoverRating !== null
+                ? this.hoverRating
+                : this.clampedRating;
+        }
+        get stars() {
+            return Array.from({ length: this.maxRating }, (_, i) => i + 1);
+        }
+        isStarFilled(index) {
+            return index <= Math.floor(this.displayRating);
+        }
+        isStarHalf(index) {
+            return (this.showHalfStars &&
+                index === Math.ceil(this.displayRating) &&
+                this.displayRating % 1 >= 0.25 &&
+                this.displayRating % 1 < 0.75);
+        }
+        formatReviewCount(count) {
+            if (this.reviewCountFormat) {
+                return this.reviewCountFormat(count);
+            }
+            if (count >= 1000000)
+                return `${(count / 1000000).toFixed(1)}M`;
+            if (count >= 1000)
+                return `${(count / 1000).toFixed(1)}K`;
+            return count.toString();
+        }
+        onStarHover(rating) {
+            if (this.interactive) {
+                this.hoverRating = rating;
+            }
+        }
+        onStarClick(rating) {
+            if (this.interactive) {
+                this.hoverRating = null;
+                this.ratingChange.emit(rating);
+            }
+        }
+        onMouseLeave() {
+            if (this.interactive) {
+                this.hoverRating = null;
+            }
+        }
+        getStarSVG(filled, half) {
+            if (half) {
+                const gradientId = `half-fill-${Math.random()}`;
+                return `
+        <svg width="${this.starSize}" height="${this.starSize}" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <defs>
+            <linearGradient id="${gradientId}">
+              <stop offset="50%" stop-color="${this.starColor}" />
+              <stop offset="50%" stop-color="${this.emptyStarColor}" />
+            </linearGradient>
+          </defs>
+          <path
+            d="M12 2L15.09 8.26L22 9.27L17 14.14L18.18 21.02L12 17.77L5.82 21.02L7 14.14L2 9.27L8.91 8.26L12 2Z"
+            fill="url(#${gradientId})"
+            stroke="${this.starColor}"
+            stroke-width="1"
+          />
+        </svg>
+      `;
+            }
+            return `
+      <svg width="${this.starSize}" height="${this.starSize}" viewBox="0 0 24 24" fill="${filled ? this.starColor : 'none'}" xmlns="http://www.w3.org/2000/svg">
+        <path
+          d="M12 2L15.09 8.26L22 9.27L17 14.14L18.18 21.02L12 17.77L5.82 21.02L7 14.14L2 9.27L8.91 8.26L12 2Z"
+          stroke="${filled ? this.starColor : this.emptyStarColor}"
+          stroke-width="1.5"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        />
+      </svg>
+    `;
+        }
+        get containerClasses() {
+            return `seekora-rating-display seekora-rating-display--${this.variant} ${this.className}`;
+        }
+        get containerStyles() {
+            const baseStyles = {
+                fontSize: this.fontSize,
+            };
+            if (this.variant === 'stars-only') {
+                return { ...baseStyles, display: 'inline-flex', alignItems: 'center', gap: '2px' };
+            }
+            else if (this.variant === 'compact' || this.variant === 'inline') {
+                return {
+                    ...baseStyles,
+                    display: 'inline-flex',
+                    alignItems: 'center',
+                    gap: this.variant === 'inline' ? '6px' : '4px',
+                };
+            }
+            else if (this.variant === 'full') {
+                return { ...baseStyles, display: 'flex', flexDirection: 'column', gap: '4px' };
+            }
+            return baseStyles;
+        }
+    };
+    __setFunctionName(_classThis, "RatingDisplayComponent");
+    (() => {
+        const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(null) : void 0;
+        _rating_decorators = [Input()];
+        _reviewCount_decorators = [Input()];
+        _variant_decorators = [Input()];
+        _size_decorators = [Input()];
+        _maxRating_decorators = [Input()];
+        _showNumeric_decorators = [Input()];
+        _showHalfStars_decorators = [Input()];
+        _interactive_decorators = [Input()];
+        _starColor_decorators = [Input()];
+        _emptyStarColor_decorators = [Input()];
+        _textColor_decorators = [Input()];
+        _showReviewCount_decorators = [Input()];
+        _reviewCountFormat_decorators = [Input()];
+        _className_decorators = [Input()];
+        _ratingChange_decorators = [Output()];
+        __esDecorate(null, null, _rating_decorators, { kind: "field", name: "rating", static: false, private: false, access: { has: obj => "rating" in obj, get: obj => obj.rating, set: (obj, value) => { obj.rating = value; } }, metadata: _metadata }, _rating_initializers, _rating_extraInitializers);
+        __esDecorate(null, null, _reviewCount_decorators, { kind: "field", name: "reviewCount", static: false, private: false, access: { has: obj => "reviewCount" in obj, get: obj => obj.reviewCount, set: (obj, value) => { obj.reviewCount = value; } }, metadata: _metadata }, _reviewCount_initializers, _reviewCount_extraInitializers);
+        __esDecorate(null, null, _variant_decorators, { kind: "field", name: "variant", static: false, private: false, access: { has: obj => "variant" in obj, get: obj => obj.variant, set: (obj, value) => { obj.variant = value; } }, metadata: _metadata }, _variant_initializers, _variant_extraInitializers);
+        __esDecorate(null, null, _size_decorators, { kind: "field", name: "size", static: false, private: false, access: { has: obj => "size" in obj, get: obj => obj.size, set: (obj, value) => { obj.size = value; } }, metadata: _metadata }, _size_initializers, _size_extraInitializers);
+        __esDecorate(null, null, _maxRating_decorators, { kind: "field", name: "maxRating", static: false, private: false, access: { has: obj => "maxRating" in obj, get: obj => obj.maxRating, set: (obj, value) => { obj.maxRating = value; } }, metadata: _metadata }, _maxRating_initializers, _maxRating_extraInitializers);
+        __esDecorate(null, null, _showNumeric_decorators, { kind: "field", name: "showNumeric", static: false, private: false, access: { has: obj => "showNumeric" in obj, get: obj => obj.showNumeric, set: (obj, value) => { obj.showNumeric = value; } }, metadata: _metadata }, _showNumeric_initializers, _showNumeric_extraInitializers);
+        __esDecorate(null, null, _showHalfStars_decorators, { kind: "field", name: "showHalfStars", static: false, private: false, access: { has: obj => "showHalfStars" in obj, get: obj => obj.showHalfStars, set: (obj, value) => { obj.showHalfStars = value; } }, metadata: _metadata }, _showHalfStars_initializers, _showHalfStars_extraInitializers);
+        __esDecorate(null, null, _interactive_decorators, { kind: "field", name: "interactive", static: false, private: false, access: { has: obj => "interactive" in obj, get: obj => obj.interactive, set: (obj, value) => { obj.interactive = value; } }, metadata: _metadata }, _interactive_initializers, _interactive_extraInitializers);
+        __esDecorate(null, null, _starColor_decorators, { kind: "field", name: "starColor", static: false, private: false, access: { has: obj => "starColor" in obj, get: obj => obj.starColor, set: (obj, value) => { obj.starColor = value; } }, metadata: _metadata }, _starColor_initializers, _starColor_extraInitializers);
+        __esDecorate(null, null, _emptyStarColor_decorators, { kind: "field", name: "emptyStarColor", static: false, private: false, access: { has: obj => "emptyStarColor" in obj, get: obj => obj.emptyStarColor, set: (obj, value) => { obj.emptyStarColor = value; } }, metadata: _metadata }, _emptyStarColor_initializers, _emptyStarColor_extraInitializers);
+        __esDecorate(null, null, _textColor_decorators, { kind: "field", name: "textColor", static: false, private: false, access: { has: obj => "textColor" in obj, get: obj => obj.textColor, set: (obj, value) => { obj.textColor = value; } }, metadata: _metadata }, _textColor_initializers, _textColor_extraInitializers);
+        __esDecorate(null, null, _showReviewCount_decorators, { kind: "field", name: "showReviewCount", static: false, private: false, access: { has: obj => "showReviewCount" in obj, get: obj => obj.showReviewCount, set: (obj, value) => { obj.showReviewCount = value; } }, metadata: _metadata }, _showReviewCount_initializers, _showReviewCount_extraInitializers);
+        __esDecorate(null, null, _reviewCountFormat_decorators, { kind: "field", name: "reviewCountFormat", static: false, private: false, access: { has: obj => "reviewCountFormat" in obj, get: obj => obj.reviewCountFormat, set: (obj, value) => { obj.reviewCountFormat = value; } }, metadata: _metadata }, _reviewCountFormat_initializers, _reviewCountFormat_extraInitializers);
+        __esDecorate(null, null, _className_decorators, { kind: "field", name: "className", static: false, private: false, access: { has: obj => "className" in obj, get: obj => obj.className, set: (obj, value) => { obj.className = value; } }, metadata: _metadata }, _className_initializers, _className_extraInitializers);
+        __esDecorate(null, null, _ratingChange_decorators, { kind: "field", name: "ratingChange", static: false, private: false, access: { has: obj => "ratingChange" in obj, get: obj => obj.ratingChange, set: (obj, value) => { obj.ratingChange = value; } }, metadata: _metadata }, _ratingChange_initializers, _ratingChange_extraInitializers);
+        __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+        _classThis = _classDescriptor.value;
+        if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        __runInitializers(_classThis, _classExtraInitializers);
+    })();
+    return _classThis;
+})();
+
 /**
  * Default Theme
  */
@@ -2522,5 +2758,5 @@ const minimalTheme = {
     },
 };
 
-export { CurrentRefinementsComponent, FacetsComponent, PaginationComponent, QuerySuggestionsComponent, QuerySuggestionsService, RangeInputComponent, SEEKORA_CLIENT, SEEKORA_THEME_CONFIG, SearchBarComponent, SearchContextService, SearchLayoutComponent, SearchProviderComponent, SearchResultsComponent, SeekoraSearchService, SortByComponent, StatsComponent, createTheme, darkTheme, defaultTheme, minimalTheme };
+export { CurrentRefinementsComponent, FacetsComponent, PaginationComponent, QuerySuggestionsComponent, QuerySuggestionsService, RangeInputComponent, RatingDisplayComponent, SEEKORA_CLIENT, SEEKORA_THEME_CONFIG, SearchBarComponent, SearchContextService, SearchLayoutComponent, SearchProviderComponent, SearchResultsComponent, SeekoraSearchService, SortByComponent, StatsComponent, createTheme, darkTheme, defaultTheme, minimalTheme };
 //# sourceMappingURL=index.esm.js.map