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.

Sign up for GitHub

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

Jump to bottom

chore(storybook): add stories for header for smaller screens #977

Open
wants to merge 25 commits into
base: main
Choose a base branch
from
Open

chore(storybook): add stories for header for smaller screens #977

wants to merge 25 commits into from

Conversation

mivaylo
Copy link
Contributor

@mivaylo mivaylo commented Oct 2, 2023 •
edited
Loading

PR Checklist

Please check if your PR fulfills the following requirements:

  • Tests for the changes have been added (for bug fixes / features)
  • Docs have been added / updated (for bug fixes / features)
  • If applicable, have a visual design approval

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Other... Please describe:

What is the current behavior?

Issue Number: N/A

What is the new behavior?

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

@github-actions
Copy link
Contributor

github-actions bot commented Oct 2, 2023 •
edited
Loading

👋 @mivaylo,

Thank you,

🤖 Clarity Release Bot

@github-actions
Copy link
Contributor

github-actions bot commented Oct 2, 2023

This PR introduces visual changes: 4a5a99e
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git 4a5a99eff964940cd2ef07eeaa7117be8a481d3a
git cherry-pick 4a5a99eff964940cd2ef07eeaa7117be8a481d3a
git push

@github-actions
Copy link
Contributor

github-actions bot commented Oct 2, 2023

This PR introduces visual changes: 6cf0b8d
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git 6cf0b8d7af5e6a5fe57b7d3a2292d5912b09f6a2
git cherry-pick 6cf0b8d7af5e6a5fe57b7d3a2292d5912b09f6a2
git push

@github-actions
Copy link
Contributor

github-actions bot commented Oct 3, 2023

This PR introduces visual changes: 65756db
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git 65756db56138c3401f270f85dfbdb5046c976ef1
git cherry-pick 65756db56138c3401f270f85dfbdb5046c976ef1
git push

@valentin-mladenov
fix(alert): remove hostBinding and use renderer for alert-hidden class (
534dcc1 
#976)

## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?
Using HostBinding for `alert-hidden` class Angular throws expression
changed error which creates problems for unit tests in user projects

Issue Number: CDE-1249

## What is the new behavior?
Using `renderer` to set `alert-hidden` class on the host element
manually which doesn’t have issues with change detection.

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information
@mivaylo
Copy link
Contributor Author

mivaylo commented Oct 4, 2023

Setting the PR to draft as I would like to check why playwright is not making the snapshots in the new viewport

@mivaylo mivaylo marked this pull request as draft October 4, 2023 08:22
jerone and others added 10 commits October 4, 2023 13:11
@jerone
chore: add v16 to issue template (#974)
aa69d8b 
- Add v16 to issue template.
- And clean up some inconsistencies.
@williamernest @web-flow
fix(modal): update title font-family variable (#981)
656ca9b 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

The current variable is using Metropolis, because the variable is
computed at the root level and is not recomputing when the cds-theme
level changes the header font family above unless redeclared.

Issue Number: Related to CDE-1283

## What is the new behavior?

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information

---------

Co-authored-by: GitHub <[email protected]>
@williamernest
fix(card): update card header to correct font-weight (#980)
514432c 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

Since the title-font-weight value is not redeclared in the shim, the
root value is computed and used.

Issue Number: CDE-1283

## What is the new behavior?

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information
@williamernest @web-flow
fix(header): add correct header title font-weight value (#979)
984d6ec 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

Since the title-font-weight variable isn't redeclared, it's not
recomputed and the original value from the root scope is used.

<!-- Please describe the current behavior that you are modifying, or
link to a relevant issue. -->

Issue Number: Related to CDE-1283

## What is the new behavior?

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information

---------

Co-authored-by: GitHub <[email protected]>
@williamernest @web-flow
chore(storybook): refactor signpost stories to csf (#943)
7e5f164 
Refactors the signpost to a standard CSFv3 story.

---------

Co-authored-by: GitHub <[email protected]>
@williamernest
fix(accordion): update event type and add descriptions (#1005)
e7efe73 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [x] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [x] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

The EventEmitter type was missing. This isn't a big issue for developers
as the type is easily inferred, but the Storybook Docs tab doesn't infer
the correct type.

Issue Number: N/A

## What is the new behavior?

The correct type is specified, and descriptions are added to
inputs/outputs to be parsed by Storybook.

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information
@williamernest @web-flow
chore(accordion): update storybook stories to csfv3 (#996)
9f26b10 
Updates the accordion stories to follow CSFv3. Adds individual stories
for multiple configurations. Adds inline comments/type in component to
ensure a description and appropriate type is used in storybook docs
mode.

---------

Co-authored-by: GitHub <[email protected]>
@williamernest @web-flow
fix(vertical-nav): align nav parent/child left padding (#1000)
a8024dc 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [x] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

Vertical nav parent/child items are not left aligned.

![image](https://github.com/vmware-clarity/ng-clarity/assets/34519388/e8c5bb9e-a303-4d27-b127-c6afae9de9ae)


Issue Number: CDE-1284

## What is the new behavior?

Vertical nav parent/child items are left aligned. 

![image](https://github.com/vmware-clarity/ng-clarity/assets/34519388/f300e960-9933-45ab-83b3-5e4ef27243e5)


## Does this PR introduce a breaking change?

- [ ] Yes
- [ ] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information

---------

Co-authored-by: GitHub <[email protected]>
@mivaylo @web-flow
chore(storybook): add tabs collapsed story to test smaller screens (#969
479f7b3 
)

## PR Checklist

Please check if your PR fulfills the following requirements:

- [x] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [ ] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

<!-- Please describe the current behavior that you are modifying, or
link to a relevant issue. -->

Issue Number: N/A

## What is the new behavior?

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information

---------

Co-authored-by: GitHub <[email protected]>
@valentin-mladenov @web-flow
fix(datagrid): align checkbox with text in datagrid (#1006)
04a12dd 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

Position of checkbox in data grid is not aligned with text.

![image](https://github.com/vmware-clarity/ng-clarity/assets/6692908/b876edd4-fed8-4804-ba8a-613296ed74af)


Issue Number: CDE-1350

## What is the new behavior?

Position of checkbox is centered with text's first line.

![image](https://github.com/vmware-clarity/ng-clarity/assets/6692908/e8e632ef-d186-4eb6-948d-8ab3c617fd11)


## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information

---------

Co-authored-by: GitHub <[email protected]>
@mivaylo mivaylo changed the title chore(storybook): add stories for header for smaller screens chore(storybook): add stories for header for smaller screens ( see PR #1003 ) Oct 18, 2023
@mivaylo mivaylo marked this pull request as ready for review October 18, 2023 15:48
@mivaylo mivaylo changed the title chore(storybook): add stories for header for smaller screens ( see PR #1003 ) PR #123 Oct 18, 2023
@mivaylo mivaylo marked this pull request as draft October 18, 2023 15:50
williamernest and others added 2 commits October 18, 2023 12:48
@williamernest
fix(datagrid): update manage columns dialog close button color (#1008)
0e62fd6 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [X] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

The close icon on the manage columns dialog has an insufficient color
contrast ratio.

![image](https://github.com/vmware-clarity/ng-clarity/assets/34519388/db04f37c-04a5-4bde-a833-413e4f736d11)

Issue Number: CDE-1099

## What is the new behavior?

The color has been updated to align with the spec. 
<img width="262" alt="image"
src="https://github.com/vmware-clarity/ng-clarity/assets/34519388/e6eaa8fc-e745-4389-ae55-8507cfc09986">


## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information
@williamernest @web-flow
chore(vertical-nav): update routing story to include all top level it…
33d25ed 
…ems (#1019)

Updates the routing vertical-nav story to include all top-level item
types (links without a group, links with a group, buttons with a group).

---------

Co-authored-by: GitHub <[email protected]>
@mivaylo mivaylo changed the title PR #123 chore(storybook): add stories for header for smaller screens Oct 27, 2023
@mivaylo mivaylo self-assigned this Oct 27, 2023
@mivaylo mivaylo requested a review from a team October 27, 2023 21:05
@mivaylo mivaylo marked this pull request as ready for review October 27, 2023 21:05
@mivaylo
Copy link
Contributor Author

mivaylo commented Oct 27, 2023

Undrafting the PR as we have a separate ticket for addressing the playwright issue

@valentin-mladenov
fix(label): remove has pseudo class selector (port of #1020) (#1024)
5ce535b 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [x] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

<!-- Please describe the current behavior that you are modifying, or
link to a relevant issue. -->

Issue Number: CDE-1356

## What is the new behavior?

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information
@mivaylo mivaylo force-pushed the add-story-for-header-navigation branch from 287532b to b6b0caf Compare October 31, 2023 09:03
@github-actions
Copy link
Contributor

This PR introduces visual changes: 80aa903
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git 80aa9030cdcaa23cb3cc03eaf32307861fdf0a2d
git cherry-pick 80aa9030cdcaa23cb3cc03eaf32307861fdf0a2d
git push

@github-actions
Copy link
Contributor

This PR introduces visual changes: 4296c6c
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git 4296c6c7f148dee11e72ae6a93b04a8b6e03a4c8
git cherry-pick 4296c6c7f148dee11e72ae6a93b04a8b6e03a4c8
git push

@github-actions
Copy link
Contributor

This PR introduces visual changes: 6ebee77
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git 6ebee77e490fd8c067a8d94e1f6aa91be67bd2c2
git cherry-pick 6ebee77e490fd8c067a8d94e1f6aa91be67bd2c2
git push

@github-actions
Copy link
Contributor

This PR introduces visual changes: d9699bc
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git d9699bc6d13821f8be2b0d49d59b5e177850b9b6
git cherry-pick d9699bc6d13821f8be2b0d49d59b5e177850b9b6
git push

@github-actions
Copy link
Contributor

This PR introduces visual changes: a966fd3
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git a966fd3d9dc94084e2add1420c932a724e57b82c
git cherry-pick a966fd3d9dc94084e2add1420c932a724e57b82c
git push

valentin-mladenov and others added 3 commits October 31, 2023 14:07
@valentin-mladenov
fix(tree-view): remove has css selector (port of #1020) (#1023)
ec575aa 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [x] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

<!-- Please describe the current behavior that you are modifying, or
link to a relevant issue. -->

Issue Number: CDE-1355

## What is the new behavior?

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information
@dtsanevmw
fix(signpost): allow keyboard scrolling in overflow content (#1027)
0164f85 
## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [X] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

When you open a signpost with a scroll you can't use keyboard due to
missing focus on the content.

<!-- Please describe the current behavior that you are modifying, or
link to a relevant issue. -->

Issue Number: CDE-1397

## What is the new behavior?

Now you can focus the content and scroll freely with the keyboard.

## Does this PR introduce a breaking change?

- [ ] Yes
- [X] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information
@mivaylo
Merge branch 'main' into add-story-for-header-navigation
a2c8dbd
@github-actions GitHub Actions
Copy link
Contributor

This PR introduces visual changes: 257b82b
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git 257b82b369e804a7752028da8d794edec81b1aa9
git cherry-pick 257b82b369e804a7752028da8d794edec81b1aa9
git push

@github-actions GitHub Actions
Copy link
Contributor

This PR introduces visual changes: a74c8c6
If these changes are intended and correct, please cherry-pick the above commit to this PR.

git checkout add-story-for-header-navigation
git fetch https://github.com/vmware-clarity/ng-clarity.git a74c8c61c93baccea7dc20d5b4f13049a3101ee4
git cherry-pick a74c8c61c93baccea7dc20d5b4f13049a3101ee4
git push

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees

@mivaylo mivaylo

Labels
cla-not-required flag:stale
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
7 participants
@mivaylo @vmwclabot @valentin-mladenov @jerone @williamernest @web-flow @dtsanevmw