@indielayer/ui 1.7.4 → 1.7.5

package/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "1.7.4";
+declare const _default: "1.7.5";
 export default _default;

package/lib/version.js

@@ -1,4 +1,4 @@
-const e = "1.7.4";
+const e = "1.7.5";
 export {
   e as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@indielayer/ui",
-  "version": "1.7.4",
+  "version": "1.7.5",
   "description": "Indielayer UI Components with Tailwind CSS build for Vue 3",
   "author": {
     "name": "João Teixeira",

package/src/components/input/Input.vue

@@ -42,7 +42,7 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, type PropType, type ExtractPublicPropTypes, watch } from 'vue'
+import { ref, type PropType, type ExtractPublicPropTypes, watch, useAttrs, computed } from 'vue'
 import { useTheme, type ThemeComponent } from '../../composables/useTheme'
 import { useColors } from '../../composables/useColors'
 import { useCommon } from '../../composables/useCommon'
@@ -58,6 +58,15 @@ const props = defineProps(inputProps)
 
 const emit = defineEmits(useInputtable.emits())
 
+const attrs = useAttrs()
+const dataAttrs = computed(() => {
+  return Object.keys(attrs).reduce((acc, key) => {
+    if (key.startsWith('data-')) acc[key] = attrs[key]
+
+    return acc
+  }, {} as Record<string, any>)
+})
+
 const elRef = ref<HTMLInputElement | null>(null)
 const currentType = ref(props.type)
 
@@ -153,6 +162,7 @@ defineExpose({ focus, blur, reset, validate, setError })
         :readonly="readonly"
         :type="currentType"
         :value="typeof modelValue !== 'undefined' ? modelValue : ''"
+        v-bind="dataAttrs"
         v-on="inputListeners"
         @change="onChange"
       />

package/src/components/textarea/Textarea.vue

@@ -38,7 +38,7 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, watch, type ExtractPublicPropTypes, type Ref } from 'vue'
+import { ref, watch, type ExtractPublicPropTypes, type Ref, useAttrs, computed } from 'vue'
 import { useResizeObserver, useEventListener } from '@vueuse/core'
 import { useCSS } from '../../composables/useCSS'
 import { useTheme, type ThemeComponent } from '../../composables/useTheme'
@@ -54,6 +54,15 @@ const props = defineProps(textareaProps)
 
 const emit = defineEmits(useInputtable.emits())
 
+const attrs = useAttrs()
+const dataAttrs = computed(() => {
+  return Object.keys(attrs).reduce((acc, key) => {
+    if (key.startsWith('data-')) acc[key] = attrs[key]
+
+    return acc
+  }, {} as Record<string, any>)
+})
+
 const elRef = ref<HTMLTextAreaElement | null>(null)
 
 useResizeObserver(elRef, resize)
@@ -139,6 +148,7 @@ defineExpose({ focus, blur, reset, validate, setError })
       :placeholder="placeholder"
       :readonly="readonly"
       :value="typeof modelValue !== 'undefined' ? String(modelValue) : ''"
+      v-bind="dataAttrs"
       v-on="inputListeners"
       @keydown.enter="onEnter"
       @input="onInput"

package/src/version.ts

@@ -1 +1 @@
-export default '1.7.4'
+export default '1.7.5'