@thangnqdev/ui 0.1.0

package/dist/chunk-ATYGDTMK.js

@@ -0,0 +1,257 @@
+import { labelVariants, Label } from './chunk-GXI2H5XA.js';
+import { Kbd } from './chunk-EU2LPUYP.js';
+import { __export, cn } from './chunk-4S6L5V7X.js';
+import { forwardRef, useState } from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { ExternalLink, Check, Copy } from 'lucide-react';
+
+// src/typography/index.ts
+var typography_exports = {};
+__export(typography_exports, {
+  Blockquote: () => Blockquote,
+  Code: () => Code,
+  CodeBlock: () => CodeBlock,
+  Heading: () => Heading,
+  Kbd: () => Kbd,
+  Label: () => Label,
+  Link: () => Link,
+  Text: () => Text,
+  headingVariants: () => headingVariants,
+  labelVariants: () => labelVariants,
+  linkVariants: () => linkVariants,
+  textVariants: () => textVariants
+});
+var headingVariants = cva("font-bold tracking-tight text-[var(--ui-text-primary)]", {
+  variants: {
+    size: {
+      h1: "text-4xl sm:text-5xl lg:text-6xl font-extrabold tracking-tight",
+      h2: "text-3xl sm:text-4xl font-bold tracking-tight",
+      h3: "text-2xl sm:text-3xl font-bold tracking-tight",
+      h4: "text-xl sm:text-2xl font-semibold",
+      h5: "text-lg sm:text-xl font-semibold",
+      h6: "text-base sm:text-lg font-medium"
+    },
+    weight: {
+      normal: "font-normal",
+      medium: "font-medium",
+      semibold: "font-semibold",
+      bold: "font-bold",
+      extrabold: "font-extrabold"
+    },
+    align: {
+      left: "text-left",
+      center: "text-center",
+      right: "text-right"
+    }
+  },
+  defaultVariants: {
+    size: "h2",
+    align: "left"
+  }
+});
+var Heading = forwardRef(
+  ({ className, size = "h2", weight, align, as, children, ...props }, ref) => {
+    const Component = as || size || "h2";
+    return /* @__PURE__ */ jsx(
+      Component,
+      {
+        ref,
+        className: cn(headingVariants({ size, weight, align }), className),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Heading.displayName = "Heading";
+var textVariants = cva("leading-relaxed", {
+  variants: {
+    variant: {
+      body: "text-base text-[var(--ui-text-primary)]",
+      lead: "text-lg sm:text-xl text-[var(--ui-text-secondary)] font-normal leading-relaxed",
+      muted: "text-sm text-[var(--ui-text-muted)]",
+      small: "text-xs text-[var(--ui-text-secondary)] font-normal",
+      caption: "text-xs text-[var(--ui-text-muted)] uppercase tracking-wider font-semibold",
+      destructive: "text-sm text-[var(--ui-error)] font-medium",
+      success: "text-sm text-[var(--ui-success)] font-medium"
+    },
+    weight: {
+      light: "font-light",
+      normal: "font-normal",
+      medium: "font-medium",
+      semibold: "font-semibold",
+      bold: "font-bold"
+    },
+    align: {
+      left: "text-left",
+      center: "text-center",
+      right: "text-right",
+      justify: "text-justify"
+    },
+    truncate: {
+      true: "truncate",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    variant: "body",
+    weight: "normal",
+    align: "left",
+    truncate: false
+  }
+});
+var Text = forwardRef(
+  ({ className, variant, weight, align, truncate, as: Component = "p", children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      Component,
+      {
+        ref,
+        className: cn(textVariants({ variant, weight, align, truncate }), className),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Text.displayName = "Text";
+var linkVariants = cva(
+  "inline-flex items-center gap-1 font-medium transition-colors cursor-pointer text-[var(--ui-primary)] hover:text-[var(--ui-primary-hover)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-primary)] rounded-sm",
+  {
+    variants: {
+      underline: {
+        always: "underline underline-offset-4",
+        hover: "hover:underline underline-offset-4",
+        none: "no-underline"
+      },
+      variant: {
+        primary: "text-[var(--ui-primary)] hover:text-[var(--ui-primary-hover)]",
+        secondary: "text-[var(--ui-text-secondary)] hover:text-[var(--ui-text-primary)]",
+        muted: "text-[var(--ui-text-muted)] hover:text-[var(--ui-text-secondary)]"
+      }
+    },
+    defaultVariants: {
+      underline: "hover",
+      variant: "primary"
+    }
+  }
+);
+var Link = forwardRef(
+  ({ className, underline, variant, external, showExternalIcon = true, children, ...props }, ref) => {
+    const isExternal = external ?? (props.href?.startsWith("http") || props.target === "_blank");
+    return /* @__PURE__ */ jsxs(
+      "a",
+      {
+        ref,
+        target: isExternal ? "_blank" : props.target,
+        rel: isExternal ? "noopener noreferrer" : props.rel,
+        className: cn(linkVariants({ underline, variant }), className),
+        ...props,
+        children: [
+          children,
+          isExternal && showExternalIcon && /* @__PURE__ */ jsx(ExternalLink, { className: "w-3.5 h-3.5 opacity-70 inline-block ml-0.5 flex-shrink-0" })
+        ]
+      }
+    );
+  }
+);
+Link.displayName = "Link";
+var Code = forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "code",
+      {
+        ref,
+        className: cn(
+          "relative rounded bg-[var(--ui-bg-tertiary)] px-[0.35rem] py-[0.15rem] font-mono text-sm font-semibold text-[var(--ui-text-primary)] border border-[var(--ui-border-subtle)]",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Code.displayName = "Code";
+var CodeBlock = forwardRef(
+  ({ className, code, language = "bash", copyable = true, ...props }, ref) => {
+    const [copied, setCopied] = useState(false);
+    const handleCopy = async () => {
+      try {
+        await navigator.clipboard.writeText(code);
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2e3);
+      } catch (err) {
+        console.error("Failed to copy text", err);
+      }
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "relative rounded-lg border border-[var(--ui-border-subtle)] bg-[var(--ui-bg-secondary)] overflow-hidden font-mono text-sm shadow-sm",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 py-2 bg-[var(--ui-bg-tertiary)]/50 border-b border-[var(--ui-border-subtle)] text-xs text-[var(--ui-text-muted)] select-none", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-semibold uppercase tracking-wider", children: language }),
+            copyable && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: handleCopy,
+                className: "flex items-center gap-1 hover:text-[var(--ui-text-primary)] transition-colors p-1 rounded hover:bg-[var(--ui-bg-surface)]",
+                "aria-label": copied ? "Copied code" : "Copy code to clipboard",
+                children: copied ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(Check, { className: "w-3.5 h-3.5 text-[var(--ui-success)]" }),
+                  /* @__PURE__ */ jsx("span", { className: "text-[var(--ui-success)] text-[11px]", children: "Copied" })
+                ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(Copy, { className: "w-3.5 h-3.5" }),
+                  /* @__PURE__ */ jsx("span", { className: "text-[11px]", children: "Copy" })
+                ] })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("pre", { className: "p-4 overflow-x-auto text-[var(--ui-text-primary)] leading-relaxed", children: /* @__PURE__ */ jsx("code", { children: code }) })
+        ]
+      }
+    );
+  }
+);
+CodeBlock.displayName = "CodeBlock";
+var Blockquote = forwardRef(
+  ({ className, citeAuthor, citeSource, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "blockquote",
+      {
+        ref,
+        className: cn(
+          "mt-6 border-l-4 border-[var(--ui-primary)] pl-6 italic text-[var(--ui-text-secondary)] space-y-2",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "text-base sm:text-lg", children }),
+          (citeAuthor || citeSource) && /* @__PURE__ */ jsxs("footer", { className: "not-italic text-xs font-semibold text-[var(--ui-text-muted)] tracking-wider", children: [
+            citeAuthor && /* @__PURE__ */ jsxs("span", { children: [
+              "\u2014 ",
+              citeAuthor
+            ] }),
+            citeSource && /* @__PURE__ */ jsxs("span", { className: "opacity-75 ml-1", children: [
+              "(",
+              citeSource,
+              ")"
+            ] })
+          ] })
+        ]
+      }
+    );
+  }
+);
+Blockquote.displayName = "Blockquote";
+
+export { Blockquote, Code, CodeBlock, Heading, Link, Text, headingVariants, linkVariants, textVariants, typography_exports };
+//# sourceMappingURL=chunk-ATYGDTMK.js.map
+//# sourceMappingURL=chunk-ATYGDTMK.js.map

package/dist/chunk-ATYGDTMK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/typography/index.ts","../src/typography/Heading.tsx","../src/typography/Text.tsx","../src/typography/Link.tsx","../src/typography/Code.tsx","../src/typography/Blockquote.tsx"],"names":["cva","forwardRef","jsx","jsxs"],"mappings":"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","file":"chunk-ATYGDTMK.js","sourcesContent":["export * from './Heading';\r\nexport * from './Text';\r\nexport * from './Label';\r\nexport * from './Link';\r\nexport * from './Code';\r\nexport * from './Blockquote';\r\nexport * from './Kbd';\r\n","import React, { forwardRef } from 'react';\r\nimport { cva, type VariantProps } from 'class-variance-authority';\r\nimport { cn } from '../utils/cn';\r\n\r\nexport const headingVariants = cva('font-bold tracking-tight text-[var(--ui-text-primary)]', {\r\n  variants: {\r\n    size: {\r\n      h1: 'text-4xl sm:text-5xl lg:text-6xl font-extrabold tracking-tight',\r\n      h2: 'text-3xl sm:text-4xl font-bold tracking-tight',\r\n      h3: 'text-2xl sm:text-3xl font-bold tracking-tight',\r\n      h4: 'text-xl sm:text-2xl font-semibold',\r\n      h5: 'text-lg sm:text-xl font-semibold',\r\n      h6: 'text-base sm:text-lg font-medium',\r\n    },\r\n    weight: {\r\n      normal: 'font-normal',\r\n      medium: 'font-medium',\r\n      semibold: 'font-semibold',\r\n      bold: 'font-bold',\r\n      extrabold: 'font-extrabold',\r\n    },\r\n    align: {\r\n      left: 'text-left',\r\n      center: 'text-center',\r\n      right: 'text-right',\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    size: 'h2',\r\n    align: 'left',\r\n  },\r\n});\r\n\r\nexport interface HeadingProps\r\n  extends React.HTMLAttributes<HTMLHeadingElement>,\r\n    VariantProps<typeof headingVariants> {\r\n  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'span';\r\n}\r\n\r\nexport const Heading = forwardRef<HTMLHeadingElement, HeadingProps>(\r\n  ({ className, size = 'h2', weight, align, as, children, ...props }, ref) => {\r\n    const Component = (as || size || 'h2') as React.ElementType;\r\n\r\n    return (\r\n      <Component\r\n        ref={ref}\r\n        className={cn(headingVariants({ size, weight, align }), className)}\r\n        {...props}\r\n      >\r\n        {children}\r\n      </Component>\r\n    );\r\n  }\r\n);\r\n\r\nHeading.displayName = 'Heading';\r\n","import React, { forwardRef } from 'react';\r\nimport { cva, type VariantProps } from 'class-variance-authority';\r\nimport { cn } from '../utils/cn';\r\n\r\nexport const textVariants = cva('leading-relaxed', {\r\n  variants: {\r\n    variant: {\r\n      body: 'text-base text-[var(--ui-text-primary)]',\r\n      lead: 'text-lg sm:text-xl text-[var(--ui-text-secondary)] font-normal leading-relaxed',\r\n      muted: 'text-sm text-[var(--ui-text-muted)]',\r\n      small: 'text-xs text-[var(--ui-text-secondary)] font-normal',\r\n      caption: 'text-xs text-[var(--ui-text-muted)] uppercase tracking-wider font-semibold',\r\n      destructive: 'text-sm text-[var(--ui-error)] font-medium',\r\n      success: 'text-sm text-[var(--ui-success)] font-medium',\r\n    },\r\n    weight: {\r\n      light: 'font-light',\r\n      normal: 'font-normal',\r\n      medium: 'font-medium',\r\n      semibold: 'font-semibold',\r\n      bold: 'font-bold',\r\n    },\r\n    align: {\r\n      left: 'text-left',\r\n      center: 'text-center',\r\n      right: 'text-right',\r\n      justify: 'text-justify',\r\n    },\r\n    truncate: {\r\n      true: 'truncate',\r\n      false: '',\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    variant: 'body',\r\n    weight: 'normal',\r\n    align: 'left',\r\n    truncate: false,\r\n  },\r\n});\r\n\r\nexport interface TextProps\r\n  extends React.HTMLAttributes<HTMLElement>,\r\n    VariantProps<typeof textVariants> {\r\n  as?: React.ElementType;\r\n}\r\n\r\nexport const Text = forwardRef<HTMLElement, TextProps>(\r\n  ({ className, variant, weight, align, truncate, as: Component = 'p', children, ...props }, ref) => {\r\n    return (\r\n      <Component\r\n        ref={ref}\r\n        className={cn(textVariants({ variant, weight, align, truncate }), className)}\r\n        {...props}\r\n      >\r\n        {children}\r\n      </Component>\r\n    );\r\n  }\r\n);\r\n\r\nText.displayName = 'Text';\r\n","import React, { forwardRef } from 'react';\r\nimport { cva, type VariantProps } from 'class-variance-authority';\r\nimport { ExternalLink } from 'lucide-react';\r\nimport { cn } from '../utils/cn';\r\n\r\nexport const linkVariants = cva(\r\n  'inline-flex items-center gap-1 font-medium transition-colors cursor-pointer text-[var(--ui-primary)] hover:text-[var(--ui-primary-hover)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-primary)] rounded-sm',\r\n  {\r\n    variants: {\r\n      underline: {\r\n        always: 'underline underline-offset-4',\r\n        hover: 'hover:underline underline-offset-4',\r\n        none: 'no-underline',\r\n      },\r\n      variant: {\r\n        primary: 'text-[var(--ui-primary)] hover:text-[var(--ui-primary-hover)]',\r\n        secondary: 'text-[var(--ui-text-secondary)] hover:text-[var(--ui-text-primary)]',\r\n        muted: 'text-[var(--ui-text-muted)] hover:text-[var(--ui-text-secondary)]',\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      underline: 'hover',\r\n      variant: 'primary',\r\n    },\r\n  }\r\n);\r\n\r\nexport interface LinkProps\r\n  extends React.AnchorHTMLAttributes<HTMLAnchorElement>,\r\n    VariantProps<typeof linkVariants> {\r\n  external?: boolean;\r\n  showExternalIcon?: boolean;\r\n}\r\n\r\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\r\n  ({ className, underline, variant, external, showExternalIcon = true, children, ...props }, ref) => {\r\n    const isExternal = external ?? (props.href?.startsWith('http') || props.target === '_blank');\r\n\r\n    return (\r\n      <a\r\n        ref={ref}\r\n        target={isExternal ? '_blank' : props.target}\r\n        rel={isExternal ? 'noopener noreferrer' : props.rel}\r\n        className={cn(linkVariants({ underline, variant }), className)}\r\n        {...props}\r\n      >\r\n        {children}\r\n        {isExternal && showExternalIcon && (\r\n          <ExternalLink className=\"w-3.5 h-3.5 opacity-70 inline-block ml-0.5 flex-shrink-0\" />\r\n        )}\r\n      </a>\r\n    );\r\n  }\r\n);\r\n\r\nLink.displayName = 'Link';\r\n","import React, { forwardRef, useState } from 'react';\r\nimport { Copy, Check } from 'lucide-react';\r\nimport { cn } from '../utils/cn';\r\n\r\nexport interface CodeProps extends React.HTMLAttributes<HTMLElement> {\r\n  children?: React.ReactNode;\r\n}\r\n\r\nexport const Code = forwardRef<HTMLElement, CodeProps>(\r\n  ({ className, children, ...props }, ref) => {\r\n    return (\r\n      <code\r\n        ref={ref}\r\n        className={cn(\r\n          'relative rounded bg-[var(--ui-bg-tertiary)] px-[0.35rem] py-[0.15rem] font-mono text-sm font-semibold text-[var(--ui-text-primary)] border border-[var(--ui-border-subtle)]',\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        {children}\r\n      </code>\r\n    );\r\n  }\r\n);\r\nCode.displayName = 'Code';\r\n\r\nexport interface CodeBlockProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  code: string;\r\n  language?: string;\r\n  copyable?: boolean;\r\n}\r\n\r\nexport const CodeBlock = forwardRef<HTMLDivElement, CodeBlockProps>(\r\n  ({ className, code, language = 'bash', copyable = true, ...props }, ref) => {\r\n    const [copied, setCopied] = useState(false);\r\n\r\n    const handleCopy = async () => {\r\n      try {\r\n        await navigator.clipboard.writeText(code);\r\n        setCopied(true);\r\n        setTimeout(() => setCopied(false), 2000);\r\n      } catch (err) {\r\n        console.error('Failed to copy text', err);\r\n      }\r\n    };\r\n\r\n    return (\r\n      <div\r\n        ref={ref}\r\n        className={cn(\r\n          'relative rounded-lg border border-[var(--ui-border-subtle)] bg-[var(--ui-bg-secondary)] overflow-hidden font-mono text-sm shadow-sm',\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        {/* Header */}\r\n        <div className=\"flex items-center justify-between px-4 py-2 bg-[var(--ui-bg-tertiary)]/50 border-b border-[var(--ui-border-subtle)] text-xs text-[var(--ui-text-muted)] select-none\">\r\n          <span className=\"font-semibold uppercase tracking-wider\">{language}</span>\r\n          {copyable && (\r\n            <button\r\n              type=\"button\"\r\n              onClick={handleCopy}\r\n              className=\"flex items-center gap-1 hover:text-[var(--ui-text-primary)] transition-colors p-1 rounded hover:bg-[var(--ui-bg-surface)]\"\r\n              aria-label={copied ? 'Copied code' : 'Copy code to clipboard'}\r\n            >\r\n              {copied ? (\r\n                <>\r\n                  <Check className=\"w-3.5 h-3.5 text-[var(--ui-success)]\" />\r\n                  <span className=\"text-[var(--ui-success)] text-[11px]\">Copied</span>\r\n                </>\r\n              ) : (\r\n                <>\r\n                  <Copy className=\"w-3.5 h-3.5\" />\r\n                  <span className=\"text-[11px]\">Copy</span>\r\n                </>\r\n              )}\r\n            </button>\r\n          )}\r\n        </div>\r\n\r\n        {/* Code Content */}\r\n        <pre className=\"p-4 overflow-x-auto text-[var(--ui-text-primary)] leading-relaxed\">\r\n          <code>{code}</code>\r\n        </pre>\r\n      </div>\r\n    );\r\n  }\r\n);\r\nCodeBlock.displayName = 'CodeBlock';\r\n","import React, { forwardRef } from 'react';\r\nimport { cn } from '../utils/cn';\r\n\r\nexport interface BlockquoteProps extends React.BlockquoteHTMLAttributes<HTMLQuoteElement> {\r\n  citeAuthor?: string;\r\n  citeSource?: string;\r\n}\r\n\r\nexport const Blockquote = forwardRef<HTMLQuoteElement, BlockquoteProps>(\r\n  ({ className, citeAuthor, citeSource, children, ...props }, ref) => {\r\n    return (\r\n      <blockquote\r\n        ref={ref}\r\n        className={cn(\r\n          'mt-6 border-l-4 border-[var(--ui-primary)] pl-6 italic text-[var(--ui-text-secondary)] space-y-2',\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        <div className=\"text-base sm:text-lg\">{children}</div>\r\n        {(citeAuthor || citeSource) && (\r\n          <footer className=\"not-italic text-xs font-semibold text-[var(--ui-text-muted)] tracking-wider\">\r\n            {citeAuthor && <span>— {citeAuthor}</span>}\r\n            {citeSource && <span className=\"opacity-75 ml-1\">({citeSource})</span>}\r\n          </footer>\r\n        )}\r\n      </blockquote>\r\n    );\r\n  }\r\n);\r\n\r\nBlockquote.displayName = 'Blockquote';\r\n"]}

package/dist/chunk-C4SUXMI3.js

@@ -0,0 +1,138 @@
+import { __export, cn } from './chunk-4S6L5V7X.js';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+
+// src/bento/index.ts
+var bento_exports = {};
+__export(bento_exports, {
+  BentoCard: () => BentoCard,
+  BentoGrid: () => BentoGrid
+});
+var bentoGridVariants = cva("grid w-full auto-rows-[minmax(240px,auto)]", {
+  variants: {
+    cols: {
+      1: "grid-cols-1",
+      2: "grid-cols-1 md:grid-cols-2",
+      3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
+      4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
+    },
+    gap: {
+      sm: "gap-4",
+      md: "gap-6",
+      lg: "gap-8"
+    },
+    flow: {
+      row: "grid-flow-row",
+      col: "grid-flow-col",
+      dense: "grid-flow-dense",
+      "row-dense": "grid-flow-row-dense",
+      "col-dense": "grid-flow-col-dense"
+    }
+  },
+  defaultVariants: {
+    cols: 3,
+    gap: "md",
+    flow: "row"
+  }
+});
+var BentoGrid = ({
+  className,
+  cols,
+  gap,
+  flow,
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx("div", { className: cn(bentoGridVariants({ cols, gap, flow, className })), ...props, children });
+};
+var bentoCardVariants = cva(
+  "group relative flex flex-col justify-between overflow-hidden transition-all duration-500 ease-out border text-[var(--ui-bento-text-title)]",
+  {
+    variants: {
+      colSpan: {
+        1: "col-span-1",
+        2: "col-span-1 md:col-span-2",
+        3: "col-span-1 md:col-span-2 lg:col-span-3"
+      },
+      rowSpan: {
+        1: "row-span-1",
+        2: "row-span-1 md:row-span-2 md:min-h-[460px]",
+        3: "row-span-1 md:row-span-3 md:min-h-[680px]"
+      },
+      variant: {
+        default: "bg-[var(--ui-bento-bg-card)] border-[var(--ui-bento-border)] hover:border-[var(--ui-bento-border-hover)] hover:bg-[var(--ui-bento-bg-card-hover)] shadow-[var(--ui-bento-shadow)]",
+        spotlight: "bg-[var(--ui-bento-bg-card)] border-[var(--ui-bento-border)] hover:border-white/30 dark:hover:border-white/30 hover:shadow-[0_0_35px_-8px_rgba(255,255,255,0.12)]",
+        elevated: "bg-[image:var(--ui-bento-bg-elevated)] border-[var(--ui-bento-border)] hover:border-[var(--ui-bento-border-hover)] shadow-[var(--ui-bento-shadow-elevated)]"
+      },
+      radius: {
+        md: "rounded-[var(--ui-bento-radius-md)]",
+        lg: "rounded-[var(--ui-bento-radius-lg)]"
+      },
+      padding: {
+        sm: "p-4 sm:p-5",
+        md: "p-5 sm:p-7",
+        lg: "p-6 sm:p-9"
+      }
+    },
+    defaultVariants: {
+      colSpan: 1,
+      rowSpan: 1,
+      variant: "default",
+      radius: "lg",
+      padding: "md"
+    }
+  }
+);
+var BentoCard = forwardRef(
+  ({
+    className,
+    colSpan,
+    rowSpan,
+    variant,
+    radius,
+    padding,
+    title,
+    description,
+    icon,
+    tag,
+    backgroundGraphic,
+    graphic,
+    children,
+    ...props
+  }, ref) => {
+    const bgGraphic = backgroundGraphic ?? graphic;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(bentoCardVariants({ colSpan, rowSpan, variant, radius, padding, className })),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-white/20 to-transparent opacity-50",
+              "aria-hidden": "true"
+            }
+          ),
+          bgGraphic && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-0 overflow-hidden pointer-events-none opacity-70 transition-transform duration-700 ease-out motion-safe:group-hover:scale-105", children: bgGraphic }),
+          (icon || tag) && /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex items-start justify-between gap-4", children: [
+            icon && /* @__PURE__ */ jsx("div", { className: "flex h-11 w-11 items-center justify-center rounded-2xl bg-[var(--ui-bento-icon-bg)] border border-[var(--ui-bento-icon-border)] backdrop-blur-md shadow-inner transition-transform duration-300 group-hover:scale-105", children: icon }),
+            tag && /* @__PURE__ */ jsx("div", { className: "font-mono text-[10px] font-semibold uppercase tracking-widest text-[var(--ui-bento-text-tag)] border border-[var(--ui-bento-icon-border)] bg-[var(--ui-bento-icon-bg)] px-2.5 py-1 rounded-md backdrop-blur-sm", children: tag })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "relative z-10 mt-auto pt-6", children: [
+            title && /* @__PURE__ */ jsx("h3", { className: "text-xl font-bold tracking-tight text-[var(--ui-bento-text-title)] transition-colors group-hover:text-[var(--ui-primary)] dark:group-hover:text-white", children: title }),
+            description && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm leading-relaxed text-[var(--ui-bento-text-desc)] font-normal", children: description }),
+            children
+          ] })
+        ]
+      }
+    );
+  }
+);
+BentoCard.displayName = "BentoCard";
+
+export { BentoCard, BentoGrid, bento_exports };
+//# sourceMappingURL=chunk-C4SUXMI3.js.map
+//# sourceMappingURL=chunk-C4SUXMI3.js.map

package/dist/chunk-C4SUXMI3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/bento/index.ts","../src/bento/BentoGrid.tsx","../src/bento/BentoCard.tsx"],"names":["cva","jsx"],"mappings":"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","file":"chunk-C4SUXMI3.js","sourcesContent":["export * from './BentoGrid';\r\nexport * from './BentoCard';\r\n","import React from 'react';\r\nimport { cva, type VariantProps } from 'class-variance-authority';\r\nimport { cn } from '../utils/cn';\r\n\r\nconst bentoGridVariants = cva('grid w-full auto-rows-[minmax(240px,auto)]', {\r\n  variants: {\r\n    cols: {\r\n      1: 'grid-cols-1',\r\n      2: 'grid-cols-1 md:grid-cols-2',\r\n      3: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',\r\n      4: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-4',\r\n    },\r\n    gap: {\r\n      sm: 'gap-4',\r\n      md: 'gap-6',\r\n      lg: 'gap-8',\r\n    },\r\n    flow: {\r\n      row: 'grid-flow-row',\r\n      col: 'grid-flow-col',\r\n      dense: 'grid-flow-dense',\r\n      'row-dense': 'grid-flow-row-dense',\r\n      'col-dense': 'grid-flow-col-dense',\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    cols: 3,\r\n    gap: 'md',\r\n    flow: 'row',\r\n  },\r\n});\r\n\r\nexport interface BentoGridProps\r\n  extends React.HTMLAttributes<HTMLDivElement>,\r\n    VariantProps<typeof bentoGridVariants> {}\r\n\r\nexport const BentoGrid: React.FC<BentoGridProps> = ({\r\n  className,\r\n  cols,\r\n  gap,\r\n  flow,\r\n  children,\r\n  ...props\r\n}) => {\r\n  return (\r\n    <div className={cn(bentoGridVariants({ cols, gap, flow, className }))} {...props}>\r\n      {children}\r\n    </div>\r\n  );\r\n};\r\n","import React, { forwardRef } from 'react';\r\nimport { cva, type VariantProps } from 'class-variance-authority';\r\nimport { cn } from '../utils/cn';\r\n\r\nconst bentoCardVariants = cva(\r\n  'group relative flex flex-col justify-between overflow-hidden transition-all duration-500 ease-out border text-[var(--ui-bento-text-title)]',\r\n  {\r\n    variants: {\r\n      colSpan: {\r\n        1: 'col-span-1',\r\n        2: 'col-span-1 md:col-span-2',\r\n        3: 'col-span-1 md:col-span-2 lg:col-span-3',\r\n      },\r\n      rowSpan: {\r\n        1: 'row-span-1',\r\n        2: 'row-span-1 md:row-span-2 md:min-h-[460px]',\r\n        3: 'row-span-1 md:row-span-3 md:min-h-[680px]',\r\n      },\r\n      variant: {\r\n        default:\r\n          'bg-[var(--ui-bento-bg-card)] border-[var(--ui-bento-border)] hover:border-[var(--ui-bento-border-hover)] hover:bg-[var(--ui-bento-bg-card-hover)] shadow-[var(--ui-bento-shadow)]',\r\n        spotlight:\r\n          'bg-[var(--ui-bento-bg-card)] border-[var(--ui-bento-border)] hover:border-white/30 dark:hover:border-white/30 hover:shadow-[0_0_35px_-8px_rgba(255,255,255,0.12)]',\r\n        elevated:\r\n          'bg-[image:var(--ui-bento-bg-elevated)] border-[var(--ui-bento-border)] hover:border-[var(--ui-bento-border-hover)] shadow-[var(--ui-bento-shadow-elevated)]',\r\n      },\r\n      radius: {\r\n        md: 'rounded-[var(--ui-bento-radius-md)]',\r\n        lg: 'rounded-[var(--ui-bento-radius-lg)]',\r\n      },\r\n      padding: {\r\n        sm: 'p-4 sm:p-5',\r\n        md: 'p-5 sm:p-7',\r\n        lg: 'p-6 sm:p-9',\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      colSpan: 1,\r\n      rowSpan: 1,\r\n      variant: 'default',\r\n      radius: 'lg',\r\n      padding: 'md',\r\n    },\r\n  }\r\n);\r\n\r\nexport interface BentoCardProps\r\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'>,\r\n    VariantProps<typeof bentoCardVariants> {\r\n  title?: React.ReactNode;\r\n  description?: React.ReactNode;\r\n  icon?: React.ReactNode;\r\n  tag?: React.ReactNode;\r\n  /**\r\n   * Decorative background graphic. Non-interactive backdrop element.\r\n   */\r\n  backgroundGraphic?: React.ReactNode;\r\n  /**\r\n   * @deprecated Use `backgroundGraphic` instead.\r\n   */\r\n  graphic?: React.ReactNode;\r\n}\r\n\r\nexport const BentoCard = forwardRef<HTMLDivElement, BentoCardProps>(\r\n  (\r\n    {\r\n      className,\r\n      colSpan,\r\n      rowSpan,\r\n      variant,\r\n      radius,\r\n      padding,\r\n      title,\r\n      description,\r\n      icon,\r\n      tag,\r\n      backgroundGraphic,\r\n      graphic,\r\n      children,\r\n      ...props\r\n    },\r\n    ref\r\n  ) => {\r\n    const bgGraphic = backgroundGraphic ?? graphic;\r\n\r\n    return (\r\n      <div\r\n        ref={ref}\r\n        className={cn(bentoCardVariants({ colSpan, rowSpan, variant, radius, padding, className }))}\r\n        {...props}\r\n      >\r\n        {/* Subtle Specular Top Line */}\r\n        <div\r\n          className=\"pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-white/20 to-transparent opacity-50\"\r\n          aria-hidden=\"true\"\r\n        />\r\n\r\n        {/* Background Visual Graphic Slot (Decorative) */}\r\n        {bgGraphic && (\r\n          <div className=\"absolute inset-0 z-0 overflow-hidden pointer-events-none opacity-70 transition-transform duration-700 ease-out motion-safe:group-hover:scale-105\">\r\n            {bgGraphic}\r\n          </div>\r\n        )}\r\n\r\n        {/* Top Header Section */}\r\n        {(icon || tag) && (\r\n          <div className=\"relative z-10 flex items-start justify-between gap-4\">\r\n            {icon && (\r\n              <div className=\"flex h-11 w-11 items-center justify-center rounded-2xl bg-[var(--ui-bento-icon-bg)] border border-[var(--ui-bento-icon-border)] backdrop-blur-md shadow-inner transition-transform duration-300 group-hover:scale-105\">\r\n                {icon}\r\n              </div>\r\n            )}\r\n            {tag && (\r\n              <div className=\"font-mono text-[10px] font-semibold uppercase tracking-widest text-[var(--ui-bento-text-tag)] border border-[var(--ui-bento-icon-border)] bg-[var(--ui-bento-icon-bg)] px-2.5 py-1 rounded-md backdrop-blur-sm\">\r\n                {tag}\r\n              </div>\r\n            )}\r\n          </div>\r\n        )}\r\n\r\n        {/* Main Content Area */}\r\n        <div className=\"relative z-10 mt-auto pt-6\">\r\n          {title && (\r\n            <h3 className=\"text-xl font-bold tracking-tight text-[var(--ui-bento-text-title)] transition-colors group-hover:text-[var(--ui-primary)] dark:group-hover:text-white\">\r\n              {title}\r\n            </h3>\r\n          )}\r\n          {description && (\r\n            <p className=\"mt-2 text-sm leading-relaxed text-[var(--ui-bento-text-desc)] font-normal\">\r\n              {description}\r\n            </p>\r\n          )}\r\n          {children}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n);\r\n\r\nBentoCard.displayName = 'BentoCard';\r\n"]}

package/dist/chunk-EU2LPUYP.js

@@ -0,0 +1,25 @@
+import { cn } from './chunk-4S6L5V7X.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var Kbd = forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "kbd",
+      {
+        ref,
+        className: cn(
+          "pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded border border-[var(--ui-border-default)] bg-[var(--ui-bg-tertiary)] px-1.5 font-mono text-[10px] font-semibold text-[var(--ui-text-muted)] opacity-100 shadow-sm",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Kbd.displayName = "Kbd";
+
+export { Kbd };
+//# sourceMappingURL=chunk-EU2LPUYP.js.map
+//# sourceMappingURL=chunk-EU2LPUYP.js.map

package/dist/chunk-EU2LPUYP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/typography/Kbd.tsx"],"names":[],"mappings":";;;;AAOO,IAAM,GAAA,GAAM,UAAA;AAAA,EACjB,CAAC,EAAE,SAAA,EAAW,UAAU,GAAG,KAAA,IAAS,GAAA,KAAQ;AAC1C,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,6OAAA;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,GAAA,CAAI,WAAA,GAAc,KAAA","file":"chunk-EU2LPUYP.js","sourcesContent":["import React, { forwardRef } from 'react';\r\nimport { cn } from '../utils/cn';\r\n\r\nexport interface KbdProps extends React.HTMLAttributes<HTMLElement> {\r\n  children?: React.ReactNode;\r\n}\r\n\r\nexport const Kbd = forwardRef<HTMLElement, KbdProps>(\r\n  ({ className, children, ...props }, ref) => {\r\n    return (\r\n      <kbd\r\n        ref={ref}\r\n        className={cn(\r\n          'pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded border border-[var(--ui-border-default)] bg-[var(--ui-bg-tertiary)] px-1.5 font-mono text-[10px] font-semibold text-[var(--ui-text-muted)] opacity-100 shadow-sm',\r\n          className\r\n        )}\r\n        {...props}\r\n      >\r\n        {children}\r\n      </kbd>\r\n    );\r\n  }\r\n);\r\n\r\nKbd.displayName = 'Kbd';\r\n"]}