PluginProbe ʕ •ᴥ•ʔ
GenerateBlocks / 2.0.0
GenerateBlocks v2.0.0
trunk 1.0 1.0.1 1.0.2 1.1.0 1.1.1 1.1.2 1.2.0 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.5.0 1.5.1 1.5.2 1.5.3 1.5.4 1.6.0 1.7.0 1.7.1 1.7.2 1.7.3 1.8.0 1.8.1 1.8.2 1.8.3 1.9.0 1.9.1 2.0.0 2.0.1 2.0.2 2.1.0 2.1.1 2.1.2 2.2.0 2.2.1 2.3.0
generateblocks / src / blocks / button / components / ComponentCSS.js
generateblocks / src / blocks / button / components Last commit date
BlockControls.js 2 years ago ButtonContentRenderer.js 2 years ago ComponentCSS.js 1 year ago ConditionalColors.js 2 years ago InspectorAdvancedControls.js 3 years ago
ComponentCSS.js
65 lines
1 import { memo } from '@wordpress/element';
2 import { useSelect } from '@wordpress/data';
3 import DesktopCSS from '../css/desktop';
4 import TabletCSS from '../css/tablet';
5 import TabletOnlyCSS from '../css/tablet-only';
6 import MobileCSS from '../css/mobile';
7 import MainCSS from '../css/main';
8 import shouldRebuildCSS from '../../../utils/should-rebuild-css';
9
10 function ComponentCSS( props ) {
11 const deviceType = useSelect( ( select ) => {
12 const { getDeviceType } = select( 'core/editor' ) || {};
13
14 if ( 'function' === typeof getDeviceType ) {
15 return getDeviceType();
16 }
17
18 const {
19 __experimentalGetPreviewDeviceType: experimentalGetPreviewDeviceType,
20 } = select( 'core/edit-post' );
21
22 if ( 'function' === typeof experimentalGetPreviewDeviceType ) {
23 return experimentalGetPreviewDeviceType();
24 }
25
26 return '';
27 }, [] );
28
29 const {
30 isBlockPreview = false,
31 } = props?.attributes;
32
33 if ( isBlockPreview ) {
34 return null;
35 }
36
37 return (
38 <>
39 <MainCSS { ...props } />
40
41 { deviceType &&
42 <>
43 { 'Desktop' === deviceType &&
44 <DesktopCSS { ...props } />
45 }
46
47 { ( 'Tablet' === deviceType || 'Mobile' === deviceType ) &&
48 <TabletCSS { ...props } />
49 }
50
51 { 'Tablet' === deviceType &&
52 <TabletOnlyCSS { ...props } />
53 }
54
55 { 'Mobile' === deviceType &&
56 <MobileCSS { ...props } />
57 }
58 </>
59 }
60 </>
61 );
62 }
63
64 export default memo( ComponentCSS, shouldRebuildCSS );
65