@singularsystems/neo-react 1.0.8 → 1.0.10

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 (4) hide show
  1. package/dist/ReactComponents/DropDown/AutoCompleteDropDown.js +1 -1
  2. package/dist/ReactComponents/Notifications/Alert.js +4 -4
  3. package/package.json +2 -2
  4. package/styles/DatePicker.scss +173 -165
package/dist/ReactComponents/DropDown/AutoCompleteDropDown.js CHANGED
@@ -229,7 +229,7 @@ var AutoCompleteDropDown = /** @class */ (function (_super) {
229
229
  }
230
230
  };
231
231
  AutoCompleteDropDown.prototype.getOption = function (content, additionalClass) {
232
- return function (item) { return (React.createElement("div", __assign({ ref: item.innerRef }, item.innerProps, { className: Utils.joinWithSpaces("react-select-row", additionalClass, item.isFocused ? "focused" : undefined, item.isSelected ? "selected" : undefined) }), content(item.data))); };
232
+ return function (item) { return (React.createElement("div", __assign({ ref: item.innerRef }, item.innerProps, { className: Utils.joinWithSpaces("react-select-row", additionalClass, item.isFocused ? "focused" : undefined, item.isSelected ? "selected" : undefined) }), content(item.data.item))); };
233
233
  };
234
234
  AutoCompleteDropDown.contextType = FormContext;
235
235
  AutoCompleteDropDown = __decorate([
package/dist/ReactComponents/Notifications/Alert.js CHANGED
@@ -13,10 +13,10 @@ var Alert = /** @class */ (function (_super) {
13
13
  return _this;
14
14
  }
15
15
  Alert.prototype.render = function () {
16
- var _a, _b;
17
- var _c = this.props, variant = _c.variant, heading = _c.heading, show = _c.show, bindShow = _c.bindShow, autoCloseTimeout = _c.autoCloseTimeout, animateInitial = _c.animateInitial, state = _c.state, onHidden = _c.onHidden, refreshValue = _c.refreshValue, icon = _c.icon, native = __rest(_c, ["variant", "heading", "show", "bindShow", "autoCloseTimeout", "animateInitial", "state", "onHidden", "refreshValue", "icon"]);
18
- var isOutline = (_a = this.props.isOutline) !== null && _a !== void 0 ? _a : Misc.Settings.alerts.isOutline;
19
- var iconPosition = (_b = this.props.iconPosition) !== null && _b !== void 0 ? _b : Misc.Settings.alerts.iconPosition;
16
+ var _a;
17
+ var _b = this.props, variant = _b.variant, heading = _b.heading, show = _b.show, bindShow = _b.bindShow, autoCloseTimeout = _b.autoCloseTimeout, animateInitial = _b.animateInitial, state = _b.state, onHidden = _b.onHidden, refreshValue = _b.refreshValue, icon = _b.icon, isOutline = _b.isOutline, native = __rest(_b, ["variant", "heading", "show", "bindShow", "autoCloseTimeout", "animateInitial", "state", "onHidden", "refreshValue", "icon", "isOutline"]);
18
+ isOutline !== null && isOutline !== void 0 ? isOutline : (isOutline = Misc.Settings.alerts.isOutline);
19
+ var iconPosition = (_a = this.props.iconPosition) !== null && _a !== void 0 ? _a : Misc.Settings.alerts.iconPosition;
20
20
  var className = Utils.joinWithSpaces(native.className, "alert", "alert-" + variant, "collapsable" + (isOutline ? " alert-outline" : "") + (iconPosition === "left" ? " alert-left-icon" : ""));
21
21
  if (bindShow) {
22
22
  className += " alert-dismissible";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@singularsystems/neo-react",
3
- "version": "1.0.8",
3
+ "version": "1.0.10",
4
4
  "description": "React application logic and components for the Neo client library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -31,7 +31,7 @@
31
31
  "typescript": "5.4.2"
32
32
  },
33
33
  "dependencies": {
34
- "@singularsystems/neo-core": "1.0.4",
34
+ "@singularsystems/neo-core": "1.0.7",
35
35
  "@types/rc-slider": "^8.6.5",
36
36
  "@types/react-color": "^3.0.1",
37
37
  "axios": "1.6.7",
package/styles/DatePicker.scss CHANGED
@@ -1,198 +1,148 @@
1
- .neo-datepicker-container {
2
- display: inline-block;
3
- position: relative;
4
- width: 100%;
5
- color: initial;
1
+ $neo-include-datepicker: true !default;
6
2
 
7
- &.neo-datepicker-always-show {
8
- width: max-content;
9
-
10
- input {
11
- text-align: center;
12
- padding: 0.125rem 0;
13
- height: auto;
14
- margin-bottom: 0.25rem;
15
- }
16
- }
17
- }
18
-
19
- .neo-datepicker-popup {
20
- position: absolute;
21
- left: 0;
22
- border: 1px solid #ced4da;
23
- border-radius: 3px;
24
- background: #fff;
25
- text-align: center;
26
- font-size: 14px;
27
- transform-origin: center top;
28
- z-index: 3; /* value of 3 to appear above bootstrap focus outline. */
29
-
30
- &.neo-datepicker-inline {
31
- position: static;
3
+ @if $neo-include-datepicker {
4
+ .neo-datepicker-container {
32
5
  display: inline-block;
33
- }
34
-
35
- .neo-datepicker-header {
36
- background: #e9ecef;
37
6
  position: relative;
38
- height: 34px;
39
-
40
- > * {
41
- position: absolute;
42
- top: 2px;
43
- bottom: 3px;
44
- border-radius: 3px;
45
- }
46
-
47
- button {
48
- padding: 2px 4px;
49
- width: 24px;
50
- border: none;
51
- background: none;
52
-
53
- &:not(:disabled):hover {
54
- background-color: #ced4da;
55
- }
56
- }
57
- .left-button{
58
- left: 2px
59
- }
60
- .right-button {
61
- right: 2px;
62
- }
63
- .header-text-container {
64
- left: 32px;
65
- right: 32px;
66
- z-index: 1;
67
- overflow: hidden;
68
- }
69
- .header-text {
70
- display: flex;
71
- width: 100%;
72
- height: 100%;
73
- align-items: center;
74
- justify-content: center;
75
- border-radius: 3px;
76
-
77
- &.selectable:hover {
78
- cursor: pointer;
79
- background-color: #ced4da;
7
+ width: 100%;
8
+ color: initial;
9
+
10
+ &.neo-datepicker-always-show {
11
+ width: max-content;
12
+
13
+ input {
14
+ text-align: center;
15
+ padding: 0.125rem 0;
16
+ height: auto;
17
+ margin-bottom: 0.25rem;
80
18
  }
81
19
  }
82
20
  }
83
-
84
- .neo-datepicker-content {
85
- position: relative;
86
- overflow: hidden;
87
- transition: all ease 0.2s;
88
-
89
- table {
90
- width: 220px;
91
- border-collapse: separate;
92
- border-spacing: 1px;
93
- table-layout: fixed;
94
- margin: 2px;
95
21
 
96
- th {
97
- text-align: center;
98
- padding: 2px;
99
- border: none;
22
+ .neo-datepicker-popup {
23
+ position: absolute;
24
+ left: 0;
25
+ border: 1px solid #ced4da;
26
+ border-radius: 3px;
27
+ background: #fff;
28
+ text-align: center;
29
+ font-size: 14px;
30
+ transform-origin: center top;
31
+ z-index: 3; /* value of 3 to appear above bootstrap focus outline. */
32
+
33
+ &.neo-datepicker-inline {
34
+ position: static;
35
+ display: inline-block;
36
+ }
37
+
38
+ .neo-datepicker-header {
39
+ background: #e9ecef;
40
+ position: relative;
41
+ height: 34px;
42
+
43
+ > * {
44
+ position: absolute;
45
+ top: 2px;
46
+ bottom: 3px;
47
+ border-radius: 3px;
100
48
  }
101
- td {
49
+
50
+ button {
51
+ padding: 2px 4px;
52
+ width: 24px;
102
53
  border: none;
103
- text-align: center;
104
- padding: 2px;
105
- width: 30px;
106
- border-radius: 3px;
107
-
108
- &.outside-month {
109
- color: #999;
54
+ background: none;
55
+
56
+ &:not(:disabled):hover {
57
+ background-color: #ced4da;
110
58
  }
111
-
112
- &.disabled {
113
- color: #bbb;
114
- text-decoration: line-through;
59
+ &:disabled {
60
+ /* Allows parent elements to receive pointer events.. */
61
+ pointer-events: none;
115
62
  }
116
-
63
+ }
64
+ .left-button{
65
+ left: 2px
66
+ }
67
+ .right-button {
68
+ right: 2px;
69
+ }
70
+ .header-text-container {
71
+ left: 32px;
72
+ right: 32px;
73
+ z-index: 1;
74
+ overflow: hidden;
75
+ }
76
+ .header-text {
77
+ display: flex;
78
+ width: 100%;
79
+ height: 100%;
80
+ align-items: center;
81
+ justify-content: center;
82
+ border-radius: 3px;
83
+
117
84
  &.selectable:hover {
118
85
  cursor: pointer;
119
- background-color: lighten($form-focused-border, 15%);
86
+ background-color: #ced4da;
120
87
  }
121
-
122
- &.today {
123
- border: 1px solid $form-focused-border;
124
- }
125
-
126
- &.selected, &.selected:hover {
127
- background-color: $form-focused-border;
128
- color: #fff;
129
- }
130
- }
131
-
132
- }
133
-
134
- table.month-view {
135
- margin: 8px 5px;
136
-
137
- td {
138
- padding: 13px 0px;
139
88
  }
140
89
  }
141
90
 
142
- table.year-view {
143
- margin: 5px 8px;
144
-
145
- td {
146
- padding: 8px 0px;
147
- }
148
- }
149
- }
150
- }
151
-
152
- .neo-datepicker-animate {
153
- transition: transform ease 0.2s, opacity ease 0.2s;
154
- }
155
-
156
- /* Make the date picker larger on phones */
157
- @media (max-width: 576px) {
158
- .neo-datepicker-container {
159
- .neo-datepicker-popup {
160
- .neo-datepicker-header {
161
- background: #e9ecef;
162
- position: relative;
163
- height: 40px;
164
-
165
- button {
166
- padding: 5px 4px;
167
- width: 40px;
168
- border: none;
169
- background: none;
170
-
171
- &:not(:disabled):hover {
172
- background-color: #ced4da;
173
- }
174
- }
175
- }
176
91
  .neo-datepicker-content {
177
-
92
+ position: relative;
93
+ overflow: hidden;
94
+ transition: all ease 0.2s;
95
+
178
96
  table {
179
- width: 320px;
97
+ width: 220px;
98
+ border-collapse: separate;
99
+ border-spacing: 1px;
100
+ table-layout: fixed;
101
+ margin: 2px;
180
102
 
181
103
  th {
182
104
  text-align: center;
183
- padding: 4px;
105
+ padding: 2px;
184
106
  border: none;
185
107
  }
186
108
  td {
187
- padding: 5px;
188
- width: 34px;
109
+ border: none;
110
+ text-align: center;
111
+ padding: 2px;
112
+ width: 30px;
113
+ border-radius: 3px;
114
+
115
+ &.outside-month {
116
+ color: #999;
117
+ }
118
+
119
+ &.disabled {
120
+ color: #bbb;
121
+ text-decoration: line-through;
122
+ }
123
+
124
+ &.selectable:hover {
125
+ cursor: pointer;
126
+ background-color: lighten($form-focused-border, 15%);
127
+ }
128
+
129
+ &.today {
130
+ border: 1px solid $form-focused-border;
131
+ }
132
+
133
+ &.selected, &.selected:hover {
134
+ background-color: $form-focused-border;
135
+ color: #fff;
136
+ }
189
137
  }
138
+
190
139
  }
140
+
191
141
  table.month-view {
192
142
  margin: 8px 5px;
193
143
 
194
144
  td {
195
- padding: 24px 12px;
145
+ padding: 13px 0px;
196
146
  }
197
147
  }
198
148
 
@@ -200,7 +150,65 @@
200
150
  margin: 5px 8px;
201
151
 
202
152
  td {
203
- padding: 16px 10px;
153
+ padding: 8px 0px;
154
+ }
155
+ }
156
+ }
157
+ }
158
+
159
+ .neo-datepicker-animate {
160
+ transition: transform ease 0.2s, opacity ease 0.2s;
161
+ }
162
+
163
+ /* Make the date picker larger on phones */
164
+ @media (max-width: 576px) {
165
+ .neo-datepicker-container {
166
+ .neo-datepicker-popup {
167
+ .neo-datepicker-header {
168
+ background: #e9ecef;
169
+ position: relative;
170
+ height: 40px;
171
+
172
+ button {
173
+ padding: 5px 4px;
174
+ width: 40px;
175
+ border: none;
176
+ background: none;
177
+
178
+ &:not(:disabled):hover {
179
+ background-color: #ced4da;
180
+ }
181
+ }
182
+ }
183
+ .neo-datepicker-content {
184
+
185
+ table {
186
+ width: 320px;
187
+
188
+ th {
189
+ text-align: center;
190
+ padding: 4px;
191
+ border: none;
192
+ }
193
+ td {
194
+ padding: 5px;
195
+ width: 34px;
196
+ }
197
+ }
198
+ table.month-view {
199
+ margin: 8px 5px;
200
+
201
+ td {
202
+ padding: 24px 12px;
203
+ }
204
+ }
205
+
206
+ table.year-view {
207
+ margin: 5px 8px;
208
+
209
+ td {
210
+ padding: 16px 10px;
211
+ }
204
212
  }
205
213
  }
206
214
  }