@blinkdotnew/mobile-ui 2.0.0-alpha.10 → 2.0.0-alpha.11
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/index.d.mts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +100 -74
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +100 -74
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -510,8 +510,9 @@ type BottomSheetProps = {
|
|
|
510
510
|
dismissOnSnapToBottom?: boolean;
|
|
511
511
|
showHandle?: boolean;
|
|
512
512
|
showClose?: boolean;
|
|
513
|
+
zIndex?: number;
|
|
513
514
|
};
|
|
514
|
-
declare function BottomSheet({ open, onOpenChange, title, children, snapPoints, dismissOnSnapToBottom, showHandle, showClose }: BottomSheetProps): react_jsx_runtime.JSX.Element;
|
|
515
|
+
declare function BottomSheet({ open, onOpenChange, title, children, snapPoints, dismissOnSnapToBottom, showHandle, showClose, zIndex }: BottomSheetProps): react_jsx_runtime.JSX.Element;
|
|
515
516
|
|
|
516
517
|
type AuthProvider = {
|
|
517
518
|
id: string;
|
|
@@ -579,8 +580,9 @@ type ActionSheetProps = {
|
|
|
579
580
|
items: ActionSheetItem[];
|
|
580
581
|
onSelect: (id: string) => void;
|
|
581
582
|
cancelLabel?: string;
|
|
583
|
+
zIndex?: number;
|
|
582
584
|
};
|
|
583
|
-
declare function ActionSheet({ open, onOpenChange, title, items, onSelect, cancelLabel }: ActionSheetProps): react_jsx_runtime.JSX.Element;
|
|
585
|
+
declare function ActionSheet({ open, onOpenChange, title, items, onSelect, cancelLabel, zIndex }: ActionSheetProps): react_jsx_runtime.JSX.Element;
|
|
584
586
|
|
|
585
587
|
type SkeletonProps = {
|
|
586
588
|
width?: number | string;
|
package/dist/index.d.ts
CHANGED
|
@@ -510,8 +510,9 @@ type BottomSheetProps = {
|
|
|
510
510
|
dismissOnSnapToBottom?: boolean;
|
|
511
511
|
showHandle?: boolean;
|
|
512
512
|
showClose?: boolean;
|
|
513
|
+
zIndex?: number;
|
|
513
514
|
};
|
|
514
|
-
declare function BottomSheet({ open, onOpenChange, title, children, snapPoints, dismissOnSnapToBottom, showHandle, showClose }: BottomSheetProps): react_jsx_runtime.JSX.Element;
|
|
515
|
+
declare function BottomSheet({ open, onOpenChange, title, children, snapPoints, dismissOnSnapToBottom, showHandle, showClose, zIndex }: BottomSheetProps): react_jsx_runtime.JSX.Element;
|
|
515
516
|
|
|
516
517
|
type AuthProvider = {
|
|
517
518
|
id: string;
|
|
@@ -579,8 +580,9 @@ type ActionSheetProps = {
|
|
|
579
580
|
items: ActionSheetItem[];
|
|
580
581
|
onSelect: (id: string) => void;
|
|
581
582
|
cancelLabel?: string;
|
|
583
|
+
zIndex?: number;
|
|
582
584
|
};
|
|
583
|
-
declare function ActionSheet({ open, onOpenChange, title, items, onSelect, cancelLabel }: ActionSheetProps): react_jsx_runtime.JSX.Element;
|
|
585
|
+
declare function ActionSheet({ open, onOpenChange, title, items, onSelect, cancelLabel, zIndex }: ActionSheetProps): react_jsx_runtime.JSX.Element;
|
|
584
586
|
|
|
585
587
|
type SkeletonProps = {
|
|
586
588
|
width?: number | string;
|
package/dist/index.js
CHANGED
|
@@ -1398,31 +1398,44 @@ function AppHeader({ title, subtitle, variant = "simple", onBack, avatar, left,
|
|
|
1398
1398
|
var import_tamagui35 = require("tamagui");
|
|
1399
1399
|
var import_react_native2 = require("react-native");
|
|
1400
1400
|
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1401
|
-
function BottomSheet({ open, onOpenChange, title, children, snapPoints = [85], dismissOnSnapToBottom = true, showHandle = true, showClose = false }) {
|
|
1402
|
-
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1401
|
+
function BottomSheet({ open, onOpenChange, title, children, snapPoints = [85], dismissOnSnapToBottom = true, showHandle = true, showClose = false, zIndex = 1e5 }) {
|
|
1402
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
1403
|
+
import_tamagui35.Sheet,
|
|
1404
|
+
{
|
|
1405
|
+
modal: true,
|
|
1406
|
+
forceRemoveScrollEnabled: open,
|
|
1407
|
+
open,
|
|
1408
|
+
onOpenChange,
|
|
1409
|
+
snapPoints,
|
|
1410
|
+
dismissOnSnapToBottom,
|
|
1411
|
+
zIndex,
|
|
1412
|
+
animation: "medium",
|
|
1413
|
+
children: [
|
|
1414
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_tamagui35.Sheet.Overlay, { animation: "lazy", enterStyle: { opacity: 0 }, exitStyle: { opacity: 0 } }),
|
|
1415
|
+
showHandle && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_tamagui35.Sheet.Handle, {}),
|
|
1416
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_tamagui35.Sheet.Frame, { children: [
|
|
1417
|
+
(title || showClose) && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_tamagui35.XStack, { paddingHorizontal: "$4", paddingTop: "$3", paddingBottom: "$2", alignItems: "center", justifyContent: "space-between", children: [
|
|
1418
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_tamagui35.SizableText, { size: "$6", fontWeight: "600", flexShrink: 1, children: title }),
|
|
1419
|
+
showClose && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1420
|
+
import_tamagui35.XStack,
|
|
1421
|
+
{
|
|
1422
|
+
width: 28,
|
|
1423
|
+
height: 28,
|
|
1424
|
+
borderRadius: "$10",
|
|
1425
|
+
backgroundColor: "$color4",
|
|
1426
|
+
alignItems: "center",
|
|
1427
|
+
justifyContent: "center",
|
|
1428
|
+
pressStyle: { opacity: 0.7 },
|
|
1429
|
+
onPress: () => onOpenChange(false),
|
|
1430
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_tamagui35.SizableText, { size: "$3", color: "$color10", fontWeight: "600", children: "\u2715" })
|
|
1431
|
+
}
|
|
1432
|
+
)
|
|
1433
|
+
] }),
|
|
1434
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_native2.ScrollView, { contentContainerStyle: { paddingBottom: 40 }, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_tamagui35.YStack, { padding: "$4", children }) })
|
|
1435
|
+
] })
|
|
1436
|
+
]
|
|
1437
|
+
}
|
|
1438
|
+
);
|
|
1426
1439
|
}
|
|
1427
1440
|
|
|
1428
1441
|
// src/patterns/LoginScreen.tsx
|
|
@@ -1578,55 +1591,68 @@ function FloatingActionButton({ icon, label, onPress, position = "bottom-right",
|
|
|
1578
1591
|
// src/patterns/ActionSheet.tsx
|
|
1579
1592
|
var import_tamagui40 = require("tamagui");
|
|
1580
1593
|
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1581
|
-
function ActionSheet({ open, onOpenChange, title, items, onSelect, cancelLabel = "Cancel" }) {
|
|
1582
|
-
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
}
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1594
|
+
function ActionSheet({ open, onOpenChange, title, items, onSelect, cancelLabel = "Cancel", zIndex = 1e5 }) {
|
|
1595
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
|
1596
|
+
import_tamagui40.Sheet,
|
|
1597
|
+
{
|
|
1598
|
+
modal: true,
|
|
1599
|
+
forceRemoveScrollEnabled: open,
|
|
1600
|
+
open,
|
|
1601
|
+
onOpenChange,
|
|
1602
|
+
snapPoints: [50],
|
|
1603
|
+
dismissOnSnapToBottom: true,
|
|
1604
|
+
zIndex,
|
|
1605
|
+
animation: "medium",
|
|
1606
|
+
children: [
|
|
1607
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_tamagui40.Sheet.Overlay, { animation: "lazy", enterStyle: { opacity: 0 }, exitStyle: { opacity: 0 } }),
|
|
1608
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_tamagui40.Sheet.Handle, {}),
|
|
1609
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_tamagui40.Sheet.Frame, { children: [
|
|
1610
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_tamagui40.SizableText, { size: "$3", color: "$color8", textAlign: "center", paddingTop: "$3", paddingBottom: "$1", children: title }),
|
|
1611
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_tamagui40.YStack, { paddingHorizontal: "$3", paddingTop: "$2", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
|
1612
|
+
import_tamagui40.XStack,
|
|
1613
|
+
{
|
|
1614
|
+
height: 52,
|
|
1615
|
+
alignItems: "center",
|
|
1616
|
+
gap: "$3",
|
|
1617
|
+
paddingHorizontal: "$3",
|
|
1618
|
+
borderRadius: "$4",
|
|
1619
|
+
pressStyle: { backgroundColor: "$color3" },
|
|
1620
|
+
onPress: () => {
|
|
1621
|
+
onSelect(item.id);
|
|
1622
|
+
onOpenChange(false);
|
|
1623
|
+
},
|
|
1624
|
+
children: [
|
|
1625
|
+
item.icon && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_tamagui40.SizableText, { size: "$5", children: item.icon }),
|
|
1626
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1627
|
+
import_tamagui40.SizableText,
|
|
1628
|
+
{
|
|
1629
|
+
size: "$5",
|
|
1630
|
+
flex: 1,
|
|
1631
|
+
color: item.destructive ? "$red9" : "$color12",
|
|
1632
|
+
fontWeight: item.destructive ? "600" : "400",
|
|
1633
|
+
children: item.label
|
|
1634
|
+
}
|
|
1635
|
+
)
|
|
1636
|
+
]
|
|
1637
|
+
},
|
|
1638
|
+
item.id
|
|
1639
|
+
)) }),
|
|
1640
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_tamagui40.YStack, { paddingHorizontal: "$3", paddingVertical: "$3", borderTopWidth: 1, borderTopColor: "$borderColor", marginTop: "$2", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1641
|
+
import_tamagui40.XStack,
|
|
1642
|
+
{
|
|
1643
|
+
height: 48,
|
|
1644
|
+
alignItems: "center",
|
|
1645
|
+
justifyContent: "center",
|
|
1646
|
+
borderRadius: "$4",
|
|
1647
|
+
pressStyle: { backgroundColor: "$color3" },
|
|
1648
|
+
onPress: () => onOpenChange(false),
|
|
1649
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_tamagui40.SizableText, { size: "$5", fontWeight: "600", color: "$color9", children: cancelLabel })
|
|
1650
|
+
}
|
|
1651
|
+
) })
|
|
1652
|
+
] })
|
|
1653
|
+
]
|
|
1654
|
+
}
|
|
1655
|
+
);
|
|
1630
1656
|
}
|
|
1631
1657
|
|
|
1632
1658
|
// src/patterns/Skeleton.tsx
|