Screen aware context for conditional logic

Problem to Solve

Conditional logic works to reference fields we know information for, these are Pods fields.

We need the ability to reference fields that Pods JS config will provide details about from the current WP screen itself. This contains information about the selector to get the input value from OR what API to use such as the case to get block editor data: wp.data.select( 'core/editor' ).getEditedPostAttribute( 'date' ) ).

Proposed Solution

[ ] Backend: Provide screen context to JS via window.podsDFVConfig.screenConfig
[ ] React: Look for window.podsDFVConfig.screenConfig and use that mapping of availableFields when doing conditional logic checks for rules that reference fields not in field values provided by Pods itself
[ ] React: Handle input source that maps to getting the selector by class path / ID and gets value from an input
[ ] React: Handle select source that maps to getting the selector by class path / ID and gets value from an select
[ ] React: Handle textarea source that maps to getting the selector by class path / ID and gets value from a textarea
[ ] React: Handle wp-core-editor-post-attribute source that maps to wp.data.select( 'core/editor' ).getEditedPostAttribute( {selectorFromAvailableFieldsGoesHere} ) )
[ ] React: Handle wp-tinymce-content source that uses the current info from tinymce to know whether to get content from tinymce.editors.content.getContent() or the textarea#content depending on if "Visual" or "Text" tab is active for that editor
[ ] React: Handle static source that maps to getting the value for a field from the value property passed into the available field

Screen context provided by the backend could look something like this in window.podsDFVConfig.screenConfig:

{
    "screen": "post-edit",
    "type": "block-editor",
    "availableFields": [
        "post_title": {
            "dataType": "string",
            "source": "wp-core-editor-post-attribute",
            "selector": "title"
        },
        "post_content": {
            "dataType": "string",
            "source": "wp-core-editor-post-attribute",
            "selector": "content"
        },
        "post_status": {
            "dataType": "string",
            "source": "wp-core-editor-post-attribute",
            "selector": "status"
        },
        "some_other_field": {
            "dataType": "string",
            "source": "static",
            "value": "some static value here"
        },
        "some_other_field": {
            "dataType": "array",
            "source": "static",
            "value": [
                "some static value 1 here",
                "some static value 2 here"
            ]
        }
    ]
}

or something like this on the classic editor, note that post_content would have to interact with TinyMCE to get the content:

{
    "screen": "post-edit",
    "type": "classic-editor",
    "availableFields": [
        "post_title": {
            "dataType": "string",
            "source": "input",
            "selector": "#title"
        },
        "post_content": {
            "dataType": "string",
            "source": "wp-tinymce",
            "selector": "content"
        },
        "post_status": {
            "dataType": "string",
            "source": "select",
            "selector": "#post_status"
        }
    ]
}

pods-framework / pods

Screen aware context for conditional logic #7113

Problem to Solve

Proposed Solution