@pushword/js-helper 0.0.132 → 0.0.136

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushword/js-helper",
-  "version": "0.0.132",
+  "version": "0.0.136",
   "description": "Pushword front end helpers. ",
   "author": "Robin@PiedWeb <contact@piedweb.com>",
   "license": "MIT",

package/src/app.css

@@ -5,7 +5,7 @@
 @import './utility.css'; /* node_modules/@pushword/js-helper/src/utility.css */
 /* @plugin "@tailwindcss/forms"; */
 
-@import './../node_modules/glightbox/dist/css/glightbox.css';
+@import 'glightbox/dist/css/glightbox.css';
 
 /*
 Tailwind content sources for all packages

package/src/app.js

@@ -37,5 +37,5 @@ function onPageLoaded() {
   onDomChanged()
 }
 
-document.addEventListener('DOMContentLoaded', onPageLoaded())
+document.addEventListener('DOMContentLoaded', onPageLoaded)
 document.addEventListener('DOMChanged', onDomChanged)

package/src/clickable.js

@@ -14,7 +14,10 @@ export async function clickable(element) {
   }
 
   if (link) {
-    if (window.location.pathname.replace(/^\//, '') == link.pathname.replace(/^\//, '') && window.location.hostname == link.hostname) {
+    if (
+      window.location.pathname.replace(/^\//, '') == link.pathname.replace(/^\//, '') &&
+      window.location.hostname == link.hostname
+    ) {
       if (typeof smoothScroll === 'function') {
         smoothScroll(link)
       }
@@ -41,7 +44,7 @@ export async function clickable(element) {
 export function allClickable(selector) {
   document.querySelectorAll(selector).forEach(function (item) {
     item.addEventListener('click', function (event) {
-      if (event.ctrlKey || event.metaKey) return
+      if (event.ctrlKey || event.metaKey || event.button === 2) return
       clickable(item)
     })
   })
@@ -54,9 +57,16 @@ export function allClickable(selector) {
  * @param {Object}  link
  */
 export function smoothScroll(link, event = null) {
-  if (location.pathname.replace(/^\//, '') == link.pathname.replace(/^\//, '') && location.hostname == link.hostname && link.hash != '') {
+  if (
+    location.pathname.replace(/^\//, '') == link.pathname.replace(/^\//, '') &&
+    location.hostname == link.hostname &&
+    link.hash != ''
+  ) {
     var target = document.querySelector(link.hash)
-    target = target !== null ? target : document.querySelector('[name=' + link.hash.slice(1) + ']')
+    target =
+      target !== null
+        ? target
+        : document.querySelector('[name=' + link.hash.slice(1) + ']')
     if (target !== null) {
       if (event !== null) event.preventDefault()
       window.scrollTo({

package/src/helpers.js

@@ -68,6 +68,8 @@ export function liveBlock(liveBlockAttribute = 'live', liveFormSelector = '.live
   }
 
   var sendForm = function (form, liveFormBlock) {
+    if (liveFormBlock.dataset.submitting) return
+    liveFormBlock.dataset.submitting = '1'
     setLoader(form)
 
     var formData = new FormData(form.srcElement)
@@ -244,7 +246,7 @@ export async function uncloakLinks(
   var convertLink = function (element) {
     // fix "bug" with img
     if (element.getAttribute(attribute) === null) {
-      var element = element.closest('[' + attribute + ']')
+      element = element.closest('[' + attribute + ']')
     }
     if (element === null || element.getAttribute(attribute) === null) return
     var link = document.createElement('a')

package/src/tailwind.prose.scss

@@ -31,6 +31,11 @@
   color: #fff !important;
 }
 
+.link-btn:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 2px white, 0 0 0 4px var(--primary);
+}
+
 .link-btn-outline {
   padding: 6px 12px;
   margin-bottom: 0;
@@ -48,6 +53,11 @@
   background-color: var(--primary);
 }
 
+.link-btn-outline:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 2px white, 0 0 0 4px var(--primary);
+}
+
 /**
  * Some smoothiness
  */

package/src/utility.css

@@ -39,6 +39,11 @@
   justify-content: safe center;
 }
 
+/* Prevent prose from overflowing viewport on small screens */
+.prose {
+  max-width: min(65ch, 100%);
+}
+
 /* Typography customization */
 .prose a:not(.not-prose a),
 .prose span[data-rot]:not(.not-prose span[data-rot]),