shadcn-ui-react 0.7.1 → 0.7.5

package/dist/style.css

@@ -62,6 +62,7 @@
     --color-white: #fff;
     --spacing: 0.25rem;
     --container-sm: 24rem;
+    --container-md: 28rem;
     --container-lg: 32rem;
     --text-xs: 0.75rem;
     --text-xs--line-height: calc(1 / 0.75);
@@ -511,9 +512,6 @@
   .ml-auto {
     margin-left: auto;
   }
-  .ml-px {
-    margin-left: 1px;
-  }
   .block {
     display: block;
   }
@@ -597,9 +595,6 @@
   .h-36 {
     height: calc(var(--spacing) * 36);
   }
-  .h-\[1px\] {
-    height: 1px;
-  }
   .h-\[420px\] {
     height: 420px;
   }
@@ -618,6 +613,9 @@
   .h-px {
     height: 1px;
   }
+  .max-h-80 {
+    max-height: calc(var(--spacing) * 80);
+  }
   .max-h-96 {
     max-height: calc(var(--spacing) * 96);
   }
@@ -651,6 +649,12 @@
   .w-4 {
     width: calc(var(--spacing) * 4);
   }
+  .w-5 {
+    width: calc(var(--spacing) * 5);
+  }
+  .w-6 {
+    width: calc(var(--spacing) * 6);
+  }
   .w-7 {
     width: calc(var(--spacing) * 7);
   }
@@ -693,9 +697,6 @@
   .w-72 {
     width: calc(var(--spacing) * 72);
   }
-  .w-\[1px\] {
-    width: 1px;
-  }
   .w-\[4\.5rem\] {
     width: 4.5rem;
   }
@@ -719,6 +720,9 @@
     max-width: -moz-max-content;
     max-width: max-content;
   }
+  .max-w-md {
+    max-width: var(--container-md);
+  }
   .min-w-\(--radix-select-trigger-width\) {
     min-width: var(--radix-select-trigger-width);
   }
@@ -728,6 +732,9 @@
   .min-w-32 {
     min-width: calc(var(--spacing) * 32);
   }
+  .min-w-48 {
+    min-width: calc(var(--spacing) * 48);
+  }
   .min-w-\[8rem\] {
     min-width: 8rem;
   }
@@ -807,6 +814,9 @@
   .cursor-default {
     cursor: default;
   }
+  .cursor-not-allowed {
+    cursor: not-allowed;
+  }
   .cursor-pointer {
     cursor: pointer;
   }
@@ -849,9 +859,6 @@
   .justify-end {
     justify-content: flex-end;
   }
-  .gap-0 {
-    gap: calc(var(--spacing) * 0);
-  }
   .gap-0\.5 {
     gap: calc(var(--spacing) * 0.5);
   }
@@ -926,9 +933,6 @@
   .gap-y-1 {
     row-gap: calc(var(--spacing) * 1);
   }
-  .self-center {
-    align-self: center;
-  }
   .overflow-auto {
     overflow: auto;
   }
@@ -1036,6 +1040,12 @@
   .border-destructive {
     border-color: var(--destructive);
   }
+  .border-destructive\/20 {
+    border-color: var(--destructive);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--destructive) 20%, transparent);
+    }
+  }
   .border-destructive\/40 {
     border-color: var(--destructive);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1069,12 +1079,6 @@
   .border-primary {
     border-color: var(--primary);
   }
-  .border-primary\/20 {
-    border-color: var(--primary);
-    @supports (color: color-mix(in lab, red, red)) {
-      border-color: color-mix(in oklab, var(--primary) 20%, transparent);
-    }
-  }
   .border-primary\/50 {
     border-color: var(--primary);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1168,6 +1172,12 @@
   .bg-destructive {
     background-color: var(--destructive);
   }
+  .bg-destructive\/5 {
+    background-color: var(--destructive);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--destructive) 5%, transparent);
+    }
+  }
   .bg-destructive\/10 {
     background-color: var(--destructive);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1219,12 +1229,6 @@
   .bg-popover {
     background-color: var(--popover);
   }
-  .bg-popover\/80 {
-    background-color: var(--popover);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--popover) 80%, transparent);
-    }
-  }
   .bg-primary {
     background-color: var(--primary);
   }
@@ -1341,6 +1345,9 @@
   .fill-primary {
     fill: var(--primary);
   }
+  .stroke-\[2\.5\] {
+    stroke-width: 2.5;
+  }
   .object-cover {
     -o-object-fit: cover;
     object-fit: cover;
@@ -1378,6 +1385,9 @@
   .px-3 {
     padding-inline: calc(var(--spacing) * 3);
   }
+  .px-3\.5 {
+    padding-inline: calc(var(--spacing) * 3.5);
+  }
   .px-4 {
     padding-inline: calc(var(--spacing) * 4);
   }
@@ -1390,9 +1400,6 @@
   .px-10 {
     padding-inline: calc(var(--spacing) * 10);
   }
-  .px-\[0\.9rem\] {
-    padding-inline: 0.9rem;
-  }
   .py-0\.5 {
     padding-block: calc(var(--spacing) * 0.5);
   }
@@ -1411,15 +1418,9 @@
   .py-4 {
     padding-block: calc(var(--spacing) * 4);
   }
-  .py-5 {
-    padding-block: calc(var(--spacing) * 5);
-  }
   .py-6 {
     padding-block: calc(var(--spacing) * 6);
   }
-  .py-10 {
-    padding-block: calc(var(--spacing) * 10);
-  }
   .pt-0 {
     padding-top: calc(var(--spacing) * 0);
   }
@@ -1519,6 +1520,10 @@
     --tw-leading: 1;
     line-height: 1;
   }
+  .leading-relaxed {
+    --tw-leading: var(--leading-relaxed);
+    line-height: var(--leading-relaxed);
+  }
   .font-bold {
     --tw-font-weight: var(--font-weight-bold);
     font-weight: var(--font-weight-bold);
@@ -1746,6 +1751,12 @@
   .ring-destructive {
     --tw-ring-color: var(--destructive);
   }
+  .ring-destructive\/20 {
+    --tw-ring-color: var(--destructive);
+    @supports (color: color-mix(in lab, red, red)) {
+      --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
+    }
+  }
   .ring-ring {
     --tw-ring-color: var(--ring);
   }
@@ -2097,6 +2108,16 @@
       }
     }
   }
+  .hover\:border-primary\/70 {
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--primary);
+        @supports (color: color-mix(in lab, red, red)) {
+          border-color: color-mix(in oklab, var(--primary) 70%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-accent {
     &:hover {
       @media (hover: hover) {
@@ -2425,6 +2446,19 @@
       }
     }
   }
+  .hover\:shadow-md {
+    &:hover {
+      @media (hover: hover) {
+        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+        box-shadow:
+          var(--tw-inset-shadow),
+          var(--tw-inset-ring-shadow),
+          var(--tw-ring-offset-shadow),
+          var(--tw-ring-shadow),
+          var(--tw-shadow);
+      }
+    }
+  }
   .hover\:shadow-xl {
     &:hover {
       @media (hover: hover) {
@@ -2627,6 +2661,14 @@
       --tw-ring-color: var(--ring);
     }
   }
+  .focus\:ring-ring\/40 {
+    &:focus {
+      --tw-ring-color: var(--ring);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--ring) 40%, transparent);
+      }
+    }
+  }
   .focus\:ring-offset-2 {
     &:focus {
       --tw-ring-offset-width: 2px;
@@ -2690,6 +2732,14 @@
       }
     }
   }
+  .focus-visible\:ring-destructive\/40 {
+    &:focus-visible {
+      --tw-ring-color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
+      }
+    }
+  }
   .focus-visible\:ring-emerald-500\/40 {
     &:focus-visible {
       --tw-ring-color: color-mix(in srgb, oklch(69.6% 0.17 162.48) 40%, transparent);
@@ -2742,6 +2792,14 @@
       outline-style: none;
     }
   }
+  .active\:scale-95 {
+    &:active {
+      --tw-scale-x: 95%;
+      --tw-scale-y: 95%;
+      --tw-scale-z: 95%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+  }
   .active\:bg-muted\/35 {
     &:active {
       background-color: var(--muted);
@@ -3113,16 +3171,80 @@
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
   }
+  .data-\[state\=checked\]\:scale-100 {
+    &[data-state=checked] {
+      --tw-scale-x: 100%;
+      --tw-scale-y: 100%;
+      --tw-scale-z: 100%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+  }
+  .data-\[state\=checked\]\:border-destructive {
+    &[data-state=checked] {
+      border-color: var(--destructive);
+    }
+  }
+  .data-\[state\=checked\]\:border-emerald-500 {
+    &[data-state=checked] {
+      border-color: var(--color-emerald-500);
+    }
+  }
+  .data-\[state\=checked\]\:border-primary {
+    &[data-state=checked] {
+      border-color: var(--primary);
+    }
+  }
+  .data-\[state\=checked\]\:bg-destructive {
+    &[data-state=checked] {
+      background-color: var(--destructive);
+    }
+  }
+  .data-\[state\=checked\]\:bg-emerald-500 {
+    &[data-state=checked] {
+      background-color: var(--color-emerald-500);
+    }
+  }
   .data-\[state\=checked\]\:bg-primary {
     &[data-state=checked] {
       background-color: var(--primary);
     }
   }
+  .data-\[state\=checked\]\:bg-primary\/15 {
+    &[data-state=checked] {
+      background-color: var(--primary);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--primary) 15%, transparent);
+      }
+    }
+  }
+  .data-\[state\=checked\]\:text-destructive-foreground {
+    &[data-state=checked] {
+      color: var(--destructive-foreground);
+    }
+  }
+  .data-\[state\=checked\]\:text-primary {
+    &[data-state=checked] {
+      color: var(--primary);
+    }
+  }
   .data-\[state\=checked\]\:text-primary-foreground {
     &[data-state=checked] {
       color: var(--primary-foreground);
     }
   }
+  .data-\[state\=checked\]\:text-white {
+    &[data-state=checked] {
+      color: var(--color-white);
+    }
+  }
+  .data-\[state\=checked\]\:shadow-primary\/20 {
+    &[data-state=checked] {
+      --tw-shadow-color: var(--primary);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--primary) 20%, transparent) var(--tw-shadow-alpha), transparent);
+      }
+    }
+  }
   .data-\[state\=closed\]\:duration-300 {
     &[data-state=closed] {
       --tw-duration: 300ms;
@@ -3355,6 +3477,11 @@
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
   }
+  .data-\[state\=unchecked\]\:bg-background {
+    &[data-state=unchecked] {
+      background-color: var(--background);
+    }
+  }
   .data-\[state\=unchecked\]\:bg-input {
     &[data-state=unchecked] {
       background-color: var(--input);
@@ -3458,14 +3585,6 @@
       }
     }
   }
-  .supports-\[backdrop-filter\]\:bg-popover\/60 {
-    @supports (backdrop-filter: var(--tw)) {
-      background-color: var(--popover);
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--popover) 60%, transparent);
-      }
-    }
-  }
   .supports-\[height\:100dvh\]\:h-\[clamp\(22rem\,80dvh\,44rem\)\] {
     @supports (height:100dvh) {
       height: clamp(22rem, 80dvh, 44rem);
@@ -4334,6 +4453,9 @@
 @property --tw-drop-shadow-color { syntax: "*"; inherits: false; }
 @property --tw-drop-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
 @property --tw-drop-shadow-size { syntax: "*"; inherits: false; }
+@property --tw-scale-x { syntax: "*"; inherits: false; initial-value: 1; }
+@property --tw-scale-y { syntax: "*"; inherits: false; initial-value: 1; }
+@property --tw-scale-z { syntax: "*"; inherits: false; initial-value: 1; }
 @keyframes spin {
   to {
     transform: rotate(360deg);
@@ -4415,6 +4537,9 @@
       --tw-drop-shadow-color: initial;
       --tw-drop-shadow-alpha: 100%;
       --tw-drop-shadow-size: initial;
+      --tw-scale-x: 1;
+      --tw-scale-y: 1;
+      --tw-scale-z: 1;
     }
   }
 }

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "shadcn-ui-react",
-  "version": "0.7.1",
+  "version": "0.7.5",
   "private": false,
-  "author": "Bleker Cordova <bleker@gliyen.com>",
+  "author": "Bleker <bleker@gliyen.com>",
   "description": "A collection of components for building beautiful and accessible user interfaces with React and Tailwind CSS.",
   "sideEffect": [
     "**/*.css"
@@ -68,8 +68,8 @@
     "@types/node": "^25.6.0",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
-    "@typescript-eslint/eslint-plugin": "^8.59.1",
-    "@typescript-eslint/parser": "^8.59.1",
+    "@typescript-eslint/eslint-plugin": "^8.59.2",
+    "@typescript-eslint/parser": "^8.59.2",
     "autoprefixer": "^10.5.0",
     "babel-jest": "^30.3.0",
     "cross-env": "^10.1.0",
@@ -92,7 +92,7 @@
     "vite": "^8.0.10",
     "vite-plugin-dts": "^5.0.0",
     "vite-plugin-ts-alias": "^0.1.1",
-    "zod": "^4.4.2"
+    "zod": "^4.4.3"
   },
   "peerDependencies": {
     "react": "^17.0.0 || ^18.3.1 || ^19.2.5 || ^20.0.0",