@synerise/ds-date-picker 0.14.8 → 1.0.0
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/CHANGELOG.md +8 -0
- package/dist/Elements/DayPicker/DayPicker.styles.js +5 -5
- package/dist/Elements/DecadePicker/DecadePicker.js +1 -1
- package/dist/Elements/GridPicker/GridPicker.js +1 -1
- package/dist/Elements/GridPicker/GridPicker.styles.js +2 -2
- package/dist/Elements/MonthPicker/MonthPicker.js +1 -1
- package/dist/Elements/TimePicker/TimePicker.styles.js +1 -1
- package/dist/Elements/YearPicker/YearPicker.js +1 -1
- package/dist/RawDatePicker/RawDatePicker.js +1 -1
- package/package.json +11 -11
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.14.9](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-picker@0.14.8...@synerise/ds-date-picker@0.14.9) (2025-03-10)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @synerise/ds-date-picker
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
## [0.14.8](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-picker@0.14.7...@synerise/ds-date-picker@0.14.8) (2025-03-04)
|
|
7
15
|
|
|
8
16
|
**Note:** Version bump only for package @synerise/ds-date-picker
|
|
@@ -6,25 +6,25 @@ var daySelector = function daySelector(modifier) {
|
|
|
6
6
|
};
|
|
7
7
|
export var DayBackground = styled.div.withConfig({
|
|
8
8
|
displayName: "DayPickerstyles__DayBackground",
|
|
9
|
-
componentId: "oi7l9r-0"
|
|
9
|
+
componentId: "sc-oi7l9r-0"
|
|
10
10
|
})([""]);
|
|
11
11
|
export var DayForeground = styled.div.withConfig({
|
|
12
12
|
displayName: "DayPickerstyles__DayForeground",
|
|
13
|
-
componentId: "oi7l9r-1"
|
|
13
|
+
componentId: "sc-oi7l9r-1"
|
|
14
14
|
})(["border-radius:50%;"]);
|
|
15
15
|
export var DayText = styled.div.withConfig({
|
|
16
16
|
displayName: "DayPickerstyles__DayText",
|
|
17
|
-
componentId: "oi7l9r-2"
|
|
17
|
+
componentId: "sc-oi7l9r-2"
|
|
18
18
|
})(["color:", ";border-radius:50%;"], function (props) {
|
|
19
19
|
return props.theme.palette['grey-700'];
|
|
20
20
|
});
|
|
21
21
|
export var DayTooltip = styled.div.withConfig({
|
|
22
22
|
displayName: "DayPickerstyles__DayTooltip",
|
|
23
|
-
componentId: "oi7l9r-3"
|
|
23
|
+
componentId: "sc-oi7l9r-3"
|
|
24
24
|
})(["display:none;"]);
|
|
25
25
|
export var DayPicker = styled(DayPickerBase).withConfig({
|
|
26
26
|
displayName: "DayPickerstyles__DayPicker",
|
|
27
|
-
componentId: "oi7l9r-4"
|
|
27
|
+
componentId: "sc-oi7l9r-4"
|
|
28
28
|
})(["display:inline-block;font-size:12px;.DayPicker-wrapper{position:relative;flex-direction:row;}.DayPicker-Months{display:flex;flex-wrap:wrap;justify-content:center;}.DayPicker-Month{display:table;margin:8px;border-spacing:0;border-collapse:collapse;}.DayPicker-Weekdays{display:table-header-group;}.DayPicker-WeekdaysRow{display:table-row;}.DayPicker-Weekday{min-width:39px;height:32px;display:table-cell;vertical-align:middle;text-align:center;font-weight:500;}.DayPicker-Weekday abbr[title]{border-bottom:none;text-decoration:none;}.DayPicker-Body{display:table-row-group;}.DayPicker-Week{display:table-row;}.DayPicker--interactionDisabled ", "{cursor:default;}", "{width:40px;height:40px;display:table-cell;cursor:pointer;position:relative;box-sizing:border-box;> div{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;margin:4px;min-width:32px;}&--start > ", "{border-top-left-radius:50%;border-bottom-left-radius:50%;}&--end > ", "{border-top-right-radius:50%;border-bottom-right-radius:50%;}&--today{font-weight:500;}&--today", "{& > ", "{font-weight:400;}}&--entered", ":not(", "){& > ", "{border-color:", ";margin-right:0;margin-left:4px;}& > ", "{margin-right:0;background-color:", ";}}&--entered", ":not(", "){& > ", "{border-color:", ";margin-right:4px;margin-left:4px;}& > ", "{margin-right:4px;background-color:", ";}}&--entered:not(", "):not(", "){& > ", "{background-color:", ";}}&--today", ":not(", "){& > ", "{background-color:", ";}}&--today", ":not(", "){& > ", "{background-color:transparent;font-weight:400;color:", ";}& > ", "{background-color:", ";}& > ", "{border:2px solid transparent;}}&--today:not(", "){& > ", "{background-color:", ";color:", ";}& > ", "{border:2px solid ", ";}}&--entered > ", "{background-color:", ";}&--entered > ", "{color:", ";}&--entered-start:not(", ") > ", "{border-top-left-radius:50%;border-bottom-left-radius:50%;}&--entered-end:not(", ") > ", "{border-top-right-radius:50%;border-bottom-right-radius:50%;}&--outside{& > ", "{color:", ";}}&--disabled{cursor:default;& > ", "{color:", ";}}}", ":not(", "):not(", "):not(", "),", ":not(", "):not(", "):not(", "){&:last-child > ", "{border-top-right-radius:50%;border-bottom-right-radius:50%;margin-right:4px;padding-right:0;}&:first-child > ", "{border-top-left-radius:50%;border-bottom-left-radius:50%;margin-left:4px;padding-left:0;}}", ":not(", "):not(", "){& > div{padding-left:4px;margin-left:0;padding-right:4px;margin-right:0;}& > ", "{background-color:", ";}& > ", "{color:", ";}&", "{& > ", "{background-color:", ";}& > ", "{color:inherit;}}}", ":not(", "):not(", "){& > div{padding-left:4px;margin-left:0;padding-right:4px;margin-right:0;text-align:center;}&& > ", "{background-color:", ";}&& > ", "{color:", ";}&", "{&& > ", "{background-color:", ";}&& > ", "{color:inherit;}}}", ":not(", "):not(", "){& > ", "{border-radius:50%;font-weight:500;color:", ";background-color:", ";margin-right:4px;padding-left:0px;padding-right:0px;}& > ", "{background-color:", ";}& > div{padding-left:0px;margin-left:4px;}}", ":not(", "):not(", "):last-child,", ":not(", "):not(", "):first-child{& > div{margin-right:4px;}& > ", "{background-color:", ";}}", ":not(", "):not(", "){& > ", "{border-radius:50%;font-weight:500;background-color:", ";color:", ";margin-left:4px;padding-left:4px;}& > div{padding-right:4px;margin-right:4px;}}", ":not(", "):not(", "){& > div{padding-right:4px;}}", ":not(", "):hover{position:relative;", "{height:24px;position:absolute;top:-30px;margin-left:calc(-50% + 16px);display:block;white-space:nowrap;background-color:rgba(56,67,80,0.9);padding:3px 8px;border-radius:3px;z-index:9;font-weight:400;color:", ";}}", ":not(", "):not(", "),", ":not(", "){& > ", "{background:transparent;}}", "{& > ", "{border-radius:50%;}}&.relative{", ":not(", "):not(", "){& > ", "{font-weight:500;}", ":not(", "):not(", "){& > ", "{background-color:", ";}& > ", "{color:", ";}}}"], DaySelectorPrefix, DaySelectorPrefix, DayBackground, DayBackground, daySelector('selected'), DayText, daySelector('entered-start'), daySelector('entered-end'), DayForeground, function (props) {
|
|
29
29
|
return props.theme.palette['blue-300'];
|
|
30
30
|
}, DayBackground, function (props) {
|
|
@@ -23,6 +23,7 @@ function getCells(cursor) {
|
|
|
23
23
|
});
|
|
24
24
|
}
|
|
25
25
|
var DecadePicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
26
|
+
_inheritsLoose(DecadePicker, _React$PureComponent);
|
|
26
27
|
function DecadePicker() {
|
|
27
28
|
var _this;
|
|
28
29
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
@@ -56,7 +57,6 @@ var DecadePicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
56
57
|
};
|
|
57
58
|
return _this;
|
|
58
59
|
}
|
|
59
|
-
_inheritsLoose(DecadePicker, _React$PureComponent);
|
|
60
60
|
var _proto = DecadePicker.prototype;
|
|
61
61
|
_proto.getSnapshotBeforeUpdate = function getSnapshotBeforeUpdate(prevProps) {
|
|
62
62
|
var value = this.props.value;
|
|
@@ -4,6 +4,7 @@ import React from 'react';
|
|
|
4
4
|
import classNames from 'classnames';
|
|
5
5
|
import * as S from './GridPicker.styles';
|
|
6
6
|
var GridPicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
7
|
+
_inheritsLoose(GridPicker, _React$PureComponent);
|
|
7
8
|
function GridPicker() {
|
|
8
9
|
var _this;
|
|
9
10
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
@@ -38,7 +39,6 @@ var GridPicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
38
39
|
};
|
|
39
40
|
return _this;
|
|
40
41
|
}
|
|
41
|
-
_inheritsLoose(GridPicker, _React$PureComponent);
|
|
42
42
|
var _proto = GridPicker.prototype;
|
|
43
43
|
_proto.render = function render() {
|
|
44
44
|
var cells = this.props.cells;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
2
|
export var GridContainer = styled.div.withConfig({
|
|
3
3
|
displayName: "GridPickerstyles__GridContainer",
|
|
4
|
-
componentId: "i8w1ym-0"
|
|
4
|
+
componentId: "sc-i8w1ym-0"
|
|
5
5
|
})(["display:grid;grid-template-columns:1fr 1fr 1fr;font-size:12px;padding:0 8px;.cell{height:32px;margin:auto 8px;cursor:pointer;position:relative;vertical-align:middle;text-align:center;> div{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;border-radius:16px;&:hover{background-color:", ";color:", ";}}&--selected{font-weight:500;}&--outside{color:", ";}&--disabled{cursor:default;color:", ";}}.cell--selected:not(.cell--disabled):not(.cell--outside){> div{background-color:", ";color:", ";&:hover{background-color:", ";}}}"], function (props) {
|
|
6
6
|
return props.theme.palette['grey-050'];
|
|
7
7
|
}, function (props) {
|
|
@@ -19,5 +19,5 @@ export var GridContainer = styled.div.withConfig({
|
|
|
19
19
|
});
|
|
20
20
|
export var CellContainer = styled.div.withConfig({
|
|
21
21
|
displayName: "GridPickerstyles__CellContainer",
|
|
22
|
-
componentId: "i8w1ym-1"
|
|
22
|
+
componentId: "sc-i8w1ym-1"
|
|
23
23
|
})([""]);
|
|
@@ -28,6 +28,7 @@ function getCells(cursor, min, max, locale) {
|
|
|
28
28
|
});
|
|
29
29
|
}
|
|
30
30
|
var MonthPicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
31
|
+
_inheritsLoose(MonthPicker, _React$PureComponent);
|
|
31
32
|
function MonthPicker() {
|
|
32
33
|
var _this;
|
|
33
34
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
@@ -49,7 +50,6 @@ var MonthPicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
49
50
|
};
|
|
50
51
|
return _this;
|
|
51
52
|
}
|
|
52
|
-
_inheritsLoose(MonthPicker, _React$PureComponent);
|
|
53
53
|
var _proto = MonthPicker.prototype;
|
|
54
54
|
_proto.getSnapshotBeforeUpdate = function getSnapshotBeforeUpdate(prevProps) {
|
|
55
55
|
var value = this.props.value;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
2
|
export var Container = styled.div.withConfig({
|
|
3
3
|
displayName: "TimePickerstyles__Container",
|
|
4
|
-
componentId: "js4ktp-0"
|
|
4
|
+
componentId: "sc-js4ktp-0"
|
|
5
5
|
})(["display:grid;grid-auto-columns:1fr;> *{grid-row:1;}&&{& > div > div{height:calc(100% - 18px);}}padding:16px 24px 0 24px;"]);
|
|
@@ -25,6 +25,7 @@ function getCells(cursor) {
|
|
|
25
25
|
});
|
|
26
26
|
}
|
|
27
27
|
var YearPicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
28
|
+
_inheritsLoose(YearPicker, _React$PureComponent);
|
|
28
29
|
function YearPicker() {
|
|
29
30
|
var _this;
|
|
30
31
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
@@ -58,7 +59,6 @@ var YearPicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
58
59
|
};
|
|
59
60
|
return _this;
|
|
60
61
|
}
|
|
61
|
-
_inheritsLoose(YearPicker, _React$PureComponent);
|
|
62
62
|
var _proto = YearPicker.prototype;
|
|
63
63
|
_proto.getSnapshotBeforeUpdate = function getSnapshotBeforeUpdate(prevProps) {
|
|
64
64
|
var value = this.props.value;
|
|
@@ -15,6 +15,7 @@ import { fnsStartOfMonth, fnsSetYear, fnsSetMonth, fnsSetDate, fnsStartOfDay, fn
|
|
|
15
15
|
import { changeDayWithHoursPreserved } from '../utils';
|
|
16
16
|
import { getDefaultTexts } from '../utils/getDefaultTexts';
|
|
17
17
|
var RawDatePicker = /*#__PURE__*/function (_React$Component) {
|
|
18
|
+
_inheritsLoose(RawDatePicker, _React$Component);
|
|
18
19
|
function RawDatePicker(props) {
|
|
19
20
|
var _this;
|
|
20
21
|
_this = _React$Component.call(this, props) || this;
|
|
@@ -204,7 +205,6 @@ var RawDatePicker = /*#__PURE__*/function (_React$Component) {
|
|
|
204
205
|
};
|
|
205
206
|
return _this;
|
|
206
207
|
}
|
|
207
|
-
_inheritsLoose(RawDatePicker, _React$Component);
|
|
208
208
|
var _proto = RawDatePicker.prototype;
|
|
209
209
|
_proto.getTexts = function getTexts() {
|
|
210
210
|
var _this$props3 = this.props,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synerise/ds-date-picker",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"description": "DatePicker UI Component for the Synerise Design System",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"repository": "Synerise/synerise-design",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"build:js": "babel --delete-dir-on-start --root-mode upward src --out-dir dist --extensions '.js,.ts,.tsx'",
|
|
22
22
|
"build:watch": "npm run build:js -- --watch",
|
|
23
23
|
"defs": "tsc --declaration --outDir dist/ --emitDeclarationOnly",
|
|
24
|
-
"pack:ci": "npm pack --pack-destination ../../
|
|
24
|
+
"pack:ci": "npm pack --pack-destination ../../storybook/storybook-static/static",
|
|
25
25
|
"prepublish": "npm run build",
|
|
26
26
|
"test": "jest",
|
|
27
27
|
"test:watch": "npm run test -- --watchAll",
|
|
@@ -35,14 +35,14 @@
|
|
|
35
35
|
"types": "dist/index.d.ts",
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@date-fns/upgrade": "^1.0.3",
|
|
38
|
-
"@synerise/ds-button": "^0.
|
|
39
|
-
"@synerise/ds-data-format": "^0.
|
|
40
|
-
"@synerise/ds-dropdown": "^0.
|
|
41
|
-
"@synerise/ds-icon": "^0.
|
|
42
|
-
"@synerise/ds-input": "^0.
|
|
43
|
-
"@synerise/ds-time-picker": "^0.
|
|
44
|
-
"@synerise/ds-tooltip": "^0.
|
|
45
|
-
"@synerise/ds-utils": "^0.
|
|
38
|
+
"@synerise/ds-button": "^1.0.0",
|
|
39
|
+
"@synerise/ds-data-format": "^1.0.0",
|
|
40
|
+
"@synerise/ds-dropdown": "^1.0.0",
|
|
41
|
+
"@synerise/ds-icon": "^1.0.0",
|
|
42
|
+
"@synerise/ds-input": "^1.0.0",
|
|
43
|
+
"@synerise/ds-time-picker": "^1.0.0",
|
|
44
|
+
"@synerise/ds-tooltip": "^1.0.0",
|
|
45
|
+
"@synerise/ds-utils": "^1.0.0",
|
|
46
46
|
"classnames": "2.3.2",
|
|
47
47
|
"date-fns": "2.16.1",
|
|
48
48
|
"lodash": "^4.17.21",
|
|
@@ -56,5 +56,5 @@
|
|
|
56
56
|
"react-intl": ">=3.12.0 <= 6.8",
|
|
57
57
|
"styled-components": "^5.3.3"
|
|
58
58
|
},
|
|
59
|
-
"gitHead": "
|
|
59
|
+
"gitHead": "e4c3690238a44b584b9ea41e4aa52b1eec42174b"
|
|
60
60
|
}
|