@unlk/keymaster 1.6.3 → 1.6.4

package/dist/js/keymaster.js

@@ -1,5 +1,5 @@
 /*!
-  * Unlock Keymaster v1.6.3 (https://keymaster.unlock.com)
+  * Unlock Keymaster v1.6.4 (https://keymaster.unlock.com)
   * Copyright 2022-2026 Unlk Developers
   */
 (function (global, factory) {

package/dist/js/keymaster.min.js

@@ -1,5 +1,5 @@
 /*!
-  * Unlock Keymaster v1.6.3 (https://keymaster.unlock.com)
+  * Unlock Keymaster v1.6.4 (https://keymaster.unlock.com)
   * Copyright 2022-2026 Unlk Developers
   */
 !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).keymaster={})}(this,function(e){"use strict";function t(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}function n(e){if(Object.prototype.hasOwnProperty.call(e,"__esModule"))return e;var t=e.default;if("function"==typeof t){var n=function e(){var n=!1;try{n=this instanceof e}catch{}return n?Reflect.construct(t,arguments,this.constructor):t.apply(this,arguments)};n.prototype=t.prototype}else n={};return Object.defineProperty(n,"__esModule",{value:!0}),Object.keys(e).forEach(function(t){var i=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,i.get?i:{enumerable:!0,get:function(){return e[t]}})}),n}var i,s={exports:{}},o={exports:{}},r={exports:{}};function a(){return i||(i=1,function(e){e.exports=function(){const e=new Map,t={set(t,n,i){e.has(t)||e.set(t,new Map);const s=e.get(t);(s.has(n)||0===s.size)&&s.set(n,i)},get:(t,n)=>e.has(t)&&e.get(t).get(n)||null,remove(t,n){if(!e.has(t))return;const i=e.get(t);i.delete(n),0===i.size&&e.delete(t)}};return t}()}(r)),r.exports}var l,c={exports:{}},u={exports:{}};function d(){return l||(l=1,function(e,t){!function(e){const t=1e6,n=1e3,i="transitionend",s=e=>(e&&window.CSS&&window.CSS.escape&&(e=e.replace(/#([^\s"#']+)/g,(e,t)=>`#${CSS.escape(t)}`)),e),o=e=>null==e?`${e}`:Object.prototype.toString.call(e).match(/\s([a-z]+)/i)[1].toLowerCase(),r=e=>{do{e+=Math.floor(Math.random()*t)}while(document.getElementById(e));return e},a=e=>{if(!e)return 0;let{transitionDuration:t,transitionDelay:i}=window.getComputedStyle(e);const s=Number.parseFloat(t),o=Number.parseFloat(i);return s||o?(t=t.split(",")[0],i=i.split(",")[0],(Number.parseFloat(t)+Number.parseFloat(i))*n):0},l=e=>{e.dispatchEvent(new Event(i))},c=e=>!(!e||"object"!=typeof e)&&(void 0!==e.jquery&&(e=e[0]),void 0!==e.nodeType),u=e=>c(e)?e.jquery?e[0]:e:"string"==typeof e&&e.length>0?document.querySelector(s(e)):null,d=e=>{if(!c(e)||0===e.getClientRects().length)return!1;const t="visible"===getComputedStyle(e).getPropertyValue("visibility"),n=e.closest("details:not([open])");if(!n)return t;if(n!==e){const t=e.closest("summary");if(t&&t.parentNode!==n)return!1;if(null===t)return!1}return t},h=e=>!e||e.nodeType!==Node.ELEMENT_NODE||!!e.classList.contains("disabled")||(void 0!==e.disabled?e.disabled:e.hasAttribute("disabled")&&"false"!==e.getAttribute("disabled")),f=e=>{if(!document.documentElement.attachShadow)return null;if("function"==typeof e.getRootNode){const t=e.getRootNode();return t instanceof ShadowRoot?t:null}return e instanceof ShadowRoot?e:e.parentNode?f(e.parentNode):null},p=()=>{},g=e=>{e.offsetHeight},m=()=>window.jQuery&&!document.body.hasAttribute("data-bs-no-jquery")?window.jQuery:null,_=[],b=e=>{"loading"===document.readyState?(_.length||document.addEventListener("DOMContentLoaded",()=>{for(const e of _)e()}),_.push(e)):e()},v=()=>"rtl"===document.documentElement.dir,y=e=>{b(()=>{const t=m();if(t){const n=e.NAME,i=t.fn[n];t.fn[n]=e.jQueryInterface,t.fn[n].Constructor=e,t.fn[n].noConflict=()=>(t.fn[n]=i,e.jQueryInterface)}})},w=(e,t=[],n=e)=>"function"==typeof e?e.call(...t):n,E=(e,t,n=!0)=>{if(!n)return void w(e);const s=5,o=a(t)+s;let r=!1;const c=({target:n})=>{n===t&&(r=!0,t.removeEventListener(i,c),w(e))};t.addEventListener(i,c),setTimeout(()=>{r||l(t)},o)},A=(e,t,n,i)=>{const s=e.length;let o=e.indexOf(t);return-1===o?!n&&i?e[s-1]:e[0]:(o+=n?1:-1,i&&(o=(o+s)%s),e[Math.max(0,Math.min(o,s-1))])};e.defineJQueryPlugin=y,e.execute=w,e.executeAfterTransition=E,e.findShadowRoot=f,e.getElement=u,e.getNextActiveElement=A,e.getTransitionDurationFromElement=a,e.getUID=r,e.getjQuery=m,e.isDisabled=h,e.isElement=c,e.isRTL=v,e.isVisible=d,e.noop=p,e.onDOMContentLoaded=b,e.parseSelector=s,e.reflow=g,e.toType=o,e.triggerTransitionEnd=l,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}(t)}(0,u.exports)),u.exports}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unlk/keymaster",
-  "version": "1.6.3",
+  "version": "1.6.4",
   "publishConfig": {
     "access": "public"
   },

package/scss/theme/_buttons.scss

@@ -4,15 +4,15 @@
   align-items: center;
 
   // Icon on the left, add margin to its right
-  > i:first-child,
-  > .icon:first-child {
+  > i:first-child:not(:only-child),
+  > .icon:first-child:not(:only-child) {
     width: fit-content;
     margin-right: $spacer * .5;
   }
 
   // Icon on the right, add margin to its left
-  > i:last-child,
-  > .icon:last-child {
+  > i:last-child:not(:only-child),
+  > .icon:last-child:not(:only-child) {
     width: fit-content;
     margin-left: $spacer * .5;
   }
@@ -30,27 +30,29 @@
   }
   .btn-#{$color} {
     @if $color == "secondary" {
-      @include button-variant(
+      @include custom-button-variant(
         $value,
         $value,
         $hover-background: tint-color($value, $btn-hover-bg-shade-amount),
         $hover-border: tint-color($value, $btn-hover-border-shade-amount),
         $active-background: tint-color($value, $btn-active-bg-shade-amount),
         $active-border: tint-color($value, $btn-active-border-shade-amount),
-        $disabled-color: $gray-900
+
       );
     } @else {
-      @include button-variant(
+      @include custom-button-variant(
         $value,
         $value,
         $hover-background: shade-color($value, $btn-hover-bg-shade-amount),
         $hover-border: shade-color($value, $btn-hover-border-shade-amount),
         $active-background: shade-color($value, $btn-active-bg-shade-amount),
         $active-border: shade-color($value, $btn-active-border-shade-amount),
-        $disabled-color: $white
       );
     }
   }
+  .btn-outline-#{$color} {
+    @include custom-button-outline-variant($value);
+  }
   .btn-icon-#{$color} {
     @if $color == "secondary" {
       @include button-icon-variant(
@@ -69,7 +71,6 @@
         $hover-border: shade-color($value, $btn-hover-border-shade-amount),
         $active-background: shade-color($value, $btn-active-bg-shade-amount),
         $active-border: shade-color($value, $btn-active-border-shade-amount),
-        $disabled-color: $white
       );
     }
   }
@@ -87,7 +88,6 @@
 
 [class*="btn-icon-"],
 [class*="btn-icon-outline-"] {
-
   &.btn-sm {
     width: rfs-value(32px);
     height: rfs-value(32px);
@@ -100,6 +100,7 @@
     height: rfs-value(48px);
   }
 }
+
 .btn-sm {
   > i:first-child,
   > .icon:first-child {

package/scss/theme/_variables-overrides.scss

@@ -382,6 +382,7 @@ $btn-active-bg-shade-amount: 40% !default;
 $btn-active-bg-tint-amount: 20% !default;
 $btn-active-border-shade-amount: 40% !default;
 $btn-active-border-tint-amount: 10% !default;
+$btn-disabled-opacity: 1 !default;
 
 // Border Radius
 $border-radius: .5rem !default;

package/scss/theme/_version.scss

@@ -1,2 +1,2 @@
 // GENERATED FILE – do not edit manually
-$km-version: "1.6.3" !default;
+$km-version: "1.6.4" !default;

package/scss/theme/mixins/_buttons.scss

@@ -1,5 +1,4 @@
-// scss-docs-start btn-variant-mixin
-@mixin button-variant(
+@mixin custom-button-variant(
   $background,
   $border,
   $color: color-contrast($background),
@@ -9,9 +8,9 @@
   $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
   $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
   $active-color: color-contrast($active-background),
-  $disabled-background: rgba($background, 1),
-  $disabled-border: rgba($border, 1),
-  $disabled-color: color-contrast($disabled-background)
+  $disabled-background: $gray-200,
+  $disabled-border: $gray-200,
+  $disabled-color: $gray-400
 ) {
   --#{$prefix}btn-color: #{$color};
   --#{$prefix}btn-bg: #{$background};
@@ -28,7 +27,35 @@
   --#{$prefix}btn-disabled-bg: #{$disabled-background};
   --#{$prefix}btn-disabled-border-color: #{$disabled-border};
 }
-// scss-docs-end btn-variant-mixin
+
+@mixin custom-button-outline-variant(
+  $color,
+  $btn-color: $color,
+  $btn-border: $color,
+  $color-hover: $color,
+  $hover-background: tint-color($color, 90%),
+  $hover-border: $color,
+  $active-background: shade-color($color, 20%),
+  $active-border: shade-color($color, 20%),
+  $active-color: color-contrast($active-background),
+  $disabled-color: $gray-400,
+  $disabled-border: $gray-200,
+) {
+  --#{$prefix}btn-color: #{$btn-color};
+  --#{$prefix}btn-border-color: #{$btn-border};
+  --#{$prefix}btn-hover-color: #{$color-hover};
+  --#{$prefix}btn-hover-bg: #{$hover-background};
+  --#{$prefix}btn-hover-border-color: #{$hover-border};
+  --#{$prefix}btn-focus-shadow-rgb: #{to-rgb($color)};
+  --#{$prefix}btn-active-color: #{$active-color};
+  --#{$prefix}btn-active-bg: #{$active-background};
+  --#{$prefix}btn-active-border-color: #{$active-border};
+  --#{$prefix}btn-active-shadow: #{$btn-active-box-shadow};
+  --#{$prefix}btn-disabled-color: #{$disabled-color};
+  --#{$prefix}btn-disabled-bg: transparent;
+  --#{$prefix}btn-disabled-border-color: #{$disabled-border};
+  --#{$prefix}gradient: none;
+}
 
 @mixin button-link-variant(
   $color,
@@ -37,7 +64,7 @@
   $active-background: shade-color($color, 20%),
   $active-border: $color,
   $active-color: $white,
-  $disabled-color: $gray-300
+  $disabled-color: $gray-400
 ) {
   --#{$prefix}btn-color: #{$btn-color};
   --#{$prefix}btn-bg: transparent;
@@ -65,9 +92,9 @@
   $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
   $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
   $active-color: color-contrast($active-background),
-  $disabled-background: rgba($background, 1),
-  $disabled-border: rgba($border, 1),
-  $disabled-color: color-contrast($disabled-background)
+  $disabled-background: $gray-200,
+  $disabled-border: $gray-200,
+  $disabled-color: $gray-400,
 ) {
   width: rfs-value(40px);
   height: rfs-value(40px);
@@ -100,8 +127,8 @@
   $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
   $active-color: color-contrast($active-background),
   $disabled-background: transparent,
-  $disabled-border: rgba($border, 1),
-  $disabled-color: rgba($color, 1)
+  $disabled-border: $gray-200,
+  $disabled-color: $gray-400
 ) {
   width: rfs-value(40px);
   height: rfs-value(40px);