@phila/phila-ui-checkbox 0.0.2 → 0.0.3
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/Checkbox.vue.d.ts +1 -1
- package/dist/checkbox.js +38 -38
- package/dist/checkbox.umd.cjs +1 -1
- package/dist/types.d.ts +8 -8
- package/package.json +2 -2
package/dist/Checkbox.vue.d.ts
CHANGED
|
@@ -45,7 +45,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
45
45
|
valueKey: string;
|
|
46
46
|
label: string;
|
|
47
47
|
desc: string;
|
|
48
|
-
modelValue:
|
|
48
|
+
modelValue: (string | number | boolean)[];
|
|
49
49
|
numOfColumns: string | number;
|
|
50
50
|
small: boolean;
|
|
51
51
|
}, {}>, {
|
package/dist/checkbox.js
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import
|
|
3
|
-
const
|
|
1
|
+
import { defineComponent as I, getCurrentInstance as O, ref as B, watch as w, openBlock as o, createElementBlock as l, normalizeClass as D, unref as a, createElementVNode as s, Fragment as u, createTextVNode as N, toDisplayString as n, renderSlot as h, createCommentVNode as v, normalizeStyle as P, renderList as S, withDirectives as z, mergeProps as E, vModelCheckbox as K } from "vue";
|
|
2
|
+
import T from "@phila/phila-ui-core";
|
|
3
|
+
const U = {
|
|
4
4
|
key: 0,
|
|
5
5
|
class: "input-error-msg"
|
|
6
|
-
},
|
|
6
|
+
}, q = /* @__PURE__ */ s("span", { class: "icon" }, [
|
|
7
7
|
/* @__PURE__ */ s("i", { class: "fas fa-exclamation-circle" })
|
|
8
|
-
], -1),
|
|
8
|
+
], -1), A = {
|
|
9
9
|
key: 1,
|
|
10
10
|
class: "is-field-info"
|
|
11
|
-
},
|
|
11
|
+
}, F = {
|
|
12
12
|
key: 0,
|
|
13
13
|
class: "is-field-info"
|
|
14
|
-
},
|
|
14
|
+
}, H = ["id"], L = ["id", "name", "aria-checked", "value"], M = ["for"], { formHelpers: b } = T, { randomID: j } = b, G = {
|
|
15
15
|
inheritAttrs: !1
|
|
16
|
-
},
|
|
17
|
-
...
|
|
16
|
+
}, R = /* @__PURE__ */ I({
|
|
17
|
+
...G,
|
|
18
18
|
__name: "Checkbox",
|
|
19
19
|
props: {
|
|
20
|
-
id: { default:
|
|
20
|
+
id: { default: j() },
|
|
21
21
|
errors: { default() {
|
|
22
22
|
return [];
|
|
23
23
|
} },
|
|
@@ -37,67 +37,67 @@ const F = {
|
|
|
37
37
|
small: { type: Boolean, default: !1 }
|
|
38
38
|
},
|
|
39
39
|
emits: ["update:modelValue", "change"],
|
|
40
|
-
setup(
|
|
41
|
-
const
|
|
42
|
-
|
|
43
|
-
() =>
|
|
40
|
+
setup(k, { emit: $ }) {
|
|
41
|
+
const i = k, c = $, V = O(), { error: m, classes: g, optionText: C, optionValue: p } = b.useInput.useInputComposable(V, i), r = B(i.modelValue);
|
|
42
|
+
w(
|
|
43
|
+
() => i.modelValue,
|
|
44
44
|
(e) => {
|
|
45
|
-
|
|
45
|
+
r.value = e;
|
|
46
46
|
}
|
|
47
47
|
);
|
|
48
48
|
const y = (e) => {
|
|
49
|
-
c("change", e), c("update:modelValue",
|
|
50
|
-
}
|
|
51
|
-
return (e,
|
|
52
|
-
class:
|
|
49
|
+
c("change", e), c("update:modelValue", r.value);
|
|
50
|
+
};
|
|
51
|
+
return (e, f) => (o(), l("div", {
|
|
52
|
+
class: D(["input-wrap input-checkbox", [a(g), i.small && "small-checkradio"]])
|
|
53
53
|
}, [
|
|
54
54
|
s("fieldset", null, [
|
|
55
55
|
s("legend", null, [
|
|
56
56
|
e.label ? (o(), l(u, { key: 0 }, [
|
|
57
|
-
|
|
58
|
-
], 64)) :
|
|
57
|
+
N(n(e.label) + " " + n(e.$attrs.required !== void 0 ? "*" : ""), 1)
|
|
58
|
+
], 64)) : h(e.$slots, "label", { key: 1 })
|
|
59
59
|
]),
|
|
60
|
-
a(m) ? (o(), l("div",
|
|
61
|
-
|
|
62
|
-
s("span", null,
|
|
60
|
+
a(m) ? (o(), l("div", U, [
|
|
61
|
+
q,
|
|
62
|
+
s("span", null, n(a(m)), 1)
|
|
63
63
|
])) : v("", !0),
|
|
64
|
-
e.desc ? (o(), l("div",
|
|
65
|
-
e.$slots.desc ? (o(), l("div",
|
|
66
|
-
|
|
64
|
+
e.desc ? (o(), l("div", A, n(e.desc), 1)) : (o(), l(u, { key: 2 }, [
|
|
65
|
+
e.$slots.desc ? (o(), l("div", F, [
|
|
66
|
+
h(e.$slots, "desc")
|
|
67
67
|
])) : v("", !0)
|
|
68
68
|
], 64)),
|
|
69
69
|
s("div", {
|
|
70
70
|
id: `cb-group-${e.id}`,
|
|
71
|
-
style:
|
|
71
|
+
style: P(`columns: ${e.numOfColumns} auto`)
|
|
72
72
|
}, [
|
|
73
|
-
(o(!0), l(u, null,
|
|
73
|
+
(o(!0), l(u, null, S(e.options, (d, t) => (o(), l("div", {
|
|
74
74
|
key: `k-${t}`,
|
|
75
75
|
class: "control"
|
|
76
76
|
}, [
|
|
77
|
-
|
|
77
|
+
z(s("input", E({
|
|
78
78
|
id: `cb-${t}-${e.id}`,
|
|
79
|
-
"onUpdate:modelValue":
|
|
79
|
+
"onUpdate:modelValue": f[0] || (f[0] = (_) => r.value = _),
|
|
80
80
|
name: `cb-${t}-${e.id}`,
|
|
81
81
|
type: "checkbox",
|
|
82
|
-
"aria-checked": e.modelValue.includes(a(
|
|
82
|
+
"aria-checked": e.modelValue.includes(a(p)(d, t)),
|
|
83
83
|
class: "is-checkradio",
|
|
84
84
|
role: "checkbox",
|
|
85
85
|
ref_for: !0
|
|
86
86
|
}, e.$attrs, {
|
|
87
|
-
value: a(
|
|
87
|
+
value: a(p)(d, t),
|
|
88
88
|
onChange: y
|
|
89
|
-
}), null, 16,
|
|
90
|
-
[
|
|
89
|
+
}), null, 16, L), [
|
|
90
|
+
[K, r.value]
|
|
91
91
|
]),
|
|
92
92
|
s("label", {
|
|
93
93
|
for: `cb-${t}-${e.id}`
|
|
94
|
-
},
|
|
94
|
+
}, n(a(C)(d)), 9, M)
|
|
95
95
|
]))), 128))
|
|
96
|
-
], 12,
|
|
96
|
+
], 12, H)
|
|
97
97
|
])
|
|
98
98
|
], 2));
|
|
99
99
|
}
|
|
100
100
|
});
|
|
101
101
|
export {
|
|
102
|
-
|
|
102
|
+
R as default
|
|
103
103
|
};
|
package/dist/checkbox.umd.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(e,l){typeof exports=="object"&&typeof module<"u"?module.exports=l(require("vue"),require("@phila/phila-ui-core")):typeof define=="function"&&define.amd?define(["vue","@phila/phila-ui-core"],l):(e=typeof globalThis<"u"?globalThis:e||self,e.Checkbox=l(e.Vue,e.PhilaUICore))})(this,function(e,l){"use strict";const
|
|
1
|
+
(function(e,l){typeof exports=="object"&&typeof module<"u"?module.exports=l(require("vue"),require("@phila/phila-ui-core")):typeof define=="function"&&define.amd?define(["vue","@phila/phila-ui-core"],l):(e=typeof globalThis<"u"?globalThis:e||self,e.Checkbox=l(e.Vue,e.PhilaUICore))})(this,function(e,l){"use strict";const p={key:0,class:"input-error-msg"},f=e.createElementVNode("span",{class:"icon"},[e.createElementVNode("i",{class:"fas fa-exclamation-circle"})],-1),u={key:1,class:"is-field-info"},h={key:0,class:"is-field-info"},k=["id"],V=["id","name","aria-checked","value"],B=["for"],{formHelpers:r}=l,{randomID:y}=r,E={inheritAttrs:!1};return e.defineComponent({...E,__name:"Checkbox",props:{id:{default:y()},errors:{default(){return[]}},optgroup:{type:Boolean},options:{default:()=>({"option-1":"Option 1","option-2":"Option 2","option-3":"Option 3"})},textKey:{default:""},valueKey:{default:""},imaskProps:{},label:{default:""},desc:{default:""},modelValue:{default:()=>[]},numOfColumns:{default:1},small:{type:Boolean,default:!1}},emits:["update:modelValue","change"],setup(b,{emit:g}){const n=b,i=g,$=e.getCurrentInstance(),{error:c,classes:C,optionText:N,optionValue:d}=r.useInput.useInputComposable($,n),a=e.ref(n.modelValue);e.watch(()=>n.modelValue,o=>{a.value=o});const _=o=>{i("change",o),i("update:modelValue",a.value)};return(o,m)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["input-wrap input-checkbox",[e.unref(C),n.small&&"small-checkradio"]])},[e.createElementVNode("fieldset",null,[e.createElementVNode("legend",null,[o.label?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(o.label)+" "+e.toDisplayString(o.$attrs.required!==void 0?"*":""),1)],64)):e.renderSlot(o.$slots,"label",{key:1})]),e.unref(c)?(e.openBlock(),e.createElementBlock("div",p,[f,e.createElementVNode("span",null,e.toDisplayString(e.unref(c)),1)])):e.createCommentVNode("",!0),o.desc?(e.openBlock(),e.createElementBlock("div",u,e.toDisplayString(o.desc),1)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[o.$slots.desc?(e.openBlock(),e.createElementBlock("div",h,[e.renderSlot(o.$slots,"desc")])):e.createCommentVNode("",!0)],64)),e.createElementVNode("div",{id:`cb-group-${o.id}`,style:e.normalizeStyle(`columns: ${o.numOfColumns} auto`)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.options,(s,t)=>(e.openBlock(),e.createElementBlock("div",{key:`k-${t}`,class:"control"},[e.withDirectives(e.createElementVNode("input",e.mergeProps({id:`cb-${t}-${o.id}`,"onUpdate:modelValue":m[0]||(m[0]=S=>a.value=S),name:`cb-${t}-${o.id}`,type:"checkbox","aria-checked":o.modelValue.includes(e.unref(d)(s,t)),class:"is-checkradio",role:"checkbox",ref_for:!0},o.$attrs,{value:e.unref(d)(s,t),onChange:_}),null,16,V),[[e.vModelCheckbox,a.value]]),e.createElementVNode("label",{for:`cb-${t}-${o.id}`},e.toDisplayString(e.unref(N)(s)),9,B)]))),128))],12,k)])],2))}})});
|
package/dist/types.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import Checkbox from "Checkbox.vue";
|
|
1
|
+
import Checkbox from "./Checkbox.vue";
|
|
2
2
|
import { InputOptions } from "@phila/phila-ui-core";
|
|
3
3
|
declare module "@vue/runtime-core" {
|
|
4
4
|
interface GlobalComponents {
|
|
@@ -6,12 +6,12 @@ declare module "@vue/runtime-core" {
|
|
|
6
6
|
}
|
|
7
7
|
}
|
|
8
8
|
export interface CheckboxProps {
|
|
9
|
-
label
|
|
10
|
-
desc
|
|
11
|
-
modelValue: Array<
|
|
12
|
-
valueKey
|
|
13
|
-
textKey
|
|
14
|
-
numOfColumns
|
|
15
|
-
small
|
|
9
|
+
label?: string;
|
|
10
|
+
desc?: string;
|
|
11
|
+
modelValue: Array<string | number | boolean>;
|
|
12
|
+
valueKey?: string;
|
|
13
|
+
textKey?: string;
|
|
14
|
+
numOfColumns?: string | number;
|
|
15
|
+
small?: boolean;
|
|
16
16
|
options: InputOptions | InputOptions[];
|
|
17
17
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@phila/phila-ui-checkbox",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.3",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|
|
7
7
|
"dist"
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"registry": "https://registry.npmjs.com/",
|
|
44
44
|
"access": "public"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "41f3602a8182b747db366652993576f74555dd20"
|
|
47
47
|
}
|