@flexilla/collapse - npm Package Compare versions

Comparing version 1.1.0 to 2.0.0

dist/collapse.js

 var n = Object.defineProperty;
-var h = (i, t, e) => t in i ? n(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
-var s = (i, t, e) => (h(i, typeof t != "symbol" ? t + "" : t, e), e);
-const o = (i, t, e, l, a) => {
+var r = (i, t, e) => t in i ? n(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
+var s = (i, t, e) => (r(i, typeof t != "symbol" ? t + "" : t, e), e);
+const a = (i, t, e, l, o) => {
   if (!(i instanceof HTMLElement))
@@ -9,3 +9,3 @@ throw new Error("accordion item not a valid HTMLELement");
     case "horizontal": {
-      i.style.width = e === "open" ? `${a}px` : "0px";
+      i.style.width = e === "open" ? `${o}px` : "0px";
       break;
@@ -20,5 +20,10 @@ }
 };
-class c {
-  constructor({ collapseElement: t, triggerElement: e, options: l = {} }) {
-    s(this, "instance");
+class h {
+  /**
+   * Collapse Component
+   * @param selector 
+   * @param triggerSelector 
+   * @param options 
+   */
+  constructor(t, e = {}, l) {
     s(this, "collapseElement");
@@ -33,7 +38,7 @@ s(this, "collapseOrientation");
       var t, e;
-      o(this.collapseElement, this.collapseTrigger, "open", this.collapseOrientation, this.collapseElementWidth), (e = (t = this.options).onToggle) == null || e.call(t, { isExpanded: !0 });
+      a(this.collapseElement, this.collapseTrigger, "open", this.collapseOrientation, this.collapseElementWidth), (e = (t = this.options).onToggle) == null || e.call(t, { isExpanded: !0 });
     });
     s(this, "hide", () => {
       var t, e;
-      o(this.collapseElement, this.collapseTrigger, "close", this.collapseOrientation), (e = (t = this.options).onToggle) == null || e.call(t, { isExpanded: !1 });
+      a(this.collapseElement, this.collapseTrigger, "close", this.collapseOrientation), (e = (t = this.options).onToggle) == null || e.call(t, { isExpanded: !1 });
     });
@@ -43,7 +48,8 @@ s(this, "toggle", () => {
       const t = this.collapseElement.dataset.state === "close" ? "open" : "close";
-      o(this.collapseElement, this.collapseTrigger, t, this.collapseOrientation, this.collapseElementWidth), (l = (e = this.options).onToggle) == null || l.call(e, { isExpanded: t === "open" });
+      a(this.collapseElement, this.collapseTrigger, t, this.collapseOrientation, this.collapseElementWidth), (l = (e = this.options).onToggle) == null || l.call(e, { isExpanded: t === "open" });
     });
-    if (this.instance = this, !(t instanceof HTMLElement))
+    const o = typeof t == "string" ? document.querySelector(`${t}`) : t;
+    if (!(o instanceof HTMLElement))
       throw new Error("Provided element is not a valid HTMLElement");
-    this.collapseElement = t, this.collapseId = this.collapseElement.getAttribute("id"), this.collapseTrigger = e || document.querySelector(`[data-collapse-trigger][data-target*='${this.collapseId}']`), this.options = l, this.collapseOrientation = this.options.orientation || this.collapseElement.dataset.orientation || "vertical", this.defaultState = this.options.defaultState || this.collapseElement.dataset.defaultState || "close", this.collapseElement.setAttribute("data-state", this.defaultState), this.collapseElementWidth = this.collapseElement.clientWidth, this.init();
+    this.collapseElement = o, this.collapseId = this.collapseElement.getAttribute("id"), this.collapseTrigger = document.querySelector(`${l}`) || document.querySelector(`[data-collapse-trigger][data-target*='${this.collapseId}']`), this.options = e, this.collapseOrientation = this.options.orientation || this.collapseElement.dataset.orientation || "vertical", this.defaultState = this.options.defaultState || this.collapseElement.dataset.defaultState || "close", this.collapseElement.setAttribute("data-state", this.defaultState), this.collapseElementWidth = this.collapseElement.clientWidth, this.init();
   }
@@ -55,3 +61,3 @@ init() {
 export {
-  c as Collapse
+  h as Collapse
 };

dist/index.d.ts

@@ -1,6 +0,2 @@
-/**
- * Collapse Component
- */
 export declare class Collapse {
-    instance: Collapse;
     private collapseElement;
@@ -13,3 +9,9 @@ private collapseOrientation;
     private collapseElementWidth;
-    constructor({ collapseElement, triggerElement, options }: CollapseParams);
+    /**
+     * Collapse Component
+     * @param selector
+     * @param triggerSelector
+     * @param options
+     */
+    constructor(selector: string | HTMLElement, options?: CollapseOptions, triggerSelector?: string);
     show: () => void;
@@ -29,8 +31,2 @@ hide: () => void;
 
-export declare type CollapseParams = {
-    collapseElement: HTMLElement;
-    triggerElement?: HTMLElement;
-    options?: CollapseOptions;
-};
-
 export { }

package.json

 {
   "name": "@flexilla/collapse",
   "private": false,
-  "version": "1.1.0",
+  "version": "2.0.0",
   "type": "module",
@@ -66,3 +66,3 @@ "description": "A versatile and interactive collapse component for creating collapsible sections in web applications, conserving space and improving user experience.",
   "author": "johnkat-mj",
-  "gitHead": "18549edaac73621574bb4df22436305c201c47c8"
+  "gitHead": "b182c7035953bc34e8f350b834df9862bec8acb5"
 }

README.md

@@ -23,6 +23,3 @@ # Collapse Component
 
-```typescript
-const collapseElement = document.getElementById("myCollapseElement");
-const triggerElement = document.getElementById("myTriggerElement");
-
+```js
 const options = {
@@ -33,7 +30,7 @@ orientation: "vertical",
 
-const collapse = new Collapse({
-  collapseElement,
-  triggerElement,
+const collapse = new Collapse(
+  '#myCollapseElement',
   options,
-});
+  '#myTriggerElement',
+);
 
@@ -40,0 +37,0 @@ // Show the collapse element

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

Lines of code

99

increased by3.13%

Worsened metrics

Total package byte prevSize

10360

decreased by-0.72%

Number of lines in readme file

43

decreased by-6.52%

No dependency changes