@exakt/ui 0.0.54 → 0.0.56

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "exakt-ui",
   "configKey": "exakt",
-  "version": "0.0.54"
+  "version": "0.0.56"
 }

package/dist/runtime/components/e/input/text.vue

@@ -1,62 +1,64 @@
 <template>
-  <div
-    v-if="label"
-    class="mb-3 mt-6"
-  >
-    <label :for="id">
-      {{ label }} </label>
-  </div>
-
-  <div
-    class="wrapper fullwidth"
-    :style="inputState.overtakeStyle"
-    :class="{ rounded: rounded == undefined ? solid : rounded, solid }"
-    @click="focus"
-  >
-    <e-icon
-      v-if="icon"
-      class="mr-2"
-      size="19"
-      fill="true"
+  <div>
+    <div
+      v-if="label"
+      class="mb-3 mt-6"
     >
-      {{ icon }}
-    </e-icon>
-    <textarea
-      v-if="type === 'textarea'"
-      ref="input"
-      v-model="currentText"
-      class="input"
-      :name="name"
-      :placeholder="placeholder"
-      autocomplete="off"
-      auto-grow
-      rows="5"
-      @focus="inputState.focused = true"
-      @blur="inputState.focused = false"
-    />
-    <input
-      v-else
-      :id="id"
-      ref="input"
-      v-model="currentText"
-      :disabled="disabled"
-      :type="type"
-      :name="name"
-      :autocomplete="autocomplete"
-      :spellcheck="spellcheck"
-      class="input"
-      :required="required"
-      :placeholder="placeholder"
-      @click.stop=""
-      @focus="inputState.focused = true"
-      @blur="inputState.focused = false"
-      @transitionend="transitionEnd"
+      <label :for="id">
+        {{ label }} </label>
+    </div>
+
+    <div
+      class="wrapper fullwidth"
+      :style="inputState.overtakeStyle"
+      :class="{ rounded: rounded == undefined ? solid : rounded, solid }"
+      @click="focus"
     >
-    <slot />
+      <e-icon
+        v-if="icon"
+        class="mr-2"
+        size="19"
+        fill="true"
+      >
+        {{ icon }}
+      </e-icon>
+      <textarea
+        v-if="type === 'textarea'"
+        ref="input"
+        v-model="currentText"
+        class="input"
+        :name="name"
+        :placeholder="placeholder"
+        autocomplete="off"
+        auto-grow
+        rows="5"
+        @focus="inputState.focused = true"
+        @blur="inputState.focused = false"
+      />
+      <input
+        v-else
+        :id="id"
+        ref="input"
+        v-model="currentText"
+        :disabled="disabled"
+        :type="type"
+        :name="name"
+        :autocomplete="autocomplete"
+        :spellcheck="spellcheck"
+        class="input"
+        :required="required"
+        :placeholder="placeholder"
+        @click.stop=""
+        @focus="inputState.focused = true"
+        @blur="inputState.focused = false"
+        @transitionend="transitionEnd"
+      >
+      <slot />
+    </div>
   </div>
 </template>
 <script setup lang="ts">
-import { ref, watch, reactive, computed, useId } from "#imports";
+import { ref, watch, reactive, computed, useId, onMounted } from "#imports";
 
 const inputState = reactive({
   overtakeStyle: "",
@@ -88,10 +90,24 @@ const focus = () => {
 const internalText = ref('')
 
 const currentText = computed({
-  get: () => props.modelValue ? props.modelValue : internalText.value,
+  get: () => {
+    const setValue = props.modelValue ? props.modelValue : internalText.value
+
+    if (!setValue || !setValue.length) {
+      return props.defaultValue || ''
+    }
+
+    return setValue
+  },
   set: (value) => { if (props.modelValue) { emit("update:modelValue", value) } else { internalText.value = value } },
 });
 
+onMounted(() => {
+  if (props.defaultValue) {
+    currentText.value = props.defaultValue
+  }
+})
+
 const props = withDefaults(
   defineProps<{
     icon?: string;
@@ -99,6 +115,7 @@ const props = withDefaults(
     placeholder?: string;
     name?: string;
     modelValue?: string;
+    defaultValue?: string;
     solid?: boolean;
     rounded?: boolean;
     type?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@exakt/ui",
-  "version": "0.0.54",
+  "version": "0.0.56",
   "description": "A UI library for Nuxt.js",
   "license": "MIT",
   "type": "module",