@vuesimple/vs-alert 1.4.18 → 3.0.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 (11) hide show
  1. package/README.md +8 -13
  2. package/build/rollup.config.js +6 -1
  3. package/build/vite.config.js +33 -0
  4. package/dist/index.js +226 -0
  5. package/dist/index.min.js +1 -0
  6. package/dist/index.umd.js +1 -0
  7. package/package.json +8 -14
  8. package/src/index.js +4 -23
  9. package/dist/vs-alert.esm.js +0 -611
  10. package/dist/vs-alert.min.js +0 -1
  11. package/dist/vs-alert.umd.js +0 -621
package/dist/vs-alert.esm.js DELETED
@@ -1,611 +0,0 @@
1
- //
2
- //
3
- //
4
- //
5
- //
6
- //
7
- //
8
- //
9
- //
10
- //
11
- //
12
- //
13
- //
14
- //
15
- //
16
- //
17
- //
18
- //
19
- //
20
- //
21
- //
22
- //
23
- //
24
- //
25
- //
26
- //
27
- //
28
- //
29
- //
30
- //
31
- //
32
- //
33
- //
34
- //
35
- //
36
- //
37
- //
38
- //
39
- //
40
- //
41
- //
42
- //
43
- //
44
- //
45
- //
46
- //
47
- //
48
- //
49
- //
50
- //
51
- //
52
- //
53
- //
54
- //
55
- //
56
- //
57
- //
58
- //
59
- //
60
- //
61
- //
62
- //
63
- //
64
- //
65
- //
66
- //
67
- //
68
- //
69
- //
70
- //
71
- //
72
- //
73
- //
74
- //
75
- //
76
- //
77
- //
78
- //
79
- //
80
- //
81
- //
82
- //
83
- //
84
- //
85
- //
86
- //
87
- //
88
- //
89
- //
90
- //
91
- //
92
- //
93
- //
94
- //
95
- //
96
- //
97
- //
98
- //
99
- //
100
- //
101
- //
102
- //
103
- //
104
- //
105
- //
106
- //
107
- //
108
- //
109
- //
110
- //
111
-
112
- var script = {
113
- name: 'VsAlert',
114
-
115
- props: {
116
- // Variants: success, warning, error, info, secondary
117
- variant: {
118
- type: String,
119
- required: true,
120
- validator: function (value) { return ['success', 'error', 'info', 'warning', 'secondary'].includes(value.toLowerCase()); },
121
- },
122
- showClose: {
123
- type: Boolean,
124
- default: false,
125
- },
126
- title: {
127
- type: String,
128
- },
129
- noBg: {
130
- type: Boolean,
131
- default: false,
132
- },
133
- small: {
134
- type: Boolean,
135
- default: false,
136
- },
137
- toast: {
138
- type: Boolean,
139
- default: false,
140
- },
141
- },
142
-
143
- computed: {
144
- classList: function classList() {
145
- return [
146
- ("vs-alert-" + (this.variant)),
147
- { 'vs-alert--no-bg': this.noBg },
148
- { 'vs-alert--small': this.small },
149
- { 'vs-alert--toast': this.toast },
150
- { 'vs-alert--is-close': this.showClose } ];
151
- },
152
- },
153
- };
154
-
155
- function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
156
- if (typeof shadowMode !== 'boolean') {
157
- createInjectorSSR = createInjector;
158
- createInjector = shadowMode;
159
- shadowMode = false;
160
- }
161
- // Vue.extend constructor export interop.
162
- var options = typeof script === 'function' ? script.options : script;
163
- // render functions
164
- if (template && template.render) {
165
- options.render = template.render;
166
- options.staticRenderFns = template.staticRenderFns;
167
- options._compiled = true;
168
- // functional template
169
- if (isFunctionalTemplate) {
170
- options.functional = true;
171
- }
172
- }
173
- // scopedId
174
- if (scopeId) {
175
- options._scopeId = scopeId;
176
- }
177
- var hook;
178
- if (moduleIdentifier) {
179
- // server build
180
- hook = function (context) {
181
- // 2.3 injection
182
- context =
183
- context || // cached call
184
- (this.$vnode && this.$vnode.ssrContext) || // stateful
185
- (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
186
- // 2.2 with runInNewContext: true
187
- if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
188
- context = __VUE_SSR_CONTEXT__;
189
- }
190
- // inject component styles
191
- if (style) {
192
- style.call(this, createInjectorSSR(context));
193
- }
194
- // register component module identifier for async chunk inference
195
- if (context && context._registeredComponents) {
196
- context._registeredComponents.add(moduleIdentifier);
197
- }
198
- };
199
- // used by ssr in case component is cached and beforeCreate
200
- // never gets called
201
- options._ssrRegister = hook;
202
- }
203
- else if (style) {
204
- hook = shadowMode
205
- ? function (context) {
206
- style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
207
- }
208
- : function (context) {
209
- style.call(this, createInjector(context));
210
- };
211
- }
212
- if (hook) {
213
- if (options.functional) {
214
- // register for functional component in vue file
215
- var originalRender = options.render;
216
- options.render = function renderWithStyleInjection(h, context) {
217
- hook.call(context);
218
- return originalRender(h, context);
219
- };
220
- }
221
- else {
222
- // inject component registration as beforeCreate hook
223
- var existing = options.beforeCreate;
224
- options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
225
- }
226
- }
227
- return script;
228
- }
229
-
230
- var isOldIE = typeof navigator !== 'undefined' &&
231
- /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());
232
- function createInjector(context) {
233
- return function (id, style) { return addStyle(id, style); };
234
- }
235
- var HEAD;
236
- var styles = {};
237
- function addStyle(id, css) {
238
- var group = isOldIE ? css.media || 'default' : id;
239
- var style = styles[group] || (styles[group] = { ids: new Set(), styles: [] });
240
- if (!style.ids.has(id)) {
241
- style.ids.add(id);
242
- var code = css.source;
243
- if (css.map) {
244
- // https://developer.chrome.com/devtools/docs/javascript-debugging
245
- // this makes source maps inside style tags work properly in Chrome
246
- code += '\n/*# sourceURL=' + css.map.sources[0] + ' */';
247
- // http://stackoverflow.com/a/26603875
248
- code +=
249
- '\n/*# sourceMappingURL=data:application/json;base64,' +
250
- btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) +
251
- ' */';
252
- }
253
- if (!style.element) {
254
- style.element = document.createElement('style');
255
- style.element.type = 'text/css';
256
- if (css.media)
257
- { style.element.setAttribute('media', css.media); }
258
- if (HEAD === undefined) {
259
- HEAD = document.head || document.getElementsByTagName('head')[0];
260
- }
261
- HEAD.appendChild(style.element);
262
- }
263
- if ('styleSheet' in style.element) {
264
- style.styles.push(code);
265
- style.element.styleSheet.cssText = style.styles
266
- .filter(Boolean)
267
- .join('\n');
268
- }
269
- else {
270
- var index = style.ids.size - 1;
271
- var textNode = document.createTextNode(code);
272
- var nodes = style.element.childNodes;
273
- if (nodes[index])
274
- { style.element.removeChild(nodes[index]); }
275
- if (nodes.length)
276
- { style.element.insertBefore(textNode, nodes[index]); }
277
- else
278
- { style.element.appendChild(textNode); }
279
- }
280
- }
281
- }
282
-
283
- /* script */
284
- var __vue_script__ = script;
285
-
286
- /* template */
287
- var __vue_render__ = function() {
288
- var _vm = this;
289
- var _h = _vm.$createElement;
290
- var _c = _vm._self._c || _h;
291
- return _c(
292
- "div",
293
- { class: ["vs-alert", _vm.classList] },
294
- [
295
- _c(
296
- "span",
297
- { staticClass: "vs-alert-icon__wrapper" },
298
- [
299
- _vm._t("icon", [
300
- _vm.variant === "success"
301
- ? _c(
302
- "svg",
303
- {
304
- attrs: {
305
- xmlns: "http://www.w3.org/2000/svg",
306
- width: "16",
307
- height: "16",
308
- viewBox: "0 0 16 16",
309
- role: "presentation",
310
- focussable: "false"
311
- }
312
- },
313
- [
314
- _c(
315
- "g",
316
- {
317
- attrs: {
318
- fill: "none",
319
- stroke: "var(--vs-alert-success-icon)"
320
- }
321
- },
322
- [
323
- _c("path", {
324
- attrs: {
325
- "stroke-linecap": "round",
326
- "stroke-linejoin": "round",
327
- d: "M4 9l2.5 2.5 5-5"
328
- }
329
- }),
330
- _vm._v(" "),
331
- _c("circle", {
332
- attrs: { cx: "7.5", cy: "8.5", r: "7" }
333
- })
334
- ]
335
- )
336
- ]
337
- )
338
- : _vm._e(),
339
- _vm._v(" "),
340
- _vm.variant === "warning"
341
- ? _c(
342
- "svg",
343
- {
344
- attrs: {
345
- xmlns: "http://www.w3.org/2000/svg",
346
- width: "16",
347
- height: "16",
348
- viewBox: "0 0 16 16",
349
- role: "presentation",
350
- focussable: "false"
351
- }
352
- },
353
- [
354
- _c("path", {
355
- attrs: {
356
- fill: "none",
357
- stroke: "var(--vs-alert-warning-icon)",
358
- "stroke-linecap": "round",
359
- d:
360
- "M.88 13.77L7.06 1.86c.19-.36.7-.36.89 0l6.18 11.91c.17.33-.07.73-.44.73H1.32c-.37 0-.61-.4-.44-.73zM7.5 6v3.5"
361
- }
362
- }),
363
- _vm._v(" "),
364
- _c("circle", {
365
- attrs: { cx: "7.5", cy: "12", r: "1", fill: "#ad5918" }
366
- })
367
- ]
368
- )
369
- : _vm._e(),
370
- _vm._v(" "),
371
- _vm.variant === "error"
372
- ? _c(
373
- "svg",
374
- {
375
- attrs: {
376
- xmlns: "http://www.w3.org/2000/svg",
377
- width: "16",
378
- height: "16",
379
- viewBox: "0 0 16 16",
380
- role: "presentation",
381
- focussable: "false"
382
- }
383
- },
384
- [
385
- _c(
386
- "g",
387
- {
388
- attrs: {
389
- fill: "none",
390
- stroke: "var(--vs-alert-error-icon)"
391
- }
392
- },
393
- [
394
- _c("circle", {
395
- attrs: { cx: "7.5", cy: "8.5", r: "7" }
396
- }),
397
- _vm._v(" "),
398
- _c("path", {
399
- attrs: { "stroke-linecap": "round", d: "M7.5 4.5V9" }
400
- })
401
- ]
402
- ),
403
- _vm._v(" "),
404
- _c("circle", {
405
- attrs: {
406
- cx: "7.5",
407
- cy: "12",
408
- r: "1",
409
- fill: "var(--vs-alert-error-icon)"
410
- }
411
- })
412
- ]
413
- )
414
- : _vm._e(),
415
- _vm._v(" "),
416
- _vm.variant === "info"
417
- ? _c(
418
- "svg",
419
- {
420
- attrs: {
421
- xmlns: "http://www.w3.org/2000/svg",
422
- width: "16",
423
- height: "16",
424
- viewBox: "0 0 16 16",
425
- role: "presentation",
426
- focussable: "false"
427
- }
428
- },
429
- [
430
- _c(
431
- "g",
432
- { attrs: { stroke: "var(--vs-alert-info-icon)" } },
433
- [
434
- _c("circle", {
435
- attrs: { cx: "7.5", cy: "8.5", r: "7", fill: "none" }
436
- }),
437
- _vm._v(" "),
438
- _c("path", {
439
- attrs: { "stroke-linecap": "round", d: "M7.5 12.5V8" }
440
- })
441
- ]
442
- ),
443
- _vm._v(" "),
444
- _c("circle", {
445
- attrs: {
446
- cx: "7.5",
447
- cy: "5",
448
- r: "1",
449
- fill: "var(--vs-alert-info-icon)"
450
- }
451
- })
452
- ]
453
- )
454
- : _vm._e(),
455
- _vm._v(" "),
456
- _vm.variant === "secondary"
457
- ? _c(
458
- "svg",
459
- {
460
- attrs: {
461
- xmlns: "http://www.w3.org/2000/svg",
462
- width: "16",
463
- height: "16",
464
- viewBox: "0 0 16 16",
465
- role: "presentation",
466
- focussable: "false"
467
- }
468
- },
469
- [
470
- _c(
471
- "g",
472
- { attrs: { stroke: "var(--vs-alert-secondary-icon)" } },
473
- [
474
- _c("circle", {
475
- attrs: { cx: "7.5", cy: "8.5", r: "7", fill: "none" }
476
- }),
477
- _vm._v(" "),
478
- _c("path", {
479
- attrs: { "stroke-linecap": "round", d: "M7.5 12.5V8" }
480
- })
481
- ]
482
- ),
483
- _vm._v(" "),
484
- _c("circle", {
485
- attrs: {
486
- cx: "7.5",
487
- cy: "5",
488
- r: "1",
489
- fill: "var(--vs-alert-secondary-icon)"
490
- }
491
- })
492
- ]
493
- )
494
- : _vm._e()
495
- ])
496
- ],
497
- 2
498
- ),
499
- _vm._v(" "),
500
- _c(
501
- "div",
502
- { staticClass: "vs-alert__heading" },
503
- [_vm._t("title", [_vm.title ? [_vm._v(_vm._s(_vm.title))] : _vm._e()])],
504
- 2
505
- ),
506
- _vm._v(" "),
507
- _vm._t("default"),
508
- _vm._v(" "),
509
- _vm.showClose
510
- ? _c(
511
- "button",
512
- {
513
- class: ["vs-alert-button", _vm.variant],
514
- attrs: { "aria-label": "Close" },
515
- on: {
516
- click: function($event) {
517
- return _vm.$emit("close", true)
518
- }
519
- }
520
- },
521
- [
522
- _c(
523
- "svg",
524
- {
525
- attrs: {
526
- xmlns: "http://www.w3.org/2000/svg",
527
- width: "12",
528
- height: "12",
529
- viewBox: "0 0 12 12",
530
- role: "presentation",
531
- focusable: "false"
532
- }
533
- },
534
- [
535
- _c("path", {
536
- attrs: {
537
- stroke: "currentColor",
538
- "stroke-linecap": "round",
539
- d: "M3 9l6-6m0 6L3 3"
540
- }
541
- })
542
- ]
543
- )
544
- ]
545
- )
546
- : _vm._e()
547
- ],
548
- 2
549
- )
550
- };
551
- var __vue_staticRenderFns__ = [];
552
- __vue_render__._withStripped = true;
553
-
554
- /* style */
555
- var __vue_inject_styles__ = function (inject) {
556
- if (!inject) { return }
557
- inject("data-v-98c9a0d8_0", { source: ".vs-alert {\n --vs-alert-success-bc: #aecfc2;\n --vs-alert-success-bg: #edf8f4;\n --vs-alert-success-color: #186146;\n --vs-alert-success-icon: #038153;\n --vs-alert-warning-bc: #fed6a8;\n --vs-alert-warning-bg: #fff7ed;\n --vs-alert-warning-color: #ad5918;\n --vs-alert-warning-icon: #ad5918;\n --vs-alert-error-bc: #f5b5ba;\n --vs-alert-error-bg: #fff0f1;\n --vs-alert-error-color: #8c232c;\n --vs-alert-error-icon: #cc3340;\n --vs-alert-info-bc: #adcce4;\n --vs-alert-info-bg: #edf7ff;\n --vs-alert-info-color: #1f73b7;\n --vs-alert-info-icon: #337fbd;\n --vs-alert-secondary-bc: #d8dcde;\n --vs-alert-secondary-bg: #f8f9f9;\n --vs-alert-secondary-color: #68737d;\n --vs-alert-secondary-icon: #68737d;\n position: relative;\n border-radius: 4px;\n padding: 20px 20px 20px 40px;\n line-height: 1.42857;\n font-size: 14px;\n}\n.vs-alert-icon__wrapper svg {\n position: absolute;\n left: 15px;\n margin-top: 1px;\n}\n.vs-alert__heading {\n font-weight: 600;\n filter: brightness(85%);\n}\n.vs-alert-button {\n display: block;\n position: absolute;\n top: 15px;\n right: 10px;\n transition: background-color 0.1s ease-in-out 0s, color 0.25s ease-in-out 0s;\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0px;\n width: 28px;\n height: 28px;\n overflow: hidden;\n color: #333333;\n font-size: 0px;\n user-select: none;\n}\n.vs-alert-button.success {\n color: var(--vs-alert-success-color);\n}\n.vs-alert-button.warning {\n color: var(--vs-alert-warning-color);\n}\n.vs-alert-button.error {\n color: var(--vs-alert-error-color);\n}\n.vs-alert-button.info {\n color: var(--vs-alert-info-color);\n}\n.vs-alert-button.secondary {\n color: var(--vs-alert-secondary-color);\n}\n.vs-alert-success {\n border: 1px solid var(--vs-alert-success-bc);\n background-color: var(--vs-alert-success-bg);\n color: var(--vs-alert-success-color);\n}\n.vs-alert-warning {\n border: 1px solid var(--vs-alert-warning-bc);\n background-color: var(--vs-alert-warning-bg);\n color: var(--vs-alert-warning-color);\n}\n.vs-alert-error {\n border: 1px solid var(--vs-alert-error-bc);\n background-color: var(--vs-alert-error-bg);\n color: var(--vs-alert-error-color);\n}\n.vs-alert-info {\n border: 1px solid var(--vs-alert-info-bc);\n background-color: var(--vs-alert-info-bg);\n color: var(--vs-alert-info-color);\n}\n.vs-alert-secondary {\n border: 1px solid var(--vs-alert-secondary-bc);\n background-color: var(--vs-alert-secondary-bg);\n color: var(--vs-alert-secondary-color);\n}\n.vs-alert.vs-alert--small:not(.vs-alert--is-close) {\n padding: 12px 20px 12px 40px;\n}\n.vs-alert.vs-alert--is-close:not(.vs-alert--small) {\n padding: 20px 40px;\n}\n.vs-alert.vs-alert--is-close.vs-alert--small {\n padding: 12px 40px;\n}\n.vs-alert.vs-alert--is-close.vs-alert--small .vs-alert-button {\n top: 8px;\n}\n.vs-alert--no-bg {\n background-color: transparent;\n border-color: transparent;\n padding: 0 22px;\n font-size: 13px;\n}\n.vs-alert--no-bg .vs-alert-icon__wrapper svg {\n left: 0;\n margin-top: 0;\n}\n.vs-alert--no-bg.vs-alert-warning {\n color: var(--vs-alert-warning-icon);\n}\n.vs-alert--no-bg.vs-alert-error {\n color: var(--vs-alert-error-icon);\n}\n.vs-alert--toast {\n background-color: transparent;\n border: solid 1px #d8dcde;\n color: #2f3941;\n box-shadow: rgba(23, 73, 77, 0.15) 0px 20px 28px 0px;\n padding: 15px 40px;\n}\n.vs-alert--toast .vs-alert__heading {\n filter: brightness(100%);\n}\n.vs-alert--toast.vs-alert-success .vs-alert__heading {\n color: var(--vs-alert-success-icon);\n}\n.vs-alert--toast.vs-alert-warning .vs-alert__heading {\n color: var(--vs-alert-warning-icon);\n}\n.vs-alert--toast.vs-alert-error .vs-alert__heading {\n color: var(--vs-alert-error-icon);\n}\n.vs-alert--toast.vs-alert-info .vs-alert__heading {\n color: var(--vs-alert-info-icon);\n}\n.vs-alert--toast.vs-alert-secondary .vs-alert__heading {\n color: var(--vs-alert-secondary-icon);\n}\n.vs-alert--toast .vs-alert-button {\n color: #68737d;\n top: 10px;\n}", map: undefined, media: undefined });
558
-
559
- };
560
- /* scoped */
561
- var __vue_scope_id__ = undefined;
562
- /* module identifier */
563
- var __vue_module_identifier__ = undefined;
564
- /* functional template */
565
- var __vue_is_functional_template__ = false;
566
- /* style inject SSR */
567
-
568
- /* style inject shadow dom */
569
-
570
-
571
-
572
- var __vue_component__ = /*#__PURE__*/normalizeComponent(
573
- { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
574
- __vue_inject_styles__,
575
- __vue_script__,
576
- __vue_scope_id__,
577
- __vue_is_functional_template__,
578
- __vue_module_identifier__,
579
- false,
580
- createInjector,
581
- undefined,
582
- undefined
583
- );
584
-
585
- // Import vue component
586
-
587
- // Declare install function executed by Vue.use()
588
- function install(Vue) {
589
- if (install.installed) { return; }
590
- install.installed = true;
591
- Vue.component('VsAlert', __vue_component__);
592
- }
593
-
594
- // Create module definition for Vue.use()
595
- var plugin = {
596
- install: install,
597
- };
598
-
599
- // Auto-install when vue is found (eg. in browser via <script> tag)
600
- var GlobalVue = null;
601
- if (typeof window !== 'undefined') {
602
- GlobalVue = window.Vue;
603
- } else if (typeof global !== 'undefined') {
604
- GlobalVue = global.Vue;
605
- }
606
- if (GlobalVue) {
607
- GlobalVue.use(plugin);
608
- }
609
-
610
- export default __vue_component__;
611
- export { install };
package/dist/vs-alert.min.js DELETED
@@ -1 +0,0 @@
1
- var VsAlert=function(e){"use strict";var r={name:"VsAlert",props:{variant:{type:String,required:!0,validator:function(e){return["success","error","info","warning","secondary"].includes(e.toLowerCase())}},showClose:{type:Boolean,default:!1},title:{type:String},noBg:{type:Boolean,default:!1},small:{type:Boolean,default:!1},toast:{type:Boolean,default:!1}},computed:{classList:function(){return["vs-alert-"+this.variant,{"vs-alert--no-bg":this.noBg},{"vs-alert--small":this.small},{"vs-alert--toast":this.toast},{"vs-alert--is-close":this.showClose}]}}};function n(e,r,n,t,s,a,o,l,i,c){"boolean"!=typeof o&&(i=l,l=o,o=!1);var v,d="function"==typeof n?n.options:n;if(e&&e.render&&(d.render=e.render,d.staticRenderFns=e.staticRenderFns,d._compiled=!0,s&&(d.functional=!0)),t&&(d._scopeId=t),a?(v=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),r&&r.call(this,i(e)),e&&e._registeredComponents&&e._registeredComponents.add(a)},d._ssrRegister=v):r&&(v=o?function(e){r.call(this,c(e,this.$root.$options.shadowRoot))}:function(e){r.call(this,l(e))}),v)if(d.functional){var p=d.render;d.render=function(e,r){return v.call(r),p(e,r)}}else{var u=d.beforeCreate;d.beforeCreate=u?[].concat(u,v):[v]}return n}var t,s="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());function a(e){return function(e,r){return function(e,r){var n=s?r.media||"default":e,a=o[n]||(o[n]={ids:new Set,styles:[]});if(!a.ids.has(e)){a.ids.add(e);var l=r.source;if(r.map&&(l+="\n/*# sourceURL="+r.map.sources[0]+" */",l+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r.map))))+" */"),a.element||(a.element=document.createElement("style"),a.element.type="text/css",r.media&&a.element.setAttribute("media",r.media),void 0===t&&(t=document.head||document.getElementsByTagName("head")[0]),t.appendChild(a.element)),"styleSheet"in a.element)a.styles.push(l),a.element.styleSheet.cssText=a.styles.filter(Boolean).join("\n");else{var i=a.ids.size-1,c=document.createTextNode(l),v=a.element.childNodes;v[i]&&a.element.removeChild(v[i]),v.length?a.element.insertBefore(c,v[i]):a.element.appendChild(c)}}}(e,r)}}var o={};var l=r,i=function(){var e=this,r=e.$createElement,n=e._self._c||r;return n("div",{class:["vs-alert",e.classList]},[n("span",{staticClass:"vs-alert-icon__wrapper"},[e._t("icon",["success"===e.variant?n("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",role:"presentation",focussable:"false"}},[n("g",{attrs:{fill:"none",stroke:"var(--vs-alert-success-icon)"}},[n("path",{attrs:{"stroke-linecap":"round","stroke-linejoin":"round",d:"M4 9l2.5 2.5 5-5"}}),e._v(" "),n("circle",{attrs:{cx:"7.5",cy:"8.5",r:"7"}})])]):e._e(),e._v(" "),"warning"===e.variant?n("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",role:"presentation",focussable:"false"}},[n("path",{attrs:{fill:"none",stroke:"var(--vs-alert-warning-icon)","stroke-linecap":"round",d:"M.88 13.77L7.06 1.86c.19-.36.7-.36.89 0l6.18 11.91c.17.33-.07.73-.44.73H1.32c-.37 0-.61-.4-.44-.73zM7.5 6v3.5"}}),e._v(" "),n("circle",{attrs:{cx:"7.5",cy:"12",r:"1",fill:"#ad5918"}})]):e._e(),e._v(" "),"error"===e.variant?n("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",role:"presentation",focussable:"false"}},[n("g",{attrs:{fill:"none",stroke:"var(--vs-alert-error-icon)"}},[n("circle",{attrs:{cx:"7.5",cy:"8.5",r:"7"}}),e._v(" "),n("path",{attrs:{"stroke-linecap":"round",d:"M7.5 4.5V9"}})]),e._v(" "),n("circle",{attrs:{cx:"7.5",cy:"12",r:"1",fill:"var(--vs-alert-error-icon)"}})]):e._e(),e._v(" "),"info"===e.variant?n("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",role:"presentation",focussable:"false"}},[n("g",{attrs:{stroke:"var(--vs-alert-info-icon)"}},[n("circle",{attrs:{cx:"7.5",cy:"8.5",r:"7",fill:"none"}}),e._v(" "),n("path",{attrs:{"stroke-linecap":"round",d:"M7.5 12.5V8"}})]),e._v(" "),n("circle",{attrs:{cx:"7.5",cy:"5",r:"1",fill:"var(--vs-alert-info-icon)"}})]):e._e(),e._v(" "),"secondary"===e.variant?n("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",role:"presentation",focussable:"false"}},[n("g",{attrs:{stroke:"var(--vs-alert-secondary-icon)"}},[n("circle",{attrs:{cx:"7.5",cy:"8.5",r:"7",fill:"none"}}),e._v(" "),n("path",{attrs:{"stroke-linecap":"round",d:"M7.5 12.5V8"}})]),e._v(" "),n("circle",{attrs:{cx:"7.5",cy:"5",r:"1",fill:"var(--vs-alert-secondary-icon)"}})]):e._e()])],2),e._v(" "),n("div",{staticClass:"vs-alert__heading"},[e._t("title",[e.title?[e._v(e._s(e.title))]:e._e()])],2),e._v(" "),e._t("default"),e._v(" "),e.showClose?n("button",{class:["vs-alert-button",e.variant],attrs:{"aria-label":"Close"},on:{click:function(r){return e.$emit("close",!0)}}},[n("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"12",viewBox:"0 0 12 12",role:"presentation",focusable:"false"}},[n("path",{attrs:{stroke:"currentColor","stroke-linecap":"round",d:"M3 9l6-6m0 6L3 3"}})])]):e._e()],2)};i._withStripped=!0;var c=n({render:i,staticRenderFns:[]},(function(e){e&&e("data-v-98c9a0d8_0",{source:".vs-alert {\n --vs-alert-success-bc: #aecfc2;\n --vs-alert-success-bg: #edf8f4;\n --vs-alert-success-color: #186146;\n --vs-alert-success-icon: #038153;\n --vs-alert-warning-bc: #fed6a8;\n --vs-alert-warning-bg: #fff7ed;\n --vs-alert-warning-color: #ad5918;\n --vs-alert-warning-icon: #ad5918;\n --vs-alert-error-bc: #f5b5ba;\n --vs-alert-error-bg: #fff0f1;\n --vs-alert-error-color: #8c232c;\n --vs-alert-error-icon: #cc3340;\n --vs-alert-info-bc: #adcce4;\n --vs-alert-info-bg: #edf7ff;\n --vs-alert-info-color: #1f73b7;\n --vs-alert-info-icon: #337fbd;\n --vs-alert-secondary-bc: #d8dcde;\n --vs-alert-secondary-bg: #f8f9f9;\n --vs-alert-secondary-color: #68737d;\n --vs-alert-secondary-icon: #68737d;\n position: relative;\n border-radius: 4px;\n padding: 20px 20px 20px 40px;\n line-height: 1.42857;\n font-size: 14px;\n}\n.vs-alert-icon__wrapper svg {\n position: absolute;\n left: 15px;\n margin-top: 1px;\n}\n.vs-alert__heading {\n font-weight: 600;\n filter: brightness(85%);\n}\n.vs-alert-button {\n display: block;\n position: absolute;\n top: 15px;\n right: 10px;\n transition: background-color 0.1s ease-in-out 0s, color 0.25s ease-in-out 0s;\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0px;\n width: 28px;\n height: 28px;\n overflow: hidden;\n color: #333333;\n font-size: 0px;\n user-select: none;\n}\n.vs-alert-button.success {\n color: var(--vs-alert-success-color);\n}\n.vs-alert-button.warning {\n color: var(--vs-alert-warning-color);\n}\n.vs-alert-button.error {\n color: var(--vs-alert-error-color);\n}\n.vs-alert-button.info {\n color: var(--vs-alert-info-color);\n}\n.vs-alert-button.secondary {\n color: var(--vs-alert-secondary-color);\n}\n.vs-alert-success {\n border: 1px solid var(--vs-alert-success-bc);\n background-color: var(--vs-alert-success-bg);\n color: var(--vs-alert-success-color);\n}\n.vs-alert-warning {\n border: 1px solid var(--vs-alert-warning-bc);\n background-color: var(--vs-alert-warning-bg);\n color: var(--vs-alert-warning-color);\n}\n.vs-alert-error {\n border: 1px solid var(--vs-alert-error-bc);\n background-color: var(--vs-alert-error-bg);\n color: var(--vs-alert-error-color);\n}\n.vs-alert-info {\n border: 1px solid var(--vs-alert-info-bc);\n background-color: var(--vs-alert-info-bg);\n color: var(--vs-alert-info-color);\n}\n.vs-alert-secondary {\n border: 1px solid var(--vs-alert-secondary-bc);\n background-color: var(--vs-alert-secondary-bg);\n color: var(--vs-alert-secondary-color);\n}\n.vs-alert.vs-alert--small:not(.vs-alert--is-close) {\n padding: 12px 20px 12px 40px;\n}\n.vs-alert.vs-alert--is-close:not(.vs-alert--small) {\n padding: 20px 40px;\n}\n.vs-alert.vs-alert--is-close.vs-alert--small {\n padding: 12px 40px;\n}\n.vs-alert.vs-alert--is-close.vs-alert--small .vs-alert-button {\n top: 8px;\n}\n.vs-alert--no-bg {\n background-color: transparent;\n border-color: transparent;\n padding: 0 22px;\n font-size: 13px;\n}\n.vs-alert--no-bg .vs-alert-icon__wrapper svg {\n left: 0;\n margin-top: 0;\n}\n.vs-alert--no-bg.vs-alert-warning {\n color: var(--vs-alert-warning-icon);\n}\n.vs-alert--no-bg.vs-alert-error {\n color: var(--vs-alert-error-icon);\n}\n.vs-alert--toast {\n background-color: transparent;\n border: solid 1px #d8dcde;\n color: #2f3941;\n box-shadow: rgba(23, 73, 77, 0.15) 0px 20px 28px 0px;\n padding: 15px 40px;\n}\n.vs-alert--toast .vs-alert__heading {\n filter: brightness(100%);\n}\n.vs-alert--toast.vs-alert-success .vs-alert__heading {\n color: var(--vs-alert-success-icon);\n}\n.vs-alert--toast.vs-alert-warning .vs-alert__heading {\n color: var(--vs-alert-warning-icon);\n}\n.vs-alert--toast.vs-alert-error .vs-alert__heading {\n color: var(--vs-alert-error-icon);\n}\n.vs-alert--toast.vs-alert-info .vs-alert__heading {\n color: var(--vs-alert-info-icon);\n}\n.vs-alert--toast.vs-alert-secondary .vs-alert__heading {\n color: var(--vs-alert-secondary-icon);\n}\n.vs-alert--toast .vs-alert-button {\n color: #68737d;\n top: 10px;\n}",map:void 0,media:void 0})}),l,void 0,!1,void 0,!1,a,void 0,void 0);function v(e){v.installed||(v.installed=!0,e.component("VsAlert",c))}var d={install:v},p=null;return"undefined"!=typeof window?p=window.Vue:"undefined"!=typeof global&&(p=global.Vue),p&&p.use(d),e.default=c,e.install=v,e}({});