@flexilla/dismissible 2.0.11 → 2.0.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/dismissible.js +83 -45
  2. package/dist/dismissible.umd.cjs +1 -1
  3. package/dist/index.d.ts +14 -4
  4. package/package.json +2 -2
package/dist/dismissible.js CHANGED
@@ -1,97 +1,132 @@
1
1
  var u = Object.defineProperty;
2
- var E = (t, e, s) => e in t ? u(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
3
- var n = (t, e, s) => E(t, typeof e != "symbol" ? e + "" : e, s);
4
- const f = (t, e = document.body) => e.querySelector(t), c = (t, e = document.body) => Array.from(e.querySelectorAll(t)), w = ({
5
- element: t,
2
+ var E = (i, e, s) => e in i ? u(i, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : i[e] = s;
3
+ var t = (i, e, s) => E(i, typeof e != "symbol" ? e + "" : e, s);
4
+ const f = (i, e = document.body) => e.querySelector(i), d = (i, e = document.body) => Array.from(e.querySelectorAll(i)), p = ({
5
+ element: i,
6
6
  callback: e,
7
7
  type: s,
8
- keysCheck: i
8
+ keysCheck: n
9
9
  }) => {
10
- const l = getComputedStyle(t), a = l.transition;
11
- if (a !== "none" && a !== "" && !i.includes(a)) {
12
- const d = "transitionend", r = () => {
13
- t.removeEventListener(d, r), e();
10
+ const l = getComputedStyle(i), o = l.transition;
11
+ if (o !== "none" && o !== "" && !n.includes(o)) {
12
+ const a = "transitionend", c = () => {
13
+ i.removeEventListener(a, c), e();
14
14
  };
15
- t.addEventListener(d, r, { once: !0 });
15
+ i.addEventListener(a, c, { once: !0 });
16
16
  } else
17
17
  e();
18
- }, h = ({
19
- element: t,
18
+ }, m = ({
19
+ element: i,
20
20
  callback: e
21
21
  }) => {
22
- w({
23
- element: t,
22
+ p({
23
+ element: i,
24
24
  callback: e,
25
25
  type: "transition",
26
26
  keysCheck: ["all 0s ease 0s", "all"]
27
27
  });
28
28
  };
29
- class o {
29
+ class h {
30
30
  static initGlobalRegistry() {
31
31
  window.$flexillaInstances || (window.$flexillaInstances = {});
32
32
  }
33
- static register(e, s, i) {
34
- return this.initGlobalRegistry(), window.$flexillaInstances[e] || (window.$flexillaInstances[e] = []), this.getInstance(e, s) || (window.$flexillaInstances[e].push({ element: s, instance: i }), i);
33
+ static register(e, s, n) {
34
+ return this.initGlobalRegistry(), window.$flexillaInstances[e] || (window.$flexillaInstances[e] = []), this.getInstance(e, s) || (window.$flexillaInstances[e].push({ element: s, instance: n }), n);
35
35
  }
36
36
  static getInstance(e, s) {
37
- var i, l;
38
- return this.initGlobalRegistry(), (l = (i = window.$flexillaInstances[e]) == null ? void 0 : i.find(
39
- (a) => a.element === s
37
+ var n, l;
38
+ return this.initGlobalRegistry(), (l = (n = window.$flexillaInstances[e]) == null ? void 0 : n.find(
39
+ (o) => o.element === s
40
40
  )) == null ? void 0 : l.instance;
41
41
  }
42
42
  static removeInstance(e, s) {
43
43
  this.initGlobalRegistry(), window.$flexillaInstances[e] && (window.$flexillaInstances[e] = window.$flexillaInstances[e].filter(
44
- (i) => i.element !== s
44
+ (n) => n.element !== s
45
45
  ));
46
46
  }
47
47
  }
48
- const m = class m {
48
+ const r = class r {
49
+ // Store original display style
49
50
  /**
50
51
  * Dismissible Component
51
52
  * @param dismissible
52
53
  * @param action
53
- * @param onDissmiss
54
+ * @param onDismiss
55
+ * @param onRestore
54
56
  */
55
- constructor(e, s, i) {
56
- n(this, "dismissibleElement");
57
- n(this, "dismissButtons");
58
- n(this, "action");
59
- n(this, "onDismiss");
60
- n(this, "hideFromScreen", () => {
57
+ constructor(e, s, n, l) {
58
+ t(this, "dismissibleElement");
59
+ t(this, "dismissButtons");
60
+ t(this, "restoreButtons");
61
+ t(this, "action");
62
+ t(this, "onDismiss");
63
+ t(this, "onRestore");
64
+ t(this, "parentElement");
65
+ // Store parent for DOM restoration
66
+ t(this, "previousSibling");
67
+ // Store sibling for precise restoration
68
+ t(this, "originalDisplay");
69
+ t(this, "hideFromScreen", () => {
61
70
  var e;
62
71
  this.dismissibleElement.style.display = "none", (e = this.onDismiss) == null || e.call(this);
63
72
  });
64
- n(this, "removeFromDom", () => {
73
+ t(this, "removeFromDom", () => {
65
74
  var e, s;
66
75
  (e = this.onDismiss) == null || e.call(this), (s = this.dismissibleElement.parentElement) == null || s.removeChild(this.dismissibleElement);
67
76
  });
68
- n(this, "dismiss", () => {
77
+ t(this, "showOnScreen", () => {
78
+ var e;
79
+ this.dismissibleElement.style.display = this.originalDisplay, this.dismissibleElement.setAttribute("aria-hidden", "false"), this.dismissibleElement.setAttribute("data-state", "visible"), (e = this.onRestore) == null || e.call(this);
80
+ });
81
+ t(this, "restoreToDom", () => {
82
+ var e;
83
+ this.parentElement && (this.previousSibling && this.previousSibling.nextSibling ? this.parentElement.insertBefore(this.dismissibleElement, this.previousSibling.nextSibling) : this.parentElement.appendChild(this.dismissibleElement), this.dismissibleElement.setAttribute("aria-hidden", "false"), this.dismissibleElement.removeAttribute("data-hidden"), this.dismissibleElement.setAttribute("data-state", "visible"), (e = this.onRestore) == null || e.call(this));
84
+ });
85
+ t(this, "dismiss", () => {
69
86
  switch (this.action) {
70
87
  case "hide-from-screen":
71
- this.dismissibleElement.setAttribute("aria-hidden", "true"), this.dismissibleElement.setAttribute("data-state", "hidden"), h({
88
+ this.dismissibleElement.setAttribute("aria-hidden", "true"), this.dismissibleElement.setAttribute("data-state", "hidden"), m({
72
89
  element: this.dismissibleElement,
73
90
  callback: this.hideFromScreen
74
91
  });
75
92
  break;
76
93
  default:
77
- this.dismissibleElement.setAttribute("data-hidden", ""), this.dismissibleElement.setAttribute("aria-hidden", "true"), this.dismissibleElement.setAttribute("data-state", "removed"), h({
94
+ this.dismissibleElement.setAttribute("data-hidden", ""), this.dismissibleElement.setAttribute("aria-hidden", "true"), this.dismissibleElement.setAttribute("data-state", "removed"), m({
78
95
  element: this.dismissibleElement,
79
96
  callback: this.removeFromDom
80
97
  });
81
98
  break;
82
99
  }
83
100
  });
84
- const l = typeof e == "string" ? f(e, document.body) : e;
85
- if (!(l instanceof HTMLElement)) throw new Error("Provided Element not a valid HTMLElement");
86
- this.dismissibleElement = l, this.action = s || this.dismissibleElement.dataset.action || "hide-from-screen", this.dismissButtons = c("[data-dismiss-btn]", this.dismissibleElement), this.onDismiss = i, this.dismissibleElement.setAttribute("aria-hidden", "false");
87
- const a = o.getInstance("dismissible", this.dismissibleElement);
101
+ t(this, "restore", () => {
102
+ switch (this.action) {
103
+ case "hide-from-screen":
104
+ m({
105
+ element: this.dismissibleElement,
106
+ callback: this.showOnScreen
107
+ });
108
+ break;
109
+ default:
110
+ m({
111
+ element: this.dismissibleElement,
112
+ callback: this.restoreToDom
113
+ });
114
+ break;
115
+ }
116
+ });
117
+ const o = typeof e == "string" ? f(e, document.body) : e;
118
+ if (!(o instanceof HTMLElement)) throw new Error("Provided Element not a valid HTMLElement");
119
+ this.dismissibleElement = o, this.action = s || this.dismissibleElement.dataset.action || "hide-from-screen", this.dismissButtons = d("[data-dismiss-btn]", this.dismissibleElement), this.restoreButtons = d("[data-restore-btn]", document.body), this.onDismiss = n, this.onRestore = l, this.parentElement = this.dismissibleElement.parentElement, this.previousSibling = this.dismissibleElement.previousSibling, this.originalDisplay = this.dismissibleElement.style.display || getComputedStyle(this.dismissibleElement).display, this.dismissibleElement.setAttribute("aria-hidden", "false");
120
+ const a = h.getInstance("dismissible", this.dismissibleElement);
88
121
  if (a)
89
122
  return a;
90
- this.setupDismissible(), o.register("dismissible", this.dismissibleElement, this);
123
+ this.setupDismissible(), h.register("dismissible", this.dismissibleElement, this);
91
124
  }
92
125
  setupDismissible() {
93
126
  for (const e of this.dismissButtons)
94
127
  e.addEventListener("click", this.dismiss);
128
+ for (const e of this.restoreButtons)
129
+ e.addEventListener("click", this.restore);
95
130
  }
96
131
  /**
97
132
  * Cleanup method to remove event listeners
@@ -99,21 +134,24 @@ const m = class m {
99
134
  cleanup() {
100
135
  for (const e of this.dismissButtons)
101
136
  e.removeEventListener("click", this.dismiss);
102
- o.removeInstance("dismissible", this.dismissibleElement);
137
+ for (const e of this.restoreButtons)
138
+ e.removeEventListener("click", this.restore);
139
+ h.removeInstance("dismissible", this.dismissibleElement);
103
140
  }
104
141
  };
105
- n(m, "autoInit", (e = "[data-fx-dismissible]") => {
106
- const s = c(e);
107
- for (const i of s) new m(i);
142
+ t(r, "autoInit", (e = "[data-fx-dismissible]") => {
143
+ const s = d(e);
144
+ for (const n of s) new r(n);
108
145
  }), /**
109
146
  *
110
147
  * @param dismissible
111
148
  * @param action
112
- * @param onDissmiss
149
+ * @param onDismiss
150
+ * @param onRestore
113
151
  * @returns
114
152
  */
115
- n(m, "init", (e, s, i) => new m(e, s, i));
116
- let b = m;
153
+ t(r, "init", (e, s, n, l) => new r(e, s, n, l));
154
+ let b = r;
117
155
  export {
118
156
  b as Dismissible
119
157
  };
package/dist/dismissible.umd.cjs CHANGED
@@ -1 +1 @@
1
- (function(n,t){typeof exports=="object"&&typeof module<"u"?t(exports):typeof define=="function"&&define.amd?define(["exports"],t):(n=typeof globalThis<"u"?globalThis:n||self,t(n["@flexilla/dismissible"]={}))})(this,function(n){"use strict";var w=Object.defineProperty;var y=(n,t,m)=>t in n?w(n,t,{enumerable:!0,configurable:!0,writable:!0,value:m}):n[t]=m;var o=(n,t,m)=>y(n,typeof t!="symbol"?t+"":t,m);const t=(l,e=document.body)=>e.querySelector(l),m=(l,e=document.body)=>Array.from(e.querySelectorAll(l)),E=({element:l,callback:e,type:s,keysCheck:i})=>{const a=getComputedStyle(l),d=a.transition;if(d!=="none"&&d!==""&&!i.includes(d)){const u="transitionend",f=()=>{l.removeEventListener(u,f),e()};l.addEventListener(u,f,{once:!0})}else e()},b=({element:l,callback:e})=>{E({element:l,callback:e,type:"transition",keysCheck:["all 0s ease 0s","all"]})};class c{static initGlobalRegistry(){window.$flexillaInstances||(window.$flexillaInstances={})}static register(e,s,i){return this.initGlobalRegistry(),window.$flexillaInstances[e]||(window.$flexillaInstances[e]=[]),this.getInstance(e,s)||(window.$flexillaInstances[e].push({element:s,instance:i}),i)}static getInstance(e,s){var i,a;return this.initGlobalRegistry(),(a=(i=window.$flexillaInstances[e])==null?void 0:i.find(d=>d.element===s))==null?void 0:a.instance}static removeInstance(e,s){this.initGlobalRegistry(),window.$flexillaInstances[e]&&(window.$flexillaInstances[e]=window.$flexillaInstances[e].filter(i=>i.element!==s))}}const r=class r{constructor(e,s,i){o(this,"dismissibleElement");o(this,"dismissButtons");o(this,"action");o(this,"onDismiss");o(this,"hideFromScreen",()=>{var e;this.dismissibleElement.style.display="none",(e=this.onDismiss)==null||e.call(this)});o(this,"removeFromDom",()=>{var e,s;(e=this.onDismiss)==null||e.call(this),(s=this.dismissibleElement.parentElement)==null||s.removeChild(this.dismissibleElement)});o(this,"dismiss",()=>{switch(this.action){case"hide-from-screen":this.dismissibleElement.setAttribute("aria-hidden","true"),this.dismissibleElement.setAttribute("data-state","hidden"),b({element:this.dismissibleElement,callback:this.hideFromScreen});break;default:this.dismissibleElement.setAttribute("data-hidden",""),this.dismissibleElement.setAttribute("aria-hidden","true"),this.dismissibleElement.setAttribute("data-state","removed"),b({element:this.dismissibleElement,callback:this.removeFromDom});break}});const a=typeof e=="string"?t(e,document.body):e;if(!(a instanceof HTMLElement))throw new Error("Provided Element not a valid HTMLElement");this.dismissibleElement=a,this.action=s||this.dismissibleElement.dataset.action||"hide-from-screen",this.dismissButtons=m("[data-dismiss-btn]",this.dismissibleElement),this.onDismiss=i,this.dismissibleElement.setAttribute("aria-hidden","false");const d=c.getInstance("dismissible",this.dismissibleElement);if(d)return d;this.setupDismissible(),c.register("dismissible",this.dismissibleElement,this)}setupDismissible(){for(const e of this.dismissButtons)e.addEventListener("click",this.dismiss)}cleanup(){for(const e of this.dismissButtons)e.removeEventListener("click",this.dismiss);c.removeInstance("dismissible",this.dismissibleElement)}};o(r,"autoInit",(e="[data-fx-dismissible]")=>{const s=m(e);for(const i of s)new r(i)}),o(r,"init",(e,s,i)=>new r(e,s,i));let h=r;n.Dismissible=h,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
1
+ (function(l,n){typeof exports=="object"&&typeof module<"u"?n(exports):typeof define=="function"&&define.amd?define(["exports"],n):(l=typeof globalThis<"u"?globalThis:l||self,n(l["@flexilla/dismissible"]={}))})(this,function(l){"use strict";var p=Object.defineProperty;var y=(l,n,a)=>n in l?p(l,n,{enumerable:!0,configurable:!0,writable:!0,value:a}):l[n]=a;var s=(l,n,a)=>y(l,typeof n!="symbol"?n+"":n,a);const n=(o,e=document.body)=>e.querySelector(o),a=(o,e=document.body)=>Array.from(e.querySelectorAll(o)),E=({element:o,callback:e,type:i,keysCheck:t})=>{const r=getComputedStyle(o),m=r.transition;if(m!=="none"&&m!==""&&!t.includes(m)){const h="transitionend",f=()=>{o.removeEventListener(h,f),e()};o.addEventListener(h,f,{once:!0})}else e()},c=({element:o,callback:e})=>{E({element:o,callback:e,type:"transition",keysCheck:["all 0s ease 0s","all"]})};class b{static initGlobalRegistry(){window.$flexillaInstances||(window.$flexillaInstances={})}static register(e,i,t){return this.initGlobalRegistry(),window.$flexillaInstances[e]||(window.$flexillaInstances[e]=[]),this.getInstance(e,i)||(window.$flexillaInstances[e].push({element:i,instance:t}),t)}static getInstance(e,i){var t,r;return this.initGlobalRegistry(),(r=(t=window.$flexillaInstances[e])==null?void 0:t.find(m=>m.element===i))==null?void 0:r.instance}static removeInstance(e,i){this.initGlobalRegistry(),window.$flexillaInstances[e]&&(window.$flexillaInstances[e]=window.$flexillaInstances[e].filter(t=>t.element!==i))}}const d=class d{constructor(e,i,t,r){s(this,"dismissibleElement");s(this,"dismissButtons");s(this,"restoreButtons");s(this,"action");s(this,"onDismiss");s(this,"onRestore");s(this,"parentElement");s(this,"previousSibling");s(this,"originalDisplay");s(this,"hideFromScreen",()=>{var e;this.dismissibleElement.style.display="none",(e=this.onDismiss)==null||e.call(this)});s(this,"removeFromDom",()=>{var e,i;(e=this.onDismiss)==null||e.call(this),(i=this.dismissibleElement.parentElement)==null||i.removeChild(this.dismissibleElement)});s(this,"showOnScreen",()=>{var e;this.dismissibleElement.style.display=this.originalDisplay,this.dismissibleElement.setAttribute("aria-hidden","false"),this.dismissibleElement.setAttribute("data-state","visible"),(e=this.onRestore)==null||e.call(this)});s(this,"restoreToDom",()=>{var e;this.parentElement&&(this.previousSibling&&this.previousSibling.nextSibling?this.parentElement.insertBefore(this.dismissibleElement,this.previousSibling.nextSibling):this.parentElement.appendChild(this.dismissibleElement),this.dismissibleElement.setAttribute("aria-hidden","false"),this.dismissibleElement.removeAttribute("data-hidden"),this.dismissibleElement.setAttribute("data-state","visible"),(e=this.onRestore)==null||e.call(this))});s(this,"dismiss",()=>{switch(this.action){case"hide-from-screen":this.dismissibleElement.setAttribute("aria-hidden","true"),this.dismissibleElement.setAttribute("data-state","hidden"),c({element:this.dismissibleElement,callback:this.hideFromScreen});break;default:this.dismissibleElement.setAttribute("data-hidden",""),this.dismissibleElement.setAttribute("aria-hidden","true"),this.dismissibleElement.setAttribute("data-state","removed"),c({element:this.dismissibleElement,callback:this.removeFromDom});break}});s(this,"restore",()=>{switch(this.action){case"hide-from-screen":c({element:this.dismissibleElement,callback:this.showOnScreen});break;default:c({element:this.dismissibleElement,callback:this.restoreToDom});break}});const m=typeof e=="string"?n(e,document.body):e;if(!(m instanceof HTMLElement))throw new Error("Provided Element not a valid HTMLElement");this.dismissibleElement=m,this.action=i||this.dismissibleElement.dataset.action||"hide-from-screen",this.dismissButtons=a("[data-dismiss-btn]",this.dismissibleElement),this.restoreButtons=a("[data-restore-btn]",document.body),this.onDismiss=t,this.onRestore=r,this.parentElement=this.dismissibleElement.parentElement,this.previousSibling=this.dismissibleElement.previousSibling,this.originalDisplay=this.dismissibleElement.style.display||getComputedStyle(this.dismissibleElement).display,this.dismissibleElement.setAttribute("aria-hidden","false");const h=b.getInstance("dismissible",this.dismissibleElement);if(h)return h;this.setupDismissible(),b.register("dismissible",this.dismissibleElement,this)}setupDismissible(){for(const e of this.dismissButtons)e.addEventListener("click",this.dismiss);for(const e of this.restoreButtons)e.addEventListener("click",this.restore)}cleanup(){for(const e of this.dismissButtons)e.removeEventListener("click",this.dismiss);for(const e of this.restoreButtons)e.removeEventListener("click",this.restore);b.removeInstance("dismissible",this.dismissibleElement)}};s(d,"autoInit",(e="[data-fx-dismissible]")=>{const i=a(e);for(const t of i)new d(t)}),s(d,"init",(e,i,t,r)=>new d(e,i,t,r));let u=d;l.Dismissible=u,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})});
package/dist/index.d.ts CHANGED
@@ -1,18 +1,27 @@
1
1
  export declare class Dismissible {
2
2
  private dismissibleElement;
3
3
  private dismissButtons;
4
+ private restoreButtons;
4
5
  private action;
5
6
  private onDismiss;
7
+ private onRestore;
8
+ private parentElement;
9
+ private previousSibling;
10
+ private originalDisplay;
6
11
  /**
7
12
  * Dismissible Component
8
13
  * @param dismissible
9
14
  * @param action
10
- * @param onDissmiss
15
+ * @param onDismiss
16
+ * @param onRestore
11
17
  */
12
- constructor(dismissible: string | HTMLElement, action?: "remove-from-dom" | "hide-from-screen", onDissmiss?: () => void);
18
+ constructor(dismissible: string | HTMLElement, action?: "remove-from-dom" | "hide-from-screen", onDismiss?: () => void, onRestore?: () => void);
13
19
  private hideFromScreen;
14
20
  private removeFromDom;
21
+ private showOnScreen;
22
+ private restoreToDom;
15
23
  dismiss: () => void;
24
+ restore: () => void;
16
25
  private setupDismissible;
17
26
  /**
18
27
  * Cleanup method to remove event listeners
@@ -23,10 +32,11 @@ export declare class Dismissible {
23
32
  *
24
33
  * @param dismissible
25
34
  * @param action
26
- * @param onDissmiss
35
+ * @param onDismiss
36
+ * @param onRestore
27
37
  * @returns
28
38
  */
29
- static init: (dismissible: string | HTMLElement, action?: "remove-from-dom" | "hide-from-screen", onDissmiss?: () => void) => Dismissible;
39
+ static init: (dismissible: string | HTMLElement, action?: "remove-from-dom" | "hide-from-screen", onDismiss?: () => void, onRestore?: () => void) => Dismissible;
30
40
  }
31
41
 
32
42
  export { }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@flexilla/dismissible",
3
3
  "private": false,
4
- "version": "2.0.11",
4
+ "version": "2.0.12",
5
5
  "type": "module",
6
6
  "description": "A lightweight JavaScript component that automatically makes a component dismissible for easy user interaction.",
7
7
  "publishConfig": {
@@ -64,5 +64,5 @@
64
64
  "dependencies": {
65
65
  "@flexilla/manager": "^0.1.0"
66
66
  },
67
- "gitHead": "efc206a244e576bbadf7e78c5b6b921e3019a0c0"
67
+ "gitHead": "0f4a3d3dd7da9c22f612719eb9048f64ae8f802b"
68
68
  }