UNPKG

@doku-dev/doku-fragment

Version:

A new Angular UI library that moving away from Bootstrap and built from scratch.

105 lines 11.6 kB
import { CommonModule } from '@angular/common'; import { ChangeDetectionStrategy, Component, HostBinding, InjectionToken, Input, ViewEncapsulation, forwardRef, } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { DokuButton } from '../button'; import * as i0 from "@angular/core"; export const DOKU_PILL_GROUP = new InjectionToken('DokuPillGroup'); const DOKU_PILL_GROUP_VALUE_ACCESSOR = { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => DokuPillGroup), multi: true, }; export class DokuPillGroup { constructor() { this._modelValue = new Set(); /** * Whether applying the default styles of the pill group. */ this.isAttached = true; this._multiple = false; } get class() { return { 'd-pill-group-attached': this.isAttached, }; } /** * Whether multiple button toggles can be selected. * * @param value boolean | truthy and falsy string */ set multiple(value) { this._multiple = !!(value !== false); } get multiple() { return this._multiple; } /** * Value of toggle group. * Returns array in multiple-selection mode or single value in single-selection mode. */ get value() { const valArray = Array.from(this._modelValue); if (this.multiple) return valArray; return valArray.length ? valArray[0] : ''; } set value(newValue) { const valueArr = typeof newValue === 'string' ? [newValue] : newValue; this._modelValue = new Set(valueArr); } /** * * @param itemValue * @returns */ isChecked(itemValue) { return this._modelValue.has(itemValue); } /** * Syncs a pill button checked state with the model value. */ syncValue(itemValue) { if (!this.multiple) { this._modelValue.clear(); } if (this.isChecked(itemValue)) { this._modelValue.delete(itemValue); } else { this._modelValue.add(itemValue); } this._onChange?.(this.value); } writeValue(value) { this.value = value; } registerOnChange(fn) { this._onChange = fn; } registerOnTouched(fn) { this._onTouched = fn; } } DokuPillGroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DokuPillGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); DokuPillGroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DokuPillGroup, isStandalone: true, selector: "doku-pill-group", inputs: { isAttached: "isAttached", multiple: "multiple", value: "value" }, host: { properties: { "class": "this.class" } }, providers: [ DOKU_PILL_GROUP_VALUE_ACCESSOR, { provide: DOKU_PILL_GROUP, useExisting: DokuPillGroup }, ], exportAs: ["dokuPillGroup"], ngImport: i0, template: "<ng-content></ng-content>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DokuPillGroup, decorators: [{ type: Component, args: [{ selector: 'doku-pill-group', exportAs: 'dokuPillGroup', standalone: true, imports: [CommonModule, DokuButton], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [ DOKU_PILL_GROUP_VALUE_ACCESSOR, { provide: DOKU_PILL_GROUP, useExisting: DokuPillGroup }, ], template: "<ng-content></ng-content>\n" }] }], propDecorators: { class: [{ type: HostBinding, args: ['class'] }], isAttached: [{ type: Input }], multiple: [{ type: Input }], value: [{ type: Input }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGlsbC1ncm91cC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kb2t1LWZyYWdtZW50L3NyYy9saWIvcGlsbC9waWxsLWdyb3VwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2Rva3UtZnJhZ21lbnQvc3JjL2xpYi9waWxsL3BpbGwtZ3JvdXAuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFdBQVcsRUFDWCxjQUFjLEVBQ2QsS0FBSyxFQUNMLGlCQUFpQixFQUNqQixVQUFVLEdBQ1gsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ3pFLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxXQUFXLENBQUM7O0FBRXZDLE1BQU0sQ0FBQyxNQUFNLGVBQWUsR0FBRyxJQUFJLGNBQWMsQ0FBZ0IsZUFBZSxDQUFDLENBQUM7QUFFbEYsTUFBTSw4QkFBOEIsR0FBRztJQUNyQyxPQUFPLEVBQUUsaUJBQWlCO0lBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsYUFBYSxDQUFDO0lBQzVDLEtBQUssRUFBRSxJQUFJO0NBQ1osQ0FBQztBQWNGLE1BQU0sT0FBTyxhQUFhO0lBYjFCO1FBY1UsZ0JBQVcsR0FBRyxJQUFJLEdBQUcsRUFBVSxDQUFDO1FBU3hDOztXQUVHO1FBQ00sZUFBVSxHQUFHLElBQUksQ0FBQztRQWNuQixjQUFTLEdBQUcsS0FBSyxDQUFDO0tBNEQzQjtJQXBGQyxJQUNjLEtBQUs7UUFDakIsT0FBTztZQUNMLHVCQUF1QixFQUFFLElBQUksQ0FBQyxVQUFVO1NBQ3pDLENBQUM7SUFDSixDQUFDO0lBT0Q7Ozs7T0FJRztJQUNILElBQ0ksUUFBUSxDQUFDLEtBQXVCO1FBQ2xDLElBQUksQ0FBQyxTQUFTLEdBQUcsQ0FBQyxDQUFDLENBQUMsS0FBSyxLQUFLLEtBQUssQ0FBQyxDQUFDO0lBQ3ZDLENBQUM7SUFDRCxJQUFJLFFBQVE7UUFDVixPQUFPLElBQUksQ0FBQyxTQUFTLENBQUM7SUFDeEIsQ0FBQztJQUdEOzs7T0FHRztJQUNILElBQ0ksS0FBSztRQUNQLE1BQU0sUUFBUSxHQUFHLEtBQUssQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBRTlDLElBQUksSUFBSSxDQUFDLFFBQVE7WUFBRSxPQUFPLFFBQVEsQ0FBQztRQUVuQyxPQUFPLFFBQVEsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO0lBQzVDLENBQUM7SUFDRCxJQUFJLEtBQUssQ0FBQyxRQUF1QztRQUMvQyxNQUFNLFFBQVEsR0FBRyxPQUFPLFFBQVEsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQztRQUV0RSxJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksR0FBRyxDQUFDLFFBQVEsQ0FBQyxDQUFDO0lBQ3ZDLENBQUM7SUFFRDs7OztPQUlHO0lBQ0gsU0FBUyxDQUFDLFNBQWlCO1FBQ3pCLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQyxHQUFHLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDekMsQ0FBQztJQUVEOztPQUVHO0lBQ0gsU0FBUyxDQUFDLFNBQWlCO1FBQ3pCLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFO1lBQ2xCLElBQUksQ0FBQyxXQUFXLENBQUMsS0FBSyxFQUFFLENBQUM7U0FDMUI7UUFFRCxJQUFJLElBQUksQ0FBQyxTQUFTLENBQUMsU0FBUyxDQUFDLEVBQUU7WUFDN0IsSUFBSSxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsU0FBUyxDQUFDLENBQUM7U0FDcEM7YUFBTTtZQUNMLElBQUksQ0FBQyxXQUFXLENBQUMsR0FBRyxDQUFDLFNBQVMsQ0FBQyxDQUFDO1NBQ2pDO1FBRUQsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUMvQixDQUFDO0lBS0QsVUFBVSxDQUFDLEtBQXdCO1FBQ2pDLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO0lBQ3JCLENBQUM7SUFFRCxnQkFBZ0IsQ0FBQyxFQUE0QjtRQUMzQyxJQUFJLENBQUMsU0FBUyxHQUFHLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRUQsaUJBQWlCLENBQUMsRUFBYztRQUM5QixJQUFJLENBQUMsVUFBVSxHQUFHLEVBQUUsQ0FBQztJQUN2QixDQUFDOzswR0F0RlUsYUFBYTs4RkFBYixhQUFhLDJMQUxiO1FBQ1QsOEJBQThCO1FBQzlCLEVBQUUsT0FBTyxFQUFFLGVBQWUsRUFBRSxXQUFXLEVBQUUsYUFBYSxFQUFFO0tBQ3pELHVEQy9CSCw2QkFDQSwyQ0R1QlksWUFBWTsyRkFTWCxhQUFhO2tCQWJ6QixTQUFTOytCQUNFLGlCQUFpQixZQUNqQixlQUFlLGNBQ2IsSUFBSSxXQUNQLENBQUMsWUFBWSxFQUFFLFVBQVUsQ0FBQyxpQkFFcEIsaUJBQWlCLENBQUMsSUFBSSxtQkFDcEIsdUJBQXVCLENBQUMsTUFBTSxhQUNwQzt3QkFDVCw4QkFBOEI7d0JBQzlCLEVBQUUsT0FBTyxFQUFFLGVBQWUsRUFBRSxXQUFXLGVBQWUsRUFBRTtxQkFDekQ7OEJBTWEsS0FBSztzQkFEbEIsV0FBVzt1QkFBQyxPQUFPO2dCQVVYLFVBQVU7c0JBQWxCLEtBQUs7Z0JBUUYsUUFBUTtzQkFEWCxLQUFLO2dCQWNGLEtBQUs7c0JBRFIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBIb3N0QmluZGluZyxcbiAgSW5qZWN0aW9uVG9rZW4sXG4gIElucHV0LFxuICBWaWV3RW5jYXBzdWxhdGlvbixcbiAgZm9yd2FyZFJlZixcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb250cm9sVmFsdWVBY2Nlc3NvciwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBEb2t1QnV0dG9uIH0gZnJvbSAnLi4vYnV0dG9uJztcblxuZXhwb3J0IGNvbnN0IERPS1VfUElMTF9HUk9VUCA9IG5ldyBJbmplY3Rpb25Ub2tlbjxEb2t1UGlsbEdyb3VwPignRG9rdVBpbGxHcm91cCcpO1xuXG5jb25zdCBET0tVX1BJTExfR1JPVVBfVkFMVUVfQUNDRVNTT1IgPSB7XG4gIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBEb2t1UGlsbEdyb3VwKSxcbiAgbXVsdGk6IHRydWUsXG59O1xuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZG9rdS1waWxsLWdyb3VwJyxcbiAgZXhwb3J0QXM6ICdkb2t1UGlsbEdyb3VwJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgRG9rdUJ1dHRvbl0sXG4gIHRlbXBsYXRlVXJsOiAnLi9waWxsLWdyb3VwLmNvbXBvbmVudC5odG1sJyxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHByb3ZpZGVyczogW1xuICAgIERPS1VfUElMTF9HUk9VUF9WQUxVRV9BQ0NFU1NPUixcbiAgICB7IHByb3ZpZGU6IERPS1VfUElMTF9HUk9VUCwgdXNlRXhpc3Rpbmc6IERva3VQaWxsR3JvdXAgfSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgRG9rdVBpbGxHcm91cCBpbXBsZW1lbnRzIENvbnRyb2xWYWx1ZUFjY2Vzc29yIHtcbiAgcHJpdmF0ZSBfbW9kZWxWYWx1ZSA9IG5ldyBTZXQ8c3RyaW5nPigpO1xuXG4gIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICBwcm90ZWN0ZWQgZ2V0IGNsYXNzKCkge1xuICAgIHJldHVybiB7XG4gICAgICAnZC1waWxsLWdyb3VwLWF0dGFjaGVkJzogdGhpcy5pc0F0dGFjaGVkLFxuICAgIH07XG4gIH1cblxuICAvKipcbiAgICogV2hldGhlciBhcHBseWluZyB0aGUgZGVmYXVsdCBzdHlsZXMgb2YgdGhlIHBpbGwgZ3JvdXAuXG4gICAqL1xuICBASW5wdXQoKSBpc0F0dGFjaGVkID0gdHJ1ZTtcblxuICAvKipcbiAgICogV2hldGhlciBtdWx0aXBsZSBidXR0b24gdG9nZ2xlcyBjYW4gYmUgc2VsZWN0ZWQuXG4gICAqXG4gICAqIEBwYXJhbSB2YWx1ZSBib29sZWFuIHwgdHJ1dGh5IGFuZCBmYWxzeSBzdHJpbmdcbiAgICovXG4gIEBJbnB1dCgpXG4gIHNldCBtdWx0aXBsZSh2YWx1ZTogYm9vbGVhbiB8IHN0cmluZykge1xuICAgIHRoaXMuX211bHRpcGxlID0gISEodmFsdWUgIT09IGZhbHNlKTtcbiAgfVxuICBnZXQgbXVsdGlwbGUoKSB7XG4gICAgcmV0dXJuIHRoaXMuX211bHRpcGxlO1xuICB9XG4gIHByaXZhdGUgX211bHRpcGxlID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIFZhbHVlIG9mIHRvZ2dsZSBncm91cC5cbiAgICogUmV0dXJucyBhcnJheSBpbiBtdWx0aXBsZS1zZWxlY3Rpb24gbW9kZSBvciBzaW5nbGUgdmFsdWUgaW4gc2luZ2xlLXNlbGVjdGlvbiBtb2RlLlxuICAgKi9cbiAgQElucHV0KClcbiAgZ2V0IHZhbHVlKCk6IHN0cmluZyB8IHN0cmluZ1tdIHwgdW5kZWZpbmVkIHtcbiAgICBjb25zdCB2YWxBcnJheSA9IEFycmF5LmZyb20odGhpcy5fbW9kZWxWYWx1ZSk7XG5cbiAgICBpZiAodGhpcy5tdWx0aXBsZSkgcmV0dXJuIHZhbEFycmF5O1xuXG4gICAgcmV0dXJuIHZhbEFycmF5Lmxlbmd0aCA/IHZhbEFycmF5WzBdIDogJyc7XG4gIH1cbiAgc2V0IHZhbHVlKG5ld1ZhbHVlOiBzdHJpbmcgfCBzdHJpbmdbXSB8IHVuZGVmaW5lZCkge1xuICAgIGNvbnN0IHZhbHVlQXJyID0gdHlwZW9mIG5ld1ZhbHVlID09PSAnc3RyaW5nJyA/IFtuZXdWYWx1ZV0gOiBuZXdWYWx1ZTtcblxuICAgIHRoaXMuX21vZGVsVmFsdWUgPSBuZXcgU2V0KHZhbHVlQXJyKTtcbiAgfVxuXG4gIC8qKlxuICAgKlxuICAgKiBAcGFyYW0gaXRlbVZhbHVlXG4gICAqIEByZXR1cm5zXG4gICAqL1xuICBpc0NoZWNrZWQoaXRlbVZhbHVlOiBzdHJpbmcpIHtcbiAgICByZXR1cm4gdGhpcy5fbW9kZWxWYWx1ZS5oYXMoaXRlbVZhbHVlKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBTeW5jcyBhIHBpbGwgYnV0dG9uIGNoZWNrZWQgc3RhdGUgd2l0aCB0aGUgbW9kZWwgdmFsdWUuXG4gICAqL1xuICBzeW5jVmFsdWUoaXRlbVZhbHVlOiBzdHJpbmcpIHtcbiAgICBpZiAoIXRoaXMubXVsdGlwbGUpIHtcbiAgICAgIHRoaXMuX21vZGVsVmFsdWUuY2xlYXIoKTtcbiAgICB9XG5cbiAgICBpZiAodGhpcy5pc0NoZWNrZWQoaXRlbVZhbHVlKSkge1xuICAgICAgdGhpcy5fbW9kZWxWYWx1ZS5kZWxldGUoaXRlbVZhbHVlKTtcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy5fbW9kZWxWYWx1ZS5hZGQoaXRlbVZhbHVlKTtcbiAgICB9XG5cbiAgICB0aGlzLl9vbkNoYW5nZT8uKHRoaXMudmFsdWUpO1xuICB9XG5cbiAgX29uQ2hhbmdlPzogKHZhbHVlOiB1bmtub3duKSA9PiB2b2lkO1xuICBfb25Ub3VjaGVkPzogKCkgPT4gdm9pZDtcblxuICB3cml0ZVZhbHVlKHZhbHVlOiBzdHJpbmcgfCBzdHJpbmdbXSk6IHZvaWQge1xuICAgIHRoaXMudmFsdWUgPSB2YWx1ZTtcbiAgfVxuXG4gIHJlZ2lzdGVyT25DaGFuZ2UoZm46ICh2YWx1ZTogdW5rbm93bikgPT4gdm9pZCk6IHZvaWQge1xuICAgIHRoaXMuX29uQ2hhbmdlID0gZm47XG4gIH1cblxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogKCkgPT4gdm9pZCk6IHZvaWQge1xuICAgIHRoaXMuX29uVG91Y2hlZCA9IGZuO1xuICB9XG59XG4iLCI8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4iXX0=