feat(ui): export side effect free singletons for deduping multiple instances before "main" singleton instance is registered

.changeset/long-actors-clap.md

@@ -0,0 +1,16 @@
+---
+'@lion/ui': patch
+---
+
+BREAKING: remove setIcons, setOverlays, setLocalize.
+
+Recommended approach is to do below at the top of your app (before lion code runs):
+
+```js
+import { singletonManager } from 'singleton-manager';
+import { LocalizeManager } from '@lion/ui/localize-no-side-effects.js';
+
+class MyLocalizeManager extends LocalizeManager {}
+
+singletonManager.set('@lion/ui::localize::0.x', new MyLocalizeManager());
+```

packages/ui/components/icon/src/icons.js

@@ -1,10 +1,4 @@
 import { singletonManager } from 'singleton-manager';
 import { IconManager } from './IconManager.js';
 
-// eslint-disable-next-line import/no-mutable-exports
+export const icons = singletonManager.get('@lion/ui::icons::0.x') || new IconManager();
-export let icons = singletonManager.get('@lion/ui::icons::0.x') || new IconManager();
-
-// @ts-ignore since we don't know which singleton icon manager version will be used, we cannot type it.
-export function setIcons(newIcons) {
-  icons = newIcons;
-}

packages/ui/components/localize/src/singleton.js

@@ -3,19 +3,9 @@ import { LocalizeManager } from './LocalizeManager.js';
 
 /** @type {LocalizeManager} */
 // eslint-disable-next-line import/no-mutable-exports
-export let localize =
+export const localize =
   singletonManager.get('@lion/ui::localize::0.x') ||
   new LocalizeManager({
     autoLoadOnLocaleChange: true,
     fallbackLocale: 'en-GB',
   });
-
-/**
- * @param {LocalizeManager} newLocalize
- */
-export function setLocalize(newLocalize) {
-  localize.teardown();
-  localize = newLocalize;
-}
-
-export { LocalizeManager };

packages/ui/components/localize/test/localize.test.js

@@ -1,7 +1,6 @@
 import { expect } from '@open-wc/testing';
-import sinon from 'sinon';
 
-import { localize, setLocalize, LocalizeManager } from '@lion/ui/localize.js';
+import { localize, LocalizeManager } from '@lion/ui/localize.js';
 
 /**
  * @param {LocalizeManager} localizeManagerEl
@@ -27,22 +26,6 @@ describe('localize', () => {
     expect(localize).to.be.an.instanceOf(LocalizeManager);
   });
 
-  it('is overridable globally', () => {
-    const oldLocalize = localize;
-    const oldLocalizeTeardown = localize.teardown;
-    localize.teardown = sinon.spy();
-
-    const newLocalize = /** @type {LocalizeManager} */ ({ teardown: () => {} });
-    setLocalize(newLocalize);
-    expect(localize).to.equal(newLocalize);
-
-    // @ts-ignore since we're testing another reference to the same global instance
-    expect(oldLocalize.teardown.callCount).to.equal(1);
-
-    setLocalize(oldLocalize);
-    localize.teardown = oldLocalizeTeardown;
-  });
-
   it('is configured to automatically load namespaces if locale is changed', () => {
     const { autoLoadOnLocaleChange } = getProtectedMembers(localize);
     expect(autoLoadOnLocaleChange).to.equal(true);

packages/ui/components/overlays/src/singleton.js

@@ -1,12 +1,4 @@
 import { singletonManager } from 'singleton-manager';
 import { OverlaysManager } from './OverlaysManager.js';
 
-// eslint-disable-next-line import/no-mutable-exports
+export const overlays = singletonManager.get('@lion/ui::overlays::0.x') || new OverlaysManager();
-export let overlays = singletonManager.get('@lion/ui::overlays::0.x') || new OverlaysManager();
-
-/**
- * @param {OverlaysManager} newOverlays
- */
-export function setOverlays(newOverlays) {
-  overlays = newOverlays;
-}

packages/ui/exports/icon-no-side-effects.js

@@ -0,0 +1 @@
+export { IconManager } from '../components/icon/src/IconManager.js';

packages/ui/exports/icon.js

@@ -1,3 +1,3 @@
 export { LionIcon } from '../components/icon/src/LionIcon.js';
 export { IconManager } from '../components/icon/src/IconManager.js';
-export { icons, setIcons } from '../components/icon/src/icons.js';
+export { icons } from '../components/icon/src/icons.js';

packages/ui/exports/localize-no-side-effects.js

@@ -0,0 +1 @@
+export { LocalizeManager } from '../components/localize/src/LocalizeManager.js';

packages/ui/exports/localize.js

@@ -18,4 +18,4 @@ export { normalizeCurrencyLabel } from '../components/localize/src/number/normal
 export { parseNumber } from '../components/localize/src/number/parseNumber.js';
 export { getLocale } from '../components/localize/src/utils/getLocale.js';
 
-export { localize, setLocalize } from '../components/localize/src/singleton.js';
+export { localize } from '../components/localize/src/singleton.js';

packages/ui/exports/overlays-no-side-effects.js

@@ -0,0 +1 @@
+export { OverlaysManager } from '../components/overlays/src/OverlaysManager.js';

packages/ui/exports/overlays.js

@@ -18,4 +18,4 @@ export {
   unsetSiblingsInert,
 } from '../components/overlays/src/utils/inert-siblings.js';
 
-export { overlays, setOverlays } from '../components/overlays/src/singleton.js';
+export { overlays } from '../components/overlays/src/singleton.js';