@mekari/pixel3-radio 0.0.1-alpha.0 → 0.0.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.
Files changed (17) hide show
  1. package/dist/{chunk-N5I6KEUN.mjs → chunk-K5EBKT3H.mjs} +11 -9
  2. package/dist/{chunk-ISKDJ7UA.mjs → chunk-PXWY2WNA.mjs} +1 -1
  3. package/dist/index.d.mts +1 -0
  4. package/dist/index.d.ts +1 -0
  5. package/dist/index.js +12 -10
  6. package/dist/index.mjs +2 -2
  7. package/dist/metafile-cjs.json +1 -1
  8. package/dist/metafile-esm.json +1 -1
  9. package/dist/modules/radio.props.d.mts +1 -1
  10. package/dist/modules/radio.props.d.ts +1 -1
  11. package/dist/modules/radio.props.js +1 -1
  12. package/dist/modules/radio.props.mjs +1 -1
  13. package/dist/radio.d.mts +6 -5
  14. package/dist/radio.d.ts +6 -5
  15. package/dist/radio.js +11 -9
  16. package/dist/radio.mjs +2 -2
  17. package/package.json +4 -3
package/dist/{chunk-N5I6KEUN.mjs → chunk-K5EBKT3H.mjs} RENAMED
@@ -1,11 +1,12 @@
1
1
  import {
2
2
  __name,
3
3
  radioProps
4
- } from "./chunk-ISKDJ7UA.mjs";
4
+ } from "./chunk-PXWY2WNA.mjs";
5
5
 
6
6
  // src/radio.tsx
7
7
  import { isVNode as _isVNode, createVNode as _createVNode } from "vue";
8
8
  import { defineComponent } from "vue";
9
+ import { useFormControlContext } from "@mekari/pixel3-form-control";
9
10
  import { MpText } from "@mekari/pixel3-text";
10
11
  import { radioSlotRecipe, sharedSlotRecipe } from "@mekari/pixel3-styled-system/recipes";
11
12
  function _isSlot(s) {
@@ -22,6 +23,7 @@ var MpRadio = defineComponent({
22
23
  }) {
23
24
  const classes = radioSlotRecipe();
24
25
  const sharedClasses = sharedSlotRecipe();
26
+ const formControlProp = useFormControlContext();
25
27
  const handleChecked = /* @__PURE__ */ __name(() => {
26
28
  if (props.modelValue) {
27
29
  return props.modelValue === props.value;
@@ -29,7 +31,7 @@ var MpRadio = defineComponent({
29
31
  return props.isChecked;
30
32
  }, "handleChecked");
31
33
  const onChange = /* @__PURE__ */ __name(() => {
32
- if (!props.isDisabled || !props.isReadonly) {
34
+ if (!props.isDisabled || !props.isReadOnly) {
33
35
  emit("change", !props.isChecked, props.value);
34
36
  emit("update:modelValue", props.value);
35
37
  emit("update:isChecked", !props.isChecked);
@@ -47,7 +49,7 @@ var MpRadio = defineComponent({
47
49
  value,
48
50
  isDisabled,
49
51
  isInvalid,
50
- isReadonly
52
+ isReadOnly
51
53
  } = props;
52
54
  return _createVNode("label", {
53
55
  "for": id,
@@ -56,9 +58,9 @@ var MpRadio = defineComponent({
56
58
  "data-pixel-component": "MpRadio",
57
59
  "data-has-description": Boolean(description),
58
60
  "aria-checked": handleChecked(),
59
- "aria-disabled": isDisabled,
60
- "aria-invalid": isInvalid,
61
- "aria-readonly": isReadonly
61
+ "aria-disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled,
62
+ "aria-invalid": (formControlProp == null ? void 0 : formControlProp.value.isInvalid) || isInvalid,
63
+ "aria-readonly": (formControlProp == null ? void 0 : formControlProp.value.isReadOnly) || isReadOnly
62
64
  }, [_createVNode("input", {
63
65
  "id": id,
64
66
  "class": sharedClasses.hidden,
@@ -66,7 +68,7 @@ var MpRadio = defineComponent({
66
68
  "name": name,
67
69
  "value": value,
68
70
  "checked": handleChecked(),
69
- "disabled": isDisabled ? true : void 0,
71
+ "disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? true : void 0,
70
72
  "onChange": onChange,
71
73
  "onClick": onClick
72
74
  }, null), _createVNode("div", {
@@ -80,11 +82,11 @@ var MpRadio = defineComponent({
80
82
  }, [_createVNode(MpText, {
81
83
  "as": "span",
82
84
  "size": "label",
83
- "color": isDisabled ? "gray.400" : "dark"
85
+ "color": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? "gray.400" : "dark"
84
86
  }, _isSlot(children) ? children : {
85
87
  default: () => [children]
86
88
  }), description && _createVNode(MpText, {
87
- "color": isDisabled ? "gray.400" : "gray.600"
89
+ "color": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? "gray.400" : "gray.600"
88
90
  }, _isSlot(description) ? description : {
89
91
  default: () => [description]
90
92
  })])]);
package/dist/{chunk-ISKDJ7UA.mjs → chunk-PXWY2WNA.mjs} RENAMED
@@ -25,7 +25,7 @@ var radioProps = {
25
25
  isInvalid: {
26
26
  type: Boolean
27
27
  },
28
- isReadonly: {
28
+ isReadOnly: {
29
29
  type: Boolean
30
30
  }
31
31
  };
package/dist/index.d.mts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { MpRadio } from './radio.mjs';
2
2
  import 'vue';
3
+ import 'vue/jsx-runtime';
package/dist/index.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { MpRadio } from './radio.js';
2
2
  import 'vue';
3
+ import 'vue/jsx-runtime';
package/dist/index.js CHANGED
@@ -18,7 +18,7 @@ var __copyProps = (to, from, except, desc) => {
18
18
  };
19
19
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
20
 
21
- // src/index.tsx
21
+ // src/index.ts
22
22
  var src_exports = {};
23
23
  __export(src_exports, {
24
24
  MpRadio: () => MpRadio
@@ -28,6 +28,7 @@ module.exports = __toCommonJS(src_exports);
28
28
  // src/radio.tsx
29
29
  var import_vue = require("vue");
30
30
  var import_vue2 = require("vue");
31
+ var import_pixel3_form_control = require("@mekari/pixel3-form-control");
31
32
  var import_pixel3_text = require("@mekari/pixel3-text");
32
33
  var import_recipes = require("@mekari/pixel3-styled-system/recipes");
33
34
 
@@ -55,7 +56,7 @@ var radioProps = {
55
56
  isInvalid: {
56
57
  type: Boolean
57
58
  },
58
- isReadonly: {
59
+ isReadOnly: {
59
60
  type: Boolean
60
61
  }
61
62
  };
@@ -75,6 +76,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
75
76
  }) {
76
77
  const classes = (0, import_recipes.radioSlotRecipe)();
77
78
  const sharedClasses = (0, import_recipes.sharedSlotRecipe)();
79
+ const formControlProp = (0, import_pixel3_form_control.useFormControlContext)();
78
80
  const handleChecked = /* @__PURE__ */ __name(() => {
79
81
  if (props.modelValue) {
80
82
  return props.modelValue === props.value;
@@ -82,7 +84,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
82
84
  return props.isChecked;
83
85
  }, "handleChecked");
84
86
  const onChange = /* @__PURE__ */ __name(() => {
85
- if (!props.isDisabled || !props.isReadonly) {
87
+ if (!props.isDisabled || !props.isReadOnly) {
86
88
  emit("change", !props.isChecked, props.value);
87
89
  emit("update:modelValue", props.value);
88
90
  emit("update:isChecked", !props.isChecked);
@@ -100,7 +102,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
100
102
  value,
101
103
  isDisabled,
102
104
  isInvalid,
103
- isReadonly
105
+ isReadOnly
104
106
  } = props;
105
107
  return (0, import_vue.createVNode)("label", {
106
108
  "for": id,
@@ -109,9 +111,9 @@ var MpRadio = (0, import_vue2.defineComponent)({
109
111
  "data-pixel-component": "MpRadio",
110
112
  "data-has-description": Boolean(description),
111
113
  "aria-checked": handleChecked(),
112
- "aria-disabled": isDisabled,
113
- "aria-invalid": isInvalid,
114
- "aria-readonly": isReadonly
114
+ "aria-disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled,
115
+ "aria-invalid": (formControlProp == null ? void 0 : formControlProp.value.isInvalid) || isInvalid,
116
+ "aria-readonly": (formControlProp == null ? void 0 : formControlProp.value.isReadOnly) || isReadOnly
115
117
  }, [(0, import_vue.createVNode)("input", {
116
118
  "id": id,
117
119
  "class": sharedClasses.hidden,
@@ -119,7 +121,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
119
121
  "name": name,
120
122
  "value": value,
121
123
  "checked": handleChecked(),
122
- "disabled": isDisabled ? true : void 0,
124
+ "disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? true : void 0,
123
125
  "onChange": onChange,
124
126
  "onClick": onClick
125
127
  }, null), (0, import_vue.createVNode)("div", {
@@ -133,11 +135,11 @@ var MpRadio = (0, import_vue2.defineComponent)({
133
135
  }, [(0, import_vue.createVNode)(import_pixel3_text.MpText, {
134
136
  "as": "span",
135
137
  "size": "label",
136
- "color": isDisabled ? "gray.400" : "dark"
138
+ "color": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? "gray.400" : "dark"
137
139
  }, _isSlot(children) ? children : {
138
140
  default: () => [children]
139
141
  }), description && (0, import_vue.createVNode)(import_pixel3_text.MpText, {
140
- "color": isDisabled ? "gray.400" : "gray.600"
142
+ "color": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? "gray.400" : "gray.600"
141
143
  }, _isSlot(description) ? description : {
142
144
  default: () => [description]
143
145
  })])]);
package/dist/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  MpRadio
3
- } from "./chunk-N5I6KEUN.mjs";
4
- import "./chunk-ISKDJ7UA.mjs";
3
+ } from "./chunk-K5EBKT3H.mjs";
4
+ import "./chunk-PXWY2WNA.mjs";
5
5
  export {
6
6
  MpRadio
7
7
  };
package/dist/metafile-cjs.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"src/modules/radio.props.ts":{"bytes":434,"imports":[],"format":"esm"},"src/radio.tsx":{"bytes":2944,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"src/modules/radio.props.ts","kind":"import-statement","original":"./modules/radio.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/index.tsx":{"bytes":119,"imports":[{"path":"src/radio.tsx","kind":"import-statement","original":"./radio"}],"format":"esm"}},"outputs":{"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-text","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.tsx","inputs":{"src/index.tsx":{"bytesInOutput":119},"src/radio.tsx":{"bytesInOutput":3052},"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":4571},"dist/radio.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-text","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/radio.tsx","inputs":{"src/radio.tsx":{"bytesInOutput":3177},"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":4559},"dist/modules/radio.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/radio.props.ts","inputs":{"src/modules/radio.props.ts":{"bytesInOutput":474}},"bytes":1408}}}
1
+ {"inputs":{"src/modules/radio.props.ts":{"bytes":434,"imports":[],"format":"esm"},"src/radio.tsx":{"bytes":3287,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-form-control","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"src/modules/radio.props.ts","kind":"import-statement","original":"./modules/radio.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":119,"imports":[{"path":"src/radio.tsx","kind":"import-statement","original":"./radio"}],"format":"esm"}},"outputs":{"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-form-control","kind":"require-call","external":true},{"path":"@mekari/pixel3-text","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":119},"src/radio.tsx":{"bytesInOutput":3647},"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":5165},"dist/radio.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-form-control","kind":"require-call","external":true},{"path":"@mekari/pixel3-text","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/radio.tsx","inputs":{"src/radio.tsx":{"bytesInOutput":3772},"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":5154},"dist/modules/radio.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/radio.props.ts","inputs":{"src/modules/radio.props.ts":{"bytesInOutput":474}},"bytes":1408}}}
package/dist/metafile-esm.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"src/modules/radio.props.ts":{"bytes":434,"imports":[],"format":"esm"},"src/radio.tsx":{"bytes":2944,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"src/modules/radio.props.ts","kind":"import-statement","original":"./modules/radio.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/index.tsx":{"bytes":119,"imports":[{"path":"src/radio.tsx","kind":"import-statement","original":"./radio"}],"format":"esm"}},"outputs":{"dist/index.mjs":{"imports":[{"path":"dist/chunk-N5I6KEUN.mjs","kind":"import-statement"},{"path":"dist/chunk-ISKDJ7UA.mjs","kind":"import-statement"}],"exports":["MpRadio"],"entryPoint":"src/index.tsx","inputs":{"src/index.tsx":{"bytesInOutput":0}},"bytes":103},"dist/radio.mjs":{"imports":[{"path":"dist/chunk-N5I6KEUN.mjs","kind":"import-statement"},{"path":"dist/chunk-ISKDJ7UA.mjs","kind":"import-statement"}],"exports":["MpRadio"],"entryPoint":"src/radio.tsx","inputs":{},"bytes":103},"dist/chunk-N5I6KEUN.mjs":{"imports":[{"path":"dist/chunk-ISKDJ7UA.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true}],"exports":["MpRadio"],"inputs":{"src/radio.tsx":{"bytesInOutput":2890}},"bytes":2994},"dist/modules/radio.props.mjs":{"imports":[{"path":"dist/chunk-ISKDJ7UA.mjs","kind":"import-statement"}],"exports":["radioProps"],"entryPoint":"src/modules/radio.props.ts","inputs":{},"bytes":79},"dist/chunk-ISKDJ7UA.mjs":{"imports":[],"exports":["__name","radioProps"],"inputs":{"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":521}}}
1
+ {"inputs":{"src/modules/radio.props.ts":{"bytes":434,"imports":[],"format":"esm"},"src/radio.tsx":{"bytes":3287,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-form-control","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"src/modules/radio.props.ts","kind":"import-statement","original":"./modules/radio.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":119,"imports":[{"path":"src/radio.tsx","kind":"import-statement","original":"./radio"}],"format":"esm"}},"outputs":{"dist/index.mjs":{"imports":[{"path":"dist/chunk-K5EBKT3H.mjs","kind":"import-statement"},{"path":"dist/chunk-PXWY2WNA.mjs","kind":"import-statement"}],"exports":["MpRadio"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":0}},"bytes":103},"dist/radio.mjs":{"imports":[{"path":"dist/chunk-K5EBKT3H.mjs","kind":"import-statement"},{"path":"dist/chunk-PXWY2WNA.mjs","kind":"import-statement"}],"exports":["MpRadio"],"entryPoint":"src/radio.tsx","inputs":{},"bytes":103},"dist/chunk-K5EBKT3H.mjs":{"imports":[{"path":"dist/chunk-PXWY2WNA.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-form-control","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true}],"exports":["MpRadio"],"inputs":{"src/radio.tsx":{"bytesInOutput":3449}},"bytes":3553},"dist/modules/radio.props.mjs":{"imports":[{"path":"dist/chunk-PXWY2WNA.mjs","kind":"import-statement"}],"exports":["radioProps"],"entryPoint":"src/modules/radio.props.ts","inputs":{},"bytes":79},"dist/chunk-PXWY2WNA.mjs":{"imports":[],"exports":["__name","radioProps"],"inputs":{"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":521}}}
package/dist/modules/radio.props.d.mts CHANGED
@@ -21,7 +21,7 @@ declare const radioProps: {
21
21
  isInvalid: {
22
22
  type: BooleanConstructor;
23
23
  };
24
- isReadonly: {
24
+ isReadOnly: {
25
25
  type: BooleanConstructor;
26
26
  };
27
27
  };
package/dist/modules/radio.props.d.ts CHANGED
@@ -21,7 +21,7 @@ declare const radioProps: {
21
21
  isInvalid: {
22
22
  type: BooleanConstructor;
23
23
  };
24
- isReadonly: {
24
+ isReadOnly: {
25
25
  type: BooleanConstructor;
26
26
  };
27
27
  };
package/dist/modules/radio.props.js CHANGED
@@ -46,7 +46,7 @@ var radioProps = {
46
46
  isInvalid: {
47
47
  type: Boolean
48
48
  },
49
- isReadonly: {
49
+ isReadOnly: {
50
50
  type: Boolean
51
51
  }
52
52
  };
package/dist/modules/radio.props.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  radioProps
3
- } from "../chunk-ISKDJ7UA.mjs";
3
+ } from "../chunk-PXWY2WNA.mjs";
4
4
  export {
5
5
  radioProps
6
6
  };
package/dist/radio.d.mts CHANGED
@@ -1,4 +1,5 @@
1
1
  import * as vue from 'vue';
2
+ import * as vue_jsx_runtime from 'vue/jsx-runtime';
2
3
 
3
4
  declare const MpRadio: vue.DefineComponent<{
4
5
  id: {
@@ -23,10 +24,10 @@ declare const MpRadio: vue.DefineComponent<{
23
24
  isInvalid: {
24
25
  type: BooleanConstructor;
25
26
  };
26
- isReadonly: {
27
+ isReadOnly: {
27
28
  type: BooleanConstructor;
28
29
  };
29
- }, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "change" | "update:isChecked" | "update:modelValue")[], "click" | "change" | "update:isChecked" | "update:modelValue", vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
30
+ }, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "change" | "update:isChecked" | "update:modelValue")[], "click" | "change" | "update:isChecked" | "update:modelValue", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
30
31
  id: {
31
32
  type: StringConstructor;
32
33
  default: string;
@@ -49,12 +50,12 @@ declare const MpRadio: vue.DefineComponent<{
49
50
  isInvalid: {
50
51
  type: BooleanConstructor;
51
52
  };
52
- isReadonly: {
53
+ isReadOnly: {
53
54
  type: BooleanConstructor;
54
55
  };
55
56
  }>> & {
56
- onChange?: ((...args: any[]) => any) | undefined;
57
57
  onClick?: ((...args: any[]) => any) | undefined;
58
+ onChange?: ((...args: any[]) => any) | undefined;
58
59
  "onUpdate:isChecked"?: ((...args: any[]) => any) | undefined;
59
60
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
60
61
  }, {
@@ -62,7 +63,7 @@ declare const MpRadio: vue.DefineComponent<{
62
63
  isChecked: boolean;
63
64
  isDisabled: boolean;
64
65
  isInvalid: boolean;
65
- isReadonly: boolean;
66
+ isReadOnly: boolean;
66
67
  }, {}>;
67
68
 
68
69
  export { MpRadio };
package/dist/radio.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import * as vue from 'vue';
2
+ import * as vue_jsx_runtime from 'vue/jsx-runtime';
2
3
 
3
4
  declare const MpRadio: vue.DefineComponent<{
4
5
  id: {
@@ -23,10 +24,10 @@ declare const MpRadio: vue.DefineComponent<{
23
24
  isInvalid: {
24
25
  type: BooleanConstructor;
25
26
  };
26
- isReadonly: {
27
+ isReadOnly: {
27
28
  type: BooleanConstructor;
28
29
  };
29
- }, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "change" | "update:isChecked" | "update:modelValue")[], "click" | "change" | "update:isChecked" | "update:modelValue", vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
30
+ }, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "change" | "update:isChecked" | "update:modelValue")[], "click" | "change" | "update:isChecked" | "update:modelValue", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
30
31
  id: {
31
32
  type: StringConstructor;
32
33
  default: string;
@@ -49,12 +50,12 @@ declare const MpRadio: vue.DefineComponent<{
49
50
  isInvalid: {
50
51
  type: BooleanConstructor;
51
52
  };
52
- isReadonly: {
53
+ isReadOnly: {
53
54
  type: BooleanConstructor;
54
55
  };
55
56
  }>> & {
56
- onChange?: ((...args: any[]) => any) | undefined;
57
57
  onClick?: ((...args: any[]) => any) | undefined;
58
+ onChange?: ((...args: any[]) => any) | undefined;
58
59
  "onUpdate:isChecked"?: ((...args: any[]) => any) | undefined;
59
60
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
60
61
  }, {
@@ -62,7 +63,7 @@ declare const MpRadio: vue.DefineComponent<{
62
63
  isChecked: boolean;
63
64
  isDisabled: boolean;
64
65
  isInvalid: boolean;
65
- isReadonly: boolean;
66
+ isReadOnly: boolean;
66
67
  }, {}>;
67
68
 
68
69
  export { MpRadio };
package/dist/radio.js CHANGED
@@ -26,6 +26,7 @@ __export(radio_exports, {
26
26
  module.exports = __toCommonJS(radio_exports);
27
27
  var import_vue = require("vue");
28
28
  var import_vue2 = require("vue");
29
+ var import_pixel3_form_control = require("@mekari/pixel3-form-control");
29
30
  var import_pixel3_text = require("@mekari/pixel3-text");
30
31
  var import_recipes = require("@mekari/pixel3-styled-system/recipes");
31
32
 
@@ -53,7 +54,7 @@ var radioProps = {
53
54
  isInvalid: {
54
55
  type: Boolean
55
56
  },
56
- isReadonly: {
57
+ isReadOnly: {
57
58
  type: Boolean
58
59
  }
59
60
  };
@@ -73,6 +74,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
73
74
  }) {
74
75
  const classes = (0, import_recipes.radioSlotRecipe)();
75
76
  const sharedClasses = (0, import_recipes.sharedSlotRecipe)();
77
+ const formControlProp = (0, import_pixel3_form_control.useFormControlContext)();
76
78
  const handleChecked = /* @__PURE__ */ __name(() => {
77
79
  if (props.modelValue) {
78
80
  return props.modelValue === props.value;
@@ -80,7 +82,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
80
82
  return props.isChecked;
81
83
  }, "handleChecked");
82
84
  const onChange = /* @__PURE__ */ __name(() => {
83
- if (!props.isDisabled || !props.isReadonly) {
85
+ if (!props.isDisabled || !props.isReadOnly) {
84
86
  emit("change", !props.isChecked, props.value);
85
87
  emit("update:modelValue", props.value);
86
88
  emit("update:isChecked", !props.isChecked);
@@ -98,7 +100,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
98
100
  value,
99
101
  isDisabled,
100
102
  isInvalid,
101
- isReadonly
103
+ isReadOnly
102
104
  } = props;
103
105
  return (0, import_vue.createVNode)("label", {
104
106
  "for": id,
@@ -107,9 +109,9 @@ var MpRadio = (0, import_vue2.defineComponent)({
107
109
  "data-pixel-component": "MpRadio",
108
110
  "data-has-description": Boolean(description),
109
111
  "aria-checked": handleChecked(),
110
- "aria-disabled": isDisabled,
111
- "aria-invalid": isInvalid,
112
- "aria-readonly": isReadonly
112
+ "aria-disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled,
113
+ "aria-invalid": (formControlProp == null ? void 0 : formControlProp.value.isInvalid) || isInvalid,
114
+ "aria-readonly": (formControlProp == null ? void 0 : formControlProp.value.isReadOnly) || isReadOnly
113
115
  }, [(0, import_vue.createVNode)("input", {
114
116
  "id": id,
115
117
  "class": sharedClasses.hidden,
@@ -117,7 +119,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
117
119
  "name": name,
118
120
  "value": value,
119
121
  "checked": handleChecked(),
120
- "disabled": isDisabled ? true : void 0,
122
+ "disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? true : void 0,
121
123
  "onChange": onChange,
122
124
  "onClick": onClick
123
125
  }, null), (0, import_vue.createVNode)("div", {
@@ -131,11 +133,11 @@ var MpRadio = (0, import_vue2.defineComponent)({
131
133
  }, [(0, import_vue.createVNode)(import_pixel3_text.MpText, {
132
134
  "as": "span",
133
135
  "size": "label",
134
- "color": isDisabled ? "gray.400" : "dark"
136
+ "color": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? "gray.400" : "dark"
135
137
  }, _isSlot(children) ? children : {
136
138
  default: () => [children]
137
139
  }), description && (0, import_vue.createVNode)(import_pixel3_text.MpText, {
138
- "color": isDisabled ? "gray.400" : "gray.600"
140
+ "color": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? "gray.400" : "gray.600"
139
141
  }, _isSlot(description) ? description : {
140
142
  default: () => [description]
141
143
  })])]);
package/dist/radio.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  MpRadio
3
- } from "./chunk-N5I6KEUN.mjs";
4
- import "./chunk-ISKDJ7UA.mjs";
3
+ } from "./chunk-K5EBKT3H.mjs";
4
+ import "./chunk-PXWY2WNA.mjs";
5
5
  export {
6
6
  MpRadio
7
7
  };
package/package.json CHANGED
@@ -1,15 +1,16 @@
1
1
  {
2
2
  "name": "@mekari/pixel3-radio",
3
3
  "description": "Radio component for mekari pixel 3",
4
- "version": "0.0.1-alpha.0",
4
+ "version": "0.0.2",
5
5
  "main": "dist/index.js",
6
6
  "license": "MIT",
7
7
  "files": [
8
8
  "dist"
9
9
  ],
10
10
  "dependencies": {
11
- "@mekari/pixel3-text": "0.0.1-alpha.0",
12
- "@mekari/pixel3-styled-system": "0.0.1-alpha.0"
11
+ "@mekari/pixel3-form-control": "0.0.2",
12
+ "@mekari/pixel3-text": "0.0.2",
13
+ "@mekari/pixel3-styled-system": "0.0.1"
13
14
  },
14
15
  "peerDependencies": {
15
16
  "vue": "^3.3.7"