vueless 0.0.372 → 0.0.373

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.372",
+  "version": "0.0.373",
   "license": "MIT",
   "description": "Vue Styleless Component Framework.",
   "homepage": "https://vueless.com",

package/ui.image-avatar/UAvatar.vue

@@ -10,17 +10,23 @@
       <template v-if="labelFirstLetters">{{ labelFirstLetters }}</template>
       <!--
         @slot Use it to add something instead of the avatar image placeholder.
+        @binding {string} icon-name
         @binding {string} icon-color
         @binding {string} icon-size
       -->
       <slot
         v-else
         name="placeholder"
-        :icon-name="icon"
+        :icon-name="placeholderIcon"
         :icon-color="componentColor"
         :icon-size="size"
       >
-        <UIcon :name="icon" :color="componentColor" :size="size" v-bind="placeholderIconAttrs" />
+        <UIcon
+          :name="placeholderIcon"
+          :color="componentColor"
+          :size="size"
+          v-bind="placeholderIconAttrs"
+        />
       </slot>
     </template>
   </div>
@@ -58,7 +64,7 @@ const props = defineProps({
   /**
    * Avatar icon placeholder.
    */
-  icon: {
+  placeholderIcon: {
     type: String,
     default: getDefault(defaultConfig, UAvatar).placeholderIcon,
   },
@@ -122,6 +128,8 @@ const emit = defineEmits([
   "click",
 ]);
 
+const { avatarAttrs, placeholderIconAttrs } = useAttrs(props);
+
 const labelFirstLetters = computed(() => {
   const [firstWord, secondWord] = props.label.split(" ");
 
@@ -138,9 +146,9 @@ const backgroundImage = computed(() => {
   return props.src ? `background-image: url(${src});` : "";
 });
 
-const { avatarAttrs, placeholderIconAttrs } = useAttrs(props);
-
-const componentColor = computed(() => (props.color === "white" ? "grayscale" : props.color));
+const componentColor = computed(() => {
+  return props.color === "white" ? "grayscale" : props.color;
+});
 
 function onClick(event) {
   emit("click", event);

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "vueless",
-  "version": "0.0.372",
+  "version": "0.0.373",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -347,13 +347,13 @@
               "default": "\"\""
             },
             {
-              "name": "icon",
+              "name": "placeholderIcon",
               "description": "Avatar icon placeholder.",
               "value": {
                 "kind": "expression",
                 "type": "string"
               },
-              "default": "getDefault(defaultConfig, UAvatar).placeholderIcon"
+              "default": "image"
             },
             {
               "name": "size",
@@ -423,6 +423,7 @@
               "description": "Use it to add something instead of the avatar image placeholder.",
               "bindings": [
                 {
+                  "type": "string",
                   "name": "icon-name"
                 },
                 {