@avakhula/ui 0.0.142 → 0.0.143

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@avakhula/ui",
3
- "version": "0.0.142",
3
+ "version": "0.0.143",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.umd.cjs",
6
6
  "source": "src/index.js",
package/src/App.vue CHANGED
@@ -1,21 +1,25 @@
1
1
  <template>
2
- <ib-alert class="info-notification" type="info" show-icon title="twat">
3
-
4
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Assumenda minus qui reiciendis. Id assumenda dolore
5
- laudantium nobis corporis corrupti, rem officiis voluptatum et debitis voluptatem error asperiores, aperiam porro
6
- itaque?
7
-
8
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Assumenda minus qui reiciendis. Id assumenda dolore
9
- laudantium nobis corporis corrupti, rem officiis voluptatum et debitis voluptatem error asperiores, aperiam porro
10
- itaque?
11
- </ib-alert>
2
+ <div class="test">
3
+ <div>
4
+ <ib-radio value="a" label="Item 1" name="Checkbox" v-bind="{}" />
5
+ <ib-radio isChecked style="margin-left: 15px" value="b" label="Item 2" name="Checkbox" v-bind="{}" />
6
+ </div>
7
+ </div>
12
8
  </template>
13
9
 
14
10
  <script>
15
- import IbAlert from "./components/Alert/Alert.vue"
11
+ import IbRadio from "./components/Form/Radio/Radio.vue";
12
+
16
13
  export default {
17
14
  components: {
18
- IbAlert
15
+ IbRadio
19
16
  }
20
17
  }
21
- </script>
18
+
19
+ </script>
20
+
21
+ <style>
22
+ .test {
23
+ padding-top: 110vh;
24
+ }
25
+ </style>
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <label :class="classes" :for="id">
2
+ <label :class="classes" :for="id" @click.prevent="onClick">
3
3
  <input
4
4
  type="radio"
5
5
  :name="name"
@@ -9,7 +9,6 @@
9
9
  :disabled="disabled"
10
10
  ref="radio"
11
11
  @input.stop
12
- @click="onClick"
13
12
  @change="onChange"
14
13
  />
15
14
  <span class="ib-radio-body" :class="{ 'without-text': !label?.length }">
@@ -62,32 +61,33 @@ export default {
62
61
  },
63
62
  },
64
63
  mounted() {
65
- this.$globalEvents.$on("radio:update", (name) => {
66
- if (name === this.name) {
67
- this.checked = this.$refs.radio?.checked;
64
+ this.$globalEvents.$on(`radio:update:${this.name}`, (uid) => {
65
+ if (this.uid !== uid) {
66
+ this.checked = false;
68
67
  }
69
68
  });
70
69
  },
71
70
  data() {
72
71
  return {
73
72
  checked: this.isChecked,
73
+ uid: generateUID(),
74
74
  };
75
75
  },
76
76
  methods: {
77
77
  onClick() {
78
78
  if (!this.disabled) {
79
- this.checked = this.$refs.radio?.checked;
79
+ this.checked = !this.checked;
80
+ this.$globalEvents.$emit(`radio:update:${this.name}`, this.uid);
80
81
  this.$emit("input", this.checked);
81
82
  this.$emit("change", this.checked);
82
- this.$globalEvents.$emit("radio:update", this.name);
83
83
  }
84
84
  },
85
85
  onChange() {
86
86
  if (!this.disabled) {
87
- this.checked = this.$refs.radio?.checked;
87
+ this.checked = !this.checked;
88
+ this.$globalEvents.$emit(`radio:update:${this.name}`, this.uid);
88
89
  this.$emit("change", this.checked);
89
90
  this.$emit("input", this.checked);
90
- this.$globalEvents.$emit("radio:update", this.name);
91
91
  }
92
92
  },
93
93
  },