README.md

@@ -359,11 +359,9 @@ For more examples, I encourage you to check out the code for my demo app. It is
 
 ## Compatibility
 
-- Ember.js v4.12 or above<sup>1</sup>
+- Ember.js v4.12 or above
 - Node.js v18 or above
 
-<sup>1. `ember-container-query` may work on older versions of Ember (e.g. `4.4`), but issues that arise from these won't be supported.</sup>
-
 
 ## Contributing
 

docs-app/.prettierignore

@@ -8,7 +8,3 @@
 /coverage/
 !.*
 .*/
-
-# ember-template-imports
-/**/*.gjs
-/**/*.gts

docs-app/CHANGELOG.md

@@ -1,5 +1,12 @@
 # docs-app
 
+## 1.0.5
+
+### Patch Changes
+
+- [#257](https://github.com/ijlee2/ember-container-query/pull/257) Updated dependencies ([@ijlee2](https://github.com/ijlee2))
+- [#255](https://github.com/ijlee2/ember-container-query/pull/255) Replaced staticComponents, staticHelpers, and staticModifiers (deprecated) with staticInvokables ([@ijlee2](https://github.com/ijlee2))
+
 ## 1.0.4
 
 ### Patch Changes

docs-app/app/components/navigation-menu.gts

@@ -16,24 +16,23 @@ interface NavigationMenuSignature {
   };
 }
 
-const NavigationMenuComponent: TOC<NavigationMenuSignature> =
-  <template>
-    <nav aria-label={{@name}} data-test-nav={{@name}}>
-      <ul class={{styles.list}}>
-        {{#each @menuItems as |menuItem|}}
-          <li>
-            <LinkTo
-              @route={{menuItem.route}}
-              class={{local styles "link"}}
-              data-test-link={{menuItem.label}}
-            >
-              {{menuItem.label}}
-            </LinkTo>
-          </li>
-        {{/each}}
-      </ul>
-    </nav>
-  </template>
+const NavigationMenuComponent: TOC<NavigationMenuSignature> = <template>
+  <nav aria-label={{@name}} data-test-nav={{@name}}>
+    <ul class={{styles.list}}>
+      {{#each @menuItems as |menuItem|}}
+        <li>
+          <LinkTo
+            @route={{menuItem.route}}
+            class={{local styles "link"}}
+            data-test-link={{menuItem.label}}
+          >
+            {{menuItem.label}}
+          </LinkTo>
+        </li>
+      {{/each}}
+    </ul>
+  </nav>
+</template>;
 
 export default NavigationMenuComponent;
 

docs-app/app/components/products/product/card.gts

@@ -37,10 +37,7 @@ const ProductsProductCardComponent: TOC<ProductsProductCardSignature> =
       </div>
 
       <div class={{styles.body}}>
-        <p
-          class={{styles.description}}
-          data-test-field="Short Description"
-        >
+        <p class={{styles.description}} data-test-field="Short Description">
           {{@product.shortDescription}}
         </p>
 
@@ -60,7 +57,7 @@ const ProductsProductCardComponent: TOC<ProductsProductCardSignature> =
         </LinkTo>
       </div>
     </ContainerQuery>
-  </template>
+  </template>;
 
 export default ProductsProductCardComponent;
 

docs-app/app/components/products/product/image.gts

@@ -18,16 +18,11 @@ const ProductsProductImageComponent: TOC<ProductsProductImageSignature> =
 
     {{else}}
       {{! template-lint-disable no-redundant-role }}
-      <img
-        alt=""
-        class={{styles.image}}
-        role="presentation"
-        src={{@src}}
-      />
+      <img alt="" class={{styles.image}} role="presentation" src={{@src}} />
       {{! template-lint-enable no-redundant-role }}
 
     {{/if}}
-  </template>
+  </template>;
 
 export default ProductsProductImageComponent;
 

docs-app/app/components/tracks.gts

@@ -13,33 +13,28 @@ interface TracksSignature {
   };
 }
 
-const TracksComponent: TOC<TracksSignature> =
-  <template>
-    <ContainerQuery
-      @features={{hash
-        small=(width max=480)
-        medium=(width min=480 max=640)
-        large=(width min=640)
-        tall=(height min=320)
-      }}
-      as |CQ|
-    >
-      {{#if (and CQ.features.large CQ.features.tall)}}
-        <TracksTable @tracks={{@tracks}} />
+const TracksComponent: TOC<TracksSignature> = <template>
+  <ContainerQuery
+    @features={{hash
+      small=(width max=480)
+      medium=(width min=480 max=640)
+      large=(width min=640)
+      tall=(height min=320)
+    }}
+    as |CQ|
+  >
+    {{#if (and CQ.features.large CQ.features.tall)}}
+      <TracksTable @tracks={{@tracks}} />
 
-      {{else}}
-        <TracksList
-          @numColumns={{if
-            CQ.features.small
-            1
-            (if CQ.features.medium 2 3)
-          }}
-          @tracks={{@tracks}}
-        />
+    {{else}}
+      <TracksList
+        @numColumns={{if CQ.features.small 1 (if CQ.features.medium 2 3)}}
+        @tracks={{@tracks}}
+      />
 
-      {{/if}}
-    </ContainerQuery>
-  </template>
+    {{/if}}
+  </ContainerQuery>
+</template>;
 
 export default TracksComponent;
 

docs-app/app/components/tracks/table.gts

@@ -10,38 +10,37 @@ interface TracksTableSignature {
   };
 }
 
-const TracksTableComponent: TOC<TracksTableSignature> =
-  <template>
-    <table data-test-table="Tracks">
-      <thead>
-        <tr>
-          <th class={{styles.track-number}}>#</th>
-          <th>Title</th>
-          <th class={{styles.track-length}}>Length</th>
-          <th class={{styles.track-is-explicit}}>Explicit</th>
-        </tr>
-      </thead>
+const TracksTableComponent: TOC<TracksTableSignature> = <template>
+  <table data-test-table="Tracks">
+    <thead>
+      <tr>
+        <th class={{styles.track-number}}>#</th>
+        <th>Title</th>
+        <th class={{styles.track-length}}>Length</th>
+        <th class={{styles.track-is-explicit}}>Explicit</th>
+      </tr>
+    </thead>
 
-      <tbody>
-        {{#each @tracks as |track index|}}
-          <tr data-test-row>
-            <td>
-              {{add index 1}}
-            </td>
-            <td data-test-column="Title">
-              {{track.name}}
-            </td>
-            <td align="right" data-test-column="Length">
-              {{track.length}}
-            </td>
-            <td align="center" data-test-column="Explicit">
-              {{if track.isExplicit "Yes"}}
-            </td>
-          </tr>
-        {{/each}}
-      </tbody>
-    </table>
-  </template>
+    <tbody>
+      {{#each @tracks as |track index|}}
+        <tr data-test-row>
+          <td>
+            {{add index 1}}
+          </td>
+          <td data-test-column="Title">
+            {{track.name}}
+          </td>
+          <td align="right" data-test-column="Length">
+            {{track.length}}
+          </td>
+          <td align="center" data-test-column="Explicit">
+            {{if track.isExplicit "Yes"}}
+          </td>
+        </tr>
+      {{/each}}
+    </tbody>
+  </table>
+</template>;
 
 export default TracksTableComponent;
 

docs-app/app/components/ui/form/field.gts

@@ -18,12 +18,12 @@ interface UiFormFieldSignature {
     field: [
       {
         inputId: string;
-      }
+      },
     ];
     label: [
       {
         inputId: string;
-      }
+      },
     ];
   };
 }
@@ -51,20 +51,14 @@ export default class UiFormFieldComponent extends Component<UiFormFieldSignature
       </div>
 
       {{#if @errorMessage}}
-        <div
-          class={{local styles "feedback" "is-error"}}
-        >
+        <div class={{local styles "feedback" "is-error"}}>
           {{svgJar
             "alert"
             desc="A warning to indicate that the input field has an error"
             role="img"
           }}
 
-          <span
-            class={{styles.message}}
-            data-test-feedback
-            role="alert"
-          >
+          <span class={{styles.message}} data-test-feedback role="alert">
             {{@errorMessage}}
           </span>
         </div>

docs-app/app/components/ui/form/information.gts

@@ -12,32 +12,31 @@ interface UiFormInformationSignature {
   };
 }
 
-const UiFormInformationComponent: TOC<UiFormInformationSignature> =
-  <template>
-    {{#if (or @title @instructions)}}
-      <div class={{styles.container}}>
-        {{#if @title}}
-          <div
-            class={{styles.title}}
-            data-test-title
-            id={{concat @formId "-title"}}
-          >
-            {{@title}}
-          </div>
-        {{/if}}
+const UiFormInformationComponent: TOC<UiFormInformationSignature> = <template>
+  {{#if (or @title @instructions)}}
+    <div class={{styles.container}}>
+      {{#if @title}}
+        <div
+          class={{styles.title}}
+          data-test-title
+          id={{concat @formId "-title"}}
+        >
+          {{@title}}
+        </div>
+      {{/if}}
 
-        {{#if @instructions}}
-          <p
-            class={{styles.instructions}}
-            data-test-instructions
-            id={{concat @formId "-instructions"}}
-          >
-            {{@instructions}}
-          </p>
-        {{/if}}
-      </div>
-    {{/if}}
-  </template>
+      {{#if @instructions}}
+        <p
+          class={{styles.instructions}}
+          data-test-instructions
+          id={{concat @formId "-instructions"}}
+        >
+          {{@instructions}}
+        </p>
+      {{/if}}
+    </div>
+  {{/if}}
+</template>;
 
 export default UiFormInformationComponent;
 

docs-app/app/components/ui/page.gts

@@ -11,22 +11,17 @@ interface UiPageSignature {
   };
 }
 
-const UiPageComponent: TOC<UiPageSignature> =
-  <template>
-    <div class={{styles.container}}>
-      <h1 class={{styles.title}}>
-        {{@title}}
-      </h1>
+const UiPageComponent: TOC<UiPageSignature> = <template>
+  <div class={{styles.container}}>
+    <h1 class={{styles.title}}>
+      {{@title}}
+    </h1>
 
-      <div
-        class={{styles.content}}
-        id="main-content"
-        tabindex="-1"
-      >
-        {{yield}}
-      </div>
+    <div class={{styles.content}} id="main-content" tabindex="-1">
+      {{yield}}
     </div>
-  </template>
+  </div>
+</template>;
 
 export default UiPageComponent;