From a57bd36f2078a515289e7bb40864bf945d9bdf53 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Sun, 7 Apr 2024 12:53:01 +0300
Subject: [PATCH] Refactored IconField

---
 components/lib/iconfield/style/IconFieldStyle.js     |  8 +-------
 .../lib/themes/primeone/base/iconfield/index.js      |  8 ++++----
 doc/iconfield/BasicDoc.vue                           | 12 ++++++------
 doc/iconfield/TemplateDoc.vue                        |  8 ++++----
 4 files changed, 15 insertions(+), 21 deletions(-)

diff --git a/components/lib/iconfield/style/IconFieldStyle.js b/components/lib/iconfield/style/IconFieldStyle.js
index c8e4ff19f..d6f3b6284 100644
--- a/components/lib/iconfield/style/IconFieldStyle.js
+++ b/components/lib/iconfield/style/IconFieldStyle.js
@@ -1,13 +1,7 @@
 import BaseStyle from 'primevue/base/style';
 
 const classes = {
-    root: ({ props }) => [
-        'p-icon-field',
-        {
-            'p-icon-field-right': props.iconPosition === 'right',
-            'p-icon-field-left': props.iconPosition === 'left'
-        }
-    ]
+    root: 'p-icon-field'
 };
 
 export default BaseStyle.extend({
diff --git a/components/lib/themes/primeone/base/iconfield/index.js b/components/lib/themes/primeone/base/iconfield/index.js
index a7e7c5984..c057ecb66 100644
--- a/components/lib/themes/primeone/base/iconfield/index.js
+++ b/components/lib/themes/primeone/base/iconfield/index.js
@@ -11,19 +11,19 @@ export default {
     color: ${dt('iconfield.color')};
 }
 
-.p-icon-field-left .p-input-icon {
+.p-icon-field .p-input-icon:first-child {
     left: 0.75rem;
 }
 
-.p-icon-field-right .p-input-icon {
+.p-icon-field .p-input-icon:last-child {
     right: 0.75rem;
 }
 
-.p-icon-field-left .p-inputtext {
+.p-icon-field .p-inputtext:last-child {
     padding-left: 2.5rem;
 }
 
-.p-icon-field-right .p-inputtext {
+.p-icon-field .p-inputtext:first-child {
     padding-right: 2.5rem;
 }
 `
diff --git a/doc/iconfield/BasicDoc.vue b/doc/iconfield/BasicDoc.vue
index 8583009ec..7a6e9408a 100644
--- a/doc/iconfield/BasicDoc.vue
+++ b/doc/iconfield/BasicDoc.vue
@@ -6,14 +6,14 @@
         </p>
     </DocSectionText>
     <div class="card flex flex-wrap justify-content-center gap-3">
-        <IconField iconPosition="left">
+        <IconField>
             <InputIcon class="pi pi-search"> </InputIcon>
             <InputText v-model="value1" placeholder="Search" />
         </IconField>
 
         <IconField>
-            <InputIcon class="pi pi-spin pi-spinner"> </InputIcon>
             <InputText v-model="value2" />
+            <InputIcon class="pi pi-spin pi-spinner"> </InputIcon>
         </IconField>
     </div>
     <DocSectionCode :code="code" />
@@ -27,7 +27,7 @@ export default {
             value2: null,
             code: {
                 basic: `
-<IconField iconPosition="left">
+<IconField>
     <InputIcon class="pi pi-search"> </InputIcon>
     <InputText v-model="value1" placeholder="Search" />
 </IconField>
@@ -40,8 +40,8 @@ export default {
                 options: `
 <template>
     <div class="card flex flex-wrap justify-content-center gap-3">
-        <IconField iconPosition="left">
-            <IconField iconPosition="left">
+        <IconField>
+            <IconField>
             <InputIcon class="pi pi-search"> </InputIcon>
             <InputText v-model="value1" placeholder="Search" />
         </IconField>
@@ -67,7 +67,7 @@ export default {
                 composition: `
 <template>
     <div class="card flex flex-wrap justify-content-center gap-3">
-        <IconField iconPosition="left">
+        <IconField>
             <InputIcon class="pi pi-search"> </InputIcon>
             <InputText v-model="value1" placeholder="Search" />
         </IconField>
diff --git a/doc/iconfield/TemplateDoc.vue b/doc/iconfield/TemplateDoc.vue
index 2b87a55fd..067d67f30 100644
--- a/doc/iconfield/TemplateDoc.vue
+++ b/doc/iconfield/TemplateDoc.vue
@@ -3,7 +3,7 @@
         <p>Custom content inside an InputIcon is defined as children.</p>
     </DocSectionText>
     <div class="card flex justify-content-center">
-        <IconField iconPosition="left">
+        <IconField>
             <InputIcon>
                 <svg width="14" height="16" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
                     <path
@@ -29,7 +29,7 @@ export default {
             value: null,
             code: {
                 basic: `
-<IconField iconPosition="left">
+<IconField>
     <InputIcon>
         <svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
             <path d="..." fill="var(--p-primary-color)" />
@@ -42,7 +42,7 @@ export default {
                 options: `
 <template>
     <div class="card flex justify-content-center">
-        <IconField iconPosition="left">
+        <IconField>
             <InputIcon>
                 <svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
                     <path d="..." fill="var(--p-primary-color)" />
@@ -67,7 +67,7 @@ export default {
                 composition: `
 <template>
     <div class="card flex justify-content-center">
-        <IconField iconPosition="left">
+        <IconField>
             <InputIcon>
                 <svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
                     <path d="..." fill="var(--p-primary-color)" />