← All changes | includes/controls/typography.php +69 -15 2.8.1 → 2.14.0 View file →

		@@ -63,10 +63,18 @@
63	63	]
64	64	];
65	65	}
66	66
67		- public static function get_css( $attribute_value, $property = '', $device = '', $attribute_global_name = '' ) {
68		- global $ablocks_fonts;
	67	+ /**
	68	+ * @param mixed $attribute_value Stored typography object.
	69	+ * @param string $property Unused legacy argument.
	70	+ * @param string $device Device suffix.
	71	+ * @param string $attribute_global_name Global typography id, if any.
	72	+ * @param bool $expand_font_stack Whether to turn the stored family into
	73	+ * a full stack. The atomic compiler must
	74	+ * pass false — see below.
	75	+ */
	76	+ public static function get_css( $attribute_value, $property = '', $device = '', $attribute_global_name = '', $expand_font_stack = true ) {
69	77	$global_value = [];
70	78	if ( $attribute_global_name ) {
71	79	$global_typography = wp_list_pluck( \Ablocks\Helper::get_settings( 'global_typography', [] ), 'value', 'id' );
72	80	$global_value = ( isset( $global_typography[ $attribute_global_name ] ) ? (array) $global_typography[ $attribute_global_name ] : [] );
		@@ -83,29 +91,42 @@
83	91	// Helper: add CSS property with global fallback
84	92	$add_prop = function( $prop, $local_val, $local_unit, $global_key, $css_var_name ) use ( $attribute_global_name, $global_value, &$css ) {
85	93	if ( ! empty( $global_value[ $global_key ] ) ) {
86	94	$css[ $prop ] = "var(--ablocks-{$attribute_global_name}-{$css_var_name})";
87		- } elseif ( ! empty( $local_val ) ) {
	95	+ } elseif ( \ABlocks\Helper::has_responsive_value( $local_val ) ) {
	96	+ // A stored 0 is a real value (matches the editor's addProp()).
88	97	$css[ $prop ] = $local_unit ? $local_val . $local_unit : $local_val;
89	98	}
90	99	};
91	100
92		- // Font family (special: also track font weights for enqueue)
	101	+ // Font family. Output the CSS value only — font *discovery* is no longer
	102	+ // done at render time. The set of fonts a page uses is collected from
	103	+ // saved block attributes (FontCollector) and emitted by core via
	104	+ // theme.json (CoreFontRegistry). See docs/FONT-MANAGEMENT-PLAN.md.
	105	+ //
	106	+ // The stored attribute is a bare family name (that name doubles as the
	107	+ // download key), so FontStack turns it into a real stack — quoted, with a
	108	+ // metric-adjusted fallback face and a generic tail derived from the font's
	109	+ // own category. There is no per-block fallback field: `fontFallback` is
	110	+ // read only so a value set through a filter still wins.
93	111	if ( ! empty( $global_value['fontFamily'] ) ) {
94	112	$css['font-family'] = "var(--ablocks-{$attribute_global_name}-font-family)";
95	113	} elseif ( ! empty( $value['fontFamily'] ) ) {
96		- $font_family = $value['fontFamily'];
97		- $font_weight = ! empty( $value['weight'] ) ? $value['weight'] : '400';
98		- $css['font-family'] = $font_family;
99		-
100		- if ( isset( $ablocks_fonts[ $font_family ] ) ) {
101		- if ( ! in_array( $font_weight, $ablocks_fonts[ $font_family ], true ) ) {
102		- $ablocks_fonts[ $font_family ][] = $font_weight;
103		- }
104		- } else {
105		- $ablocks_fonts[ $font_family ] = [ $font_weight ];
	114	+ // A stored family becomes a full stack everywhere EXCEPT the atomic
	115	+ // compiler, whose declarations are hashed in JS at save time and
	116	+ // again here at render time and must agree byte for byte. A stack
	117	+ // cannot take part in that: it depends on the metrics table, the
	118	+ // `font_metric_fallback` setting and the `ablocks/font_stack`
	119	+ // filter, none of which the editor can see.
	120	+ $family = $expand_font_stack
	121	+ ? \ABlocks\Classes\FontStack::build(
	122	+ $value['fontFamily'],
	123	+ isset( $value['fontFallback'] ) ? $value['fontFallback'] : ''
	124	+ )
	125	+ : $value['fontFamily'];
	126	+ if ( '' !== $family ) {
	127	+ $css['font-family'] = $family;
106	128	}
107		- update_option( ABLOCKS_FONTS_SETTINGS_NAME, wp_json_encode( $ablocks_fonts ) );
108	129	}
109	130
110	131	// Desktop-only styles
111	132	if ( empty( $device ) ) {
		@@ -125,13 +146,46 @@
125	146
126	147	foreach ( $map as $prop => $css_prop ) {
127	148	$local_val = $value[ $prop . $device ] ?? '';
128	149	$local_unit = $value[ $prop . 'Unit' . $device ] ?? '';
	150	+ // A custom breakpoint has no unit default, so a value set there
	151	+ // without touching the unit compiled unitless. Cascade like the
	152	+ // editor's unit selector does, else px. Native devices unchanged.
	153	+ if ( '' === $local_unit && ! in_array( $device, [ '', 'Tablet', 'Mobile' ], true ) ) {
	154	+ $local_unit = \ABlocks\Helper::get_responsive_value( (array) $attribute_value, $prop . 'Unit', $device );
	155	+ if ( ! $local_unit ) {
	156	+ $local_unit = 'px';
	157	+ }
	158	+ }
129	159	$global_key = $prop . $device;
130	160
131	161	$css_var_name = $css_prop . ( $device ? '-' . strtolower( $device ) : '' );
132	162
133	163	$add_prop( $css_prop, $local_val, $local_unit, $global_key, $css_var_name );
	164	+ }
	165	+
	166	+ /*
	167	+ * Columns, direction and text stroke. Appended after the original
	168	+ * members so anything saved before these existed compiles byte-for-byte
	169	+ * as it did — for atomic blocks the style class is a hash of this
	170	+ * output. Desktop-only, like weight/transform/style/decoration above,
	171	+ * and with no global-typography equivalent to fall back to. Mirrors the
	172	+ * tail of typographyPairs() in src/blocks/atomic-shared/styles.js.
	173	+ */
	174	+ if ( empty( $device ) ) {
	175	+ if ( isset( $value['columns'] ) && '' !== $value['columns'] ) {
	176	+ $css['column-count'] = $value['columns'];
	177	+ }
	178	+ if ( ! empty( $value['direction'] ) ) {
	179	+ $css['direction'] = $value['direction'];
	180	+ }
	181	+ if ( isset( $value['strokeWidth'] ) && '' !== $value['strokeWidth'] ) {
	182	+ $stroke_unit = ! empty( $value['strokeWidthUnit'] ) ? $value['strokeWidthUnit'] : 'px';
	183	+ $css['-webkit-text-stroke-width'] = $value['strokeWidth'] . $stroke_unit;
	184	+ }
	185	+ if ( ! empty( $value['strokeColor'] ) ) {
	186	+ $css['-webkit-text-stroke-color'] = $value['strokeColor'];
	187	+ }
134	188	}
135	189
136	190	return $css;
137	191	}