@lmb-it/kitsconcerto-native 0.1.236

package/apps/mobile/src/ui/alert/index.js

@@ -0,0 +1,203 @@
+import { jsx } from 'react/jsx-runtime';
+import { createAlert } from '@gluestack-ui/core/alert/creator';
+import { Text, View } from 'react-native';
+import { tva, withStyleContext, useStyleContext } from '@gluestack-ui/utils/nativewind-utils';
+import React from 'react';
+import { cssInterop } from 'nativewind';
+import { UIIcon, PrimitiveIcon } from '@gluestack-ui/core/icon/creator';
+
+const SCOPE = "ALERT";
+const alertStyle = tva({
+  base: "items-center py-3 px-4 rounded-md flex-row gap-2 border-outline-100",
+  variants: {
+    action: {
+      error: "bg-background-error",
+      warning: "bg-background-warning",
+      success: "bg-background-success",
+      info: "bg-background-info",
+      muted: "bg-background-muted"
+    },
+    variant: {
+      solid: "",
+      outline: "border bg-background-0"
+    }
+  }
+});
+const alertTextStyle = tva({
+  base: "font-normal font-body",
+  variants: {
+    isTruncated: {
+      true: "web:truncate"
+    },
+    bold: {
+      true: "font-bold"
+    },
+    underline: {
+      true: "underline"
+    },
+    strikeThrough: {
+      true: "line-through"
+    },
+    size: {
+      "2xs": "text-2xs",
+      "xs": "text-xs",
+      "sm": "text-sm",
+      "md": "text-base",
+      "lg": "text-lg",
+      "xl": "text-xl",
+      "2xl": "text-2xl",
+      "3xl": "text-3xl",
+      "4xl": "text-4xl",
+      "5xl": "text-5xl",
+      "6xl": "text-6xl"
+    },
+    sub: {
+      true: "text-xs"
+    },
+    italic: {
+      true: "italic"
+    },
+    highlight: {
+      true: "bg-yellow-500"
+    }
+  },
+  parentVariants: {
+    action: {
+      error: "text-error-800",
+      warning: "text-warning-800",
+      success: "text-success-800",
+      info: "text-info-800",
+      muted: "text-background-800"
+    }
+  }
+});
+const alertIconStyle = tva({
+  base: "fill-none",
+  variants: {
+    size: {
+      "2xs": "h-3 w-3",
+      "xs": "h-3.5 w-3.5",
+      "sm": "h-4 w-4",
+      "md": "h-[18px] w-[18px]",
+      "lg": "h-5 w-5",
+      "xl": "h-6 w-6"
+    }
+  },
+  parentVariants: {
+    action: {
+      error: "text-error-800",
+      warning: "text-warning-800",
+      success: "text-success-800",
+      info: "text-info-800",
+      muted: "text-background-800"
+    }
+  }
+});
+const UIAlert = createAlert({
+  Root: withStyleContext(View, SCOPE),
+  Text,
+  Icon: UIIcon
+});
+cssInterop(PrimitiveIcon, {
+  className: {
+    target: "style",
+    nativeStyleToProp: {
+      height: true,
+      width: true,
+      fill: true,
+      color: "classNameColor",
+      stroke: true
+    }
+  }
+});
+const Alert = React.forwardRef(
+  function Alert2({ className, variant = "solid", action = "muted", ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      UIAlert,
+      {
+        className: alertStyle({ action, variant, class: className }),
+        context: { variant, action },
+        ref,
+        ...props
+      }
+    );
+  }
+);
+const AlertText = React.forwardRef(function AlertText2({
+  className,
+  isTruncated,
+  bold,
+  underline,
+  strikeThrough,
+  size = "md",
+  sub,
+  italic,
+  highlight,
+  ...props
+}, ref) {
+  const { action: parentAction } = useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsx(
+    UIAlert.Text,
+    {
+      className: alertTextStyle({
+        isTruncated,
+        bold,
+        underline,
+        strikeThrough,
+        size,
+        sub,
+        italic,
+        highlight,
+        class: className,
+        parentVariants: {
+          action: parentAction
+        }
+      }),
+      ...props,
+      ref
+    }
+  );
+});
+const AlertIcon = React.forwardRef(function AlertIcon2({ className, size = "md", ...props }, ref) {
+  const { action: parentAction } = useStyleContext(SCOPE);
+  if (typeof size === "number") {
+    return /* @__PURE__ */ jsx(
+      UIAlert.Icon,
+      {
+        ref,
+        ...props,
+        className: alertIconStyle({ class: className }),
+        size
+      }
+    );
+  } else if ((props.height !== void 0 || props.width !== void 0) && size === void 0) {
+    return /* @__PURE__ */ jsx(
+      UIAlert.Icon,
+      {
+        ref,
+        ...props,
+        className: alertIconStyle({ class: className })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    UIAlert.Icon,
+    {
+      className: alertIconStyle({
+        parentVariants: {
+          action: parentAction
+        },
+        size,
+        class: className
+      }),
+      ...props,
+      ref
+    }
+  );
+});
+Alert.displayName = "Alert";
+AlertText.displayName = "AlertText";
+AlertIcon.displayName = "AlertIcon";
+
+export { Alert, AlertIcon, AlertText, UIAlert };
+//# sourceMappingURL=index.js.map

package/apps/mobile/src/ui/alert/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../../../apps/mobile/src/ui/alert/index.tsx"],"sourcesContent":["'use client';\nimport { createAlert } from '@gluestack-ui/core/alert/creator';\nimport { View, Text } from 'react-native';\nimport { tva } from '@gluestack-ui/utils/nativewind-utils';\nimport {\n  withStyleContext,\n  useStyleContext,\n} from '@gluestack-ui/utils/nativewind-utils';\nimport React from 'react';\nimport { cssInterop } from 'nativewind';\nimport type { VariantProps } from '@gluestack-ui/utils/nativewind-utils';\nimport { PrimitiveIcon, UIIcon } from '@gluestack-ui/core/icon/creator';\n\nconst SCOPE = 'ALERT';\n\nconst alertStyle = tva({\n  base: 'items-center py-3 px-4 rounded-md flex-row gap-2 border-outline-100',\n\n  variants: {\n    action: {\n      error: 'bg-background-error',\n      warning: 'bg-background-warning',\n      success: 'bg-background-success',\n      info: 'bg-background-info',\n      muted: 'bg-background-muted',\n    },\n\n    variant: {\n      solid: '',\n      outline: 'border bg-background-0',\n    },\n  },\n});\n\nconst alertTextStyle = tva({\n  base: 'font-normal font-body',\n\n  variants: {\n    isTruncated: {\n      true: 'web:truncate',\n    },\n    bold: {\n      true: 'font-bold',\n    },\n    underline: {\n      true: 'underline',\n    },\n    strikeThrough: {\n      true: 'line-through',\n    },\n    size: {\n      '2xs': 'text-2xs',\n      'xs': 'text-xs',\n      'sm': 'text-sm',\n      'md': 'text-base',\n      'lg': 'text-lg',\n      'xl': 'text-xl',\n      '2xl': 'text-2xl',\n      '3xl': 'text-3xl',\n      '4xl': 'text-4xl',\n      '5xl': 'text-5xl',\n      '6xl': 'text-6xl',\n    },\n    sub: {\n      true: 'text-xs',\n    },\n    italic: {\n      true: 'italic',\n    },\n    highlight: {\n      true: 'bg-yellow-500',\n    },\n  },\n  parentVariants: {\n    action: {\n      error: 'text-error-800',\n      warning: 'text-warning-800',\n      success: 'text-success-800',\n      info: 'text-info-800',\n      muted: 'text-background-800',\n    },\n  },\n});\n\nconst alertIconStyle = tva({\n  base: 'fill-none',\n  variants: {\n    size: {\n      '2xs': 'h-3 w-3',\n      'xs': 'h-3.5 w-3.5',\n      'sm': 'h-4 w-4',\n      'md': 'h-[18px] w-[18px]',\n      'lg': 'h-5 w-5',\n      'xl': 'h-6 w-6',\n    },\n  },\n  parentVariants: {\n    action: {\n      error: 'text-error-800',\n      warning: 'text-warning-800',\n      success: 'text-success-800',\n      info: 'text-info-800',\n      muted: 'text-background-800',\n    },\n  },\n});\n\nexport const UIAlert = createAlert({\n  Root: withStyleContext(View, SCOPE),\n  Text: Text,\n  Icon: UIIcon,\n});\n\ncssInterop(PrimitiveIcon, {\n  className: {\n    target: 'style',\n    nativeStyleToProp: {\n      height: true,\n      width: true,\n      fill: true,\n      color: 'classNameColor',\n      stroke: true,\n    },\n  },\n});\n\nexport type IAlertProps = Omit<\n  React.ComponentPropsWithoutRef<typeof UIAlert>,\n  'context'\n> &\n  VariantProps<typeof alertStyle>;\n\nconst Alert = React.forwardRef<React.ComponentRef<typeof UIAlert>, IAlertProps>(\n  function Alert(\n    { className, variant = 'solid', action = 'muted', ...props },\n    ref\n  ) {\n    return (\n      <UIAlert\n        className={alertStyle({ action, variant, class: className })}\n        context={{ variant, action }}\n        ref={ref}\n        {...props}\n      />\n    );\n  }\n);\n\nexport type IAlertTextProps = React.ComponentPropsWithoutRef<typeof UIAlert.Text> &\n  VariantProps<typeof alertTextStyle>;\n\nconst AlertText = React.forwardRef<\n  React.ComponentRef<typeof UIAlert.Text>,\n  IAlertTextProps\n>(function AlertText(\n  {\n    className,\n    isTruncated,\n    bold,\n    underline,\n    strikeThrough,\n    size = 'md',\n    sub,\n    italic,\n    highlight,\n    ...props\n  },\n  ref\n) {\n  const { action: parentAction } = useStyleContext(SCOPE);\n  return (\n    <UIAlert.Text\n      className={alertTextStyle({\n        isTruncated,\n        bold,\n        underline,\n        strikeThrough,\n        size,\n        sub,\n        italic,\n        highlight,\n        class: className,\n        parentVariants: {\n          action: parentAction,\n        },\n      })}\n      {...props}\n      ref={ref}\n    />\n  );\n});\n\nexport type IAlertIconProps = React.ComponentPropsWithoutRef<typeof UIAlert.Icon> &\n  VariantProps<typeof alertIconStyle> & {\n    height?: number;\n    width?: number;\n  };\n\nconst AlertIcon = React.forwardRef<\n  React.ComponentRef<typeof UIAlert.Icon>,\n  IAlertIconProps\n>(function AlertIcon({ className, size = 'md', ...props }, ref) {\n  const { action: parentAction } = useStyleContext(SCOPE);\n\n  if (typeof size === 'number') {\n    return (\n      <UIAlert.Icon\n        ref={ref}\n        {...props}\n        className={alertIconStyle({ class: className })}\n        size={size}\n      />\n    );\n  } else if (\n    (props.height !== undefined || props.width !== undefined) &&\n    size === undefined\n  ) {\n    return (\n      <UIAlert.Icon\n        ref={ref}\n        {...props}\n        className={alertIconStyle({ class: className })}\n      />\n    );\n  }\n  return (\n    <UIAlert.Icon\n      className={alertIconStyle({\n        parentVariants: {\n          action: parentAction,\n        },\n        size,\n        class: className,\n      })}\n      {...props}\n      ref={ref}\n    />\n  );\n});\n\nAlert.displayName = 'Alert';\nAlertText.displayName = 'AlertText';\nAlertIcon.displayName = 'AlertIcon';\n\nexport { Alert, AlertText, AlertIcon };\n"],"names":["Alert","AlertText","AlertIcon"],"mappings":"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"}

package/apps/mobile/src/ui/alert-dialog/index.cjs

@@ -0,0 +1,210 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var creator = require('@gluestack-ui/core/alert-dialog/creator');
+var nativewindUtils = require('@gluestack-ui/utils/nativewind-utils');
+var nativewind = require('nativewind');
+var motion = require('@legendapp/motion');
+var reactNative = require('react-native');
+
+const SCOPE = "ALERT_DIALOG";
+const RootComponent = nativewindUtils.withStyleContext(reactNative.View, SCOPE);
+const MotionView = motion.Motion.View;
+const AnimatedPressable = motion.createMotionAnimatedComponent(
+  reactNative.Pressable
+);
+const UIAccessibleAlertDialog = creator.createAlertDialog({
+  Root: RootComponent,
+  Body: reactNative.ScrollView,
+  Content: MotionView,
+  CloseButton: reactNative.Pressable,
+  Header: reactNative.View,
+  Footer: reactNative.View,
+  Backdrop: AnimatedPressable,
+  AnimatePresence: motion.AnimatePresence
+});
+nativewind.cssInterop(MotionView, { className: "style" });
+nativewind.cssInterop(AnimatedPressable, { className: "style" });
+const alertDialogStyle = nativewindUtils.tva({
+  base: "group/modal w-full h-full justify-center items-center web:pointer-events-none",
+  parentVariants: {
+    size: {
+      xs: "",
+      sm: "",
+      md: "",
+      lg: "",
+      full: ""
+    }
+  }
+});
+const alertDialogContentStyle = nativewindUtils.tva({
+  base: "bg-background-0 rounded-lg overflow-hidden border border-outline-100 p-6",
+  parentVariants: {
+    size: {
+      xs: "w-[60%] max-w-[360px]",
+      sm: "w-[70%] max-w-[420px]",
+      md: "w-[80%] max-w-[510px]",
+      lg: "w-[90%] max-w-[640px]",
+      full: "w-full"
+    }
+  }
+});
+const alertDialogCloseButtonStyle = nativewindUtils.tva({
+  base: "group/alert-dialog-close-button z-10 rounded-sm p-2 data-[focus-visible=true]:bg-background-100 web:cursor-pointer outline-0"
+});
+const alertDialogHeaderStyle = nativewindUtils.tva({
+  base: "justify-between items-center flex-row"
+});
+const alertDialogFooterStyle = nativewindUtils.tva({
+  base: "flex-row justify-end items-center gap-3"
+});
+const alertDialogBodyStyle = nativewindUtils.tva({ base: "" });
+const alertDialogBackdropStyle = nativewindUtils.tva({
+  base: "absolute left-0 top-0 right-0 bottom-0 bg-background-dark web:cursor-default"
+});
+const AlertDialog = React.forwardRef(function AlertDialog2({ className, size = "md", ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UIAccessibleAlertDialog,
+    {
+      ref,
+      ...props,
+      className: alertDialogStyle({ class: className }),
+      context: { size },
+      pointerEvents: "box-none"
+    }
+  );
+});
+const AlertDialogContent = React.forwardRef(function AlertDialogContent2({ className, size, ...props }, ref) {
+  const { size: parentSize } = nativewindUtils.useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UIAccessibleAlertDialog.Content,
+    {
+      pointerEvents: "auto",
+      ref,
+      initial: {
+        scale: 0.9,
+        opacity: 0
+      },
+      animate: {
+        scale: 1,
+        opacity: 1
+      },
+      exit: {
+        scale: 0.9,
+        opacity: 0
+      },
+      transition: {
+        type: "spring",
+        damping: 18,
+        stiffness: 250,
+        opacity: {
+          type: "timing",
+          duration: 250
+        }
+      },
+      ...props,
+      className: alertDialogContentStyle({
+        parentVariants: {
+          size: parentSize
+        },
+        size,
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogCloseButton = React.forwardRef(function AlertDialogCloseButton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UIAccessibleAlertDialog.CloseButton,
+    {
+      ref,
+      ...props,
+      className: alertDialogCloseButtonStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogHeader = React.forwardRef(function AlertDialogHeader2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UIAccessibleAlertDialog.Header,
+    {
+      ref,
+      ...props,
+      className: alertDialogHeaderStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogFooter = React.forwardRef(function AlertDialogFooter2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UIAccessibleAlertDialog.Footer,
+    {
+      ref,
+      ...props,
+      className: alertDialogFooterStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogBody = React.forwardRef(function AlertDialogBody2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UIAccessibleAlertDialog.Body,
+    {
+      ref,
+      ...props,
+      className: alertDialogBodyStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogBackdrop = React.forwardRef(function AlertDialogBackdrop2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UIAccessibleAlertDialog.Backdrop,
+    {
+      ref,
+      initial: {
+        opacity: 0
+      },
+      animate: {
+        opacity: 0.5
+      },
+      exit: {
+        opacity: 0
+      },
+      transition: {
+        type: "spring",
+        damping: 18,
+        stiffness: 250,
+        opacity: {
+          type: "timing",
+          duration: 250
+        }
+      },
+      ...props,
+      className: alertDialogBackdropStyle({
+        class: className
+      })
+    }
+  );
+});
+AlertDialog.displayName = "AlertDialog";
+AlertDialogContent.displayName = "AlertDialogContent";
+AlertDialogCloseButton.displayName = "AlertDialogCloseButton";
+AlertDialogHeader.displayName = "AlertDialogHeader";
+AlertDialogFooter.displayName = "AlertDialogFooter";
+AlertDialogBody.displayName = "AlertDialogBody";
+AlertDialogBackdrop.displayName = "AlertDialogBackdrop";
+
+exports.AlertDialog = AlertDialog;
+exports.AlertDialogBackdrop = AlertDialogBackdrop;
+exports.AlertDialogBody = AlertDialogBody;
+exports.AlertDialogCloseButton = AlertDialogCloseButton;
+exports.AlertDialogContent = AlertDialogContent;
+exports.AlertDialogFooter = AlertDialogFooter;
+exports.AlertDialogHeader = AlertDialogHeader;
+//# sourceMappingURL=index.cjs.map

package/apps/mobile/src/ui/alert-dialog/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../../../../../../apps/mobile/src/ui/alert-dialog/index.tsx"],"sourcesContent":["'use client';\nimport React from 'react';\nimport { createAlertDialog } from '@gluestack-ui/core/alert-dialog/creator';\nimport { tva } from '@gluestack-ui/utils/nativewind-utils';\nimport {\n  withStyleContext,\n  useStyleContext,\n} from '@gluestack-ui/utils/nativewind-utils';\n\nimport { cssInterop } from 'nativewind';\nimport type { VariantProps } from '@gluestack-ui/utils/nativewind-utils';\nimport {\n  Motion,\n  AnimatePresence,\n  createMotionAnimatedComponent,\n  MotionComponentProps,\n} from '@legendapp/motion';\nimport { View, Pressable, ScrollView, ViewStyle } from 'react-native';\nimport { IAnimatedPressableProps, IMotionViewProps } from '../';\n\nconst SCOPE = 'ALERT_DIALOG';\n\nconst RootComponent = withStyleContext(View, SCOPE);\n\nconst MotionView = Motion.View as React.ComponentType<IMotionViewProps>;\n\n\nconst AnimatedPressable = createMotionAnimatedComponent(\n  Pressable\n) as React.ComponentType<IAnimatedPressableProps>;\n\nconst UIAccessibleAlertDialog = createAlertDialog({\n  Root: RootComponent,\n  Body: ScrollView,\n  Content: MotionView,\n  CloseButton: Pressable,\n  Header: View,\n  Footer: View,\n  Backdrop: AnimatedPressable,\n  AnimatePresence: AnimatePresence,\n});\n\ncssInterop(MotionView, { className: 'style' });\ncssInterop(AnimatedPressable, { className: 'style' });\n\nconst alertDialogStyle = tva({\n  base: 'group/modal w-full h-full justify-center items-center web:pointer-events-none',\n  parentVariants: {\n    size: {\n      xs: '',\n      sm: '',\n      md: '',\n      lg: '',\n      full: '',\n    },\n  },\n});\n\nconst alertDialogContentStyle = tva({\n  base: 'bg-background-0 rounded-lg overflow-hidden border border-outline-100 p-6',\n  parentVariants: {\n    size: {\n      xs: 'w-[60%] max-w-[360px]',\n      sm: 'w-[70%] max-w-[420px]',\n      md: 'w-[80%] max-w-[510px]',\n      lg: 'w-[90%] max-w-[640px]',\n      full: 'w-full',\n    },\n  },\n});\n\nconst alertDialogCloseButtonStyle = tva({\n  base: 'group/alert-dialog-close-button z-10 rounded-sm p-2 data-[focus-visible=true]:bg-background-100 web:cursor-pointer outline-0',\n});\n\nconst alertDialogHeaderStyle = tva({\n  base: 'justify-between items-center flex-row',\n});\n\nconst alertDialogFooterStyle = tva({\n  base: 'flex-row justify-end items-center gap-3',\n});\n\nconst alertDialogBodyStyle = tva({ base: '' });\n\nconst alertDialogBackdropStyle = tva({\n  base: 'absolute left-0 top-0 right-0 bottom-0 bg-background-dark web:cursor-default',\n});\n\nexport type IAlertDialogProps = React.ComponentPropsWithoutRef<\n  typeof UIAccessibleAlertDialog\n> &\n  VariantProps<typeof alertDialogStyle>;\n\nexport type IAlertDialogContentProps = React.ComponentPropsWithoutRef<\n  typeof UIAccessibleAlertDialog.Content\n> &\n  VariantProps<typeof alertDialogContentStyle> & { className?: string };\n\nexport type IAlertDialogCloseButtonProps = React.ComponentPropsWithoutRef<\n  typeof UIAccessibleAlertDialog.CloseButton\n> &\n  VariantProps<typeof alertDialogCloseButtonStyle>;\n\nexport type IAlertDialogHeaderProps = React.ComponentPropsWithoutRef<\n  typeof UIAccessibleAlertDialog.Header\n> &\n  VariantProps<typeof alertDialogHeaderStyle>;\n\nexport type IAlertDialogFooterProps = React.ComponentPropsWithoutRef<\n  typeof UIAccessibleAlertDialog.Footer\n> &\n  VariantProps<typeof alertDialogFooterStyle>;\n\nexport type IAlertDialogBodyProps = React.ComponentPropsWithoutRef<\n  typeof UIAccessibleAlertDialog.Body\n> &\n  VariantProps<typeof alertDialogBodyStyle>;\n\nexport type IAlertDialogBackdropProps = React.ComponentPropsWithoutRef<\n  typeof UIAccessibleAlertDialog.Backdrop\n> &\n  VariantProps<typeof alertDialogBackdropStyle> & { className?: string };\n\nconst AlertDialog = React.forwardRef<\n  React.ComponentRef<typeof UIAccessibleAlertDialog>,\n  IAlertDialogProps\n>(function AlertDialog({ className, size = 'md', ...props }, ref) {\n  return (\n    <UIAccessibleAlertDialog\n      ref={ref}\n      {...props}\n      className={alertDialogStyle({ class: className })}\n      context={{ size }}\n      pointerEvents=\"box-none\"\n    />\n  );\n});\n\nconst AlertDialogContent = React.forwardRef<\n  React.ComponentRef<typeof UIAccessibleAlertDialog.Content>,\n  IAlertDialogContentProps\n>(function AlertDialogContent({ className, size, ...props }, ref) {\n  const { size: parentSize } = useStyleContext(SCOPE);\n\n  return (\n    <UIAccessibleAlertDialog.Content\n      pointerEvents=\"auto\"\n      ref={ref}\n      initial={{\n        scale: 0.9,\n        opacity: 0,\n      }}\n      animate={{\n        scale: 1,\n        opacity: 1,\n      }}\n      exit={{\n        scale: 0.9,\n        opacity: 0,\n      }}\n      transition={{\n        type: 'spring',\n        damping: 18,\n        stiffness: 250,\n        opacity: {\n          type: 'timing',\n          duration: 250,\n        },\n      }}\n      {...props}\n      className={alertDialogContentStyle({\n        parentVariants: {\n          size: parentSize,\n        },\n        size,\n        class: className,\n      })}\n    />\n  );\n});\n\nconst AlertDialogCloseButton = React.forwardRef<\n  React.ComponentRef<typeof UIAccessibleAlertDialog.CloseButton>,\n  IAlertDialogCloseButtonProps\n>(function AlertDialogCloseButton({ className, ...props }, ref) {\n  return (\n    <UIAccessibleAlertDialog.CloseButton\n      ref={ref}\n      {...props}\n      className={alertDialogCloseButtonStyle({\n        class: className,\n      })}\n    />\n  );\n});\n\nconst AlertDialogHeader = React.forwardRef<\n  React.ComponentRef<typeof UIAccessibleAlertDialog.Header>,\n  IAlertDialogHeaderProps\n>(function AlertDialogHeader({ className, ...props }, ref) {\n  return (\n    <UIAccessibleAlertDialog.Header\n      ref={ref}\n      {...props}\n      className={alertDialogHeaderStyle({\n        class: className,\n      })}\n    />\n  );\n});\n\nconst AlertDialogFooter = React.forwardRef<\n  React.ComponentRef<typeof UIAccessibleAlertDialog.Footer>,\n  IAlertDialogFooterProps\n>(function AlertDialogFooter({ className, ...props }, ref) {\n  return (\n    <UIAccessibleAlertDialog.Footer\n      ref={ref}\n      {...props}\n      className={alertDialogFooterStyle({\n        class: className,\n      })}\n    />\n  );\n});\n\nconst AlertDialogBody = React.forwardRef<\n  React.ComponentRef<typeof UIAccessibleAlertDialog.Body>,\n  IAlertDialogBodyProps\n>(function AlertDialogBody({ className, ...props }, ref) {\n  return (\n    <UIAccessibleAlertDialog.Body\n      ref={ref}\n      {...props}\n      className={alertDialogBodyStyle({\n        class: className,\n      })}\n    />\n  );\n});\n\nconst AlertDialogBackdrop = React.forwardRef<\n  React.ComponentRef<typeof UIAccessibleAlertDialog.Backdrop>,\n  IAlertDialogBackdropProps\n>(function AlertDialogBackdrop({ className, ...props }, ref) {\n  return (\n    <UIAccessibleAlertDialog.Backdrop\n      ref={ref}\n      initial={{\n        opacity: 0,\n      }}\n      animate={{\n        opacity: 0.5,\n      }}\n      exit={{\n        opacity: 0,\n      }}\n      transition={{\n        type: 'spring',\n        damping: 18,\n        stiffness: 250,\n        opacity: {\n          type: 'timing',\n          duration: 250,\n        },\n      }}\n      {...props}\n      className={alertDialogBackdropStyle({\n        class: className,\n      })}\n    />\n  );\n});\n\nAlertDialog.displayName = 'AlertDialog';\nAlertDialogContent.displayName = 'AlertDialogContent';\nAlertDialogCloseButton.displayName = 'AlertDialogCloseButton';\nAlertDialogHeader.displayName = 'AlertDialogHeader';\nAlertDialogFooter.displayName = 'AlertDialogFooter';\nAlertDialogBody.displayName = 'AlertDialogBody';\nAlertDialogBackdrop.displayName = 'AlertDialogBackdrop';\n\nexport {\n  AlertDialog,\n  AlertDialogContent,\n  AlertDialogCloseButton,\n  AlertDialogHeader,\n  AlertDialogFooter,\n  AlertDialogBody,\n  AlertDialogBackdrop,\n};\n"],"names":["withStyleContext","View","Motion","createMotionAnimatedComponent","Pressable","createAlertDialog","ScrollView","AnimatePresence","cssInterop","tva","AlertDialog","jsx","AlertDialogContent","useStyleContext","AlertDialogCloseButton","AlertDialogHeader","AlertDialogFooter","AlertDialogBody","AlertDialogBackdrop"],"mappings":"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"}

package/apps/mobile/src/ui/alert-dialog/index.js

@@ -0,0 +1,202 @@
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { createAlertDialog } from '@gluestack-ui/core/alert-dialog/creator';
+import { withStyleContext, tva, useStyleContext } from '@gluestack-ui/utils/nativewind-utils';
+import { cssInterop } from 'nativewind';
+import { Motion, createMotionAnimatedComponent, AnimatePresence } from '@legendapp/motion';
+import { View, Pressable, ScrollView } from 'react-native';
+
+const SCOPE = "ALERT_DIALOG";
+const RootComponent = withStyleContext(View, SCOPE);
+const MotionView = Motion.View;
+const AnimatedPressable = createMotionAnimatedComponent(
+  Pressable
+);
+const UIAccessibleAlertDialog = createAlertDialog({
+  Root: RootComponent,
+  Body: ScrollView,
+  Content: MotionView,
+  CloseButton: Pressable,
+  Header: View,
+  Footer: View,
+  Backdrop: AnimatedPressable,
+  AnimatePresence
+});
+cssInterop(MotionView, { className: "style" });
+cssInterop(AnimatedPressable, { className: "style" });
+const alertDialogStyle = tva({
+  base: "group/modal w-full h-full justify-center items-center web:pointer-events-none",
+  parentVariants: {
+    size: {
+      xs: "",
+      sm: "",
+      md: "",
+      lg: "",
+      full: ""
+    }
+  }
+});
+const alertDialogContentStyle = tva({
+  base: "bg-background-0 rounded-lg overflow-hidden border border-outline-100 p-6",
+  parentVariants: {
+    size: {
+      xs: "w-[60%] max-w-[360px]",
+      sm: "w-[70%] max-w-[420px]",
+      md: "w-[80%] max-w-[510px]",
+      lg: "w-[90%] max-w-[640px]",
+      full: "w-full"
+    }
+  }
+});
+const alertDialogCloseButtonStyle = tva({
+  base: "group/alert-dialog-close-button z-10 rounded-sm p-2 data-[focus-visible=true]:bg-background-100 web:cursor-pointer outline-0"
+});
+const alertDialogHeaderStyle = tva({
+  base: "justify-between items-center flex-row"
+});
+const alertDialogFooterStyle = tva({
+  base: "flex-row justify-end items-center gap-3"
+});
+const alertDialogBodyStyle = tva({ base: "" });
+const alertDialogBackdropStyle = tva({
+  base: "absolute left-0 top-0 right-0 bottom-0 bg-background-dark web:cursor-default"
+});
+const AlertDialog = React.forwardRef(function AlertDialog2({ className, size = "md", ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    UIAccessibleAlertDialog,
+    {
+      ref,
+      ...props,
+      className: alertDialogStyle({ class: className }),
+      context: { size },
+      pointerEvents: "box-none"
+    }
+  );
+});
+const AlertDialogContent = React.forwardRef(function AlertDialogContent2({ className, size, ...props }, ref) {
+  const { size: parentSize } = useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsx(
+    UIAccessibleAlertDialog.Content,
+    {
+      pointerEvents: "auto",
+      ref,
+      initial: {
+        scale: 0.9,
+        opacity: 0
+      },
+      animate: {
+        scale: 1,
+        opacity: 1
+      },
+      exit: {
+        scale: 0.9,
+        opacity: 0
+      },
+      transition: {
+        type: "spring",
+        damping: 18,
+        stiffness: 250,
+        opacity: {
+          type: "timing",
+          duration: 250
+        }
+      },
+      ...props,
+      className: alertDialogContentStyle({
+        parentVariants: {
+          size: parentSize
+        },
+        size,
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogCloseButton = React.forwardRef(function AlertDialogCloseButton2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    UIAccessibleAlertDialog.CloseButton,
+    {
+      ref,
+      ...props,
+      className: alertDialogCloseButtonStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogHeader = React.forwardRef(function AlertDialogHeader2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    UIAccessibleAlertDialog.Header,
+    {
+      ref,
+      ...props,
+      className: alertDialogHeaderStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogFooter = React.forwardRef(function AlertDialogFooter2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    UIAccessibleAlertDialog.Footer,
+    {
+      ref,
+      ...props,
+      className: alertDialogFooterStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogBody = React.forwardRef(function AlertDialogBody2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    UIAccessibleAlertDialog.Body,
+    {
+      ref,
+      ...props,
+      className: alertDialogBodyStyle({
+        class: className
+      })
+    }
+  );
+});
+const AlertDialogBackdrop = React.forwardRef(function AlertDialogBackdrop2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    UIAccessibleAlertDialog.Backdrop,
+    {
+      ref,
+      initial: {
+        opacity: 0
+      },
+      animate: {
+        opacity: 0.5
+      },
+      exit: {
+        opacity: 0
+      },
+      transition: {
+        type: "spring",
+        damping: 18,
+        stiffness: 250,
+        opacity: {
+          type: "timing",
+          duration: 250
+        }
+      },
+      ...props,
+      className: alertDialogBackdropStyle({
+        class: className
+      })
+    }
+  );
+});
+AlertDialog.displayName = "AlertDialog";
+AlertDialogContent.displayName = "AlertDialogContent";
+AlertDialogCloseButton.displayName = "AlertDialogCloseButton";
+AlertDialogHeader.displayName = "AlertDialogHeader";
+AlertDialogFooter.displayName = "AlertDialogFooter";
+AlertDialogBody.displayName = "AlertDialogBody";
+AlertDialogBackdrop.displayName = "AlertDialogBackdrop";
+
+export { AlertDialog, AlertDialogBackdrop, AlertDialogBody, AlertDialogCloseButton, AlertDialogContent, AlertDialogFooter, AlertDialogHeader };
+//# sourceMappingURL=index.js.map