ShareDialog
AppShare modal: copyable link, email invitation with permission picker, and a list of current invitees with permission/remove controls.
Share
Invite people or copy the link.
People with access (3)
-
AB
Owner
Alice Brooks
alice@example.com
-
MR
Marcus Reed
marcus@example.com
-
PS
Priya Sharma
priya@example.com
<%- include('modules/app/ShareDialog', {
open: true,
shareUrl: 'https://app.example.com/docs/x4y9-zk7',
invitees: [
{ id: '1', name: 'Alice Brooks', email: 'alice@example.com', permission: 'owner' },
{ id: '2', name: 'Marcus Reed', email: 'marcus@example.com', permission: 'editor' },
{ id: '3', name: 'Priya Sharma', email: 'priya@example.com', permission: 'viewer' }
]
}) %>Share
Invite people or copy the link.
<%- include('modules/app/ShareDialog', {
open: true,
shareUrl: 'https://app.example.com/projects/empty-share',
invitees: []
}) %><%
var _id = locals.id || ('share-' + Math.random().toString(36).substr(2,6));
var _title = locals.title || 'Share';
var _description = locals.description || 'Invite people or copy the link.';
var _shareUrl = locals.shareUrl || '';
var _open = !!locals.open;
var _invitees = locals.invitees || [];
var _permissions = locals.permissions || [
{ value: 'viewer', label: 'Viewer' },
{ value: 'commenter', label: 'Commenter' },
{ value: 'editor', label: 'Editor' }
];
var _defaultPermission = locals.defaultPermission || 'viewer';
var _inviteAction = locals.inviteAction || '#';
var _inviteMethod = locals.inviteMethod || 'post';
var _updatePermissionAction = locals.updatePermissionAction || '#';
var _removeInviteeAction = locals.removeInviteeAction || '#';
function _permBadgeClass(p) {
if (p === 'owner') return 'bg-warning-subtle text-warning-fg';
if (p === 'editor') return 'bg-primary-subtle text-primary';
if (p === 'commenter') return 'bg-info-subtle text-info-fg';
return 'bg-surface-sunken text-text-secondary';
}
function _initials(name) {
if (!name) return '?';
var parts = String(name).trim().split(/\s+/);
return (parts.slice(0,2).map(function(p){ return p[0]; }).join('') || '?').toUpperCase();
}
%>