@phila/phila-ui-checkbox 0.1.1-beta.0 → 0.1.1-beta.2
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 +3 -1
- package/dist/Checkbox.vue.d.ts.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.mjs +73 -65
- package/package.json +2 -2
package/dist/Checkbox.vue.d.ts
CHANGED
|
@@ -9,6 +9,8 @@ declare const _default: import('vue').DefineComponent<CheckboxProps, {}, {}, {},
|
|
|
9
9
|
onChange?: ((event: Event) => any) | undefined;
|
|
10
10
|
onFocus?: ((event: FocusEvent) => any) | undefined;
|
|
11
11
|
onBlur?: ((event: FocusEvent) => any) | undefined;
|
|
12
|
-
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
12
|
+
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
13
|
+
inputRef: HTMLInputElement;
|
|
14
|
+
}, HTMLLabelElement>;
|
|
13
15
|
export default _default;
|
|
14
16
|
//# sourceMappingURL=Checkbox.vue.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.vue.d.ts","sourceRoot":"","sources":["../src/Checkbox.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Checkbox.vue.d.ts","sourceRoot":"","sources":["../src/Checkbox.vue"],"names":[],"mappings":"AAiKA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;AAsJ7C,wBAUG"}
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.checkbox-svg .checkbox-bg{fill:var(--Schemes-Surface-Bright, #fafafa);stroke:var(--Schemes-Border, #cfcfcf);stroke-width:1}.checkbox-svg .checkbox-check{stroke:none;fill:none}.checkbox-svg--checked .checkbox-bg{fill:var(--Schemes-Primary, #0f33f5);stroke:var(--Schemes-Primary, #0f33f5)}.checkbox-svg--checked .checkbox-check{stroke:var(--Schemes-On-Primary, #ffffff);stroke-width:2}.philaCheckbox[data-v-
|
|
1
|
+
.checkbox-svg .checkbox-bg{fill:var(--Schemes-Surface-Bright, #fafafa);stroke:var(--Schemes-Border, #cfcfcf);stroke-width:1}.checkbox-svg .checkbox-check{stroke:none;fill:none}.checkbox-svg--checked .checkbox-bg{fill:var(--Schemes-Primary, #0f33f5);stroke:var(--Schemes-Primary, #0f33f5)}.checkbox-svg--checked .checkbox-check{stroke:var(--Schemes-On-Primary, #ffffff);stroke-width:2}.philaCheckbox[data-v-354b2e5e]{position:relative;display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.philaCheckbox__visual[data-v-354b2e5e]{display:flex;align-items:center;gap:var(--spacing-s, .75rem)}.philaCheckbox--icon-only .philaCheckbox__visual[data-v-354b2e5e]{gap:0}.philaCheckbox input[data-v-354b2e5e]{position:absolute;opacity:0;cursor:pointer;height:0;width:0}[data-v-354b2e5e] .checkbox-svg{flex-shrink:0;overflow:visible}.philaCheckbox[data-v-354b2e5e]:focus-within{outline:2px solid var(--Schemes-Primary, #0f33f5);outline-offset:2px}.philaCheckbox-enabled[data-v-354b2e5e]:hover .checkbox-svg .checkbox-bg{stroke:var(--Schemes-Primary, #0f33f5);stroke-width:2}.philaCheckbox-error[data-v-354b2e5e] .checkbox-svg .checkbox-bg{stroke:var(--Schemes-Error, #cc0406);stroke-width:2}.philaCheckbox-disabled[data-v-354b2e5e]{cursor:not-allowed;color:var(--Schemes-Surface-Variant, #a2a2a2)}.philaCheckbox-disabled[data-v-354b2e5e] .checkbox-svg .checkbox-bg{stroke:var(--Schemes-Surface-Dim, #cfcfcf);stroke-width:1;fill:var(--Schemes-Surface-Bright, #fafafa)}.philaCheckbox-disabled[data-v-354b2e5e] .checkbox-svg--checked .checkbox-bg{fill:var(--Schemes-Surface-Dim, #cfcfcf);stroke:var(--Schemes-Surface-Dim, #cfcfcf)}.philaCheckbox-disabled[data-v-354b2e5e] .checkbox-svg--checked .checkbox-check{stroke:var(--Schemes-Surface-Bright, #fafafa);stroke-width:2}.group-container[data-v-1408bdad]{display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing-xs, .5rem)}.labels-container[data-v-1408bdad]{display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing-2xs, .25rem);align-self:stretch}span[data-v-1408bdad]{display:block}.checkbox-container[data-v-1408bdad]{display:flex;padding:var(--spacing-m, 1rem);flex-direction:column;align-items:flex-start;gap:var(--Radio-margin-bottom, 1rem);align-self:stretch}.checkbox-container-error[data-v-1408bdad]{border-radius:var(--border-radius-m, .75rem)}.error-message[data-v-1408bdad]{display:flex;align-items:center;gap:var(--spacing-s, .75rem);align-self:stretch;font-weight:600}
|
package/dist/index.d.ts
CHANGED
|
@@ -6,9 +6,10 @@ export interface CheckboxProps extends BaseProps {
|
|
|
6
6
|
name?: string;
|
|
7
7
|
value?: string | number | boolean;
|
|
8
8
|
modelValue?: boolean | Array<string | number | boolean>;
|
|
9
|
-
text
|
|
9
|
+
text?: string;
|
|
10
10
|
disabled?: boolean;
|
|
11
11
|
error?: boolean;
|
|
12
|
+
indeterminate?: boolean;
|
|
12
13
|
}
|
|
13
14
|
export interface CheckboxGroupProps extends BaseProps {
|
|
14
15
|
groupLabel: string;
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAE7D,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IACxD,IAAI,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAE7D,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IACxD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IAC9C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,cAAc,GAAG;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;CAClC,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),s=require("@phila/phila-ui-core"),h=e.defineComponent({__name:"CheckboxIcon",props:{checked:{type:Boolean}},setup(a){return(c,o)=>(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["checkbox-svg",{"checkbox-svg--checked":a.checked}]),width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},[...o[0]||(o[0]=[e.createElementVNode("rect",{class:"checkbox-bg",x:"1",y:"1",width:"18",height:"18",rx:"3",ry:"3"},null,-1),e.createElementVNode("path",{class:"checkbox-check",d:"M 4.5 10 L 8.5 14 L 15.5 6","stroke-linecap":"round","stroke-linejoin":"round"},null,-1)])],2))}}),f={class:"philaCheckbox__visual"},v={key:0},g=["name","value","checked","disabled"],C=e.defineComponent({__name:"Checkbox",props:{name:{},value:{type:[String,Number,Boolean]},modelValue:{type:[Boolean,Array]},text:{},disabled:{type:Boolean},error:{type:Boolean},indeterminate:{type:Boolean},className:{}},emits:["update:modelValue","change","focus","blur"],setup(a,{emit:c}){const o=a,n=c,l=e.ref(null);e.watchEffect(()=>{l.value&&(l.value.indeterminate=o.indeterminate??!1)});const d=e.computed(()=>Array.isArray(o.modelValue)?o.modelValue.includes(o.value):!!o.modelValue);function m(u){if(Array.isArray(o.modelValue)){const t=[...o.modelValue],r=o.value,i=t.indexOf(r);i===-1?t.push(r):t.splice(i,1),n("update:modelValue",t)}else n("update:modelValue",!o.modelValue);n("change",u)}const p=e.computed(()=>s.cn("philaCheckbox","has-text-body-default",o.className,!o.disabled&&"philaCheckbox-enabled",o.disabled&&"philaCheckbox-disabled",o.error&&"philaCheckbox-error",!o.text&&"philaCheckbox--icon-only"));return(u,t)=>(e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(p.value)},[e.createElementVNode("span",f,[e.createVNode(h,{checked:d.value},null,8,["checked"]),o.text?(e.openBlock(),e.createElementBlock("span",v,e.toDisplayString(o.text),1)):e.createCommentVNode("",!0)]),e.createElementVNode("input",{ref_key:"inputRef",ref:l,type:"checkbox",name:o.name,value:o.value,checked:d.value,disabled:o.disabled,onChange:m,onFocus:t[0]||(t[0]=r=>n("focus",r)),onBlur:t[1]||(t[1]=r=>n("blur",r))},null,40,g)],2))}}),k=(a,c)=>{const o=a.__vccOpts||a;for(const[n,l]of c)o[n]=l;return o},b=k(C,[["__scopeId","data-v-354b2e5e"]]);var y={prefix:"fas",iconName:"circle-exclamation",icon:[512,512,["exclamation-circle"],"f06a","M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-192a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-192c-18.2 0-32.7 15.5-31.4 33.7l7.4 104c.9 12.6 11.4 22.3 23.9 22.3 12.6 0 23-9.7 23.9-22.3l7.4-104c1.3-18.2-13.1-33.7-31.4-33.7z"]};const _={class:"labels-container"},V={class:"has-text-body-default"},B={key:0,class:"error-message has-text-error content"},N=e.defineComponent({__name:"CheckboxGroup",props:{groupLabel:{},description:{},choices:{},modelValue:{},error:{type:Boolean},errorMessage:{},disabled:{type:Boolean},className:{}},emits:["update:modelValue"],setup(a,{emit:c}){const o=a,n=c,l=s.generateRandomId(),d=e.computed(()=>s.cn("group-container",o.className)),m=e.computed(()=>s.cn("checkbox-container",o.error&&"checkbox-container-error has-background-error")),p=e.computed(()=>s.cn("has-text-label-default",o.error&&"has-text-error"));function u(t){n("update:modelValue",t)}return(t,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(d.value)},[e.createElementVNode("div",_,[e.createElementVNode("span",{class:e.normalizeClass(p.value)},e.toDisplayString(a.groupLabel),3),e.createElementVNode("span",V,e.toDisplayString(a.description),1)]),e.createElementVNode("div",{class:e.normalizeClass(m.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.choices,(i,x)=>(e.openBlock(),e.createBlock(b,{key:e.unref(l)+x,name:e.unref(l),value:i.value,text:i.text,"model-value":o.modelValue,disabled:o.disabled,error:o.error,"onUpdate:modelValue":u},null,8,["name","value","text","model-value","disabled","error"]))),128)),o.error?(e.openBlock(),e.createElementBlock("div",B,[e.createVNode(e.unref(s.Icon),{style:{height:"fit-content",width:"fit-content",padding:"0"},size:"large",inline:"","aria-hidden":"true","icon-definition":e.unref(y)},null,8,["icon-definition"]),e.createTextVNode(" "+e.toDisplayString(a.errorMessage),1)])):e.createCommentVNode("",!0)],2)],2))}}),E=k(N,[["__scopeId","data-v-1408bdad"]]);exports.Checkbox=b;exports.CheckboxGroup=E;exports.CheckboxIcon=h;
|
package/dist/index.mjs
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import {
|
|
3
|
-
import './index.css';const
|
|
1
|
+
import { defineComponent as _, createElementBlock as i, openBlock as c, normalizeClass as u, createElementVNode as l, ref as B, watchEffect as N, computed as h, createVNode as g, createCommentVNode as y, toDisplayString as b, Fragment as w, renderList as I, createBlock as z, unref as x, createTextVNode as A } from "vue";
|
|
2
|
+
import { cn as k, generateRandomId as L, Icon as $ } from "@phila/phila-ui-core";
|
|
3
|
+
import './index.css';const E = /* @__PURE__ */ _({
|
|
4
4
|
__name: "CheckboxIcon",
|
|
5
5
|
props: {
|
|
6
6
|
checked: { type: Boolean }
|
|
7
7
|
},
|
|
8
|
-
setup(
|
|
9
|
-
return (
|
|
10
|
-
class:
|
|
8
|
+
setup(t) {
|
|
9
|
+
return (s, e) => (c(), i("svg", {
|
|
10
|
+
class: u(["checkbox-svg", { "checkbox-svg--checked": t.checked }]),
|
|
11
11
|
width: "20",
|
|
12
12
|
height: "20",
|
|
13
13
|
viewBox: "0 0 20 20",
|
|
@@ -15,7 +15,7 @@ import './index.css';const L = /* @__PURE__ */ g({
|
|
|
15
15
|
xmlns: "http://www.w3.org/2000/svg",
|
|
16
16
|
"aria-hidden": "true"
|
|
17
17
|
}, [...e[0] || (e[0] = [
|
|
18
|
-
|
|
18
|
+
l("rect", {
|
|
19
19
|
class: "checkbox-bg",
|
|
20
20
|
x: "1",
|
|
21
21
|
y: "1",
|
|
@@ -24,7 +24,7 @@ import './index.css';const L = /* @__PURE__ */ g({
|
|
|
24
24
|
rx: "3",
|
|
25
25
|
ry: "3"
|
|
26
26
|
}, null, -1),
|
|
27
|
-
|
|
27
|
+
l("path", {
|
|
28
28
|
class: "checkbox-check",
|
|
29
29
|
d: "M 4.5 10 L 8.5 14 L 15.5 6",
|
|
30
30
|
"stroke-linecap": "round",
|
|
@@ -32,7 +32,7 @@ import './index.css';const L = /* @__PURE__ */ g({
|
|
|
32
32
|
}, null, -1)
|
|
33
33
|
])], 2));
|
|
34
34
|
}
|
|
35
|
-
}), M =
|
|
35
|
+
}), M = { class: "philaCheckbox__visual" }, R = { key: 0 }, F = ["name", "value", "checked", "disabled"], G = /* @__PURE__ */ _({
|
|
36
36
|
__name: "Checkbox",
|
|
37
37
|
props: {
|
|
38
38
|
name: {},
|
|
@@ -41,18 +41,23 @@ import './index.css';const L = /* @__PURE__ */ g({
|
|
|
41
41
|
text: {},
|
|
42
42
|
disabled: { type: Boolean },
|
|
43
43
|
error: { type: Boolean },
|
|
44
|
+
indeterminate: { type: Boolean },
|
|
44
45
|
className: {}
|
|
45
46
|
},
|
|
46
47
|
emits: ["update:modelValue", "change", "focus", "blur"],
|
|
47
|
-
setup(
|
|
48
|
-
const e =
|
|
49
|
-
|
|
48
|
+
setup(t, { emit: s }) {
|
|
49
|
+
const e = t, o = s, n = B(null);
|
|
50
|
+
N(() => {
|
|
51
|
+
n.value && (n.value.indeterminate = e.indeterminate ?? !1);
|
|
52
|
+
});
|
|
53
|
+
const m = h(() => Array.isArray(e.modelValue) ? e.modelValue.includes(e.value) : !!e.modelValue);
|
|
54
|
+
function f(p) {
|
|
50
55
|
if (Array.isArray(e.modelValue)) {
|
|
51
|
-
const a = [...e.modelValue],
|
|
52
|
-
|
|
56
|
+
const a = [...e.modelValue], r = e.value, d = a.indexOf(r);
|
|
57
|
+
d === -1 ? a.push(r) : a.splice(d, 1), o("update:modelValue", a);
|
|
53
58
|
} else
|
|
54
|
-
|
|
55
|
-
|
|
59
|
+
o("update:modelValue", !e.modelValue);
|
|
60
|
+
o("change", p);
|
|
56
61
|
}
|
|
57
62
|
const v = h(() => k(
|
|
58
63
|
"philaCheckbox",
|
|
@@ -60,42 +65,45 @@ import './index.css';const L = /* @__PURE__ */ g({
|
|
|
60
65
|
e.className,
|
|
61
66
|
!e.disabled && "philaCheckbox-enabled",
|
|
62
67
|
e.disabled && "philaCheckbox-disabled",
|
|
63
|
-
e.error && "philaCheckbox-error"
|
|
68
|
+
e.error && "philaCheckbox-error",
|
|
69
|
+
!e.text && "philaCheckbox--icon-only"
|
|
64
70
|
));
|
|
65
|
-
return (
|
|
66
|
-
class:
|
|
67
|
-
for: d(r)
|
|
71
|
+
return (p, a) => (c(), i("label", {
|
|
72
|
+
class: u(v.value)
|
|
68
73
|
}, [
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
74
|
+
l("span", M, [
|
|
75
|
+
g(E, { checked: m.value }, null, 8, ["checked"]),
|
|
76
|
+
e.text ? (c(), i("span", R, b(e.text), 1)) : y("", !0)
|
|
77
|
+
]),
|
|
78
|
+
l("input", {
|
|
79
|
+
ref_key: "inputRef",
|
|
80
|
+
ref: n,
|
|
73
81
|
type: "checkbox",
|
|
74
82
|
name: e.name,
|
|
75
83
|
value: e.value,
|
|
76
|
-
checked:
|
|
84
|
+
checked: m.value,
|
|
77
85
|
disabled: e.disabled,
|
|
78
86
|
onChange: f,
|
|
79
|
-
onFocus: a[0] || (a[0] = (
|
|
80
|
-
onBlur: a[1] || (a[1] = (
|
|
81
|
-
}, null, 40,
|
|
82
|
-
],
|
|
87
|
+
onFocus: a[0] || (a[0] = (r) => o("focus", r)),
|
|
88
|
+
onBlur: a[1] || (a[1] = (r) => o("blur", r))
|
|
89
|
+
}, null, 40, F)
|
|
90
|
+
], 2));
|
|
83
91
|
}
|
|
84
|
-
}),
|
|
85
|
-
const e =
|
|
86
|
-
for (const [
|
|
87
|
-
e[
|
|
92
|
+
}), C = (t, s) => {
|
|
93
|
+
const e = t.__vccOpts || t;
|
|
94
|
+
for (const [o, n] of s)
|
|
95
|
+
e[o] = n;
|
|
88
96
|
return e;
|
|
89
|
-
},
|
|
90
|
-
var
|
|
97
|
+
}, O = /* @__PURE__ */ C(G, [["__scopeId", "data-v-354b2e5e"]]);
|
|
98
|
+
var S = {
|
|
91
99
|
prefix: "fas",
|
|
92
100
|
iconName: "circle-exclamation",
|
|
93
101
|
icon: [512, 512, ["exclamation-circle"], "f06a", "M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-192a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-192c-18.2 0-32.7 15.5-31.4 33.7l7.4 104c.9 12.6 11.4 22.3 23.9 22.3 12.6 0 23-9.7 23.9-22.3l7.4-104c1.3-18.2-13.1-33.7-31.4-33.7z"]
|
|
94
102
|
};
|
|
95
|
-
const
|
|
103
|
+
const U = { class: "labels-container" }, j = { class: "has-text-body-default" }, D = {
|
|
96
104
|
key: 0,
|
|
97
105
|
class: "error-message has-text-error content"
|
|
98
|
-
},
|
|
106
|
+
}, T = /* @__PURE__ */ _({
|
|
99
107
|
__name: "CheckboxGroup",
|
|
100
108
|
props: {
|
|
101
109
|
groupLabel: {},
|
|
@@ -108,49 +116,49 @@ const O = { class: "labels-container" }, S = { class: "has-text-body-default" },
|
|
|
108
116
|
className: {}
|
|
109
117
|
},
|
|
110
118
|
emits: ["update:modelValue"],
|
|
111
|
-
setup(
|
|
112
|
-
const e =
|
|
113
|
-
function
|
|
114
|
-
|
|
119
|
+
setup(t, { emit: s }) {
|
|
120
|
+
const e = t, o = s, n = L(), m = h(() => k("group-container", e.className)), f = h(() => k("checkbox-container", e.error && "checkbox-container-error has-background-error")), v = h(() => k("has-text-label-default", e.error && "has-text-error"));
|
|
121
|
+
function p(a) {
|
|
122
|
+
o("update:modelValue", a);
|
|
115
123
|
}
|
|
116
|
-
return (a,
|
|
117
|
-
class: m
|
|
124
|
+
return (a, r) => (c(), i("div", {
|
|
125
|
+
class: u(m.value)
|
|
118
126
|
}, [
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
class:
|
|
122
|
-
},
|
|
123
|
-
|
|
127
|
+
l("div", U, [
|
|
128
|
+
l("span", {
|
|
129
|
+
class: u(v.value)
|
|
130
|
+
}, b(t.groupLabel), 3),
|
|
131
|
+
l("span", j, b(t.description), 1)
|
|
124
132
|
]),
|
|
125
|
-
|
|
126
|
-
class:
|
|
133
|
+
l("div", {
|
|
134
|
+
class: u(f.value)
|
|
127
135
|
}, [
|
|
128
|
-
(
|
|
129
|
-
key:
|
|
130
|
-
name:
|
|
131
|
-
value:
|
|
132
|
-
text:
|
|
136
|
+
(c(!0), i(w, null, I(e.choices, (d, V) => (c(), z(O, {
|
|
137
|
+
key: x(n) + V,
|
|
138
|
+
name: x(n),
|
|
139
|
+
value: d.value,
|
|
140
|
+
text: d.text,
|
|
133
141
|
"model-value": e.modelValue,
|
|
134
142
|
disabled: e.disabled,
|
|
135
143
|
error: e.error,
|
|
136
|
-
"onUpdate:modelValue":
|
|
144
|
+
"onUpdate:modelValue": p
|
|
137
145
|
}, null, 8, ["name", "value", "text", "model-value", "disabled", "error"]))), 128)),
|
|
138
|
-
e.error ? (
|
|
139
|
-
|
|
146
|
+
e.error ? (c(), i("div", D, [
|
|
147
|
+
g(x($), {
|
|
140
148
|
style: { height: "fit-content", width: "fit-content", padding: "0" },
|
|
141
149
|
size: "large",
|
|
142
150
|
inline: "",
|
|
143
151
|
"aria-hidden": "true",
|
|
144
|
-
"icon-definition":
|
|
152
|
+
"icon-definition": x(S)
|
|
145
153
|
}, null, 8, ["icon-definition"]),
|
|
146
|
-
|
|
147
|
-
])) :
|
|
154
|
+
A(" " + b(t.errorMessage), 1)
|
|
155
|
+
])) : y("", !0)
|
|
148
156
|
], 2)
|
|
149
157
|
], 2));
|
|
150
158
|
}
|
|
151
|
-
}),
|
|
159
|
+
}), J = /* @__PURE__ */ C(T, [["__scopeId", "data-v-1408bdad"]]);
|
|
152
160
|
export {
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
161
|
+
O as Checkbox,
|
|
162
|
+
J as CheckboxGroup,
|
|
163
|
+
E as CheckboxIcon
|
|
156
164
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@phila/phila-ui-checkbox",
|
|
3
|
-
"version": "0.1.1-beta.
|
|
3
|
+
"version": "0.1.1-beta.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A checkbox input.",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"vue": "^3.0.0"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@phila/phila-ui-core": "2.3.3-beta.
|
|
31
|
+
"@phila/phila-ui-core": "2.3.3-beta.1"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
34
|
"@types/node": "^24.0.0",
|