38 lines
1.1 KiB
JavaScript
38 lines
1.1 KiB
JavaScript
export function renderHeader({ title, leftAction, leftLabel = '', rightActions = [] }) {
|
|
const wrap = document.createElement('header');
|
|
wrap.className = 'page-header';
|
|
|
|
const left = document.createElement('div');
|
|
left.className = 'header-left';
|
|
if (leftAction) {
|
|
const btn = document.createElement('button');
|
|
btn.className = 'icon-btn';
|
|
btn.textContent = leftAction.label;
|
|
btn.addEventListener('click', leftAction.onClick);
|
|
left.append(btn);
|
|
}
|
|
if (leftLabel) {
|
|
const label = document.createElement('span');
|
|
label.className = 'header-left-label';
|
|
label.textContent = leftLabel;
|
|
left.append(label);
|
|
}
|
|
|
|
const h1 = document.createElement('h1');
|
|
h1.className = 'page-title';
|
|
h1.textContent = title;
|
|
|
|
const right = document.createElement('div');
|
|
right.className = 'header-actions';
|
|
rightActions.forEach((action) => {
|
|
const btn = document.createElement('button');
|
|
btn.className = 'icon-btn';
|
|
btn.textContent = action.label;
|
|
btn.addEventListener('click', action.onClick);
|
|
right.append(btn);
|
|
});
|
|
|
|
wrap.append(left, h1, right);
|
|
return wrap;
|
|
}
|