@a-vision-software/vue-input-components 1.4.3 → 1.4.5

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@a-vision-software/vue-input-components",
-    "version": "1.4.3",
+    "version": "1.4.5",
     "description": "A collection of reusable Vue 3 input components with TypeScript support",
     "author": "A-Vision Software",
     "license": "MIT",
@@ -85,4 +85,4 @@
     "publishConfig": {
         "access": "public"
     }
-}
+}

package/src/components/Modal.vue

@@ -1,7 +1,7 @@
 <template>
   <Teleport to="body">
     <transition name="modal-fade">
-      <div v-if="modelValue" class="modal-backdrop">
+      <div v-if="modelValue" class="modal-backdrop" :class="modalClass">
         <div class="modal" :style="modalStyle" role="dialog" aria-labelledby="modalTitle"
           aria-describedby="modalContent">
           <div v-if="props.isLargeIcon && props.icon" class="modal-large-icon">
@@ -39,6 +39,7 @@ import { ModalProps, ModalEmits } from '../types/modal'
 
 const props = withDefaults(defineProps<ModalProps>(), {
   modelValue: false,
+  class: '',
   title: '',
   minWidth: '300px',
   maxWidth: '800px',

package/src/components/TextInput.vue

@@ -115,12 +115,12 @@ const formatDateForModel = (date: Date | null): string => {
   const day = String(date.getDate()).padStart(2, '0')
   const month = String(date.getMonth() + 1).padStart(2, '0')
   const year = date.getFullYear()
-  return `${day}/${month}/${year}`
+  return `${year}-${month}-${day}`
 }
 
 const parseDateFromModel = (dateStr: string): Date | null => {
   if (!dateStr) return null
-  const [day, month, year] = dateStr.split('/').map(Number)
+  const [year, month, day] = dateStr.split('-').map(Number)
   return new Date(year, month - 1, day)
 }
 
@@ -210,7 +210,7 @@ onUnmounted(() => {
 })
 
 onMounted(() => {
-  id.value = `text-input-${Math.random().toString(36).substr(2, 9)}`
+  id.value = `text-input-${Math.random().toString(36).substring(2, 9)}`
   if (props.type === 'date' && props.modelValue) {
     dateValue.value = parseDateFromModel(props.modelValue)
   }

package/src/types/modal.ts

@@ -1,5 +1,6 @@
 export interface ModalProps {
   modelValue: boolean
+  modalClass?: string
   title?: string
   minWidth?: string
   maxWidth?: string

package/src/views/ModalTestView.vue

@@ -9,7 +9,7 @@
 
       <Action label="Open Basic Modal" @click="showBasicModal = true" />
 
-      <Modal v-model="showBasicModal" title="Basic Modal Example" icon="info-circle">
+      <Modal v-model="showBasicModal" title="Basic Modal Example" icon="info-circle" modal-class="basic-modal">
         <p>This is a basic modal example with default styling.</p>
         <p>The modal can be closed by clicking the X button in the top right corner.</p>
       </Modal>