- support zmgr for proper z-indexing

- bump version
loadingio · Jun 30, 2022 · 85833a1 · 85833a1
1 parent 6adc167
commit 85833a1
Show file tree

Hide file tree

Showing 7 changed files with 59 additions and 10 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,10 @@
 # Change Logs
 
+## v0.0.9
+
+ - support zmgr for proper z-indexing
+
+
 ## v0.0.8
 
  - proper handle invalid input

diff --git a/README.md b/README.md
@@ -48,6 +48,7 @@ Constructor options:
        - `iy`: suggested y position if mode is `in-place`.
    - by default, mode will be `out-place` with `container` option set.
      - Set `mode` to `fixed` if the container is a fixed element (such as dialog)
+ - `zmgr`: optional. if provided, widget will be auto z-indexing based on this zmgr.
 
 
 ## API

diff --git a/dist/index.js b/dist/index.js
@@ -8,6 +8,7 @@
     this._enabled = {
       time: !(opt.time != null) || opt.time
     };
+    this._zmgr = opt.zmgr || null;
     this._mode = (ref$ = opt.mode) === 'in-place' || ref$ === 'out-place' || ref$ === 'fixed'
       ? opt.mode
       : opt.fixed
@@ -208,7 +209,16 @@
       return this.root.classList.contains('active');
     },
     _toggle: function(v){
-      return this.root.classList.toggle('active', v);
+      var setOn;
+      setOn = v || (!(v != null) && !this.isOn());
+      if (this._zmgr) {
+        if (setOn) {
+          this.root.style.zIndex = this._zmgr.add();
+        } else {
+          this._zmgr.remove(this.root.style.zIndex);
+        }
+      }
+      return this.root.classList.toggle('active', setOn);
     },
     toggle: function(v){
       var c, h, n, hb, cb, ref$, x, y, nscroll, nstack, countScroll, s, stackb, scrollb, scroll, rscroll, _cb, vy, vx, iy, ix;

diff --git a/dist/index.min.js b/dist/index.min.js
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,10 +1,12 @@
 {
   "name": "lddatetimepicker",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "vanilla date/time picker",
   "browser": "dist/index.min.js",
   "main": "dist/index.js",
-  "files": ["dist/**/*"],
+  "files": [
+    "dist/**/*"
+  ],
   "scripts": {
     "start": "npx server -r web -o true"
   },
@@ -13,7 +15,13 @@
     "type": "git",
     "url": "https://github.com/loadingio/lddatetimepicker"
   },
-  "keywords": ["date","time","datetime","datepicker","datetimepicker"],
+  "keywords": [
+    "date",
+    "time",
+    "datetime",
+    "datepicker",
+    "datetimepicker"
+  ],
   "author": "zbryikt",
   "license": "MIT",
   "devDependencies": {
@@ -29,7 +37,8 @@
     "proxise": "^1.0.1",
     "stylus": "^0.57.0",
     "uglify-js": "^3.15.3",
-    "uglifycss": "^0.0.29"
+    "uglifycss": "^0.0.29",
+    "zmgr": "^2.2.3"
   },
   "frontendDependencies": {
     "root": "web/static/assets/lib",
@@ -41,6 +50,7 @@
       "bootstrap",
       "ldcover",
       "ldview",
+      "zmgr",
       "proxise"
     ]
   },

diff --git a/src/index.ls b/src/index.ls
@@ -19,6 +19,7 @@ html = '''
 lddatetimepicker = (opt = {})->
   @opt = opt
   @_enabled = time: !(opt.time?) or opt.time
+  @_zmgr = opt.zmgr or null
   @_mode = if opt.mode in <[in-place out-place fixed]> => opt.mode
   else if opt.fixed => \fixed #legacy
   else if opt.container => \out-place
@@ -147,7 +148,12 @@ lddatetimepicker.prototype = Object.create(Object.prototype) <<< do
   on: (n, cb) -> (if Array.isArray(n) => n else [n]).map (n) ~> @evthdr.[][n].push cb
   fire: (n, ...v) -> for cb in (@evthdr[n] or []) => cb.apply @, v
   is-on: -> @root.classList.contains \active
-  _toggle: (v) -> @root.classList.toggle \active, v
+  _toggle: (v) ->
+    set-on = v or (!(v?) and !@is-on!)
+    if @_zmgr =>
+      if set-on => @root.style.zIndex = @_zmgr.add!
+      else @_zmgr.remove @root.style.zIndex
+    @root.classList.toggle \active, set-on
   toggle: (v) ->
     if arguments.length == 0 => v = !@is-on!
     if !v =>