beyond-rails 0.0.165 → 0.0.170

This diff has not been reviewed by any users.
Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: c566f462a1c5ab7bd07c4a464781468362d052bf32835c439ed671f2c6c64835
4
- data.tar.gz: 6367fd44d0201414c5dfbdef0a656af28d3adcc3030af649613900e1b9c9b10c
3
+ metadata.gz: fe9348107090c2e538edc8e94a959f81fd266e2c91c6232df99ccb756f63b24e
4
+ data.tar.gz: ce7d73d7eae3fc61e1bab8552b0131835d9be9407b43b6643cb3903021a7cefd
5
5
  SHA512:
6
- metadata.gz: bde745d9b8bce315503cc37212039050e7bb78b71fc736e072ce237f425398d8c0a662800e8c46c79e721c463d4f73e82eade87786189a4a9735e731740626c7
7
- data.tar.gz: 7fa94ede9cd08b6013e9829289457dacd958227c1a64fed26e595ee8faf31addc8b64c990cc1bde968f711c155111d2c66d71257b656367fd8e7dec0a77a91ed
6
+ metadata.gz: 5578befc18d0efdd300b2fd76cc1b3d25b34a53aee556c229eac678316bf8df8a567dc0f0fe73be30b5289a67ca8860e9514e4356a36c91725b78a24f4e73ee1
7
+ data.tar.gz: 0174a26b7683af4f7bb9ef23e815615959de7b0723aee64743b23be047bbdd9ba5adb3cb11a45b6db875ee84fdce7510605029b81d66d5203d293a28d9c6d083
@@ -24,6 +24,7 @@ export default class Datepicker {
24
24
  this.menuDate = (timestamp === null) ? toDate(new Date()) : toDate(this.date)
25
25
  this.focused = false
26
26
  this.nextDate = null
27
+ this.backdropMode = options.backdropMode || 'auto'
27
28
  this.init()
28
29
  }
29
30
 
@@ -172,6 +173,14 @@ export default class Datepicker {
172
173
  })
173
174
  }
174
175
 
176
+ hide() {
177
+ const { timeMenu } = this
178
+ this.focused = false
179
+ this.clearInputStatus()
180
+ this.dateMenu.hide()
181
+ timeMenu && timeMenu.hide()
182
+ }
183
+
175
184
  addEvents() {
176
185
 
177
186
  this.addDateInputEvents()
@@ -217,6 +226,9 @@ export default class Datepicker {
217
226
  this.focused = false
218
227
  return
219
228
  }
229
+ if (this.backdropMode === 'manual') {
230
+ return
231
+ }
220
232
  if ((! dateMenu.isVisible) && (timeMenu && (! timeMenu.isVisible))) {
221
233
  return
222
234
  }
@@ -235,9 +247,7 @@ export default class Datepicker {
235
247
  if (timeMenuDom && (timeMenuDom === target)) {
236
248
  return
237
249
  }
238
- this.clearInputStatus()
239
- dateMenu.hide()
240
- timeMenu && timeMenu.hide()
250
+ this.hide()
241
251
  })
242
252
  }
243
253
 
@@ -15,6 +15,7 @@ export default class Dropdown {
15
15
  this.align = null
16
16
  this.defaultTextNode = this.getDefaultTextNode(dom, options.textIndex)
17
17
  this.defaultText = this.defaultTextNode ? this.defaultTextNode.textContent.trim() : ''
18
+ this.backdropMode = options.backdropMode || 'auto'
18
19
  this.init()
19
20
  }
20
21
 
@@ -121,6 +122,9 @@ export default class Dropdown {
121
122
  if (! this.isMenuVisible) {
122
123
  return
123
124
  }
125
+ if (this.backdropMode === 'manual') {
126
+ return
127
+ }
124
128
  // is backdrop
125
129
  if ((event.target !== this.dom) && (! this.dom.contains(event.target))) {
126
130
  this.hideMenu()
@@ -0,0 +1,131 @@
1
+ import parse from 'date-fns/parse'
2
+ import set from 'date-fns/set'
3
+ import noop from 'lodash.noop'
4
+ import TimeInput from './TimeInput'
5
+ import TimeMenu from './TimeMenu'
6
+ import supportDom from '../helpers/supportDom'
7
+ import { DEFAULT_TIMEZONE } from '../consts'
8
+ import dateToTimestamp from '@superlanding/datetotimestamp'
9
+ import timestampToDate from '@superlanding/timestamptodate'
10
+
11
+ @supportDom
12
+ export default class Timepicker {
13
+
14
+ constructor(dom, timestamp, options = {}) {
15
+ this.dom = dom
16
+ this.options = options
17
+ this.options.change = options.change || noop
18
+ this.tz = options.tz || DEFAULT_TIMEZONE
19
+
20
+ this.date = (timestamp === null) ? null : timestampToDate(timestamp)
21
+ this.focused = false
22
+ this.backdropMode = options.backdropMode || 'auto'
23
+ this.init()
24
+ }
25
+
26
+ init() {
27
+ this.timeInput = new TimeInput(
28
+ this.dom,
29
+ this.date,
30
+ this.options
31
+ )
32
+ this.timeMenu = new TimeMenu()
33
+ this.addEvents()
34
+ }
35
+
36
+ clearInputStatus() {
37
+ this.timeInput.clearStatus()
38
+ }
39
+
40
+ handleTimeInputFocus() {
41
+ const { timeInput } = this
42
+ this.focused = true
43
+ this.clearInputStatus()
44
+ timeInput.setActive(true)
45
+ this.timeMenu.show({ src: this.dom, date: timeInput.date })
46
+ }
47
+
48
+ handleTimeInputKeyUp(event) {
49
+ const { date, timeInput } = this
50
+ const { value } = event.target
51
+
52
+ if ((! timeInput.required) && (value === '')) {
53
+ this.nextDate = null
54
+ return
55
+ }
56
+ const res = parse(event.target.value, timeInput.timePattern, date)
57
+ this.nextDate = null
58
+
59
+ if (res.toString() === 'Invalid Date') {
60
+ return timeInput.setDanger(true)
61
+ }
62
+ timeInput.setDanger(false)
63
+ this.nextDate = res
64
+ }
65
+
66
+ handleTimeInputBlur() {
67
+ const { nextDate, date, timeInput } = this
68
+
69
+ if (nextDate) {
70
+ this.date = nextDate
71
+ timeInput.setDate(nextDate)
72
+ this.nextDate = null
73
+ }
74
+ else if (date) {
75
+ timeInput.setDate(date)
76
+ }
77
+ }
78
+
79
+ emitChange() {
80
+ const { date } = this
81
+ this.options.change({
82
+ date,
83
+ timestamp: dateToTimestamp(date)
84
+ })
85
+ }
86
+
87
+ hide() {
88
+ this.focused = false
89
+ this.clearInputStatus()
90
+ this.timeMenu.hide()
91
+ }
92
+
93
+ addEvents() {
94
+
95
+ this.timeInput.on('focus', () => this.handleTimeInputFocus())
96
+ this.timeInput.on('keyup', event => this.handleTimeInputKeyUp(event))
97
+ this.timeInput.on('blur', () => this.handleTimeInputBlur())
98
+
99
+ this.timeMenu.on('click', (event, res) => {
100
+ if (this.date === null) {
101
+ this.date = set(new Date(), { hours: res.hour, minutes: res.minute })
102
+ }
103
+ else {
104
+ this.date = set(this.date, { hours: res.hour, minutes: res.minute })
105
+ }
106
+ this.timeInput.setDate(this.date)
107
+ this.timeMenu.hide()
108
+ this.clearInputStatus()
109
+ this.emitChange()
110
+ })
111
+
112
+ this.addEvent(document, 'click', event => {
113
+ if (this.focused) {
114
+ this.focused = false
115
+ return
116
+ }
117
+ if (this.backdropMode === 'manual') {
118
+ return
119
+ }
120
+ if (event.target === this.dom) {
121
+ return
122
+ }
123
+ this.hide()
124
+ })
125
+ }
126
+
127
+ destroy() {
128
+ this.timeInput.destroy()
129
+ this.timeMenu.destroy()
130
+ }
131
+ }
@@ -17,6 +17,7 @@ import Navbar from './components/Navbar'
17
17
  import Radio from './components/Radio'
18
18
  import SearchDropdown from './components/SearchDropdown'
19
19
  import Sidebar from './components/Sidebar'
20
+ import Timepicker from './components/Timepicker'
20
21
  import Tabbox from './components/Tabbox'
21
22
  import Toast from './components/Toast'
22
23
  import Tooltip from './components/Tooltip'
@@ -38,6 +39,7 @@ export {
38
39
  Radio,
39
40
  SearchDropdown,
40
41
  Sidebar,
42
+ Timepicker,
41
43
  Tabbox,
42
44
  Toast,
43
45
  Tooltip,
@@ -122,6 +122,9 @@ $color-active: #5469d4;
122
122
  -webkit-overflow-scrolling: touch;
123
123
  }
124
124
 
125
+ .align-left {
126
+ text-align: left;
127
+ }
125
128
  .align-right {
126
129
  text-align: right;
127
130
  }
@@ -125,6 +125,9 @@ label {
125
125
 
126
126
  .form-control {
127
127
  @extend %form-control;
128
+ &::placeholder {
129
+ color: #a9aebf;
130
+ }
128
131
  padding: 5px 7px 6px;
129
132
  background-color: #fff;
130
133
  background-clip: padding-box;
@@ -42,7 +42,7 @@
42
42
  border: 0;
43
43
  box-shadow: none;
44
44
  &::placeholder {
45
- color: #697396;
45
+ color: #a9aebf;
46
46
  }
47
47
  }
48
48
  }
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: beyond-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.165
4
+ version: 0.0.170
5
5
  platform: ruby
6
6
  authors:
7
7
  - kmsheng
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2020-05-12 00:00:00.000000000 Z
12
+ date: 2020-06-05 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: sassc
@@ -112,6 +112,7 @@ files:
112
112
  - src/js/components/Tabbox.js
113
113
  - src/js/components/TimeInput.js
114
114
  - src/js/components/TimeMenu.js
115
+ - src/js/components/Timepicker.js
115
116
  - src/js/components/Toast.js
116
117
  - src/js/components/ToastItem.js
117
118
  - src/js/components/Tooltip.js