Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(tab-select): initial implementation for tab select *experimental* #1187

Merged
merged 4 commits into from
Jul 10, 2018

Conversation

emoralesb05
Copy link
Contributor

@emoralesb05 emoralesb05 commented Jul 5, 2018

Description

First pass on tab select component and will be treated as experimental while we use it in multiple products to ensure quality.

Usage:

<td-tab-select [value]="myValue"
                [backgroundColor]="'primary'"
                [color]="'accent'"
                [disabled]="false"
                [disabledRipple]="false"
                (valueChange)="myValue = $event">
  <td-tab-option [value]="1" [disabled]="false">Label 1</td-tab-option>
  <td-tab-option [value]="2">Label 2</td-tab-option>
  <td-tab-option [value]="3" [disabled]="true">Label 3</td-tab-option>
</td-tab-select>

What's included?

  • README.md
  • CovalentTabSelectModule with TdTabSelectComponent and TdTabOptionComponent
  • Usage on test bed
  • Added in experimental

Test Steps

  • npm run serve:test-bed
  • See it work

General Tests for Every PR

  • npm run serve:prod still works.
  • npm run tslint passes.
  • npm run stylelint passes.
  • npm test passes and code coverage is not lower.
  • npm run build:lib still works.
Screenshots or link to StackBlitz/Plunker

image

closes #1178

first pass on tab select component and will be treated as experimental while we use it in multiple products to ensure quality
@@ -0,0 +1,3 @@
<ng-template>
<ng-content></ng-content>
</ng-template>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will the extra special characters cause any problems?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe these aren't a problem...I see them on test-bed.component.html as well.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what extra special characters?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Weird....they are gone now.

+ Disables ripple effect on component.
+ color?: ThemePalette
+ Color of the tab group.
+ backgroundColor: ThemePalette
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is backgroundColor optional or required?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

good catch

@jennmedellin jennmedellin self-requested a review July 6, 2018 21:11
MY LABEL 3
</td-tab-option>
</td-tab-select>
</div>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But still down here. ;-)

screen shot 2018-07-06 at 2 13 03 pm

MY LABEL 3
</td-tab-option>
</td-tab-select>
</div>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no example with disabledRipple, do we care?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

added~

Copy link
Collaborator

@jennmedellin jennmedellin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

UX LGTM

@emoralesb05 emoralesb05 merged commit 66503a9 into develop Jul 10, 2018
@emoralesb05 emoralesb05 deleted the feature/feat/tab-select branch July 10, 2018 21:08
@kyleledbetter
Copy link
Contributor

mat-stretch-tabs would be a nice addition

@emoralesb05
Copy link
Contributor Author

Will be taken care of in #1191

@emoralesb05 emoralesb05 self-assigned this Jul 15, 2018
@jeremysmartt jeremysmartt added this to the Release 2.0.0 milestone Jul 16, 2018
kriswinbush pushed a commit to kriswinbush/covalent that referenced this pull request Feb 20, 2020
Teradata#1187)

* feat(tab-select): initial implementation for tab select *experimental*

first pass on tab select component and will be treated as experimental while we use it in multiple products to ensure quality

* docs(tab-select): make backgroundColor optional in README

* chore(tab-select): add initial set of unit tests

* feat(): add disabled ripple on tabs for test-bed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Feature] - Tab Select
5 participants