chore: fix some minor issues

Author: sfxcode

src/components/PrimeCascadeSelect.vue

@@ -38,7 +38,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
     <CascadeSelect
       :id="context.id"
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"
       :class="styleClass"

src/components/PrimeChips.vue

@@ -31,7 +31,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
   <div class="p-formkit">
     <Chips
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :input-id="context.id"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"

src/components/PrimeColorPicker.vue

@@ -28,7 +28,7 @@ function handleChange(e: any) {
   <div class="p-formkit">
     <ColorPicker
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"
       :style="context?.attrs.style"

src/components/PrimeDropdown.vue

@@ -59,7 +59,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
   <div class="p-formkit">
     <Dropdown
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :input-id="context.id"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"

src/components/PrimeEditor.vue

@@ -36,7 +36,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
     <Editor
       :id="context.id"
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"
       :editor-style="context?.attrs.style"

src/components/PrimeInputMask.vue

@@ -57,7 +57,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
       <InputMask
         :id="context.id"
         v-model="context._value"
-        v-bind="context.attrs"
+        v-bind="context?.attrs"
         :disabled="!!context?.disabled"
         :readonly="context?.attrs._readonly ?? false"
         :class="styleClass"

src/components/PrimeInputNumber.vue

@@ -44,7 +44,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
   <div class="p-formkit">
     <InputNumber
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :input-id="context.id"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"

src/components/PrimeInputSwitch.vue

@@ -36,7 +36,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
     <span v-if="context.attrs.labelLeft" class="formkit-prime-left">{{ context.labelLeft }}</span>
     <InputSwitch
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :input-id="context.id"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"

src/components/PrimeInputText.vue

@@ -8,8 +8,7 @@ export interface FormKitPrimeInputTextProps {
   ptOptions?: InputTextProps['ptOptions']
   unstyled?: InputTextProps['unstyled']
   placeholder?: InputTextProps['placeholder']
-  iconLeft?: string
-  iconRight?: string
+  icon?: string
 }
 
 const props = defineProps({
@@ -19,21 +18,8 @@ const props = defineProps({
   },
 })
 
-function hasLeftIcon() {
-  return props.context?.iconLeft && props.context?.iconLeft.length > 0
-}
-
-function hasRightIcon() {
-  return props.context?.iconRight && props.context?.iconRight.length > 0
-}
-
-function spanClass() {
-  let result = ''
-  if (hasLeftIcon())
-    result = `p-formkit-icon ${result}p-input-icon-left `
-  if (hasRightIcon())
-    result = `p-formkit-icon ${result}p-input-icon-right `
-  return result
+function hasIcon() {
+  return props.context?.attrs?.icon && props.context?.attrs?.icon.length > 0
 }
 
 function handleBlur(e: Event) {
@@ -49,13 +35,13 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
 
 <template>
   <div class="p-formkit">
-    <span :class="spanClass()">
-      <i v-if="hasLeftIcon()" :class="context?.iconLeft" />
-
+    {{ context.attrs.icon }}
+    <IconField v-if="hasIcon()" :icon-position="context?.attrs.iconPosition">
+      <InputIcon :class="context.attrs.icon" />
       <InputText
         :id="context.id"
         v-model="context._value"
-        v-bind="context.attrs"
+        v-bind="context?.attrs"
         :disabled="!!context?.disabled"
         :readonly="context?.attrs._readonly ?? false"
         :style="context?.attrs.style"
@@ -70,7 +56,25 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
         @input="handleInput"
         @blur="handleBlur"
       />
-      <i v-if="hasRightIcon()" :class="context?.iconRight" />
-    </span>
+    </IconField>
+    <InputText
+      v-else
+      :id="context.id"
+      v-model="context._value"
+      v-bind="context?.attrs"
+      :disabled="!!context?.disabled"
+      :readonly="context?.attrs._readonly ?? false"
+      :style="context?.attrs.style"
+      :class="styleClass"
+      :tabindex="context?.attrs.tabindex"
+      :aria-label="context?.attrs.ariaLabel"
+      :aria-labelledby="context?.attrs.ariaLabelledby"
+      :placeholder="context.placeholder"
+      :pt="context.pt"
+      :pt-options="context.ptOptions"
+      :unstyled="context.unstyled ?? false"
+      @input="handleInput"
+      @blur="handleBlur"
+    />
   </div>
 </template>

src/components/PrimeKnob.vue

@@ -43,7 +43,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
     <Knob
       :id="context.id"
       v-model="context._value"
-      v-bind="context.attrs"
+      v-bind="context?.attrs"
       :disabled="!!context?.disabled"
       :readonly="context?.attrs._readonly ?? false"
       :style="context?.attrs.style"