ember-container-query 3.0.0 → 3.1.0

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+## 3.1.0 (2022-12-20)
+
+### Enhancement
+* [#140](https://github.com/ijlee2/ember-container-query/pull/140) Add Glint signatures ([@ijlee2](https://github.com/ijlee2))
+
+### Internal
+* [#145](https://github.com/ijlee2/ember-container-query/pull/145) Updated development dependencies to their latest version ([@ijlee2](https://github.com/ijlee2))
+* [#141](https://github.com/ijlee2/ember-container-query/pull/141) Glint demo app ([@ijlee2](https://github.com/ijlee2))
+* [#140](https://github.com/ijlee2/ember-container-query/pull/140) Add Glint signatures ([@ijlee2](https://github.com/ijlee2))
+
+### Documentation
+* [#141](https://github.com/ijlee2/ember-container-query/pull/141) Glint demo app ([@ijlee2](https://github.com/ijlee2))
+* [#140](https://github.com/ijlee2/ember-container-query/pull/140) Add Glint signatures ([@ijlee2](https://github.com/ijlee2))
+
+### Committers: 1
+- Isaac Lee ([@ijlee2](https://github.com/ijlee2))
+- Thanks to [@NullVoxPopuli](https://github.com/NullVoxPopuli), [@denisclark](https://github.com/denisclark), [@gossi](https://github.com/gossi), and [@buschtoens](https://github.com/buschtoens) for their help with [#140](https://github.com/ijlee2/ember-container-query/pull/140)
+
+
 ## 3.0.0 (2022-12-15)
 
 ### Breaking Change

package/README.md

@@ -18,6 +18,32 @@ Installation
 ember install ember-container-query
 ```
 
+<details>
+<summary>Use Glint? ✨</summary>
+
+- If you are using [strict mode](http://emberjs.github.io/rfcs/0496-handlebars-strict-mode.html) (via [first-class component templates](http://emberjs.github.io/rfcs/0779-first-class-component-templates.html)), then you are good to go!
+
+- Otherwise, update your template registry to extend this addon's. Check the [Glint documentation](https://typed-ember.gitbook.io/glint/using-glint/ember/using-addons#using-glint-enabled-addons) for more information.
+
+    ```ts
+    /* types/global.d.ts */
+
+    import '@glint/environment-ember-loose';
+
+    import type EmberContainerQueryRegistry from 'ember-container-query/template-registry';
+
+    declare module '@glint/environment-ember-loose/registry' {
+      export default interface Registry extends EmberContainerQueryRegistry, /* other addon registries */ {
+        // local entries
+      }
+    }
+    ```
+
+
+⚠️ Glint is in active development and may introduce breaking changes. This addon will try to provide a stable API. Should it need to make a breaking change due to Glint, semantic versioning may not be rigorously followed (e.g. there is no new major version).
+
+</details>
+
 
 Applications
 ------------------------------------------------------------------------------

package/addon/components/container-query.hbs

@@ -1,3 +1,4 @@
+{{! @glint-ignore: ember-element-helper needs to provide Glint signature }}
 {{#let (element this.tagName) as |Tag|}}
   <Tag
     class="container-query"

package/addon/components/container-query.ts

@@ -4,19 +4,33 @@ import { tracked } from '@glimmer/tracking';
 import type {
   Dimensions,
   Features,
+  IndexSignatureParameter,
   QueryResults,
 } from 'ember-container-query/modifiers/container-query';
 
-interface ContainerQueryComponentArgs {
-  dataAttributePrefix?: string;
-  debounce?: number;
-  features?: Features;
-  tagName?: string;
+interface ContainerQueryComponentSignature<T extends IndexSignatureParameter> {
+  Args: {
+    dataAttributePrefix?: string;
+    debounce?: number;
+    features?: Features<T>;
+    tagName?: string;
+  };
+  Blocks: {
+    default: [
+      {
+        dimensions?: Dimensions;
+        features?: QueryResults<T>;
+      }
+    ];
+  };
+  Element: HTMLElement;
 }
 
-export default class ContainerQueryComponent extends Component<ContainerQueryComponentArgs> {
+export default class ContainerQueryComponent<
+  T extends IndexSignatureParameter
+> extends Component<ContainerQueryComponentSignature<T>> {
   @tracked dimensions?: Dimensions;
-  @tracked queryResults?: QueryResults;
+  @tracked queryResults?: QueryResults<T>;
 
   // The dynamic tag is restricted to be immutable
   tagName = this.args.tagName ?? 'div';
@@ -26,7 +40,7 @@ export default class ContainerQueryComponent extends Component<ContainerQueryCom
     queryResults,
   }: {
     dimensions: Dimensions;
-    queryResults: QueryResults;
+    queryResults: QueryResults<T>;
   }): void {
     this.dimensions = dimensions;
     this.queryResults = queryResults;

package/addon/helpers/cq-aspect-ratio.ts

@@ -1,15 +1,25 @@
 import { helper } from '@ember/component/helper';
 import type { Metadata } from 'ember-container-query/modifiers/container-query';
 
-function cqAspectRatio(
-  positional: unknown[],
-  named: Record<string, unknown>
-): Metadata {
-  const dimension = 'aspectRatio';
-  const max = (named['max'] as number | undefined) ?? Infinity;
-  const min = (named['min'] as number | undefined) ?? 0;
-
-  return { dimension, max, min };
+interface CqAspectRatioHelperSignature {
+  Args: {
+    Named: {
+      max?: number;
+      min?: number;
+    };
+    Positional: [];
+  };
+  Return: Metadata;
 }
 
-export default helper(cqAspectRatio);
+const CqAspectRatioHelper = helper<CqAspectRatioHelperSignature>(
+  (_positional, named) => {
+    const dimension = 'aspectRatio';
+    const max = named.max ?? Infinity;
+    const min = named.min ?? 0;
+
+    return { dimension, max, min };
+  }
+);
+
+export default CqAspectRatioHelper;

package/addon/helpers/cq-height.ts

@@ -1,15 +1,23 @@
 import { helper } from '@ember/component/helper';
 import type { Metadata } from 'ember-container-query/modifiers/container-query';
 
-function cqHeight(
-  positional: unknown[],
-  named: Record<string, unknown>
-): Metadata {
+interface CqHeightHelperSignature {
+  Args: {
+    Named: {
+      max?: number;
+      min?: number;
+    };
+    Positional: [];
+  };
+  Return: Metadata;
+}
+
+const CqHeightHelper = helper<CqHeightHelperSignature>((_positional, named) => {
   const dimension = 'height';
-  const max = (named['max'] as number | undefined) ?? Infinity;
-  const min = (named['min'] as number | undefined) ?? 0;
+  const max = named.max ?? Infinity;
+  const min = named.min ?? 0;
 
   return { dimension, max, min };
-}
+});
 
-export default helper(cqHeight);
+export default CqHeightHelper;

package/addon/helpers/cq-width.ts

@@ -1,15 +1,23 @@
 import { helper } from '@ember/component/helper';
 import type { Metadata } from 'ember-container-query/modifiers/container-query';
 
-function cqWidth(
-  positional: unknown[],
-  named: Record<string, unknown>
-): Metadata {
+interface CqWidthHelperSignature {
+  Args: {
+    Named: {
+      max?: number;
+      min?: number;
+    };
+    Positional: [];
+  };
+  Return: Metadata;
+}
+
+const CqWidthHelper = helper<CqWidthHelperSignature>((_positional, named) => {
   const dimension = 'width';
-  const max = (named['max'] as number | undefined) ?? Infinity;
-  const min = (named['min'] as number | undefined) ?? 0;
+  const max = named.max ?? Infinity;
+  const min = named.min ?? 0;
 
   return { dimension, max, min };
-}
+});
 
-export default helper(cqWidth);
+export default CqWidthHelper;

package/addon/modifiers/container-query.ts

@@ -4,38 +4,36 @@ import { debounce as _debounce } from '@ember/runloop';
 import { inject as service } from '@ember/service';
 import Modifier, { ArgsFor, NamedArgs, PositionalArgs } from 'ember-modifier';
 
-export type Metadata = {
-  dimension: 'aspectRatio' | 'height' | 'width';
-  max: number;
-  min: number;
-};
+type IndexSignatureParameter = string | number | symbol;
 
-export type Features = {
-  [featureName: string]: Metadata;
-};
-
-export type Dimensions = {
+type Dimensions = {
   aspectRatio: number;
   height: number;
   width: number;
 };
 
-export type QueryResults = {
-  [featureName: string]: boolean;
+type Metadata = {
+  dimension: 'aspectRatio' | 'height' | 'width';
+  max: number;
+  min: number;
 };
 
-interface ContainerQueryModifierSignature {
+type Features<T extends IndexSignatureParameter> = Record<T, Metadata>;
+
+type QueryResults<T extends IndexSignatureParameter> = Record<T, boolean>;
+
+interface ContainerQueryModifierSignature<T extends IndexSignatureParameter> {
   Args: {
     Named: {
       dataAttributePrefix?: string;
       debounce?: number;
-      features?: Features;
+      features?: Features<T>;
       onQuery?: ({
         dimensions,
         queryResults,
       }: {
         dimensions: Dimensions;
-        queryResults: QueryResults;
+        queryResults: QueryResults<T>;
       }) => void;
     };
     Positional: [];
@@ -43,15 +41,17 @@ interface ContainerQueryModifierSignature {
   Element: Element;
 }
 
-export default class ContainerQueryModifier extends Modifier<ContainerQueryModifierSignature> {
+export default class ContainerQueryModifier<
+  T extends IndexSignatureParameter
+> extends Modifier<ContainerQueryModifierSignature<T>> {
   @service private declare readonly resizeObserver;
 
   dimensions!: Dimensions;
-  queryResults!: QueryResults;
+  queryResults!: QueryResults<T>;
 
   private _dataAttributes: string[] = [];
   private _element?: Element;
-  private _named!: NamedArgs<ContainerQueryModifierSignature>;
+  private _named!: NamedArgs<ContainerQueryModifierSignature<T>>;
 
   get dataAttributePrefix(): string {
     return this._named.dataAttributePrefix ?? 'container-query';
@@ -61,11 +61,14 @@ export default class ContainerQueryModifier extends Modifier<ContainerQueryModif
     return this._named.debounce ?? 0;
   }
 
-  get features(): Features {
-    return this._named.features ?? {};
+  get features(): Features<T> {
+    return this._named.features ?? ({} as Features<T>);
   }
 
-  constructor(owner: unknown, args: ArgsFor<ContainerQueryModifierSignature>) {
+  constructor(
+    owner: unknown,
+    args: ArgsFor<ContainerQueryModifierSignature<T>>
+  ) {
     super(owner, args);
 
     registerDestructor(this, () => {
@@ -75,8 +78,8 @@ export default class ContainerQueryModifier extends Modifier<ContainerQueryModif
 
   modify(
     element: Element,
-    _positional: PositionalArgs<ContainerQueryModifierSignature>,
-    named: NamedArgs<ContainerQueryModifierSignature>
+    _positional: PositionalArgs<ContainerQueryModifierSignature<T>>,
+    named: NamedArgs<ContainerQueryModifierSignature<T>>
   ): void {
     this._named = named;
 
@@ -126,13 +129,13 @@ export default class ContainerQueryModifier extends Modifier<ContainerQueryModif
   }
 
   private evaluateQueries(): void {
-    const queryResults = {} as QueryResults;
+    const queryResults = {} as QueryResults<T>;
 
     for (const [featureName, metadata] of Object.entries(this.features)) {
-      const { dimension, min, max } = metadata;
+      const { dimension, min, max } = metadata as Metadata;
       const value = this.dimensions[dimension];
 
-      queryResults[featureName] = min <= value && value < max;
+      queryResults[featureName as T] = min <= value && value < max;
     }
 
     this.queryResults = queryResults;
@@ -166,3 +169,11 @@ export default class ContainerQueryModifier extends Modifier<ContainerQueryModif
     }
   }
 }
+
+export {
+  Dimensions,
+  Features,
+  IndexSignatureParameter,
+  Metadata,
+  QueryResults,
+};

package/addon/template-registry.ts

@@ -0,0 +1,13 @@
+import type ContainerQueryComponent from 'ember-container-query/components/container-query';
+import type CqAspectRatioHelper from 'ember-container-query/helpers/cq-aspect-ratio';
+import type CqHeightHelper from 'ember-container-query/helpers/cq-height';
+import type CqWidthHelper from 'ember-container-query/helpers/cq-width';
+import type ContainerQueryModifier from 'ember-container-query/modifiers/container-query';
+
+export default interface EmberContainerQueryRegistry {
+  ContainerQuery: typeof ContainerQueryComponent;
+  'container-query': typeof ContainerQueryModifier;
+  'cq-aspect-ratio': typeof CqAspectRatioHelper;
+  'cq-height': typeof CqHeightHelper;
+  'cq-width': typeof CqWidthHelper;
+}

package/components/container-query.d.ts

@@ -1,18 +1,29 @@
 import Component from '@glimmer/component';
-import type { Dimensions, Features, QueryResults } from 'ember-container-query/modifiers/container-query';
-interface ContainerQueryComponentArgs {
-    dataAttributePrefix?: string;
-    debounce?: number;
-    features?: Features;
-    tagName?: string;
+import type { Dimensions, Features, IndexSignatureParameter, QueryResults } from 'ember-container-query/modifiers/container-query';
+interface ContainerQueryComponentSignature<T extends IndexSignatureParameter> {
+    Args: {
+        dataAttributePrefix?: string;
+        debounce?: number;
+        features?: Features<T>;
+        tagName?: string;
+    };
+    Blocks: {
+        default: [
+            {
+                dimensions?: Dimensions;
+                features?: QueryResults<T>;
+            }
+        ];
+    };
+    Element: HTMLElement;
 }
-export default class ContainerQueryComponent extends Component<ContainerQueryComponentArgs> {
+export default class ContainerQueryComponent<T extends IndexSignatureParameter> extends Component<ContainerQueryComponentSignature<T>> {
     dimensions?: Dimensions;
-    queryResults?: QueryResults;
+    queryResults?: QueryResults<T>;
     tagName: string;
     updateState({ dimensions, queryResults, }: {
         dimensions: Dimensions;
-        queryResults: QueryResults;
+        queryResults: QueryResults<T>;
     }): void;
 }
 export {};

package/helpers/cq-aspect-ratio.d.ts

@@ -1,10 +1,13 @@
 import type { Metadata } from 'ember-container-query/modifiers/container-query';
-declare const _default: import("@ember/component/helper").FunctionBasedHelper<{
+declare const CqAspectRatioHelper: import("@ember/component/helper").FunctionBasedHelper<{
     Args: {
-        Positional: unknown[];
-        Named: Record<string, unknown>;
+        Positional: [];
+        Named: {
+            max?: number | undefined;
+            min?: number | undefined;
+        };
     };
     Return: Metadata;
 }>;
-export default _default;
+export default CqAspectRatioHelper;
 //# sourceMappingURL=cq-aspect-ratio.d.ts.map

package/helpers/cq-height.d.ts

@@ -1,10 +1,13 @@
 import type { Metadata } from 'ember-container-query/modifiers/container-query';
-declare const _default: import("@ember/component/helper").FunctionBasedHelper<{
+declare const CqHeightHelper: import("@ember/component/helper").FunctionBasedHelper<{
     Args: {
-        Positional: unknown[];
-        Named: Record<string, unknown>;
+        Positional: [];
+        Named: {
+            max?: number | undefined;
+            min?: number | undefined;
+        };
     };
     Return: Metadata;
 }>;
-export default _default;
+export default CqHeightHelper;
 //# sourceMappingURL=cq-height.d.ts.map

package/helpers/cq-width.d.ts

@@ -1,10 +1,13 @@
 import type { Metadata } from 'ember-container-query/modifiers/container-query';
-declare const _default: import("@ember/component/helper").FunctionBasedHelper<{
+declare const CqWidthHelper: import("@ember/component/helper").FunctionBasedHelper<{
     Args: {
-        Positional: unknown[];
-        Named: Record<string, unknown>;
+        Positional: [];
+        Named: {
+            max?: number | undefined;
+            min?: number | undefined;
+        };
     };
     Return: Metadata;
 }>;
-export default _default;
+export default CqWidthHelper;
 //# sourceMappingURL=cq-width.d.ts.map

package/modifiers/container-query.d.ts

@@ -1,47 +1,44 @@
 import Modifier, { ArgsFor, NamedArgs, PositionalArgs } from 'ember-modifier';
-export type Metadata = {
-    dimension: 'aspectRatio' | 'height' | 'width';
-    max: number;
-    min: number;
-};
-export type Features = {
-    [featureName: string]: Metadata;
-};
-export type Dimensions = {
+type IndexSignatureParameter = string | number | symbol;
+type Dimensions = {
     aspectRatio: number;
     height: number;
     width: number;
 };
-export type QueryResults = {
-    [featureName: string]: boolean;
+type Metadata = {
+    dimension: 'aspectRatio' | 'height' | 'width';
+    max: number;
+    min: number;
 };
-interface ContainerQueryModifierSignature {
+type Features<T extends IndexSignatureParameter> = Record<T, Metadata>;
+type QueryResults<T extends IndexSignatureParameter> = Record<T, boolean>;
+interface ContainerQueryModifierSignature<T extends IndexSignatureParameter> {
     Args: {
         Named: {
             dataAttributePrefix?: string;
             debounce?: number;
-            features?: Features;
+            features?: Features<T>;
             onQuery?: ({ dimensions, queryResults, }: {
                 dimensions: Dimensions;
-                queryResults: QueryResults;
+                queryResults: QueryResults<T>;
             }) => void;
         };
         Positional: [];
     };
     Element: Element;
 }
-export default class ContainerQueryModifier extends Modifier<ContainerQueryModifierSignature> {
+export default class ContainerQueryModifier<T extends IndexSignatureParameter> extends Modifier<ContainerQueryModifierSignature<T>> {
     private readonly resizeObserver;
     dimensions: Dimensions;
-    queryResults: QueryResults;
+    queryResults: QueryResults<T>;
     private _dataAttributes;
     private _element?;
     private _named;
     get dataAttributePrefix(): string;
     get debounce(): number;
-    get features(): Features;
-    constructor(owner: unknown, args: ArgsFor<ContainerQueryModifierSignature>);
-    modify(element: Element, _positional: PositionalArgs<ContainerQueryModifierSignature>, named: NamedArgs<ContainerQueryModifierSignature>): void;
+    get features(): Features<T>;
+    constructor(owner: unknown, args: ArgsFor<ContainerQueryModifierSignature<T>>);
+    modify(element: Element, _positional: PositionalArgs<ContainerQueryModifierSignature<T>>, named: NamedArgs<ContainerQueryModifierSignature<T>>): void;
     private onResize;
     private registerResizeObserver;
     private queryContainer;
@@ -50,5 +47,5 @@ export default class ContainerQueryModifier extends Modifier<ContainerQueryModif
     private resetDataAttributes;
     private setDataAttributes;
 }
-export {};
+export { Dimensions, Features, IndexSignatureParameter, Metadata, QueryResults, };
 //# sourceMappingURL=container-query.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ember-container-query",
-  "version": "3.0.0",
+  "version": "3.1.0",
   "description": "Container queries using Ember modifiers",
   "keywords": [
     "container-queries",
@@ -35,7 +35,7 @@
     "lint:hbs:fix": "ember-template-lint . --fix",
     "lint:js": "eslint . --cache --ext=.js,.ts",
     "lint:js:fix": "eslint . --fix",
-    "lint:types": "tsc --noEmit",
+    "lint:types": "glint",
     "prepack": "ember ts:precompile",
     "postpack": "ember ts:clean",
     "start": "ember serve",
@@ -64,15 +64,17 @@
   },
   "devDependencies": {
     "@ember/optional-features": "^2.0.0",
-    "@ember/test-helpers": "^2.9.0",
+    "@ember/test-helpers": "^2.9.1",
     "@embroider/test-setup": "^2.0.2",
+    "@gavant/glint-template-types": "^0.3.0",
     "@glimmer/component": "^1.1.2",
     "@glimmer/tracking": "^1.1.2",
+    "@glint/core": "^v1.0.0-beta.2",
+    "@glint/environment-ember-loose": "^v1.0.0-beta.2",
+    "@glint/template": "^v1.0.0-beta.2",
     "@percy/cli": "^1.16.0",
     "@percy/ember": "^4.0.0",
     "@tsconfig/ember": "^1.1.0",
-    "@types/ember-qunit": "^5.0.2",
-    "@types/ember-resolver": "^5.0.13",
     "@types/ember__application": "^4.0.5",
     "@types/ember__array": "^4.0.3",
     "@types/ember__component": "^4.0.11",
@@ -85,17 +87,16 @@
     "@types/ember__polyfills": "^4.0.1",
     "@types/ember__routing": "^4.0.12",
     "@types/ember__runloop": "^4.0.2",
-    "@types/ember__service": "^4.0.1",
+    "@types/ember__service": "^4.0.2",
     "@types/ember__string": "^3.0.10",
     "@types/ember__template": "^4.0.1",
     "@types/ember__test": "^4.0.1",
-    "@types/ember__test-helpers": "^2.8.2",
     "@types/ember__utils": "^4.0.2",
     "@types/htmlbars-inline-precompile": "^3.0.0",
     "@types/qunit": "^2.19.3",
     "@types/rsvp": "^4.0.4",
-    "@typescript-eslint/eslint-plugin": "^5.46.1",
-    "@typescript-eslint/parser": "^5.46.1",
+    "@typescript-eslint/eslint-plugin": "^5.47.0",
+    "@typescript-eslint/parser": "^5.47.0",
     "broccoli-asset-rev": "^3.0.0",
     "concurrently": "^7.6.0",
     "d3-array": "^3.2.1",
@@ -117,8 +118,8 @@
     "ember-load-initializers": "^2.1.2",
     "ember-named-blocks-polyfill": "^0.2.5",
     "ember-page-title": "^7.0.0",
-    "ember-qunit": "^6.0.0",
-    "ember-resolver": "^8.0.3",
+    "ember-qunit": "^6.1.1",
+    "ember-resolver": "^9.0.0",
     "ember-source": "~4.9.3",
     "ember-source-channel-url": "^3.0.0",
     "ember-svg-jar": "^2.4.2",
@@ -126,13 +127,14 @@
     "ember-template-lint-plugin-prettier": "^4.1.0",
     "ember-truth-helpers": "^3.1.1",
     "ember-try": "^2.0.0",
-    "eslint": "^8.29.0",
+    "eslint": "^8.30.0",
     "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-ember": "^11.2.1",
+    "eslint-plugin-ember": "^11.3.0",
     "eslint-plugin-n": "^15.6.0",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-qunit": "^7.3.4",
     "eslint-plugin-simple-import-sort": "^8.0.0",
+    "eslint-plugin-typescript-sort-keys": "^2.1.0",
     "lerna-changelog": "^2.2.0",
     "loader.js": "^4.7.0",
     "prettier": "^2.8.1",

package/template-registry.d.ts

@@ -0,0 +1,13 @@
+import type ContainerQueryComponent from 'ember-container-query/components/container-query';
+import type CqAspectRatioHelper from 'ember-container-query/helpers/cq-aspect-ratio';
+import type CqHeightHelper from 'ember-container-query/helpers/cq-height';
+import type CqWidthHelper from 'ember-container-query/helpers/cq-width';
+import type ContainerQueryModifier from 'ember-container-query/modifiers/container-query';
+export default interface EmberContainerQueryRegistry {
+    ContainerQuery: typeof ContainerQueryComponent;
+    'container-query': typeof ContainerQueryModifier;
+    'cq-aspect-ratio': typeof CqAspectRatioHelper;
+    'cq-height': typeof CqHeightHelper;
+    'cq-width': typeof CqWidthHelper;
+}
+//# sourceMappingURL=template-registry.d.ts.map

package/tsconfig.json

@@ -40,5 +40,8 @@
     "types/**/*",
     "test-support/**/*",
     "addon-test-support/**/*"
-  ]
+  ],
+  "glint": {
+    "environment": "ember-loose"
+  }
 }

package/types/dummy/index.d.ts

@@ -0,0 +1,33 @@
+// Add any types here that you need for local development only.
+// These will *not* be published as part of your addon, so be careful that your published code does not rely on them!
+
+import '@glint/environment-ember-loose';
+
+import SvgJarHelper from '@gavant/glint-template-types/types/ember-svg-jar/helpers/svg-jar';
+import AndHelper from '@gavant/glint-template-types/types/ember-truth-helpers/helpers/and';
+import OrHelper from '@gavant/glint-template-types/types/ember-truth-helpers/helpers/or';
+import { ComponentLike, HelperLike } from '@glint/template';
+import type EmberContainerQueryRegistry from 'ember-container-query/template-registry';
+
+type NavigationNarratorComponent = ComponentLike<{
+  Args: {
+    skipTo: string;
+  };
+}>;
+
+type PageTitleHelper = HelperLike<{
+  Args: { Positional: [title: string] };
+  Return: void;
+}>;
+
+declare module '@glint/environment-ember-loose/registry' {
+  export default interface Registry extends EmberContainerQueryRegistry {
+    // Add any registry entries from other addons here that your addon itself uses (in non-strict mode templates)
+    // See https://typed-ember.gitbook.io/glint/using-glint/ember/using-addons
+    NavigationNarrator: NavigationNarratorComponent;
+    and: typeof AndHelper;
+    or: typeof OrHelper;
+    'page-title': PageTitleHelper;
+    'svg-jar': typeof SvgJarHelper;
+  }
+}