@kopexa/theme 17.0.2 → 17.2.0

package/dist/components/standard-chip.js

@@ -34,7 +34,7 @@ var solid = {
   primary: "bg-primary text-primary-foreground",
   secondary: "bg-secondary text-secondary-foreground",
   destructive: "bg-destructive text-destructive-foreground",
-  warning: "bg-warning text-warning-foreground",
+  warning: "bg-warning text-amber-950 dark:text-warning-foreground",
   success: "bg-success text-success-foreground"
 };
 var outline = {

package/dist/components/standard-chip.mjs

@@ -1,8 +1,8 @@
 import {
   standardChip
-} from "../chunk-C3LKWHPD.mjs";
-import "../chunk-OX4Q6RK5.mjs";
-import "../chunk-2VWLEU6X.mjs";
+} from "../chunk-XQZL7LCP.mjs";
+import "../chunk-5LVKFTZS.mjs";
+import "../chunk-7T563RF7.mjs";
 export {
   standardChip
 };

package/dist/index.js

@@ -345,7 +345,7 @@ var solid = {
   primary: "bg-primary text-primary-foreground",
   secondary: "bg-secondary text-secondary-foreground",
   destructive: "bg-destructive text-destructive-foreground",
-  warning: "bg-warning text-warning-foreground",
+  warning: "bg-warning text-amber-950 dark:text-warning-foreground",
   success: "bg-success text-success-foreground"
 };
 var outline = {
@@ -1792,20 +1792,22 @@ var datagrid = (0, import_tailwind_variants19.tv)({
         table: "border-separate border-spacing-0"
       }
     },
-    headerBackground: {
-      false: {
+    headerColor: {
+      default: {
         headerRow: "bg-transparent"
       },
-      true: {
+      muted: {
         headerRow: "bg-muted/40"
+      },
+      primary: {
+        headerRow: "bg-primary/10"
+      },
+      accent: {
+        headerRow: "bg-accent"
       }
     },
     stripped: {
-      true: {
-        headerRow: "bg-transparent",
-        bodyRowSkeleton: "odd:bg-muted/90 hover:bg-transparent odd:hover:bg-muted",
-        bodyRow: "odd:bg-muted/90 hover:bg-transparent odd:hover:bg-muted"
-      }
+      true: {}
     },
     width: {
       fixed: {
@@ -1830,7 +1832,9 @@ var datagrid = (0, import_tailwind_variants19.tv)({
     },
     columnsPinnable: {
       true: {
-        headerRowCell: "[&:not([data-pinned]):has(+[data-pinned])_div.cursor-col-resize:last-child]:opacity-0 [&[data-last-col=left]_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right]:last-child_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-muted/90 data-pinned:backdrop-blur-xs"
+        headerRowCell: "[&:not([data-pinned]):has(+[data-pinned])_div.cursor-col-resize:last-child]:opacity-0 [&[data-last-col=left]_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right]:last-child_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-background",
+        bodyRowCell: "[&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-background",
+        bodyRowSkeletonCell: "[&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-background"
       },
       false: {}
     },
@@ -1851,6 +1855,71 @@ var datagrid = (0, import_tailwind_variants19.tv)({
         bodyRowSkeleton: "border-b border-border [&:not(:last-child)>td]:border-b",
         bodyRow: "border-b border-border [&:not(:last-child)>td]:border-b"
       }
+    },
+    // stripped + headerColor default: odd rows are muted (first data row is muted)
+    {
+      stripped: true,
+      headerColor: "default",
+      className: {
+        bodyRowSkeleton: "odd:bg-muted/90 hover:bg-transparent odd:hover:bg-muted",
+        bodyRow: "odd:bg-muted/90 hover:bg-transparent odd:hover:bg-muted"
+      }
+    },
+    // stripped + headerColor muted: even rows are muted (header counts as first, so first data row is not muted)
+    {
+      stripped: true,
+      headerColor: "muted",
+      className: {
+        bodyRowSkeleton: "even:bg-muted/90 hover:bg-transparent even:hover:bg-muted",
+        bodyRow: "even:bg-muted/90 hover:bg-transparent even:hover:bg-muted"
+      }
+    },
+    // stripped + headerColor primary: even rows are muted
+    {
+      stripped: true,
+      headerColor: "primary",
+      className: {
+        bodyRowSkeleton: "even:bg-muted/90 hover:bg-transparent even:hover:bg-muted",
+        bodyRow: "even:bg-muted/90 hover:bg-transparent even:hover:bg-muted"
+      }
+    },
+    // stripped + headerColor accent: even rows are muted
+    {
+      stripped: true,
+      headerColor: "accent",
+      className: {
+        bodyRowSkeleton: "even:bg-muted/90 hover:bg-transparent even:hover:bg-muted",
+        bodyRow: "even:bg-muted/90 hover:bg-transparent even:hover:bg-muted"
+      }
+    },
+    // columnsPinnable + headerColor: pinned header cells need matching background
+    {
+      columnsPinnable: true,
+      headerColor: "default",
+      className: {
+        headerRowCell: "data-pinned:bg-transparent!"
+      }
+    },
+    {
+      columnsPinnable: true,
+      headerColor: "muted",
+      className: {
+        headerRowCell: "data-pinned:bg-muted/40!"
+      }
+    },
+    {
+      columnsPinnable: true,
+      headerColor: "primary",
+      className: {
+        headerRowCell: "data-pinned:bg-primary/10!"
+      }
+    },
+    {
+      columnsPinnable: true,
+      headerColor: "accent",
+      className: {
+        headerRowCell: "data-pinned:bg-accent!"
+      }
     }
   ],
   defaultVariants: {
@@ -1859,7 +1928,7 @@ var datagrid = (0, import_tailwind_variants19.tv)({
     width: "fixed",
     headerSticky: false,
     headerBorder: true,
-    headerBackground: true,
+    headerColor: "muted",
     cellBorder: false,
     stripped: false,
     columnsPinnable: false,
@@ -2689,16 +2758,16 @@ var import_tailwind_variants40 = require("tailwind-variants");
 var previewCard = (0, import_tailwind_variants40.tv)({
   slots: {
     root: [
-      "flex w-full items-start gap-3 rounded-md bg-background p-2 transition-colors",
-      "transition-all group min-h-10",
+      "grid w-full grid-cols-[auto_1fr_auto] items-center gap-y-1.5 rounded-md bg-background p-2",
+      "transition-all group min-h-10 cursor-pointer",
       "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1"
     ],
-    icon: ["flex-shrink-0 text-muted-foreground"],
-    content: ["flex min-w-0 flex-1 flex-col justify-center"],
+    icon: ["row-start-1 col-start-1 mr-3 text-muted-foreground"],
+    content: ["row-start-1 col-start-2 flex min-w-0 flex-col justify-center"],
     title: ["truncate text-xs font-medium text-foreground"],
     description: ["truncate text-[10px] text-muted-foreground line-clamp-1"],
-    action: ["shrink-0 rounded-full [&_svg]:size-4"],
-    tags: ["mt-1.5 flex items-center gap-2"]
+    action: ["row-start-1 col-start-3 ml-3 rounded-full [&_svg]:size-4"],
+    tags: ["col-start-2 flex items-center gap-2"]
   },
   variants: {
     size: {
@@ -2706,23 +2775,47 @@ var previewCard = (0, import_tailwind_variants40.tv)({
         icon: "[&__svg]:size-5"
       }
     },
-    isBordered: {
-      true: {
+    border: {
+      all: {
         root: ["border"]
       },
+      bottom: {
+        root: ["border-b rounded-none"]
+      },
+      none: {}
+    },
+    hoverBorder: {
+      true: {
+        root: "hover:border-primary"
+      },
       false: {}
     },
-    isHoverable: {
+    hoverBg: {
       true: {
-        root: "hover:bg-muted/50 hover:border-primary",
-        title: "group-hover:text-primary"
+        root: "hover:bg-muted/50"
       },
       false: {}
+    },
+    hoverTitle: {
+      true: {
+        title: "group-hover:underline"
+      },
+      false: {}
+    },
+    showAction: {
+      hover: {
+        action: "opacity-0 group-hover:opacity-100 transition-opacity"
+      },
+      always: {}
     }
   },
   defaultVariants: {
     size: "md",
-    isBordered: true
+    border: "all",
+    hoverBorder: true,
+    hoverBg: true,
+    hoverTitle: false,
+    showAction: "hover"
   }
 });
 
@@ -2860,57 +2953,68 @@ var sectionRow = (0, import_tailwind_variants46.tv)({
     root: ["grid grid-cols-1 text-base/6 sm:text-sm/6", "w-full"],
     title: [
       "col-start-1 text-muted-foreground text-sm font-medium",
-      "flex flex-row items-start gap-1",
+      "flex flex-row items-center gap-1.5",
       "shrink-0"
     ],
+    icon: "shrink-0 text-muted-foreground [&>svg]:size-4",
     infoTip: ["min-w-64 w-auto max-w-96 p-2"],
     valueText: "whitespace-pre-line text-pretty text-sm",
-    valueContainer: ["flex flex-row items-start gap-1", "grow"],
-    action: "self-start ml-auto"
+    valueContainer: ["flex flex-row items-start gap-1", "grow min-w-0"],
+    action: "shrink-0"
   },
   variants: {
     orientation: {
       horizontal: {
-        root: "sm:grid-cols-[min(33%,--spacing(80))_auto]"
+        root: "grid-cols-[min(33%,theme(spacing.48))_1fr_auto]"
       },
       vertical: {
-        root: "grid-cols-1",
-        title: "col-start-1",
-        valueContainer: "col-start-1"
+        root: "grid-cols-[1fr_auto] items-center",
+        valueContainer: "col-span-full items-start",
+        action: "row-start-1 col-start-2"
+      }
+    },
+    align: {
+      start: {
+        root: "items-start"
       },
-      horizontalCentered: {
-        root: "sm:grid-cols-[min(33%,--spacing(80))_auto] sm:items-center",
-        valueContainer: "items-center"
+      center: {
+        root: "items-center"
       }
     },
     spacing: {
+      none: {
+        root: "gap-x-3 gap-y-0 py-0"
+      },
       tight: {
-        root: "gap-1",
-        title: "max-sm:pt-1",
-        valueContainer: "max-sm:pt-0"
+        root: "gap-x-3 gap-y-0.5 py-1"
       },
       default: {
-        root: "gap-3",
-        title: "max-sm:pt-3",
-        valueContainer: "max-sm:pt-1"
+        root: "gap-x-3 gap-y-1 py-2"
       },
       loose: {
-        root: "gap-6",
-        title: "max-sm:pt-4",
-        valueContainer: "max-sm:pt-2"
+        root: "gap-x-3 gap-y-2 py-3"
       }
     },
     hasActions: {
-      true: {
-        valueContainer: "justify-between"
-      },
-      false: {}
+      true: {},
+      false: {
+        action: "hidden"
+      }
+    },
+    justify: {
+      start: {},
+      between: {
+        root: "justify-between",
+        valueContainer: "justify-end text-right"
+      }
     }
   },
   defaultVariants: {
     hasActions: false,
     orientation: "horizontal",
-    spacing: "default"
+    align: "start",
+    spacing: "default",
+    justify: "start"
   }
 });
 

package/dist/index.mjs

@@ -2,7 +2,7 @@ import "./chunk-XSN6P5JL.mjs";
 import "./chunk-BYXTAZ4I.mjs";
 import {
   standardChip
-} from "./chunk-C3LKWHPD.mjs";
+} from "./chunk-XQZL7LCP.mjs";
 import {
   switchVariants
 } from "./chunk-WQ446TVH.mjs";
@@ -37,7 +37,7 @@ import {
 } from "./chunk-3CZOBPDH.mjs";
 import {
   skeletonAvatar
-} from "./chunk-J3BXXWBQ.mjs";
+} from "./chunk-7Q2RNHL5.mjs";
 import {
   skeleton
 } from "./chunk-VNQEJU4P.mjs";
@@ -55,7 +55,7 @@ import {
 } from "./chunk-TQVRNEIH.mjs";
 import {
   previewCard
-} from "./chunk-WPOYEHD2.mjs";
+} from "./chunk-4XIBRN6X.mjs";
 import {
   relatedControlChip
 } from "./chunk-7BZAMXH2.mjs";
@@ -73,7 +73,7 @@ import {
 } from "./chunk-SPQE7K66.mjs";
 import {
   sectionRow
-} from "./chunk-I4ZIT7EK.mjs";
+} from "./chunk-CC225WUG.mjs";
 import {
   inputWrapper
 } from "./chunk-VSVGOX3P.mjs";
@@ -124,7 +124,7 @@ import {
 } from "./chunk-M4TXKRUU.mjs";
 import {
   datagrid
-} from "./chunk-45KIKY4A.mjs";
+} from "./chunk-Z5W4E7GM.mjs";
 import {
   dataTable
 } from "./chunk-GNYTZGE5.mjs";
@@ -154,10 +154,10 @@ import {
 } from "./chunk-A4KO7QKC.mjs";
 import {
   chip
-} from "./chunk-OX4Q6RK5.mjs";
+} from "./chunk-5LVKFTZS.mjs";
 import {
   code
-} from "./chunk-ZZMGL5MA.mjs";
+} from "./chunk-VQ2OAHGP.mjs";
 import {
   colorHighlightButton
 } from "./chunk-CPERWXKN.mjs";
@@ -182,14 +182,14 @@ import {
 } from "./chunk-XCLEKBCJ.mjs";
 import {
   avatar
-} from "./chunk-2T3SPXLF.mjs";
+} from "./chunk-D5FKEY7B.mjs";
 import {
   blankstate
 } from "./chunk-DICHD74Q.mjs";
 import {
   button
-} from "./chunk-DPQAMK3W.mjs";
-import "./chunk-2VWLEU6X.mjs";
+} from "./chunk-OTETLRUE.mjs";
+import "./chunk-7T563RF7.mjs";
 import "./chunk-6IZPAS4O.mjs";
 export {
   accordion,

package/dist/utils/variants.js

@@ -28,7 +28,7 @@ var solid = {
   primary: "bg-primary text-primary-foreground",
   secondary: "bg-secondary text-secondary-foreground",
   destructive: "bg-destructive text-destructive-foreground",
-  warning: "bg-warning text-warning-foreground",
+  warning: "bg-warning text-amber-950 dark:text-warning-foreground",
   success: "bg-success text-success-foreground"
 };
 var outline = {

package/dist/utils/variants.mjs

@@ -1,6 +1,6 @@
 import {
   colorVariants
-} from "../chunk-2VWLEU6X.mjs";
+} from "../chunk-7T563RF7.mjs";
 export {
   colorVariants
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kopexa/theme",
-  "version": "17.0.2",
+  "version": "17.2.0",
   "description": "The default theme for Kopexa components",
   "keywords": [
     "theme",
@@ -27,9 +27,9 @@
       "require": "./dist/index.css"
     },
     "./editor.css": {
-      "default": "./dist/editor.css",
       "import": "./dist/editor.css",
-      "require": "./dist/editor.css"
+      "require": "./dist/editor.css",
+      "default": "./dist/editor.css"
     },
     "./package.json": "./package.json"
   },
@@ -55,16 +55,17 @@
     "url": "https://github.com/kopexa-grc/sight/issues"
   },
   "dependencies": {
-    "@tiptap/extension-drag-handle-react": "^3.7.2",
+    "@tiptap/extension-drag-handle": "^3.15.3",
+    "@tiptap/extension-drag-handle-react": "^3.15.3",
     "clsx": "^2.1.1",
-    "color": "^5.0.2",
+    "color": "^5.0.3",
     "color2k": "^2.0.3",
     "deepmerge": "4.3.1",
     "flat": "^6.0.1",
     "tailwind-merge": "3.3.1",
-    "tailwind-variants": "^3.1.1",
+    "tailwind-variants": "^3.2.2",
     "tw-animate-css": "^1.4.0",
-    "@kopexa/shared-utils": "17.0.2"
+    "@kopexa/shared-utils": "17.0.6"
   },
   "peerDependencies": {
     "tailwindcss": ">=4.0.0"
@@ -73,7 +74,7 @@
     "@types/color": "^4.2.0",
     "@types/flat": "^5.0.5",
     "clean-package": "2.2.0",
-    "tailwindcss": "^4.1.16"
+    "tailwindcss": "^4.1.18"
   },
   "tsup": {
     "clean": true,

package/dist/chunk-I4ZIT7EK.mjs

@@ -1,64 +0,0 @@
-// src/components/section-row.ts
-import { tv } from "tailwind-variants";
-var sectionRow = tv({
-  slots: {
-    root: ["grid grid-cols-1 text-base/6 sm:text-sm/6", "w-full"],
-    title: [
-      "col-start-1 text-muted-foreground text-sm font-medium",
-      "flex flex-row items-start gap-1",
-      "shrink-0"
-    ],
-    infoTip: ["min-w-64 w-auto max-w-96 p-2"],
-    valueText: "whitespace-pre-line text-pretty text-sm",
-    valueContainer: ["flex flex-row items-start gap-1", "grow"],
-    action: "self-start ml-auto"
-  },
-  variants: {
-    orientation: {
-      horizontal: {
-        root: "sm:grid-cols-[min(33%,--spacing(80))_auto]"
-      },
-      vertical: {
-        root: "grid-cols-1",
-        title: "col-start-1",
-        valueContainer: "col-start-1"
-      },
-      horizontalCentered: {
-        root: "sm:grid-cols-[min(33%,--spacing(80))_auto] sm:items-center",
-        valueContainer: "items-center"
-      }
-    },
-    spacing: {
-      tight: {
-        root: "gap-1",
-        title: "max-sm:pt-1",
-        valueContainer: "max-sm:pt-0"
-      },
-      default: {
-        root: "gap-3",
-        title: "max-sm:pt-3",
-        valueContainer: "max-sm:pt-1"
-      },
-      loose: {
-        root: "gap-6",
-        title: "max-sm:pt-4",
-        valueContainer: "max-sm:pt-2"
-      }
-    },
-    hasActions: {
-      true: {
-        valueContainer: "justify-between"
-      },
-      false: {}
-    }
-  },
-  defaultVariants: {
-    hasActions: false,
-    orientation: "horizontal",
-    spacing: "default"
-  }
-});
-
-export {
-  sectionRow
-};

package/dist/chunk-WPOYEHD2.mjs

@@ -1,45 +0,0 @@
-// src/components/preview-card.ts
-import { tv } from "tailwind-variants";
-var previewCard = tv({
-  slots: {
-    root: [
-      "flex w-full items-start gap-3 rounded-md bg-background p-2 transition-colors",
-      "transition-all group min-h-10",
-      "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1"
-    ],
-    icon: ["flex-shrink-0 text-muted-foreground"],
-    content: ["flex min-w-0 flex-1 flex-col justify-center"],
-    title: ["truncate text-xs font-medium text-foreground"],
-    description: ["truncate text-[10px] text-muted-foreground line-clamp-1"],
-    action: ["shrink-0 rounded-full [&_svg]:size-4"],
-    tags: ["mt-1.5 flex items-center gap-2"]
-  },
-  variants: {
-    size: {
-      md: {
-        icon: "[&__svg]:size-5"
-      }
-    },
-    isBordered: {
-      true: {
-        root: ["border"]
-      },
-      false: {}
-    },
-    isHoverable: {
-      true: {
-        root: "hover:bg-muted/50 hover:border-primary",
-        title: "group-hover:text-primary"
-      },
-      false: {}
-    }
-  },
-  defaultVariants: {
-    size: "md",
-    isBordered: true
-  }
-});
-
-export {
-  previewCard
-};