Extract styles from referenced property to fix style compatibility for theme.json version 3 in learning mode

[Imran92]

Steps to Reproduce

1. Install the assembler theme https://wordpress.com/theme/assembler
2. Undo the changes in this PR manually Fix lesson loading error issue in learning mode for themes that are using referenced styles #7658
3. Create a course with a lesson in it, make sure learning mode is enabled for that Course
4. Now try to access the lesson as a student

What I Expected

The Lesson to load without issue

What Happened Instead

It throws an error like 8551277-zd-a8c

PHP / WordPress / Sensei LMS version

8.1/ 6.6.1/ 4.24.1

Browser / OS version

Any

Screenshot / Video

Context / Source

Source: 8551277-zd-a8c

Reason we found after investigation:

In theme.json version 3, it's possible to use a reference of a color from another json file instead of explicitly using the name of hexcode of a color. We can use a object with a ref property now. But this function here can only extract the style from from a string property. So to make LM lessons fully compatible with theme.json version 3 styles, we need to be able to extract this reference-type styles properly as well.

We've fixed the error throwing with a quick PR #7658 just so that lessons work even in this scenario. It prevents the error from happening. We'll handle the extraction of style under this issue.

Additional read: https://developer.wordpress.org/block-editor/reference-guides/theme-json-reference/theme-json-living/

[github-actions]

Support References

This comment is automatically generated. Please do not edit it.

• 8551277-zen