v1.0.0

New Features

---

• ModalElement demo
• Global
  • Added multi language support: override window.__wupln (to dynamic change) or global __wupln during the compilation (for static change)
  • Added css variable --base-margin to unify margins for all elements
  • Added support HTML intellisense for WebStorm (no action required from developer/user side)
• helper focusFirst. Added option isFocusLast & static querySelector (possible to get from focusFirst.$selector)
• FormElement
  • Increased height of button[type=submit]
  • Added callback $onSubmitEnd & event $submitEnd
  • Added public method $submit() for manual calling
  • Web Accessibility: auto-tie with closest heading via aria-labelledby
• Text based controls
  • Added css variable --ctrl-label-active-pos to simplify customization of label position
• SelectControl. SelectManyControl. Improved handling promise rejection in $options.items
• SelectManyControl. Added scrolling style & restricted max-height by default

Fixes

---

• helper findScrollParent. Returns parent despite on parent.child with position-fixed
• helper promiseWait. Throws error twice instead of 1 time
• PopupElement. Popup hidden if target inside content with position: fixed and target.parent.parent is scrollable
• DropdownElement. Target button is overflowed by menu in animation-stack
• PasswordControl. Input height is changed on button[eye] click
• Text based controls
  • Sometimes weird blink & poor render during the animation on focus
  • Button clear changes control size on hover if parent is flexbox
• SelectControl. SelectManyControl. storageKey + items as Promise don't work together
• CircleElement. Update options/items colors triggers animated re-render with blink

BREAKING CHANGES

---

• Global.

  • Added static .$use(). Call it before using element: WUPTextControl.$use() (self-registration by import works now and will be removed in the future)

  • Renamed css-vars:
    --ctrl-select-menu-hover >>> --menu-hover-bg
--anim-time >>> --anim-t
--popup >>> popup-text
--popup-anim >>> popup-anim-t
--tooltip >>> tooltip-text
--spin-speed >>> spin-t
--btn-submit >>> --btn-submit-text
--ctrl >>> --ctrl-text
--ctrl-clr-width >>> --ctrl-clr-w
--ctrl-select-item >>> --ctrl-select-item-text
--ctrl-time-off >>> --ctrl-time-off-text
--ctrl-select-menu-hover >>> --menu-hover-bg

  • Refactored & unified custom events. Now every event contains detail as object: e.detail = { ... }

• PopupElement

  • z-index is changed from 90000 to 8000
  • Renamed show/hide to open/close (the same for DropdownElement):
    enum ShowCases >>> PopupShowCases
    enum HideCases >>> PopupHideCases
    option showCase >>> openCase
    method $show() >>> $open()
    method $hide() >>> $close()
    state-prop $isShown >>> $isOpened
    event $onShown >>> $onOpened
    etc.
  • Refactored/normalized enum PopupShowCases

• Combobox controls (Select, SelectMany, Date, Time)

  • Renamed show/hide to open/close:
    enum ShowCases >>> MenuShowCases
    enum HideCases >>> MenuHideCases
    event $showMenu >>> $openMenu
    event $hideMenu >>> $closeMenu
    etc.