bynana-ui 1.5.0 → 1.6.1

package/dist/tweet-card/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/tweet-card/index.tsx"],"names":["cn","inputs","twMerge","clsx","VerifiedIcon","className","jsx","XIcon","jsxs","TweetCard","authorName","authorHandle","authorImage","content","isVerified","timestamp","reply","href","item","index"],"mappings":"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","file":"index.mjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","\"use client\";\r\n\r\nimport { cn } from \"../utils/cn\";\r\n\r\ninterface ReplyProps {\r\n  authorName: string;\r\n  authorHandle: string;\r\n  authorImage: string;\r\n  content: string;\r\n  isVerified?: boolean;\r\n  timestamp: string;\r\n}\r\n\r\ninterface TweetCardProps {\r\n  authorName: string;\r\n  authorHandle: string;\r\n  authorImage: string;\r\n  content: string[];\r\n  isVerified?: boolean;\r\n  timestamp: string;\r\n  reply?: ReplyProps;\r\n  href?: string;\r\n  className?: string;\r\n}\r\n\r\nconst VerifiedIcon = ({ className }: { className?: string }) => (\r\n  <svg className={className} viewBox=\"0 0 22 22\" fill=\"currentColor\">\r\n    <path d=\"M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z\" />\r\n  </svg>\r\n);\r\n\r\nconst XIcon = ({ className }: { className?: string }) => (\r\n  <svg className={className} viewBox=\"0 0 1200 1227\" fill=\"none\">\r\n    <title>X</title>\r\n    <path\r\n      fill=\"currentColor\"\r\n      d=\"M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z\"\r\n    />\r\n  </svg>\r\n);\r\n\r\nexport function TweetCard({\r\n  authorName,\r\n  authorHandle,\r\n  authorImage,\r\n  content,\r\n  isVerified = false,\r\n  timestamp,\r\n  reply,\r\n  href,\r\n  className,\r\n}: TweetCardProps) {\r\n  const Wrapper = href ? \"a\" : \"div\";\r\n  const wrapperProps = href ? { href, target: \"_blank\", rel: \"noopener noreferrer\" } : {};\r\n\r\n  return (\r\n    <Wrapper\r\n      {...wrapperProps}\r\n      className={cn(\r\n        \"block w-full min-w-[400px] md:min-w-[500px] max-w-xl p-1.5 rounded-2xl relative isolate overflow-hidden\",\r\n        \"bg-black/90 dark:bg-black/90\",\r\n        \"backdrop-blur-xl backdrop-saturate-[180%]\",\r\n        \"border border-black/10 dark:border-white/10\",\r\n        \"shadow-[0_8px_16px_rgb(0_0_0_/_0.15)] dark:shadow-[0_8px_16px_rgb(0_0_0_/_0.25)]\",\r\n        className\r\n      )}\r\n    >\r\n      <div\r\n        className={cn(\r\n          \"w-full p-5 rounded-xl relative\",\r\n          \"bg-gradient-to-br from-black/[0.05] to-transparent dark:from-white/[0.08] dark:to-transparent\",\r\n          \"backdrop-blur-md backdrop-saturate-150\",\r\n          \"border border-black/[0.05] dark:border-white/[0.08]\",\r\n          \"text-white/90 dark:text-white\"\r\n        )}\r\n      >\r\n        <div className=\"flex gap-3\">\r\n          <div className=\"shrink-0\">\r\n            <div className=\"h-10 w-10 rounded-full overflow-hidden\">\r\n              <img src={authorImage} alt={authorName} className=\"h-full w-full object-cover\" />\r\n            </div>\r\n          </div>\r\n          <div className=\"flex-1\">\r\n            <div className=\"flex justify-between items-start\">\r\n              <div className=\"flex flex-col\">\r\n                <div className=\"flex items-center gap-1\">\r\n                  <span className=\"font-semibold text-white dark:text-white/90 hover:underline cursor-pointer\">\r\n                    {authorName}\r\n                  </span>\r\n                  {isVerified && <VerifiedIcon className=\"h-4 w-4 text-blue-400\" />}\r\n                </div>\r\n                <span className=\"text-white/60 text-sm\">@{authorHandle}</span>\r\n              </div>\r\n              <div className=\"h-8 w-8 text-white/80 hover:text-white hover:bg-white/10 rounded-lg p-1 flex items-center justify-center\">\r\n                <XIcon className=\"w-4 h-4\" />\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div className=\"mt-2\">\r\n          {content.map((item, index) => (\r\n            <p key={index} className=\"text-white dark:text-white/90 text-base\">\r\n              {item}\r\n            </p>\r\n          ))}\r\n          <span className=\"text-white/50 text-sm mt-2 block\">{timestamp}</span>\r\n        </div>\r\n        {reply && (\r\n          <div className=\"mt-4 pt-4 border-t border-white/[0.08]\">\r\n            <div className=\"flex gap-3\">\r\n              <div className=\"shrink-0\">\r\n                <div className=\"h-10 w-10 rounded-full overflow-hidden\">\r\n                  <img src={reply.authorImage} alt={reply.authorName} className=\"h-full w-full object-cover\" />\r\n                </div>\r\n              </div>\r\n              <div className=\"flex-1\">\r\n                <div className=\"flex items-center gap-1\">\r\n                  <span className=\"font-semibold text-white/90 hover:underline cursor-pointer\">{reply.authorName}</span>\r\n                  {reply.isVerified && <VerifiedIcon className=\"h-4 w-4 text-blue-400\" />}\r\n                  <span className=\"text-white/60 text-sm\">@{reply.authorHandle}</span>\r\n                  <span className=\"text-white/60 text-sm\">·</span>\r\n                  <span className=\"text-white/60 text-sm\">{reply.timestamp}</span>\r\n                </div>\r\n                <p className=\"text-white/80 text-sm mt-1\">{reply.content}</p>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n    </Wrapper>\r\n  );\r\n}\r\n\r\nexport type { TweetCardProps, ReplyProps };\r\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bynana-ui",
-  "version": "1.5.0",
+  "version": "1.6.1",
   "description": "120+ Beautiful React UI components built with Tailwind CSS and Framer Motion",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -128,6 +128,22 @@
     "./v0-button": { "import": "./dist/v0-button/index.mjs", "require": "./dist/v0-button/index.js", "types": "./dist/v0-button/index.d.ts" },
     "./contribution-graph": { "import": "./dist/contribution-graph/index.mjs", "require": "./dist/contribution-graph/index.js", "types": "./dist/contribution-graph/index.d.ts" },
     "./elastic-slider": { "import": "./dist/elastic-slider/index.mjs", "require": "./dist/elastic-slider/index.js", "types": "./dist/elastic-slider/index.d.ts" },
+    "./flowing-menu": { "import": "./dist/flowing-menu/index.mjs", "require": "./dist/flowing-menu/index.js", "types": "./dist/flowing-menu/index.d.ts" },
+    "./gooey-nav": { "import": "./dist/gooey-nav/index.mjs", "require": "./dist/gooey-nav/index.js", "types": "./dist/gooey-nav/index.d.ts" },
+    "./pill-nav": { "import": "./dist/pill-nav/index.mjs", "require": "./dist/pill-nav/index.js", "types": "./dist/pill-nav/index.d.ts" },
+    "./smooth-drawer": { "import": "./dist/smooth-drawer/index.mjs", "require": "./dist/smooth-drawer/index.js", "types": "./dist/smooth-drawer/index.d.ts" },
+    "./smooth-tab": { "import": "./dist/smooth-tab/index.mjs", "require": "./dist/smooth-tab/index.js", "types": "./dist/smooth-tab/index.d.ts" },
+    "./decay-card": { "import": "./dist/decay-card/index.mjs", "require": "./dist/decay-card/index.js", "types": "./dist/decay-card/index.d.ts" },
+    "./liquid-glass-card": { "import": "./dist/liquid-glass-card/index.mjs", "require": "./dist/liquid-glass-card/index.js", "types": "./dist/liquid-glass-card/index.d.ts" },
+    "./target-cursor": { "import": "./dist/target-cursor/index.mjs", "require": "./dist/target-cursor/index.js", "types": "./dist/target-cursor/index.d.ts" },
+    "./crosshair": { "import": "./dist/crosshair/index.mjs", "require": "./dist/crosshair/index.js", "types": "./dist/crosshair/index.d.ts" },
+    "./scroll-text": { "import": "./dist/scroll-text/index.mjs", "require": "./dist/scroll-text/index.js", "types": "./dist/scroll-text/index.d.ts" },
+    "./card-stack": { "import": "./dist/card-stack/index.mjs", "require": "./dist/card-stack/index.js", "types": "./dist/card-stack/index.d.ts" },
+    "./apple-activity-card": { "import": "./dist/apple-activity-card/index.mjs", "require": "./dist/apple-activity-card/index.js", "types": "./dist/apple-activity-card/index.d.ts" },
+    "./tweet-card": { "import": "./dist/tweet-card/index.mjs", "require": "./dist/tweet-card/index.js", "types": "./dist/tweet-card/index.d.ts" },
+    "./stats-cards": { "import": "./dist/stats-cards/index.mjs", "require": "./dist/stats-cards/index.js", "types": "./dist/stats-cards/index.d.ts" },
+    "./stats-grid": { "import": "./dist/stats-grid/index.mjs", "require": "./dist/stats-grid/index.js", "types": "./dist/stats-grid/index.d.ts" },
+    "./bento-grid": { "import": "./dist/bento-grid/index.mjs", "require": "./dist/bento-grid/index.js", "types": "./dist/bento-grid/index.d.ts" },
     "./styles.css": "./dist/styles.css"
   },
   "files": ["dist", "README.md"],