saasufy-components 3.6.1 → 3.7.1

package/README.md

@@ -227,6 +227,7 @@ Can also perform basic CRUD operations such as deleting or creating records by l
 - `collection-page-size`: Sets how many items from the collection are displayed at once. This is useful for pagination, allowing users to navigate through large sets of data in chunks.
 - `collection-page-offset`: Indicates the current page offset in the collection's data. It’s like telling the browser which page of data you want to display initially.
 - `collection-get-count`: If this attribute is present, the component will get the record count of the target view. The count can be rendered into the template by prefixing the model name with a dollar sign and accessing the `count` property like this: `{{$MyModelName.count}}`.
+- `auto-reset-page-offset`: If this attribute is present, the `collection-page-offset` will be reset to zero whenever the view params change.
 - `type-alias`: Allows you to provide an alternative name for your `Model` to use when injecting values inside the template. This is useful for situations where you may have multiple `collection-browser` elements and/or `model-viewer` elements of the same type nested inside each other and want to avoid `Model` name clashes in the nested template definitions. For example, if the `type-alias` in the snippet above was set to `SubChat`, then `{{Chat.message}}` would become `{{SubChat.message}}`.
 - `hide-error-logs`: A flag which, when present, suppresses error logs from being printed to the console.
 - `max-show-loader`: If this attribute is present, your slotted `loader` element will be shown as often as possible; this includes situations where the collection is merely refreshing itself. It is disabled by default.

package/collection-browser.js

@@ -104,6 +104,7 @@ class CollectionBrowser extends SocketConsumer {
       'collection-page-size',
       'collection-page-offset',
       'collection-get-count',
+      'auto-reset-page-offset',
       'max-show-loader',
       'type-alias',
       'hide-error-logs'
@@ -112,15 +113,23 @@ class CollectionBrowser extends SocketConsumer {
 
   attributeChangedCallback(name, oldValue, newValue) {
     if (!this.isReady) return;
-    if (this.collection && name === 'collection-page-offset') {
-      let newOffset = Number(newValue);
-      if (newOffset !== this.collection.meta.pageOffset) {
-        this.isStale = true;
-        this.collection.fetchPage(newOffset);
+    if (name === 'collection-page-offset') {
+      if (this.collection) {
+        let newOffset = Number(newValue);
+        if (newOffset !== this.collection.meta.pageOffset) {
+          this.isStale = true;
+          this.collection.fetchPage(newOffset);
+        }
+        this.updatePageNumberElements();
+        this.updatePageButtons();
       }
-      this.updatePageNumberElements();
-      this.updatePageButtons();
     } else {
+      let autoResetPageOffset = this.hasAttribute('auto-reset-page-offset');
+      if (autoResetPageOffset) {
+        if (this.collection) this.collection.destroy();
+        delete this.collection;
+        this.goToPage(0);
+      }
       this.render();
     }
   }

package/model-input.js

@@ -169,7 +169,7 @@ class ModelInput extends SocketConsumer {
     this.inputElement = document.createElement(elementType);
     let optionList = null;
     if (type === 'select') {
-      if (options) {
+      if (options != null) {
         optionList = options.split(',');
         let optionElements = optionList
           .map((option) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "saasufy-components",
-  "version": "3.6.1",
+  "version": "3.7.1",
   "description": "Components for Saasufy.",
   "main": "index.js",
   "scripts": {