@publish.os/nextjs 0.0.1-alpha.5 → 0.0.1-alpha.7

package/dist/kernel/components/ui/input.js

@@ -1,29 +1,6 @@
-// src/kernel/components/ui/input.tsx
+// src/components/ui/input.tsx
 import { Input as BaseInput } from "@base-ui/react/input";
-
-// src/utils/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      z: [
-        "z-content",
-        "z-nav",
-        "z-overlay",
-        "z-modal",
-        "z-search",
-        "z-toast",
-        "z-progress"
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/kernel/components/ui/input.tsx
+import { cn } from "@publish.os/nextjs/utils/cn";
 import { cva } from "class-variance-authority";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -31,7 +8,7 @@ var inputVariants = cva(
   [
     "flex w-full rounded-input border bg-surface-1 text-foreground-1 transition-colors",
     "placeholder:text-foreground-3",
-    "focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-ring",
+    "focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-stroke",
     "disabled:cursor-not-allowed disabled:opacity-50 data-disabled:cursor-not-allowed data-disabled:opacity-50"
   ].join(" "),
   {
@@ -44,8 +21,8 @@ var inputVariants = cva(
         xl: "h-12 px-4 text-base"
       },
       variant: {
-        default: "border-stroke-2 focus:border-focus-ring",
-        ghost: "border-transparent bg-surface-2 focus:border-focus-ring"
+        default: "border-stroke-2 focus:border-focus-stroke",
+        ghost: "border-transparent bg-surface-2 focus:border-focus-stroke"
       }
     },
     defaultVariants: {
@@ -53,8 +30,7 @@ var inputVariants = cva(
       variant: "default"
     }
   }
-);
-var Input = forwardRef(function Input2({ className, size, variant, ...props }, ref) {
+), Input = forwardRef(function({ className, size, variant, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     BaseInput,
     {

package/dist/kernel/components/ui/kbd.js

@@ -1,30 +1,9 @@
-// src/utils/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      z: [
-        "z-content",
-        "z-nav",
-        "z-overlay",
-        "z-modal",
-        "z-search",
-        "z-toast",
-        "z-progress"
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/kernel/components/ui/kbd.tsx
+// src/components/ui/kbd.tsx
+import { cn } from "@publish.os/nextjs/utils/cn";
 import { cva } from "class-variance-authority";
 import { jsx } from "react/jsx-runtime";
 var kbdVariants = cva(
-  "not-markdown-prose relative -top-[0.03em] inline-flex h-fit shrink-0 select-none items-center justify-center whitespace-nowrap bg-surface-1 px-[0.5em] pt-[0.05em] pb-[0.1em] align-text-top font-sans font-normal leading-[1.7em] text-foreground-1 [--kbd-fallback-shadow:inset_0_-0.05em_0.5em_color-mix(in_oklab,var(--stroke-4)_80%,transparent),inset_0_0.05em_color-mix(in_oklab,var(--palette-neutral-1)_95%,transparent),inset_0_0.25em_0.5em_color-mix(in_oklab,var(--surface-3)_70%,transparent),inset_0_-0.075em_color-mix(in_oklab,var(--stroke-1)_58%,var(--stroke-2)),0_0_0_0.065em_color-mix(in_oklab,var(--stroke-2)_82%,transparent),0_0.08em_0.17em_color-mix(in_oklab,var(--stroke-1)_45%,transparent)] [--kbd-fallback-shadow-active:inset_0_0.05em_color-mix(in_oklab,var(--foreground-4)_45%,transparent),0_0_0_0.065em_color-mix(in_oklab,var(--stroke-1)_64%,transparent)] [border-radius:max(var(--radius-kbd),1px)] [box-shadow:var(--kbd-shadow,var(--kbd-fallback-shadow))] [word-spacing:-0.1em] transition-[background-color,box-shadow] duration-150 hover:bg-surface-background hover:[box-shadow:var(--kbd-shadow,var(--kbd-fallback-shadow)),0_0_0_0.05em_color-mix(in_oklab,var(--stroke-2)_50%,transparent)] focus-visible:outline-2 focus-visible:outline-focus-ring active:bg-surface-2 active:pt-[0.1em] active:pb-[0.05em] active:[box-shadow:var(--kbd-shadow-active,var(--kbd-fallback-shadow-active))] [&_*]:leading-none",
+  "not-markdown-prose relative -top-[0.03em] inline-flex h-fit shrink-0 select-none items-center justify-center whitespace-nowrap bg-surface-1 px-[0.5em] pt-[0.05em] pb-[0.1em] align-text-top font-sans font-normal leading-[1.7em] text-foreground-1 [--kbd-fallback-shadow:inset_0_-0.05em_0.5em_color-mix(in_oklab,var(--stroke-4)_80%,transparent),inset_0_0.05em_color-mix(in_oklab,var(--neutral-100)_95%,transparent),inset_0_0.25em_0.5em_color-mix(in_oklab,var(--surface-3)_70%,transparent),inset_0_-0.075em_color-mix(in_oklab,var(--stroke-1)_58%,var(--stroke-2)),0_0_0_0.065em_color-mix(in_oklab,var(--stroke-2)_82%,transparent),0_0.08em_0.17em_color-mix(in_oklab,var(--stroke-1)_45%,transparent)] [--kbd-fallback-shadow-active:inset_0_0.05em_color-mix(in_oklab,var(--foreground-4)_45%,transparent),0_0_0_0.065em_color-mix(in_oklab,var(--stroke-1)_64%,transparent)] [border-radius:max(var(--radius-kbd),1px)] [box-shadow:var(--kbd-shadow,var(--kbd-fallback-shadow))] [word-spacing:-0.1em] transition-[background-color,box-shadow] duration-150 hover:bg-surface-page hover:[box-shadow:var(--kbd-shadow,var(--kbd-fallback-shadow)),0_0_0_0.05em_color-mix(in_oklab,var(--stroke-2)_50%,transparent)] focus-visible:outline-2 focus-visible:outline-focus-stroke active:bg-surface-2 active:pt-[0.1em] active:pb-[0.05em] active:[box-shadow:var(--kbd-shadow-active,var(--kbd-fallback-shadow-active))] [&_*]:leading-none",
   {
     variants: {
       size: {
@@ -40,20 +19,20 @@ var kbdVariants = cva(
       }
     },
     compoundVariants: [
-      { className: "w-[1.75em]", size: "xs", square: true },
-      { className: "w-[1.75em]", size: "sm", square: true },
-      { className: "w-[1.75em]", size: "md", square: true },
-      { className: "w-[1.75em]", size: "lg", square: true },
-      { className: "w-[1.75em]", size: "xl", square: true }
+      { className: "w-[1.75em]", size: "xs", square: !0 },
+      { className: "w-[1.75em]", size: "sm", square: !0 },
+      { className: "w-[1.75em]", size: "md", square: !0 },
+      { className: "w-[1.75em]", size: "lg", square: !0 },
+      { className: "w-[1.75em]", size: "xl", square: !0 }
     ],
     defaultVariants: {
       size: "md",
-      square: false
+      square: !1
     }
   }
 );
 function isSingleCharacter(children) {
-  return typeof children === "string" && Array.from(children.trim()).length === 1;
+  return typeof children == "string" && Array.from(children.trim()).length === 1;
 }
 function Kbd({ children, className, size, square, ...props }) {
   return /* @__PURE__ */ jsx(

package/dist/kernel/components/ui/link.d.ts

@@ -5,7 +5,7 @@ import { VariantProps } from 'class-variance-authority';
 import { ReactNode, AnchorHTMLAttributes } from 'react';
 
 declare const linkVariants: (props?: ({
-    color?: "default" | "accent" | null | undefined;
+    color?: "accent" | "default" | null | undefined;
     size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     variant?: "inline" | "standalone" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;

package/dist/kernel/components/ui/link.js

@@ -1,36 +1,13 @@
-// src/kernel/components/ui/link.tsx
-import { buttonVariants } from "./button.js";
-
-// src/utils/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      z: [
-        "z-content",
-        "z-nav",
-        "z-overlay",
-        "z-modal",
-        "z-search",
-        "z-toast",
-        "z-progress"
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/kernel/components/ui/link.tsx
+// src/components/ui/link.tsx
+import { buttonVariants } from "@publish.os/nextjs/kernel/components/ui/button";
+import { cn } from "@publish.os/nextjs/utils/cn";
 import { cva } from "class-variance-authority";
 import NextLink from "next/link";
 
 // ../../node_modules/.pnpm/tailwindcss@4.3.0/node_modules/tailwindcss/dist/chunk-X4GG3EDV.mjs
 var l = { inherit: "inherit", current: "currentcolor", transparent: "transparent", black: "#000", white: "#fff", slate: { 50: "oklch(98.4% 0.003 247.858)", 100: "oklch(96.8% 0.007 247.896)", 200: "oklch(92.9% 0.013 255.508)", 300: "oklch(86.9% 0.022 252.894)", 400: "oklch(70.4% 0.04 256.788)", 500: "oklch(55.4% 0.046 257.417)", 600: "oklch(44.6% 0.043 257.281)", 700: "oklch(37.2% 0.044 257.287)", 800: "oklch(27.9% 0.041 260.031)", 900: "oklch(20.8% 0.042 265.755)", 950: "oklch(12.9% 0.042 264.695)" }, gray: { 50: "oklch(98.5% 0.002 247.839)", 100: "oklch(96.7% 0.003 264.542)", 200: "oklch(92.8% 0.006 264.531)", 300: "oklch(87.2% 0.01 258.338)", 400: "oklch(70.7% 0.022 261.325)", 500: "oklch(55.1% 0.027 264.364)", 600: "oklch(44.6% 0.03 256.802)", 700: "oklch(37.3% 0.034 259.733)", 800: "oklch(27.8% 0.033 256.848)", 900: "oklch(21% 0.034 264.665)", 950: "oklch(13% 0.028 261.692)" }, zinc: { 50: "oklch(98.5% 0 0)", 100: "oklch(96.7% 0.001 286.375)", 200: "oklch(92% 0.004 286.32)", 300: "oklch(87.1% 0.006 286.286)", 400: "oklch(70.5% 0.015 286.067)", 500: "oklch(55.2% 0.016 285.938)", 600: "oklch(44.2% 0.017 285.786)", 700: "oklch(37% 0.013 285.805)", 800: "oklch(27.4% 0.006 286.033)", 900: "oklch(21% 0.006 285.885)", 950: "oklch(14.1% 0.005 285.823)" }, neutral: { 50: "oklch(98.5% 0 0)", 100: "oklch(97% 0 0)", 200: "oklch(92.2% 0 0)", 300: "oklch(87% 0 0)", 400: "oklch(70.8% 0 0)", 500: "oklch(55.6% 0 0)", 600: "oklch(43.9% 0 0)", 700: "oklch(37.1% 0 0)", 800: "oklch(26.9% 0 0)", 900: "oklch(20.5% 0 0)", 950: "oklch(14.5% 0 0)" }, stone: { 50: "oklch(98.5% 0.001 106.423)", 100: "oklch(97% 0.001 106.424)", 200: "oklch(92.3% 0.003 48.717)", 300: "oklch(86.9% 0.005 56.366)", 400: "oklch(70.9% 0.01 56.259)", 500: "oklch(55.3% 0.013 58.071)", 600: "oklch(44.4% 0.011 73.639)", 700: "oklch(37.4% 0.01 67.558)", 800: "oklch(26.8% 0.007 34.298)", 900: "oklch(21.6% 0.006 56.043)", 950: "oklch(14.7% 0.004 49.25)" }, mauve: { 50: "oklch(98.5% 0 0)", 100: "oklch(96% 0.003 325.6)", 200: "oklch(92.2% 0.005 325.62)", 300: "oklch(86.5% 0.012 325.68)", 400: "oklch(71.1% 0.019 323.02)", 500: "oklch(54.2% 0.034 322.5)", 600: "oklch(43.5% 0.029 321.78)", 700: "oklch(36.4% 0.029 323.89)", 800: "oklch(26.3% 0.024 320.12)", 900: "oklch(21.2% 0.019 322.12)", 950: "oklch(14.5% 0.008 326)" }, olive: { 50: "oklch(98.8% 0.003 106.5)", 100: "oklch(96.6% 0.005 106.5)", 200: "oklch(93% 0.007 106.5)", 300: "oklch(88% 0.011 106.6)", 400: "oklch(73.7% 0.021 106.9)", 500: "oklch(58% 0.031 107.3)", 600: "oklch(46.6% 0.025 107.3)", 700: "oklch(39.4% 0.023 107.4)", 800: "oklch(28.6% 0.016 107.4)", 900: "oklch(22.8% 0.013 107.4)", 950: "oklch(15.3% 0.006 107.1)" }, mist: { 50: "oklch(98.7% 0.002 197.1)", 100: "oklch(96.3% 0.002 197.1)", 200: "oklch(92.5% 0.005 214.3)", 300: "oklch(87.2% 0.007 219.6)", 400: "oklch(72.3% 0.014 214.4)", 500: "oklch(56% 0.021 213.5)", 600: "oklch(45% 0.017 213.2)", 700: "oklch(37.8% 0.015 216)", 800: "oklch(27.5% 0.011 216.9)", 900: "oklch(21.8% 0.008 223.9)", 950: "oklch(14.8% 0.004 228.8)" }, taupe: { 50: "oklch(98.6% 0.002 67.8)", 100: "oklch(96% 0.002 17.2)", 200: "oklch(92.2% 0.005 34.3)", 300: "oklch(86.8% 0.007 39.5)", 400: "oklch(71.4% 0.014 41.2)", 500: "oklch(54.7% 0.021 43.1)", 600: "oklch(43.8% 0.017 39.3)", 700: "oklch(36.7% 0.016 35.7)", 800: "oklch(26.8% 0.011 36.5)", 900: "oklch(21.4% 0.009 43.1)", 950: "oklch(14.7% 0.004 49.3)" }, red: { 50: "oklch(97.1% 0.013 17.38)", 100: "oklch(93.6% 0.032 17.717)", 200: "oklch(88.5% 0.062 18.334)", 300: "oklch(80.8% 0.114 19.571)", 400: "oklch(70.4% 0.191 22.216)", 500: "oklch(63.7% 0.237 25.331)", 600: "oklch(57.7% 0.245 27.325)", 700: "oklch(50.5% 0.213 27.518)", 800: "oklch(44.4% 0.177 26.899)", 900: "oklch(39.6% 0.141 25.723)", 950: "oklch(25.8% 0.092 26.042)" }, orange: { 50: "oklch(98% 0.016 73.684)", 100: "oklch(95.4% 0.038 75.164)", 200: "oklch(90.1% 0.076 70.697)", 300: "oklch(83.7% 0.128 66.29)", 400: "oklch(75% 0.183 55.934)", 500: "oklch(70.5% 0.213 47.604)", 600: "oklch(64.6% 0.222 41.116)", 700: "oklch(55.3% 0.195 38.402)", 800: "oklch(47% 0.157 37.304)", 900: "oklch(40.8% 0.123 38.172)", 950: "oklch(26.6% 0.079 36.259)" }, amber: { 50: "oklch(98.7% 0.022 95.277)", 100: "oklch(96.2% 0.059 95.617)", 200: "oklch(92.4% 0.12 95.746)", 300: "oklch(87.9% 0.169 91.605)", 400: "oklch(82.8% 0.189 84.429)", 500: "oklch(76.9% 0.188 70.08)", 600: "oklch(66.6% 0.179 58.318)", 700: "oklch(55.5% 0.163 48.998)", 800: "oklch(47.3% 0.137 46.201)", 900: "oklch(41.4% 0.112 45.904)", 950: "oklch(27.9% 0.077 45.635)" }, yellow: { 50: "oklch(98.7% 0.026 102.212)", 100: "oklch(97.3% 0.071 103.193)", 200: "oklch(94.5% 0.129 101.54)", 300: "oklch(90.5% 0.182 98.111)", 400: "oklch(85.2% 0.199 91.936)", 500: "oklch(79.5% 0.184 86.047)", 600: "oklch(68.1% 0.162 75.834)", 700: "oklch(55.4% 0.135 66.442)", 800: "oklch(47.6% 0.114 61.907)", 900: "oklch(42.1% 0.095 57.708)", 950: "oklch(28.6% 0.066 53.813)" }, lime: { 50: "oklch(98.6% 0.031 120.757)", 100: "oklch(96.7% 0.067 122.328)", 200: "oklch(93.8% 0.127 124.321)", 300: "oklch(89.7% 0.196 126.665)", 400: "oklch(84.1% 0.238 128.85)", 500: "oklch(76.8% 0.233 130.85)", 600: "oklch(64.8% 0.2 131.684)", 700: "oklch(53.2% 0.157 131.589)", 800: "oklch(45.3% 0.124 130.933)", 900: "oklch(40.5% 0.101 131.063)", 950: "oklch(27.4% 0.072 132.109)" }, green: { 50: "oklch(98.2% 0.018 155.826)", 100: "oklch(96.2% 0.044 156.743)", 200: "oklch(92.5% 0.084 155.995)", 300: "oklch(87.1% 0.15 154.449)", 400: "oklch(79.2% 0.209 151.711)", 500: "oklch(72.3% 0.219 149.579)", 600: "oklch(62.7% 0.194 149.214)", 700: "oklch(52.7% 0.154 150.069)", 800: "oklch(44.8% 0.119 151.328)", 900: "oklch(39.3% 0.095 152.535)", 950: "oklch(26.6% 0.065 152.934)" }, emerald: { 50: "oklch(97.9% 0.021 166.113)", 100: "oklch(95% 0.052 163.051)", 200: "oklch(90.5% 0.093 164.15)", 300: "oklch(84.5% 0.143 164.978)", 400: "oklch(76.5% 0.177 163.223)", 500: "oklch(69.6% 0.17 162.48)", 600: "oklch(59.6% 0.145 163.225)", 700: "oklch(50.8% 0.118 165.612)", 800: "oklch(43.2% 0.095 166.913)", 900: "oklch(37.8% 0.077 168.94)", 950: "oklch(26.2% 0.051 172.552)" }, teal: { 50: "oklch(98.4% 0.014 180.72)", 100: "oklch(95.3% 0.051 180.801)", 200: "oklch(91% 0.096 180.426)", 300: "oklch(85.5% 0.138 181.071)", 400: "oklch(77.7% 0.152 181.912)", 500: "oklch(70.4% 0.14 182.503)", 600: "oklch(60% 0.118 184.704)", 700: "oklch(51.1% 0.096 186.391)", 800: "oklch(43.7% 0.078 188.216)", 900: "oklch(38.6% 0.063 188.416)", 950: "oklch(27.7% 0.046 192.524)" }, cyan: { 50: "oklch(98.4% 0.019 200.873)", 100: "oklch(95.6% 0.045 203.388)", 200: "oklch(91.7% 0.08 205.041)", 300: "oklch(86.5% 0.127 207.078)", 400: "oklch(78.9% 0.154 211.53)", 500: "oklch(71.5% 0.143 215.221)", 600: "oklch(60.9% 0.126 221.723)", 700: "oklch(52% 0.105 223.128)", 800: "oklch(45% 0.085 224.283)", 900: "oklch(39.8% 0.07 227.392)", 950: "oklch(30.2% 0.056 229.695)" }, sky: { 50: "oklch(97.7% 0.013 236.62)", 100: "oklch(95.1% 0.026 236.824)", 200: "oklch(90.1% 0.058 230.902)", 300: "oklch(82.8% 0.111 230.318)", 400: "oklch(74.6% 0.16 232.661)", 500: "oklch(68.5% 0.169 237.323)", 600: "oklch(58.8% 0.158 241.966)", 700: "oklch(50% 0.134 242.749)", 800: "oklch(44.3% 0.11 240.79)", 900: "oklch(39.1% 0.09 240.876)", 950: "oklch(29.3% 0.066 243.157)" }, blue: { 50: "oklch(97% 0.014 254.604)", 100: "oklch(93.2% 0.032 255.585)", 200: "oklch(88.2% 0.059 254.128)", 300: "oklch(80.9% 0.105 251.813)", 400: "oklch(70.7% 0.165 254.624)", 500: "oklch(62.3% 0.214 259.815)", 600: "oklch(54.6% 0.245 262.881)", 700: "oklch(48.8% 0.243 264.376)", 800: "oklch(42.4% 0.199 265.638)", 900: "oklch(37.9% 0.146 265.522)", 950: "oklch(28.2% 0.091 267.935)" }, indigo: { 50: "oklch(96.2% 0.018 272.314)", 100: "oklch(93% 0.034 272.788)", 200: "oklch(87% 0.065 274.039)", 300: "oklch(78.5% 0.115 274.713)", 400: "oklch(67.3% 0.182 276.935)", 500: "oklch(58.5% 0.233 277.117)", 600: "oklch(51.1% 0.262 276.966)", 700: "oklch(45.7% 0.24 277.023)", 800: "oklch(39.8% 0.195 277.366)", 900: "oklch(35.9% 0.144 278.697)", 950: "oklch(25.7% 0.09 281.288)" }, violet: { 50: "oklch(96.9% 0.016 293.756)", 100: "oklch(94.3% 0.029 294.588)", 200: "oklch(89.4% 0.057 293.283)", 300: "oklch(81.1% 0.111 293.571)", 400: "oklch(70.2% 0.183 293.541)", 500: "oklch(60.6% 0.25 292.717)", 600: "oklch(54.1% 0.281 293.009)", 700: "oklch(49.1% 0.27 292.581)", 800: "oklch(43.2% 0.232 292.759)", 900: "oklch(38% 0.189 293.745)", 950: "oklch(28.3% 0.141 291.089)" }, purple: { 50: "oklch(97.7% 0.014 308.299)", 100: "oklch(94.6% 0.033 307.174)", 200: "oklch(90.2% 0.063 306.703)", 300: "oklch(82.7% 0.119 306.383)", 400: "oklch(71.4% 0.203 305.504)", 500: "oklch(62.7% 0.265 303.9)", 600: "oklch(55.8% 0.288 302.321)", 700: "oklch(49.6% 0.265 301.924)", 800: "oklch(43.8% 0.218 303.724)", 900: "oklch(38.1% 0.176 304.987)", 950: "oklch(29.1% 0.149 302.717)" }, fuchsia: { 50: "oklch(97.7% 0.017 320.058)", 100: "oklch(95.2% 0.037 318.852)", 200: "oklch(90.3% 0.076 319.62)", 300: "oklch(83.3% 0.145 321.434)", 400: "oklch(74% 0.238 322.16)", 500: "oklch(66.7% 0.295 322.15)", 600: "oklch(59.1% 0.293 322.896)", 700: "oklch(51.8% 0.253 323.949)", 800: "oklch(45.2% 0.211 324.591)", 900: "oklch(40.1% 0.17 325.612)", 950: "oklch(29.3% 0.136 325.661)" }, pink: { 50: "oklch(97.1% 0.014 343.198)", 100: "oklch(94.8% 0.028 342.258)", 200: "oklch(89.9% 0.061 343.231)", 300: "oklch(82.3% 0.12 346.018)", 400: "oklch(71.8% 0.202 349.761)", 500: "oklch(65.6% 0.241 354.308)", 600: "oklch(59.2% 0.249 0.584)", 700: "oklch(52.5% 0.223 3.958)", 800: "oklch(45.9% 0.187 3.815)", 900: "oklch(40.8% 0.153 2.432)", 950: "oklch(28.4% 0.109 3.907)" }, rose: { 50: "oklch(96.9% 0.015 12.422)", 100: "oklch(94.1% 0.03 12.58)", 200: "oklch(89.2% 0.058 10.001)", 300: "oklch(81% 0.117 11.638)", 400: "oklch(71.2% 0.194 13.428)", 500: "oklch(64.5% 0.246 16.439)", 600: "oklch(58.6% 0.253 17.585)", 700: "oklch(51.4% 0.222 16.935)", 800: "oklch(45.5% 0.188 13.697)", 900: "oklch(41% 0.159 10.272)", 950: "oklch(27.1% 0.105 12.094)" } };
 
-// src/kernel/components/ui/link.tsx
+// src/components/ui/link.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var linkVariants = cva(
   [
@@ -45,7 +22,7 @@ var linkVariants = cva(
     "active:text-[color-mix(in_oklch,var(--link-color)_var(--link-active-text-opacity),transparent)]",
     "data-[state=path-active]:text-[color-mix(in_oklch,var(--link-color)_var(--link-active-text-opacity),transparent)]",
     "transition-colors duration-[var(--link-transition-duration)] ease-out",
-    "focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-ring",
+    "focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-stroke",
     "data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-disabled:opacity-50",
     "[&_svg]:mb-0.5 [&_svg]:inline [&_svg]:size-[1em] [&_svg]:shrink-0"
   ].join(" "),
@@ -72,62 +49,50 @@ var linkVariants = cva(
       variant: "standalone"
     }
   }
-);
-var linkTextDecorationReset = "group/link !no-underline hover:!no-underline active:!no-underline";
-var linkUnderlineClasses = [
+), linkTextDecorationReset = "group/link !no-underline hover:!no-underline active:!no-underline", linkUnderlineClasses = [
   "inline underline decoration-[length:var(--link-underline-thickness)] decoration-[color-mix(in_oklch,var(--link-underline-color)_var(--link-underline-opacity),transparent)] underline-offset-[var(--link-underline-offset)] transition-[text-decoration-color] duration-[var(--link-transition-duration)] ease-out",
   "group-hover/link:decoration-[color-mix(in_oklch,var(--link-hover-underline-color,var(--link-underline-color))_var(--link-hover-underline-opacity),transparent)]",
   "group-active/link:decoration-[color-mix(in_oklch,var(--link-active-underline-color,var(--link-hover-underline-color,var(--link-underline-color)))_var(--link-active-underline-opacity),transparent)]",
   "data-[state=path-active]:decoration-[color-mix(in_oklch,var(--link-active-underline-color,var(--link-hover-underline-color,var(--link-underline-color)))_var(--link-active-underline-opacity),transparent)]"
 ].join(" ");
 function namedLinkColor(color) {
-  if (color === "accent") return "accent";
-  if (color === "default") return "default";
-  return null;
+  return color === "accent" ? "accent" : color === "default" ? "default" : null;
 }
 function tailwindColorValue(color) {
-  const named = l[color];
-  if (typeof named === "string") {
+  let named = l[color];
+  if (typeof named == "string")
     return named === "current" || named === "currentcolor" ? "currentColor" : named;
-  }
-  const match = color.match(/^(.+)-([0-9]{2,3})$/);
-  if (!match) return void 0;
-  const [, paletteName, shade] = match;
-  if (!paletteName || !shade) return void 0;
-  const palette = l[paletteName];
-  if (!palette || typeof palette === "string") return void 0;
-  return palette[shade];
+  let match = color.match(/^(.+)-([0-9]{2,3})$/);
+  if (!match) return;
+  let [, paletteName, shade] = match;
+  if (!paletteName || !shade) return;
+  let palette = l[paletteName];
+  if (!(!palette || typeof palette == "string"))
+    return palette[shade];
 }
 function linkColorValue(color) {
-  if (!color || color === "accent" || color === "default") return void 0;
+  if (!color || color === "accent" || color === "default") return;
   if (color.startsWith("var(")) return color;
   if (color.startsWith("--")) return `var(${color})`;
-  if (color.startsWith("#") || color.startsWith("rgb(") || color.startsWith("rgba(") || color.startsWith("hsl(") || color.startsWith("hsla(") || color.startsWith("oklch(") || color.startsWith("oklab(") || color.startsWith("lch(") || color.startsWith("lab(") || color.startsWith("color(")) {
+  if (color.startsWith("#") || color.startsWith("rgb(") || color.startsWith("rgba(") || color.startsWith("hsl(") || color.startsWith("hsla(") || color.startsWith("oklch(") || color.startsWith("oklab(") || color.startsWith("lch(") || color.startsWith("lab(") || color.startsWith("color("))
     return color;
-  }
-  const tailwindColor = tailwindColorValue(color);
-  if (tailwindColor) return `var(--color-${color}, ${tailwindColor})`;
-  return `var(--color-${color}, var(--${color}))`;
+  let tailwindColor = tailwindColorValue(color);
+  return tailwindColor ? `var(--color-${color}, ${tailwindColor})` : `var(--color-${color}, var(--${color}))`;
 }
 function isExternalHref(href) {
   return /^[a-z][a-z0-9+.-]*:/i.test(href) && !href.startsWith("mailto:") && !href.startsWith("tel:");
 }
 function mergeRel(rel) {
-  const values = new Set((rel ?? "").split(/\s+/).filter(Boolean));
-  values.add("noopener");
-  values.add("noreferrer");
-  return Array.from(values).join(" ");
+  let values = new Set((rel ?? "").split(/\s+/).filter(Boolean));
+  return values.add("noopener"), values.add("noreferrer"), Array.from(values).join(" ");
 }
 function resolveLinkVariant(variant) {
-  if (variant?.startsWith("button.")) {
-    return {
-      buttonVariant: variant.slice("button.".length),
-      linkVariant: null
-    };
-  }
-  return {
+  return variant?.startsWith("button.") ? {
+    buttonVariant: variant.slice(7),
+    linkVariant: null
+  } : {
     buttonVariant: null,
-    linkVariant: variant?.slice("link.".length) ?? "standalone"
+    linkVariant: variant?.slice(5) ?? "standalone"
   };
 }
 function Link({
@@ -147,18 +112,11 @@ function Link({
   variant = "link.standalone",
   ...props
 }) {
-  const { buttonVariant, linkVariant } = resolveLinkVariant(variant);
-  const resolvedColor = namedLinkColor(color);
-  const customColor = linkColorValue(color);
-  const resolvedStyle = customColor ? { ...style, "--link-color": customColor } : style;
-  const state = active ? "path-active" : void 0;
-  const label = buttonVariant ? children : /* @__PURE__ */ jsx("span", { className: linkUnderlineClasses, "data-state": state, children });
-  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+  let { buttonVariant, linkVariant } = resolveLinkVariant(variant), resolvedColor = namedLinkColor(color), customColor = linkColorValue(color), resolvedStyle = customColor ? { ...style, "--link-color": customColor } : style, state = active ? "path-active" : void 0, content = /* @__PURE__ */ jsxs(Fragment, { children: [
     leftIcon ? /* @__PURE__ */ jsx("span", { className: "mr-1 inline-flex shrink-0", children: leftIcon }) : null,
-    label,
+    buttonVariant ? children : /* @__PURE__ */ jsx("span", { className: linkUnderlineClasses, "data-state": state, children }),
     rightIcon ? /* @__PURE__ */ jsx("span", { className: "ml-1 inline-flex shrink-0", children: rightIcon }) : null
-  ] });
-  const classes = cn(
+  ] }), classes = cn(
     buttonVariant ? buttonVariants({
       iconOnly,
       size,
@@ -170,46 +128,37 @@ function Link({
     }),
     buttonVariant ? linkTextDecorationReset : void 0,
     className
-  );
-  const disabledProps = {
-    "aria-disabled": disabled ? true : void 0,
+  ), disabledProps = {
+    "aria-disabled": disabled ? !0 : void 0,
     "data-disabled": disabled ? "" : void 0,
     tabIndex: disabled ? -1 : props.tabIndex
-  };
-  const ariaCurrent = active ? "page" : void 0;
-  const commonProps = {
-    "aria-current": ariaCurrent,
+  }, commonProps = {
+    "aria-current": active ? "page" : void 0,
     className: classes,
     "data-state": state,
     style: resolvedStyle,
     ...props,
     ...disabledProps
   };
-  if (disabled || href.startsWith("#") || href.startsWith("mailto:") || href.startsWith("tel:")) {
-    return /* @__PURE__ */ jsx(
-      "a",
-      {
-        href: disabled ? void 0 : href,
-        rel,
-        target,
-        ...commonProps,
-        children: content
-      }
-    );
-  }
-  if (isExternalHref(href)) {
-    return /* @__PURE__ */ jsx(
-      "a",
-      {
-        href,
-        rel: target === "_blank" || !target ? mergeRel(rel) : rel,
-        target: target ?? "_blank",
-        ...commonProps,
-        children: content
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx(NextLink, { href, ...commonProps, children: content });
+  return disabled || href.startsWith("#") || href.startsWith("mailto:") || href.startsWith("tel:") ? /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: disabled ? void 0 : href,
+      rel,
+      target,
+      ...commonProps,
+      children: content
+    }
+  ) : isExternalHref(href) ? /* @__PURE__ */ jsx(
+    "a",
+    {
+      href,
+      rel: target === "_blank" || !target ? mergeRel(rel) : rel,
+      target: target ?? "_blank",
+      ...commonProps,
+      children: content
+    }
+  ) : /* @__PURE__ */ jsx(NextLink, { href, ...commonProps, children: content });
 }
 export {
   Link,

package/dist/kernel/components/ui/menu.d.ts

@@ -1,27 +1,27 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { Menu as Menu$1 } from '@base-ui/react/menu';
-import { ComponentPropsWithoutRef } from 'react';
+import { ComponentPropsWithRef } from 'react';
 
-type MenuProps = ComponentPropsWithoutRef<typeof Menu$1.Root>;
-type MenuArrowProps = ComponentPropsWithoutRef<typeof Menu$1.Arrow>;
-type MenuBackdropProps = ComponentPropsWithoutRef<typeof Menu$1.Backdrop>;
-type MenuTriggerProps = ComponentPropsWithoutRef<typeof Menu$1.Trigger>;
-type MenuPortalProps = ComponentPropsWithoutRef<typeof Menu$1.Portal>;
-type MenuPositionerProps = ComponentPropsWithoutRef<typeof Menu$1.Positioner>;
-type MenuPopupProps = ComponentPropsWithoutRef<typeof Menu$1.Popup>;
-type MenuViewportProps = ComponentPropsWithoutRef<typeof Menu$1.Viewport>;
-type MenuItemProps = ComponentPropsWithoutRef<typeof Menu$1.Item>;
-type MenuLinkItemProps = ComponentPropsWithoutRef<typeof Menu$1.LinkItem>;
-type MenuSubmenuRootProps = ComponentPropsWithoutRef<typeof Menu$1.SubmenuRoot>;
-type MenuSubmenuTriggerProps = ComponentPropsWithoutRef<typeof Menu$1.SubmenuTrigger>;
-type MenuCheckboxItemProps = ComponentPropsWithoutRef<typeof Menu$1.CheckboxItem>;
-type MenuCheckboxItemIndicatorProps = ComponentPropsWithoutRef<typeof Menu$1.CheckboxItemIndicator>;
-type MenuRadioGroupProps = ComponentPropsWithoutRef<typeof Menu$1.RadioGroup>;
-type MenuRadioItemProps = ComponentPropsWithoutRef<typeof Menu$1.RadioItem>;
-type MenuRadioItemIndicatorProps = ComponentPropsWithoutRef<typeof Menu$1.RadioItemIndicator>;
-type MenuGroupProps = ComponentPropsWithoutRef<typeof Menu$1.Group>;
-type MenuGroupLabelProps = ComponentPropsWithoutRef<typeof Menu$1.GroupLabel>;
-type MenuSeparatorProps = ComponentPropsWithoutRef<typeof Menu$1.Separator>;
+type MenuProps = ComponentPropsWithRef<typeof Menu$1.Root>;
+type MenuArrowProps = ComponentPropsWithRef<typeof Menu$1.Arrow>;
+type MenuBackdropProps = ComponentPropsWithRef<typeof Menu$1.Backdrop>;
+type MenuTriggerProps = ComponentPropsWithRef<typeof Menu$1.Trigger>;
+type MenuPortalProps = ComponentPropsWithRef<typeof Menu$1.Portal>;
+type MenuPositionerProps = ComponentPropsWithRef<typeof Menu$1.Positioner>;
+type MenuPopupProps = ComponentPropsWithRef<typeof Menu$1.Popup>;
+type MenuViewportProps = ComponentPropsWithRef<typeof Menu$1.Viewport>;
+type MenuItemProps = ComponentPropsWithRef<typeof Menu$1.Item>;
+type MenuLinkItemProps = ComponentPropsWithRef<typeof Menu$1.LinkItem>;
+type MenuSubmenuRootProps = ComponentPropsWithRef<typeof Menu$1.SubmenuRoot>;
+type MenuSubmenuTriggerProps = ComponentPropsWithRef<typeof Menu$1.SubmenuTrigger>;
+type MenuCheckboxItemProps = ComponentPropsWithRef<typeof Menu$1.CheckboxItem>;
+type MenuCheckboxItemIndicatorProps = ComponentPropsWithRef<typeof Menu$1.CheckboxItemIndicator>;
+type MenuRadioGroupProps = ComponentPropsWithRef<typeof Menu$1.RadioGroup>;
+type MenuRadioItemProps = ComponentPropsWithRef<typeof Menu$1.RadioItem>;
+type MenuRadioItemIndicatorProps = ComponentPropsWithRef<typeof Menu$1.RadioItemIndicator>;
+type MenuGroupProps = ComponentPropsWithRef<typeof Menu$1.Group>;
+type MenuGroupLabelProps = ComponentPropsWithRef<typeof Menu$1.GroupLabel>;
+type MenuSeparatorProps = ComponentPropsWithRef<typeof Menu$1.Separator>;
 declare function MenuRoot(props: MenuProps): react_jsx_runtime.JSX.Element;
 declare function MenuTrigger({ className, ...props }: MenuTriggerProps): react_jsx_runtime.JSX.Element;
 declare function MenuPortal(props: MenuPortalProps): react_jsx_runtime.JSX.Element;

package/dist/kernel/components/ui/menu.js

@@ -1,32 +1,10 @@
 "use client";
 
-// src/kernel/components/ui/menu.tsx
+// src/components/ui/menu.tsx
 import { Menu as BaseMenu } from "@base-ui/react/menu";
-
-// src/utils/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      z: [
-        "z-content",
-        "z-nav",
-        "z-overlay",
-        "z-modal",
-        "z-search",
-        "z-toast",
-        "z-progress"
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/kernel/components/ui/menu.tsx
-import { Check } from "lucide-react";
+import { FrameworkCheckIcon as Check } from "@publish.os/nextjs/kernel/framework-icons";
+import { useThemeScope } from "@publish.os/nextjs/theme-scope";
+import { cn } from "@publish.os/nextjs/utils/cn";
 import { jsx } from "react/jsx-runtime";
 function MenuRoot(props) {
   return /* @__PURE__ */ jsx(BaseMenu.Root, { ...props });
@@ -36,7 +14,7 @@ function MenuTrigger({ className, ...props }) {
     BaseMenu.Trigger,
     {
       className: cn(
-        "rounded-button focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-ring",
+        "rounded-button focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-stroke",
         className
       ),
       ...props
@@ -44,7 +22,8 @@ function MenuTrigger({ className, ...props }) {
   );
 }
 function MenuPortal(props) {
-  return /* @__PURE__ */ jsx(BaseMenu.Portal, { ...props });
+  let themeScope = useThemeScope();
+  return /* @__PURE__ */ jsx(BaseMenu.Portal, { ...props, ...themeScope });
 }
 function MenuBackdrop({ className, ...props }) {
   return /* @__PURE__ */ jsx(
@@ -74,7 +53,7 @@ function MenuPopup({ className, ...props }) {
     BaseMenu.Popup,
     {
       className: cn(
-        "animate-popup min-w-44 rounded-popup border border-[color:var(--surface-menu-border)] bg-surface-menu p-1 text-surface-menu-foreground shadow-lg outline-none",
+        "animate-popup min-w-44 rounded-popup border border-menu-stroke-3 bg-menu-surface-1 p-1 text-menu-foreground-1 shadow-menu outline-none [--text-foreground:var(--menu-foreground-1)] [--text-muted-foreground:var(--menu-foreground-4)]",
         className
       ),
       ...props
@@ -85,7 +64,7 @@ function MenuArrow({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     BaseMenu.Arrow,
     {
-      className: cn("fill-surface-menu text-surface-menu", className),
+      className: cn("fill-menu-surface-1 text-menu-surface-1", className),
       ...props
     }
   );
@@ -94,8 +73,8 @@ function MenuViewport({ className, ...props }) {
   return /* @__PURE__ */ jsx(BaseMenu.Viewport, { className: cn("outline-none", className), ...props });
 }
 var menuItemClassName = [
-  "flex cursor-default select-none items-center gap-2 rounded-[max(calc(var(--radius-popup)_-_0.25rem),0px)] px-2 py-1.5 text-sm text-surface-menu-foreground outline-none",
-  "data-[highlighted]:bg-surface-menu-hover data-[highlighted]:text-surface-menu-hover-foreground data-[state=checked]:bg-surface-menu-active data-[state=checked]:text-surface-menu-active-foreground data-disabled:pointer-events-none data-disabled:text-surface-menu-disabled-foreground"
+  "flex cursor-default select-none items-center gap-2 rounded-[max(calc(var(--radius-popup)_-_0.25rem),0px)] px-2 py-1.5 text-sm text-menu-foreground-1 outline-none",
+  "data-[highlighted]:bg-menu-highlight-surface data-[highlighted]:text-menu-highlight-foreground data-[state=checked]:bg-menu-surface-4 data-[state=checked]:text-menu-foreground-1 data-[state=checked]:data-[highlighted]:bg-menu-highlight-surface data-[state=checked]:data-[highlighted]:text-menu-highlight-foreground data-disabled:pointer-events-none data-disabled:text-menu-foreground-4"
 ].join(" ");
 function MenuItem({ className, ...props }) {
   return /* @__PURE__ */ jsx(BaseMenu.Item, { className: cn(menuItemClassName, className), ...props });
@@ -190,7 +169,7 @@ function MenuGroupLabel({ className, ...props }) {
     BaseMenu.GroupLabel,
     {
       className: cn(
-        "px-2 py-1 text-xs font-medium text-surface-menu-disabled-foreground",
+        "px-2 py-1 text-xs font-medium text-menu-foreground-4",
         className
       ),
       ...props
@@ -201,13 +180,12 @@ function MenuSeparator({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     BaseMenu.Separator,
     {
-      className: cn("my-1 h-px shrink-0 bg-stroke-3", className),
+      className: cn("my-1 h-px shrink-0 bg-menu-stroke-3", className),
       ...props
     }
   );
 }
-var createMenuHandle = BaseMenu.createHandle;
-var Menu = Object.assign(MenuRoot, {
+var createMenuHandle = BaseMenu.createHandle, Menu = Object.assign(MenuRoot, {
   Arrow: MenuArrow,
   Backdrop: MenuBackdrop,
   CheckboxItem: MenuCheckboxItem,

package/dist/kernel/components/ui/meta-key.d.ts

@@ -1,8 +1,13 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { KbdProps } from './kbd.js';
-import { ComponentPropsWithoutRef } from 'react';
-import 'class-variance-authority/types';
-import 'class-variance-authority';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import { HTMLAttributes, ComponentPropsWithoutRef } from 'react';
+
+declare const kbdVariants: (props?: ({
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
+    square?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type KbdProps = HTMLAttributes<HTMLElement> & VariantProps<typeof kbdVariants>;
 
 type MetaKeyProps = Omit<KbdProps, "children"> & {
     children?: ComponentPropsWithoutRef<"kbd">["children"];

package/dist/kernel/components/ui/meta-key.js

@@ -1,5 +1,5 @@
-// src/kernel/components/ui/meta-key.tsx
-import { Kbd } from "./kbd.js";
+// src/components/ui/meta-key.tsx
+import { Kbd } from "@publish.os/nextjs/kernel/components/ui/kbd";
 import { jsx } from "react/jsx-runtime";
 function MetaKey({ children, ...props }) {
   return /* @__PURE__ */ jsx(Kbd, { ...props, children: children ?? "\u2318" });

package/dist/kernel/components/ui/navigation-menu.d.ts

@@ -1,20 +1,20 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { NavigationMenu as NavigationMenu$1 } from '@base-ui/react/navigation-menu';
-import { ComponentPropsWithoutRef } from 'react';
+import { ComponentPropsWithRef } from 'react';
 
-type NavigationMenuProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Root>;
-type NavigationMenuListProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.List>;
-type NavigationMenuItemProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Item>;
-type NavigationMenuTriggerProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Trigger>;
-type NavigationMenuIconProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Icon>;
-type NavigationMenuContentProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Content>;
-type NavigationMenuLinkProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Link>;
-type NavigationMenuBackdropProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Backdrop>;
-type NavigationMenuPortalProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Portal>;
-type NavigationMenuPositionerProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Positioner>;
-type NavigationMenuPopupProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Popup>;
-type NavigationMenuViewportProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Viewport>;
-type NavigationMenuArrowProps = ComponentPropsWithoutRef<typeof NavigationMenu$1.Arrow>;
+type NavigationMenuProps = ComponentPropsWithRef<typeof NavigationMenu$1.Root>;
+type NavigationMenuListProps = ComponentPropsWithRef<typeof NavigationMenu$1.List>;
+type NavigationMenuItemProps = ComponentPropsWithRef<typeof NavigationMenu$1.Item>;
+type NavigationMenuTriggerProps = ComponentPropsWithRef<typeof NavigationMenu$1.Trigger>;
+type NavigationMenuIconProps = ComponentPropsWithRef<typeof NavigationMenu$1.Icon>;
+type NavigationMenuContentProps = ComponentPropsWithRef<typeof NavigationMenu$1.Content>;
+type NavigationMenuLinkProps = ComponentPropsWithRef<typeof NavigationMenu$1.Link>;
+type NavigationMenuBackdropProps = ComponentPropsWithRef<typeof NavigationMenu$1.Backdrop>;
+type NavigationMenuPortalProps = ComponentPropsWithRef<typeof NavigationMenu$1.Portal>;
+type NavigationMenuPositionerProps = ComponentPropsWithRef<typeof NavigationMenu$1.Positioner>;
+type NavigationMenuPopupProps = ComponentPropsWithRef<typeof NavigationMenu$1.Popup>;
+type NavigationMenuViewportProps = ComponentPropsWithRef<typeof NavigationMenu$1.Viewport>;
+type NavigationMenuArrowProps = ComponentPropsWithRef<typeof NavigationMenu$1.Arrow>;
 declare function NavigationMenuRoot({ className, ...props }: NavigationMenuProps): react_jsx_runtime.JSX.Element;
 declare function NavigationMenuList({ className, ...props }: NavigationMenuListProps): react_jsx_runtime.JSX.Element;
 declare function NavigationMenuItem(props: NavigationMenuItemProps): react_jsx_runtime.JSX.Element;