sprintify-ui 0.1.11 → 0.1.13
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.
- package/dist/sprintify-ui.es.js +1351 -1363
- package/dist/types/src/components/BaseDatePicker.vue.d.ts +3 -3
- package/package.json +1 -1
- package/src/components/BaseDataTableRowAction.vue +2 -2
- package/src/components/BaseDatePicker.vue +2 -2
- package/src/components/BaseLayoutNotificationDropdown.vue +6 -8
- package/src/components/BaseLayoutNotificationItem.vue +10 -23
- package/src/components/BaseLayoutStackedConfigurable.vue +2 -2
- package/src/components/BaseMenu.vue +4 -14
- package/src/components/BaseNavbar.stories.js +2 -2
- package/src/components/BaseSideNavigationItem.vue +2 -2
- package/src/components/BaseTabItem.vue +2 -2
- package/dist/types/src/components/BaseTitle.vue.d.ts +0 -45
- package/src/components/BaseTitle.vue +0 -80
|
@@ -11,7 +11,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
11
11
|
enableTime?: boolean | undefined;
|
|
12
12
|
mode?: "time" | "multiple" | "single" | "range" | undefined;
|
|
13
13
|
noCalendar?: boolean | undefined;
|
|
14
|
-
disableDates?: string[] | Date[] | undefined;
|
|
14
|
+
disableDates?: string[] | Date[] | ((date: Date) => boolean) | undefined;
|
|
15
15
|
}>, {
|
|
16
16
|
modelValue: null;
|
|
17
17
|
required: boolean;
|
|
@@ -37,7 +37,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
37
37
|
enableTime?: boolean | undefined;
|
|
38
38
|
mode?: "time" | "multiple" | "single" | "range" | undefined;
|
|
39
39
|
noCalendar?: boolean | undefined;
|
|
40
|
-
disableDates?: string[] | Date[] | undefined;
|
|
40
|
+
disableDates?: string[] | Date[] | ((date: Date) => boolean) | undefined;
|
|
41
41
|
}>, {
|
|
42
42
|
modelValue: null;
|
|
43
43
|
required: boolean;
|
|
@@ -65,7 +65,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
65
65
|
maxDate: string | Date | null;
|
|
66
66
|
enableTime: boolean;
|
|
67
67
|
noCalendar: boolean;
|
|
68
|
-
disableDates: string[] | Date[];
|
|
68
|
+
disableDates: string[] | Date[] | ((date: Date) => boolean);
|
|
69
69
|
}>;
|
|
70
70
|
export default _default;
|
|
71
71
|
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
package/package.json
CHANGED
|
@@ -8,14 +8,14 @@
|
|
|
8
8
|
>
|
|
9
9
|
<BaseIcon :icon="rowAction.icon" class="text-slate-500" />
|
|
10
10
|
</button>
|
|
11
|
-
<
|
|
11
|
+
<RouterLink
|
|
12
12
|
v-else-if="rowAction.to"
|
|
13
13
|
:to="rowAction.to(row)"
|
|
14
14
|
:disabled="rowAction.disabled && rowAction.disabled(row)"
|
|
15
15
|
class="btn btn-white border border-slate-300 p-2 shadow-sm hover:bg-slate-100"
|
|
16
16
|
>
|
|
17
17
|
<BaseIcon :icon="rowAction.icon" class="text-slate-500" />
|
|
18
|
-
</
|
|
18
|
+
</RouterLink>
|
|
19
19
|
</template>
|
|
20
20
|
|
|
21
21
|
<script lang="ts" setup>
|
|
@@ -58,7 +58,7 @@ const props = withDefaults(
|
|
|
58
58
|
enableTime?: boolean;
|
|
59
59
|
mode?: 'single' | 'multiple' | 'range' | 'time';
|
|
60
60
|
noCalendar?: boolean;
|
|
61
|
-
disableDates?: string[] | Date[];
|
|
61
|
+
disableDates?: string[] | Date[] | ((date: Date) => boolean);
|
|
62
62
|
}>(),
|
|
63
63
|
{
|
|
64
64
|
modelValue: null,
|
|
@@ -164,7 +164,7 @@ const flatpickrConfig = computed(() => {
|
|
|
164
164
|
inline: props.inline,
|
|
165
165
|
animate: false,
|
|
166
166
|
time_24hr: true,
|
|
167
|
-
};
|
|
167
|
+
} as any;
|
|
168
168
|
});
|
|
169
169
|
|
|
170
170
|
// Make sure the model value is formatted on the parent component onload
|
|
@@ -30,6 +30,7 @@
|
|
|
30
30
|
@click="onClick"
|
|
31
31
|
></BaseLayoutNotificationItem>
|
|
32
32
|
</template>
|
|
33
|
+
|
|
33
34
|
<div
|
|
34
35
|
v-if="notificationsConfig.items.length == 0"
|
|
35
36
|
class="flex items-center justify-center p-6"
|
|
@@ -49,14 +50,11 @@
|
|
|
49
50
|
v-if="notificationsConfig.footerTo"
|
|
50
51
|
class="mt-1 border-t border-slate-200 pt-1"
|
|
51
52
|
>
|
|
52
|
-
<
|
|
53
|
-
|
|
54
|
-
custom
|
|
55
|
-
:to="notificationsConfig.footerTo"
|
|
56
|
-
>
|
|
57
|
-
<MenuItem as="a" :href="href" @click="navigate">
|
|
53
|
+
<MenuItem v-slot="{ active, close }">
|
|
54
|
+
<RouterLink :to="notificationsConfig.footerTo" @mouseup="close">
|
|
58
55
|
<div
|
|
59
56
|
class="hover block px-3 py-2 text-center text-sm font-medium text-primary-600 hover:bg-slate-100"
|
|
57
|
+
:class="[active ? 'bg-slate-100' : '']"
|
|
60
58
|
>
|
|
61
59
|
{{
|
|
62
60
|
notificationsConfig.footerLabel
|
|
@@ -64,8 +62,8 @@
|
|
|
64
62
|
: $t('sui.see_all_notifications')
|
|
65
63
|
}}
|
|
66
64
|
</div>
|
|
67
|
-
</
|
|
68
|
-
</
|
|
65
|
+
</RouterLink>
|
|
66
|
+
</MenuItem>
|
|
69
67
|
</div>
|
|
70
68
|
</template>
|
|
71
69
|
</BaseMenu>
|
|
@@ -1,32 +1,18 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
3
|
-
|
|
4
|
-
v-slot="{ href, navigate }"
|
|
5
|
-
custom
|
|
6
|
-
:to="notification.to"
|
|
7
|
-
>
|
|
8
|
-
<MenuItem
|
|
9
|
-
v-slot="{ active }"
|
|
10
|
-
as="a"
|
|
11
|
-
:href="href"
|
|
12
|
-
@click.prevent="onClick(navigate)"
|
|
13
|
-
>
|
|
2
|
+
<MenuItem v-if="notification.to" v-slot="{ active, close }">
|
|
3
|
+
<RouterLink :to="notification.to" @mouseup="onClick(close)">
|
|
14
4
|
<BaseLayoutNotificationItemContent
|
|
15
5
|
:active="active"
|
|
16
6
|
:notification="notification"
|
|
17
7
|
></BaseLayoutNotificationItemContent>
|
|
18
|
-
</
|
|
19
|
-
</
|
|
8
|
+
</RouterLink>
|
|
9
|
+
</MenuItem>
|
|
20
10
|
<div v-else>
|
|
21
|
-
<MenuItem
|
|
22
|
-
v-slot="{ active }"
|
|
23
|
-
as="button"
|
|
24
|
-
class="w-full text-left"
|
|
25
|
-
@click.prevent="onClick()"
|
|
26
|
-
>
|
|
11
|
+
<MenuItem v-slot="{ active }" as="button" class="w-full text-left">
|
|
27
12
|
<BaseLayoutNotificationItemContent
|
|
28
13
|
:active="active"
|
|
29
14
|
:notification="notification"
|
|
15
|
+
@mouseup="onClick()"
|
|
30
16
|
></BaseLayoutNotificationItemContent>
|
|
31
17
|
</MenuItem>
|
|
32
18
|
</div>
|
|
@@ -47,10 +33,11 @@ const props = defineProps({
|
|
|
47
33
|
},
|
|
48
34
|
});
|
|
49
35
|
|
|
50
|
-
function onClick(
|
|
36
|
+
function onClick(close: () => void | null) {
|
|
51
37
|
emit('click', props.notification);
|
|
52
|
-
|
|
53
|
-
|
|
38
|
+
|
|
39
|
+
if (close) {
|
|
40
|
+
close();
|
|
54
41
|
}
|
|
55
42
|
}
|
|
56
43
|
</script>
|
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
|
|
7
7
|
<div class="flex justify-center">
|
|
8
8
|
<!-- Logo -->
|
|
9
|
-
<
|
|
9
|
+
<RouterLink to="/" class="flex flex-shrink-0 items-center p-2 pl-0">
|
|
10
10
|
<img class="block h-8 w-auto" :src="logoUrl" :alt="appName" />
|
|
11
|
-
</
|
|
11
|
+
</RouterLink>
|
|
12
12
|
|
|
13
13
|
<!-- Links (desktop) -->
|
|
14
14
|
<div class="ml-10 hidden space-x-4 md:flex">
|
|
@@ -27,18 +27,8 @@
|
|
|
27
27
|
<template v-for="item in items" :key="item.label + 'link'">
|
|
28
28
|
<div v-if="item.line" class="my-1 -mx-1 flex h-px bg-slate-200" />
|
|
29
29
|
|
|
30
|
-
<
|
|
31
|
-
|
|
32
|
-
v-slot="{ href, navigate }"
|
|
33
|
-
custom
|
|
34
|
-
:to="item.to"
|
|
35
|
-
>
|
|
36
|
-
<MenuItem
|
|
37
|
-
v-slot="{ active }"
|
|
38
|
-
as="a"
|
|
39
|
-
:href="href"
|
|
40
|
-
@click="navigate"
|
|
41
|
-
>
|
|
30
|
+
<MenuItem v-else-if="item.to" v-slot="{ active, close }">
|
|
31
|
+
<RouterLink :to="item.to" @mouseup="close">
|
|
42
32
|
<slot name="item" :item="item">
|
|
43
33
|
<BaseMenuItem
|
|
44
34
|
:label="item.label"
|
|
@@ -49,8 +39,8 @@
|
|
|
49
39
|
:size="size"
|
|
50
40
|
/>
|
|
51
41
|
</slot>
|
|
52
|
-
</
|
|
53
|
-
</
|
|
42
|
+
</RouterLink>
|
|
43
|
+
</MenuItem>
|
|
54
44
|
|
|
55
45
|
<MenuItem
|
|
56
46
|
v-else-if="item.href"
|
|
@@ -76,13 +76,13 @@ const Template = (args) => ({
|
|
|
76
76
|
|
|
77
77
|
<div class="flex justify-center">
|
|
78
78
|
<!-- Logo -->
|
|
79
|
-
<
|
|
79
|
+
<RouterLink to="/" class="flex flex-shrink-0 grow items-center p-2 pl-0">
|
|
80
80
|
<img
|
|
81
81
|
class="block h-8 w-auto"
|
|
82
82
|
src="https://sprintify.witify.io/img/logo/logo-side.svg"
|
|
83
83
|
alt="Sprintify"
|
|
84
84
|
/>
|
|
85
|
-
</
|
|
85
|
+
</RouterLink>
|
|
86
86
|
|
|
87
87
|
<!-- Links (desktop) -->
|
|
88
88
|
<div class="ml-10 hidden space-x-4 md:flex">
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
2
|
+
<RouterLink
|
|
3
3
|
v-slot="{ href, navigate, isActive, isExactActive }"
|
|
4
4
|
:to="to"
|
|
5
5
|
custom
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
<slot :active="isActiveInternal(isActive, isExactActive)" />
|
|
30
30
|
</div>
|
|
31
31
|
</a>
|
|
32
|
-
</
|
|
32
|
+
</RouterLink>
|
|
33
33
|
</template>
|
|
34
34
|
|
|
35
35
|
<script lang="ts" setup>
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { PropType } from 'vue';
|
|
2
|
-
import { RouteLocationRaw } from 'vue-router';
|
|
3
|
-
declare const _default: import("vue").DefineComponent<{
|
|
4
|
-
title: {
|
|
5
|
-
required: true;
|
|
6
|
-
type: StringConstructor;
|
|
7
|
-
};
|
|
8
|
-
subtitle: {
|
|
9
|
-
default: string;
|
|
10
|
-
type: StringConstructor;
|
|
11
|
-
};
|
|
12
|
-
level: {
|
|
13
|
-
default: number;
|
|
14
|
-
type: NumberConstructor;
|
|
15
|
-
};
|
|
16
|
-
back: {
|
|
17
|
-
default: string;
|
|
18
|
-
type: PropType<RouteLocationRaw>;
|
|
19
|
-
};
|
|
20
|
-
}, unknown, unknown, {
|
|
21
|
-
titleClass(): string;
|
|
22
|
-
subtitleClass(): string;
|
|
23
|
-
}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
24
|
-
title: {
|
|
25
|
-
required: true;
|
|
26
|
-
type: StringConstructor;
|
|
27
|
-
};
|
|
28
|
-
subtitle: {
|
|
29
|
-
default: string;
|
|
30
|
-
type: StringConstructor;
|
|
31
|
-
};
|
|
32
|
-
level: {
|
|
33
|
-
default: number;
|
|
34
|
-
type: NumberConstructor;
|
|
35
|
-
};
|
|
36
|
-
back: {
|
|
37
|
-
default: string;
|
|
38
|
-
type: PropType<RouteLocationRaw>;
|
|
39
|
-
};
|
|
40
|
-
}>>, {
|
|
41
|
-
subtitle: string;
|
|
42
|
-
level: number;
|
|
43
|
-
back: RouteLocationRaw;
|
|
44
|
-
}>;
|
|
45
|
-
export default _default;
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="flex w-full space-x-4">
|
|
3
|
-
<div v-if="back">
|
|
4
|
-
<router-link
|
|
5
|
-
:to="back"
|
|
6
|
-
class="block rounded-full border border-slate-200 bg-white p-2 shadow duration-150 hover:bg-slate-100"
|
|
7
|
-
>
|
|
8
|
-
<BaseIcon class="h-6 w-6" icon="mdi:chevron-left" />
|
|
9
|
-
</router-link>
|
|
10
|
-
</div>
|
|
11
|
-
<div class="grow sm:flex sm:items-start">
|
|
12
|
-
<div class="sm:flex-auto">
|
|
13
|
-
<component :is="`h${level}`" :class="titleClass">
|
|
14
|
-
{{ title }}
|
|
15
|
-
</component>
|
|
16
|
-
<p v-if="subtitle" :class="subtitleClass">
|
|
17
|
-
{{ subtitle }}
|
|
18
|
-
</p>
|
|
19
|
-
</div>
|
|
20
|
-
<div class="mt-4 sm:mt-0 sm:ml-16 sm:flex-none">
|
|
21
|
-
<slot name="actions" />
|
|
22
|
-
</div>
|
|
23
|
-
</div>
|
|
24
|
-
</div>
|
|
25
|
-
</template>
|
|
26
|
-
|
|
27
|
-
<script lang="ts">
|
|
28
|
-
import { defineComponent, PropType } from 'vue';
|
|
29
|
-
import { RouteLocationRaw } from 'vue-router';
|
|
30
|
-
|
|
31
|
-
export default defineComponent({
|
|
32
|
-
props: {
|
|
33
|
-
title: {
|
|
34
|
-
required: true,
|
|
35
|
-
type: String,
|
|
36
|
-
},
|
|
37
|
-
subtitle: {
|
|
38
|
-
default: '',
|
|
39
|
-
type: String,
|
|
40
|
-
},
|
|
41
|
-
level: {
|
|
42
|
-
default: 1,
|
|
43
|
-
type: Number,
|
|
44
|
-
},
|
|
45
|
-
back: {
|
|
46
|
-
default: '',
|
|
47
|
-
type: [String, Object] as PropType<RouteLocationRaw>,
|
|
48
|
-
},
|
|
49
|
-
},
|
|
50
|
-
computed: {
|
|
51
|
-
titleClass(): string {
|
|
52
|
-
let classes =
|
|
53
|
-
'font-display md:leading-tight font-semibold text-slate-900';
|
|
54
|
-
|
|
55
|
-
if (this.level == 1) {
|
|
56
|
-
classes += ' md:text-3xl text-3xl leading-9';
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
if (this.level == 2) {
|
|
60
|
-
classes += ' md:text-xl text-xl leading-6';
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
return classes;
|
|
64
|
-
},
|
|
65
|
-
subtitleClass(): string {
|
|
66
|
-
let classes = 'mt-1 text-slate-600';
|
|
67
|
-
|
|
68
|
-
if (this.level == 1) {
|
|
69
|
-
classes += ' text-base leading-5';
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
if (this.level == 2) {
|
|
73
|
-
classes += ' text-base leading-5';
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
return classes;
|
|
77
|
-
},
|
|
78
|
-
},
|
|
79
|
-
});
|
|
80
|
-
</script>
|