@daracl/form 0.0.2 → 0.0.4

package/dist/index.html

@@ -4,7 +4,7 @@
 <head>
   <meta charset="utf-8" />
   <title>Dara Form</title>
-<script defer src="daracl.form.js"></script></head>
+</head>
 
 <body>
   <div class="header">
@@ -30,7 +30,7 @@
     <form id="formArea" class="test-form aaa-test"></form>
 
   </div>
-</body>
+<script src="daracl.form.js"></script></body>
 
 </html>
 <style>
@@ -58,7 +58,7 @@
     color: var(--bg-color);
   }
 </style>
-<script type="module">
+<script>
 
   const THEME_KEY = "form-theme";
   const theme = localStorage.getItem(THEME_KEY);
@@ -404,7 +404,7 @@
   var formObj = {
     load: () => {
       // formBuilder = loginForm;
-      formBuilder = new DaraForm(document.getElementById("formArea"), formInfo);
+      formBuilder = Daracl.form.create(document.getElementById("formArea"), formInfo);
     },
     addItem: () => {
       rowIdx += 1;

package/dist/index.js

@@ -2505,6 +2505,7 @@ var init_dist = __esm({
           mode: "date",
           enableTodayBtn: true,
           showMonthAfterYear: false,
+          isPositionFixed: false,
           format: "",
           zIndex: 1e3,
           minDate: "",
@@ -2853,14 +2854,21 @@ var init_dist = __esm({
             const rect = this.targetElement.getBoundingClientRect();
             const scrollTop = window.scrollY || document.documentElement.scrollTop;
             const scrollLeft = window.scrollX || document.documentElement.scrollLeft;
-            const offsetTop = rect.top + scrollTop;
-            let top = offsetTop + this.targetElement.offsetHeight + 2;
-            const left = rect.left + scrollLeft;
-            if (top + this.datetimeElement.offsetHeight > docSize.clientHeight) {
-              const newTop = offsetTop - (this.datetimeElement.offsetHeight + 2);
-              top = newTop > 0 ? newTop : top;
+            const elementHeight = this.datetimeElement.offsetHeight;
+            const targetElementHeight = this.targetElement.offsetHeight + 2;
+            let left = rect.left + scrollLeft;
+            let top = 0;
+            if (this.options.isPositionFixed) {
+              top = rect.top + targetElementHeight;
+              left = rect.left;
+            } else {
+              if (rect.top + targetElementHeight + elementHeight > docSize.clientHeight && rect.top >= elementHeight) {
+                top = scrollTop + rect.top - elementHeight - 2;
+              } else {
+                top = scrollTop + rect.top + targetElementHeight;
+              }
             }
-            this.datetimeElement.setAttribute("style", `top:${top}px;left:${left}px;z-index:${this.options.zIndex}`);
+            this.datetimeElement.setAttribute("style", `${this.options.isPositionFixed ? "position:fixed;" : ""}top:${top}px;left:${left}px;z-index:${this.options.zIndex}`);
             document.addEventListener("click", this._documentClickEvent);
           }
           /**