that contains a lot of hashtags, add a class to it\n if (enhancedContent.includes('#')) {\n let prevIndex = null;\n const hashtagStuffedParagraphs = [...dom.querySelectorAll('p')].filter(\n (p, index) => {\n let hashtagCount = 0;\n for (let i = 0; i < p.childNodes.length; i++) {\n const node = p.childNodes[i];\n\n if (node.nodeType === Node.TEXT_NODE) {\n const text = node.textContent.trim();\n if (text !== '') {\n return false;\n }\n } else if (node.tagName === 'BR') {\n // Ignore
\n } else if (node.tagName === 'A') {\n const linkText = node.textContent.trim();\n if (!linkText || !linkText.startsWith('#')) {\n return false;\n } else {\n hashtagCount++;\n }\n } else {\n return false;\n }\n }\n // Only consider \"stuffing\" if:\n // - there are more than 3 hashtags\n // - there are more than 1 hashtag in adjacent paragraphs\n if (hashtagCount > 3) {\n prevIndex = index;\n return true;\n }\n if (hashtagCount > 1 && prevIndex && index === prevIndex + 1) {\n prevIndex = index;\n return true;\n }\n },\n );\n if (hashtagStuffedParagraphs?.length) {\n for (const p of hashtagStuffedParagraphs) {\n p.classList.add('hashtag-stuffing');\n p.title = p.innerText;\n }\n }\n }\n\n // ADD ASPECT RATIO TO ALL IMAGES\n if (enhancedContent.includes('
postEnhanceDOM(dom));\n // postEnhanceDOM(dom); // mutate dom\n }\n\n return returnDOM ? dom : dom.innerHTML;\n}\nconst enhanceContent = mem(_enhanceContent);\n\nconst defaultRejectFilter = [\n // Document metadata\n 'STYLE',\n // Image and multimedia\n 'IMG',\n 'VIDEO',\n 'AUDIO',\n 'AREA',\n 'MAP',\n 'TRACK',\n // Embedded content\n 'EMBED',\n 'IFRAME',\n 'OBJECT',\n 'PICTURE',\n 'PORTAL',\n 'SOURCE',\n // SVG and MathML\n 'SVG',\n 'MATH',\n // Scripting\n 'CANVAS',\n 'NOSCRIPT',\n 'SCRIPT',\n // Forms\n 'INPUT',\n 'OPTION',\n 'TEXTAREA',\n // Web Components\n 'SLOT',\n 'TEMPLATE',\n];\nconst defaultRejectFilterMap = Object.fromEntries(\n defaultRejectFilter.map((nodeName) => [nodeName, true]),\n);\n\nconst URL_PREFIX_REGEX = /^(https?:\\/\\/(www\\.)?|xmpp:)/;\nconst URL_DISPLAY_LENGTH = 30;\n// Similar to https://github.com/mastodon/mastodon/blob/1666b1955992e16f4605b414c6563ca25b3a3f18/app/lib/text_formatter.rb#L54-L69\nfunction shortenLink(link) {\n if (!link || link.querySelector?.('*')) {\n return;\n }\n try {\n const url = link.innerText.trim();\n const prefix = (url.match(URL_PREFIX_REGEX) || [])[0] || '';\n if (!prefix) return;\n const displayURL = url.slice(\n prefix.length,\n prefix.length + URL_DISPLAY_LENGTH,\n );\n const suffix = url.slice(prefix.length + URL_DISPLAY_LENGTH);\n const cutoff = url.slice(prefix.length).length > URL_DISPLAY_LENGTH;\n link.innerHTML = `${prefix}${displayURL}${suffix}`;\n } catch (e) {}\n}\n\nfunction extractTextNodes(dom, opts = {}) {\n const textNodes = [];\n const rejectFilterMap = Object.assign(\n {},\n defaultRejectFilterMap,\n opts.rejectFilter?.reduce((acc, cur) => {\n acc[cur] = true;\n return acc;\n }, {}),\n );\n const walk = document.createTreeWalker(\n dom,\n NodeFilter.SHOW_TEXT,\n {\n acceptNode(node) {\n if (rejectFilterMap[node.parentNode.nodeName]) {\n return NodeFilter.FILTER_REJECT;\n }\n return NodeFilter.FILTER_ACCEPT;\n },\n },\n false,\n );\n let node;\n while ((node = walk.nextNode())) {\n textNodes.push(node);\n }\n return textNodes;\n}\n\nexport default enhanceContent;\n","import states from './states';\n\nconst supportsHover = window.matchMedia('(hover: hover)').matches;\n\nfunction handleContentLinks(opts) {\n const { mentions = [], instance, previewMode, statusURL } = opts || {};\n return (e) => {\n // If cmd/ctrl/shift/alt key is pressed or middle-click, let the browser handle it\n if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || e.which === 2) {\n return;\n }\n\n let { target } = e;\n\n // Experiment opening custom emoji in a modal\n // TODO: Rename this function because it's not just for links\n if (target.closest('.shortcode-emoji')) {\n const { naturalWidth, naturalHeight, width, height } = target;\n const kindaLargeRatio = 2;\n const kindaLarge =\n naturalWidth > width * kindaLargeRatio ||\n naturalHeight > height * kindaLargeRatio;\n if (kindaLarge) {\n e.preventDefault();\n e.stopPropagation();\n states.showMediaModal = {\n mediaAttachments: [\n {\n type: 'image',\n url: target.src,\n description: target.title || target.alt,\n },\n ],\n };\n return;\n }\n }\n\n target = target.closest('a');\n if (!target) return;\n // Only handle links inside, not itself or anything outside\n if (!e.currentTarget.contains(target)) return;\n\n const { href } = target;\n\n const prevText = target.previousSibling?.textContent;\n const textBeforeLinkIsAt = prevText?.endsWith('@');\n const textStartsWithAt = target.innerText.startsWith('@');\n if (\n ((target.classList.contains('u-url') ||\n target.classList.contains('mention')) &&\n textStartsWithAt) ||\n (textBeforeLinkIsAt && !textStartsWithAt)\n ) {\n const targetText = (\n target.querySelector('span') || target\n ).innerText.trim();\n const username = targetText.replace(/^@/, '');\n // Only fallback to acct/username check if url doesn't match\n const mention =\n mentions.find((mention) => mention.url === href) ||\n mentions.find(\n (mention) =>\n mention.acct === username || mention.username === username,\n );\n console.warn('MENTION', mention, href);\n if (mention) {\n e.preventDefault();\n e.stopPropagation();\n states.showAccount = {\n account: mention.acct,\n instance,\n };\n return;\n } else if (!/^http/i.test(targetText)) {\n console.log('mention not found', targetText);\n e.preventDefault();\n e.stopPropagation();\n states.showAccount = {\n account: href,\n instance,\n };\n return;\n }\n } else if (!previewMode) {\n const textBeforeLinkIsHash = prevText?.endsWith('#');\n if (target.classList.contains('hashtag') || textBeforeLinkIsHash) {\n e.preventDefault();\n e.stopPropagation();\n const tag = target.innerText.replace(/^#/, '').trim();\n const hashURL = instance ? `#/${instance}/t/${tag}` : `#/t/${tag}`;\n console.log({ hashURL });\n location.hash = hashURL;\n return;\n } else if (states.unfurledLinks[href]?.url && statusURL !== href) {\n // If unfurled AND not self-referential\n e.preventDefault();\n e.stopPropagation();\n states.prevLocation = {\n pathname: location.hash.replace(/^#/, ''),\n };\n location.hash = `#${states.unfurledLinks[href].url}`;\n return;\n }\n }\n\n try {\n const urlObj = URL.parse(href);\n const domain = urlObj.hostname.replace(/^www\\./i, '');\n const containsDomain = target.innerText\n .toLowerCase()\n .includes(domain.toLowerCase());\n // Only show this on non-hover devices (touch-only)\n // Assuming that hover-supported = there's a statusbar to see the URL\n // Non-hover devices don't have statusbar, so we show this\n if (!containsDomain && !supportsHover) {\n e.preventDefault();\n e.stopPropagation();\n const linkText = target.innerText.trim();\n states.showOpenLink = {\n url: href,\n linkText,\n };\n }\n } catch (e) {}\n };\n}\n\nexport default handleContentLinks;\n","import { i18n } from '@lingui/core';\n\nexport default function shortenNumber(num) {\n try {\n return i18n.number(num, {\n notation: 'compact',\n roundingMode: 'floor',\n });\n } catch (e) {\n return num;\n }\n}\n","import { satisfies } from 'compare-versions';\n\nimport features from '../data/features.json';\n\nimport { getCurrentInstance, getCurrentNodeInfo } from './store-utils';\n\n// Non-semver(?) UA string detection\nconst containPixelfed = /pixelfed/i;\nconst notContainPixelfed = /^(?!.*pixelfed).*$/i;\nconst containPleroma = /pleroma/i;\nconst containAkkoma = /akkoma/i;\nconst containGTS = /gotosocial/i;\nconst platformFeatures = {\n '@mastodon/lists': notContainPixelfed,\n '@mastodon/filters': notContainPixelfed,\n '@mastodon/mentions': notContainPixelfed,\n '@mastodon/trending-hashtags': notContainPixelfed,\n '@mastodon/trending-links': notContainPixelfed,\n '@mastodon/post-bookmark': notContainPixelfed,\n '@mastodon/post-edit': notContainPixelfed,\n '@mastodon/profile-edit': notContainPixelfed,\n '@mastodon/profile-private-note': notContainPixelfed,\n '@mastodon/pinned-posts': notContainPixelfed,\n '@pixelfed/trending': containPixelfed,\n '@pixelfed/home-include-reblogs': containPixelfed,\n '@pixelfed/global-feed': containPixelfed,\n '@pleroma/local-visibility-post': containPleroma,\n '@akkoma/local-visibility-post': containAkkoma,\n};\n\nconst supportsCache = {};\n\nfunction supports(feature) {\n try {\n let { version, domain } = getCurrentInstance();\n let softwareName = getCurrentNodeInfo()?.software?.name || 'mastodon';\n\n if (softwareName === 'hometown') {\n // Hometown is a Mastodon fork and inherits its features\n softwareName = 'mastodon';\n }\n\n const key = `${domain}-${feature}`;\n if (supportsCache[key]) return supportsCache[key];\n\n if (platformFeatures[feature]) {\n return (supportsCache[key] = platformFeatures[feature].test(version));\n }\n\n const range = features[feature];\n if (!range) return false;\n\n // '@mastodon/blah' => 'mastodon'\n const featureSoftware = feature.match(/^@([a-z]+)\\//)[1];\n\n const doesSoftwareMatch = featureSoftware === softwareName.toLowerCase();\n return (supportsCache[key] =\n doesSoftwareMatch &&\n satisfies(version, range, {\n includePrerelease: true,\n loose: true,\n }));\n } catch (e) {\n return false;\n }\n}\n\nexport default supports;\n","import './account-block.css';\n\nimport { Plural, Trans, useLingui } from '@lingui/react/macro';\n\n// import { useNavigate } from 'react-router-dom';\nimport enhanceContent from '../utils/enhance-content';\nimport getDomain from '../utils/get-domain';\nimport niceDateTime from '../utils/nice-date-time';\nimport shortenNumber from '../utils/shorten-number';\nimport states from '../utils/states';\n\nimport Avatar from './avatar';\nimport EmojiText from './emoji-text';\nimport Icon from './icon';\n\nfunction AccountBlock({\n skeleton,\n account,\n avatarSize = 'xl',\n useAvatarStatic = false,\n instance,\n external,\n internal,\n onClick,\n showActivity = false,\n showStats = false,\n accountInstance,\n hideDisplayName = false,\n relationship = {},\n excludeRelationshipAttrs = [],\n}) {\n const { t } = useLingui();\n if (skeleton) {\n return (\n
{\n // // Remove target=\"_blank\" from links\n // dom.querySelectorAll('a.u-url[target=\"_blank\"]').forEach((a) => {\n // if (!/http/i.test(a.innerText.trim())) {\n // a.removeAttribute('target');\n // }\n // });\n // },\n // }),\n // }}\n />\n );\n }; /*,\n (oldProps, newProps) => {\n const { post: oldPost } = oldProps;\n const { post: newPost } = newProps;\n return oldPost.content === newPost.content;\n },\n);*/\n\nexport default PostContent;\n","/**\n * @param {string[]} splittedHtml\n * @param {{ char?: string; count?: number}} options\n * @returns {string}\n */\nconst addIndentation = (splittedHtml, options = {}) => {\n const char = options.char || ' '\n const count = options.count || 2\n\n let level = 0\n const opened = []\n\n return splittedHtml.reverse().reduce((indented, elTag) => {\n if (opened.length\n && level\n && opened[level]\n /* if current element tag is the same as previously opened one */\n && opened[level] === elTag.substring(1, opened[level].length + 1)\n ) {\n opened.splice(level, 1)\n level--\n }\n\n const indentation = char.repeat(level ? level * count : 0)\n\n const newIndented = [\n `${indentation}${elTag}`,\n ...indented,\n ]\n\n // if current element tag is closing tag\n // add it to opened elements\n if (elTag.substring(0, 2) === '') {\n level++\n opened[level] = elTag.substring(2, elTag.length - 1)\n }\n\n return newIndented\n }, []).join('\\n')\n}\n\nmodule.exports = addIndentation\n","/**\n * @param {string} nonFormattedString Any non formatted string\n * @returns {string[]} Array of strings separated on new lines\n */\nconst removeEmptyLines = (nonFormattedString) => (\n // Replace\n // - 1 or more spaces or tabs at the start of line\n // - 1 or more spaces or tabs at the end of line\n // - empty lines\n // with empty string\n nonFormattedString.trim().replace(/(^(\\s|\\t)+|(( |\\t)+)$)/gm, '')\n)\n\n/**\n * @param {string} markup\n * @returns {string[]} Array of strings splitted on new lines without empty lines\n */\nconst mergeAttributesWithElements = (markup) => {\n const splittedMarkup = removeEmptyLines(markup).split('\\n')\n\n const mergedLines = []\n let currentElement = ''\n for (let i = 0; i < splittedMarkup.length; i += 1) {\n const line = splittedMarkup[i]\n\n // If line is closing element/tag separate closing tag from rest of the line with space\n if (line.endsWith('/>')) {\n mergedLines.push(`${currentElement}${line.slice(0, -2)} />`)\n currentElement = ''\n // eslint-disable-next-line no-continue\n continue\n }\n\n if (line.endsWith('>')) {\n mergedLines.push(`${currentElement}${\n line.startsWith('>') || line.startsWith('<') ? '' : ' '\n }${line}`)\n currentElement = ''\n // eslint-disable-next-line no-continue\n continue\n }\n\n currentElement += currentElement.length ? ` ${line}` : line\n }\n\n return mergedLines\n}\n\nmodule.exports = {\n mergeAttributesWithElements,\n removeEmptyLines,\n}\n","const addIndentation = require('./utils/addIndentation')\nconst { mergeAttributesWithElements } = require('./utils/toLines')\n\n/**\n * @param {string} markup\n * @param {{ char?: string; count?: number }} options\n * @returns {string}\n */\nconst prettify = (markup, options = {}) => {\n const splitted = mergeAttributesWithElements(markup)\n\n return addIndentation(splitted, options)\n}\n\nmodule.exports = prettify\n","import { Trans, useLingui } from '@lingui/react/macro';\nimport prettify from 'html-prettify';\n\nimport emojifyText from '../utils/emojify-text';\nimport showToast from '../utils/show-toast';\nimport states, { statusKey } from '../utils/states';\n\nimport Icon from './icon';\n\nfunction generateHTMLCode(post, instance, level = 0) {\n const {\n account: {\n url: accountURL,\n displayName,\n acct,\n username,\n emojis: accountEmojis,\n bot,\n group,\n },\n id,\n poll,\n spoilerText,\n language,\n editedAt,\n createdAt,\n content,\n mediaAttachments,\n url,\n emojis,\n } = post;\n\n const sKey = statusKey(id, instance);\n const quotes = states.statusQuotes[sKey] || [];\n const uniqueQuotes = quotes.filter(\n (q, i, arr) => arr.findIndex((q2) => q2.url === q.url) === i,\n );\n const quoteStatusesHTML =\n uniqueQuotes.length && level <= 2\n ? uniqueQuotes\n .map((quote) => {\n const { id, instance } = quote;\n const sKey = statusKey(id, instance);\n const s = states.statuses[sKey];\n if (s) {\n return generateHTMLCode(s, instance, ++level);\n }\n })\n .join('')\n : '';\n\n const createdAtDate = new Date(createdAt);\n // const editedAtDate = editedAt && new Date(editedAt);\n\n const contentHTML =\n emojifyText(content, emojis) +\n '\\n' +\n quoteStatusesHTML +\n '\\n' +\n (poll?.options?.length\n ? `\n
📊:
\n
\n ${poll.options\n .map(\n (option) => `\n - \n ${option.title}\n ${option.votesCount >= 0 ? ` (${option.votesCount})` : ''}\n
\n `,\n )\n .join('')}\n
`\n : '') +\n (mediaAttachments.length > 0\n ? '\\n' +\n mediaAttachments\n .map((media) => {\n const {\n description,\n meta,\n previewRemoteUrl,\n previewUrl,\n remoteUrl,\n url,\n type,\n } = media;\n const { original = {}, small } = meta || {};\n const width = small?.width || original?.width;\n const height = small?.height || original?.height;\n\n // Prefer remote over original\n const sourceMediaURL = remoteUrl || url;\n const previewMediaURL = previewRemoteUrl || previewUrl;\n const mediaURL = previewMediaURL || sourceMediaURL;\n\n const sourceMediaURLObj = sourceMediaURL\n ? URL.parse(sourceMediaURL)\n : null;\n const isVideoMaybe =\n type === 'unknown' &&\n sourceMediaURLObj &&\n /\\.(mp4|m4r|m4v|mov|webm)$/i.test(sourceMediaURLObj.pathname);\n const isAudioMaybe =\n type === 'unknown' &&\n sourceMediaURLObj &&\n /\\.(mp3|ogg|wav|m4a|m4p|m4b)$/i.test(sourceMediaURLObj.pathname);\n const isImage =\n type === 'image' ||\n (type === 'unknown' &&\n previewMediaURL &&\n !isVideoMaybe &&\n !isAudioMaybe);\n const isVideo = type === 'gifv' || type === 'video' || isVideoMaybe;\n const isAudio = type === 'audio' || isAudioMaybe;\n\n let mediaHTML = '';\n if (isImage) {\n mediaHTML = `

`;\n } else if (isVideo) {\n mediaHTML = `\n
\n ${description ? `
${description}` : ''}\n `;\n } else if (isAudio) {\n mediaHTML = `\n
\n ${description ? `
${description}` : ''}\n `;\n } else {\n mediaHTML = `\n
📄 ${\n description || sourceMediaURL\n }\n `;\n }\n\n return `
${mediaHTML}`;\n })\n .join('\\n')\n : '');\n\n const htmlCode = `\n
\n ${\n spoilerText\n ? `\n \n ${spoilerText}
\n ${contentHTML}\n \n `\n : contentHTML\n }\n \n
\n `;\n\n return prettify(htmlCode);\n}\n\nfunction PostEmbedModal({ post, instance, onClose }) {\n const { t } = useLingui();\n const {\n account: {\n url: accountURL,\n displayName,\n username,\n emojis: accountEmojis,\n bot,\n group,\n },\n id,\n poll,\n spoilerText,\n language,\n editedAt,\n createdAt,\n content,\n mediaAttachments,\n url,\n emojis,\n } = post;\n\n const htmlCode = generateHTMLCode(post, instance);\n return (\n
\n {!!onClose && (\n
\n )}\n
\n
\n \n HTML Code\n
\n \n \n {!!mediaAttachments?.length && (\n \n )}\n {!!accountEmojis?.length && (\n \n \n Account Emojis:\n
\n \n {accountEmojis.map((emoji) => {\n return (\n - \n \n \n
\n {' '}\n :{emoji.shortcode}:
(\n \n URL\n \n )\n {emoji.staticUrl ? (\n <>\n {' '}\n (\n \n static URL\n \n )\n >\n ) : null}\n \n );\n })}\n
\n \n )}\n {!!emojis?.length && (\n \n \n Emojis:\n
\n \n {emojis.map((emoji) => {\n return (\n - \n \n \n
\n {' '}\n :{emoji.shortcode}:
(\n \n URL\n \n )\n {emoji.staticUrl ? (\n <>\n {' '}\n (\n \n static URL\n \n )\n >\n ) : null}\n \n );\n })}\n
\n \n )}\n \n \n \n Notes:\n
\n \n - \n \n This is static, unstyled and scriptless. You may need to apply\n your own styles and edit as needed.\n \n
\n - \n \n Polls are not interactive, becomes a list with vote counts.\n \n
\n - \n \n Media attachments can be images, videos, audios or any file\n types.\n \n
\n - \n Post could be edited or deleted later.\n
\n
\n \n \n \n Preview\n
\n \n \n \n Note: This preview is lightly styled.\n \n
\n \n
\n );\n}\n\nexport default PostEmbedModal;\n","import { forwardRef } from 'preact/compat';\nimport { useEffect, useState } from 'preact/hooks';\n\nimport shortenNumber from '../utils/shorten-number';\n\nimport Icon from './icon';\n\nconst StatusButton = forwardRef((props, ref) => {\n let {\n checked,\n count,\n class: className,\n title,\n alt,\n size,\n icon,\n iconSize = 'l',\n onClick,\n ...otherProps\n } = props;\n if (typeof title === 'string') {\n title = [title, title];\n }\n if (typeof alt === 'string') {\n alt = [alt, alt];\n }\n\n const [buttonTitle, setButtonTitle] = useState(title[0] || '');\n const [iconAlt, setIconAlt] = useState(alt[0] || '');\n\n useEffect(() => {\n if (checked) {\n setButtonTitle(title[1] || '');\n setIconAlt(alt[1] || '');\n } else {\n setButtonTitle(title[0] || '');\n setIconAlt(alt[0] || '');\n }\n }, [checked, title, alt]);\n\n return (\n
\n );\n});\n\nexport default StatusButton;\n","export class LiteYTEmbed extends HTMLElement {\n constructor() {\n super();\n this.isIframeLoaded = false;\n this.setupDom();\n }\n static get observedAttributes() {\n return ['videoid', 'playlistid', 'videoplay', 'videotitle'];\n }\n connectedCallback() {\n this.addEventListener('pointerover', () => LiteYTEmbed.warmConnections(this), {\n once: true,\n });\n this.addEventListener('click', () => this.addIframe());\n }\n get videoId() {\n return encodeURIComponent(this.getAttribute('videoid') || '');\n }\n set videoId(id) {\n this.setAttribute('videoid', id);\n }\n get playlistId() {\n return encodeURIComponent(this.getAttribute('playlistid') || '');\n }\n set playlistId(id) {\n this.setAttribute('playlistid', id);\n }\n get videoTitle() {\n return this.getAttribute('videotitle') || 'Video';\n }\n set videoTitle(title) {\n this.setAttribute('videotitle', title);\n }\n get videoPlay() {\n return this.getAttribute('videoplay') || 'Play';\n }\n set videoPlay(name) {\n this.setAttribute('videoplay', name);\n }\n get videoStartAt() {\n return this.getAttribute('videoStartAt') || '0';\n }\n get autoLoad() {\n return this.hasAttribute('autoload');\n }\n get autoPause() {\n return this.hasAttribute('autopause');\n }\n get noCookie() {\n return this.hasAttribute('nocookie');\n }\n get posterQuality() {\n return this.getAttribute('posterquality') || 'hqdefault';\n }\n get posterLoading() {\n return (this.getAttribute('posterloading') ||\n 'lazy');\n }\n get params() {\n return `start=${this.videoStartAt}&${this.getAttribute('params')}`;\n }\n set params(opts) {\n this.setAttribute('params', opts);\n }\n set posterQuality(opts) {\n this.setAttribute('posterquality', opts);\n }\n get disableNoscript() {\n return this.hasAttribute('disablenoscript');\n }\n setupDom() {\n const shadowDom = this.attachShadow({ mode: 'open' });\n let nonce = '';\n if (window.liteYouTubeNonce) {\n nonce = `nonce=\"${window.liteYouTubeNonce}\"`;\n }\n shadowDom.innerHTML = `\n \n
\n
\n \n \n \n
\n \n \n
\n
\n `;\n this.domRefFrame = shadowDom.querySelector('#frame');\n this.domRefImg = {\n fallback: shadowDom.querySelector('#fallbackPlaceholder'),\n webp: shadowDom.querySelector('#webpPlaceholder'),\n jpeg: shadowDom.querySelector('#jpegPlaceholder'),\n };\n this.domRefPlayButton = shadowDom.querySelector('#playButton');\n }\n setupComponent() {\n const hasImgSlot = this.shadowRoot.querySelector('slot[name=image]');\n if (hasImgSlot.assignedNodes().length === 0) {\n this.initImagePlaceholder();\n }\n this.domRefPlayButton.setAttribute('aria-label', `${this.videoPlay}: ${this.videoTitle}`);\n this.setAttribute('title', `${this.videoPlay}: ${this.videoTitle}`);\n if (this.autoLoad || this.isYouTubeShort() || this.autoPause) {\n this.initIntersectionObserver();\n }\n if (!this.disableNoscript) {\n this.injectSearchNoScript();\n }\n }\n attributeChangedCallback(name, oldVal, newVal) {\n if (oldVal !== newVal) {\n this.setupComponent();\n if (this.domRefFrame.classList.contains('activated')) {\n this.domRefFrame.classList.remove('activated');\n this.shadowRoot.querySelector('iframe').remove();\n this.isIframeLoaded = false;\n }\n }\n }\n injectSearchNoScript() {\n const eleNoScript = document.createElement('noscript');\n this.prepend(eleNoScript);\n eleNoScript.innerHTML = this.generateIframe();\n }\n generateIframe(isIntersectionObserver = false) {\n let autoplay = isIntersectionObserver ? 0 : 1;\n let autoPause = this.autoPause ? '&enablejsapi=1' : '';\n const wantsNoCookie = this.noCookie ? '-nocookie' : '';\n let embedTarget;\n if (this.playlistId) {\n embedTarget = `?listType=playlist&list=${this.playlistId}&`;\n }\n else {\n embedTarget = `${this.videoId}?`;\n }\n if (this.isYouTubeShort()) {\n this.params = `loop=1&mute=1&modestbranding=1&playsinline=1&rel=0&enablejsapi=1&playlist=${this.videoId}`;\n autoplay = 1;\n }\n return `\n
`;\n }\n addIframe(isIntersectionObserver = false) {\n if (!this.isIframeLoaded) {\n const iframeHTML = this.generateIframe(isIntersectionObserver);\n this.domRefFrame.insertAdjacentHTML('beforeend', iframeHTML);\n this.domRefFrame.classList.add('activated');\n this.isIframeLoaded = true;\n this.attemptShortAutoPlay();\n this.dispatchEvent(new CustomEvent('liteYoutubeIframeLoaded', {\n detail: {\n videoId: this.videoId,\n },\n bubbles: true,\n cancelable: true,\n }));\n }\n }\n initImagePlaceholder() {\n this.testPosterImage();\n this.domRefImg.fallback.setAttribute('aria-label', `${this.videoPlay}: ${this.videoTitle}`);\n this.domRefImg?.fallback?.setAttribute('alt', `${this.videoPlay}: ${this.videoTitle}`);\n }\n async testPosterImage() {\n setTimeout(() => {\n const webpUrl = `https://i.ytimg.com/vi_webp/${this.videoId}/${this.posterQuality}.webp`;\n const img = new Image();\n img.fetchPriority = 'low';\n img.referrerPolicy = 'origin';\n img.src = webpUrl;\n img.onload = async (e) => {\n const target = e.target;\n const noPoster = target?.naturalHeight == 90 && target?.naturalWidth == 120;\n if (noPoster) {\n this.posterQuality = 'hqdefault';\n }\n const posterUrlWebp = `https://i.ytimg.com/vi_webp/${this.videoId}/${this.posterQuality}.webp`;\n this.domRefImg.webp.srcset = posterUrlWebp;\n const posterUrlJpeg = `https://i.ytimg.com/vi/${this.videoId}/${this.posterQuality}.jpg`;\n this.domRefImg.fallback.loading = this.posterLoading;\n this.domRefImg.jpeg.srcset = posterUrlJpeg;\n this.domRefImg.fallback.src = posterUrlJpeg;\n this.domRefImg.fallback.loading = this.posterLoading;\n };\n }, 100);\n }\n initIntersectionObserver() {\n const options = {\n root: null,\n rootMargin: '0px',\n threshold: 0,\n };\n const observer = new IntersectionObserver((entries, observer) => {\n entries.forEach(entry => {\n if (entry.isIntersecting && !this.isIframeLoaded) {\n LiteYTEmbed.warmConnections(this);\n this.addIframe(true);\n observer.unobserve(this);\n }\n });\n }, options);\n observer.observe(this);\n if (this.autoPause) {\n const windowPause = new IntersectionObserver((e, o) => {\n e.forEach(entry => {\n if (entry.intersectionRatio !== 1) {\n this.shadowRoot\n .querySelector('iframe')\n ?.contentWindow?.postMessage('{\"event\":\"command\",\"func\":\"pauseVideo\",\"args\":\"\"}', '*');\n }\n });\n }, { threshold: 1 });\n windowPause.observe(this);\n }\n }\n attemptShortAutoPlay() {\n if (this.isYouTubeShort()) {\n setTimeout(() => {\n this.shadowRoot\n .querySelector('iframe')\n ?.contentWindow?.postMessage('{\"event\":\"command\",\"func\":\"' + 'playVideo' + '\",\"args\":\"\"}', '*');\n }, 2000);\n }\n }\n isYouTubeShort() {\n return (this.getAttribute('short') === '' &&\n window.matchMedia('(max-width: 40em)').matches);\n }\n static addPrefetch(kind, url) {\n const linkElem = document.createElement('link');\n linkElem.rel = kind;\n linkElem.href = url;\n linkElem.crossOrigin = 'true';\n document.head.append(linkElem);\n }\n static warmConnections(context) {\n if (LiteYTEmbed.isPreconnected || window.liteYouTubeIsPreconnected)\n return;\n LiteYTEmbed.addPrefetch('preconnect', 'https://i.ytimg.com/');\n LiteYTEmbed.addPrefetch('preconnect', 'https://s.ytimg.com');\n if (!context.noCookie) {\n LiteYTEmbed.addPrefetch('preconnect', 'https://www.youtube.com');\n LiteYTEmbed.addPrefetch('preconnect', 'https://www.google.com');\n LiteYTEmbed.addPrefetch('preconnect', 'https://googleads.g.doubleclick.net');\n LiteYTEmbed.addPrefetch('preconnect', 'https://static.doubleclick.net');\n }\n else {\n LiteYTEmbed.addPrefetch('preconnect', 'https://www.youtube-nocookie.com');\n }\n LiteYTEmbed.isPreconnected = true;\n window.liteYouTubeIsPreconnected = true;\n }\n}\nLiteYTEmbed.isPreconnected = false;\ncustomElements.define('lite-youtube', LiteYTEmbed);\n//# sourceMappingURL=lite-youtube.js.map","import { Trans } from '@lingui/react/macro';\n\nimport Icon from './icon';\nimport NameText from './name-text';\n\nfunction Byline({ authors, hidden, children }) {\n if (hidden) return children;\n if (!authors?.[0]?.account?.id) return children;\n const author = authors[0].account;\n\n return (\n
\n {children}\n
\n {' '}\n \n \n More from \n \n \n
\n
\n );\n}\n\nexport default Byline;\n","import '@justinribeiro/lite-youtube';\n\nimport { decodeBlurHash, getBlurHashAverageColor } from 'fast-blurhash';\nimport { useCallback, useEffect, useState } from 'preact/hooks';\nimport { useSnapshot } from 'valtio';\n\nimport getDomain from '../utils/get-domain';\nimport isMastodonLinkMaybe from '../utils/isMastodonLinkMaybe';\nimport states from '../utils/states';\nimport unfurlMastodonLink from '../utils/unfurl-link';\n\nimport Byline from './byline';\nimport Icon from './icon';\nimport RelativeTime from './relative-time';\n\n// \"Post\": Quote post + card link preview combo\n// Assume all links from these domains are \"posts\"\n// Mastodon links are \"posts\" too but they are converted to real quote posts and there's too many domains to check\n// This is just \"Progressive Enhancement\"\nfunction isCardPost(domain) {\n return [\n 'x.com',\n 'twitter.com',\n 'threads.net',\n 'bsky.app',\n 'bsky.brid.gy',\n 'fed.brid.gy',\n ].includes(domain);\n}\n\nfunction StatusCard({ card, selfReferential, selfAuthor, instance }) {\n const snapStates = useSnapshot(states);\n const {\n blurhash,\n title,\n description,\n html,\n providerName,\n providerUrl,\n authorName,\n authorUrl,\n width,\n height,\n image,\n imageDescription,\n url,\n type,\n embedUrl,\n language,\n publishedAt,\n authors,\n } = card;\n\n /* type\n link = Link OEmbed\n photo = Photo OEmbed\n video = Video OEmbed\n rich = iframe OEmbed. Not currently accepted, so won't show up in practice.\n */\n\n const hasText = title || providerName || authorName;\n const isLandscape = width / height >= 1.2;\n const size = isLandscape ? 'large' : '';\n\n const [cardStatusURL, setCardStatusURL] = useState(null);\n // const [cardStatusID, setCardStatusID] = useState(null);\n useEffect(() => {\n if (hasText && image && !selfReferential && isMastodonLinkMaybe(url)) {\n unfurlMastodonLink(instance, url).then((result) => {\n if (!result) return;\n const { id, url } = result;\n setCardStatusURL('#' + url);\n\n // NOTE: This is for quote post\n // (async () => {\n // const { masto } = api({ instance });\n // const status = await masto.v1.statuses.$select(id).fetch();\n // saveStatus(status, instance);\n // setCardStatusID(id);\n // })();\n });\n }\n }, [hasText, image, selfReferential]);\n\n // if (cardStatusID) {\n // return (\n //
\n // );\n // }\n\n if (snapStates.unfurledLinks[url]) return null;\n\n const hasIframeHTML = /
\n {!!showEdited && (\n