@una-ui/nuxt-edge 1.0.0-alpha.0-29177010.13f2e35 → 1.0.0-alpha.0-29178759.d117979
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/module.json +1 -1
- package/dist/module.mjs +1 -1
- package/dist/runtime/components/alert/Alert.vue +94 -0
- package/dist/runtime/components/alert/Alert.vue.d.ts +32 -0
- package/dist/runtime/components/alert/AlertClose.vue +58 -0
- package/dist/runtime/components/alert/AlertClose.vue.d.ts +18 -0
- package/dist/runtime/components/alert/AlertDescription.vue +22 -0
- package/dist/runtime/components/alert/AlertDescription.vue.d.ts +15 -0
- package/dist/runtime/components/alert/AlertTitle.vue +22 -0
- package/dist/runtime/components/alert/AlertTitle.vue.d.ts +15 -0
- package/dist/runtime/types/alert.d.ts +30 -15
- package/package.json +3 -3
- package/dist/runtime/components/elements/Alert.vue +0 -127
- package/dist/runtime/components/elements/Alert.vue.d.ts +0 -18
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { computed } from "vue";
|
|
3
|
+
import { cn } from "../../utils";
|
|
4
|
+
import Icon from "../elements/Icon.vue";
|
|
5
|
+
import AlertClose from "./AlertClose.vue";
|
|
6
|
+
import AlertDescription from "./AlertDescription.vue";
|
|
7
|
+
import AlertTitle from "./AlertTitle.vue";
|
|
8
|
+
const props = defineProps({
|
|
9
|
+
size: { type: null, required: false, default: "sm" },
|
|
10
|
+
class: { type: null, required: false },
|
|
11
|
+
alert: { type: null, required: false, default: "text-gray" },
|
|
12
|
+
icon: { type: [String, Boolean], required: false, default: false },
|
|
13
|
+
closable: { type: Boolean, required: false, default: false },
|
|
14
|
+
title: { type: String, required: false },
|
|
15
|
+
description: { type: String, required: false },
|
|
16
|
+
_alertTitle: { type: Object, required: false },
|
|
17
|
+
_alertDescription: { type: Object, required: false },
|
|
18
|
+
_alertClose: { type: Object, required: false },
|
|
19
|
+
una: { type: Object, required: false }
|
|
20
|
+
});
|
|
21
|
+
const emit = defineEmits(["close"]);
|
|
22
|
+
const alertClassVariants = computed(() => {
|
|
23
|
+
const icon2 = {
|
|
24
|
+
info: "alert-info-icon",
|
|
25
|
+
success: "alert-success-icon",
|
|
26
|
+
warning: "alert-warning-icon",
|
|
27
|
+
error: "alert-error-icon",
|
|
28
|
+
default: ""
|
|
29
|
+
};
|
|
30
|
+
const alertType = props.alert ? props.alert.includes("info") ? "info" : props.alert.includes("success") ? "success" : props.alert.includes("warning") ? "warning" : props.alert.includes("error") ? "error" : "default" : "default";
|
|
31
|
+
return {
|
|
32
|
+
icon: icon2[alertType]
|
|
33
|
+
};
|
|
34
|
+
});
|
|
35
|
+
const icon = computed(() => {
|
|
36
|
+
if (props.icon === "" || props.icon === void 0 || props.icon === true)
|
|
37
|
+
return alertClassVariants.value.icon;
|
|
38
|
+
return props.icon.toString();
|
|
39
|
+
});
|
|
40
|
+
</script>
|
|
41
|
+
|
|
42
|
+
<template>
|
|
43
|
+
<div
|
|
44
|
+
data-slot="alert"
|
|
45
|
+
role="alert"
|
|
46
|
+
:size
|
|
47
|
+
:class="cn(
|
|
48
|
+
'alert',
|
|
49
|
+
props.una?.alert,
|
|
50
|
+
props.class
|
|
51
|
+
)"
|
|
52
|
+
:alert
|
|
53
|
+
>
|
|
54
|
+
<slot>
|
|
55
|
+
<slot v-if="$slots.icon || props.icon !== false" name="icon">
|
|
56
|
+
<Icon :name="icon" />
|
|
57
|
+
</slot>
|
|
58
|
+
|
|
59
|
+
<AlertTitle
|
|
60
|
+
v-if="title || $slots.title"
|
|
61
|
+
:size
|
|
62
|
+
:una
|
|
63
|
+
v-bind="props._alertTitle"
|
|
64
|
+
>
|
|
65
|
+
<slot name="title">
|
|
66
|
+
{{ title }}
|
|
67
|
+
</slot>
|
|
68
|
+
</AlertTitle>
|
|
69
|
+
|
|
70
|
+
<AlertDescription
|
|
71
|
+
v-if="description || $slots.description"
|
|
72
|
+
:size
|
|
73
|
+
:una
|
|
74
|
+
v-bind="props._alertDescription"
|
|
75
|
+
>
|
|
76
|
+
<slot name="description">
|
|
77
|
+
{{ description }}
|
|
78
|
+
</slot>
|
|
79
|
+
</AlertDescription>
|
|
80
|
+
|
|
81
|
+
<AlertClose
|
|
82
|
+
v-if="$slots.close || props.closable"
|
|
83
|
+
:size
|
|
84
|
+
v-bind="props._alertClose"
|
|
85
|
+
:una
|
|
86
|
+
@click="emit('close')"
|
|
87
|
+
>
|
|
88
|
+
<slot name="close" />
|
|
89
|
+
</AlertClose>
|
|
90
|
+
|
|
91
|
+
<slot v-if="$slots.actions" name="actions" />
|
|
92
|
+
</slot>
|
|
93
|
+
</div>
|
|
94
|
+
</template>
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import type { NAlertProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_1: {}, __VLS_3: {}, __VLS_11: {}, __VLS_16: {}, __VLS_25: {}, __VLS_27: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_1) => any;
|
|
5
|
+
} & {
|
|
6
|
+
icon?: (props: typeof __VLS_3) => any;
|
|
7
|
+
} & {
|
|
8
|
+
title?: (props: typeof __VLS_11) => any;
|
|
9
|
+
} & {
|
|
10
|
+
description?: (props: typeof __VLS_16) => any;
|
|
11
|
+
} & {
|
|
12
|
+
close?: (props: typeof __VLS_25) => any;
|
|
13
|
+
} & {
|
|
14
|
+
actions?: (props: typeof __VLS_27) => any;
|
|
15
|
+
};
|
|
16
|
+
declare const __VLS_component: import("vue").DefineComponent<NAlertProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
17
|
+
close: () => any;
|
|
18
|
+
}, string, import("vue").PublicProps, Readonly<NAlertProps> & Readonly<{
|
|
19
|
+
onClose?: (() => any) | undefined;
|
|
20
|
+
}>, {
|
|
21
|
+
icon: string | boolean;
|
|
22
|
+
size: import("vue").HTMLAttributes["class"];
|
|
23
|
+
alert: import("vue").HTMLAttributes["class"];
|
|
24
|
+
closable: boolean;
|
|
25
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
26
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
27
|
+
export default _default;
|
|
28
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
29
|
+
new (): {
|
|
30
|
+
$slots: S;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { cn } from "../../utils";
|
|
3
|
+
defineOptions({
|
|
4
|
+
inheritAttrs: false
|
|
5
|
+
});
|
|
6
|
+
const props = defineProps({
|
|
7
|
+
size: { type: null, required: false },
|
|
8
|
+
class: { type: null, required: false },
|
|
9
|
+
una: { type: Object, required: false },
|
|
10
|
+
type: { type: String, required: false },
|
|
11
|
+
loadingPlacement: { type: String, required: false },
|
|
12
|
+
icon: { type: Boolean, required: false, default: true },
|
|
13
|
+
disabled: { type: Boolean, required: false },
|
|
14
|
+
reverse: { type: Boolean, required: false },
|
|
15
|
+
loading: { type: Boolean, required: false },
|
|
16
|
+
block: { type: Boolean, required: false },
|
|
17
|
+
to: { type: null, required: false },
|
|
18
|
+
label: { type: String, required: false, default: "alert-close-icon" },
|
|
19
|
+
btn: { type: String, required: false, default: "~" },
|
|
20
|
+
leading: { type: String, required: false },
|
|
21
|
+
trailing: { type: String, required: false },
|
|
22
|
+
square: { type: null, required: false, default: "1.4285714285714286em" },
|
|
23
|
+
rounded: { type: null, required: false },
|
|
24
|
+
breadcrumbActive: { type: String, required: false },
|
|
25
|
+
breadcrumbInactive: { type: String, required: false },
|
|
26
|
+
paginationSelected: { type: String, required: false },
|
|
27
|
+
paginationUnselected: { type: String, required: false },
|
|
28
|
+
dropdownMenu: { type: String, required: false },
|
|
29
|
+
toggleOn: { type: String, required: false },
|
|
30
|
+
toggleOff: { type: String, required: false },
|
|
31
|
+
tabsActive: { type: String, required: false },
|
|
32
|
+
tabsInactive: { type: String, required: false },
|
|
33
|
+
navigationMenu: { type: String, required: false },
|
|
34
|
+
navigationMenuLink: { type: String, required: false },
|
|
35
|
+
ariaLabel: { type: String, required: false }
|
|
36
|
+
});
|
|
37
|
+
</script>
|
|
38
|
+
|
|
39
|
+
<template>
|
|
40
|
+
<div
|
|
41
|
+
data-slot="alert-close-wrapper"
|
|
42
|
+
:class="cn(
|
|
43
|
+
'alert-close-wrapper',
|
|
44
|
+
props.una?.alertCloseWrapper
|
|
45
|
+
)"
|
|
46
|
+
>
|
|
47
|
+
<slot>
|
|
48
|
+
<NButton
|
|
49
|
+
v-bind="{ ...props, ...$attrs }"
|
|
50
|
+
:size
|
|
51
|
+
:class="cn(
|
|
52
|
+
props.btn === '~' && 'text-current hover:ring-1 hover:ring-current',
|
|
53
|
+
props.class
|
|
54
|
+
)"
|
|
55
|
+
/>
|
|
56
|
+
</slot>
|
|
57
|
+
</div>
|
|
58
|
+
</template>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { NAlertCloseProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_1: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_1) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NAlertCloseProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NAlertCloseProps> & Readonly<{}>, {
|
|
7
|
+
icon: boolean;
|
|
8
|
+
label: string;
|
|
9
|
+
btn: string;
|
|
10
|
+
square: import("vue").HTMLAttributes["class"];
|
|
11
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
12
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
13
|
+
export default _default;
|
|
14
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
15
|
+
new (): {
|
|
16
|
+
$slots: S;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { cn } from "../../utils";
|
|
3
|
+
const props = defineProps({
|
|
4
|
+
size: { type: null, required: false, default: "sm" },
|
|
5
|
+
class: { type: null, required: false },
|
|
6
|
+
una: { type: Object, required: false }
|
|
7
|
+
});
|
|
8
|
+
</script>
|
|
9
|
+
|
|
10
|
+
<template>
|
|
11
|
+
<div
|
|
12
|
+
data-slot="alert-description"
|
|
13
|
+
:size
|
|
14
|
+
:class="cn(
|
|
15
|
+
'alert-description',
|
|
16
|
+
props.una?.alertDescription,
|
|
17
|
+
props.class
|
|
18
|
+
)"
|
|
19
|
+
>
|
|
20
|
+
<slot />
|
|
21
|
+
</div>
|
|
22
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NAlertDescriptionProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_1: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_1) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NAlertDescriptionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NAlertDescriptionProps> & Readonly<{}>, {
|
|
7
|
+
size: import("vue").HTMLAttributes["class"];
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { cn } from "../../utils";
|
|
3
|
+
const props = defineProps({
|
|
4
|
+
size: { type: null, required: false, default: "sm" },
|
|
5
|
+
class: { type: null, required: false },
|
|
6
|
+
una: { type: Object, required: false }
|
|
7
|
+
});
|
|
8
|
+
</script>
|
|
9
|
+
|
|
10
|
+
<template>
|
|
11
|
+
<div
|
|
12
|
+
data-slot="alert-title"
|
|
13
|
+
:size
|
|
14
|
+
:class="cn(
|
|
15
|
+
'alert-title',
|
|
16
|
+
props.una?.alertTitle,
|
|
17
|
+
props.class
|
|
18
|
+
)"
|
|
19
|
+
>
|
|
20
|
+
<slot />
|
|
21
|
+
</div>
|
|
22
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NAlertTitleProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_1: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_1) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NAlertTitleProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NAlertTitleProps> & Readonly<{}>, {
|
|
7
|
+
size: import("vue").HTMLAttributes["class"];
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -1,4 +1,8 @@
|
|
|
1
|
+
import type { HTMLAttributes } from 'vue';
|
|
2
|
+
import type { NButtonProps } from './button.js';
|
|
1
3
|
export interface NAlertProps {
|
|
4
|
+
size?: HTMLAttributes['class'];
|
|
5
|
+
class?: HTMLAttributes['class'];
|
|
2
6
|
/**
|
|
3
7
|
* Allows you to add `UnaUI` alert preset properties,
|
|
4
8
|
* Think of it as a shortcut for adding options or variants to the preset if available.
|
|
@@ -7,7 +11,7 @@ export interface NAlertProps {
|
|
|
7
11
|
* @example
|
|
8
12
|
* alert="outline-pink"
|
|
9
13
|
*/
|
|
10
|
-
alert?:
|
|
14
|
+
alert?: HTMLAttributes['class'];
|
|
11
15
|
/**
|
|
12
16
|
* Add icon to the alert,
|
|
13
17
|
* If this is true, the icon will be automatically generated based on the color.
|
|
@@ -33,23 +37,34 @@ export interface NAlertProps {
|
|
|
33
37
|
* Add a description to the alert.
|
|
34
38
|
*/
|
|
35
39
|
description?: string;
|
|
40
|
+
_alertTitle?: NAlertTitleProps;
|
|
41
|
+
_alertDescription?: NAlertDescriptionProps;
|
|
42
|
+
_alertClose?: NAlertCloseProps;
|
|
36
43
|
/**
|
|
37
44
|
* `UnaUI` preset configuration
|
|
38
45
|
*
|
|
39
46
|
* @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/alert.ts
|
|
40
47
|
*/
|
|
41
|
-
una?:
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
48
|
+
una?: NAlertUnaProps;
|
|
49
|
+
}
|
|
50
|
+
export interface NAlertTitleProps {
|
|
51
|
+
size?: HTMLAttributes['class'];
|
|
52
|
+
class?: HTMLAttributes['class'];
|
|
53
|
+
una?: Pick<NAlertUnaProps, 'alertTitle'>;
|
|
54
|
+
}
|
|
55
|
+
export interface NAlertDescriptionProps {
|
|
56
|
+
size?: HTMLAttributes['class'];
|
|
57
|
+
class?: HTMLAttributes['class'];
|
|
58
|
+
una?: Pick<NAlertUnaProps, 'alertDescription'>;
|
|
59
|
+
}
|
|
60
|
+
export interface NAlertCloseProps extends Omit<NButtonProps, 'una'> {
|
|
61
|
+
size?: HTMLAttributes['class'];
|
|
62
|
+
class?: HTMLAttributes['class'];
|
|
63
|
+
una?: Pick<NAlertUnaProps, 'alertCloseWrapper'> & NButtonProps['una'];
|
|
64
|
+
}
|
|
65
|
+
export interface NAlertUnaProps {
|
|
66
|
+
alert?: HTMLAttributes['class'];
|
|
67
|
+
alertTitle?: HTMLAttributes['class'];
|
|
68
|
+
alertDescription?: HTMLAttributes['class'];
|
|
69
|
+
alertCloseWrapper?: HTMLAttributes['class'];
|
|
55
70
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@una-ui/nuxt-edge",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.0.0-alpha.0-
|
|
4
|
+
"version": "1.0.0-alpha.0-29178759.d117979",
|
|
5
5
|
"description": "Nuxt module for @una-ui",
|
|
6
6
|
"author": "Phojie Rengel <phojrengel@gmail.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -41,8 +41,8 @@
|
|
|
41
41
|
"@nuxt/kit": "^3.17.5",
|
|
42
42
|
"@nuxtjs/color-mode": "^3.5.2",
|
|
43
43
|
"@tanstack/vue-table": "^8.21.3",
|
|
44
|
-
"@una-ui/extractor-vue-script": "npm:@una-ui/extractor-vue-script-edge@1.0.0-alpha.0-
|
|
45
|
-
"@una-ui/preset": "npm:@una-ui/preset-edge@1.0.0-alpha.0-
|
|
44
|
+
"@una-ui/extractor-vue-script": "npm:@una-ui/extractor-vue-script-edge@1.0.0-alpha.0-29178759.d117979",
|
|
45
|
+
"@una-ui/preset": "npm:@una-ui/preset-edge@1.0.0-alpha.0-29178759.d117979",
|
|
46
46
|
"@unocss/core": "^66.2.0",
|
|
47
47
|
"@unocss/nuxt": "^66.2.0",
|
|
48
48
|
"@unocss/preset-attributify": "^66.2.0",
|
|
@@ -1,127 +0,0 @@
|
|
|
1
|
-
<script setup>
|
|
2
|
-
import { computed } from "vue";
|
|
3
|
-
import NButton from "../elements/Button.vue";
|
|
4
|
-
import NIcon from "../elements/Icon.vue";
|
|
5
|
-
defineOptions({
|
|
6
|
-
inheritAttrs: false
|
|
7
|
-
});
|
|
8
|
-
const props = defineProps({
|
|
9
|
-
alert: { type: String, required: false },
|
|
10
|
-
icon: { type: [String, Boolean], required: false, default: false },
|
|
11
|
-
closable: { type: Boolean, required: false },
|
|
12
|
-
title: { type: String, required: false },
|
|
13
|
-
description: { type: String, required: false },
|
|
14
|
-
una: { type: Object, required: false }
|
|
15
|
-
});
|
|
16
|
-
const emit = defineEmits(["close"]);
|
|
17
|
-
const slots = defineSlots();
|
|
18
|
-
const alertVariants = ["soft", "outline", "border"];
|
|
19
|
-
const hasVariant = computed(() => alertVariants.some((alertVariants2) => props.alert?.includes(alertVariants2)));
|
|
20
|
-
const isBaseVariant = computed(() => props.alert?.includes("~"));
|
|
21
|
-
const alertClassVariants = computed(() => {
|
|
22
|
-
const icon2 = {
|
|
23
|
-
info: "alert-info-icon",
|
|
24
|
-
success: "alert-success-icon",
|
|
25
|
-
warning: "alert-warning-icon",
|
|
26
|
-
error: "alert-error-icon",
|
|
27
|
-
default: ""
|
|
28
|
-
};
|
|
29
|
-
const alertType = props.alert ? props.alert.includes("info") ? "info" : props.alert.includes("success") ? "success" : props.alert.includes("warning") ? "warning" : props.alert.includes("error") ? "error" : "default" : "default";
|
|
30
|
-
return {
|
|
31
|
-
icon: icon2[alertType]
|
|
32
|
-
};
|
|
33
|
-
});
|
|
34
|
-
const icon = computed(() => {
|
|
35
|
-
if (props.icon === "" || props.icon === void 0 || props.icon === true)
|
|
36
|
-
return alertClassVariants.value.icon;
|
|
37
|
-
return props.icon.toString();
|
|
38
|
-
});
|
|
39
|
-
</script>
|
|
40
|
-
|
|
41
|
-
<template>
|
|
42
|
-
<div
|
|
43
|
-
v-bind="$attrs"
|
|
44
|
-
:alert="alert"
|
|
45
|
-
class="alert"
|
|
46
|
-
:class="[
|
|
47
|
-
{ 'alert-default-variant': !hasVariant && !isBaseVariant },
|
|
48
|
-
una?.alert
|
|
49
|
-
]"
|
|
50
|
-
>
|
|
51
|
-
<div
|
|
52
|
-
alert="inner-wrapper"
|
|
53
|
-
:class="una?.alertInnerWrapper"
|
|
54
|
-
>
|
|
55
|
-
<div
|
|
56
|
-
v-if="props.icon !== false"
|
|
57
|
-
alert="icon-wrapper"
|
|
58
|
-
:class="una?.alertIconWrapper"
|
|
59
|
-
>
|
|
60
|
-
<slot name="icon">
|
|
61
|
-
<NIcon
|
|
62
|
-
alert="icon-base"
|
|
63
|
-
:name="icon"
|
|
64
|
-
aria-hidden="true"
|
|
65
|
-
/>
|
|
66
|
-
</slot>
|
|
67
|
-
</div>
|
|
68
|
-
|
|
69
|
-
<slot>
|
|
70
|
-
<div
|
|
71
|
-
alert="content-wrapper"
|
|
72
|
-
:class="una?.alertContentWrapper"
|
|
73
|
-
>
|
|
74
|
-
<div
|
|
75
|
-
v-if="slots.title || title"
|
|
76
|
-
alert="title"
|
|
77
|
-
:class="una?.alertTitle"
|
|
78
|
-
>
|
|
79
|
-
<slot name="title">
|
|
80
|
-
<div>
|
|
81
|
-
{{ title }}
|
|
82
|
-
</div>
|
|
83
|
-
</slot>
|
|
84
|
-
</div>
|
|
85
|
-
<div
|
|
86
|
-
v-if="slots.description || description"
|
|
87
|
-
alert="description"
|
|
88
|
-
:class="una?.alertDescription"
|
|
89
|
-
>
|
|
90
|
-
<slot name="description">
|
|
91
|
-
<p>
|
|
92
|
-
{{ description }}
|
|
93
|
-
</p>
|
|
94
|
-
</slot>
|
|
95
|
-
</div>
|
|
96
|
-
</div>
|
|
97
|
-
</slot>
|
|
98
|
-
|
|
99
|
-
<div
|
|
100
|
-
v-if="slots.closeIcon || closable"
|
|
101
|
-
alert="close-wrapper"
|
|
102
|
-
:class="una?.alertCloseWrapper"
|
|
103
|
-
>
|
|
104
|
-
<div
|
|
105
|
-
alert="close-inner-wrapper"
|
|
106
|
-
:class="una?.alertCloseInnerWrapper"
|
|
107
|
-
>
|
|
108
|
-
<NButton
|
|
109
|
-
alert="close"
|
|
110
|
-
:class="una?.alertClose"
|
|
111
|
-
btn="~"
|
|
112
|
-
square
|
|
113
|
-
@click="emit('close')"
|
|
114
|
-
>
|
|
115
|
-
<slot name="closeIcon">
|
|
116
|
-
<NIcon
|
|
117
|
-
:class="`${una?.alertCloseIconBase} alert-close-icon-base`"
|
|
118
|
-
:name="una?.alertCloseIcon ?? 'alert-close-icon'"
|
|
119
|
-
aria-hidden="true"
|
|
120
|
-
/>
|
|
121
|
-
</slot>
|
|
122
|
-
</NButton>
|
|
123
|
-
</div>
|
|
124
|
-
</div>
|
|
125
|
-
</div>
|
|
126
|
-
</div>
|
|
127
|
-
</template>
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import type { NAlertProps } from '../../types/index.js';
|
|
2
|
-
type __VLS_Slots = {
|
|
3
|
-
default?: any;
|
|
4
|
-
title?: any;
|
|
5
|
-
description?: any;
|
|
6
|
-
icon?: any;
|
|
7
|
-
closeIcon?: any;
|
|
8
|
-
};
|
|
9
|
-
declare const __VLS_component: import("vue").DefineComponent<NAlertProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {
|
|
10
|
-
icon: string | boolean;
|
|
11
|
-
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
12
|
-
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
13
|
-
export default _default;
|
|
14
|
-
type __VLS_WithSlots<T, S> = T & {
|
|
15
|
-
new (): {
|
|
16
|
-
$slots: S;
|
|
17
|
-
};
|
|
18
|
-
};
|