No OneTemporary
Actions

Authored By

Unknown

Size

27 KB

Referenced Files

None

Subscribers

None

View Options

	diff --git a/index.html b/index.html
	index 6588a28700..702acfe83f 100644
	--- a/index.html
	+++ b/index.html
	@@ -1,133 +1,149 @@
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
	<link rel="icon" type="image/png" href="/favicon.png">
	<style id="splashscreen">
	#webpack-hot-middleware-clientOverlay {
	z-index: 9999999999999999999999999999;
	}

	#splash {
	--scale: 1;
	width: 100vw;
	height: 100vh;
	display: grid;
	grid-template-rows: auto;
	grid-template-columns: auto;
	align-content: center;
	align-items: center;
	justify-content: center;
	justify-items: center;
	flex-direction: column;
	background: #0f161e;
	font-family: sans-serif;
	color: #b9b9ba;
	position: absolute;
	z-index: 9999;
	font-size: calc(1vw + 1vh + 1vmin);
	}

	+ #splash-credit {
	+ position: absolute;
	+ font-size: 14px;
	+ bottom: 0;
	+ right: 0;
	+ }
	+
	#splash-container {
	align-items: center;
	}

	#mascot-container {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	}

	#mascot:not(.orz) {
	margin-bottom: 2em
	object-position: 2.5em 0;
	}

	#mascot-temp.orz {
	margin-bottom: 2em
	object-position: 2.5em 0;
	}

	#mascot,
	#mascot-temp {
	width: calc(10em * var(--scale));
	height: calc(8em * var(--scale));
	object-fit: contain;
	object-position: bottom;
	}

	#throbber {
	display: grid;
	width: calc(5em * 0.5 * var(--scale));
	height: calc(8em * 0.5 * var(--scale));
	grid-template-rows: repeat(8, 1fr);
	grid-template-columns: repeat(5, 1fr);
	grid-template-areas: "P P . L L"
	"P P . L L"
	"P P . L L"
	"P P . L L"
	"P P . . ."
	"P P . . ."
	"P P . E E"
	"P P . E E";
	}

	.chunk {
	background-color: #e2b188;
	box-shadow: 0.01em 0.01em 0.1em 0 #e2b188;
	}

	#chunk-P {
	grid-area: P;
	border-top-left-radius: calc(var(--logoChunkSize) / 2);
	}

	#chunk-L {
	grid-area: L;
	border-bottom-right-radius: calc(var(--logoChunkSize) / 2);
	}

	#chunk-E {
	grid-area: E;
	border-bottom-right-radius: calc(var(--logoChunkSize) / 2);
	}

	#status {
	line-height: 2;
	width: 100%;
	text-align: center;
	}
	+
	+ @media (prefers-reduced-motion) {
	+ #throbber {
	+ animation: none;
	+ }
	+ }
	</style>
	<style id="pleroma-eager-styles" type="text/css"></style>
	<style id="pleroma-lazy-styles" type="text/css"></style>
	<!--server-generated-meta-->
	</head>
	<body style="margin: 0; padding: 0">
	<noscript>To use Pleroma, please enable JavaScript.</noscript>
	<!-- putting styles here to avoid having to wait for styles to load up -->
	<div id="splash">
	+ <div id="splash-credit">
	+ Art by pipivovott
	+ </div>
	<div id="splash-container">
	<div id="mascot-container">
	<div id="throbber">
	<div class="chunk" id="chunk-P">
	</div>
	<div class="chunk" id="chunk-L">
	</div>
	<div class="chunk" id="chunk-E">
	</div>
	</div>
	<img id="mascot" src="/static/pleromatan_apology_fox.png">
	</div>
	<div id="status" class="css-ok">
	<!-- (｡>﹏<) -->
	<span class="initial-text">(｡>﹏<)</span>
	</div>
	</div>
	</div>
	<div id="app" class="hidden"></div>
	<div id="modal"></div>
	<!-- built files will be auto injected -->
	<div id="popovers" />
	</body>
	</html>
	diff --git a/src/main.js b/src/main.js
	index 40347e6d16..4ccdabb955 100644
	--- a/src/main.js
	+++ b/src/main.js
	@@ -1,132 +1,133 @@
	import { createStore } from 'vuex'

	import 'custom-event-polyfill'
	import './lib/event_target_polyfill.js'

	import interfaceModule from './modules/interface.js'
	import instanceModule from './modules/instance.js'
	import statusesModule from './modules/statuses.js'
	import notificationsModule from './modules/notifications.js'
	import listsModule from './modules/lists.js'
	import usersModule from './modules/users.js'
	import apiModule from './modules/api.js'
	import configModule from './modules/config.js'
	import profileConfigModule from './modules/profileConfig.js'
	import serverSideStorageModule from './modules/serverSideStorage.js'
	import adminSettingsModule from './modules/adminSettings.js'
	import shoutModule from './modules/shout.js'
	import oauthModule from './modules/oauth.js'
	import authFlowModule from './modules/auth_flow.js'
	import mediaViewerModule from './modules/media_viewer.js'
	import oauthTokensModule from './modules/oauth_tokens.js'
	import reportsModule from './modules/reports.js'
	import pollsModule from './modules/polls.js'
	import postStatusModule from './modules/postStatus.js'
	import editStatusModule from './modules/editStatus.js'
	import statusHistoryModule from './modules/statusHistory.js'

	import chatsModule from './modules/chats.js'
	import announcementsModule from './modules/announcements.js'

	import { createI18n } from 'vue-i18n'

	import createPersistedState from './lib/persisted_state.js'
	import pushNotifications from './lib/push_notifications_plugin.js'

	import messages from './i18n/messages.js'

	import afterStoreSetup from './boot/after_store.js'

	const currentLocale = (window.navigator.language \|\| 'en').split('-')[0]

	const i18n = createI18n({
	// By default, use the browser locale, we will update it if neccessary
	locale: 'en',
	fallbackLocale: 'en',
	messages: messages.default
	})

	messages.setLanguage(i18n.global, currentLocale)

	const splashError = (i18n, e) => {
	document.querySelector('#mascot').src = (Math.floor(Math.random() * 2) > 0)
	? '/static/pleromatan_orz_fox.png'
	: '/static/pleromatan_orz.png'
	document.querySelector('#mascot').classList.add('orz')
	document.querySelector('#throbber').classList.add('dead')
	document.querySelector('#status').textContent = i18n.global.t('splash.error')
	console.error('PleromaFE failed to initialize: ', e)
	}

	const persistedStateOptions = {
	paths: [
	'serverSideStorage.cache',
	'config',
	'users.lastLoginName',
	'oauth'
	]
	};

	(async () => {
	try {
	let storageError
	const plugins = [pushNotifications]
	try {
	const persistedState = await createPersistedState(persistedStateOptions)
	plugins.push(persistedState)
	} catch (e) {
	console.error('Storage error', e)
	storageError = e
	}
	document.querySelector('#status').removeAttribute('class')
	document.querySelector('#status').textContent = i18n.global.t('splash.loading')
	+ document.querySelector('#splash-credit').textContent = i18n.global.t('update.art_by', { linkToArtist: 'pipivovott' })
	const store = createStore({
	modules: {
	i18n: {
	getters: {
	i18n: () => i18n.global
	}
	},
	interface: interfaceModule,
	instance: instanceModule,
	// TODO refactor users/statuses modules, they depend on each other
	users: usersModule,
	statuses: statusesModule,
	notifications: notificationsModule,
	lists: listsModule,
	api: apiModule,
	config: configModule,
	profileConfig: profileConfigModule,
	serverSideStorage: serverSideStorageModule,
	adminSettings: adminSettingsModule,
	shout: shoutModule,
	oauth: oauthModule,
	authFlow: authFlowModule,
	mediaViewer: mediaViewerModule,
	oauthTokens: oauthTokensModule,
	reports: reportsModule,
	polls: pollsModule,
	postStatus: postStatusModule,
	editStatus: editStatusModule,
	statusHistory: statusHistoryModule,
	chats: chatsModule,
	announcements: announcementsModule
	},
	plugins,
	strict: false // Socket modifies itself, let's ignore this for now.
	// strict: process.env.NODE_ENV !== 'production'
	})
	if (storageError) {
	store.dispatch('pushGlobalNotice', { messageKey: 'errors.storage_unavailable', level: 'error' })
	}
	return await afterStoreSetup({ store, i18n })
	} catch (e) {
	splashError(i18n, e)
	}
	})()

	// These are inlined by webpack's DefinePlugin
	/* eslint-disable */
	window.___pleromafe_mode = process.env
	window.___pleromafe_commit_hash = COMMIT_HASH
	window.___pleromafe_dev_overrides = DEV_OVERRIDES
	diff --git a/src/services/theme_data/theme_data_3.service.js b/src/services/theme_data/theme_data_3.service.js
	index 056b78f772..cf58da1193 100644
	--- a/src/services/theme_data/theme_data_3.service.js
	+++ b/src/services/theme_data/theme_data_3.service.js
	@@ -1,518 +1,513 @@
	import { convert, brightness } from 'chromatism'
	import sum from 'hash-sum'
	import { flattenDeep, sortBy } from 'lodash'
	import {
	alphaBlend,
	getTextColor,
	rgba2css,
	mixrgb,
	relativeLuminance
	} from '../color_convert/color_convert.js'

	import {
	colorFunctions,
	shadowFunctions,
	process
	} from './theme3_slot_functions.js'

	import {
	unroll,
	getAllPossibleCombinations,
	genericRuleToSelector,
	normalizeCombination,
	findRules
	} from './iss_utils.js'
	import { parseCssShadow } from './css_utils.js'

	// Ensuring the order of components
	const components = {
	Root: null,
	Text: null,
	FunText: null,
	Link: null,
	Icon: null,
	Border: null,
	Panel: null,
	Chat: null,
	ChatMessage: null
	}

	const findShadow = (shadows, { dynamicVars, staticVars }) => {
	return (shadows \|\| []).map(shadow => {
	let targetShadow
	if (typeof shadow === 'string') {
	if (shadow.startsWith('$')) {
	targetShadow = process(shadow, shadowFunctions, { findColor, findShadow }, { dynamicVars, staticVars })
	} else if (shadow.startsWith('--')) {
	const [variable] = shadow.split(/,/g).map(str => str.trim()) // discarding modifier since it's not supported
	const variableSlot = variable.substring(2)
	return findShadow(staticVars[variableSlot], { dynamicVars, staticVars })
	} else {
	targetShadow = parseCssShadow(shadow)
	}
	} else {
	targetShadow = shadow
	}

	const shadowArray = Array.isArray(targetShadow) ? targetShadow : [targetShadow]
	return shadowArray.map(s => ({
	...s,
	color: findColor(s.color, { dynamicVars, staticVars })
	}))
	})
	}

	const findColor = (color, { dynamicVars, staticVars }) => {
	if (typeof color !== 'string' \|\| (!color.startsWith('--') && !color.startsWith('$'))) return color
	let targetColor = null
	if (color.startsWith('--')) {
	const [variable, modifier] = color.split(/,/g).map(str => str.trim())
	const variableSlot = variable.substring(2)
	if (variableSlot === 'stack') {
	const { r, g, b } = dynamicVars.stacked
	targetColor = { r, g, b }
	} else if (variableSlot.startsWith('parent')) {
	if (variableSlot === 'parent') {
	const { r, g, b } = dynamicVars.lowerLevelBackground
	targetColor = { r, g, b }
	} else {
	const virtualSlot = variableSlot.replace(/^parent/, '')
	targetColor = convert(dynamicVars.lowerLevelVirtualDirectivesRaw[virtualSlot]).rgb
	}
	} else {
	switch (variableSlot) {
	case 'inheritedBackground':
	targetColor = convert(dynamicVars.inheritedBackground).rgb
	break
	case 'background':
	targetColor = convert(dynamicVars.background).rgb
	break
	default:
	targetColor = convert(staticVars[variableSlot]).rgb
	}
	}

	if (modifier) {
	const effectiveBackground = dynamicVars.lowerLevelBackground ?? targetColor
	const isLightOnDark = relativeLuminance(convert(effectiveBackground).rgb) < 0.5
	const mod = isLightOnDark ? 1 : -1
	targetColor = brightness(Number.parseFloat(modifier) * mod, targetColor).rgb
	}
	}

	if (color.startsWith('$')) {
	try {
	targetColor = process(color, colorFunctions, { findColor }, { dynamicVars, staticVars })
	} catch (e) {
	console.error('Failure executing color function', e)
	targetColor = '#FF00FF'
	}
	}
	// Color references other color
	return targetColor
	}

	const getTextColorAlpha = (directives, intendedTextColor, dynamicVars, staticVars) => {
	const opacity = directives.textOpacity
	const backgroundColor = convert(dynamicVars.lowerLevelBackground).rgb
	const textColor = convert(findColor(intendedTextColor, { dynamicVars, staticVars })).rgb
	if (opacity === null \|\| opacity === undefined \|\| opacity >= 1) {
	return convert(textColor).hex
	}
	if (opacity === 0) {
	return convert(backgroundColor).hex
	}
	const opacityMode = directives.textOpacityMode
	switch (opacityMode) {
	case 'fake':
	return convert(alphaBlend(textColor, opacity, backgroundColor)).hex
	case 'mixrgb':
	return convert(mixrgb(backgroundColor, textColor)).hex
	default:
	return rgba2css({ a: opacity, ...textColor })
	}
	}

	// Loading all style.js[on] files dynamically
	const componentsContext = require.context('src', true, /\.style.js(on)?$/)
	componentsContext.keys().forEach(key => {
	const component = componentsContext(key).default
	if (components[component.name] != null) {
	console.warn(`Component in file ${key} is trying to override existing component ${component.name}! You have collisions/duplicates!`)
	}
	components[component.name] = component
	})

	const engineChecksum = sum(components)

	const ruleToSelector = genericRuleToSelector(components)

	export const getEngineChecksum = () => engineChecksum

	/**
	* Initializes and compiles the theme according to the ruleset
	*
	* @param {Object[]} inputRuleset - set of rules to compile theme against. Acts as an override to
	* component default rulesets
	* @param {string} ultimateBackgroundColor - Color that will be the "final" background for
	* calculating contrast ratios and making text automatically accessible. Really used for cases when
	* stuff is transparent.
	* @param {boolean} debug - print out debug information in console, mostly just performance stuff
	* @param {boolean} liteMode - use validInnerComponentsLite instead of validInnerComponents, meant to
	* generatate theme previews and such that need to be compiled faster and don't require a lot of other
	* components present in "normal" mode
	* @param {boolean} onlyNormalState - only use components 'normal' states, meant for generating theme
	* previews since states are the biggest factor for compilation time and are completely unnecessary
	* when previewing multiple themes at same time
	* @param {string} rootComponentName - [UNTESTED] which component to start from, meant for previewing a
	* part of the theme (i.e. just the button) for themes 3 editor.
	*/
	export const init = ({
	inputRuleset,
	ultimateBackgroundColor,
	debug = false,
	liteMode = false,
	onlyNormalState = false,
	rootComponentName = 'Root'
	}) => {
	if (!inputRuleset) throw new Error('Ruleset is null or undefined!')
	const staticVars = {}
	const stacked = {}
	const computed = {}

	const rulesetUnsorted = [
	...Object.values(components)
	.map(c => (c.defaultRules \|\| []).map(r => ({ component: c.name, ...r, source: 'Built-in' })))
	.reduce((acc, arr) => [...acc, ...arr], []),
	...inputRuleset
	].map(rule => {
	normalizeCombination(rule)
	let currentParent = rule.parent
	while (currentParent) {
	normalizeCombination(currentParent)
	currentParent = currentParent.parent
	}

	return rule
	})

	- const i = 4
	- if (2 + 2 === i) {
	- throw new Error('test')
	- }
	-
	const ruleset = rulesetUnsorted
	.map((data, index) => ({ data, index }))
	.sort(({ data: a, index: ai }, { data: b, index: bi }) => {
	const parentsA = unroll(a).length
	const parentsB = unroll(b).length

	if (parentsA === parentsB) {
	if (a.component === 'Text') return -1
	if (b.component === 'Text') return 1
	return ai - bi
	}
	if (parentsA === 0 && parentsB !== 0) return -1
	if (parentsB === 0 && parentsA !== 0) return 1
	return parentsA - parentsB
	})
	.map(({ data }) => data)

	const virtualComponents = new Set(Object.values(components).filter(c => c.virtual).map(c => c.name))

	const processCombination = (combination) => {
	const selector = ruleToSelector(combination, true)
	const cssSelector = ruleToSelector(combination)

	const parentSelector = selector.split(/ /g).slice(0, -1).join(' ')
	const soloSelector = selector.split(/ /g).slice(-1)[0]

	const lowerLevelSelector = parentSelector
	const lowerLevelBackground = computed[lowerLevelSelector]?.background
	const lowerLevelVirtualDirectives = computed[lowerLevelSelector]?.virtualDirectives
	const lowerLevelVirtualDirectivesRaw = computed[lowerLevelSelector]?.virtualDirectivesRaw

	const dynamicVars = computed[selector] \|\| {
	lowerLevelBackground,
	lowerLevelVirtualDirectives,
	lowerLevelVirtualDirectivesRaw
	}

	// Inheriting all of the applicable rules
	const existingRules = ruleset.filter(findRules(combination))
	const computedDirectives = existingRules.map(r => r.directives).reduce((acc, directives) => ({ ...acc, ...directives }), {})
	const computedRule = {
	...combination,
	directives: computedDirectives
	}

	computed[selector] = computed[selector] \|\| {}
	computed[selector].computedRule = computedRule
	computed[selector].dynamicVars = dynamicVars

	if (virtualComponents.has(combination.component)) {
	const virtualName = [
	'--',
	combination.component.toLowerCase(),
	combination.variant === 'normal'
	? ''
	: combination.variant[0].toUpperCase() + combination.variant.slice(1).toLowerCase(),
	...sortBy(combination.state.filter(x => x !== 'normal')).map(state => state[0].toUpperCase() + state.slice(1).toLowerCase())
	].join('')

	let inheritedTextColor = computedDirectives.textColor
	let inheritedTextAuto = computedDirectives.textAuto
	let inheritedTextOpacity = computedDirectives.textOpacity
	let inheritedTextOpacityMode = computedDirectives.textOpacityMode
	const lowerLevelTextSelector = [...selector.split(/ /g).slice(0, -1), soloSelector].join(' ')
	const lowerLevelTextRule = computed[lowerLevelTextSelector]

	if (inheritedTextColor == null \|\| inheritedTextOpacity == null \|\| inheritedTextOpacityMode == null) {
	inheritedTextColor = computedDirectives.textColor ?? lowerLevelTextRule.textColor
	inheritedTextAuto = computedDirectives.textAuto ?? lowerLevelTextRule.textAuto
	inheritedTextOpacity = computedDirectives.textOpacity ?? lowerLevelTextRule.textOpacity
	inheritedTextOpacityMode = computedDirectives.textOpacityMode ?? lowerLevelTextRule.textOpacityMode
	}

	const newTextRule = {
	...computedRule,
	directives: {
	...computedRule.directives,
	textColor: inheritedTextColor,
	textAuto: inheritedTextAuto ?? 'preserve',
	textOpacity: inheritedTextOpacity,
	textOpacityMode: inheritedTextOpacityMode
	}
	}

	dynamicVars.inheritedBackground = lowerLevelBackground
	dynamicVars.stacked = convert(stacked[lowerLevelSelector]).rgb

	const intendedTextColor = convert(findColor(inheritedTextColor, { dynamicVars, staticVars })).rgb
	const textColor = newTextRule.directives.textAuto === 'no-auto'
	? intendedTextColor
	: getTextColor(
	convert(stacked[lowerLevelSelector]).rgb,
	intendedTextColor,
	newTextRule.directives.textAuto === 'preserve'
	)
	const virtualDirectives = computed[lowerLevelSelector].virtualDirectives \|\| {}
	const virtualDirectivesRaw = computed[lowerLevelSelector].virtualDirectivesRaw \|\| {}

	// Storing color data in lower layer to use as custom css properties
	virtualDirectives[virtualName] = getTextColorAlpha(newTextRule.directives, textColor, dynamicVars)
	virtualDirectivesRaw[virtualName] = textColor

	computed[lowerLevelSelector].virtualDirectives = virtualDirectives
	computed[lowerLevelSelector].virtualDirectivesRaw = virtualDirectivesRaw

	return {
	dynamicVars,
	selector: cssSelector.split(/ /g).slice(0, -1).join(' '),
	...combination,
	directives: {},
	virtualDirectives: {
	[virtualName]: getTextColorAlpha(newTextRule.directives, textColor, dynamicVars)
	},
	virtualDirectivesRaw: {
	[virtualName]: textColor
	}
	}
	} else {
	computed[selector] = computed[selector] \|\| {}

	// TODO: DEFAULT TEXT COLOR
	const lowerLevelStackedBackground = stacked[lowerLevelSelector] \|\| convert(ultimateBackgroundColor).rgb

	if (computedDirectives.background) {
	let inheritRule = null
	const variantRules = ruleset.filter(
	findRules({
	component: combination.component,
	variant: combination.variant,
	parent: combination.parent
	})
	)
	const lastVariantRule = variantRules[variantRules.length - 1]
	if (lastVariantRule) {
	inheritRule = lastVariantRule
	} else {
	const normalRules = ruleset.filter(findRules({
	component: combination.component,
	parent: combination.parent
	}))
	const lastNormalRule = normalRules[normalRules.length - 1]
	inheritRule = lastNormalRule
	}

	const inheritSelector = ruleToSelector({ ...inheritRule, parent: combination.parent }, true)
	const inheritedBackground = computed[inheritSelector].background

	dynamicVars.inheritedBackground = inheritedBackground

	const rgb = convert(findColor(computedDirectives.background, { dynamicVars, staticVars })).rgb

	if (!stacked[selector]) {
	let blend
	const alpha = computedDirectives.opacity ?? 1
	if (alpha >= 1) {
	blend = rgb
	} else if (alpha <= 0) {
	blend = lowerLevelStackedBackground
	} else {
	blend = alphaBlend(rgb, computedDirectives.opacity, lowerLevelStackedBackground)
	}
	stacked[selector] = blend
	computed[selector].background = { ...rgb, a: computedDirectives.opacity ?? 1 }
	}
	}

	if (computedDirectives.shadow) {
	dynamicVars.shadow = flattenDeep(findShadow(flattenDeep(computedDirectives.shadow), { dynamicVars, staticVars }))
	}

	if (!stacked[selector]) {
	computedDirectives.background = 'transparent'
	computedDirectives.opacity = 0
	stacked[selector] = lowerLevelStackedBackground
	computed[selector].background = { ...lowerLevelStackedBackground, a: 0 }
	}

	dynamicVars.stacked = stacked[selector]
	dynamicVars.background = computed[selector].background

	const dynamicSlots = Object.entries(computedDirectives).filter(([k, v]) => k.startsWith('--'))

	dynamicSlots.forEach(([k, v]) => {
	const [type, ...value] = v.split('\|').map(x => x.trim()) // woah, Extreme!
	switch (type) {
	case 'color': {
	const color = findColor(value[0], { dynamicVars, staticVars })
	dynamicVars[k] = color
	if (combination.component === 'Root') {
	staticVars[k.substring(2)] = color
	}
	break
	}
	case 'shadow': {
	const shadow = value
	dynamicVars[k] = shadow
	if (combination.component === 'Root') {
	staticVars[k.substring(2)] = shadow
	}
	break
	}
	case 'generic': {
	dynamicVars[k] = value
	if (combination.component === 'Root') {
	staticVars[k.substring(2)] = value
	}
	break
	}
	}
	})

	const rule = {
	dynamicVars,
	selector: cssSelector,
	...combination,
	directives: computedDirectives
	}

	return rule
	}
	}

	const processInnerComponent = (component, parent) => {
	const combinations = []
	const {
	states: originalStates = {},
	variants: originalVariants = {}
	} = component

	const validInnerComponents = (
	liteMode
	? (component.validInnerComponentsLite \|\| component.validInnerComponents)
	: component.validInnerComponents
	) \|\| []

	// Normalizing states and variants to always include "normal"
	const states = { normal: '', ...originalStates }
	const variants = { normal: '', ...originalVariants }
	const innerComponents = (validInnerComponents).map(name => {
	const result = components[name]
	if (result === undefined) console.error(`Component ${component.name} references a component ${name} which does not exist!`)
	return result
	})

	// Optimization: we only really need combinations without "normal" because all states implicitly have it
	const permutationStateKeys = Object.keys(states).filter(s => s !== 'normal')
	const stateCombinations = onlyNormalState
	? [
	['normal']
	]
	: [
	['normal'],
	...getAllPossibleCombinations(permutationStateKeys)
	.map(combination => ['normal', ...combination])
	.filter(combo => {
	// Optimization: filter out some hard-coded combinations that don't make sense
	if (combo.indexOf('disabled') >= 0) {
	return !(
	combo.indexOf('hover') >= 0 \|\|
	combo.indexOf('focused') >= 0 \|\|
	combo.indexOf('pressed') >= 0
	)
	}
	return true
	})
	]

	const stateVariantCombination = Object.keys(variants).map(variant => {
	return stateCombinations.map(state => ({ variant, state }))
	}).reduce((acc, x) => [...acc, ...x], [])

	stateVariantCombination.forEach(combination => {
	combination.component = component.name
	combination.lazy = component.lazy \|\| parent?.lazy
	combination.parent = parent
	if (combination.state.indexOf('hover') >= 0) {
	combination.lazy = true
	}

	combinations.push(combination)

	innerComponents.forEach(innerComponent => {
	combinations.push(...processInnerComponent(innerComponent, combination))
	})
	})

	return combinations
	}

	const t0 = performance.now()
	const combinations = processInnerComponent(components[rootComponentName] ?? components.Root)
	const t1 = performance.now()
	if (debug) {
	console.debug('Tree traveral took ' + (t1 - t0) + ' ms')
	}

	const result = combinations.map((combination) => {
	if (combination.lazy) {
	return async () => processCombination(combination)
	} else {
	return processCombination(combination)
	}
	}).filter(x => x)
	const t2 = performance.now()
	if (debug) {
	console.debug('Eager processing took ' + (t2 - t1) + ' ms')
	}

	return {
	lazy: result.filter(x => typeof x === 'function'),
	eager: result.filter(x => typeof x !== 'function'),
	staticVars,
	engineChecksum
	}
	}

File Metadata

Mime Type: text/x-diff
Expires: Mon, Nov 2, 8:50 AM (8 h, 8 m)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1803987
Default Alt Text: (27 KB)

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions