wini-web-components 1.7.2 → 1.7.4
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/component/calendar/calendar.d.ts +0 -1
- package/dist/component/calendar/calendar.js +23 -23
- package/dist/component/infinite-scroll/infinite-scroll.js +2 -1
- package/dist/component/rating/rating.d.ts +1 -2
- package/dist/component/rating/rating.js +3 -5
- package/dist/component/select1/select1.d.ts +0 -1
- package/dist/component/select1/select1.js +1 -6
- package/dist/index.js +1 -1
- package/package.json +1 -1
|
@@ -31,7 +31,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
31
31
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
32
32
|
exports.Calendar = exports.CalendarType = exports.inRangeTime = exports.endDate = exports.startDate = exports.today = void 0;
|
|
33
33
|
var react_1 = __importDefault(require("react"));
|
|
34
|
-
require("./calendar.css");
|
|
34
|
+
var calendar_module_css_1 = __importDefault(require("./calendar.module.css"));
|
|
35
35
|
var react_fontawesome_1 = require("@fortawesome/react-fontawesome");
|
|
36
36
|
var free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
|
|
37
37
|
var date_fns_1 = require("date-fns");
|
|
@@ -96,7 +96,7 @@ var Calendar = /** @class */ (function (_super) {
|
|
|
96
96
|
weekdayTitle = '';
|
|
97
97
|
break;
|
|
98
98
|
}
|
|
99
|
-
return react_1.default.createElement("div", { key: 'dtwk-' + i, className: 'date-picker-circle label-4
|
|
99
|
+
return react_1.default.createElement("div", { key: 'dtwk-' + i, className: "".concat(calendar_module_css_1.default['date-picker-circle'], " label-4"), style: { color: 'var(--neutral-text-title-color)' } }, weekdayTitle);
|
|
100
100
|
}),
|
|
101
101
|
Array.from({ length: 42 }).map(function (_, i) {
|
|
102
102
|
var _a, _b;
|
|
@@ -119,9 +119,9 @@ var Calendar = /** @class */ (function (_super) {
|
|
|
119
119
|
selected = true;
|
|
120
120
|
}
|
|
121
121
|
else if (timeValue.getMonth() !== _this.state.selectMonth) {
|
|
122
|
-
style = __assign(__assign({}, style), { color: '
|
|
122
|
+
style = __assign(__assign({}, style), { color: 'var(--neutral-text-subtitle-color)' });
|
|
123
123
|
}
|
|
124
|
-
return react_1.default.createElement("button", __assign({ type: "button", key: timeValue.toString(), className: "date-picker-circle body-3 ".concat(selected ? 'selected' : ''), style: style }, additionProps, { onClick: function () {
|
|
124
|
+
return react_1.default.createElement("button", __assign({ type: "button", key: timeValue.toString(), className: "".concat(calendar_module_css_1.default['date-picker-circle'], " body-3 ").concat(selected ? calendar_module_css_1.default['selected'] : ''), style: style }, additionProps, { onClick: function () {
|
|
125
125
|
_this.setState(__assign(__assign({}, _this.state), { value: timeValue }));
|
|
126
126
|
if (_this.props.onSelect)
|
|
127
127
|
_this.props.onSelect(timeValue);
|
|
@@ -194,7 +194,7 @@ var Calendar = /** @class */ (function (_super) {
|
|
|
194
194
|
if (_this.state.selectYear === _this.state.value.getFullYear() && i === _this.state.value.getMonth()) {
|
|
195
195
|
selected = true;
|
|
196
196
|
}
|
|
197
|
-
return react_1.default.createElement("button", __assign({ type: "button", key: timeValue.toString(), className: "month-picker-circle body-3 row ".concat(selected ? 'selected' : ''), style: style }, additionProps, { onClick: function () {
|
|
197
|
+
return react_1.default.createElement("button", __assign({ type: "button", key: timeValue.toString(), className: "".concat(calendar_module_css_1.default['month-picker-circle'], " body-3 row ").concat(selected ? calendar_module_css_1.default['selected'] : ''), style: style }, additionProps, { onClick: function () {
|
|
198
198
|
if (_this.props.type === CalendarType.MONTH) {
|
|
199
199
|
_this.setState(__assign(__assign({}, _this.state), { value: timeValue }));
|
|
200
200
|
if (_this.props.onSelect)
|
|
@@ -224,7 +224,7 @@ var Calendar = /** @class */ (function (_super) {
|
|
|
224
224
|
if (yearNumber === _this.state.value.getFullYear()) {
|
|
225
225
|
selected = true;
|
|
226
226
|
}
|
|
227
|
-
return react_1.default.createElement("button", __assign({ type: "button", key: yearNumber.toString(), className: "year-picker-circle body-3 row ".concat(selected ? 'selected' : ''), style: style }, additionProps, { onClick: function () {
|
|
227
|
+
return react_1.default.createElement("button", __assign({ type: "button", key: yearNumber.toString(), className: "".concat(calendar_module_css_1.default['year-picker-circle'], " body-3 row ").concat(selected ? calendar_module_css_1.default['selected'] : ''), style: style }, additionProps, { onClick: function () {
|
|
228
228
|
if (_this.props.type === CalendarType.YEAR) {
|
|
229
229
|
_this.setState(__assign(__assign({}, _this.state), { value: new Date(yearNumber) }));
|
|
230
230
|
if (_this.props.onSelect)
|
|
@@ -290,16 +290,16 @@ var Calendar = /** @class */ (function (_super) {
|
|
|
290
290
|
};
|
|
291
291
|
Calendar.prototype.render = function () {
|
|
292
292
|
var _this = this;
|
|
293
|
-
return react_1.default.createElement("div", { id: this.props.id, className: "row calendar-container ".concat(this.props.className), style: this.props.style },
|
|
294
|
-
this.props.showSidebar ? react_1.default.createElement("div", { className: "calendar-sidebar-options col" },
|
|
295
|
-
react_1.default.createElement("button", { type: "button", onClick: function () { }, className: "label-4 calendar-sidebar-option-buttton
|
|
296
|
-
react_1.default.createElement("button", { type: "button", className: "label-4 calendar-sidebar-option-buttton
|
|
297
|
-
react_1.default.createElement("button", { type: "button", className: "label-4 calendar-sidebar-option-buttton
|
|
298
|
-
react_1.default.createElement("button", { type: "button", className: "label-4 calendar-sidebar-option-buttton
|
|
299
|
-
react_1.default.createElement("div", { className: "calendar-body col" },
|
|
293
|
+
return react_1.default.createElement("div", { id: this.props.id, className: "row ".concat(calendar_module_css_1.default['calendar-container'], " ").concat(this.props.className), style: this.props.style },
|
|
294
|
+
this.props.showSidebar ? react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['calendar-sidebar-options'], " col") },
|
|
295
|
+
react_1.default.createElement("button", { type: "button", onClick: function () { }, className: "label-4 ".concat(calendar_module_css_1.default['calendar-sidebar-option-buttton']) }, "Yesterday"),
|
|
296
|
+
react_1.default.createElement("button", { type: "button", className: "label-4 ".concat(calendar_module_css_1.default['calendar-sidebar-option-buttton']) }, "Last week"),
|
|
297
|
+
react_1.default.createElement("button", { type: "button", className: "label-4 ".concat(calendar_module_css_1.default['calendar-sidebar-option-buttton']) }, "Last month"),
|
|
298
|
+
react_1.default.createElement("button", { type: "button", className: "label-4 ".concat(calendar_module_css_1.default['calendar-sidebar-option-buttton']) }, "Last year")) : null,
|
|
299
|
+
react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['calendar-body'], " col") },
|
|
300
300
|
react_1.default.createElement("div", { className: "row", style: { alignItems: 'start' } },
|
|
301
|
-
react_1.default.createElement("div", { className: "picker-date-container col" },
|
|
302
|
-
react_1.default.createElement("div", { className: 'picker-date-header row
|
|
301
|
+
react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['picker-date-container'], " col") },
|
|
302
|
+
react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['picker-date-header'], " row") },
|
|
303
303
|
react_1.default.createElement("button", { type: 'button', onClick: function () {
|
|
304
304
|
switch (_this.state.type) {
|
|
305
305
|
case CalendarType.YEAR:
|
|
@@ -396,8 +396,8 @@ var Calendar = /** @class */ (function (_super) {
|
|
|
396
396
|
}
|
|
397
397
|
} },
|
|
398
398
|
react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faAngleDoubleRight }))),
|
|
399
|
-
react_1.default.createElement("div", { className: 'picker-date-body row
|
|
400
|
-
this.props.type === CalendarType.DATETIME ? react_1.default.createElement("div", { className: "picker-time-container col" },
|
|
399
|
+
react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['picker-date-body'], " row") }, this.state.type === CalendarType.YEAR ? this.showYearInRange() : this.state.type === CalendarType.MONTH ? this.showMonthInYear() : this.showDateInMonth())),
|
|
400
|
+
this.props.type === CalendarType.DATETIME ? react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['picker-time-container'], " col") },
|
|
401
401
|
react_1.default.createElement("div", { className: "heading-7" },
|
|
402
402
|
this.state.selectHours < 10 ? "0".concat(this.state.selectHours) : this.state.selectHours,
|
|
403
403
|
":",
|
|
@@ -405,27 +405,27 @@ var Calendar = /** @class */ (function (_super) {
|
|
|
405
405
|
":",
|
|
406
406
|
this.state.selectSeconds < 10 ? "0".concat(this.state.selectSeconds) : this.state.selectSeconds),
|
|
407
407
|
react_1.default.createElement("div", { className: "row", style: { alignItems: 'start', flex: 1, height: '100%' } },
|
|
408
|
-
react_1.default.createElement("div", { className: "scroll-picker-hours col" }, Array.from({ length: 24 }).map(function (_, i) { return react_1.default.createElement("button", { type: "button", onClick: function () {
|
|
408
|
+
react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['scroll-picker-hours'], " col") }, Array.from({ length: 24 }).map(function (_, i) { return react_1.default.createElement("button", { type: "button", onClick: function () {
|
|
409
409
|
var newValue = _this.state.value;
|
|
410
410
|
newValue.setHours(i);
|
|
411
411
|
_this.setState(__assign(__assign({}, _this.state), { selectHours: i, value: newValue }));
|
|
412
412
|
if (_this.props.onSelect)
|
|
413
413
|
_this.props.onSelect(newValue);
|
|
414
|
-
}, key: "hours-".concat(i), className: "label-4 ".concat(_this.state.selectHours === (i) ? 'selected' : '') }, i < 10 ? "0".concat(i) : i); })),
|
|
415
|
-
react_1.default.createElement("div", { className: "scroll-picker-minutes col" }, Array.from({ length: 60 }).map(function (_, i) { return react_1.default.createElement("button", { type: "button", onClick: function () {
|
|
414
|
+
}, key: "hours-".concat(i), className: "label-4 ".concat(_this.state.selectHours === (i) ? calendar_module_css_1.default['selected'] : '') }, i < 10 ? "0".concat(i) : i); })),
|
|
415
|
+
react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['scroll-picker-minutes'], " col") }, Array.from({ length: 60 }).map(function (_, i) { return react_1.default.createElement("button", { type: "button", onClick: function () {
|
|
416
416
|
var newValue = _this.state.value;
|
|
417
417
|
newValue.setMinutes(i);
|
|
418
418
|
_this.setState(__assign(__assign({}, _this.state), { selectMinutes: i, value: newValue }));
|
|
419
419
|
if (_this.props.onSelect)
|
|
420
420
|
_this.props.onSelect(newValue);
|
|
421
|
-
}, key: "hours-".concat(i), className: "label-4 ".concat(_this.state.selectMinutes === (i) ? 'selected' : '') }, i < 10 ? "0".concat(i) : i); })),
|
|
422
|
-
react_1.default.createElement("div", { className: "scroll-picker-seconds col" }, Array.from({ length: 60 }).map(function (_, i) { return react_1.default.createElement("button", { type: "button", onClick: function () {
|
|
421
|
+
}, key: "hours-".concat(i), className: "label-4 ".concat(_this.state.selectMinutes === (i) ? calendar_module_css_1.default['selected'] : '') }, i < 10 ? "0".concat(i) : i); })),
|
|
422
|
+
react_1.default.createElement("div", { className: "".concat(calendar_module_css_1.default['scroll-picker-seconds'], " col") }, Array.from({ length: 60 }).map(function (_, i) { return react_1.default.createElement("button", { type: "button", onClick: function () {
|
|
423
423
|
var newValue = _this.state.value;
|
|
424
424
|
newValue.setSeconds(i);
|
|
425
425
|
_this.setState(__assign(__assign({}, _this.state), { selectSeconds: i, value: newValue }));
|
|
426
426
|
if (_this.props.onSelect)
|
|
427
427
|
_this.props.onSelect(newValue);
|
|
428
|
-
}, key: "hours-".concat(i), className: "label-4 ".concat(_this.state.selectSeconds === (i) ? 'selected' : '') }, i < 10 ? "0".concat(i) : i); })))) : null),
|
|
428
|
+
}, key: "hours-".concat(i), className: "label-4 ".concat(_this.state.selectSeconds === (i) ? calendar_module_css_1.default['selected'] : '') }, i < 10 ? "0".concat(i) : i); })))) : null),
|
|
429
429
|
this.props.footer));
|
|
430
430
|
};
|
|
431
431
|
return Calendar;
|
|
@@ -67,6 +67,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
67
67
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
68
68
|
exports.InfiniteScroll = void 0;
|
|
69
69
|
var react_1 = __importDefault(require("react"));
|
|
70
|
+
var infinite_scroll_module_css_1 = __importDefault(require("./infinite-scroll.module.css"));
|
|
70
71
|
var InfiniteScroll = /** @class */ (function (_super) {
|
|
71
72
|
__extends(InfiniteScroll, _super);
|
|
72
73
|
function InfiniteScroll() {
|
|
@@ -95,7 +96,7 @@ var InfiniteScroll = /** @class */ (function (_super) {
|
|
|
95
96
|
case 2: return [2 /*return*/];
|
|
96
97
|
}
|
|
97
98
|
});
|
|
98
|
-
}); }, className: "infinite-scroll ".concat(this.state.loading ? 'loading' : '', " ").concat((_a = this.props.className) !== null && _a !== void 0 ? _a : 'col'), style: (_b = this.props.style) !== null && _b !== void 0 ? _b : { 'overflow': 'hidden auto' } }, this.props.children);
|
|
99
|
+
}); }, className: "".concat(infinite_scroll_module_css_1.default['infinite-scroll'], " ").concat(this.state.loading ? infinite_scroll_module_css_1.default['loading'] : '', " ").concat((_a = this.props.className) !== null && _a !== void 0 ? _a : 'col'), style: (_b = this.props.style) !== null && _b !== void 0 ? _b : { 'overflow': 'hidden auto' } }, this.props.children);
|
|
99
100
|
};
|
|
100
101
|
return InfiniteScroll;
|
|
101
102
|
}(react_1.default.Component));
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React, { CSSProperties } from "react";
|
|
2
|
-
import './rating.css';
|
|
3
2
|
interface RatingProps {
|
|
4
3
|
id?: string;
|
|
5
4
|
/**
|
|
@@ -7,7 +6,7 @@ interface RatingProps {
|
|
|
7
6
|
*/
|
|
8
7
|
value?: number;
|
|
9
8
|
size?: number | string;
|
|
10
|
-
onChange?: (e: number) =>
|
|
9
|
+
onChange?: (e: number) => void;
|
|
11
10
|
className?: string;
|
|
12
11
|
style?: CSSProperties;
|
|
13
12
|
strokeColor?: string;
|
|
@@ -20,10 +20,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
20
20
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
21
|
exports.Rating = void 0;
|
|
22
22
|
var react_1 = __importDefault(require("react"));
|
|
23
|
-
require("./rating.css");
|
|
24
|
-
var autoKeyId = function () { return
|
|
25
|
-
return (parseFloat(c) ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (parseFloat(c) / 4)))).toString(16);
|
|
26
|
-
}); };
|
|
23
|
+
var rating_module_css_1 = __importDefault(require("./rating.module.css"));
|
|
24
|
+
var autoKeyId = function () { return window.crypto.randomUUID().replace(/-/g, ''); };
|
|
27
25
|
var Rating = /** @class */ (function (_super) {
|
|
28
26
|
__extends(Rating, _super);
|
|
29
27
|
function Rating() {
|
|
@@ -44,7 +42,7 @@ var Rating = /** @class */ (function (_super) {
|
|
|
44
42
|
Rating.prototype.render = function () {
|
|
45
43
|
var _this = this;
|
|
46
44
|
var _a;
|
|
47
|
-
return react_1.default.createElement("div", { id: this.props.id, className: "row rating-container ".concat((_a = this.props.className) !== null && _a !== void 0 ? _a : ''), style: this.props.style }, Array.from({ length: 5 }).map(function (_, i) {
|
|
45
|
+
return react_1.default.createElement("div", { id: this.props.id, className: "row ".concat(rating_module_css_1.default['rating-container'], " ").concat((_a = this.props.className) !== null && _a !== void 0 ? _a : ''), style: this.props.style }, Array.from({ length: 5 }).map(function (_, i) {
|
|
48
46
|
var _a, _b, _c, _d, _e;
|
|
49
47
|
var uniqueId = 'rating-star-grad-0';
|
|
50
48
|
var stopValue = 0;
|
|
@@ -292,12 +292,7 @@ var Select1 = /** @class */ (function (_super) {
|
|
|
292
292
|
else if (!_this.state.onSelect)
|
|
293
293
|
_this.setState(__assign(__assign({}, _this.state), { isOpen: false, onSelect: null }));
|
|
294
294
|
} }) : _value.name,
|
|
295
|
-
|
|
296
|
-
ev.stopPropagation();
|
|
297
|
-
if (_this.state.value)
|
|
298
|
-
_this.setState(__assign(__assign({}, _this.state), { isOpen: true, value: undefined }));
|
|
299
|
-
} },
|
|
300
|
-
react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faXmarkCircle, style: { fontSize: '1.6rem', color: "var(--neutral-text-subtitle-color)" } })) : react_1.default.createElement("div", { ref: function (iconRef) {
|
|
295
|
+
react_1.default.createElement("div", { ref: function (iconRef) {
|
|
301
296
|
if ((iconRef === null || iconRef === void 0 ? void 0 : iconRef.parentElement) && iconRef.parentElement.getBoundingClientRect().width < 120)
|
|
302
297
|
iconRef.style.display = "none";
|
|
303
298
|
}, className: 'row' },
|