Skip to content

Commit

Permalink
style(textarea): refactor to use utils/label.scss
Browse files Browse the repository at this point in the history
ju-Skinner committed Jan 14, 2025
1 parent 0c5b75f commit 066fec9
Showing 2 changed files with 7 additions and 11 deletions.
9 changes: 1 addition & 8 deletions libs/core/src/components/pds-textarea/pds-textarea.scss
Original file line number Diff line number Diff line change
@@ -6,15 +6,7 @@
display: inline;
}

:host([aria-disabled="true"]) label {
color: var(--pine-color-text-label-disabled);
}

:host([aria-readonly="true"]) {
label {
color: var(--pine-color-text-label-readonly);
}

textarea {
background-color: var(--pine-color-background-container-disabled) ;
color: var(--pine-color-text-readonly);
@@ -59,6 +51,7 @@ label {
}

&.is-invalid {
background-color: var(--pine-input-color-background-danger);
border-color: var(--pine-color-border-danger);

&:focus-visible {
9 changes: 6 additions & 3 deletions libs/core/src/components/pds-textarea/pds-textarea.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';
import { assignDescription, isRequired, messageId } from '../../utils/form';
import { TextareaChangeEventDetail } from './textarea-interface';
import { PdsLabel } from '../_internal/pds-label/pds-label';
import { danger } from '@pine-ds/icons/icons';

@Component({
tag: 'pds-textarea',
styleUrls: ['pds-textarea.scss'],
styleUrls: [
'../../global/styles/utils/label.scss',
'../pds-input/pds-input.tokens.scss',
'pds-textarea.scss'
],
shadow: true,
})
export class PdsTextarea {
@@ -115,7 +118,7 @@ export class PdsTextarea {
>
<div class="pds-textarea">
{this.label &&
<PdsLabel htmlFor={this.componentId} text={this.label} />
<label htmlFor={this.componentId}>{this.label}</label>
}
<textarea
aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}

0 comments on commit 066fec9

Please sign in to comment.