improvements
This commit is contained in:
parent
4e2cb8c132
commit
f6f2e14c19
|
@ -472,11 +472,11 @@ export default {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
const previewColors = computed(() => ({
|
const previewColors = computed(() => ({
|
||||||
text: applicablePreviewRules.value.find(r => r.component === 'Text').virtualDirectives['--text'],
|
text: applicablePreviewRules.value.find(r => r.component === 'Text')?.virtualDirectives['--text'],
|
||||||
link: applicablePreviewRules.value.find(r => r.component === 'Link').virtualDirectives['--link'],
|
link: applicablePreviewRules.value.find(r => r.component === 'Link')?.virtualDirectives['--link'],
|
||||||
border: applicablePreviewRules.value.find(r => r.component === 'Border').virtualDirectives['--border'],
|
border: applicablePreviewRules.value.find(r => r.component === 'Border')?.virtualDirectives['--border'],
|
||||||
icon: applicablePreviewRules.value.find(r => r.component === 'Icon').virtualDirectives['--icon'],
|
icon: applicablePreviewRules.value.find(r => r.component === 'Icon')?.virtualDirectives['--icon'],
|
||||||
background: applicablePreviewRules.value.find(r => r.parent == null).dynamicVars.stacked
|
background: applicablePreviewRules.value.find(r => r.parent == null)?.dynamicVars.stacked
|
||||||
}))
|
}))
|
||||||
exports.previewColors = previewColors
|
exports.previewColors = previewColors
|
||||||
|
|
||||||
|
@ -683,7 +683,7 @@ export default {
|
||||||
const virtualDirectivesOut = computed(() => {
|
const virtualDirectivesOut = computed(() => {
|
||||||
return [
|
return [
|
||||||
'Root {',
|
'Root {',
|
||||||
...virtualDirectives.map(vd => ` --${vd.name}: ${vd.value};`),
|
...virtualDirectives.map(vd => ` --${vd.name}: ${vd.valType} | ${vd.value};`),
|
||||||
'}'
|
'}'
|
||||||
].join('\n')
|
].join('\n')
|
||||||
})
|
})
|
||||||
|
@ -757,7 +757,8 @@ export default {
|
||||||
parser: (string) => deserialize(string),
|
parser: (string) => deserialize(string),
|
||||||
onImport (parsed, filename) {
|
onImport (parsed, filename) {
|
||||||
const editorComponents = parsed.filter(x => x.component.startsWith('@'))
|
const editorComponents = parsed.filter(x => x.component.startsWith('@'))
|
||||||
const rules = parsed.filter(x => !x.component.startsWith('@'))
|
const rootComponent = parsed.find(x => x.component === 'Root')
|
||||||
|
const rules = parsed.filter(x => !x.component.startsWith('@') && x.component !== 'Root')
|
||||||
const metaIn = editorComponents.find(x => x.component === '@meta').directives
|
const metaIn = editorComponents.find(x => x.component === '@meta').directives
|
||||||
const palettesIn = editorComponents.filter(x => x.component === '@palette')
|
const palettesIn = editorComponents.filter(x => x.component === '@palette')
|
||||||
|
|
||||||
|
@ -766,8 +767,16 @@ export default {
|
||||||
exports.author.value = metaIn.author
|
exports.author.value = metaIn.author
|
||||||
exports.website.value = metaIn.website
|
exports.website.value = metaIn.website
|
||||||
|
|
||||||
|
virtualDirectives.splice(0, virtualDirectives.length)
|
||||||
|
const newVirtualDirectives = Object
|
||||||
|
.entries(rootComponent.directives)
|
||||||
|
.map(([name, value]) => {
|
||||||
|
const [valType, valVal] = value.split('|').map(x => x.trim())
|
||||||
|
return { name: name.substring(2), valType, value: valVal }
|
||||||
|
})
|
||||||
|
virtualDirectives.push(...newVirtualDirectives)
|
||||||
|
|
||||||
onPalettesUpdate(palettesIn.map(x => ({ name: x.variant, ...x.directives })))
|
onPalettesUpdate(palettesIn.map(x => ({ name: x.variant, ...x.directives })))
|
||||||
console.log('PALETTES', palettesIn)
|
|
||||||
|
|
||||||
Object.keys(allEditedRules).forEach((k) => delete allEditedRules[k])
|
Object.keys(allEditedRules).forEach((k) => delete allEditedRules[k])
|
||||||
|
|
||||||
|
|
|
@ -123,7 +123,7 @@ export default {
|
||||||
try {
|
try {
|
||||||
let result
|
let result
|
||||||
const serialized = this.cValue.map(x => serializeShadow(x)).join(',')
|
const serialized = this.cValue.map(x => serializeShadow(x)).join(',')
|
||||||
deserializeShadow(serialized) // validate
|
serialized.split(/,/).map(deserializeShadow) // validate
|
||||||
const expandedShadow = flattenDeep(findShadow(this.cValue, { dynamicVars: {}, staticVars: this.staticVars }))
|
const expandedShadow = flattenDeep(findShadow(this.cValue, { dynamicVars: {}, staticVars: this.staticVars }))
|
||||||
const fixedShadows = expandedShadow.map(x => ({ ...x, color: console.log(x) || rgb2hex(x.color) }))
|
const fixedShadows = expandedShadow.map(x => ({ ...x, color: console.log(x) || rgb2hex(x.color) }))
|
||||||
|
|
||||||
|
|
|
@ -15,7 +15,7 @@ export const deserializeShadow = string => {
|
||||||
// spread (optional)
|
// spread (optional)
|
||||||
'(?:(-?[0-9]+(?:\\.[0-9]+)?)\\s+)?',
|
'(?:(-?[0-9]+(?:\\.[0-9]+)?)\\s+)?',
|
||||||
// either hex, variable or function
|
// either hex, variable or function
|
||||||
'(#[0-9a-f]{6}|--[a-z\\-_]+|\\$[a-z\\-()_]+)',
|
'(#[0-9a-f]{6}|--[a-z0-9\\-_]+|\\$[a-z0-9\\-()_]+)',
|
||||||
// opacity (optional)
|
// opacity (optional)
|
||||||
'(?:\\s+\\/\\s+([0-9]+(?:\\.[0-9]+)?)\\s*)?',
|
'(?:\\s+\\/\\s+([0-9]+(?:\\.[0-9]+)?)\\s*)?',
|
||||||
// name
|
// name
|
||||||
|
|
Loading…
Reference in a new issue