@kopexa/theme 1.5.5 → 1.5.7

package/dist/{chunk-ZWUAESH4.mjs → chunk-JFDWB4XQ.mjs}

@@ -3,9 +3,9 @@ import { tv } from "tailwind-variants";
 var pageLayout = tv({
   slots: {
     root: "",
-    wrapper: "flex mx-auto flex-wrap",
+    wrapper: "flex mx-auto flex-wrap w-full",
     baseContent: "flex flex-1 flex-wrap max-w-full",
-    header: "w-full",
+    header: "w-full grow-0 shrink-0",
     footerWrapper: "w-full",
     footerContent: "",
     paneWrapper: [
@@ -22,7 +22,7 @@ var pageLayout = tv({
     ],
     pane: "w-[var(--pane-width-size)] md:overflow-auto",
     contentWrapper: "flex min-w-px flex-col basis-0 grow shrink",
-    content: "w-full mx-auto grow"
+    content: "w-full mx-auto grow h-full"
   },
   variants: {
     gap: {
@@ -36,11 +36,11 @@ var pageLayout = tv({
         ]
       },
       normal: {
-        header: "mb-4 lg:mb-6",
-        footerWrapper: "mt-4 lg:mt-6",
+        header: "mb-2 lg:mb-3",
+        footerWrapper: "mt-2 lg:mt-3",
         paneWrapper: [
-          "max-md:data-[position=start]:mb-4 md:data-[position=start]:mr-6",
-          "max-md:data-[position=end]:mt-4 md:data-[position=end]:ml-6"
+          "max-md:data-[position=start]:mb-2 md:data-[position=start]:mr-3",
+          "max-md:data-[position=end]:mt-2 md:data-[position=end]:ml-3"
         ]
       }
     },
@@ -57,8 +57,8 @@ var pageLayout = tv({
         wrapper: "max-w-5xl"
       },
       xl: {
-        wrapper: "max-w-7xl",
-        content: "max-w-7xl"
+        wrapper: "max-w-8xl",
+        content: "max-w-8xl"
       }
     },
     paneWidth: {
@@ -73,9 +73,9 @@ var pageLayout = tv({
       }
     },
     spacing: {
-      none: "",
+      none: {},
       condensed: {
-        root: "p-2",
+        wrapper: "p-4",
         header: "p-4",
         content: "p-4",
         pane: "p-4",
@@ -83,10 +83,19 @@ var pageLayout = tv({
       },
       // 1.5rem
       normal: {
-        root: "p-4 md:p-6",
-        header: "p-4 md:p-6",
-        content: "p-4 md:p-6",
-        pane: "p-4 md:p-6"
+        wrapper: "p-2 md:p-3",
+        header: "p-2 md:p-3",
+        content: "p-2 md:p-3",
+        pane: "p-2 md:p-3",
+        footerContent: "p-2 md:p-3"
+      }
+    },
+    inModal: {
+      true: {
+        wrapper: "overflow-auto flex-1 min-h-0",
+        baseContent: "min-h-0 ",
+        header: "shrink grow-0",
+        contentWrapper: "grow shrink-0"
       }
     }
   },

package/dist/components/index.d.mts

@@ -15,7 +15,7 @@ export { DropdownMenuVariantProps, dropdownMenu } from './dropdown-menu.mjs';
 export { HeadingVariantProps, heading } from './heading.mjs';
 export { InputVariantProps, input, passwordInput } from './input.mjs';
 export { PageHeaderVariantProps, pageHeader } from './page-header.mjs';
-export { PageLayoutVariantProps, pageLayout } from './page-layout.mjs';
+export { PageLayoutSlots, PageLayoutVariantProps, pageLayout } from './page-layout.mjs';
 export { PopoverVariants, popover } from './popover.mjs';
 export { skeleton } from './skeleton.mjs';
 export { SpinnerVariants, spinner } from './spinner.mjs';

package/dist/components/index.d.ts

@@ -15,7 +15,7 @@ export { DropdownMenuVariantProps, dropdownMenu } from './dropdown-menu.js';
 export { HeadingVariantProps, heading } from './heading.js';
 export { InputVariantProps, input, passwordInput } from './input.js';
 export { PageHeaderVariantProps, pageHeader } from './page-header.js';
-export { PageLayoutVariantProps, pageLayout } from './page-layout.js';
+export { PageLayoutSlots, PageLayoutVariantProps, pageLayout } from './page-layout.js';
 export { PopoverVariants, popover } from './popover.js';
 export { skeleton } from './skeleton.js';
 export { SpinnerVariants, spinner } from './spinner.js';

package/dist/components/index.js

@@ -1411,9 +1411,9 @@ var import_tailwind_variants18 = require("tailwind-variants");
 var pageLayout = (0, import_tailwind_variants18.tv)({
   slots: {
     root: "",
-    wrapper: "flex mx-auto flex-wrap",
+    wrapper: "flex mx-auto flex-wrap w-full",
     baseContent: "flex flex-1 flex-wrap max-w-full",
-    header: "w-full",
+    header: "w-full grow-0 shrink-0",
     footerWrapper: "w-full",
     footerContent: "",
     paneWrapper: [
@@ -1430,7 +1430,7 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
     ],
     pane: "w-[var(--pane-width-size)] md:overflow-auto",
     contentWrapper: "flex min-w-px flex-col basis-0 grow shrink",
-    content: "w-full mx-auto grow"
+    content: "w-full mx-auto grow h-full"
   },
   variants: {
     gap: {
@@ -1444,11 +1444,11 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
         ]
       },
       normal: {
-        header: "mb-4 lg:mb-6",
-        footerWrapper: "mt-4 lg:mt-6",
+        header: "mb-2 lg:mb-3",
+        footerWrapper: "mt-2 lg:mt-3",
         paneWrapper: [
-          "max-md:data-[position=start]:mb-4 md:data-[position=start]:mr-6",
-          "max-md:data-[position=end]:mt-4 md:data-[position=end]:ml-6"
+          "max-md:data-[position=start]:mb-2 md:data-[position=start]:mr-3",
+          "max-md:data-[position=end]:mt-2 md:data-[position=end]:ml-3"
         ]
       }
     },
@@ -1465,8 +1465,8 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
         wrapper: "max-w-5xl"
       },
       xl: {
-        wrapper: "max-w-7xl",
-        content: "max-w-7xl"
+        wrapper: "max-w-8xl",
+        content: "max-w-8xl"
       }
     },
     paneWidth: {
@@ -1481,9 +1481,9 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
       }
     },
     spacing: {
-      none: "",
+      none: {},
       condensed: {
-        root: "p-2",
+        wrapper: "p-4",
         header: "p-4",
         content: "p-4",
         pane: "p-4",
@@ -1491,10 +1491,19 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
       },
       // 1.5rem
       normal: {
-        root: "p-4 md:p-6",
-        header: "p-4 md:p-6",
-        content: "p-4 md:p-6",
-        pane: "p-4 md:p-6"
+        wrapper: "p-2 md:p-3",
+        header: "p-2 md:p-3",
+        content: "p-2 md:p-3",
+        pane: "p-2 md:p-3",
+        footerContent: "p-2 md:p-3"
+      }
+    },
+    inModal: {
+      true: {
+        wrapper: "overflow-auto flex-1 min-h-0",
+        baseContent: "min-h-0 ",
+        header: "shrink grow-0",
+        contentWrapper: "grow shrink-0"
       }
     }
   },

package/dist/components/index.mjs

@@ -11,7 +11,7 @@ import {
 } from "../chunk-HAVJ6EQ6.mjs";
 import {
   pageLayout
-} from "../chunk-ZWUAESH4.mjs";
+} from "../chunk-JFDWB4XQ.mjs";
 import {
   popover
 } from "../chunk-J35D7RWA.mjs";

package/dist/components/page-layout.d.mts

@@ -44,19 +44,28 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
         };
     };
     spacing: {
-        none: string;
+        none: {};
         condensed: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
             footerContent: string;
         };
         normal: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
+            footerContent: string;
+        };
+    };
+    inModal: {
+        true: {
+            wrapper: string;
+            baseContent: string;
+            header: string;
+            contentWrapper: string;
         };
     };
 }, {
@@ -113,19 +122,28 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
         };
     };
     spacing: {
-        none: string;
+        none: {};
         condensed: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
             footerContent: string;
         };
         normal: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
+            footerContent: string;
+        };
+    };
+    inModal: {
+        true: {
+            wrapper: string;
+            baseContent: string;
+            header: string;
+            contentWrapper: string;
         };
     };
 }, {
@@ -182,19 +200,28 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
         };
     };
     spacing: {
-        none: string;
+        none: {};
         condensed: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
             footerContent: string;
         };
         normal: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
+            footerContent: string;
+        };
+    };
+    inModal: {
+        true: {
+            wrapper: string;
+            baseContent: string;
+            header: string;
+            contentWrapper: string;
         };
     };
 }, {
@@ -210,5 +237,6 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
     content: string;
 }, undefined, unknown, unknown, undefined>>;
 type PageLayoutVariantProps = VariantProps<typeof pageLayout>;
+type PageLayoutSlots = keyof ReturnType<typeof pageLayout>;
 
-export { type PageLayoutVariantProps, pageLayout };
+export { type PageLayoutSlots, type PageLayoutVariantProps, pageLayout };

package/dist/components/page-layout.d.ts

@@ -44,19 +44,28 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
         };
     };
     spacing: {
-        none: string;
+        none: {};
         condensed: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
             footerContent: string;
         };
         normal: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
+            footerContent: string;
+        };
+    };
+    inModal: {
+        true: {
+            wrapper: string;
+            baseContent: string;
+            header: string;
+            contentWrapper: string;
         };
     };
 }, {
@@ -113,19 +122,28 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
         };
     };
     spacing: {
-        none: string;
+        none: {};
         condensed: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
             footerContent: string;
         };
         normal: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
+            footerContent: string;
+        };
+    };
+    inModal: {
+        true: {
+            wrapper: string;
+            baseContent: string;
+            header: string;
+            contentWrapper: string;
         };
     };
 }, {
@@ -182,19 +200,28 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
         };
     };
     spacing: {
-        none: string;
+        none: {};
         condensed: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
             footerContent: string;
         };
         normal: {
-            root: string;
+            wrapper: string;
             header: string;
             content: string;
             pane: string;
+            footerContent: string;
+        };
+    };
+    inModal: {
+        true: {
+            wrapper: string;
+            baseContent: string;
+            header: string;
+            contentWrapper: string;
         };
     };
 }, {
@@ -210,5 +237,6 @@ declare const pageLayout: tailwind_variants.TVReturnType<{
     content: string;
 }, undefined, unknown, unknown, undefined>>;
 type PageLayoutVariantProps = VariantProps<typeof pageLayout>;
+type PageLayoutSlots = keyof ReturnType<typeof pageLayout>;
 
-export { type PageLayoutVariantProps, pageLayout };
+export { type PageLayoutSlots, type PageLayoutVariantProps, pageLayout };

package/dist/components/page-layout.js

@@ -27,9 +27,9 @@ var import_tailwind_variants = require("tailwind-variants");
 var pageLayout = (0, import_tailwind_variants.tv)({
   slots: {
     root: "",
-    wrapper: "flex mx-auto flex-wrap",
+    wrapper: "flex mx-auto flex-wrap w-full",
     baseContent: "flex flex-1 flex-wrap max-w-full",
-    header: "w-full",
+    header: "w-full grow-0 shrink-0",
     footerWrapper: "w-full",
     footerContent: "",
     paneWrapper: [
@@ -46,7 +46,7 @@ var pageLayout = (0, import_tailwind_variants.tv)({
     ],
     pane: "w-[var(--pane-width-size)] md:overflow-auto",
     contentWrapper: "flex min-w-px flex-col basis-0 grow shrink",
-    content: "w-full mx-auto grow"
+    content: "w-full mx-auto grow h-full"
   },
   variants: {
     gap: {
@@ -60,11 +60,11 @@ var pageLayout = (0, import_tailwind_variants.tv)({
         ]
       },
       normal: {
-        header: "mb-4 lg:mb-6",
-        footerWrapper: "mt-4 lg:mt-6",
+        header: "mb-2 lg:mb-3",
+        footerWrapper: "mt-2 lg:mt-3",
         paneWrapper: [
-          "max-md:data-[position=start]:mb-4 md:data-[position=start]:mr-6",
-          "max-md:data-[position=end]:mt-4 md:data-[position=end]:ml-6"
+          "max-md:data-[position=start]:mb-2 md:data-[position=start]:mr-3",
+          "max-md:data-[position=end]:mt-2 md:data-[position=end]:ml-3"
         ]
       }
     },
@@ -81,8 +81,8 @@ var pageLayout = (0, import_tailwind_variants.tv)({
         wrapper: "max-w-5xl"
       },
       xl: {
-        wrapper: "max-w-7xl",
-        content: "max-w-7xl"
+        wrapper: "max-w-8xl",
+        content: "max-w-8xl"
       }
     },
     paneWidth: {
@@ -97,9 +97,9 @@ var pageLayout = (0, import_tailwind_variants.tv)({
       }
     },
     spacing: {
-      none: "",
+      none: {},
       condensed: {
-        root: "p-2",
+        wrapper: "p-4",
         header: "p-4",
         content: "p-4",
         pane: "p-4",
@@ -107,10 +107,19 @@ var pageLayout = (0, import_tailwind_variants.tv)({
       },
       // 1.5rem
       normal: {
-        root: "p-4 md:p-6",
-        header: "p-4 md:p-6",
-        content: "p-4 md:p-6",
-        pane: "p-4 md:p-6"
+        wrapper: "p-2 md:p-3",
+        header: "p-2 md:p-3",
+        content: "p-2 md:p-3",
+        pane: "p-2 md:p-3",
+        footerContent: "p-2 md:p-3"
+      }
+    },
+    inModal: {
+      true: {
+        wrapper: "overflow-auto flex-1 min-h-0",
+        baseContent: "min-h-0 ",
+        header: "shrink grow-0",
+        contentWrapper: "grow shrink-0"
       }
     }
   },

package/dist/components/page-layout.mjs

@@ -1,6 +1,6 @@
 import {
   pageLayout
-} from "../chunk-ZWUAESH4.mjs";
+} from "../chunk-JFDWB4XQ.mjs";
 export {
   pageLayout
 };

package/dist/index.css

@@ -4,7 +4,7 @@
 @custom-variant dark (&:is(.dark *));
 
 :root {
-	--background: oklch(1 0 0);
+	--background: oklch(0.9851 0 0);
 	--foreground: oklch(0.145 0 0);
 	--card: oklch(1 0 0);
 	--card-foreground: oklch(0.145 0 0);
@@ -232,6 +232,8 @@
     --text-h6-core--line-height: 1rem;
     --text-h6-core--font-weight: 500;
     --text-h6-core--letter-spacing: 0.01em;
+
+    --container-8xl: 90rem;
 }
 
 @layer base {

package/dist/index.d.mts

@@ -16,7 +16,7 @@ export { DropdownMenuVariantProps, dropdownMenu } from './components/dropdown-me
 export { HeadingVariantProps, heading } from './components/heading.mjs';
 export { InputVariantProps, input, passwordInput } from './components/input.mjs';
 export { PageHeaderVariantProps, pageHeader } from './components/page-header.mjs';
-export { PageLayoutVariantProps, pageLayout } from './components/page-layout.mjs';
+export { PageLayoutSlots, PageLayoutVariantProps, pageLayout } from './components/page-layout.mjs';
 export { PopoverVariants, popover } from './components/popover.mjs';
 export { skeleton } from './components/skeleton.mjs';
 export { SpinnerVariants, spinner } from './components/spinner.mjs';

package/dist/index.d.ts

@@ -16,7 +16,7 @@ export { DropdownMenuVariantProps, dropdownMenu } from './components/dropdown-me
 export { HeadingVariantProps, heading } from './components/heading.js';
 export { InputVariantProps, input, passwordInput } from './components/input.js';
 export { PageHeaderVariantProps, pageHeader } from './components/page-header.js';
-export { PageLayoutVariantProps, pageLayout } from './components/page-layout.js';
+export { PageLayoutSlots, PageLayoutVariantProps, pageLayout } from './components/page-layout.js';
 export { PopoverVariants, popover } from './components/popover.js';
 export { skeleton } from './components/skeleton.js';
 export { SpinnerVariants, spinner } from './components/spinner.js';

package/dist/index.js

@@ -1411,9 +1411,9 @@ var import_tailwind_variants18 = require("tailwind-variants");
 var pageLayout = (0, import_tailwind_variants18.tv)({
   slots: {
     root: "",
-    wrapper: "flex mx-auto flex-wrap",
+    wrapper: "flex mx-auto flex-wrap w-full",
     baseContent: "flex flex-1 flex-wrap max-w-full",
-    header: "w-full",
+    header: "w-full grow-0 shrink-0",
     footerWrapper: "w-full",
     footerContent: "",
     paneWrapper: [
@@ -1430,7 +1430,7 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
     ],
     pane: "w-[var(--pane-width-size)] md:overflow-auto",
     contentWrapper: "flex min-w-px flex-col basis-0 grow shrink",
-    content: "w-full mx-auto grow"
+    content: "w-full mx-auto grow h-full"
   },
   variants: {
     gap: {
@@ -1444,11 +1444,11 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
         ]
       },
       normal: {
-        header: "mb-4 lg:mb-6",
-        footerWrapper: "mt-4 lg:mt-6",
+        header: "mb-2 lg:mb-3",
+        footerWrapper: "mt-2 lg:mt-3",
         paneWrapper: [
-          "max-md:data-[position=start]:mb-4 md:data-[position=start]:mr-6",
-          "max-md:data-[position=end]:mt-4 md:data-[position=end]:ml-6"
+          "max-md:data-[position=start]:mb-2 md:data-[position=start]:mr-3",
+          "max-md:data-[position=end]:mt-2 md:data-[position=end]:ml-3"
         ]
       }
     },
@@ -1465,8 +1465,8 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
         wrapper: "max-w-5xl"
       },
       xl: {
-        wrapper: "max-w-7xl",
-        content: "max-w-7xl"
+        wrapper: "max-w-8xl",
+        content: "max-w-8xl"
       }
     },
     paneWidth: {
@@ -1481,9 +1481,9 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
       }
     },
     spacing: {
-      none: "",
+      none: {},
       condensed: {
-        root: "p-2",
+        wrapper: "p-4",
         header: "p-4",
         content: "p-4",
         pane: "p-4",
@@ -1491,10 +1491,19 @@ var pageLayout = (0, import_tailwind_variants18.tv)({
       },
       // 1.5rem
       normal: {
-        root: "p-4 md:p-6",
-        header: "p-4 md:p-6",
-        content: "p-4 md:p-6",
-        pane: "p-4 md:p-6"
+        wrapper: "p-2 md:p-3",
+        header: "p-2 md:p-3",
+        content: "p-2 md:p-3",
+        pane: "p-2 md:p-3",
+        footerContent: "p-2 md:p-3"
+      }
+    },
+    inModal: {
+      true: {
+        wrapper: "overflow-auto flex-1 min-h-0",
+        baseContent: "min-h-0 ",
+        header: "shrink grow-0",
+        contentWrapper: "grow shrink-0"
       }
     }
   },

package/dist/index.mjs

@@ -12,7 +12,7 @@ import {
 } from "./chunk-HAVJ6EQ6.mjs";
 import {
   pageLayout
-} from "./chunk-ZWUAESH4.mjs";
+} from "./chunk-JFDWB4XQ.mjs";
 import {
   popover
 } from "./chunk-J35D7RWA.mjs";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kopexa/theme",
-  "version": "1.5.5",
+  "version": "1.5.7",
   "description": "The default theme for Kopexa components",
   "keywords": [
     "theme",