UNPKG

@vindev/particle

Version:

Angular Component Library using Tailwind

1,159 lines (1,124 loc) 696 kB
import * as i1 from '@angular/common'; import { CommonModule, isPlatformBrowser } from '@angular/common'; import * as i0 from '@angular/core'; import { EventEmitter, Directive, Output, Input, NgModule, Component, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA, PLATFORM_ID, Inject, ViewChild } from '@angular/core'; import { Observable, ConnectableObservable, BehaviorSubject, Subject, merge, of, combineLatest } from 'rxjs'; import { map, takeUntil } from 'rxjs/operators'; class BaseAtom { } function ClickMixin(Base = class { }) { class Click extends Base { constructor() { super(...arguments); this.action = new EventEmitter(); } clicked(event, disabled = false) { if (event && !disabled) { this.action.emit(event); // event?.stopPropagation(); } } } Click.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Click, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Click.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Click, outputs: { action: "action" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Click, decorators: [{ type: Directive }], propDecorators: { action: [{ type: Output }] } }); return Click; } function CloseMixin(Base = class { }) { class Close extends Base { constructor() { super(...arguments); this.closeIt = new EventEmitter(); } closed(value) { this.closeIt.emit(value); event?.stopPropagation(); } } Close.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Close, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Close.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Close, outputs: { closeIt: "closeIt" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Close, decorators: [{ type: Directive }], propDecorators: { closeIt: [{ type: Output }] } }); return Close; } function DisableMixin(Base = class { }) { class Disable extends Base { constructor() { super(...arguments); this.disabled = false; } set setDisabled(disabled) { this.disabled = disabled != null && `${disabled}` !== 'false'; } } Disable.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Disable, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Disable.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Disable, inputs: { setDisabled: ["disabled", "setDisabled"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Disable, decorators: [{ type: Directive }], propDecorators: { setDisabled: [{ type: Input, args: ['disabled'] }] } }); return Disable; } function GhostMixin(Base = class { }) { class Ghost extends Base { constructor(...args) { super(...args); this.ghost = false; } set setGhost(ghost) { this.ghost = ghost != null && `${ghost}` !== 'false'; } } Ghost.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Ghost, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); Ghost.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Ghost, inputs: { setGhost: ["ghost", "setGhost"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Ghost, decorators: [{ type: Directive }], ctorParameters: function () { return [{ type: undefined }]; }, propDecorators: { setGhost: [{ type: Input, args: ['ghost'] }] } }); return Ghost; } function HintMixin(Base = class { }) { class Hint extends Base { set setHint(hint) { this.hint = String(hint); } set setLengthHint(lengthHint) { this.lengthHint = String(lengthHint); } get hints() { return [this.hint, this.lengthHint].filter(Boolean).join(', '); } } Hint.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Hint, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Hint.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Hint, inputs: { setHint: ["hint", "setHint"], setLengthHint: ["lengthHint", "setLengthHint"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Hint, decorators: [{ type: Directive }], propDecorators: { setHint: [{ type: Input, args: ['hint'] }], setLengthHint: [{ type: Input, args: ['lengthHint'] }] } }); return Hint; } function IconMixin(Base = class { }) { class Icon extends Base { } Icon.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Icon, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Icon.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Icon, inputs: { icon: "icon" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Icon, decorators: [{ type: Directive }], propDecorators: { icon: [{ type: Input }] } }); return Icon; } function IdMixin(Base = class { }) { class Id extends Base { constructor() { super(...arguments); this.id = Math.random().toString(36).slice(); } } Id.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Id, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Id.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Id, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Id, decorators: [{ type: Directive }] }); return Id; } function ItemMixin(Base = class { }, defaultItem = { label: undefined, placeholder: undefined, value: undefined, }) { class Item extends Base { constructor() { super(...arguments); this._item = Object.assign({}, defaultItem); } set label(label) { if (String.isString(label)) { this._item.label = label; } } get label() { return this.item?.label || this._item.label || null; } set placeholder(placeholder) { if (String.isString(placeholder)) { this._item.placeholder = placeholder; } } get placeholder() { return this.item?.placeholder || this._item.placeholder || null; } set value(value) { this._item.value = value; } get value() { return this.item?.value || this._item.value; } } Item.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Item, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Item.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Item, inputs: { item: "item", label: "label", placeholder: "placeholder", value: "value" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Item, decorators: [{ type: Directive }], propDecorators: { item: [{ type: Input }], label: [{ type: Input }], placeholder: [{ type: Input }], value: [{ type: Input }] } }); return Item; } function LimitMixin(Base = class { }) { class Limit extends Base { set setMin(min) { if (isFinite(min)) { this.min = Number(min); } } set setMax(max) { if (isFinite(max)) { this.max = Number(max); } } clamp(min, max) { this.setMin = min; this.setMax = max; } } Limit.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Limit, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Limit.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Limit, inputs: { setMin: ["min", "setMin"], setMax: ["max", "setMax"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Limit, decorators: [{ type: Directive }], propDecorators: { setMin: [{ type: Input, args: ['min'] }], setMax: [{ type: Input, args: ['max'] }] } }); return Limit; } function LoadingMixin(Base = class { }) { class Loading extends Base { constructor() { super(...arguments); this.loading = false; } set setLoading(loading) { this.loading = loading != null && `${loading}` !== 'false'; } } Loading.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Loading, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Loading.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Loading, inputs: { setLoading: ["loading", "setLoading"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Loading, decorators: [{ type: Directive }], propDecorators: { setLoading: [{ type: Input, args: ['loading'] }] } }); return Loading; } var PositionOpt; (function (PositionOpt) { PositionOpt["LEFT"] = "left"; PositionOpt["RIGHT"] = "right"; PositionOpt["TOP"] = "top"; PositionOpt["BOTTOM"] = "bottom"; PositionOpt["CENTER"] = "center"; })(PositionOpt || (PositionOpt = {})); function PositionMixin(Base = class { }) { class Position extends Base { set setLeft(left) { this.left = left === '' || left === 'true' || left === true; this.right = this.left ?? false; } set setRight(right) { this.right = right === '' || right === 'true' || right === true; this.left = this.right ?? false; } set setTop(top) { this.top = top === '' || top === 'true' || top === true; this.bottom = this.top ?? false; } set setBottom(bottom) { this.bottom = bottom === '' || bottom === 'true' || bottom === true; this.top = this.bottom ?? false; } set setCenter(center) { this.center = center === '' || center === 'true' || center === true; } activePos() { let pos; if (this.left) { pos = PositionOpt.LEFT; } else if (this.right) { pos = PositionOpt.RIGHT; } else if (this.top) { pos = PositionOpt.TOP; } else if (this.bottom) { pos = PositionOpt.BOTTOM; } else if (this.center) { pos = PositionOpt.CENTER; } return pos; } } Position.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Position, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Position.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Position, inputs: { setLeft: ["left", "setLeft"], setRight: ["right", "setRight"], setTop: ["top", "setTop"], setBottom: ["bottom", "setBottom"], setCenter: ["center", "setCenter"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Position, decorators: [{ type: Directive }], propDecorators: { setLeft: [{ type: Input, args: ['left'] }], setRight: [{ type: Input, args: ['right'] }], setTop: [{ type: Input, args: ['top'] }], setBottom: [{ type: Input, args: ['bottom'] }], setCenter: [{ type: Input, args: ['center'] }] } }); return Position; } var Sizes; (function (Sizes) { Sizes["S"] = "small"; Sizes["M"] = "medium"; Sizes["L"] = "large"; Sizes["XL"] = "xlarge"; })(Sizes || (Sizes = {})); var AtmInputType; (function (AtmInputType) { AtmInputType["Text"] = "text"; AtmInputType["Phone"] = "phone"; AtmInputType["Number"] = "number"; })(AtmInputType || (AtmInputType = {})); var ThemeOpt; (function (ThemeOpt) { ThemeOpt["UNSET"] = "unset"; ThemeOpt["PRIMARY"] = "primary"; ThemeOpt["SECONDARY"] = "secondary"; ThemeOpt["WARN"] = "warn"; ThemeOpt["NAKED"] = "naked"; })(ThemeOpt || (ThemeOpt = {})); var CompareType; (function (CompareType) { CompareType[CompareType["CASEINSENSITIVE"] = 0] = "CASEINSENSITIVE"; CompareType[CompareType["LOCALIZEDCASEINSENSITIVE"] = 1] = "LOCALIZEDCASEINSENSITIVE"; })(CompareType || (CompareType = {})); String.prototype.compare = function (compareWithValue, type) { const originalValue = String(this); let result = false; switch (type) { case CompareType.CASEINSENSITIVE: result = originalValue.toLowerCase() === compareWithValue.toLowerCase(); break; case CompareType.LOCALIZEDCASEINSENSITIVE: result = originalValue.toLocaleLowerCase() === compareWithValue.toLocaleLowerCase(); break; default: result = originalValue === compareWithValue; break; } return result; }; String.prototype.isNullOrEmpty = (val) => { return val === undefined || val === null || val.trim() === ''; }; String.isString = (value) => typeof value === 'string'; function SizeMixin(Base = class { }) { class Size extends Base { constructor() { super(...arguments); this.Sizes = Sizes; this.size = Sizes.M; } set setSize(size) { for (const key in Sizes) { if (size?.compare(key, 0) || size?.compare(Sizes[key], 0)) { this.size = Sizes[key]; } } } set setS(s) { this.size = Sizes.S; } set setSmall(s) { this.size = Sizes.S; } set setM(m) { this.size = Sizes.M; } set setMedium(m) { this.size = Sizes.M; } set setL(l) { this.size = Sizes.L; } set setLarge(l) { this.size = Sizes.L; } set setXl(xl) { this.size = Sizes.XL; } set setXlarge(xl) { this.size = Sizes.XL; } } Size.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Size, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Size.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Size, inputs: { setSize: ["size", "setSize"], setS: ["S", "setS"], setSmall: ["small", "setSmall"], setM: ["M", "setM"], setMedium: ["medium", "setMedium"], setL: ["L", "setL"], setLarge: ["large", "setLarge"], setXl: ["XL", "setXl"], setXlarge: ["xlarge", "setXlarge"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Size, decorators: [{ type: Directive }], propDecorators: { setSize: [{ type: Input, args: ['size'] }], setS: [{ type: Input, args: ['S'] }], setSmall: [{ type: Input, args: ['small'] }], setM: [{ type: Input, args: ['M'] }], setMedium: [{ type: Input, args: ['medium'] }], setL: [{ type: Input, args: ['L'] }], setLarge: [{ type: Input, args: ['large'] }], setXl: [{ type: Input, args: ['XL'] }], setXlarge: [{ type: Input, args: ['xlarge'] }] } }); return Size; } function StateMixin(Base = class { }) { class State extends Base { constructor() { super(...arguments); this.normal = false; this.focused = false; this.error = false; } set setNormal(normal) { this.normal = Boolean(normal); } set setFocused(focused) { this.focused = Boolean(focused); } set setError(error) { this.error = Boolean(error); } } State.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: State, deps: null, target: i0.ɵɵFactoryTarget.Directive }); State.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: State, inputs: { setNormal: ["normal", "setNormal"], setFocused: ["focused", "setFocused"], setError: ["error", "setError"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: State, decorators: [{ type: Directive }], propDecorators: { setNormal: [{ type: Input, args: ['normal'] }], setFocused: [{ type: Input, args: ['focused'] }], setError: [{ type: Input, args: ['error'] }] } }); return State; } function ThemeMixin(Base = class { }) { class Theme extends Base { constructor() { super(...arguments); this.unset = true; this.activeTheme = ThemeOpt.UNSET; } set setPrimary(primary) { this.primary = primary != null && `${primary}` !== 'false'; this.activeTheme = ThemeOpt.PRIMARY; this.unset = false; } set setSecondary(secondary) { this.secondary = secondary != null && `${secondary}` !== 'false'; this.activeTheme = ThemeOpt.SECONDARY; this.unset = false; } set setWarn(warn) { this.warn = warn != null && `${warn}` !== 'false'; this.activeTheme = ThemeOpt.WARN; this.unset = false; } set setNaked(naked) { this.naked = naked != null && `${naked}` !== 'false'; this.activeTheme = ThemeOpt.NAKED; this.unset = false; } setTheme(theme) { const { primary, secondary, warn, naked } = theme; if (primary) { this.setPrimary = primary; } if (secondary) { this.setSecondary = secondary; } if (warn) { this.setWarn = warn; } if (naked) { this.setNaked = naked; } } } Theme.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Theme, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Theme.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Theme, inputs: { setPrimary: ["primary", "setPrimary"], setSecondary: ["secondary", "setSecondary"], setWarn: ["warn", "setWarn"], setNaked: ["naked", "setNaked"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Theme, decorators: [{ type: Directive }], propDecorators: { setPrimary: [{ type: Input, args: ['primary'] }], setSecondary: [{ type: Input, args: ['secondary'] }], setWarn: [{ type: Input, args: ['warn'] }], setNaked: [{ type: Input, args: ['naked'] }] } }); return Theme; } function TypeMixin(Base = class { }, Types) { class Type extends Base { constructor() { super(...arguments); this.type = ''; } set setType(type) { // const types = Object.values(Types); // const validType = types.some((t: string) => type.compare(t, 0)); // if (validType) { // this.type = type.toLowerCase(); // } else { // throw new Error(`Ah ah ah, type ${type} is not in ${types.join(', ')}.`); // } } } Type.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Type, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Type.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Type, inputs: { setType: ["type", "setType"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Type, decorators: [{ type: Directive }], propDecorators: { setType: [{ type: Input, args: ['type'] }] } }); return Type; } function InitializedMixin(Base = class { }) { class Initialized extends Base { constructor(...args) { super(...args); this._isInitialized = false; this._pendingSubscribers = []; this.initialized = new Observable((subscriber) => { if (this._isInitialized) { this._notifySubscriber(subscriber); } else { this._pendingSubscribers?.push(subscriber); } }); } _markInitialized() { if (this._isInitialized) { throw Error('This directive has already been marked as initialized and should not be called twice.'); } this._isInitialized = true; this._pendingSubscribers?.forEach(this._notifySubscriber); this._pendingSubscribers = null; } _notifySubscriber(subscriber) { subscriber.next(); subscriber.complete(); } } Initialized.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Initialized, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); Initialized.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Initialized, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Initialized, decorators: [{ type: Directive }], ctorParameters: function () { return [{ type: undefined }]; } }); return Initialized; } function ValidatorMixin(Base = class { }) { class Validator extends Base { constructor() { super(...arguments); this._validators = []; this.errorMessages = []; } set validators(validators) { const validArray = Array.isArray(validators); const validFunctions = validArray && validators.filter((validator) => typeof validator === 'function'); if (validFunctions) { this._validators = validFunctions; } } get validators() { return this._validators; } validate(item) { const validationResults = this._validators.map((validator) => validator(item)); const failed = validationResults.filter(String.isString); if (failed.length) { this.errorMessages = failed; } else { this.resetErrors(); } } resetErrors() { this.errorMessages = []; } } Validator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Validator, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Validator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Validator, inputs: { validators: "validators" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Validator, decorators: [{ type: Directive }], propDecorators: { validators: [{ type: Input }] } }); return Validator; } function RequiredMixin(Base = class { }) { class Required extends Base { constructor() { super(...arguments); this.required = false; } set setRequired(required) { this.required = required === '' || required; } } Required.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Required, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Required.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Required, inputs: { setRequired: ["required", "setRequired"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Required, decorators: [{ type: Directive }], propDecorators: { setRequired: [{ type: Input, args: ['required'] }] } }); return Required; } class DataSource { } function isDataSource(value) { return (value && typeof value.connect === 'function' && !(value instanceof ConnectableObservable)); } class AtmDataSource extends DataSource { constructor(initialData = []) { super(); this._filter = new BehaviorSubject(''); this._renderData = new BehaviorSubject([]); this._internalPageChanges = new Subject(); this._renderChangesSubscription = null; this.filterPredicate = (data, filter) => { const dataStr = Object.keys(data || {}) .reduce((currentTerm, key) => { return currentTerm + data[key] + '◬'; }, '') .toLowerCase(); const transformedFilter = filter.trim().toLowerCase(); return dataStr.indexOf(transformedFilter) !== -1; }; this._data = new BehaviorSubject(initialData); this._updateChangeSubscription(); } get paginator() { return this._paginator; } set paginator(paginator) { this._paginator = paginator; this._updateChangeSubscription(); this._internalPageChanges.next(); } get data() { return this._data.value; } set data(data) { this._data.next(data); } get filter() { return this._filter.value; } set filter(filter) { this._filter.next(filter); } connect() { return this._renderData; } addToData(newData) { this._renderData.next(newData); } disconnect() { this._renderChangesSubscription?.unsubscribe(); this._renderChangesSubscription = null; } _updateChangeSubscription() { const pageChanges$ = this.paginator ? merge(this.paginator.page, this.paginator.initialized, this._internalPageChanges) : of(null); const dataStream = this._data; const filteredData = combineLatest([dataStream, this._filter]).pipe(map(([data]) => this._filterData(data))); const paginatedData = combineLatest([filteredData, pageChanges$]).pipe(map(([data]) => this._pageData(data))); this._renderChangesSubscription?.unsubscribe(); this._renderChangesSubscription = paginatedData.subscribe((data) => this._renderData.next(data)); } _filterData(data) { this.filteredData = !this.filter ? data : data.filter((obj) => this.filterPredicate(obj, this.filter)); if (this.paginator) { this._updatePaginator(this.filteredData.length); } return this.filteredData; } _pageData(data) { if (!this.paginator) { return data; } const startIndex = this.paginator.pageIndex * this.paginator.pageSize; return data.slice(startIndex, startIndex + this.paginator.pageSize); } _updatePaginator(filteredDataLength) { Promise.resolve().then(() => { if (!this.paginator) { return; } const paginator = this.paginator; paginator.length = filteredDataLength; if (paginator.pageIndex > 0) { const lastPageIndex = Math.ceil(paginator.length / paginator.pageSize) - 1 || 0; const newPageIndex = Math.min(paginator.pageIndex, lastPageIndex); if (newPageIndex !== paginator.pageIndex) { paginator.pageIndex = newPageIndex; this._internalPageChanges.next(); } } }); } } function DataSourceMixin(Base = class { }) { class DataSource extends Base { constructor() { super(...arguments); this._dataBehavior = new BehaviorSubject([]); this._onDestroy = new Subject(); this._loadSize = 1; } get dataSource() { return this._dataSource; } set dataSource(dataSource) { if (this._dataSource !== dataSource) { this._dataBehavior.next([]); if (this.dataSource) { this.dataSource.disconnect(); } if (this._renderChangeSubscription) { this._renderChangeSubscription.unsubscribe(); this._renderChangeSubscription = null; } this._dataSource = dataSource; this.dataSourceSwitched(); } } get data() { return this._dataBehavior.getValue(); } get loadSize() { return this._loadSize; } set loadSize(loadSize) { this._loadSize = loadSize; } ngOnDestroy() { this._onDestroy.next(); this._onDestroy.complete(); if (this.dataSource) { this.dataSource.disconnect(); } } ngAfterContentChecked() { if (!this.dataSource) { return; } if (!this._renderChangeSubscription) { const dataStream = this.dataSource.connect(); this._renderChangeSubscription = dataStream .pipe(takeUntil(this._onDestroy)) .subscribe((data) => { this._dataBehavior.next(this._dataBehavior.getValue().concat(data)); }); } } } DataSource.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DataSource, deps: null, target: i0.ɵɵFactoryTarget.Directive }); DataSource.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: DataSource, inputs: { dataSource: "dataSource", loadSize: "loadSize" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DataSource, decorators: [{ type: Directive }], propDecorators: { dataSource: [{ type: Input }], loadSize: [{ type: Input }] } }); return DataSource; } function UrlMixin(Base = class { }) { class Url extends Base { set setUrl(url) { this.url = url; } } Url.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Url, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Url.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Url, inputs: { setUrl: ["url", "setUrl"] }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Url, decorators: [{ type: Directive }], propDecorators: { setUrl: [{ type: Input, args: ['url'] }] } }); return Url; } function WidthMixin(Base = class { }) { class Width extends Base { } Width.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Width, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Width.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Width, inputs: { width: "width" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Width, decorators: [{ type: Directive }], propDecorators: { width: [{ type: Input }] } }); return Width; } const PTCL_BUTTON_HOST = { '[attr.disabled]': 'disabled || null', }; function BaseButtonMixin(Base = class { }) { const BaseButtonMixins = SizeMixin(IconMixin(DisableMixin(GhostMixin(ThemeMixin(Base))))); class BaseButton extends BaseButtonMixins { constructor() { super(...arguments); this.action = new EventEmitter(); } clicked(event) { if (event && !this.disabled) { this.action.emit(event); // event?.stopPropagation(); } } } BaseButton.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BaseButton, deps: null, target: i0.ɵɵFactoryTarget.Directive }); BaseButton.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: BaseButton, outputs: { action: "action" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BaseButton, decorators: [{ type: Directive }], propDecorators: { action: [{ type: Output }] } }); return BaseButton; } function ColorMixin(Base = class { }) { class Color extends Base { } Color.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Color, deps: null, target: i0.ɵɵFactoryTarget.Directive }); Color.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: Color, inputs: { color: "color" }, usesInheritance: true, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: Color, decorators: [{ type: Directive }], propDecorators: { color: [{ type: Input }] } }); return Color; } class ColorDirective { constructor(_elementRef) { this._elementRef = _elementRef; this.defaultColor = ThemeOpt.UNSET; this._color = this.defaultColor; this._elementRef.nativeElement.classList.remove(`ptcl-${this._color}`); } set ptclColor(value) { const colorPalette = (value || this.defaultColor); if (colorPalette !== this._color) { if (this._color) { this._elementRef.nativeElement.classList.remove(`ptcl-${this._color}`); } if (colorPalette) { this._elementRef.nativeElement.classList.add(`ptcl-${colorPalette}`); } this._color = colorPalette; } } } ColorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ColorDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); ColorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: ColorDirective, selector: "[ptclColor]", inputs: { ptclColor: "ptclColor" }, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ColorDirective, decorators: [{ type: Directive, args: [{ selector: '[ptclColor]', }] }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ptclColor: [{ type: Input }] } }); class ColorDirectiveModule { } ColorDirectiveModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ColorDirectiveModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); ColorDirectiveModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: ColorDirectiveModule, declarations: [ColorDirective], imports: [CommonModule], exports: [ColorDirective] }); ColorDirectiveModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ColorDirectiveModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ColorDirectiveModule, decorators: [{ type: NgModule, args: [{ imports: [CommonModule], declarations: [ColorDirective], exports: [ColorDirective], }] }] }); class GhostDirective { constructor(_elementRef) { this._elementRef = _elementRef; } set ptclGhost(value) { if (value) { this._elementRef.nativeElement.classList.add('ptcl-ghost'); } else { this._elementRef.nativeElement.classList.remove('ptcl-ghost'); } } } GhostDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: GhostDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); GhostDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: GhostDirective, selector: "[ptclGhost]", inputs: { ptclGhost: "ptclGhost" }, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: GhostDirective, decorators: [{ type: Directive, args: [{ selector: '[ptclGhost]', }] }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ptclGhost: [{ type: Input }] } }); class GhostDirectiveModule { } GhostDirectiveModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: GhostDirectiveModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); GhostDirectiveModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: GhostDirectiveModule, declarations: [GhostDirective], imports: [CommonModule], exports: [GhostDirective] }); GhostDirectiveModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: GhostDirectiveModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: GhostDirectiveModule, decorators: [{ type: NgModule, args: [{ imports: [CommonModule], declarations: [GhostDirective], exports: [GhostDirective], }] }] }); class IconDirective { constructor(_elementRef) { this._elementRef = _elementRef; this.defaultIcon = ''; this._icon = this.defaultIcon; this._elementRef.nativeElement.classList.add('fa-solid'); } set ptclIcon(value) { const icon = value || this.defaultIcon; if (icon !== this._icon) { if (this._icon) { this._elementRef.nativeElement.classList.remove(`fa-${this._icon}`); } if (icon) { this._elementRef.nativeElement.classList.add(`fa-${icon}`); } this._icon = icon; } } } IconDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: IconDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); IconDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: IconDirective, selector: "[ptclIcon]", inputs: { ptclIcon: "ptclIcon" }, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: IconDirective, decorators: [{ type: Directive, args: [{ selector: '[ptclIcon]', }] }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ptclIcon: [{ type: Input }] } }); class IconDirectiveModule { } IconDirectiveModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: IconDirectiveModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); IconDirectiveModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: IconDirectiveModule, declarations: [IconDirective], imports: [CommonModule], exports: [IconDirective] }); IconDirectiveModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: IconDirectiveModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: IconDirectiveModule, decorators: [{ type: NgModule, args: [{ imports: [CommonModule], declarations: [IconDirective], exports: [IconDirective], }] }] }); class RippleDirective { constructor(_elementRef) { this._elementRef = _elementRef; this.enabled = false; } set ptclRipple(enabled) { this.enabled = enabled !== null && enabled !== '' && `${enabled}` === 'true'; this.updateClass(); } ngOnInit() { this.updateClass(); } updateClass() { if (!this.enabled) { this._elementRef.nativeElement.classList.remove('ptcl-ripple'); } else { this._elementRef.nativeElement.classList.add('ptcl-ripple'); } } } RippleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: RippleDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); RippleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: RippleDirective, selector: "[ptclRipple]", inputs: { ptclRipple: "ptclRipple" }, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: RippleDirective, decorators: [{ type: Directive, args: [{ selector: '[ptclRipple]', }] }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ptclRipple: [{ type: Input }] } }); class RippleDirectiveModule { } RippleDirectiveModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: RippleDirectiveModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); RippleDirectiveModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: RippleDirectiveModule, declarations: [RippleDirective], imports: [CommonModule], exports: [RippleDirective] }); RippleDirectiveModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: RippleDirectiveModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: RippleDirectiveModule, decorators: [{ type: NgModule, args: [{ imports: [CommonModule], declarations: [RippleDirective], exports: [RippleDirective], }] }] }); class SizeDirective { constructor(_elementRef) { this._elementRef = _elementRef; this.defaultSize = ''; this._size = this.defaultSize; } set ptclSize(value) { const size = value || this.defaultSize; if (size !== this._size) { if (this._size) { this._elementRef.nativeElement.classList.remove(`ptcl-${this._size}`); } if (size) { this._elementRef.nativeElement.classList.add(`ptcl-${size}`); } this._size = size; } } } SizeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SizeDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); SizeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: SizeDirective, selector: "[ptclSize]", inputs: { ptclSize: "ptclSize" }, ngImport: i0 }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SizeDirective, decorators: [{ type: Directive, args: [{ selector: '[ptclSize]', }] }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ptclSize: [{ type: Input }] } }); class SizeDirectiveModule { } SizeDirectiveModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SizeDirectiveModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); SizeDirectiveModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: SizeDirectiveModule, declarations: [SizeDirective], imports: [CommonModule], exports: [SizeDirective] }); SizeDirectiveModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SizeDirectiveModule, imports: [CommonModule] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SizeDirectiveModule, decorators: [{ type: NgModule, args: [{ imports: [CommonModule], declarations: [SizeDirective], exports: [SizeDirective], }] }] }); const ButtonMixins = PositionMixin(LoadingMixin(BaseButtonMixin(BaseAtom))); class ButtonComponent extends ButtonMixins { constructor() { super(); } ngAfterViewInit() { this.right = !this.left ?? true; } } ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", t