web-mojo 2.2.2 → 2.2.4

package/dist/timeline.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./chunks/ListView-D2vt0koT.js"),e=require("./chunks/Rest-DYPLEzNy.js"),i=require("./chunks/Collection-CqLcHgQG.js");class TimelineViewItem extends t.ListViewItem{constructor(t={}){super({className:"timeline-item",...t}),this.dateFormat=t.dateFormat||"date",this.dotStyle=t.dotStyle||"solid",this.showDate=!1!==t.showDate,this.theme=t.theme||"primary",this.template||(this.template='\n                <div class="timeline-marker timeline-marker-{{markerType}}">\n                    {{#hasIcon}}\n                    <i class="bi {{model.icon}} text-{{displayColor}}"></i>\n                    {{/hasIcon}}\n                    {{^hasIcon}}\n                    <div class="timeline-dot bg-{{displayColor}}"></div>\n                    {{/hasIcon}}\n                </div>\n                \n                <div class="timeline-content">\n                    {{#showDate}}\n                    <div class="timeline-date text-muted small">\n                        {{formattedDate}}\n                    </div>\n                    {{/showDate}}\n                    \n                    <div class="timeline-card">\n                        {{#model.title}}\n                        <h6 class="timeline-title mb-1">{{model.title}}</h6>\n                        {{/model.title}}\n                        \n                        {{#model.description}}\n                        <p class="timeline-description mb-0">{{model.description}}</p>\n                        {{/model.description}}\n                        \n                        {{#model.meta}}\n                        <div class="timeline-meta mt-2 text-muted small">\n                            {{model.meta}}\n                        </div>\n                        {{/model.meta}}\n                    </div>\n                </div>\n            ')}async onInit(){await super.onInit(),this.processItemData()}processItemData(){this.displayColor=this.model?.get?.("color")||this.model?.color||this.theme;const t=!(!this.model?.get?.("icon")&&!this.model?.icon)&&"icon"===this.dotStyle;this.hasIcon=t,this.markerType=t?"icon":this.dotStyle;const e=this.model?.get?.("date")||this.model?.date;this.formattedDate=this.formatDate(e)}formatDate(t){if(!t)return"";switch(this.dateFormat){case"datetime":return e.dataFormatter.pipe(t,"datetime");case"relative":return e.dataFormatter.pipe(t,"timeago");default:return e.dataFormatter.pipe(t,"date")}}async onActionSelect(t,e){t.stopPropagation(),this.emit("item:click",{item:this,model:this.model,index:this.index,data:this.model?.toJSON?this.model.toJSON():this.model}),this.listView&&this.listView.emit("item:click",{item:this,model:this.model,index:this.index,data:this.model?.toJSON?this.model.toJSON():this.model})}}class TimelineView extends t.ListView{constructor(t={}){super({className:"timeline-view",itemClass:t.itemClass||TimelineViewItem,selectionMode:"none",emptyMessage:t.emptyMessage||"No timeline events to display",template:'\n                <div class="timeline-container timeline-{{position}}">\n                    {{#loading}}\n                        <div class="timeline-loading text-center py-4">\n                            <div class="spinner-border spinner-border-sm" role="status">\n                                <span class="visually-hidden">Loading...</span>\n                            </div>\n                            <span class="ms-2 text-muted">Loading timeline...</span>\n                        </div>\n                    {{/loading}}\n                    {{^loading}}\n                        {{#isEmpty}}\n                            <div class="timeline-empty text-center text-muted py-4">\n                                <i class="bi bi-clock-history fs-1 d-block mb-2"></i>\n                                <p>{{emptyMessage}}</p>\n                            </div>\n                        {{/isEmpty}}\n                        {{^isEmpty}}\n                            <div class="timeline" data-container="items"></div>\n                        {{/isEmpty}}\n                    {{/loading}}\n                </div>\n            ',...t}),this.position=t.position||"left",this.dateFormat=t.dateFormat||"date",this.dotStyle=t.dotStyle||"solid",this.showDate=!1!==t.showDate,this.theme=t.theme||"primary",this.groupBy=t.groupBy||"none"}_createItemView(t,e){if(this.itemViews.has(t.id))return;const i=new this.itemClass({model:t,index:e,listView:this,template:this.itemTemplate,dateFormat:this.dateFormat,dotStyle:this.dotStyle,showDate:this.showDate,theme:this.theme});return this.itemViews.set(t.id,i),i.on("item:click",this._onItemClick.bind(this)),i}_onItemClick(t){this.emit("item:click",t)}setPosition(t){return"left"!==t&&"center"!==t?(console.warn('Invalid position. Use "left" or "center"'),this):(this.position=t,this.isMounted()&&this.render(),this)}setDateFormat(t){return this.dateFormat=t,this.forEachItem(e=>{e.dateFormat=t,e.processItemData(),e.isMounted()&&e.render()}),this}setDotStyle(t){return this.dotStyle=t,this.forEachItem(e=>{e.dotStyle=t,e.processItemData(),e.isMounted()&&e.render()}),this}toggleDates(t=null){return this.showDate=null!==t?t:!this.showDate,this.forEachItem(t=>{t.showDate=this.showDate,t.isMounted()&&t.render()}),this}}exports.ListView=t.ListView,exports.ListViewItem=t.ListViewItem,exports.View=e.View,exports.Collection=i.Collection,exports.Model=i.Model,exports.TimelineView=TimelineView,exports.TimelineViewItem=TimelineViewItem;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./chunks/ListView-Xcsfu4IL.js"),e=require("./chunks/Rest-29RtA7pe.js"),i=require("./chunks/Collection-CREl6Fa9.js");class TimelineViewItem extends t.ListViewItem{constructor(t={}){super({className:"timeline-item",...t}),this.dateFormat=t.dateFormat||"date",this.dotStyle=t.dotStyle||"solid",this.showDate=!1!==t.showDate,this.theme=t.theme||"primary",this.template||(this.template='\n                <div class="timeline-marker timeline-marker-{{markerType}}">\n                    {{#hasIcon}}\n                    <i class="bi {{model.icon}} text-{{displayColor}}"></i>\n                    {{/hasIcon}}\n                    {{^hasIcon}}\n                    <div class="timeline-dot bg-{{displayColor}}"></div>\n                    {{/hasIcon}}\n                </div>\n                \n                <div class="timeline-content">\n                    {{#showDate}}\n                    <div class="timeline-date text-muted small">\n                        {{formattedDate}}\n                    </div>\n                    {{/showDate}}\n                    \n                    <div class="timeline-card">\n                        {{#model.title}}\n                        <h6 class="timeline-title mb-1">{{model.title}}</h6>\n                        {{/model.title}}\n                        \n                        {{#model.description}}\n                        <p class="timeline-description mb-0">{{model.description}}</p>\n                        {{/model.description}}\n                        \n                        {{#model.meta}}\n                        <div class="timeline-meta mt-2 text-muted small">\n                            {{model.meta}}\n                        </div>\n                        {{/model.meta}}\n                    </div>\n                </div>\n            ')}async onInit(){await super.onInit(),this.processItemData()}processItemData(){this.displayColor=this.model?.get?.("color")||this.model?.color||this.theme;const t=!(!this.model?.get?.("icon")&&!this.model?.icon)&&"icon"===this.dotStyle;this.hasIcon=t,this.markerType=t?"icon":this.dotStyle;const e=this.model?.get?.("date")||this.model?.date;this.formattedDate=this.formatDate(e)}formatDate(t){if(!t)return"";switch(this.dateFormat){case"datetime":return e.dataFormatter.pipe(t,"datetime");case"relative":return e.dataFormatter.pipe(t,"timeago");default:return e.dataFormatter.pipe(t,"date")}}async onActionSelect(t,e){t.stopPropagation(),this.emit("item:click",{item:this,model:this.model,index:this.index,data:this.model?.toJSON?this.model.toJSON():this.model}),this.listView&&this.listView.emit("item:click",{item:this,model:this.model,index:this.index,data:this.model?.toJSON?this.model.toJSON():this.model})}}class TimelineView extends t.ListView{constructor(t={}){super({className:"timeline-view",itemClass:t.itemClass||TimelineViewItem,selectionMode:"none",emptyMessage:t.emptyMessage||"No timeline events to display",template:'\n                <div class="timeline-container timeline-{{position}}">\n                    {{#loading}}\n                        <div class="timeline-loading text-center py-4">\n                            <div class="spinner-border spinner-border-sm" role="status">\n                                <span class="visually-hidden">Loading...</span>\n                            </div>\n                            <span class="ms-2 text-muted">Loading timeline...</span>\n                        </div>\n                    {{/loading}}\n                    {{^loading}}\n                        {{#isEmpty}}\n                            <div class="timeline-empty text-center text-muted py-4">\n                                <i class="bi bi-clock-history fs-1 d-block mb-2"></i>\n                                <p>{{emptyMessage}}</p>\n                            </div>\n                        {{/isEmpty}}\n                        {{^isEmpty}}\n                            <div class="timeline" data-container="items"></div>\n                        {{/isEmpty}}\n                    {{/loading}}\n                </div>\n            ',...t}),this.position=t.position||"left",this.dateFormat=t.dateFormat||"date",this.dotStyle=t.dotStyle||"solid",this.showDate=!1!==t.showDate,this.theme=t.theme||"primary",this.groupBy=t.groupBy||"none"}_createItemView(t,e){if(this.itemViews.has(t.id))return;const i=new this.itemClass({model:t,index:e,listView:this,template:this.itemTemplate,dateFormat:this.dateFormat,dotStyle:this.dotStyle,showDate:this.showDate,theme:this.theme});return this.itemViews.set(t.id,i),i.on("item:click",this._onItemClick.bind(this)),i}_onItemClick(t){this.emit("item:click",t)}setPosition(t){return"left"!==t&&"center"!==t?(console.warn('Invalid position. Use "left" or "center"'),this):(this.position=t,this.isMounted()&&this.render(),this)}setDateFormat(t){return this.dateFormat=t,this.forEachItem(e=>{e.dateFormat=t,e.processItemData(),e.isMounted()&&e.render()}),this}setDotStyle(t){return this.dotStyle=t,this.forEachItem(e=>{e.dotStyle=t,e.processItemData(),e.isMounted()&&e.render()}),this}toggleDates(t=null){return this.showDate=null!==t?t:!this.showDate,this.forEachItem(t=>{t.showDate=this.showDate,t.isMounted()&&t.render()}),this}}exports.ListView=t.ListView,exports.ListViewItem=t.ListViewItem,exports.View=e.View,exports.Collection=i.Collection,exports.Model=i.Model,exports.TimelineView=TimelineView,exports.TimelineViewItem=TimelineViewItem;
 //# sourceMappingURL=timeline.cjs.js.map

package/dist/timeline.es.js

@@ -1,7 +1,7 @@
-import { L as ListViewItem, a as ListView } from "./chunks/ListView-DWaowghQ.js";
-import { d as dataFormatter } from "./chunks/Rest-C3fPzCIA.js";
-import { V } from "./chunks/Rest-C3fPzCIA.js";
-import { C, M } from "./chunks/Collection-C7rteLDn.js";
+import { L as ListViewItem, a as ListView } from "./chunks/ListView-8FqhYWRU.js";
+import { d as dataFormatter } from "./chunks/Rest-BoKp2Hj4.js";
+import { V } from "./chunks/Rest-BoKp2Hj4.js";
+import { C, M } from "./chunks/Collection-DJaa8dhS.js";
 class TimelineViewItem extends ListViewItem {
   constructor(options = {}) {
     super({

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "web-mojo",
-    "version": "2.2.2",
+    "version": "2.2.4",
     "description": "WEB-MOJO - A lightweight JavaScript framework for building data-driven web applications",
     "type": "module",
     "main": "./dist/index.cjs.js",