@g9tm/lynxcontrols 0.0.0-stage → 1.4.2

package/dist/plus-button/plus-button.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"plus-button/plus-button.jsx","sources":["../../src/plus-button/plus-button.tsx"],"sourcesContent":["import './plus-button.css';\nimport { type ReactNode, useEffect, useRef } from '@lynx-js/react';\nimport { startTimer, stopTimer } from '../base/timers';\nimport { useControllableState } from '../base/use-controllable-state';\nimport { G9Icon } from '../icon/icon';\nimport { useG9Direction, useG9Executor } from '../provider/hooks';\nimport {\n  type G9PlusButtonItem,\n  type G9PlusButtonTiming,\n  g9PlusButtonDefaults,\n  plusButtonHitHeight,\n  plusButtonSchedule,\n} from './model';\n\n/** Imperative handle of a plus button (MAUI `ToggleAsync`), from {@link usePlusButton}. */\nexport interface G9PlusButtonController {\n  /** Toggles expanded / collapsed; resolves when the sequence has settled. Retargets a running sequence. */\n  toggle(): Promise<void>;\n  readonly isExpanded: boolean;\n  /** @internal set by the mounted button */\n  bind(target: { toggle(): Promise<void>; expanded(): boolean }): () => void;\n}\n\n/** Creates a controller outside React. */\nexport function createPlusButtonController(): G9PlusButtonController {\n  let target: { toggle(): Promise<void>; expanded(): boolean } | null = null;\n  return {\n    toggle: () => (target ? target.toggle() : Promise.resolve()),\n    get isExpanded() {\n      return target ? target.expanded() : false;\n    },\n    bind(next) {\n      target = next;\n      return () => {\n        if (target === next) target = null;\n      };\n    },\n  };\n}\n\n/** A stable controller for a `G9PlusButton`. */\nexport function usePlusButton(): G9PlusButtonController {\n  const ref = useRef<G9PlusButtonController | null>(null);\n  if (ref.current === null) ref.current = createPlusButtonController();\n  return ref.current;\n}\n\n/** Props of {@link G9PlusButton}: the items, the state, and every MAUI size / timing property. */\nexport interface G9PlusButtonProps extends Partial<G9PlusButtonTiming> {\n  /** Menu entries, bottom (closest to the button) first (MAUI `Items`). */\n  readonly items: readonly G9PlusButtonItem[];\n  /** Controlled expanded state. */\n  readonly expanded?: boolean;\n  readonly defaultExpanded?: boolean;\n  readonly onExpandedChange?: (expanded: boolean) => void;\n  readonly controller?: G9PlusButtonController;\n  /** Menu side and label direction (MAUI `MenuFlowDirection`). Default: the app direction. */\n  readonly menuFlowDirection?: 'ltr' | 'rtl';\n  readonly className?: string;\n}\n\nconst CUBIC_OUT = 'cubic-bezier(0.215, 0.61, 0.355, 1)';\n\n/**\n * A round add button that unfolds a column of labelled actions (MAUI `G9PlusButton`): the button shrinks and its plus\n * turns into a ×, then each item slides up, grows its label pill and fades its label in, staggered; collapsing plays\n * it backwards. Every size and timing is a prop with the MAUI default. Item actions run through the safe executor.\n */\nexport function G9PlusButton(props: G9PlusButtonProps): ReactNode {\n  const timing: G9PlusButtonTiming = { ...g9PlusButtonDefaults };\n  for (const key of Object.keys(g9PlusButtonDefaults) as Array<keyof G9PlusButtonTiming>) {\n    const value = props[key];\n    if (value !== undefined) (timing as unknown as Record<string, number>)[key] = value;\n  }\n  const [expanded, setExpanded] = useControllableState<boolean>({\n    value: props.expanded,\n    defaultValue: props.defaultExpanded ?? false,\n    onChange: props.onExpandedChange,\n    name: 'G9PlusButton.expanded',\n  });\n  const appRtl = useG9Direction() === 'rtl';\n  const rtl = (props.menuFlowDirection ?? (appRtl ? 'rtl' : 'ltr')) === 'rtl';\n  const executor = useG9Executor();\n  const items = props.items;\n  const schedule = plusButtonSchedule(timing, items.length, expanded);\n\n  // ToggleAsync: resolves when the sequence it started has settled (a newer toggle settles the older one early).\n  const settle = useRef<{ timer: ReturnType<typeof startTimer> | null; resolve: (() => void) | null }>({\n    timer: null,\n    resolve: null,\n  });\n  const latest = useRef<{ expanded: boolean; totalOf: (next: boolean) => number }>(null as never);\n  latest.current = { expanded, totalOf: (next: boolean) => plusButtonSchedule(timing, items.length, next).totalMs };\n  const toggle = (): Promise<void> => {\n    const next = !latest.current.expanded;\n    latest.current = { ...latest.current, expanded: next };\n    stopTimer(settle.current.timer);\n    settle.current.resolve?.();\n    setExpanded(next);\n    return new Promise<void>((resolve) => {\n      settle.current.resolve = resolve;\n      settle.current.timer = startTimer(() => {\n        settle.current.resolve = null;\n        resolve();\n      }, latest.current.totalOf(next));\n    });\n  };\n  useEffect(() => props.controller?.bind({ toggle, expanded: () => latest.current.expanded }), [props.controller]);\n  useEffect(\n    () => () => {\n      stopTimer(settle.current.timer);\n      settle.current.resolve?.();\n    },\n    [],\n  );\n\n  const select = (item: G9PlusButtonItem) => {\n    void executor.run(\n      async () => {\n        await item.onSelected(item);\n        if (item.closeMenuOnSelect !== false && latest.current.expanded) await toggle();\n      },\n      { source: 'G9PlusButtonItem', showErrorPopup: true },\n    );\n  };\n\n  const size = expanded ? timing.mainSizeExpanded : timing.mainSizeCollapsed;\n  const main = schedule.main;\n  const side = rtl ? 'right' : 'left';\n  return (\n    <view\n      className={`g9-plus-button${expanded ? ' g9-plus-button--expanded' : ''} ${props.className ?? ''}`}\n      style={{\n        width: `${timing.mainSizeCollapsed + (expanded ? timing.textBorderTargetWidth : 0)}px`,\n        height: `${plusButtonHitHeight(timing, items.length, expanded)}px`,\n      }}\n    >\n      <view className=\"g9-plus-button__items\" style={{ [side]: '0px' }}>\n        {items.map((item, i) => {\n          const s = schedule.items[i] as (typeof schedule.items)[number];\n          return (\n            <view\n              key={`${i}-${item.text}`}\n              className=\"g9-plus-button__item\"\n              style={{\n                [side]: '0px',\n                transform: `translateY(${expanded ? -timing.itemVerticalOffset * (i + 1) : 0}px)`,\n                transition: `transform ${s.slide.duration}ms ${CUBIC_OUT} ${s.slide.delay}ms`,\n                flexDirection: rtl ? 'row-reverse' : 'row',\n              }}\n              accessibility-element={expanded}\n              accessibility-traits=\"button\"\n              accessibility-label={item.text}\n              bindtap={expanded ? () => select(item) : undefined}\n            >\n              <view\n                className=\"g9-plus-button__pill\"\n                style={{\n                  width: `${expanded ? timing.textBorderTargetWidth : 0}px`,\n                  [side]: '26px',\n                  borderRadius: rtl ? '29px 9px 9px 29px' : '9px 29px 29px 9px',\n                  transition: `width ${s.pill.duration}ms ${CUBIC_OUT} ${s.pill.delay}ms`,\n                }}\n              >\n                <text\n                  className=\"g9-plus-button__label\"\n                  text-maxline=\"1\"\n                  style={{\n                    [rtl ? 'marginRight' : 'marginLeft']: '25px',\n                    opacity: expanded ? 1 : 0,\n                    transition: `opacity ${s.label.duration}ms ease-out ${s.label.delay}ms`,\n                  }}\n                >\n                  {item.text}\n                </text>\n              </view>\n              <view className=\"g9-plus-button__item-icon\">\n                <G9Icon icon={item.icon} size={32} color=\"var(--g9-on-primary)\" />\n              </view>\n            </view>\n          );\n        })}\n      </view>\n      <view\n        className=\"g9-plus-button__main\"\n        style={{\n          [side]: '0px',\n          width: `${size}px`,\n          height: `${size}px`,\n          borderRadius: `${size / 2}px`,\n          transition: `width ${main.duration}ms ${CUBIC_OUT} ${main.delay}ms, height ${main.duration}ms ${CUBIC_OUT} ${main.delay}ms`,\n        }}\n        accessibility-element\n        accessibility-traits=\"button\"\n        bindtap={() => void toggle()}\n      >\n        <view\n          className=\"g9-plus-button__main-icon\"\n          style={{\n            transform: `rotate(${expanded ? timing.mainIconRotationExpanded : 0}deg)`,\n            transition: `transform ${main.duration}ms ${CUBIC_OUT} ${main.delay}ms`,\n          }}\n        >\n          <G9Icon icon=\"plus\" size={40} color=\"var(--g9-on-primary)\" />\n        </view>\n      </view>\n    </view>\n  );\n}\n"],"names":["createPlusButtonController","target","Promise","next","usePlusButton","ref","useRef","CUBIC_OUT","G9PlusButton","props","_props_defaultExpanded","_props_menuFlowDirection","_props_className","timing","g9PlusButtonDefaults","key","Object","value","undefined","expanded","setExpanded","useControllableState","appRtl","useG9Direction","rtl","executor","useG9Executor","items","schedule","plusButtonSchedule","settle","latest","toggle","_settle_current","stopTimer","resolve","startTimer","useEffect","_props_controller","select","item","size","main","side","view","plusButtonHitHeight","i","s","text","G9Icon"],"mappings":"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"}

package/dist/popup/frame.d.ts

@@ -0,0 +1,101 @@
+import './popup.css';
+import { type ReactNode } from '@lynx-js/react';
+import type { G9PopupAnimationEasing, G9PopupAnimationType, G9PopupAutoSizeMode, G9PopupBlurIntensity, G9PopupOverlayMode, G9PopupRelativePosition } from './types.js';
+/** A rectangle in host coordinates (px), e.g. an anchor's `boundingClientRect`. */
+export interface G9Rect {
+    readonly left: number;
+    readonly top: number;
+    readonly width: number;
+    readonly height: number;
+}
+/** How one popup card opens (MAUI `G9PopupViewOpenOptions`). */
+export interface G9PopupViewOpenOptions {
+    /** Card width (px); unset = the auto-size mode decides (90 % of the host for centred `height` mode). */
+    readonly width?: number | null;
+    readonly height?: number | null;
+    /** Default 16. */
+    readonly cornerRadius?: number;
+    /** `[left, top, right, bottom]`. Default `[20, 16, 20, 12]`. */
+    readonly padding?: readonly [number, number, number, number];
+    /** Default `'height'`. */
+    readonly autoSizeMode?: G9PopupAutoSizeMode;
+    readonly cardBackground?: string | null;
+    readonly borderColor?: string | null;
+    /** Default `'transparent'`; `'none'` = non-modal (no scrim, taps pass through). */
+    readonly overlayMode?: G9PopupOverlayMode;
+    readonly blurIntensity?: G9PopupBlurIntensity;
+    /** Scrim colour (its opacity is `overlayOpacity`). Default the `Scrim` token. */
+    readonly overlayColor?: string | null;
+    /** Default 0.45. */
+    readonly overlayOpacity?: number;
+    /** Default false. */
+    readonly closeOnBackgroundTap?: boolean;
+    /** Default true. */
+    readonly closeOnBackButton?: boolean;
+    /** Default `'slideUp'`. */
+    readonly animation?: G9PopupAnimationType;
+    /** Default `'sinOut'`. */
+    readonly animationEasing?: G9PopupAnimationEasing;
+    /** Default 240 ms. */
+    readonly animationDuration?: number;
+    /** Close after this many ms; 0 = never. */
+    readonly autoCloseDuration?: number;
+    /** Anchor rectangle (MAUI `RelativeView`'s bounds); with `relativePosition`. */
+    readonly relativeRect?: G9Rect | null;
+    readonly relativePosition?: G9PopupRelativePosition | null;
+    /** Extra offset added to the relative placement. */
+    readonly relativeAbsoluteX?: number;
+    readonly relativeAbsoluteY?: number;
+    /** Absolute card position (host px). */
+    readonly absoluteX?: number | null;
+    readonly absoluteY?: number | null;
+    /** The card can be dragged: by a `<G9PopupDragHandle>` inside it, or anywhere when there is none. */
+    readonly isDraggable?: boolean;
+}
+/** The pose a card starts from / leaves to, per motion (MAUI `G9PopupView` animation table). */
+export declare function popupMotionPose(animation: G9PopupAnimationType, phase: 'enter' | 'exit'): {
+    opacity: number;
+    transform: string;
+};
+/** CSS timing function of an easing (bounce approximated with an overshoot curve; CSS has no bounce). */
+export declare function popupEasingCss(easing: G9PopupAnimationEasing): string;
+/**
+ * Where the card's top-left goes (host px) for a relative placement (MAUI `ShowRelativeToView`); `null` when the
+ * anchor or the card has no size yet (the card is then centred, and the next layout corrects it).
+ */
+export declare function relativePopupPlacement(anchor: G9Rect | null | undefined, position: G9PopupRelativePosition | null | undefined, card: {
+    width: number;
+    height: number;
+}, offset?: {
+    x: number;
+    y: number;
+}): {
+    left: number;
+    top: number;
+} | null;
+/**
+ * The grip of a draggable popup (MAUI `DragHandle`): put the header inside it so taps in the body keep working.
+ * Without one, a draggable card drags from anywhere.
+ */
+export declare function G9PopupDragHandle(props: {
+    readonly children?: ReactNode;
+    readonly className?: string;
+}): ReactNode;
+/** Props of {@link PopupFrame}. */
+export interface PopupFrameProps {
+    readonly options: G9PopupViewOpenOptions;
+    /** `enter` = start pose (no transition), `open` = in place, `leave` = exit pose. */
+    readonly phase: 'enter' | 'open' | 'leave';
+    readonly hostWidth: number;
+    readonly onBackgroundTap?: () => void;
+    readonly children?: ReactNode;
+    readonly testId?: string;
+}
+/**
+ * Scrim + card (MAUI `G9PopupView` visuals): the scrim fades on its own (also when the card has no motion); the card
+ * runs one compound transition (opacity with transform) between its pose and identity; no shadow, the stroke
+ * separates it. Placement: absolute, relative to an anchor, or centred (90 % wide in `height` mode). Non-modal
+ * (`overlayMode: 'none'`): no scrim and the layer lets taps through.
+ */
+export declare function PopupFrame(props: PopupFrameProps): ReactNode;
+//# sourceMappingURL=frame.d.ts.map

package/dist/popup/frame.d.ts.map

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

package/dist/popup/frame.jsx

@@ -0,0 +1,252 @@
+import "./popup.css";
+import { resolveThemeColor } from "@g9tm/lynxcontrols-foundation";
+import { createContext, useContext, useEffect, useRef, useState } from "@lynx-js/react";
+import { g9SafeId } from "../base/control.jsx";
+import { g9FieldNotchStyle } from "../fields/notch.jsx";
+import { useG9Theme } from "../provider/hooks.jsx";
+import { popupScrimOpacity } from "./types.jsx";
+function popupMotionPose(animation, phase) {
+    switch(animation){
+        case 'none':
+            return {
+                opacity: 'enter' === phase ? 1 : 0,
+                transform: 'translateY(0px) scale(1)'
+            };
+        case 'fadeIn':
+            return {
+                opacity: 0,
+                transform: 'translateY(0px) scale(1)'
+            };
+        case 'zoomIn':
+            return {
+                opacity: 0,
+                transform: 'translateY(0px) scale(0.92)'
+            };
+        case 'dropIn':
+            return {
+                opacity: 0,
+                transform: 'translateY(-40px) scale(1)'
+            };
+        case 'bounce':
+            return {
+                opacity: 0,
+                transform: `translateY(0px) scale(${'enter' === phase ? 0.6 : 0.92})`
+            };
+        default:
+            return {
+                opacity: 0,
+                transform: 'translateY(40px) scale(1)'
+            };
+    }
+}
+function popupEasingCss(easing) {
+    switch(easing){
+        case 'linear':
+            return 'linear';
+        case 'sinIn':
+            return 'cubic-bezier(0.47, 0, 0.745, 0.715)';
+        case 'sinInOut':
+            return 'cubic-bezier(0.445, 0.05, 0.55, 0.95)';
+        case 'cubicOut':
+            return 'cubic-bezier(0.215, 0.61, 0.355, 1)';
+        case 'bounceOut':
+            return 'cubic-bezier(0.34, 1.56, 0.64, 1)';
+        default:
+            return 'cubic-bezier(0.39, 0.575, 0.565, 1)';
+    }
+}
+function relativePopupPlacement(anchor, position, card, offset = {
+    x: 0,
+    y: 0
+}) {
+    if (!anchor || !position || anchor.width <= 0 || anchor.height <= 0 || card.width <= 0 || card.height <= 0) return null;
+    const right = anchor.left + anchor.width;
+    const bottom = anchor.top + anchor.height;
+    const cx = anchor.left + (anchor.width - card.width) / 2;
+    const cy = anchor.top + (anchor.height - card.height) / 2;
+    const at = (left, top)=>({
+            left: left + offset.x,
+            top: top + offset.y
+        });
+    switch(position){
+        case 'alignTop':
+            return at(cx, anchor.top);
+        case 'alignBottom':
+            return at(cx, bottom - card.height);
+        case 'alignLeft':
+            return at(anchor.left, cy);
+        case 'alignRight':
+            return at(right - card.width, cy);
+        case 'alignTopLeft':
+            return at(anchor.left, anchor.top);
+        case 'alignTopRight':
+            return at(right - card.width, anchor.top);
+        case 'alignBottomLeft':
+            return at(anchor.left, bottom - card.height);
+        case 'alignBottomRight':
+            return at(right - card.width, bottom - card.height);
+        case 'alignToLeftOf':
+            return at(anchor.left - card.width, cy);
+        case 'alignToRightOf':
+            return at(right, cy);
+        case 'alignToTopOf':
+            return at(cx, anchor.top - card.height);
+        default:
+            return at(cx, bottom);
+    }
+}
+const DragContext = createContext(null);
+const point = (e)=>{
+    var _ref, _ref1, _ref2, _ref3;
+    var _e_touches;
+    const t = null == (_e_touches = e.touches) ? void 0 : _e_touches[0];
+    return {
+        x: null != (_ref = null != (_ref1 = null == t ? void 0 : t.clientX) ? _ref1 : null == t ? void 0 : t.pageX) ? _ref : 0,
+        y: null != (_ref2 = null != (_ref3 = null == t ? void 0 : t.clientY) ? _ref3 : null == t ? void 0 : t.pageY) ? _ref2 : 0
+    };
+};
+function G9PopupDragHandle(props) {
+    const drag = useContext(DragContext);
+    useEffect(()=>null == drag ? void 0 : drag.register(), [
+        null !== drag
+    ]);
+    return <view className={`g9-popup__drag-handle${props.className ? ` ${props.className}` : ''}`} bindtouchstart={(e)=>{
+        const p = point(e);
+        null == drag || drag.onStart(p.x, p.y);
+    }} bindtouchmove={(e)=>{
+        const p = point(e);
+        null == drag || drag.onMove(p.x, p.y);
+    }}>
+      {props.children}
+    </view>;
+}
+function PopupFrame(props) {
+    var _o_cardBackground, _o_animation, _o_animationDuration, _o_overlayMode, _o_animationEasing, _o_autoSizeMode, _o_absoluteX, _o_absoluteY, _o_relativeAbsoluteX, _o_relativeAbsoluteY, _o_padding, _o_overlayOpacity, _o_blurIntensity, _o_overlayColor, _o_cornerRadius, _o_cardBackground1, _o_borderColor;
+    const o = props.options;
+    const palette = useG9Theme().palette;
+    const notch = g9FieldNotchStyle(resolveThemeColor(null != (_o_cardBackground = o.cardBackground) ? _o_cardBackground : 'var(--g9-surface)', palette));
+    const animation = null != (_o_animation = o.animation) ? _o_animation : 'slideUp';
+    const duration = null != (_o_animationDuration = o.animationDuration) ? _o_animationDuration : 240;
+    const mode = null != (_o_overlayMode = o.overlayMode) ? _o_overlayMode : 'transparent';
+    const [size, setSize] = useState({
+        width: 0,
+        height: 0
+    });
+    const [offset, setOffset] = useState({
+        x: 0,
+        y: 0
+    });
+    const drag = useRef({
+        x: 0,
+        y: 0,
+        ox: 0,
+        oy: 0
+    });
+    const [handles, setHandles] = useState(0);
+    const dragApi = {
+        onStart: (x, y)=>{
+            drag.current = {
+                ...drag.current,
+                x,
+                y,
+                ox: offset.x,
+                oy: offset.y
+            };
+        },
+        onMove: (x, y)=>{
+            if (!o.isDraggable) return;
+            setOffset({
+                x: drag.current.ox + x - drag.current.x,
+                y: drag.current.oy + y - drag.current.y
+            });
+        },
+        register: ()=>{
+            setHandles((n)=>n + 1);
+            return ()=>setHandles((n)=>n - 1);
+        }
+    };
+    const pose = 'open' === props.phase ? {
+        opacity: 1,
+        transform: 'translateY(0px) scale(1)'
+    } : popupMotionPose(animation, 'enter' === props.phase ? 'enter' : 'exit');
+    const easing = 'bounce' === animation && 'leave' !== props.phase ? popupEasingCss('bounceOut') : popupEasingCss(null != (_o_animationEasing = o.animationEasing) ? _o_animationEasing : 'sinOut');
+    const transition = 'enter' === props.phase || 'none' === animation ? 'none' : `opacity ${duration}ms ${easing}, transform ${duration}ms ${easing}`;
+    const autoSize = null != (_o_autoSizeMode = o.autoSizeMode) ? _o_autoSizeMode : 'height';
+    const placed = null != o.absoluteX || null != o.absoluteY ? {
+        left: null != (_o_absoluteX = o.absoluteX) ? _o_absoluteX : 0,
+        top: null != (_o_absoluteY = o.absoluteY) ? _o_absoluteY : 0
+    } : relativePopupPlacement(o.relativeRect, o.relativePosition, size, {
+        x: null != (_o_relativeAbsoluteX = o.relativeAbsoluteX) ? _o_relativeAbsoluteX : 0,
+        y: null != (_o_relativeAbsoluteY = o.relativeAbsoluteY) ? _o_relativeAbsoluteY : 0
+    });
+    const width = null != o.width && 'both' !== autoSize && 'width' !== autoSize ? `${o.width}px` : placed || 'height' !== autoSize ? void 0 : `${Math.round(0.9 * props.hostWidth)}px`;
+    const height = null != o.height && ('none' === autoSize || 'width' === autoSize) ? `${o.height}px` : void 0;
+    const pad = null != (_o_padding = o.padding) ? _o_padding : [
+        20,
+        16,
+        20,
+        12
+    ];
+    const scrimOpacity = popupScrimOpacity(mode, null != (_o_overlayOpacity = o.overlayOpacity) ? _o_overlayOpacity : 0.45, null != (_o_blurIntensity = o.blurIntensity) ? _o_blurIntensity : 'none');
+    const dragTranslate = o.isDraggable ? `translate(${offset.x}px, ${offset.y}px) ` : '';
+    const wholeCardDrags = true === o.isDraggable && 0 === handles;
+    return <view className={`g9-popup${'none' === mode ? ' g9-popup--nonmodal' : ''}${placed ? ' g9-popup--placed' : ''}`} {...'none' === mode ? {
+        'event-through': true
+    } : {}}>
+      {'none' !== mode ? <view className="g9-popup__scrim" style={{
+        backgroundColor: null != (_o_overlayColor = o.overlayColor) ? _o_overlayColor : 'var(--g9-scrim)',
+        opacity: 'open' === props.phase ? scrimOpacity : 0,
+        transition: 'enter' === props.phase ? 'none' : `opacity ${duration}ms`
+    }} bindtap={()=>{
+        var _props_onBackgroundTap;
+        return null == (_props_onBackgroundTap = props.onBackgroundTap) ? void 0 : _props_onBackgroundTap.call(props);
+    }}/> : null}
+      <view className="g9-popup__card" {...props.testId ? {
+        'data-testid': props.testId,
+        id: g9SafeId(props.testId)
+    } : {}} event-through={false} style={{
+        ...placed ? {
+            position: 'absolute',
+            left: `${placed.left}px`,
+            top: `${placed.top}px`
+        } : {},
+        ...width ? {
+            width
+        } : {},
+        ...height ? {
+            height
+        } : {},
+        borderRadius: `${null != (_o_cornerRadius = o.cornerRadius) ? _o_cornerRadius : 16}px`,
+        backgroundColor: null != (_o_cardBackground1 = o.cardBackground) ? _o_cardBackground1 : 'var(--g9-surface)',
+        borderColor: null != (_o_borderColor = o.borderColor) ? _o_borderColor : 'var(--g9-surface)',
+        padding: `${pad[1]}px ${pad[2]}px ${pad[3]}px ${pad[0]}px`,
+        ...notch,
+        opacity: pose.opacity,
+        transform: `${dragTranslate}${pose.transform}`,
+        transition
+    }} bindlayoutchange={(e)=>{
+        var _ref, _ref1;
+        var _e_detail, _e_detail1;
+        const w = null != (_ref = null == (_e_detail = e.detail) ? void 0 : _e_detail.width) ? _ref : 0;
+        const h = null != (_ref1 = null == (_e_detail1 = e.detail) ? void 0 : _e_detail1.height) ? _ref1 : 0;
+        if (w > 0 && h > 0 && (w !== size.width || h !== size.height)) setSize({
+            width: w,
+            height: h
+        });
+    }} {...wholeCardDrags ? {
+        bindtouchstart: (e)=>{
+            const p = point(e);
+            dragApi.onStart(p.x, p.y);
+        },
+        bindtouchmove: (e)=>{
+            const p = point(e);
+            dragApi.onMove(p.x, p.y);
+        }
+    } : {}}>
+        <DragContext.Provider value={dragApi}>{props.children}</DragContext.Provider>
+      </view>
+    </view>;
+}
+export { G9PopupDragHandle, PopupFrame, popupEasingCss, popupMotionPose, relativePopupPlacement };
+
+//# sourceMappingURL=frame.jsx.map

package/dist/popup/frame.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"popup/frame.jsx","sources":["../../src/popup/frame.tsx"],"sourcesContent":["import './popup.css';\nimport { resolveThemeColor } from '@g9tm/lynxcontrols-foundation';\nimport { createContext, type ReactNode, useContext, useEffect, useRef, useState } from '@lynx-js/react';\nimport { g9SafeId } from '../base/control';\nimport { g9FieldNotchStyle } from '../fields/notch';\nimport { useG9Theme } from '../provider/hooks';\nimport type {\n  G9PopupAnimationEasing,\n  G9PopupAnimationType,\n  G9PopupAutoSizeMode,\n  G9PopupBlurIntensity,\n  G9PopupOverlayMode,\n  G9PopupRelativePosition,\n} from './types';\nimport { popupScrimOpacity } from './types';\n\n/** A rectangle in host coordinates (px), e.g. an anchor's `boundingClientRect`. */\nexport interface G9Rect {\n  readonly left: number;\n  readonly top: number;\n  readonly width: number;\n  readonly height: number;\n}\n\n/** How one popup card opens (MAUI `G9PopupViewOpenOptions`). */\nexport interface G9PopupViewOpenOptions {\n  /** Card width (px); unset = the auto-size mode decides (90 % of the host for centred `height` mode). */\n  readonly width?: number | null;\n  readonly height?: number | null;\n  /** Default 16. */\n  readonly cornerRadius?: number;\n  /** `[left, top, right, bottom]`. Default `[20, 16, 20, 12]`. */\n  readonly padding?: readonly [number, number, number, number];\n  /** Default `'height'`. */\n  readonly autoSizeMode?: G9PopupAutoSizeMode;\n  readonly cardBackground?: string | null;\n  readonly borderColor?: string | null;\n  /** Default `'transparent'`; `'none'` = non-modal (no scrim, taps pass through). */\n  readonly overlayMode?: G9PopupOverlayMode;\n  readonly blurIntensity?: G9PopupBlurIntensity;\n  /** Scrim colour (its opacity is `overlayOpacity`). Default the `Scrim` token. */\n  readonly overlayColor?: string | null;\n  /** Default 0.45. */\n  readonly overlayOpacity?: number;\n  /** Default false. */\n  readonly closeOnBackgroundTap?: boolean;\n  /** Default true. */\n  readonly closeOnBackButton?: boolean;\n  /** Default `'slideUp'`. */\n  readonly animation?: G9PopupAnimationType;\n  /** Default `'sinOut'`. */\n  readonly animationEasing?: G9PopupAnimationEasing;\n  /** Default 240 ms. */\n  readonly animationDuration?: number;\n  /** Close after this many ms; 0 = never. */\n  readonly autoCloseDuration?: number;\n  /** Anchor rectangle (MAUI `RelativeView`'s bounds); with `relativePosition`. */\n  readonly relativeRect?: G9Rect | null;\n  readonly relativePosition?: G9PopupRelativePosition | null;\n  /** Extra offset added to the relative placement. */\n  readonly relativeAbsoluteX?: number;\n  readonly relativeAbsoluteY?: number;\n  /** Absolute card position (host px). */\n  readonly absoluteX?: number | null;\n  readonly absoluteY?: number | null;\n  /** The card can be dragged: by a `<G9PopupDragHandle>` inside it, or anywhere when there is none. */\n  readonly isDraggable?: boolean;\n}\n\n/** The pose a card starts from / leaves to, per motion (MAUI `G9PopupView` animation table). */\nexport function popupMotionPose(\n  animation: G9PopupAnimationType,\n  phase: 'enter' | 'exit',\n): {\n  opacity: number;\n  transform: string;\n} {\n  switch (animation) {\n    case 'none':\n      return { opacity: phase === 'enter' ? 1 : 0, transform: 'translateY(0px) scale(1)' };\n    case 'fadeIn':\n      return { opacity: 0, transform: 'translateY(0px) scale(1)' };\n    case 'zoomIn':\n      return { opacity: 0, transform: 'translateY(0px) scale(0.92)' };\n    case 'dropIn':\n      return { opacity: 0, transform: 'translateY(-40px) scale(1)' };\n    case 'bounce':\n      // Opens from 0.6 with the bounce easing; closes like ZoomIn (MAUI).\n      return { opacity: 0, transform: `translateY(0px) scale(${phase === 'enter' ? 0.6 : 0.92})` };\n    default:\n      return { opacity: 0, transform: 'translateY(40px) scale(1)' };\n  }\n}\n\n/** CSS timing function of an easing (bounce approximated with an overshoot curve; CSS has no bounce). */\nexport function popupEasingCss(easing: G9PopupAnimationEasing): string {\n  switch (easing) {\n    case 'linear':\n      return 'linear';\n    case 'sinIn':\n      return 'cubic-bezier(0.47, 0, 0.745, 0.715)';\n    case 'sinInOut':\n      return 'cubic-bezier(0.445, 0.05, 0.55, 0.95)';\n    case 'cubicOut':\n      return 'cubic-bezier(0.215, 0.61, 0.355, 1)';\n    case 'bounceOut':\n      return 'cubic-bezier(0.34, 1.56, 0.64, 1)';\n    default:\n      return 'cubic-bezier(0.39, 0.575, 0.565, 1)';\n  }\n}\n\n/**\n * Where the card's top-left goes (host px) for a relative placement (MAUI `ShowRelativeToView`); `null` when the\n * anchor or the card has no size yet (the card is then centred, and the next layout corrects it).\n */\nexport function relativePopupPlacement(\n  anchor: G9Rect | null | undefined,\n  position: G9PopupRelativePosition | null | undefined,\n  card: { width: number; height: number },\n  offset: { x: number; y: number } = { x: 0, y: 0 },\n): { left: number; top: number } | null {\n  if (!anchor || !position || anchor.width <= 0 || anchor.height <= 0 || card.width <= 0 || card.height <= 0)\n    return null;\n  const right = anchor.left + anchor.width;\n  const bottom = anchor.top + anchor.height;\n  const cx = anchor.left + (anchor.width - card.width) / 2;\n  const cy = anchor.top + (anchor.height - card.height) / 2;\n  const at = (left: number, top: number) => ({ left: left + offset.x, top: top + offset.y });\n  switch (position) {\n    case 'alignTop':\n      return at(cx, anchor.top);\n    case 'alignBottom':\n      return at(cx, bottom - card.height);\n    case 'alignLeft':\n      return at(anchor.left, cy);\n    case 'alignRight':\n      return at(right - card.width, cy);\n    case 'alignTopLeft':\n      return at(anchor.left, anchor.top);\n    case 'alignTopRight':\n      return at(right - card.width, anchor.top);\n    case 'alignBottomLeft':\n      return at(anchor.left, bottom - card.height);\n    case 'alignBottomRight':\n      return at(right - card.width, bottom - card.height);\n    case 'alignToLeftOf':\n      return at(anchor.left - card.width, cy);\n    case 'alignToRightOf':\n      return at(right, cy);\n    case 'alignToTopOf':\n      return at(cx, anchor.top - card.height);\n    default:\n      return at(cx, bottom);\n  }\n}\n\ninterface DragApi {\n  readonly onStart: (x: number, y: number) => void;\n  readonly onMove: (x: number, y: number) => void;\n  readonly register: () => () => void;\n}\n\nconst DragContext = createContext<DragApi | null>(null);\n\ntype TouchEvent = { touches?: Array<{ clientX?: number; clientY?: number; pageX?: number; pageY?: number }> };\nconst point = (e: TouchEvent) => {\n  const t = e.touches?.[0];\n  return { x: t?.clientX ?? t?.pageX ?? 0, y: t?.clientY ?? t?.pageY ?? 0 };\n};\n\n/**\n * The grip of a draggable popup (MAUI `DragHandle`): put the header inside it so taps in the body keep working.\n * Without one, a draggable card drags from anywhere.\n */\nexport function G9PopupDragHandle(props: { readonly children?: ReactNode; readonly className?: string }): ReactNode {\n  const drag = useContext(DragContext);\n  useEffect(() => drag?.register(), [drag !== null]);\n  return (\n    <view\n      className={`g9-popup__drag-handle${props.className ? ` ${props.className}` : ''}`}\n      bindtouchstart={(e: TouchEvent) => {\n        const p = point(e);\n        drag?.onStart(p.x, p.y);\n      }}\n      bindtouchmove={(e: TouchEvent) => {\n        const p = point(e);\n        drag?.onMove(p.x, p.y);\n      }}\n    >\n      {props.children}\n    </view>\n  );\n}\n\n/** Props of {@link PopupFrame}. */\nexport interface PopupFrameProps {\n  readonly options: G9PopupViewOpenOptions;\n  /** `enter` = start pose (no transition), `open` = in place, `leave` = exit pose. */\n  readonly phase: 'enter' | 'open' | 'leave';\n  readonly hostWidth: number;\n  readonly onBackgroundTap?: () => void;\n  readonly children?: ReactNode;\n  readonly testId?: string;\n}\n\n/**\n * Scrim + card (MAUI `G9PopupView` visuals): the scrim fades on its own (also when the card has no motion); the card\n * runs one compound transition (opacity with transform) between its pose and identity; no shadow, the stroke\n * separates it. Placement: absolute, relative to an anchor, or centred (90 % wide in `height` mode). Non-modal\n * (`overlayMode: 'none'`): no scrim and the layer lets taps through.\n */\nexport function PopupFrame(props: PopupFrameProps): ReactNode {\n  const o = props.options;\n  // Fields on the card hide their outline under a floated label with the card's colour.\n  const palette = useG9Theme().palette;\n  const notch = g9FieldNotchStyle(resolveThemeColor(o.cardBackground ?? 'var(--g9-surface)', palette));\n  const animation = o.animation ?? 'slideUp';\n  const duration = o.animationDuration ?? 240;\n  const mode = o.overlayMode ?? 'transparent';\n  const [size, setSize] = useState({ width: 0, height: 0 });\n  const [offset, setOffset] = useState({ x: 0, y: 0 });\n  const drag = useRef({ x: 0, y: 0, ox: 0, oy: 0 });\n  const [handles, setHandles] = useState(0);\n  const dragApi: DragApi = {\n    onStart: (x, y) => {\n      drag.current = { ...drag.current, x, y, ox: offset.x, oy: offset.y };\n    },\n    onMove: (x, y) => {\n      if (!o.isDraggable) return;\n      setOffset({ x: drag.current.ox + x - drag.current.x, y: drag.current.oy + y - drag.current.y });\n    },\n    register: () => {\n      setHandles((n) => n + 1);\n      return () => setHandles((n) => n - 1);\n    },\n  };\n  const pose =\n    props.phase === 'open'\n      ? { opacity: 1, transform: 'translateY(0px) scale(1)' }\n      : popupMotionPose(animation, props.phase === 'enter' ? 'enter' : 'exit');\n  const easing =\n    animation === 'bounce' && props.phase !== 'leave'\n      ? popupEasingCss('bounceOut')\n      : popupEasingCss(o.animationEasing ?? 'sinOut');\n  const transition =\n    props.phase === 'enter' || animation === 'none'\n      ? 'none'\n      : `opacity ${duration}ms ${easing}, transform ${duration}ms ${easing}`;\n  const autoSize = o.autoSizeMode ?? 'height';\n  const placed =\n    o.absoluteX != null || o.absoluteY != null\n      ? { left: o.absoluteX ?? 0, top: o.absoluteY ?? 0 }\n      : relativePopupPlacement(o.relativeRect, o.relativePosition, size, {\n          x: o.relativeAbsoluteX ?? 0,\n          y: o.relativeAbsoluteY ?? 0,\n        });\n  const width =\n    o.width != null && autoSize !== 'both' && autoSize !== 'width'\n      ? `${o.width}px`\n      : !placed && autoSize === 'height'\n        ? `${Math.round(props.hostWidth * 0.9)}px`\n        : undefined;\n  const height = o.height != null && (autoSize === 'none' || autoSize === 'width') ? `${o.height}px` : undefined;\n  const pad = o.padding ?? [20, 16, 20, 12];\n  const scrimOpacity = popupScrimOpacity(mode, o.overlayOpacity ?? 0.45, o.blurIntensity ?? 'none');\n  const dragTranslate = o.isDraggable ? `translate(${offset.x}px, ${offset.y}px) ` : '';\n  const wholeCardDrags = o.isDraggable === true && handles === 0;\n  return (\n    <view\n      className={`g9-popup${mode === 'none' ? ' g9-popup--nonmodal' : ''}${placed ? ' g9-popup--placed' : ''}`}\n      {...(mode === 'none' ? { 'event-through': true } : {})}\n    >\n      {mode !== 'none' ? (\n        <view\n          className=\"g9-popup__scrim\"\n          style={{\n            backgroundColor: o.overlayColor ?? 'var(--g9-scrim)',\n            opacity: props.phase === 'open' ? scrimOpacity : 0,\n            transition: props.phase === 'enter' ? 'none' : `opacity ${duration}ms`,\n          }}\n          bindtap={() => props.onBackgroundTap?.()}\n        />\n      ) : null}\n      <view\n        className=\"g9-popup__card\"\n        {...(props.testId ? { 'data-testid': props.testId, id: g9SafeId(props.testId) } : {})}\n        event-through={false}\n        style={{\n          ...(placed ? { position: 'absolute', left: `${placed.left}px`, top: `${placed.top}px` } : {}),\n          ...(width ? { width } : {}),\n          ...(height ? { height } : {}),\n          borderRadius: `${o.cornerRadius ?? 16}px`,\n          backgroundColor: o.cardBackground ?? 'var(--g9-surface)',\n          borderColor: o.borderColor ?? 'var(--g9-surface)',\n          padding: `${pad[1]}px ${pad[2]}px ${pad[3]}px ${pad[0]}px`,\n          ...notch,\n          opacity: pose.opacity,\n          transform: `${dragTranslate}${pose.transform}`,\n          transition,\n        }}\n        bindlayoutchange={(e: { detail?: { width?: number; height?: number } }) => {\n          const w = e.detail?.width ?? 0;\n          const h = e.detail?.height ?? 0;\n          if (w > 0 && h > 0 && (w !== size.width || h !== size.height)) setSize({ width: w, height: h });\n        }}\n        {...(wholeCardDrags\n          ? {\n              bindtouchstart: (e: TouchEvent) => {\n                const p = point(e);\n                dragApi.onStart(p.x, p.y);\n              },\n              bindtouchmove: (e: TouchEvent) => {\n                const p = point(e);\n                dragApi.onMove(p.x, p.y);\n              },\n            }\n          : {})}\n      >\n        <DragContext.Provider value={dragApi}>{props.children}</DragContext.Provider>\n      </view>\n    </view>\n  );\n}\n"],"names":["popupMotionPose","animation","phase","popupEasingCss","easing","relativePopupPlacement","anchor","position","card","offset","right","bottom","cx","cy","at","left","top","DragContext","createContext","point","e","_ref","_ref2","_e_touches","t","G9PopupDragHandle","props","drag","useContext","useEffect","view","p","PopupFrame","_o_cardBackground","_o_animation","_o_animationDuration","_o_overlayMode","_o_animationEasing","_o_autoSizeMode","_o_absoluteX","_o_absoluteY","_o_relativeAbsoluteX","_o_relativeAbsoluteY","_o_padding","_o_overlayOpacity","_o_blurIntensity","_o_overlayColor","_o_cornerRadius","_o_cardBackground1","_o_borderColor","o","palette","useG9Theme","notch","g9FieldNotchStyle","resolveThemeColor","duration","mode","size","setSize","useState","setOffset","useRef","handles","setHandles","dragApi","x","y","n","pose","transition","autoSize","placed","width","undefined","Math","height","pad","scrimOpacity","popupScrimOpacity","dragTranslate","wholeCardDrags","g9SafeId","_e_detail","_e_detail1","w","h"],"mappings":"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"}

package/dist/popup/index.d.ts

@@ -0,0 +1,8 @@
+export { G9PopupDragHandle, type G9PopupViewOpenOptions, type G9Rect, PopupFrame, type PopupFrameProps, popupEasingCss, popupMotionPose, relativePopupPlacement, } from './frame.js';
+export { type G9PopupFormState, type G9PopupInputField, type G9PopupInputFieldOptions, G9PopupInputFieldType, type G9PopupInputOption, type G9PopupInputOptions, type G9PopupInputResult, g9PopupInputField, g9PopupInputResult, initialPopupFormState, isPopupEmailValid, popupCheckBoxOptions, popupFieldKeyboard, popupInputOption, popupInputOptions, validatePopupForm, } from './input.js';
+export { createPopupFormStore, type G9PopupFormStore, PopupInputForm } from './input-form.js';
+export { G9PopupView, type G9PopupViewProps } from './popup-view.js';
+export { type G9PopupEntry, type G9PopupExit, type G9PopupOutcome, type G9PopupPhase, G9PopupQueue, type G9PopupQueueConfig, } from './queue.js';
+export { type G9ConfirmOptions, type G9PopupService, g9PopupRowButtonLimit, g9Popups, popupServiceOf, presentErrorPopup, useG9Popups, } from './service.js';
+export { closePopupButton, createDefaultPopupSettings, createPopupVisualProfile, customPopup, G9PopupAnimationEasing, G9PopupAnimationType, G9PopupAutoSizeMode, G9PopupBlurIntensity, type G9PopupButton, type G9PopupCallbackContext, type G9PopupDescriptor, G9PopupFooterButtonLayout, type G9PopupFormHandle, G9PopupOverlayMode, G9PopupRelativePosition, type G9PopupResult, G9PopupResultAction, type G9PopupSettings, G9PopupType, type G9PopupVisualProfile, g9PopupResult, mergePopupSettings, popupScrimOpacity, presetPopup, resolvePopupSettings, } from './types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/popup/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/popup/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,KAAK,sBAAsB,EAC3B,KAAK,MAAM,EACX,UAAU,EACV,KAAK,eAAe,EACpB,cAAc,EACd,eAAe,EACf,sBAAsB,GACvB,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,iBAAiB,EACtB,KAAK,wBAAwB,EAC7B,qBAAqB,EACrB,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,iBAAiB,EACjB,kBAAkB,EAClB,qBAAqB,EACrB,iBAAiB,EACjB,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,oBAAoB,EAAE,KAAK,gBAAgB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC3F,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAClE,OAAO,EACL,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,YAAY,EACZ,KAAK,kBAAkB,GACxB,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,cAAc,EACnB,qBAAqB,EACrB,QAAQ,EACR,cAAc,EACd,iBAAiB,EACjB,WAAW,GACZ,MAAM,WAAW,CAAC;AACnB,OAAO,EACL,gBAAgB,EAChB,0BAA0B,EAC1B,wBAAwB,EACxB,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,mBAAmB,EACnB,oBAAoB,EACpB,KAAK,aAAa,EAClB,KAAK,sBAAsB,EAC3B,KAAK,iBAAiB,EACtB,yBAAyB,EACzB,KAAK,iBAAiB,EACtB,kBAAkB,EAClB,uBAAuB,EACvB,KAAK,aAAa,EAClB,mBAAmB,EACnB,KAAK,eAAe,EACpB,WAAW,EACX,KAAK,oBAAoB,EACzB,aAAa,EACb,kBAAkB,EAClB,iBAAiB,EACjB,WAAW,EACX,oBAAoB,GACrB,MAAM,SAAS,CAAC"}

package/dist/popup/index.jsx

@@ -0,0 +1,7 @@
+export { G9PopupDragHandle, PopupFrame, popupEasingCss, popupMotionPose, relativePopupPlacement } from "./frame.jsx";
+export { G9PopupInputFieldType, g9PopupInputField, g9PopupInputResult, initialPopupFormState, isPopupEmailValid, popupCheckBoxOptions, popupFieldKeyboard, popupInputOption, popupInputOptions, validatePopupForm } from "./input.jsx";
+export { PopupInputForm, createPopupFormStore } from "./input-form.jsx";
+export { G9PopupView } from "./popup-view.jsx";
+export { G9PopupQueue } from "./queue.jsx";
+export { g9PopupRowButtonLimit, g9Popups, popupServiceOf, presentErrorPopup, useG9Popups } from "./service.jsx";
+export { G9PopupAnimationEasing, G9PopupAnimationType, G9PopupAutoSizeMode, G9PopupBlurIntensity, G9PopupFooterButtonLayout, G9PopupOverlayMode, G9PopupRelativePosition, G9PopupResultAction, G9PopupType, closePopupButton, createDefaultPopupSettings, createPopupVisualProfile, customPopup, g9PopupResult, mergePopupSettings, popupScrimOpacity, presetPopup, resolvePopupSettings } from "./types.jsx";

package/dist/popup/input-form.d.ts

@@ -0,0 +1,35 @@
+import './popup.css';
+import { type ReactNode } from '@lynx-js/react';
+import { type G9PopupFormState, type G9PopupInputField, validatePopupForm } from './input.js';
+/** The live state of an input popup's form: survives a re-show (a nested popup, a failed submit). */
+export interface G9PopupFormStore {
+    readonly fields: ReadonlyArray<G9PopupInputField>;
+    getState(): {
+        form: G9PopupFormState;
+        errors: Readonly<Record<string, string>>;
+        focus: {
+            key: string;
+            n: number;
+        } | null;
+    };
+    subscribe(listener: () => void): () => void;
+    setText(key: string, value: string): void;
+    toggle(key: string, value: string, on: boolean): void;
+    /** Validates, shows the errors, focuses the first invalid field. */
+    validate(messages: {
+        readonly requiredSuffix: string;
+        readonly invalidEmail: string;
+    }): ReturnType<typeof validatePopupForm>;
+}
+/** Creates the store of one input popup. */
+export declare function createPopupFormStore(fields: ReadonlyArray<G9PopupInputField>): G9PopupFormStore;
+/**
+ * The input popup's form (MAUI `ShowInputG9PopupAsync` form view): a `G9TextEntry` per text field (keyboard and
+ * direction from the field), a `G9Editor` for multiline/text-area, a `G9CheckBox` per check-box option and radio rows.
+ * Errors show under their fields; the first field is focused on open, the first invalid one after a failed submit.
+ */
+export declare function PopupInputForm(props: {
+    readonly store: G9PopupFormStore;
+    readonly focusFirst: boolean;
+}): ReactNode;
+//# sourceMappingURL=input-form.d.ts.map

package/dist/popup/input-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-form.d.ts","sourceRoot":"","sources":["../../src/popup/input-form.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,SAAS,EAA2C,MAAM,gBAAgB,CAAC;AAQzF,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,iBAAiB,EAItB,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAEjB,qGAAqG;AACrG,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAClD,QAAQ,IAAI;QACV,IAAI,EAAE,gBAAgB,CAAC;QACvB,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;QACzC,KAAK,EAAE;YAAE,GAAG,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAE,GAAG,IAAI,CAAC;KAC1C,CAAC;IACF,SAAS,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC;IAC5C,OAAO,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1C,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,GAAG,IAAI,CAAC;IACtD,oEAAoE;IACpE,QAAQ,CAAC,QAAQ,EAAE;QACjB,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;QAChC,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;KAC/B,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;CAC1C;AAED,4CAA4C;AAC5C,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,aAAa,CAAC,iBAAiB,CAAC,GAAG,gBAAgB,CA6C/F;AAqCD;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE;IAAE,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAC;IAAC,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAA;CAAE,GAAG,SAAS,CAoFnH"}