@unlk/keymaster 1.5.0 → 1.5.1

package/CHANGELOG.md

@@ -2,6 +2,11 @@
 
 All notable changes to this project will be documented in this file.
 
+## [1.5.1] - 2026-04-27
+
+### Add
+- Encapsulated Checkbox and Radio
+
 ## [1.5.0] - 2026-04-24
 
 ### Update

package/dist/css/keymaster.css

@@ -21866,7 +21866,7 @@
 }
 
 /*!
- * Keymaster  v1.5.0 (https://keymaster.unlock.com)
+ * Keymaster  v1.5.1 (https://keymaster.unlock.com)
  * Copyright 2022-2025 Unlk Developers
  * Licensed under MIT
  */
@@ -37051,6 +37051,20 @@ textarea.form-control-lg {
   border-color: var(--bs-form-valid-color);
 }
 
+.was-validated .form-check-encapsulated .form-check-input:valid ~ .form-check-label, .form-check-encapsulated .form-check-input.is-valid ~ .form-check-label {
+  border-color: var(--bs-form-valid-color);
+}
+.was-validated .form-check-encapsulated .form-check-input:valid:focus-visible ~ .form-check-label, .form-check-encapsulated .form-check-input.is-valid:focus-visible ~ .form-check-label {
+  box-shadow: var(--bs-box-shadow-inset), 0 0 0 0.0625rem var(--bs-form-valid-color);
+}
+.was-validated .form-check-encapsulated .form-check-input:valid:checked ~ .form-check-label, .form-check-encapsulated .form-check-input.is-valid:checked ~ .form-check-label {
+  border-color: var(--bs-form-valid-color);
+  box-shadow: 0 0 0 0.0625rem var(--bs-form-valid-color);
+}
+.was-validated .form-check-encapsulated .form-check-input:valid:checked:focus-visible ~ .form-check-label, .form-check-encapsulated .form-check-input.is-valid:checked:focus-visible ~ .form-check-label {
+  box-shadow: var(--bs-box-shadow-inset), 0 0 0 0.0625rem var(--bs-form-valid-color);
+}
+
 .was-validated .form-check.form-check-tiled > .form-check-input:invalid ~ .form-check-label, .form-check.form-check-tiled > .form-check-input.is-invalid ~ .form-check-label {
   color: var(--bs-body-color);
   border-color: var(--bs-form-invalid-color);
@@ -37060,6 +37074,20 @@ textarea.form-control-lg {
   border-color: var(--bs-form-invalid-color);
 }
 
+.was-validated .form-check-encapsulated .form-check-input:invalid ~ .form-check-label, .form-check-encapsulated .form-check-input.is-invalid ~ .form-check-label {
+  border-color: var(--bs-form-invalid-color);
+}
+.was-validated .form-check-encapsulated .form-check-input:invalid:focus-visible ~ .form-check-label, .form-check-encapsulated .form-check-input.is-invalid:focus-visible ~ .form-check-label {
+  box-shadow: var(--bs-box-shadow-inset), 0 0 0 0.0625rem var(--bs-form-invalid-color);
+}
+.was-validated .form-check-encapsulated .form-check-input:invalid:checked ~ .form-check-label, .form-check-encapsulated .form-check-input.is-invalid:checked ~ .form-check-label {
+  border-color: var(--bs-form-invalid-color);
+  box-shadow: 0 0 0 0.0625rem var(--bs-form-invalid-color);
+}
+.was-validated .form-check-encapsulated .form-check-input:invalid:checked:focus-visible ~ .form-check-label, .form-check-encapsulated .form-check-input.is-invalid:checked:focus-visible ~ .form-check-label {
+  box-shadow: var(--bs-box-shadow-inset), 0 0 0 0.0625rem var(--bs-form-invalid-color);
+}
+
 .form-control {
   box-shadow: none;
 }
@@ -37148,6 +37176,57 @@ textarea.form-control-lg {
   transform: scale(1);
 }
 
+.form-check-encapsulated {
+  padding: revert;
+}
+.form-check-encapsulated .form-check-input {
+  position: absolute;
+  width: 1.5em;
+  height: 1.5em;
+  margin-top: 0.9375em;
+  margin-left: 1em;
+  cursor: pointer;
+}
+.form-check-encapsulated .form-check-input:focus-visible {
+  outline: 0;
+  box-shadow: none;
+}
+.form-check-encapsulated .form-check-input:focus-visible ~ .form-check-label {
+  box-shadow: var(--bs-box-shadow-inset), 0 0 0 0.25rem rgba(0, 34, 255, 0.25);
+}
+.form-check-encapsulated .form-check-input:checked:focus-visible {
+  outline: 0;
+  box-shadow: none;
+}
+.form-check-encapsulated .form-check-input:checked:focus-visible ~ .form-check-label {
+  box-shadow: var(--bs-box-shadow-inset), 0 0 0 0.25rem rgba(0, 34, 255, 0.25);
+}
+.form-check-encapsulated .form-check-input:checked ~ .form-check-label {
+  border-color: #02f;
+  box-shadow: 0 0 0 0.0625rem #02f;
+}
+.form-check-encapsulated .form-check-input[disabled] ~ .form-check-label:hover, .form-check-encapsulated .form-check-input:disabled ~ .form-check-label:hover {
+  cursor: default;
+  background-color: #fff;
+}
+.form-check-encapsulated .form-check-input[disabled] ~ .form-check-label, .form-check-encapsulated .form-check-input:disabled ~ .form-check-label {
+  border: 0.0625rem solid rgb(208.2, 210.2, 213.8);
+}
+.form-check-encapsulated .form-check-input ~ .form-check-label {
+  width: 100%;
+  padding: 0.8125em 0.8125em 0.8125em 3.125em;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  background: #fff;
+  border: 0.0625rem solid rgb(208.2, 210.2, 213.8);
+  border-radius: var(--bs-border-radius-lg);
+  box-shadow: none;
+}
+.form-check-encapsulated .form-check-input ~ .form-check-label:hover {
+  cursor: pointer;
+  background-color: rgb(229.5, 232.9, 255);
+}
+
 .form-floating > .form-select:not(:focus):has(option[value=""]:checked) {
   text-indent: 100%;
   white-space: nowrap;