eripusisu - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

dist/eripusisu.d.ts

 export declare type EripusisuOptions = {
+    expanded?: boolean;
     ellipsisText?: string;
@@ -15,8 +16,9 @@ toggleButton?: HTMLElement;
     private expanded;
-    private isDirty;
     constructor(container: HTMLElement, lines?: number, options?: EripusisuOptions);
     private prepareAttributes;
+    private bindEvents;
+    private unbindEvents;
+    private handleClick;
     private updateAttributes;
-    refresh(): void;
-    private collectTargetNodes;
+    private dispatchToggleEvent;
     private emptyTarget;
@@ -28,3 +30,8 @@ private revertToOriginalNodes;
     private truncate;
-    toggle(): void;
+    rebuild(): void;
+    refresh(): void;
+    toggle(mode?: boolean): void;
+    expand(): void;
+    collapse(): void;
+    destroy(): void;
 }

dist/eripusisu.js

@@ -11,6 +11,9 @@ export default class Eripusisu {
         this.rectsMemo = [];
-        this.expanded = false;
-        this.isDirty = false;
+        this.expanded = true;
+        this.expanded = options.expanded ?? false;
         options.ellipsisText = options.ellipsisText ?? "…";
+        this.handleClick = this.handleClick.bind(this);
         this.prepareAttributes();
+        this.bindEvents();
+        this.rebuild();
         this.refresh();
@@ -24,20 +27,35 @@ }
     }
+    bindEvents() {
+        this.options.toggleButton?.addEventListener("click", this.handleClick);
+    }
+    unbindEvents() {
+        this.options.toggleButton?.removeEventListener("click", this.handleClick);
+    }
+    handleClick(e) {
+        e.preventDefault();
+        this.toggle();
+    }
     updateAttributes() {
+        const attrToAdd = this.expanded
+            ? "eripusisu-expanded"
+            : "eripusisu-collapsed";
+        const attrToRemove = this.expanded
+            ? "eripusisu-collapsed"
+            : "eripusisu-expanded";
+        this.container.setAttribute(attrToAdd, "");
+        this.container.removeAttribute(attrToRemove);
         this.options.toggleButton?.setAttribute("aria-expanded", String(this.expanded));
     }
-    refresh() {
-        this.revertToOriginalNodes();
-        const childNodes = this.container.childNodes;
-        this.originalNodes = document.createDocumentFragment();
-        for (let i = 0; i < childNodes.length; i += 1) {
-            this.originalNodes.appendChild(childNodes[i].cloneNode(true));
-        }
-        this.targetNodes = this.collectTargetNodes();
-        this.prepareRects();
-        if (this.linesMemo.length > this.lines) {
-            this.truncate();
-        }
+    dispatchToggleEvent() {
+        const event = document.createEvent("CustomEvent");
+        event.initCustomEvent("eripusisu-toggle", true, false, this.expanded);
+        this.container.dispatchEvent(event);
     }
-    collectTargetNodes() {
-        return collectNodes(this.container, (node) => {
+    emptyTarget() {
+        this.container.innerHTML = "";
+    }
+    revertToOriginalNodes() {
+        this.emptyTarget();
+        this.container.appendChild(this.originalNodes.cloneNode(true));
+        this.targetNodes = collectNodes(this.container, (node) => {
             return ((node instanceof HTMLElement &&
@@ -48,12 +66,2 @@ ["IMG", "PICTURE", "SVG"].indexOf(node.tagName) >= 0) ||
     }
-    emptyTarget() {
-        this.container.innerHTML = "";
-    }
-    revertToOriginalNodes() {
-        if (this.isDirty) {
-            this.emptyTarget();
-            this.container.appendChild(this.originalNodes.cloneNode(true));
-            this.isDirty = false;
-        }
-    }
     prepareRects() {
@@ -118,3 +126,5 @@ this.rects = [];
     truncate() {
-        this.isDirty = true;
+        if (this.linesMemo.length <= this.lines) {
+            return;
+        }
         // 試行中のパフォーマンス向上
@@ -192,12 +202,39 @@ // @ts-ignore
     }
-    toggle() {
-        this.expanded = !this.expanded;
+    rebuild() {
+        this.originalNodes = document.createDocumentFragment();
+        while (this.container.firstChild) {
+            this.originalNodes.appendChild(this.container.firstChild);
+        }
+        this.revertToOriginalNodes();
+    }
+    refresh() {
         if (this.expanded) {
-            this.revertToOriginalNodes();
+            this.expand();
         }
         else {
-            this.refresh();
+            this.collapse();
         }
+    }
+    toggle(mode) {
+        const expand = mode ?? !this.expanded;
+        expand ? this.expand() : this.collapse();
+    }
+    expand() {
+        this.revertToOriginalNodes();
+        this.expanded = true;
         this.updateAttributes();
+        this.dispatchToggleEvent();
     }
+    collapse() {
+        this.revertToOriginalNodes();
+        this.prepareRects();
+        this.truncate();
+        this.expanded = false;
+        this.updateAttributes();
+        this.dispatchToggleEvent();
+    }
+    destroy() {
+        this.revertToOriginalNodes();
+        this.unbindEvents();
+    }
 }
@@ -204,0 +241,0 @@ class RectTraverser {

dist/eripusisu.umd.js

@@ -34,3 +34,3 @@ (function (global, factory) {
             if (options === void 0) { options = {}; }
-            var _a;
+            var _a, _b;
             this.container = container;
@@ -44,6 +44,9 @@ this.lines = lines;
             this.rectsMemo = [];
-            this.expanded = false;
-            this.isDirty = false;
-            options.ellipsisText = (_a = options.ellipsisText) !== null && _a !== void 0 ? _a : "…";
+            this.expanded = true;
+            this.expanded = (_a = options.expanded) !== null && _a !== void 0 ? _a : false;
+            options.ellipsisText = (_b = options.ellipsisText) !== null && _b !== void 0 ? _b : "…";
+            this.handleClick = this.handleClick.bind(this);
             this.prepareAttributes();
+            this.bindEvents();
+            this.rebuild();
             this.refresh();
@@ -58,21 +61,38 @@ }
         };
+        Eripusisu.prototype.bindEvents = function () {
+            var _a;
+            (_a = this.options.toggleButton) === null || _a === void 0 ? void 0 : _a.addEventListener("click", this.handleClick);
+        };
+        Eripusisu.prototype.unbindEvents = function () {
+            var _a;
+            (_a = this.options.toggleButton) === null || _a === void 0 ? void 0 : _a.removeEventListener("click", this.handleClick);
+        };
+        Eripusisu.prototype.handleClick = function (e) {
+            e.preventDefault();
+            this.toggle();
+        };
         Eripusisu.prototype.updateAttributes = function () {
             var _a;
+            var attrToAdd = this.expanded
+                ? "eripusisu-expanded"
+                : "eripusisu-collapsed";
+            var attrToRemove = this.expanded
+                ? "eripusisu-collapsed"
+                : "eripusisu-expanded";
+            this.container.setAttribute(attrToAdd, "");
+            this.container.removeAttribute(attrToRemove);
             (_a = this.options.toggleButton) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-expanded", String(this.expanded));
         };
-        Eripusisu.prototype.refresh = function () {
-            this.revertToOriginalNodes();
-            var childNodes = this.container.childNodes;
-            this.originalNodes = document.createDocumentFragment();
-            for (var i = 0; i < childNodes.length; i += 1) {
-                this.originalNodes.appendChild(childNodes[i].cloneNode(true));
-            }
-            this.targetNodes = this.collectTargetNodes();
-            this.prepareRects();
-            if (this.linesMemo.length > this.lines) {
-                this.truncate();
-            }
+        Eripusisu.prototype.dispatchToggleEvent = function () {
+            var event = document.createEvent("CustomEvent");
+            event.initCustomEvent("eripusisu-toggle", true, false, this.expanded);
+            this.container.dispatchEvent(event);
         };
-        Eripusisu.prototype.collectTargetNodes = function () {
-            return collectNodes(this.container, function (node) {
+        Eripusisu.prototype.emptyTarget = function () {
+            this.container.innerHTML = "";
+        };
+        Eripusisu.prototype.revertToOriginalNodes = function () {
+            this.emptyTarget();
+            this.container.appendChild(this.originalNodes.cloneNode(true));
+            this.targetNodes = collectNodes(this.container, function (node) {
                 return ((node instanceof HTMLElement &&
@@ -83,12 +103,2 @@ ["IMG", "PICTURE", "SVG"].indexOf(node.tagName) >= 0) ||
         };
-        Eripusisu.prototype.emptyTarget = function () {
-            this.container.innerHTML = "";
-        };
-        Eripusisu.prototype.revertToOriginalNodes = function () {
-            if (this.isDirty) {
-                this.emptyTarget();
-                this.container.appendChild(this.originalNodes.cloneNode(true));
-                this.isDirty = false;
-            }
-        };
         Eripusisu.prototype.prepareRects = function () {
@@ -155,3 +165,5 @@ var _this = this;
             var _this = this;
-            this.isDirty = true;
+            if (this.linesMemo.length <= this.lines) {
+                return;
+            }
             // 試行中のパフォーマンス向上
@@ -232,12 +244,39 @@ // @ts-ignore
         };
-        Eripusisu.prototype.toggle = function () {
-            this.expanded = !this.expanded;
+        Eripusisu.prototype.rebuild = function () {
+            this.originalNodes = document.createDocumentFragment();
+            while (this.container.firstChild) {
+                this.originalNodes.appendChild(this.container.firstChild);
+            }
+            this.revertToOriginalNodes();
+        };
+        Eripusisu.prototype.refresh = function () {
             if (this.expanded) {
-                this.revertToOriginalNodes();
+                this.expand();
             }
             else {
-                this.refresh();
+                this.collapse();
             }
+        };
+        Eripusisu.prototype.toggle = function (mode) {
+            var expand = mode !== null && mode !== void 0 ? mode : !this.expanded;
+            expand ? this.expand() : this.collapse();
+        };
+        Eripusisu.prototype.expand = function () {
+            this.revertToOriginalNodes();
+            this.expanded = true;
             this.updateAttributes();
+            this.dispatchToggleEvent();
         };
+        Eripusisu.prototype.collapse = function () {
+            this.revertToOriginalNodes();
+            this.prepareRects();
+            this.truncate();
+            this.expanded = false;
+            this.updateAttributes();
+            this.dispatchToggleEvent();
+        };
+        Eripusisu.prototype.destroy = function () {
+            this.revertToOriginalNodes();
+            this.unbindEvents();
+        };
         return Eripusisu;
@@ -244,0 +283,0 @@ }());

package.json

 {
   "name": "eripusisu",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Text truncation library",
@@ -5,0 +5,0 @@ "author": "Takayuki Shimada",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

28521

increased by12.6%

Lines of code

694

increased by13.58%

No dependency changes