@pisell/date-picker 1.0.82 → 1.0.83

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 (9) hide show
  1. package/es/Dialog/index.js +16 -13
  2. package/es/PisellDateRangePicker/index.js +1 -2
  3. package/es/PisellDateRangePicker/index.less +32 -6
  4. package/es/internals/utils/date-fields-utils.d.ts +1 -1
  5. package/lib/Dialog/index.js +18 -5
  6. package/lib/PisellDateRangePicker/index.js +1 -1
  7. package/lib/PisellDateRangePicker/index.less +32 -6
  8. package/lib/internals/utils/date-fields-utils.d.ts +1 -1
  9. package/package.json +1 -1
package/es/Dialog/index.js CHANGED
@@ -1,22 +1,25 @@
1
- import React from "react";
2
- // import Drawer from "../Drawer";
3
-
4
- import Drawer from "@mui/material/Drawer";
1
+ import React from 'react';
2
+ import MuiDialog from '@mui/material/Dialog';
3
+ import Drawer from '@mui/material/Drawer';
5
4
  var Dialog = function Dialog(props) {
6
5
  var open = props.open,
7
6
  onClose = props.onClose,
8
7
  children = props.children;
9
-
10
- // return <MuiDialog open={open}>
11
- // {children}
12
- // </MuiDialog>
13
- return /*#__PURE__*/React.createElement(Drawer, {
14
- anchor: "bottom",
8
+ var isMobile = window.innerWidth < 768;
9
+ if (isMobile) {
10
+ return /*#__PURE__*/React.createElement(Drawer, {
11
+ anchor: 'bottom',
12
+ open: open,
13
+ onClose: onClose,
14
+ height: 650,
15
+ autoFocus: true,
16
+ className: 'date-picker-custom-drawer'
17
+ }, children);
18
+ }
19
+ return /*#__PURE__*/React.createElement(MuiDialog, {
15
20
  open: open,
16
21
  onClose: onClose,
17
- height: 650,
18
- autoFocus: true,
19
- className: window.innerWidth > 800 ? 'date-picker-paid-drawer' : 'date-picker-custom-drawer'
22
+ className: "date-picker-paid-drawer date-picker-custom-drawer"
20
23
  }, children);
21
24
  };
22
25
  export default Dialog;
package/es/PisellDateRangePicker/index.js CHANGED
@@ -72,8 +72,7 @@ var PisellDateRangePicker = function PisellDateRangePicker(props) {
72
72
  okButtonProps = props.okButtonProps,
73
73
  cancelButtonProps = props.cancelButtonProps,
74
74
  onDateChange = props.onDateChange,
75
- _props$desktopModeMed = props.desktopModeMediaQuery,
76
- desktopModeMediaQuery = _props$desktopModeMed === void 0 ? '(min-width: 625px)' : _props$desktopModeMed,
75
+ desktopModeMediaQuery = props.desktopModeMediaQuery,
77
76
  style = props.style,
78
77
  allowClear = props.allowClear,
79
78
  disablePortal = props.disablePortal,
package/es/PisellDateRangePicker/index.less CHANGED
@@ -41,6 +41,7 @@
41
41
  }
42
42
 
43
43
  .MuiPickersPopper-root {
44
+ font-size: 14px;
44
45
  .MuiPickersLayout-root {
45
46
  width: var(--pisell-date-range-picker-popup-width, 625px);
46
47
  display: block;
@@ -75,6 +76,7 @@
75
76
  .MuiDateRangePickerDay-day {
76
77
  width: 100%;
77
78
  height: auto;
79
+ font-size: 14px;
78
80
  &::before {
79
81
  content: "";
80
82
  display: block;
@@ -89,6 +91,7 @@
89
91
  }
90
92
 
91
93
  .MuiDialog-root {
94
+ font-size: 14px;
92
95
  .MuiPickersLayout-toolbar {
93
96
  display: none;
94
97
  }
@@ -99,13 +102,8 @@
99
102
  grid-row: 1/3 !important;
100
103
  }
101
104
 
102
- .date-picker-paid-drawer {
103
- .MuiPickersLayout-root {
104
- display: block;
105
- }
106
- }
107
-
108
105
  .date-picker-custom-drawer {
106
+ font-size: 14px;
109
107
  .MuiPickersCalendarHeader-root {
110
108
  padding-left: 35px;
111
109
  padding-right: 22px;
@@ -138,6 +136,7 @@
138
136
  .MuiDateRangePickerDay-day {
139
137
  width: 100%;
140
138
  height: auto;
139
+ font-size: 14px;
141
140
  &::before {
142
141
  content: "";
143
142
  display: block;
@@ -151,3 +150,30 @@
151
150
  border-top-right-radius: 8px;
152
151
  }
153
152
  }
153
+
154
+
155
+ .date-picker-paid-drawer {
156
+ font-size: 14px;
157
+ .MuiPickersLayout-root {
158
+ display: block;
159
+ }
160
+ .MuiDayCalendar-slideTransition {
161
+ height: 370px;
162
+ }
163
+ .MuiDateRangeCalendar-monthContainer {
164
+ .MuiDateRangePickerDay-root {
165
+ max-width: 60px;
166
+ max-height: 60px;
167
+ .MuiDateRangePickerDay-day {
168
+ width: 100%;
169
+ height: auto;
170
+ font-size: 14px;
171
+ &::before {
172
+ content: "";
173
+ display: block;
174
+ padding-top: 100%;
175
+ }
176
+ }
177
+ }
178
+ }
179
+ }
package/es/internals/utils/date-fields-utils.d.ts CHANGED
@@ -5,7 +5,7 @@ export declare const splitDateRangeSections: (sections: RangeFieldSection[]) =>
5
5
  };
6
6
  export declare const removeLastSeparator: (dateSections: RangeFieldSection[]) => (RangeFieldSection | {
7
7
  separator: null;
8
- dateName: "start" | "end";
8
+ dateName: "end" | "start";
9
9
  value: string;
10
10
  format: string;
11
11
  maxLength: number | null;
package/lib/Dialog/index.js CHANGED
@@ -33,18 +33,31 @@ __export(Dialog_exports, {
33
33
  });
34
34
  module.exports = __toCommonJS(Dialog_exports);
35
35
  var import_react = __toESM(require("react"));
36
+ var import_Dialog = __toESM(require("@mui/material/Dialog"));
36
37
  var import_Drawer = __toESM(require("@mui/material/Drawer"));
37
38
  var Dialog = (props) => {
38
39
  const { open, onClose, children } = props;
40
+ const isMobile = window.innerWidth < 768;
41
+ if (isMobile) {
42
+ return /* @__PURE__ */ import_react.default.createElement(
43
+ import_Drawer.default,
44
+ {
45
+ anchor: "bottom",
46
+ open,
47
+ onClose,
48
+ height: 650,
49
+ autoFocus: true,
50
+ className: "date-picker-custom-drawer"
51
+ },
52
+ children
53
+ );
54
+ }
39
55
  return /* @__PURE__ */ import_react.default.createElement(
40
- import_Drawer.default,
56
+ import_Dialog.default,
41
57
  {
42
- anchor: "bottom",
43
58
  open,
44
59
  onClose,
45
- height: 650,
46
- autoFocus: true,
47
- className: window.innerWidth > 800 ? "date-picker-paid-drawer" : "date-picker-custom-drawer"
60
+ className: "date-picker-paid-drawer date-picker-custom-drawer"
48
61
  },
49
62
  children
50
63
  );
package/lib/PisellDateRangePicker/index.js CHANGED
@@ -90,7 +90,7 @@ var PisellDateRangePicker = (props) => {
90
90
  okButtonProps,
91
91
  cancelButtonProps,
92
92
  onDateChange,
93
- desktopModeMediaQuery = "(min-width: 625px)",
93
+ desktopModeMediaQuery,
94
94
  style,
95
95
  allowClear,
96
96
  disablePortal,
package/lib/PisellDateRangePicker/index.less CHANGED
@@ -41,6 +41,7 @@
41
41
  }
42
42
 
43
43
  .MuiPickersPopper-root {
44
+ font-size: 14px;
44
45
  .MuiPickersLayout-root {
45
46
  width: var(--pisell-date-range-picker-popup-width, 625px);
46
47
  display: block;
@@ -75,6 +76,7 @@
75
76
  .MuiDateRangePickerDay-day {
76
77
  width: 100%;
77
78
  height: auto;
79
+ font-size: 14px;
78
80
  &::before {
79
81
  content: "";
80
82
  display: block;
@@ -89,6 +91,7 @@
89
91
  }
90
92
 
91
93
  .MuiDialog-root {
94
+ font-size: 14px;
92
95
  .MuiPickersLayout-toolbar {
93
96
  display: none;
94
97
  }
@@ -99,13 +102,8 @@
99
102
  grid-row: 1/3 !important;
100
103
  }
101
104
 
102
- .date-picker-paid-drawer {
103
- .MuiPickersLayout-root {
104
- display: block;
105
- }
106
- }
107
-
108
105
  .date-picker-custom-drawer {
106
+ font-size: 14px;
109
107
  .MuiPickersCalendarHeader-root {
110
108
  padding-left: 35px;
111
109
  padding-right: 22px;
@@ -138,6 +136,7 @@
138
136
  .MuiDateRangePickerDay-day {
139
137
  width: 100%;
140
138
  height: auto;
139
+ font-size: 14px;
141
140
  &::before {
142
141
  content: "";
143
142
  display: block;
@@ -151,3 +150,30 @@
151
150
  border-top-right-radius: 8px;
152
151
  }
153
152
  }
153
+
154
+
155
+ .date-picker-paid-drawer {
156
+ font-size: 14px;
157
+ .MuiPickersLayout-root {
158
+ display: block;
159
+ }
160
+ .MuiDayCalendar-slideTransition {
161
+ height: 370px;
162
+ }
163
+ .MuiDateRangeCalendar-monthContainer {
164
+ .MuiDateRangePickerDay-root {
165
+ max-width: 60px;
166
+ max-height: 60px;
167
+ .MuiDateRangePickerDay-day {
168
+ width: 100%;
169
+ height: auto;
170
+ font-size: 14px;
171
+ &::before {
172
+ content: "";
173
+ display: block;
174
+ padding-top: 100%;
175
+ }
176
+ }
177
+ }
178
+ }
179
+ }
package/lib/internals/utils/date-fields-utils.d.ts CHANGED
@@ -5,7 +5,7 @@ export declare const splitDateRangeSections: (sections: RangeFieldSection[]) =>
5
5
  };
6
6
  export declare const removeLastSeparator: (dateSections: RangeFieldSection[]) => (RangeFieldSection | {
7
7
  separator: null;
8
- dateName: "start" | "end";
8
+ dateName: "end" | "start";
9
9
  value: string;
10
10
  format: string;
11
11
  maxLength: number | null;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pisell/date-picker",
3
- "version": "1.0.82",
3
+ "version": "1.0.83",
4
4
  "sideEffects": [
5
5
  "*.less"
6
6
  ],