@alexochihua/exos-library-components 2.2.0 → 2.2.2

package/dist/style.css

@@ -1474,6 +1474,62 @@ video {
   line-height: 1.25rem;
 }
 
+.e-select__inputSuggestLabel {
+  position: absolute;
+  top: 0px;
+  display: flex;
+  height: 100%;
+  align-items: center;
+  padding-left: 0.75rem;
+}
+
+.e-select__inputSuggestLabel-suggest {
+  position: absolute;
+  top: 0.375rem;
+  inset-inline-start: 0.25rem;
+  z-index: 0;
+  transform-origin: 0;
+  --tw-translate-y: -1rem;
+  --tw-scale-x: .65;
+  --tw-scale-y: .65;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.e-select__inputSuggestLabel-selected {
+  position: absolute;
+  top: 0.375rem;
+  inset-inline-start: 0.25rem;
+  z-index: 0;
+  transform-origin: 0;
+  --tw-translate-y: -1rem;
+  --tw-scale-x: .65;
+  --tw-scale-y: .65;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  transition-duration: 300ms;
+}
+
+.exos-peer:-moz-placeholder-shown ~ .e-select__inputSuggestLabel-selected {
+  top: 50%;
+  --tw-translate-y: -50%;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.exos-peer:placeholder-shown ~ .e-select__inputSuggestLabel-selected {
+  top: 50%;
+  --tw-translate-y: -50%;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+:is([dir="rtl"] .e-select__inputSuggestLabel-selected) {
+  left: auto;
+  --tw-translate-x: 25%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .e-select-label {
   position: absolute;
   top: 0.375rem;
@@ -1801,6 +1857,70 @@ video {
   background-color: var(--color-field-dark);
 }
 
+.e-radio__mainContainer {
+  display: flex;
+  align-items: center;
+}
+
+.e-radio__mainClass {
+  height: 1rem;
+  width: 1rem;
+  cursor: pointer;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  border-radius: 9999px;
+}
+
+.e-radio__mainClass.exos-disabled {
+  cursor: not-allowed;
+}
+
+.e-radio__mainClass-disabled:disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+.e-radio__color-checked:checked {
+  background-color: var(--color-secondary);
+}
+
+.e-radio__color-unchecked {
+  background-color: var(--color-field-light);
+}
+
+.e-radio__ring-checked:checked {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+
+.e-radio__ringColor-checked:checked {
+  --tw-ring-color: var(--color-secondary);
+}
+
+.e-radio__border {
+  border-width: 2px;
+}
+
+.e-radio__borderColor-checked:checked {
+  --tw-border-opacity: 1;
+  border-color: rgb(255 255 255 / var(--tw-border-opacity));
+}
+
+.e-radio__borderColor-unchecked {
+  --tw-border-opacity: 1;
+  border-color: rgb(156 163 175 / var(--tw-border-opacity));
+}
+
+.e-radio__iconColor-checked {
+  color: var(--color-secondary);
+}
+
+.e-radio__iconColor-unchecked {
+  color: var(--color-secondary);
+}
+
 /*  =====  utilities  =====  */
 
 .exos-sr-only {
@@ -2183,6 +2303,10 @@ video {
   width: 50%;
 }
 
+.exos-w-10 {
+  width: 2.5rem;
+}
+
 .exos-w-11 {
   width: 2.75rem;
 }
@@ -2195,6 +2319,10 @@ video {
   width: 0.5rem;
 }
 
+.exos-w-20 {
+  width: 5rem;
+}
+
 .exos-w-4 {
   width: 1rem;
 }
@@ -3261,10 +3389,20 @@ video {
   color: rgb(55 65 81 / var(--tw-text-opacity));
 }
 
+.exos-text-green-500 {
+  --tw-text-opacity: 1;
+  color: rgb(34 197 94 / var(--tw-text-opacity));
+}
+
 .exos-text-primary {
   color: var(--color-primary);
 }
 
+.exos-text-red-500 {
+  --tw-text-opacity: 1;
+  color: rgb(239 68 68 / var(--tw-text-opacity));
+}
+
 .exos-text-secondary {
   color: var(--color-secondary);
 }
@@ -3479,6 +3617,27 @@ video {
   content: var(--tw-content);
 }
 
+.checked\:exos-border-green-500:checked {
+  --tw-border-opacity: 1;
+  border-color: rgb(34 197 94 / var(--tw-border-opacity));
+}
+
+.checked\:exos-bg-yellow-500:checked {
+  --tw-bg-opacity: 1;
+  background-color: rgb(234 179 8 / var(--tw-bg-opacity));
+}
+
+.checked\:exos-ring-2:checked {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+
+.checked\:exos-ring-red-500:checked {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity));
+}
+
 .hover\:exos-scale-105:hover {
   --tw-scale-x: 1.05;
   --tw-scale-y: 1.05;
@@ -3617,10 +3776,20 @@ video {
   border-width: 2px;
 }
 
+.disabled\:exos-border-green-500:disabled {
+  --tw-border-opacity: 1;
+  border-color: rgb(34 197 94 / var(--tw-border-opacity));
+}
+
 .disabled\:exos-border-secondary:disabled {
   border-color: var(--color-secondary);
 }
 
+.disabled\:exos-bg-green-300:disabled {
+  --tw-bg-opacity: 1;
+  background-color: rgb(134 239 172 / var(--tw-bg-opacity));
+}
+
 .disabled\:exos-bg-white:disabled {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
@@ -3630,6 +3799,10 @@ video {
   color: var(--color-secondary);
 }
 
+.disabled\:exos-opacity-40:disabled {
+  opacity: 0.4;
+}
+
 .disabled\:exos-opacity-60:disabled {
   opacity: 0.6;
 }
@@ -3926,6 +4099,11 @@ video {
   background-color: var(--color-field-dark);
 }
 
+:is(.exos-dark .dark\:disabled\:exos-bg-gray-500:disabled) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(107 114 128 / var(--tw-bg-opacity));
+}
+
 @media not all and (min-width: 1280px) {
   .max-md\:exos-min-h-\[84vh\] {
     min-height: 84vh;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alexochihua/exos-library-components",
-  "version": "2.2.0",
+  "version": "2.2.2",
   "description": "## Componentes base Vue 3 y Tailwind",
   "author": "Exos",
   "scripts": {