medusa-ui-common 2.0.0

package/package.json

@@ -0,0 +1,93 @@
+{
+  "name": "medusa-ui-common",
+  "version": "2.0.0",
+  "description": "Shared storefront UI primitives.",
+  "type": "module",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "sideEffects": false,
+  "files": [
+    "src"
+  ],
+  "scripts": {
+    "build": "tsc --noEmit --skipLibCheck",
+    "clean": "true"
+  },
+  "peerDependencies": {
+    "@medusajs/types": ">=2",
+    "@medusajs/ui": "*",
+    "lodash": ">=4",
+    "lucide-react": "*",
+    "medusa-contact-logic-plugin": "^2.0.0",
+    "medusa-reviews-logic": "^2.0.0",
+    "medusa-storefront-analytics": "^1.3.0",
+    "medusa-storefront-data": "^2.0.0",
+    "medusa-storefront-hooks": "^1.0.0",
+    "medusa-wishlist-logic": "^2.0.0",
+    "next": ">=14.0.0",
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "next": {
+      "optional": true
+    }
+  },
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./src/index.ts",
+      "import": "./src/index.ts",
+      "default": "./src/index.ts"
+    },
+    "./common/*": {
+      "types": "./src/common/*",
+      "import": "./src/common/*",
+      "default": "./src/common/*"
+    },
+    "./context/*": {
+      "types": "./src/context/*",
+      "import": "./src/context/*",
+      "default": "./src/context/*"
+    },
+    "./util/*": {
+      "types": "./src/util/*",
+      "import": "./src/util/*",
+      "default": "./src/util/*"
+    },
+    "./skeletons/*": {
+      "types": "./src/skeletons/*",
+      "import": "./src/skeletons/*",
+      "default": "./src/skeletons/*"
+    },
+    "./types/*": {
+      "types": "./src/types/*",
+      "import": "./src/types/*",
+      "default": "./src/types/*"
+    },
+    "./constants/*": {
+      "types": "./src/constants/*",
+      "import": "./src/constants/*",
+      "default": "./src/constants/*"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      "*": [
+        "src/*"
+      ]
+    }
+  },
+  "devDependencies": {
+    "@headlessui/react": "^2.2.0",
+    "@medusajs/icons": "^2.0.0",
+    "@medusajs/ui": "^4.0.0",
+    "@types/react": "18.3.18",
+    "@types/react-dom": "18.3.5",
+    "typescript": "^5.6.0",
+    "color": "^5.0.3",
+    "react-razorpay": "^3.0.1"
+  }
+}

package/src/common/components/breadcrumb/index.tsx

@@ -0,0 +1,43 @@
+import { HttpTypes } from "@medusajs/types"
+import LocalizedClientLink from "../localized-client-link"
+
+type BreadcrumbProps = {
+  product: HttpTypes.StoreProduct
+}
+
+export default function Breadcrumb({ product }: BreadcrumbProps) {
+  const primaryCategory = product.categories?.[0]
+
+  return (
+    <nav className="text-xs sm:text-sm text-gray-800 mb-3 sm:mb-4 overflow-x-auto font-medium">
+      <div className="flex items-center whitespace-nowrap">
+        <LocalizedClientLink href="/" className="hover:text-gray-900 transition-colors">
+          Home
+        </LocalizedClientLink>
+        <span className="mx-2">/</span>
+        <LocalizedClientLink href="/store" className="hover:text-gray-900 transition-colors">
+          Shop
+        </LocalizedClientLink>
+        {primaryCategory && (
+          <>
+            <span className="mx-2">/</span>
+            <LocalizedClientLink
+              href={`/store?category=${primaryCategory.id}`}
+              className="hover:text-gray-900 transition-colors"
+            >
+              {primaryCategory.name}
+            </LocalizedClientLink>
+          </>
+        )}
+        <span className="mx-2">/</span>
+        <span className="text-gray-900 truncate max-w-[150px] sm:max-w-[300px] md:max-w-[400px] inline-block align-bottom" title={product.title ?? ""}>
+          {product.title}
+        </span>
+      </div>
+    </nav>
+  )
+}
+
+
+
+