@semcore/date-picker 4.0.1 → 4.1.1

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.
@@ -19,25 +19,25 @@ import Dropdown from '@semcore/dropdown';
19
19
  import i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';
20
20
  import { localizedMessages } from '../translations/__intergalactic-dynamic-locales';
21
21
  /*__reshadow-styles__:"../style/date-picker.shadow.css"*/
22
- var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SPopper_8hs6n_gg_{padding:var(--intergalactic-spacing-4x, 16px);outline:0}.___SPopper_8hs6n_gg_::-moz-focus-inner{border:0;padding:0}.___SPopper_8hs6n_gg_:active,.___SPopper_8hs6n_gg_:focus{outline:0;text-decoration:none}@media (hover:hover){.___SPopper_8hs6n_gg_:hover{outline:0;text-decoration:none}}.___SPopper_8hs6n_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SHeader_8hs6n_gg_,.___STitle_8hs6n_gg_{display:flex;align-items:center}.___STitle_8hs6n_gg_{font-size:var(--intergalactic-fs-200, 14px);color:var(--intergalactic-text-primary, #191b23);height:32px;width:100%;justify-content:center}.___SToday_8hs6n_gg_{display:flex;margin-top:var(--intergalactic-spacing-3x, 12px);justify-content:center}.___SPeriod_8hs6n_gg_{display:flex;flex-direction:column;margin-bottom:var(--intergalactic-spacing-2x, 8px)}.___SButton_8hs6n_gg_ .___SInner_8hs6n_gg_{justify-content:flex-start}.___SInputMask_8hs6n_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SIndicator_8hs6n_gg_{color:var(--intergalactic-text-secondary, #6c6e79)}.___SHumanizedDate_8hs6n_gg_{position:absolute;pointer-events:none}.___SDateRange_8hs6n_gg_ .___SMask_8hs6n_gg_,.___SDateRange_8hs6n_gg_ .___SValue_8hs6n_gg_,.___SSingleDateInput_8hs6n_gg_ .___SMask_8hs6n_gg_,.___SSingleDateInput_8hs6n_gg_ .___SValue_8hs6n_gg_{opacity:0}.___SSingleDateInput_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SHumanizedDate_8hs6n_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SSingleDateInput_8hs6n_gg_:focus-within .___SHumanizedDate_8hs6n_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SSingleDateInput_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SMask_8hs6n_gg_,.___SSingleDateInput_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SValue_8hs6n_gg_{opacity:1}.___SSingleDateInput_8hs6n_gg_:focus-within .___SMask_8hs6n_gg_,.___SSingleDateInput_8hs6n_gg_:focus-within .___SValue_8hs6n_gg_{opacity:1}.___SDateRange_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SHumanizedDate_8hs6n_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SDateRange_8hs6n_gg_:focus-within .___SHumanizedDate_8hs6n_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SDateRange_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SMask_8hs6n_gg_,.___SDateRange_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SValue_8hs6n_gg_{opacity:1}.___SDateRange_8hs6n_gg_:focus-within .___SMask_8hs6n_gg_,.___SDateRange_8hs6n_gg_:focus-within .___SValue_8hs6n_gg_{opacity:1}.___SInputMask_8hs6n_gg_.__noHumanizedDate_8hs6n_gg_ .___SMask_8hs6n_gg_,.___SInputMask_8hs6n_gg_.__noHumanizedDate_8hs6n_gg_ .___SValue_8hs6n_gg_{opacity:1}.___SDateRange_8hs6n_gg_ .___SInputMask_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SMask_8hs6n_gg_{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SDateRange_8hs6n_gg_ .___SInputMask_8hs6n_gg_:focus-within .___SMask_8hs6n_gg_{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SDateRange_8hs6n_gg_.__focus-within_8hs6n_gg_ .___SRangeSep_8hs6n_gg_,.___SRangeSep_8hs6n_gg_.__fulfilled_8hs6n_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SDateRange_8hs6n_gg_:focus-within .___SRangeSep_8hs6n_gg_,.___SRangeSep_8hs6n_gg_.__fulfilled_8hs6n_gg_{color:var(--intergalactic-text-primary, #191b23)}" /*__inner_css_end__*/, "8hs6n_gg_") /*__reshadow_css_end__*/, {
23
- "__SPopper": "___SPopper_8hs6n_gg_",
24
- "__SHeader": "___SHeader_8hs6n_gg_",
25
- "__STitle": "___STitle_8hs6n_gg_",
26
- "__SToday": "___SToday_8hs6n_gg_",
27
- "__SPeriod": "___SPeriod_8hs6n_gg_",
28
- "__SButton": "___SButton_8hs6n_gg_",
29
- "__SInner": "___SInner_8hs6n_gg_",
30
- "__SInputMask": "___SInputMask_8hs6n_gg_",
31
- "__SIndicator": "___SIndicator_8hs6n_gg_",
32
- "__SHumanizedDate": "___SHumanizedDate_8hs6n_gg_",
33
- "__SSingleDateInput": "___SSingleDateInput_8hs6n_gg_",
34
- "__SValue": "___SValue_8hs6n_gg_",
35
- "__SDateRange": "___SDateRange_8hs6n_gg_",
36
- "__SMask": "___SMask_8hs6n_gg_",
37
- "_focus-within": "__focus-within_8hs6n_gg_",
38
- "_noHumanizedDate": "__noHumanizedDate_8hs6n_gg_",
39
- "__SRangeSep": "___SRangeSep_8hs6n_gg_",
40
- "_fulfilled": "__fulfilled_8hs6n_gg_"
22
+ var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SPopper_hdghq_gg_{padding:var(--intergalactic-spacing-4x, 16px);outline:0}.___SPopper_hdghq_gg_::-moz-focus-inner{border:0;padding:0}.___SPopper_hdghq_gg_:active,.___SPopper_hdghq_gg_:focus{outline:0;text-decoration:none}@media (hover:hover){.___SPopper_hdghq_gg_:hover{outline:0;text-decoration:none}}.___SPopper_hdghq_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SHeader_hdghq_gg_,.___STitle_hdghq_gg_{display:flex;align-items:center}.___STitle_hdghq_gg_{font-size:var(--intergalactic-fs-200, 14px);color:var(--intergalactic-text-primary, #191b23);height:32px;width:100%;justify-content:center}.___SToday_hdghq_gg_{display:flex;margin-top:var(--intergalactic-spacing-3x, 12px);justify-content:center}.___SPeriod_hdghq_gg_{display:flex;flex-direction:column;margin-bottom:var(--intergalactic-spacing-2x, 8px)}.___SButton_hdghq_gg_ .___SInner_hdghq_gg_{justify-content:flex-start}.___SInputMask_hdghq_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SIndicator_hdghq_gg_{color:var(--intergalactic-text-secondary, #6c6e79)}.___SHumanizedDate_hdghq_gg_{position:absolute;pointer-events:none}.___SDateRange_hdghq_gg_ .___SMask_hdghq_gg_,.___SDateRange_hdghq_gg_ .___SValue_hdghq_gg_,.___SSingleDateInput_hdghq_gg_ .___SMask_hdghq_gg_,.___SSingleDateInput_hdghq_gg_ .___SValue_hdghq_gg_{opacity:0}.___SSingleDateInput_hdghq_gg_.__focus-within_hdghq_gg_ .___SHumanizedDate_hdghq_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SSingleDateInput_hdghq_gg_:focus-within .___SHumanizedDate_hdghq_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SSingleDateInput_hdghq_gg_.__focus-within_hdghq_gg_ .___SMask_hdghq_gg_,.___SSingleDateInput_hdghq_gg_.__focus-within_hdghq_gg_ .___SValue_hdghq_gg_{opacity:1}.___SSingleDateInput_hdghq_gg_:focus-within .___SMask_hdghq_gg_,.___SSingleDateInput_hdghq_gg_:focus-within .___SValue_hdghq_gg_{opacity:1}.___SDateRange_hdghq_gg_.__focus-within_hdghq_gg_ .___SHumanizedDate_hdghq_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SDateRange_hdghq_gg_:focus-within .___SHumanizedDate_hdghq_gg_{opacity:0;z-index:var(--intergalactic-z-index-deep, -999)}.___SDateRange_hdghq_gg_.__focus-within_hdghq_gg_ .___SMask_hdghq_gg_,.___SDateRange_hdghq_gg_.__focus-within_hdghq_gg_ .___SValue_hdghq_gg_{opacity:1}.___SDateRange_hdghq_gg_:focus-within .___SMask_hdghq_gg_,.___SDateRange_hdghq_gg_:focus-within .___SValue_hdghq_gg_{opacity:1}.___SInputMask_hdghq_gg_.__noHumanizedDate_hdghq_gg_ .___SMask_hdghq_gg_,.___SInputMask_hdghq_gg_.__noHumanizedDate_hdghq_gg_ .___SValue_hdghq_gg_{opacity:1}.___SDateRange_hdghq_gg_ .___SInputMask_hdghq_gg_.__focus-within_hdghq_gg_ .___SMask_hdghq_gg_{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SDateRange_hdghq_gg_ .___SInputMask_hdghq_gg_:focus-within .___SMask_hdghq_gg_{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SDateRange_hdghq_gg_.__focus-within_hdghq_gg_ .___SRangeSep_hdghq_gg_,.___SRangeSep_hdghq_gg_.__fulfilled_hdghq_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SDateRange_hdghq_gg_:focus-within .___SRangeSep_hdghq_gg_,.___SRangeSep_hdghq_gg_.__fulfilled_hdghq_gg_{color:var(--intergalactic-text-primary, #191b23)}" /*__inner_css_end__*/, "hdghq_gg_") /*__reshadow_css_end__*/, {
23
+ "__SPopper": "___SPopper_hdghq_gg_",
24
+ "__SHeader": "___SHeader_hdghq_gg_",
25
+ "__STitle": "___STitle_hdghq_gg_",
26
+ "__SToday": "___SToday_hdghq_gg_",
27
+ "__SPeriod": "___SPeriod_hdghq_gg_",
28
+ "__SButton": "___SButton_hdghq_gg_",
29
+ "__SInner": "___SInner_hdghq_gg_",
30
+ "__SInputMask": "___SInputMask_hdghq_gg_",
31
+ "__SIndicator": "___SIndicator_hdghq_gg_",
32
+ "__SHumanizedDate": "___SHumanizedDate_hdghq_gg_",
33
+ "__SSingleDateInput": "___SSingleDateInput_hdghq_gg_",
34
+ "__SValue": "___SValue_hdghq_gg_",
35
+ "__SDateRange": "___SDateRange_hdghq_gg_",
36
+ "__SMask": "___SMask_hdghq_gg_",
37
+ "_focus-within": "__focus-within_hdghq_gg_",
38
+ "_noHumanizedDate": "__noHumanizedDate_hdghq_gg_",
39
+ "__SRangeSep": "___SRangeSep_hdghq_gg_",
40
+ "_fulfilled": "__fulfilled_hdghq_gg_"
41
41
  });
42
42
  var INTERACTION_TAGS = ['INPUT'];
43
43
  var defaultDisplayedPeriod = new Date(new Date().setHours(0, 0, 0, 0));
@@ -59,7 +59,7 @@ SCalendarUnit {
59
59
  min-height: 32px;
60
60
  min-width: 32px;
61
61
  position: relative;
62
- transition: color 0.15s, background 0.15s;
62
+ transition: color 0.15s, background 0.15s, border-radius 0.15s 0.15s;
63
63
  outline: none;
64
64
  margin: 0;
65
65
 
@@ -98,6 +98,7 @@ SCalendarUnit[today]SCalendarUnit[endSelected] {
98
98
  SCalendarUnit[selected] {
99
99
  background: var(--intergalactic-date-picker-cell-range, #c4e5fe);
100
100
  border-radius: 0;
101
+ transition: color 0.15s, background 0.15s, border-radius 0s 0s;
101
102
  color: var(--intergalactic-text-primary, #191b23);
102
103
 
103
104
  &:hover {
@@ -106,8 +107,9 @@ SCalendarUnit[selected] {
106
107
  }
107
108
 
108
109
  SCalendarUnit[highlighted] {
109
- background: var(--intergalactic-date-picker-cell-range, #c4e5fe);
110
+ background: var(--intergalactic-date-picker-cell-range-hover, #8ecdff);
110
111
  border-radius: 0;
112
+ transition: color 0.15s, background 0.15s, border-radius 0s 0s;
111
113
  color: var(--intergalactic-text-primary, #191b23);
112
114
 
113
115
  &:hover {
@@ -116,13 +118,16 @@ SCalendarUnit[highlighted] {
116
118
  }
117
119
 
118
120
  SCalendarUnit[startSelected] {
119
- border-bottom-left-radius: var(--intergalactic-control-rounded, 6px);
120
- border-bottom-right-radius: 0;
121
- border-top-left-radius: var(--intergalactic-control-rounded, 6px);
122
- border-top-right-radius: 0;
123
121
  color: var(--intergalactic-text-primary-invert, #ffffff);
124
122
  background: var(--intergalactic-date-picker-cell-active, #2bb3ff);
125
123
 
124
+ &:not([highlighted]) {
125
+ border-bottom-left-radius: var(--intergalactic-control-rounded, 6px);
126
+ border-bottom-right-radius: 0;
127
+ border-top-left-radius: var(--intergalactic-control-rounded, 6px);
128
+ border-top-right-radius: 0;
129
+ }
130
+
126
131
  &:hover {
127
132
  color: var(--intergalactic-text-primary-invert, #ffffff);
128
133
  background: var(--intergalactic-date-picker-cell-active-hover, #008ff8);
@@ -131,26 +136,29 @@ SCalendarUnit[startSelected] {
131
136
 
132
137
  SCalendarUnit[endSelected] {
133
138
  background: var(--intergalactic-date-picker-cell-active, #2bb3ff);
134
- border-bottom-left-radius: 0;
135
- border-bottom-right-radius: var(--intergalactic-control-rounded, 6px);
136
- border-top-left-radius: 0;
137
- border-top-right-radius: var(--intergalactic-control-rounded, 6px);
138
139
  color: var(--intergalactic-text-primary-invert, #ffffff);
139
140
 
141
+ &:not([highlighted]) {
142
+ border-bottom-left-radius: 0;
143
+ border-bottom-right-radius: var(--intergalactic-control-rounded, 6px);
144
+ border-top-left-radius: 0;
145
+ border-top-right-radius: var(--intergalactic-control-rounded, 6px);
146
+ }
147
+
140
148
  &:hover {
141
149
  color: var(--intergalactic-text-primary-invert, #ffffff);
142
150
  background: var(--intergalactic-date-picker-cell-active-hover, #008ff8);
143
151
  }
144
152
  }
145
153
 
146
- SCalendarUnit[startHighlighted] {
154
+ SCalendarUnit[startHighlighted]:not([selected]) {
147
155
  border-bottom-left-radius: var(--intergalactic-control-rounded, 6px);
148
156
  border-bottom-right-radius: 0;
149
157
  border-top-left-radius: var(--intergalactic-control-rounded, 6px);
150
158
  border-top-right-radius: 0;
151
159
  }
152
160
 
153
- SCalendarUnit[endHighlighted] {
161
+ SCalendarUnit[endHighlighted]:not([selected]) {
154
162
  border-bottom-left-radius: 0;
155
163
  border-bottom-right-radius: var(--intergalactic-control-rounded, 6px);
156
164
  border-top-left-radius: 0;
@@ -182,7 +190,10 @@ SCalendarUnit[disabled] {
182
190
  }
183
191
 
184
192
  @media (prefers-reduced-motion) {
185
- SCalendarUnit {
193
+
194
+ SCalendarUnit,
195
+ SCalendarUnit[selected],
196
+ SCalendarUnit[highlighted] {
186
197
  transition: none;
187
198
  }
188
- }
199
+ }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/date-picker",
3
3
  "description": "Semrush DatePicker Component",
4
- "version": "4.0.1",
4
+ "version": "4.1.1",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
@@ -10,16 +10,16 @@
10
10
  "license": "MIT",
11
11
  "dependencies": {
12
12
  "@semcore/utils": "4.0.0",
13
- "@semcore/base-trigger": "4.0.1",
14
- "@semcore/button": "5.0.1",
15
- "@semcore/divider": "4.0.0",
16
- "@semcore/dropdown": "4.0.0",
17
- "@semcore/flex-box": "5.0.0",
18
- "@semcore/icon": "4.0.0",
19
- "@semcore/input": "4.0.1",
20
- "@semcore/input-mask": "5.0.1",
13
+ "@semcore/base-trigger": "4.2.0",
14
+ "@semcore/button": "5.1.0",
15
+ "@semcore/divider": "4.1.0",
16
+ "@semcore/dropdown": "4.1.0",
17
+ "@semcore/flex-box": "5.1.0",
18
+ "@semcore/icon": "4.2.0",
19
+ "@semcore/input": "4.2.0",
20
+ "@semcore/input-mask": "5.2.0",
21
21
  "@semcore/neighbor-location": "4.0.1",
22
- "@semcore/typography": "5.0.0",
22
+ "@semcore/typography": "5.2.0",
23
23
  "dayjs": "1.8.36"
24
24
  },
25
25
  "peerDependencies": {