@fire-spark/rn-ui 0.0.1
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/button.d.ts +16 -0
- package/dist/button.js +47 -0
- package/dist/cart.d.ts +62 -0
- package/dist/cart.js +100 -0
- package/dist/category-nav.d.ts +23 -0
- package/dist/category-nav.js +59 -0
- package/dist/category.d.ts +30 -0
- package/dist/category.js +78 -0
- package/dist/checkout.d.ts +67 -0
- package/dist/checkout.js +86 -0
- package/dist/cn-C_hacsED.js +6 -0
- package/dist/index.d.ts +8 -0
- package/dist/index.js +8 -0
- package/dist/menu.d.ts +21 -0
- package/dist/menu.js +42 -0
- package/dist/product-card.d.ts +31 -0
- package/dist/product-card.js +105 -0
- package/dist/product-detail.d.ts +88 -0
- package/dist/product-detail.js +185 -0
- package/dist/ui-image-A3QxzafV.js +17 -0
- package/dist/ui-image-bUZSq9v9.d.ts +11 -0
- package/dist/use-active-category.d.ts +29 -0
- package/dist/use-active-category.js +81 -0
- package/package.json +138 -0
package/dist/button.d.ts
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { Pressable } from "react-native";
|
|
2
|
+
import { ComponentProps, ReactNode } from "react";
|
|
3
|
+
//#region src/button.d.ts
|
|
4
|
+
type PressableProps = ComponentProps<typeof Pressable> & {
|
|
5
|
+
className?: string;
|
|
6
|
+
};
|
|
7
|
+
type ButtonVariant = "default" | "outline" | "danger" | "ghost" | "secondary" | "filled";
|
|
8
|
+
type ButtonSize = "default" | "sm" | "md" | "lg" | "icon";
|
|
9
|
+
type ButtonProps = PressableProps & {
|
|
10
|
+
variant?: ButtonVariant;
|
|
11
|
+
size?: ButtonSize;
|
|
12
|
+
children?: ReactNode;
|
|
13
|
+
};
|
|
14
|
+
declare function Button(props: ButtonProps): import("react").JSX.Element;
|
|
15
|
+
//#endregion
|
|
16
|
+
export { Button, ButtonProps, ButtonSize, ButtonVariant };
|
package/dist/button.js
ADDED
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { t as cn } from "./cn-C_hacsED.js";
|
|
2
|
+
import { Pressable, Text } from "react-native";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
//#region src/button.tsx
|
|
5
|
+
const variantClass = {
|
|
6
|
+
default: "bg-primary",
|
|
7
|
+
outline: "border border-input bg-background",
|
|
8
|
+
danger: "border border-destructive/40 bg-transparent",
|
|
9
|
+
ghost: "bg-transparent",
|
|
10
|
+
secondary: "border border-input bg-secondary",
|
|
11
|
+
filled: "bg-primary"
|
|
12
|
+
};
|
|
13
|
+
const variantTextClass = {
|
|
14
|
+
default: "text-primary-foreground",
|
|
15
|
+
outline: "text-foreground",
|
|
16
|
+
danger: "text-destructive",
|
|
17
|
+
ghost: "text-foreground",
|
|
18
|
+
secondary: "text-secondary-foreground",
|
|
19
|
+
filled: "text-background"
|
|
20
|
+
};
|
|
21
|
+
const sizeClass = {
|
|
22
|
+
default: "h-10 px-4",
|
|
23
|
+
sm: "h-8 px-3",
|
|
24
|
+
md: "h-9 px-4",
|
|
25
|
+
lg: "h-11 px-8",
|
|
26
|
+
icon: "size-10 items-center justify-center p-0"
|
|
27
|
+
};
|
|
28
|
+
function Button(props) {
|
|
29
|
+
const { className, disabled, children, ...rest } = props;
|
|
30
|
+
const variant = props.variant ?? "default";
|
|
31
|
+
const size = props.size ?? "default";
|
|
32
|
+
const base = "flex-row items-center justify-center rounded-md active:opacity-80";
|
|
33
|
+
const disabledClass = disabled ? "opacity-50" : "";
|
|
34
|
+
const rootClass = cn(base, variantClass[variant], sizeClass[size], disabledClass, className);
|
|
35
|
+
const labelClass = cn("text-sm font-medium", variantTextClass[variant]);
|
|
36
|
+
return /* @__PURE__ */ jsx(Pressable, {
|
|
37
|
+
className: rootClass,
|
|
38
|
+
disabled,
|
|
39
|
+
...rest,
|
|
40
|
+
children: typeof children === "string" || typeof children === "number" ? /* @__PURE__ */ jsx(Text, {
|
|
41
|
+
className: labelClass,
|
|
42
|
+
children
|
|
43
|
+
}) : children
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
//#endregion
|
|
47
|
+
export { Button };
|
package/dist/cart.d.ts
ADDED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { t as UiImageProps } from "./ui-image-bUZSq9v9.js";
|
|
2
|
+
import { Pressable, Text, View } from "react-native";
|
|
3
|
+
import { ComponentProps } from "react";
|
|
4
|
+
//#region src/cart.d.ts
|
|
5
|
+
type ViewProps = ComponentProps<typeof View> & {
|
|
6
|
+
className?: string;
|
|
7
|
+
};
|
|
8
|
+
type TextProps = ComponentProps<typeof Text> & {
|
|
9
|
+
className?: string;
|
|
10
|
+
};
|
|
11
|
+
type PressableProps = ComponentProps<typeof Pressable> & {
|
|
12
|
+
className?: string;
|
|
13
|
+
};
|
|
14
|
+
declare const Cart: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
15
|
+
declare const CartHeader: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
16
|
+
declare const CartTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
17
|
+
declare const CartDescription: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
18
|
+
declare const CartStore: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
19
|
+
declare const CartStoreMedia: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
20
|
+
declare const CartStoreImage: (props: UiImageProps) => import("react").JSX.Element;
|
|
21
|
+
declare const CartStoreContent: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
22
|
+
declare const CartStoreTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
23
|
+
declare const CartStoreDescription: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
24
|
+
declare const CartBody: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
25
|
+
declare const CartList: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
26
|
+
declare const CartItem: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
27
|
+
declare const CartItemMedia: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
28
|
+
declare const CartItemImageSlot: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
29
|
+
declare const CartItemImage: (props: UiImageProps) => import("react").JSX.Element;
|
|
30
|
+
declare const CartItemContent: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
31
|
+
declare const CartItemHeader: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
32
|
+
declare const CartItemTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
33
|
+
declare const CartItemDescription: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
34
|
+
declare const CartItemMeta: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
35
|
+
declare const CartItemPrice: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
36
|
+
declare const CartItemAnchorPrice: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
37
|
+
declare const CartItemActions: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
38
|
+
declare const CartItemAction: (props: PressableProps) => import("react").JSX.Element;
|
|
39
|
+
declare const CartItemAside: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
40
|
+
declare const CartQuantity: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
41
|
+
declare const CartQuantityButton: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
42
|
+
declare const CartQuantityValue: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
43
|
+
declare const CartSection: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
44
|
+
declare const CartSectionHeader: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
45
|
+
declare const CartSectionTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
46
|
+
declare const CartOption: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
47
|
+
declare const CartOptionLabel: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
48
|
+
declare const CartOptionControl: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
49
|
+
declare const CartBanner: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
50
|
+
declare const CartScroller: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
51
|
+
declare const CartSummary: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
52
|
+
declare const CartSummaryRow: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
53
|
+
declare const CartSummaryLabel: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
54
|
+
declare const CartSummaryValue: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
55
|
+
declare const CartFooter: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
56
|
+
declare const CartSubmit: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
57
|
+
declare const CartAction: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
58
|
+
declare const CartEmpty: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
59
|
+
declare const CartEmptyTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
60
|
+
declare const CartEmptyDescription: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
61
|
+
//#endregion
|
|
62
|
+
export { Cart, CartAction, CartBanner, CartBody, CartDescription, CartEmpty, CartEmptyDescription, CartEmptyTitle, CartFooter, CartHeader, CartItem, CartItemAction, CartItemActions, CartItemAnchorPrice, CartItemAside, CartItemContent, CartItemDescription, CartItemHeader, CartItemImage, CartItemImageSlot, CartItemMedia, CartItemMeta, CartItemPrice, CartItemTitle, CartList, CartOption, CartOptionControl, CartOptionLabel, CartQuantity, CartQuantityButton, CartQuantityValue, CartScroller, CartSection, CartSectionHeader, CartSectionTitle, CartStore, CartStoreContent, CartStoreDescription, CartStoreImage, CartStoreMedia, CartStoreTitle, CartSubmit, CartSummary, CartSummaryLabel, CartSummaryRow, CartSummaryValue, CartTitle };
|
package/dist/cart.js
ADDED
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
import { t as cn } from "./cn-C_hacsED.js";
|
|
2
|
+
import { t as UiImage } from "./ui-image-A3QxzafV.js";
|
|
3
|
+
import { Pressable, ScrollView, Text, View } from "react-native";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
//#region src/cart.tsx
|
|
6
|
+
const view = (base) => {
|
|
7
|
+
return ({ className, ...rest }) => /* @__PURE__ */ jsx(View, {
|
|
8
|
+
className: cn(base, className),
|
|
9
|
+
...rest
|
|
10
|
+
});
|
|
11
|
+
};
|
|
12
|
+
const text = (base) => {
|
|
13
|
+
return ({ className, ...rest }) => /* @__PURE__ */ jsx(Text, {
|
|
14
|
+
className: cn(base, className),
|
|
15
|
+
...rest
|
|
16
|
+
});
|
|
17
|
+
};
|
|
18
|
+
const button = (base, labelTone = "text-foreground") => {
|
|
19
|
+
return ({ children, className, ...rest }) => {
|
|
20
|
+
const labelClass = `${labelTone} text-sm font-medium`;
|
|
21
|
+
let content = children;
|
|
22
|
+
if (typeof children === "string" || typeof children === "number") content = /* @__PURE__ */ jsx(Text, {
|
|
23
|
+
className: labelClass,
|
|
24
|
+
children
|
|
25
|
+
});
|
|
26
|
+
return /* @__PURE__ */ jsx(Pressable, {
|
|
27
|
+
className: cn(base, className),
|
|
28
|
+
...rest,
|
|
29
|
+
children: content
|
|
30
|
+
});
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
const Cart = view("bg-background text-foreground min-h-0 flex-1 flex-col");
|
|
34
|
+
const CartHeader = view("shrink-0 flex-col gap-3 px-4 pb-2 pt-4");
|
|
35
|
+
const CartTitle = text("text-foreground text-lg font-bold tracking-tight");
|
|
36
|
+
const CartDescription = text("text-muted-foreground text-sm");
|
|
37
|
+
const CartStore = view("flex-row items-center gap-3");
|
|
38
|
+
const CartStoreMedia = view(`bg-muted relative size-12 shrink-0 overflow-hidden rounded-full`);
|
|
39
|
+
const CartStoreImage = (props) => /* @__PURE__ */ jsx(UiImage, { ...props });
|
|
40
|
+
const CartStoreContent = view("min-w-0 flex-1");
|
|
41
|
+
const CartStoreTitle = text("text-foreground text-base font-semibold");
|
|
42
|
+
const CartStoreDescription = text("text-muted-foreground text-sm");
|
|
43
|
+
const CartBody = view("min-h-0 flex-1");
|
|
44
|
+
const CartList = view("flex-col gap-4 px-4 py-2");
|
|
45
|
+
const CartItem = view("flex-row items-center gap-3");
|
|
46
|
+
const CartItemMedia = view(`bg-muted relative size-20 shrink-0 overflow-hidden rounded-xl`);
|
|
47
|
+
const CartItemImageSlot = view("absolute inset-0");
|
|
48
|
+
const CartItemImage = (props) => /* @__PURE__ */ jsx(CartItemImageSlot, { children: /* @__PURE__ */ jsx(UiImage, { ...props }) });
|
|
49
|
+
const CartItemContent = view("min-w-0 flex-1 flex-col gap-1");
|
|
50
|
+
const CartItemHeader = view("flex-row items-start justify-between gap-2");
|
|
51
|
+
const CartItemTitle = text(`text-foreground min-w-0 text-base font-semibold leading-snug`);
|
|
52
|
+
const CartItemDescription = text("text-muted-foreground text-xs leading-snug");
|
|
53
|
+
const CartItemMeta = view("flex-row flex-wrap items-center gap-2");
|
|
54
|
+
const CartItemPrice = text("text-foreground text-base font-semibold tabular-nums");
|
|
55
|
+
const CartItemAnchorPrice = text("text-muted-foreground text-sm tabular-nums line-through");
|
|
56
|
+
const CartItemActions = view("flex-row flex-wrap items-center gap-3 pt-0.5");
|
|
57
|
+
const actionLabel = "text-muted-foreground text-xs font-medium leading-none";
|
|
58
|
+
const CartItemAction = (props) => {
|
|
59
|
+
const { children, className, ...rest } = props;
|
|
60
|
+
let content = children;
|
|
61
|
+
if (typeof children === "string" || typeof children === "number") content = /* @__PURE__ */ jsx(Text, {
|
|
62
|
+
className: actionLabel,
|
|
63
|
+
children
|
|
64
|
+
});
|
|
65
|
+
return /* @__PURE__ */ jsx(Pressable, {
|
|
66
|
+
className: cn("py-0.5", className),
|
|
67
|
+
...rest,
|
|
68
|
+
children: content
|
|
69
|
+
});
|
|
70
|
+
};
|
|
71
|
+
const CartItemAside = view("shrink-0 flex-col items-center");
|
|
72
|
+
const CartQuantity = view(`bg-muted flex-row items-center gap-0.5 rounded-full px-1 py-0.5`);
|
|
73
|
+
const CartQuantityButton = button("size-7 items-center justify-center rounded-full");
|
|
74
|
+
const CartQuantityValue = text(`text-foreground min-w-5 text-center text-sm font-semibold tabular-nums`);
|
|
75
|
+
const CartSection = view("flex-col gap-3 px-4 py-4");
|
|
76
|
+
const CartSectionHeader = view("flex-row items-center justify-between gap-2");
|
|
77
|
+
const CartSectionTitle = text("text-foreground text-sm font-semibold tracking-tight");
|
|
78
|
+
const CartOption = view(`border-border flex-row items-center justify-between gap-3 border-y py-3`);
|
|
79
|
+
const CartOptionLabel = view("min-w-0 flex-row items-center gap-2");
|
|
80
|
+
const CartOptionControl = view("shrink-0 items-center");
|
|
81
|
+
const CartBanner = view("flex-row items-center gap-2 rounded-lg px-3 py-2.5");
|
|
82
|
+
const CartScroller = ({ className, ...props }) => /* @__PURE__ */ jsx(ScrollView, {
|
|
83
|
+
horizontal: true,
|
|
84
|
+
showsHorizontalScrollIndicator: false,
|
|
85
|
+
className: cn("flex-row", className),
|
|
86
|
+
contentContainerClassName: "gap-3 px-4",
|
|
87
|
+
...props
|
|
88
|
+
});
|
|
89
|
+
const CartSummary = view("flex-col gap-2 px-4 py-3");
|
|
90
|
+
const CartSummaryRow = view("flex-row items-center justify-between gap-3");
|
|
91
|
+
const CartSummaryLabel = text("text-foreground text-sm");
|
|
92
|
+
const CartSummaryValue = text("text-foreground text-sm tabular-nums");
|
|
93
|
+
const CartFooter = view("bg-background border-border shrink-0 border-t px-4 pt-4");
|
|
94
|
+
const CartSubmit = button(`bg-foreground flex-row items-center justify-between gap-2 rounded-full px-4 py-3`, "text-background");
|
|
95
|
+
const CartAction = button(`bg-muted self-start items-center justify-center rounded-full px-4 py-2`);
|
|
96
|
+
const CartEmpty = view(`flex-1 flex-col items-center justify-center gap-2 px-6 py-12`);
|
|
97
|
+
const CartEmptyTitle = text("text-foreground text-base font-semibold tracking-tight");
|
|
98
|
+
const CartEmptyDescription = text("text-muted-foreground max-w-xs text-sm");
|
|
99
|
+
//#endregion
|
|
100
|
+
export { Cart, CartAction, CartBanner, CartBody, CartDescription, CartEmpty, CartEmptyDescription, CartEmptyTitle, CartFooter, CartHeader, CartItem, CartItemAction, CartItemActions, CartItemAnchorPrice, CartItemAside, CartItemContent, CartItemDescription, CartItemHeader, CartItemImage, CartItemImageSlot, CartItemMedia, CartItemMeta, CartItemPrice, CartItemTitle, CartList, CartOption, CartOptionControl, CartOptionLabel, CartQuantity, CartQuantityButton, CartQuantityValue, CartScroller, CartSection, CartSectionHeader, CartSectionTitle, CartStore, CartStoreContent, CartStoreDescription, CartStoreImage, CartStoreMedia, CartStoreTitle, CartSubmit, CartSummary, CartSummaryLabel, CartSummaryRow, CartSummaryValue, CartTitle };
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Pressable, View } from "react-native";
|
|
2
|
+
import { ComponentProps, ReactNode } from "react";
|
|
3
|
+
//#region src/category-nav.d.ts
|
|
4
|
+
type CategoryNavOrientation = "vertical" | "horizontal";
|
|
5
|
+
type NavProps = ComponentProps<typeof View> & {
|
|
6
|
+
className?: string;
|
|
7
|
+
orientation?: CategoryNavOrientation;
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
};
|
|
10
|
+
type ViewProps = ComponentProps<typeof View> & {
|
|
11
|
+
className?: string;
|
|
12
|
+
};
|
|
13
|
+
type LinkProps = ComponentProps<typeof Pressable> & {
|
|
14
|
+
active?: boolean;
|
|
15
|
+
className?: string;
|
|
16
|
+
};
|
|
17
|
+
declare const CategoryNav: (props: NavProps) => import("react").JSX.Element;
|
|
18
|
+
declare const CategoryNavList: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
19
|
+
declare const CategoryNavItem: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
20
|
+
declare const CategoryNavLink: (props: LinkProps) => import("react").JSX.Element;
|
|
21
|
+
declare const CategoryNavExtra: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
22
|
+
//#endregion
|
|
23
|
+
export { CategoryNav, CategoryNavExtra, CategoryNavItem, CategoryNavLink, CategoryNavList, CategoryNavOrientation };
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { t as cn } from "./cn-C_hacsED.js";
|
|
2
|
+
import { Pressable, ScrollView, View } from "react-native";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
import { createContext, use } from "react";
|
|
5
|
+
//#region src/category-nav.tsx
|
|
6
|
+
const OrientationContext = createContext("vertical");
|
|
7
|
+
const layoutV = "flex-col";
|
|
8
|
+
const layoutH = "flex-row items-stretch gap-1 border-b border-border";
|
|
9
|
+
const linkV = `w-full flex-row items-center gap-2 border-l-2 border-transparent px-3 py-2`;
|
|
10
|
+
const linkH = `-mb-px flex-row items-center gap-2 border-b-2 border-transparent px-3 py-2`;
|
|
11
|
+
const toneIdle = "text-muted-foreground";
|
|
12
|
+
const toneActiveH = "border-foreground text-foreground";
|
|
13
|
+
const toneActiveV = "border-foreground bg-muted text-foreground";
|
|
14
|
+
const CategoryNav = (props) => {
|
|
15
|
+
const { className, orientation = "vertical", children, ...rest } = props;
|
|
16
|
+
let layout = layoutV;
|
|
17
|
+
if (orientation === "horizontal") layout = layoutH;
|
|
18
|
+
return /* @__PURE__ */ jsx(OrientationContext, {
|
|
19
|
+
value: orientation,
|
|
20
|
+
children: /* @__PURE__ */ jsx(View, {
|
|
21
|
+
className: cn(layout, className),
|
|
22
|
+
...rest,
|
|
23
|
+
children
|
|
24
|
+
})
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
const CategoryNavList = ({ className, ...props }) => {
|
|
28
|
+
return /* @__PURE__ */ jsx(ScrollView, {
|
|
29
|
+
horizontal: true,
|
|
30
|
+
showsHorizontalScrollIndicator: false,
|
|
31
|
+
className: cn("-mb-px min-w-0 flex-1", className),
|
|
32
|
+
contentContainerClassName: "flex-row items-stretch",
|
|
33
|
+
...props
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
const CategoryNavItem = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
37
|
+
className: cn("shrink-0", className),
|
|
38
|
+
...props
|
|
39
|
+
});
|
|
40
|
+
const CategoryNavLink = (props) => {
|
|
41
|
+
const { active = false, className, ...rest } = props;
|
|
42
|
+
const isHorizontal = use(OrientationContext) === "horizontal";
|
|
43
|
+
let linkBase = linkV;
|
|
44
|
+
if (isHorizontal) linkBase = linkH;
|
|
45
|
+
let tone = toneIdle;
|
|
46
|
+
if (active && isHorizontal) tone = toneActiveH;
|
|
47
|
+
if (active && !isHorizontal) tone = toneActiveV;
|
|
48
|
+
return /* @__PURE__ */ jsx(Pressable, {
|
|
49
|
+
accessibilityState: { selected: active },
|
|
50
|
+
className: cn(linkBase, tone, className),
|
|
51
|
+
...rest
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
const CategoryNavExtra = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
55
|
+
className: cn("shrink-0 items-center", className),
|
|
56
|
+
...props
|
|
57
|
+
});
|
|
58
|
+
//#endregion
|
|
59
|
+
export { CategoryNav, CategoryNavExtra, CategoryNavItem, CategoryNavLink, CategoryNavList };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { Text, View } from "react-native";
|
|
2
|
+
import { ComponentProps } from "react";
|
|
3
|
+
//#region src/category.d.ts
|
|
4
|
+
type ViewProps = ComponentProps<typeof View> & {
|
|
5
|
+
className?: string;
|
|
6
|
+
};
|
|
7
|
+
type TextProps = ComponentProps<typeof Text> & {
|
|
8
|
+
className?: string;
|
|
9
|
+
};
|
|
10
|
+
type EmptyMediaProps = ViewProps & {
|
|
11
|
+
variant?: "icon" | "default";
|
|
12
|
+
};
|
|
13
|
+
declare const Category: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
14
|
+
declare const CategoryHeader: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
15
|
+
declare const CategoryTitle: ({ className, ...props }: TextProps) => import("react").JSX.Element;
|
|
16
|
+
declare const CategoryDescription: ({ className, ...props }: TextProps) => import("react").JSX.Element;
|
|
17
|
+
declare const CategoryContent: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
18
|
+
/** Phone-first column; matches web auto-fill at ~mobile width (one card/row). */
|
|
19
|
+
declare const CategoryGrid: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
20
|
+
declare const CategoryGridItem: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
21
|
+
declare const CategoryList: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
22
|
+
declare const CategoryListItem: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
23
|
+
declare const CategoryEmpty: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
24
|
+
declare const CategoryEmptyHeader: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
25
|
+
declare const CategoryEmptyMedia: (props: EmptyMediaProps) => import("react").JSX.Element;
|
|
26
|
+
declare const CategoryEmptyTitle: ({ className, ...props }: TextProps) => import("react").JSX.Element;
|
|
27
|
+
declare const CategoryEmptyDescription: (props: TextProps) => import("react").JSX.Element;
|
|
28
|
+
declare const CategoryEmptyContent: ({ className, ...props }: ViewProps) => import("react").JSX.Element;
|
|
29
|
+
//#endregion
|
|
30
|
+
export { Category, CategoryContent, CategoryDescription, CategoryEmpty, CategoryEmptyContent, CategoryEmptyDescription, CategoryEmptyHeader, CategoryEmptyMedia, CategoryEmptyTitle, CategoryGrid, CategoryGridItem, CategoryHeader, CategoryList, CategoryListItem, CategoryTitle };
|
package/dist/category.js
ADDED
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { t as cn } from "./cn-C_hacsED.js";
|
|
2
|
+
import { Text, View } from "react-native";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
//#region src/category.tsx
|
|
5
|
+
const titleBase = "text-foreground text-xl font-semibold tracking-tight";
|
|
6
|
+
const emptyBase = `border-border bg-muted/30 flex-col items-center justify-center gap-3 rounded-xl border border-dashed px-6 py-10`;
|
|
7
|
+
const emptyTitleBase = "text-foreground text-sm font-semibold tracking-tight";
|
|
8
|
+
const emptyDescBase = "text-muted-foreground text-sm leading-relaxed";
|
|
9
|
+
const emptyContentBase = "flex-row flex-wrap items-center justify-center gap-2";
|
|
10
|
+
const Category = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
11
|
+
className: cn("Category flex-col gap-4", className),
|
|
12
|
+
...props
|
|
13
|
+
});
|
|
14
|
+
const CategoryHeader = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
15
|
+
className: cn("flex-col gap-1", className),
|
|
16
|
+
...props
|
|
17
|
+
});
|
|
18
|
+
const CategoryTitle = ({ className, ...props }) => /* @__PURE__ */ jsx(Text, {
|
|
19
|
+
className: cn(titleBase, className),
|
|
20
|
+
...props
|
|
21
|
+
});
|
|
22
|
+
const CategoryDescription = ({ className, ...props }) => /* @__PURE__ */ jsx(Text, {
|
|
23
|
+
className: cn("text-muted-foreground text-sm", className),
|
|
24
|
+
...props
|
|
25
|
+
});
|
|
26
|
+
const CategoryContent = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
27
|
+
className: cn("flex-col gap-4", className),
|
|
28
|
+
...props
|
|
29
|
+
});
|
|
30
|
+
/** Phone-first column; matches web auto-fill at ~mobile width (one card/row). */
|
|
31
|
+
const CategoryGrid = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
32
|
+
className: cn("w-full flex-col gap-3", className),
|
|
33
|
+
...props
|
|
34
|
+
});
|
|
35
|
+
const CategoryGridItem = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
36
|
+
className: cn("w-full min-w-0", className),
|
|
37
|
+
...props
|
|
38
|
+
});
|
|
39
|
+
const CategoryList = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
40
|
+
className: cn("flex-col gap-3", className),
|
|
41
|
+
...props
|
|
42
|
+
});
|
|
43
|
+
const CategoryListItem = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
44
|
+
className: cn("list-none", className),
|
|
45
|
+
...props
|
|
46
|
+
});
|
|
47
|
+
const CategoryEmpty = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
48
|
+
className: cn(emptyBase, className),
|
|
49
|
+
...props
|
|
50
|
+
});
|
|
51
|
+
const CategoryEmptyHeader = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
52
|
+
className: cn("max-w-sm flex-col items-center gap-2", className),
|
|
53
|
+
...props
|
|
54
|
+
});
|
|
55
|
+
const CategoryEmptyMedia = (props) => {
|
|
56
|
+
const { className, variant = "icon", ...rest } = props;
|
|
57
|
+
return /* @__PURE__ */ jsx(View, {
|
|
58
|
+
className: cn("mb-1 shrink-0 items-center justify-center", variant === "icon" ? "bg-muted size-10 rounded-full" : "text-muted-foreground", className),
|
|
59
|
+
...rest
|
|
60
|
+
});
|
|
61
|
+
};
|
|
62
|
+
const CategoryEmptyTitle = ({ className, ...props }) => /* @__PURE__ */ jsx(Text, {
|
|
63
|
+
className: cn(emptyTitleBase, className),
|
|
64
|
+
...props
|
|
65
|
+
});
|
|
66
|
+
const CategoryEmptyDescription = (props) => {
|
|
67
|
+
const { className, ...rest } = props;
|
|
68
|
+
return /* @__PURE__ */ jsx(Text, {
|
|
69
|
+
className: cn(emptyDescBase, className),
|
|
70
|
+
...rest
|
|
71
|
+
});
|
|
72
|
+
};
|
|
73
|
+
const CategoryEmptyContent = ({ className, ...props }) => /* @__PURE__ */ jsx(View, {
|
|
74
|
+
className: cn(emptyContentBase, className),
|
|
75
|
+
...props
|
|
76
|
+
});
|
|
77
|
+
//#endregion
|
|
78
|
+
export { Category, CategoryContent, CategoryDescription, CategoryEmpty, CategoryEmptyContent, CategoryEmptyDescription, CategoryEmptyHeader, CategoryEmptyMedia, CategoryEmptyTitle, CategoryGrid, CategoryGridItem, CategoryHeader, CategoryList, CategoryListItem, CategoryTitle };
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import { t as UiImageProps } from "./ui-image-bUZSq9v9.js";
|
|
2
|
+
import { Pressable, Text, View } from "react-native";
|
|
3
|
+
import { ComponentProps } from "react";
|
|
4
|
+
//#region src/checkout.d.ts
|
|
5
|
+
type ViewProps = ComponentProps<typeof View> & {
|
|
6
|
+
className?: string;
|
|
7
|
+
};
|
|
8
|
+
type TextProps = ComponentProps<typeof Text> & {
|
|
9
|
+
className?: string;
|
|
10
|
+
};
|
|
11
|
+
type PressableProps = ComponentProps<typeof Pressable> & {
|
|
12
|
+
className?: string;
|
|
13
|
+
};
|
|
14
|
+
declare const Checkout: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
15
|
+
declare const CheckoutMain: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
16
|
+
declare const CheckoutAside: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
17
|
+
declare const CheckoutNav: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
18
|
+
declare const CheckoutNavBrand: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
19
|
+
declare const CheckoutHeader: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
20
|
+
declare const CheckoutBack: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
21
|
+
declare const CheckoutTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
22
|
+
declare const CheckoutDescription: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
23
|
+
declare const CheckoutSection: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
24
|
+
declare const CheckoutSectionHeader: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
25
|
+
declare const CheckoutSectionTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
26
|
+
declare const CheckoutSectionAction: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
27
|
+
declare const CheckoutRow: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
28
|
+
declare const CheckoutRowMedia: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
29
|
+
declare const CheckoutRowContent: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
30
|
+
declare const CheckoutRowTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
31
|
+
declare const CheckoutRowDescription: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
32
|
+
declare const CheckoutRowAside: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
33
|
+
declare const CheckoutRowChevron: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
34
|
+
declare const CheckoutFulfillment: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
35
|
+
declare const CheckoutFulfillmentOption: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
36
|
+
declare const CheckoutPayment: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
37
|
+
declare const CheckoutPaymentOption: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
38
|
+
declare const CheckoutPaymentPanel: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
39
|
+
declare const CheckoutPaymentPanelHeader: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
40
|
+
declare const CheckoutOption: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
41
|
+
declare const CheckoutOptionLabel: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
42
|
+
declare const CheckoutOptionControl: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
43
|
+
declare const CheckoutPromo: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
44
|
+
declare const CheckoutPromoIcon: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
45
|
+
declare const CheckoutPromoLabel: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
46
|
+
declare const CheckoutPromoChevron: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
47
|
+
declare const CheckoutTip: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
48
|
+
declare const CheckoutTipList: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
49
|
+
declare const CheckoutTipOption: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
50
|
+
declare const CheckoutTipCustom: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
51
|
+
declare const CheckoutFeeList: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
52
|
+
declare const CheckoutFeeRow: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
53
|
+
declare const CheckoutFeeLabel: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
54
|
+
declare const CheckoutFeeValue: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
55
|
+
declare const CheckoutFeeInfo: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
56
|
+
declare const CheckoutBanner: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
57
|
+
declare const CheckoutFooter: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
58
|
+
declare const CheckoutSubmit: ({ children, className, ...rest }: PressableProps) => import("react").JSX.Element;
|
|
59
|
+
declare const CheckoutStore: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
60
|
+
declare const CheckoutStoreMedia: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
61
|
+
declare const CheckoutStoreImage: (props: UiImageProps) => import("react").JSX.Element;
|
|
62
|
+
declare const CheckoutStoreContent: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
63
|
+
declare const CheckoutStoreTitle: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
64
|
+
declare const CheckoutStoreDescription: ({ className, ...rest }: TextProps) => import("react").JSX.Element;
|
|
65
|
+
declare const CheckoutColumn: ({ className, ...rest }: ViewProps) => import("react").JSX.Element;
|
|
66
|
+
//#endregion
|
|
67
|
+
export { Checkout, CheckoutAside, CheckoutBack, CheckoutBanner, CheckoutColumn, CheckoutDescription, CheckoutFeeInfo, CheckoutFeeLabel, CheckoutFeeList, CheckoutFeeRow, CheckoutFeeValue, CheckoutFooter, CheckoutFulfillment, CheckoutFulfillmentOption, CheckoutHeader, CheckoutMain, CheckoutNav, CheckoutNavBrand, CheckoutOption, CheckoutOptionControl, CheckoutOptionLabel, CheckoutPayment, CheckoutPaymentOption, CheckoutPaymentPanel, CheckoutPaymentPanelHeader, CheckoutPromo, CheckoutPromoChevron, CheckoutPromoIcon, CheckoutPromoLabel, CheckoutRow, CheckoutRowAside, CheckoutRowChevron, CheckoutRowContent, CheckoutRowDescription, CheckoutRowMedia, CheckoutRowTitle, CheckoutSection, CheckoutSectionAction, CheckoutSectionHeader, CheckoutSectionTitle, CheckoutStore, CheckoutStoreContent, CheckoutStoreDescription, CheckoutStoreImage, CheckoutStoreMedia, CheckoutStoreTitle, CheckoutSubmit, CheckoutTip, CheckoutTipCustom, CheckoutTipList, CheckoutTipOption, CheckoutTitle };
|
package/dist/checkout.js
ADDED
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { t as cn } from "./cn-C_hacsED.js";
|
|
2
|
+
import { t as UiImage } from "./ui-image-A3QxzafV.js";
|
|
3
|
+
import { Pressable, Text, View } from "react-native";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
//#region src/checkout.tsx
|
|
6
|
+
const view = (base) => {
|
|
7
|
+
return ({ className, ...rest }) => /* @__PURE__ */ jsx(View, {
|
|
8
|
+
className: cn(base, className),
|
|
9
|
+
...rest
|
|
10
|
+
});
|
|
11
|
+
};
|
|
12
|
+
const text = (base) => {
|
|
13
|
+
return ({ className, ...rest }) => /* @__PURE__ */ jsx(Text, {
|
|
14
|
+
className: cn(base, className),
|
|
15
|
+
...rest
|
|
16
|
+
});
|
|
17
|
+
};
|
|
18
|
+
const button = (base, labelTone = "text-foreground") => {
|
|
19
|
+
return ({ children, className, ...rest }) => {
|
|
20
|
+
const labelClass = `${labelTone} text-sm font-medium`;
|
|
21
|
+
let content = children;
|
|
22
|
+
if (typeof children === "string" || typeof children === "number") content = /* @__PURE__ */ jsx(Text, {
|
|
23
|
+
className: labelClass,
|
|
24
|
+
children
|
|
25
|
+
});
|
|
26
|
+
return /* @__PURE__ */ jsx(Pressable, {
|
|
27
|
+
className: cn(base, className),
|
|
28
|
+
...rest,
|
|
29
|
+
children: content
|
|
30
|
+
});
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
const Checkout = view("bg-background text-foreground min-h-0 flex-1 flex-col");
|
|
34
|
+
const CheckoutMain = view("w-full flex-1 flex-col gap-6 py-2");
|
|
35
|
+
const CheckoutAside = view("bg-card border-border flex-col gap-4 rounded-xl border p-4");
|
|
36
|
+
const CheckoutNav = view("bg-background h-16 flex-row items-center justify-center px-4");
|
|
37
|
+
const CheckoutNavBrand = text("text-foreground text-lg font-bold tracking-tight");
|
|
38
|
+
const CheckoutHeader = view("w-full flex-col gap-3");
|
|
39
|
+
const CheckoutBack = button("w-fit flex-row items-center gap-1.5", "text-foreground");
|
|
40
|
+
const CheckoutTitle = text("text-foreground text-2xl font-bold tracking-tight");
|
|
41
|
+
const CheckoutDescription = text("text-muted-foreground text-sm");
|
|
42
|
+
const CheckoutSection = view("bg-card border-border flex-col gap-3 rounded-xl border p-4");
|
|
43
|
+
const CheckoutSectionHeader = view("flex-row items-center justify-between gap-2");
|
|
44
|
+
const CheckoutSectionTitle = text("text-foreground text-sm font-semibold tracking-tight");
|
|
45
|
+
const CheckoutSectionAction = button("py-1", "text-primary");
|
|
46
|
+
const CheckoutRow = view("flex-row items-center gap-3");
|
|
47
|
+
const CheckoutRowMedia = view(`bg-muted relative size-12 shrink-0 overflow-hidden rounded-lg`);
|
|
48
|
+
const CheckoutRowContent = view("min-w-0 flex-1 flex-col gap-0.5");
|
|
49
|
+
const CheckoutRowTitle = text("text-foreground text-sm font-semibold");
|
|
50
|
+
const CheckoutRowDescription = text("text-muted-foreground text-sm");
|
|
51
|
+
const CheckoutRowAside = view("shrink-0 flex-row items-center gap-2");
|
|
52
|
+
const CheckoutRowChevron = text("text-muted-foreground size-5 text-center");
|
|
53
|
+
const CheckoutFulfillment = view("bg-muted w-full flex-row items-center rounded-full p-1");
|
|
54
|
+
const CheckoutFulfillmentOption = button("rounded-full px-3 py-1.5", "text-foreground");
|
|
55
|
+
const CheckoutPayment = view("flex-row flex-wrap items-center gap-4");
|
|
56
|
+
const CheckoutPaymentOption = button("flex-row items-center gap-2", "text-foreground");
|
|
57
|
+
const CheckoutPaymentPanel = view("bg-muted flex-col gap-3 rounded-lg border border-border p-3");
|
|
58
|
+
const CheckoutPaymentPanelHeader = view("flex-row items-center justify-between gap-2");
|
|
59
|
+
const CheckoutOption = view("flex-row items-center justify-between gap-3");
|
|
60
|
+
const CheckoutOptionLabel = view("min-w-0 flex-row items-center gap-2");
|
|
61
|
+
const CheckoutOptionControl = view("shrink-0 items-center");
|
|
62
|
+
const CheckoutPromo = button(`border-border w-full flex-row items-center gap-3 rounded-lg border px-3 py-3`, "text-foreground");
|
|
63
|
+
const CheckoutPromoIcon = text("text-foreground size-5 shrink-0 text-center");
|
|
64
|
+
const CheckoutPromoLabel = text("text-foreground min-w-0 flex-1 font-medium");
|
|
65
|
+
const CheckoutPromoChevron = text("text-muted-foreground size-5 text-center");
|
|
66
|
+
const CheckoutTip = view("flex-col gap-2");
|
|
67
|
+
const CheckoutTipList = view("flex-row flex-wrap items-center gap-2");
|
|
68
|
+
const CheckoutTipOption = button("rounded-full border px-3 py-1.5", "text-foreground");
|
|
69
|
+
const CheckoutTipCustom = view("min-w-0 flex-1");
|
|
70
|
+
const CheckoutFeeList = view("flex-col gap-2");
|
|
71
|
+
const CheckoutFeeRow = view("flex-row items-center justify-between gap-3");
|
|
72
|
+
const CheckoutFeeLabel = text("text-foreground text-sm");
|
|
73
|
+
const CheckoutFeeValue = text("text-foreground text-sm tabular-nums");
|
|
74
|
+
const CheckoutFeeInfo = button("size-4 items-center justify-center rounded-full", "text-muted-foreground");
|
|
75
|
+
const CheckoutBanner = view("flex-row items-center gap-2 rounded-lg px-3 py-2.5");
|
|
76
|
+
const CheckoutFooter = view("flex-col gap-3");
|
|
77
|
+
const CheckoutSubmit = button(`bg-foreground flex-row items-center justify-between gap-2 rounded-full px-4 py-3`, "text-background");
|
|
78
|
+
const CheckoutStore = view("flex-row items-center gap-3");
|
|
79
|
+
const CheckoutStoreMedia = view(`bg-muted relative size-10 shrink-0 overflow-hidden rounded-full`);
|
|
80
|
+
const CheckoutStoreImage = (props) => /* @__PURE__ */ jsx(UiImage, { ...props });
|
|
81
|
+
const CheckoutStoreContent = view("min-w-0 flex-1 flex-col");
|
|
82
|
+
const CheckoutStoreTitle = text("text-foreground text-sm font-semibold");
|
|
83
|
+
const CheckoutStoreDescription = text("text-muted-foreground text-xs");
|
|
84
|
+
const CheckoutColumn = view("min-w-0 flex-col gap-4");
|
|
85
|
+
//#endregion
|
|
86
|
+
export { Checkout, CheckoutAside, CheckoutBack, CheckoutBanner, CheckoutColumn, CheckoutDescription, CheckoutFeeInfo, CheckoutFeeLabel, CheckoutFeeList, CheckoutFeeRow, CheckoutFeeValue, CheckoutFooter, CheckoutFulfillment, CheckoutFulfillmentOption, CheckoutHeader, CheckoutMain, CheckoutNav, CheckoutNavBrand, CheckoutOption, CheckoutOptionControl, CheckoutOptionLabel, CheckoutPayment, CheckoutPaymentOption, CheckoutPaymentPanel, CheckoutPaymentPanelHeader, CheckoutPromo, CheckoutPromoChevron, CheckoutPromoIcon, CheckoutPromoLabel, CheckoutRow, CheckoutRowAside, CheckoutRowChevron, CheckoutRowContent, CheckoutRowDescription, CheckoutRowMedia, CheckoutRowTitle, CheckoutSection, CheckoutSectionAction, CheckoutSectionHeader, CheckoutSectionTitle, CheckoutStore, CheckoutStoreContent, CheckoutStoreDescription, CheckoutStoreImage, CheckoutStoreMedia, CheckoutStoreTitle, CheckoutSubmit, CheckoutTip, CheckoutTipCustom, CheckoutTipList, CheckoutTipOption, CheckoutTitle };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Cart, CartAction, CartBanner, CartBody, CartDescription, CartEmpty, CartEmptyDescription, CartEmptyTitle, CartFooter, CartHeader, CartItem, CartItemAction, CartItemActions, CartItemAnchorPrice, CartItemAside, CartItemContent, CartItemDescription, CartItemHeader, CartItemImage, CartItemImageSlot, CartItemMedia, CartItemMeta, CartItemPrice, CartItemTitle, CartList, CartOption, CartOptionControl, CartOptionLabel, CartQuantity, CartQuantityButton, CartQuantityValue, CartScroller, CartSection, CartSectionHeader, CartSectionTitle, CartStore, CartStoreContent, CartStoreDescription, CartStoreImage, CartStoreMedia, CartStoreTitle, CartSubmit, CartSummary, CartSummaryLabel, CartSummaryRow, CartSummaryValue, CartTitle } from "./cart.js";
|
|
2
|
+
import { CategoryNav, CategoryNavExtra, CategoryNavItem, CategoryNavLink, CategoryNavList, CategoryNavOrientation } from "./category-nav.js";
|
|
3
|
+
import { Category, CategoryContent, CategoryDescription, CategoryEmpty, CategoryEmptyContent, CategoryEmptyDescription, CategoryEmptyHeader, CategoryEmptyMedia, CategoryEmptyTitle, CategoryGrid, CategoryGridItem, CategoryHeader, CategoryList, CategoryListItem, CategoryTitle } from "./category.js";
|
|
4
|
+
import { Checkout, CheckoutAside, CheckoutBack, CheckoutBanner, CheckoutColumn, CheckoutDescription, CheckoutFeeInfo, CheckoutFeeLabel, CheckoutFeeList, CheckoutFeeRow, CheckoutFeeValue, CheckoutFooter, CheckoutFulfillment, CheckoutFulfillmentOption, CheckoutHeader, CheckoutMain, CheckoutNav, CheckoutNavBrand, CheckoutOption, CheckoutOptionControl, CheckoutOptionLabel, CheckoutPayment, CheckoutPaymentOption, CheckoutPaymentPanel, CheckoutPaymentPanelHeader, CheckoutPromo, CheckoutPromoChevron, CheckoutPromoIcon, CheckoutPromoLabel, CheckoutRow, CheckoutRowAside, CheckoutRowChevron, CheckoutRowContent, CheckoutRowDescription, CheckoutRowMedia, CheckoutRowTitle, CheckoutSection, CheckoutSectionAction, CheckoutSectionHeader, CheckoutSectionTitle, CheckoutStore, CheckoutStoreContent, CheckoutStoreDescription, CheckoutStoreImage, CheckoutStoreMedia, CheckoutStoreTitle, CheckoutSubmit, CheckoutTip, CheckoutTipCustom, CheckoutTipList, CheckoutTipOption, CheckoutTitle } from "./checkout.js";
|
|
5
|
+
import { Menu, MenuEmpty, MenuEmptyContent, MenuEmptyDescription, MenuEmptyHeader, MenuEmptyMedia, MenuEmptyTitle } from "./menu.js";
|
|
6
|
+
import { ProductCard, ProductCardAddButton, ProductCardAnchorPrice, ProductCardBadge, ProductCardContent, ProductCardDescription, ProductCardDiscount, ProductCardFooter, ProductCardHeader, ProductCardImage, ProductCardImageSlot, ProductCardMedia, ProductCardMeta, ProductCardPrice, ProductCardRating, ProductCardTitle } from "./product-card.js";
|
|
7
|
+
import { UseActiveCategoryOptions, useActiveCategory } from "./use-active-category.js";
|
|
8
|
+
export { Cart, CartAction, CartBanner, CartBody, CartDescription, CartEmpty, CartEmptyDescription, CartEmptyTitle, CartFooter, CartHeader, CartItem, CartItemAction, CartItemActions, CartItemAnchorPrice, CartItemAside, CartItemContent, CartItemDescription, CartItemHeader, CartItemImage, CartItemImageSlot, CartItemMedia, CartItemMeta, CartItemPrice, CartItemTitle, CartList, CartOption, CartOptionControl, CartOptionLabel, CartQuantity, CartQuantityButton, CartQuantityValue, CartScroller, CartSection, CartSectionHeader, CartSectionTitle, CartStore, CartStoreContent, CartStoreDescription, CartStoreImage, CartStoreMedia, CartStoreTitle, CartSubmit, CartSummary, CartSummaryLabel, CartSummaryRow, CartSummaryValue, CartTitle, Category, CategoryContent, CategoryDescription, CategoryEmpty, CategoryEmptyContent, CategoryEmptyDescription, CategoryEmptyHeader, CategoryEmptyMedia, CategoryEmptyTitle, CategoryGrid, CategoryGridItem, CategoryHeader, CategoryList, CategoryListItem, CategoryNav, CategoryNavExtra, CategoryNavItem, CategoryNavLink, CategoryNavList, CategoryNavOrientation, CategoryTitle, Checkout, CheckoutAside, CheckoutBack, CheckoutBanner, CheckoutColumn, CheckoutDescription, CheckoutFeeInfo, CheckoutFeeLabel, CheckoutFeeList, CheckoutFeeRow, CheckoutFeeValue, CheckoutFooter, CheckoutFulfillment, CheckoutFulfillmentOption, CheckoutHeader, CheckoutMain, CheckoutNav, CheckoutNavBrand, CheckoutOption, CheckoutOptionControl, CheckoutOptionLabel, CheckoutPayment, CheckoutPaymentOption, CheckoutPaymentPanel, CheckoutPaymentPanelHeader, CheckoutPromo, CheckoutPromoChevron, CheckoutPromoIcon, CheckoutPromoLabel, CheckoutRow, CheckoutRowAside, CheckoutRowChevron, CheckoutRowContent, CheckoutRowDescription, CheckoutRowMedia, CheckoutRowTitle, CheckoutSection, CheckoutSectionAction, CheckoutSectionHeader, CheckoutSectionTitle, CheckoutStore, CheckoutStoreContent, CheckoutStoreDescription, CheckoutStoreImage, CheckoutStoreMedia, CheckoutStoreTitle, CheckoutSubmit, CheckoutTip, CheckoutTipCustom, CheckoutTipList, CheckoutTipOption, CheckoutTitle, Menu, MenuEmpty, MenuEmptyContent, MenuEmptyDescription, MenuEmptyHeader, MenuEmptyMedia, MenuEmptyTitle, ProductCard, ProductCardAddButton, ProductCardAnchorPrice, ProductCardBadge, ProductCardContent, ProductCardDescription, ProductCardDiscount, ProductCardFooter, ProductCardHeader, ProductCardImage, ProductCardImageSlot, ProductCardMedia, ProductCardMeta, ProductCardPrice, ProductCardRating, ProductCardTitle, UseActiveCategoryOptions, useActiveCategory };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Cart, CartAction, CartBanner, CartBody, CartDescription, CartEmpty, CartEmptyDescription, CartEmptyTitle, CartFooter, CartHeader, CartItem, CartItemAction, CartItemActions, CartItemAnchorPrice, CartItemAside, CartItemContent, CartItemDescription, CartItemHeader, CartItemImage, CartItemImageSlot, CartItemMedia, CartItemMeta, CartItemPrice, CartItemTitle, CartList, CartOption, CartOptionControl, CartOptionLabel, CartQuantity, CartQuantityButton, CartQuantityValue, CartScroller, CartSection, CartSectionHeader, CartSectionTitle, CartStore, CartStoreContent, CartStoreDescription, CartStoreImage, CartStoreMedia, CartStoreTitle, CartSubmit, CartSummary, CartSummaryLabel, CartSummaryRow, CartSummaryValue, CartTitle } from "./cart.js";
|
|
2
|
+
import { Category, CategoryContent, CategoryDescription, CategoryEmpty, CategoryEmptyContent, CategoryEmptyDescription, CategoryEmptyHeader, CategoryEmptyMedia, CategoryEmptyTitle, CategoryGrid, CategoryGridItem, CategoryHeader, CategoryList, CategoryListItem, CategoryTitle } from "./category.js";
|
|
3
|
+
import { CategoryNav, CategoryNavExtra, CategoryNavItem, CategoryNavLink, CategoryNavList } from "./category-nav.js";
|
|
4
|
+
import { Checkout, CheckoutAside, CheckoutBack, CheckoutBanner, CheckoutColumn, CheckoutDescription, CheckoutFeeInfo, CheckoutFeeLabel, CheckoutFeeList, CheckoutFeeRow, CheckoutFeeValue, CheckoutFooter, CheckoutFulfillment, CheckoutFulfillmentOption, CheckoutHeader, CheckoutMain, CheckoutNav, CheckoutNavBrand, CheckoutOption, CheckoutOptionControl, CheckoutOptionLabel, CheckoutPayment, CheckoutPaymentOption, CheckoutPaymentPanel, CheckoutPaymentPanelHeader, CheckoutPromo, CheckoutPromoChevron, CheckoutPromoIcon, CheckoutPromoLabel, CheckoutRow, CheckoutRowAside, CheckoutRowChevron, CheckoutRowContent, CheckoutRowDescription, CheckoutRowMedia, CheckoutRowTitle, CheckoutSection, CheckoutSectionAction, CheckoutSectionHeader, CheckoutSectionTitle, CheckoutStore, CheckoutStoreContent, CheckoutStoreDescription, CheckoutStoreImage, CheckoutStoreMedia, CheckoutStoreTitle, CheckoutSubmit, CheckoutTip, CheckoutTipCustom, CheckoutTipList, CheckoutTipOption, CheckoutTitle } from "./checkout.js";
|
|
5
|
+
import { Menu, MenuEmpty, MenuEmptyContent, MenuEmptyDescription, MenuEmptyHeader, MenuEmptyMedia, MenuEmptyTitle } from "./menu.js";
|
|
6
|
+
import { ProductCard, ProductCardAddButton, ProductCardAnchorPrice, ProductCardBadge, ProductCardContent, ProductCardDescription, ProductCardDiscount, ProductCardFooter, ProductCardHeader, ProductCardImage, ProductCardImageSlot, ProductCardMedia, ProductCardMeta, ProductCardPrice, ProductCardRating, ProductCardTitle } from "./product-card.js";
|
|
7
|
+
import { useActiveCategory } from "./use-active-category.js";
|
|
8
|
+
export { Cart, CartAction, CartBanner, CartBody, CartDescription, CartEmpty, CartEmptyDescription, CartEmptyTitle, CartFooter, CartHeader, CartItem, CartItemAction, CartItemActions, CartItemAnchorPrice, CartItemAside, CartItemContent, CartItemDescription, CartItemHeader, CartItemImage, CartItemImageSlot, CartItemMedia, CartItemMeta, CartItemPrice, CartItemTitle, CartList, CartOption, CartOptionControl, CartOptionLabel, CartQuantity, CartQuantityButton, CartQuantityValue, CartScroller, CartSection, CartSectionHeader, CartSectionTitle, CartStore, CartStoreContent, CartStoreDescription, CartStoreImage, CartStoreMedia, CartStoreTitle, CartSubmit, CartSummary, CartSummaryLabel, CartSummaryRow, CartSummaryValue, CartTitle, Category, CategoryContent, CategoryDescription, CategoryEmpty, CategoryEmptyContent, CategoryEmptyDescription, CategoryEmptyHeader, CategoryEmptyMedia, CategoryEmptyTitle, CategoryGrid, CategoryGridItem, CategoryHeader, CategoryList, CategoryListItem, CategoryNav, CategoryNavExtra, CategoryNavItem, CategoryNavLink, CategoryNavList, CategoryTitle, Checkout, CheckoutAside, CheckoutBack, CheckoutBanner, CheckoutColumn, CheckoutDescription, CheckoutFeeInfo, CheckoutFeeLabel, CheckoutFeeList, CheckoutFeeRow, CheckoutFeeValue, CheckoutFooter, CheckoutFulfillment, CheckoutFulfillmentOption, CheckoutHeader, CheckoutMain, CheckoutNav, CheckoutNavBrand, CheckoutOption, CheckoutOptionControl, CheckoutOptionLabel, CheckoutPayment, CheckoutPaymentOption, CheckoutPaymentPanel, CheckoutPaymentPanelHeader, CheckoutPromo, CheckoutPromoChevron, CheckoutPromoIcon, CheckoutPromoLabel, CheckoutRow, CheckoutRowAside, CheckoutRowChevron, CheckoutRowContent, CheckoutRowDescription, CheckoutRowMedia, CheckoutRowTitle, CheckoutSection, CheckoutSectionAction, CheckoutSectionHeader, CheckoutSectionTitle, CheckoutStore, CheckoutStoreContent, CheckoutStoreDescription, CheckoutStoreImage, CheckoutStoreMedia, CheckoutStoreTitle, CheckoutSubmit, CheckoutTip, CheckoutTipCustom, CheckoutTipList, CheckoutTipOption, CheckoutTitle, Menu, MenuEmpty, MenuEmptyContent, MenuEmptyDescription, MenuEmptyHeader, MenuEmptyMedia, MenuEmptyTitle, ProductCard, ProductCardAddButton, ProductCardAnchorPrice, ProductCardBadge, ProductCardContent, ProductCardDescription, ProductCardDiscount, ProductCardFooter, ProductCardHeader, ProductCardImage, ProductCardImageSlot, ProductCardMedia, ProductCardMeta, ProductCardPrice, ProductCardRating, ProductCardTitle, useActiveCategory };
|