@windwalker-io/unicorn-next 0.1.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.
Files changed (175) hide show
  1. package/.editorconfig +18 -0
  2. package/.gulp.json +7 -0
  3. package/bin/release.mjs +47 -0
  4. package/dist/chunks/_arrayPush.js +168 -0
  5. package/dist/chunks/_arrayPush.js.map +1 -0
  6. package/dist/chunks/_baseRest.js +73 -0
  7. package/dist/chunks/_baseRest.js.map +1 -0
  8. package/dist/chunks/_commonjsHelpers.js +7 -0
  9. package/dist/chunks/_commonjsHelpers.js.map +1 -0
  10. package/dist/chunks/_getPrototype.js +130 -0
  11. package/dist/chunks/_getPrototype.js.map +1 -0
  12. package/dist/chunks/button-radio.js +147 -0
  13. package/dist/chunks/button-radio.js.map +1 -0
  14. package/dist/chunks/checkboxes-multi-select.js +44 -0
  15. package/dist/chunks/checkboxes-multi-select.js.map +1 -0
  16. package/dist/chunks/cloneDeep.js +287 -0
  17. package/dist/chunks/cloneDeep.js.map +1 -0
  18. package/dist/chunks/cropper.min.js +5 -0
  19. package/dist/chunks/cropper.min.js.map +1 -0
  20. package/dist/chunks/field-cascade-select.js +256 -0
  21. package/dist/chunks/field-cascade-select.js.map +1 -0
  22. package/dist/chunks/field-file-drag.js +218 -0
  23. package/dist/chunks/field-file-drag.js.map +1 -0
  24. package/dist/chunks/field-flatpickr.js +893 -0
  25. package/dist/chunks/field-flatpickr.js.map +1 -0
  26. package/dist/chunks/field-modal-select.js +403 -0
  27. package/dist/chunks/field-modal-select.js.map +1 -0
  28. package/dist/chunks/field-modal-tree.js +790 -0
  29. package/dist/chunks/field-modal-tree.js.map +1 -0
  30. package/dist/chunks/field-multi-uploader.js +256 -0
  31. package/dist/chunks/field-multi-uploader.js.map +1 -0
  32. package/dist/chunks/field-repeatable.js +132 -0
  33. package/dist/chunks/field-repeatable.js.map +1 -0
  34. package/dist/chunks/field-single-image-drag.js +338 -0
  35. package/dist/chunks/field-single-image-drag.js.map +1 -0
  36. package/dist/chunks/form.js +154 -0
  37. package/dist/chunks/form.js.map +1 -0
  38. package/dist/chunks/grid.js +345 -0
  39. package/dist/chunks/grid.js.map +1 -0
  40. package/dist/chunks/http-client.js +229 -0
  41. package/dist/chunks/http-client.js.map +1 -0
  42. package/dist/chunks/iframe-modal.js +124 -0
  43. package/dist/chunks/iframe-modal.js.map +1 -0
  44. package/dist/chunks/index.js +309 -0
  45. package/dist/chunks/index.js.map +1 -0
  46. package/dist/chunks/isArguments.js +146 -0
  47. package/dist/chunks/isArguments.js.map +1 -0
  48. package/dist/chunks/keep-tab.js +101 -0
  49. package/dist/chunks/keep-tab.js.map +1 -0
  50. package/dist/chunks/legacy.js +210 -0
  51. package/dist/chunks/legacy.js.map +1 -0
  52. package/dist/chunks/list-dependent.js +231 -0
  53. package/dist/chunks/list-dependent.js.map +1 -0
  54. package/dist/chunks/s3-multipart-uploader.js +172 -0
  55. package/dist/chunks/s3-multipart-uploader.js.map +1 -0
  56. package/dist/chunks/s3-uploader.js +136 -0
  57. package/dist/chunks/s3-uploader.js.map +1 -0
  58. package/dist/chunks/show-on.js +237 -0
  59. package/dist/chunks/show-on.js.map +1 -0
  60. package/dist/chunks/tinymce.js +196 -0
  61. package/dist/chunks/tinymce.js.map +1 -0
  62. package/dist/chunks/ui-bootstrap5.js +71 -0
  63. package/dist/chunks/ui-bootstrap5.js.map +1 -0
  64. package/dist/chunks/unicorn.js +2202 -0
  65. package/dist/chunks/unicorn.js.map +1 -0
  66. package/dist/chunks/validation.js +854 -0
  67. package/dist/chunks/validation.js.map +1 -0
  68. package/dist/editor.css +1 -0
  69. package/dist/index.d.ts +1427 -0
  70. package/dist/multi-level-menu.css +1 -0
  71. package/dist/switcher.css +1 -0
  72. package/dist/unicorn-next.css +12 -0
  73. package/dist/unicorn.js +125 -0
  74. package/dist/unicorn.js.map +1 -0
  75. package/fusionfile.mjs +155 -0
  76. package/images/ajax-loader.gif +0 -0
  77. package/images/placeholder/avatar.png +0 -0
  78. package/images/placeholder/image-16x10.png +0 -0
  79. package/images/placeholder/image-16x9.png +0 -0
  80. package/images/placeholder/image-1x1.png +0 -0
  81. package/images/placeholder/image-4x3.png +0 -0
  82. package/package.json +102 -0
  83. package/scss/bootstrap/multi-level-menu.scss +121 -0
  84. package/scss/editor.scss +116 -0
  85. package/scss/field/file-drag.scss +102 -0
  86. package/scss/field/single-image-drag.scss +88 -0
  87. package/scss/field/vue-drag-uploader.scss +160 -0
  88. package/scss/switcher.scss +156 -0
  89. package/src/app.ts +128 -0
  90. package/src/bootstrap/button-radio.ts +208 -0
  91. package/src/bootstrap/keep-tab.ts +155 -0
  92. package/src/composable/index.ts +21 -0
  93. package/src/composable/useCheckboxesMultiSelect.ts +22 -0
  94. package/src/composable/useFieldCascadeSelect.ts +9 -0
  95. package/src/composable/useFieldFileDrag.ts +9 -0
  96. package/src/composable/useFieldFlatpickr.ts +3 -0
  97. package/src/composable/useFieldModalSelect.ts +6 -0
  98. package/src/composable/useFieldModalTree.ts +3 -0
  99. package/src/composable/useFieldMultiUploader.ts +3 -0
  100. package/src/composable/useFieldRepeatable.ts +9 -0
  101. package/src/composable/useFieldSingleImageDrag.ts +5 -0
  102. package/src/composable/useForm.ts +43 -0
  103. package/src/composable/useGrid.ts +57 -0
  104. package/src/composable/useHttp.ts +8 -0
  105. package/src/composable/useIframeModal.ts +9 -0
  106. package/src/composable/useListDependent.ts +26 -0
  107. package/src/composable/useQueue.ts +13 -0
  108. package/src/composable/useS3Uploader.ts +32 -0
  109. package/src/composable/useShowOn.ts +9 -0
  110. package/src/composable/useStack.ts +13 -0
  111. package/src/composable/useTinymce.ts +29 -0
  112. package/src/composable/useTomSelect.ts +72 -0
  113. package/src/composable/useUIBootstrap5.ts +48 -0
  114. package/src/composable/useUniDirective.ts +32 -0
  115. package/src/composable/useValidation.ts +39 -0
  116. package/src/data.ts +36 -0
  117. package/src/events.ts +73 -0
  118. package/src/legacy/legacy.ts +186 -0
  119. package/src/legacy/loader.ts +125 -0
  120. package/src/module/checkboxes-multi-select.ts +54 -0
  121. package/src/module/field-cascade-select.ts +292 -0
  122. package/src/module/field-file-drag.ts +292 -0
  123. package/src/module/field-flatpickr.ts +127 -0
  124. package/src/module/field-modal-select.ts +174 -0
  125. package/src/module/field-modal-tree.ts +27 -0
  126. package/src/module/field-multi-uploader.ts +361 -0
  127. package/src/module/field-repeatable.ts +202 -0
  128. package/src/module/field-single-image-drag.ts +468 -0
  129. package/src/module/form.ts +223 -0
  130. package/src/module/grid.ts +465 -0
  131. package/src/module/http-client.ts +243 -0
  132. package/src/module/iframe-modal.ts +167 -0
  133. package/src/module/list-dependent.ts +321 -0
  134. package/src/module/s3-multipart-uploader.ts +300 -0
  135. package/src/module/s3-uploader.ts +234 -0
  136. package/src/module/show-on.ts +173 -0
  137. package/src/module/tinymce.ts +263 -0
  138. package/src/module/ui-bootstrap5.ts +107 -0
  139. package/src/module/validation.ts +1019 -0
  140. package/src/plugin/index.ts +1 -0
  141. package/src/plugin/php-adapter.ts +65 -0
  142. package/src/polyfill/form-request-submit.ts +31 -0
  143. package/src/polyfill/index.ts +9 -0
  144. package/src/service/animate.ts +58 -0
  145. package/src/service/crypto.ts +27 -0
  146. package/src/service/dom-watcher.ts +62 -0
  147. package/src/service/dom.ts +265 -0
  148. package/src/service/helper.ts +48 -0
  149. package/src/service/index.ts +10 -0
  150. package/src/service/lang.ts +122 -0
  151. package/src/service/loader.ts +152 -0
  152. package/src/service/router.ts +118 -0
  153. package/src/service/ui.ts +497 -0
  154. package/src/service/uri.ts +106 -0
  155. package/src/types/base.ts +9 -0
  156. package/src/types/index.ts +4 -0
  157. package/src/types/modal-tree.ts +12 -0
  158. package/src/types/plugin.ts +6 -0
  159. package/src/types/shims.d.ts +18 -0
  160. package/src/types/ui.ts +6 -0
  161. package/src/unicorn.ts +63 -0
  162. package/src/utilities/arr.ts +25 -0
  163. package/src/utilities/base.ts +9 -0
  164. package/src/utilities/data.ts +48 -0
  165. package/src/utilities/index.ts +5 -0
  166. package/src/utilities/tree.ts +20 -0
  167. package/src/vue/components/ModalTree/ModalTreeApp.vue +175 -0
  168. package/src/vue/components/ModalTree/TreeItem.vue +262 -0
  169. package/src/vue/components/ModalTree/TreeModal.vue +225 -0
  170. package/tests/test.js +4 -0
  171. package/tsconfig.js.json +25 -0
  172. package/tsconfig.json +17 -0
  173. package/vite.assets.config.ts +61 -0
  174. package/vite.config.test.ts +36 -0
  175. package/vite.config.ts +112 -0
@@ -0,0 +1,893 @@
1
+ import flatpickr from "flatpickr";
2
+ import { a7 as injectCssToDocument, a8 as useImport, a9 as useCssImport } from "./unicorn.js";
3
+ const css = `.flatpickr-calendar {
4
+ background: transparent;
5
+ opacity: 0;
6
+ display: none;
7
+ text-align: center;
8
+ visibility: hidden;
9
+ padding: 0;
10
+ -webkit-animation: none;
11
+ animation: none;
12
+ direction: ltr;
13
+ border: 0;
14
+ font-size: 14px;
15
+ line-height: 24px;
16
+ border-radius: 5px;
17
+ position: absolute;
18
+ width: 307.875px;
19
+ -webkit-box-sizing: border-box;
20
+ box-sizing: border-box;
21
+ -ms-touch-action: manipulation;
22
+ touch-action: manipulation;
23
+ background: #fff;
24
+ -webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
25
+ box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
26
+ }
27
+ .flatpickr-calendar.open,
28
+ .flatpickr-calendar.inline {
29
+ opacity: 1;
30
+ max-height: 640px;
31
+ visibility: visible;
32
+ }
33
+ .flatpickr-calendar.open {
34
+ display: inline-block;
35
+ z-index: 99999;
36
+ }
37
+ .flatpickr-calendar.animate.open {
38
+ -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
39
+ animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
40
+ }
41
+ .flatpickr-calendar.inline {
42
+ display: block;
43
+ position: relative;
44
+ top: 2px;
45
+ }
46
+ .flatpickr-calendar.static {
47
+ position: absolute;
48
+ top: calc(100% + 2px);
49
+ }
50
+ .flatpickr-calendar.static.open {
51
+ z-index: 999;
52
+ display: block;
53
+ }
54
+ .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
55
+ -webkit-box-shadow: none !important;
56
+ box-shadow: none !important;
57
+ }
58
+ .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
59
+ -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
60
+ box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
61
+ }
62
+ .flatpickr-calendar .hasWeeks .dayContainer,
63
+ .flatpickr-calendar .hasTime .dayContainer {
64
+ border-bottom: 0;
65
+ border-bottom-right-radius: 0;
66
+ border-bottom-left-radius: 0;
67
+ }
68
+ .flatpickr-calendar .hasWeeks .dayContainer {
69
+ border-left: 0;
70
+ }
71
+ .flatpickr-calendar.hasTime .flatpickr-time {
72
+ height: 40px;
73
+ border-top: 1px solid #e6e6e6;
74
+ }
75
+ .flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
76
+ height: auto;
77
+ }
78
+ .flatpickr-calendar:before,
79
+ .flatpickr-calendar:after {
80
+ position: absolute;
81
+ display: block;
82
+ pointer-events: none;
83
+ border: solid transparent;
84
+ content: '';
85
+ height: 0;
86
+ width: 0;
87
+ left: 22px;
88
+ }
89
+ .flatpickr-calendar.rightMost:before,
90
+ .flatpickr-calendar.arrowRight:before,
91
+ .flatpickr-calendar.rightMost:after,
92
+ .flatpickr-calendar.arrowRight:after {
93
+ left: auto;
94
+ right: 22px;
95
+ }
96
+ .flatpickr-calendar.arrowCenter:before,
97
+ .flatpickr-calendar.arrowCenter:after {
98
+ left: 50%;
99
+ right: 50%;
100
+ }
101
+ .flatpickr-calendar:before {
102
+ border-width: 5px;
103
+ margin: 0 -5px;
104
+ }
105
+ .flatpickr-calendar:after {
106
+ border-width: 4px;
107
+ margin: 0 -4px;
108
+ }
109
+ .flatpickr-calendar.arrowTop:before,
110
+ .flatpickr-calendar.arrowTop:after {
111
+ bottom: 100%;
112
+ }
113
+ .flatpickr-calendar.arrowTop:before {
114
+ border-bottom-color: #e6e6e6;
115
+ }
116
+ .flatpickr-calendar.arrowTop:after {
117
+ border-bottom-color: #fff;
118
+ }
119
+ .flatpickr-calendar.arrowBottom:before,
120
+ .flatpickr-calendar.arrowBottom:after {
121
+ top: 100%;
122
+ }
123
+ .flatpickr-calendar.arrowBottom:before {
124
+ border-top-color: #e6e6e6;
125
+ }
126
+ .flatpickr-calendar.arrowBottom:after {
127
+ border-top-color: #fff;
128
+ }
129
+ .flatpickr-calendar:focus {
130
+ outline: 0;
131
+ }
132
+ .flatpickr-wrapper {
133
+ position: relative;
134
+ display: inline-block;
135
+ }
136
+ .flatpickr-months {
137
+ display: -webkit-box;
138
+ display: -webkit-flex;
139
+ display: -ms-flexbox;
140
+ display: flex;
141
+ }
142
+ .flatpickr-months .flatpickr-month {
143
+ background: transparent;
144
+ color: rgba(0,0,0,0.9);
145
+ fill: rgba(0,0,0,0.9);
146
+ height: 34px;
147
+ line-height: 1;
148
+ text-align: center;
149
+ position: relative;
150
+ -webkit-user-select: none;
151
+ -moz-user-select: none;
152
+ -ms-user-select: none;
153
+ user-select: none;
154
+ overflow: hidden;
155
+ -webkit-box-flex: 1;
156
+ -webkit-flex: 1;
157
+ -ms-flex: 1;
158
+ flex: 1;
159
+ }
160
+ .flatpickr-months .flatpickr-prev-month,
161
+ .flatpickr-months .flatpickr-next-month {
162
+ -webkit-user-select: none;
163
+ -moz-user-select: none;
164
+ -ms-user-select: none;
165
+ user-select: none;
166
+ text-decoration: none;
167
+ cursor: pointer;
168
+ position: absolute;
169
+ top: 0;
170
+ height: 34px;
171
+ padding: 10px;
172
+ z-index: 3;
173
+ color: rgba(0,0,0,0.9);
174
+ fill: rgba(0,0,0,0.9);
175
+ }
176
+ .flatpickr-months .flatpickr-prev-month.flatpickr-disabled,
177
+ .flatpickr-months .flatpickr-next-month.flatpickr-disabled {
178
+ display: none;
179
+ }
180
+ .flatpickr-months .flatpickr-prev-month i,
181
+ .flatpickr-months .flatpickr-next-month i {
182
+ position: relative;
183
+ }
184
+ .flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
185
+ .flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
186
+ /*
187
+ /*rtl:begin:ignore*/
188
+ /*
189
+ */
190
+ left: 0;
191
+ /*
192
+ /*rtl:end:ignore*/
193
+ /*
194
+ */
195
+ }
196
+ /*
197
+ /*rtl:begin:ignore*/
198
+ /*
199
+ /*rtl:end:ignore*/
200
+ .flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
201
+ .flatpickr-months .flatpickr-next-month.flatpickr-next-month {
202
+ /*
203
+ /*rtl:begin:ignore*/
204
+ /*
205
+ */
206
+ right: 0;
207
+ /*
208
+ /*rtl:end:ignore*/
209
+ /*
210
+ */
211
+ }
212
+ /*
213
+ /*rtl:begin:ignore*/
214
+ /*
215
+ /*rtl:end:ignore*/
216
+ .flatpickr-months .flatpickr-prev-month:hover,
217
+ .flatpickr-months .flatpickr-next-month:hover {
218
+ color: #959ea9;
219
+ }
220
+ .flatpickr-months .flatpickr-prev-month:hover svg,
221
+ .flatpickr-months .flatpickr-next-month:hover svg {
222
+ fill: #f64747;
223
+ }
224
+ .flatpickr-months .flatpickr-prev-month svg,
225
+ .flatpickr-months .flatpickr-next-month svg {
226
+ width: 14px;
227
+ height: 14px;
228
+ }
229
+ .flatpickr-months .flatpickr-prev-month svg path,
230
+ .flatpickr-months .flatpickr-next-month svg path {
231
+ -webkit-transition: fill 0.1s;
232
+ transition: fill 0.1s;
233
+ fill: inherit;
234
+ }
235
+ .numInputWrapper {
236
+ position: relative;
237
+ height: auto;
238
+ }
239
+ .numInputWrapper input,
240
+ .numInputWrapper span {
241
+ display: inline-block;
242
+ }
243
+ .numInputWrapper input {
244
+ width: 100%;
245
+ }
246
+ .numInputWrapper input::-ms-clear {
247
+ display: none;
248
+ }
249
+ .numInputWrapper input::-webkit-outer-spin-button,
250
+ .numInputWrapper input::-webkit-inner-spin-button {
251
+ margin: 0;
252
+ -webkit-appearance: none;
253
+ }
254
+ .numInputWrapper span {
255
+ position: absolute;
256
+ right: 0;
257
+ width: 14px;
258
+ padding: 0 4px 0 2px;
259
+ height: 50%;
260
+ line-height: 50%;
261
+ opacity: 0;
262
+ cursor: pointer;
263
+ border: 1px solid rgba(57,57,57,0.15);
264
+ -webkit-box-sizing: border-box;
265
+ box-sizing: border-box;
266
+ }
267
+ .numInputWrapper span:hover {
268
+ background: rgba(0,0,0,0.1);
269
+ }
270
+ .numInputWrapper span:active {
271
+ background: rgba(0,0,0,0.2);
272
+ }
273
+ .numInputWrapper span:after {
274
+ display: block;
275
+ content: "";
276
+ position: absolute;
277
+ }
278
+ .numInputWrapper span.arrowUp {
279
+ top: 0;
280
+ border-bottom: 0;
281
+ }
282
+ .numInputWrapper span.arrowUp:after {
283
+ border-left: 4px solid transparent;
284
+ border-right: 4px solid transparent;
285
+ border-bottom: 4px solid rgba(57,57,57,0.6);
286
+ top: 26%;
287
+ }
288
+ .numInputWrapper span.arrowDown {
289
+ top: 50%;
290
+ }
291
+ .numInputWrapper span.arrowDown:after {
292
+ border-left: 4px solid transparent;
293
+ border-right: 4px solid transparent;
294
+ border-top: 4px solid rgba(57,57,57,0.6);
295
+ top: 40%;
296
+ }
297
+ .numInputWrapper span svg {
298
+ width: inherit;
299
+ height: auto;
300
+ }
301
+ .numInputWrapper span svg path {
302
+ fill: rgba(0,0,0,0.5);
303
+ }
304
+ .numInputWrapper:hover {
305
+ background: rgba(0,0,0,0.05);
306
+ }
307
+ .numInputWrapper:hover span {
308
+ opacity: 1;
309
+ }
310
+ .flatpickr-current-month {
311
+ font-size: 135%;
312
+ line-height: inherit;
313
+ font-weight: 300;
314
+ color: inherit;
315
+ position: absolute;
316
+ width: 75%;
317
+ left: 12.5%;
318
+ padding: 7.48px 0 0 0;
319
+ line-height: 1;
320
+ height: 34px;
321
+ display: inline-block;
322
+ text-align: center;
323
+ -webkit-transform: translate3d(0px, 0px, 0px);
324
+ transform: translate3d(0px, 0px, 0px);
325
+ }
326
+ .flatpickr-current-month span.cur-month {
327
+ font-family: inherit;
328
+ font-weight: 700;
329
+ color: inherit;
330
+ display: inline-block;
331
+ margin-left: 0.5ch;
332
+ padding: 0;
333
+ }
334
+ .flatpickr-current-month span.cur-month:hover {
335
+ background: rgba(0,0,0,0.05);
336
+ }
337
+ .flatpickr-current-month .numInputWrapper {
338
+ width: 6ch;
339
+ width: 7ch\\0;
340
+ display: inline-block;
341
+ }
342
+ .flatpickr-current-month .numInputWrapper span.arrowUp:after {
343
+ border-bottom-color: rgba(0,0,0,0.9);
344
+ }
345
+ .flatpickr-current-month .numInputWrapper span.arrowDown:after {
346
+ border-top-color: rgba(0,0,0,0.9);
347
+ }
348
+ .flatpickr-current-month input.cur-year {
349
+ background: transparent;
350
+ -webkit-box-sizing: border-box;
351
+ box-sizing: border-box;
352
+ color: inherit;
353
+ cursor: text;
354
+ padding: 0 0 0 0.5ch;
355
+ margin: 0;
356
+ display: inline-block;
357
+ font-size: inherit;
358
+ font-family: inherit;
359
+ font-weight: 300;
360
+ line-height: inherit;
361
+ height: auto;
362
+ border: 0;
363
+ border-radius: 0;
364
+ vertical-align: initial;
365
+ -webkit-appearance: textfield;
366
+ -moz-appearance: textfield;
367
+ appearance: textfield;
368
+ }
369
+ .flatpickr-current-month input.cur-year:focus {
370
+ outline: 0;
371
+ }
372
+ .flatpickr-current-month input.cur-year[disabled],
373
+ .flatpickr-current-month input.cur-year[disabled]:hover {
374
+ font-size: 100%;
375
+ color: rgba(0,0,0,0.5);
376
+ background: transparent;
377
+ pointer-events: none;
378
+ }
379
+ .flatpickr-current-month .flatpickr-monthDropdown-months {
380
+ appearance: menulist;
381
+ background: transparent;
382
+ border: none;
383
+ border-radius: 0;
384
+ box-sizing: border-box;
385
+ color: inherit;
386
+ cursor: pointer;
387
+ font-size: inherit;
388
+ font-family: inherit;
389
+ font-weight: 300;
390
+ height: auto;
391
+ line-height: inherit;
392
+ margin: -1px 0 0 0;
393
+ outline: none;
394
+ padding: 0 0 0 0.5ch;
395
+ position: relative;
396
+ vertical-align: initial;
397
+ -webkit-box-sizing: border-box;
398
+ -webkit-appearance: menulist;
399
+ -moz-appearance: menulist;
400
+ width: auto;
401
+ }
402
+ .flatpickr-current-month .flatpickr-monthDropdown-months:focus,
403
+ .flatpickr-current-month .flatpickr-monthDropdown-months:active {
404
+ outline: none;
405
+ }
406
+ .flatpickr-current-month .flatpickr-monthDropdown-months:hover {
407
+ background: rgba(0,0,0,0.05);
408
+ }
409
+ .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
410
+ background-color: transparent;
411
+ outline: none;
412
+ padding: 0;
413
+ }
414
+ .flatpickr-weekdays {
415
+ background: transparent;
416
+ text-align: center;
417
+ overflow: hidden;
418
+ width: 100%;
419
+ display: -webkit-box;
420
+ display: -webkit-flex;
421
+ display: -ms-flexbox;
422
+ display: flex;
423
+ -webkit-box-align: center;
424
+ -webkit-align-items: center;
425
+ -ms-flex-align: center;
426
+ align-items: center;
427
+ height: 28px;
428
+ }
429
+ .flatpickr-weekdays .flatpickr-weekdaycontainer {
430
+ display: -webkit-box;
431
+ display: -webkit-flex;
432
+ display: -ms-flexbox;
433
+ display: flex;
434
+ -webkit-box-flex: 1;
435
+ -webkit-flex: 1;
436
+ -ms-flex: 1;
437
+ flex: 1;
438
+ }
439
+ span.flatpickr-weekday {
440
+ cursor: default;
441
+ font-size: 90%;
442
+ background: transparent;
443
+ color: rgba(0,0,0,0.54);
444
+ line-height: 1;
445
+ margin: 0;
446
+ text-align: center;
447
+ display: block;
448
+ -webkit-box-flex: 1;
449
+ -webkit-flex: 1;
450
+ -ms-flex: 1;
451
+ flex: 1;
452
+ font-weight: bolder;
453
+ }
454
+ .dayContainer,
455
+ .flatpickr-weeks {
456
+ padding: 1px 0 0 0;
457
+ }
458
+ .flatpickr-days {
459
+ position: relative;
460
+ overflow: hidden;
461
+ display: -webkit-box;
462
+ display: -webkit-flex;
463
+ display: -ms-flexbox;
464
+ display: flex;
465
+ -webkit-box-align: start;
466
+ -webkit-align-items: flex-start;
467
+ -ms-flex-align: start;
468
+ align-items: flex-start;
469
+ width: 307.875px;
470
+ }
471
+ .flatpickr-days:focus {
472
+ outline: 0;
473
+ }
474
+ .dayContainer {
475
+ padding: 0;
476
+ outline: 0;
477
+ text-align: left;
478
+ width: 307.875px;
479
+ min-width: 307.875px;
480
+ max-width: 307.875px;
481
+ -webkit-box-sizing: border-box;
482
+ box-sizing: border-box;
483
+ display: inline-block;
484
+ display: -ms-flexbox;
485
+ display: -webkit-box;
486
+ display: -webkit-flex;
487
+ display: flex;
488
+ -webkit-flex-wrap: wrap;
489
+ flex-wrap: wrap;
490
+ -ms-flex-wrap: wrap;
491
+ -ms-flex-pack: justify;
492
+ -webkit-justify-content: space-around;
493
+ justify-content: space-around;
494
+ -webkit-transform: translate3d(0px, 0px, 0px);
495
+ transform: translate3d(0px, 0px, 0px);
496
+ opacity: 1;
497
+ }
498
+ .dayContainer + .dayContainer {
499
+ -webkit-box-shadow: -1px 0 0 #e6e6e6;
500
+ box-shadow: -1px 0 0 #e6e6e6;
501
+ }
502
+ .flatpickr-day {
503
+ background: none;
504
+ border: 1px solid transparent;
505
+ border-radius: 150px;
506
+ -webkit-box-sizing: border-box;
507
+ box-sizing: border-box;
508
+ color: #393939;
509
+ cursor: pointer;
510
+ font-weight: 400;
511
+ width: 14.2857143%;
512
+ -webkit-flex-basis: 14.2857143%;
513
+ -ms-flex-preferred-size: 14.2857143%;
514
+ flex-basis: 14.2857143%;
515
+ max-width: 39px;
516
+ height: 39px;
517
+ line-height: 39px;
518
+ margin: 0;
519
+ display: inline-block;
520
+ position: relative;
521
+ -webkit-box-pack: center;
522
+ -webkit-justify-content: center;
523
+ -ms-flex-pack: center;
524
+ justify-content: center;
525
+ text-align: center;
526
+ }
527
+ .flatpickr-day.inRange,
528
+ .flatpickr-day.prevMonthDay.inRange,
529
+ .flatpickr-day.nextMonthDay.inRange,
530
+ .flatpickr-day.today.inRange,
531
+ .flatpickr-day.prevMonthDay.today.inRange,
532
+ .flatpickr-day.nextMonthDay.today.inRange,
533
+ .flatpickr-day:hover,
534
+ .flatpickr-day.prevMonthDay:hover,
535
+ .flatpickr-day.nextMonthDay:hover,
536
+ .flatpickr-day:focus,
537
+ .flatpickr-day.prevMonthDay:focus,
538
+ .flatpickr-day.nextMonthDay:focus {
539
+ cursor: pointer;
540
+ outline: 0;
541
+ background: #e6e6e6;
542
+ border-color: #e6e6e6;
543
+ }
544
+ .flatpickr-day.today {
545
+ border-color: #959ea9;
546
+ }
547
+ .flatpickr-day.today:hover,
548
+ .flatpickr-day.today:focus {
549
+ border-color: #959ea9;
550
+ background: #959ea9;
551
+ color: #fff;
552
+ }
553
+ .flatpickr-day.selected,
554
+ .flatpickr-day.startRange,
555
+ .flatpickr-day.endRange,
556
+ .flatpickr-day.selected.inRange,
557
+ .flatpickr-day.startRange.inRange,
558
+ .flatpickr-day.endRange.inRange,
559
+ .flatpickr-day.selected:focus,
560
+ .flatpickr-day.startRange:focus,
561
+ .flatpickr-day.endRange:focus,
562
+ .flatpickr-day.selected:hover,
563
+ .flatpickr-day.startRange:hover,
564
+ .flatpickr-day.endRange:hover,
565
+ .flatpickr-day.selected.prevMonthDay,
566
+ .flatpickr-day.startRange.prevMonthDay,
567
+ .flatpickr-day.endRange.prevMonthDay,
568
+ .flatpickr-day.selected.nextMonthDay,
569
+ .flatpickr-day.startRange.nextMonthDay,
570
+ .flatpickr-day.endRange.nextMonthDay {
571
+ background: #569ff7;
572
+ -webkit-box-shadow: none;
573
+ box-shadow: none;
574
+ color: #fff;
575
+ border-color: #569ff7;
576
+ }
577
+ .flatpickr-day.selected.startRange,
578
+ .flatpickr-day.startRange.startRange,
579
+ .flatpickr-day.endRange.startRange {
580
+ border-radius: 50px 0 0 50px;
581
+ }
582
+ .flatpickr-day.selected.endRange,
583
+ .flatpickr-day.startRange.endRange,
584
+ .flatpickr-day.endRange.endRange {
585
+ border-radius: 0 50px 50px 0;
586
+ }
587
+ .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
588
+ .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
589
+ .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
590
+ -webkit-box-shadow: -10px 0 0 #569ff7;
591
+ box-shadow: -10px 0 0 #569ff7;
592
+ }
593
+ .flatpickr-day.selected.startRange.endRange,
594
+ .flatpickr-day.startRange.startRange.endRange,
595
+ .flatpickr-day.endRange.startRange.endRange {
596
+ border-radius: 50px;
597
+ }
598
+ .flatpickr-day.inRange {
599
+ border-radius: 0;
600
+ -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
601
+ box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
602
+ }
603
+ .flatpickr-day.flatpickr-disabled,
604
+ .flatpickr-day.flatpickr-disabled:hover,
605
+ .flatpickr-day.prevMonthDay,
606
+ .flatpickr-day.nextMonthDay,
607
+ .flatpickr-day.notAllowed,
608
+ .flatpickr-day.notAllowed.prevMonthDay,
609
+ .flatpickr-day.notAllowed.nextMonthDay {
610
+ color: rgba(57,57,57,0.3);
611
+ background: transparent;
612
+ border-color: transparent;
613
+ cursor: default;
614
+ }
615
+ .flatpickr-day.flatpickr-disabled,
616
+ .flatpickr-day.flatpickr-disabled:hover {
617
+ cursor: not-allowed;
618
+ color: rgba(57,57,57,0.1);
619
+ }
620
+ .flatpickr-day.week.selected {
621
+ border-radius: 0;
622
+ -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
623
+ box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
624
+ }
625
+ .flatpickr-day.hidden {
626
+ visibility: hidden;
627
+ }
628
+ .rangeMode .flatpickr-day {
629
+ margin-top: 1px;
630
+ }
631
+ .flatpickr-weekwrapper {
632
+ float: left;
633
+ }
634
+ .flatpickr-weekwrapper .flatpickr-weeks {
635
+ padding: 0 12px;
636
+ -webkit-box-shadow: 1px 0 0 #e6e6e6;
637
+ box-shadow: 1px 0 0 #e6e6e6;
638
+ }
639
+ .flatpickr-weekwrapper .flatpickr-weekday {
640
+ float: none;
641
+ width: 100%;
642
+ line-height: 28px;
643
+ }
644
+ .flatpickr-weekwrapper span.flatpickr-day,
645
+ .flatpickr-weekwrapper span.flatpickr-day:hover {
646
+ display: block;
647
+ width: 100%;
648
+ max-width: none;
649
+ color: rgba(57,57,57,0.3);
650
+ background: transparent;
651
+ cursor: default;
652
+ border: none;
653
+ }
654
+ .flatpickr-innerContainer {
655
+ display: block;
656
+ display: -webkit-box;
657
+ display: -webkit-flex;
658
+ display: -ms-flexbox;
659
+ display: flex;
660
+ -webkit-box-sizing: border-box;
661
+ box-sizing: border-box;
662
+ overflow: hidden;
663
+ }
664
+ .flatpickr-rContainer {
665
+ display: inline-block;
666
+ padding: 0;
667
+ -webkit-box-sizing: border-box;
668
+ box-sizing: border-box;
669
+ }
670
+ .flatpickr-time {
671
+ text-align: center;
672
+ outline: 0;
673
+ display: block;
674
+ height: 0;
675
+ line-height: 40px;
676
+ max-height: 40px;
677
+ -webkit-box-sizing: border-box;
678
+ box-sizing: border-box;
679
+ overflow: hidden;
680
+ display: -webkit-box;
681
+ display: -webkit-flex;
682
+ display: -ms-flexbox;
683
+ display: flex;
684
+ }
685
+ .flatpickr-time:after {
686
+ content: "";
687
+ display: table;
688
+ clear: both;
689
+ }
690
+ .flatpickr-time .numInputWrapper {
691
+ -webkit-box-flex: 1;
692
+ -webkit-flex: 1;
693
+ -ms-flex: 1;
694
+ flex: 1;
695
+ width: 40%;
696
+ height: 40px;
697
+ float: left;
698
+ }
699
+ .flatpickr-time .numInputWrapper span.arrowUp:after {
700
+ border-bottom-color: #393939;
701
+ }
702
+ .flatpickr-time .numInputWrapper span.arrowDown:after {
703
+ border-top-color: #393939;
704
+ }
705
+ .flatpickr-time.hasSeconds .numInputWrapper {
706
+ width: 26%;
707
+ }
708
+ .flatpickr-time.time24hr .numInputWrapper {
709
+ width: 49%;
710
+ }
711
+ .flatpickr-time input {
712
+ background: transparent;
713
+ -webkit-box-shadow: none;
714
+ box-shadow: none;
715
+ border: 0;
716
+ border-radius: 0;
717
+ text-align: center;
718
+ margin: 0;
719
+ padding: 0;
720
+ height: inherit;
721
+ line-height: inherit;
722
+ color: #393939;
723
+ font-size: 14px;
724
+ position: relative;
725
+ -webkit-box-sizing: border-box;
726
+ box-sizing: border-box;
727
+ -webkit-appearance: textfield;
728
+ -moz-appearance: textfield;
729
+ appearance: textfield;
730
+ }
731
+ .flatpickr-time input.flatpickr-hour {
732
+ font-weight: bold;
733
+ }
734
+ .flatpickr-time input.flatpickr-minute,
735
+ .flatpickr-time input.flatpickr-second {
736
+ font-weight: 400;
737
+ }
738
+ .flatpickr-time input:focus {
739
+ outline: 0;
740
+ border: 0;
741
+ }
742
+ .flatpickr-time .flatpickr-time-separator,
743
+ .flatpickr-time .flatpickr-am-pm {
744
+ height: inherit;
745
+ float: left;
746
+ line-height: inherit;
747
+ color: #393939;
748
+ font-weight: bold;
749
+ width: 2%;
750
+ -webkit-user-select: none;
751
+ -moz-user-select: none;
752
+ -ms-user-select: none;
753
+ user-select: none;
754
+ -webkit-align-self: center;
755
+ -ms-flex-item-align: center;
756
+ align-self: center;
757
+ }
758
+ .flatpickr-time .flatpickr-am-pm {
759
+ outline: 0;
760
+ width: 18%;
761
+ cursor: pointer;
762
+ text-align: center;
763
+ font-weight: 400;
764
+ }
765
+ .flatpickr-time input:hover,
766
+ .flatpickr-time .flatpickr-am-pm:hover,
767
+ .flatpickr-time input:focus,
768
+ .flatpickr-time .flatpickr-am-pm:focus {
769
+ background: #eee;
770
+ }
771
+ .flatpickr-input[readonly] {
772
+ cursor: pointer;
773
+ }
774
+ @-webkit-keyframes fpFadeInDown {
775
+ from {
776
+ opacity: 0;
777
+ -webkit-transform: translate3d(0, -20px, 0);
778
+ transform: translate3d(0, -20px, 0);
779
+ }
780
+ to {
781
+ opacity: 1;
782
+ -webkit-transform: translate3d(0, 0, 0);
783
+ transform: translate3d(0, 0, 0);
784
+ }
785
+ }
786
+ @keyframes fpFadeInDown {
787
+ from {
788
+ opacity: 0;
789
+ -webkit-transform: translate3d(0, -20px, 0);
790
+ transform: translate3d(0, -20px, 0);
791
+ }
792
+ to {
793
+ opacity: 1;
794
+ -webkit-transform: translate3d(0, 0, 0);
795
+ transform: translate3d(0, 0, 0);
796
+ }
797
+ }
798
+ `;
799
+ /* @__PURE__ */ injectCssToDocument(css);
800
+ class FlatpickrElement extends HTMLElement {
801
+ static get is() {
802
+ return "uni-flatpickr";
803
+ }
804
+ instance;
805
+ constructor() {
806
+ super();
807
+ }
808
+ get selector() {
809
+ return this.getAttribute("selector") || "input";
810
+ }
811
+ get locale() {
812
+ return this.getAttribute("locale") || "";
813
+ }
814
+ // todo: Currently not support single option attributes
815
+ getOptions() {
816
+ const options = {};
817
+ const ignore = [
818
+ "selector"
819
+ ];
820
+ this.getAttributeNames().forEach((name) => {
821
+ if (ignore.indexOf(name) !== -1) {
822
+ return;
823
+ }
824
+ options[name] = this.getAttribute(name);
825
+ });
826
+ return options;
827
+ }
828
+ get $input() {
829
+ return this.querySelector("input");
830
+ }
831
+ async connectedCallback() {
832
+ let options = JSON.parse(this.getAttribute("options") || "{}") || {};
833
+ options.autoFillDefaultTime = true;
834
+ const now = /* @__PURE__ */ new Date();
835
+ options.defaultHour = now.getHours();
836
+ options.defaultMinute = now.getMinutes();
837
+ options.defaultSeconds = now.getSeconds();
838
+ options = await this.handleOptions(options);
839
+ this.instance = flatpickr(
840
+ this.querySelector(this.selector),
841
+ options
842
+ );
843
+ this.instance.config.onOpen.push(() => {
844
+ if (this.instance.input.value === "") {
845
+ const now2 = /* @__PURE__ */ new Date();
846
+ this.instance.jumpToDate(now2);
847
+ this.instance.config.defaultHour = now2.getHours();
848
+ this.instance.config.defaultMinute = now2.getMinutes();
849
+ this.instance.config.defaultSeconds = now2.getSeconds();
850
+ }
851
+ });
852
+ this.querySelector("[data-toggle]")?.addEventListener("click", () => {
853
+ setTimeout(() => {
854
+ this.querySelector("[data-input]")?.focus();
855
+ }, 0);
856
+ });
857
+ }
858
+ async handleOptions(options) {
859
+ options.plugins = options.plugins || [];
860
+ await Promise.all([
861
+ this.handleLocale(options),
862
+ this.handleMonthSelect(options)
863
+ ]);
864
+ return options;
865
+ }
866
+ async handleLocale(options) {
867
+ if (this.locale) {
868
+ await useImport(`flatpickr/dist/l10n/${this.locale}.js`);
869
+ options.locale = this.locale.replace(/-/, "_");
870
+ }
871
+ return options;
872
+ }
873
+ async handleMonthSelect(options) {
874
+ if (options.monthSelect) {
875
+ useCssImport("flatpickr/dist/plugins/monthSelect/style.css");
876
+ const { default: monthSelect } = await import("./index.js").then((n) => n.i);
877
+ if (typeof options.monthSelect === "boolean") {
878
+ options.monthSelect = {
879
+ shorthand: true,
880
+ dateFormat: "Y-m",
881
+ altFormat: "Y-m"
882
+ };
883
+ }
884
+ options.plugins.push(monthSelect(options.monthSelect));
885
+ }
886
+ return options;
887
+ }
888
+ getInstance() {
889
+ return this.instance;
890
+ }
891
+ }
892
+ /* @__PURE__ */ customElements.define(/* @__PURE__ */ (() => FlatpickrElement.is)(), FlatpickrElement);
893
+ //# sourceMappingURL=field-flatpickr.js.map