Custom elements now use 'is=' extenders

cdp1337 · Oct 27, 2023 · d4259fa · d4259fa
1 parent be3010f
commit d4259fa
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/examples/layouts/author.html b/examples/layouts/author.html
@@ -19,7 +19,7 @@ <h1 class="post-title">
     <a itemprop="url" href="<%= data.mastodon %>"><%= data.title %> on Mastodon</a>
   <% } %>
 
-  <cms-pagelist
+  <div is="cms-pagelist"
     type="posts"
     layout="post-list-embed"
     sort="datetime-r"
@@ -28,5 +28,5 @@ <h1 class="post-title">
     filter-tags="Configuration"
   >
     Loading Content...
-  </cms-pagelist>
+  </div>
 </article>
diff --git a/examples/layouts/post.html b/examples/layouts/post.html
@@ -26,6 +26,6 @@ <h1 class="post-title">
   </div>
 
   <% if(data.author) { %>
-    <cms-author author="<%= data.author %>" layout="author-embed">Author: <%= data.author %></cms-author>
+    <div is="cms-author" author="<%= data.author %>" layout="author-embed">Author: <%= data.author %></div>
   <% } %>
 </article>
diff --git a/src/client/main.js b/src/client/main.js
@@ -41,8 +41,8 @@ import remarkable from './addons/loader-remarkable';
 
 
 // Load custom elements
-customElements.define('cms-author', CMSAuthorElement);
-customElements.define('cms-pagelist', CMSPagelistElement);
+customElements.define('cms-author', CMSAuthorElement, {extends: 'div'});
+customElements.define('cms-pagelist', CMSPagelistElement, {extends: 'div'});
 customElements.define('cms-search', CMSSearchElement, { extends: 'input' });
 customElements.define('cms-button', CMSButtonElement, {extends: 'a'});
 customElements.define('cms-icon', CMSIconElement, {extends: 'i'});