@flexilla/dismissible 1.1.1 → 2.0.1

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 (5) hide show
  1. package/README.md +2 -4
  2. package/dist/dismissible.js +40 -27
  3. package/dist/dismissible.umd.cjs +1 -1
  4. package/dist/index.d.ts +12 -7
  5. package/package.json +68 -67
package/README.md CHANGED
@@ -23,13 +23,11 @@ import Dismissible from '@flexilla/dismissible';
23
23
  </div>
24
24
 
25
25
  <script>
26
- const dismissibleElement = document.querySelector('.dismissable-element');
27
- const dismissible = new Dismissible({
28
- dismissibleElement,
26
+ const dismissible = new Dismissible('.dismissable-element',
29
27
  action: "remove-from-dom",
30
28
  onDismiss: () => {
31
29
  console.log("Element dismissed!");
32
30
  }
33
- });
31
+ );
34
32
  </script>
35
33
  ```
package/dist/dismissible.js CHANGED
@@ -1,61 +1,74 @@
1
- var l = Object.defineProperty;
2
- var r = (i, e, s) => e in i ? l(i, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : i[e] = s;
3
- var t = (i, e, s) => (r(i, typeof e != "symbol" ? e + "" : e, s), s);
4
- const o = ({
5
- selector: i,
6
- parentElement: e
7
- }) => Array.from(e.querySelectorAll(i)), m = ({
1
+ var a = Object.defineProperty;
2
+ var c = (i, s, e) => s in i ? a(i, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[s] = e;
3
+ var t = (i, s, e) => (c(i, typeof s != "symbol" ? s + "" : s, e), e);
4
+ const h = (i, s = document.body) => s.querySelector(i), d = (i, s = document.body) => Array.from(s.querySelectorAll(i)), l = ({
8
5
  element: i,
9
- callback: e
6
+ callback: s
10
7
  }) => {
11
- const s = getComputedStyle(i).transition;
12
- s !== "none" && s !== "" && s !== "all 0s ease 0s" ? i.addEventListener(
8
+ const e = getComputedStyle(i).transition;
9
+ e !== "none" && e !== "" && e !== "all 0s ease 0s" ? i.addEventListener(
13
10
  "transitionend",
14
11
  function n() {
15
- i.removeEventListener("transitionend", n), e();
12
+ i.removeEventListener("transitionend", n), s();
16
13
  },
17
14
  { once: !0 }
18
- ) : e();
19
- };
20
- class a {
21
- constructor({ dismissibleElement: e, action: s, onDissmiss: n }) {
15
+ ) : s();
16
+ }, o = class o {
17
+ /**
18
+ * Dismissible Component
19
+ * @param dismissible
20
+ * @param action
21
+ * @param onDissmiss
22
+ */
23
+ constructor(s, e, n) {
22
24
  t(this, "dismissibleElement");
23
25
  t(this, "dismissButtons");
24
26
  t(this, "action");
25
27
  t(this, "onDismiss");
26
28
  t(this, "hideFromScreen", () => {
27
- var e;
28
- this.dismissibleElement.style.display = "none", (e = this.onDismiss) == null || e.call(this);
29
+ var s;
30
+ this.dismissibleElement.style.display = "none", (s = this.onDismiss) == null || s.call(this);
29
31
  });
30
32
  t(this, "removeFromDom", () => {
31
- var e, s;
32
- (e = this.onDismiss) == null || e.call(this), (s = this.dismissibleElement.parentNode) == null || s.removeChild(this.dismissibleElement);
33
+ var s, e;
34
+ (s = this.onDismiss) == null || s.call(this), (e = this.dismissibleElement.parentNode) == null || e.removeChild(this.dismissibleElement);
33
35
  });
34
36
  t(this, "dismiss", () => {
35
37
  switch (this.action) {
36
38
  case "hide-from-screen":
37
- this.dismissibleElement.setAttribute("aria-hidden", "true"), m({
39
+ this.dismissibleElement.setAttribute("aria-hidden", "true"), l({
38
40
  element: this.dismissibleElement,
39
41
  callback: this.hideFromScreen
40
42
  });
41
43
  break;
42
44
  default:
43
- this.dismissibleElement.setAttribute("data-hidden", ""), this.dismissibleElement.setAttribute("aria-hidden", "true"), m({
45
+ this.dismissibleElement.setAttribute("data-hidden", ""), this.dismissibleElement.setAttribute("aria-hidden", "true"), l({
44
46
  element: this.dismissibleElement,
45
47
  callback: this.removeFromDom
46
48
  });
47
49
  break;
48
50
  }
49
51
  });
50
- if (!(e instanceof HTMLElement))
52
+ const m = typeof s == "string" ? h(s, document.body) : s;
53
+ if (!(m instanceof HTMLElement))
51
54
  throw new Error("Provided Element not a valid HTMLElement");
52
- this.dismissibleElement = e, this.action = s || this.dismissibleElement.dataset.action || "hide-from-screen", this.dismissButtons = o({ selector: "[data-dismiss-btn]", parentElement: this.dismissibleElement }), this.onDismiss = n, this.dismissibleElement.setAttribute("aria-hidden", "false"), this.init();
55
+ this.dismissibleElement = m, this.action = e || this.dismissibleElement.dataset.action || "hide-from-screen", this.dismissButtons = d("[data-dismiss-btn]", this.dismissibleElement), this.onDismiss = n, this.dismissibleElement.setAttribute("aria-hidden", "false"), this.init();
53
56
  }
54
57
  init() {
55
- for (const e of this.dismissButtons)
56
- e.addEventListener("click", this.dismiss);
58
+ for (const s of this.dismissButtons)
59
+ s.addEventListener("click", this.dismiss);
57
60
  }
58
- }
61
+ };
62
+ /**
63
+ * auto init Dismissible Element based on the selector provided
64
+ * @param selector {string} default is [data-fx-dismissible]
65
+ */
66
+ t(o, "autoInit", (s = "[data-fx-dismissible]") => {
67
+ const e = d(s);
68
+ for (const n of e)
69
+ new o(n);
70
+ });
71
+ let r = o;
59
72
  export {
60
- a as Dismissible
73
+ r as Dismissible
61
74
  };
package/dist/dismissible.umd.cjs CHANGED
@@ -1 +1 @@
1
- (function(s,i){typeof exports=="object"&&typeof module<"u"?i(exports):typeof define=="function"&&define.amd?define(["exports"],i):(s=typeof globalThis<"u"?globalThis:s||self,i(s["@flexilla/dismissible"]={}))})(this,function(s){"use strict";var r=Object.defineProperty;var a=(s,i,t)=>i in s?r(s,i,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[i]=t;var l=(s,i,t)=>(a(s,typeof i!="symbol"?i+"":i,t),t);const i=({selector:m,parentElement:e})=>Array.from(e.querySelectorAll(m)),t=({element:m,callback:e})=>{const n=getComputedStyle(m).transition;n!=="none"&&n!==""&&n!=="all 0s ease 0s"?m.addEventListener("transitionend",function o(){m.removeEventListener("transitionend",o),e()},{once:!0}):e()};class d{constructor({dismissibleElement:e,action:n,onDissmiss:o}){l(this,"dismissibleElement");l(this,"dismissButtons");l(this,"action");l(this,"onDismiss");l(this,"hideFromScreen",()=>{var e;this.dismissibleElement.style.display="none",(e=this.onDismiss)==null||e.call(this)});l(this,"removeFromDom",()=>{var e,n;(e=this.onDismiss)==null||e.call(this),(n=this.dismissibleElement.parentNode)==null||n.removeChild(this.dismissibleElement)});l(this,"dismiss",()=>{switch(this.action){case"hide-from-screen":this.dismissibleElement.setAttribute("aria-hidden","true"),t({element:this.dismissibleElement,callback:this.hideFromScreen});break;default:this.dismissibleElement.setAttribute("data-hidden",""),this.dismissibleElement.setAttribute("aria-hidden","true"),t({element:this.dismissibleElement,callback:this.removeFromDom});break}});if(!(e instanceof HTMLElement))throw new Error("Provided Element not a valid HTMLElement");this.dismissibleElement=e,this.action=n||this.dismissibleElement.dataset.action||"hide-from-screen",this.dismissButtons=i({selector:"[data-dismiss-btn]",parentElement:this.dismissibleElement}),this.onDismiss=o,this.dismissibleElement.setAttribute("aria-hidden","false"),this.init()}init(){for(const e of this.dismissButtons)e.addEventListener("click",this.dismiss)}}s.Dismissible=d,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});
1
+ (function(s,i){typeof exports=="object"&&typeof module<"u"?i(exports):typeof define=="function"&&define.amd?define(["exports"],i):(s=typeof globalThis<"u"?globalThis:s||self,i(s["@flexilla/dismissible"]={}))})(this,function(s){"use strict";var h=Object.defineProperty;var b=(s,i,o)=>i in s?h(s,i,{enumerable:!0,configurable:!0,writable:!0,value:o}):s[i]=o;var n=(s,i,o)=>(b(s,typeof i!="symbol"?i+"":i,o),o);const i=(d,e=document.body)=>e.querySelector(d),o=(d,e=document.body)=>Array.from(e.querySelectorAll(d)),a=({element:d,callback:e})=>{const t=getComputedStyle(d).transition;t!=="none"&&t!==""&&t!=="all 0s ease 0s"?d.addEventListener("transitionend",function l(){d.removeEventListener("transitionend",l),e()},{once:!0}):e()},m=class m{constructor(e,t,l){n(this,"dismissibleElement");n(this,"dismissButtons");n(this,"action");n(this,"onDismiss");n(this,"hideFromScreen",()=>{var e;this.dismissibleElement.style.display="none",(e=this.onDismiss)==null||e.call(this)});n(this,"removeFromDom",()=>{var e,t;(e=this.onDismiss)==null||e.call(this),(t=this.dismissibleElement.parentNode)==null||t.removeChild(this.dismissibleElement)});n(this,"dismiss",()=>{switch(this.action){case"hide-from-screen":this.dismissibleElement.setAttribute("aria-hidden","true"),a({element:this.dismissibleElement,callback:this.hideFromScreen});break;default:this.dismissibleElement.setAttribute("data-hidden",""),this.dismissibleElement.setAttribute("aria-hidden","true"),a({element:this.dismissibleElement,callback:this.removeFromDom});break}});const c=typeof e=="string"?i(e,document.body):e;if(!(c instanceof HTMLElement))throw new Error("Provided Element not a valid HTMLElement");this.dismissibleElement=c,this.action=t||this.dismissibleElement.dataset.action||"hide-from-screen",this.dismissButtons=o("[data-dismiss-btn]",this.dismissibleElement),this.onDismiss=l,this.dismissibleElement.setAttribute("aria-hidden","false"),this.init()}init(){for(const e of this.dismissButtons)e.addEventListener("click",this.dismiss)}};n(m,"autoInit",(e="[data-fx-dismissible]")=>{const t=o(e);for(const l of t)new m(l)});let r=m;s.Dismissible=r,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});
package/dist/index.d.ts CHANGED
@@ -3,17 +3,22 @@ export declare class Dismissible {
3
3
  private dismissButtons;
4
4
  private action;
5
5
  private onDismiss;
6
- constructor({ dismissibleElement, action, onDissmiss }: DismissibleParams);
6
+ /**
7
+ * Dismissible Component
8
+ * @param dismissible
9
+ * @param action
10
+ * @param onDissmiss
11
+ */
12
+ constructor(dismissible: string | HTMLElement, action?: "remove-from-dom" | "hide-from-screen", onDissmiss?: () => void);
7
13
  private hideFromScreen;
8
14
  private removeFromDom;
9
15
  dismiss: () => void;
10
16
  private init;
17
+ /**
18
+ * auto init Dismissible Element based on the selector provided
19
+ * @param selector {string} default is [data-fx-dismissible]
20
+ */
21
+ static autoInit: (selector?: string) => void;
11
22
  }
12
23
 
13
- export declare type DismissibleParams = {
14
- dismissibleElement: HTMLElement;
15
- action?: "remove-from-dom" | "hide-from-screen";
16
- onDissmiss?: () => void;
17
- };
18
-
19
24
  export { }
package/package.json CHANGED
@@ -1,67 +1,68 @@
1
- {
2
- "name": "@flexilla/dismissible",
3
- "private": false,
4
- "version": "1.1.1",
5
- "type": "module",
6
- "description": "A lightweight JavaScript component that automatically makes a component dismissible for easy user interaction.",
7
- "publishConfig": {
8
- "access": "public"
9
- },
10
- "main": "./dist/dismissible.umd.js",
11
- "module": "./dist/dismissible.js",
12
- "types": "./dist/index.d.ts",
13
- "exports": {
14
- ".": {
15
- "import": {
16
- "types": "./dist/index.d.ts",
17
- "default": "./dist/dismissible.js"
18
- },
19
- "require": {
20
- "types": "./dist/index.d.ts",
21
- "default": "./dist/dismissible.umd.js"
22
- }
23
- }
24
- },
25
- "files": [
26
- "dist",
27
- "README.md",
28
- "package.json",
29
- "!vite.config.ts",
30
- "!.gitignore",
31
- "!tsconfig.json",
32
- "!biome.js"
33
- ],
34
- "scripts": {
35
- "dev": "vite",
36
- "build": "tsc && vite build",
37
- "preview": "vite preview",
38
- "format": "biome format --write ./src"
39
- },
40
- "devDependencies": {
41
- "@biomejs/biome": "1.5.1",
42
- "@flexilla/utilities": "latest",
43
- "typescript": "^5.2.2",
44
- "vite": "^5.0.8",
45
- "vite-plugin-dts": "^3.7.0"
46
- },
47
- "keywords": [
48
- "dismissible",
49
- "remove-element",
50
- "js",
51
- "ts",
52
- "component",
53
- "interactive",
54
- "intercative component",
55
- "flexilla"
56
- ],
57
- "homepage": "",
58
- "repository": {
59
- "type": "git",
60
- "url": "https://github.com/unify-ui-dev/flexilla"
61
- },
62
- "bugs": {
63
- "url": "https://github.com/unify-ui-dev/flexilla/issues"
64
- },
65
- "license": "MIT",
66
- "author": "johnkat-mj"
67
- }
1
+ {
2
+ "name": "@flexilla/dismissible",
3
+ "private": false,
4
+ "version": "2.0.1",
5
+ "type": "module",
6
+ "description": "A lightweight JavaScript component that automatically makes a component dismissible for easy user interaction.",
7
+ "publishConfig": {
8
+ "access": "public"
9
+ },
10
+ "main": "./dist/dismissible.umd.js",
11
+ "module": "./dist/dismissible.js",
12
+ "types": "./dist/index.d.ts",
13
+ "exports": {
14
+ ".": {
15
+ "import": {
16
+ "types": "./dist/index.d.ts",
17
+ "default": "./dist/dismissible.js"
18
+ },
19
+ "require": {
20
+ "types": "./dist/index.d.ts",
21
+ "default": "./dist/dismissible.umd.js"
22
+ }
23
+ }
24
+ },
25
+ "files": [
26
+ "dist",
27
+ "README.md",
28
+ "package.json",
29
+ "!vite.config.ts",
30
+ "!.gitignore",
31
+ "!tsconfig.json",
32
+ "!biome.js"
33
+ ],
34
+ "scripts": {
35
+ "dev": "vite",
36
+ "build": "tsc && vite build",
37
+ "preview": "vite preview",
38
+ "format": "biome format --write ./src"
39
+ },
40
+ "devDependencies": {
41
+ "@biomejs/biome": "1.5.1",
42
+ "@flexilla/utilities": "latest",
43
+ "typescript": "^5.2.2",
44
+ "vite": "^5.0.8",
45
+ "vite-plugin-dts": "^3.7.0"
46
+ },
47
+ "keywords": [
48
+ "dismissible",
49
+ "remove-element",
50
+ "js",
51
+ "ts",
52
+ "component",
53
+ "interactive",
54
+ "intercative component",
55
+ "flexilla"
56
+ ],
57
+ "homepage": "",
58
+ "repository": {
59
+ "type": "git",
60
+ "url": "https://github.com/unify-ui-dev/flexilla"
61
+ },
62
+ "bugs": {
63
+ "url": "https://github.com/unify-ui-dev/flexilla/issues"
64
+ },
65
+ "license": "MIT",
66
+ "author": "johnkat-mj",
67
+ "gitHead": "8435693ee1ff8e2f9d279b5d4026949530d7d05d"
68
+ }