studio-variable/geoproject-app
4
0
Fork 0
Code Issues 25 Pull requests Projects Releases Packages Wiki Activity Actions

Defaul stylesheet print → new defaults.js (nique source of truth) + automatic generation of the default stylesheet for paged.js

Browse source
This commit is contained in:
Julie Blanc 2026-03-08 09:24:53 +01:00
parent ccdd9bda05
commit 47bf70bb36
7 changed files with 115 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/composables/useElementSettings.js
View file

@ -1,4 +1,5 @@
import { ref, reactive, computed, watch, nextTick } from 'vue';
import { ELEMENT_DEFAULTS } from '../utils/defaults';
import { useStylesheetStore } from '../stores/stylesheet';
import { useDebounce } from './useDebounce';
import { useTextDefaults } from './useTextDefaults';
@ -15,26 +16,26 @@ export function useElementSettings({ margin, padding, basePopup }) {
// --- Selector state ---
const selector = ref('');
// --- Style refs ---
const fontFamily = ref('sans-serif');
const italic = ref(false);
const bold = ref(false);
const textAlign = ref('left');
const color = ref('rgb(0, 0, 0)');
const background = ref('transparent');
const fontSize = reactive({ value: 23, unit: 'px' });
// --- Style refs (initial values from defaults.js) ---
const fontFamily = ref(ELEMENT_DEFAULTS.fontFamily);
const italic = ref(ELEMENT_DEFAULTS.italic);
const bold = ref(ELEMENT_DEFAULTS.bold);
const textAlign = ref(ELEMENT_DEFAULTS.textAlign);
const color = ref(ELEMENT_DEFAULTS.color);
const background = ref(ELEMENT_DEFAULTS.background);
const fontSize = reactive({ ...ELEMENT_DEFAULTS.fontSize });
const fontSizeModel = computed({
get: () => ({ value: fontSize.value, unit: fontSize.unit }),
set: (v) => { fontSize.value = v.value; fontSize.unit = v.unit; },
});
const lineHeight = reactive({ value: 28, unit: 'px' });
const lineHeight = reactive({ ...ELEMENT_DEFAULTS.lineHeight });
const lineHeightModel = computed({
get: () => ({ value: lineHeight.value, unit: lineHeight.unit }),
set: (v) => { lineHeight.value = v.value; lineHeight.unit = v.unit; },
});
const borderWidth = reactive({ value: 1, unit: 'px' });
const borderStyle = ref('solid');
const borderColor = ref('#000000');
const borderWidth = reactive({ ...ELEMENT_DEFAULTS.borderWidth });
const borderStyle = ref(ELEMENT_DEFAULTS.borderStyle);
const borderColor = ref(ELEMENT_DEFAULTS.borderColor);
// --- Toggle state ---
const settingEnabled = reactive({

10
src/composables/useTextDefaults.js
View file

@ -1,12 +1,12 @@
import { reactive } from 'vue';
import { TEXT_DEFAULTS } from '../utils/defaults';
// Singleton reactive — TextSettings writes here, ElementPopup reads when disabled
// Initial values match stylesheet.print.css (overwritten by syncFromStore on first mount)
// Initial values from defaults.js (overwritten by syncFromStore on first mount)
const defaults = reactive({
fontSize: { value: 14, unit: 'px' },
lineHeight: { value: 18, unit: 'px' },
fontFamily: 'sans-serif',
color: 'rgb(0, 0, 0)',
...TEXT_DEFAULTS,
fontSize: { ...TEXT_DEFAULTS.fontSize },
lineHeight: { ...TEXT_DEFAULTS.lineHeight },
_initialized: false,
});