10.1.6:64 Uncaught TypeError: a(...).colorbox is not a function

Problem/Motivation

Receiving the following errors and am unable to determine why ...

drupal.js?v=10.1.6:64 Uncaught TypeError: a(...).colorbox is not a function
    at HTMLDivElement.<anonymous> (nacolorbox.js:19:11)
    at Function.each (jquery.js:383:1)
    at jQuery.fn.init.each (jquery.js:205:1)
    at Object.attach (nacolorbox.js:6:41)
    at drupal.js?v=10.1.6:166:24
    at Array.forEach (<anonymous>)
    at Drupal.attachBehaviors (drupal.js?v=10.1.6:162:34)
    at big_pipe.js?v=10.1.6:138:10
    at big_pipe.js?v=10.1.6:169:3
drupal.js?v=10.1.6:64 Uncaught TypeError: a(...).colorbox is not a function
    at HTMLDivElement.<anonymous> (nacolorbox.js:19:11)
    at Function.each (jquery.js:383:1)
    at jQuery.fn.init.each (jquery.js:205:1)
    at Object.attach (nacolorbox.js:6:41)
    at drupal.js?v=10.1.6:166:24
    at Array.forEach (<anonymous>)
    at Drupal.attachBehaviors (drupal.js?v=10.1.6:162:34)
    at drupal.init.js?v=10.1.6:32:12
    at HTMLDocument.listener (drupal.init.js?v=10.1.6:20:7)
drupal.js?v=10.1.6:64 Uncaught TypeError: a(...).colorbox is not a function
    at HTMLDivElement.<anonymous> (nacolorbox.js:19:11)
    at Function.each (jquery.js:383:1)
    at jQuery.fn.init.each (jquery.js:205:1)
    at Object.attach (nacolorbox.js:6:41)
    at drupal.js?v=10.1.6:166:24
    at Array.forEach (<anonymous>)
    at Drupal.attachBehaviors (drupal.js?v=10.1.6:162:34)
    at success (ajax.js?v=10.1.6:1800:20)
    at l (loadjs.min.js?v=4.2.0:1:217)
    at loadjs.min.js?v=4.2.0:1:1556

There are 3 calls to the colorbox function on the page, but each error looks slightly different ... not sure if that's relevant.

My code calling it looks like ...

import jQuery from 'jquery';

(($) => {
  Drupal.behaviors.naColorbox = {
    attach(context) {
      $('.block--collapsible', context).each((index, element) => {
        const content = $(element).find('.block--collapsible__content');
        let height = '92%';
        try {
          height = `${parseInt($(window).height() * 0.92, 10)}px`;
        } catch (ex) {
          // do nothing
        }
        $(element).colorbox({
          inline: true,
          href: content,
          width: '92%',
          height,
          maxWidth: '960px',
          maxHeight: '720px',
          scrolling: true,
        });
      });
    },
  };
})(jQuery);

Viewing the page's source (with JS not aggregated, I see ...

<script src="/modules/contrib/colorbox/js/colorbox.js?v=10.1.6"></script>
<script src="/libraries/colorbox/jquery.colorbox-min.js?v=10.1.6"></script>
<script src="/modules/contrib/colorbox_inline/js/colorbox_inline.js?s46bqs"></script>
...
<script src="/modules/contrib/colorbox_load/js/colorbox_load.js?s46bqs"></script>
...
<script src="/themes/custom/my_theme/dist/js/00-base/06-colorbox/nacolorbox.js?s46bqs"></script>

Steps to reproduce

I just upgraded to Drupal 10.1.6 and am running Colorbox v 2.0.1

Proposed resolution

What am I missing? It seems everything is installed, but I can't make this work.

Thanks!