@beyondcorp/beyond-ui 1.1.37 → 1.1.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AllProductsView/AllProductsView.d.ts +14 -0
- package/dist/components/AllProductsView/AllProductsView.js +60 -0
- package/dist/components/AllProductsView/AllProductsView.js.map +1 -0
- package/dist/components/AllProductsView/ProductCard.d.ts +11 -0
- package/dist/components/AllProductsView/ProductCard.js +11 -0
- package/dist/components/AllProductsView/ProductCard.js.map +1 -0
- package/dist/components/AllProductsView/index.d.ts +2 -0
- package/dist/components/BlogFeedView/BlogFeedView.d.ts +22 -0
- package/dist/components/BlogFeedView/BlogFeedView.js +29 -0
- package/dist/components/BlogFeedView/BlogFeedView.js.map +1 -0
- package/dist/components/BlogFeedView/index.d.ts +1 -0
- package/dist/components/BlogLayout/BlogLayout.d.ts +13 -0
- package/dist/components/BlogLayout/BlogLayout.js +20 -0
- package/dist/components/BlogLayout/BlogLayout.js.map +1 -0
- package/dist/components/BlogLayout/index.d.ts +1 -0
- package/dist/components/BlogSidebar/BlogSidebar.d.ts +19 -0
- package/dist/components/BlogSidebar/BlogSidebar.js +10 -0
- package/dist/components/BlogSidebar/BlogSidebar.js.map +1 -0
- package/dist/components/BlogSidebar/index.d.ts +1 -0
- package/dist/components/Checkout/CheckoutPage.d.ts +16 -0
- package/dist/components/Checkout/CheckoutPage.js +44 -0
- package/dist/components/Checkout/CheckoutPage.js.map +1 -0
- package/dist/components/Checkout/CheckoutSidebar.d.ts +15 -0
- package/dist/components/Checkout/CheckoutSidebar.js +25 -0
- package/dist/components/Checkout/CheckoutSidebar.js.map +1 -0
- package/dist/components/Checkout/index.d.ts +2 -0
- package/dist/components/Checkout/types.d.ts +21 -0
- package/dist/components/CommerceSidebar/CommerceSidebar.d.ts +20 -0
- package/dist/components/CommerceSidebar/CommerceSidebar.js +14 -0
- package/dist/components/CommerceSidebar/CommerceSidebar.js.map +1 -0
- package/dist/components/CommerceSidebar/index.d.ts +1 -0
- package/dist/components/MarketplaceLayout/MarketplaceLayout.d.ts +14 -0
- package/dist/components/MarketplaceLayout/MarketplaceLayout.js +26 -0
- package/dist/components/MarketplaceLayout/MarketplaceLayout.js.map +1 -0
- package/dist/components/MarketplaceLayout/index.d.ts +1 -0
- package/dist/components/NightModeSwitch/NightModeSwitch.js +2 -7
- package/dist/components/NightModeSwitch/NightModeSwitch.js.map +1 -1
- package/dist/components/ProfileManagement/index.d.ts +2 -0
- package/dist/components/Radio/index.d.ts +1 -0
- package/dist/components/Select/index.d.ts +1 -0
- package/dist/components/SingleBlogView/SingleBlogView.d.ts +26 -0
- package/dist/components/SingleBlogView/SingleBlogView.js +17 -0
- package/dist/components/SingleBlogView/SingleBlogView.js.map +1 -0
- package/dist/components/SingleBlogView/index.d.ts +1 -0
- package/dist/components/SingleProductView/SingleProductView.d.ts +31 -0
- package/dist/components/SingleProductView/SingleProductView.js +34 -0
- package/dist/components/SingleProductView/SingleProductView.js.map +1 -0
- package/dist/components/SingleProductView/index.d.ts +1 -0
- package/dist/index.d.ts +14 -6
- package/dist/index.js +11 -0
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Card, CardHeader, CardTitle, CardContent } from '../Card/Card.js';
|
|
3
|
+
import { Badge } from '../Badge/Badge.js';
|
|
4
|
+
import { Avatar, AvatarImage, AvatarFallback } from '../Avatar/Avatar.js';
|
|
5
|
+
import { Button } from '../Button/Button.js';
|
|
6
|
+
import { cn } from '../../utils/cn.js';
|
|
7
|
+
|
|
8
|
+
const CommerceSidebar = ({ products, title = 'Featured Products', onProductClick, onAddToCart, className, }) => (jsxs(Card, { className: cn('space-y-4', className), children: [jsx(CardHeader, { children: jsx(CardTitle, { children: title }) }), jsx(CardContent, { children: jsx("div", { className: "space-y-4", children: products.length === 0 ? (jsx("div", { className: "text-gray-500 text-center py-4", children: "No products found." })) : (products.map((product) => (jsxs("div", { className: "flex items-center space-x-3 cursor-pointer hover:bg-primary-50 rounded px-2 py-2 transition", onClick: () => onProductClick && onProductClick(product.id), children: [jsx(Avatar, { size: "sm", children: product.image ? (jsx(AvatarImage, { src: product.image })) : (jsx(AvatarFallback, { children: product.name ? product.name[0] : 'P' })) }), jsxs("div", { className: "flex-1 min-w-0", children: [jsx("div", { className: "font-medium text-gray-900 truncate", children: product.name }), jsxs("div", { className: "flex items-center space-x-2 text-xs text-gray-500", children: [jsx("span", { className: product.inStock ? 'text-success-600' : 'text-danger-600', children: product.inStock ? 'In Stock' : 'Out of Stock' }), product.discount && (jsx(Badge, { variant: "danger", children: product.discount }))] }), jsxs("div", { className: "flex items-center space-x-2 text-xs mt-1", children: [jsxs("span", { className: "font-bold text-primary-700", children: ["$", product.price.toFixed(2)] }), product.oldPrice && (jsxs("span", { className: "line-through text-gray-400", children: ["$", product.oldPrice.toFixed(2)] }))] }), product.categories && (jsx("div", { className: "flex flex-wrap gap-1 mt-1", children: product.categories.map((cat) => (jsx(Badge, { variant: "outline", className: "text-xs", children: cat }, cat))) }))] }), jsx(Button, { variant: "primary", size: "sm", onClick: e => {
|
|
9
|
+
e.stopPropagation();
|
|
10
|
+
onAddToCart && onAddToCart(product.id);
|
|
11
|
+
}, disabled: !product.inStock, "aria-label": "Add to cart", children: "+" })] }, product.id)))) }) })] }));
|
|
12
|
+
|
|
13
|
+
export { CommerceSidebar };
|
|
14
|
+
//# sourceMappingURL=CommerceSidebar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CommerceSidebar.js","sources":["../../../src/components/CommerceSidebar/CommerceSidebar.tsx"],"sourcesContent":["import React from 'react';\r\nimport { Card, CardHeader, CardTitle, CardContent } from '../Card';\r\nimport { Badge } from '../Badge';\r\nimport { Avatar, AvatarImage, AvatarFallback } from '../Avatar';\r\nimport { Button } from '../Button';\r\nimport { cn } from '../../utils/cn';\r\n\r\nexport interface CommerceSidebarProduct {\r\n id: string;\r\n name: string;\r\n image?: string;\r\n price: number;\r\n oldPrice?: number;\r\n discount?: string;\r\n inStock: boolean;\r\n categories?: string[];\r\n href?: string;\r\n}\r\n\r\nexport interface CommerceSidebarProps {\r\n products: CommerceSidebarProduct[];\r\n title?: string;\r\n onProductClick?: (id: string) => void;\r\n onAddToCart?: (id: string) => void;\r\n className?: string;\r\n}\r\n\r\nexport const CommerceSidebar: React.FC<CommerceSidebarProps> = ({\r\n products,\r\n title = 'Featured Products',\r\n onProductClick,\r\n onAddToCart,\r\n className,\r\n}) => (\r\n <Card className={cn('space-y-4', className)}>\r\n <CardHeader>\r\n <CardTitle>{title}</CardTitle>\r\n </CardHeader>\r\n <CardContent>\r\n <div className=\"space-y-4\">\r\n {products.length === 0 ? (\r\n <div className=\"text-gray-500 text-center py-4\">No products found.</div>\r\n ) : (\r\n products.map((product) => (\r\n <div\r\n key={product.id}\r\n className=\"flex items-center space-x-3 cursor-pointer hover:bg-primary-50 rounded px-2 py-2 transition\"\r\n onClick={() => onProductClick && onProductClick(product.id)}\r\n >\r\n <Avatar size=\"sm\">\r\n {product.image ? (\r\n <AvatarImage src={product.image} />\r\n ) : (\r\n <AvatarFallback>\r\n {product.name ? product.name[0] : 'P'}\r\n </AvatarFallback>\r\n )}\r\n </Avatar>\r\n <div className=\"flex-1 min-w-0\">\r\n <div className=\"font-medium text-gray-900 truncate\">{product.name}</div>\r\n <div className=\"flex items-center space-x-2 text-xs text-gray-500\">\r\n <span className={product.inStock ? 'text-success-600' : 'text-danger-600'}>\r\n {product.inStock ? 'In Stock' : 'Out of Stock'}\r\n </span>\r\n {product.discount && (\r\n <Badge variant=\"danger\">{product.discount}</Badge>\r\n )}\r\n </div>\r\n <div className=\"flex items-center space-x-2 text-xs mt-1\">\r\n <span className=\"font-bold text-primary-700\">${product.price.toFixed(2)}</span>\r\n {product.oldPrice && (\r\n <span className=\"line-through text-gray-400\">${product.oldPrice.toFixed(2)}</span>\r\n )}\r\n </div>\r\n {product.categories && (\r\n <div className=\"flex flex-wrap gap-1 mt-1\">\r\n {product.categories.map((cat) => (\r\n <Badge key={cat} variant=\"outline\" className=\"text-xs\">\r\n {cat}\r\n </Badge>\r\n ))}\r\n </div>\r\n )}\r\n </div>\r\n <Button\r\n variant=\"primary\"\r\n size=\"sm\"\r\n onClick={e => {\r\n e.stopPropagation();\r\n onAddToCart && onAddToCart(product.id);\r\n }}\r\n disabled={!product.inStock}\r\n aria-label=\"Add to cart\"\r\n >\r\n +\r\n </Button>\r\n </div>\r\n ))\r\n )}\r\n </div>\r\n </CardContent>\r\n </Card>\r\n);"],"names":["_jsxs","_jsx"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './CommerceSidebar';
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { CartItem } from '../Checkout/types';
|
|
3
|
+
import type { ProductData } from '../SingleProductView/SingleProductView';
|
|
4
|
+
export interface MarketplaceLayoutProps {
|
|
5
|
+
products: ProductData[];
|
|
6
|
+
cartItems: CartItem[];
|
|
7
|
+
onProductClick?: (id: string) => void;
|
|
8
|
+
onAddToCart?: (id: string) => void;
|
|
9
|
+
onRemoveFromCart?: (id: string) => void;
|
|
10
|
+
onProceedToCheckout?: () => void;
|
|
11
|
+
children?: React.ReactNode;
|
|
12
|
+
className?: string;
|
|
13
|
+
}
|
|
14
|
+
export declare const MarketplaceLayout: React.FC<MarketplaceLayoutProps>;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { PageLayout, PageHeader, PageLayoutContent, PageSidebar, PageFooter } from '../PageLayout/PageLayout.js';
|
|
3
|
+
import '../Button/Button.js';
|
|
4
|
+
import '../Card/Card.js';
|
|
5
|
+
import '../Badge/Badge.js';
|
|
6
|
+
import '../Input/Input.js';
|
|
7
|
+
import '../Avatar/Avatar.js';
|
|
8
|
+
import 'lucide-react';
|
|
9
|
+
import 'react';
|
|
10
|
+
import '../Tabs/Tabs.js';
|
|
11
|
+
import '../Toast/Toast.js';
|
|
12
|
+
import { CommerceSidebar } from '../CommerceSidebar/CommerceSidebar.js';
|
|
13
|
+
import { AllProductsView } from '../AllProductsView/AllProductsView.js';
|
|
14
|
+
import { CheckoutSidebar } from '../Checkout/CheckoutSidebar.js';
|
|
15
|
+
import { cn } from '../../utils/cn.js';
|
|
16
|
+
|
|
17
|
+
const MarketplaceLayout = ({ products, cartItems, onProductClick, onAddToCart, onRemoveFromCart, onProceedToCheckout, children, className, }) => {
|
|
18
|
+
// Sidebar: CommerceSidebar (product list)
|
|
19
|
+
// Main: AllProductsView (product grid/list)
|
|
20
|
+
// Checkout: CheckoutSidebar (cart/checkout)
|
|
21
|
+
// Footer: default
|
|
22
|
+
return (jsxs(PageLayout, { variant: "centered", maxWidth: "xl", className: cn(className), children: [jsx(PageHeader, { children: jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center h-16", children: jsx("span", { className: "font-bold text-xl", children: "Marketplace" }) }) }), jsxs(PageLayoutContent, { layout: "sidebar", spacing: "lg", children: [jsx(PageSidebar, { position: "left", width: "md", children: jsx(CommerceSidebar, { products: products, onProductClick: onProductClick, onAddToCart: onAddToCart }) }), jsx("main", { className: "flex-1", children: children ? (children) : (jsx(AllProductsView, { products: products, onProductClick: onProductClick, onAddToCart: onAddToCart })) }), jsx(PageSidebar, { position: "right", width: "md", children: jsx(CheckoutSidebar, { cartItems: cartItems, open: true, onOpenChange: () => { }, onRemoveItem: onRemoveFromCart, onProceedToCheckout: onProceedToCheckout }) })] }), jsx(PageFooter, { variant: "simple", children: jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center", children: jsx("p", { className: "text-gray-600", children: "\u00A9 2024 Marketplace. All rights reserved." }) }) })] }));
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export { MarketplaceLayout };
|
|
26
|
+
//# sourceMappingURL=MarketplaceLayout.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MarketplaceLayout.js","sources":["../../../src/components/MarketplaceLayout/MarketplaceLayout.tsx"],"sourcesContent":["import React from 'react';\r\nimport {\r\n PageLayout,\r\n PageHeader,\r\n PageLayoutContent,\r\n PageSidebar,\r\n PageFooter,\r\n} from '../PageLayout';\r\nimport { CommerceSidebar } from '../CommerceSidebar/CommerceSidebar';\r\nimport { AllProductsView } from '../AllProductsView/AllProductsView';\r\nimport { CheckoutSidebar } from '../Checkout/CheckoutSidebar';\r\nimport type { CartItem } from '../Checkout/types';\r\nimport type { ProductData } from '../SingleProductView/SingleProductView';\r\nimport { cn } from '../../utils/cn';\r\n\r\nexport interface MarketplaceLayoutProps {\r\n products: ProductData[];\r\n cartItems: CartItem[];\r\n onProductClick?: (id: string) => void;\r\n onAddToCart?: (id: string) => void;\r\n onRemoveFromCart?: (id: string) => void;\r\n onProceedToCheckout?: () => void;\r\n children?: React.ReactNode;\r\n className?: string;\r\n}\r\n\r\nexport const MarketplaceLayout: React.FC<MarketplaceLayoutProps> = ({\r\n products,\r\n cartItems,\r\n onProductClick,\r\n onAddToCart,\r\n onRemoveFromCart,\r\n onProceedToCheckout,\r\n children,\r\n className,\r\n}) => {\r\n // Sidebar: CommerceSidebar (product list)\r\n // Main: AllProductsView (product grid/list)\r\n // Checkout: CheckoutSidebar (cart/checkout)\r\n // Footer: default\r\n\r\n return (\r\n <PageLayout variant=\"centered\" maxWidth=\"xl\" className={cn(className)}>\r\n <PageHeader>\r\n <div className=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center h-16\">\r\n <span className=\"font-bold text-xl\">Marketplace</span>\r\n </div>\r\n </PageHeader>\r\n <PageLayoutContent layout=\"sidebar\" spacing=\"lg\">\r\n <PageSidebar position=\"left\" width=\"md\">\r\n <CommerceSidebar\r\n products={products}\r\n onProductClick={onProductClick}\r\n onAddToCart={onAddToCart}\r\n />\r\n </PageSidebar>\r\n <main className=\"flex-1\">\r\n {children ? (\r\n children\r\n ) : (\r\n <AllProductsView\r\n products={products}\r\n onProductClick={onProductClick}\r\n onAddToCart={onAddToCart}\r\n />\r\n )}\r\n </main>\r\n <PageSidebar position=\"right\" width=\"md\">\r\n <CheckoutSidebar\r\n cartItems={cartItems}\r\n open={true}\r\n onOpenChange={() => {}}\r\n onRemoveItem={onRemoveFromCart}\r\n onProceedToCheckout={onProceedToCheckout}\r\n />\r\n </PageSidebar>\r\n </PageLayoutContent>\r\n <PageFooter variant=\"simple\">\r\n <div className=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center\">\r\n <p className=\"text-gray-600\">© 2024 Marketplace. All rights reserved.</p>\r\n </div>\r\n </PageFooter>\r\n </PageLayout>\r\n );\r\n};"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;;;MA0Ba,iBAAiB,GAAqC,CAAC,EAClE,QAAQ,EACR,SAAS,EACT,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,mBAAmB,EACnB,QAAQ,EACR,SAAS,GACV,KAAI;;;;;AAMH,IAAA,QACEA,IAAA,CAAC,UAAU,EAAA,EAAC,OAAO,EAAC,UAAU,EAAC,QAAQ,EAAC,IAAI,EAAC,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,EAAA,QAAA,EAAA,CACnEC,GAAA,CAAC,UAAU,cACTA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,+DAA+D,EAAA,QAAA,EAC5EA,cAAM,SAAS,EAAC,mBAAmB,EAAA,QAAA,EAAA,aAAA,EAAA,CAAmB,GAClD,EAAA,CACK,EACbD,KAAC,iBAAiB,EAAA,EAAC,MAAM,EAAC,SAAS,EAAC,OAAO,EAAC,IAAI,EAAA,QAAA,EAAA,CAC9CC,GAAA,CAAC,WAAW,IAAC,QAAQ,EAAC,MAAM,EAAC,KAAK,EAAC,IAAI,YACrCA,GAAA,CAAC,eAAe,IACd,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EAAA,CACxB,EAAA,CACU,EACdA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,QAAQ,YACrB,QAAQ,IACP,QAAQ,KAERA,GAAA,CAAC,eAAe,EAAA,EACd,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EAAA,CACxB,CACH,EAAA,CACI,EACPA,GAAA,CAAC,WAAW,IAAC,QAAQ,EAAC,OAAO,EAAC,KAAK,EAAC,IAAI,YACtCA,GAAA,CAAC,eAAe,IACd,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,MAAK,EAAE,CAAC,EACtB,YAAY,EAAE,gBAAgB,EAC9B,mBAAmB,EAAE,mBAAmB,EAAA,CACxC,EAAA,CACU,IACI,EACpBA,GAAA,CAAC,UAAU,EAAA,EAAC,OAAO,EAAC,QAAQ,YAC1BA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,oDAAoD,EAAA,QAAA,EACjEA,GAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,eAAe,EAAA,QAAA,EAAA,+CAAA,EAAA,CAAkD,GAC1E,EAAA,CACK,CAAA,EAAA,CACF;AAEjB;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './MarketplaceLayout';
|
|
@@ -3,6 +3,7 @@ import * as React from 'react';
|
|
|
3
3
|
import { cva } from 'class-variance-authority';
|
|
4
4
|
import { cn } from '../../utils/cn.js';
|
|
5
5
|
import { useDarkMode } from '../../hooks/useDarkMode.js';
|
|
6
|
+
import { Moon, Sun } from 'lucide-react';
|
|
6
7
|
|
|
7
8
|
const switchVariants = cva("inline-flex items-center justify-center rounded-full transition focus:outline-none focus:ring-2 focus:ring-primary-500 dark:focus:ring-primary-400", {
|
|
8
9
|
variants: {
|
|
@@ -29,13 +30,7 @@ const switchVariants = cva("inline-flex items-center justify-center rounded-full
|
|
|
29
30
|
});
|
|
30
31
|
const NightModeSwitch = React.forwardRef(({ className, variant, size, iconStyle, ariaLabel = "Toggle dark mode", ...props }, ref) => {
|
|
31
32
|
const { isDarkMode, toggle } = useDarkMode();
|
|
32
|
-
return (jsxs("button", { type: "button", ref: ref, "aria-label": ariaLabel, "aria-pressed": isDarkMode, className: cn(switchVariants({ variant, size, iconStyle, className })), onClick: toggle, ...props, children: [jsx("span", { className: "sr-only", children: ariaLabel }), isDarkMode ? (
|
|
33
|
-
// Moon icon (filled)
|
|
34
|
-
iconStyle === "outline" ? (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M21 12.79A9 9 0 1111.21 3a7 7 0 109.79 9.79z" }) })) : (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: "w-5 h-5", fill: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: jsx("path", { d: "M21 12.79A9 9 0 1111.21 3a7 7 0 109.79 9.79z" }) }))) : iconStyle === "outline" ? (
|
|
35
|
-
// Sun icon (outline)
|
|
36
|
-
jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", children: [jsx("circle", { cx: "12", cy: "12", r: "5" }), jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" })] })) : (
|
|
37
|
-
// Sun icon (filled)
|
|
38
|
-
jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", className: "w-5 h-5", fill: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: [jsx("circle", { cx: "12", cy: "12", r: "5" }), jsxs("g", { children: [jsx("rect", { x: "11", y: "1", width: "2", height: "3", rx: "1" }), jsx("rect", { x: "11", y: "20", width: "2", height: "3", rx: "1" }), jsx("rect", { x: "4.22", y: "4.22", width: "2", height: "3", rx: "1", transform: "rotate(-45 5.22 5.22)" }), jsx("rect", { x: "17.78", y: "17.78", width: "2", height: "3", rx: "1", transform: "rotate(-45 18.78 18.78)" }), jsx("rect", { x: "1", y: "11", width: "3", height: "2", rx: "1" }), jsx("rect", { x: "20", y: "11", width: "3", height: "2", rx: "1" }), jsx("rect", { x: "4.22", y: "16.78", width: "2", height: "3", rx: "1", transform: "rotate(45 5.22 18.28)" }), jsx("rect", { x: "17.78", y: "6.22", width: "2", height: "3", rx: "1", transform: "rotate(45 18.78 7.72)" })] })] }))] }));
|
|
33
|
+
return (jsxs("button", { type: "button", ref: ref, "aria-label": ariaLabel, "aria-pressed": isDarkMode, className: cn(switchVariants({ variant, size, iconStyle, className })), onClick: toggle, ...props, children: [jsx("span", { className: "sr-only", children: ariaLabel }), isDarkMode ? (jsx(Moon, { className: "w-5 h-5", strokeWidth: iconStyle === "outline" ? 2 : 1.5, fill: iconStyle === "filled" ? "currentColor" : "none", "aria-hidden": "true" })) : (jsx(Sun, { className: "w-5 h-5", strokeWidth: iconStyle === "outline" ? 2 : 1.5, fill: iconStyle === "filled" ? "currentColor" : "none", "aria-hidden": "true" }))] }));
|
|
39
34
|
});
|
|
40
35
|
NightModeSwitch.displayName = "NightModeSwitch";
|
|
41
36
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NightModeSwitch.js","sources":["../../../src/components/NightModeSwitch/NightModeSwitch.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport { cva, type VariantProps } from \"class-variance-authority\";\r\nimport { cn } from \"../../utils/cn\";\r\nimport { useDarkMode } from \"../../hooks/useDarkMode\";\r\n\r\nconst switchVariants = cva(\r\n \"inline-flex items-center justify-center rounded-full transition focus:outline-none focus:ring-2 focus:ring-primary-500 dark:focus:ring-primary-400\",\r\n {\r\n variants: {\r\n variant: {\r\n primary: \"bg-primary-600 text-white hover:bg-primary-700 dark:bg-primary-400 dark:text-gray-900 dark:hover:bg-primary-500\",\r\n secondary: \"bg-secondary-600 text-white hover:bg-secondary-700 dark:bg-secondary-400 dark:text-gray-900 dark:hover:bg-secondary-500\",\r\n ghost: \"bg-transparent hover:bg-primary-100 dark:hover:bg-primary-900 text-primary-600 dark:text-primary-300\",\r\n },\r\n size: {\r\n sm: \"w-8 h-8 text-base\",\r\n md: \"w-10 h-10 text-lg\",\r\n lg: \"w-12 h-12 text-xl\",\r\n },\r\n iconStyle: {\r\n filled: \"\",\r\n outline: \"\",\r\n },\r\n },\r\n defaultVariants: {\r\n variant: \"ghost\",\r\n size: \"md\",\r\n iconStyle: \"filled\",\r\n },\r\n }\r\n);\r\n\r\nexport interface NightModeSwitchProps\r\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\r\n VariantProps<typeof switchVariants> {\r\n ariaLabel?: string;\r\n}\r\n\r\nexport const NightModeSwitch = React.forwardRef<HTMLButtonElement, NightModeSwitchProps>(\r\n (\r\n {\r\n className,\r\n variant,\r\n size,\r\n iconStyle,\r\n ariaLabel = \"Toggle dark mode\",\r\n ...props\r\n },\r\n ref\r\n ) => {\r\n const { isDarkMode, toggle } = useDarkMode();\r\n\r\n return (\r\n <button\r\n type=\"button\"\r\n ref={ref}\r\n aria-label={ariaLabel}\r\n aria-pressed={isDarkMode}\r\n className={cn(switchVariants({ variant, size, iconStyle, className }))}\r\n onClick={toggle}\r\n {...props}\r\n >\r\n <span className=\"sr-only\">{ariaLabel}</span>\r\n {isDarkMode ? (\r\n
|
|
1
|
+
{"version":3,"file":"NightModeSwitch.js","sources":["../../../src/components/NightModeSwitch/NightModeSwitch.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport { cva, type VariantProps } from \"class-variance-authority\";\r\nimport { cn } from \"../../utils/cn\";\r\nimport { useDarkMode } from \"../../hooks/useDarkMode\";\r\nimport { Sun, Moon } from \"lucide-react\";\r\n\r\nconst switchVariants = cva(\r\n \"inline-flex items-center justify-center rounded-full transition focus:outline-none focus:ring-2 focus:ring-primary-500 dark:focus:ring-primary-400\",\r\n {\r\n variants: {\r\n variant: {\r\n primary: \"bg-primary-600 text-white hover:bg-primary-700 dark:bg-primary-400 dark:text-gray-900 dark:hover:bg-primary-500\",\r\n secondary: \"bg-secondary-600 text-white hover:bg-secondary-700 dark:bg-secondary-400 dark:text-gray-900 dark:hover:bg-secondary-500\",\r\n ghost: \"bg-transparent hover:bg-primary-100 dark:hover:bg-primary-900 text-primary-600 dark:text-primary-300\",\r\n },\r\n size: {\r\n sm: \"w-8 h-8 text-base\",\r\n md: \"w-10 h-10 text-lg\",\r\n lg: \"w-12 h-12 text-xl\",\r\n },\r\n iconStyle: {\r\n filled: \"\",\r\n outline: \"\",\r\n },\r\n },\r\n defaultVariants: {\r\n variant: \"ghost\",\r\n size: \"md\",\r\n iconStyle: \"filled\",\r\n },\r\n }\r\n);\r\n\r\nexport interface NightModeSwitchProps\r\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\r\n VariantProps<typeof switchVariants> {\r\n ariaLabel?: string;\r\n}\r\n\r\nexport const NightModeSwitch = React.forwardRef<HTMLButtonElement, NightModeSwitchProps>(\r\n (\r\n {\r\n className,\r\n variant,\r\n size,\r\n iconStyle,\r\n ariaLabel = \"Toggle dark mode\",\r\n ...props\r\n },\r\n ref\r\n ) => {\r\n const { isDarkMode, toggle } = useDarkMode();\r\n\r\n return (\r\n <button\r\n type=\"button\"\r\n ref={ref}\r\n aria-label={ariaLabel}\r\n aria-pressed={isDarkMode}\r\n className={cn(switchVariants({ variant, size, iconStyle, className }))}\r\n onClick={toggle}\r\n {...props}\r\n >\r\n <span className=\"sr-only\">{ariaLabel}</span>\r\n {isDarkMode ? (\r\n <Moon\r\n className=\"w-5 h-5\"\r\n strokeWidth={iconStyle === \"outline\" ? 2 : 1.5}\r\n fill={iconStyle === \"filled\" ? \"currentColor\" : \"none\"}\r\n aria-hidden=\"true\"\r\n />\r\n ) : (\r\n <Sun\r\n className=\"w-5 h-5\"\r\n strokeWidth={iconStyle === \"outline\" ? 2 : 1.5}\r\n fill={iconStyle === \"filled\" ? \"currentColor\" : \"none\"}\r\n aria-hidden=\"true\"\r\n />\r\n )}\r\n </button>\r\n );\r\n }\r\n);\r\n\r\nNightModeSwitch.displayName = \"NightModeSwitch\";"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAMA,MAAM,cAAc,GAAG,GAAG,CACxB,oJAAoJ,EACpJ;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,iHAAiH;AAC1H,YAAA,SAAS,EAAE,yHAAyH;AACpI,YAAA,KAAK,EAAE,sGAAsG;AAC9G,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,mBAAmB;AACvB,YAAA,EAAE,EAAE,mBAAmB;AACvB,YAAA,EAAE,EAAE,mBAAmB;AACxB,SAAA;AACD,QAAA,SAAS,EAAE;AACT,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,OAAO,EAAE,EAAE;AACZ,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,SAAS,EAAE,QAAQ;AACpB,KAAA;AACF,CAAA,CACF;AAQM,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAC7C,CACE,EACE,SAAS,EACT,OAAO,EACP,IAAI,EACJ,SAAS,EACT,SAAS,GAAG,kBAAkB,EAC9B,GAAG,KAAK,EACT,EACD,GAAG,KACD;IACF,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG,WAAW,EAAE;AAE5C,IAAA,QACEA,IAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,GAAG,EAAE,GAAG,EAAA,YAAA,EACI,SAAS,EAAA,cAAA,EACP,UAAU,EACxB,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAAC,EACtE,OAAO,EAAE,MAAM,EAAA,GACX,KAAK,EAAA,QAAA,EAAA,CAETC,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,SAAS,EAAA,QAAA,EAAE,SAAS,EAAA,CAAQ,EAC3C,UAAU,IACTA,GAAA,CAAC,IAAI,EAAA,EACH,SAAS,EAAC,SAAS,EACnB,WAAW,EAAE,SAAS,KAAK,SAAS,GAAG,CAAC,GAAG,GAAG,EAC9C,IAAI,EAAE,SAAS,KAAK,QAAQ,GAAG,cAAc,GAAG,MAAM,EAAA,aAAA,EAC1C,MAAM,EAAA,CAClB,KAEFA,GAAA,CAAC,GAAG,EAAA,EACF,SAAS,EAAC,SAAS,EACnB,WAAW,EAAE,SAAS,KAAK,SAAS,GAAG,CAAC,GAAG,GAAG,EAC9C,IAAI,EAAE,SAAS,KAAK,QAAQ,GAAG,cAAc,GAAG,MAAM,EAAA,aAAA,EAC1C,MAAM,EAAA,CAClB,CACH,CAAA,EAAA,CACM;AAEb,CAAC;AAGH,eAAe,CAAC,WAAW,GAAG,iBAAiB;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { RadioGroup } from "./Radio";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Select } from "./Select";
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface BlogAuthor {
|
|
3
|
+
name: string;
|
|
4
|
+
avatar?: string;
|
|
5
|
+
bio?: string;
|
|
6
|
+
}
|
|
7
|
+
export interface BlogPost {
|
|
8
|
+
title: string;
|
|
9
|
+
content: React.ReactNode;
|
|
10
|
+
date: string;
|
|
11
|
+
readTime?: string;
|
|
12
|
+
featuredImage?: string;
|
|
13
|
+
categories?: string[];
|
|
14
|
+
tags?: string[];
|
|
15
|
+
author: BlogAuthor;
|
|
16
|
+
relatedPosts?: {
|
|
17
|
+
title: string;
|
|
18
|
+
date: string;
|
|
19
|
+
href?: string;
|
|
20
|
+
}[];
|
|
21
|
+
}
|
|
22
|
+
export interface SingleBlogViewProps {
|
|
23
|
+
post: BlogPost;
|
|
24
|
+
className?: string;
|
|
25
|
+
}
|
|
26
|
+
export declare const SingleBlogView: React.FC<SingleBlogViewProps>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { PageLayout, PageHeader, PageLayoutContent, PageContent, PageSidebar, PageFooter } from '../PageLayout/PageLayout.js';
|
|
3
|
+
import { Button } from '../Button/Button.js';
|
|
4
|
+
import { Card, CardHeader, CardTitle, CardContent } from '../Card/Card.js';
|
|
5
|
+
import { Badge } from '../Badge/Badge.js';
|
|
6
|
+
import { Input } from '../Input/Input.js';
|
|
7
|
+
import { AvatarImage, AvatarFallback, Avatar } from '../Avatar/Avatar.js';
|
|
8
|
+
import { Calendar, Mail, Tag } from 'lucide-react';
|
|
9
|
+
import 'react';
|
|
10
|
+
import '../Tabs/Tabs.js';
|
|
11
|
+
import '../Toast/Toast.js';
|
|
12
|
+
import { cn } from '../../utils/cn.js';
|
|
13
|
+
|
|
14
|
+
const SingleBlogView = ({ post, className }) => (jsxs(PageLayout, { variant: "blog", maxWidth: "xl", className: cn(className), children: [jsx(PageHeader, { children: jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: jsxs("div", { className: "flex items-center justify-between h-16", children: [jsxs("div", { className: "flex items-center space-x-2", children: [jsxs("div", { className: "w-8 h-8 bg-primary-600 rounded-lg flex items-center justify-center", children: [jsx(AvatarImage, { src: post.author.avatar }), jsx(AvatarFallback, { children: post.author.name ? post.author.name[0] : 'A' })] }), jsx("span", { className: "font-bold text-xl", children: "Blog" })] }), jsxs("nav", { className: "flex items-center space-x-6", children: [jsx("a", { href: "#", className: "text-gray-700 hover:text-primary-600", children: "Home" }), jsx("a", { href: "#", className: "text-gray-700 hover:text-primary-600", children: "Categories" }), jsx("a", { href: "#", className: "text-gray-700 hover:text-primary-600", children: "About" })] })] }) }) }), jsxs(PageLayoutContent, { layout: "sidebar", spacing: "lg", children: [jsxs(PageContent, { maxWidth: "full", className: "lg:flex-1", children: [jsxs("article", { className: "prose prose-lg max-w-none", children: [jsxs("header", { className: "mb-8", children: [jsx("div", { className: "flex items-center space-x-2 mb-4", children: post.categories?.map((cat, i) => (jsx(Badge, { variant: i === 0 ? 'default' : 'outline', children: cat }, cat))) }), jsx("h1", { className: "text-4xl font-bold text-gray-900 mb-4", children: post.title }), jsxs("div", { className: "flex items-center space-x-4 text-gray-600 mb-6", children: [jsxs("div", { className: "flex items-center space-x-2", children: [jsx(Avatar, { size: "sm", children: post.author.avatar ? (jsx(AvatarImage, { src: post.author.avatar })) : (jsx(AvatarFallback, { children: post.author.name ? post.author.name[0] : 'A' })) }), jsx("span", { children: post.author.name })] }), jsxs("div", { className: "flex items-center space-x-1", children: [jsx(Calendar, { className: "h-4 w-4" }), jsx("span", { children: post.date })] }), post.readTime && jsx("span", { children: post.readTime })] })] }), post.featuredImage && (jsx("div", { className: "aspect-video bg-gray-100 rounded-lg mb-8 flex items-center justify-center", children: jsx("img", { src: post.featuredImage, alt: "Featured", className: "object-cover h-full w-full rounded" }) })), jsx("div", { className: "space-y-6 text-gray-700 leading-relaxed", children: post.content })] }), post.author.bio && (jsx("div", { className: "mt-12 p-6 bg-gray-50 rounded-lg", children: jsxs("div", { className: "flex items-start space-x-4", children: [jsx(Avatar, { size: "lg", children: post.author.avatar ? (jsx(AvatarImage, { src: post.author.avatar })) : (jsx(AvatarFallback, { children: post.author.name ? post.author.name[0] : 'A' })) }), jsxs("div", { children: [jsx("h3", { className: "font-semibold text-gray-900 mb-2", children: post.author.name }), jsx("p", { className: "text-gray-600 mb-3", children: post.author.bio }), jsxs("div", { className: "flex space-x-4", children: [jsx(Button, { variant: "outline", size: "sm", children: "Follow" }), jsx(Button, { variant: "ghost", size: "sm", children: jsx(Mail, { className: "h-4 w-4" }) })] })] })] }) }))] }), jsx(PageSidebar, { position: "right", width: "md", children: jsxs("div", { className: "space-y-6", children: [jsxs(Card, { children: [jsx(CardHeader, { children: jsx(CardTitle, { children: "Search" }) }), jsx(CardContent, { children: jsx(Input, { placeholder: "Search articles..." }) })] }), post.categories && (jsxs(Card, { children: [jsx(CardHeader, { children: jsx(CardTitle, { children: "Categories" }) }), jsx(CardContent, { children: jsx("div", { className: "space-y-2", children: post.categories.map((cat) => (jsx("div", { className: "flex items-center justify-between", children: jsx("a", { href: "#", className: "text-gray-700 hover:text-primary-600", children: cat }) }, cat))) }) })] })), post.relatedPosts && (jsxs(Card, { children: [jsx(CardHeader, { children: jsx(CardTitle, { children: "Recent Posts" }) }), jsx(CardContent, { children: jsx("div", { className: "space-y-4", children: post.relatedPosts.map((rel, idx) => (jsxs("div", { children: [jsx("a", { href: rel.href || '#', className: "text-gray-900 hover:text-primary-600 font-medium block mb-1", children: rel.title }), jsx("p", { className: "text-sm text-gray-500", children: rel.date })] }, idx))) }) })] })), post.tags && (jsxs(Card, { children: [jsx(CardHeader, { children: jsx(CardTitle, { children: "Tags" }) }), jsx(CardContent, { children: jsx("div", { className: "flex flex-wrap gap-2", children: post.tags.map((tag) => (jsxs(Badge, { variant: "outline", className: "cursor-pointer hover:bg-primary-50", children: [jsx(Tag, { className: "h-3 w-3 mr-1" }), tag] }, tag))) }) })] }))] }) })] }), jsx(PageFooter, { variant: "minimal", children: jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center", children: jsx("p", { className: "text-gray-600", children: "\u00A9 2024 Blog. All rights reserved." }) }) })] }));
|
|
15
|
+
|
|
16
|
+
export { SingleBlogView };
|
|
17
|
+
//# sourceMappingURL=SingleBlogView.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SingleBlogView.js","sources":["../../../src/components/SingleBlogView/SingleBlogView.tsx"],"sourcesContent":["import React from 'react';\r\nimport {\r\n PageLayout,\r\n PageHeader,\r\n PageLayoutContent,\r\n PageContent,\r\n PageSidebar,\r\n PageFooter,\r\n} from '../PageLayout';\r\nimport { Card, CardHeader, CardTitle, CardContent } from '../Card';\r\nimport { Badge } from '../Badge';\r\nimport { Button } from '../Button';\r\nimport { Input } from '../Input';\r\nimport { Avatar, AvatarImage, AvatarFallback } from '../Avatar';\r\nimport { Calendar, Mail, Tag } from 'lucide-react';\r\nimport { cn } from '../../utils/cn';\r\n\r\nexport interface BlogAuthor {\r\n name: string;\r\n avatar?: string;\r\n bio?: string;\r\n}\r\n\r\nexport interface BlogPost {\r\n title: string;\r\n content: React.ReactNode;\r\n date: string;\r\n readTime?: string;\r\n featuredImage?: string;\r\n categories?: string[];\r\n tags?: string[];\r\n author: BlogAuthor;\r\n relatedPosts?: { title: string; date: string; href?: string }[];\r\n}\r\n\r\nexport interface SingleBlogViewProps {\r\n post: BlogPost;\r\n className?: string;\r\n}\r\n\r\nexport const SingleBlogView: React.FC<SingleBlogViewProps> = ({ post, className }) => (\r\n <PageLayout variant=\"blog\" maxWidth=\"xl\" className={cn(className)}>\r\n <PageHeader>\r\n <div className=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div className=\"flex items-center justify-between h-16\">\r\n <div className=\"flex items-center space-x-2\">\r\n <div className=\"w-8 h-8 bg-primary-600 rounded-lg flex items-center justify-center\">\r\n <AvatarImage src={post.author.avatar} />\r\n <AvatarFallback>\r\n {post.author.name ? post.author.name[0] : 'A'}\r\n </AvatarFallback>\r\n </div>\r\n <span className=\"font-bold text-xl\">Blog</span>\r\n </div>\r\n <nav className=\"flex items-center space-x-6\">\r\n <a href=\"#\" className=\"text-gray-700 hover:text-primary-600\">Home</a>\r\n <a href=\"#\" className=\"text-gray-700 hover:text-primary-600\">Categories</a>\r\n <a href=\"#\" className=\"text-gray-700 hover:text-primary-600\">About</a>\r\n </nav>\r\n </div>\r\n </div>\r\n </PageHeader>\r\n\r\n <PageLayoutContent layout=\"sidebar\" spacing=\"lg\">\r\n {/* Main Content */}\r\n <PageContent maxWidth=\"full\" className=\"lg:flex-1\">\r\n <article className=\"prose prose-lg max-w-none\">\r\n <header className=\"mb-8\">\r\n <div className=\"flex items-center space-x-2 mb-4\">\r\n {post.categories?.map((cat, i) => (\r\n <Badge key={cat} variant={i === 0 ? 'default' : 'outline'}>\r\n {cat}\r\n </Badge>\r\n ))}\r\n </div>\r\n <h1 className=\"text-4xl font-bold text-gray-900 mb-4\">\r\n {post.title}\r\n </h1>\r\n <div className=\"flex items-center space-x-4 text-gray-600 mb-6\">\r\n <div className=\"flex items-center space-x-2\">\r\n <Avatar size=\"sm\">\r\n {post.author.avatar ? (\r\n <AvatarImage src={post.author.avatar} />\r\n ) : (\r\n <AvatarFallback>\r\n {post.author.name ? post.author.name[0] : 'A'}\r\n </AvatarFallback>\r\n )}\r\n </Avatar>\r\n <span>{post.author.name}</span>\r\n </div>\r\n <div className=\"flex items-center space-x-1\">\r\n <Calendar className=\"h-4 w-4\" />\r\n <span>{post.date}</span>\r\n </div>\r\n {post.readTime && <span>{post.readTime}</span>}\r\n </div>\r\n </header>\r\n {post.featuredImage && (\r\n <div className=\"aspect-video bg-gray-100 rounded-lg mb-8 flex items-center justify-center\">\r\n <img\r\n src={post.featuredImage}\r\n alt=\"Featured\"\r\n className=\"object-cover h-full w-full rounded\"\r\n />\r\n </div>\r\n )}\r\n <div className=\"space-y-6 text-gray-700 leading-relaxed\">\r\n {post.content}\r\n </div>\r\n </article>\r\n {/* Author Bio */}\r\n {post.author.bio && (\r\n <div className=\"mt-12 p-6 bg-gray-50 rounded-lg\">\r\n <div className=\"flex items-start space-x-4\">\r\n <Avatar size=\"lg\">\r\n {post.author.avatar ? (\r\n <AvatarImage src={post.author.avatar} />\r\n ) : (\r\n <AvatarFallback>\r\n {post.author.name ? post.author.name[0] : 'A'}\r\n </AvatarFallback>\r\n )}\r\n </Avatar>\r\n <div>\r\n <h3 className=\"font-semibold text-gray-900 mb-2\">{post.author.name}</h3>\r\n <p className=\"text-gray-600 mb-3\">{post.author.bio}</p>\r\n <div className=\"flex space-x-4\">\r\n <Button variant=\"outline\" size=\"sm\">Follow</Button>\r\n <Button variant=\"ghost\" size=\"sm\">\r\n <Mail className=\"h-4 w-4\" />\r\n </Button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </PageContent>\r\n {/* Sidebar */}\r\n <PageSidebar position=\"right\" width=\"md\">\r\n <div className=\"space-y-6\">\r\n {/* Search */}\r\n <Card>\r\n <CardHeader>\r\n <CardTitle>Search</CardTitle>\r\n </CardHeader>\r\n <CardContent>\r\n <Input placeholder=\"Search articles...\" />\r\n </CardContent>\r\n </Card>\r\n {/* Categories */}\r\n {post.categories && (\r\n <Card>\r\n <CardHeader>\r\n <CardTitle>Categories</CardTitle>\r\n </CardHeader>\r\n <CardContent>\r\n <div className=\"space-y-2\">\r\n {post.categories.map((cat) => (\r\n <div key={cat} className=\"flex items-center justify-between\">\r\n <a href=\"#\" className=\"text-gray-700 hover:text-primary-600\">\r\n {cat}\r\n </a>\r\n </div>\r\n ))}\r\n </div>\r\n </CardContent>\r\n </Card>\r\n )}\r\n {/* Related Posts */}\r\n {post.relatedPosts && (\r\n <Card>\r\n <CardHeader>\r\n <CardTitle>Recent Posts</CardTitle>\r\n </CardHeader>\r\n <CardContent>\r\n <div className=\"space-y-4\">\r\n {post.relatedPosts.map((rel, idx) => (\r\n <div key={idx}>\r\n <a\r\n href={rel.href || '#'}\r\n className=\"text-gray-900 hover:text-primary-600 font-medium block mb-1\"\r\n >\r\n {rel.title}\r\n </a>\r\n <p className=\"text-sm text-gray-500\">{rel.date}</p>\r\n </div>\r\n ))}\r\n </div>\r\n </CardContent>\r\n </Card>\r\n )}\r\n {/* Tags */}\r\n {post.tags && (\r\n <Card>\r\n <CardHeader>\r\n <CardTitle>Tags</CardTitle>\r\n </CardHeader>\r\n <CardContent>\r\n <div className=\"flex flex-wrap gap-2\">\r\n {post.tags.map((tag) => (\r\n <Badge key={tag} variant=\"outline\" className=\"cursor-pointer hover:bg-primary-50\">\r\n <Tag className=\"h-3 w-3 mr-1\" />\r\n {tag}\r\n </Badge>\r\n ))}\r\n </div>\r\n </CardContent>\r\n </Card>\r\n )}\r\n </div>\r\n </PageSidebar>\r\n </PageLayoutContent>\r\n <PageFooter variant=\"minimal\">\r\n <div className=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center\">\r\n <p className=\"text-gray-600\">© 2024 Blog. All rights reserved.</p>\r\n </div>\r\n </PageFooter>\r\n </PageLayout>\r\n);"],"names":["_jsxs","_jsx"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './SingleBlogView';
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface ProductReview {
|
|
3
|
+
user: string;
|
|
4
|
+
avatar?: string;
|
|
5
|
+
rating: number;
|
|
6
|
+
comment: string;
|
|
7
|
+
date: string;
|
|
8
|
+
}
|
|
9
|
+
export interface ProductData {
|
|
10
|
+
id: string;
|
|
11
|
+
name: string;
|
|
12
|
+
description: string;
|
|
13
|
+
images: string[];
|
|
14
|
+
price: number;
|
|
15
|
+
oldPrice?: number;
|
|
16
|
+
discount?: string;
|
|
17
|
+
inStock: boolean;
|
|
18
|
+
features: string[];
|
|
19
|
+
colors?: string[];
|
|
20
|
+
reviews?: ProductReview[];
|
|
21
|
+
}
|
|
22
|
+
export interface SingleProductViewProps {
|
|
23
|
+
product: ProductData;
|
|
24
|
+
onAddToCart?: (productId: string) => void;
|
|
25
|
+
onWishlist?: (productId: string) => void;
|
|
26
|
+
onShare?: (productId: string) => void;
|
|
27
|
+
showReviews?: boolean;
|
|
28
|
+
showColorOptions?: boolean;
|
|
29
|
+
className?: string;
|
|
30
|
+
}
|
|
31
|
+
export declare const SingleProductView: React.FC<SingleProductViewProps>;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useState } from 'react';
|
|
3
|
+
import { PageLayout, PageHeader, PageLayoutContent, PageFooter } from '../PageLayout/PageLayout.js';
|
|
4
|
+
import { Button } from '../Button/Button.js';
|
|
5
|
+
import { Card } from '../Card/Card.js';
|
|
6
|
+
import { Badge } from '../Badge/Badge.js';
|
|
7
|
+
import { Input } from '../Input/Input.js';
|
|
8
|
+
import { Avatar, AvatarImage, AvatarFallback } from '../Avatar/Avatar.js';
|
|
9
|
+
import { ShoppingCart, Star, Heart, Share2, CheckCircle } from 'lucide-react';
|
|
10
|
+
import { Tabs, TabsList, TabsTrigger, TabsContent } from '../Tabs/Tabs.js';
|
|
11
|
+
import '../Toast/Toast.js';
|
|
12
|
+
import { Modal } from '../Modal/Modal.js';
|
|
13
|
+
import { useBreakpoint } from '../../hooks/useBreakpoint.js';
|
|
14
|
+
import { useToggle } from '../../hooks/useToggle.js';
|
|
15
|
+
import { cn } from '../../utils/cn.js';
|
|
16
|
+
|
|
17
|
+
const SingleProductView = ({ product, onAddToCart, onWishlist, onShare, showReviews = true, showColorOptions = true, className, }) => {
|
|
18
|
+
const [selectedImage, setSelectedImage] = useState(product.images[0]);
|
|
19
|
+
const [imageModalOpen, toggleImageModal] = useToggle(false);
|
|
20
|
+
const [selectedColor, setSelectedColor] = useState(product.colors ? product.colors[0] : undefined);
|
|
21
|
+
const { currentBreakpoint, isBelow } = useBreakpoint();
|
|
22
|
+
isBelow('md');
|
|
23
|
+
return (jsxs(PageLayout, { variant: "product", maxWidth: "xl", className: cn(className), children: [jsx(PageHeader, { children: jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: jsxs("div", { className: "flex items-center justify-between h-16", children: [jsxs("div", { className: "flex items-center space-x-2", children: [jsx(ShoppingCart, { className: "h-6 w-6 text-primary-600" }), jsx("span", { className: "font-bold text-xl", children: "Store" })] }), jsxs("div", { className: "flex items-center space-x-4", children: [jsx(Input, { placeholder: "Search products...", className: "w-64" }), jsx(Button, { variant: "outline", children: "Cart" })] })] }) }) }), jsxs(PageLayoutContent, { layout: "centered", spacing: "lg", children: [jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-12", children: [jsxs("div", { children: [jsx("div", { className: "aspect-square bg-gray-100 rounded-lg mb-4 flex items-center justify-center cursor-pointer", onClick: toggleImageModal, children: selectedImage ? (jsx("img", { src: selectedImage, alt: product.name, className: "object-contain h-64 w-64 mx-auto" })) : (jsxs("div", { className: "text-center text-gray-500", children: [jsx(ShoppingCart, { className: "h-16 w-16 mx-auto mb-2" }), jsx("p", { children: "Product Image" })] })) }), jsx("div", { className: "grid grid-cols-4 gap-2", children: product.images.map((img, i) => (jsx("div", { className: cn('aspect-square bg-gray-100 rounded border-2 border-transparent hover:border-primary-500 cursor-pointer', selectedImage === img && 'border-primary-500'), onClick: () => setSelectedImage(img), children: jsx("img", { src: img, alt: `Thumbnail ${i + 1}`, className: "object-cover h-full w-full rounded" }) }, img))) }), jsx(Modal, { open: imageModalOpen, onOpenChange: toggleImageModal, children: jsx("div", { className: "flex items-center justify-center p-4", children: jsx("img", { src: selectedImage, alt: product.name, className: "object-contain h-96 w-96" }) }) })] }), jsxs("div", { children: [jsxs("div", { className: "flex items-center space-x-2 mb-2", children: [jsx(Badge, { variant: product.inStock ? 'success' : 'danger', children: product.inStock ? 'In Stock' : 'Out of Stock' }), jsx(Badge, { variant: "outline", children: "Free Shipping" })] }), jsx("h1", { className: "text-3xl font-bold text-gray-900 mb-4", children: product.name }), jsxs("div", { className: "flex items-center space-x-2 mb-4", children: [jsx("div", { className: "flex items-center", children: [1, 2, 3, 4, 5].map((star) => (jsx(Star, { className: cn('h-5 w-5', product.reviews && product.reviews.length > 0
|
|
24
|
+
? 'text-yellow-400 fill-current'
|
|
25
|
+
: 'text-gray-300') }, star))) }), jsxs("span", { className: "text-gray-600", children: ["(", product.reviews ? product.reviews.length : 0, " reviews)"] })] }), jsxs("div", { className: "mb-6", children: [jsxs("span", { className: "text-3xl font-bold text-gray-900", children: ["$", product.price.toFixed(2)] }), product.oldPrice && (jsxs("span", { className: "text-lg text-gray-500 line-through ml-2", children: ["$", product.oldPrice.toFixed(2)] })), product.discount && (jsx(Badge, { variant: "danger", className: "ml-2", children: product.discount }))] }), jsx("p", { className: "text-gray-600 mb-6 leading-relaxed", children: product.description }), showColorOptions && product.colors && product.colors.length > 0 && (jsx("div", { className: "space-y-4 mb-8", children: jsxs("div", { children: [jsx("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: "Color" }), jsx("div", { className: "flex space-x-2", children: product.colors.map((color) => (jsx("button", { className: cn('px-4 py-2 border border-gray-300 rounded-lg hover:border-primary-500 focus:border-primary-500', selectedColor === color && 'border-primary-500'), onClick: () => setSelectedColor(color), type: "button", children: color }, color))) })] }) })), jsxs("div", { className: "flex space-x-4 mb-6", children: [jsxs(Button, { variant: "primary", size: "lg", className: "flex-1", onClick: () => onAddToCart && onAddToCart(product.id), disabled: !product.inStock, children: [jsx(ShoppingCart, { className: "mr-2 h-5 w-5" }), "Add to Cart"] }), jsx(Button, { variant: "outline", size: "lg", onClick: () => onWishlist && onWishlist(product.id), children: jsx(Heart, { className: "h-5 w-5" }) }), jsx(Button, { variant: "outline", size: "lg", onClick: () => onShare && onShare(product.id), children: jsx(Share2, { className: "h-5 w-5" }) })] }), jsxs("div", { className: "border-t pt-6", children: [jsx("h3", { className: "font-semibold text-gray-900 mb-3", children: "Key Features" }), jsx("ul", { className: "space-y-2 text-gray-600", children: product.features.map((feature, idx) => (jsxs("li", { className: "flex items-center", children: [jsx(CheckCircle, { className: "h-4 w-4 text-green-500 mr-2" }), feature] }, idx))) })] })] })] }), jsx("div", { className: "mt-12", children: (() => {
|
|
26
|
+
const [tabValue, setTabValue] = useState('details');
|
|
27
|
+
return (jsxs(Tabs, { value: tabValue, onValueChange: setTabValue, children: [jsxs(TabsList, { children: [jsx(TabsTrigger, { value: "details", children: "Details" }), showReviews && jsx(TabsTrigger, { value: "reviews", children: "Reviews" })] }), jsx(TabsContent, { value: "details", children: jsxs("div", { children: [jsx("h4", { className: "font-semibold text-gray-900 mb-2", children: "Product Details" }), jsx("p", { className: "text-gray-600", children: product.description })] }) }), showReviews && (jsx(TabsContent, { value: "reviews", children: jsxs("div", { children: [jsx("h4", { className: "font-semibold text-gray-900 mb-4", children: "Customer Reviews" }), product.reviews && product.reviews.length > 0 ? (jsx("div", { className: "space-y-6", children: product.reviews.map((review, idx) => (jsxs(Card, { className: "p-4", children: [jsxs("div", { className: "flex items-center space-x-3 mb-2", children: [jsx(Avatar, { size: "sm", children: review.avatar ? (jsx(AvatarImage, { src: review.avatar })) : (jsx(AvatarFallback, { children: review.user[0] })) }), jsx("span", { className: "font-medium text-gray-900", children: review.user }), jsx("span", { className: "text-xs text-gray-500", children: review.date })] }), jsx("div", { className: "flex items-center mb-2", children: [1, 2, 3, 4, 5].map((star) => (jsx(Star, { className: cn('h-4 w-4', review.rating >= star
|
|
28
|
+
? 'text-yellow-400 fill-current'
|
|
29
|
+
: 'text-gray-300') }, star))) }), jsx("p", { className: "text-gray-700", children: review.comment })] }, idx))) })) : (jsx("p", { className: "text-gray-500", children: "No reviews yet." }))] }) }))] }));
|
|
30
|
+
})() })] }), jsx(PageFooter, { variant: "simple", children: jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center", children: jsx("p", { className: "text-gray-600", children: "\u00A9 2024 Store. All rights reserved." }) }) })] }));
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
export { SingleProductView };
|
|
34
|
+
//# sourceMappingURL=SingleProductView.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SingleProductView.js","sources":["../../../src/components/SingleProductView/SingleProductView.tsx"],"sourcesContent":["import React, { useState } from 'react';\r\nimport {\r\n PageLayout,\r\n PageHeader,\r\n PageLayoutContent,\r\n PageFooter,\r\n} from '../PageLayout';\r\nimport { Badge } from '../Badge';\r\nimport { Button } from '../Button';\r\nimport { Card } from '../Card';\r\nimport { Input } from '../Input';\r\nimport { Avatar, AvatarImage, AvatarFallback } from '../Avatar';\r\nimport { Modal } from '../Modal';\r\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../Tabs';\r\nimport { Star, ShoppingCart, Heart, Share2, CheckCircle } from 'lucide-react';\r\nimport { useBreakpoint } from '../../hooks/useBreakpoint';\r\nimport { useToggle } from '../../hooks/useToggle';\r\nimport { cn } from '../../utils/cn';\r\n\r\nexport interface ProductReview {\r\n user: string;\r\n avatar?: string;\r\n rating: number;\r\n comment: string;\r\n date: string;\r\n}\r\n\r\nexport interface ProductData {\r\n id: string;\r\n name: string;\r\n description: string;\r\n images: string[];\r\n price: number;\r\n oldPrice?: number;\r\n discount?: string;\r\n inStock: boolean;\r\n features: string[];\r\n colors?: string[];\r\n reviews?: ProductReview[];\r\n}\r\n\r\nexport interface SingleProductViewProps {\r\n product: ProductData;\r\n onAddToCart?: (productId: string) => void;\r\n onWishlist?: (productId: string) => void;\r\n onShare?: (productId: string) => void;\r\n showReviews?: boolean;\r\n showColorOptions?: boolean;\r\n className?: string;\r\n}\r\n\r\nexport const SingleProductView: React.FC<SingleProductViewProps> = ({\r\n product,\r\n onAddToCart,\r\n onWishlist,\r\n onShare,\r\n showReviews = true,\r\n showColorOptions = true,\r\n className,\r\n}) => {\r\n const [selectedImage, setSelectedImage] = useState(product.images[0]);\r\n const [imageModalOpen, toggleImageModal] = useToggle(false);\r\n const [selectedColor, setSelectedColor] = useState(\r\n product.colors ? product.colors[0] : undefined\r\n );\r\n const { currentBreakpoint, isBelow } = useBreakpoint();\r\n const isMobile = isBelow('md');\r\n\r\n return (\r\n <PageLayout variant=\"product\" maxWidth=\"xl\" className={cn(className)}>\r\n {/* Header */}\r\n <PageHeader>\r\n <div className=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div className=\"flex items-center justify-between h-16\">\r\n <div className=\"flex items-center space-x-2\">\r\n <ShoppingCart className=\"h-6 w-6 text-primary-600\" />\r\n <span className=\"font-bold text-xl\">Store</span>\r\n </div>\r\n <div className=\"flex items-center space-x-4\">\r\n <Input placeholder=\"Search products...\" className=\"w-64\" />\r\n <Button variant=\"outline\">Cart</Button>\r\n </div>\r\n </div>\r\n </div>\r\n </PageHeader>\r\n\r\n {/* Product Content */}\r\n <PageLayoutContent layout=\"centered\" spacing=\"lg\">\r\n <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-12\">\r\n {/* Product Images */}\r\n <div>\r\n <div\r\n className=\"aspect-square bg-gray-100 rounded-lg mb-4 flex items-center justify-center cursor-pointer\"\r\n onClick={toggleImageModal}\r\n >\r\n {selectedImage ? (\r\n <img\r\n src={selectedImage}\r\n alt={product.name}\r\n className=\"object-contain h-64 w-64 mx-auto\"\r\n />\r\n ) : (\r\n <div className=\"text-center text-gray-500\">\r\n <ShoppingCart className=\"h-16 w-16 mx-auto mb-2\" />\r\n <p>Product Image</p>\r\n </div>\r\n )}\r\n </div>\r\n <div className=\"grid grid-cols-4 gap-2\">\r\n {product.images.map((img, i) => (\r\n <div\r\n key={img}\r\n className={cn(\r\n 'aspect-square bg-gray-100 rounded border-2 border-transparent hover:border-primary-500 cursor-pointer',\r\n selectedImage === img && 'border-primary-500'\r\n )}\r\n onClick={() => setSelectedImage(img)}\r\n >\r\n <img\r\n src={img}\r\n alt={`Thumbnail ${i + 1}`}\r\n className=\"object-cover h-full w-full rounded\"\r\n />\r\n </div>\r\n ))}\r\n </div>\r\n <Modal open={imageModalOpen} onOpenChange={toggleImageModal}>\r\n <div className=\"flex items-center justify-center p-4\">\r\n <img\r\n src={selectedImage}\r\n alt={product.name}\r\n className=\"object-contain h-96 w-96\"\r\n />\r\n </div>\r\n </Modal>\r\n </div>\r\n\r\n {/* Product Details */}\r\n <div>\r\n <div className=\"flex items-center space-x-2 mb-2\">\r\n <Badge variant={product.inStock ? 'success' : 'danger'}>\r\n {product.inStock ? 'In Stock' : 'Out of Stock'}\r\n </Badge>\r\n <Badge variant=\"outline\">Free Shipping</Badge>\r\n </div>\r\n\r\n <h1 className=\"text-3xl font-bold text-gray-900 mb-4\">\r\n {product.name}\r\n </h1>\r\n\r\n <div className=\"flex items-center space-x-2 mb-4\">\r\n <div className=\"flex items-center\">\r\n {[1, 2, 3, 4, 5].map((star) => (\r\n <Star\r\n key={star}\r\n className={cn(\r\n 'h-5 w-5',\r\n product.reviews && product.reviews.length > 0\r\n ? 'text-yellow-400 fill-current'\r\n : 'text-gray-300'\r\n )}\r\n />\r\n ))}\r\n </div>\r\n <span className=\"text-gray-600\">\r\n ({product.reviews ? product.reviews.length : 0} reviews)\r\n </span>\r\n </div>\r\n\r\n <div className=\"mb-6\">\r\n <span className=\"text-3xl font-bold text-gray-900\">\r\n ${product.price.toFixed(2)}\r\n </span>\r\n {product.oldPrice && (\r\n <span className=\"text-lg text-gray-500 line-through ml-2\">\r\n ${product.oldPrice.toFixed(2)}\r\n </span>\r\n )}\r\n {product.discount && (\r\n <Badge variant=\"danger\" className=\"ml-2\">\r\n {product.discount}\r\n </Badge>\r\n )}\r\n </div>\r\n\r\n <p className=\"text-gray-600 mb-6 leading-relaxed\">\r\n {product.description}\r\n </p>\r\n\r\n {showColorOptions && product.colors && product.colors.length > 0 && (\r\n <div className=\"space-y-4 mb-8\">\r\n <div>\r\n <label className=\"block text-sm font-medium text-gray-700 mb-2\">\r\n Color\r\n </label>\r\n <div className=\"flex space-x-2\">\r\n {product.colors.map((color) => (\r\n <button\r\n key={color}\r\n className={cn(\r\n 'px-4 py-2 border border-gray-300 rounded-lg hover:border-primary-500 focus:border-primary-500',\r\n selectedColor === color && 'border-primary-500'\r\n )}\r\n onClick={() => setSelectedColor(color)}\r\n type=\"button\"\r\n >\r\n {color}\r\n </button>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n\r\n <div className=\"flex space-x-4 mb-6\">\r\n <Button\r\n variant=\"primary\"\r\n size=\"lg\"\r\n className=\"flex-1\"\r\n onClick={() => onAddToCart && onAddToCart(product.id)}\r\n disabled={!product.inStock}\r\n >\r\n <ShoppingCart className=\"mr-2 h-5 w-5\" />\r\n Add to Cart\r\n </Button>\r\n <Button\r\n variant=\"outline\"\r\n size=\"lg\"\r\n onClick={() => onWishlist && onWishlist(product.id)}\r\n >\r\n <Heart className=\"h-5 w-5\" />\r\n </Button>\r\n <Button\r\n variant=\"outline\"\r\n size=\"lg\"\r\n onClick={() => onShare && onShare(product.id)}\r\n >\r\n <Share2 className=\"h-5 w-5\" />\r\n </Button>\r\n </div>\r\n\r\n <div className=\"border-t pt-6\">\r\n <h3 className=\"font-semibold text-gray-900 mb-3\">Key Features</h3>\r\n <ul className=\"space-y-2 text-gray-600\">\r\n {product.features.map((feature, idx) => (\r\n <li key={idx} className=\"flex items-center\">\r\n <CheckCircle className=\"h-4 w-4 text-green-500 mr-2\" />\r\n {feature}\r\n </li>\r\n ))}\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n {/* Tabs for Details/Reviews */}\r\n <div className=\"mt-12\">\r\n {(() => {\r\n const [tabValue, setTabValue] = useState('details');\r\n return (\r\n <Tabs value={tabValue} onValueChange={setTabValue}>\r\n <TabsList>\r\n <TabsTrigger value=\"details\">Details</TabsTrigger>\r\n {showReviews && <TabsTrigger value=\"reviews\">Reviews</TabsTrigger>}\r\n </TabsList>\r\n <TabsContent value=\"details\">\r\n <div>\r\n <h4 className=\"font-semibold text-gray-900 mb-2\">\r\n Product Details\r\n </h4>\r\n <p className=\"text-gray-600\">{product.description}</p>\r\n </div>\r\n </TabsContent>\r\n {showReviews && (\r\n <TabsContent value=\"reviews\">\r\n <div>\r\n <h4 className=\"font-semibold text-gray-900 mb-4\">\r\n Customer Reviews\r\n </h4>\r\n {product.reviews && product.reviews.length > 0 ? (\r\n <div className=\"space-y-6\">\r\n {product.reviews.map((review, idx) => (\r\n <Card key={idx} className=\"p-4\">\r\n <div className=\"flex items-center space-x-3 mb-2\">\r\n <Avatar size=\"sm\">\r\n {review.avatar ? (\r\n <AvatarImage src={review.avatar} />\r\n ) : (\r\n <AvatarFallback>\r\n {review.user[0]}\r\n </AvatarFallback>\r\n )}\r\n </Avatar>\r\n <span className=\"font-medium text-gray-900\">\r\n {review.user}\r\n </span>\r\n <span className=\"text-xs text-gray-500\">\r\n {review.date}\r\n </span>\r\n </div>\r\n <div className=\"flex items-center mb-2\">\r\n {[1, 2, 3, 4, 5].map((star) => (\r\n <Star\r\n key={star}\r\n className={cn(\r\n 'h-4 w-4',\r\n review.rating >= star\r\n ? 'text-yellow-400 fill-current'\r\n : 'text-gray-300'\r\n )}\r\n />\r\n ))}\r\n </div>\r\n <p className=\"text-gray-700\">{review.comment}</p>\r\n </Card>\r\n ))}\r\n </div>\r\n ) : (\r\n <p className=\"text-gray-500\">No reviews yet.</p>\r\n )}\r\n </div>\r\n </TabsContent>\r\n )}\r\n </Tabs>\r\n );\r\n })()}\r\n </div>\r\n </PageLayoutContent>\r\n\r\n {/* Footer */}\r\n <PageFooter variant=\"simple\">\r\n <div className=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center\">\r\n <p className=\"text-gray-600\">© 2024 Store. All rights reserved.</p>\r\n </div>\r\n </PageFooter>\r\n </PageLayout>\r\n );\r\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './SingleProductView';
|
package/dist/index.d.ts
CHANGED
|
@@ -22,12 +22,20 @@ export * from './components/DataTable';
|
|
|
22
22
|
export * from './components/ComponentShowcase';
|
|
23
23
|
export * from './components/Auth';
|
|
24
24
|
export * from './components/PageLayout';
|
|
25
|
-
export * from './components/ProfileManagement
|
|
26
|
-
export * from './components/
|
|
27
|
-
export * from './components/
|
|
28
|
-
export * from './components/
|
|
29
|
-
export * from './components/
|
|
30
|
-
export * from './components/
|
|
25
|
+
export * from './components/ProfileManagement';
|
|
26
|
+
export * from './components/Checkbox';
|
|
27
|
+
export * from './components/Select';
|
|
28
|
+
export * from './components/Radio';
|
|
29
|
+
export * from './components/NightModeSwitch';
|
|
30
|
+
export * from './components/BlogLayout';
|
|
31
|
+
export * from './components/BlogSidebar';
|
|
32
|
+
export * from './components/BlogFeedView';
|
|
33
|
+
export * from './components/MarketplaceLayout';
|
|
34
|
+
export * from './components/SingleBlogView';
|
|
35
|
+
export * from './components/CommerceSidebar';
|
|
36
|
+
export * from './components/Checkout';
|
|
37
|
+
export * from './components/AllProductsView';
|
|
38
|
+
export * from './components/SingleProductView';
|
|
31
39
|
export * from './hooks/useDarkMode';
|
|
32
40
|
export * from './hooks/useDebounce';
|
|
33
41
|
export * from './hooks/useLocalStorage';
|
package/dist/index.js
CHANGED
|
@@ -33,6 +33,17 @@ export { EditModal } from './components/ProfileManagement/EditModal.js';
|
|
|
33
33
|
export { Select } from './components/Select/Select.js';
|
|
34
34
|
export { RadioGroup } from './components/Radio/Radio.js';
|
|
35
35
|
export { NightModeSwitch } from './components/NightModeSwitch/NightModeSwitch.js';
|
|
36
|
+
export { BlogLayout } from './components/BlogLayout/BlogLayout.js';
|
|
37
|
+
export { BlogSidebar } from './components/BlogSidebar/BlogSidebar.js';
|
|
38
|
+
export { BlogFeedView } from './components/BlogFeedView/BlogFeedView.js';
|
|
39
|
+
export { MarketplaceLayout } from './components/MarketplaceLayout/MarketplaceLayout.js';
|
|
40
|
+
export { SingleBlogView } from './components/SingleBlogView/SingleBlogView.js';
|
|
41
|
+
export { CommerceSidebar } from './components/CommerceSidebar/CommerceSidebar.js';
|
|
42
|
+
export { CheckoutSidebar } from './components/Checkout/CheckoutSidebar.js';
|
|
43
|
+
export { CheckoutPage } from './components/Checkout/CheckoutPage.js';
|
|
44
|
+
export { AllProductsView } from './components/AllProductsView/AllProductsView.js';
|
|
45
|
+
export { ProductCard } from './components/AllProductsView/ProductCard.js';
|
|
46
|
+
export { SingleProductView } from './components/SingleProductView/SingleProductView.js';
|
|
36
47
|
export { useDarkMode } from './hooks/useDarkMode.js';
|
|
37
48
|
export { useDebounce } from './hooks/useDebounce.js';
|
|
38
49
|
export { useLocalStorage } from './hooks/useLocalStorage.js';
|