@obliczeniowo/elementary
Version:
Library made in Angular version 20
678 lines • 52.5 kB
JavaScript
import * as i2 from '@obliczeniowo/elementary/text-pipes';
import { TextPipesModule } from '@obliczeniowo/elementary/text-pipes';
import * as i0 from '@angular/core';
import { Input, Component, input, EventEmitter, Output, HostBinding, NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
class AbstractCombineAdapter {
adapterConnector;
constructor(adapterConnector) {
if (adapterConnector) {
this.adapterConnector = adapterConnector;
}
}
setAdapterConnector(adapterConnector) {
this.adapterConnector = adapterConnector;
}
toTag(index1, index2, reversed) {
if (index1 === -1 || index2 === -1) {
throw new Error('index incorrect');
}
return reversed ? `${Math.max(index1, index2)}-${Math.min(index1, index2)}` : `${Math.min(index1, index2)}-${Math.max(index1, index2)}`;
}
}
class CombineNameAndIndexAdapter extends AbstractCombineAdapter {
findIndex(data) {
return this.adapterConnector.categories.findIndex(c => c.name === data.name);
}
fromIndex(index) {
if (index === -1) {
throw new Error('index incorrect');
}
return { ...this.adapterConnector.categories[index], id: index + 1 };
}
convert() {
return this.adapterConnector.selected.map(tag => {
const splitted = tag.split('-');
return [
this.fromIndex(+splitted[0] - 1),
this.fromIndex(+splitted[1] - 1)
];
});
}
transform(data, reversed) {
return data.map(categories => (this.toTag((categories[0].id ?? this.findIndex(categories[0]) + 1), (categories[1].id ?? this.findIndex(categories[1]) + 1), reversed)));
}
}
class CombineNameAdapter extends AbstractCombineAdapter {
findIndex(data) {
return this.adapterConnector.categories.findIndex(c => c.name === data.name);
}
fromIndex(index) {
if (index === -1) {
throw new Error('index incorrect');
}
return this.adapterConnector.categories[index];
}
convert() {
return this.adapterConnector.selected.map(tag => {
const splitted = tag.split('-');
return [
this.fromIndex(+splitted[0] - 1),
this.fromIndex(+splitted[1] - 1)
];
});
}
transform(data, reversed) {
return data.map(categories => (this.toTag(this.findIndex(categories[0]) + 1, this.findIndex(categories[1]) + 1, reversed)));
}
}
class SingleCombinationComponent {
categories;
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SingleCombinationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.4", type: SingleCombinationComponent, isStandalone: false, selector: "obl-single-combination", inputs: { categories: "categories" }, ngImport: i0, template: "<div>\n <div [class]=\"'left ' + categories[0].class\">\n {{ categories[0].name }}\n </div>\n <div [class]=\"'right ' + categories[1].class\">\n {{ categories[1].name }}\n </div>\n</div>\n", styles: [":host>div{display:flex;flex-wrap:nowrap;margin:5px}:host>div>div{padding:5px 15px;color:#fff}:host>div .left{border-top-left-radius:15px;border-bottom-left-radius:15px;background-color:#c7c7c7}:host>div .right{border-top-right-radius:15px;border-bottom-right-radius:15px;background-color:gray}\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: SingleCombinationComponent, decorators: [{
type: Component,
args: [{ selector: 'obl-single-combination', standalone: false, template: "<div>\n <div [class]=\"'left ' + categories[0].class\">\n {{ categories[0].name }}\n </div>\n <div [class]=\"'right ' + categories[1].class\">\n {{ categories[1].name }}\n </div>\n</div>\n", styles: [":host>div{display:flex;flex-wrap:nowrap;margin:5px}:host>div>div{padding:5px 15px;color:#fff}:host>div .left{border-top-left-radius:15px;border-bottom-left-radius:15px;background-color:#c7c7c7}:host>div .right{border-top-right-radius:15px;border-bottom-right-radius:15px;background-color:gray}\n"] }]
}], propDecorators: { categories: [{
type: Input
}] } });
class CombineCategoriesComponent {
/**
* Selected list in format of string containing id's combination: ['1-2', '1-3'] values should not repeat
*
* Used to modify selection by adapter field object
*
* Rather not modify from outside but you can do that too
*/
selected = [];
/**
* If set display the obl-single-category components, depends on the displaySingle input field
*/
single = [];
suffix = `-obl-${Math.floor(Math.random() * 1000000)}`;
touched = false;
disableParts = [];
/**
* Adapt model input/output to your needs.
*
* Default: CombineNameAdapter is used
*
* There exists another ones:
*
* CombineIdAdapter - accept input/output format: [[1, 2], [1, 3]] <- select / emit categories by
* pair of id's. Id's are number from 1 - 6 (step 1 of course)
*/
adapter = input(new CombineNameAdapter(this));
/**
* Set selected categories
*/
value = [];
/**
* Disable whole things
*/
disabled = false;
/**
* Disable specific combination of categories (format depends on type of adapter used inside)
*
* When the adapter field is instance of CombineNameAdapter then to disable "Category 1" i "Category 2":
*
* @example
*
* <obl-combine-categories [value]="selected" (valueChanged)="changed($event)"
* [disable]="[[{ name: 'Category 1' }, { name: 'Category 2' }]]"></obl-combine-categories>
*/
disable = [];
/**
* Let you display a obl-single-category components that represents single combination with names of
* categories displayed inside.
*/
displaySingle = input(false);
/**
* Emit when value changed
*/
valueChange = new EventEmitter();
headers = [
{
transform: 'translate(0.92604457,-0.92629337)',
href: '#text-path-' + this.suffix
},
{
transform: 'rotate(60,53.230425,244.80418)',
href: '#text-path-' + this.suffix
},
{
transform: 'rotate(120,53.230425,244.80418)',
href: '#text-path-' + this.suffix
},
{
transform: 'rotate(180,53.230425,244.80418)',
href: '#text-path-' + this.suffix
},
{
transform: 'rotate(-60,52.160837,243.7349)',
href: '#text-path-top-' + this.suffix
},
{
transform: 'translate(0.92604457,-0.92629337)',
href: '#text-path-top-' + this.suffix
}
];
combine = [
[1, 2, {
x1: 88.953682,
y1: 167.21274,
x2: 106.51595,
y2: 131.14131,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[1, 3, {
x1: 72.372162,
y1: 177.26645,
x2: 231.58354,
y2: 78.695023,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[1, 4, {
x1: 18.104263,
y1: 246.04858,
x2: 86.896088,
y2: 246.04858,
transform: 'translate(0.92604457,-0.92629337)'
}],
[1, 5, {
x1: 231.58354,
y1: 78.695023,
x2: 72.372162,
y2: 177.26645,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[1, 6, {
x1: 106.51595,
y1: 131.14131,
x2: 88.953682,
y2: 167.21274,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[2, 3, {
x1: 88.953682,
y1: 167.21274,
x2: 106.51595,
y2: 131.14131,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[2, 4, {
x1: 72.372162,
y1: 177.26645,
x2: 231.58354,
y2: 78.695023,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[2, 5, {
x1: 18.104263,
y1: 246.04858,
x2: 86.896088,
y2: 246.04858,
transform: 'translate(0.92604457,-0.92629337)'
}],
[2, 6, {
x1: 231.58354,
y1: 78.695023,
x2: 72.372162,
y2: 177.26645,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[3, 4, {
x1: 88.953682,
y1: 167.21274,
x2: 106.51595,
y2: 131.14131,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[3, 5, {
x1: 72.372162,
y1: 177.26645,
x2: 231.58354,
y2: 78.695023,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[3, 6, {
x1: 18.104263,
y1: 246.04858,
x2: 86.896088,
y2: 246.04858,
transform: 'translate(0.92604457,-0.92629337)'
}],
[4, 5, {
x1: 88.953682,
y1: 167.21274,
x2: 106.51595,
y2: 131.14131,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[4, 6, {
x1: 166.3591,
y1: 328.33005,
x2: 323.24637,
y2: 236.90147,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
[5, 6, {
x1: 88.953682,
y1: 167.21274,
x2: 106.51595,
y2: 131.14131,
transform: 'matrix(0.26458333,0,0,0.26458333,0.92604457,190.24036)'
}],
];
categories = [
{ name: 'Category 1' },
{ name: 'Category 2' },
{ name: 'Category 3' },
{ name: 'Category 4' },
{ name: 'Category 5' },
{ name: 'Category 6' }
];
onChange = (value) => { };
onTouched = () => { };
ngOnChanges(changes) {
if (changes.value && changes.value.currentValue?.length !== changes.value.previousValue?.length) {
this.adapter().setAdapterConnector(this);
this.selected = this.adapter().transform(changes.value.currentValue);
this.set();
}
if (changes.disable && changes.disable.currentValue instanceof Array) {
this.adapter().setAdapterConnector(this);
this.disableParts = this.adapter().transform(changes.disable.currentValue);
}
}
validate(control) {
return null;
}
writeValue(categories) {
this.adapter().setAdapterConnector(this);
this.selected = this.adapter().transform(categories);
this.toSingleCombination();
}
registerOnChange(onChange) {
this.onChange = onChange;
}
registerOnTouched(onTouched) {
this.onTouched = onTouched;
}
setDisabledState(disabled) {
this.disabled = disabled;
}
markAsTouched() {
if (this.disabled) {
return;
}
if (!this.touched) {
this.onTouched();
this.touched = true;
}
}
click(category) {
if (this.disabled) {
return;
}
const tag = this.adapter().toTag(category[0], category[1]);
if (this.disableParts.includes(tag)) {
return;
}
if (this.selected.includes(tag)) {
this.selected = this.selected.filter(v => v !== tag);
}
else {
this.selected.push(tag);
}
this.set();
}
toggleAll(category) {
if (this.disabled) {
return;
}
const cat = `${category}`;
if (this.selected.filter(v => v.includes(cat)).concat(this.disableParts.filter(i => i.includes(cat) && !this.selected.includes(i)))?.length >= 5) {
this.selected = this.selected.filter(v => !v.includes(cat) || this.disableParts.includes(v));
}
else {
for (let i = 1; i < 7; i++) {
if (i !== category && !this.disableParts.includes(this.adapter().toTag(i, category))) {
const id = this.adapter().toTag(category, i);
if (!this.selected.find(v => id === v)) {
this.selected.push(id);
}
}
}
}
this.set();
}
connectionFill(category) {
if (this.disabled) {
return 'gray';
}
return 'url(#lg-category-' + category[0] + '-' + category[1] + this.suffix + ')';
}
toSingleCombination() {
const adapter = new CombineNameAndIndexAdapter(this);
this.single = adapter.convert().map(v => [
{ ...v[0], class: 'category-' + v[0].id },
{ ...v[1], class: 'category-' + v[1].id }
]);
}
set(withEmit = true) {
this.adapter().setAdapterConnector(this);
const categories = this.adapter().convert();
this.markAsTouched();
this.onChange(categories);
if (withEmit) {
this.valueChange.emit(categories);
}
this.toSingleCombination();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: CombineCategoriesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: CombineCategoriesComponent, isStandalone: false, selector: "obl-combine-categories", inputs: { adapter: { classPropertyName: "adapter", publicName: "adapter", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: false, isRequired: false, transformFunction: null }, displaySingle: { classPropertyName: "displaySingle", publicName: "displaySingle", isSignal: true, isRequired: false, transformFunction: null }, categories: { classPropertyName: "categories", publicName: "categories", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.disabled": "this.disabled" } }, providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: CombineCategoriesComponent
},
{
provide: NG_VALIDATORS,
multi: true,
useExisting: CombineCategoriesComponent
}
], usesOnChanges: true, ngImport: i0, template: "<svg width=\"100%\" viewBox=\"0 0 97.102081 97.102089\">\n @for(c of combine; track $index) {\n <linearGradient\n [id]=\"'lg-category-' + c[0] + '-' + c[1] + suffix\"\n [attr.x1]=\"c[2].x1\"\n [attr.x2]=\"c[2].x2\"\n [attr.y1]=\"c[2].y1\"\n [attr.y2]=\"c[2].y2\"\n gradientUnits=\"userSpaceOnUse\"\n [attr.gradientTransform]=\"c[2].transform\"\n >\n <stop style=\"stop-opacity: 1\" offset=\"0\" [class]=\"'category-' + c[0]\" />\n <stop style=\"stop-opacity: 1\" offset=\"1\" [class]=\"'category-' + c[1]\" />\n </linearGradient>\n }\n\n <g transform=\"translate(-4.7743858,-195.52248)\" style=\"display: inline\">\n <g transform=\"translate(53.5, 244) scale(1.1) translate(-53.5, -244)\">\n @for (category of [\n [1, 2],\n [2, 3],\n [3, 4],\n [4, 5],\n [5, 6],\n [1, 6]\n ]; track $index) {\n <path\n [class]=\"'connector category-' + category[0] + '-' + category[1]\"\n [attr.fill]=\"connectionFill(category)\"\n style=\"fill-opacity: 1\"\n d=\"m 26.436632,222.81253 a 34.395836,34.395836 0 0 0 -5.754687,10.78022 c 11.994195,2.22393 17.151276,0.50052 5.754687,-10.78022 z\"\n [attr.transform]=\"\n 'rotate(' + 60 * $index + ', 53.5, 244) translate(0.2, -0.5)'\n \"\n [class.disabled]=\"\n this.disableParts.includes(category[0] + '-' + category[1])\n \"\n [class.selected]=\"selected.includes(category[0] + '-' + category[1])\"\n (click)=\"click(category)\"\n />\n }\n\n @for (category of [\n [1, 3],\n [2, 4],\n [3, 5],\n [4, 6],\n [1, 5],\n [2, 6]\n ]; track $index) {\n <path\n style=\"fill-opacity: 1\"\n [attr.fill]=\"connectionFill(category)\"\n d=\"m 59.834592,210.2996 c -7.94e-4,0.004 -0.0019,0.009 -0.0026,0.0129 -0.04899,0.24617 -0.100481,0.49002 -0.152445,0.73277 -0.01169,0.0546 -0.02278,0.10988 -0.03462,0.16433 -0.05511,0.2534 -0.112152,0.50432 -0.170532,0.75396 -0.0066,0.0284 -0.01294,0.0574 -0.01963,0.0858 -0.0013,0.006 -0.0028,0.0114 -0.0041,0.0171 -0.06045,0.25597 -0.12316,0.50919 -0.187068,0.76119 -0.0062,0.0246 -0.0118,0.0498 -0.0181,0.0744 -0.0016,0.007 -0.0035,0.0135 -0.0052,0.0202 -0.05959,0.23295 -0.121401,0.46345 -0.183967,0.69298 -0.01519,0.0557 -0.03011,0.1119 -0.04548,0.16743 -0.05412,0.19558 -0.110088,0.38932 -0.166396,0.58239 -0.02689,0.0922 -0.05323,0.18485 -0.08062,0.27647 -0.05437,0.1819 -0.110575,0.36193 -0.166915,0.54157 -0.02719,0.0867 -0.054,0.17377 -0.08165,0.25993 -2.580137,8.36713 -8.206653,15.06324 -16.512172,18.09761 -0.240858,0.0863 -0.484521,0.16982 -0.730186,0.25063 -7.94e-4,2.6e-4 -0.0016,7.9e-4 -0.0026,0.001 -1.56e-4,5e-5 -2.65e-4,-5e-5 -5.29e-4,0 -0.245248,0.0806 -0.493057,0.15845 -0.743107,0.23357 -0.0013,2.7e-4 -0.0024,8e-4 -0.0036,10e-4 -2.65e-4,1.1e-4 -7.94e-4,5.3e-4 -0.0011,5.3e-4 -0.251145,0.0754 -0.504677,0.14773 -0.760677,0.21756 -0.256413,0.0699 -0.515398,0.13721 -0.776697,0.20154 -5.400712,1.31054 -11.036022,1.30905 -16.51062,0.70021 -0.01648,-0.002 -0.03312,-0.004 -0.04961,-0.006 -0.691545,-0.0776 -1.392815,-0.16668 -2.104264,-0.26716 -0.45672,1.63712 -0.791467,3.30585 -1.001489,4.99246 0.0014,1.6e-4 0.0027,2.6e-4 0.0041,5.3e-4 0.37656,0.0443 0.751182,0.0856 1.123446,0.12402 0.373636,0.0385 0.744834,0.0739 1.114144,0.10646 0.361867,0.0319 0.721805,0.0612 1.07952,0.0873 6.491773,0.4673 13.118141,0.0715 19.308899,-1.97714 0.03736,-0.0124 0.07434,-0.0252 0.111622,-0.0377 0.245798,-0.0823 0.490318,-0.16625 0.732772,-0.25321 0.0034,-0.001 0.0069,-0.002 0.01035,-0.004 0.01236,-0.004 0.02434,-0.01 0.03669,-0.0139 11.011844,-4.56436 17.14609,-11.46337 21.298958,-22.07927 0.01601,-0.041 0.0316,-0.0824 0.04754,-0.12351 0.100695,-0.25951 0.20042,-0.52087 0.298175,-0.78444 0.02739,-0.0739 0.05397,-0.14855 0.08113,-0.22273 0.09396,-0.25659 0.186822,-0.51422 0.278019,-0.77463 0.01275,-0.0364 0.02556,-0.0731 0.03824,-0.10955 0.102087,-0.29335 0.202676,-0.5886 0.301273,-0.88677 0.0013,-0.004 0.0024,-0.007 0.0036,-0.0109 0.0034,-0.0102 0.0064,-0.0208 0.0098,-0.031 0.104598,-0.31707 0.207849,-0.6366 0.308509,-0.95912 2.65e-4,-0.001 5.3e-4,-0.002 0.0011,-0.004 -1.840982,-0.69934 -3.738623,-1.23927 -5.672005,-1.61386 z\"\n [class]=\"'connector category-' + category[0] + '-' + category[1]\"\n [attr.transform]=\"\n 'rotate(' + 60 * $index + ', 53.5, 244) translate(0.1, -0.6)'\n \"\n [class.disabled]=\"\n this.disableParts.includes(category[0] + '-' + category[1])\n \"\n [class.selected]=\"selected.includes(category[0] + '-' + category[1])\"\n (click)=\"click(category)\"\n />\n }\n\n @for (category of [\n [1, 4],\n [2, 5],\n [3, 6]\n ]; track $index) {\n <path\n [class]=\"'connector category-' + category[0] + '-' + category[1]\"\n style=\"fill-opacity: 1\"\n [attr.fill]=\"connectionFill(category)\"\n d=\"m 87.609643,240.60059 c -22.649095,3.2223 -45.753999,3.24643 -68.408745,0.0625 -0.305296,2.96791 -0.195822,5.97594 0.288355,8.9178 22.469383,-3.12806 45.374171,-3.10914 67.837719,0.0631 0.492718,-2.98301 0.674092,-6.03459 0.282671,-9.04338 z\"\n [attr.transform]=\"\n 'rotate(' + (60 * $index - 1) + ', 53.5, 244) translate(0, -1)'\n \"\n [class.disabled]=\"\n this.disableParts.includes(category[0] + '-' + category[1])\n \"\n [class.selected]=\"selected.includes(category[0] + '-' + category[1])\"\n (click)=\"click(category)\"\n />\n }\n </g>\n\n <path\n d=\"m 17.858991,265.00001 a 40,40 0 0 1 0,-39.99999\"\n [id]=\"'text-path-' + suffix\"\n style=\"fill: none; stroke: none\"\n />\n\n <path\n d=\"m 14.695555,266.75001 a 43.5,43.5 0 0 0 37.672109,21.75\"\n [id]=\"'text-path-top-' + suffix\"\n style=\"fill: none; stroke: none\"\n />\n\n @for (category of [1, 2, 3, 4, 5, 6]; track $index) {\n <g\n [class]=\"'header category-' + category\"\n (click)=\"toggleAll(category)\"\n >\n <path\n d=\"m 12.145515,220.26747 a 47.624999,47.624999 0 0 0 -6.4450846,23.80629 47.624999,47.624999 0 0 0 6.4032266,23.76755 l 9.986471,-5.76554 a 36.096725,36.096725 0 0 1 -4.861719,-18.00201 36.096725,36.096725 0 0 1 4.878255,-18.05522 z\"\n [attr.transform]=\"'rotate(' + 60 * (category - 1) + ', 53.5, 244)'\"\n />\n\n <text\n style=\"text-anchor: middle\"\n [attr.transform]=\"headers[category - 1].transform\"\n >\n <textPath\n startOffset=\"50%\"\n [attr.xlink:href]=\"headers[category - 1].href\"\n >\n {{ categories[category - 1].name | oblTextFormat: 'ellipsis':14 }}\n </textPath>\n </text>\n </g>\n }\n </g>\n</svg>\n\n@if (displaySingle() && single.length) {\n <div>\n @for (combination of single; track combination) {\n <obl-single-combination\n [categories]=\"combination\"\n ></obl-single-combination>\n }\n </div>\n}\n", styles: [":root{--obl-primary: #00afaf;--obl-secondary: #008caf;--default-border-color: gray;--default-focus-color: gray;--default-border-outline-color: #080808;--default-disabled-color: gray;--default-background-color: white;--default-hover-color: #eeeeee;--obl-default-error-color: red;--obl-dialog-background: #d3d3d3;--default-radio-color: black;--disabled-color: gray;--default-hex-button-border-color: #008caf;--default-hex-button-hover-border-color: #00afaf;--select-item-background-color: #e4e4e4;--select-item-text-color: #5a5a5a;--default-text-color: black;--obl-default-button-text-color: black;--obl-default-icon-color: black;--equalizer-background-bar-color: #575656;--equalizer-value-bar-color: #e6e6e6;--diagram-3d-background-color: black;--slider-value-container-color: gray;--slider-value-color: #d1d1d1;--slider-hover-value-color: white;--digit-fill-color: #cccccc;--digit-lighted-color: black;--horizontal-progress-bar-value-color: #504f4f;--horizontal-progress-bar-background-pattern-color: #dddddd;--horizontal-progress-bar-value-pattern-color: #b3b3b3;--horizontal-progress-bar-border-rect-color: #cccccc;--temperature-text-color: black;--temperature-path-stroke-color: black;--post-diagram-scale-line-color: #c8c8c8;--volume-channel-secondary-color: gray;--volume-channel-primary-color: #f2f2f2;--arch-progress-secondary-color: #eeeeee;--obl-linear-diagram-greed-color: gray;--obl-rating-selected-color: gold;--obl-rating-color: #cccccc}:host{display:flex;flex-direction:column}:host.disabled path.connector{fill:gray!important}:host>div{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-around}svg{-webkit-tap-highlight-color:transparent}svg path.disabled{fill:gray!important}.connector{opacity:.3;cursor:pointer}.connector:hover{opacity:.8}.connector.selected{opacity:1}svg text{font-size:5px;line-height:1.25;font-family:arial;text-align:center;text-decoration:none;text-decoration-line:none;text-decoration-color:#000;letter-spacing:0px;word-spacing:0px;opacity:.60500004;fill:#fff;fill-opacity:1;stroke:none;stroke-width:1;stroke-linejoin:round}g.header{cursor:pointer}g.header path{stroke:var(--default-background-color);stroke-width:1;stroke-linejoin:round}\n"], dependencies: [{ kind: "component", type: SingleCombinationComponent, selector: "obl-single-combination", inputs: ["categories"] }, { kind: "pipe", type: i2.TextFormatPipe, name: "oblTextFormat" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: CombineCategoriesComponent, decorators: [{
type: Component,
args: [{ selector: 'obl-combine-categories', providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: CombineCategoriesComponent
},
{
provide: NG_VALIDATORS,
multi: true,
useExisting: CombineCategoriesComponent
}
], standalone: false, template: "<svg width=\"100%\" viewBox=\"0 0 97.102081 97.102089\">\n @for(c of combine; track $index) {\n <linearGradient\n [id]=\"'lg-category-' + c[0] + '-' + c[1] + suffix\"\n [attr.x1]=\"c[2].x1\"\n [attr.x2]=\"c[2].x2\"\n [attr.y1]=\"c[2].y1\"\n [attr.y2]=\"c[2].y2\"\n gradientUnits=\"userSpaceOnUse\"\n [attr.gradientTransform]=\"c[2].transform\"\n >\n <stop style=\"stop-opacity: 1\" offset=\"0\" [class]=\"'category-' + c[0]\" />\n <stop style=\"stop-opacity: 1\" offset=\"1\" [class]=\"'category-' + c[1]\" />\n </linearGradient>\n }\n\n <g transform=\"translate(-4.7743858,-195.52248)\" style=\"display: inline\">\n <g transform=\"translate(53.5, 244) scale(1.1) translate(-53.5, -244)\">\n @for (category of [\n [1, 2],\n [2, 3],\n [3, 4],\n [4, 5],\n [5, 6],\n [1, 6]\n ]; track $index) {\n <path\n [class]=\"'connector category-' + category[0] + '-' + category[1]\"\n [attr.fill]=\"connectionFill(category)\"\n style=\"fill-opacity: 1\"\n d=\"m 26.436632,222.81253 a 34.395836,34.395836 0 0 0 -5.754687,10.78022 c 11.994195,2.22393 17.151276,0.50052 5.754687,-10.78022 z\"\n [attr.transform]=\"\n 'rotate(' + 60 * $index + ', 53.5, 244) translate(0.2, -0.5)'\n \"\n [class.disabled]=\"\n this.disableParts.includes(category[0] + '-' + category[1])\n \"\n [class.selected]=\"selected.includes(category[0] + '-' + category[1])\"\n (click)=\"click(category)\"\n />\n }\n\n @for (category of [\n [1, 3],\n [2, 4],\n [3, 5],\n [4, 6],\n [1, 5],\n [2, 6]\n ]; track $index) {\n <path\n style=\"fill-opacity: 1\"\n [attr.fill]=\"connectionFill(category)\"\n d=\"m 59.834592,210.2996 c -7.94e-4,0.004 -0.0019,0.009 -0.0026,0.0129 -0.04899,0.24617 -0.100481,0.49002 -0.152445,0.73277 -0.01169,0.0546 -0.02278,0.10988 -0.03462,0.16433 -0.05511,0.2534 -0.112152,0.50432 -0.170532,0.75396 -0.0066,0.0284 -0.01294,0.0574 -0.01963,0.0858 -0.0013,0.006 -0.0028,0.0114 -0.0041,0.0171 -0.06045,0.25597 -0.12316,0.50919 -0.187068,0.76119 -0.0062,0.0246 -0.0118,0.0498 -0.0181,0.0744 -0.0016,0.007 -0.0035,0.0135 -0.0052,0.0202 -0.05959,0.23295 -0.121401,0.46345 -0.183967,0.69298 -0.01519,0.0557 -0.03011,0.1119 -0.04548,0.16743 -0.05412,0.19558 -0.110088,0.38932 -0.166396,0.58239 -0.02689,0.0922 -0.05323,0.18485 -0.08062,0.27647 -0.05437,0.1819 -0.110575,0.36193 -0.166915,0.54157 -0.02719,0.0867 -0.054,0.17377 -0.08165,0.25993 -2.580137,8.36713 -8.206653,15.06324 -16.512172,18.09761 -0.240858,0.0863 -0.484521,0.16982 -0.730186,0.25063 -7.94e-4,2.6e-4 -0.0016,7.9e-4 -0.0026,0.001 -1.56e-4,5e-5 -2.65e-4,-5e-5 -5.29e-4,0 -0.245248,0.0806 -0.493057,0.15845 -0.743107,0.23357 -0.0013,2.7e-4 -0.0024,8e-4 -0.0036,10e-4 -2.65e-4,1.1e-4 -7.94e-4,5.3e-4 -0.0011,5.3e-4 -0.251145,0.0754 -0.504677,0.14773 -0.760677,0.21756 -0.256413,0.0699 -0.515398,0.13721 -0.776697,0.20154 -5.400712,1.31054 -11.036022,1.30905 -16.51062,0.70021 -0.01648,-0.002 -0.03312,-0.004 -0.04961,-0.006 -0.691545,-0.0776 -1.392815,-0.16668 -2.104264,-0.26716 -0.45672,1.63712 -0.791467,3.30585 -1.001489,4.99246 0.0014,1.6e-4 0.0027,2.6e-4 0.0041,5.3e-4 0.37656,0.0443 0.751182,0.0856 1.123446,0.12402 0.373636,0.0385 0.744834,0.0739 1.114144,0.10646 0.361867,0.0319 0.721805,0.0612 1.07952,0.0873 6.491773,0.4673 13.118141,0.0715 19.308899,-1.97714 0.03736,-0.0124 0.07434,-0.0252 0.111622,-0.0377 0.245798,-0.0823 0.490318,-0.16625 0.732772,-0.25321 0.0034,-0.001 0.0069,-0.002 0.01035,-0.004 0.01236,-0.004 0.02434,-0.01 0.03669,-0.0139 11.011844,-4.56436 17.14609,-11.46337 21.298958,-22.07927 0.01601,-0.041 0.0316,-0.0824 0.04754,-0.12351 0.100695,-0.25951 0.20042,-0.52087 0.298175,-0.78444 0.02739,-0.0739 0.05397,-0.14855 0.08113,-0.22273 0.09396,-0.25659 0.186822,-0.51422 0.278019,-0.77463 0.01275,-0.0364 0.02556,-0.0731 0.03824,-0.10955 0.102087,-0.29335 0.202676,-0.5886 0.301273,-0.88677 0.0013,-0.004 0.0024,-0.007 0.0036,-0.0109 0.0034,-0.0102 0.0064,-0.0208 0.0098,-0.031 0.104598,-0.31707 0.207849,-0.6366 0.308509,-0.95912 2.65e-4,-0.001 5.3e-4,-0.002 0.0011,-0.004 -1.840982,-0.69934 -3.738623,-1.23927 -5.672005,-1.61386 z\"\n [class]=\"'connector category-' + category[0] + '-' + category[1]\"\n [attr.transform]=\"\n 'rotate(' + 60 * $index + ', 53.5, 244) translate(0.1, -0.6)'\n \"\n [class.disabled]=\"\n this.disableParts.includes(category[0] + '-' + category[1])\n \"\n [class.selected]=\"selected.includes(category[0] + '-' + category[1])\"\n (click)=\"click(category)\"\n />\n }\n\n @for (category of [\n [1, 4],\n [2, 5],\n [3, 6]\n ]; track $index) {\n <path\n [class]=\"'connector category-' + category[0] + '-' + category[1]\"\n style=\"fill-opacity: 1\"\n [attr.fill]=\"connectionFill(category)\"\n d=\"m 87.609643,240.60059 c -22.649095,3.2223 -45.753999,3.24643 -68.408745,0.0625 -0.305296,2.96791 -0.195822,5.97594 0.288355,8.9178 22.469383,-3.12806 45.374171,-3.10914 67.837719,0.0631 0.492718,-2.98301 0.674092,-6.03459 0.282671,-9.04338 z\"\n [attr.transform]=\"\n 'rotate(' + (60 * $index - 1) + ', 53.5, 244) translate(0, -1)'\n \"\n [class.disabled]=\"\n this.disableParts.includes(category[0] + '-' + category[1])\n \"\n [class.selected]=\"selected.includes(category[0] + '-' + category[1])\"\n (click)=\"click(category)\"\n />\n }\n </g>\n\n <path\n d=\"m 17.858991,265.00001 a 40,40 0 0 1 0,-39.99999\"\n [id]=\"'text-path-' + suffix\"\n style=\"fill: none; stroke: none\"\n />\n\n <path\n d=\"m 14.695555,266.75001 a 43.5,43.5 0 0 0 37.672109,21.75\"\n [id]=\"'text-path-top-' + suffix\"\n style=\"fill: none; stroke: none\"\n />\n\n @for (category of [1, 2, 3, 4, 5, 6]; track $index) {\n <g\n [class]=\"'header category-' + category\"\n (click)=\"toggleAll(category)\"\n >\n <path\n d=\"m 12.145515,220.26747 a 47.624999,47.624999 0 0 0 -6.4450846,23.80629 47.624999,47.624999 0 0 0 6.4032266,23.76755 l 9.986471,-5.76554 a 36.096725,36.096725 0 0 1 -4.861719,-18.00201 36.096725,36.096725 0 0 1 4.878255,-18.05522 z\"\n [attr.transform]=\"'rotate(' + 60 * (category - 1) + ', 53.5, 244)'\"\n />\n\n <text\n style=\"text-anchor: middle\"\n [attr.transform]=\"headers[category - 1].transform\"\n >\n <textPath\n startOffset=\"50%\"\n [attr.xlink:href]=\"headers[category - 1].href\"\n >\n {{ categories[category - 1].name | oblTextFormat: 'ellipsis':14 }}\n </textPath>\n </text>\n </g>\n }\n </g>\n</svg>\n\n@if (displaySingle() && single.length) {\n <div>\n @for (combination of single; track combination) {\n <obl-single-combination\n [categories]=\"combination\"\n ></obl-single-combination>\n }\n </div>\n}\n", styles: [":root{--obl-primary: #00afaf;--obl-secondary: #008caf;--default-border-color: gray;--default-focus-color: gray;--default-border-outline-color: #080808;--default-disabled-color: gray;--default-background-color: white;--default-hover-color: #eeeeee;--obl-default-error-color: red;--obl-dialog-background: #d3d3d3;--default-radio-color: black;--disabled-color: gray;--default-hex-button-border-color: #008caf;--default-hex-button-hover-border-color: #00afaf;--select-item-background-color: #e4e4e4;--select-item-text-color: #5a5a5a;--default-text-color: black;--obl-default-button-text-color: black;--obl-default-icon-color: black;--equalizer-background-bar-color: #575656;--equalizer-value-bar-color: #e6e6e6;--diagram-3d-background-color: black;--slider-value-container-color: gray;--slider-value-color: #d1d1d1;--slider-hover-value-color: white;--digit-fill-color: #cccccc;--digit-lighted-color: black;--horizontal-progress-bar-value-color: #504f4f;--horizontal-progress-bar-background-pattern-color: #dddddd;--horizontal-progress-bar-value-pattern-color: #b3b3b3;--horizontal-progress-bar-border-rect-color: #cccccc;--temperature-text-color: black;--temperature-path-stroke-color: black;--post-diagram-scale-line-color: #c8c8c8;--volume-channel-secondary-color: gray;--volume-channel-primary-color: #f2f2f2;--arch-progress-secondary-color: #eeeeee;--obl-linear-diagram-greed-color: gray;--obl-rating-selected-color: gold;--obl-rating-color: #cccccc}:host{display:flex;flex-direction:column}:host.disabled path.connector{fill:gray!important}:host>div{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-around}svg{-webkit-tap-highlight-color:transparent}svg path.disabled{fill:gray!important}.connector{opacity:.3;cursor:pointer}.connector:hover{opacity:.8}.connector.selected{opacity:1}svg text{font-size:5px;line-height:1.25;font-family:arial;text-align:center;text-decoration:none;text-decoration-line:none;text-decoration-color:#000;letter-spacing:0px;word-spacing:0px;opacity:.60500004;fill:#fff;fill-opacity:1;stroke:none;stroke-width:1;stroke-linejoin:round}g.header{cursor:pointer}g.header path{stroke:var(--default-background-color);stroke-width:1;stroke-linejoin:round}\n"] }]
}], propDecorators: { value: [{
type: Input
}], disabled: [{
type: Input
}, {
type: HostBinding,
args: ['class.disabled']
}], disable: [{
type: Input
}], valueChange: [{
type: Output
}], categories: [{
type: Input
}] } });
class HalfMatrixCombineCategoriesComponent {
elementRef;
touched = false;
disableParts = [];
selected = [];
single = [];
/**
* Categories list used to create combination, minimum 2 maximum 7 however there is no limits
*/
categories = [
{ name: 'Monday' },
{ name: 'Tuesday' },
{ name: 'Wednesday' },
{ name: 'Thursday' },
{ name: 'Friday' },
{ name: 'Saturday' },
{ name: 'Sunday' },
];
value = [];
adapter = new CombineNameAdapter(this);
/**
* Disable whole things
*/
disabled = false;
/**
* Disable speciffic combination of categories (format depends on type of adapter used inside)
*
* When the adapter field is instance of CombineNameAdapter then to disable "Category 1" i "Category 2":
*
* @example
*
* <obl-combine-categories [value]="selected" (valueChaned)="changed($event)"
* [disable]="[[{ name: 'Category 1' }, { name: 'Category 2' }]]"></obl-combine-categories>
*/
disable = [];
/**
* Let you display a obl-single-category components that represents single combination with names of
* categories displayed inside.
*/
displaySingle = input(true);
/**
* Emit when value changed
*/
valueChanged = new EventEmitter();
onChange = (value) => { };
onTouched = () => { };
constructor(elementRef) {
this.elementRef = elementRef;
}
table(length) {
return new Array(length);
}
select(row, col) {
if (this.disabled) {
return;
}
const tag = this.adapter.toTag(row, col, true);
if (this.disableParts.includes(tag)) {
return;
}
if (this.selected.includes(tag)) {
this.selected = this.selected.filter(t => t !== tag);
this.selected = this.selected.filter(v => !v.includes(tag));
}
else {
this.selected.push(tag);
}
this.toSingleCombination();
this.set();
}
toggle(row, col) {
this.elementRef.nativeElement.classList.toggle(`highlight-left-${row}`);
this.elementRef.nativeElement.classList.toggle(`highlight-right-${col}`);
}
toggleAll(categoryId) {
if (this.disabled) {
return;
}
const combinations = this.categories.length - 1;
const cat = categoryId.toString();
if (this.selected.filter(v => v.includes(cat)).concat(this.disableParts.filter(i => i.includes(cat) && !this.selected.includes(i)))?.length >= combinations) {
this.selected = this.selected.filter(v => !v.includes(cat) || this.disableParts.includes(v));
}
else {
for (let i = 0; i < combinations + 1; i++) {
if ((i + 1) !== categoryId && !this.disableParts.includes(this.adapter.toTag(i + 1, categoryId, true))) {
const id = this.adapter.toTag(i + 1, categoryId, true);
if (!this.selected.find(v => id === v)) {
this.selected.push(id);
}
}
}
}
this.set();
}
ngOnChanges(changes) {
if (changes.value && changes.value.currentValue?.length !== changes.value.previousValue?.length) {
this.adapter.setAdapterConnector(this);
this.selected = this.adapter.transform(changes.value.currentValue, true);
this.set();
}
if (changes.disable && changes.disable.currentValue instanceof Array) {
this.adapter.setAdapterConnector(this);
this.disableParts = this.adapter.transform(changes.disable.currentValue, true);
}
}
validate(control) {
return null;
}
writeValue(categories) {
this.adapter.setAdapterConnector(this);
this.selected = this.adapter.transform(categories, true);
this.toSingleCombination();
}
registerOnChange(onChange) {
this.onChange = onChange;
}
registerOnTouched(onTouched) {
this.onTouched = onTouched;
}
setDisabledState(disabled) {
this.disabled = disabled;
}
markAsTouched() {
if (this.disabled) {
return;
}
if (!this.touched) {
this.onTouched();
this.touched = true;
}
}
toSingleCombination() {
const adapter = new CombineNameAndIndexAdapter(this);
this.single = adapter.convert().map(v => [
{ ...v[0], class: 'category-' + v[0].id },
{ ...v[1], class: 'category-' + v[1].id }
]);
}
set(withEmit = true) {
this.adapter.setAdapterConnector(this);
const categories = this.adapter.convert();
this.markAsTouched();
this.onChange(categories);
if (withEmit) {
this.valueChanged.emit(categories);
}
this.toSingleCombination();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: HalfMatrixCombineCategoriesComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: HalfMatrixCombineCategoriesComponent, isStandalone: false, selector: "obl-half-matrix-combine-categories", inputs: { categories: { classPropertyName: "categories", publicName: "categories", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, adapter: { classPropertyName: "adapter", publicName: "adapter", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: false, isRequired: false, transformFunction: null }, displaySingle: { classPropertyName: "displaySingle", publicName: "displaySingle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanged: "valueChanged" }, host: { properties: { "class.disabled": "this.disabled" } }, providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: HalfMatrixCombineCategoriesComponent
},
{
provide: NG_VALIDATORS,
multi: true,
useExisting: HalfMatrixCombineCategoriesComponent
}
], usesOnChanges: true, ngImport: i0, template: "<div class=\"parent\">\n <div>\n @for (category of categories; track category.name; let row = $index){\n @if (row < categories.length - 1) {\n <div>\n @if(row !== 6) {\n <div\n [class]=\"'header left clickable category-' + (row + 2)\"\n (click)=\"toggleAll(row + 2)\"\n >\n <p>{{ categories[row + 1].name }}</p>\n </div>\n @for (j of table(row + 1); track j; let col = $index) {\n <div\n [class]=\"\n 'clickable combination category-' +\n adapter.toTag(row + 2, col + 1, true)\n \"\n [class.selected]=\"\n selected.includes(adapter.toTag(row + 2, col + 1, true))\n \"\n [class.disabled]=\"\n this.disableParts.includes(adapter.toTag(row + 2, col + 1, true))\n \"\n (click)=\"select(row + 2, col + 1)\"\n (mouseover)=\"toggle(row + 2, col + 1)\"\n (mouseout)=\"toggle(row + 2, col + 1)\"\n ></div>\n }\n }\n </div>\n }\n }\n <div class=\"header-right\">\n @for (j of table(categories.length - 1); track $index; let row = $index) {\n <div\n [class]=\"'header right clickable category-' + (row + 1)\"\n (click)=\"toggleAll(row + 1)\"\n >\n <p>{{ categories[row].name }}</p>\n </div>\n }\n </div>\n </div>\n</div>\n\n@if (displaySingle() && single.length) {\n <div class=\"single\">\n @for (combination of single; track $index) {\n <obl-single-combination\n [categories]=\"combination\"\n ></obl-single-combination>\n }\n </div>\n}\n", styles: ["p{margin-block-start:0;margin-block-end:0}:host{display:flex;align-items:center;flex-direction:column}.parent{width:374px;height:374px;transform:scaleY(.7) matrix(.7071067812,-.7071067812,.7071067812,.7071067812,0,0);display:flex;flex-direction:column;align-items:center;justify-content:center}.parent>div>div{display:flex}.parent>div>div>div{width:40px;height:40px;margin:2px}.parent>div>div .header{font-size:17px;color:#fff;display:flex;width:150px;height:40px;align-items:center;justify-content:flex-end}.parent>div>div .header p{margin-right:10px;font-size:17px}.parent>div .header-right{display:flex}.parent>div .header-right .header{font-size:17px;color:#fff;display:flex;width:40px;height:150px;align-items:flex-start;justify-content:center}.parent>div .header-right .header:first-child{margin-left:156px}.parent>div .header-right .header p{text-align:left;font-size:17px;min-width:150px;transform:rotate(90deg) translate(50%,-5px)}.single{display:flex;justify-content:center;flex-wrap:wrap}:host.disabled .combination{background-color:gray}:host .combination.disabled{background-color:gray}\n"], dependencies: [{ kind: "component", type: SingleCombinationComponent, selector: "obl-single-combination", inputs: ["categories"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: HalfMatrixCombineCategoriesComponent, decorators: [{
type: Component,
args: [{ selector: 'obl-half-matrix-combine-categories', providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: HalfMatrixCombineCategoriesComponent
},
{
provide: NG_VALIDATORS,
multi: true,
useExisting: HalfMatrixCombineCategoriesComponent
}
], standalone: false, template: "<div class=\"parent\">\n <div>\n @for (category of categories; track category.name; let row = $index){\n @if (row < categories.length - 1) {\n <div>\n @if(row !== 6) {\n <div\n [class]=\"'header left clickable category-' + (row + 2)\"\n (click)=\"toggleAll(row + 2)\"\n >\n <p>{{ categories[row + 1].name }}</p>\n </div>\n @for (j of table(row + 1); track j; let col = $index) {\n <div\n [class]=\"\n 'clickable combination category-' +\n adapter.toTag(row + 2, col + 1, true)\n \"\n [class.selected]=\"\n selected.includes(adapter.toTag(row + 2, col + 1, true))\n \"\n [class.disabled]=\"\n this.disableParts.includes(adapter.toTag(row + 2, col + 1, true))\n \"\n (click)=\"select(row + 2, col + 1)\"\n (mouseover)=\"toggle(row + 2, col + 1)\"\n (mouseout)=\"toggle(row + 2, col + 1)\"\n ></div>\n }\n }\n </div>\n }\n }\n <div class=\"header-right\">\n @for (j of table(categories.length - 1); track $index; let row = $index) {\n <div\n [class]=\"'header right clickable category-' + (row + 1)\"\n (click)=\"toggleAll(row + 1)\"\n >\n <p>{{ categories[row].name }}</p>\n </div>\n }\n </div>\n </div>\n</div>\n\n@if (displaySingle() && single.length) {\n <div class=\"single\">\n @for (combination of single; track $index) {\n <obl-single-combination\n [categories]=\"combination\"\n ></obl-single-combination>\n }\n </div>\n}\n", styles: ["p{margin-block-start:0;margin-block-end:0}:host{display:flex;align-items:center;flex-direction:column}.parent{width:374px;height:374px;transform:scaleY(.7) matrix(.7071067812,-.7071067812,.7071067812,.7071067812,0,0);display:flex;flex-direction:column;align-items:center;justify-content:center}.parent>div>div{display:flex}.parent>div>div>div{width:40px;height:40px;margin:2px}.parent>div>div .header{font-size:17px;color:#fff;display:flex;width:150px;height:40px;align-items:center;justify-content:flex-end}.parent>div>div .header p{margin-right:10px;font-size:17px}.parent>div .header-right{display:flex}.parent>div .header-right .header{font-size:17px;color:#fff;display:flex;width:40px;height:150px;align-items:flex-start;justify-content:center}.parent>div .header-right .header:first-child{margin-left:156px}.parent>div .header-right .header p{text-align:left;font-size:17px;min-width:150px;transform:rotate(90deg) translate(50%,-5px)}.single{display:flex;justify-content:center;flex-wrap:wrap}:host.disabled .combination{background-color:gray}:host .combination.disabled{background-color:gray}\n"] }]
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { categories: [{
type: Input
}], value: [{
type: Input
}], adapter: [{
type: Input
}], disabled: [{
type: Input
}, {
type: HostBinding,
args: ['class.disabled']
}], disable: [{
type: Input
}], valueChanged: [{
type: Output
}] } });
class CategoriesModule {
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: CategoriesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.4", ngImport: i0, type: CategoriesModule, declarations: [CombineCategoriesComponent,
SingleCombinationComponent,
HalfMatrixCombineCategoriesComponent], imports: [CommonModule,
TextPipesModule], exports: [CombineCategoriesComponent,
SingleCombinationComponent,
HalfMatrixCombineCategoriesComponent] });
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: CategoriesModule, imports: [CommonModule,
TextPipesModule] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: CategoriesModule, decorators: [{
type: NgModule,
args: [{
declarations: [
CombineCategoriesComponent,
SingleCombinationComponent,
HalfMatrixCombineCategoriesComponent
],
imports: [
CommonModule,
TextPipesModule
],
exports: [
CombineCategoriesComponent,
SingleCombinationComponent,
HalfMatrixCombineCategoriesComponent
]
}]
}] });
class CombineIdAdapter extends AbstractCombineAdapter {
findIndex(data) {
return data;
}
fromIndex(index) {
return index;
}
convert() {
return this.adapterConnector.selected.map(tag => {
const splitted = tag.split('-');
return [
this.fromIndex(+splitted[0]),
this.fromIndex(+splitted[1])
];
});
}
transform(data, reversed) {
if (!data) {
return [];
}
return data.map(categories => (this.toTag(categories[0], categories[1], reversed)));
}
}
/**
* Generated bundle index. Do not edit.
*/
export { AbstractCombineAdapter, CategoriesModule, CombineCategoriesComponent, CombineIdAdapter, CombineNameAdapter, CombineNameAndIndexAdapter, HalfMatrixCombineCategoriesComponent, SingleCombinationComponent };
//# sourceMappingURL=obliczeniowo-elementary-categories.mjs.map