JAVASCRIPT   19

popover js

Guest on 6th July 2022 01:07:30 AM

  1. /**
  2.  * --------------------------------------------------------------------------
  3.  * Bootstrap (v4.3.1): popover.js
  4.  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  5.  * --------------------------------------------------------------------------
  6.  */
  7.  
  8. import $ from 'jquery'
  9. import Tooltip from './tooltip'
  10.  
  11. /**
  12.  * ------------------------------------------------------------------------
  13.  * Constants
  14.  * ------------------------------------------------------------------------
  15.  */
  16.  
  17. const NAME                = 'popover'
  18. const VERSION             = '4.3.1'
  19. const DATA_KEY            = 'bs.popover'
  20. const EVENT_KEY           = `.${DATA_KEY}`
  21. const JQUERY_NO_CONFLICT  = $.fn[NAME]
  22. const CLASS_PREFIX        = 'bs-popover'
  23. const BSCLS_PREFIX_REGEX  = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g')
  24.  
  25. const Default = {
  26.   ...Tooltip.Default,
  27.   placement : 'right',
  28.   trigger   : 'click',
  29.   content   : '',
  30.   template  : '<div class="popover" role="tooltip">' +
  31.               '<div class="arrow"></div>' +
  32.               '<h3 class="popover-header"></h3>' +
  33.               '<div class="popover-body"></div></div>'
  34. }
  35.  
  36. const DefaultType = {
  37.   ...Tooltip.DefaultType,
  38.   content : '(string|element|function)'
  39. }
  40.  
  41. const ClassName = {
  42.   FADE : 'fade',
  43.   SHOW : 'show'
  44. }
  45.  
  46. const Selector = {
  47.   TITLE   : '.popover-header',
  48.   CONTENT : '.popover-body'
  49. }
  50.  
  51. const Event = {
  52.   HIDE       : `hide${EVENT_KEY}`,
  53.   HIDDEN     : `hidden${EVENT_KEY}`,
  54.   SHOW       : `show${EVENT_KEY}`,
  55.   SHOWN      : `shown${EVENT_KEY}`,
  56.   INSERTED   : `inserted${EVENT_KEY}`,
  57.   CLICK      : `click${EVENT_KEY}`,
  58.   FOCUSIN    : `focusin${EVENT_KEY}`,
  59.   FOCUSOUT   : `focusout${EVENT_KEY}`,
  60.   MOUSEENTER : `mouseenter${EVENT_KEY}`,
  61.   MOUSELEAVE : `mouseleave${EVENT_KEY}`
  62. }
  63.  
  64. /**
  65.  * ------------------------------------------------------------------------
  66.  * Class Definition
  67.  * ------------------------------------------------------------------------
  68.  */
  69.  
  70. class Popover extends Tooltip {
  71.   // Getters
  72.  
  73.   static get VERSION() {
  74.     return VERSION
  75.   }
  76.  
  77.   static get Default() {
  78.     return Default
  79.   }
  80.  
  81.   static get NAME() {
  82.     return NAME
  83.   }
  84.  
  85.   static get DATA_KEY() {
  86.     return DATA_KEY
  87.   }
  88.  
  89.   static get Event() {
  90.     return Event
  91.   }
  92.  
  93.   static get EVENT_KEY() {
  94.     return EVENT_KEY
  95.   }
  96.  
  97.   static get DefaultType() {
  98.     return DefaultType
  99.   }
  100.  
  101.   // Overrides
  102.  
  103.   isWithContent() {
  104.     return this.getTitle() || this._getContent()
  105.   }
  106.  
  107.   addAttachmentClass(attachment) {
  108.     $(this.getTipElement()).addClass(`${CLASS_PREFIX}-${attachment}`)
  109.   }
  110.  
  111.   getTipElement() {
  112.     this.tip = this.tip || $(this.config.template)[0]
  113.     return this.tip
  114.   }
  115.  
  116.   setContent() {
  117.     const $tip = $(this.getTipElement())
  118.  
  119.     // We use append for html objects to maintain js events
  120.     this.setElementContent($tip.find(Selector.TITLE), this.getTitle())
  121.     let content = this._getContent()
  122.     if (typeof content === 'function') {
  123.       content = content.call(this.element)
  124.     }
  125.     this.setElementContent($tip.find(Selector.CONTENT), content)
  126.  
  127.     $tip.removeClass(`${ClassName.FADE} ${ClassName.SHOW}`)
  128.   }
  129.  
  130.   // Private
  131.  
  132.   _getContent() {
  133.     return this.element.getAttribute('data-content') ||
  134.       this.config.content
  135.   }
  136.  
  137.   _cleanTipClass() {
  138.     const $tip = $(this.getTipElement())
  139.     const tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX)
  140.     if (tabClass !== null && tabClass.length > 0) {
  141.       $tip.removeClass(tabClass.join(''))
  142.     }
  143.   }
  144.  
  145.   // Static
  146.  
  147.   static _jQueryInterface(config) {
  148.     return this.each(function () {
  149.       let data = $(this).data(DATA_KEY)
  150.       const _config = typeof config === 'object' ? config : null
  151.  
  152.       if (!data && /dispose|hide/.test(config)) {
  153.         return
  154.       }
  155.  
  156.       if (!data) {
  157.         data = new Popover(this, _config)
  158.         $(this).data(DATA_KEY, data)
  159.       }
  160.  
  161.       if (typeof config === 'string') {
  162.         if (typeof data[config] === 'undefined') {
  163.           throw new TypeError(`No method named "${config}"`)
  164.         }
  165.         data[config]()
  166.       }
  167.     })
  168.   }
  169. }
  170.  
  171. /**
  172.  * ------------------------------------------------------------------------
  173.  * jQuery
  174.  * ------------------------------------------------------------------------
  175.  */
  176.  
  177. $.fn[NAME] = Popover._jQueryInterface
  178. $.fn[NAME].Constructor = Popover
  179. $.fn[NAME].noConflict = () => {
  180.   $.fn[NAME] = JQUERY_NO_CONFLICT
  181.   return Popover._jQueryInterface
  182. }
  183.  
  184. export default Popover

Raw Paste


Login or Register to edit or fork this paste. It's free.