@machinemetrics/mm-react-components 1.2.3 → 1.2.4

package/dist/preview/CalendarPreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarPreview.d.ts","sourceRoot":"","sources":["../../src/preview/CalendarPreview.tsx"],"names":[],"mappings":"AAKA,MAAM,CAAC,OAAO,UAAU,eAAe,4CA2BtC"}
+{"version":3,"file":"CalendarPreview.d.ts","sourceRoot":"","sources":["../../src/preview/CalendarPreview.tsx"],"names":[],"mappings":"AAKA,MAAM,CAAC,OAAO,UAAU,eAAe,4CAsCtC"}

package/dist/preview/FormPreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormPreview.d.ts","sourceRoot":"","sources":["../../src/preview/FormPreview.tsx"],"names":[],"mappings":"AAkXA,MAAM,CAAC,OAAO,UAAU,WAAW,4CAgBlC"}
+{"version":3,"file":"FormPreview.d.ts","sourceRoot":"","sources":["../../src/preview/FormPreview.tsx"],"names":[],"mappings":"AA+gBA,MAAM,CAAC,OAAO,UAAU,WAAW,4CAmBlC"}

package/dist/themes/carbide.css

@@ -1529,14 +1529,6 @@ tr
 /* =============================
    CALENDAR (SEMANTIC HOOK)
   ============================= */
-.carbide [data-slot='calendar'] {
-  background-color: var(--card);
-  color: var(--card-foreground);
-  box-shadow:
-    0 1px 2px rgba(0, 0, 0, 0.06),
-    0 2px 12px rgba(0, 0, 0, 0.08);
-  border-radius: 0.5rem;
-}
 .carbide [data-slot='slider'] [data-slot='slider-track'] {
   background-color: var(--surface-neutral);
 }
@@ -1605,10 +1597,13 @@ tr
 .carbide [data-slot='calendar'] {
   background-color: var(--card);
   color: var(--card-foreground);
-  box-shadow:
-    0 1px 2px rgba(15, 23, 42, 0.06),
-    0 12px 32px rgba(15, 23, 42, 0.12);
-  border-radius: 0.75rem;
+  box-shadow: none;
+  border-radius: var(--radius-md);
+}
+.carbide [data-slot='popover-content'] [data-slot='calendar'] {
+  box-shadow: none;
+  border-radius: 0;
+  background-color: transparent;
 }
 .carbide [data-slot='calendar'] .rdp-months {
   display: flex;
@@ -1638,12 +1633,19 @@ tr
   appearance: none;
   background-color: transparent;
   border: 1px solid var(--border);
-  border-radius: 0.5rem;
+  border-radius: var(--radius-md);
   padding: 0.25rem 0.5rem;
   font-size: 0.875rem;
   font-weight: 500;
   color: var(--card-foreground);
 }
+/* Dark: `border-input` / default borders sit on grey-900 card and disappear — use indigo ring */
+.carbide.dark [data-slot='calendar'] .rdp-dropdown_root {
+  border-color: var(--ring);
+}
+.carbide.dark [data-slot='calendar'] .rdp-caption_dropdowns select {
+  border-color: var(--ring);
+}
 .carbide [data-slot='calendar'] .rdp-weeknumber,
 .carbide [data-slot='calendar'] .rdp-weeknumber_label {
   color: var(--muted-foreground);
@@ -1660,7 +1662,7 @@ tr
 .carbide [data-slot='calendar'] [data-slot='button'] {
   width: var(--cell-size);
   height: var(--cell-size);
-  border-radius: 0.75rem;
+  border-radius: var(--radius-md);
   color: var(--card-foreground);
 }
 .carbide [data-slot='calendar'] [data-slot='button'][data-range-middle='true'] {
@@ -1679,14 +1681,14 @@ tr
   border-radius: 0;
 }
 .carbide [data-slot='calendar'] [data-slot='button'][data-range-end='true'] {
-  border-radius: 0.75rem;
-  border-start-end-radius: 0.75rem;
-  border-end-end-radius: 0.75rem;
+  border-radius: var(--radius-md);
+  border-start-end-radius: var(--radius-md);
+  border-end-end-radius: var(--radius-md);
 }
 .carbide [data-slot='calendar'] [data-slot='button'][data-range-start='true'] {
-  border-radius: 0.75rem;
-  border-start-start-radius: 0.75rem;
-  border-end-start-radius: 0.75rem;
+  border-radius: var(--radius-md);
+  border-start-start-radius: var(--radius-md);
+  border-end-start-radius: var(--radius-md);
 }
 .carbide [data-slot='calendar'] [data-slot='button'][data-outside='true'] {
   color: var(--muted-foreground);
@@ -1695,10 +1697,40 @@ tr
   color: var(--muted-foreground);
   opacity: 0.5;
 }
-.carbide [data-slot='calendar'] [data-slot='button'][data-state='today'] {
+/*
+  Today (not selected): shadcn uses accent on the day cell; in Carbide dark, accent
+  (grey-700) on card (grey-900) is nearly invisible. Ghost also forces transparent
+  button bg — tint the button with primary so “today” reads like the shadcn demo.
+  Exclude any selected day (single or range) so range/primary fills stay correct.
+  https://ui.shadcn.com/docs/components/radix/calendar
+*/
+.carbide
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-state='today']:not(
+    [data-selected-single='true']
+  ):not([data-range-start='true']):not([data-range-end='true']):not(
+    [data-range-middle='true']
+  ) {
+  background-color: color-mix(in srgb, var(--primary) 18%, var(--card));
   color: var(--primary);
   border: 1px solid var(--primary);
 }
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-state='today']:not(
+    [data-selected-single='true']
+  ):not([data-range-start='true']):not([data-range-end='true']):not(
+    [data-range-middle='true']
+  ) {
+  color: var(--primary-foreground);
+}
+/* Today + selected single: filled primary — add inset edge so “today” isn’t lost */
+.carbide
+  [data-slot='calendar']
+  [data-slot='button'][data-state='today'][data-selected-single='true'] {
+  box-shadow: inset 0 0 0 1px
+    color-mix(in srgb, var(--primary-foreground) 45%, transparent);
+}
 .carbide [data-slot='calendar'] .group\/day [data-slot='button'] {
   transition:
     background-color 0.2s ease,
@@ -1713,6 +1745,48 @@ tr
   box-shadow: 0 0 0 3px var(--ring-soft);
 }
 
+/*
+  Dark: `.carbide.dark [data-slot='button'][data-variant='ghost']` (2 classes) beats
+  `.carbide [data-slot='calendar'] … [data-selected-single]` (1 class + attrs), so
+  selected / range day fills disappeared. Re-apply with ghost in the selector.
+*/
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-range-middle='true'] {
+  background-color: var(--accent);
+  color: var(--accent-foreground);
+}
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-range-start='true'],
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-range-end='true'],
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-selected-single='true'] {
+  background-color: var(--primary);
+  color: var(--primary-foreground);
+}
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-range-middle='true']:hover {
+  background-color: var(--accent);
+  color: var(--accent-foreground);
+}
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-range-start='true']:hover,
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-range-end='true']:hover,
+.carbide.dark
+  [data-slot='calendar']
+  [data-slot='button'][data-variant='ghost'][data-selected-single='true']:hover {
+  background-color: var(--primary);
+  color: var(--primary-foreground);
+}
+
 /* ==========================================================================
    Visual Test Mode - Hide code sections during Playwright visual tests
    ========================================================================== */
@@ -1722,8 +1796,8 @@ tr
  * preview sections. This allows visual regression tests to capture only
  * the component output without the code display.
  *
- * The code-preview.spec.ts test should NOT enable this mode so it can
- * test the full CodePreview component including the code section.
+ * code-preview.spec.ts does not enable this mode so it can snapshot CodePreview
+ * including the code section.
  */
 html[data-visual-test] [data-slot='code-preview-code'] {
   display: none !important;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@machinemetrics/mm-react-components",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "Industrial-grade React components for manufacturing applications",
   "keywords": [
     "react",
@@ -176,6 +176,7 @@
     "@types/node": "^25.0.6",
     "@types/react": "^19.2.8",
     "@types/react-dom": "^19.2.3",
+    "@types/react-is": "^19.2.0",
     "@types/react-table": "^7.7.20",
     "@typescript-eslint/eslint-plugin": "^8.53.0",
     "@typescript-eslint/parser": "^8.53.0",

package/dist/preview/set-display-names.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=set-display-names.d.ts.map

package/dist/preview/set-display-names.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"set-display-names.d.ts","sourceRoot":"","sources":["../../src/preview/set-display-names.ts"],"names":[],"mappings":""}