@e-xode/vui 0.6.6 → 0.6.7
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/README.md +11 -7
- package/dist/checkbox-BP2ttYER.js +1 -0
- package/dist/{checkbox-C0XHmyOW.js → checkbox-Qcc2Y3jj.js} +56 -25
- package/dist/doc/assets/{alert-DeIKuuce.js → alert-kDXe81fs.js} +1 -1
- package/dist/doc/assets/{alert-DXU8Elqq.js → alert-xIfTKyZn.js} +1 -1
- package/dist/doc/assets/{button-G8t_NLRi.js → button-2k6FVc0L.js} +1 -1
- package/dist/doc/assets/{button-B13Yf1Kd.js → button-9ro2C_DO.js} +1 -1
- package/dist/doc/assets/{card-bZflYXP1.js → card-DiRo_ZxR.js} +1 -1
- package/dist/doc/assets/{card-B_zN0RIP.js → card-ETnsHTxY.js} +1 -1
- package/dist/doc/assets/checkbox-BNwsQFlx.css +1 -0
- package/dist/doc/assets/checkbox-GxzrS_FW.js +1 -0
- package/dist/doc/assets/checkbox-XTMM84PN.js +28 -0
- package/dist/doc/assets/{component-B1_tpRW4.js → component-Cd0V3c30.js} +1 -1
- package/dist/doc/assets/{default-D8NjjGBi.css → default-DOpWYWAd.css} +1 -1
- package/dist/doc/assets/{default-DHgTVVbu.js → default-Ddw34XZA.js} +1 -1
- package/dist/doc/assets/{demonstrable-nGGBFHXw.js → demonstrable-Dv7XIPoL.js} +1 -1
- package/dist/doc/assets/{dropdown-DcmkPEip.js → dropdown-C6Kafffe.js} +1 -1
- package/dist/doc/assets/{dropdown-inZsWa61.js → dropdown-CWekPPzX.js} +1 -1
- package/dist/doc/assets/{dropdown-BDltvOgD.css → dropdown-MxPEtcwI.css} +1 -1
- package/dist/doc/assets/{footer-BBBAapy7.js → footer-DEmxvZDO.js} +1 -1
- package/dist/doc/assets/{footer-D_HwgUDT.js → footer-DmvqVfCJ.js} +1 -1
- package/dist/doc/assets/{form-8yXKOyqL.js → form-DLfAvscm.js} +1 -1
- package/dist/doc/assets/{form-CjnywRsh.js → form-DQoPnfc6.js} +1 -1
- package/dist/doc/assets/{grid-CEJWLlXk.js → grid-Byaifs5F.js} +1 -1
- package/dist/doc/assets/{grid-BMMzEfv4.js → grid-Dyb-qIv6.js} +1 -1
- package/dist/doc/assets/{header-rBaLh0Nj.js → header-C2DRVubg.js} +1 -1
- package/dist/doc/assets/{header-BlKpFHRO.js → header-CW68DlQ3.js} +1 -1
- package/dist/doc/assets/{index-Bxv-4tsQ.js → index-BTCbAXEh.js} +15 -15
- package/dist/doc/assets/{index-5BUQdJLK.js → index-DYd8GVyV.js} +1 -1
- package/dist/doc/assets/input-DJ8amP3y.css +1 -0
- package/dist/doc/assets/input-Dxw7RYfZ.js +37 -0
- package/dist/doc/assets/input-hkS14TCT.js +1 -0
- package/dist/doc/assets/{list-uelxz83r.js → list-BYX5Hslw.js} +1 -1
- package/dist/doc/assets/{list-Dg2wJkNi.js → list-n3xmt7CO.js} +1 -1
- package/dist/doc/assets/{loader-Brnp5cYS.js → loader-C_KYFdY0.js} +1 -1
- package/dist/doc/assets/{loader-CG6MxzXb.js → loader-hc6kqiqT.js} +1 -1
- package/dist/doc/assets/{modal-fIYL2tZA.js → modal-Ci7IYllg.js} +1 -1
- package/dist/doc/assets/{modal-DfTrEZrg.js → modal-DprGtJnD.js} +1 -1
- package/dist/doc/assets/{nav-BcINi9Ls.js → nav--03mFDUT.js} +1 -1
- package/dist/doc/assets/{nav-as-1HVTB.js → nav-C9RI5Z6H.js} +1 -1
- package/dist/doc/assets/{page-Cobsh0Ws.js → page-C85vct24.js} +1 -1
- package/dist/doc/assets/{page-25OUIluR.js → page-CMF9WylW.js} +1 -1
- package/dist/doc/assets/{pager-BloxkVL8.js → pager-0bNXGtWQ.js} +1 -1
- package/dist/doc/assets/{pager-DW6NgWoZ.js → pager-BuEhUbXw.js} +1 -1
- package/dist/doc/assets/{progress-Agje03EU.js → progress-B9G9PL1G.js} +1 -1
- package/dist/doc/assets/{progress-vNI_eJTO.js → progress-aePOsZNN.js} +1 -1
- package/dist/doc/assets/radio-Dg31j783.css +1 -0
- package/dist/doc/assets/radio-FDvwgcUe.js +1 -0
- package/dist/doc/assets/radio-vJklHHcl.js +28 -0
- package/dist/doc/assets/{start-vmhkIBQI.js → start-Cpz5sHNq.js} +1 -1
- package/dist/doc/assets/{table-0uWudBxb.js → table-C_Rv3GlB.js} +1 -1
- package/dist/doc/assets/{table-ovOZ3st-.js → table-D1jz3DKO.js} +1 -1
- package/dist/doc/assets/{tabs-B3nfb47D.js → tabs-CpDei3SM.js} +1 -1
- package/dist/doc/assets/{tabs-C3cihruc.js → tabs-DJI7K47M.js} +1 -1
- package/dist/doc/assets/{tag-BkuMiR78.js → tag-0ugBlzs4.js} +1 -1
- package/dist/doc/assets/{tag-BzSu1hWx.js → tag-CgEGHygn.js} +1 -1
- package/dist/doc/assets/{toggle-EqO81L8C.js → toggle-CsmmXJeS.js} +1 -1
- package/dist/doc/assets/{toggle-DwIBPen1.js → toggle-Dxv9_B8u.js} +1 -1
- package/dist/doc/assets/{tooltip-DpEnb-Ez.js → tooltip-BZOlKAkT.js} +1 -1
- package/dist/doc/assets/{tooltip-Di8htduO.js → tooltip-CfuewoN3.js} +1 -1
- package/dist/doc/assets/{translatable-CVnAMpzi.js → translatable-eIyiPB31.js} +1 -1
- package/dist/doc/assets/{unit-CHR3cNii.js → unit-B5sbv-XJ.js} +1 -1
- package/dist/doc/assets/{unit-thgjRRiP.js → unit-KaJ8YPkP.js} +1 -1
- package/dist/doc/index.html +1 -1
- package/dist/{dropdown-CXZUMHXL.js → dropdown-DUUZsTpI.js} +1 -1
- package/dist/{dropdown-Dh1vGymO.js → dropdown-UMn42uen.js} +6 -5
- package/dist/input-BS_1U11l.js +139 -0
- package/dist/input-CPJkbqQt.js +1 -0
- package/dist/radio-BlBm-IvA.js +1 -0
- package/dist/radio-CzWvdO-G.js +147 -0
- package/dist/style.css +1 -1
- package/dist/vui.esm.js +12 -1
- package/dist/vui.js +1 -1
- package/dist/vui.umd.js +1 -1
- package/package.json +5 -5
- package/dist/checkbox-B9yl-GCS.js +0 -1
- package/dist/doc/assets/checkbox-C2hNaqU5.js +0 -14
- package/dist/doc/assets/checkbox-C9B8Gm2L.js +0 -1
- package/dist/doc/assets/checkbox-Dtjrzcei.css +0 -1
- package/dist/doc/assets/input-Bm6YMcaH.js +0 -1
- package/dist/doc/assets/input-D3l35AS9.css +0 -1
- package/dist/doc/assets/input-DqqDODLC.js +0 -15
- package/dist/input-Dy5fCJhT.js +0 -103
- package/dist/input-WjGQ7q1J.js +0 -1
package/README.md
CHANGED
|
@@ -7,8 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
## Features
|
|
9
9
|
|
|
10
|
-
- 3 types of web components: Html, UI, and layout, written in a way to provide simple implementation and easy customization. **
|
|
11
|
-
|
|
10
|
+
- 3 types of web components: Html, UI, and layout, written in a way to provide simple implementation and easy customization. **24 components are available** in the current release.
|
|
12
11
|
- Styles and layouts allow easy CSS overriding (no inline definitions, no messy !importants, ...).
|
|
13
12
|
- Compatible with server rendering ( [SSR](https://vuejs.org/guide/scaling-up/ssr.html) ).
|
|
14
13
|
- Integrates fontawesome-free Icons library.
|
|
@@ -18,7 +17,7 @@ Online documentation and live demo are available [here](https://vui.e-xode.net/)
|
|
|
18
17
|
|
|
19
18
|
Package and releases are available on [NPM](https://www.npmjs.com/package/@e-xode/vui)
|
|
20
19
|
|
|
21
|
-
|
|
20
|
+
## Get started
|
|
22
21
|
|
|
23
22
|
Install first the library:
|
|
24
23
|
|
|
@@ -26,7 +25,7 @@ Install first the library:
|
|
|
26
25
|
npm install -s @e-xode/vui
|
|
27
26
|
```
|
|
28
27
|
|
|
29
|
-
|
|
28
|
+
### use vui in your vue app
|
|
30
29
|
|
|
31
30
|
In your Vue application:
|
|
32
31
|
|
|
@@ -46,12 +45,13 @@ main.use(new createI18n({
|
|
|
46
45
|
```
|
|
47
46
|
|
|
48
47
|
Notes:
|
|
48
|
+
|
|
49
49
|
- The current version of VUI works only with vue-i18n and option **legacy = false** (translations are components isolated)
|
|
50
50
|
- Version of node currently supported: 21
|
|
51
51
|
- Depending of your bundler, you may need to provide specific path of the module format:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
52
|
+
- cjs: ```import vui from '@e-xode/vui/vui.cjs.js'```
|
|
53
|
+
- esm: ```import vui from '@e-xode/vui/vui.esm.js'```
|
|
54
|
+
- umd: ```import vui from '@e-xode/vui/vui.umd.js'```
|
|
55
55
|
|
|
56
56
|
### load vui style
|
|
57
57
|
|
|
@@ -90,17 +90,21 @@ Notes:
|
|
|
90
90
|
```
|
|
91
91
|
|
|
92
92
|
## Run & develop vui sources
|
|
93
|
+
|
|
93
94
|
```sh
|
|
94
95
|
copy .env_sample .env
|
|
95
96
|
```
|
|
97
|
+
|
|
96
98
|
Optional: edit .env file content and update values according to your config
|
|
97
99
|
|
|
98
100
|
### with docker
|
|
101
|
+
|
|
99
102
|
```sh
|
|
100
103
|
docker-compose up
|
|
101
104
|
```
|
|
102
105
|
|
|
103
106
|
### or local with Node / NPM
|
|
107
|
+
|
|
104
108
|
```sh
|
|
105
109
|
npm install
|
|
106
110
|
npm run dev
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./_plugin-vue_export-helper-DeDoBcDj.js"),l=require("vue");require("highlight.js");const d={},s={},n={en:d,fr:s},c={checked:{default:void 0,type:Boolean},checkedValue:{default:void 0,types:[Boolean,String,Number,null]},icon:{type:String,default:"fa-square"},iconChecked:{type:String,default:"fa-square-check"},modelValue:{default:void 0,types:[Boolean,String,Number,null]},name:{default:void 0,type:String},text:{default:void 0,type:String},uncheckedValue:{default:void 0,types:[Boolean,String,Number,null]},value:{default:void 0,types:[Boolean,String,Number,null]}},u={name:"VuiCheckbox",mixins:[o.composable],props:c,emits:["update:model-value"],data(){return{toggled:!1}},computed:{hasLabel(){return this.$slots.default||this.text},isChecked(){return this.hasProp("checked")?this.checked:this.hasProp("checkedValue")?this.toggled===this.checkedValue:this.toggled}},watch:{modelValue(e){this.toggled=e},value(e){this.toggled=e}},created(){o.translatable(n),this.hasModelValue?this.toggled=this.modelValue:this.hasValue&&(this.toggled=this.value)},methods:{onToggle(){this.disabled||(this.hasProp("checkedValue")?this.toggled=this.isChecked?this.uncheckedValue:this.checkedValue:this.toggled=!this.isChecked,this.$emit("update:model-value",this.toggled))}}},r=["id"],h=["name","disabled","required"],k=["for"];function g(e,i,m,b,p,t){return l.openBlock(),l.createElementBlock("div",{id:e.componentId,class:l.normalizeClass(["vui-checkbox",`vui-checkbox--${e.layout}`,{"vui-checkbox--flat":e.hasAttribute("flat")},{"vui-checkbox--with-label":t.hasLabel},{"vui-checkbox--with-icon":e.icon},{"vui-checkbox--checked":t.isChecked},{"vui-checkbox--disabled":e.disabled},{"vui-checkbox--loading":!e.disabled&&e.loading},e.$props.class]),onClick:i[0]||(i[0]=(...a)=>t.onToggle&&t.onToggle(...a))},[l.renderSlot(e.$slots,"prepend"),e.icon&&!t.isChecked?(l.openBlock(),l.createElementBlock("i",{key:0,class:l.normalizeClass(["vui-checkbox-icon",e.icon])},null,2)):l.createCommentVNode("",!0),e.iconChecked&&t.isChecked?(l.openBlock(),l.createElementBlock("i",{key:1,class:l.normalizeClass(["vui-checkbox-icon",e.iconChecked])},null,2)):l.createCommentVNode("",!0),l.createElementVNode("input",{name:e.name,disabled:e.disabled,required:e.hasAttribute("required"),type:"checkbox"},null,8,h),t.hasLabel?(l.openBlock(),l.createElementBlock("label",{key:2,class:"vui-checkbox-label",for:e.name},[l.renderSlot(e.$slots,"default",{},()=>[l.createTextVNode(l.toDisplayString(e.text),1)])],8,k)):l.createCommentVNode("",!0),l.renderSlot(e.$slots,"append")],10,r)}const f=o._export_sfc(u,[["render",g]]);exports.default=f;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { _ as
|
|
2
|
-
import { openBlock as
|
|
1
|
+
import { _ as u, c, t as h } from "./_plugin-vue_export-helper-BSl1dQT6.js";
|
|
2
|
+
import { openBlock as l, createElementBlock as i, normalizeClass as a, renderSlot as d, createCommentVNode as s, createElementVNode as r, createTextVNode as k, toDisplayString as f } from "vue";
|
|
3
3
|
import "highlight.js";
|
|
4
|
-
const
|
|
5
|
-
en:
|
|
6
|
-
fr:
|
|
7
|
-
},
|
|
4
|
+
const g = {}, b = {}, m = {
|
|
5
|
+
en: g,
|
|
6
|
+
fr: b
|
|
7
|
+
}, p = {
|
|
8
8
|
checked: {
|
|
9
9
|
default: void 0,
|
|
10
10
|
type: Boolean
|
|
@@ -18,6 +18,14 @@ const m = {}, g = {}, p = {
|
|
|
18
18
|
null
|
|
19
19
|
]
|
|
20
20
|
},
|
|
21
|
+
icon: {
|
|
22
|
+
type: String,
|
|
23
|
+
default: "fa-square"
|
|
24
|
+
},
|
|
25
|
+
iconChecked: {
|
|
26
|
+
type: String,
|
|
27
|
+
default: "fa-square-check"
|
|
28
|
+
},
|
|
21
29
|
modelValue: {
|
|
22
30
|
default: void 0,
|
|
23
31
|
types: [
|
|
@@ -31,6 +39,10 @@ const m = {}, g = {}, p = {
|
|
|
31
39
|
default: void 0,
|
|
32
40
|
type: String
|
|
33
41
|
},
|
|
42
|
+
text: {
|
|
43
|
+
default: void 0,
|
|
44
|
+
type: String
|
|
45
|
+
},
|
|
34
46
|
uncheckedValue: {
|
|
35
47
|
default: void 0,
|
|
36
48
|
types: [
|
|
@@ -49,12 +61,12 @@ const m = {}, g = {}, p = {
|
|
|
49
61
|
null
|
|
50
62
|
]
|
|
51
63
|
}
|
|
52
|
-
},
|
|
64
|
+
}, v = {
|
|
53
65
|
name: "VuiCheckbox",
|
|
54
66
|
mixins: [
|
|
55
|
-
|
|
67
|
+
c
|
|
56
68
|
],
|
|
57
|
-
props:
|
|
69
|
+
props: p,
|
|
58
70
|
emits: ["update:model-value"],
|
|
59
71
|
data() {
|
|
60
72
|
return {
|
|
@@ -62,6 +74,9 @@ const m = {}, g = {}, p = {
|
|
|
62
74
|
};
|
|
63
75
|
},
|
|
64
76
|
computed: {
|
|
77
|
+
hasLabel() {
|
|
78
|
+
return this.$slots.default || this.text;
|
|
79
|
+
},
|
|
65
80
|
isChecked() {
|
|
66
81
|
return this.hasProp("checked") ? this.checked : this.hasProp("checkedValue") ? this.toggled === this.checkedValue : this.toggled;
|
|
67
82
|
}
|
|
@@ -75,42 +90,58 @@ const m = {}, g = {}, p = {
|
|
|
75
90
|
}
|
|
76
91
|
},
|
|
77
92
|
created() {
|
|
78
|
-
|
|
93
|
+
h(m), this.hasModelValue ? this.toggled = this.modelValue : this.hasValue && (this.toggled = this.value);
|
|
79
94
|
},
|
|
80
95
|
methods: {
|
|
81
96
|
onToggle() {
|
|
82
97
|
this.disabled || (this.hasProp("checkedValue") ? this.toggled = this.isChecked ? this.uncheckedValue : this.checkedValue : this.toggled = !this.isChecked, this.$emit("update:model-value", this.toggled));
|
|
83
98
|
}
|
|
84
99
|
}
|
|
85
|
-
},
|
|
86
|
-
function
|
|
87
|
-
return
|
|
100
|
+
}, V = ["id"], y = ["name", "disabled", "required"], C = ["for"];
|
|
101
|
+
function S(e, o, B, N, q, t) {
|
|
102
|
+
return l(), i("div", {
|
|
88
103
|
id: e.componentId,
|
|
89
|
-
class:
|
|
104
|
+
class: a([
|
|
90
105
|
"vui-checkbox",
|
|
106
|
+
`vui-checkbox--${e.layout}`,
|
|
107
|
+
{ "vui-checkbox--flat": e.hasAttribute("flat") },
|
|
108
|
+
{ "vui-checkbox--with-label": t.hasLabel },
|
|
109
|
+
{ "vui-checkbox--with-icon": e.icon },
|
|
91
110
|
{ "vui-checkbox--checked": t.isChecked },
|
|
92
111
|
{ "vui-checkbox--disabled": e.disabled },
|
|
112
|
+
{ "vui-checkbox--loading": !e.disabled && e.loading },
|
|
93
113
|
e.$props.class
|
|
94
114
|
]),
|
|
95
|
-
onClick:
|
|
115
|
+
onClick: o[0] || (o[0] = (...n) => t.onToggle && t.onToggle(...n))
|
|
96
116
|
}, [
|
|
97
117
|
d(e.$slots, "prepend"),
|
|
98
|
-
|
|
118
|
+
e.icon && !t.isChecked ? (l(), i("i", {
|
|
119
|
+
key: 0,
|
|
120
|
+
class: a(["vui-checkbox-icon", e.icon])
|
|
121
|
+
}, null, 2)) : s("", !0),
|
|
122
|
+
e.iconChecked && t.isChecked ? (l(), i("i", {
|
|
123
|
+
key: 1,
|
|
124
|
+
class: a(["vui-checkbox-icon", e.iconChecked])
|
|
125
|
+
}, null, 2)) : s("", !0),
|
|
126
|
+
r("input", {
|
|
99
127
|
name: e.name,
|
|
100
128
|
disabled: e.disabled,
|
|
101
129
|
required: e.hasAttribute("required"),
|
|
102
130
|
type: "checkbox"
|
|
103
|
-
}, null, 8,
|
|
104
|
-
|
|
105
|
-
key:
|
|
106
|
-
|
|
131
|
+
}, null, 8, y),
|
|
132
|
+
t.hasLabel ? (l(), i("label", {
|
|
133
|
+
key: 2,
|
|
134
|
+
class: "vui-checkbox-label",
|
|
135
|
+
for: e.name
|
|
107
136
|
}, [
|
|
108
|
-
d(e.$slots, "default")
|
|
109
|
-
|
|
137
|
+
d(e.$slots, "default", {}, () => [
|
|
138
|
+
k(f(e.text), 1)
|
|
139
|
+
])
|
|
140
|
+
], 8, C)) : s("", !0),
|
|
110
141
|
d(e.$slots, "append")
|
|
111
|
-
], 10,
|
|
142
|
+
], 10, V);
|
|
112
143
|
}
|
|
113
|
-
const
|
|
144
|
+
const L = /* @__PURE__ */ u(v, [["render", S]]);
|
|
114
145
|
export {
|
|
115
|
-
|
|
146
|
+
L as default
|
|
116
147
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{c as n}from"./composable-CshUTKfl.js";import{t as r}from"./translatable-
|
|
1
|
+
import{c as n}from"./composable-CshUTKfl.js";import{t as r}from"./translatable-eIyiPB31.js";import{_ as i,a as o,j as s,n as t,o as a,f as l,e as p,t as c}from"./index-BTCbAXEh.js";const d={},m={},u={en:d,fr:m},f={icon:{type:String},text:{type:String}},$={name:"VuiAlert",mixins:[n],props:f,created(){r(u)}},y=["id"];function g(e,v,S,V,k,b){return a(),o("div",{id:e.componentId,class:t(["vui-alert",`vui-alert--${e.layout}`,e.$props.class])},[s(e.$slots,"prepend"),s(e.$slots,"icon",{},()=>[e.icon?(a(),o("i",{key:0,class:t(["vui-alert-icon",e.icon])},null,2)):l("",!0)]),s(e.$slots,"default",{},()=>[p(c(e.text),1)]),s(e.$slots,"append")],10,y)}const C=i($,[["render",g]]);export{C as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{d as f}from"./demonstrable-
|
|
1
|
+
import{d as f}from"./demonstrable-Dv7XIPoL.js";import{t as h}from"./translatable-eIyiPB31.js";import v from"./alert-kDXe81fs.js";import{_,a as r,b as o,w as n,r as s,o as a,F as l,g as x,h as y,e as b,t as p,f as w,k,l as B,i as S,d as c}from"./index-BTCbAXEh.js";import"./composable-CshUTKfl.js";const $={"page.component.alert.default":"Default alert","page.component.alert.error":"Error custom alert","page.component.alert.success":"Success custom alert","page.component.alert.warning":"Warning custom alert","page.component.alert.text-2":"Advanced alert","page.component.alert.doc.prop.disabled":"Binds the disabled state","page.component.alert.doc.prop.icon":"Class name of the icon to prepend","page.component.alert.doc.prop.loading":"Binds the loading state","page.component.alert.doc.prop.text":"Text content of the alert","page.component.alert.doc.prop.layout":"The alert layout: [error, success, warning]","page.component.card.doc.slot.default":"Default slot content"},V={},C={en:$,fr:V},i={examples:[{markup:`
|
|
2
2
|
<vui-alert
|
|
3
3
|
icon="fa-solid fa-warning"
|
|
4
4
|
>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{d as h}from"./demonstrable-
|
|
1
|
+
import{d as h}from"./demonstrable-Dv7XIPoL.js";import{t as v}from"./translatable-eIyiPB31.js";import _ from"./button-9ro2C_DO.js";import{_ as y,a as i,b as a,w as p,r as d,o as s,F as l,g as x,h as k,e as w,t as c,f as B,m as C,i as D,d as b}from"./index-BTCbAXEh.js";import"./animable-S5zFcxd4.js";import"./composable-CshUTKfl.js";const S={"page.component.button.default":"Default button","page.component.button.error":"Error submit button","page.component.button.disabled":"Disabled button","page.component.button.success":"Success submit button","page.component.button.warning":"Warning submit button","page.component.button.doc.prop.disabled":"Binds the disabled state","page.component.button.doc.prop.icon":"Class name of the icon to prepend","page.component.button.doc.prop.loading":"Binds the loading state","page.component.button.doc.prop.type":"Type of button: submit or button","page.component.button.doc.slot.default":"Default slot for button content"},V={},$={en:S,fr:V},r={attrs:[],examples:[{markup:`
|
|
2
2
|
<vui-button
|
|
3
3
|
type="button"
|
|
4
4
|
>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as d}from"./animable-S5zFcxd4.js";import{c as r}from"./composable-CshUTKfl.js";import{_ as p,a as i,j as o,d as l,n,f as b,p as m,o as a,e as c,t as f}from"./index-
|
|
1
|
+
import{a as d}from"./animable-S5zFcxd4.js";import{c as r}from"./composable-CshUTKfl.js";import{_ as p,a as i,j as o,d as l,n,f as b,p as m,o as a,e as c,t as f}from"./index-BTCbAXEh.js";import{t as h}from"./translatable-eIyiPB31.js";const g={},v={},y={en:g,fr:v},$={icon:{type:String},route:{type:Object},text:{type:String},type:{type:String,default:"button"}},k={name:"VuiButton",mixins:[d,r],props:$,computed:{hasLabel(){var t;return((t=this.text)==null?void 0:t.length)>0||this.$slots.default}},created(){h(y)},methods:{onClick(){this.disabled||(this.onAnimate(),this.route&&this.$router.push(this.route))}}},C=["id"],B=["disabled","type"],S=l("div",{class:"vui-button-loader"},null,-1);function V(t,s,w,N,j,e){return a(),i("div",{id:t.componentId,class:n(["vui-button",`vui-button--${t.layout}`,{"vui-button--flat":t.hasAttribute("flat")},{"vui-button--with-label":e.hasLabel},{"vui-button--with-icon":t.icon},{"vui-button--toggled":t.toggled},{"vui-button--animating":!t.disabled&&t.animating},{"vui-button--loading":!t.disabled&&t.loading},{"vui-button--disabled":t.disabled},t.$props.class]),onClick:s[0]||(s[0]=m((...u)=>e.onClick&&e.onClick(...u),["stop"]))},[o(t.$slots,"prepend"),l("button",{class:"vui-button-holder",disabled:t.disabled,type:t.type},[t.icon?(a(),i("i",{key:0,class:n(["vui-button-icon",t.icon])},null,2)):b("",!0),o(t.$slots,"default",{},()=>[c(f(t.text),1)])],8,B),S,o(t.$slots,"append")],10,C)}const E=p(k,[["render",V]]);export{E as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{d as f}from"./demonstrable-
|
|
1
|
+
import{d as f}from"./demonstrable-Dv7XIPoL.js";import{t as b}from"./translatable-eIyiPB31.js";import v from"./card-ETnsHTxY.js";import{_,a as p,b as t,w as a,r,o as s,F as i,g as x,k,l as S,q as $,e as l,t as n,d}from"./index-BTCbAXEh.js";import"./index-7pe20t8n.js";import"./composable-CshUTKfl.js";const u={attrs:[{name:"flat",text:"page.component.card.doc.attr.flat"}],examples:[{markup:`
|
|
2
2
|
<vui-card
|
|
3
3
|
layout="warning"
|
|
4
4
|
>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{l as t}from"./index-7pe20t8n.js";import{c as d}from"./composable-CshUTKfl.js";import{t as l}from"./translatable-
|
|
1
|
+
import{l as t}from"./index-7pe20t8n.js";import{c as d}from"./composable-CshUTKfl.js";import{t as l}from"./translatable-eIyiPB31.js";import{_ as i,a as e,j as o,f as r,n,o as a}from"./index-BTCbAXEh.js";const p={name:"VuiCard",mixins:[d],created(){l(t)}},u=["id"],c={key:0,class:"vui-card-header"},f={key:1,class:"vui-card-body"},m={key:2,class:"vui-card-footer"};function $(s,v,h,y,b,k){return a(),e("div",{id:s.componentId,class:n(["vui-card",`vui-card--${s.layout}`,{"vui-card--flat":s.hasAttribute("flat")},s.$props.class])},[o(s.$slots,"prepend"),s.$slots.header?(a(),e("div",c,[o(s.$slots,"header")])):r("",!0),s.$slots.body||s.$slots.default?(a(),e("div",f,[o(s.$slots,"body"),o(s.$slots,"default")])):r("",!0),s.$slots.footer?(a(),e("div",m,[o(s.$slots,"footer")])):r("",!0),o(s.$slots,"append")],10,u)}const g=i(p,[["render",$]]);export{g as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}@keyframes rotating{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loading{0%{left:0;opacity:1}50%{left:70%;opacity:0}to{left:0;opacity:1}}.vui-checkbox{position:relative;display:inline-flex;cursor:pointer}.vui-checkbox.vui-checkbox--default input::placeholder{color:#bdc3c7}.vui-checkbox.vui-checkbox--default .vui-checkbox-icon:before{color:#000}.vui-checkbox.vui-checkbox--error{border-color:#960e13}.vui-checkbox.vui-checkbox--error input::placeholder{color:#ea2027}.vui-checkbox.vui-checkbox--error .vui-checkbox-icon:before{color:#960e13}.vui-checkbox.vui-checkbox--error .vui-checkbox-label{color:#ea2027}.vui-checkbox.vui-checkbox--success{border-color:#145b32}.vui-checkbox.vui-checkbox--success input::placeholder{color:#27ae60}.vui-checkbox.vui-checkbox--success .vui-checkbox-icon:before{color:#145b32}.vui-checkbox.vui-checkbox--success .vui-checkbox-label{color:#145b32}.vui-checkbox.vui-checkbox--warning{border-color:#976008}.vui-checkbox.vui-checkbox--warning input::placeholder{color:#f39c12}.vui-checkbox.vui-checkbox--warning .vui-checkbox-icon:before{color:#976008}.vui-checkbox.vui-checkbox--warning .vui-checkbox-label{color:#976008}.vui-checkbox.vui-checkbox--disabled{border-color:#949da4;cursor:not-allowed}.vui-checkbox.vui-checkbox--disabled input::placeholder{color:#000}.vui-checkbox.vui-checkbox--disabled .vui-checkbox-icon:before{color:#949da4}.vui-checkbox input[type=checkbox]{width:0;height:0;opacity:0}.vui-checkbox .vui-checkbox-icon:before{display:inline-flex;vertical-align:middle;font-family:"Font Awesome 5 Regular";font-style:normal;font-weight:400;text-rendering:auto;-webkit-font-smoothing:antialiased;margin-top:-.15rem;font-size:1.25rem}.vui-checkbox label{padding-left:.5rem}.vui-checkbox.vui-checkbox--disabled label{color:#949da4}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as u}from"./composable-CshUTKfl.js";import{t as c}from"./translatable-eIyiPB31.js";import{_ as h,a,j as s,n as i,f as d,d as r,o as l,e as f,t as k}from"./index-BTCbAXEh.js";const g={},b={},m={en:g,fr:b},p={checked:{default:void 0,type:Boolean},checkedValue:{default:void 0,types:[Boolean,String,Number,null]},icon:{type:String,default:"fa-square"},iconChecked:{type:String,default:"fa-square-check"},modelValue:{default:void 0,types:[Boolean,String,Number,null]},name:{default:void 0,type:String},text:{default:void 0,type:String},uncheckedValue:{default:void 0,types:[Boolean,String,Number,null]},value:{default:void 0,types:[Boolean,String,Number,null]}},v={name:"VuiCheckbox",mixins:[u],props:p,emits:["update:model-value"],data(){return{toggled:!1}},computed:{hasLabel(){return this.$slots.default||this.text},isChecked(){return this.hasProp("checked")?this.checked:this.hasProp("checkedValue")?this.toggled===this.checkedValue:this.toggled}},watch:{modelValue(e){this.toggled=e},value(e){this.toggled=e}},created(){c(m),this.hasModelValue?this.toggled=this.modelValue:this.hasValue&&(this.toggled=this.value)},methods:{onToggle(){this.disabled||(this.hasProp("checkedValue")?this.toggled=this.isChecked?this.uncheckedValue:this.checkedValue:this.toggled=!this.isChecked,this.$emit("update:model-value",this.toggled))}}},V=["id"],y=["name","disabled","required"],C=["for"];function S(e,o,B,N,q,t){return l(),a("div",{id:e.componentId,class:i(["vui-checkbox",`vui-checkbox--${e.layout}`,{"vui-checkbox--flat":e.hasAttribute("flat")},{"vui-checkbox--with-label":t.hasLabel},{"vui-checkbox--with-icon":e.icon},{"vui-checkbox--checked":t.isChecked},{"vui-checkbox--disabled":e.disabled},{"vui-checkbox--loading":!e.disabled&&e.loading},e.$props.class]),onClick:o[0]||(o[0]=(...n)=>t.onToggle&&t.onToggle(...n))},[s(e.$slots,"prepend"),e.icon&&!t.isChecked?(l(),a("i",{key:0,class:i(["vui-checkbox-icon",e.icon])},null,2)):d("",!0),e.iconChecked&&t.isChecked?(l(),a("i",{key:1,class:i(["vui-checkbox-icon",e.iconChecked])},null,2)):d("",!0),r("input",{name:e.name,disabled:e.disabled,required:e.hasAttribute("required"),type:"checkbox"},null,8,y),t.hasLabel?(l(),a("label",{key:2,class:"vui-checkbox-label",for:e.name},[s(e.$slots,"default",{},()=>[f(k(e.text),1)])],8,C)):d("",!0),s(e.$slots,"append")],10,V)}const L=h(v,[["render",S]]);export{L as default};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import{d as S}from"./demonstrable-Dv7XIPoL.js";import{t as V}from"./translatable-eIyiPB31.js";import w from"./checkbox-GxzrS_FW.js";import{_ as N,a as c,b as p,w as n,r as l,o as t,F as s,g as C,h,e as u,t as a,f as r,m as g,i as v,d as i}from"./index-BTCbAXEh.js";import"./composable-CshUTKfl.js";const D={"page.component.checkbox.default":"Default checkbox","page.component.checkbox.binded":"Binded checkbox","page.component.checkbox.success":"Success checkbox","page.component.checkbox.error":"Error checkbox","page.component.checkbox.warning":"Warning checkbox","page.component.checkbox.label":"Checked","page.component.checkbox.doc.prop.checked":"Binds the conditions of checked state","page.component.checkbox.doc.prop.checked-value":"Checked value of the checkbox","page.component.checkbox.doc.prop.disabled":"Binds the disabled state of the checkbox","page.component.checkbox.doc.prop.layout":"Defines the layout of component [default, error, success, warning]","page.component.checkbox.doc.prop.loading":"Boolean to enable the loading style for component","page.component.checkbox.doc.prop.text":"Text used as label for the component","page.component.checkbox.doc.prop.unchecked-value":"Unchecked value of the checkbox","page.component.checkbox.doc.prop.value":"Value of the checkbox","page.component.checkbox.doc.prop.v-model":"Binds the model value of checkbox","page.component.checkbox.doc.slot.default":"Default slot for label content","page.component.checkbox.doc.slot.prepend":"Slot used to insert custom content at the beginning of component","page.component.checkbox.doc.slot.append":"Slot used to insert custom content et the end of component"},$={},E={en:D,fr:$},m={examples:[{markup:`
|
|
2
|
+
<vui-checkbox
|
|
3
|
+
v-model="mycheckboxmodel"
|
|
4
|
+
:layout="default"
|
|
5
|
+
:text="Default checkbox"
|
|
6
|
+
/>
|
|
7
|
+
`,props:{id:"vui-checkbox-1",layout:"default",text:"page.component.checkbox.default"}},{markup:`
|
|
8
|
+
<vui-checkbox
|
|
9
|
+
:checked="mycheckboxmodel"
|
|
10
|
+
:text="Binded checkbox"
|
|
11
|
+
disabled
|
|
12
|
+
/>
|
|
13
|
+
`,props:{id:"vui-checkbox-2",text:"page.component.checkbox.binded"}},{markup:`
|
|
14
|
+
<vui-checkbox
|
|
15
|
+
:layout="success"
|
|
16
|
+
:text="Success checkbox"
|
|
17
|
+
/>
|
|
18
|
+
`,props:{id:"vui-checkbox-3",layout:"success",text:"page.component.checkbox.success"}},{markup:`
|
|
19
|
+
<vui-checkbox
|
|
20
|
+
:layout="warning"
|
|
21
|
+
:text="Warning checkbox"
|
|
22
|
+
/>
|
|
23
|
+
`,props:{id:"vui-checkbox-4",layout:"warning",text:"page.component.checkbox.warning"}},{markup:`
|
|
24
|
+
<vui-checkbox
|
|
25
|
+
:layout="error"
|
|
26
|
+
:text="Error checkbox"
|
|
27
|
+
/>
|
|
28
|
+
`,props:{id:"vui-checkbox-4",layout:"error",text:"page.component.checkbox.error"}}],props:[{tag:"checked-value",type:"[Boolean, String, Number, null]",text:"page.component.checkbox.doc.prop.checked-value"},{tag:"disabled",type:"Boolean",text:"page.component.checkbox.doc.prop.disabled"},{tag:"checked",type:"[Boolean, String, Number, null]",text:"page.component.checkbox.doc.prop.checked"},{tag:"unchecked-value",type:"[Boolean, String, Number, null]",text:"page.component.checkbox.doc.prop.unchecked-value"},{tag:"value",type:"[Boolean, String, Number, null]",text:"page.component.checkbox.doc.prop.value"},{tag:"v-model",type:"[Boolean, String, Number, null]",text:"page.component.checkbox.doc.prop.v-model"}],slots:[{name:"prepend",text:"page.component.checkbox.doc.slot.prepend"},{name:"default",text:"page.component.checkbox.doc.slot.default"},{name:"append",text:"page.component.checkbox.doc.slot.append"}]},H={name:"ViewCheckbox",mixins:[S],setup(){return V(E),{}},data(){return{states:{}}},computed:{doc(){return m},examples(){return this.docExamples(w,{attrs:m.attrs,examples:m.examples.map(e=>({...e,props:{...e.props,text:e.props.text?this.$t(e.props.text):null}}))})}},mounted(){this.states=this.examples.reduce((e,k)=>({...e,[k.props.id]:!1}),{})},methods:{}},T={class:"view-checkbox"},L=["innerHTML"],P={class:"title"},U={class:"title"};function F(e,k,M,W,d,f){const y=l("vui-tag"),b=l("vui-grid-unit"),x=l("vui-table"),_=l("vui-grid");return t(),c("div",T,[p(_,{"col-sm":"1","col-md":"2"},{default:n(()=>[p(b,{class:"examples"},{default:n(()=>[(t(!0),c(s,null,C(f.examples,o=>(t(),c(s,{key:`checkbox-${o.props.id}`},[o.props.id==="vui-checkbox-2"?(t(),h(v(o.component),g({key:0,disabled:""},o.props,{checked:d.states["vui-checkbox-1"]}),{default:n(()=>[o.text?(t(),c(s,{key:0},[u(a(e.$t(o.text)),1)],64)):r("",!0)]),_:2},1040,["checked"])):r("",!0),o.props.id!=="vui-checkbox-2"?(t(),c(s,{key:1},[(t(),h(v(o.component),g(o.props,{modelValue:d.states[o.props.id],"onUpdate:modelValue":B=>d.states[o.props.id]=B}),{default:n(()=>[o.text?(t(),c(s,{key:0},[u(a(e.$t(o.text)),1)],64)):r("",!0)]),_:2},1040,["modelValue","onUpdate:modelValue"])),u(" "),o.props.id==="vui-checkbox-1"?(t(),h(y,{key:0},{default:n(()=>[u(a(e.$t("page.component.checkbox.label"))+": "+a(d.states[o.props.id]),1)]),_:2},1024)):r("",!0)],64)):r("",!0),i("div",{class:"highlighted-code",innerHTML:o.highlighted},null,8,L)],64))),128))]),_:1}),p(b,{class:"api-options"},{default:n(()=>[i("h2",P,a(e.$t("page.component.h2.api")),1),p(x,{"item-label":"label","item-value":"value",headers:e.docPropsHeaders,items:e.docProps},null,8,["headers","items"]),i("h2",U,a(e.$t("page.component.h2.slots")),1),p(x,{"item-label":"label","item-value":"value",headers:e.docSlotsHeaders,items:e.docSlots},null,8,["headers","items"])]),_:1})]),_:1})])}const I=N(H,[["render",F]]);export{I as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as u}from"./translatable-
|
|
1
|
+
import{t as u}from"./translatable-eIyiPB31.js";import{_,c as a,a as s,b as p,d as c,e as g,t as m,f as v,r,o as l}from"./index-BTCbAXEh.js";const h={"page.component.nav.start":"Get started","page.component.h1":"component","page.component.h2.api":"API options","page.component.h2.attrs":"Attributes","page.component.h2.slots":"Slots","page.component.doc.attr.name":"Name","page.component.doc.attr.text":"Description","page.component.doc.prop.tag":"Prop","page.component.doc.prop.type":"Values","page.component.doc.prop.text":"Description","page.component.doc.slot.name":"Name","page.component.doc.slot.text":"Description"},f={},b={en:h,fr:f},V={name:"ViewComponent",computed:{component(){const{$route:e}=this;return a.find(({doc:o})=>o.name===e.name)},components(){return a}},created(){u(b)},methods:{onRoute(e){const o=e==="ViewStart"?{doc:{name:e}}:a.find(({name:n})=>n===n);this.$router.push(o.doc)}}},w={class:"view-component"},N={class:"h1"},x=c("i",{class:"fa-brands fa-vuejs"},null,-1),D={key:0,class:"view-component-name"};function S(e,o,n,k,y,t){const d=r("vui-nav"),i=r("router-view");return l(),s("div",w,[p(d,{flat:"","item-label":"label","item-value":"name",items:[{label:e.$t("page.component.nav.start"),name:"ViewStart"},{label:t.component.label,name:t.component.name}],value:t.component,"onUpdate:modelValue":t.onRoute},null,8,["items","value","onUpdate:modelValue"]),c("div",N,[c("h1",null,[x,g(" "+m(e.$t("page.component.h1"))+" ",1),t.component?(l(),s("span",D,m(t.component.label),1)):v("",!0)])]),p(i)])}const A=_(V,[["render",S]]);export{A as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}@keyframes rotating{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loading{0%{left:0;opacity:1}50%{left:70%;opacity:0}to{left:0;opacity:1}}.vui-page.layout-default{max-width:1299px;min-height:calc(100vh - 2rem);margin:0 auto}.vui-page.layout-default>.vui-page-header{padding:0}.vui-page.layout-default>.vui-page-header .vui-header{display:flex;justify-content:space-between;background-color:#60db94}.vui-page.layout-default>.vui-page-header .vui-header .home{position:relative;padding-left:1.5rem;line-height:2.1rem;color:#145b32;cursor:pointer}.vui-page.layout-default>.vui-page-header .vui-header .home:before{display:inline-flex;vertical-align:middle;font-family:"Font Awesome 5 Solid";font-style:normal;font-weight:900;text-rendering:auto;-webkit-font-smoothing:antialiased;position:absolute;top:0;left:0;content:""}.vui-page.layout-default>.vui-page-footer .vui-footer .copyright{font-size:.9rem}.vui-page.layout-default>.vui-page-footer .vui-footer .copyright a{font-size:inherit;border-bottom:1px solid rgb(0,151,230)}
|
|
1
|
+
.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}@keyframes rotating{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loading{0%{left:0;opacity:1}50%{left:70%;opacity:0}to{left:0;opacity:1}}.vui-page.layout-default{max-width:1299px;min-height:calc(100vh - 2rem);margin:0 auto}.vui-page.layout-default>.vui-page-header{padding:0}.vui-page.layout-default>.vui-page-header .vui-header{display:flex;justify-content:space-between;background-color:#60db94}.vui-page.layout-default>.vui-page-header .vui-header .home{position:relative;padding-left:1.5rem;line-height:2.1rem;color:#145b32;cursor:pointer}.vui-page.layout-default>.vui-page-header .vui-header .home:before{display:inline-flex;vertical-align:middle;font-family:"Font Awesome 5 Solid";font-style:normal;font-weight:900;text-rendering:auto;-webkit-font-smoothing:antialiased;position:absolute;top:0;left:0;content:""}.vui-page.layout-default>.vui-page-footer{padding:0;border:none}.vui-page.layout-default>.vui-page-footer .vui-footer{border:none;background-color:#60db94}.vui-page.layout-default>.vui-page-footer .vui-footer .copyright{font-size:.9rem}.vui-page.layout-default>.vui-page-footer .vui-footer .copyright a{font-size:inherit;border-bottom:1px solid rgb(0,151,230)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_ as b,c as s,r as n,o as y,h as V,w as a,b as l,e as c,t as p,d as u}from"./index-
|
|
1
|
+
import{_ as b,c as s,r as n,o as y,h as V,w as a,b as l,e as c,t as p,d as u}from"./index-BTCbAXEh.js";const $={name:"LayoutDefault",data(){return{component:null}},computed:{components(){const t=s.reduce((e,o)=>(e[o.type].push(o),e),{html:[],layout:[],ui:[]});return Object.keys(t).map(e=>({label:this.$t(`component.header.dropdown.components.${e}`),value:t[e].map(o=>({...o,label:o.name,value:o.name,route:{name:o.doc.name}}))}))}},watch:{$route({name:t}){this.component=null;const e=s.find(({doc:o})=>o.name===t);e&&(this.component={label:e.name,value:e.name})}}},g={class:"copyright"},x=u("a",{href:"https://www.e-xode.net"}," www.e-xode.net ",-1);function k(t,e,o,B,r,m){const d=n("router-link"),_=n("vui-dropdown"),i=n("vui-header"),h=n("router-view"),f=n("vui-footer"),v=n("vui-page");return y(),V(v,{class:"layout-default"},{header:a(()=>[l(i,null,{default:a(()=>[l(d,{class:"home",to:{name:"ViewIndex"}},{default:a(()=>[c(p(t.$t("component.header.home")),1)]),_:1}),l(_,{modelValue:r.component,"onUpdate:modelValue":e[0]||(e[0]=w=>r.component=w),items:m.components,"item-label":"label","item-value":"value",placeholder:t.$t("component.header.dropdown.components")},null,8,["modelValue","items","placeholder"])]),_:1})]),body:a(()=>[l(h)]),footer:a(()=>[l(f,null,{default:a(()=>[u("span",g,[c(p(t.$t("component.footer.copyright"))+" ",1),x])]),_:1})]),_:1})}const C=b($,[["render",k]]);export{C as default};
|