@macroui/macroui 1.0.27 → 1.0.28

package/dist/macroui.css

@@ -8170,21 +8170,21 @@ to {
   height: var(--el-component-size-default, 40px);
   padding: 0 0.75rem;
   border-radius: var(--el-border-radius-base, 0.5rem);
-  border: 1px solid #d1d5db;
-  background-color: #ffffff;
+  border: 1px solid var(--daisy-base-300, #e5e5e5);
+  background-color: var(--daisy-base-100, #ffffff);
   transition: all 0.2s ease;
-  box-shadow: none;
 }
 
 .el-input__wrapper:hover,
 .input-wrapper:hover {
-  border-color: #9ca3af;
+  border-color: var(--daisy-base-content, #1d1d1f);
 }
 
 .el-input__wrapper:focus-within,
 .input-wrapper:focus-within {
-  border-color: #4d70ff;
-  box-shadow: 0 0 0 2px rgba(77, 112, 255, 0.2);
+  outline: 2px solid var(--daisy-primary, #4d70ff);
+  outline-offset: 2px;
+  border-color: var(--daisy-primary, #4d70ff);
 }
 
 /* Input inner */
@@ -8198,12 +8198,13 @@ to {
   background: transparent;
   font-size: var(--el-font-size-base, 14px);
   font-family: inherit;
-  color: #1f2937;
+  color: var(--daisy-base-content, #1d1d1f);
 }
 
 .el-input__inner::placeholder,
 .input::placeholder {
-  color: #9ca3af;
+  color: var(--daisy-base-content, #1d1d1f);
+  opacity: 0.5;
 }
 
 .el-input__inner:disabled,
@@ -8219,7 +8220,8 @@ to {
 .input-suffix {
   display: inline-flex;
   align-items: center;
-  color: #6b7280;
+  color: var(--daisy-base-content, #1d1d1f);
+  opacity: 0.6;
   flex-shrink: 0;
 }
 
@@ -8235,7 +8237,8 @@ to {
 .input-prefix-inner {
   display: inline-flex;
   align-items: center;
-  color: #6b7280;
+  color: var(--daisy-base-content, #1d1d1f);
+  opacity: 0.6;
   flex-shrink: 0;
   margin-right: 0.5rem;
 }
@@ -8280,15 +8283,27 @@ to {
 
 .el-input.is-disabled .el-input__wrapper,
 .el-input.is-disabled .input-wrapper {
-  background-color: #f3f4f6;
-  border-color: #e5e7eb;
+  background-color: var(--daisy-base-200, #f0f0f0);
+  border-color: var(--daisy-base-200, #f0f0f0);
   opacity: 0.6;
 }
 
 .el-input.is-focus .el-input__wrapper,
 .el-input.is-focus .input-wrapper {
-  border-color: #4d70ff;
-  box-shadow: 0 0 0 2px rgba(77, 112, 255, 0.2);
+  border-color: var(--daisy-primary, #4d70ff);
+  outline: 2px solid var(--daisy-primary, #4d70ff);
+  outline-offset: 2px;
+}
+
+/* With prefix/suffix */
+.el-input__wrapper:has(.el-input__prefix),
+.input-wrapper:has(.input-prefix) {
+  padding-left: 0;
+}
+
+.el-input__wrapper:has(.el-input__suffix),
+.input-wrapper:has(.input-suffix) {
+  padding-right: 0;
 }
 
 /* ============================================
@@ -8307,11 +8322,11 @@ textarea.input {
   min-height: 80px;
   padding: 0.5rem 0.75rem;
   border-radius: var(--el-border-radius-base, 0.5rem);
-  border: 1px solid #d1d5db;
-  background-color: #ffffff;
+  border: 1px solid var(--daisy-base-300, #e5e5e5);
+  background-color: var(--daisy-base-100, #ffffff);
   font-size: var(--el-font-size-base, 14px);
   font-family: inherit;
-  color: #1f2937;
+  color: var(--daisy-base-content, #1d1d1f);
   resize: vertical;
   outline: none;
   transition: all 0.2s ease;
@@ -8319,18 +8334,19 @@ textarea.input {
 
 .el-textarea__inner:hover,
 textarea.input:hover {
-  border-color: #9ca3af;
+  border-color: var(--daisy-base-content, #1d1d1f);
 }
 
 .el-textarea__inner:focus,
 textarea.input:focus {
-  border-color: #4d70ff;
-  box-shadow: 0 0 0 2px rgba(77, 112, 255, 0.2);
+  outline: 2px solid var(--daisy-primary, #4d70ff);
+  outline-offset: 2px;
+  border-color: var(--daisy-primary, #4d70ff);
 }
 
 .el-textarea__inner:disabled,
 textarea.input:disabled {
-  background-color: #f3f4f6;
+  background-color: var(--daisy-base-200, #f0f0f0);
   opacity: 0.6;
   cursor: not-allowed;
   resize: none;
@@ -8351,9 +8367,9 @@ textarea.input:disabled {
   display: flex;
   align-items: center;
   padding: 0 0.75rem;
-  background-color: #f3f4f6;
-  border: 1px solid #d1d5db;
-  color: #1f2937;
+  background-color: var(--daisy-base-200, #f0f0f0);
+  border: 1px solid var(--daisy-base-300, #e5e5e5);
+  color: var(--daisy-base-content, #1d1d1f);
   font-size: var(--el-font-size-base, 14px);
 }
 
@@ -8389,7 +8405,8 @@ textarea.input:disabled {
   right: 0.5rem;
   bottom: 0.25rem;
   font-size: var(--el-font-size-small, 12px);
-  color: #6b7280;
+  color: var(--daisy-base-content, #1d1d1f);
+  opacity: 0.6;
 }
 
 .el-input.is-count-up .el-input__wrapper {
@@ -8402,7 +8419,8 @@ textarea.input:disabled {
   right: 0.5rem;
   bottom: 0.25rem;
   font-size: var(--el-font-size-small, 12px);
-  color: #6b7280;
+  color: var(--daisy-base-content, #1d1d1f);
+  opacity: 0.6;
 }
 
 /* Input Group Addon (prefix/suffix) */
@@ -8410,9 +8428,9 @@ textarea.input:disabled {
   display: flex;
   align-items: center;
   padding: 0 0.75rem;
-  background-color: #f3f4f6;
-  border: 1px solid #d1d5db;
-  color: #1f2937;
+  background-color: var(--daisy-base-200, #f0f0f0);
+  border: 1px solid var(--daisy-base-300, #e5e5e5);
+  color: var(--daisy-base-content, #1d1d1f);
   font-size: var(--el-font-size-base, 14px);
   border-radius: var(--el-border-radius-base, 0.5rem);
 }
@@ -8430,7 +8448,8 @@ textarea.input:disabled {
   display: inline-flex;
   align-items: center;
   margin-left: 0.5rem;
-}/* ============================================
+}
+/* ============================================
    Element Plus Dialog - DaisyUI Style
    ============================================ */
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@macroui/macroui",
-  "version": "1.0.27",
+  "version": "1.0.28",
   "description": "Element Plus compatible component library with DaisyUI visual styling. 100% API compatible with Element Plus, featuring 85+ components and 67 languages.",
   "keywords": [
     "vue",