impaktapps-ui-builder 0.0.101-alpha.13 → 0.0.101-alpha.15

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.
Files changed (17) hide show
  1. package/dist/impaktapps-ui-builder.es.js +227 -130
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +7 -7
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/dist/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.d.ts +6 -0
  6. package/dist/src/impaktapps-ui-builder/builder/build/uischema/eventSection.d.ts +26 -33
  7. package/dist/src/impaktapps-ui-builder/builder/build/uischema/styleSection.d.ts +7 -8
  8. package/dist/src/impaktapps-ui-builder/builder/build/uischema/tableSection.d.ts +29 -33
  9. package/dist/src/impaktapps-ui-builder/builder/build/uischema/validationSections.d.ts +56 -37
  10. package/dist/src/impaktapps-ui-builder/builder/build/uischema/valueTab.d.ts +56 -36
  11. package/package.json +1 -1
  12. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +12 -7
  13. package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts +37 -15
  14. package/src/impaktapps-ui-builder/builder/build/uischema/styleSection.ts +9 -13
  15. package/src/impaktapps-ui-builder/builder/build/uischema/tableSection.ts +40 -18
  16. package/src/impaktapps-ui-builder/builder/build/uischema/validationSections.ts +117 -48
  17. package/src/impaktapps-ui-builder/builder/build/uischema/valueTab.ts +113 -43
package/dist/impaktapps-ui-builder.es.js CHANGED
@@ -7254,15 +7254,20 @@ const EventSection = (theme) => {
7254
7254
  },
7255
7255
  config: {
7256
7256
  main: {
7257
- color: "info",
7258
7257
  onClick: "eventAddHandler",
7259
7258
  size: "small",
7260
- icon: "AddIcon",
7261
- iconLabel: "Add New",
7259
+ icon: "TableAddIcon",
7260
+ iconLabel: "Add",
7262
7261
  styleDefault: true
7263
7262
  },
7264
7263
  style: {
7265
- mt: "6px"
7264
+ mt: "6px",
7265
+ color: "inherit",
7266
+ fill: "inherit",
7267
+ "&:hover": {
7268
+ color: "inherit",
7269
+ fill: "inherit"
7270
+ }
7266
7271
  }
7267
7272
  }
7268
7273
  }
@@ -7278,12 +7283,18 @@ const EventSection = (theme) => {
7278
7283
  main: {
7279
7284
  onClick: "copyPasteElement",
7280
7285
  size: "small",
7281
- icon: "PasteIcon",
7286
+ icon: "TablePaste",
7282
7287
  iconLabel: "Paste",
7283
7288
  styleDefault: true
7284
7289
  },
7285
7290
  style: {
7286
- mt: "6px"
7291
+ mt: "6px",
7292
+ color: "inherit",
7293
+ fill: "inherit",
7294
+ "&:hover": {
7295
+ color: "inherit",
7296
+ fill: "inherit"
7297
+ }
7287
7298
  }
7288
7299
  }
7289
7300
  }
@@ -7298,15 +7309,21 @@ const EventSection = (theme) => {
7298
7309
  elements: [
7299
7310
  {
7300
7311
  accessorKey: "eventType",
7301
- header: "Event Type"
7312
+ header: "Event Type",
7313
+ type: "string",
7314
+ size: 300
7302
7315
  },
7303
7316
  {
7304
7317
  accessorKey: "Handler",
7305
- header: "Handler"
7318
+ header: "Handler",
7319
+ type: "string",
7320
+ size: 200
7306
7321
  },
7307
7322
  {
7308
7323
  accessorKey: "Edit_Approve_Records",
7309
7324
  header: "Edit Widget",
7325
+ size: 150,
7326
+ type: "action",
7310
7327
  widget: {
7311
7328
  type: "Control",
7312
7329
  scope: "#/properties/Edit_Records",
@@ -7315,14 +7332,16 @@ const EventSection = (theme) => {
7315
7332
  },
7316
7333
  config: {
7317
7334
  main: {
7318
- color: "info",
7319
7335
  size: "small",
7320
- icon: "EditIcon",
7336
+ icon: "TableEditIcon",
7321
7337
  tooltipMessage: "Edit This Record",
7322
7338
  onClick: "eventEditHandler"
7323
7339
  },
7324
7340
  style: {
7325
- color: theme.palette.primary.main
7341
+ fill: theme.palette.primary.main,
7342
+ "& :hover": {
7343
+ fill: theme.palette.primary.dark
7344
+ }
7326
7345
  }
7327
7346
  }
7328
7347
  }
@@ -7330,6 +7349,8 @@ const EventSection = (theme) => {
7330
7349
  {
7331
7350
  accessorKey: "Reject_Records",
7332
7351
  header: "Delete",
7352
+ size: 150,
7353
+ type: "action",
7333
7354
  widget: {
7334
7355
  type: "Control",
7335
7356
  scope: "#/properties/RejectButton",
@@ -7339,10 +7360,15 @@ const EventSection = (theme) => {
7339
7360
  },
7340
7361
  config: {
7341
7362
  main: {
7342
- icon: "RejectIcon",
7343
- color: "error",
7363
+ icon: "Bin",
7344
7364
  tooltipMessage: "Reject This Record",
7345
7365
  onClick: "deletePopUpEvent"
7366
+ },
7367
+ style: {
7368
+ fill: theme.palette.primary.main,
7369
+ "& :hover": {
7370
+ fill: theme.palette.primary.dark
7371
+ }
7346
7372
  }
7347
7373
  }
7348
7374
  }
@@ -7350,7 +7376,8 @@ const EventSection = (theme) => {
7350
7376
  {
7351
7377
  header: "Copy",
7352
7378
  field: "Copy_Event",
7353
- flex: 1,
7379
+ size: 150,
7380
+ type: "action",
7354
7381
  widget: {
7355
7382
  type: "Control",
7356
7383
  scope: "#/properties/Copy_Event",
@@ -7492,7 +7519,7 @@ const getInputField = (scope, label) => {
7492
7519
  widget: "InputField"
7493
7520
  },
7494
7521
  config: {
7495
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7522
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7496
7523
  main: {
7497
7524
  label
7498
7525
  }
@@ -7507,7 +7534,7 @@ const getRadioInputField = (scope, label, options) => {
7507
7534
  widget: "RadioInputField"
7508
7535
  },
7509
7536
  config: {
7510
- layout: { xs: 12, sm: 6, md: 4, lg: 4 },
7537
+ layout: { xs: 12, sm: 6, md: 4, lg: 3 },
7511
7538
  main: {
7512
7539
  label,
7513
7540
  options
@@ -7573,7 +7600,7 @@ const getSelectField = (scope, label, options) => {
7573
7600
  widget: "SelectInputField"
7574
7601
  },
7575
7602
  config: {
7576
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7603
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7577
7604
  main: {
7578
7605
  label,
7579
7606
  type: "text"
@@ -7589,7 +7616,7 @@ const getMultiSelectField = (scope, label) => {
7589
7616
  widget: "MultipleSelect"
7590
7617
  },
7591
7618
  config: {
7592
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7619
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7593
7620
  main: {
7594
7621
  multiple: true,
7595
7622
  label,
@@ -7598,12 +7625,18 @@ const getMultiSelectField = (scope, label) => {
7598
7625
  }
7599
7626
  };
7600
7627
  };
7601
- const GraphSection = {
7628
+ const BaseSection = {
7602
7629
  type: "WrapperLayout",
7630
+ config: {
7631
+ main: {
7632
+ label: " ",
7633
+ gap: "8px"
7634
+ }
7635
+ },
7603
7636
  elements: []
7604
7637
  };
7605
7638
  const buildPropertiesSection = function(type) {
7606
- let uiSchema = _.cloneDeep(GraphSection);
7639
+ let uiSchema = _.cloneDeep(BaseSection);
7607
7640
  switch (type) {
7608
7641
  case "TreeMap":
7609
7642
  uiSchema.elements = [
@@ -7828,7 +7861,13 @@ const buildPropertiesSection = function(type) {
7828
7861
  return uiSchema;
7829
7862
  };
7830
7863
  const StyleSection = {
7831
- type: "HorizontalLayout",
7864
+ type: "WrapperLayout",
7865
+ config: {
7866
+ main: {
7867
+ label: " ",
7868
+ gap: "8px"
7869
+ }
7870
+ },
7832
7871
  elements: [
7833
7872
  {
7834
7873
  type: "Control",
@@ -7844,14 +7883,7 @@ const StyleSection = {
7844
7883
  lg: 12
7845
7884
  },
7846
7885
  style: {
7847
- containerStyle: {
7848
- borderRadius: "20px"
7849
- },
7850
- headerContainerStyle: {},
7851
- textAreaStyle: {
7852
- borderRadius: "20px",
7853
- padding: "20px"
7854
- }
7886
+ "& .MuiFormLabel-root:not(.MuiInputLabel-shrink)": {}
7855
7887
  },
7856
7888
  main: {
7857
7889
  heading: "JSON Style",
@@ -7885,15 +7917,20 @@ const TableSection = (theme) => {
7885
7917
  },
7886
7918
  config: {
7887
7919
  main: {
7888
- color: "info",
7889
7920
  onClick: "widgetAddClickHandler",
7890
7921
  size: "small",
7891
- icon: "AddIcon",
7892
- iconLabel: "Add New",
7922
+ icon: "TableAddIcon",
7923
+ iconLabel: "Add",
7893
7924
  styleDefault: true
7894
7925
  },
7895
7926
  style: {
7896
- mt: "6px"
7927
+ mt: "6px",
7928
+ color: "inherit",
7929
+ fill: "inherit",
7930
+ "&:hover": {
7931
+ color: "inherit",
7932
+ fill: "inherit"
7933
+ }
7897
7934
  }
7898
7935
  }
7899
7936
  }
@@ -7909,12 +7946,18 @@ const TableSection = (theme) => {
7909
7946
  main: {
7910
7947
  onClick: "copyPasteElement",
7911
7948
  size: "small",
7912
- icon: "PasteIcon",
7949
+ icon: "TablePaste",
7913
7950
  iconLabel: "Paste",
7914
7951
  styleDefault: true
7915
7952
  },
7916
7953
  style: {
7917
- mt: "6px"
7954
+ mt: "6px",
7955
+ color: "inherit",
7956
+ fill: "inherit",
7957
+ "&:hover": {
7958
+ color: "inherit",
7959
+ fill: "inherit"
7960
+ }
7918
7961
  }
7919
7962
  }
7920
7963
  }
@@ -7929,16 +7972,21 @@ const TableSection = (theme) => {
7929
7972
  elements: [
7930
7973
  {
7931
7974
  accessorKey: "name",
7932
- header: "Name"
7975
+ header: "Name",
7976
+ type: "string",
7977
+ size: 300
7933
7978
  },
7934
7979
  {
7935
7980
  accessorKey: "type",
7936
- header: "Type"
7981
+ header: "Type",
7982
+ type: "string",
7983
+ size: 200
7937
7984
  },
7938
7985
  {
7939
7986
  header: "Edit Record",
7940
7987
  field: "Reject_Records",
7941
- flex: 1,
7988
+ size: 150,
7989
+ type: "action",
7942
7990
  widget: {
7943
7991
  type: "Control",
7944
7992
  scope: "#/properties/RejectButton",
@@ -7947,13 +7995,16 @@ const TableSection = (theme) => {
7947
7995
  },
7948
7996
  config: {
7949
7997
  main: {
7950
- icon: "EditIcon",
7951
- color: "primary",
7998
+ icon: "TableEditIcon",
7999
+ size: "small",
7952
8000
  onClick: "editComponents",
7953
8001
  tooltipMessage: "Reject This Record"
7954
8002
  },
7955
8003
  style: {
7956
- color: theme.palette.primary.main
8004
+ fill: theme.palette.primary.main,
8005
+ "& :hover": {
8006
+ fill: theme.palette.primary.dark
8007
+ }
7957
8008
  }
7958
8009
  }
7959
8010
  }
@@ -7961,7 +8012,8 @@ const TableSection = (theme) => {
7961
8012
  {
7962
8013
  header: "Delete",
7963
8014
  field: "Reject_Records",
7964
- flex: 1,
8015
+ size: 150,
8016
+ type: "action",
7965
8017
  widget: {
7966
8018
  type: "Control",
7967
8019
  scope: "#/properties/RejectButton",
@@ -7970,10 +8022,15 @@ const TableSection = (theme) => {
7970
8022
  },
7971
8023
  config: {
7972
8024
  main: {
7973
- icon: "RejectIcon",
7974
- color: "error",
8025
+ icon: "Bin",
7975
8026
  onClick: "deletePopUpComponent",
7976
8027
  tooltipMessage: "Reject This Record"
8028
+ },
8029
+ style: {
8030
+ fill: theme.palette.primary.main,
8031
+ "& :hover": {
8032
+ fill: theme.palette.primary.dark
8033
+ }
7977
8034
  }
7978
8035
  }
7979
8036
  }
@@ -7981,7 +8038,8 @@ const TableSection = (theme) => {
7981
8038
  {
7982
8039
  header: "Copy",
7983
8040
  field: "Copy_Component",
7984
- flex: 1,
8041
+ size: 150,
8042
+ type: "action",
7985
8043
  widget: {
7986
8044
  type: "Control",
7987
8045
  scope: "#/properties/Copy_Component",
@@ -8005,109 +8063,148 @@ const TableSection = (theme) => {
8005
8063
  return uiSchema;
8006
8064
  };
8007
8065
  const ValueTab = {
8008
- type: "HorizontalLayout",
8066
+ type: "WrapperLayout",
8067
+ config: {
8068
+ main: {
8069
+ label: " ",
8070
+ gap: "8px"
8071
+ }
8072
+ },
8009
8073
  elements: [
8010
8074
  {
8011
8075
  type: "Control",
8012
8076
  scope: "#/properties/value",
8013
- layout: 12,
8014
8077
  options: {
8015
- detail: {
8016
- type: "HorizontalLayout",
8017
- elements: [
8018
- {
8019
- type: "Control",
8020
- scope: "#/properties/label",
8021
- options: {
8022
- widget: "InputField"
8023
- },
8024
- config: {
8025
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8026
- main: {
8027
- label: "Label"
8028
- }
8029
- }
8030
- },
8031
- {
8032
- type: "Control",
8033
- scope: "#/properties/value",
8034
- options: {
8035
- widget: "InputField"
8036
- },
8037
- config: {
8038
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8039
- main: {
8040
- label: "Value"
8041
- }
8042
- }
8043
- },
8044
- {
8045
- type: "Control",
8046
- scope: "#/properties/emptyBox",
8047
- options: {
8048
- widget: "EmptyBox"
8049
- },
8050
- config: {
8051
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
8052
- }
8078
+ widget: "Array"
8079
+ },
8080
+ config: {
8081
+ layout: 12,
8082
+ main: {
8083
+ label: "Value",
8084
+ childElementLabel: "Value"
8085
+ },
8086
+ style: {
8087
+ marginLeft: "-24px",
8088
+ marginBottom: "24px !important",
8089
+ labelStyle: {
8090
+ marginLeft: "24px"
8091
+ },
8092
+ detailsStyle: {
8093
+ marginLeft: "24px"
8094
+ }
8095
+ }
8096
+ },
8097
+ elements: [
8098
+ {
8099
+ type: "Control",
8100
+ scope: "#/properties/label",
8101
+ options: {
8102
+ widget: "InputField"
8103
+ },
8104
+ config: {
8105
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8106
+ main: {
8107
+ label: "Label"
8053
8108
  }
8054
- ]
8109
+ }
8110
+ },
8111
+ {
8112
+ type: "Control",
8113
+ scope: "#/properties/value",
8114
+ options: {
8115
+ widget: "InputField"
8116
+ },
8117
+ config: {
8118
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8119
+ main: {
8120
+ label: "Value"
8121
+ }
8122
+ }
8123
+ },
8124
+ {
8125
+ type: "Control",
8126
+ scope: "#/properties/emptyBox",
8127
+ options: {
8128
+ widget: "EmptyBox"
8129
+ },
8130
+ config: {
8131
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
8132
+ }
8055
8133
  }
8056
- }
8134
+ ]
8057
8135
  }
8058
8136
  ]
8059
8137
  };
8060
8138
  const ValidationSection = {
8061
- type: "HorizontalLayout",
8139
+ type: "WrapperLayout",
8140
+ config: {
8141
+ main: {
8142
+ label: " ",
8143
+ gap: "8px"
8144
+ }
8145
+ },
8062
8146
  elements: [
8063
8147
  {
8064
8148
  type: "Control",
8065
8149
  scope: "#/properties/validation",
8066
- layout: 11.5,
8067
8150
  options: {
8068
- "elementLabelProp": "validationType",
8069
- detail: {
8070
- type: "HorizontalLayout",
8071
- elements: [
8072
- {
8073
- type: "Control",
8074
- scope: "#/properties/validationType",
8075
- options: {
8076
- widget: "SelectInputField"
8077
- },
8078
- config: {
8079
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8080
- main: {
8081
- label: "Validation Type"
8082
- }
8083
- }
8084
- },
8085
- {
8086
- type: "Control",
8087
- scope: "#/properties/validationValue",
8088
- options: {
8089
- widget: "InputField"
8090
- },
8091
- config: {
8092
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8093
- main: {
8094
- label: "Validation Value"
8095
- }
8096
- }
8097
- },
8098
- {
8099
- type: "Control",
8100
- scope: "#/properties/emptyBox",
8101
- options: {
8102
- widget: "EmptyBox"
8103
- },
8104
- config: {
8105
- layout: { xs: 0, sm: 0, md: 4 }
8106
- }
8151
+ widget: "Array"
8152
+ },
8153
+ config: {
8154
+ layout: 12,
8155
+ main: {
8156
+ label: "Validation",
8157
+ childElementLabel: "Validation"
8158
+ },
8159
+ style: {
8160
+ marginLeft: "-24px",
8161
+ marginBottom: "24px !important",
8162
+ labelStyle: {
8163
+ marginLeft: "24px"
8164
+ },
8165
+ detailsStyle: {
8166
+ marginLeft: "24px"
8167
+ }
8168
+ }
8169
+ },
8170
+ elements: [
8171
+ {
8172
+ type: "Control",
8173
+ scope: "#/properties/validationType",
8174
+ options: {
8175
+ widget: "SelectInputField"
8176
+ },
8177
+ config: {
8178
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8179
+ main: {
8180
+ label: "Validation Type"
8107
8181
  }
8108
- ]
8182
+ }
8183
+ },
8184
+ {
8185
+ type: "Control",
8186
+ scope: "#/properties/validationValue",
8187
+ options: {
8188
+ widget: "InputField"
8189
+ },
8190
+ config: {
8191
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8192
+ main: {
8193
+ label: "Validation Value"
8194
+ }
8195
+ }
8196
+ },
8197
+ {
8198
+ type: "Control",
8199
+ scope: "#/properties/emptyBox",
8200
+ options: {
8201
+ widget: "EmptyBox"
8202
+ },
8203
+ config: {
8204
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
8205
+ }
8109
8206
  }
8110
- }
8207
+ ]
8111
8208
  }
8112
8209
  ]
8113
8210
  };