@ewc-lib/ewc-popovers

EWC popover components

This is a monorepo, containing two different EWCL popover components.

The links below provide detailled information about each component.

• ewc-popover
  • This popover opens below, above, left or right of a HTML element, depending on location and available space.
• ewc-popover-sharing
  • A popover presenting social media share links for Facebook, X, LinkedIn, Email und Embed - in that order. It extends ewc-popover.

Each component provides working usage examples for two contexts: WebPack and VanillaJS.

Notes

Accessibility

The components are designed with accessibility in mind:

• Proper semantic HTML structure
• Keyboard navigable elements
• Sufficient color contrast
• Screen reader friendly with appropriate ARIA attributes

Browser Support

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)

License

European Union Public License (EUPL)

Changelog pre monorepo

Before the 2 popover components were grouped together into this monorepo, they each had their own changelog. They are listed below.

Changelog ewc-popover

• 1.0.3-alpha

  • a11y: add role="dialog"
  • [test-important] this line is just a test for VisHealth

• 1.0.2-alpha

  • add "Change log" to readme.md

• 1.0.1-alpha

  • (addendum to prev. vers.) remove accidental console output

• 1.0.0-alpha

  • replace dependency to ewc.css w/ dependency to ewc-common
  • put HTML into shadow DOM
  • add usage examples (working sourcecode)

• 0.2.5-alpha

  • add keyboard functionality (a11y)

Changelog ewc-popover-sharing

• 1.1.3-beta

  • a11y: correction of aria-labelledby

• 1.1.2-beta

  • fix: issue in opener.js for X "lang=unknown"

• 1.1.1-beta

  • promote to beta
  • fix: issue in opener.js "lang=unknown"

• 1.1.0-alpha

  • html structure: change button to link,
  • use aria-labelledby
  • document recommended usage of "aria-controls" attribute

• 1.0.4-alpha

  • a11y: add role="dialog"
  • aria label and focus outline

• 1.0.3-alpha

  • fix broken webpack usage-example

• 1.0.2-alpha

  • add "Change log" to readme.md

• 1.0.1-alpha

  • (addendum to prev. vers.) update documentation
  • use HTML "button" instead of "a" for list elements (a11y)
  • thin version of embed icon
  • add usage example for "opener"-functionality

• 1.0.0-alpha

  • replace dependency to ewc.css w/ dependency to ewc-common
  • put HTML into shadow DOM
  • add usage examples (working sourcecode)

Changelog

• 2.0.0-beta

  • initial version of monorepo, containing 2 former singlerepos

• 2.0.1-beta

  • bugfix: wrong focus after escape-key close
  • a11y markup
  • adapt tests

• 2.0.2-beta

  • version info

• 2.0.3-beta

  • focus wrap for tab key