@brightspot/ui 3.0.1-cms-ui-migration.2 → 3.0.1-cms-ui-migration.4

package/src/legacy/tool-ui/src/main/webapp/v4/Entry.js

@@ -1,264 +0,0 @@
-import './Entry.less'
-
-import 'form-request-submit-polyfill'
-import './compat/Fetch'
-import './compat/jquery.js'
-import './compat/requirejs.js'
-
-import '../script/v3'
-import {
-  getFirstAndLastFocusableDescendants,
-  getFocusableDescendants,
-} from '../../../dom/focusable'
-import { trapFocusWithin } from '../../../dom/keyboard'
-import create from './dom/create'
-import onFind from './dom/onFind'
-import onFindOnce from '../../../dom/onFindOnce'
-import onRemove from './dom/onRemove'
-import onVisible from './dom/onVisible'
-import findAll from './dom/findAll'
-import { setupMenuForAria, toggleMenu } from '../../../dom/popupMenu.js'
-
-import './appetizeio/Appetizeio'
-import './Bridge'
-import './Admin'
-import '../../../AnalyticsWidget'
-import './AutoExpand'
-import AutoSubmit from './AutoSubmit'
-import './CheckboxInput'
-import './ColorInput'
-import ComboInput from './ComboInput'
-import './CommunityWidget'
-import './ContentEdit'
-import './ContentLock'
-import './DataTable'
-import './DateStringField'
-import './Form'
-import './ExternalItemAuth'
-import './Hierarchy'
-import './Icon'
-import './ImageEditorBundle'
-import './LinkCarousel'
-import './LinkList'
-import './LinkTable'
-import './Location'
-import './LookingGlass'
-import './Message'
-import './NumberBar'
-import './Page'
-import './PubSub'
-import './QueryField'
-import './RepeatableContentInputGroup'
-import './ContentReporting'
-import './RichTextEditor'
-import './SearchFields'
-import './SearchResult'
-import './SharePreview'
-import { init as InitSortable } from './Sortable'
-import './StyleEmbeddedContent'
-import './StyleguidePresets'
-import TabContainer from './TabContainer'
-import './Taxonomy'
-import './ThemeBundleEditor'
-import './TimedContentBundle'
-import './VideoEditorBundle'
-import './ViewMirror'
-import './ViewPreview'
-import './Widget'
-import './widget/AssignmentContent'
-import './widget/AssignmentDeskDashboard'
-import './widget/AssociatedContentWidget'
-import './widget/BulkUpload'
-import './widget/Calendar'
-import './widget/ClosableWindow'
-import './widget/PitchAssignments'
-import './widget/PitchContent'
-import './widget/Revisions'
-import '../../../Entry'
-
-import Cookies from 'js.cookie'
-
-// So that separate chunks are loaded correctly.
-__webpack_public_path__ = CONTEXT_PATH + 'dist/' // eslint-disable-line camelcase
-
-// Blur when the user uses a mouse to click on something to get rid of the
-// potentially confusing focus styling.
-window.addEventListener('mouseup', (e) => {
-  const target = e.target
-
-  if (target === document.activeElement) {
-    let tag = target.tagName
-
-    if (tag) {
-      tag = tag.toLowerCase()
-
-      if (
-        tag === 'a' ||
-        (tag === 'button' && !target.classList.contains('TabBar-item'))
-      ) {
-        target.blur()
-      }
-    }
-  }
-})
-
-onFind(
-  '.autoSubmit:not(:has(:state(btu-loading))), [data-bsp-autosubmit]:not(:has(:state(btu-loading)))',
-  (element) => {
-    // eslint-disable-next-line no-new
-    new AutoSubmit(element)
-  },
-)
-
-// Convert all plain selects into combo inputs.
-onVisible('select', (select) => {
-  if (!select.isConnected) return
-
-  let modifier = ''
-  /** Blank options in following use cases are used as placeholders
-   * and are not logical options, therefore hidden when list is expanded:
-   * 1. Blank option in content selector dropdowns
-   * 2. Blank option in RCIG-addSelect
-   * 3. Create label in global create shortcut dropdown
-   */
-  if (select.closest('.RCIG-addSelect') || select.closest('.Page-create')) {
-    modifier = 'is-hidePlaceholder'
-  } else if (select.classList.contains('ContentSelector-select')) {
-    const clear = select.parentNode.querySelector('.ContentSelector-clear')
-    if (clear) {
-      modifier = 'is-hidePlaceholder'
-    }
-  }
-  const ci = new ComboInput(select, {
-    getOptionsUrl: (value) => {
-      const optionsUrl = select.getAttribute('data-options-url')
-      if (optionsUrl) {
-        return optionsUrl + encodeURIComponent(value)
-      }
-
-      return null
-    },
-    modifier,
-  })
-
-  onRemove(select, () => {
-    ci.destroy()
-  })
-})
-
-// Add readonly attribute/class to all readonly fields
-onFind('.is-readOnly:not(select)', (readOnly) => {
-  for (const input of findAll(readOnly, 'input, textarea, select')) {
-    if (!input.type.includes('select')) {
-      input.readOnly = true
-    } else {
-      input.classList.add('is-readOnly')
-    }
-  }
-})
-
-// Initialize tabs.
-onVisible('.TC', (container) => {
-  // eslint-disable-next-line no-new
-  new TabContainer(container)
-  container.dispatchEvent(new CustomEvent('tc-loaded', { bubbles: true }))
-})
-
-// Trigger all onFind callbacks immediately on frame load.
-window.addEventListener('brightspot-frame-load', onFind.triggerCallbacks)
-
-// Restore focus to the element which initiated the frame request.
-window.addEventListener('brightspot-frame-load', (frameEvt) => {
-  const ajaxInitiator = window.BRIGHTSPOT.ajaxInitiator
-
-  if (ajaxInitiator) {
-    const { action, id, nodeName, shadowField } = ajaxInitiator
-
-    if (nodeName !== 'select' && !shadowField) return
-
-    const target = shadowField
-      ? `[shadow-field="${shadowField}"]`
-      : `form[action*="${
-          new URL(action).pathname
-        }"] ${nodeName}[name="${id}"] ~ .ComboInput`
-
-    onFindOnce(target, () => {
-      let targetEl = frameEvt.target.querySelector(target)
-
-      if (targetEl == null) targetEl = document.querySelector(target)
-
-      if (targetEl) {
-        targetEl.focus()
-        window.BRIGHTSPOT.ajaxInitiator = null
-      }
-    })
-  }
-})
-
-/* fix for BSP-8428 */
-onFind('input[autocomplete="off"]', (input) => {
-  if (input.closest('btu-search-input')) return
-
-  const $input = input
-  if (!$input.readOnly) {
-    $input.readOnly = true
-    $input.addEventListener('focus', () => {
-      $input.readOnly = false
-    })
-  }
-})
-
-InitSortable()
-
-// Calculate the scrollbar size.
-function measureScrollbarSize() {
-  const div = document.createElement('div')
-
-  Object.assign(div.style, {
-    height: '100px',
-    overflow: 'scroll',
-    visibility: 'hidden',
-    width: '100px',
-  })
-
-  const body = document.body
-
-  body.appendChild(div)
-
-  document.documentElement.style.setProperty(
-    '--scrollbarSize',
-    `${div.offsetWidth - div.clientWidth}px`,
-  )
-
-  body.removeChild(div)
-}
-
-if (document.readyState === 'loading') {
-  window.addEventListener('DOMContentLoaded', () => {
-    measureScrollbarSize()
-
-    // Iframe.
-    if (window.location !== window.parent.location) {
-      if (!document.body.classList.contains('is-inIframe')) {
-        document.body.classList.add('is-inIframe')
-      }
-    }
-  })
-} else {
-  measureScrollbarSize()
-}
-
-if (window.BRIGHTSPOT) {
-  window.BRIGHTSPOT.js = {
-    ...window.BRIGHTSPOT.js,
-    trapFocusWithin,
-    getFocusableDescendants,
-    getFirstAndLastFocusableDescendants,
-    create,
-    onFind,
-    onRemove,
-    Cookies,
-    setupMenuForAria,
-    toggleMenu,
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/ExternalItemAuth.js

@@ -1,16 +0,0 @@
-import onFind from './dom/onFind'
-
-onFind('.ExternalItemAuthLink', (auth) => {
-  auth.addEventListener('click', () => {
-    document.addEventListener('visibilitychange', (event) => {
-      if (
-        document.visibilityState === 'visible' &&
-        document.cookie
-          .split(';')
-          .some((item) => item.includes('bsp.csrf=externalTypeAuthenticated'))
-      ) {
-        window.location.reload()
-      }
-    })
-  })
-})

package/src/legacy/tool-ui/src/main/webapp/v4/Form.js

@@ -1,31 +0,0 @@
-import findAll from './dom/findAll'
-import ifMatches from './dom/ifMatches'
-
-// Prevent duplicate form submissions.
-const buttonSelectors = [
-  'button:not([type="button"])',
-  'input[type="submit"]',
-].join(',')
-
-window.addEventListener(
-  'click',
-  ifMatches(buttonSelectors, function () {
-    for (const button of findAll(this.closest('form'), buttonSelectors)) {
-      button.classList.remove('is-clicked')
-    }
-
-    this.classList.add('is-clicked')
-  }),
-)
-
-window.addEventListener('submit', (e) => {
-  const form = e.target
-
-  if (form.target && !form.classList.contains('is-loader')) {
-    for (const button of findAll(form, '.is-clicked')) {
-      button.classList.remove('is-clicked')
-    }
-  } else {
-    form.classList.add('is-submitting')
-  }
-})

package/src/legacy/tool-ui/src/main/webapp/v4/Hierarchy.js

@@ -1,100 +0,0 @@
-import onFind from './dom/onFind'
-// Highlight the item that's expanded.
-window.addEventListener(
-  'click',
-  (e) => {
-    const link = e.target
-
-    if (link.classList.contains('Hierarchy-expand')) {
-      for (const s of link.closest('ul').querySelectorAll('.is-selected')) {
-        s.classList.remove('is-selected')
-      }
-
-      link.closest('li').classList.add('is-selected')
-    }
-  },
-  { capture: true },
-)
-
-// Add elements to correct parent frame
-window.addEventListener('brightspot-frame-load', (e) => {
-  const frame = e.target
-
-  if (frame.classList.contains('HierarchyResults')) {
-    const lis = [...frame.querySelectorAll('li')]
-    const container = frame.closest('.Hierarchy-column')
-    const ul = container.querySelector('ul')
-
-    lis.forEach((li) => {
-      ul.appendChild(li)
-    })
-  }
-
-  // On scroll, load more elements after hitting the last element of the previous set
-  const observer = new IntersectionObserver((entries) => {
-    entries.forEach((entry) => {
-      const intersecting = entry.isIntersecting
-      if (intersecting) {
-        document.querySelector('.Hierarchy-moreElements')?.click()
-      }
-    })
-  })
-
-  let lastHierarchyElement = document.getElementsByClassName(
-    'lastHierarchyElement',
-  )
-  if (lastHierarchyElement.item(0)) {
-    observer.observe(lastHierarchyElement.item(0))
-    lastHierarchyElement.item(0).classList.remove('lastHierarchyElement')
-  }
-})
-
-onFind(
-  "div[data-popup-source-class*='Page-search'] div.Hierarchy-column a[data-hierarchy-item]",
-  (a) => {
-    const typeId = a.getAttribute('data-type-id')
-    const parentTypeId = a.getAttribute('data-parent-type-ids')
-    const searchWidgetForm = a.closest('div.SearchWidget-form')
-    if (!searchWidgetForm || !typeId) {
-      return
-    }
-    const selectedTypeId = searchWidgetForm.querySelector(
-      "select[name='st'] option[selected]",
-    ).value
-    if (
-      typeId === selectedTypeId ||
-      (parentTypeId && parentTypeId.includes(selectedTypeId))
-    ) {
-      return
-    }
-    a.setAttribute('data-mismatch-hierarchy-type', 'true')
-  },
-)
-
-onFind(
-  "div[data-popup-source-class*='objectId-select'] div.Hierarchy-column a[data-hierarchy-item]",
-  (a) => {
-    const typeId = a.getAttribute('data-type-id')
-    const searchWidgetForm = a.closest('div.SearchWidget-form')
-    if (!searchWidgetForm || !typeId) {
-      return
-    }
-    const createTypeForm = searchWidgetForm.querySelector(
-      'div.searchCreate form.objectId-create',
-    )
-    const singleTypeId = createTypeForm.querySelector(
-      "input[name='typeId']",
-    )?.value
-    const multiTypeId = createTypeForm
-      .querySelector("select[name='typeId']")
-      ?.getAttribute('data-typeids')
-    if (
-      (singleTypeId && typeId === singleTypeId) ||
-      (multiTypeId && multiTypeId.includes(typeId))
-    ) {
-      return
-    }
-
-    a.setAttribute('data-mismatch-hierarchy-type', 'true')
-  },
-)

package/src/legacy/tool-ui/src/main/webapp/v4/Icon.ts

@@ -1,49 +0,0 @@
-import onFind from '../../../dom/onFind'
-
-const materialToLucide: Record<string, string> =
-  window.BRIGHTSPOT?.icons?.materialToLucide ?? {}
-
-const isV5Enabled = !!window.BRIGHTSPOT?.ui?.cms?.enableV5UI
-
-// Build a local reverse map only when V5 is not enabled
-const lucideToMaterialMap: Record<string, string> | undefined =
-  !isV5Enabled && Object.keys(materialToLucide).length > 0
-    ? Object.keys(materialToLucide).reduce(
-        (reverseMap: Record<string, string>, key: string) => {
-          const value = materialToLucide[key]
-          reverseMap[value] = key
-          return reverseMap
-        },
-        {},
-      )
-    : undefined
-
-// Skip registration entirely if V5 is enabled
-if (!isV5Enabled) {
-  onFind(
-    ['[data-icon]', '[data-icon-name]', '[data-icon-button-name]'],
-    function (el) {
-      const attrName = el.hasAttribute('data-icon')
-        ? 'data-icon'
-        : el.hasAttribute('data-icon-name')
-          ? 'data-icon-name'
-          : el.hasAttribute('data-icon-button-name')
-            ? 'data-icon-button-name'
-            : null
-
-      if (!attrName) return
-
-      const incomingNameRaw = el.getAttribute(attrName)
-      if (incomingNameRaw == null) return
-
-      const incomingName = incomingNameRaw.trim()
-
-      const mappedName =
-        lucideToMaterialMap && lucideToMaterialMap[incomingName] != null
-          ? lucideToMaterialMap[incomingName]
-          : incomingName
-
-      el.setAttribute(attrName, mappedName)
-    },
-  )
-}