'\n * @return {Object} - map of attributes key = attribute name, value = attribute value\n * attributes without values represented as boolean true\n */\nexport const getAttrs = tag => {\n const innertag = tag\n .substring(1, tag.length - 1)\n .replace(new RegExp('^' + getTagName(tag)), '')\n .replace(/\\/?$/, '')\n .trim()\n const attrs = Array.from(innertag.matchAll(/([a-z0-9-]+)(?:=(\"[^\"]+?\"|'[^']+?'))?/gi))\n .map(([trash, key, value]) => [key, value])\n .map(([k, v]) => {\n if (!v) return [k, true]\n return [k, v.substring(1, v.length - 1)]\n })\n return Object.fromEntries(attrs)\n}\n\n/**\n * Finds shortcodes in text\n *\n * @param {String} text - original text to find emojis in\n * @param {{ url: String, shortcode: Sring }[]} emoji - list of shortcodes to find\n * @param {Function} processor - function to call on each encountered emoji,\n * function is passed single object containing matching emoji ({ url, shortcode })\n * return value will be inserted into resulting array instead of :shortcode:\n * @return {Array} resulting array with non-emoji parts of text and whatever {processor}\n * returned for emoji\n */\nexport const processTextForEmoji = (text, emojis, processor) => {\n const buffer = []\n let textBuffer = ''\n for (let i = 0; i < text.length; i++) {\n const char = text[i]\n if (char === ':') {\n const next = text.slice(i + 1)\n let found = false\n for (let emoji of emojis) {\n if (next.slice(0, emoji.shortcode.length + 1) === (emoji.shortcode + ':')) {\n found = emoji\n break\n }\n }\n if (found) {\n buffer.push(textBuffer)\n textBuffer = ''\n buffer.push(processor(found))\n i += found.shortcode.length + 1\n } else {\n textBuffer += char\n }\n } else {\n textBuffer += char\n }\n }\n if (textBuffer) buffer.push(textBuffer)\n return buffer\n}\n","import { getTagName } from './utility.service.js'\n\n/**\n * This is a tiny purpose-built HTML parser/processor. This basically detects\n * any type of visual newline and converts entire HTML into a array structure.\n *\n * Text nodes are represented as object with single property - text - containing\n * the visual line. Intended usage is to process the array with .map() in which\n * map function returns a string and resulting array can be converted back to html\n * with a .join('').\n *\n * Generally this isn't very useful except for when you really need to either\n * modify visual lines (greentext i.e. simple quoting) or do something with\n * first/last line.\n *\n * known issue: doesn't handle CDATA so nested CDATA might not work well\n *\n * @param {Object} input - input data\n * @return {(string|{ text: string })[]} processed html in form of a list.\n */\nexport const convertHtmlToLines = (html = '') => {\n // Elements that are implicitly self-closing\n // https://developer.mozilla.org/en-US/docs/Glossary/empty_element\n const emptyElements = new Set([\n 'area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input',\n 'keygen', 'link', 'meta', 'param', 'source', 'track', 'wbr'\n ])\n // Block-level element (they make a visual line)\n // https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements\n const blockElements = new Set([\n 'address', 'article', 'aside', 'blockquote', 'details', 'dialog', 'dd',\n 'div', 'dl', 'dt', 'fieldset', 'figcaption', 'figure', 'footer', 'form',\n 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'header', 'hgroup', 'hr', 'li', 'main',\n 'nav', 'ol', 'p', 'pre', 'section', 'table', 'ul'\n ])\n // br is very weird in a way that it's technically not block-level, it's\n // essentially converted to a \\n (or \\r\\n). There's also wbr but it doesn't\n // guarantee linebreak, only suggest it.\n const linebreakElements = new Set(['br'])\n\n const visualLineElements = new Set([\n ...blockElements.values(),\n ...linebreakElements.values()\n ])\n\n // All block-level elements that aren't empty elements, i.e. not
\n const nonEmptyElements = new Set(visualLineElements)\n // Difference\n for (let elem of emptyElements) {\n nonEmptyElements.delete(elem)\n }\n\n // All elements that we are recognizing\n const allElements = new Set([\n ...nonEmptyElements.values(),\n ...emptyElements.values()\n ])\n\n let buffer = [] // Current output buffer\n const level = [] // How deep we are in tags and which tags were there\n let textBuffer = '' // Current line content\n let tagBuffer = null // Current tag buffer, if null = we are not currently reading a tag\n\n const flush = () => { // Processes current line buffer, adds it to output buffer and clears line buffer\n if (textBuffer.trim().length > 0) {\n buffer.push({ level: [...level], text: textBuffer })\n } else {\n buffer.push(textBuffer)\n }\n textBuffer = ''\n }\n\n const handleBr = (tag) => { // handles single newlines/linebreaks/selfclosing\n flush()\n buffer.push(tag)\n }\n\n const handleOpen = (tag) => { // handles opening tags\n flush()\n buffer.push(tag)\n level.unshift(getTagName(tag))\n }\n\n const handleClose = (tag) => { // handles closing tags\n if (level[0] === getTagName(tag)) {\n flush()\n buffer.push(tag)\n level.shift()\n } else { // Broken case\n textBuffer += tag\n }\n }\n\n for (let i = 0; i < html.length; i++) {\n const char = html[i]\n if (char === '<' && tagBuffer === null) {\n tagBuffer = char\n } else if (char !== '>' && tagBuffer !== null) {\n tagBuffer += char\n } else if (char === '>' && tagBuffer !== null) {\n tagBuffer += char\n const tagFull = tagBuffer\n tagBuffer = null\n const tagName = getTagName(tagFull)\n if (allElements.has(tagName)) {\n if (linebreakElements.has(tagName)) {\n handleBr(tagFull)\n } else if (nonEmptyElements.has(tagName)) {\n if (tagFull[1] === '/') {\n handleClose(tagFull)\n } else if (tagFull[tagFull.length - 2] === '/') {\n // self-closing\n handleBr(tagFull)\n } else {\n handleOpen(tagFull)\n }\n } else {\n textBuffer += tagFull\n }\n } else {\n textBuffer += tagFull\n }\n } else if (char === '\\n') {\n handleBr(char)\n } else {\n textBuffer += char\n }\n }\n if (tagBuffer) {\n textBuffer += tagBuffer\n }\n\n flush()\n\n return buffer\n}\n","\n \n \n \n \n \n\n\n\n\n\n","\n \n \n \n \n \n \n \n 0\"\n class=\"action-counter\"\n >\n {{ status.replies_count }}\n \n
\n\n\n\n\n\n","import { library } from '@fortawesome/fontawesome-svg-core'\nimport { faReply } from '@fortawesome/free-solid-svg-icons'\n\nlibrary.add(faReply)\n\nconst ReplyButton = {\n name: 'ReplyButton',\n props: ['status', 'replying'],\n computed: {\n loggedIn () {\n return !!this.$store.state.users.currentUser\n }\n }\n}\n\nexport default ReplyButton\n","import { render } from \"./reply_button.vue?vue&type=template&id=56f413c0\"\nimport script from \"./reply_button.js?vue&type=script&lang=js\"\nexport * from \"./reply_button.js?vue&type=script&lang=js\"\n\nimport \"./reply_button.vue?vue&type=style&index=0&id=56f413c0&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n \n \n \n \n \n \n 0\"\n class=\"action-counter\"\n >\n {{ status.fave_num }}\n \n
\n\n\n\n\n\n","import { mapGetters } from 'vuex'\nimport { library } from '@fortawesome/fontawesome-svg-core'\nimport { faStar } from '@fortawesome/free-solid-svg-icons'\nimport {\n faStar as faStarRegular\n} from '@fortawesome/free-regular-svg-icons'\n\nlibrary.add(\n faStar,\n faStarRegular\n)\n\nconst FavoriteButton = {\n props: ['status', 'loggedIn'],\n data () {\n return {\n animated: false\n }\n },\n methods: {\n favorite () {\n if (!this.status.favorited) {\n this.$store.dispatch('favorite', { id: this.status.id })\n } else {\n this.$store.dispatch('unfavorite', { id: this.status.id })\n }\n this.animated = true\n setTimeout(() => {\n this.animated = false\n }, 500)\n }\n },\n computed: {\n ...mapGetters(['mergedConfig'])\n }\n}\n\nexport default FavoriteButton\n","import { render } from \"./favorite_button.vue?vue&type=template&id=21f861d8\"\nimport script from \"./favorite_button.js?vue&type=script&lang=js\"\nexport * from \"./favorite_button.js?vue&type=script&lang=js\"\n\nimport \"./favorite_button.vue?vue&type=style&index=0&id=21f861d8&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n \n \n \n
\n \n
\n {{ emoji.replacement }}\n \n \n \n \n \n {{ emoji.replacement }}\n \n \n \n \n
\n \n \n \n \n \n \n {{ user.screen_name_ui }}\n
\n \n
\n \n \n \n {{ reaction.count }}\n \n \n \n {{ reaction.name }}\n \n {{ reaction.count }}\n \n \n \n \n {{ showAll ? $t('general.show_less') : showMoreString }}\n \n \n
\n
\n
\n \n \n \n
\n \n \n \n \n \n
\n
\n
\n \n \n \n \n \n \n \n
\n \n @{{ user.screen_name_ui }}\n \n \n \n {{ $t('user_card.deactivated') }}\n \n \n {{ $t(`general.role.${visibleRole}`) }}\n \n \n {{ $t('user_card.bot') }}\n \n \n \n \n \n {{ dailyAvg }} {{ $t('user_card.per_day') }}\n
\n
\n
\n
\n \n \n \n {{ ' ' }}\n \n \n \n \n \n \n \n
\n
\n
\n \n \n \n \n \n \n \n \n \n \n \n
\n \n {{ $t('user_card.muted') }}\n \n \n {{ $t('user_card.mute') }}\n \n
\n \n \n {{ $t('user_card.domain_muted') }}\n \n \n {{ $t('user_card.mute_domain') }}\n \n
\n \n \n {{ $t('user_card.mention') }}\n \n
\n \n \n \n \n \n \n \n \n \n \n {{ $t('user_card.statuses') }}
\n {{ user.statuses_count }}
\n \n \n {{ $t('user_card.followees') }}
\n {{ hideFollowsCount ? $t('user_card.hidden') : user.friends_count }}\n \n \n {{ $t('user_card.followers') }}
\n {{ hideFollowersCount ? $t('user_card.hidden') : user.followers_count }}\n \n \n \n \n \n\n\n\n\n\n","\n \n
\n \n \n \n \n \n {{ $t('user_card.admin_menu.moderation') }}\n \n \n \n \n \n \n \n {{ $t('user_card.admin_menu.delete_user') }}\n \n {{ $t('user_card.admin_menu.delete_user_confirmation') }}
\n \n \n {{ $t('general.cancel') }}\n \n \n {{ $t('user_card.admin_menu.delete_user') }}\n \n \n \n \n \n \n
\n \n \n \n\n\n\n\n\n","const DialogModal = {\n props: {\n darkOverlay: {\n default: true,\n type: Boolean\n },\n onCancel: {\n default: () => {},\n type: Function\n }\n }\n}\n\nexport default DialogModal\n","import { render } from \"./dialog_modal.vue?vue&type=template&id=202a26c4\"\nimport script from \"./dialog_modal.js?vue&type=script&lang=js\"\nexport * from \"./dialog_modal.js?vue&type=script&lang=js\"\n\nimport \"./dialog_modal.vue?vue&type=style&index=0&id=202a26c4&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","import { library } from '@fortawesome/fontawesome-svg-core'\nimport { faChevronDown } from '@fortawesome/free-solid-svg-icons'\n\nimport DialogModal from '../dialog_modal/dialog_modal.vue'\nimport Popover from '../popover/popover.vue'\n\nlibrary.add(faChevronDown)\n\nconst FORCE_NSFW = 'mrf_tag:media-force-nsfw'\nconst STRIP_MEDIA = 'mrf_tag:media-strip'\nconst FORCE_UNLISTED = 'mrf_tag:force-unlisted'\nconst DISABLE_REMOTE_SUBSCRIPTION = 'mrf_tag:disable-remote-subscription'\nconst DISABLE_ANY_SUBSCRIPTION = 'mrf_tag:disable-any-subscription'\nconst SANDBOX = 'mrf_tag:sandbox'\nconst QUARANTINE = 'mrf_tag:quarantine'\n\nconst ModerationTools = {\n props: [\n 'user'\n ],\n data () {\n return {\n tags: {\n FORCE_NSFW,\n STRIP_MEDIA,\n FORCE_UNLISTED,\n DISABLE_REMOTE_SUBSCRIPTION,\n DISABLE_ANY_SUBSCRIPTION,\n SANDBOX,\n QUARANTINE\n },\n showDeleteUserDialog: false,\n toggled: false\n }\n },\n components: {\n DialogModal,\n Popover\n },\n computed: {\n tagsSet () {\n return new Set(this.user.tags)\n },\n hasTagPolicy () {\n return this.$store.state.instance.tagPolicyAvailable\n }\n },\n methods: {\n hasTag (tagName) {\n return this.tagsSet.has(tagName)\n },\n toggleTag (tag) {\n const store = this.$store\n if (this.tagsSet.has(tag)) {\n store.state.api.backendInteractor.untagUser({ user: this.user, tag }).then(response => {\n if (!response.ok) { return }\n store.commit('untagUser', { user: this.user, tag })\n })\n } else {\n store.state.api.backendInteractor.tagUser({ user: this.user, tag }).then(response => {\n if (!response.ok) { return }\n store.commit('tagUser', { user: this.user, tag })\n })\n }\n },\n toggleRight (right) {\n const store = this.$store\n if (this.user.rights[right]) {\n store.state.api.backendInteractor.deleteRight({ user: this.user, right }).then(response => {\n if (!response.ok) { return }\n store.commit('updateRight', { user: this.user, right, value: false })\n })\n } else {\n store.state.api.backendInteractor.addRight({ user: this.user, right }).then(response => {\n if (!response.ok) { return }\n store.commit('updateRight', { user: this.user, right, value: true })\n })\n }\n },\n toggleActivationStatus () {\n this.$store.dispatch('toggleActivationStatus', { user: this.user })\n },\n deleteUserDialog (show) {\n this.showDeleteUserDialog = show\n },\n deleteUser () {\n const store = this.$store\n const user = this.user\n const { id, name } = user\n store.state.api.backendInteractor.deleteUser({ user })\n .then(e => {\n this.$store.dispatch('markStatusesAsDeleted', status => user.id === status.user.id)\n const isProfile = this.$route.name === 'external-user-profile' || this.$route.name === 'user-profile'\n const isTargetUser = this.$route.params.name === name || this.$route.params.id === id\n if (isProfile && isTargetUser) {\n window.history.back()\n }\n })\n },\n setToggled (value) {\n this.toggled = value\n }\n }\n}\n\nexport default ModerationTools\n","import { render } from \"./moderation_tools.vue?vue&type=template&id=0ae1f97e\"\nimport script from \"./moderation_tools.js?vue&type=script&lang=js\"\nexport * from \"./moderation_tools.js?vue&type=script&lang=js\"\n\nimport \"./moderation_tools.vue?vue&type=style&index=0&id=0ae1f97e&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n
\n \n \n \n \n \n \n \n \n \n
\n\n \n\n \n \n \n \n \n \n\n\n\n\n","\n \n \n \n \n \n {{ percentageForOption(option.votes_count) }}%\n \n \n
\n \n \n \n \n \n \n \n \n \n \n\n\n\n\n\n","import Timeago from 'components/timeago/timeago.vue'\nimport RichContent from 'components/rich_content/rich_content.jsx'\nimport { forEach, map } from 'lodash'\n\nexport default {\n name: 'Poll',\n props: ['basePoll', 'emoji'],\n components: {\n Timeago,\n RichContent\n },\n data () {\n return {\n loading: false,\n choices: []\n }\n },\n created () {\n if (!this.$store.state.polls.pollsObject[this.pollId]) {\n this.$store.dispatch('mergeOrAddPoll', this.basePoll)\n }\n this.$store.dispatch('trackPoll', this.pollId)\n },\n unmounted () {\n this.$store.dispatch('untrackPoll', this.pollId)\n },\n computed: {\n pollId () {\n return this.basePoll.id\n },\n poll () {\n const storePoll = this.$store.state.polls.pollsObject[this.pollId]\n return storePoll || {}\n },\n options () {\n return (this.poll && this.poll.options) || []\n },\n expiresAt () {\n return (this.poll && this.poll.expires_at) || 0\n },\n expired () {\n return (this.poll && this.poll.expired) || false\n },\n loggedIn () {\n return this.$store.state.users.currentUser\n },\n showResults () {\n return this.poll.voted || this.expired || !this.loggedIn\n },\n totalVotesCount () {\n return this.poll.votes_count\n },\n containerClass () {\n return {\n loading: this.loading\n }\n },\n choiceIndices () {\n // Convert array of booleans into an array of indices of the\n // items that were 'true', so [true, false, false, true] becomes\n // [0, 3].\n return this.choices\n .map((entry, index) => entry && index)\n .filter(value => typeof value === 'number')\n },\n isDisabled () {\n const noChoice = this.choiceIndices.length === 0\n return this.loading || noChoice\n }\n },\n methods: {\n percentageForOption (count) {\n return this.totalVotesCount === 0 ? 0 : Math.round(count / this.totalVotesCount * 100)\n },\n resultTitle (option) {\n return `${option.votes_count}/${this.totalVotesCount} ${this.$t('polls.votes')}`\n },\n fetchPoll () {\n this.$store.dispatch('refreshPoll', { id: this.statusId, pollId: this.poll.id })\n },\n activateOption (index) {\n // forgive me father: doing checking the radio/checkboxes\n // in code because of customized input elements need either\n // a) an extra element for the actual graphic, or b) use a\n // pseudo element for the label. We use b) which mandates\n // using \"for\" and \"id\" matching which isn't nice when the\n // same poll appears multiple times on the site (notifs and\n // timeline for example). With code we can make sure it just\n // works without altering the pseudo element implementation.\n const allElements = this.$el.querySelectorAll('input')\n const clickedElement = this.$el.querySelector(`input[value=\"${index}\"]`)\n if (this.poll.multiple) {\n // Checkboxes, toggle only the clicked one\n clickedElement.checked = !clickedElement.checked\n } else {\n // Radio button, uncheck everything and check the clicked one\n forEach(allElements, element => { element.checked = false })\n clickedElement.checked = true\n }\n this.choices = map(allElements, e => e.checked)\n },\n optionId (index) {\n return `poll${this.poll.id}-${index}`\n },\n vote () {\n if (this.choiceIndices.length === 0) return\n this.loading = true\n this.$store.dispatch(\n 'votePoll',\n { id: this.statusId, pollId: this.poll.id, choices: this.choiceIndices }\n ).then(poll => {\n this.loading = false\n })\n }\n }\n}\n","import { render } from \"./poll.vue?vue&type=template&id=5e9dea28\"\nimport script from \"./poll.js?vue&type=script&lang=js\"\nexport * from \"./poll.js?vue&type=script&lang=js\"\n\nimport \"./poll.vue?vue&type=style&index=0&id=5e9dea28&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n \n
\n \n \n {{ $t(\"status.hide_full_subject\") }}\n \n \n {{ $t(\"status.show_full_subject\") }}\n \n for paragraphs, GS uses
between them)\n // as well as approximate line count by counting characters and approximating ~80\n // per line.\n //\n // Using max-height + overflow: auto for status components resulted in false positives\n // very often with japanese characters, and it was very annoying.\n tallStatus () {\n if (this.singleLine || this.compact) return false\n const lengthScore = this.status.raw_html.split(/ 20\n },\n longSubject () {\n return this.status.summary.length > 240\n },\n // When a status has a subject and is also tall, we should only have one show more/less button. If the default is to collapse statuses with subjects, we just treat it like a status with a subject; otherwise, we just treat it like a tall status.\n mightHideBecauseSubject () {\n return !!this.status.summary && this.localCollapseSubjectDefault\n },\n mightHideBecauseTall () {\n return this.tallStatus && !(this.status.summary && this.localCollapseSubjectDefault)\n },\n hideSubjectStatus () {\n return this.mightHideBecauseSubject && !this.expandingSubject\n },\n hideTallStatus () {\n return this.mightHideBecauseTall && !this.showingTall\n },\n showingMore () {\n return (this.mightHideBecauseTall && this.showingTall) || (this.mightHideBecauseSubject && this.expandingSubject)\n },\n attachmentTypes () {\n return this.status.attachments.map(file => fileType.fileType(file.mimetype))\n },\n ...mapGetters(['mergedConfig'])\n },\n components: {\n RichContent\n },\n mounted () {\n this.status.attentions && this.status.attentions.forEach(attn => {\n const { id } = attn\n this.$store.dispatch('fetchUserIfMissing', id)\n })\n },\n methods: {\n onParseReady (event) {\n if (this.parseReadyDone) return\n this.parseReadyDone = true\n this.$emit('parseReady', event)\n const { writtenMentions, invisibleMentions } = event\n writtenMentions\n .filter(mention => !mention.notifying)\n .forEach(mention => {\n const { content, url } = mention\n const cleanedString = content.replace(/<[^>]+?>/gi, '') // remove all tags\n if (!cleanedString.startsWith('@')) return\n const handle = cleanedString.slice(1)\n const host = url.replace(/^https?:\\/\\//, '').replace(/\\/.+?$/, '')\n this.$store.dispatch('fetchUserIfMissing', `${handle}@${host}`)\n })\n /* This is a bit of a hack to make current tall status detector work\n * with rich mentions. Invisible mentions are detected at RichContent level\n * and also we generate plaintext version of mentions by stripping tags\n * so here we subtract from post length by each mention that became invisible\n * via MentionsLine\n */\n this.postLength = invisibleMentions.reduce((acc, mention) => {\n return acc - mention.textContent.length - 1\n }, this.postLength)\n },\n toggleShowMore () {\n if (this.mightHideBecauseTall) {\n this.toggleShowingTall()\n } else if (this.mightHideBecauseSubject) {\n this.toggleExpandingSubject()\n }\n },\n generateTagLink (tag) {\n return `/tag/${tag}`\n }\n }\n}\n\nexport default StatusContent\n","import { render } from \"./status_body.vue?vue&type=template&id=56d3fd78\"\nimport script from \"./status_body.js?vue&type=script&lang=js\"\nexport * from \"./status_body.js?vue&type=script&lang=js\"\n\nimport \"./status_body.scss?vue&type=style&index=0&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","import Attachment from '../attachment/attachment.vue'\nimport Poll from '../poll/poll.vue'\nimport Gallery from '../gallery/gallery.vue'\nimport StatusBody from 'src/components/status_body/status_body.vue'\nimport LinkPreview from '../link-preview/link-preview.vue'\nimport { mapGetters, mapState } from 'vuex'\nimport { library } from '@fortawesome/fontawesome-svg-core'\nimport {\n faCircleNotch,\n faFile,\n faMusic,\n faImage,\n faLink,\n faPollH\n} from '@fortawesome/free-solid-svg-icons'\n\nlibrary.add(\n faCircleNotch,\n faFile,\n faMusic,\n faImage,\n faLink,\n faPollH\n)\n\nconst camelCase = name => name.charAt(0).toUpperCase() + name.slice(1)\n\nconst controlledOrUncontrolledGetters = list => list.reduce((res, name) => {\n const camelized = camelCase(name)\n const toggle = `controlledToggle${camelized}`\n const controlledName = `controlled${camelized}`\n const uncontrolledName = `uncontrolled${camelized}`\n res[name] = function () {\n return ((this.$data[toggle] !== undefined || this.$props[toggle] !== undefined) && this[toggle]) ? this[controlledName] : this[uncontrolledName]\n }\n return res\n}, {})\n\nconst controlledOrUncontrolledToggle = (obj, name) => {\n const camelized = camelCase(name)\n const toggle = `controlledToggle${camelized}`\n const uncontrolledName = `uncontrolled${camelized}`\n if (obj[toggle]) {\n obj[toggle]()\n } else {\n obj[uncontrolledName] = !obj[uncontrolledName]\n }\n}\n\nconst StatusContent = {\n name: 'StatusContent',\n props: [\n 'status',\n 'compact',\n 'focused',\n 'noHeading',\n 'fullContent',\n 'singleLine',\n 'controlledShowingTall',\n 'controlledExpandingSubject',\n 'controlledToggleShowingTall',\n 'controlledToggleExpandingSubject',\n 'controlledShowingLongSubject',\n 'controlledToggleShowingLongSubject'\n ],\n data () {\n return {\n uncontrolledShowingTall: this.fullContent || (this.inConversation && this.focused),\n uncontrolledShowingLongSubject: false,\n // not as computed because it sets the initial state which will be changed later\n uncontrolledExpandingSubject: !this.$store.getters.mergedConfig.collapseMessageWithSubject\n }\n },\n computed: {\n ...controlledOrUncontrolledGetters(['showingTall', 'expandingSubject', 'showingLongSubject']),\n hideAttachments () {\n return (this.mergedConfig.hideAttachments && !this.inConversation) ||\n (this.mergedConfig.hideAttachmentsInConv && this.inConversation)\n },\n nsfwClickthrough () {\n if (!this.status.nsfw) {\n return false\n }\n if (this.status.summary && this.localCollapseSubjectDefault) {\n return false\n }\n return true\n },\n attachmentSize () {\n if (this.compact) {\n return 'small'\n } else if ((this.mergedConfig.hideAttachments && !this.inConversation) ||\n (this.mergedConfig.hideAttachmentsInConv && this.inConversation) ||\n (this.status.attachments.length > this.maxThumbnails)) {\n return 'hide'\n }\n return 'normal'\n },\n maxThumbnails () {\n return this.mergedConfig.maxThumbnails\n },\n ...mapGetters(['mergedConfig']),\n ...mapState({\n currentUser: state => state.users.currentUser\n })\n },\n components: {\n Attachment,\n Poll,\n Gallery,\n LinkPreview,\n StatusBody\n },\n methods: {\n toggleShowingTall () {\n controlledOrUncontrolledToggle(this, 'showingTall')\n },\n toggleExpandingSubject () {\n controlledOrUncontrolledToggle(this, 'expandingSubject')\n },\n toggleShowingLongSubject () {\n controlledOrUncontrolledToggle(this, 'showingLongSubject')\n },\n setMedia () {\n const attachments = this.attachmentSize === 'hide' ? this.status.attachments : this.galleryAttachments\n return () => this.$store.dispatch('setMedia', attachments)\n }\n }\n}\n\nexport default StatusContent\n","import { render } from \"./status_content.vue?vue&type=template&id=475fea91\"\nimport script from \"./status_content.js?vue&type=script&lang=js\"\nexport * from \"./status_content.js?vue&type=script&lang=js\"\n\nimport \"./status_content.vue?vue&type=style&index=0&id=475fea91&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","export const SECOND = 1000\nexport const MINUTE = 60 * SECOND\nexport const HOUR = 60 * MINUTE\nexport const DAY = 24 * HOUR\nexport const WEEK = 7 * DAY\nexport const MONTH = 30 * DAY\nexport const YEAR = 365.25 * DAY\n\nexport const relativeTime = (date, nowThreshold = 1) => {\n if (typeof date === 'string') date = Date.parse(date)\n const round = Date.now() > date ? Math.floor : Math.ceil\n const d = Math.abs(Date.now() - date)\n let r = { num: round(d / YEAR), key: 'time.years' }\n if (d < nowThreshold * SECOND) {\n r.num = 0\n r.key = 'time.now'\n } else if (d < MINUTE) {\n r.num = round(d / SECOND)\n r.key = 'time.seconds'\n } else if (d < HOUR) {\n r.num = round(d / MINUTE)\n r.key = 'time.minutes'\n } else if (d < DAY) {\n r.num = round(d / HOUR)\n r.key = 'time.hours'\n } else if (d < WEEK) {\n r.num = round(d / DAY)\n r.key = 'time.days'\n } else if (d < MONTH) {\n r.num = round(d / WEEK)\n r.key = 'time.weeks'\n } else if (d < YEAR) {\n r.num = round(d / MONTH)\n r.key = 'time.months'\n }\n // Remove plural form when singular\n if (r.num === 1) r.key = r.key.slice(0, -1)\n return r\n}\n\nexport const relativeTimeShort = (date, nowThreshold = 1) => {\n const r = relativeTime(date, nowThreshold)\n r.key += '_short'\n return r\n}\n","\n \n \n \n \n \n \n\n\n\n\n\n","const StillImage = {\n props: [\n 'src',\n 'referrerpolicy',\n 'mimetype',\n 'imageLoadError',\n 'imageLoadHandler',\n 'alt',\n 'height',\n 'width'\n ],\n data () {\n return {\n stopGifs: this.$store.getters.mergedConfig.stopGifs\n }\n },\n computed: {\n animated () {\n return this.stopGifs && (this.mimetype === 'image/gif' || this.src.endsWith('.gif'))\n },\n style () {\n const appendPx = (str) => /\\d$/.test(str) ? str + 'px' : str\n return {\n height: this.height ? appendPx(this.height) : null,\n width: this.width ? appendPx(this.width) : null\n }\n }\n },\n methods: {\n onLoad () {\n const image = this.$refs.src\n if (!image) return\n this.imageLoadHandler && this.imageLoadHandler(image)\n const canvas = this.$refs.canvas\n if (!canvas) return\n const width = image.naturalWidth\n const height = image.naturalHeight\n canvas.width = width\n canvas.height = height\n canvas.getContext('2d').drawImage(image, 0, 0, width, height)\n },\n onError () {\n this.imageLoadError && this.imageLoadError()\n }\n }\n}\n\nexport default StillImage\n","import { render } from \"./still-image.vue?vue&type=template&id=4da90e4a\"\nimport script from \"./still-image.js?vue&type=script&lang=js\"\nexport * from \"./still-image.js?vue&type=script&lang=js\"\n\nimport \"./still-image.vue?vue&type=style&index=0&id=4da90e4a&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n \n \n \n \n \n \n\n\n\n\n\n","import { render } from \"./checkbox.vue?vue&type=template&id=deb5bfe6\"\nimport script from \"./checkbox.vue?vue&type=script&lang=js\"\nexport * from \"./checkbox.vue?vue&type=script&lang=js\"\n\nimport \"./checkbox.vue?vue&type=style&index=0&id=deb5bfe6&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n \n \n \n {{ ' ' }}\n \n \n\n\n\n\n\n","import { library } from '@fortawesome/fontawesome-svg-core'\nimport {\n faChevronDown\n} from '@fortawesome/free-solid-svg-icons'\n\nlibrary.add(\n faChevronDown\n)\n\nexport default {\n emits: ['update:modelValue'],\n props: [\n 'modelValue',\n 'disabled',\n 'unstyled',\n 'kind'\n ]\n}\n","import { render } from \"./select.vue?vue&type=template&id=099d3e32\"\nimport script from \"./select.js?vue&type=script&lang=js\"\nexport * from \"./select.js?vue&type=script&lang=js\"\n\nimport \"./select.vue?vue&type=style&index=0&id=099d3e32&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n \n \n \n \n \n \n @{{ user.screen_name_ui }}\n \n
\n \n \n \n\n\n\n\n\n","import UserCard from '../user_card/user_card.vue'\nimport UserAvatar from '../user_avatar/user_avatar.vue'\nimport RichContent from 'src/components/rich_content/rich_content.jsx'\nimport generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'\n\nconst BasicUserCard = {\n props: [\n 'user'\n ],\n data () {\n return {\n userExpanded: false\n }\n },\n components: {\n UserCard,\n UserAvatar,\n RichContent\n },\n methods: {\n toggleUserExpanded () {\n this.userExpanded = !this.userExpanded\n },\n userProfileLink (user) {\n return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)\n }\n }\n}\n\nexport default BasicUserCard\n","import { render } from \"./basic_user_card.vue?vue&type=template&id=dd332bac\"\nimport script from \"./basic_user_card.js?vue&type=script&lang=js\"\nexport * from \"./basic_user_card.js?vue&type=script&lang=js\"\n\nimport \"./basic_user_card.vue?vue&type=style&index=0&id=dd332bac&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","import { convert, brightness, contrastRatio } from 'chromatism'\nimport { alphaBlendLayers, getTextColor, relativeLuminance } from '../color_convert/color_convert.js'\nimport { LAYERS, DEFAULT_OPACITY, SLOT_INHERITANCE } from './pleromafe.js'\n\n/*\n * # What's all this?\n * Here be theme engine for pleromafe. All of this supposed to ease look\n * and feel customization, making widget styles and make developer's life\n * easier when it comes to supporting themes. Like many other theme systems\n * it operates on color definitions, or \"slots\" - for example you define\n * \"button\" color slot and then in UI component Button's CSS you refer to\n * it as a CSS3 Variable.\n *\n * Some applications allow you to customize colors for certain things.\n * Some UI toolkits allow you to define colors for each type of widget.\n * Most of them are pretty barebones and have no assistance for common\n * problems and cases, and in general themes themselves are very hard to\n * maintain in all aspects. This theme engine tries to solve all of the\n * common problems with themes.\n *\n * You don't have redefine several similar colors if you just want to\n * change one color - all color slots are derived from other ones, so you\n * can have at least one or two \"basic\" colors defined and have all other\n * components inherit and modify basic ones.\n *\n * You don't have to test contrast ratio for colors or pick text color for\n * each element even if you have light-on-dark elements in dark-on-light\n * theme.\n *\n * You don't have to maintain order of code for inheriting slots from othet\n * slots - dependency graph resolving does it for you.\n */\n\n/* This indicates that this version of code outputs similar theme data and\n * should be incremented if output changes - for instance if getTextColor\n * function changes and older themes no longer render text colors as\n * author intended previously.\n */\nexport const CURRENT_VERSION = 3\n\nexport const getLayersArray = (layer, data = LAYERS) => {\n let array = [layer]\n let parent = data[layer]\n while (parent) {\n array.unshift(parent)\n parent = data[parent]\n }\n return array\n}\n\nexport const getLayers = (layer, variant = layer, opacitySlot, colors, opacity) => {\n return getLayersArray(layer).map((currentLayer) => ([\n currentLayer === layer\n ? colors[variant]\n : colors[currentLayer],\n currentLayer === layer\n ? opacity[opacitySlot] || 1\n : opacity[currentLayer]\n ]))\n}\n\nconst getDependencies = (key, inheritance) => {\n const data = inheritance[key]\n if (typeof data === 'string' && data.startsWith('--')) {\n return [data.substring(2)]\n } else {\n if (data === null) return []\n const { depends, layer, variant } = data\n const layerDeps = layer\n ? getLayersArray(layer).map(currentLayer => {\n return currentLayer === layer\n ? variant || layer\n : currentLayer\n })\n : []\n if (Array.isArray(depends)) {\n return [...depends, ...layerDeps]\n } else {\n return [...layerDeps]\n }\n }\n}\n\n/**\n * Sorts inheritance object topologically - dependant slots come after\n * dependencies\n *\n * @property {Object} inheritance - object defining the nodes\n * @property {Function} getDeps - function that returns dependencies for\n * given value and inheritance object.\n * @returns {String[]} keys of inheritance object, sorted in topological\n * order. Additionally, dependency-less nodes will always be first in line\n */\nexport const topoSort = (\n inheritance = SLOT_INHERITANCE,\n getDeps = getDependencies\n) => {\n // This is an implementation of https://en.wikipedia.org/wiki/Tarjan%27s_strongly_connected_components_algorithm\n\n const allKeys = Object.keys(inheritance)\n const whites = new Set(allKeys)\n const grays = new Set()\n const blacks = new Set()\n const unprocessed = [...allKeys]\n const output = []\n\n const step = (node) => {\n if (whites.has(node)) {\n // Make node \"gray\"\n whites.delete(node)\n grays.add(node)\n // Do step for each node connected to it (one way)\n getDeps(node, inheritance).forEach(step)\n // Make node \"black\"\n grays.delete(node)\n blacks.add(node)\n // Put it into the output list\n output.push(node)\n } else if (grays.has(node)) {\n console.debug('Cyclic depenency in topoSort, ignoring')\n output.push(node)\n } else if (blacks.has(node)) {\n // do nothing\n } else {\n throw new Error('Unintended condition in topoSort!')\n }\n }\n while (unprocessed.length > 0) {\n step(unprocessed.pop())\n }\n\n // The index thing is to make sorting stable on browsers\n // where Array.sort() isn't stable\n return output.map((data, index) => ({ data, index })).sort(({ data: a, index: ai }, { data: b, index: bi }) => {\n const depsA = getDeps(a, inheritance).length\n const depsB = getDeps(b, inheritance).length\n\n if (depsA === depsB || (depsB !== 0 && depsA !== 0)) return ai - bi\n if (depsA === 0 && depsB !== 0) return -1\n if (depsB === 0 && depsA !== 0) return 1\n }).map(({ data }) => data)\n}\n\nconst expandSlotValue = (value) => {\n if (typeof value === 'object') return value\n return {\n depends: value.startsWith('--') ? [value.substring(2)] : [],\n default: value.startsWith('#') ? value : undefined\n }\n}\n/**\n * retrieves opacity slot for given slot. This goes up the depenency graph\n * to find which parent has opacity slot defined for it.\n * TODO refactor this\n */\nexport const getOpacitySlot = (\n k,\n inheritance = SLOT_INHERITANCE,\n getDeps = getDependencies\n) => {\n const value = expandSlotValue(inheritance[k])\n if (value.opacity === null) return\n if (value.opacity) return value.opacity\n const findInheritedOpacity = (key, visited = [k]) => {\n const depSlot = getDeps(key, inheritance)[0]\n if (depSlot === undefined) return\n const dependency = inheritance[depSlot]\n if (dependency === undefined) return\n if (dependency.opacity || dependency === null) {\n return dependency.opacity\n } else if (dependency.depends && visited.includes(depSlot)) {\n return findInheritedOpacity(depSlot, [...visited, depSlot])\n } else {\n return null\n }\n }\n if (value.depends) {\n return findInheritedOpacity(k)\n }\n}\n\n/**\n * retrieves layer slot for given slot. This goes up the depenency graph\n * to find which parent has opacity slot defined for it.\n * this is basically copypaste of getOpacitySlot except it checks if key is\n * in LAYERS\n * TODO refactor this\n */\nexport const getLayerSlot = (\n k,\n inheritance = SLOT_INHERITANCE,\n getDeps = getDependencies\n) => {\n const value = expandSlotValue(inheritance[k])\n if (LAYERS[k]) return k\n if (value.layer === null) return\n if (value.layer) return value.layer\n const findInheritedLayer = (key, visited = [k]) => {\n const depSlot = getDeps(key, inheritance)[0]\n if (depSlot === undefined) return\n const dependency = inheritance[depSlot]\n if (dependency === undefined) return\n if (dependency.layer || dependency === null) {\n return dependency.layer\n } else if (dependency.depends) {\n return findInheritedLayer(dependency, [...visited, depSlot])\n } else {\n return null\n }\n }\n if (value.depends) {\n return findInheritedLayer(k)\n }\n}\n\n/**\n * topologically sorted SLOT_INHERITANCE\n */\nexport const SLOT_ORDERED = topoSort(\n Object.entries(SLOT_INHERITANCE)\n .sort(([aK, aV], [bK, bV]) => ((aV && aV.priority) || 0) - ((bV && bV.priority) || 0))\n .reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})\n)\n\n/**\n * All opacity slots used in color slots, their default values and affected\n * color slots.\n */\nexport const OPACITIES = Object.entries(SLOT_INHERITANCE).reduce((acc, [k, v]) => {\n const opacity = getOpacitySlot(k, SLOT_INHERITANCE, getDependencies)\n if (opacity) {\n return {\n ...acc,\n [opacity]: {\n defaultValue: DEFAULT_OPACITY[opacity] || 1,\n affectedSlots: [...((acc[opacity] && acc[opacity].affectedSlots) || []), k]\n }\n }\n } else {\n return acc\n }\n}, {})\n\n/**\n * Handle dynamic color\n */\nexport const computeDynamicColor = (sourceColor, getColor, mod) => {\n if (typeof sourceColor !== 'string' || !sourceColor.startsWith('--')) return sourceColor\n let targetColor = null\n // Color references other color\n const [variable, modifier] = sourceColor.split(/,/g).map(str => str.trim())\n const variableSlot = variable.substring(2)\n targetColor = getColor(variableSlot)\n if (modifier) {\n targetColor = brightness(Number.parseFloat(modifier) * mod, targetColor).rgb\n }\n return targetColor\n}\n\n/**\n * THE function you want to use. Takes provided colors and opacities\n * value and uses inheritance data to figure out color needed for the slot.\n */\nexport const getColors = (sourceColors, sourceOpacity) => SLOT_ORDERED.reduce(({ colors, opacity }, key) => {\n const sourceColor = sourceColors[key]\n const value = expandSlotValue(SLOT_INHERITANCE[key])\n const deps = getDependencies(key, SLOT_INHERITANCE)\n const isTextColor = !!value.textColor\n const variant = value.variant || value.layer\n\n let backgroundColor = null\n\n if (isTextColor) {\n backgroundColor = alphaBlendLayers(\n { ...(colors[deps[0]] || convert(sourceColors[key] || '#FF00FF').rgb) },\n getLayers(\n getLayerSlot(key) || 'bg',\n variant || 'bg',\n getOpacitySlot(variant),\n colors,\n opacity\n )\n )\n } else if (variant && variant !== key) {\n backgroundColor = colors[variant] || convert(sourceColors[variant]).rgb\n } else {\n backgroundColor = colors.bg || convert(sourceColors.bg)\n }\n\n const isLightOnDark = relativeLuminance(backgroundColor) < 0.5\n const mod = isLightOnDark ? 1 : -1\n\n let outputColor = null\n if (sourceColor) {\n // Color is defined in source color\n let targetColor = sourceColor\n if (targetColor === 'transparent') {\n // We take only layers below current one\n const layers = getLayers(\n getLayerSlot(key),\n key,\n getOpacitySlot(key) || key,\n colors,\n opacity\n ).slice(0, -1)\n targetColor = {\n ...alphaBlendLayers(\n convert('#FF00FF').rgb,\n layers\n ),\n a: 0\n }\n } else if (typeof sourceColor === 'string' && sourceColor.startsWith('--')) {\n targetColor = computeDynamicColor(\n sourceColor,\n variableSlot => colors[variableSlot] || sourceColors[variableSlot],\n mod\n )\n } else if (typeof sourceColor === 'string' && sourceColor.startsWith('#')) {\n targetColor = convert(targetColor).rgb\n }\n outputColor = { ...targetColor }\n } else if (value.default) {\n // same as above except in object form\n outputColor = convert(value.default).rgb\n } else {\n // calculate color\n const defaultColorFunc = (mod, dep) => ({ ...dep })\n const colorFunc = value.color || defaultColorFunc\n\n if (value.textColor) {\n if (value.textColor === 'bw') {\n outputColor = contrastRatio(backgroundColor).rgb\n } else {\n let color = { ...colors[deps[0]] }\n if (value.color) {\n color = colorFunc(mod, ...deps.map((dep) => ({ ...colors[dep] })))\n }\n outputColor = getTextColor(\n backgroundColor,\n { ...color },\n value.textColor === 'preserve'\n )\n }\n } else {\n // background color case\n outputColor = colorFunc(\n mod,\n ...deps.map((dep) => ({ ...colors[dep] }))\n )\n }\n }\n if (!outputColor) {\n throw new Error('Couldn\\'t generate color for ' + key)\n }\n\n const opacitySlot = value.opacity || getOpacitySlot(key)\n const ownOpacitySlot = value.opacity\n\n if (ownOpacitySlot === null) {\n outputColor.a = 1\n } else if (sourceColor === 'transparent') {\n outputColor.a = 0\n } else {\n const opacityOverriden = ownOpacitySlot && sourceOpacity[opacitySlot] !== undefined\n\n const dependencySlot = deps[0]\n const dependencyColor = dependencySlot && colors[dependencySlot]\n\n if (!ownOpacitySlot && dependencyColor && !value.textColor && ownOpacitySlot !== null) {\n // Inheriting color from dependency (weird, i know)\n // except if it's a text color or opacity slot is set to 'null'\n outputColor.a = dependencyColor.a\n } else if (!dependencyColor && !opacitySlot) {\n // Remove any alpha channel if no dependency and no opacitySlot found\n delete outputColor.a\n } else {\n // Otherwise try to assign opacity\n if (dependencyColor && dependencyColor.a === 0) {\n // transparent dependency shall make dependents transparent too\n outputColor.a = 0\n } else {\n // Otherwise check if opacity is overriden and use that or default value instead\n outputColor.a = Number(\n opacityOverriden\n ? sourceOpacity[opacitySlot]\n : (OPACITIES[opacitySlot] || {}).defaultValue\n )\n }\n }\n }\n\n if (Number.isNaN(outputColor.a) || outputColor.a === undefined) {\n outputColor.a = 1\n }\n\n if (opacitySlot) {\n return {\n colors: { ...colors, [key]: outputColor },\n opacity: { ...opacity, [opacitySlot]: outputColor.a }\n }\n } else {\n return {\n colors: { ...colors, [key]: outputColor },\n opacity\n }\n }\n}, { colors: {}, opacity: {} })\n","\n \n \n \n \n \n \n {{ $t('general.loading') }}\n \n \n {{ preview.error }}\n \n \n \n \n \n \n \n \n \n {{ charactersLeft }}\n
\n \n \n \n\n 1\"\n class=\"text-format\"\n >\n \n \n {{ $t(`post_status.content_type[\"${postFormat}\"]`) }}\n \n \n \n \n \n {{ $t(`post_status.content_type[\"${postFormats[0]}\"]`) }}\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n {{ $t('post_status.posting') }}\n \n \n {{ $t('post_status.post') }}\n \n \n \n {{ $t('post_status.post') }}\n \n \n \n \n \n \n Error: {{ error }}\n \n \n \n \n 0\"\n class=\"attachments\"\n :grid=\"true\"\n :nsfw=\"false\"\n :attachments=\"newStatus.files\"\n :descriptions=\"newStatus.mediaDescriptions\"\n :set-media=\"() => $store.dispatch('setMedia', newStatus.files)\"\n :editable=\"true\"\n :edit-attachment=\"editAttachment\"\n :remove-attachment=\"removeMediaFile\"\n :shift-up-attachment=\"newStatus.files.length > 1 && shiftUpMediaFile\"\n :shift-dn-attachment=\"newStatus.files.length > 1 && shiftDnMediaFile\"\n @play=\"$emit('mediaplay', attachment.id)\"\n @pause=\"$emit('mediapause', attachment.id)\"\n />\n 0 && !disableSensitivityCheckbox\"\n class=\"upload_settings\"\n >\n \n {{ $t('post_status.attachments_sensitive') }}\n \n \n \n \n\n\n\n\n\n","/* eslint-env browser */\nimport statusPosterService from '../../services/status_poster/status_poster.service.js'\nimport fileSizeFormatService from '../../services/file_size_format/file_size_format.js'\n\nimport { library } from '@fortawesome/fontawesome-svg-core'\nimport { faUpload, faCircleNotch } from '@fortawesome/free-solid-svg-icons'\n\nlibrary.add(\n faUpload,\n faCircleNotch\n)\n\nconst mediaUpload = {\n data () {\n return {\n uploadCount: 0,\n uploadReady: true\n }\n },\n computed: {\n uploading () {\n return this.uploadCount > 0\n }\n },\n methods: {\n uploadFile (file) {\n const self = this\n const store = this.$store\n if (file.size > store.state.instance.uploadlimit) {\n const filesize = fileSizeFormatService.fileSizeFormat(file.size)\n const allowedsize = fileSizeFormatService.fileSizeFormat(store.state.instance.uploadlimit)\n self.$emit('upload-failed', 'file_too_big', { filesize: filesize.num, filesizeunit: filesize.unit, allowedsize: allowedsize.num, allowedsizeunit: allowedsize.unit })\n return\n }\n const formData = new FormData()\n formData.append('file', file)\n\n self.$emit('uploading')\n self.uploadCount++\n\n statusPosterService.uploadMedia({ store, formData })\n .then((fileData) => {\n self.$emit('uploaded', fileData)\n self.decreaseUploadCount()\n }, (error) => { // eslint-disable-line handle-callback-err\n self.$emit('upload-failed', 'default')\n self.decreaseUploadCount()\n })\n },\n decreaseUploadCount () {\n this.uploadCount--\n if (this.uploadCount === 0) {\n this.$emit('all-uploaded')\n }\n },\n clearFile () {\n this.uploadReady = false\n this.$nextTick(() => {\n this.uploadReady = true\n })\n },\n multiUpload (files) {\n for (const file of files) {\n this.uploadFile(file)\n }\n },\n change ({ target }) {\n this.multiUpload(target.files)\n }\n },\n props: [\n 'dropFiles',\n 'disabled'\n ],\n watch: {\n 'dropFiles': function (fileInfos) {\n if (!this.uploading) {\n this.multiUpload(fileInfos)\n }\n }\n }\n}\n\nexport default mediaUpload\n","import { render } from \"./media_upload.vue?vue&type=template&id=8e180d3a\"\nimport script from \"./media_upload.js?vue&type=script&lang=js\"\nexport * from \"./media_upload.js?vue&type=script&lang=js\"\n\nimport \"./media_upload.vue?vue&type=style&index=0&id=8e180d3a&lang=scss\"\n\nimport exportComponent from \"/home/hannah/personal/pleroma-fe/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","\n \n \n \n \n \n\n\n\n\n\n","\n \n \n \n \n
\n 2\"\n class=\"delete-option button-unstyled -hover-highlight\"\n @click=\"deleteOption(index)\"\n >\n \n \n \n \n \n\n {{ $t(\"polls.add_option\") }}\n \n \n
\n \n \n \n \n 
\n {props.label ? '' : props.label}\n \n