fix: adss unique-id polyfill to enable ember 4.4

Author: betocantu93

packages/changeset-form/package.json

@@ -38,7 +38,8 @@
     "ember-cli-typescript": "4.2.1",
     "ember-composable-helpers": "^4.4.1",
     "ember-named-blocks-polyfill": "^0.2.3",
-    "ember-svg-jar": "^2.3.4"
+    "ember-svg-jar": "^2.3.4",
+    "ember-unique-id-helper-polyfill": "^1.2.2"
   },
   "devDependencies": {
     "@ember/optional-features": "^2.0.0",

packages/core/addon/components/eui-dual-range/index.ts

@@ -1,7 +1,7 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
-import { uniqueId } from '../../helpers/unique-id';
+import { guidFor } from '@ember/object/internals';
 import { isWithinRange } from '../../utils/number';
 
 import { EuiRangeInputArgs } from '../eui-range-input/types';
@@ -87,7 +87,7 @@ export default class EuiDualRangeComponent extends Component<EuiDualRangeArgs> {
   @argOrDefault([]) levels!: EuiRangeLevel[];
 
   //State
-  @tracked id: string = this.args.id || uniqueId();
+  @tracked id: string = this.args.id || guidFor({});
   @tracked hasFocus = false;
   @tracked rangeSliderRefAvailable = false;
   @tracked isPopoverOpen = false;

packages/core/addon/components/eui-icon/index.ts

@@ -6,7 +6,7 @@ import {
   colorToClassMap,
   typeToPathMap
 } from '../../utils/css-mappings/eui-icon';
-import { uniqueId } from '../../helpers/unique-id';
+import { guidFor } from '@ember/object/internals';
 import { htmlSafe } from '@ember/template';
 import { getOwner } from '@ember/application';
 
@@ -178,7 +178,7 @@ export default class EuiIcon extends Component<EuiIconArgs> {
     //  The svg aria-labelledby attribute gets this titleId
     //  The svg title element gets this titleId as an id
     if (!this.args['aria-label'] && !this.args['aria-labelledby'] && title) {
-      titleId = uniqueId();
+      titleId = guidFor({});
     }
     return titleId;
   }

packages/core/addon/components/eui-markdown-editor/index.ts

@@ -11,7 +11,7 @@ import {
   defaultParsingPlugins,
   defaultProcessingPlugins
 } from '../../utils/markdown/plugins/markdown-default-plugins';
-import { uniqueId } from '../../helpers/unique-id';
+import { guidFor } from '@ember/object/internals';
 import unified from 'unified';
 import * as MarkdownTooltipPlugin from '../../utils/markdown/plugins/markdown-tooltip';
 import {
@@ -121,7 +121,7 @@ export default class EuiMarkdownEditorComponent extends Component<EuiMarkdownEdi
   declare processingPluginList: typeof defaultProcessingPlugins;
 
   @tracked selectedNode: Node | null = null;
-  @tracked editorId = this.args.editorId ?? uniqueId();
+  @tracked editorId = this.args.editorId ?? guidFor({});
   @tracked viewMode = this.args.initialViewMode || MODE_EDITING;
   @tracked textareaRef: HTMLTextAreaElement | null = null;
   @tracked previewRef: HTMLDivElement | null = null;

packages/core/addon/components/eui-portal/index.ts

@@ -1,6 +1,6 @@
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
-import { uniqueId } from '../../helpers/unique-id';
+import { guidFor } from '@ember/object/internals';
 import { keysOf } from '../common';
 
 interface InsertPositionsMap {
@@ -32,7 +32,7 @@ export default class EuiPortal extends Component<EuiPortalArgs> {
     const { insert } = this.args;
 
     this.portalNode = document.createElement('div');
-    this.portalNode.id = `${uniqueId()}-portal`;
+    this.portalNode.id = `${guidFor({})}-portal`;
 
     if (insert == null) {
       // no insertion defined, append to body

packages/core/addon/components/eui-range/index.ts

@@ -1,7 +1,7 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
-import { uniqueId } from '../../helpers/unique-id';
+import { guidFor } from '@ember/object/internals';
 import { isWithinRange } from '../../utils/number';
 import { EuiRangeInputArgs } from '../eui-range-input/types';
 import { EuiRangeLevel } from '../eui-range-levels';
@@ -81,7 +81,7 @@ export default class EuiRangeComponent extends Component<EuiRangeArgs> {
   preventPopoverClose = false;
 
   //State
-  @tracked id: string = this.args.id || uniqueId();
+  @tracked id: string = this.args.id || guidFor({});
   @tracked isPopoverOpen = false;
   ///
 

packages/core/addon/components/eui-tool-tip/index.ts

@@ -1,11 +1,11 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
 import { argOrDefaultDecorator as argOrDefault } from '../../helpers/arg-or-default';
-import { uniqueId } from '../../helpers/unique-id';
 import { tracked, cached } from '@glimmer/tracking';
 import { findPopoverPosition } from '../../utils/popover';
 import { keys } from '../../utils/keys';
 import { later, cancel, scheduleOnce, next } from '@ember/runloop';
+import { guidFor } from '@ember/object/internals';
 
 export type ToolTipPositions = 'top' | 'right' | 'bottom' | 'left';
 
@@ -104,7 +104,7 @@ export default class EuiToolTip extends Component<EuiTooltipArgs> {
   @tracked calculatedPosition: ToolTipPositions = this.position;
   @tracked toolTipStyles: ToolTipStyles = DEFAULT_TOOLTIP_STYLES;
   @tracked arrowStyles: undefined | { left: string; top: string };
-  @tracked id: string = this.args.id || uniqueId();
+  @tracked id: string = this.args.id || guidFor({});
   @tracked _attachTo: undefined | HTMLElement | string | null = null;
 
   private timeoutId?: ReturnType<typeof later>;

packages/core/addon/helpers/unique-id.ts

@@ -1,5 +1,5 @@
 import Modifier from 'ember-modifier';
-import { uniqueId } from '../helpers/unique-id';
+import { guidFor } from '@ember/object/internals';
 import { action } from '@ember/object';
 
 interface OutsideClickDetectorModifierArgs {
@@ -46,7 +46,7 @@ export default class OutsideClickDetector extends Modifier<OutsideClickDetectorM
   }
 
   didInstall(): void {
-    this.id = uniqueId();
+    this.id = guidFor({});
     document.addEventListener('mouseup', this.onClickOutside);
     document.addEventListener('touchend', this.onClickOutside);
     this.addElementEvents();