@ng-formworks/core 18.6.2 → 18.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/shared/form-group.functions.mjs +34 -44
- package/esm2022/lib/shared/json-schema.functions.mjs +41 -8
- package/esm2022/lib/shared/layout.functions.mjs +7 -5
- package/esm2022/lib/widget-library/index.mjs +4 -2
- package/esm2022/lib/widget-library/one-of.component.mjs +2 -2
- package/esm2022/lib/widget-library/root.component.mjs +2 -1
- package/esm2022/lib/widget-library/selectcheckbox.component.mjs +183 -0
- package/esm2022/lib/widget-library/widget-library.module.mjs +4 -3
- package/esm2022/lib/widget-library/widget-library.service.mjs +6 -4
- package/fesm2022/ng-formworks-core.mjs +361 -158
- package/fesm2022/ng-formworks-core.mjs.map +1 -1
- package/lib/shared/json-schema.functions.d.ts +0 -1
- package/lib/widget-library/index.d.ts +1 -0
- package/lib/widget-library/selectcheckbox.component.d.ts +55 -0
- package/lib/widget-library/widget-library.module.d.ts +7 -6
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i1 from '@angular/common';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { Injectable, inject, input, viewChild, ViewContainerRef, Component, Directive, Input, ChangeDetectionStrategy, ViewChild, signal, ElementRef, NgZone,
|
|
4
|
+
import { Injectable, inject, input, viewChild, ViewContainerRef, Component, Directive, Input, ChangeDetectionStrategy, ViewChild, signal, ElementRef, NgZone, Inject, NgModule, forwardRef, ChangeDetectorRef, output } from '@angular/core';
|
|
5
5
|
import * as i2 from '@angular/forms';
|
|
6
6
|
import { UntypedFormControl, UntypedFormArray, UntypedFormGroup, FormsModule, ReactiveFormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
7
7
|
import addFormats from 'ajv-formats';
|
|
@@ -4586,8 +4586,32 @@ function fixRequiredArrayProperties(schema) {
|
|
|
4586
4586
|
* @param schema:any
|
|
4587
4587
|
* @param negate:boolean=false
|
|
4588
4588
|
* @returns
|
|
4589
|
-
|
|
4590
4589
|
*/
|
|
4590
|
+
//TODO also handle ifs with mixed conditional such as allOf/oneOf etc
|
|
4591
|
+
/*
|
|
4592
|
+
|
|
4593
|
+
"if": {
|
|
4594
|
+
"allOf": [
|
|
4595
|
+
{
|
|
4596
|
+
"properties": {
|
|
4597
|
+
"animalType": {
|
|
4598
|
+
"enum": ["Cat", "Fish"]
|
|
4599
|
+
}
|
|
4600
|
+
}
|
|
4601
|
+
},
|
|
4602
|
+
{
|
|
4603
|
+
"properties": {
|
|
4604
|
+
"color": {
|
|
4605
|
+
"const": "orange"
|
|
4606
|
+
}
|
|
4607
|
+
}
|
|
4608
|
+
}
|
|
4609
|
+
]
|
|
4610
|
+
}
|
|
4611
|
+
|
|
4612
|
+
|
|
4613
|
+
|
|
4614
|
+
*/
|
|
4591
4615
|
function convertJSONSchemaIfToCondition(schema, layoutNode, negate = false) {
|
|
4592
4616
|
let conditionFun = "";
|
|
4593
4617
|
let condition = {};
|
|
@@ -4612,17 +4636,26 @@ function convertJSONSchemaIfToCondition(schema, layoutNode, negate = false) {
|
|
|
4612
4636
|
.join("")
|
|
4613
4637
|
: "";
|
|
4614
4638
|
let modelPath = parentPath ? `model.${parentPath}` : "model";
|
|
4615
|
-
let checkPath = modelPath.split(
|
|
4616
|
-
.
|
|
4617
|
-
|
|
4618
|
-
|
|
4619
|
-
|
|
4639
|
+
let checkPath = modelPath.split('.')
|
|
4640
|
+
.map((_, index, array) => {
|
|
4641
|
+
return array.slice(0, index + 1).join('.'); // Build each part of the path dynamically
|
|
4642
|
+
}).join(' && '); // Join the parts with '&&'
|
|
4643
|
+
// .reduce((accumulator, currentPart, index) => {
|
|
4644
|
+
// const currentExpression = index === 0 ? currentPart : `${accumulator}.${currentPart}`;
|
|
4645
|
+
// return index === 0 ? currentExpression : `${accumulator} && ${currentExpression}`;
|
|
4646
|
+
// }, '');
|
|
4620
4647
|
if (schema.if) {
|
|
4621
4648
|
Object.keys(schema.if.properties).forEach((ifProp, ind) => {
|
|
4622
4649
|
let amper = ind > 0 ? "&" : "";
|
|
4623
4650
|
//Note the model value is first converted to string and so is the condition
|
|
4624
4651
|
//so that booleans and numbers can also be compared
|
|
4625
|
-
|
|
4652
|
+
//changed to an includesList to handle cases such as
|
|
4653
|
+
const includesList = hasOwn(schema.if.properties[ifProp], "const") ? [schema.if.properties[ifProp].const]
|
|
4654
|
+
: hasOwn(schema.if.properties[ifProp], "enum") ? schema.if.properties[ifProp].enum
|
|
4655
|
+
: [];
|
|
4656
|
+
const includesListAsStr = includesList.map(val => { return `"${val}"`; });
|
|
4657
|
+
conditionFun += `${amper} ${checkPath} && [${includesListAsStr}].includes(${modelPath}.${ifProp}+"")`;
|
|
4658
|
+
//conditionFun+=`${amper} ${checkPath} && ${modelPath}.${ifProp}+""=='${schema.if.properties[ifProp].const}'`
|
|
4626
4659
|
});
|
|
4627
4660
|
}
|
|
4628
4661
|
condition["functionBody"] = `return ${notOp}(${conditionFun})`;
|
|
@@ -5052,7 +5085,7 @@ function buildFormGroupTemplate(jsf, nodeValue = null, setValues = true, schemaP
|
|
|
5052
5085
|
["then", "else"].forEach(con => {
|
|
5053
5086
|
if (hasOwn(schema, con)) {
|
|
5054
5087
|
const keySchemaPointer = `/${con}`;
|
|
5055
|
-
let thenFGTemplate = buildFormGroupTemplate(jsf, nodeValue,
|
|
5088
|
+
let thenFGTemplate = buildFormGroupTemplate(jsf, nodeValue, setValues, //false,//JsonPointer.get(nodeValue, keySchemaPointer), setValues,
|
|
5056
5089
|
schemaPointer + keySchemaPointer, dataPointer, templatePointer + `/controls/${con}`);
|
|
5057
5090
|
Object.assign(controls, thenFGTemplate.controls);
|
|
5058
5091
|
}
|
|
@@ -5113,7 +5146,8 @@ function buildFormGroupTemplate(jsf, nodeValue = null, setValues = true, schemaP
|
|
|
5113
5146
|
if (foundKeys && foundKeys.length > 0) {
|
|
5114
5147
|
const keySchemaPointer = `/${ofType}/${ind}`;
|
|
5115
5148
|
//console.log(`found:${keySchemaPointer}`);
|
|
5116
|
-
let newNodeValue =
|
|
5149
|
+
let newNodeValue = nodeValue;
|
|
5150
|
+
//JsonPointer.get(nodeValue, dataPointer);
|
|
5117
5151
|
//JsonPointer.get(nodeValue, keySchemaPointer);
|
|
5118
5152
|
if (ofType == "oneOf") {
|
|
5119
5153
|
newNodeValue = nodeValue;
|
|
@@ -5144,9 +5178,16 @@ function buildFormGroupTemplate(jsf, nodeValue = null, setValues = true, schemaP
|
|
|
5144
5178
|
let oneOfItemSchema = JsonPointer.get(jsf.schema, controlItem.schemaPointer);
|
|
5145
5179
|
//JsonPointer.get(schema,pointerPath);
|
|
5146
5180
|
let dPointer = controlItem.schemaPointer.replace(/(anyOf|allOf|oneOf|none)\/[\d]+\//g, '')
|
|
5147
|
-
.replace(/(if|then|else|properties)\//g, '');
|
|
5181
|
+
.replace(/(if|then|else|properties)\//g, '').replace(/\/items\//g, '/-/');
|
|
5182
|
+
dPointer = dPointer.indexOf(dataPointer) == 0
|
|
5183
|
+
? dPointer.substring(dataPointer.length) : dPointer;
|
|
5184
|
+
//dataPointer+"/"+controlItem.schemaPointer.split("/").slice(-1)[0];
|
|
5185
|
+
////controlItem.schemaPointer.replace(/(anyOf|allOf|oneOf|none)\/[\d]+\//g, '')
|
|
5186
|
+
////.replace(/(if|then|else|properties)\//g, '').replace(/\/items\//g,'/-/');
|
|
5148
5187
|
//JsonPointer.toDataPointer(controlItem.schemaPointer,jsf.schema);
|
|
5149
|
-
|
|
5188
|
+
//console.log(`dataPointer:${dataPointer}\ndPointer:${dPointer}`)
|
|
5189
|
+
let dVal = //JsonPointer.get(jsf.formValues,dPointer);
|
|
5190
|
+
JsonPointer.get(nodeValue, dPointer);
|
|
5150
5191
|
let fkey = key;
|
|
5151
5192
|
let oneOfItemValue = dVal;
|
|
5152
5193
|
/*
|
|
@@ -5289,43 +5330,22 @@ function buildFormGroupTemplate(jsf, nodeValue = null, setValues = true, schemaP
|
|
|
5289
5330
|
["then", "else"].forEach(con => {
|
|
5290
5331
|
if (hasOwn(schema, con)) {
|
|
5291
5332
|
const keySchemaPointer = `/${con}`;
|
|
5292
|
-
let thenTFGTemplate = buildFormGroupTemplate(jsf, nodeValue,
|
|
5333
|
+
let thenTFGTemplate = buildFormGroupTemplate(jsf, nodeValue, setValues, //false,
|
|
5334
|
+
schemaPointer + keySchemaPointer, dataPointer, templatePointer + `/controls/${con}`);
|
|
5293
5335
|
//NB same property can be in both then and else
|
|
5294
5336
|
//so key must be the unique path to control
|
|
5295
5337
|
//let ifItemSchema=JsonPointer.get(schema,keySchemaPointer);
|
|
5296
5338
|
//let ifItemValue;
|
|
5297
|
-
|
|
5298
|
-
|
|
5299
|
-
|
|
5300
|
-
|
|
5301
|
-
|
|
5302
|
-
|
|
5303
|
-
|
|
5304
|
-
|
|
5305
|
-
|
|
5306
|
-
|
|
5307
|
-
//then set it to default otherwise to its nodevalue
|
|
5308
|
-
ifItemValue=ifItemSchema.default
|
|
5309
|
-
ifItemValue[key]=ifItemSchema.properties[key]?.default;
|
|
5310
|
-
}
|
|
5311
|
-
if(ifItemSchema.properties && jsf.formValues!=undefined){
|
|
5312
|
-
ifItemValue ={};
|
|
5313
|
-
//nodeValue||{};
|
|
5314
|
-
ifItemValue[key]=nodeValue&&nodeValue[key];
|
|
5315
|
-
}
|
|
5316
|
-
if(!ifItemSchema.properties && jsf.formValues==undefined){
|
|
5317
|
-
ifItemValue=ifItemSchema.default;
|
|
5318
|
-
}
|
|
5319
|
-
if(hasOwn(cItem,"value")){
|
|
5320
|
-
if(!jsf.ajv.validate(ifItemSchema,ifItemValue)){
|
|
5321
|
-
cItem.value.value=null;
|
|
5322
|
-
}else{
|
|
5323
|
-
cItem.value.value=ifItemValue[key];
|
|
5324
|
-
}
|
|
5325
|
-
}
|
|
5326
|
-
*/
|
|
5327
|
-
controls[controlKey] = cItem;
|
|
5328
|
-
});
|
|
5339
|
+
if (hasOwn(thenTFGTemplate, 'controls')) {
|
|
5340
|
+
Object.keys(thenTFGTemplate.controls).forEach(key => {
|
|
5341
|
+
let controlKey = thenTFGTemplate.controls[key].schemaPointer;
|
|
5342
|
+
if (controlKey) {
|
|
5343
|
+
controlKey = path2ControlKey(controlKey);
|
|
5344
|
+
let cItem = Object.assign({}, thenTFGTemplate.controls[key]);
|
|
5345
|
+
controls[controlKey] = cItem;
|
|
5346
|
+
}
|
|
5347
|
+
});
|
|
5348
|
+
}
|
|
5329
5349
|
}
|
|
5330
5350
|
});
|
|
5331
5351
|
}
|
|
@@ -5562,7 +5582,8 @@ function getControl(formGroup, dataPointer, returnGroup = false, schemaPointer)
|
|
|
5562
5582
|
// If dataPointer input is not a valid JSON pointer, check to
|
|
5563
5583
|
// see if it is instead a valid object path, using dot notaion
|
|
5564
5584
|
if (typeof dataPointer === 'string') {
|
|
5565
|
-
const
|
|
5585
|
+
const controlPath = !!schemaPointer ? path2ControlKey(schemaPointer) : dataPointer;
|
|
5586
|
+
const formControl = formGroup.get(controlPath);
|
|
5566
5587
|
if (formControl) {
|
|
5567
5588
|
return formControl;
|
|
5568
5589
|
}
|
|
@@ -5582,7 +5603,8 @@ function getControl(formGroup, dataPointer, returnGroup = false, schemaPointer)
|
|
|
5582
5603
|
// try using formGroup.get() to return the control
|
|
5583
5604
|
if (typeof formGroup.get === 'function' &&
|
|
5584
5605
|
dataPointerArray.every(key => key.indexOf('.') === -1)) {
|
|
5585
|
-
const
|
|
5606
|
+
const controlPath = !!schemaPointer ? path2ControlKey(schemaPointer) : dataPointerArray.join('.');
|
|
5607
|
+
const formControl = formGroup.get(controlPath);
|
|
5586
5608
|
if (formControl) {
|
|
5587
5609
|
return formControl;
|
|
5588
5610
|
}
|
|
@@ -5595,15 +5617,16 @@ function getControl(formGroup, dataPointer, returnGroup = false, schemaPointer)
|
|
|
5595
5617
|
if (hasOwn(subGroup, 'controls')) {
|
|
5596
5618
|
subGroup = subGroup.controls;
|
|
5597
5619
|
}
|
|
5598
|
-
if (
|
|
5620
|
+
if (schemaPointer && hasOwn(subGroup, path2ControlKey(schemaPointer))) {
|
|
5621
|
+
subGroup = subGroup[path2ControlKey(schemaPointer)];
|
|
5622
|
+
return subGroup;
|
|
5623
|
+
}
|
|
5624
|
+
else if (isArray(subGroup) && (key === '-')) {
|
|
5599
5625
|
subGroup = subGroup[subGroup.length - 1];
|
|
5600
5626
|
}
|
|
5601
5627
|
else if (hasOwn(subGroup, key)) {
|
|
5602
5628
|
subGroup = subGroup[key];
|
|
5603
5629
|
}
|
|
5604
|
-
else if (schemaPointer && hasOwn(subGroup, path2ControlKey(schemaPointer))) {
|
|
5605
|
-
subGroup = subGroup[path2ControlKey(schemaPointer)];
|
|
5606
|
-
}
|
|
5607
5630
|
else {
|
|
5608
5631
|
console.error(`getControl error: Unable to find "${key}" item in FormGroup.`);
|
|
5609
5632
|
console.error(dataPointer);
|
|
@@ -6481,7 +6504,7 @@ function buildLayoutFromSchema(jsf, widgetLibrary, nodeValue = null, schemaPoint
|
|
|
6481
6504
|
if (hasOwn(schema, con)) {
|
|
6482
6505
|
const keySchemaPointer = `/${con}`;
|
|
6483
6506
|
const negateClause = con == "else";
|
|
6484
|
-
const innerItem = buildLayoutFromSchema(jsf, widgetLibrary, nodeValue
|
|
6507
|
+
const innerItem = buildLayoutFromSchema(jsf, widgetLibrary, nodeValue[con], schemaPointer + keySchemaPointer, dataPointer, false, null, null, forRefLibrary, dataPointerPrefix);
|
|
6485
6508
|
if (innerItem) {
|
|
6486
6509
|
applyITEConditions(innerItem, schemaPointer, keySchemaPointer, negateClause);
|
|
6487
6510
|
if (isArray(innerItem)) {
|
|
@@ -6708,7 +6731,7 @@ function buildLayoutFromSchema(jsf, widgetLibrary, nodeValue = null, schemaPoint
|
|
|
6708
6731
|
if (hasOwn(schema, con)) {
|
|
6709
6732
|
const keySchemaPointer = `/${con}`;
|
|
6710
6733
|
const negateClause = con == "else";
|
|
6711
|
-
const innerItem = buildLayoutFromSchema(jsf, widgetLibrary, nodeValue
|
|
6734
|
+
const innerItem = buildLayoutFromSchema(jsf, widgetLibrary, nodeValue[con], schemaPointer + keySchemaPointer, dataPointer, false, null, null, forRefLibrary, dataPointerPrefix);
|
|
6712
6735
|
if (innerItem) {
|
|
6713
6736
|
applyITEConditions(innerItem, schemaPointer, keySchemaPointer, negateClause);
|
|
6714
6737
|
if (isArray(innerItem)) {
|
|
@@ -6716,17 +6739,19 @@ function buildLayoutFromSchema(jsf, widgetLibrary, nodeValue = null, schemaPoint
|
|
|
6716
6739
|
//item.schemaPointer = schemaPointer + keySchemaPointer + item.dataPointer;
|
|
6717
6740
|
//item.options.condition = convertJSONSchemaIfToCondition(schema, negateClause);
|
|
6718
6741
|
newSection.push(item);
|
|
6719
|
-
newNode = newSection
|
|
6742
|
+
/////// newNode = newSection
|
|
6720
6743
|
});
|
|
6721
6744
|
}
|
|
6722
6745
|
else {
|
|
6723
6746
|
//innerItem.schemaPointer = schemaPointer + keySchemaPointer + innerItem.dataPointer;
|
|
6724
6747
|
//innerItem.options.condition = convertJSONSchemaIfToCondition(schema, negateClause);
|
|
6725
|
-
newNode = innerItem
|
|
6748
|
+
///////newNode = innerItem
|
|
6749
|
+
newSection.push(innerItem);
|
|
6726
6750
|
}
|
|
6727
6751
|
}
|
|
6728
6752
|
}
|
|
6729
6753
|
});
|
|
6754
|
+
newNode = newSection;
|
|
6730
6755
|
}
|
|
6731
6756
|
return newNode;
|
|
6732
6757
|
}
|
|
@@ -8911,7 +8936,7 @@ class OneOfComponent {
|
|
|
8911
8936
|
let controlSchema = JsonPointer.get(this.jsf.schema, parts.join("/"));
|
|
8912
8937
|
let schemaPointer = parts.join("/");
|
|
8913
8938
|
let dPointer = schemaPointer.replace(/(anyOf|allOf|oneOf|none)\/[\d]+\//g, '')
|
|
8914
|
-
.replace(/(if|then|else|properties)\//g, '');
|
|
8939
|
+
.replace(/(if|then|else|properties)\//g, '').replace(/\/items\//g, '/-/');
|
|
8915
8940
|
//JsonPointer.toDataPointer(parts.join("/"),this.jsf.schema);
|
|
8916
8941
|
let dVal = JsonPointer.get(this.jsf.formValues, dPointer);
|
|
8917
8942
|
let compareVal = dVal; //formValue;
|
|
@@ -9284,6 +9309,7 @@ class RootComponent {
|
|
|
9284
9309
|
}
|
|
9285
9310
|
sortableInit(sortable) {
|
|
9286
9311
|
this.sortableObj = sortable;
|
|
9312
|
+
//Sortable.utils.on(this.sortableObj.el,"nulling",(s)=>{console.log("event nulling sortablejs")})
|
|
9287
9313
|
///NB issue caused by sortablejs when it its destroyed
|
|
9288
9314
|
//this mainly affects checkboxes coupled with conditions
|
|
9289
9315
|
//-the value is rechecked
|
|
@@ -9947,40 +9973,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
9947
9973
|
}]
|
|
9948
9974
|
}] });
|
|
9949
9975
|
|
|
9950
|
-
class TabComponent {
|
|
9951
|
-
constructor() {
|
|
9952
|
-
this.jsf = inject(JsonSchemaFormService);
|
|
9953
|
-
this.layoutNode = input(undefined);
|
|
9954
|
-
this.layoutIndex = input(undefined);
|
|
9955
|
-
this.dataIndex = input(undefined);
|
|
9956
|
-
}
|
|
9957
|
-
ngOnInit() {
|
|
9958
|
-
this.options = this.layoutNode().options || {};
|
|
9959
|
-
}
|
|
9960
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9961
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TabComponent, selector: "tab-widget", inputs: { layoutNode: { classPropertyName: "layoutNode", publicName: "layoutNode", isSignal: true, isRequired: false, transformFunction: null }, layoutIndex: { classPropertyName: "layoutIndex", publicName: "layoutIndex", isSignal: true, isRequired: false, transformFunction: null }, dataIndex: { classPropertyName: "dataIndex", publicName: "dataIndex", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
9962
|
-
<div [class]="options?.htmlClass || ''">
|
|
9963
|
-
<root-widget
|
|
9964
|
-
[dataIndex]="dataIndex()"
|
|
9965
|
-
[layoutIndex]="layoutIndex()"
|
|
9966
|
-
[layout]="layoutNode().items"></root-widget>
|
|
9967
|
-
</div>`, isInline: true, dependencies: [{ kind: "component", type: RootComponent, selector: "root-widget", inputs: ["dataIndex", "layoutIndex", "layout", "isOrderable", "isFlexItem"] }] }); }
|
|
9968
|
-
}
|
|
9969
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, decorators: [{
|
|
9970
|
-
type: Component,
|
|
9971
|
-
args: [{
|
|
9972
|
-
// tslint:disable-next-line:component-selector
|
|
9973
|
-
selector: 'tab-widget',
|
|
9974
|
-
template: `
|
|
9975
|
-
<div [class]="options?.htmlClass || ''">
|
|
9976
|
-
<root-widget
|
|
9977
|
-
[dataIndex]="dataIndex()"
|
|
9978
|
-
[layoutIndex]="layoutIndex()"
|
|
9979
|
-
[layout]="layoutNode().items"></root-widget>
|
|
9980
|
-
</div>`,
|
|
9981
|
-
}]
|
|
9982
|
-
}] });
|
|
9983
|
-
|
|
9984
9976
|
class TemplateComponent {
|
|
9985
9977
|
constructor() {
|
|
9986
9978
|
this.jsf = inject(JsonSchemaFormService);
|
|
@@ -10206,6 +10198,7 @@ class WidgetLibraryService {
|
|
|
10206
10198
|
'wizard': 'section', // TODO: Sequential panels with "Next" and "Previous" buttons
|
|
10207
10199
|
// Widgets included for compatibility with other libraries
|
|
10208
10200
|
'textline': 'text',
|
|
10201
|
+
'selectcheckbox': SelectCheckboxComponent,
|
|
10209
10202
|
// Recommended 3rd-party add-on widgets (TODO: create wrappers for these...)
|
|
10210
10203
|
// 'ng2-select': Select control replacement - http://valor-software.com/ng2-select/
|
|
10211
10204
|
// 'flatpickr': Flatpickr date picker - https://github.com/chmln/flatpickr
|
|
@@ -10322,73 +10315,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
10322
10315
|
}]
|
|
10323
10316
|
}], ctorParameters: () => [] });
|
|
10324
10317
|
|
|
10325
|
-
const BASIC_WIDGETS = [
|
|
10326
|
-
AddReferenceComponent, OneOfComponent, ButtonComponent, CheckboxComponent,
|
|
10327
|
-
CheckboxesComponent, FileComponent, HiddenComponent, InputComponent,
|
|
10328
|
-
MessageComponent, NoneComponent, NumberComponent, RadiosComponent,
|
|
10329
|
-
RootComponent, SectionComponent, SelectComponent, SelectFrameworkComponent,
|
|
10330
|
-
SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent,
|
|
10331
|
-
TemplateComponent, TextareaComponent
|
|
10332
|
-
];
|
|
10333
|
-
|
|
10334
|
-
class WidgetLibraryModule {
|
|
10335
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
10336
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, declarations: [AddReferenceComponent, OneOfComponent, ButtonComponent, CheckboxComponent, CheckboxesComponent, FileComponent, HiddenComponent, InputComponent, MessageComponent, NoneComponent, NumberComponent, RadiosComponent, RootComponent, SectionComponent, SelectComponent, SelectFrameworkComponent, SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent, TemplateComponent, TextareaComponent, OrderableDirective, ElementAttributeDirective], imports: [CommonModule, FormsModule, ReactiveFormsModule, i2$1.SortablejsModule], exports: [AddReferenceComponent, OneOfComponent, ButtonComponent, CheckboxComponent, CheckboxesComponent, FileComponent, HiddenComponent, InputComponent, MessageComponent, NoneComponent, NumberComponent, RadiosComponent, RootComponent, SectionComponent, SelectComponent, SelectFrameworkComponent, SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent, TemplateComponent, TextareaComponent, OrderableDirective, ElementAttributeDirective] }); }
|
|
10337
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
|
|
10338
|
-
SortablejsModule.forRoot({
|
|
10339
|
-
//disabled:false,
|
|
10340
|
-
//draggable:".draggableitem",//">:not(.nonsort)",//">.draggable-item",//":not(.nonsort)",//">*",//":not(.nonsort)",//":not(.non-draggable)",
|
|
10341
|
-
filter: ".sortable-filter", //needed to disable dragging on input range elements, class needs to be added to the element or its parent
|
|
10342
|
-
preventOnFilter: false, //needed for input range elements slider do still work
|
|
10343
|
-
onMove: function (/**Event*/ evt, /**Event*/ originalEvent) {
|
|
10344
|
-
if (evt.related.classList.contains("sortable-fixed")) {
|
|
10345
|
-
//console.log(evt.related);
|
|
10346
|
-
return false;
|
|
10347
|
-
}
|
|
10348
|
-
}
|
|
10349
|
-
})] }); }
|
|
10350
|
-
}
|
|
10351
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, decorators: [{
|
|
10352
|
-
type: NgModule,
|
|
10353
|
-
args: [{
|
|
10354
|
-
imports: [CommonModule, FormsModule, ReactiveFormsModule,
|
|
10355
|
-
SortablejsModule.forRoot({
|
|
10356
|
-
//disabled:false,
|
|
10357
|
-
//draggable:".draggableitem",//">:not(.nonsort)",//">.draggable-item",//":not(.nonsort)",//">*",//":not(.nonsort)",//":not(.non-draggable)",
|
|
10358
|
-
filter: ".sortable-filter", //needed to disable dragging on input range elements, class needs to be added to the element or its parent
|
|
10359
|
-
preventOnFilter: false, //needed for input range elements slider do still work
|
|
10360
|
-
onMove: function (/**Event*/ evt, /**Event*/ originalEvent) {
|
|
10361
|
-
if (evt.related.classList.contains("sortable-fixed")) {
|
|
10362
|
-
//console.log(evt.related);
|
|
10363
|
-
return false;
|
|
10364
|
-
}
|
|
10365
|
-
}
|
|
10366
|
-
})],
|
|
10367
|
-
declarations: [...BASIC_WIDGETS, OrderableDirective, ElementAttributeDirective],
|
|
10368
|
-
exports: [...BASIC_WIDGETS, OrderableDirective, ElementAttributeDirective]
|
|
10369
|
-
}]
|
|
10370
|
-
}] });
|
|
10371
|
-
|
|
10372
|
-
// No framework - plain HTML controls (styles from form layout only)
|
|
10373
|
-
class NoFrameworkModule {
|
|
10374
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
10375
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, declarations: [NoFrameworkComponent], imports: [CommonModule, WidgetLibraryModule], exports: [NoFrameworkComponent] }); }
|
|
10376
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, providers: [
|
|
10377
|
-
{ provide: Framework, useClass: NoFramework, multi: true }
|
|
10378
|
-
], imports: [CommonModule, WidgetLibraryModule] }); }
|
|
10379
|
-
}
|
|
10380
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, decorators: [{
|
|
10381
|
-
type: NgModule,
|
|
10382
|
-
args: [{
|
|
10383
|
-
imports: [CommonModule, WidgetLibraryModule],
|
|
10384
|
-
declarations: [NoFrameworkComponent],
|
|
10385
|
-
exports: [NoFrameworkComponent],
|
|
10386
|
-
providers: [
|
|
10387
|
-
{ provide: Framework, useClass: NoFramework, multi: true }
|
|
10388
|
-
]
|
|
10389
|
-
}]
|
|
10390
|
-
}] });
|
|
10391
|
-
|
|
10392
10318
|
// Possible future frameworks:
|
|
10393
10319
|
// - Foundation 6:
|
|
10394
10320
|
// http://justindavis.co/2017/06/15/using-foundation-6-in-angular-4/
|
|
@@ -10554,6 +10480,283 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
10554
10480
|
args: [Framework]
|
|
10555
10481
|
}] }] });
|
|
10556
10482
|
|
|
10483
|
+
//component created as a fallback for the checkbox/sortabljs issue
|
|
10484
|
+
//its meant to display a select as a checkbox
|
|
10485
|
+
class SelectCheckboxComponent {
|
|
10486
|
+
constructor() {
|
|
10487
|
+
this.jsf = inject(JsonSchemaFormService);
|
|
10488
|
+
this.jsfFLService = inject(FrameworkLibraryService);
|
|
10489
|
+
this.controlDisabled = false;
|
|
10490
|
+
this.boundControl = false;
|
|
10491
|
+
this.selectList = [];
|
|
10492
|
+
this.selectListFlatGroup = [];
|
|
10493
|
+
this.isArray = isArray;
|
|
10494
|
+
this.layoutNode = input(undefined);
|
|
10495
|
+
this.layoutIndex = input(undefined);
|
|
10496
|
+
this.dataIndex = input(undefined);
|
|
10497
|
+
this.frameworkStyles = {
|
|
10498
|
+
daisyui: { selectClass: "select-box", optionClass: "checkbox tw:dui-checkbox", optionChecked: "active", optionUnchecked: "" },
|
|
10499
|
+
"bootstrap-3": { selectClass: "select-box", optionClass: "bs3-option checkbox display-inline-block", optionChecked: "active", optionUnchecked: "" },
|
|
10500
|
+
"bootstrap-4": { selectClass: "select-box", optionClass: "bs4-option checkbox display-inline-block", optionChecked: "active", optionUnchecked: "" },
|
|
10501
|
+
"bootstrap-5": { selectClass: " select-box", optionClass: "form-check-input display-inline-block", optionChecked: "active", optionUnchecked: "" },
|
|
10502
|
+
//"material-design":{selectClass:" ",optionClass:" "}
|
|
10503
|
+
};
|
|
10504
|
+
}
|
|
10505
|
+
ngOnInit() {
|
|
10506
|
+
this.options = this.layoutNode().options || {};
|
|
10507
|
+
this.activeFramework = this.jsfFLService.activeFramework.name;
|
|
10508
|
+
this.selectList = buildTitleMap(
|
|
10509
|
+
//this.options.titleMap || this.options.enumNames,
|
|
10510
|
+
//TODO review-title is set to null in the setTitle() method of CssFrameworkComponent
|
|
10511
|
+
this.options.enumNames || (this.options?.title && [this.options?.title])
|
|
10512
|
+
|| [this.layoutNode().name],
|
|
10513
|
+
//this.options.enum,
|
|
10514
|
+
[true],
|
|
10515
|
+
//make required true to avoid creating 'none' select option
|
|
10516
|
+
true, !!this.options.flatList);
|
|
10517
|
+
//the selectListFlatGroup array will be used to update the formArray values
|
|
10518
|
+
//while the selectList array will be bound to the form select
|
|
10519
|
+
//as either a grouped select or a flat select
|
|
10520
|
+
/*
|
|
10521
|
+
this.selectListFlatGroup = buildTitleMap(
|
|
10522
|
+
this.options.titleMap || this.options.enumNames,
|
|
10523
|
+
this.options.enum, !!this.options.required, true
|
|
10524
|
+
)
|
|
10525
|
+
*/
|
|
10526
|
+
this.jsf.initializeControl(this);
|
|
10527
|
+
this.selectValue = [this.controlValue];
|
|
10528
|
+
}
|
|
10529
|
+
deselectAll() {
|
|
10530
|
+
this.selectListFlatGroup.forEach(selItem => {
|
|
10531
|
+
selItem.checked = false;
|
|
10532
|
+
});
|
|
10533
|
+
}
|
|
10534
|
+
updateValue(event) {
|
|
10535
|
+
this.options.showErrors = true;
|
|
10536
|
+
this.controlValue = this.selectValue[0];
|
|
10537
|
+
this.jsf.updateValue(this, this.controlValue);
|
|
10538
|
+
}
|
|
10539
|
+
onSelectClicked($event) {
|
|
10540
|
+
this.selectValue = this.selectValue && this.selectValue[0] ? [false] : [true];
|
|
10541
|
+
this.controlValue = this.selectValue[0];
|
|
10542
|
+
this.jsf.updateValue(this, this.controlValue);
|
|
10543
|
+
}
|
|
10544
|
+
ngOnDestroy() {
|
|
10545
|
+
let nullVal = this.options.multiple ? [null] : null;
|
|
10546
|
+
this.formControl.reset(nullVal);
|
|
10547
|
+
this.controlValue = null;
|
|
10548
|
+
}
|
|
10549
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10550
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: SelectCheckboxComponent, selector: "selectcheckbox-widget", inputs: { layoutNode: { classPropertyName: "layoutNode", publicName: "layoutNode", isSignal: true, isRequired: false, transformFunction: null }, layoutIndex: { classPropertyName: "layoutIndex", publicName: "layoutIndex", isSignal: true, isRequired: false, transformFunction: null }, dataIndex: { classPropertyName: "dataIndex", publicName: "dataIndex", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
10551
|
+
<div
|
|
10552
|
+
[class]="options?.htmlClass || ''">
|
|
10553
|
+
<select *ngIf="boundControl"
|
|
10554
|
+
[attr.aria-describedby]="'control' + layoutNode()?._id + 'Status'"
|
|
10555
|
+
[attr.readonly]="options?.readonly ? 'readonly' : null"
|
|
10556
|
+
[attr.required]="options?.required"
|
|
10557
|
+
[class]=" frameworkStyles[activeFramework].selectClass"
|
|
10558
|
+
[multiple]="true"
|
|
10559
|
+
[id]="'control' + layoutNode()?._id"
|
|
10560
|
+
[name]="controlName"
|
|
10561
|
+
[ngModel]="selectValue"
|
|
10562
|
+
>
|
|
10563
|
+
<ng-template ngFor let-selectItem [ngForOf]="selectList">
|
|
10564
|
+
<option *ngIf="!isArray(selectItem?.items)"
|
|
10565
|
+
[class]="frameworkStyles[activeFramework].optionClass"
|
|
10566
|
+
[class.active]="selectItem?.value === controlValue"
|
|
10567
|
+
[class.unchecked-notusing]="selectItem?.value != controlValue"
|
|
10568
|
+
[value]="selectItem?.value"
|
|
10569
|
+
(click)="onSelectClicked($event)"
|
|
10570
|
+
type="checkbox"
|
|
10571
|
+
>
|
|
10572
|
+
</option>
|
|
10573
|
+
<!--NB the text is out of the option element to display besides the checkbox-->
|
|
10574
|
+
<span [innerHTML]="selectItem?.name"></span>
|
|
10575
|
+
</ng-template>
|
|
10576
|
+
</select>
|
|
10577
|
+
<select *ngIf="!boundControl"
|
|
10578
|
+
[attr.aria-describedby]="'control' + layoutNode()?._id + 'Status'"
|
|
10579
|
+
[attr.readonly]="options?.readonly ? 'readonly' : null"
|
|
10580
|
+
[attr.required]="options?.required"
|
|
10581
|
+
[class]="frameworkStyles[activeFramework].selectClass +' select-box'"
|
|
10582
|
+
[multiple]="true"
|
|
10583
|
+
[disabled]="controlDisabled"
|
|
10584
|
+
[id]="'control' + layoutNode()?._id"
|
|
10585
|
+
[name]="controlName"
|
|
10586
|
+
(change)="updateValue($event)">
|
|
10587
|
+
<ng-template ngFor let-selectItem [ngForOf]="selectList">
|
|
10588
|
+
<option *ngIf="!isArray(selectItem?.items)"
|
|
10589
|
+
[selected]="selectItem?.value === controlValue"
|
|
10590
|
+
[class]="frameworkStyles[activeFramework].optionClass"
|
|
10591
|
+
[class.checked-notusing]="selectItem?.value === controlValue"
|
|
10592
|
+
[class.unchecked-notusing]]="selectItem?.value != controlValue"
|
|
10593
|
+
[value]="selectItem?.value"
|
|
10594
|
+
type="checkbox">
|
|
10595
|
+
</option>
|
|
10596
|
+
<!--NB the text is out of the option element to display besides the checkbox-->
|
|
10597
|
+
<span [innerHTML]="selectItem?.name"></span>
|
|
10598
|
+
</ng-template>
|
|
10599
|
+
</select>
|
|
10600
|
+
|
|
10601
|
+
</div>`, isInline: true, styles: [".select-box{font-size:16px;border:none;appearance:none;-webkit-appearance:none;-moz-appearance:none;height:25px;overflow:hidden;text-overflow:ellipsis;background-color:#fff;color:#000;background-color:transparent}.select-box:focus{outline:none}.select-option{font-size:20px;color:#000;background-color:#fff;display:inline-block}.unchecked:before{content:\"\\2610\";left:5px;top:50%;transform:translateY(-50%);font-size:30px}.checked:before{content:\"\\2611\";left:5px;top:50%;transform:translateY(-50%);font-size:30px}.select-option:checked{background-image:linear-gradient(0deg,#fff 0% 100%);color:#000}.select-box[multiple]:focus{background-color:transparent;color:#00f;-webkit-text-fill-color:black}.display-inline-block{display:inline-block}.bs4-option,.bs3-option{width:14px;height:14px;border:solid 1px;color:#a9a9a9;min-block-size:auto;border-radius:3px}.bs4-option:checked[type=checkbox],.bs3-option:checked[type=checkbox]{background-image:url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20jaynewey%3A%20https%3A%2F%2Fgithub.com%2Fjaynewey%2Fcharm-icons%20--%3E%3Csvg%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222.5%22%3E%3Cpolyline%20points%3D%224%208.75%2C6.25%2012.25%2C13.25%203.5%22%2F%3E%3C%2Fsvg%3E);background-color:#00ced1}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
10602
|
+
}
|
|
10603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectCheckboxComponent, decorators: [{
|
|
10604
|
+
type: Component,
|
|
10605
|
+
args: [{ selector: 'selectcheckbox-widget', template: `
|
|
10606
|
+
<div
|
|
10607
|
+
[class]="options?.htmlClass || ''">
|
|
10608
|
+
<select *ngIf="boundControl"
|
|
10609
|
+
[attr.aria-describedby]="'control' + layoutNode()?._id + 'Status'"
|
|
10610
|
+
[attr.readonly]="options?.readonly ? 'readonly' : null"
|
|
10611
|
+
[attr.required]="options?.required"
|
|
10612
|
+
[class]=" frameworkStyles[activeFramework].selectClass"
|
|
10613
|
+
[multiple]="true"
|
|
10614
|
+
[id]="'control' + layoutNode()?._id"
|
|
10615
|
+
[name]="controlName"
|
|
10616
|
+
[ngModel]="selectValue"
|
|
10617
|
+
>
|
|
10618
|
+
<ng-template ngFor let-selectItem [ngForOf]="selectList">
|
|
10619
|
+
<option *ngIf="!isArray(selectItem?.items)"
|
|
10620
|
+
[class]="frameworkStyles[activeFramework].optionClass"
|
|
10621
|
+
[class.active]="selectItem?.value === controlValue"
|
|
10622
|
+
[class.unchecked-notusing]="selectItem?.value != controlValue"
|
|
10623
|
+
[value]="selectItem?.value"
|
|
10624
|
+
(click)="onSelectClicked($event)"
|
|
10625
|
+
type="checkbox"
|
|
10626
|
+
>
|
|
10627
|
+
</option>
|
|
10628
|
+
<!--NB the text is out of the option element to display besides the checkbox-->
|
|
10629
|
+
<span [innerHTML]="selectItem?.name"></span>
|
|
10630
|
+
</ng-template>
|
|
10631
|
+
</select>
|
|
10632
|
+
<select *ngIf="!boundControl"
|
|
10633
|
+
[attr.aria-describedby]="'control' + layoutNode()?._id + 'Status'"
|
|
10634
|
+
[attr.readonly]="options?.readonly ? 'readonly' : null"
|
|
10635
|
+
[attr.required]="options?.required"
|
|
10636
|
+
[class]="frameworkStyles[activeFramework].selectClass +' select-box'"
|
|
10637
|
+
[multiple]="true"
|
|
10638
|
+
[disabled]="controlDisabled"
|
|
10639
|
+
[id]="'control' + layoutNode()?._id"
|
|
10640
|
+
[name]="controlName"
|
|
10641
|
+
(change)="updateValue($event)">
|
|
10642
|
+
<ng-template ngFor let-selectItem [ngForOf]="selectList">
|
|
10643
|
+
<option *ngIf="!isArray(selectItem?.items)"
|
|
10644
|
+
[selected]="selectItem?.value === controlValue"
|
|
10645
|
+
[class]="frameworkStyles[activeFramework].optionClass"
|
|
10646
|
+
[class.checked-notusing]="selectItem?.value === controlValue"
|
|
10647
|
+
[class.unchecked-notusing]]="selectItem?.value != controlValue"
|
|
10648
|
+
[value]="selectItem?.value"
|
|
10649
|
+
type="checkbox">
|
|
10650
|
+
</option>
|
|
10651
|
+
<!--NB the text is out of the option element to display besides the checkbox-->
|
|
10652
|
+
<span [innerHTML]="selectItem?.name"></span>
|
|
10653
|
+
</ng-template>
|
|
10654
|
+
</select>
|
|
10655
|
+
|
|
10656
|
+
</div>`, standalone: false, styles: [".select-box{font-size:16px;border:none;appearance:none;-webkit-appearance:none;-moz-appearance:none;height:25px;overflow:hidden;text-overflow:ellipsis;background-color:#fff;color:#000;background-color:transparent}.select-box:focus{outline:none}.select-option{font-size:20px;color:#000;background-color:#fff;display:inline-block}.unchecked:before{content:\"\\2610\";left:5px;top:50%;transform:translateY(-50%);font-size:30px}.checked:before{content:\"\\2611\";left:5px;top:50%;transform:translateY(-50%);font-size:30px}.select-option:checked{background-image:linear-gradient(0deg,#fff 0% 100%);color:#000}.select-box[multiple]:focus{background-color:transparent;color:#00f;-webkit-text-fill-color:black}.display-inline-block{display:inline-block}.bs4-option,.bs3-option{width:14px;height:14px;border:solid 1px;color:#a9a9a9;min-block-size:auto;border-radius:3px}.bs4-option:checked[type=checkbox],.bs3-option:checked[type=checkbox]{background-image:url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20jaynewey%3A%20https%3A%2F%2Fgithub.com%2Fjaynewey%2Fcharm-icons%20--%3E%3Csvg%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222.5%22%3E%3Cpolyline%20points%3D%224%208.75%2C6.25%2012.25%2C13.25%203.5%22%2F%3E%3C%2Fsvg%3E);background-color:#00ced1}\n"] }]
|
|
10657
|
+
}] });
|
|
10658
|
+
|
|
10659
|
+
class TabComponent {
|
|
10660
|
+
constructor() {
|
|
10661
|
+
this.jsf = inject(JsonSchemaFormService);
|
|
10662
|
+
this.layoutNode = input(undefined);
|
|
10663
|
+
this.layoutIndex = input(undefined);
|
|
10664
|
+
this.dataIndex = input(undefined);
|
|
10665
|
+
}
|
|
10666
|
+
ngOnInit() {
|
|
10667
|
+
this.options = this.layoutNode().options || {};
|
|
10668
|
+
}
|
|
10669
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10670
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TabComponent, selector: "tab-widget", inputs: { layoutNode: { classPropertyName: "layoutNode", publicName: "layoutNode", isSignal: true, isRequired: false, transformFunction: null }, layoutIndex: { classPropertyName: "layoutIndex", publicName: "layoutIndex", isSignal: true, isRequired: false, transformFunction: null }, dataIndex: { classPropertyName: "dataIndex", publicName: "dataIndex", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
10671
|
+
<div [class]="options?.htmlClass || ''">
|
|
10672
|
+
<root-widget
|
|
10673
|
+
[dataIndex]="dataIndex()"
|
|
10674
|
+
[layoutIndex]="layoutIndex()"
|
|
10675
|
+
[layout]="layoutNode().items"></root-widget>
|
|
10676
|
+
</div>`, isInline: true, dependencies: [{ kind: "component", type: RootComponent, selector: "root-widget", inputs: ["dataIndex", "layoutIndex", "layout", "isOrderable", "isFlexItem"] }] }); }
|
|
10677
|
+
}
|
|
10678
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, decorators: [{
|
|
10679
|
+
type: Component,
|
|
10680
|
+
args: [{
|
|
10681
|
+
// tslint:disable-next-line:component-selector
|
|
10682
|
+
selector: 'tab-widget',
|
|
10683
|
+
template: `
|
|
10684
|
+
<div [class]="options?.htmlClass || ''">
|
|
10685
|
+
<root-widget
|
|
10686
|
+
[dataIndex]="dataIndex()"
|
|
10687
|
+
[layoutIndex]="layoutIndex()"
|
|
10688
|
+
[layout]="layoutNode().items"></root-widget>
|
|
10689
|
+
</div>`,
|
|
10690
|
+
}]
|
|
10691
|
+
}] });
|
|
10692
|
+
|
|
10693
|
+
const BASIC_WIDGETS = [
|
|
10694
|
+
AddReferenceComponent, OneOfComponent, ButtonComponent, CheckboxComponent,
|
|
10695
|
+
CheckboxesComponent, FileComponent, HiddenComponent, InputComponent,
|
|
10696
|
+
MessageComponent, NoneComponent, NumberComponent, RadiosComponent,
|
|
10697
|
+
RootComponent, SectionComponent, SelectComponent, SelectFrameworkComponent,
|
|
10698
|
+
SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent,
|
|
10699
|
+
TemplateComponent, TextareaComponent, SelectCheckboxComponent
|
|
10700
|
+
];
|
|
10701
|
+
|
|
10702
|
+
class WidgetLibraryModule {
|
|
10703
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
10704
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, declarations: [AddReferenceComponent, OneOfComponent, ButtonComponent, CheckboxComponent, CheckboxesComponent, FileComponent, HiddenComponent, InputComponent, MessageComponent, NoneComponent, NumberComponent, RadiosComponent, RootComponent, SectionComponent, SelectComponent, SelectFrameworkComponent, SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent, TemplateComponent, TextareaComponent, SelectCheckboxComponent, OrderableDirective, ElementAttributeDirective], imports: [CommonModule, FormsModule, ReactiveFormsModule, i2$1.SortablejsModule], exports: [AddReferenceComponent, OneOfComponent, ButtonComponent, CheckboxComponent, CheckboxesComponent, FileComponent, HiddenComponent, InputComponent, MessageComponent, NoneComponent, NumberComponent, RadiosComponent, RootComponent, SectionComponent, SelectComponent, SelectFrameworkComponent, SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent, TemplateComponent, TextareaComponent, SelectCheckboxComponent, OrderableDirective, ElementAttributeDirective] }); }
|
|
10705
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
|
|
10706
|
+
SortablejsModule.forRoot({
|
|
10707
|
+
//disabled:false,
|
|
10708
|
+
//draggable:".draggableitem",//">:not(.nonsort)",//">.draggable-item",//":not(.nonsort)",//">*",//":not(.nonsort)",//":not(.non-draggable)",
|
|
10709
|
+
filter: ".sortable-filter", //needed to disable dragging on input range elements, class needs to be added to the element or its parent
|
|
10710
|
+
preventOnFilter: false, //needed for input range elements slider do still work
|
|
10711
|
+
onMove: function (/**Event*/ evt, /**Event*/ originalEvent) {
|
|
10712
|
+
if (evt.related.classList.contains("sortable-fixed")) {
|
|
10713
|
+
//console.log(evt.related);
|
|
10714
|
+
return false;
|
|
10715
|
+
}
|
|
10716
|
+
}
|
|
10717
|
+
})] }); }
|
|
10718
|
+
}
|
|
10719
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetLibraryModule, decorators: [{
|
|
10720
|
+
type: NgModule,
|
|
10721
|
+
args: [{
|
|
10722
|
+
imports: [CommonModule, FormsModule, ReactiveFormsModule,
|
|
10723
|
+
SortablejsModule.forRoot({
|
|
10724
|
+
//disabled:false,
|
|
10725
|
+
//draggable:".draggableitem",//">:not(.nonsort)",//">.draggable-item",//":not(.nonsort)",//">*",//":not(.nonsort)",//":not(.non-draggable)",
|
|
10726
|
+
filter: ".sortable-filter", //needed to disable dragging on input range elements, class needs to be added to the element or its parent
|
|
10727
|
+
preventOnFilter: false, //needed for input range elements slider do still work
|
|
10728
|
+
onMove: function (/**Event*/ evt, /**Event*/ originalEvent) {
|
|
10729
|
+
if (evt.related.classList.contains("sortable-fixed")) {
|
|
10730
|
+
//console.log(evt.related);
|
|
10731
|
+
return false;
|
|
10732
|
+
}
|
|
10733
|
+
}
|
|
10734
|
+
})],
|
|
10735
|
+
declarations: [...BASIC_WIDGETS, OrderableDirective, ElementAttributeDirective],
|
|
10736
|
+
exports: [...BASIC_WIDGETS, OrderableDirective, ElementAttributeDirective]
|
|
10737
|
+
}]
|
|
10738
|
+
}] });
|
|
10739
|
+
|
|
10740
|
+
// No framework - plain HTML controls (styles from form layout only)
|
|
10741
|
+
class NoFrameworkModule {
|
|
10742
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
10743
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, declarations: [NoFrameworkComponent], imports: [CommonModule, WidgetLibraryModule], exports: [NoFrameworkComponent] }); }
|
|
10744
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, providers: [
|
|
10745
|
+
{ provide: Framework, useClass: NoFramework, multi: true }
|
|
10746
|
+
], imports: [CommonModule, WidgetLibraryModule] }); }
|
|
10747
|
+
}
|
|
10748
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NoFrameworkModule, decorators: [{
|
|
10749
|
+
type: NgModule,
|
|
10750
|
+
args: [{
|
|
10751
|
+
imports: [CommonModule, WidgetLibraryModule],
|
|
10752
|
+
declarations: [NoFrameworkComponent],
|
|
10753
|
+
exports: [NoFrameworkComponent],
|
|
10754
|
+
providers: [
|
|
10755
|
+
{ provide: Framework, useClass: NoFramework, multi: true }
|
|
10756
|
+
]
|
|
10757
|
+
}]
|
|
10758
|
+
}] });
|
|
10759
|
+
|
|
10557
10760
|
const JSON_SCHEMA_FORM_VALUE_ACCESSOR = {
|
|
10558
10761
|
provide: NG_VALUE_ACCESSOR,
|
|
10559
10762
|
useExisting: forwardRef(() => JsonSchemaFormComponent),
|
|
@@ -11341,5 +11544,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
11341
11544
|
* Generated bundle index. Do not edit.
|
|
11342
11545
|
*/
|
|
11343
11546
|
|
|
11344
|
-
export { AddReferenceComponent, BASIC_WIDGETS, ButtonComponent, CheckboxComponent, CheckboxesComponent, ElementAttributeDirective, FileComponent, Framework, FrameworkLibraryService, HiddenComponent, InputComponent, JsonPointer, JsonSchemaFormComponent, JsonSchemaFormModule, JsonSchemaFormService, JsonValidators, MessageComponent, NoneComponent, NumberComponent, OneOfComponent, OrderableDirective, RadiosComponent, RootComponent, SectionComponent, SelectComponent, SelectFrameworkComponent, SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent, TemplateComponent, TextareaComponent, WidgetLibraryModule, WidgetLibraryService, _executeAsyncValidators, _executeValidators, _mergeErrors, _mergeObjects, _toPromise, addClasses, buildFormGroup, buildFormGroupTemplate, buildLayout, buildLayoutFromSchema, buildSchemaFromData, buildSchemaFromLayout, buildTitleMap, checkInlineType, combineAllOf, commonItems, convertSchemaToDraft6, copy, deValidationMessages, enValidationMessages, esValidationMessages, fixRequiredArrayProperties, fixTitle, forEach, forEachCopy, formatFormData, frValidationMessages, getControl, getControlValidators, getFromSchema, getInputType, getLayoutNode, getSubSchema, getTitleMapFromOneOf, getType, hasNonNullValue, hasOwn, hasValue, inArray, isArray, isBoolean, isDate, isDefined, isEmpty, isFunction, isInputRequired, isInteger, isMap, isNumber, isObject, isObservable, isPrimitive, isPromise, isSet, isString, isType, itValidationMessages, mapLayout, mergeFilteredObject, mergeSchemas, path2ControlKey, ptValidationMessages, removeRecursiveReferences, resolveSchemaReferences, setControl, setRequiredFields, toJavaScriptType, toObservable, toSchemaType, toTitleCase, uniqueItems, updateInputOptions, xor, zhValidationMessages };
|
|
11547
|
+
export { AddReferenceComponent, BASIC_WIDGETS, ButtonComponent, CheckboxComponent, CheckboxesComponent, ElementAttributeDirective, FileComponent, Framework, FrameworkLibraryService, HiddenComponent, InputComponent, JsonPointer, JsonSchemaFormComponent, JsonSchemaFormModule, JsonSchemaFormService, JsonValidators, MessageComponent, NoneComponent, NumberComponent, OneOfComponent, OrderableDirective, RadiosComponent, RootComponent, SectionComponent, SelectCheckboxComponent, SelectComponent, SelectFrameworkComponent, SelectWidgetComponent, SubmitComponent, TabComponent, TabsComponent, TemplateComponent, TextareaComponent, WidgetLibraryModule, WidgetLibraryService, _executeAsyncValidators, _executeValidators, _mergeErrors, _mergeObjects, _toPromise, addClasses, buildFormGroup, buildFormGroupTemplate, buildLayout, buildLayoutFromSchema, buildSchemaFromData, buildSchemaFromLayout, buildTitleMap, checkInlineType, combineAllOf, commonItems, convertSchemaToDraft6, copy, deValidationMessages, enValidationMessages, esValidationMessages, fixRequiredArrayProperties, fixTitle, forEach, forEachCopy, formatFormData, frValidationMessages, getControl, getControlValidators, getFromSchema, getInputType, getLayoutNode, getSubSchema, getTitleMapFromOneOf, getType, hasNonNullValue, hasOwn, hasValue, inArray, isArray, isBoolean, isDate, isDefined, isEmpty, isFunction, isInputRequired, isInteger, isMap, isNumber, isObject, isObservable, isPrimitive, isPromise, isSet, isString, isType, itValidationMessages, mapLayout, mergeFilteredObject, mergeSchemas, path2ControlKey, ptValidationMessages, removeRecursiveReferences, resolveSchemaReferences, setControl, setRequiredFields, toJavaScriptType, toObservable, toSchemaType, toTitleCase, uniqueItems, updateInputOptions, xor, zhValidationMessages };
|
|
11345
11548
|
//# sourceMappingURL=ng-formworks-core.mjs.map
|