;(function () {
/* SectionHeader — title row with optional "View more" + chevron action. */

const SectionHeader = ({ title, action = 'View more', onActionPress }) => (
  <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', paddingTop: 0, paddingBottom: '8px', paddingLeft: '4px', paddingRight: '4px' }}>
    <span style={{ flex: 1, fontFamily: 'Gilroy', fontWeight: 600, fontSize: '14px', color: colors.ink2 }}>{title}</span>
    {action ? (
      <button onClick={onActionPress} style={{ border: 'none', background: 'transparent', padding: 0, margin: 0, cursor: 'pointer', font: 'inherit', color: 'inherit', textAlign: 'inherit', display: 'flex', flexDirection: 'row', alignItems: 'center', gap: '2px' }}>
        <span style={{ fontFamily: 'Inter', fontWeight: 400, fontSize: '12px', color: colors.muted2 }}>{action}</span>
        <Chev />
      </button>
    ) : null}
  </div>
);

Object.assign(window, { SectionHeader });
})();
