Documentation Engine Demo

This is a demo of how our documentation engine to see the real Paw docs go to Paw Docs

.. bc::
    :noindex: true

    * Paw Docs Engine demo

.. toctree::
    :maxdepth: 0

.. tile:: A Tile Component
    :icon: /Images/icons/Visual_Editing.svg

    We can put some txt here... But really we can put any content we want.

    A list
    ======
    * These items
    * are normal
    * Used to link to other doc pages

    But we could also put anythign inside here.

    .. code-block:: javascript

            function evaluate(context){
                return 1 // a code snippet
            };

.. tile:: Another tile
    :icon: /Images/icons/Migration_Large.svg

    We auto group tiles in react at render time.
    So that if these tiles are in sequence they will end up in a parent container.

    -------------------------------------------------------------------------

    We really can use any markup inside these items it just renders the children.

    For example and image banner.

    .. imgcollection::
        :align: center

        .. figure:: /Images/auth/digest-auth/digest-auth-2.png

Tiles are not the only custom item we have

.. dv:: Dynamic values have a dedicated UI item

    .. dvvis:: Visual Tab

        .. figure:: /Images/authorization/HTTPBasicAuthDynamicValue.png

            Not all custom directives need a dedicated react component, for
            example this ``dvvis`` is a subclass of our ``tab`` component.
            For React this means we have no custom code for ``dvvis`` the only
            custom code is on the sphinx gen side.

            The ``Code Tab`` however has a lot of dedicated layout info,
            the data defined here is passed to the AST as config.


    .. dvspec:: Code Tab
        :identifier: com.luckymarmot.BasicAuthDynamicValue

        .. arg:: username
            :type: DynamicString

            The username.

        .. arg:: password
            :type: DynamicString

            The password.

        .. arg:: charset
            :type: string
            :default: ``utf-8``

            The charset used for encoding.

        .. code-block:: javascript

            function evaluate(context){
                var dv = new DynamicValue('com.luckymarmot.BasicAuthDynamicValue', {
                    username: 'john.appleseed',
                    password: 'myOwnSuperSecretPassword'
                });
                return dv.getEvaluatedString();
            };

    .. tab:: A custom tab

        Since the `dv` is just a subclass of of a tabbed view.

We also have tutorial step

.. tstep:: Like tiles these will auto join up if in sequence

    By auto joining sequence `tstep` components we are able to dynamically
    inject step numbers.

    As with tiles we can put anything in here.

    .. jsmethod:: readFile

        .. mspec:: Specification

            .. arg:: filename
                :type: string

                relative path to file

            .. returns:: string

                files data read as a string

            It may be handy to store files in your Extension directory, and then read their content from your script (e.g. for templates). Use the ``readFile()`` function for that purpose.

.. tstep:: Another step to our tutorial

    Not shown here but our docs can also auto get a list of items on the page
    and a see also list shown on the right hand side.