impaktapps-ui-builder 0.0.101-alpha.27 → 0.0.101-alpha.29
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/dist/impaktapps-ui-builder.es.js +78 -112
- package/dist/impaktapps-ui-builder.es.js.map +1 -1
- package/dist/impaktapps-ui-builder.umd.js +9 -9
- package/dist/impaktapps-ui-builder.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts +1 -1
- package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +3 -2
- package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +1 -1
- package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.ts +11 -11
- package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts +31 -173
- package/src/impaktapps-ui-builder/builder/services/component.ts +31 -31
|
@@ -365,7 +365,7 @@ const PageMasterUiSchema = (theme) => {
|
|
|
365
365
|
elements: [
|
|
366
366
|
{
|
|
367
367
|
accessorKey: "eventType",
|
|
368
|
-
header: "Event Type",
|
|
368
|
+
header: "Event's Type",
|
|
369
369
|
size: 300,
|
|
370
370
|
type: "string"
|
|
371
371
|
},
|
|
@@ -7056,8 +7056,9 @@ const componentBasicUiSchema = (theme) => {
|
|
|
7056
7056
|
width: "100%",
|
|
7057
7057
|
fontSize: "10px",
|
|
7058
7058
|
color: theme.palette.grey[600],
|
|
7059
|
-
position: "
|
|
7060
|
-
bottom: "
|
|
7059
|
+
position: "fixed",
|
|
7060
|
+
bottom: "24px",
|
|
7061
|
+
backgroundColor: theme.palette.background.default,
|
|
7061
7062
|
borderBottom: `1px solid ${theme.palette.common.black}29`,
|
|
7062
7063
|
borderTop: `1px solid ${theme.palette.common.black}29`
|
|
7063
7064
|
}
|
|
@@ -7335,7 +7336,7 @@ const EventSection = (theme) => {
|
|
|
7335
7336
|
elements: [
|
|
7336
7337
|
{
|
|
7337
7338
|
accessorKey: "eventType",
|
|
7338
|
-
header: "Event Type",
|
|
7339
|
+
header: "Event's Type",
|
|
7339
7340
|
type: "string",
|
|
7340
7341
|
size: 300
|
|
7341
7342
|
},
|
|
@@ -8393,36 +8394,36 @@ function okHandler(store2) {
|
|
|
8393
8394
|
}
|
|
8394
8395
|
}
|
|
8395
8396
|
const sectionLabels = {
|
|
8396
|
-
Select: ["Core", "Properties", "Value", "
|
|
8397
|
-
MultipleSelect: ["Core", "Properties", "Value", "
|
|
8398
|
-
Table: ["Core", "Components", "Properties", "
|
|
8399
|
-
LeaderBoard: ["Core", "Components", "Properties", "
|
|
8397
|
+
Select: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
|
|
8398
|
+
MultipleSelect: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
|
|
8399
|
+
Table: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
|
|
8400
|
+
LeaderBoard: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
|
|
8400
8401
|
WrapperSection: ["Core", "Components", "Properties", "Style", "Validation"],
|
|
8401
8402
|
TabSection: ["Core", "Components", "Properties", "Style", "Validation"],
|
|
8402
|
-
SpeedoMeter: ["Core", "Properties", "
|
|
8403
|
-
card: ["Core", "Properties", "
|
|
8404
|
-
UploadFile: ["Core", "
|
|
8405
|
-
Graph: ["Core", "Properties", "
|
|
8406
|
-
DownloadFile: ["Core", "
|
|
8407
|
-
Box: ["Core", "
|
|
8408
|
-
Properties: ["Core", "Properties", "
|
|
8409
|
-
ProgressBarCard: ["Core", "Properties", "
|
|
8410
|
-
RankCard: ["Core", "Properties", "
|
|
8411
|
-
Slider: ["Core", "Components", "
|
|
8412
|
-
Timer: ["Core", "
|
|
8413
|
-
Rank: ["Core", "
|
|
8414
|
-
Button: ["Core", "Properties", "
|
|
8403
|
+
SpeedoMeter: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8404
|
+
card: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8405
|
+
UploadFile: ["Core", "Events", "Style", "Validation"],
|
|
8406
|
+
Graph: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8407
|
+
DownloadFile: ["Core", "Events", "Style", "Validation"],
|
|
8408
|
+
Box: ["Core", "Events", "Style", "Validation"],
|
|
8409
|
+
Properties: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8410
|
+
ProgressBarCard: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8411
|
+
RankCard: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8412
|
+
Slider: ["Core", "Components", "Events", "Style", "Validation"],
|
|
8413
|
+
Timer: ["Core", "Events", "Style", "Validation"],
|
|
8414
|
+
Rank: ["Core", "Events", "Style", "Validation"],
|
|
8415
|
+
Button: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8415
8416
|
Array: ["Core", "Components", "Validation"],
|
|
8416
|
-
Radio: ["Core", "Properties", "
|
|
8417
|
-
Text: ["Core", "Properties", "
|
|
8418
|
-
TextArea: ["Core", "Properties", "
|
|
8417
|
+
Radio: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8418
|
+
Text: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8419
|
+
TextArea: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8419
8420
|
PopUp: ["Core", "Components", "Properties", "Style"],
|
|
8420
|
-
Stepper: ["Core", "Components", "Properties", "
|
|
8421
|
-
DataGrid: ["Core", "Components", "Properties", "
|
|
8422
|
-
InputSlider: ["Core", "Properties", "
|
|
8423
|
-
TreeMap: ["Core", "Components", "Properties", "
|
|
8421
|
+
Stepper: ["Core", "Components", "Properties", "Events", "Style"],
|
|
8422
|
+
DataGrid: ["Core", "Components", "Properties", "Events", "Style"],
|
|
8423
|
+
InputSlider: ["Core", "Properties", "Events", "Style", "Validation"],
|
|
8424
|
+
TreeMap: ["Core", "Components", "Properties", "Events", "Style"],
|
|
8424
8425
|
ColumnGroup: ["Core", "Components"],
|
|
8425
|
-
Thought: ["Core", "Properties", "
|
|
8426
|
+
Thought: ["Core", "Properties", "Events", "Style", "Validation"]
|
|
8426
8427
|
};
|
|
8427
8428
|
function refreshPage(type, store2) {
|
|
8428
8429
|
var _a;
|
|
@@ -8432,13 +8433,13 @@ function refreshPage(type, store2) {
|
|
|
8432
8433
|
Core: CoreSection,
|
|
8433
8434
|
Value: ValueTab,
|
|
8434
8435
|
Style: StyleSection,
|
|
8435
|
-
|
|
8436
|
+
Events: EventSection(store2.theme.myTheme),
|
|
8436
8437
|
Components: TableSection(store2.theme.myTheme),
|
|
8437
8438
|
Properties: buildPropertiesSection(type),
|
|
8438
8439
|
Validation: ValidationSection
|
|
8439
8440
|
};
|
|
8440
8441
|
const elements = (_a = sectionLabels[type]) == null ? void 0 : _a.map((e) => sectionUiSchema[e]);
|
|
8441
|
-
UiSchema.elements[0].config.main.tabLabels = sectionLabels[type] || ["Core", "Style", "
|
|
8442
|
+
UiSchema.elements[0].config.main.tabLabels = sectionLabels[type] || ["Core", "Style", "Events", "Validation"];
|
|
8442
8443
|
UiSchema.elements[0].elements = elements || [CoreSection, StyleSection, EventSection(store2.theme.myTheme), ValidationSection];
|
|
8443
8444
|
}
|
|
8444
8445
|
if (sessionStorage.getItem("copiedConfig")) {
|
|
@@ -8603,15 +8604,15 @@ var Component = (store2, dynamicData2, submitHandler, service2) => {
|
|
|
8603
8604
|
const pastedElementPath = this.elementPathHandler(pastedElementParentPath, insertElementIndex, elementType);
|
|
8604
8605
|
const copiedConfig = JSON.parse(sessionStorage.getItem("copiedConfig"));
|
|
8605
8606
|
const notificationMessages = {
|
|
8606
|
-
|
|
8607
|
-
Component: "The component cannot be integrated into the
|
|
8607
|
+
Events: " The Events cannot be integrated into the component section.",
|
|
8608
|
+
Component: "The component cannot be integrated into the Events section."
|
|
8608
8609
|
};
|
|
8609
8610
|
if (copiedConfig.Handler && elementType === "Component") {
|
|
8610
8611
|
store2.setNotify({
|
|
8611
|
-
FailMessage: notificationMessages.
|
|
8612
|
+
FailMessage: notificationMessages.Events,
|
|
8612
8613
|
Fail: true
|
|
8613
8614
|
});
|
|
8614
|
-
} else if (copiedConfig.name && elementType === "
|
|
8615
|
+
} else if (copiedConfig.name && elementType === "Events") {
|
|
8615
8616
|
store2.setNotify({
|
|
8616
8617
|
FailMessage: notificationMessages.Component,
|
|
8617
8618
|
Fail: true
|
|
@@ -8789,18 +8790,18 @@ const EventSchema = {
|
|
|
8789
8790
|
eventType: {
|
|
8790
8791
|
type: "string",
|
|
8791
8792
|
oneOf: [
|
|
8792
|
-
{ title: "Click
|
|
8793
|
-
{ title: "Load
|
|
8794
|
-
{ title: "Change
|
|
8795
|
-
{ title: "Mount
|
|
8793
|
+
{ title: "Click", const: "onClick" },
|
|
8794
|
+
{ title: "Load", const: "onLoad" },
|
|
8795
|
+
{ title: "Change", const: "onChange" },
|
|
8796
|
+
{ title: "Mount", const: "onMount" },
|
|
8796
8797
|
{ title: "Success", const: "Success" },
|
|
8797
|
-
{ title: "
|
|
8798
|
-
{ title: "Cell
|
|
8799
|
-
{ title: "
|
|
8800
|
-
{ title: "Back
|
|
8801
|
-
{ title: "Next
|
|
8802
|
-
{ title: "
|
|
8803
|
-
{ title: "
|
|
8798
|
+
{ title: "Start", const: "onStart" },
|
|
8799
|
+
{ title: "Cell Render", const: "onCellRenderer" },
|
|
8800
|
+
{ title: "Upload", const: "onUpload" },
|
|
8801
|
+
{ title: "Back", const: "onBack" },
|
|
8802
|
+
{ title: "Next", const: "onNext" },
|
|
8803
|
+
{ title: "Row Movement", const: "onRowMovement" },
|
|
8804
|
+
{ title: "Download", const: "onDownload" },
|
|
8804
8805
|
{ title: "Fail", const: "Fail" }
|
|
8805
8806
|
]
|
|
8806
8807
|
},
|
|
@@ -8842,10 +8843,10 @@ const EventSchema = {
|
|
|
8842
8843
|
required: ["eventType", "Handler"]
|
|
8843
8844
|
};
|
|
8844
8845
|
const EventUiSchema = (theme) => {
|
|
8845
|
-
var _a
|
|
8846
|
+
var _a;
|
|
8846
8847
|
const uiSchema = {
|
|
8847
8848
|
type: "HorizontalLayout",
|
|
8848
|
-
heading: "Page-
|
|
8849
|
+
heading: "Page-Events",
|
|
8849
8850
|
elements: [
|
|
8850
8851
|
{
|
|
8851
8852
|
type: "TabLayout",
|
|
@@ -8979,7 +8980,7 @@ const EventUiSchema = (theme) => {
|
|
|
8979
8980
|
elements: [
|
|
8980
8981
|
{
|
|
8981
8982
|
accessorKey: "eventType",
|
|
8982
|
-
header: "Event Type",
|
|
8983
|
+
header: "Event's Type",
|
|
8983
8984
|
size: 300,
|
|
8984
8985
|
type: "string"
|
|
8985
8986
|
},
|
|
@@ -9243,6 +9244,30 @@ const EventUiSchema = (theme) => {
|
|
|
9243
9244
|
}
|
|
9244
9245
|
]
|
|
9245
9246
|
},
|
|
9247
|
+
{
|
|
9248
|
+
type: "Control",
|
|
9249
|
+
scope: "#/properties/pageName",
|
|
9250
|
+
options: {
|
|
9251
|
+
widget: "Box"
|
|
9252
|
+
},
|
|
9253
|
+
config: {
|
|
9254
|
+
layout: 12,
|
|
9255
|
+
main: {
|
|
9256
|
+
heading: ""
|
|
9257
|
+
},
|
|
9258
|
+
style: {
|
|
9259
|
+
paddingLeft: theme.spacing(3),
|
|
9260
|
+
width: "100%",
|
|
9261
|
+
fontSize: "10px",
|
|
9262
|
+
color: theme.palette.grey[600],
|
|
9263
|
+
position: "fixed",
|
|
9264
|
+
bottom: "24px",
|
|
9265
|
+
backgroundColor: theme.palette.background.default,
|
|
9266
|
+
borderBottom: `1px solid ${theme.palette.common.black}29`,
|
|
9267
|
+
borderTop: `1px solid ${theme.palette.common.black}29`
|
|
9268
|
+
}
|
|
9269
|
+
}
|
|
9270
|
+
},
|
|
9246
9271
|
{
|
|
9247
9272
|
type: "Control",
|
|
9248
9273
|
scope: "#/properties/notify",
|
|
@@ -9260,7 +9285,7 @@ const EventUiSchema = (theme) => {
|
|
|
9260
9285
|
style: {
|
|
9261
9286
|
flexDirection: "row",
|
|
9262
9287
|
position: "absolute",
|
|
9263
|
-
bottom:
|
|
9288
|
+
bottom: 10,
|
|
9264
9289
|
height: "fit-content",
|
|
9265
9290
|
overflow: "hidden",
|
|
9266
9291
|
zIndex: 1e3,
|
|
@@ -9279,78 +9304,19 @@ const EventUiSchema = (theme) => {
|
|
|
9279
9304
|
heading: "Copywriter@ACT21.IO"
|
|
9280
9305
|
},
|
|
9281
9306
|
style: {
|
|
9282
|
-
color: ((
|
|
9307
|
+
color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
|
|
9283
9308
|
fontSize: "11px",
|
|
9284
9309
|
textAlign: "center",
|
|
9285
|
-
lineHeight:
|
|
9310
|
+
lineHeight: 0,
|
|
9286
9311
|
width: "fit-content",
|
|
9287
9312
|
left: "50%",
|
|
9288
9313
|
position: "relative",
|
|
9289
|
-
margin:
|
|
9314
|
+
margin: "revert",
|
|
9290
9315
|
flexGrow: 1,
|
|
9291
9316
|
height: 0,
|
|
9292
9317
|
transform: "translate(-50%, 0%)"
|
|
9293
9318
|
}
|
|
9294
9319
|
}
|
|
9295
|
-
},
|
|
9296
|
-
{
|
|
9297
|
-
type: "Control",
|
|
9298
|
-
scope: "#/properties/FooterBackIcon",
|
|
9299
|
-
options: {
|
|
9300
|
-
widget: "Box"
|
|
9301
|
-
},
|
|
9302
|
-
config: {
|
|
9303
|
-
main: {
|
|
9304
|
-
iconName: "PrevIcon",
|
|
9305
|
-
onClick: "backHandler",
|
|
9306
|
-
width: "fit-content"
|
|
9307
|
-
},
|
|
9308
|
-
style: {
|
|
9309
|
-
fill: (_d = (_c = theme == null ? void 0 : theme.palette) == null ? void 0 : _c.primary) == null ? void 0 : _d.main,
|
|
9310
|
-
width: 20,
|
|
9311
|
-
height: 0,
|
|
9312
|
-
top: 0,
|
|
9313
|
-
right: { xs: "12px", sm: "84px" },
|
|
9314
|
-
position: "absolute",
|
|
9315
|
-
fontSize: "12px",
|
|
9316
|
-
cursor: "pointer",
|
|
9317
|
-
":hover": {
|
|
9318
|
-
fill: (_f = (_e = theme == null ? void 0 : theme.palette) == null ? void 0 : _e.primary) == null ? void 0 : _f.dark
|
|
9319
|
-
},
|
|
9320
|
-
marginRight: "20px"
|
|
9321
|
-
}
|
|
9322
|
-
}
|
|
9323
|
-
},
|
|
9324
|
-
{
|
|
9325
|
-
type: "Control",
|
|
9326
|
-
scope: "#/properties/FooterBackHandlerText",
|
|
9327
|
-
options: {
|
|
9328
|
-
widget: "Box"
|
|
9329
|
-
},
|
|
9330
|
-
config: {
|
|
9331
|
-
main: {
|
|
9332
|
-
heading: "Previous Page",
|
|
9333
|
-
onClick: "backHandler"
|
|
9334
|
-
},
|
|
9335
|
-
style: {
|
|
9336
|
-
display: { xs: "none", sm: "flex" },
|
|
9337
|
-
textAlign: "left",
|
|
9338
|
-
lineHeight: 1,
|
|
9339
|
-
height: 0,
|
|
9340
|
-
width: "fit-content",
|
|
9341
|
-
color: (_h = (_g = theme == null ? void 0 : theme.palette) == null ? void 0 : _g.primary) == null ? void 0 : _h.main,
|
|
9342
|
-
fontSize: "12px",
|
|
9343
|
-
cursor: "pointer",
|
|
9344
|
-
marginLeft: "2px",
|
|
9345
|
-
top: 3,
|
|
9346
|
-
right: "12px",
|
|
9347
|
-
position: "absolute",
|
|
9348
|
-
":hover": {
|
|
9349
|
-
color: (_j = (_i = theme == null ? void 0 : theme.palette) == null ? void 0 : _i.primary) == null ? void 0 : _j.dark
|
|
9350
|
-
},
|
|
9351
|
-
marginRight: "4px"
|
|
9352
|
-
}
|
|
9353
|
-
}
|
|
9354
9320
|
}
|
|
9355
9321
|
]
|
|
9356
9322
|
}
|