Build easy customizable admin features for your app ✍️

What's New

Add workaround for Swift 5.3 bug



  • Add workaround for Swift 5.3 bug


Login screen

Successful login

Manage users


Confirm Modal

Admin Panel includes a generic confirmation modal for links, out of the box. Using HTML data attributes on <a>-tags the modal can be configured in different ways. Just add a data attribute to your link and you're all set.

Triggering the modal will append a HTML-element form to the DOM, containing title, text, confirm button and dismiss button.

By default confirm submits the form and dismiss will remove the HTML-element from the DOM

Basic usage

<a href="#" data-confirm="true">Open modal</a>

Data Attributes

Attribute Description example
data-confirm Initialize the modal data-confirm="true"
data-title Sets the title of the modal data-title="Please confirm"
data-text Sets the text of the modal data-text="Are you sure you want to continue?"
data-button Sets bootstrap css selector for the confirm button data-button="danger" [primary,secondary,success,danger,warning,info,light,dark]
data-confirm-btn Set the text label on the "confirm"-button data-confirm-btn="Yes"
data-dismiss-btn Set the text label on the "dismiss"-button data-confirm-btn="No"

Override default behavior

// Override modal confirm action
modalConfirmation.actions.confirm = function(event) {

// Overríde modal dismiss action
modalConfirmation.actions.dismiss = function(event) {

Leaf tags

Admin panel comes with a variety of leaf tags for generating certain HTML/js elements


Use user image or fallback to Adorable avatars

Parameter Type Description
email String user's email
url String image url

Example usage

<img src=", user.avatarURL)" alt="Profile picture" class="img-thumbnail" width="40">


Convenience method to output configuration strings such as app or environment name or paths to certain templates

Supported input values and what they output

  • name: App name
  • baseURL: App base URL
  • sidebarMenuPath: Path to sidebar menu view template
  • dashboardPath: Path to dashboard view template
  • environment: Environment name
Parameter Type Description
configName String Config variable name

Example usage

<!-- outputs app name ->


Outputs a field on the current user object as a string

Parameter Type Description
fieldName String User field name

Example usage

<!-- outputs user's name ->


Make sure user has required role to output element. If not throws an error.

Parameter Type Description
roleName String User role

Example usage

#adminPanel:user:requireRole("superAdmin") {
    <div>I show if user is super admin</div>


Check if user has a required role

Parameter Type Description
roleName String User role

Example usage

#if(adminPanel:user:hasRequiredRole("superAdmin")) {
    // Do something
} else {
    // Do something else


Renders a header, styled in a certain way, for the navigation sidebar.

Example usage

#adminPanel:sidebar:heading() { Super Admin }


Renders a sidebar menu item, styled in a certain way, for the navigation sidebar.

Parameter Type Description
url String Menu item link reference
icon String Feather icon for menu item
activeURLPatterns String URL pattern to determine active state

Example usage

#adminPanel:sidebar:menuItem("/admin/dashboard", "home", "/admin/dashboard*") { Home }


  • Swift Tools 4.2.0
View More Packages from this Author