@multiplatform.one/forms 6.1.0 → 6.3.0

package/types/types.d.ts

@@ -0,0 +1,133 @@
+import type { Href } from "@multiplatform.one/router";
+import type { FieldApi } from "@tanstack/form-core";
+import type { FormApi } from "@tanstack/react-form";
+import type { ReactNode } from "react";
+/** Resolves a field value to a Link href. Returns null for no link. */
+export type LinkResolver = (value: unknown) => Href | null;
+/** Resolves a ChildTable cell value to a Link href. Per-column. */
+export type ChildTableLinkResolver<TRow> = (value: unknown, row: TRow, rowIndex: number) => Href | null;
+/**
+ * Compatibility type for Validator which doesn't exist in v1.
+ * Using `any` because TanStack Form's validator types are complex and require flexibility.
+ */
+export type Validator<_TData, _TError = unknown> = any;
+/**
+ * Simplified FieldApi type that covers the most common use cases.
+ * TanStack Form v1 has 23 generic parameters on FieldApi, making it impractical
+ * to fully type in most situations. This simplified version captures the
+ * essential API surface for field components.
+ */
+export type AnyFieldApi<TValue = unknown> = FieldApi<Record<string, unknown>, // TParentData
+string, // TName
+TValue, // TData
+undefined, // TOnMount
+undefined, // TOnChange
+undefined, // TOnChangeAsync
+undefined, // TOnBlur
+undefined, // TOnBlurAsync
+undefined, // TOnSubmit
+undefined, // TOnSubmitAsync
+undefined, // TOnDynamic
+undefined, // TOnDynamicAsync
+undefined, // TFormOnMount
+undefined, // TFormOnChange
+undefined, // TFormOnChangeAsync
+undefined, // TFormOnBlur
+undefined, // TFormOnBlurAsync
+undefined, // TFormOnSubmit
+undefined, // TFormOnSubmitAsync
+undefined, // TFormOnDynamic
+undefined, // TFormOnDynamicAsync
+undefined, // TFormOnServer
+unknown>;
+/**
+ * Minimal form interface that captures the essential methods used by field components.
+ * This avoids the complex generic variance issues with FormApi's 12+ type parameters.
+ */
+export interface MinimalFormApi<TData = Record<string, unknown>> {
+    store?: {
+        state?: {
+            values?: TData;
+        };
+    };
+    getFieldMeta?: (fieldName: string) => {
+        errors?: readonly (string | undefined)[];
+    } | undefined;
+    setFieldValue?: (field: string, value: unknown) => void;
+}
+/**
+ * AnyFormApi accepts any FormApi instance regardless of validator configuration.
+ *
+ * TanStack Form's FormApi has 12+ type parameters for validators, and TypeScript's
+ * variance rules make it impossible to create a permissive type using `unknown`.
+ * Using `any` for validator parameters is the only way to accept forms with any
+ * validator configuration while maintaining the TData type parameter for type safety.
+ */
+export type AnyFormApi<TData = Record<string, unknown>> = FormApi<TData, any, any, any, any, any, any, any, any, any, any, any>;
+/**
+ * Type-safe field state from TanStack Form FieldApi.
+ */
+export interface FieldState<TValue = unknown> {
+    value: TValue;
+    meta: {
+        errors: readonly (string | undefined)[];
+        errorMap: Record<string, string | undefined>;
+        isValidating: boolean;
+        isTouched: boolean;
+        isDirty: boolean;
+        isPristine: boolean;
+    };
+}
+/**
+ * Essential field API methods used by field components.
+ * This captures the runtime API surface without the complex generic constraints.
+ */
+export interface SimpleFieldApi<TValue = unknown> {
+    state: FieldState<TValue>;
+    handleChange: (value: TValue) => void;
+    handleBlur: () => void;
+    getValue: () => TValue;
+    setValue: (value: TValue) => void;
+    name: string;
+}
+export interface FieldComponentProps<_TParentData = Record<string, unknown>, TName extends string = string, _TFieldValidator = any, _TFormValidator = any, TData = unknown> {
+    children?: ReactNode;
+    form?: FormApi<any, any, any, any, any, any, any, any, any, any, any, any>;
+    mode?: "value" | "array";
+    name?: TName;
+    defaultValue?: TData;
+    preserveValue?: boolean;
+    validators?: any;
+}
+/**
+ * Web-specific HTML input type attribute values.
+ * These are valid HTML5 input types that may not be typed in React Native UI libraries.
+ */
+export type WebInputType = "text" | "password" | "email" | "number" | "tel" | "url" | "search" | "date" | "datetime-local" | "time" | "month" | "week" | "color" | "file" | "hidden" | "range";
+/**
+ * Web-specific HTML input mode attribute values.
+ * Controls which keyboard is shown on mobile devices.
+ */
+export type WebInputMode = "none" | "text" | "decimal" | "numeric" | "tel" | "search" | "email" | "url";
+/**
+ * Web-specific HTML input attributes that may not be typed in cross-platform UI libraries.
+ * Use spread to pass these to Input components: {...webInputProps}
+ */
+export interface WebInputProps {
+    type?: WebInputType;
+    inputMode?: WebInputMode;
+    autoComplete?: string;
+    pattern?: string;
+    min?: string | number;
+    max?: string | number;
+    step?: string | number;
+    list?: string;
+    multiple?: boolean;
+    accept?: string;
+}
+/**
+ * Color value that can be either a theme token (e.g., "$red10") or a raw CSS color.
+ * This allows dynamic colors while maintaining type safety.
+ */
+export type ColorValue = `$${string}` | `#${string}` | `rgb(${string})` | `rgba(${string})` | `hsl(${string})` | `hsla(${string})` | "transparent" | "inherit" | "currentColor";
+//# sourceMappingURL=types.d.ts.map

package/types/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/types/utils/LinkCell.d.ts

@@ -0,0 +1,17 @@
+/**
+ * LinkCell — renders content as Link when linkResolver returns href, else plain.
+ *
+ * Used for field-level and ChildTable cell-level link behavior.
+ * Forms package uses Link from @multiplatform.one/router; consumers must provide
+ * router context if linkResolver is used.
+ */
+import type { Href } from "@multiplatform.one/router";
+import type { ReactNode } from "react";
+export interface LinkCellFieldProps {
+    value: unknown;
+    linkResolver: (value: unknown) => Href | null;
+    children: ReactNode;
+}
+/** Field-level: wrap display value in Link when linkResolver returns href. */
+export declare function LinkCell({ value, linkResolver, children }: LinkCellFieldProps): ReactNode;
+//# sourceMappingURL=LinkCell.d.ts.map

package/types/utils/LinkCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkCell.d.ts","sourceRoot":"","sources":["../../src/utils/LinkCell.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,OAAO,CAAC;IACf,YAAY,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,GAAG,IAAI,CAAC;IAC9C,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,8EAA8E;AAC9E,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,kBAAkB,GAAG,SAAS,CAWzF"}

package/dist/cjs/AdaptivePopup/AdaptivePopup.stories.cjs

@@ -1,257 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
-};
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
-var AdaptivePopup_stories_exports = {};
-__export(AdaptivePopup_stories_exports, {
-  Disabled: () => Disabled,
-  Fullscreen: () => Fullscreen,
-  Main: () => Main,
-  NoCloseButton: () => NoCloseButton,
-  Sizes: () => Sizes,
-  WithoutTrigger: () => WithoutTrigger,
-  default: () => AdaptivePopup_stories_default
-});
-module.exports = __toCommonJS(AdaptivePopup_stories_exports);
-var import_storybook = require("@multiplatform.one/storybook");
-var import_react = require("react");
-var import_tamagui = require("tamagui");
-var import_Button = require("../Button/index.cjs");
-var import_Input = require("../fields/Input/index.cjs");
-var import_index = require("./index.cjs");
-var import_jsx_runtime = require("react/jsx-runtime");
-const meta = {
-  title: "Forms/AdaptivePopup",
-  component: import_index.AdaptivePopup,
-  parameters: {
-    docs: {
-      description: {
-        component: "A responsive popup component that renders as a bottom Sheet on mobile/small screens and a centered Dialog on desktop. Resize your browser to see the adaptive behavior."
-      }
-    }
-  },
-  argTypes: {
-    size: {
-      control: "select",
-      options: ["sm", "md", "lg", "xl", "fullscreen"]
-    },
-    title: {
-      control: "text"
-    },
-    description: {
-      control: "text"
-    },
-    showCloseButton: {
-      control: "boolean"
-    },
-    disabled: {
-      control: "boolean"
-    }
-  }
-};
-var AdaptivePopup_stories_default = meta;
-const Main = {
-  name: "Main",
-  render: () => {
-    const Example = () => {
-      const [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Edit Profile",
-        description: "Make changes to your profile here.",
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Open Popup"
-        }),
-        footer: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-          gap: "$2",
-          justifyContent: "flex-end",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            chromeless: true,
-            onPress: () => setOpen(false),
-            children: "Cancel"
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            onPress: () => setOpen(false),
-            children: "Save"
-          })]
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-          gap: "$3",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Input.Input, {
-            label: "Name",
-            placeholder: "Enter your name"
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Input.Input, {
-            label: "Email",
-            placeholder: "Enter your email"
-          })]
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-const Sizes = {
-  render: () => {
-    const SizeExample = ({
-      size
-    }) => {
-      const [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: `Size: ${size}`,
-        size,
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: size
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.Paragraph, {
-          children: ['This popup uses size="', size, '". On desktop this controls the max-width. On mobile it always renders as a sheet.']
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-      gap: "$2",
-      flexWrap: "wrap",
-      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "sm"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "md"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "lg"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "xl"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "fullscreen"
-      })]
-    });
-  }
-};
-const Fullscreen = {
-  render: () => {
-    const Example = () => {
-      const [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Fullscreen View",
-        size: "fullscreen",
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Open Fullscreen"
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-          flex: 1,
-          backgroundColor: "$color3",
-          borderRadius: "$2",
-          padding: "$4",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-            children: "This content fills the available space."
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-            color: "$color9",
-            marginTop: "$2",
-            children: "Great for maps, image viewers, or any content that benefits from more space."
-          })]
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-const WithoutTrigger = {
-  render: () => {
-    const Example = () => {
-      const [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-        gap: "$3",
-        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-          children: "Control the popup externally without using the trigger prop:"
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          onPress: () => setOpen(true),
-          children: "Open via external state"
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-          open,
-          onOpenChange: setOpen,
-          title: "Externally Controlled",
-          description: "This popup was opened via external state management.",
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
-            children: "Useful when you need to open the popup from multiple places or in response to async events."
-          })
-        })]
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-const NoCloseButton = {
-  render: () => {
-    const Example = () => {
-      const [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Confirmation",
-        showCloseButton: false,
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Delete Item"
-        }),
-        footer: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-          gap: "$2",
-          justifyContent: "flex-end",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            chromeless: true,
-            onPress: () => setOpen(false),
-            children: "Cancel"
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            backgroundColor: "$red9",
-            onPress: () => {
-              (0, import_storybook.action)("delete")();
-              setOpen(false);
-            },
-            children: "Delete"
-          })]
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
-          children: "Are you sure you want to delete this item? This action cannot be undone."
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-const Disabled = {
-  render: () => {
-    const Example = () => {
-      const [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Disabled",
-        disabled: true,
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Disabled Trigger"
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
-          children: "You should not see this."
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};

package/dist/cjs/AdaptivePopup/AdaptivePopup.stories.native.js

@@ -1,269 +0,0 @@
-"use strict";
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
-};
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
-var AdaptivePopup_stories_exports = {};
-__export(AdaptivePopup_stories_exports, {
-  Disabled: () => Disabled,
-  Fullscreen: () => Fullscreen,
-  Main: () => Main,
-  NoCloseButton: () => NoCloseButton,
-  Sizes: () => Sizes,
-  WithoutTrigger: () => WithoutTrigger,
-  default: () => AdaptivePopup_stories_default
-});
-module.exports = __toCommonJS(AdaptivePopup_stories_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_storybook = require("@multiplatform.one/storybook");
-var import_react = require("react");
-var import_tamagui = require("tamagui");
-var import_Button = require("../Button/index.native.js");
-var import_Input = require("../fields/Input/index.native.js");
-var import_index = require("./index.native.js");
-var meta = {
-  title: "Forms/AdaptivePopup",
-  component: import_index.AdaptivePopup,
-  parameters: {
-    docs: {
-      description: {
-        component: "A responsive popup component that renders as a bottom Sheet on mobile/small screens and a centered Dialog on desktop. Resize your browser to see the adaptive behavior."
-      }
-    }
-  },
-  argTypes: {
-    size: {
-      control: "select",
-      options: ["sm", "md", "lg", "xl", "fullscreen"]
-    },
-    title: {
-      control: "text"
-    },
-    description: {
-      control: "text"
-    },
-    showCloseButton: {
-      control: "boolean"
-    },
-    disabled: {
-      control: "boolean"
-    }
-  }
-};
-var AdaptivePopup_stories_default = meta;
-var Main = {
-  name: "Main",
-  render: function render() {
-    var Example = function Example2() {
-      var [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Edit Profile",
-        description: "Make changes to your profile here.",
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Open Popup"
-        }),
-        footer: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-          gap: "$2",
-          justifyContent: "flex-end",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            chromeless: true,
-            onPress: function onPress() {
-              return setOpen(false);
-            },
-            children: "Cancel"
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            onPress: function onPress() {
-              return setOpen(false);
-            },
-            children: "Save"
-          })]
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-          gap: "$3",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Input.Input, {
-            label: "Name",
-            placeholder: "Enter your name"
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Input.Input, {
-            label: "Email",
-            placeholder: "Enter your email"
-          })]
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-var Sizes = {
-  render: function render2() {
-    var SizeExample = function SizeExample2(param) {
-      var {
-        size
-      } = param;
-      var [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: `Size: ${size}`,
-        size,
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: size
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.Paragraph, {
-          children: ['This popup uses size="', size, '". On desktop this controls the max-width. On mobile it always renders as a sheet.']
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-      gap: "$2",
-      flexWrap: "wrap",
-      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "sm"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "md"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "lg"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "xl"
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SizeExample, {
-        size: "fullscreen"
-      })]
-    });
-  }
-};
-var Fullscreen = {
-  render: function render3() {
-    var Example = function Example2() {
-      var [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Fullscreen View",
-        size: "fullscreen",
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Open Fullscreen"
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-          flex: 1,
-          backgroundColor: "$color3",
-          borderRadius: "$2",
-          padding: "$4",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-            children: "This content fills the available space."
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-            color: "$color9",
-            marginTop: "$2",
-            children: "Great for maps, image viewers, or any content that benefits from more space."
-          })]
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-var WithoutTrigger = {
-  render: function render4() {
-    var Example = function Example2() {
-      var [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-        gap: "$3",
-        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-          children: "Control the popup externally without using the trigger prop:"
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          onPress: function onPress() {
-            return setOpen(true);
-          },
-          children: "Open via external state"
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-          open,
-          onOpenChange: setOpen,
-          title: "Externally Controlled",
-          description: "This popup was opened via external state management.",
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
-            children: "Useful when you need to open the popup from multiple places or in response to async events."
-          })
-        })]
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-var NoCloseButton = {
-  render: function render5() {
-    var Example = function Example2() {
-      var [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Confirmation",
-        showCloseButton: false,
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Delete Item"
-        }),
-        footer: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-          gap: "$2",
-          justifyContent: "flex-end",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            chromeless: true,
-            onPress: function onPress() {
-              return setOpen(false);
-            },
-            children: "Cancel"
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-            backgroundColor: "$red9",
-            onPress: function onPress() {
-              (0, import_storybook.action)("delete")();
-              setOpen(false);
-            },
-            children: "Delete"
-          })]
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
-          children: "Are you sure you want to delete this item? This action cannot be undone."
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-var Disabled = {
-  render: function render6() {
-    var Example = function Example2() {
-      var [open, setOpen] = (0, import_react.useState)(false);
-      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.AdaptivePopup, {
-        open,
-        onOpenChange: setOpen,
-        title: "Disabled",
-        disabled: true,
-        trigger: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
-          children: "Disabled Trigger"
-        }),
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
-          children: "You should not see this."
-        })
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Example, {});
-  }
-};
-//# sourceMappingURL=AdaptivePopup.stories.native.js.map