Create a new custom element called Popup (tagname: nosto-popup)

Attributes

• name - optional name used in analytics
• segment - optional Nosto segment that acts as a precondition for activation

connectedCallback behaviour

• create a shadow root with two slots (default and ribbon)
• default slot is wrapped in a dialog
• ribbon is wrapped in bottom right positioned ribbon

State handling

• Popup custom element should listen to click events from the shadow root
• it the target element has n-close attribute:
  • close the popup permanently and store closed state into local storage as nosto:web-components:popup: = closed
• if the target element has n-ribbon attribute:
• close the popup dialog, show ribbon and store info local storage as nosto:web-components:popup: = ribbon