sprintify-ui 0.0.159 → 0.0.160

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 (5) hide show
  1. package/dist/sprintify-ui.es.js +3176 -3215
  2. package/dist/types/src/components/BaseDatePicker.vue.d.ts +75 -112
  3. package/package.json +1 -1
  4. package/src/components/BaseDatePicker.stories.js +7 -1
  5. package/src/components/BaseDatePicker.vue +42 -65
package/dist/types/src/components/BaseDatePicker.vue.d.ts CHANGED
@@ -1,126 +1,89 @@
1
- import { PropType } from 'vue';
2
1
  import 'flatpickr/dist/flatpickr.css';
3
- declare const _default: import("vue").DefineComponent<{
4
- modelValue: {
5
- default: undefined;
6
- type: PropType<string | string[] | null | undefined>;
7
- };
8
- required: {
9
- default: boolean;
10
- type: BooleanConstructor;
11
- };
12
- disabled: {
13
- default: boolean;
14
- type: BooleanConstructor;
15
- };
16
- minDate: {
17
- default: null;
18
- type: (StringConstructor | DateConstructor)[];
19
- };
20
- maxDate: {
21
- default: null;
22
- type: (StringConstructor | DateConstructor)[];
23
- };
24
- hasError: {
25
- default: boolean;
26
- type: BooleanConstructor;
27
- };
28
- name: {
29
- default: undefined;
30
- type: StringConstructor;
31
- };
32
- inline: {
33
- default: boolean;
34
- type: BooleanConstructor;
35
- };
36
- enableTime: {
37
- default: boolean;
38
- type: BooleanConstructor;
39
- };
40
- format: {
41
- default: string;
42
- type: StringConstructor;
43
- };
44
- mode: {
45
- default: string;
46
- type: PropType<"time" | "multiple" | "single" | "range" | undefined>;
47
- };
48
- noCalendar: {
49
- default: boolean;
50
- type: BooleanConstructor;
51
- };
52
- disableDates: {
53
- type: PropType<string[] | Date[]>;
54
- default(): never[];
55
- };
56
- }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
57
- modelValue: {
58
- default: undefined;
59
- type: PropType<string | string[] | null | undefined>;
60
- };
61
- required: {
62
- default: boolean;
63
- type: BooleanConstructor;
64
- };
65
- disabled: {
66
- default: boolean;
67
- type: BooleanConstructor;
68
- };
69
- minDate: {
70
- default: null;
71
- type: (StringConstructor | DateConstructor)[];
72
- };
73
- maxDate: {
74
- default: null;
75
- type: (StringConstructor | DateConstructor)[];
76
- };
77
- hasError: {
78
- default: boolean;
79
- type: BooleanConstructor;
80
- };
81
- name: {
82
- default: undefined;
83
- type: StringConstructor;
84
- };
85
- inline: {
86
- default: boolean;
87
- type: BooleanConstructor;
88
- };
89
- enableTime: {
90
- default: boolean;
91
- type: BooleanConstructor;
92
- };
93
- format: {
94
- default: string;
95
- type: StringConstructor;
96
- };
97
- mode: {
98
- default: string;
99
- type: PropType<"time" | "multiple" | "single" | "range" | undefined>;
100
- };
101
- noCalendar: {
102
- default: boolean;
103
- type: BooleanConstructor;
104
- };
105
- disableDates: {
106
- type: PropType<string[] | Date[]>;
107
- default(): never[];
108
- };
109
- }>> & {
2
+ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
3
+ modelValue?: string | string[] | null | undefined;
4
+ required?: boolean | undefined;
5
+ disabled?: boolean | undefined;
6
+ minDate?: string | Date | null | undefined;
7
+ maxDate?: string | Date | null | undefined;
8
+ hasError?: boolean | undefined;
9
+ name?: string | undefined;
10
+ inline?: boolean | undefined;
11
+ enableTime?: boolean | undefined;
12
+ format?: string | undefined;
13
+ mode?: "time" | "multiple" | "single" | "range" | undefined;
14
+ noCalendar?: boolean | undefined;
15
+ disableDates?: string[] | Date[] | undefined;
16
+ }>, {
17
+ modelValue: null;
18
+ required: boolean;
19
+ disabled: boolean;
20
+ minDate: null;
21
+ maxDate: null;
22
+ hasError: boolean;
23
+ name: undefined;
24
+ inline: boolean;
25
+ enableTime: boolean;
26
+ format: string;
27
+ mode: string;
28
+ noCalendar: boolean;
29
+ disableDates(): never[];
30
+ }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
31
+ modelValue?: string | string[] | null | undefined;
32
+ required?: boolean | undefined;
33
+ disabled?: boolean | undefined;
34
+ minDate?: string | Date | null | undefined;
35
+ maxDate?: string | Date | null | undefined;
36
+ hasError?: boolean | undefined;
37
+ name?: string | undefined;
38
+ inline?: boolean | undefined;
39
+ enableTime?: boolean | undefined;
40
+ format?: string | undefined;
41
+ mode?: "time" | "multiple" | "single" | "range" | undefined;
42
+ noCalendar?: boolean | undefined;
43
+ disableDates?: string[] | Date[] | undefined;
44
+ }>, {
45
+ modelValue: null;
46
+ required: boolean;
47
+ disabled: boolean;
48
+ minDate: null;
49
+ maxDate: null;
50
+ hasError: boolean;
51
+ name: undefined;
52
+ inline: boolean;
53
+ enableTime: boolean;
54
+ format: string;
55
+ mode: string;
56
+ noCalendar: boolean;
57
+ disableDates(): never[];
58
+ }>>> & {
110
59
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
111
60
  }, {
112
61
  required: boolean;
113
62
  name: string;
114
- mode: "time" | "multiple" | "single" | "range" | undefined;
63
+ mode: 'single' | 'multiple' | 'range' | 'time';
115
64
  disabled: boolean;
116
- modelValue: string | string[] | null | undefined;
65
+ modelValue: string | null | string[];
117
66
  hasError: boolean;
118
67
  inline: boolean;
119
- minDate: string | Date;
120
- maxDate: string | Date;
68
+ minDate: string | Date | null;
69
+ maxDate: string | Date | null;
121
70
  enableTime: boolean;
122
71
  format: string;
123
72
  noCalendar: boolean;
124
73
  disableDates: string[] | Date[];
125
74
  }>;
126
75
  export default _default;
76
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
77
+ type __VLS_TypePropsToRuntimeProps<T> = {
78
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
79
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
80
+ } : {
81
+ type: import('vue').PropType<T[K]>;
82
+ required: true;
83
+ };
84
+ };
85
+ type __VLS_WithDefaults<P, D> = {
86
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
87
+ default: D[K];
88
+ } : P[K];
89
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sprintify-ui",
3
- "version": "0.0.159",
3
+ "version": "0.0.160",
4
4
  "scripts": {
5
5
  "build": "rimraf dist && vue-tsc && vite build",
6
6
  "build-fast": "rimraf dist && vite build",
package/src/components/BaseDatePicker.stories.js CHANGED
@@ -7,6 +7,12 @@ export default {
7
7
  title: 'Form/BaseDatePicker',
8
8
  component: BaseDatePicker,
9
9
  argTypes: {
10
+ minDate: {
11
+ control: { type: 'text' },
12
+ },
13
+ maxDate: {
14
+ control: { type: 'text' },
15
+ },
10
16
  mode: {
11
17
  control: { type: 'select' },
12
18
  options: ['single', 'multiple', 'range', 'time'],
@@ -35,7 +41,7 @@ export const Demo = Template.bind({});
35
41
 
36
42
  export const MinDate = Template.bind({});
37
43
  MinDate.args = {
38
- minDate: DateTime.fromISO('2023-01-05').toJSDate(),
44
+ minDate: DateTime.fromISO('2023-01-05').toISODate(),
39
45
  };
40
46
 
41
47
  export const MaxDate = Template.bind({});
package/src/components/BaseDatePicker.vue CHANGED
@@ -33,7 +33,7 @@
33
33
  </template>
34
34
 
35
35
  <script lang="ts" setup>
36
- import { PropType, Ref } from 'vue';
36
+ import { Ref } from 'vue';
37
37
  import { isArray } from 'lodash';
38
38
  import { DateTime } from 'luxon';
39
39
  import { BaseIcon } from '.';
@@ -45,66 +45,40 @@ import { French } from 'flatpickr/dist/l10n/fr';
45
45
  import { english } from 'flatpickr/dist/l10n/default';
46
46
  import { Instance } from 'flatpickr/dist/types/instance';
47
47
 
48
- const props = defineProps({
49
- modelValue: {
50
- default: undefined,
51
- type: [String, null, Array] as PropType<
52
- string | null | string[] | undefined
53
- >,
54
- },
55
- required: {
56
- default: false,
57
- type: Boolean,
58
- },
59
- disabled: {
60
- default: false,
61
- type: Boolean,
62
- },
63
- minDate: {
64
- default: null,
65
- type: [String, Date],
66
- },
67
- maxDate: {
68
- default: null,
69
- type: [String, Date],
70
- },
71
- hasError: {
72
- default: false,
73
- type: Boolean,
74
- },
75
- name: {
76
- default: undefined,
77
- type: String,
78
- },
79
- inline: {
80
- default: false,
81
- type: Boolean,
82
- },
83
- enableTime: {
84
- default: false,
85
- type: Boolean,
86
- },
87
- format: {
88
- default: 'Y-m-d',
89
- type: String,
90
- },
91
- mode: {
92
- default: 'single',
93
- type: String as PropType<
94
- 'single' | 'multiple' | 'range' | 'time' | undefined
95
- >,
96
- },
97
- noCalendar: {
98
- default: false,
99
- type: Boolean,
100
- },
101
- disableDates: {
102
- type: [Array, Object] as PropType<string[] | Date[]>,
103
- default() {
48
+ const props = withDefaults(
49
+ defineProps<{
50
+ modelValue?: string | null | string[];
51
+ required?: boolean;
52
+ disabled?: boolean;
53
+ minDate?: string | Date | null;
54
+ maxDate?: string | Date | null;
55
+ hasError?: boolean;
56
+ name?: string;
57
+ inline?: boolean;
58
+ enableTime?: boolean;
59
+ format?: string;
60
+ mode?: 'single' | 'multiple' | 'range' | 'time';
61
+ noCalendar?: boolean;
62
+ disableDates?: string[] | Date[];
63
+ }>(),
64
+ {
65
+ modelValue: null,
66
+ required: false,
67
+ disabled: false,
68
+ minDate: null,
69
+ maxDate: null,
70
+ hasError: false,
71
+ name: undefined,
72
+ inline: false,
73
+ enableTime: false,
74
+ format: 'Y-m-d',
75
+ mode: 'single',
76
+ noCalendar: false,
77
+ disableDates() {
104
78
  return [];
105
79
  },
106
- },
107
- });
80
+ }
81
+ );
108
82
 
109
83
  const i18n = useI18n();
110
84
 
@@ -144,7 +118,7 @@ function stringToLuxon(date: string): DateTime {
144
118
  return DateTime.fromISO(date);
145
119
  }
146
120
 
147
- return DateTime.fromSQL(date);
121
+ return DateTime.fromSQL(date, { zone: 'utc' });
148
122
  }
149
123
 
150
124
  function luxonToString(date: DateTime): string {
@@ -177,8 +151,8 @@ const flatpickrConfig = computed(() => {
177
151
  dateFormat: props.format,
178
152
  mode: props.mode,
179
153
  locale: locale.value,
180
- minDate: props.minDate,
181
- maxDate: props.maxDate,
154
+ minDate: props.minDate ?? undefined,
155
+ maxDate: props.maxDate ?? undefined,
182
156
  noCalendar: props.noCalendar,
183
157
  disable: props.disableDates,
184
158
  inline: props.inline,
@@ -187,7 +161,7 @@ const flatpickrConfig = computed(() => {
187
161
  };
188
162
  });
189
163
 
190
- // Make sure the model value is always formatted on the parent component
164
+ // Make sure the model value is formatted on the parent component onload
191
165
  onMounted(() => {
192
166
  if (props.modelValue !== modelValueFormatted.value) {
193
167
  emitUpdate(modelValueFormatted.value);
@@ -212,8 +186,8 @@ function setPickerDate() {
212
186
  return;
213
187
  }
214
188
 
215
- if (!modelValueFormatted.value) {
216
- if (picker._selectedDateObj) {
189
+ if (!modelValueFormatted.value || modelValueFormatted.value.length == 0) {
190
+ if (picker.selectedDates.length > 0) {
217
191
  picker.clear();
218
192
  }
219
193
  return;
@@ -250,6 +224,8 @@ function init() {
250
224
  return;
251
225
  }
252
226
 
227
+ picker?.destroy();
228
+
253
229
  picker = flatpickr(datepicker.value, {
254
230
  ...flatpickrConfig.value,
255
231
  onChange(dates) {
@@ -292,6 +268,7 @@ function clear() {
292
268
  emitUpdate(null);
293
269
  }
294
270
  </script>
271
+
295
272
  <style lang="postcss">
296
273
  body .flatpickr-calendar {
297
274
  width: 280px;