@ornikar/kitt-universal 27.7.0 → 27.9.0

package/dist/index-node-22.17.cjs.web.js

@@ -4028,7 +4028,7 @@ function useOnCloseModalBehaviour() {
   return onClose;
 }
 
-function CloseButton({
+function CloseButton$1({
   children,
   onPress
 }) {
@@ -4063,7 +4063,7 @@ function ModalBehaviour({
     })
   });
 }
-ModalBehaviour.CloseButton = CloseButton;
+ModalBehaviour.CloseButton = CloseButton$1;
 
 function Overlay({
   onPress
@@ -12676,6 +12676,85 @@ function Tooltip({
 Tooltip.Arrow = Arrow;
 Tooltip.Content = TooltipContent;
 
+function TopNavBar({
+  left,
+  right,
+  title,
+  titleAlign = 'center',
+  stickers,
+  mode = 'default',
+  hasSeparator = true
+}) {
+  const isLargeTitleMode = mode === 'largeTitle';
+  return /*#__PURE__*/jsxRuntime.jsxs(VStack, {
+    space: isLargeTitleMode ? 'kitt.2' : undefined,
+    width: "100%",
+    height: mode === 'default' ? 56 : undefined,
+    justifyContent: "center",
+    paddingX: "kitt.2",
+    paddingTop: isLargeTitleMode ? 'kitt.2' : 'kitt.3',
+    paddingBottom: "kitt.3",
+    borderBottomWidth: hasSeparator && mode === 'default' ? 1 : 0,
+    borderColor: "kitt.separator",
+    children: [/*#__PURE__*/jsxRuntime.jsxs(HStack, {
+      alignItems: "center",
+      justifyContent: !title && !left ? 'flex-end' : 'space-between',
+      children: [left ?? /*#__PURE__*/jsxRuntime.jsx(View, {
+        width: "kitt.button.minWidth"
+      }), mode === 'default' ? /*#__PURE__*/jsxRuntime.jsx(View, {
+        flexGrow: "1",
+        flexShrink: 1,
+        paddingRight: "kitt.2",
+        paddingLeft: "kitt.2",
+        children: title ? /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
+          textAlign: titleAlign,
+          variant: "bold",
+          ellipsizeMode: "tail",
+          numberOfLines: 1,
+          children: title
+        }) : null
+      }) : null, right ?? /*#__PURE__*/jsxRuntime.jsx(View, {
+        width: "kitt.button.minWidth"
+      })]
+    }), mode === 'largeTitle' ? /*#__PURE__*/jsxRuntime.jsxs(VStack, {
+      space: "kitt.4",
+      paddingX: "kitt.2",
+      children: [stickers ? /*#__PURE__*/jsxRuntime.jsx(HStack, {
+        width: "100%",
+        space: "kitt.1",
+        flexShrink: 1,
+        flexWrap: "wrap",
+        style: {
+          rowGap: theme.getSpacing(1)
+        },
+        children: stickers.map((sticker, index) =>
+        /*#__PURE__*/
+        // eslint-disable-next-line react/no-array-index-key
+        jsxRuntime.jsx(View, {
+          children: sticker
+        }, index))
+      }) : null, /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
+        base: "heading-m",
+        children: title
+      })]
+    }) : null]
+  });
+}
+function CloseButton(props) {
+  return /*#__PURE__*/jsxRuntime.jsx(IconButton, {
+    icon: /*#__PURE__*/jsxRuntime.jsx(phosphor.XRegularIcon, {}),
+    ...props
+  });
+}
+function BackButton(props) {
+  return /*#__PURE__*/jsxRuntime.jsx(IconButton, {
+    icon: /*#__PURE__*/jsxRuntime.jsx(phosphor.ArrowLeftRegularIcon, {}),
+    ...props
+  });
+}
+TopNavBar.CloseButton = CloseButton;
+TopNavBar.BackButton = BackButton;
+
 function getTypographyTypeConfig(type, theme) {
   const {
     configs
@@ -13269,6 +13348,7 @@ exports.TimePicker = TimePicker;
 exports.ToastComponent = ToastComponent;
 exports.Toggle = Toggle;
 exports.Tooltip = Tooltip;
+exports.TopNavBar = TopNavBar;
 exports.Typography = Typography;
 exports.TypographyEmoji = TypographyEmoji;
 exports.TypographyIcon = TypographyIcon;