@zohodesk/components 1.2.26 → 1.2.27

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.
@@ -0,0 +1,101 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <link rel="preconnect" href="https://fonts.googleapis.com">
6
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
7
+ <link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
8
+
9
+ <title>Unvalidated Files</title>
10
+ <style>
11
+ body {
12
+ margin: 0;
13
+ padding: 0;
14
+ font-family: 'Asap Condensed', sans-serif;
15
+ }
16
+
17
+ table {
18
+ width: 100%;
19
+ border-collapse: collapse;
20
+ }
21
+
22
+ th {
23
+ position: sticky;
24
+ top: 0;
25
+ background-color: #001C30;
26
+ color: #F5F5F5;
27
+ }
28
+
29
+ th,
30
+ td {
31
+ border: 1px solid black;
32
+ padding: 8px;
33
+ }
34
+
35
+ tr:nth-child(even) {
36
+ background-color: #EDEEF7;
37
+ }
38
+
39
+ .table-container {
40
+ margin-bottom: 20px;
41
+ }
42
+ </style>
43
+ </head>
44
+
45
+ <body>
46
+ <div id="table-container"></div>
47
+ <script>
48
+ const jsonData = {}
49
+ const tableContainer = document.getElementById('table-container');
50
+ const table = document.createElement('table');
51
+ const thead = document.createElement('thead');
52
+ const tbody = document.createElement('tbody');
53
+
54
+ const headerRow = document.createElement('tr');
55
+ const headers = ['No', 'Component', 'FilePath'];
56
+ headers.forEach(header => {
57
+ const th = document.createElement('th');
58
+ th.textContent = header;
59
+ headerRow.appendChild(th);
60
+ });
61
+ thead.appendChild(headerRow);
62
+ table.appendChild(thead);
63
+ var componentCount = 1;
64
+ function generateRows(component, data, innerComponent = '') {
65
+
66
+ const filePath = data.filePath ? data.filePath : '';
67
+
68
+ const row = document.createElement('tr');
69
+ const numbers = document.createElement('td');
70
+ const componentCell = document.createElement('td');
71
+ const filePathCell = document.createElement('td');
72
+
73
+ numbers.textContent = componentCount;
74
+ componentCell.textContent = component;
75
+ filePathCell.textContent = filePath;
76
+
77
+ row.appendChild(numbers);
78
+ row.appendChild(componentCell);
79
+ row.appendChild(filePathCell);
80
+ tbody.appendChild(row);
81
+
82
+ if (data.innerComponent) {
83
+ Object.entries(data.innerComponent).forEach(([innerComp, innerData]) => {
84
+ generateRows(innerComp, innerData, component);
85
+ });
86
+ }
87
+ componentCount++;
88
+ }
89
+
90
+ Object.entries(jsonData).forEach(([component, data]) => {
91
+ generateRows(component, data);
92
+ });
93
+
94
+ table.appendChild(tbody);
95
+ tableContainer.appendChild(table);
96
+
97
+ generateTable(jsonData);
98
+ </script>
99
+ </body>
100
+
101
+ </html>
package/README.md CHANGED
@@ -32,6 +32,11 @@ In this Package, we Provide Some Basic Components to Build Web App
32
32
  - TextBoxIcon
33
33
  - Tooltip
34
34
 
35
+ # 1.2.27
36
+
37
+ - **DateWidget** - The issue with the YearView Open State Reset on Blur Event in DidMount has been resolved
38
+
39
+
35
40
  # 1.2.26
36
41
 
37
42
  - ** MultiSelect, MultiSelectWithAvatar ** - Mobile Header Render Issue in Mobile Responsive Fixed.
@@ -909,7 +909,8 @@ class DateWidgetComponent extends React.Component {
909
909
  if (isAllowedDateType) {
910
910
  // if (focusOrder !== oldFocusOrder) {
911
911
  const {
912
- dateFormatSelection = {}
912
+ dateFormatSelection = {},
913
+ isFocused
913
914
  } = this.state;
914
915
  const {
915
916
  order = []
@@ -931,9 +932,17 @@ class DateWidgetComponent extends React.Component {
931
932
 
932
933
  if (isPopupOpen) {
933
934
  if (yearViewTypes.indexOf(focusedType) >= 0 && (!isYearView || isMonthOpen !== oldIsMonthOpen)) {
934
- this.DateTimeYearViewToggle(true, isMonthOpen);
935
- } else if (yearViewTypes.indexOf(focusedType) === -1 && isYearView) {
936
- this.DateTimeYearViewToggle(false, false);
935
+ if (!isFocused && isYearView) {
936
+ this.DateTimeYearViewToggle(true, oldIsMonthOpen);
937
+ } else {
938
+ this.DateTimeYearViewToggle(true, isMonthOpen);
939
+ }
940
+ } else if (yearViewTypes.indexOf(focusedType) === -1) {
941
+ if (!isFocused && isYearView) {
942
+ this.DateTimeYearViewToggle(isYearView, oldIsMonthOpen);
943
+ } else {
944
+ this.DateTimeYearViewToggle(false, false);
945
+ }
937
946
  }
938
947
  } // }
939
948
 
@@ -909,7 +909,8 @@ class DateWidgetComponent extends React.Component {
909
909
  if (isAllowedDateType) {
910
910
  // if (focusOrder !== oldFocusOrder) {
911
911
  const {
912
- dateFormatSelection = {}
912
+ dateFormatSelection = {},
913
+ isFocused
913
914
  } = this.state;
914
915
  const {
915
916
  order = []
@@ -931,9 +932,17 @@ class DateWidgetComponent extends React.Component {
931
932
 
932
933
  if (isPopupOpen) {
933
934
  if (yearViewTypes.indexOf(focusedType) >= 0 && (!isYearView || isMonthOpen !== oldIsMonthOpen)) {
934
- this.DateTimeYearViewToggle(true, isMonthOpen);
935
- } else if (yearViewTypes.indexOf(focusedType) === -1 && isYearView) {
936
- this.DateTimeYearViewToggle(false, false);
935
+ if (!isFocused && isYearView) {
936
+ this.DateTimeYearViewToggle(true, oldIsMonthOpen);
937
+ } else {
938
+ this.DateTimeYearViewToggle(true, isMonthOpen);
939
+ }
940
+ } else if (yearViewTypes.indexOf(focusedType) === -1) {
941
+ if (!isFocused && isYearView) {
942
+ this.DateTimeYearViewToggle(isYearView, oldIsMonthOpen);
943
+ } else {
944
+ this.DateTimeYearViewToggle(false, false);
945
+ }
937
946
  }
938
947
  } // }
939
948
 
@@ -934,8 +934,10 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
934
934
 
935
935
  if (isAllowedDateType) {
936
936
  // if (focusOrder !== oldFocusOrder) {
937
- var _this$state$dateForma = this.state.dateFormatSelection,
938
- dateFormatSelection = _this$state$dateForma === void 0 ? {} : _this$state$dateForma;
937
+ var _this$state5 = this.state,
938
+ _this$state5$dateForm = _this$state5.dateFormatSelection,
939
+ dateFormatSelection = _this$state5$dateForm === void 0 ? {} : _this$state5$dateForm,
940
+ isFocused = _this$state5.isFocused;
939
941
  var _dateFormatSelection$2 = dateFormatSelection.order,
940
942
  order = _dateFormatSelection$2 === void 0 ? [] : _dateFormatSelection$2;
941
943
  var isPopupOpen = this.props.isPopupOpen; // const { type: oldFocusedType = '' } = order[oldFocusOrder] || {};
@@ -953,9 +955,17 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
953
955
 
954
956
  if (isPopupOpen) {
955
957
  if (yearViewTypes.indexOf(focusedType) >= 0 && (!isYearView || isMonthOpen !== oldIsMonthOpen)) {
956
- this.DateTimeYearViewToggle(true, isMonthOpen);
957
- } else if (yearViewTypes.indexOf(focusedType) === -1 && isYearView) {
958
- this.DateTimeYearViewToggle(false, false);
958
+ if (!isFocused && isYearView) {
959
+ this.DateTimeYearViewToggle(true, oldIsMonthOpen);
960
+ } else {
961
+ this.DateTimeYearViewToggle(true, isMonthOpen);
962
+ }
963
+ } else if (yearViewTypes.indexOf(focusedType) === -1) {
964
+ if (!isFocused && isYearView) {
965
+ this.DateTimeYearViewToggle(isYearView, oldIsMonthOpen);
966
+ } else {
967
+ this.DateTimeYearViewToggle(false, false);
968
+ }
959
969
  }
960
970
  } // }
961
971
 
@@ -1004,12 +1014,12 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
1004
1014
  a11y = _this$props11.a11y,
1005
1015
  boxSize = _this$props11.boxSize,
1006
1016
  onError = _this$props11.onError;
1007
- var _this$state5 = this.state,
1008
- _this$state5$selected = _this$state5.selected,
1009
- value = _this$state5$selected === void 0 ? '' : _this$state5$selected,
1010
- isError = _this$state5.isError,
1011
- isDateEdited = _this$state5.isDateEdited,
1012
- isFocused = _this$state5.isFocused;
1017
+ var _this$state6 = this.state,
1018
+ _this$state6$selected = _this$state6.selected,
1019
+ value = _this$state6$selected === void 0 ? '' : _this$state6$selected,
1020
+ isError = _this$state6.isError,
1021
+ isDateEdited = _this$state6.isDateEdited,
1022
+ isFocused = _this$state6.isFocused;
1013
1023
  var showValue = this.handleGetShowValue();
1014
1024
  var isAllowedDateType = this.handleGetAllowedType();
1015
1025
  var showClear = !(isDisabled || isReadOnly) && (isDateEdited || value) ? true : false;
@@ -934,8 +934,10 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
934
934
 
935
935
  if (isAllowedDateType) {
936
936
  // if (focusOrder !== oldFocusOrder) {
937
- var _this$state$dateForma = this.state.dateFormatSelection,
938
- dateFormatSelection = _this$state$dateForma === void 0 ? {} : _this$state$dateForma;
937
+ var _this$state5 = this.state,
938
+ _this$state5$dateForm = _this$state5.dateFormatSelection,
939
+ dateFormatSelection = _this$state5$dateForm === void 0 ? {} : _this$state5$dateForm,
940
+ isFocused = _this$state5.isFocused;
939
941
  var _dateFormatSelection$2 = dateFormatSelection.order,
940
942
  order = _dateFormatSelection$2 === void 0 ? [] : _dateFormatSelection$2;
941
943
  var isPopupOpen = this.props.isPopupOpen; // const { type: oldFocusedType = '' } = order[oldFocusOrder] || {};
@@ -953,9 +955,17 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
953
955
 
954
956
  if (isPopupOpen) {
955
957
  if (yearViewTypes.indexOf(focusedType) >= 0 && (!isYearView || isMonthOpen !== oldIsMonthOpen)) {
956
- this.DateTimeYearViewToggle(true, isMonthOpen);
957
- } else if (yearViewTypes.indexOf(focusedType) === -1 && isYearView) {
958
- this.DateTimeYearViewToggle(false, false);
958
+ if (!isFocused && isYearView) {
959
+ this.DateTimeYearViewToggle(true, oldIsMonthOpen);
960
+ } else {
961
+ this.DateTimeYearViewToggle(true, isMonthOpen);
962
+ }
963
+ } else if (yearViewTypes.indexOf(focusedType) === -1) {
964
+ if (!isFocused && isYearView) {
965
+ this.DateTimeYearViewToggle(isYearView, oldIsMonthOpen);
966
+ } else {
967
+ this.DateTimeYearViewToggle(false, false);
968
+ }
959
969
  }
960
970
  } // }
961
971
 
@@ -1006,12 +1016,12 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
1006
1016
  onError = _this$props11.onError,
1007
1017
  startDate = _this$props11.startDate,
1008
1018
  endDate = _this$props11.endDate;
1009
- var _this$state5 = this.state,
1010
- _this$state5$selected = _this$state5.selected,
1011
- value = _this$state5$selected === void 0 ? '' : _this$state5$selected,
1012
- isError = _this$state5.isError,
1013
- isDateEdited = _this$state5.isDateEdited,
1014
- isFocused = _this$state5.isFocused;
1019
+ var _this$state6 = this.state,
1020
+ _this$state6$selected = _this$state6.selected,
1021
+ value = _this$state6$selected === void 0 ? '' : _this$state6$selected,
1022
+ isError = _this$state6.isError,
1023
+ isDateEdited = _this$state6.isDateEdited,
1024
+ isFocused = _this$state6.isFocused;
1015
1025
  var showValue = this.handleGetShowValue();
1016
1026
  var isAllowedDateType = this.handleGetAllowedType();
1017
1027
  var showClear = !(isDisabled || isReadOnly) && (isDateEdited || value) ? true : false;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/components",
3
- "version": "1.2.26",
3
+ "version": "1.2.27",
4
4
  "main": "es/index.js",
5
5
  "module": "es/index.js",
6
6
  "private": false,
@@ -66,12 +66,12 @@
66
66
  "@zohodesk-private/color-variable-preprocessor": "1.2.0",
67
67
  "@zohodesk-private/css-variable-migrator": "^1.0.7",
68
68
  "@zohodesk-private/node-plugins": "1.1.6",
69
- "@zohodesk-private/react-prop-validator": "1.2.1",
69
+ "@zohodesk-private/react-prop-validator": "1.2.3",
70
70
  "@zohodesk/a11y": "2.2.0",
71
71
  "@zohodesk/docstool": "1.0.0-alpha-2",
72
72
  "@zohodesk/hooks": "2.0.3",
73
- "@zohodesk/icons": "1.0.32",
74
- "@zohodesk/svg": "1.1.10",
73
+ "@zohodesk/icons": "1.0.33",
74
+ "@zohodesk/svg": "1.1.11",
75
75
  "@zohodesk/utils": "1.3.13",
76
76
  "@zohodesk/variables": "1.0.0",
77
77
  "@zohodesk/virtualizer": "1.0.3",
@@ -85,9 +85,9 @@
85
85
  "selectn": "1.1.2"
86
86
  },
87
87
  "peerDependencies": {
88
- "@zohodesk/icons": "1.0.32",
88
+ "@zohodesk/icons": "1.0.33",
89
89
  "@zohodesk/variables": "1.0.0",
90
- "@zohodesk/svg": "1.1.10",
90
+ "@zohodesk/svg": "1.1.11",
91
91
  "@zohodesk/virtualizer": "1.0.3",
92
92
  "velocity-react": "1.4.3",
93
93
  "react-sortable-hoc": "^0.8.3",
@@ -1,8 +1,12 @@
1
1
  {
2
2
  "inputDir": "./src",
3
3
  "outputDir": "./.cli",
4
- "excludeDir":"./.cli",
5
- "propUnifiExcludeDir":"./.cli",
6
- "propUnifiReport":true,
7
- "strictMode":true
4
+ "excludeDir": "./.cli",
5
+ "propUnifiExcludeDir": "./.cli",
6
+ "enable": true,
7
+ "need_report": true,
8
+ "prop_validation_strict_mode": true,
9
+ "prop_validation_log": false,
10
+ "prop_unification_strict_mode": true,
11
+ "prop_unification_log": false
8
12
  }