impaktapps-ui-builder 0.0.101-alpha.4 → 0.0.101-alpha.5

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 (6) hide show
  1. package/dist/impaktapps-ui-builder.es.js +111 -179
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +8 -8
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +203 -291
package/dist/impaktapps-ui-builder.es.js CHANGED
@@ -6576,37 +6576,30 @@ const ComponentSchema = {
6576
6576
  required: ["name"]
6577
6577
  };
6578
6578
  const componentBasicUiSchema = (theme) => {
6579
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
6579
+ var _a;
6580
6580
  const uiSchema = {
6581
6581
  type: "HorizontalLayout",
6582
- heading: "Component",
6582
+ heading: "Page-Component",
6583
6583
  elements: [
6584
- {
6585
- type: "Control",
6586
- scope: "#/properties/pageName",
6587
- options: {
6588
- widget: "Box"
6589
- },
6590
- config: {
6591
- layout: 12,
6592
- main: {
6593
- heading: " "
6594
- },
6595
- style: {
6596
- marginLeft: theme.spacing(3),
6597
- width: "auto",
6598
- fontSize: "12px",
6599
- color: "gray"
6600
- }
6601
- }
6602
- },
6603
6584
  {
6604
6585
  type: "TabLayout",
6605
6586
  config: {
6606
6587
  main: {
6607
6588
  tabLabels: ["Core"],
6608
- defaultStyle: true,
6609
6589
  id: `component`
6590
+ },
6591
+ style: {
6592
+ TabPanelStyle: {
6593
+ padding: 0
6594
+ }
6595
+ },
6596
+ TabsStyle: {
6597
+ marginBottom: "3px",
6598
+ paddingBottom: "4px",
6599
+ boxShadow: "0px 3px 4px #afafaf80",
6600
+ "& .MuiTabs-indicator": {
6601
+ bottom: "6px"
6602
+ }
6610
6603
  }
6611
6604
  },
6612
6605
  elements: [
@@ -6620,12 +6613,22 @@ const componentBasicUiSchema = (theme) => {
6620
6613
  widget: "SelectInputField"
6621
6614
  },
6622
6615
  config: {
6623
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6616
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
6624
6617
  main: {
6625
6618
  label: "Type"
6626
6619
  }
6627
6620
  }
6628
6621
  },
6622
+ {
6623
+ type: "Control",
6624
+ scope: "#/properties/proc",
6625
+ config: {
6626
+ layout: { xs: 6, sm: 0, md: 0, lg: 0 }
6627
+ },
6628
+ options: {
6629
+ widget: "EmptyBox"
6630
+ }
6631
+ },
6629
6632
  {
6630
6633
  type: "Control",
6631
6634
  scope: "#/properties/name",
@@ -6633,9 +6636,9 @@ const componentBasicUiSchema = (theme) => {
6633
6636
  widget: "InputField"
6634
6637
  },
6635
6638
  config: {
6636
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6639
+ layout: { xs: 12, sm: 6, md: 4, lg: 3 },
6637
6640
  main: {
6638
- label: "Name",
6641
+ label: "Component ID",
6639
6642
  options: [],
6640
6643
  color: "secondary",
6641
6644
  required: true
@@ -6649,7 +6652,7 @@ const componentBasicUiSchema = (theme) => {
6649
6652
  widget: "InputField"
6650
6653
  },
6651
6654
  config: {
6652
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6655
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
6653
6656
  main: {
6654
6657
  label: "Label",
6655
6658
  options: [],
@@ -6658,34 +6661,11 @@ const componentBasicUiSchema = (theme) => {
6658
6661
  }
6659
6662
  }
6660
6663
  },
6661
- {
6662
- type: "Control",
6663
- scope: "#/properties/columnFormat",
6664
- options: {
6665
- widget: "SelectInputField"
6666
- },
6667
- config: {
6668
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6669
- main: {
6670
- label: "Column Format"
6671
- }
6672
- }
6673
- },
6674
6664
  {
6675
6665
  type: "Control",
6676
6666
  scope: "#/properties/proc",
6677
6667
  config: {
6678
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6679
- },
6680
- options: {
6681
- widget: "EmptyBox"
6682
- }
6683
- },
6684
- {
6685
- type: "Control",
6686
- scope: "#/properties/proc",
6687
- config: {
6688
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6668
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 }
6689
6669
  },
6690
6670
  options: {
6691
6671
  widget: "EmptyBox"
@@ -6741,64 +6721,73 @@ const componentBasicUiSchema = (theme) => {
6741
6721
  ]
6742
6722
  }
6743
6723
  }
6744
- }
6745
- ]
6746
- }
6747
- ]
6748
- },
6749
- {
6750
- type: "HorizontalLayout",
6751
- config: {
6752
- layout: { xs: 12, sm: 6 }
6753
- },
6754
- elements: [
6755
- {
6756
- type: "Control",
6757
- scope: "#/properties/RemoveItemButton",
6758
- options: {
6759
- widget: "IconButton"
6760
- },
6761
- config: {
6762
- layout: { xs: 1, sm: 1 },
6763
- main: {
6764
- onClick: "RemoveItemButton",
6765
- size: "large",
6766
- icon: "RejectIcon",
6767
- styleDefault: true
6768
- },
6769
- style: {
6770
- marginLeft: "-10px"
6771
- }
6772
- }
6773
- },
6774
- {
6775
- type: "Control",
6776
- scope: "#/properties/copiedElementDetails",
6777
- options: {
6778
- widget: "Box"
6779
- },
6780
- config: {
6781
- layout: { xs: 6, sm: 6 },
6782
- main: {
6783
- heading: "No element copied"
6784
6724
  },
6785
- style: {
6786
- color: "#535557",
6787
- marginLeft: "-10px",
6788
- fontSize: "12px",
6789
- marginTop: "4px"
6725
+ {
6726
+ type: "Control",
6727
+ scope: "#/properties/layout",
6728
+ options: {
6729
+ widget: "Array"
6730
+ },
6731
+ config: {
6732
+ layout: 12,
6733
+ main: {
6734
+ label: "Layout",
6735
+ childElementLabel: "Layout"
6736
+ },
6737
+ style: {
6738
+ marginLeft: "-24px",
6739
+ marginBottom: "24px !important",
6740
+ labelStyle: {
6741
+ marginLeft: "24px"
6742
+ },
6743
+ detailsStyle: {
6744
+ marginLeft: "24px"
6745
+ }
6746
+ }
6747
+ },
6748
+ elements: [
6749
+ {
6750
+ type: "Control",
6751
+ scope: "#/properties/key",
6752
+ options: {
6753
+ widget: "SelectInputField"
6754
+ },
6755
+ config: {
6756
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6757
+ main: {
6758
+ label: "Screen Size"
6759
+ }
6760
+ }
6761
+ },
6762
+ {
6763
+ type: "Control",
6764
+ scope: "#/properties/value",
6765
+ options: {
6766
+ widget: "InputField"
6767
+ },
6768
+ config: {
6769
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6770
+ main: {
6771
+ label: "Value",
6772
+ type: "number",
6773
+ helperText: "Number should be in range of 0 to 12",
6774
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6775
+ }
6776
+ }
6777
+ },
6778
+ {
6779
+ type: "Control",
6780
+ scope: "#/properties/proc",
6781
+ config: {
6782
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6783
+ },
6784
+ options: {
6785
+ widget: "EmptyBox"
6786
+ }
6787
+ }
6788
+ ]
6790
6789
  }
6791
- }
6792
- },
6793
- {
6794
- type: "Control",
6795
- scope: "#/properties/EmptyBox",
6796
- options: {
6797
- widget: "EmptyBox"
6798
- },
6799
- config: {
6800
- layout: { xs: 1, sm: 5 }
6801
- }
6790
+ ]
6802
6791
  }
6803
6792
  ]
6804
6793
  },
@@ -6809,10 +6798,9 @@ const componentBasicUiSchema = (theme) => {
6809
6798
  widget: "Button"
6810
6799
  },
6811
6800
  config: {
6812
- layout: { xs: 4, sm: 2 },
6801
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
6813
6802
  main: {
6814
6803
  name: "Ok",
6815
- startIcon: "ApproveIcon",
6816
6804
  variant: "contained",
6817
6805
  type: "text",
6818
6806
  onClick: "okHandler",
@@ -6827,10 +6815,9 @@ const componentBasicUiSchema = (theme) => {
6827
6815
  widget: "Button"
6828
6816
  },
6829
6817
  config: {
6830
- layout: { xs: 4, sm: 2 },
6818
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
6831
6819
  main: {
6832
6820
  name: "Save & Exit",
6833
- startIcon: "ApproveIcon",
6834
6821
  variant: "contained",
6835
6822
  type: "text",
6836
6823
  onClick: "saveHandler",
@@ -6838,6 +6825,16 @@ const componentBasicUiSchema = (theme) => {
6838
6825
  }
6839
6826
  }
6840
6827
  },
6828
+ {
6829
+ type: "Control",
6830
+ scope: "#/properties/EmptyBox",
6831
+ config: {
6832
+ layout: { xs: 4, sm: 7, md: 8, lg: 9 }
6833
+ },
6834
+ options: {
6835
+ widget: "EmptyBox"
6836
+ }
6837
+ },
6841
6838
  {
6842
6839
  type: "Control",
6843
6840
  scope: "#/properties/popUpComponentSection",
@@ -6896,9 +6893,7 @@ const componentBasicUiSchema = (theme) => {
6896
6893
  layout: 6,
6897
6894
  main: {
6898
6895
  name: "No",
6899
- startIcon: "ApproveIcon",
6900
6896
  variant: "contained",
6901
- color: "info",
6902
6897
  type: "text",
6903
6898
  onClick: "deletePopUpComponent",
6904
6899
  size: "large"
@@ -6932,7 +6927,6 @@ const componentBasicUiSchema = (theme) => {
6932
6927
  layout: 6,
6933
6928
  main: {
6934
6929
  name: "Yes",
6935
- startIcon: "ApproveIcon",
6936
6930
  variant: "contained",
6937
6931
  color: "error",
6938
6932
  type: "text",
@@ -7019,9 +7013,7 @@ const componentBasicUiSchema = (theme) => {
7019
7013
  layout: 6,
7020
7014
  main: {
7021
7015
  name: "No",
7022
- startIcon: "ApproveIcon",
7023
7016
  variant: "contained",
7024
- color: "info",
7025
7017
  type: "text",
7026
7018
  onClick: "deletePopUpEvent",
7027
7019
  size: "large"
@@ -7055,7 +7047,6 @@ const componentBasicUiSchema = (theme) => {
7055
7047
  layout: 6,
7056
7048
  main: {
7057
7049
  name: "Yes",
7058
- startIcon: "ApproveIcon",
7059
7050
  variant: "contained",
7060
7051
  color: "error",
7061
7052
  type: "text",
@@ -7101,7 +7092,7 @@ const componentBasicUiSchema = (theme) => {
7101
7092
  style: {
7102
7093
  flexDirection: "row",
7103
7094
  position: "absolute",
7104
- bottom: 0,
7095
+ bottom: 10,
7105
7096
  height: "fit-content",
7106
7097
  overflow: "hidden",
7107
7098
  zIndex: 1e3,
@@ -7120,78 +7111,19 @@ const componentBasicUiSchema = (theme) => {
7120
7111
  heading: "Copywriter@ACT21.IO"
7121
7112
  },
7122
7113
  style: {
7123
- color: ((_b = (_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text) == null ? void 0 : _b.disabled) || "#AFAFAF",
7114
+ color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
7124
7115
  fontSize: "11px",
7125
7116
  textAlign: "center",
7126
- lineHeight: 2,
7117
+ lineHeight: 0,
7127
7118
  width: "fit-content",
7128
7119
  left: "50%",
7129
7120
  position: "relative",
7130
- margin: 0,
7121
+ margin: "revert",
7131
7122
  flexGrow: 1,
7132
7123
  height: 0,
7133
7124
  transform: "translate(-50%, 0%)"
7134
7125
  }
7135
7126
  }
7136
- },
7137
- {
7138
- type: "Control",
7139
- scope: "#/properties/FooterBackIcon",
7140
- options: {
7141
- widget: "Box"
7142
- },
7143
- config: {
7144
- main: {
7145
- iconName: "PrevIcon",
7146
- onClick: "backHandler",
7147
- width: "fit-content"
7148
- },
7149
- style: {
7150
- fill: (_d = (_c = theme == null ? void 0 : theme.palette) == null ? void 0 : _c.primary) == null ? void 0 : _d.main,
7151
- width: 20,
7152
- height: 0,
7153
- top: 0,
7154
- right: { xs: "12px", sm: "84px" },
7155
- position: "absolute",
7156
- fontSize: "12px",
7157
- cursor: "pointer",
7158
- ":hover": {
7159
- fill: (_f = (_e = theme == null ? void 0 : theme.palette) == null ? void 0 : _e.primary) == null ? void 0 : _f.dark
7160
- },
7161
- marginRight: "20px"
7162
- }
7163
- }
7164
- },
7165
- {
7166
- type: "Control",
7167
- scope: "#/properties/FooterBackHandlerText",
7168
- options: {
7169
- widget: "Box"
7170
- },
7171
- config: {
7172
- main: {
7173
- heading: "Previous Page",
7174
- onClick: "backHandler"
7175
- },
7176
- style: {
7177
- display: { xs: "none", sm: "flex" },
7178
- textAlign: "left",
7179
- lineHeight: 1,
7180
- height: 0,
7181
- width: "fit-content",
7182
- color: (_h = (_g = theme == null ? void 0 : theme.palette) == null ? void 0 : _g.primary) == null ? void 0 : _h.main,
7183
- fontSize: "12px",
7184
- cursor: "pointer",
7185
- marginLeft: "2px",
7186
- top: 3,
7187
- right: "12px",
7188
- position: "absolute",
7189
- ":hover": {
7190
- color: (_j = (_i = theme == null ? void 0 : theme.palette) == null ? void 0 : _i.primary) == null ? void 0 : _j.dark
7191
- },
7192
- marginRight: "4px"
7193
- }
7194
- }
7195
7127
  }
7196
7128
  ]
7197
7129
  }