19.2.1 Understanding Plug-ins

Learn about plug-ins and how to find examples.

19.2.1.1 About Plug-ins

A plug-in is an extension to the built-in types available APEX.

Create plug-ins for declarative use of new item, region, process and dynamic action types in your application.

APEX supports a set group of authentication scheme, authorization scheme, item, region, dynamic action, and process types. Plug-ins offer a means of augmenting these built-in types by declaratively creating and using new types in your application. Because plug-ins are designed for reuse, developers can export and import them to other workspaces and also share them with the Oracle APEX Plug-in community by using the Plug-in Repository.

The process of implementing a plug-in involves the following steps:

  1. Create a plug-in or import a plug-in into your application workspace.
  2. Edit or create an authorization scheme, item, region, process, or dynamic action type to use the plug-in.
  3. Run your application to test the plug-in.

19.2.1.2 About Template Component Type Plug-ins

Template Components are reusable UI components that work in Page Designer like any plug-in.

About Template Components

Template Components enable developers to create templates with placeholders, including action positions and action templates. APEX exposes the placeholders in the templates as custom plug-in attributes.

Use Template Components to add new region types to APEX which are not based on PL/SQL. Template Components support template directives, Actions and Menu buttons with row-level conditions, and both CSS and JS files.

About Creating Template Components

To create a Template Component, create a new plug-in and specify the Type as Template Component. Under Templates, enter markup for the template. You specify how the plug-in displays and where it can be used by configuring the Available as attribute:

  • Multiple (Report) - Use the Template Component for a region to show multiple rows with pagination options.

  • Single (Partial) - Use the Template Component for an interactive report column or for a region to show a single row.

  • Region Only - When checked, the Template Component can be used as a region showing static values. The provided HTML template is displayed without any wrapping HTML elements around it. The region has a limited number of attributes in Page Designer (excludes Region Template, Header text, Footer text). Oracle recommends including the APEX$DOM_ID substitution as an ID attribute of an element in within the template, to ensure that existing APEX functionality works with this component.

    Template Components can always be used in server-side Template Directives using {with/} and {apply/} syntax without checking any of the checkboxes. For example:

    {with/}
    PLACEHOLDER1:=Some value
    PLACEHOLDER2:=Some value
    {apply INTERNAL_NAME/}

Tip:

Template Component Type plug-in include support for template directives. To learn more, see Using Template Directives.

Row Selection

To enable selection support for a given Template Component plug-in, under Standard Attributes, select Has Row Selection Support on the plug-in Create or Edit page. You can also use the placeholder APEX$SELECTOR inside a row or partial html template. This placeholder will be rendered as a radio input per row (single selection) or a checkbox input per row (multiple selection).

Custom Attributes

To reference the Static IDs, edit the plug-in and add Custom Attributes with a Scope of Component and use the #STATIC_ID# placeholder syntax. You can quickly synchronize all placeholders as Custom Attributes using clicking the Synchronize from Templates button on the plug-in Edit page. These Custom Attributes are used by Page Designer to assign values to placeholders.

Action Positions and Action Templates

Editing a plug-in and adding Actions enables end users to interact with the Template Component. The Action Template defines if the template is a simple Button or displays a Menu button. The Action Position defines the position of the button within the template. You specify in Page Designer which action to perform on a click of the button.

Slots

Tip:

In earlier releases, slots were known as Display Points and later renamed to Positions.

Slots are placeholders in a template component markup where you can place page components, such as regions, items, and buttons. By configuring which page component is supported, you can use slots to restrict the placement of regions, items and buttons in a template component.

Template component slots:

  • Suport nesting of multiple components which is essential for creating more advanced template components using layered UI designs.
  • Give developers the ability to limit what type of components are allowed in a template component slot, thereby providing strong template guardrails for consistent appearance.

Impacts in Page Designer when using slots:

  • Item Control - If a slot has item control, for example, it only allows Checkbox or Radio item types:

    • An item created in the slot will default to checkbox (first available).

    • In the Rendering tree and Layout tab, developers will be unable to drop unsupported item types.

    • In the Property Editor, unsupported item types ARE hidden under the Unsupported flag. Developers can view full list of all available item types by clicking the Type select list and selecting Show Unsupported.

    • Developers can move unsupported item types into a slot from the Property Editor (a soft restriction).

  • Region Control - If a slot has region control, for example, it only allows Avatar or Static Content region types.

    • A region created in the slot will default to avatar (first available).

    • In the Rendering tree and Layout tab, developers will be unable to move unsupported regions.

    • In the Property Editor, unsupported regions will be hidden under the Unsupported flag. Developers can view full list of all available regions by clicking the Type select list and selecting Show Unsupported.

    • Developers can move unsupported regions in a slot from the Property Editor (a soft restriction).

Nested Templates

Oracle APEX enables you to embed another Template Component within a current Template Component. Nesting Template Components is a way to break templates into smaller reusable components. To nest a Template Component use the use the {with/} and {apply/} syntax of template directives.

Viewing Template Component Examples

The Universal Theme includes several Template Component Type plug-ins:

  • Comments - Based on the classic report Comments template. Displays user comments and status updates declaratively using custom region attributes. Supports avatars.
  • Content Row - Based on the classic report Content Row template. Displays region content and layout as a content row using custom region attributes. Supports avatars and badges.
  • Media List - Based on the classic report Media List template. Displays region content and layout as a media list using custom region attributes. Supports avatars and badges.
  • Timeline - Based on the classic report Timeline template. Displays a series of events by declaratively setting custom region attributes.

To view Template Component Type plug-ins available in the go to Shared Components, Templates, and then sort by Type, Template Component.

19.2.1.3 Example Plug-ins

View plug-in examples on apex.world and the Oracle APEX GitHub repository.

You can view plug-in implementation examples in the following locations: