← All changes | blocks/countdown/index.js +12 -38 2.0.3 → 2.0.14 View file →

		@@ -1,5 +1,5 @@
1		-wp.domReady(function () {
	1	+( function () {
2	2	var el = wp.element.createElement;
3	3	var Fragment = wp.element.Fragment;
4	4	var __ = wp.i18n.__;
5	5	var useState = wp.element.useState;
		@@ -13,8 +13,12 @@
13	13	var RangeControl = wp.components.RangeControl;
14	14	var SelectControl = wp.components.SelectControl;
15	15	var TextControl = wp.components.TextControl;
16	16
	17	+ var _cdTC, _cdTV;
	18	+ function _tc() { return _cdTC || (_cdTC = window.bkbgTypographyControl); }
	19	+ function _tv(obj, prefix) { var fn = _cdTV || (_cdTV = window.bkbgTypoCssVars); return fn ? fn(obj, prefix) : {}; }
	20	+
17	21	// Calculate time remaining
18	22	function getTimeRemaining(targetDate, targetTime) {
19	23	if (!targetDate) return { days: 0, hours: 0, minutes: 0, seconds: 0, total: 0 };
20	24
		@@ -49,9 +53,9 @@
49	53
50	54	registerBlockType('blockenberg/countdown', {
51	55	title: __('Countdown', 'blockenberg'),
52	56	icon: 'clock',
53		- category: 'blockenberg',
	57	+ category: 'bkbg-effects',
54	58	description: __('Display a countdown timer to a specific date and time.', 'blockenberg'),
55	59
56	60	edit: function (props) {
57	61	var attributes = props.attributes;
		@@ -296,41 +300,11 @@
296	300	})
297	301	),
298	302
299	303	el(PanelBody, { title: __('Typography', 'blockenberg'), initialOpen: false },
300		- el(RangeControl, {
301		- label: __('Digit Font Size', 'blockenberg'),
302		- value: a.digitFontSize,
303		- min: 24,
304		- max: 120,
305		- onChange: function (v) { setAttributes({ digitFontSize: v }); }
306		- }),
307		- el(SelectControl, {
308		- label: __('Digit Font Weight', 'blockenberg'),
309		- value: a.digitFontWeight,
310		- options: fontWeightOptions,
311		- onChange: function (v) { setAttributes({ digitFontWeight: parseInt(v, 10) }); }
312		- }),
313		- el(RangeControl, {
314		- label: __('Label Font Size', 'blockenberg'),
315		- value: a.labelFontSize,
316		- min: 10,
317		- max: 24,
318		- onChange: function (v) { setAttributes({ labelFontSize: v }); }
319		- }),
320		- el(SelectControl, {
321		- label: __('Label Font Weight', 'blockenberg'),
322		- value: a.labelFontWeight,
323		- options: fontWeightOptions,
324		- onChange: function (v) { setAttributes({ labelFontWeight: parseInt(v, 10) }); }
325		- }),
326		- el(RangeControl, {
327		- label: __('Title Font Size', 'blockenberg'),
328		- value: a.titleFontSize,
329		- min: 14,
330		- max: 48,
331		- onChange: function (v) { setAttributes({ titleFontSize: v }); }
332		- })
	304	+ _tc() && el(_tc(), { label: __('Digit', 'blockenberg'), value: a.typoDigit, onChange: function (v) { setAttributes({ typoDigit: v }); } }),
	305	+ _tc() && el(_tc(), { label: __('Label', 'blockenberg'), value: a.typoLabel, onChange: function (v) { setAttributes({ typoLabel: v }); } }),
	306	+ _tc() && el(_tc(), { label: __('Title', 'blockenberg'), value: a.typoTitle, onChange: function (v) { setAttributes({ typoTitle: v }); } })
333	307	),
334	308
335	309	el(PanelBody, { title: __('Spacing', 'blockenberg'), initialOpen: false },
336	310	el(RangeControl, {
		@@ -505,9 +479,9 @@
505	479
506	480	save: function (props) {
507	481	var a = props.attributes;
508	482
509		- var wrapStyle = {
	483	+ var wrapStyle = Object.assign({
510	484	'--bkbg-cd-wrap-bg': a.wrapBg,
511	485	'--bkbg-cd-digit-bg': a.digitBg,
512	486	'--bkbg-cd-digit-color': a.digitColor,
513	487	'--bkbg-cd-label-color': a.labelColor,
		@@ -522,9 +496,9 @@
522	496	'--bkbg-cd-gap': a.gap + 'px',
523	497	'--bkbg-cd-radius': a.borderRadius + 'px',
524	498	'--bkbg-cd-digit-padding': a.digitPadding + 'px',
525	499	'--bkbg-cd-digit-radius': a.digitRadius + 'px'
526		- };
	500	+ }, _tv(a.typoDigit, '--bkbg-cd-dig-'), _tv(a.typoLabel, '--bkbg-cd-lbl-'), _tv(a.typoTitle, '--bkbg-cd-ttl-'));
527	501
528	502	// Build units config as data attributes
529	503	var unitsConfig = [];
530	504	if (a.showDays) unitsConfig.push('days:' + a.labelDays);
		@@ -556,5 +530,5 @@
556	530	el('div', { className: 'bkbg-cd-countdown' })
557	531	);
558	532	}
559	533	});
560		-});
	534	+}() );