{"version":3,"file":"primer_view_components.js","sources":["../../../node_modules/@github/combobox-nav/dist/index.js","../../../node_modules/@github/auto-complete-element/dist/index.js","../../../node_modules/@github/clipboard-copy-element/dist/index.esm.js","../../components/primer/clipboard_copy_component.js","../../../node_modules/@github/tab-container-element/dist/index.js","../../../node_modules/@github/time-elements/dist/time-elements.js","../../../node_modules/@github/image-crop-element/dist/index.js"],"sourcesContent":["const ctrlBindings = !!navigator.userAgent.match(/Macintosh/);\nexport default class Combobox {\n constructor(input, list) {\n this.input = input;\n this.list = list;\n this.isComposing = false;\n if (!list.id) {\n list.id = `combobox-${Math.random()\n .toString()\n .slice(2, 6)}`;\n }\n this.keyboardEventHandler = event => keyboardBindings(event, this);\n this.compositionEventHandler = event => trackComposition(event, this);\n this.inputHandler = this.clearSelection.bind(this);\n input.setAttribute('role', 'combobox');\n input.setAttribute('aria-controls', list.id);\n input.setAttribute('aria-expanded', 'false');\n input.setAttribute('aria-autocomplete', 'list');\n input.setAttribute('aria-haspopup', 'listbox');\n }\n destroy() {\n this.clearSelection();\n this.stop();\n this.input.removeAttribute('role');\n this.input.removeAttribute('aria-controls');\n this.input.removeAttribute('aria-expanded');\n this.input.removeAttribute('aria-autocomplete');\n this.input.removeAttribute('aria-haspopup');\n }\n start() {\n this.input.setAttribute('aria-expanded', 'true');\n this.input.addEventListener('compositionstart', this.compositionEventHandler);\n this.input.addEventListener('compositionend', this.compositionEventHandler);\n this.input.addEventListener('input', this.inputHandler);\n this.input.addEventListener('keydown', this.keyboardEventHandler);\n this.list.addEventListener('click', commitWithElement);\n }\n stop() {\n this.clearSelection();\n this.input.setAttribute('aria-expanded', 'false');\n this.input.removeEventListener('compositionstart', this.compositionEventHandler);\n this.input.removeEventListener('compositionend', this.compositionEventHandler);\n this.input.removeEventListener('input', this.inputHandler);\n this.input.removeEventListener('keydown', this.keyboardEventHandler);\n this.list.removeEventListener('click', commitWithElement);\n }\n navigate(indexDiff = 1) {\n const focusEl = Array.from(this.list.querySelectorAll('[aria-selected=\"true\"]')).filter(visible)[0];\n const els = Array.from(this.list.querySelectorAll('[role=\"option\"]')).filter(visible);\n const focusIndex = els.indexOf(focusEl);\n if ((focusIndex === els.length - 1 && indexDiff === 1) || (focusIndex === 0 && indexDiff === -1)) {\n this.clearSelection();\n this.input.focus();\n return;\n }\n let indexOfItem = indexDiff === 1 ? 0 : els.length - 1;\n if (focusEl && focusIndex >= 0) {\n const newIndex = focusIndex + indexDiff;\n if (newIndex >= 0 && newIndex < els.length)\n indexOfItem = newIndex;\n }\n const target = els[indexOfItem];\n if (!target)\n return;\n for (const el of els) {\n if (target === el) {\n this.input.setAttribute('aria-activedescendant', target.id);\n target.setAttribute('aria-selected', 'true');\n scrollTo(this.list, target);\n }\n else {\n el.setAttribute('aria-selected', 'false');\n }\n }\n }\n clearSelection() {\n this.input.removeAttribute('aria-activedescendant');\n for (const el of this.list.querySelectorAll('[aria-selected=\"true\"]')) {\n el.setAttribute('aria-selected', 'false');\n }\n }\n}\nfunction keyboardBindings(event, combobox) {\n if (event.shiftKey || event.metaKey || event.altKey)\n return;\n if (!ctrlBindings && event.ctrlKey)\n return;\n if (combobox.isComposing)\n return;\n switch (event.key) {\n case 'Enter':\n case 'Tab':\n if (commit(combobox.input, combobox.list)) {\n event.preventDefault();\n }\n break;\n case 'Escape':\n combobox.clearSelection();\n break;\n case 'ArrowDown':\n combobox.navigate(1);\n event.preventDefault();\n break;\n case 'ArrowUp':\n combobox.navigate(-1);\n event.preventDefault();\n break;\n case 'n':\n if (ctrlBindings && event.ctrlKey) {\n combobox.navigate(1);\n event.preventDefault();\n }\n break;\n case 'p':\n if (ctrlBindings && event.ctrlKey) {\n combobox.navigate(-1);\n event.preventDefault();\n }\n break;\n default:\n if (event.ctrlKey)\n break;\n combobox.clearSelection();\n }\n}\nfunction commitWithElement(event) {\n if (!(event.target instanceof Element))\n return;\n const target = event.target.closest('[role=\"option\"]');\n if (!target)\n return;\n if (target.getAttribute('aria-disabled') === 'true')\n return;\n fireCommitEvent(target);\n}\nfunction commit(input, list) {\n const target = list.querySelector('[aria-selected=\"true\"]');\n if (!target)\n return false;\n if (target.getAttribute('aria-disabled') === 'true')\n return true;\n target.click();\n return true;\n}\nfunction fireCommitEvent(target) {\n target.dispatchEvent(new CustomEvent('combobox-commit', { bubbles: true }));\n}\nfunction visible(el) {\n return (!el.hidden &&\n !(el instanceof HTMLInputElement && el.type === 'hidden') &&\n (el.offsetWidth > 0 || el.offsetHeight > 0));\n}\nfunction trackComposition(event, combobox) {\n combobox.isComposing = event.type === 'compositionstart';\n const list = document.getElementById(combobox.input.getAttribute('aria-controls') || '');\n if (!list)\n return;\n combobox.clearSelection();\n}\nfunction scrollTo(container, target) {\n if (!inViewport(container, target)) {\n container.scrollTop = target.offsetTop;\n }\n}\nfunction inViewport(container, element) {\n const scrollTop = container.scrollTop;\n const containerBottom = scrollTop + container.clientHeight;\n const top = element.offsetTop;\n const bottom = top + element.clientHeight;\n return top >= scrollTop && bottom <= containerBottom;\n}\n","import Combobox from '@github/combobox-nav';\n\nclass AutocompleteEvent extends CustomEvent {\n constructor(type, init) {\n super(type, init);\n this.relatedTarget = init.relatedTarget;\n }\n}\n\nfunction debounce(callback, wait = 0) {\n let timeout;\n return function (...Rest) {\n clearTimeout(timeout);\n timeout = window.setTimeout(() => {\n clearTimeout(timeout);\n callback(...Rest);\n }, wait);\n };\n}\n\nconst requests = new WeakMap();\nfunction fragment(el, url) {\n const xhr = new XMLHttpRequest();\n xhr.open('GET', url, true);\n xhr.setRequestHeader('Accept', 'text/fragment+html');\n return request(el, xhr);\n}\nfunction request(el, xhr) {\n const pending = requests.get(el);\n if (pending)\n pending.abort();\n requests.set(el, xhr);\n const clear = () => requests.delete(el);\n const result = send(xhr);\n result.then(clear, clear);\n return result;\n}\nfunction send(xhr) {\n return new Promise((resolve, reject) => {\n xhr.onload = function () {\n if (xhr.status >= 200 && xhr.status < 300) {\n resolve(xhr.responseText);\n }\n else {\n reject(new Error(xhr.responseText));\n }\n };\n xhr.onerror = reject;\n xhr.send();\n });\n}\n\nclass Autocomplete {\n constructor(container, input, results) {\n this.container = container;\n this.input = input;\n this.results = results;\n this.combobox = new Combobox(input, results);\n this.results.hidden = true;\n this.input.setAttribute('autocomplete', 'off');\n this.input.setAttribute('spellcheck', 'false');\n this.interactingWithList = false;\n this.onInputChange = debounce(this.onInputChange.bind(this), 300);\n this.onResultsMouseDown = this.onResultsMouseDown.bind(this);\n this.onInputBlur = this.onInputBlur.bind(this);\n this.onInputFocus = this.onInputFocus.bind(this);\n this.onKeydown = this.onKeydown.bind(this);\n this.onCommit = this.onCommit.bind(this);\n this.input.addEventListener('keydown', this.onKeydown);\n this.input.addEventListener('focus', this.onInputFocus);\n this.input.addEventListener('blur', this.onInputBlur);\n this.input.addEventListener('input', this.onInputChange);\n this.results.addEventListener('mousedown', this.onResultsMouseDown);\n this.results.addEventListener('combobox-commit', this.onCommit);\n }\n destroy() {\n this.input.removeEventListener('keydown', this.onKeydown);\n this.input.removeEventListener('focus', this.onInputFocus);\n this.input.removeEventListener('blur', this.onInputBlur);\n this.input.removeEventListener('input', this.onInputChange);\n this.results.removeEventListener('mousedown', this.onResultsMouseDown);\n this.results.removeEventListener('combobox-commit', this.onCommit);\n }\n onKeydown(event) {\n if (event.key === 'Escape' && this.container.open) {\n this.container.open = false;\n event.stopPropagation();\n event.preventDefault();\n }\n else if (event.altKey && event.key === 'ArrowUp' && this.container.open) {\n this.container.open = false;\n event.stopPropagation();\n event.preventDefault();\n }\n else if (event.altKey && event.key === 'ArrowDown' && !this.container.open) {\n if (!this.input.value.trim())\n return;\n this.container.open = true;\n event.stopPropagation();\n event.preventDefault();\n }\n }\n onInputFocus() {\n this.fetchResults();\n }\n onInputBlur() {\n if (this.interactingWithList) {\n this.interactingWithList = false;\n return;\n }\n this.container.open = false;\n }\n onCommit({ target }) {\n const selected = target;\n if (!(selected instanceof HTMLElement))\n return;\n this.container.open = false;\n if (selected instanceof HTMLAnchorElement)\n return;\n const value = selected.getAttribute('data-autocomplete-value') || selected.textContent;\n this.container.value = value;\n }\n onResultsMouseDown() {\n this.interactingWithList = true;\n }\n onInputChange() {\n this.container.removeAttribute('value');\n this.fetchResults();\n }\n identifyOptions() {\n let id = 0;\n for (const el of this.results.querySelectorAll('[role=\"option\"]:not([id])')) {\n el.id = `${this.results.id}-option-${id++}`;\n }\n }\n fetchResults() {\n const query = this.input.value.trim();\n if (!query) {\n this.container.open = false;\n return;\n }\n const src = this.container.src;\n if (!src)\n return;\n const url = new URL(src, window.location.href);\n const params = new URLSearchParams(url.search.slice(1));\n params.append('q', query);\n url.search = params.toString();\n this.container.dispatchEvent(new CustomEvent('loadstart'));\n fragment(this.input, url.toString())\n .then(html => {\n this.results.innerHTML = html;\n this.identifyOptions();\n const hasResults = !!this.results.querySelector('[role=\"option\"]');\n this.container.open = hasResults;\n this.container.dispatchEvent(new CustomEvent('load'));\n this.container.dispatchEvent(new CustomEvent('loadend'));\n })\n .catch(() => {\n this.container.dispatchEvent(new CustomEvent('error'));\n this.container.dispatchEvent(new CustomEvent('loadend'));\n });\n }\n open() {\n if (!this.results.hidden)\n return;\n this.combobox.start();\n this.results.hidden = false;\n }\n close() {\n if (this.results.hidden)\n return;\n this.combobox.stop();\n this.results.hidden = true;\n }\n}\n\nconst state = new WeakMap();\nclass AutocompleteElement extends HTMLElement {\n constructor() {\n super();\n }\n connectedCallback() {\n const listId = this.getAttribute('for');\n if (!listId)\n return;\n const input = this.querySelector('input');\n const results = document.getElementById(listId);\n if (!(input instanceof HTMLInputElement) || !results)\n return;\n state.set(this, new Autocomplete(this, input, results));\n results.setAttribute('role', 'listbox');\n }\n disconnectedCallback() {\n const autocomplete = state.get(this);\n if (autocomplete) {\n autocomplete.destroy();\n state.delete(this);\n }\n }\n get src() {\n return this.getAttribute('src') || '';\n }\n set src(url) {\n this.setAttribute('src', url);\n }\n get value() {\n return this.getAttribute('value') || '';\n }\n set value(value) {\n this.setAttribute('value', value);\n }\n get open() {\n return this.hasAttribute('open');\n }\n set open(value) {\n if (value) {\n this.setAttribute('open', '');\n }\n else {\n this.removeAttribute('open');\n }\n }\n static get observedAttributes() {\n return ['open', 'value'];\n }\n attributeChangedCallback(name, oldValue, newValue) {\n if (oldValue === newValue)\n return;\n const autocomplete = state.get(this);\n if (!autocomplete)\n return;\n switch (name) {\n case 'open':\n newValue === null ? autocomplete.close() : autocomplete.open();\n break;\n case 'value':\n if (newValue !== null) {\n autocomplete.input.value = newValue;\n }\n this.dispatchEvent(new AutocompleteEvent('auto-complete-change', {\n bubbles: true,\n relatedTarget: autocomplete.input\n }));\n break;\n }\n }\n}\n\nif (!window.customElements.get('auto-complete')) {\n window.AutocompleteElement = AutocompleteElement;\n window.customElements.define('auto-complete', AutocompleteElement);\n}\n\nexport default AutocompleteElement;\nexport { AutocompleteEvent };\n","function createNode(text) {\n const node = document.createElement('pre');\n node.style.width = '1px';\n node.style.height = '1px';\n node.style.position = 'fixed';\n node.style.top = '5px';\n node.textContent = text;\n return node;\n}\n\nfunction copyNode(node) {\n if ('clipboard' in navigator) {\n // eslint-disable-next-line flowtype/no-flow-fix-me-comments\n // $FlowFixMe Clipboard is not defined in Flow yet.\n return navigator.clipboard.writeText(node.textContent);\n }\n\n const selection = getSelection();\n\n if (selection == null) {\n return Promise.reject(new Error());\n }\n\n selection.removeAllRanges();\n const range = document.createRange();\n range.selectNodeContents(node);\n selection.addRange(range);\n document.execCommand('copy');\n selection.removeAllRanges();\n return Promise.resolve();\n}\nfunction copyText(text) {\n if ('clipboard' in navigator) {\n // eslint-disable-next-line flowtype/no-flow-fix-me-comments\n // $FlowFixMe Clipboard is not defined in Flow yet.\n return navigator.clipboard.writeText(text);\n }\n\n const body = document.body;\n\n if (!body) {\n return Promise.reject(new Error());\n }\n\n const node = createNode(text);\n body.appendChild(node);\n copyNode(node);\n body.removeChild(node);\n return Promise.resolve();\n}\n\nfunction copy(button) {\n const id = button.getAttribute('for');\n const text = button.getAttribute('value');\n\n function trigger() {\n button.dispatchEvent(new CustomEvent('clipboard-copy', {\n bubbles: true\n }));\n }\n\n if (text) {\n copyText(text).then(trigger);\n } else if (id) {\n const root = 'getRootNode' in Element.prototype ? button.getRootNode() : button.ownerDocument;\n if (!(root instanceof Document || 'ShadowRoot' in window && root instanceof ShadowRoot)) return;\n const node = root.getElementById(id);\n if (node) copyTarget(node).then(trigger);\n }\n}\n\nfunction copyTarget(content) {\n if (content instanceof HTMLInputElement || content instanceof HTMLTextAreaElement) {\n return copyText(content.value);\n } else if (content instanceof HTMLAnchorElement && content.hasAttribute('href')) {\n return copyText(content.href);\n } else {\n return copyNode(content);\n }\n}\n\nfunction clicked(event) {\n const button = event.currentTarget;\n\n if (button instanceof HTMLElement) {\n copy(button);\n }\n}\n\nfunction keydown(event) {\n if (event.key === ' ' || event.key === 'Enter') {\n const button = event.currentTarget;\n\n if (button instanceof HTMLElement) {\n event.preventDefault();\n copy(button);\n }\n }\n}\n\nfunction focused(event) {\n event.currentTarget.addEventListener('keydown', keydown);\n}\n\nfunction blurred(event) {\n event.currentTarget.removeEventListener('keydown', keydown);\n}\n\nclass ClipboardCopyElement extends HTMLElement {\n constructor() {\n super();\n this.addEventListener('click', clicked);\n this.addEventListener('focus', focused);\n this.addEventListener('blur', blurred);\n }\n\n connectedCallback() {\n if (!this.hasAttribute('tabindex')) {\n this.setAttribute('tabindex', '0');\n }\n\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n }\n\n get value() {\n return this.getAttribute('value') || '';\n }\n\n set value(text) {\n this.setAttribute('value', text);\n }\n\n}\n\nif (!window.customElements.get('clipboard-copy')) {\n window.ClipboardCopyElement = ClipboardCopyElement;\n window.customElements.define('clipboard-copy', ClipboardCopyElement);\n}\n\nexport default ClipboardCopyElement;\n","import '@github/clipboard-copy-element';\nfunction toggleSVG(svg) {\n if (svg.style.display === '' || svg.style.display === 'block') {\n svg.style.display = 'none';\n }\n else {\n svg.style.display = 'block';\n }\n}\n// Toggle a copy button.\nfunction toggleCopyButton(button) {\n const [clippyIcon, checkIcon] = button.querySelectorAll('.octicon');\n if (!clippyIcon || !checkIcon)\n return;\n toggleSVG(clippyIcon);\n toggleSVG(checkIcon);\n}\ndocument.addEventListener('clipboard-copy', function ({ target }) {\n if (!(target instanceof HTMLElement))\n return;\n toggleCopyButton(target);\n setTimeout(toggleCopyButton, 2000, target);\n});\n","export default class TabContainerElement extends HTMLElement {\n constructor() {\n super();\n this.addEventListener('keydown', (event) => {\n const target = event.target;\n if (!(target instanceof HTMLElement))\n return;\n if (target.getAttribute('role') !== 'tab' && !target.closest('[role=\"tablist\"]'))\n return;\n const tabs = Array.from(this.querySelectorAll('[role=\"tablist\"] [role=\"tab\"]'));\n const currentIndex = tabs.indexOf(tabs.find(tab => tab.matches('[aria-selected=\"true\"]')));\n if (event.code === 'ArrowRight') {\n let index = currentIndex + 1;\n if (index >= tabs.length)\n index = 0;\n selectTab(this, index);\n }\n else if (event.code === 'ArrowLeft') {\n let index = currentIndex - 1;\n if (index < 0)\n index = tabs.length - 1;\n selectTab(this, index);\n }\n else if (event.code === 'Home') {\n selectTab(this, 0);\n event.preventDefault();\n }\n else if (event.code === 'End') {\n selectTab(this, tabs.length - 1);\n event.preventDefault();\n }\n });\n this.addEventListener('click', (event) => {\n const tabs = Array.from(this.querySelectorAll('[role=\"tablist\"] [role=\"tab\"]'));\n if (!(event.target instanceof Element))\n return;\n const tab = event.target.closest('[role=\"tab\"]');\n if (!tab || !tab.closest('[role=\"tablist\"]'))\n return;\n const index = tabs.indexOf(tab);\n selectTab(this, index);\n });\n }\n connectedCallback() {\n for (const tab of this.querySelectorAll('[role=\"tablist\"] [role=\"tab\"]')) {\n if (!tab.hasAttribute('aria-selected')) {\n tab.setAttribute('aria-selected', 'false');\n }\n if (!tab.hasAttribute('tabindex')) {\n if (tab.getAttribute('aria-selected') === 'true') {\n tab.setAttribute('tabindex', '0');\n }\n else {\n tab.setAttribute('tabindex', '-1');\n }\n }\n }\n }\n}\nfunction selectTab(tabContainer, index) {\n const tabs = tabContainer.querySelectorAll('[role=\"tablist\"] [role=\"tab\"]');\n const panels = tabContainer.querySelectorAll('[role=\"tabpanel\"]');\n const selectedTab = tabs[index];\n const selectedPanel = panels[index];\n const cancelled = !tabContainer.dispatchEvent(new CustomEvent('tab-container-change', {\n bubbles: true,\n cancelable: true,\n detail: { relatedTarget: selectedPanel }\n }));\n if (cancelled)\n return;\n for (const tab of tabs) {\n tab.setAttribute('aria-selected', 'false');\n tab.setAttribute('tabindex', '-1');\n }\n for (const panel of panels) {\n panel.hidden = true;\n if (!panel.hasAttribute('tabindex') && !panel.hasAttribute('data-tab-container-no-tabstop')) {\n panel.setAttribute('tabindex', '0');\n }\n }\n selectedTab.setAttribute('aria-selected', 'true');\n selectedTab.setAttribute('tabindex', '0');\n selectedTab.focus();\n selectedPanel.hidden = false;\n tabContainer.dispatchEvent(new CustomEvent('tab-container-changed', {\n bubbles: true,\n detail: { relatedTarget: selectedPanel }\n }));\n}\nif (!window.customElements.get('tab-container')) {\n window.TabContainerElement = TabContainerElement;\n window.customElements.define('tab-container', TabContainerElement);\n}\n//# sourceMappingURL=index.js.map","const weekdays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];\nconst months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];\n\nfunction pad(num) {\n return \"0\".concat(num).slice(-2);\n}\n\nfunction strftime(time, formatString) {\n const day = time.getDay();\n const date = time.getDate();\n const month = time.getMonth();\n const year = time.getFullYear();\n const hour = time.getHours();\n const minute = time.getMinutes();\n const second = time.getSeconds();\n return formatString.replace(/%([%aAbBcdeHIlmMpPSwyYZz])/g, function (_arg) {\n let match;\n const modifier = _arg[1];\n\n switch (modifier) {\n case '%':\n return '%';\n\n case 'a':\n return weekdays[day].slice(0, 3);\n\n case 'A':\n return weekdays[day];\n\n case 'b':\n return months[month].slice(0, 3);\n\n case 'B':\n return months[month];\n\n case 'c':\n return time.toString();\n\n case 'd':\n return pad(date);\n\n case 'e':\n return String(date);\n\n case 'H':\n return pad(hour);\n\n case 'I':\n return pad(strftime(time, '%l'));\n\n case 'l':\n if (hour === 0 || hour === 12) {\n return String(12);\n } else {\n return String((hour + 12) % 12);\n }\n\n case 'm':\n return pad(month + 1);\n\n case 'M':\n return pad(minute);\n\n case 'p':\n if (hour > 11) {\n return 'PM';\n } else {\n return 'AM';\n }\n\n case 'P':\n if (hour > 11) {\n return 'pm';\n } else {\n return 'am';\n }\n\n case 'S':\n return pad(second);\n\n case 'w':\n return String(day);\n\n case 'y':\n return pad(year % 100);\n\n case 'Y':\n return String(year);\n\n case 'Z':\n match = time.toString().match(/\\((\\w+)\\)$/);\n return match ? match[1] : '';\n\n case 'z':\n match = time.toString().match(/\\w([+-]\\d\\d\\d\\d) /);\n return match ? match[1] : '';\n }\n\n return '';\n });\n}\nfunction makeFormatter(options) {\n let format;\n return function () {\n if (format) return format;\n\n if ('Intl' in window) {\n try {\n format = new Intl.DateTimeFormat(undefined, options);\n return format;\n } catch (e) {\n if (!(e instanceof RangeError)) {\n throw e;\n }\n }\n }\n };\n}\nlet dayFirst = null;\nconst dayFirstFormatter = makeFormatter({\n day: 'numeric',\n month: 'short'\n}); // Private: Determine if the day should be formatted before the month name in\n// the user's current locale. For example, `9 Jun` for en-GB and `Jun 9`\n// for en-US.\n//\n// Returns true if the day appears before the month.\n\nfunction isDayFirst() {\n if (dayFirst !== null) {\n return dayFirst;\n }\n\n const formatter = dayFirstFormatter();\n\n if (formatter) {\n const output = formatter.format(new Date(0));\n dayFirst = !!output.match(/^\\d/);\n return dayFirst;\n } else {\n return false;\n }\n}\nlet yearSeparator = null;\nconst yearFormatter = makeFormatter({\n day: 'numeric',\n month: 'short',\n year: 'numeric'\n}); // Private: Determine if the year should be separated from the month and day\n// with a comma. For example, `9 Jun 2014` in en-GB and `Jun 9, 2014` in en-US.\n//\n// Returns true if the date needs a separator.\n\nfunction isYearSeparator() {\n if (yearSeparator !== null) {\n return yearSeparator;\n }\n\n const formatter = yearFormatter();\n\n if (formatter) {\n const output = formatter.format(new Date(0));\n yearSeparator = !!output.match(/\\d,/);\n return yearSeparator;\n } else {\n return true;\n }\n} // Private: Determine if the date occurs in the same year as today's date.\n//\n// date - The Date to test.\n//\n// Returns true if it's this year.\n\nfunction isThisYear(date) {\n const now = new Date();\n return now.getUTCFullYear() === date.getUTCFullYear();\n}\nfunction makeRelativeFormat(locale, options) {\n if ('Intl' in window && 'RelativeTimeFormat' in window.Intl) {\n try {\n // eslint-disable-next-line flowtype/no-flow-fix-me-comments\n // $FlowFixMe: missing RelativeTimeFormat type\n return new Intl.RelativeTimeFormat(locale, options);\n } catch (e) {\n if (!(e instanceof RangeError)) {\n throw e;\n }\n }\n }\n} // Private: Get preferred Intl locale for a target element.\n//\n// Traverses parents until it finds an explicit `lang` other returns \"default\".\n\nfunction localeFromElement(el) {\n const container = el.closest('[lang]');\n\n if (container instanceof HTMLElement && container.lang) {\n return container.lang;\n }\n\n return 'default';\n}\n\nconst datetimes = new WeakMap();\nclass ExtendedTimeElement extends HTMLElement {\n static get observedAttributes() {\n return ['datetime', 'day', 'format', 'lang', 'hour', 'minute', 'month', 'second', 'title', 'weekday', 'year'];\n }\n\n connectedCallback() {\n const title = this.getFormattedTitle();\n\n if (title && !this.hasAttribute('title')) {\n this.setAttribute('title', title);\n }\n\n const text = this.getFormattedDate();\n\n if (text) {\n this.textContent = text;\n }\n } // Internal: Refresh the time element's formatted date when an attribute changes.\n\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n const oldTitle = this.getFormattedTitle();\n\n if (attrName === 'datetime') {\n const millis = Date.parse(newValue);\n\n if (isNaN(millis)) {\n datetimes.delete(this);\n } else {\n datetimes.set(this, new Date(millis));\n }\n }\n\n const title = this.getFormattedTitle();\n const currentTitle = this.getAttribute('title');\n\n if (attrName !== 'title' && title && (!currentTitle || currentTitle === oldTitle)) {\n this.setAttribute('title', title);\n }\n\n const text = this.getFormattedDate();\n\n if (text) {\n this.textContent = text;\n }\n }\n\n get date() {\n return datetimes.get(this);\n } // Internal: Format the ISO 8601 timestamp according to the user agent's\n // locale-aware formatting rules. The element's existing `title` attribute\n // value takes precedence over this custom format.\n //\n // Returns a formatted time String.\n\n\n getFormattedTitle() {\n const date = this.date;\n if (!date) return;\n const formatter = titleFormatter();\n\n if (formatter) {\n return formatter.format(date);\n } else {\n try {\n return date.toLocaleString();\n } catch (e) {\n if (e instanceof RangeError) {\n return date.toString();\n } else {\n throw e;\n }\n }\n }\n }\n\n getFormattedDate() {}\n\n}\nconst titleFormatter = makeFormatter({\n day: 'numeric',\n month: 'short',\n year: 'numeric',\n hour: 'numeric',\n minute: '2-digit',\n timeZoneName: 'short'\n});\n\nconst formatters = new WeakMap();\nclass LocalTimeElement extends ExtendedTimeElement {\n attributeChangedCallback(attrName, oldValue, newValue) {\n if (attrName === 'hour' || attrName === 'minute' || attrName === 'second' || attrName === 'time-zone-name') {\n formatters.delete(this);\n }\n\n super.attributeChangedCallback(attrName, oldValue, newValue);\n } // Formats the element's date, in the user's current locale, according to\n // the formatting attribute values. Values are not passed straight through to\n // an Intl.DateTimeFormat instance so that weekday and month names are always\n // displayed in English, for now.\n //\n // Supported attributes are:\n //\n // weekday - \"short\", \"long\"\n // year - \"numeric\", \"2-digit\"\n // month - \"short\", \"long\"\n // day - \"numeric\", \"2-digit\"\n // hour - \"numeric\", \"2-digit\"\n // minute - \"numeric\", \"2-digit\"\n // second - \"numeric\", \"2-digit\"\n //\n // Returns a formatted time String.\n\n\n getFormattedDate() {\n const d = this.date;\n if (!d) return;\n const date = formatDate(this, d) || '';\n const time = formatTime(this, d) || '';\n return \"\".concat(date, \" \").concat(time).trim();\n }\n\n} // Private: Format a date according to the `weekday`, `day`, `month`,\n// and `year` attribute values.\n//\n// This doesn't use Intl.DateTimeFormat to avoid creating text in the user's\n// language when the majority of the surrounding text is in English. There's\n// currently no way to separate the language from the format in Intl.\n//\n// el - The local-time element to format.\n//\n// Returns a date String or null if no date formats are provided.\n\nfunction formatDate(el, date) {\n // map attribute values to strftime\n const props = {\n weekday: {\n short: '%a',\n long: '%A'\n },\n day: {\n numeric: '%e',\n '2-digit': '%d'\n },\n month: {\n short: '%b',\n long: '%B'\n },\n year: {\n numeric: '%Y',\n '2-digit': '%y'\n }\n }; // build a strftime format string\n\n let format = isDayFirst() ? 'weekday day month year' : 'weekday month day, year';\n\n for (const prop in props) {\n const value = props[prop][el.getAttribute(prop)];\n format = format.replace(prop, value || '');\n } // clean up year separator comma\n\n\n format = format.replace(/(\\s,)|(,\\s$)/, ''); // squeeze spaces from final string\n\n return strftime(date, format).replace(/\\s+/, ' ').trim();\n} // Private: Format a time according to the `hour`, `minute`, and `second`\n// attribute values.\n//\n// el - The local-time element to format.\n//\n// Returns a time String or null if no time formats are provided.\n\n\nfunction formatTime(el, date) {\n const options = {}; // retrieve format settings from attributes\n\n const hour = el.getAttribute('hour');\n if (hour === 'numeric' || hour === '2-digit') options.hour = hour;\n const minute = el.getAttribute('minute');\n if (minute === 'numeric' || minute === '2-digit') options.minute = minute;\n const second = el.getAttribute('second');\n if (second === 'numeric' || second === '2-digit') options.second = second;\n const tz = el.getAttribute('time-zone-name');\n if (tz === 'short' || tz === 'long') options.timeZoneName = tz; // No time format attributes provided.\n\n if (Object.keys(options).length === 0) {\n return;\n }\n\n let factory = formatters.get(el);\n\n if (!factory) {\n factory = makeFormatter(options);\n formatters.set(el, factory);\n }\n\n const formatter = factory();\n\n if (formatter) {\n // locale-aware formatting of 24 or 12 hour times\n return formatter.format(date);\n } else {\n // fall back to strftime for non-Intl browsers\n const timef = options.second ? '%H:%M:%S' : '%H:%M';\n return strftime(date, timef);\n }\n} // Public: LocalTimeElement constructor.\n//\n// var time = new LocalTimeElement()\n// # =>