@bccampus/ui-components 0.4.2 → 0.5.0

package/dist/components/ui/icon-generator/generate-tiles.js

@@ -0,0 +1,223 @@
+import { jsx } from "react/jsx-runtime";
+import { c as cn } from "../../../_chunks/utils.js";
+import { TileShape } from "./types.js";
+const randomSet = [
+  TileShape.Square,
+  TileShape.Circle,
+  TileShape.Diamond,
+  TileShape.Hexagon,
+  TileShape.TriangleSE,
+  TileShape.TriangleSW,
+  TileShape.TriangleNW,
+  TileShape.TriangleNE,
+  TileShape.PieSE,
+  TileShape.PieSW,
+  TileShape.PieNW,
+  TileShape.PieNE
+];
+const TileTemplates = {
+  [TileShape.Blank]: () => null,
+  [TileShape.Rand]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[randomSet[Math.floor(Math.random() * randomSet.length)]](tileX, tileY, tileSize, tileConfig),
+  [TileShape.Mosaic]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[Math.random() > 0.8 ? TileShape.Blank : TileShape.Square](tileX, tileY, tileSize, tileConfig),
+  [TileShape.MosaicCircle]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[Math.random() > 0.8 ? TileShape.Blank : TileShape.Circle](tileX, tileY, tileSize, tileConfig),
+  [TileShape.MosaicDiamond]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[Math.random() > 0.8 ? TileShape.Blank : TileShape.Diamond](tileX, tileY, tileSize, tileConfig),
+  [TileShape.Square]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "rect",
+    {
+      x: tileSize * tileX,
+      y: tileSize * tileY,
+      width: tileSize * tileConfig.scale,
+      height: tileSize * tileConfig.scale,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.Circle]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "circle",
+    {
+      cx: tileSize * (tileX + 0.5 * tileConfig.scale),
+      cy: tileSize * (tileY + 0.5 * tileConfig.scale),
+      r: tileSize / 2 * tileConfig.scale,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.Diamond]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * (tileX + 0.5 * tileConfig.scale)} ${tileSize * tileY} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + 0.5 * tileConfig.scale)} 
+      L ${tileSize * (tileX + 0.5 * tileConfig.scale)} ${tileSize * (tileY + tileConfig.scale)} 
+      L ${tileSize * tileX} ${tileSize * (tileY + 0.5 * tileConfig.scale)}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.Hexagon]: (tileX, tileY, tileSize, tileConfig) => {
+    const side = tileSize / Math.sqrt(3);
+    const start = (tileSize - side) / 2;
+    return /* @__PURE__ */ jsx(
+      "path",
+      {
+        rotate: 45,
+        d: `M ${tileSize * tileX + start * tileConfig.scale} ${tileSize * tileY}
+        L ${tileSize * tileX + (start + side) * tileConfig.scale} ${tileSize * tileY}
+        L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + 0.5 * tileConfig.scale)}
+        L ${tileSize * tileX + (start + side) * tileConfig.scale} ${tileSize * (tileY + tileConfig.scale)}
+        L ${tileSize * tileX + start * tileConfig.scale} ${tileSize * (tileY + tileConfig.scale)}
+        L ${tileSize * tileX} ${tileSize * (tileY + 0.5 * tileConfig.scale)}  Z`,
+        className: cn("fill-current stroke-none", tileConfig?.className)
+      },
+      `tile-${tileX}-${tileY}`
+    );
+  },
+  [TileShape.RandBasic]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[TileShape.Square + Math.floor(Math.random() * 4)](tileX, tileY, tileSize, tileConfig),
+  [TileShape.TriangleSE]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * (tileX + tileConfig.scale)} ${tileSize * tileY} 
+      L ${tileSize * tileX} ${tileSize * (tileY + tileConfig.scale)} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + tileConfig.scale)}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.TriangleSW]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileX} ${tileSize * tileY} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + tileConfig.scale)} 
+      L ${tileSize * tileX} ${tileSize * (tileY + tileConfig.scale)}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.TriangleNW]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * (tileX + tileConfig.scale)} ${tileSize * tileY} 
+      L ${tileSize * tileX} ${tileSize * (tileY + tileConfig.scale)} 
+      L ${tileSize * tileX} ${tileSize * tileY}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.TriangleNE]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileX} ${tileSize * tileY} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + tileConfig.scale)} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * tileY}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.TriangleRand]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[TileShape.TriangleSE + Math.floor(Math.random() * 4)](
+    tileX,
+    tileY,
+    tileSize,
+    tileConfig
+  ),
+  [TileShape.CaretN]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileX} ${tileSize * (tileY + tileConfig.scale)} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + tileConfig.scale)} 
+      L ${tileSize * (tileX + 0.5 * tileConfig.scale)} ${tileSize * tileY}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.CaretE]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileX} ${tileSize * tileY} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + 0.5 * tileConfig.scale)} 
+      L ${tileSize * tileX} ${tileSize * (tileY + tileConfig.scale)}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.CaretS]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileX} ${tileSize * tileY} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * tileY} 
+      L ${tileSize * (tileX + 0.5 * tileConfig.scale)} ${tileSize * (tileY + tileConfig.scale)}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.CaretW]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * (tileX + tileConfig.scale)} ${tileSize * tileY} 
+      L ${tileSize * tileX} ${tileSize * (tileY + 0.5 * tileConfig.scale)} 
+      L ${tileSize * (tileX + tileConfig.scale)} ${tileSize * (tileY + tileConfig.scale)}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.CaretRand]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[TileShape.CaretN + Math.floor(Math.random() * 4)](tileX, tileY, tileSize, tileConfig),
+  [TileShape.PieSE]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileConfig.scale + tileSize * tileX} ${tileSize * tileY} 
+      A ${tileSize * tileConfig.scale} ${tileSize * tileConfig.scale}, 0, 0, 0, ${tileSize * tileX} ${tileSize * tileConfig.scale + tileSize * tileY} 
+      L ${tileSize * tileConfig.scale + tileSize * tileX} ${tileSize * tileConfig.scale + tileSize * tileY}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.PieSW]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileConfig.scale + tileSize * tileX} ${tileSize * tileConfig.scale + tileSize * tileY} 
+      A ${tileSize * tileConfig.scale} ${tileSize * tileConfig.scale}, 0, 0, 0, ${tileSize * tileX} ${tileSize * tileY} 
+      L ${tileSize * tileX} ${tileSize * tileConfig.scale + tileSize * tileY}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.PieNW]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileX} ${tileSize * tileConfig.scale + tileSize * tileY} 
+      A ${tileSize * tileConfig.scale} ${tileSize * tileConfig.scale}, 0, 0, 0, ${tileSize * tileConfig.scale + tileSize * tileX} ${tileSize * tileY} 
+      L ${tileSize * tileX} ${tileSize * tileY}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.PieNE]: (tileX, tileY, tileSize, tileConfig) => /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: `M ${tileSize * tileX} ${tileSize * tileY} 
+      A ${tileSize * tileConfig.scale} ${tileSize * tileConfig.scale}, 0, 0, 0, ${tileSize * tileConfig.scale + tileSize * tileX} ${tileSize * tileConfig.scale + tileSize * tileY} 
+      L ${tileSize * tileConfig.scale + tileSize * tileX} ${tileSize * tileY}  Z`,
+      className: cn("fill-current stroke-none", tileConfig?.className)
+    },
+    `tile-${tileX}-${tileY}`
+  ),
+  [TileShape.PieRand]: (tileX, tileY, tileSize, tileConfig) => TileTemplates[TileShape.PieSE + Math.floor(Math.random() * 4)](tileX, tileY, tileSize, tileConfig)
+};
+const generateIconPattern = (width, height, tileConfig) => {
+  const pattern = [];
+  for (let y = 0; y < height; y++) {
+    pattern[y] = [];
+    for (let x = 0; x < width; x++) {
+      pattern[y].push(tileConfig);
+    }
+  }
+  return pattern;
+};
+const generateTiles = (pattern, tileSize, tileClassName) => pattern.map(
+  (rows, y) => rows.map((item, x) => {
+    const tileConfig = typeof item === "object" ? { className: cn(tileClassName, item.className), scale: item.scale ?? 1, shape: item.shape } : { className: tileClassName, scale: 1, shape: item };
+    return TileTemplates[tileConfig.shape](x, y, tileSize, tileConfig);
+  })
+).flat();
+export {
+  generateIconPattern,
+  generateTiles
+};

package/dist/components/ui/icon-generator/icon-generator.d.ts

@@ -0,0 +1,3 @@
+import { IconGeneratorProps } from './types';
+declare function IconGenerator({ pattern, tileSize, tileClassName, tileBgClassName, renderChildren, fit, ...props }: IconGeneratorProps): import("react").JSX.Element;
+export { IconGenerator };

package/dist/components/ui/icon-generator/icon-generator.js

@@ -0,0 +1,82 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { TileShape } from "./types.js";
+import { generateTiles } from "./generate-tiles.js";
+import { c as cn } from "../../../_chunks/utils.js";
+const defaultIconPattern = [
+  [TileShape.PieRand, TileShape.PieRand],
+  [TileShape.PieRand, TileShape.PieRand]
+];
+function IconGenerator({
+  pattern = defaultIconPattern,
+  tileSize = 64,
+  tileClassName,
+  tileBgClassName,
+  renderChildren,
+  fit = "none",
+  ...props
+}) {
+  const patternSize = useMemo(
+    () => ({
+      width: pattern.reduce((longestRow, row) => Math.max(longestRow, row.length), 0) * tileSize,
+      height: pattern.length * tileSize
+    }),
+    [pattern, tileSize]
+  );
+  const paths = useMemo(() => {
+    const tiles = generateTiles(pattern, tileSize, tileClassName);
+    if (tileBgClassName)
+      tiles.unshift(
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: 0,
+            y: 0,
+            width: patternSize.width,
+            height: patternSize.height,
+            className: cn("fill-black stroke-2 stroke-black", tileBgClassName)
+          },
+          "svg-mask-invert"
+        )
+      );
+    return tiles;
+  }, [pattern, patternSize, tileClassName, tileBgClassName, tileSize]);
+  const width = useMemo(() => {
+    switch (fit) {
+      case "fill":
+        return patternSize.width <= patternSize.height ? "100%" : void 0;
+      case "width":
+        return "100%";
+      case "none":
+        return patternSize.width;
+      default:
+        return void 0;
+    }
+  }, [fit, patternSize]);
+  const height = useMemo(() => {
+    switch (fit) {
+      case "fill":
+        return patternSize.height < patternSize.width ? "100%" : void 0;
+      case "height":
+        return "100%";
+      case "none":
+        return patternSize.height;
+      default:
+        return void 0;
+    }
+  }, [fit, patternSize]);
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width,
+      height,
+      viewBox: `0 0 ${patternSize.width} ${patternSize.height}`,
+      overflow: "visible",
+      ...props,
+      children: renderChildren ? renderChildren(paths, patternSize.width, patternSize.height) : paths
+    }
+  );
+}
+export {
+  IconGenerator
+};

package/dist/components/ui/icon-generator/index.d.ts

@@ -0,0 +1,4 @@
+export * from './icon-generator.tsx';
+export * from './generate-tiles.tsx';
+export * from './masked-image-generator.tsx';
+export * from './types';

package/dist/components/ui/icon-generator/index.js

@@ -0,0 +1,11 @@
+import { IconGenerator } from "./icon-generator.js";
+import { generateIconPattern, generateTiles } from "./generate-tiles.js";
+import { MaskedImageGenerator } from "./masked-image-generator.js";
+import { TileShape } from "./types.js";
+export {
+  IconGenerator,
+  MaskedImageGenerator,
+  TileShape,
+  generateIconPattern,
+  generateTiles
+};

package/dist/components/ui/icon-generator/masked-image-generator.d.ts

@@ -0,0 +1,3 @@
+import { MaskedImageGeneratorProps } from './types';
+declare function MaskedImageGenerator({ src, imageFit, imagePosition, maskType, ...props }: MaskedImageGeneratorProps): import("react").JSX.Element;
+export { MaskedImageGenerator };

package/dist/components/ui/icon-generator/masked-image-generator.js

@@ -0,0 +1,31 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useId, useMemo } from "react";
+import { IconGenerator } from "./icon-generator.js";
+const MaskedImageFit = { cover: "slice", contain: "meet", fill: "none" };
+const MaskedImagePosition = { top: "xMidYMin", center: "xMidYMid", bottom: "xMidYMax" };
+function MaskedImageGenerator({
+  src,
+  imageFit = "cover",
+  imagePosition = "top",
+  maskType = "alpha",
+  ...props
+}) {
+  const id = useId();
+  const aspectRatio = useMemo(
+    () => imageFit !== "fill" ? `${MaskedImagePosition[imagePosition]} ${MaskedImageFit[imageFit]}` : "none",
+    [imageFit, imagePosition]
+  );
+  return /* @__PURE__ */ jsx(
+    IconGenerator,
+    {
+      ...props,
+      renderChildren: (paths) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("mask", { id: `svg-mask${id}`, "mask-type": maskType, children: paths }),
+        /* @__PURE__ */ jsx("image", { href: src, width: "100%", height: "100%", mask: `url(#svg-mask${id})`, preserveAspectRatio: aspectRatio })
+      ] })
+    }
+  );
+}
+export {
+  MaskedImageGenerator
+};

package/dist/{masked-image-generator.d.ts → components/ui/icon-generator/types.d.ts}

@@ -1,58 +1,48 @@
-import { JSX } from 'react';
-import { JSX as JSX_2 } from 'react/jsx-runtime';
-
-declare interface IconGeneratorProps extends Omit<React.ComponentProps<"svg">, "children" | "width" | "height" | "overflow"> {
-    pattern?: (TileShape | TileConfig)[][];
-    tileSize?: number;
-    tileClassName?: string;
-    tileBgClassName?: string;
-    fit?: "none" | "fill" | "width" | "height";
-    renderChildren?: (paths: (JSX.Element | null)[], width: number, height: number) => React.ReactNode;
-}
-
-export declare function MaskedImageGenerator({ src, imageFit, imagePosition, maskType, ...props }: MaskedImageGeneratorProps): JSX_2.Element;
-
-declare interface MaskedImageGeneratorProps extends IconGeneratorProps {
-    src: string;
-    imageFit?: "cover" | "contain" | "fill";
-    imagePosition?: "top" | "center" | "bottom";
-    maskType?: "alpha" | "luminance";
-}
-
-declare interface TileConfig {
-    shape: TileShape;
-    scale?: number;
-    className?: string;
-}
-
-declare const TileShape: {
-    readonly Blank: 0;
-    readonly Rand: 1;
-    readonly Mosaic: 2;
-    readonly MosaicCircle: 3;
-    readonly MosaicDiamond: 4;
-    readonly Square: 6;
-    readonly Circle: 7;
-    readonly Diamond: 8;
-    readonly Hexagon: 9;
-    readonly RandBasic: 10;
-    readonly TriangleSE: 11;
-    readonly TriangleSW: 12;
-    readonly TriangleNW: 13;
-    readonly TriangleNE: 14;
-    readonly TriangleRand: 15;
-    readonly CaretN: 16;
-    readonly CaretE: 17;
-    readonly CaretS: 18;
-    readonly CaretW: 19;
-    readonly CaretRand: 20;
-    readonly PieSE: 21;
-    readonly PieSW: 22;
-    readonly PieNW: 23;
-    readonly PieNE: 24;
-    readonly PieRand: 25;
-};
-
-declare type TileShape = (typeof TileShape)[keyof typeof TileShape];
-
-export { }
+import { JSX } from 'react';
+export declare const TileShape: {
+    readonly Blank: 0;
+    readonly Rand: 1;
+    readonly Mosaic: 2;
+    readonly MosaicCircle: 3;
+    readonly MosaicDiamond: 4;
+    readonly Square: 6;
+    readonly Circle: 7;
+    readonly Diamond: 8;
+    readonly Hexagon: 9;
+    readonly RandBasic: 10;
+    readonly TriangleSE: 11;
+    readonly TriangleSW: 12;
+    readonly TriangleNW: 13;
+    readonly TriangleNE: 14;
+    readonly TriangleRand: 15;
+    readonly CaretN: 16;
+    readonly CaretE: 17;
+    readonly CaretS: 18;
+    readonly CaretW: 19;
+    readonly CaretRand: 20;
+    readonly PieSE: 21;
+    readonly PieSW: 22;
+    readonly PieNW: 23;
+    readonly PieNE: 24;
+    readonly PieRand: 25;
+};
+export type TileShape = (typeof TileShape)[keyof typeof TileShape];
+export interface TileConfig {
+    shape: TileShape;
+    scale?: number;
+    className?: string;
+}
+export interface IconGeneratorProps extends Omit<React.ComponentProps<"svg">, "children" | "width" | "height" | "overflow"> {
+    pattern?: (TileShape | TileConfig)[][];
+    tileSize?: number;
+    tileClassName?: string;
+    tileBgClassName?: string;
+    fit?: "none" | "fill" | "width" | "height";
+    renderChildren?: (paths: (JSX.Element | null)[], width: number, height: number) => React.ReactNode;
+}
+export interface MaskedImageGeneratorProps extends IconGeneratorProps {
+    src: string;
+    imageFit?: "cover" | "contain" | "fill";
+    imagePosition?: "top" | "center" | "bottom";
+    maskType?: "alpha" | "luminance";
+}

package/dist/components/ui/icon-generator/types.js

@@ -0,0 +1,30 @@
+const TileShape = {
+  Blank: 0,
+  Rand: 1,
+  Mosaic: 2,
+  MosaicCircle: 3,
+  MosaicDiamond: 4,
+  Square: 6,
+  Circle: 7,
+  Diamond: 8,
+  Hexagon: 9,
+  RandBasic: 10,
+  TriangleSE: 11,
+  TriangleSW: 12,
+  TriangleNW: 13,
+  TriangleNE: 14,
+  TriangleRand: 15,
+  CaretN: 16,
+  CaretE: 17,
+  CaretS: 18,
+  CaretW: 19,
+  CaretRand: 20,
+  PieSE: 21,
+  PieSW: 22,
+  PieNW: 23,
+  PieNE: 24,
+  PieRand: 25
+};
+export {
+  TileShape
+};

package/dist/components/ui/input.d.ts

@@ -0,0 +1,3 @@
+export type InputProps = React.ComponentProps<"input">;
+declare function Input({ className, ...props }: InputProps): import("react").JSX.Element;
+export { Input };

package/dist/{input.js → components/ui/input.js}

@@ -1,18 +1,18 @@
-import { jsx as n } from "react/jsx-runtime";
-import { c as i } from "./utils-CRiPKpXj.js";
-function s({ className: r, ...e }) {
-  return /* @__PURE__ */ n(
+import { jsx } from "react/jsx-runtime";
+import { c as cn } from "../../_chunks/utils.js";
+function Input({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
     "input",
     {
-      className: i(
+      className: cn(
         "w-full p-2 pr-8 text-brand-1 placeholder:text-brand-1 rounded-sm bg-complement-1-50 outline-none focus-visible:border-ring focus-visible:ring-ring focus-visible:ring-2",
-        r
+        className
       ),
       name: "search",
-      ...e
+      ...props
     }
   );
 }
 export {
-  s as Input
+  Input
 };

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

@@ -0,0 +1,16 @@
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
+declare function NavigationMenu({ className, children, noViewport, mega, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {
+    noViewport?: boolean;
+    mega?: boolean;
+}): import("react").JSX.Element;
+declare function NavigationMenuList({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.List>): import("react").JSX.Element;
+declare function NavigationMenuItem({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Item>): import("react").JSX.Element;
+declare const navigationMenuTriggerStyle: string;
+declare function NavigationMenuTrigger({ className, children, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>): import("react").JSX.Element;
+declare function NavigationMenuContent({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Content>): import("react").JSX.Element;
+declare function NavigationMenuViewport({ className, mega, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport> & {
+    mega?: boolean;
+}): import("react").JSX.Element;
+declare function NavigationMenuLink({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Link>): import("react").JSX.Element;
+declare function NavigationMenuIndicator({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>): import("react").JSX.Element;
+export { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuContent, NavigationMenuTrigger, NavigationMenuLink, NavigationMenuIndicator, NavigationMenuViewport, navigationMenuTriggerStyle, };