<div class="umb-node-preview" ng-class="{'umb-node-preview--sortable': sortable, 'umb-node-preview--unpublished': published === false }">
    <div class="flex"> <!-- div keeps icon and nodename from wrapping -->
        <umb-icon ng-if="icon" icon="{{icon}}" class="umb-node-preview__icon"></umb-icon>
        
        <div class="umb-node-preview__content">

            <div class="umb-node-preview__name" ng-attr-title="{{nodeNameTitle}}">{{name}}</div>
            <div class="umb-node-preview__description" ng-if="description">{{description}}</div>

            <div class="umb-user-group-preview__permissions" ng-if="permissions">
                <span>
                    <span class="bold"><localize key="general_rights">Permissions</localize>:</span>
                    <span ng-repeat="permission in permissions" class="umb-user-group-preview__permission">{{permission.name}}</span>
                </span>
            </div>
        </div>
    </div>
    <div class="umb-node-preview__actions">

        <!-- If editUrl has a value we render a link otherwise a button -->
        <a class="umb-node-preview__action"
           ng-href="{{editUrl}}"
           ng-if="allowEdit && editUrl"
           ng-click="onEdit()">
            <localize key="general_edit">Edit</localize><span class="sr-only">&nbsp;{{name}}</span>
        </a>

        <button type="button"
                class="umb-node-preview__action"
                ng-if="allowEdit && !editUrl"
                ng-click="onEdit()">
            <localize key="general_edit">Edit</localize><span class="sr-only">&nbsp;{{name}}...</span>
        </button>

        <!-- If openUrl has a value we render a link otherwise a button -->
        <a class="umb-node-preview__action"
           ng-href="{{openUrl}}"
           ng-if="allowOpen && openUrl"
           ng-click="onOpen()">
            <localize key="general_open">Open</localize><span class="sr-only">&nbsp;{{name}}</span>
        </a>

        <button type="button"
                class="umb-node-preview__action"
                ng-if="allowOpen && !openUrl"
                ng-click="onOpen()">
            <localize key="general_open">Open</localize><span class="sr-only">&nbsp;{{name}}...</span>
        </button>

        <!-- If removeUrl has a value we render a link otherwise a button -->
        <a class="umb-node-preview__action umb-node-preview__action--red"
            ng-href="{{changeUrl}}"
            ng-if="allowChange && changeUrl"
            ng-click="onChange()">
            <localize key="general_change">Change</localize><span class="sr-only">&nbsp;{{name}}</span>
        </a>
    
        <button type="button"
                class="umb-node-preview__action umb-node-preview__action--red"
                ng-if="allowChange && !changeUrl"
                ng-click="onChange()">
            <localize key="general_change">Change</localize><span class="sr-only">&nbsp;{{name}}</span>
        </button>

        <!-- If removeUrl has a value we render a link otherwise a button -->
        <a class="umb-node-preview__action umb-node-preview__action--red"
           ng-href="{{removeUrl}}"
           ng-if="allowRemove && removeUrl"
           ng-click="onRemove()">
            <localize key="general_remove">Remove</localize><span class="sr-only">&nbsp;{{name}}</span>
        </a>

        <button type="button"
                class="umb-node-preview__action umb-node-preview__action--red"
                ng-if="allowRemove && !removeUrl"
                ng-click="onRemove()">
            <localize key="general_remove">Remove</localize><span class="sr-only">&nbsp;{{name}}</span>
        </button>
    </div>

</div>
