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

Ship initial version of popover based on design guidance #9941

Closed
4 of 20 tasks
Tracked by #9864
, #9899 ,  #9463
...
joshblack opened this issue Oct 25, 2021 · 0 comments
Closed
4 of 20 tasks
Tracked by #9864
, #9899 ,  #9463
...

Ship initial version of popover based on design guidance #9941

joshblack opened this issue Oct 25, 2021 · 0 comments
Assignees
@joshblack @dakahn
Milestone
v11 Beta 3

Comments

@joshblack
Copy link
Contributor

joshblack commented Oct 25, 2021 •
edited
Loading

This issue is for bringing Popover over the initial hurdle and stabilizing it for usage in other components.

Checklist

  • Terminology
  • Docs
    • Storybook docs
    • Edits on usage docs
  • Component tokens
    • offset
    • border-radius
    • drop-shadow
    • caret-offset
    • inline and block padding
  • aria-owns for menus
  • Placement
    • Auto placement

Questions

  • How can popover width be tied to grid columns?
  • How would we accomplish a 'tab tip' variant? Would this be an icon button + popover?
  • Should we make it clear that the "UI Trigger" is from a different component in usage?
  • How do we make placement work in RTL? (block/inline terminology)
  • Tab tip -> how would we do the shadow?
  • Should we use placement and alignment as the pop names?
  • Should styles be RTL out of the box?
@joshblack joshblack mentioned this issue Oct 25, 2021
Closed
62 tasks
@joshblack joshblack changed the title Ship initial version of popover based on design guidance @joshblack @dakahn Ship initial version of popover based on design guidance Oct 25, 2021
@joshblack joshblack self-assigned this Oct 25, 2021
@joshblack joshblack mentioned this issue Oct 27, 2021
Merged
@tay1orjones tay1orjones mentioned this issue Nov 1, 2021
Closed
61 tasks
@tay1orjones tay1orjones added this to the v11 Beta 3 milestone Nov 2, 2021
@tay1orjones tay1orjones mentioned this issue Nov 2, 2021
Closed
1 task
kennylam pushed a commit to kennylam/carbon that referenced this issue Jul 30, 2024
@andy-blum
chore(customElementRegistry): add carbonElement decorator (carbon-des…
e34dcc6 
…ign-system#10080)

### Related Ticket(s)

Closes carbon-design-system#9940 

### Description

This PR takes a new approach, and offers some advantages of carbon-design-system#9941.

While the other PR aims to separate class definitions from their registration in the browser, and should work well for teams or projects that wish to _extend_ C4IBM components, it does nothing to solve the problem for teams that are _double-consuming_ C4IBM components. For example, consider the widget team:

- They are building widgets using the react-wrapper version of the components
- When the react component imports the element, it brings along its `customElements.define()` method
- The widget is placed on a page that is already using the C4IBM CDN links, which _also_ bring along the `customElements.define()` method.
- Both the widget script and the CDN link are rolled up into separate scripts and whichever one runs second will encounter the unexpected error, not know how to handle that problem, and halt execution of the script, likely leaving large pieces of setup functionality unprocessed

This new approach offers a method for elements to _attempt_ to define themselves, but to gracefully handle the failure and to continue executing the remainder of the running script. The new decorator is a simple copy/paste from the LitElement `@customElement` decorator, with the `customElements.define` functions wrapped in a try/catch block.

As of right now, this only impacts one component and is simply a proof-of-concept.

### Changelog

**New**

- Adds a `@carbonElement()` decorator to the carbon-web-components package

**Changed**

- Edit the carbon-web-components package's accordion-item component to use @CarbonElement
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@joshblack joshblack

@dakahn dakahn

Labels
None yet
Projects
Design System
Archived in project
Milestone
v11 Beta 3
Development

No branches or pull requests
3 participants
@tay1orjones @joshblack @dakahn