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

fix(accordion): restore accordion-items working with accordion across shadow DOM #7466

Merged
merged 3 commits into from
Aug 7, 2023
Merged

fix(accordion): restore accordion-items working with accordion across shadow DOM #7466

merged 3 commits into from
Aug 7, 2023

Conversation

jcfranco
Copy link
Member

@jcfranco jcfranco commented Aug 5, 2023 •
edited
Loading

Related Issue: #7448

Summary

This updates accordion to sync its children's properties across shadow boundaries via events.

@github-actions github-actions bot added the bug Bug reports for broken functionality. Issues should include a reproduction of the bug. label Aug 5, 2023
driskull
driskull reviewed Aug 5, 2023
View reviewed changes
packages/calcite-components/src/components/accordion-item/accordion-item.tsx
@@ -243,12 +241,35 @@ export class AccordionItem implements ConditionalSlotComponent {

@Listen("calciteInternalAccordionChange", { target: "body" })
Copy link
Member

Choose a reason for hiding this comment

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

maybe this one should be targeted to document for consistency? 👍

Copy link
Member

Choose a reason for hiding this comment

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

or vice versa?

Copy link
Member Author

Choose a reason for hiding this comment

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

I'll create an issue to audit all listeners not targeting the element itself and possibly define some guidelines. I think document makes sense for a direct custom event bus where we don't need capturing nor bubbling.

@jcfranco jcfranco requested a review from Elijbet August 7, 2023 15:36
@jcfranco jcfranco marked this pull request as ready for review August 7, 2023 15:49
@jcfranco jcfranco requested a review from a team as a code owner August 7, 2023 15:49
@jcfranco jcfranco added the pr ready for visual snapshots Adding this label will run visual snapshot testing. label Aug 7, 2023
driskull
driskull approved these changes Aug 7, 2023
View reviewed changes
Copy link
Member

@driskull driskull left a comment

Choose a reason for hiding this comment

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

👍 🥼 🔬 👀 Looks good

@jcfranco jcfranco mentioned this pull request Aug 7, 2023
Open
2 tasks
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Aug 7, 2023
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Aug 7, 2023
driskull
driskull approved these changes Aug 7, 2023
View reviewed changes
Copy link
Member

@driskull driskull left a comment

Choose a reason for hiding this comment

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

👍 Looks good!

packages/calcite-components/src/components/accordion-item/accordion-item.tsx
const [accordion] = event.composedPath();
const accordionItem = this.el;

const willBeSyncedByDirectParent = accordionItem.parentElement === accordion;
Copy link
Member

Choose a reason for hiding this comment

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

I think the name for this const is great but maybe a link to an issue or more info might be useful in a comment. What do you think?

Ideally, we can just do things one way and this will be cleaned up in the future.

Copy link
Member Author

Choose a reason for hiding this comment

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

Good idea. I'll submit a follow-up PR for this to expedite this fix landing.

@jcfranco jcfranco merged commit bedb5db into main Aug 7, 2023
@jcfranco jcfranco deleted the jcfranco/7448-fix-accordion-items-working-across-shadow-dom branch August 7, 2023 18:50
@github-actions github-actions bot added this to the 1.5.1 patch - Bugs only milestone Aug 7, 2023
@calcite-admin calcite-admin mentioned this pull request Aug 7, 2023
Merged
@jcfranco jcfranco mentioned this pull request Aug 7, 2023
Merged
jcfranco added a commit that referenced this pull request Aug 7, 2023
@jcfranco
chore(accordion-item): add more info about accordion item sync (#7473)
18022ce 
**Related Issue:**
#7466 (comment)

## Summary

✨📚✨
benelan pushed a commit that referenced this pull request Aug 8, 2023
@calcite-admin @github-actions
chore: release main (#7447)
aaa6c6b 
🤖 I have created a release *beep* *boop*
---


<details><summary>@esri/calcite-components: 1.5.1</summary>

##
[1.5.1](https://github.com/Esri/calcite-design-system/compare/@esri/[email protected]...@esri/[email protected])
(2023-08-08)


### Bug Fixes

* **accordion:** Restore accordion-items working with accordion across
shadow DOM
([#7466](#7466))
([bedb5db](bedb5db))
* **action-bar, action-pad:** Add native tooltip to expand action
([#7452](#7452))
([9673ef7](9673ef7))
* Fix SSR build error caused by browser-sniffing util
([#7461](#7461))
([e5381fa](e5381fa))
* **flow-item:** Use a native tooltip for the back button
([#7442](#7442))
([f38167b](f38167b))
* **input:** Fix clearable from throwing an error when value is
undefined
([#7476](#7476))
([633c2cd](633c2cd))
* **list:** Add missing drag handle locale strings
([#7462](#7462))
([2b5463e](2b5463e))
* **panel:** Add native tooltip to close button.
([#7434](#7434))
([70b45cf](70b45cf))
* **panel:** Allow panel content to take full height.
([#7454](#7454))
([b6bf54f](b6bf54f))
* **panel:** Correct header and action-bar z-indexing display issues
([#7440](#7440))
([db7eac7](db7eac7))
* **slider:** Numbers remain on one line for locales with space group
separators
([#7472](#7472))
([2747b22](2747b22))
</details>

<details><summary>@esri/calcite-components-react: 1.5.1</summary>

##
[1.5.1](https://github.com/Esri/calcite-design-system/compare/@esri/[email protected]...@esri/[email protected])
(2023-08-08)


### Miscellaneous Chores

* **@esri/calcite-components-react:** Synchronize undefined versions


### Dependencies

* The following workspace dependencies were updated
  * dependencies
    * @esri/calcite-components bumped from ^1.5.1-next.4 to ^1.5.1
</details>

---
This PR was generated with [Release
Please](https://github.com/googleapis/release-please). See
[documentation](https://github.com/googleapis/release-please#release-please).

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@driskull driskull driskull approved these changes

@Elijbet Elijbet Awaiting requested review from Elijbet

Assignees

@jcfranco jcfranco

Labels
bug Bug reports for broken functionality. Issues should include a reproduction of the bug. pr ready for visual snapshots Adding this label will run visual snapshot testing.
Projects
None yet
Milestone
1.5.1 patch - Bugs only
Development

Successfully merging this pull request may close these issues.
2 participants
@jcfranco @driskull