@mekari/pixel3-radio 0.0.4 → 0.0.6-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4,10 +4,11 @@ import {
4
4
  } from "./chunk-PXWY2WNA.mjs";
5
5
 
6
6
  // src/radio.tsx
7
- import { isVNode as _isVNode, createVNode as _createVNode } from "vue";
7
+ import { isVNode as _isVNode, createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
8
8
  import { defineComponent } from "vue";
9
9
  import { useFormControlContext } from "@mekari/pixel3-form-control";
10
10
  import { MpText } from "@mekari/pixel3-text";
11
+ import { useId } from "@mekari/pixel3-utils";
11
12
  import { radioSlotRecipe, sharedSlotRecipe } from "@mekari/pixel3-styled-system/recipes";
12
13
  function _isSlot(s) {
13
14
  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !_isVNode(s);
@@ -17,13 +18,16 @@ var MpRadio = defineComponent({
17
18
  name: "MpRadio",
18
19
  props: radioProps,
19
20
  emits: ["click", "change", "update:isChecked", "update:modelValue"],
21
+ inheritAttrs: false,
20
22
  setup(props, {
21
23
  slots,
22
- emit
24
+ emit,
25
+ attrs
23
26
  }) {
24
27
  const classes = radioSlotRecipe();
25
28
  const sharedClasses = sharedSlotRecipe();
26
29
  const formControlProp = useFormControlContext();
30
+ const getId = props.id || `mp-radio-${useId()}`;
27
31
  const handleChecked = /* @__PURE__ */ __name(() => {
28
32
  if (props.modelValue) {
29
33
  return props.modelValue === props.value;
@@ -44,7 +48,6 @@ var MpRadio = defineComponent({
44
48
  const children = slots.default && slots.default();
45
49
  const description = slots.description && slots.description();
46
50
  const {
47
- id,
48
51
  name,
49
52
  value,
50
53
  isDisabled,
@@ -52,7 +55,7 @@ var MpRadio = defineComponent({
52
55
  isReadOnly
53
56
  } = props;
54
57
  return _createVNode("label", {
55
- "for": id,
58
+ "for": getId,
56
59
  "role": "radio",
57
60
  "class": classes.root,
58
61
  "data-pixel-component": "MpRadio",
@@ -61,8 +64,8 @@ var MpRadio = defineComponent({
61
64
  "aria-disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled,
62
65
  "aria-invalid": (formControlProp == null ? void 0 : formControlProp.value.isInvalid) || isInvalid,
63
66
  "aria-readonly": (formControlProp == null ? void 0 : formControlProp.value.isReadOnly) || isReadOnly
64
- }, [_createVNode("input", {
65
- "id": id,
67
+ }, [_createVNode("input", _mergeProps({
68
+ "id": getId,
66
69
  "class": sharedClasses.hidden,
67
70
  "type": "radio",
68
71
  "name": name,
@@ -71,7 +74,7 @@ var MpRadio = defineComponent({
71
74
  "disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? true : void 0,
72
75
  "onChange": onChange,
73
76
  "onClick": onClick
74
- }, null), _createVNode("div", {
77
+ }, attrs), null), _createVNode("div", {
75
78
  "class": classes.control
76
79
  }, [_createVNode("div", {
77
80
  "style": {
package/dist/index.js CHANGED
@@ -30,6 +30,7 @@ var import_vue = require("vue");
30
30
  var import_vue2 = require("vue");
31
31
  var import_pixel3_form_control = require("@mekari/pixel3-form-control");
32
32
  var import_pixel3_text = require("@mekari/pixel3-text");
33
+ var import_pixel3_utils = require("@mekari/pixel3-utils");
33
34
  var import_recipes = require("@mekari/pixel3-styled-system/recipes");
34
35
 
35
36
  // src/modules/radio.props.ts
@@ -70,13 +71,16 @@ var MpRadio = (0, import_vue2.defineComponent)({
70
71
  name: "MpRadio",
71
72
  props: radioProps,
72
73
  emits: ["click", "change", "update:isChecked", "update:modelValue"],
74
+ inheritAttrs: false,
73
75
  setup(props, {
74
76
  slots,
75
- emit
77
+ emit,
78
+ attrs
76
79
  }) {
77
80
  const classes = (0, import_recipes.radioSlotRecipe)();
78
81
  const sharedClasses = (0, import_recipes.sharedSlotRecipe)();
79
82
  const formControlProp = (0, import_pixel3_form_control.useFormControlContext)();
83
+ const getId = props.id || `mp-radio-${(0, import_pixel3_utils.useId)()}`;
80
84
  const handleChecked = /* @__PURE__ */ __name(() => {
81
85
  if (props.modelValue) {
82
86
  return props.modelValue === props.value;
@@ -97,7 +101,6 @@ var MpRadio = (0, import_vue2.defineComponent)({
97
101
  const children = slots.default && slots.default();
98
102
  const description = slots.description && slots.description();
99
103
  const {
100
- id,
101
104
  name,
102
105
  value,
103
106
  isDisabled,
@@ -105,7 +108,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
105
108
  isReadOnly
106
109
  } = props;
107
110
  return (0, import_vue.createVNode)("label", {
108
- "for": id,
111
+ "for": getId,
109
112
  "role": "radio",
110
113
  "class": classes.root,
111
114
  "data-pixel-component": "MpRadio",
@@ -114,8 +117,8 @@ var MpRadio = (0, import_vue2.defineComponent)({
114
117
  "aria-disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled,
115
118
  "aria-invalid": (formControlProp == null ? void 0 : formControlProp.value.isInvalid) || isInvalid,
116
119
  "aria-readonly": (formControlProp == null ? void 0 : formControlProp.value.isReadOnly) || isReadOnly
117
- }, [(0, import_vue.createVNode)("input", {
118
- "id": id,
120
+ }, [(0, import_vue.createVNode)("input", (0, import_vue.mergeProps)({
121
+ "id": getId,
119
122
  "class": sharedClasses.hidden,
120
123
  "type": "radio",
121
124
  "name": name,
@@ -124,7 +127,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
124
127
  "disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? true : void 0,
125
128
  "onChange": onChange,
126
129
  "onClick": onClick
127
- }, null), (0, import_vue.createVNode)("div", {
130
+ }, attrs), null), (0, import_vue.createVNode)("div", {
128
131
  "class": classes.control
129
132
  }, [(0, import_vue.createVNode)("div", {
130
133
  "style": {
package/dist/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  MpRadio
3
- } from "./chunk-K5EBKT3H.mjs";
3
+ } from "./chunk-NU4BEO3I.mjs";
4
4
  import "./chunk-PXWY2WNA.mjs";
5
5
  export {
6
6
  MpRadio
@@ -1 +1 @@
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}}}
1
+ {"inputs":{"src/modules/radio.props.ts":{"bytes":434,"imports":[],"format":"esm"},"src/radio.tsx":{"bytes":3461,"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-utils","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-utils","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":3847},"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":5365},"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-utils","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":3972},"src/modules/radio.props.ts":{"bytesInOutput":325}},"bytes":5354},"dist/modules/radio.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/radio.props.ts","inputs":{"src/modules/radio.props.ts":{"bytesInOutput":474}},"bytes":1408}}}
@@ -1 +1 @@
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}}}
1
+ {"inputs":{"src/modules/radio.props.ts":{"bytes":434,"imports":[],"format":"esm"},"src/radio.tsx":{"bytes":3461,"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-utils","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-NU4BEO3I.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-NU4BEO3I.mjs","kind":"import-statement"},{"path":"dist/chunk-PXWY2WNA.mjs","kind":"import-statement"}],"exports":["MpRadio"],"entryPoint":"src/radio.tsx","inputs":{},"bytes":103},"dist/chunk-NU4BEO3I.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-utils","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true}],"exports":["MpRadio"],"inputs":{"src/radio.tsx":{"bytesInOutput":3623}},"bytes":3727},"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/radio.js CHANGED
@@ -28,6 +28,7 @@ var import_vue = require("vue");
28
28
  var import_vue2 = require("vue");
29
29
  var import_pixel3_form_control = require("@mekari/pixel3-form-control");
30
30
  var import_pixel3_text = require("@mekari/pixel3-text");
31
+ var import_pixel3_utils = require("@mekari/pixel3-utils");
31
32
  var import_recipes = require("@mekari/pixel3-styled-system/recipes");
32
33
 
33
34
  // src/modules/radio.props.ts
@@ -68,13 +69,16 @@ var MpRadio = (0, import_vue2.defineComponent)({
68
69
  name: "MpRadio",
69
70
  props: radioProps,
70
71
  emits: ["click", "change", "update:isChecked", "update:modelValue"],
72
+ inheritAttrs: false,
71
73
  setup(props, {
72
74
  slots,
73
- emit
75
+ emit,
76
+ attrs
74
77
  }) {
75
78
  const classes = (0, import_recipes.radioSlotRecipe)();
76
79
  const sharedClasses = (0, import_recipes.sharedSlotRecipe)();
77
80
  const formControlProp = (0, import_pixel3_form_control.useFormControlContext)();
81
+ const getId = props.id || `mp-radio-${(0, import_pixel3_utils.useId)()}`;
78
82
  const handleChecked = /* @__PURE__ */ __name(() => {
79
83
  if (props.modelValue) {
80
84
  return props.modelValue === props.value;
@@ -95,7 +99,6 @@ var MpRadio = (0, import_vue2.defineComponent)({
95
99
  const children = slots.default && slots.default();
96
100
  const description = slots.description && slots.description();
97
101
  const {
98
- id,
99
102
  name,
100
103
  value,
101
104
  isDisabled,
@@ -103,7 +106,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
103
106
  isReadOnly
104
107
  } = props;
105
108
  return (0, import_vue.createVNode)("label", {
106
- "for": id,
109
+ "for": getId,
107
110
  "role": "radio",
108
111
  "class": classes.root,
109
112
  "data-pixel-component": "MpRadio",
@@ -112,8 +115,8 @@ var MpRadio = (0, import_vue2.defineComponent)({
112
115
  "aria-disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled,
113
116
  "aria-invalid": (formControlProp == null ? void 0 : formControlProp.value.isInvalid) || isInvalid,
114
117
  "aria-readonly": (formControlProp == null ? void 0 : formControlProp.value.isReadOnly) || isReadOnly
115
- }, [(0, import_vue.createVNode)("input", {
116
- "id": id,
118
+ }, [(0, import_vue.createVNode)("input", (0, import_vue.mergeProps)({
119
+ "id": getId,
117
120
  "class": sharedClasses.hidden,
118
121
  "type": "radio",
119
122
  "name": name,
@@ -122,7 +125,7 @@ var MpRadio = (0, import_vue2.defineComponent)({
122
125
  "disabled": (formControlProp == null ? void 0 : formControlProp.value.isDisabled) || isDisabled ? true : void 0,
123
126
  "onChange": onChange,
124
127
  "onClick": onClick
125
- }, null), (0, import_vue.createVNode)("div", {
128
+ }, attrs), null), (0, import_vue.createVNode)("div", {
126
129
  "class": classes.control
127
130
  }, [(0, import_vue.createVNode)("div", {
128
131
  "style": {
package/dist/radio.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  MpRadio
3
- } from "./chunk-K5EBKT3H.mjs";
3
+ } from "./chunk-NU4BEO3I.mjs";
4
4
  import "./chunk-PXWY2WNA.mjs";
5
5
  export {
6
6
  MpRadio
package/package.json CHANGED
@@ -1,16 +1,17 @@
1
1
  {
2
2
  "name": "@mekari/pixel3-radio",
3
3
  "description": "Radio component for mekari pixel 3",
4
- "version": "0.0.4",
4
+ "version": "0.0.6-dev.0",
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.4",
12
- "@mekari/pixel3-form-control": "0.0.4",
13
- "@mekari/pixel3-styled-system": "0.0.3"
11
+ "@mekari/pixel3-form-control": "0.0.6-dev.0",
12
+ "@mekari/pixel3-text": "0.0.6-dev.0",
13
+ "@mekari/pixel3-styled-system": "0.0.4-dev.0",
14
+ "@mekari/pixel3-utils": "0.0.4"
14
15
  },
15
16
  "peerDependencies": {
16
17
  "vue": "^3.4.9"
@@ -35,7 +36,6 @@
35
36
  "build": "tsup && pnpm build:types",
36
37
  "build:fast": "tsup",
37
38
  "build:types": "tsup src --dts-only",
38
- "build:external": "tsup src/index.tsx --external",
39
39
  "types:check": "tsc --noEmit",
40
40
  "replace-config": "clean-package",
41
41
  "restore-config": "clean-package restore"