fix(*): fix components affected by klabel [KHCP-8987]

Kong · Oct 13, 2023 · 3f1c224 · 3f1c224
1 parent 7f6c548
commit 3f1c224
Show file tree

Hide file tree

Showing 7 changed files with 25 additions and 25 deletions.
diff --git a/src/components/KFileUpload/KFileUpload.cy.ts b/src/components/KFileUpload/KFileUpload.cy.ts
@@ -11,7 +11,7 @@ describe('KFileUpload', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', text)
+    cy.get('.k-label').should('contain.text', text)
   })
 
   it('remove-button should not exist if there is no selected file', () => {
@@ -42,13 +42,13 @@ describe('KFileUpload', () => {
         testMode: true,
         label: labelText,
         labelAttributes: {
-          help: 'random text',
+          info: 'random text',
         },
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', labelText)
-    cy.get('.k-input-label .kong-icon-help').should('be.visible')
+    cy.get('.k-label').should('contain.text', labelText)
+    cy.get('.k-label .tooltip-trigger-icon').should('be.visible')
   })
 
   it('does not render cancel button, if removable is false', () => {

diff --git a/src/components/KInput/KInput.cy.ts b/src/components/KInput/KInput.cy.ts
@@ -57,7 +57,7 @@ describe('KInput', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', label)
+    cy.get('.k-label').should('contain.text', label)
   })
 
   it('renders label with labelAttributes applied', () => {
@@ -67,13 +67,13 @@ describe('KInput', () => {
         testMode: true,
         label,
         labelAttributes: {
-          help: 'some help text',
+          info: 'some info text',
         },
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', label)
-    cy.get('.k-input-label .kong-icon-help').should('exist').and('be.visible')
+    cy.get('.k-label').should('contain.text', label)
+    cy.get('.k-label .tooltip-trigger-icon').should('exist').and('be.visible')
   })
 
   it('renders label and tooltip with `label-tooltip` slot applied', () => {
@@ -88,8 +88,8 @@ describe('KInput', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', label)
-    cy.get('.k-input-label .kong-icon-infoFilled').should('exist').and('be.visible')
+    cy.get('.k-label').should('contain.text', label)
+    cy.get('.k-label .tooltip-trigger-icon').should('exist').and('be.visible')
   })
 
   it('renders overlayed label when value is passed', () => {

diff --git a/src/components/KInput/KInput.vue b/src/components/KInput/KInput.vue
@@ -204,7 +204,7 @@ const isReadonly = computed((): boolean => attrs?.readonly !== undefined && Stri
 const isRequired = computed((): boolean => attrs?.required !== undefined && String(attrs?.required) !== 'false')
 const inputId = computed((): string => attrs.id ? String(attrs.id) : props.testMode ? 'test-input-id-1234' : uuidv4())
 const strippedLabel = computed((): string => stripRequiredLabel(props.label, isRequired.value))
-const hasLabelTooltip = computed((): boolean => !!(props.labelAttributes?.help || props.labelAttributes?.info || slots['label-tooltip']))
+const hasLabelTooltip = computed((): boolean => !!(props.labelAttributes?.info || slots['label-tooltip']))
 // we need this so we can create a watcher for programmatic changes to the modelValue
 const value = computed({
   get(): string | number {

diff --git a/src/components/KMultiselect/KMultiselect.cy.ts b/src/components/KMultiselect/KMultiselect.cy.ts
@@ -114,7 +114,7 @@ describe('KMultiselect', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', labelText)
+    cy.get('.k-label').should('contain.text', labelText)
   })
 
   it('renders label with labelAttributes applied', () => {
@@ -124,7 +124,7 @@ describe('KMultiselect', () => {
         testMode: true,
         label: labelText,
         labelAttributes: {
-          help: 'some help text',
+          info: 'some info text',
         },
         items: [{
           label: 'Label 1',
@@ -133,8 +133,8 @@ describe('KMultiselect', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', labelText)
-    cy.get('.k-input-label .kong-icon-help').should('be.visible')
+    cy.get('.k-label').should('contain.text', labelText)
+    cy.get('.k-label .tooltip-trigger-icon').should('be.visible')
   })
 
   it('reacts to text change and select', () => {

diff --git a/src/components/KSelect/KSelect.cy.ts b/src/components/KSelect/KSelect.cy.ts
@@ -97,7 +97,7 @@ describe('KSelect', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', labelText)
+    cy.get('.k-label').should('contain.text', labelText)
   })
 
   it('renders label with labelAttributes applied', () => {
@@ -107,7 +107,7 @@ describe('KSelect', () => {
         testMode: true,
         label: labelText,
         labelAttributes: {
-          help: 'some help text',
+          info: 'some info text',
         },
         items: [{
           label: 'Label 1',
@@ -116,8 +116,8 @@ describe('KSelect', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', labelText)
-    cy.get('.k-input-label .kong-icon-help').should('be.visible')
+    cy.get('.k-label').should('contain.text', labelText)
+    cy.get('.k-label .tooltip-trigger-icon').should('be.visible')
   })
 
   it('renders an asterisk when `overlayLabel` is true and `required` attr is set', () => {

diff --git a/src/components/KStepper/KStep.vue b/src/components/KStepper/KStep.vue
@@ -86,7 +86,7 @@ const labelStyle = computed(() => {
       padding-top: var(--kui-space-50, $kui-space-50);
       text-align: center;
 
-      :deep(.k-input-label) {
+      :deep(.k-label) {
         color: var(--kui-color-text-neutral, $kui-color-text-neutral);
         font-size: var(--kui-font-size-40, $kui-font-size-40);
         font-weight: var(--kui-font-weight-medium, $kui-font-weight-medium);
@@ -121,7 +121,7 @@ const labelStyle = computed(() => {
 <style lang="scss">
 .k-step {
   .k-step-label {
-    &.error .k-input-label {
+    &.error .k-label {
       color: var(--kui-color-text-danger, $kui-color-text-danger);
     }
   }

diff --git a/src/components/KTextArea/KTextArea.cy.ts b/src/components/KTextArea/KTextArea.cy.ts
@@ -32,7 +32,7 @@ describe('KTextArea', () => {
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', labelText)
+    cy.get('.k-label').should('contain.text', labelText)
   })
 
   it('renders label with labelAttributes applied', () => {
@@ -42,13 +42,13 @@ describe('KTextArea', () => {
         testMode: true,
         label: labelText,
         labelAttributes: {
-          help: 'some help text',
+          info: 'some help text',
         },
       },
     })
 
-    cy.get('.k-input-label').should('contain.text', labelText)
-    cy.get('.k-input-label .kong-icon-help').should('be.visible')
+    cy.get('.k-label').should('contain.text', labelText)
+    cy.get('.k-label .tooltip-trigger-icon').should('be.visible')
   })
 
   it('renders overlayed label when value is passed', () => {