@kanso-labs/react-native-kanso-ui 0.10.0 → 0.11.0

package/dist/components/dialog/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ComponentRef","ReactNode","Ref","HostInstance","LayoutChangeEvent","ScrollViewProps","StyleProp","TextProps","TextStyle","ViewProps","ViewStyle","AnimatedStyle","createContext","use","useCallback","useEffect","useId","useLayoutEffect","useMemo","useState","Text","NativeText","ScrollView","StyleSheet","useWindowDimensions","View","Animated","Easing","useAnimatedStyle","useReducedMotion","useSharedValue","withTiming","SafeAreaInsetsContext","ModalOpenProps","ModalTrigger","ResolvedTheme","ButtonSlotContext","useWindowSizeClass","insetsOf","ModalWindow","NO_INSETS","panelRoleOf","registerOf","useModalState","useModalTrigger","refsOf","useTheme","composeStyles","themedStyles","useTypeRole","MIN_WIDTH","MAX_WIDTH","SCALE_FROM","RISE_FROM","NO_PARTS","Readonly","Record","DialogPart","footer","header","title","stylesOf","colors","radii","shadows","sizing","spacing","create","actions","alignItems","flexDirection","flexShrink","flexWrap","gap","sm","justifyContent","padding","xl","actionsFull","borderTopColor","outlineVariant","borderTopWidth","minHeight","rowSm","paddingVertical","xs","bodyText","color","onSurfaceVariant","container","backgroundColor","surfaceContainerHigh","overflow","containerBasic","borderRadius","boxShadow","elevation3","maxHeight","maxWidth","minWidth","width","containerFull","flex","md","paddingBottom","lg","paddingHorizontal","paddingTop","headerFull","borderBottomColor","borderBottomWidth","layout","bottom","left","pointerEvents","position","right","top","layoutFull","onSurface","DialogLayout","basic","parts","register","part","setTitle","node","titleId","DialogLayoutContext","DialogTriggerContext","DialogBodyProps","ref","DialogContentProps","DialogOpenProps","Omit","children","isDismissable","isKeyboardDismissDisabled","role","style","defaultOpen","isOpen","onOpenChange","DialogPartProps","DialogProps","DialogTitleProps","bodyPaddingOf","Dialog","t0","$","_c","t1","context","slots","t2","t3","DialogBody","contentContainerStyle","onContentSizeChange","onLayout","props","useLayout","theme","styles","text","content","setContent","room","setRoom","height","measureContent","event","nativeEvent","measureRoom","T0","t4","t5","t6","DialogContent","undefined","outer","close","present","setPresent","state","insets","sizeClass","setParts","Symbol","for","motion","useDialogMotion","labelledBy","t7","t8","scrim","T1","t9","t10","t11","t12","t13","panel","t14","t15","t16","t17","t18","DialogFooter","DialogHeader","DialogTitle","reduceMotion","durationMedium1","durationShort2","durationShort3","easingEmphasizedAccelerate","easingEmphasizedDecelerate","easingStandard","fade","duration","easing","bezier","set","timer","setTimeout","Math","max","clearTimeout","shown","get","opacity","transform","scale","translateY","Error","Body","Content","Footer","Header","Title","_c","NativeText"],"sources":["../../../src/components/dialog/index.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode, Ref } from 'react'\nimport type {\n  HostInstance,\n  LayoutChangeEvent,\n  ScrollViewProps,\n  StyleProp,\n  TextProps,\n  TextStyle,\n  ViewProps,\n  ViewStyle,\n} from 'react-native'\nimport type { AnimatedStyle } from 'react-native-reanimated'\n\nimport {\n  createContext,\n  use,\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react'\nimport {\n  Text as NativeText,\n  ScrollView,\n  StyleSheet,\n  useWindowDimensions,\n  View,\n} from 'react-native'\nimport Animated, {\n  Easing,\n  useAnimatedStyle,\n  useReducedMotion,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated'\nimport { SafeAreaInsetsContext } from 'react-native-safe-area-context'\n\nimport type { ModalOpenProps, ModalTrigger } from '../../modal'\nimport type { ResolvedTheme } from '../../theme/scope'\n\nimport { ButtonSlotContext } from '../../button/slots'\nimport { useWindowSizeClass } from '../../hooks/useWindowSizeClass'\nimport {\n  insetsOf,\n  ModalWindow,\n  NO_INSETS,\n  panelRoleOf,\n  registerOf,\n  useModalState,\n  useModalTrigger,\n} from '../../modal'\nimport { refsOf } from '../../ref'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\nimport { useTypeRole } from '../../typography/roles'\n\n// The dialogs spec page's two dialogs, as kanso-ui's Dialog draws them: one\n// component, since the page pairs them by window size rather than offering a\n// choice. In a medium window or wider it is the basic dialog, a container on\n// surface container high with the 28dp corner, between 280 and 560dp wide,\n// centred over the scrim, with 24dp of padding all round, 16dp between the\n// headline and the body and 24dp between the body and the actions. In a\n// compact window, below 600dp, the same dialog fills the window as the page's\n// full-screen dialog: square corners, a 56dp header with the headline in\n// title large and a divider under it, and a 56dp action bar over a divider,\n// both inside the device's safe area.\n//\n// An alert dialog, `role=\"alertdialog\"`, is a question with two or three\n// answers rather than a task, and stays the basic dialog at every width, as\n// on web, where a question filling a phone read as a headline at the top of\n// the screen and its answers at the bottom with nothing between them.\n//\n// **It is drawn in a React Native `Modal`**, through src/modal, which keeps\n// React context, so the dialog keeps the `ThemeScope` around it, and which is\n// a window of its own on iOS and Android, above the screen and its overlays.\n// The `Modal` therefore hosts overlays of its own, so a snackbar or a popover\n// raised from inside the dialog draws above it rather than under it.\n//\n// **It animates out as well as in**, from the motion tokens: the panel scales\n// up from 90% on the emphasised decelerating curve, or rises 3% of the window\n// when it fills it, and leaves on the emphasised accelerating one, while the\n// scrim fades on the standard curve. Web only animates in, since React Aria\n// keeps a closing surface mounted only while a CSS animation runs; here the\n// dialog stays mounted until its exit has run. Under reduced motion the\n// panel appears and leaves at once, and the scrim still fades, which is what\n// says the dialog came and went.\n//\n// **A press on the scrim closes it**, unless `isDismissable` is false, and\n// Android's back gesture and VoiceOver's escape gesture close it, unless\n// `isKeyboardDismissDisabled`, the prop that keeps Escape from closing it on\n// web, which is the key React Native Web's `Modal` hands the same handler.\n// A button inside `Dialog` and outside its content opens it, and one given\n// `slot=\"close\"` inside the content closes it, through src/button's\n// slots.ts.\n//\n// **Focus moves into the dialog and back.** On iOS and Android the screen\n// reader is sent to the headline once the dialog shows, and back to the\n// button that opened it once it has gone. React Native Web's `Modal` traps\n// focus and restores it itself, and is the dialog element there, so on web it\n// takes the dialog's name and the panel takes no role of its own. That\n// `Modal` sets its role itself, so an alert dialog is announced as a dialog\n// in the web Storybook; kanso-ui, the library for web apps, keeps the role.\n\n// The panel's width bounds, the page's, and how far it travels as it\n// arrives: it scales up from 90% as the basic dialog, or rises 3% of the\n// window as the full-screen one, as web's keyframes have it.\nconst MIN_WIDTH = 280\nconst MAX_WIDTH = 560\nconst SCALE_FROM = 0.9\nconst RISE_FROM = 0.03\n\nconst NO_PARTS: Readonly<Record<DialogPart, number>> = {\n  footer: 0,\n  header: 0,\n  title: 0,\n}\n\nconst stylesOf = themedStyles(\n  ({ colors, radii, shadows, sizing, spacing }: ResolvedTheme) =>\n    StyleSheet.create({\n      // The page's 24dp between the body and the actions, and 8dp between\n      // the buttons. Actions that do not fit on one row wrap onto another,\n      // still at the trailing edge.\n      actions: {\n        alignItems: 'center',\n        flexDirection: 'row',\n        flexShrink: 0,\n        flexWrap: 'wrap',\n        gap: spacing.sm,\n        justifyContent: 'flex-end',\n        padding: spacing.xl,\n      },\n      // Full screen, the actions are the page's bottom action bar: 56dp at\n      // least, over a divider, so an action whose label wraps grows the bar\n      // rather than meeting the divider.\n      actionsFull: {\n        borderTopColor: colors.outlineVariant,\n        borderTopWidth: 1,\n        minHeight: sizing.rowSm,\n        paddingVertical: spacing.xs,\n      },\n      // The text a body is handed as a string, in the page's body medium on\n      // on-surface variant, which is what web's body sets for its text.\n      bodyText: {\n        color: colors.onSurfaceVariant,\n      },\n      // Both dialogs' container, whose corner, where it has one, clips the\n      // body's scroll.\n      container: {\n        backgroundColor: colors.surfaceContainerHigh,\n        overflow: 'hidden',\n      },\n      // The basic dialog's container, centred over the scrim and only as\n      // tall as the room the scrim's padding leaves, so the body scrolls\n      // rather than running off the screen.\n      containerBasic: {\n        borderRadius: radii.xl,\n        boxShadow: shadows.elevation3,\n        maxHeight: '100%',\n        maxWidth: MAX_WIDTH,\n        minWidth: MIN_WIDTH,\n        width: '100%',\n      },\n      // Full screen, the container fills the window with square corners, and\n      // its fill runs on under the safe area its content keeps out of.\n      containerFull: {\n        flex: 1,\n      },\n      // The page's 24dp above the headline and 16dp between it and the body,\n      // with the headline beside whatever else the header holds, a close\n      // button for one.\n      header: {\n        alignItems: 'center',\n        flexDirection: 'row',\n        flexShrink: 0,\n        gap: spacing.md,\n        justifyContent: 'space-between',\n        paddingBottom: spacing.lg,\n        paddingHorizontal: spacing.xl,\n        paddingTop: spacing.xl,\n      },\n      // Full screen, the header is the page's own 56dp bar, at least, under\n      // a divider.\n      headerFull: {\n        borderBottomColor: colors.outlineVariant,\n        borderBottomWidth: 1,\n        minHeight: sizing.rowSm,\n        paddingBottom: spacing.xs,\n        paddingTop: spacing.xs,\n      },\n      // The scrim centres the container, which is what makes the dialog a\n      // dialog rather than a sheet. Full screen it has no room to give. It\n      // takes no touches itself, so a press around the container reaches the\n      // scrim under it.\n      layout: {\n        alignItems: 'center',\n        bottom: 0,\n        justifyContent: 'center',\n        left: 0,\n        padding: spacing.xl,\n        pointerEvents: 'box-none',\n        position: 'absolute',\n        right: 0,\n        top: 0,\n      },\n      layoutFull: {\n        alignItems: 'stretch',\n        padding: 0,\n      },\n      // The headline gives way to whatever shares its row.\n      title: {\n        color: colors.onSurface,\n        flexShrink: 1,\n      },\n    }),\n)\n\n// What the content's parts read: which of the two dialogs is drawn, which\n// parts are there, and the headline's name and node.\ntype DialogLayout = {\n  readonly basic: boolean\n  readonly parts: Readonly<Record<DialogPart, number>>\n  readonly register: (part: DialogPart) => () => void\n  readonly setTitle: (node: HostInstance | null) => void\n  readonly titleId: string\n}\n\ntype DialogPart = 'footer' | 'header' | 'title'\n\nconst DialogLayoutContext = createContext<DialogLayout | null>(null)\nconst DialogTriggerContext = createContext<ModalTrigger | null>(null)\n\ntype DialogBodyProps = ScrollViewProps & {\n  readonly ref?: Ref<ComponentRef<typeof ScrollView>>\n}\n\ntype DialogContentProps = DialogOpenProps &\n  Omit<ViewProps, 'children' | 'role' | 'style'> & {\n    readonly children?: ReactNode\n    /**\n     * Whether a press on the scrim, outside the container, closes the\n     * dialog. Android's back gesture is `isKeyboardDismissDisabled`'s, and\n     * this says nothing about it, so a dialog that has to be answered from\n     * one of its actions turns off both.\n     * @default true\n     */\n    readonly isDismissable?: boolean\n    /**\n     * Keeps Android's back gesture, VoiceOver's escape gesture, and Escape on\n     * web, from closing the dialog.\n     * @default false\n     */\n    readonly isKeyboardDismissDisabled?: boolean\n    readonly ref?: Ref<ComponentRef<typeof View>>\n    /**\n     * `alertdialog` for a dialog interrupting with something that has to be\n     * answered before the app carries on. It also keeps the dialog the basic\n     * one in a compact window, centred and sized to its content, where a\n     * dialog of the default role fills the window.\n     * @default 'dialog'\n     */\n    readonly role?: 'alertdialog' | 'dialog'\n    readonly style?: StyleProp<ViewStyle>\n  }\n\ntype DialogOpenProps = ModalOpenProps & {\n  /** Whether the dialog starts open, when it keeps its own state. */\n  readonly defaultOpen?: boolean\n  /** Whether the dialog is open, when the call site holds the state. */\n  readonly isOpen?: boolean\n  /** Called with the new state as the dialog opens or closes. */\n  readonly onOpenChange?: (isOpen: boolean) => void\n}\n\ntype DialogPartProps = ViewProps & {\n  readonly ref?: Ref<ComponentRef<typeof View>>\n}\n\ntype DialogProps = DialogOpenProps & {\n  /** The button that opens the dialog, and `Dialog.Content`. */\n  readonly children?: ReactNode\n}\n\ntype DialogTitleProps = Omit<TextProps, 'role'> & {\n  readonly ref?: Ref<HostInstance>\n}\n\n// The body's padding. The page's 24dp all round is spent by whichever part\n// is at each end, so the body takes the top of it when no header is there\n// and the bottom when no footer is. Full screen, it keeps 24dp under the\n// header's divider as well, which is the content padding the page gives the\n// full-screen dialog.\nfunction bodyPaddingOf(\n  { basic, parts }: DialogLayout,\n  spacing: ResolvedTheme['spacing'],\n): ViewStyle {\n  return {\n    gap: spacing.lg,\n    paddingBottom: parts.footer > 0 ? 0 : spacing.xl,\n    paddingHorizontal: spacing.xl,\n    paddingTop: basic && parts.header > 0 ? 0 : spacing.xl,\n  }\n}\n\n/**\n * A modal dialog centred over the screen, and the same dialog filling the\n * window in a compact window, the dialogs spec page's basic and full-screen\n * dialogs, paired by window size as the page pairs them. An alert dialog\n * stays the basic one at every width. Pass `isOpen` with `onOpenChange` to\n * hold the open state, or `defaultOpen` to let it keep its own.\n *\n * ```tsx\n * <Dialog>\n *   <Button>Open</Button>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Headline</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>Supporting text</Dialog.Body>\n *     <Dialog.Footer>\n *       <Button slot=\"close\" variant=\"text\">Cancel</Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog>\n * ```\n *\n * Composed rather than configured by props, as web's is, since a dialog's\n * header, body and actions all take arbitrary content. A `Button` or\n * `IconButton` inside `Dialog` and outside its content opens it, and one\n * given `slot=\"close\"` anywhere inside the content closes it. A dialog nothing on\n * the screen opens leaves `Dialog` out and passes `isOpen` and\n * `onOpenChange` to `Dialog.Content` instead.\n */\nfunction Dialog({ children, defaultOpen, isOpen, onOpenChange }: DialogProps) {\n  const { context, slots } = useModalTrigger({\n    defaultOpen,\n    isOpen,\n    onOpenChange,\n  })\n\n  return (\n    <DialogTriggerContext value={context}>\n      <ButtonSlotContext value={slots}>{children}</ButtonSlotContext>\n    </DialogTriggerContext>\n  )\n}\n\n/**\n * What the dialog shows, as a body that scrolls when its content runs past\n * the room it has. A string is drawn in the page's body medium on on-surface\n * variant; anything else draws itself. `style`, `ref` and `testID` land on\n * the `ScrollView`.\n *\n * A body its content runs past takes focus, as web's is a tab stop, so a\n * keyboard can scroll it when nothing inside it takes focus; a call site's\n * own `focusable` still wins.\n */\nfunction DialogBody({\n  children,\n  contentContainerStyle,\n  onContentSizeChange,\n  onLayout,\n  ...props\n}: DialogBodyProps) {\n  const layout = useLayout('Dialog.Body')\n  const theme = useTheme()\n  const styles = stylesOf(theme)\n  const text = useTypeRole('bodyMedium')\n  const { spacing } = theme\n  const [content, setContent] = useState(0)\n  const [room, setRoom] = useState(0)\n  const measureContent = useCallback(\n    (width: number, height: number) => {\n      setContent(height)\n      onContentSizeChange?.(width, height)\n    },\n    [onContentSizeChange],\n  )\n  const measureRoom = useCallback(\n    (event: LayoutChangeEvent) => {\n      setRoom(event.nativeEvent.layout.height)\n      onLayout?.(event)\n    },\n    [onLayout],\n  )\n\n  return (\n    <ScrollView\n      focusable={content > room}\n      onContentSizeChange={measureContent}\n      onLayout={measureRoom}\n      {...props}\n      contentContainerStyle={composeStyles<ViewStyle>(\n        bodyPaddingOf(layout, spacing),\n        contentContainerStyle,\n      )}\n    >\n      {typeof children === 'string' ? (\n        <NativeText style={composeStyles<TextStyle>(text, styles.bodyText)}>\n          {children}\n        </NativeText>\n      ) : (\n        children\n      )}\n    </ScrollView>\n  )\n}\n\n/**\n * The dialog itself, and the scrim behind it. Everything the dialog shows\n * goes in here; the button that opens it stays outside it.\n *\n * Inside `Dialog`, the open state is the trigger's. On its own it is this\n * part's: `isOpen` with `onOpenChange` holds it, and a `slot=\"close\"`\n * button, the scrim and the back gesture all report through `onOpenChange`.\n * `style`, `ref` and `testID` land on the container.\n */\nfunction DialogContent({\n  children,\n  defaultOpen,\n  isDismissable = true,\n  isKeyboardDismissDisabled = false,\n  isOpen,\n  onOpenChange,\n  role = 'dialog',\n  style,\n  ...props\n}: DialogContentProps) {\n  const outer = use(DialogTriggerContext)\n  const { close, present, setPresent, slots, state } = useModalState(outer, {\n    defaultOpen,\n    isOpen,\n    onOpenChange,\n  })\n  const theme = useTheme()\n  const styles = stylesOf(theme)\n  const insets = use(SafeAreaInsetsContext) ?? NO_INSETS\n  const sizeClass = useWindowSizeClass()\n  const basic = role === 'alertdialog' || sizeClass !== 'compact'\n  const titleId = useId()\n  const [parts, setParts] = useState(NO_PARTS)\n  const [register] = useState(() => registerOf(setParts))\n  const [title, setTitle] = useState<HostInstance | null>(null)\n  const motion = useDialogMotion(state.isOpen, present, setPresent, basic)\n  const layout = useMemo<DialogLayout>(\n    () => ({ basic, parts, register, setTitle, titleId }),\n    [basic, parts, register, titleId],\n  )\n\n  if (!present) {\n    return null\n  }\n\n  const labelledBy = parts.title > 0 ? titleId : undefined\n\n  return (\n    <ModalWindow\n      isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n      labelledBy={labelledBy}\n      onClose={close}\n      onScrimPress={isDismissable && state.isOpen ? close : undefined}\n      scrim={motion.scrim}\n      title={title}\n    >\n      <View\n        style={composeStyles<ViewStyle>(\n          styles.layout,\n          basic ? undefined : styles.layoutFull,\n        )}\n      >\n        <Animated.View\n          {...panelRoleOf(role, labelledBy)}\n          onAccessibilityEscape={isKeyboardDismissDisabled ? undefined : close}\n          {...props}\n          style={composeStyles<AnimatedStyle<ViewStyle>>(\n            styles.container,\n            basic ? styles.containerBasic : styles.containerFull,\n            basic ? undefined : insetsOf(insets),\n            motion.panel,\n            style,\n          )}\n        >\n          <DialogLayoutContext value={layout}>\n            <ButtonSlotContext value={slots}>{children}</ButtonSlotContext>\n          </DialogLayoutContext>\n        </Animated.View>\n      </View>\n    </ModalWindow>\n  )\n}\n\n/**\n * The dialog's actions, at the trailing edge and wrapping onto another row\n * when they do not fit on one. Full screen they are the page's bottom action\n * bar. `style`, `ref` and `testID` land on its view.\n */\nfunction DialogFooter({ style, ...props }: DialogPartProps) {\n  const layout = useLayout('Dialog.Footer')\n  const styles = stylesOf(useTheme())\n  const { register } = layout\n\n  useLayoutEffect(() => register('footer'), [register])\n\n  return (\n    <View\n      {...props}\n      style={composeStyles<ViewStyle>(\n        styles.actions,\n        layout.basic ? undefined : styles.actionsFull,\n        style,\n      )}\n    />\n  )\n}\n\n/**\n * The dialog's header: its `Dialog.Title`, and anything beside it, such as a\n * close button. Full screen it is the page's header bar. `style`, `ref` and\n * `testID` land on its view.\n */\nfunction DialogHeader({ style, ...props }: DialogPartProps) {\n  const layout = useLayout('Dialog.Header')\n  const styles = stylesOf(useTheme())\n  const { register } = layout\n\n  useLayoutEffect(() => register('header'), [register])\n\n  return (\n    <View\n      {...props}\n      style={composeStyles<ViewStyle>(\n        styles.header,\n        layout.basic ? undefined : styles.headerFull,\n        style,\n      )}\n    />\n  )\n}\n\n/**\n * Names the dialog: the container is labelled by it, and a screen reader is\n * sent to it once the dialog shows. In headline small as the basic dialog,\n * and title large as the full-screen one, where it shares a 56dp bar.\n * `style`, `ref` and `testID` land on React Native's own Text.\n */\nfunction DialogTitle({ ref, style, ...props }: DialogTitleProps) {\n  const layout = useLayout('Dialog.Title')\n  const styles = stylesOf(useTheme())\n  const role = useTypeRole(layout.basic ? 'headlineSmall' : 'titleLarge')\n  const { register, setTitle } = layout\n\n  useLayoutEffect(() => register('title'), [register])\n\n  return (\n    <NativeText\n      {...props}\n      nativeID={layout.titleId}\n      ref={refsOf(setTitle, ref)}\n      role=\"heading\"\n      style={composeStyles<TextStyle>(role, styles.title, style)}\n    />\n  )\n}\n\n/**\n * The scrim's and the panel's motion, and the timer that unmounts the dialog\n * once its exit has run. The panel arrives over the medium duration on the\n * emphasised decelerating curve and leaves over the short one on the\n * accelerating curve, and the scrim fades over the short one on the standard\n * curve, both ways. Under reduced motion the panel arrives and leaves at once.\n */\nfunction useDialogMotion(\n  isOpen: boolean,\n  present: boolean,\n  setPresent: (present: boolean) => void,\n  basic: boolean,\n) {\n  const { motion } = useTheme()\n  const reduceMotion = useReducedMotion()\n  const { height } = useWindowDimensions()\n  const panel = useSharedValue(0)\n  const scrim = useSharedValue(0)\n\n  useEffect(() => {\n    const fade = {\n      duration: motion.durationShort2,\n      easing: Easing.bezier(...motion.easingStandard),\n    }\n\n    if (isOpen) {\n      scrim.set(withTiming(1, fade))\n      panel.set(\n        reduceMotion\n          ? 1\n          : withTiming(1, {\n              duration: motion.durationMedium1,\n              easing: Easing.bezier(...motion.easingEmphasizedDecelerate),\n            }),\n      )\n      return undefined\n    }\n\n    if (!present) {\n      return undefined\n    }\n\n    scrim.set(withTiming(0, fade))\n    panel.set(\n      reduceMotion\n        ? 0\n        : withTiming(0, {\n            duration: motion.durationShort3,\n            easing: Easing.bezier(...motion.easingEmphasizedAccelerate),\n          }),\n    )\n    const timer = setTimeout(\n      () => {\n        setPresent(false)\n      },\n      reduceMotion\n        ? motion.durationShort2\n        : Math.max(motion.durationShort2, motion.durationShort3),\n    )\n\n    return () => {\n      clearTimeout(timer)\n    }\n  }, [isOpen, motion, panel, present, reduceMotion, scrim, setPresent])\n\n  return {\n    panel: useAnimatedStyle(() => {\n      'worklet'\n      const shown = panel.get()\n\n      return basic\n        ? {\n            opacity: shown,\n            transform: [{ scale: SCALE_FROM + (1 - SCALE_FROM) * shown }],\n          }\n        : {\n            opacity: shown,\n            transform: [{ translateY: (1 - shown) * RISE_FROM * height }],\n          }\n    }),\n    scrim: useAnimatedStyle(() => {\n      'worklet'\n      return { opacity: scrim.get() }\n    }),\n  }\n}\n\nfunction useLayout(part: string) {\n  const layout = use(DialogLayoutContext)\n\n  if (layout === null) {\n    throw new Error(`${part} is drawn inside Dialog.Content.`)\n  }\n\n  return layout\n}\n\nDialog.Body = DialogBody\nDialog.Content = DialogContent\nDialog.Footer = DialogFooter\nDialog.Header = DialogHeader\nDialog.Title = DialogTitle\n\nexport {\n  Dialog,\n  DialogBody,\n  DialogContent,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n}\nexport type {\n  DialogBodyProps,\n  DialogContentProps,\n  DialogPartProps,\n  DialogProps,\n  DialogTitleProps,\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ComponentRef","ReactNode","Ref","HostInstance","LayoutChangeEvent","ScrollViewProps","StyleProp","TextProps","TextStyle","ViewProps","ViewStyle","AnimatedStyle","createContext","use","useCallback","useEffect","useId","useLayoutEffect","useMemo","useState","Text","NativeText","ScrollView","StyleSheet","useWindowDimensions","View","Animated","Easing","useAnimatedStyle","useReducedMotion","useSharedValue","withTiming","SafeAreaInsetsContext","ModalOpenProps","ModalTrigger","ResolvedTheme","ButtonSlotContext","useWindowSizeClass","insetsOf","ModalWindow","NO_INSETS","panelRoleOf","registerOf","useModalState","useModalTrigger","refsOf","useTheme","composeStyles","themedStyles","useTypeRole","MIN_WIDTH","MAX_WIDTH","SCALE_FROM","RISE_FROM","NO_PARTS","Readonly","Record","DialogPart","footer","header","title","stylesOf","colors","radii","shadows","sizing","spacing","create","actions","alignItems","flexDirection","flexShrink","flexWrap","gap","sm","justifyContent","padding","xl","actionsFull","borderTopColor","outlineVariant","borderTopWidth","minHeight","rowSm","paddingVertical","xs","bodyText","color","onSurfaceVariant","container","backgroundColor","surfaceContainerHigh","overflow","containerBasic","borderRadius","boxShadow","elevation3","maxHeight","maxWidth","minWidth","width","containerFull","flex","md","paddingBottom","lg","paddingHorizontal","paddingTop","headerFull","borderBottomColor","borderBottomWidth","layout","bottom","left","pointerEvents","position","right","top","layoutFull","onSurface","DialogLayout","basic","parts","register","part","setTitle","node","titleId","DialogLayoutContext","DialogTriggerContext","DialogBodyProps","ref","DialogContentProps","DialogOpenProps","Omit","children","isDismissable","isKeyboardDismissDisabled","role","style","defaultOpen","isOpen","onOpenChange","DialogPartProps","DialogProps","DialogTitleProps","bodyPaddingOf","Dialog","t0","$","_c","t1","context","slots","t2","t3","DialogBody","contentContainerStyle","onContentSizeChange","onLayout","props","useLayout","theme","styles","text","content","setContent","room","setRoom","height","measureContent","event","nativeEvent","measureRoom","T0","t4","t5","t6","DialogContent","undefined","outer","close","present","setPresent","state","insets","sizeClass","setParts","Symbol","for","motion","useDialogMotion","labelledBy","t7","t8","scrim","T1","t9","t10","t11","t12","t13","panel","t14","t15","t16","t17","t18","DialogFooter","DialogHeader","DialogTitle","reduceMotion","durationMedium1","durationShort2","durationShort3","easingEmphasizedAccelerate","easingEmphasizedDecelerate","easingStandard","fade","duration","easing","bezier","set","timer","setTimeout","Math","max","clearTimeout","shown","get","opacity","transform","scale","translateY","Error","Body","Content","Footer","Header","Title","_c","NativeText"],"sources":["../../../src/components/dialog/index.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode, Ref } from 'react'\nimport type {\n  HostInstance,\n  LayoutChangeEvent,\n  ScrollViewProps,\n  StyleProp,\n  TextProps,\n  TextStyle,\n  ViewProps,\n  ViewStyle,\n} from 'react-native'\nimport type { AnimatedStyle } from 'react-native-reanimated'\n\nimport {\n  createContext,\n  use,\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react'\nimport {\n  Text as NativeText,\n  ScrollView,\n  StyleSheet,\n  useWindowDimensions,\n  View,\n} from 'react-native'\nimport Animated, {\n  Easing,\n  useAnimatedStyle,\n  useReducedMotion,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated'\nimport { SafeAreaInsetsContext } from 'react-native-safe-area-context'\n\nimport type { ModalOpenProps, ModalTrigger } from '../../modal'\nimport type { ResolvedTheme } from '../../theme/scope'\n\nimport { ButtonSlotContext } from '../../button/slots'\nimport { useWindowSizeClass } from '../../hooks/useWindowSizeClass'\nimport {\n  insetsOf,\n  ModalWindow,\n  NO_INSETS,\n  panelRoleOf,\n  registerOf,\n  useModalState,\n  useModalTrigger,\n} from '../../modal'\nimport { refsOf } from '../../ref'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\nimport { useTypeRole } from '../../typography/roles'\n\n// The dialogs spec page's two dialogs, as kanso-ui's Dialog draws them: one\n// component, since the page pairs them by window size rather than offering a\n// choice. In a medium window or wider it is the basic dialog, a container on\n// surface container high with the 28dp corner, between 280 and 560dp wide,\n// centred over the scrim, with 24dp of padding all round, 16dp between the\n// headline and the body and 24dp between the body and the actions. In a\n// compact window, below 600dp, the same dialog fills the window as the page's\n// full-screen dialog: square corners, a 56dp header with the headline in\n// title large and a divider under it, and a 56dp action bar over a divider,\n// both inside the device's safe area.\n//\n// An alert dialog, `role=\"alertdialog\"`, is a question with two or three\n// answers rather than a task, and stays the basic dialog at every width, as\n// on web, where a question filling a phone read as a headline at the top of\n// the screen and its answers at the bottom with nothing between them.\n//\n// **It is drawn in a React Native `Modal`**, through src/modal, which keeps\n// React context, so the dialog keeps the `ThemeScope` around it, and which is\n// a window of its own on iOS and Android, above the screen and its overlays.\n// The `Modal` therefore hosts overlays of its own, so a snackbar or a popover\n// raised from inside the dialog draws above it rather than under it.\n//\n// **It animates out as well as in**, from the motion tokens: the panel scales\n// up from 90% on the emphasised decelerating curve, or rises 3% of the window\n// when it fills it, and leaves on the emphasised accelerating one, while the\n// scrim fades on the standard curve. Web only animates in, since React Aria\n// keeps a closing surface mounted only while a CSS animation runs; here the\n// dialog stays mounted until its exit has run. Under reduced motion the\n// panel appears and leaves at once, and the scrim still fades, which is what\n// says the dialog came and went.\n//\n// **A press on the scrim closes it**, unless `isDismissable` is false, and\n// Android's back gesture and VoiceOver's escape gesture close it, unless\n// `isKeyboardDismissDisabled`, the prop that keeps Escape from closing it on\n// web, which is the key React Native Web's `Modal` hands the same handler.\n// A button inside `Dialog` and outside its content opens it, and one given\n// `slot=\"close\"` inside the content closes it, through src/button's\n// slots.ts.\n//\n// **Focus moves into the dialog and back.** On iOS and Android the screen\n// reader is sent to the headline once the dialog shows, and back to the\n// button that opened it once it has gone. React Native Web's `Modal` traps\n// focus and restores it itself, and is the dialog element there, so on web it\n// takes the dialog's name and the panel takes no role of its own. That\n// `Modal` sets its role itself, so an alert dialog is announced as a dialog\n// in the web Storybook; kanso-ui, the library for web apps, keeps the role.\n\n// The panel's width bounds, the page's, and how far it travels as it\n// arrives: it scales up from 90% as the basic dialog, or rises 3% of the\n// window as the full-screen one, as web's keyframes have it.\nconst MIN_WIDTH = 280\nconst MAX_WIDTH = 560\nconst SCALE_FROM = 0.9\nconst RISE_FROM = 0.03\n\nconst NO_PARTS: Readonly<Record<DialogPart, number>> = {\n  footer: 0,\n  header: 0,\n  title: 0,\n}\n\nconst stylesOf = themedStyles(\n  ({ colors, radii, shadows, sizing, spacing }: ResolvedTheme) =>\n    StyleSheet.create({\n      // The page's 24dp between the body and the actions, and 8dp between\n      // the buttons. Actions that do not fit on one row wrap onto another,\n      // still at the trailing edge.\n      actions: {\n        alignItems: 'center',\n        flexDirection: 'row',\n        flexShrink: 0,\n        flexWrap: 'wrap',\n        gap: spacing.sm,\n        justifyContent: 'flex-end',\n        padding: spacing.xl,\n      },\n      // Full screen, the actions are the page's bottom action bar: 56dp at\n      // least, over a divider, so an action whose label wraps grows the bar\n      // rather than meeting the divider.\n      actionsFull: {\n        borderTopColor: colors.outlineVariant,\n        borderTopWidth: 1,\n        minHeight: sizing.rowSm,\n        paddingVertical: spacing.xs,\n      },\n      // The text a body is handed as a string, in the page's body medium on\n      // on-surface variant, which is what web's body sets for its text.\n      bodyText: {\n        color: colors.onSurfaceVariant,\n      },\n      // Both dialogs' container, whose corner, where it has one, clips the\n      // body's scroll.\n      container: {\n        backgroundColor: colors.surfaceContainerHigh,\n        overflow: 'hidden',\n      },\n      // The basic dialog's container, centred over the scrim and only as\n      // tall as the room the scrim's padding leaves, so the body scrolls\n      // rather than running off the screen.\n      containerBasic: {\n        borderRadius: radii.xl,\n        boxShadow: shadows.elevation3,\n        maxHeight: '100%',\n        maxWidth: MAX_WIDTH,\n        minWidth: MIN_WIDTH,\n        width: '100%',\n      },\n      // Full screen, the container fills the window with square corners, and\n      // its fill runs on under the safe area its content keeps out of.\n      containerFull: {\n        flex: 1,\n      },\n      // The page's 24dp above the headline and 16dp between it and the body,\n      // with the headline beside whatever else the header holds, a close\n      // button for one.\n      header: {\n        alignItems: 'center',\n        flexDirection: 'row',\n        flexShrink: 0,\n        gap: spacing.md,\n        justifyContent: 'space-between',\n        paddingBottom: spacing.lg,\n        paddingHorizontal: spacing.xl,\n        paddingTop: spacing.xl,\n      },\n      // Full screen, the header is the page's own 56dp bar, at least, under\n      // a divider.\n      headerFull: {\n        borderBottomColor: colors.outlineVariant,\n        borderBottomWidth: 1,\n        minHeight: sizing.rowSm,\n        paddingBottom: spacing.xs,\n        paddingTop: spacing.xs,\n      },\n      // The scrim centres the container, which is what makes the dialog a\n      // dialog rather than a sheet. Full screen it has no room to give. It\n      // takes no touches itself, so a press around the container reaches the\n      // scrim under it.\n      layout: {\n        alignItems: 'center',\n        bottom: 0,\n        justifyContent: 'center',\n        left: 0,\n        padding: spacing.xl,\n        pointerEvents: 'box-none',\n        position: 'absolute',\n        right: 0,\n        top: 0,\n      },\n      layoutFull: {\n        alignItems: 'stretch',\n        padding: 0,\n      },\n      // The headline gives way to whatever shares its row.\n      title: {\n        color: colors.onSurface,\n        flexShrink: 1,\n      },\n    }),\n)\n\n// What the content's parts read: which of the two dialogs is drawn, which\n// parts are there, and the headline's name and node.\ntype DialogLayout = {\n  readonly basic: boolean\n  readonly parts: Readonly<Record<DialogPart, number>>\n  readonly register: (part: DialogPart) => () => void\n  readonly setTitle: (node: HostInstance | null) => void\n  readonly titleId: string\n}\n\ntype DialogPart = 'footer' | 'header' | 'title'\n\nconst DialogLayoutContext = createContext<DialogLayout | null>(null)\nconst DialogTriggerContext = createContext<ModalTrigger | null>(null)\n\ntype DialogBodyProps = ScrollViewProps & {\n  readonly ref?: Ref<ComponentRef<typeof ScrollView>>\n}\n\ntype DialogContentProps = DialogOpenProps &\n  Omit<ViewProps, 'children' | 'role' | 'style'> & {\n    readonly children?: ReactNode\n    /**\n     * Whether a press on the scrim, outside the container, closes the\n     * dialog. Android's back gesture is `isKeyboardDismissDisabled`'s, and\n     * this says nothing about it, so a dialog that has to be answered from\n     * one of its actions turns off both.\n     * @default true\n     */\n    readonly isDismissable?: boolean\n    /**\n     * Keeps Android's back gesture, VoiceOver's escape gesture, and Escape on\n     * web, from closing the dialog.\n     * @default false\n     */\n    readonly isKeyboardDismissDisabled?: boolean\n    readonly ref?: Ref<ComponentRef<typeof View>>\n    /**\n     * `alertdialog` for a dialog interrupting with something that has to be\n     * answered before the app carries on. It also keeps the dialog the basic\n     * one in a compact window, centred and sized to its content, where a\n     * dialog of the default role fills the window.\n     * @default 'dialog'\n     */\n    readonly role?: 'alertdialog' | 'dialog'\n    readonly style?: StyleProp<ViewStyle>\n  }\n\ntype DialogOpenProps = ModalOpenProps & {\n  /** Whether the dialog starts open, when it keeps its own state. */\n  readonly defaultOpen?: boolean\n  /** Whether the dialog is open, when the call site holds the state. */\n  readonly isOpen?: boolean\n  /** Called with the new state as the dialog opens or closes. */\n  readonly onOpenChange?: (isOpen: boolean) => void\n}\n\ntype DialogPartProps = ViewProps & {\n  readonly ref?: Ref<ComponentRef<typeof View>>\n}\n\ntype DialogProps = DialogOpenProps & {\n  /** The button that opens the dialog, and `Dialog.Content`. */\n  readonly children?: ReactNode\n}\n\ntype DialogTitleProps = Omit<TextProps, 'role'> & {\n  readonly ref?: Ref<HostInstance>\n}\n\n// The body's padding. The page's 24dp all round is spent by whichever part\n// is at each end, so the body takes the top of it when no header is there\n// and the bottom when no footer is. Full screen, it keeps 24dp under the\n// header's divider as well, which is the content padding the page gives the\n// full-screen dialog.\nfunction bodyPaddingOf(\n  { basic, parts }: DialogLayout,\n  spacing: ResolvedTheme['spacing'],\n): ViewStyle {\n  return {\n    gap: spacing.lg,\n    paddingBottom: parts.footer > 0 ? 0 : spacing.xl,\n    paddingHorizontal: spacing.xl,\n    paddingTop: basic && parts.header > 0 ? 0 : spacing.xl,\n  }\n}\n\n/**\n * A modal dialog centred over the screen, and the same dialog filling the\n * window in a compact window, the dialogs spec page's basic and full-screen\n * dialogs, paired by window size as the page pairs them. An alert dialog\n * stays the basic one at every width. Pass `isOpen` with `onOpenChange` to\n * hold the open state, or `defaultOpen` to let it keep its own.\n *\n * ```tsx\n * <Dialog>\n *   <Button>Open</Button>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Headline</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>Supporting text</Dialog.Body>\n *     <Dialog.Footer>\n *       <Button slot=\"close\" variant=\"text\">Cancel</Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog>\n * ```\n *\n * Composed rather than configured by props, as web's is, since a dialog's\n * header, body and actions all take arbitrary content. A `Button`,\n * `IconButton` or `Chip` inside `Dialog` and outside its content opens it,\n * and a button given `slot=\"close\"` anywhere inside the content closes it. A\n * dialog nothing on the screen opens leaves `Dialog` out and passes `isOpen`\n * and `onOpenChange` to `Dialog.Content` instead.\n */\nfunction Dialog({ children, defaultOpen, isOpen, onOpenChange }: DialogProps) {\n  const { context, slots } = useModalTrigger({\n    defaultOpen,\n    isOpen,\n    onOpenChange,\n  })\n\n  return (\n    <DialogTriggerContext value={context}>\n      <ButtonSlotContext value={slots}>{children}</ButtonSlotContext>\n    </DialogTriggerContext>\n  )\n}\n\n/**\n * What the dialog shows, as a body that scrolls when its content runs past\n * the room it has. A string is drawn in the page's body medium on on-surface\n * variant; anything else draws itself. `style`, `ref` and `testID` land on\n * the `ScrollView`.\n *\n * A body its content runs past takes focus, as web's is a tab stop, so a\n * keyboard can scroll it when nothing inside it takes focus; a call site's\n * own `focusable` still wins.\n */\nfunction DialogBody({\n  children,\n  contentContainerStyle,\n  onContentSizeChange,\n  onLayout,\n  ...props\n}: DialogBodyProps) {\n  const layout = useLayout('Dialog.Body')\n  const theme = useTheme()\n  const styles = stylesOf(theme)\n  const text = useTypeRole('bodyMedium')\n  const { spacing } = theme\n  const [content, setContent] = useState(0)\n  const [room, setRoom] = useState(0)\n  const measureContent = useCallback(\n    (width: number, height: number) => {\n      setContent(height)\n      onContentSizeChange?.(width, height)\n    },\n    [onContentSizeChange],\n  )\n  const measureRoom = useCallback(\n    (event: LayoutChangeEvent) => {\n      setRoom(event.nativeEvent.layout.height)\n      onLayout?.(event)\n    },\n    [onLayout],\n  )\n\n  return (\n    <ScrollView\n      focusable={content > room}\n      onContentSizeChange={measureContent}\n      onLayout={measureRoom}\n      {...props}\n      contentContainerStyle={composeStyles<ViewStyle>(\n        bodyPaddingOf(layout, spacing),\n        contentContainerStyle,\n      )}\n    >\n      {typeof children === 'string' ? (\n        <NativeText style={composeStyles<TextStyle>(text, styles.bodyText)}>\n          {children}\n        </NativeText>\n      ) : (\n        children\n      )}\n    </ScrollView>\n  )\n}\n\n/**\n * The dialog itself, and the scrim behind it. Everything the dialog shows\n * goes in here; the button that opens it stays outside it.\n *\n * Inside `Dialog`, the open state is the trigger's. On its own it is this\n * part's: `isOpen` with `onOpenChange` holds it, and a `slot=\"close\"`\n * button, the scrim and the back gesture all report through `onOpenChange`.\n * `style`, `ref` and `testID` land on the container.\n */\nfunction DialogContent({\n  children,\n  defaultOpen,\n  isDismissable = true,\n  isKeyboardDismissDisabled = false,\n  isOpen,\n  onOpenChange,\n  role = 'dialog',\n  style,\n  ...props\n}: DialogContentProps) {\n  const outer = use(DialogTriggerContext)\n  const { close, present, setPresent, slots, state } = useModalState(outer, {\n    defaultOpen,\n    isOpen,\n    onOpenChange,\n  })\n  const theme = useTheme()\n  const styles = stylesOf(theme)\n  const insets = use(SafeAreaInsetsContext) ?? NO_INSETS\n  const sizeClass = useWindowSizeClass()\n  const basic = role === 'alertdialog' || sizeClass !== 'compact'\n  const titleId = useId()\n  const [parts, setParts] = useState(NO_PARTS)\n  const [register] = useState(() => registerOf(setParts))\n  const [title, setTitle] = useState<HostInstance | null>(null)\n  const motion = useDialogMotion(state.isOpen, present, setPresent, basic)\n  const layout = useMemo<DialogLayout>(\n    () => ({ basic, parts, register, setTitle, titleId }),\n    [basic, parts, register, titleId],\n  )\n\n  if (!present) {\n    return null\n  }\n\n  const labelledBy = parts.title > 0 ? titleId : undefined\n\n  return (\n    <ModalWindow\n      isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n      labelledBy={labelledBy}\n      onClose={close}\n      onScrimPress={isDismissable && state.isOpen ? close : undefined}\n      scrim={motion.scrim}\n      title={title}\n    >\n      <View\n        style={composeStyles<ViewStyle>(\n          styles.layout,\n          basic ? undefined : styles.layoutFull,\n        )}\n      >\n        <Animated.View\n          {...panelRoleOf(role, labelledBy)}\n          onAccessibilityEscape={isKeyboardDismissDisabled ? undefined : close}\n          {...props}\n          style={composeStyles<AnimatedStyle<ViewStyle>>(\n            styles.container,\n            basic ? styles.containerBasic : styles.containerFull,\n            basic ? undefined : insetsOf(insets),\n            motion.panel,\n            style,\n          )}\n        >\n          <DialogLayoutContext value={layout}>\n            <ButtonSlotContext value={slots}>{children}</ButtonSlotContext>\n          </DialogLayoutContext>\n        </Animated.View>\n      </View>\n    </ModalWindow>\n  )\n}\n\n/**\n * The dialog's actions, at the trailing edge and wrapping onto another row\n * when they do not fit on one. Full screen they are the page's bottom action\n * bar. `style`, `ref` and `testID` land on its view.\n */\nfunction DialogFooter({ style, ...props }: DialogPartProps) {\n  const layout = useLayout('Dialog.Footer')\n  const styles = stylesOf(useTheme())\n  const { register } = layout\n\n  useLayoutEffect(() => register('footer'), [register])\n\n  return (\n    <View\n      {...props}\n      style={composeStyles<ViewStyle>(\n        styles.actions,\n        layout.basic ? undefined : styles.actionsFull,\n        style,\n      )}\n    />\n  )\n}\n\n/**\n * The dialog's header: its `Dialog.Title`, and anything beside it, such as a\n * close button. Full screen it is the page's header bar. `style`, `ref` and\n * `testID` land on its view.\n */\nfunction DialogHeader({ style, ...props }: DialogPartProps) {\n  const layout = useLayout('Dialog.Header')\n  const styles = stylesOf(useTheme())\n  const { register } = layout\n\n  useLayoutEffect(() => register('header'), [register])\n\n  return (\n    <View\n      {...props}\n      style={composeStyles<ViewStyle>(\n        styles.header,\n        layout.basic ? undefined : styles.headerFull,\n        style,\n      )}\n    />\n  )\n}\n\n/**\n * Names the dialog: the container is labelled by it, and a screen reader is\n * sent to it once the dialog shows. In headline small as the basic dialog,\n * and title large as the full-screen one, where it shares a 56dp bar.\n * `style`, `ref` and `testID` land on React Native's own Text.\n */\nfunction DialogTitle({ ref, style, ...props }: DialogTitleProps) {\n  const layout = useLayout('Dialog.Title')\n  const styles = stylesOf(useTheme())\n  const role = useTypeRole(layout.basic ? 'headlineSmall' : 'titleLarge')\n  const { register, setTitle } = layout\n\n  useLayoutEffect(() => register('title'), [register])\n\n  return (\n    <NativeText\n      {...props}\n      nativeID={layout.titleId}\n      ref={refsOf(setTitle, ref)}\n      role=\"heading\"\n      style={composeStyles<TextStyle>(role, styles.title, style)}\n    />\n  )\n}\n\n/**\n * The scrim's and the panel's motion, and the timer that unmounts the dialog\n * once its exit has run. The panel arrives over the medium duration on the\n * emphasised decelerating curve and leaves over the short one on the\n * accelerating curve, and the scrim fades over the short one on the standard\n * curve, both ways. Under reduced motion the panel arrives and leaves at once.\n */\nfunction useDialogMotion(\n  isOpen: boolean,\n  present: boolean,\n  setPresent: (present: boolean) => void,\n  basic: boolean,\n) {\n  const { motion } = useTheme()\n  const reduceMotion = useReducedMotion()\n  const { height } = useWindowDimensions()\n  const panel = useSharedValue(0)\n  const scrim = useSharedValue(0)\n\n  useEffect(() => {\n    const fade = {\n      duration: motion.durationShort2,\n      easing: Easing.bezier(...motion.easingStandard),\n    }\n\n    if (isOpen) {\n      scrim.set(withTiming(1, fade))\n      panel.set(\n        reduceMotion\n          ? 1\n          : withTiming(1, {\n              duration: motion.durationMedium1,\n              easing: Easing.bezier(...motion.easingEmphasizedDecelerate),\n            }),\n      )\n      return undefined\n    }\n\n    if (!present) {\n      return undefined\n    }\n\n    scrim.set(withTiming(0, fade))\n    panel.set(\n      reduceMotion\n        ? 0\n        : withTiming(0, {\n            duration: motion.durationShort3,\n            easing: Easing.bezier(...motion.easingEmphasizedAccelerate),\n          }),\n    )\n    const timer = setTimeout(\n      () => {\n        setPresent(false)\n      },\n      reduceMotion\n        ? motion.durationShort2\n        : Math.max(motion.durationShort2, motion.durationShort3),\n    )\n\n    return () => {\n      clearTimeout(timer)\n    }\n  }, [isOpen, motion, panel, present, reduceMotion, scrim, setPresent])\n\n  return {\n    panel: useAnimatedStyle(() => {\n      'worklet'\n      const shown = panel.get()\n\n      return basic\n        ? {\n            opacity: shown,\n            transform: [{ scale: SCALE_FROM + (1 - SCALE_FROM) * shown }],\n          }\n        : {\n            opacity: shown,\n            transform: [{ translateY: (1 - shown) * RISE_FROM * height }],\n          }\n    }),\n    scrim: useAnimatedStyle(() => {\n      'worklet'\n      return { opacity: scrim.get() }\n    }),\n  }\n}\n\nfunction useLayout(part: string) {\n  const layout = use(DialogLayoutContext)\n\n  if (layout === null) {\n    throw new Error(`${part} is drawn inside Dialog.Content.`)\n  }\n\n  return layout\n}\n\nDialog.Body = DialogBody\nDialog.Content = DialogContent\nDialog.Footer = DialogFooter\nDialog.Header = DialogHeader\nDialog.Title = DialogTitle\n\nexport {\n  Dialog,\n  DialogBody,\n  DialogContent,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n}\nexport type {\n  DialogBodyProps,\n  DialogContentProps,\n  DialogPartProps,\n  DialogProps,\n  DialogTitleProps,\n}\n"],"mappings":"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"}

package/dist/components/drop-zone/index.d.ts

@@ -46,7 +46,7 @@ type FileTriggerProps = {
   readonly acceptedFileTypes?: readonly string[];
   /** Whether more than one file can be picked. @default false */
   readonly allowsMultiple?: boolean;
-  /** The Button, IconButton or Fab that opens the chooser. */
+  /** The Button, IconButton, Fab or Chip that opens the chooser. */
   readonly children?: ReactNode;
   /**
    * Opens the camera rather than the chooser, facing away from the person
@@ -97,8 +97,8 @@ declare function DropZone({ 'aria-label': ariaLabel, children, getDropOperation,
  * ```
  *
  * It renders nothing of its own, so it takes no `style`: what is seen is the
- * Button, IconButton or Fab it wraps, which opens the chooser after its own
- * `onPress`. `allowsMultiple` takes more than one file, and `defaultCamera`
+ * Button, IconButton, Fab or Chip it wraps, which opens the chooser after its
+ * own `onPress`. `allowsMultiple` takes more than one file, and `defaultCamera`
  * opens the camera instead. kanso-ui's `acceptDirectory` is not here, since
  * neither iOS's chooser nor Android's picks a folder.
  *

package/dist/components/drop-zone/index.js

@@ -216,8 +216,8 @@ function DropZone(t0) {
 * ```
 *
 * It renders nothing of its own, so it takes no `style`: what is seen is the
-* Button, IconButton or Fab it wraps, which opens the chooser after its own
-* `onPress`. `allowsMultiple` takes more than one file, and `defaultCamera`
+* Button, IconButton, Fab or Chip it wraps, which opens the chooser after its
+* own `onPress`. `allowsMultiple` takes more than one file, and `defaultCamera`
 * opens the camera instead. kanso-ui's `acceptDirectory` is not here, since
 * neither iOS's chooser nor Android's picks a folder.
 *

package/dist/components/drop-zone/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ComponentRef","ReactNode","Ref","GestureResponderEvent","HostInstance","StyleProp","TextStyle","ViewStyle","View","ViewType","useEffect","useEffectEvent","useRef","useState","Platform","Pressable","StyleSheet","Text","ButtonSlots","DragTypes","DropEnterEvent","DropEvent","DropExitEvent","DropOperation","PickedFile","ButtonSlotContext","fileItemOf","isDropTarget","operationOf","typesOf","watchDrops","pickThen","preparePicker","usePressFeedback","refsOf","withOpacity","useTheme","composeStyles","themedStyles","useTypeRole","MIN_HEIGHT","stylesOf","colors","radii","spacing","stateLayerOpacity","disabled","onSurface","disabledContent","create","label","color","onSurfaceVariant","textAlign","labelBox","pointerEvents","labelDisabled","labelOver","onPrimaryContainer","press","borderRadius","md","ring","outlineOffset","root","alignItems","backgroundColor","surface","borderColor","outlineVariant","borderStyle","borderWidth","boxSizing","gap","justifyContent","minHeight","padding","xl","rootDisabled","rootOver","primaryContainer","primary","DropZoneProps","children","getDropOperation","types","allowedOperations","isDisabled","onDrop","event","onDropEnter","onDropExit","ref","style","testID","FileTriggerProps","acceptedFileTypes","allowsMultiple","defaultCamera","onSelect","files","DropZone","t0","$","_c","ariaLabel","t1","undefined","theme","styles","bodyMedium","isOver","setOver","node","web","OS","t2","t3","corners","feedback","t4","handlersNow","t5","disabledNow","name","over","t6","target","current","t7","Symbol","for","T0","t8","t9","t10","t11","t12","t13","handlers","pressOf","absoluteFill","layer","t14","t15","FileTrigger","pick","slotsOf","locationX","x","locationY","y","nativeEvent","dropOperation","map","file","type","items","default","_c"],"sources":["../../../src/components/drop-zone/index.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode, Ref } from 'react'\nimport type {\n  GestureResponderEvent,\n  HostInstance,\n  StyleProp,\n  TextStyle,\n  ViewStyle,\n  View as ViewType,\n} from 'react-native'\n\nimport { useEffect, useEffectEvent, useRef, useState } from 'react'\nimport { Platform, Pressable, StyleSheet, Text, View } from 'react-native'\n\nimport type { ButtonSlots } from '../../button/slots'\nimport type {\n  DragTypes,\n  DropEnterEvent,\n  DropEvent,\n  DropExitEvent,\n  DropOperation,\n} from '../../drop'\nimport type { PickedFile } from '../../files'\n\nimport { ButtonSlotContext } from '../../button/slots'\nimport {\n  fileItemOf,\n  isDropTarget,\n  operationOf,\n  typesOf,\n  watchDrops,\n} from '../../drop'\nimport { pickThen, preparePicker } from '../../files'\nimport { usePressFeedback } from '../../press'\nimport { refsOf } from '../../ref'\nimport { withOpacity } from '../../theme/color'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\nimport { useTypeRole } from '../../typography/roles'\n\n// A place to drop files, and a way to open the file chooser from a button, as\n// kanso-ui's DropZone and FileTrigger are. Material Design carries no page for\n// either, so the target is drawn from the nearest thing it does carry, the\n// outlined card: the same surface, 1dp outline variant rule and medium\n// corner, at least 160dp tall with 24dp of padding and its label centred in\n// body medium. Web's two departures from that card are kept. **The rule is\n// dashed**, since a solid one reads as a card holding content and a dashed one\n// as a place to put something. **Something over it fills it** with primary\n// container, the rule turning primary and solid, the pair a selected row\n// takes, so \"this is the target\" looks like \"this is the one chosen\". It\n// switches at once rather than over web's short transition, as a card's\n// press colours do.\n//\n// What a drop is depends on the platform, since neither iOS nor Android hands\n// React Native a drag from another app. **Under React Native Web it is HTML5\n// drag and drop**, as on web, through src/drop. **On iOS and Android the\n// target is a press target** that opens the chooser and hands `onDrop` what\n// was picked, as file drop items, so a call site writes one handler for both.\n// The drop operation it reports is `copy`, which is true of a pick as it is\n// of a drop from the desktop: the chooser hands the app a copy in its cache,\n// and the person's own file stays where it was. So a call site reading the\n// operation is told nothing a pick does not do. The press target lies under\n// what the target holds, so a button inside it still takes its own presses,\n// and VoiceOver reaches both rather than one.\n//\n// Disabled is web's: the rule and the label in on surface at the disabled\n// content opacity, over the surface, so a dashed rule at full strength stops\n// reading as somewhere to aim at, and nothing is taken.\n//\n// FileTrigger renders nothing of its own. The Button, IconButton or Fab it\n// wraps opens the chooser through src/button's default slot, the way a\n// button opens the overlay around it, as web's React Aria hands its\n// FileTrigger's press to whatever it wraps.\n\n// The least height a target takes, from web: room enough to aim at.\nconst MIN_HEIGHT = 160\n\nconst stylesOf = themedStyles(\n  ({ colors, radii, spacing, stateLayerOpacity }) => {\n    const disabled = withOpacity(\n      colors.onSurface,\n      stateLayerOpacity.disabledContent,\n    )\n\n    return StyleSheet.create({\n      // The label, in the muted role, centred under the target's content.\n      label: {\n        color: colors.onSurfaceVariant,\n        textAlign: 'center',\n      },\n      labelBox: {\n        pointerEvents: 'none',\n      },\n      labelDisabled: {\n        color: disabled,\n      },\n      labelOver: {\n        color: colors.onPrimaryContainer,\n      },\n      // The press target fills the target under its content, inside the\n      // rule. Its ring is drawn over the target's edge rather than around\n      // it, as web's is, so a parent clipping its children never cuts the\n      // outer half away: set 1dp into the press target, it covers the rule\n      // and the 1dp inside it.\n      press: {\n        borderRadius: radii.md,\n      },\n      ring: {\n        outlineOffset: -1,\n      },\n      root: {\n        alignItems: 'center',\n        backgroundColor: colors.surface,\n        borderColor: colors.outlineVariant,\n        borderRadius: radii.md,\n        borderStyle: 'dashed',\n        borderWidth: 1,\n        boxSizing: 'border-box',\n        gap: spacing.md,\n        justifyContent: 'center',\n        minHeight: MIN_HEIGHT,\n        padding: spacing.xl,\n      },\n      rootDisabled: {\n        borderColor: disabled,\n      },\n      rootOver: {\n        backgroundColor: colors.primaryContainer,\n        borderColor: colors.primary,\n        borderStyle: 'solid',\n      },\n    })\n  },\n)\n\ntype DropZoneProps = {\n  /**\n   * Names the target without drawing anything, for a page that already says\n   * what it takes. Beats `label` as the name.\n   */\n  readonly 'aria-label'?: string\n  /** What the target holds beside its label, such as a FileTrigger. */\n  readonly children?: ReactNode\n  /**\n   * What a drop of these types would do, from the operations the drag\n   * allows: `cancel` refuses it. A pick on iOS and Android allows `copy`\n   * alone. Left out, the first the drag allows.\n   */\n  readonly getDropOperation?: (\n    types: DragTypes,\n    allowedOperations: readonly DropOperation[],\n  ) => DropOperation\n  /**\n   * Takes nothing: no drop, and on iOS and Android no press, drawn faded.\n   * @default false\n   */\n  readonly isDisabled?: boolean\n  /**\n   * What the target says it is for, drawn inside it and used as its name. A\n   * string rather than a node, since it is what names the target; anything\n   * richer goes in `children`.\n   */\n  readonly label?: string\n  /**\n   * Called with what landed: what was dropped under React Native Web, what\n   * was picked on iOS and Android.\n   */\n  readonly onDrop?: (event: DropEvent) => void\n  /** Called once something the target takes comes over it. Under React Native Web alone. */\n  readonly onDropEnter?: (event: DropEnterEvent) => void\n  /** Called once what came over it leaves, or lands. Under React Native Web alone. */\n  readonly onDropExit?: (event: DropExitEvent) => void\n  readonly ref?: Ref<ComponentRef<typeof ViewType>>\n  readonly style?: StyleProp<ViewStyle>\n  readonly testID?: string\n}\n\ntype FileTriggerProps = {\n  /** The MIME types the chooser offers, such as `image/png` or `image/*`. Every type when left out. */\n  readonly acceptedFileTypes?: readonly string[]\n  /** Whether more than one file can be picked. @default false */\n  readonly allowsMultiple?: boolean\n  /** The Button, IconButton or Fab that opens the chooser. */\n  readonly children?: ReactNode\n  /**\n   * Opens the camera rather than the chooser, facing away from the person\n   * for `environment` or towards them for `user`, as web's `capture` does.\n   * It takes one photo, or a video where `acceptedFileTypes` names a video\n   * type.\n   */\n  readonly defaultCamera?: 'environment' | 'user'\n  /** Called with what was picked. Not called when the person backs out. */\n  readonly onSelect?: (files: readonly PickedFile[]) => void\n}\n\n/**\n * A place to drop files. Under React Native Web it takes HTML5 drag and drop,\n * as kanso-ui's does; on iOS and Android, which hand an app no drag from\n * another, pressing it opens the file chooser, and `onDrop` is handed what\n * was picked. Either way `onDrop` is handed the items, which\n * `isFileDropItem` and `isTextDropItem` pick apart.\n *\n * ```tsx\n * <DropZone label=\"Drop here\" onDrop={handleDrop}>\n *   <FileTrigger onSelect={handleSelect}>\n *     <Button variant=\"outlined\">Label</Button>\n *   </FileTrigger>\n * </DropZone>\n * ```\n *\n * It is drawn from the outlined card, with a dashed rule rather than a solid\n * one, and fills with the primary container while something is over it.\n * `label` both draws the words and names the target; `aria-label` names it\n * without drawing anything.\n *\n * The chooser is expo-document-picker's, which an app installs alongside the\n * library. Without it a press writes to the console that the package is\n * missing, and nothing opens.\n *\n * `style`, `ref` and `testID` land on the target itself, which is what a\n * layout places.\n */\nfunction DropZone({\n  'aria-label': ariaLabel,\n  children,\n  getDropOperation,\n  isDisabled = false,\n  label,\n  onDrop,\n  onDropEnter,\n  onDropExit,\n  ref,\n  style,\n  testID,\n}: DropZoneProps) {\n  const theme = useTheme()\n  const { colors, radii } = theme\n  const styles = stylesOf(theme)\n  const bodyMedium = useTypeRole('bodyMedium')\n  const [isOver, setOver] = useState(false)\n  const node = useRef<HostInstance | null>(null)\n  const web = Platform.OS === 'web'\n  const feedback = usePressFeedback({\n    color: colors.onSurface,\n    corners: { borderRadius: radii.md },\n    disabled: isDisabled,\n  })\n  const handlersNow = useEffectEvent(() => ({\n    getDropOperation,\n    onDrop,\n    onDropEnter,\n    onDropExit,\n  }))\n  const disabledNow = useEffectEvent(() => isDisabled)\n  const name = ariaLabel ?? label\n  const over = isOver && !isDisabled\n\n  useEffect(() => {\n    if (!web) {\n      preparePicker({})\n      return undefined\n    }\n\n    const target = node.current\n\n    if (!isDropTarget(target)) {\n      return undefined\n    }\n    return watchDrops(\n      target,\n      () => handlersNow(),\n      () => disabledNow(),\n      setOver,\n    )\n  }, [web])\n\n  return (\n    <View\n      // Under React Native Web the target names itself, as a group, and says\n      // it is disabled, since there is no press target to carry either.\n      aria-disabled={web && isDisabled ? true : undefined}\n      aria-label={web ? name : undefined}\n      ref={refsOf<HostInstance>(ref, node)}\n      role={web && name !== undefined ? 'group' : undefined}\n      style={composeStyles<ViewStyle>(\n        styles.root,\n        over ? styles.rootOver : undefined,\n        isDisabled ? styles.rootDisabled : undefined,\n        style,\n      )}\n      testID={testID}\n    >\n      {web ? null : (\n        <Pressable\n          {...feedback.handlers}\n          aria-label={name}\n          disabled={isDisabled}\n          onPress={pressOf(getDropOperation, onDrop)}\n          role=\"button\"\n          style={composeStyles<ViewStyle>(\n            StyleSheet.absoluteFill,\n            styles.press,\n            feedback.ring,\n            feedback.ring === undefined ? undefined : styles.ring,\n          )}\n        >\n          {feedback.layer}\n        </Pressable>\n      )}\n      {label === undefined ? null : (\n        // Hidden from a screen reader, which hears it as the target's name,\n        // and from touches, which land on the press target under it.\n        <View aria-hidden style={styles.labelBox}>\n          <Text\n            style={composeStyles<TextStyle>(\n              bodyMedium,\n              styles.label,\n              over ? styles.labelOver : undefined,\n              isDisabled ? styles.labelDisabled : undefined,\n            )}\n          >\n            {label}\n          </Text>\n        </View>\n      )}\n      {children}\n    </View>\n  )\n}\n\n/**\n * Opens the file chooser from the button it wraps, and hands `onSelect`\n * what was picked.\n *\n * ```tsx\n * <FileTrigger acceptedFileTypes={['image/*']} onSelect={handleSelect}>\n *   <Button>Label</Button>\n * </FileTrigger>\n * ```\n *\n * It renders nothing of its own, so it takes no `style`: what is seen is the\n * Button, IconButton or Fab it wraps, which opens the chooser after its own\n * `onPress`. `allowsMultiple` takes more than one file, and `defaultCamera`\n * opens the camera instead. kanso-ui's `acceptDirectory` is not here, since\n * neither iOS's chooser nor Android's picks a folder.\n *\n * The chooser is expo-document-picker's and the camera expo-image-picker's,\n * which an app installs alongside the library, the second only for\n * `defaultCamera`. Without the one it needs, a press writes to the console\n * which package is missing, and nothing opens.\n */\nfunction FileTrigger({\n  acceptedFileTypes,\n  allowsMultiple,\n  children,\n  defaultCamera,\n  onSelect,\n}: FileTriggerProps) {\n  useEffect(() => {\n    preparePicker({ defaultCamera })\n  }, [defaultCamera])\n\n  const pick = () => {\n    void pickThen(\n      { acceptedFileTypes, allowsMultiple, defaultCamera },\n      (files) => {\n        onSelect?.(files)\n      },\n    )\n  }\n\n  return <ButtonSlotContext value={slotsOf(pick)}>{children}</ButtonSlotContext>\n}\n\n// What pressing the target does on iOS and Android: opens the chooser and\n// hands `onDrop` what was picked, as a drop that copies, where the call site\n// takes the copy. Built by a call rather than inline at the prop, which is\n// what react-perf's jsx-no-new-function-as-prop is after; the React Compiler\n// memoises the result on its inputs.\nfunction pressOf(\n  getDropOperation: DropZoneProps['getDropOperation'],\n  onDrop: DropZoneProps['onDrop'],\n) {\n  return (event: GestureResponderEvent) => {\n    const { locationX: x, locationY: y } = event.nativeEvent\n\n    void pickThen({ allowsMultiple: true }, (files) => {\n      const dropOperation = operationOf(\n        { getDropOperation },\n        typesOf(files.map((file) => file.type)),\n        ['copy'],\n      )\n\n      if (dropOperation !== 'cancel') {\n        onDrop?.({\n          dropOperation,\n          items: files.map(fileItemOf),\n          type: 'drop',\n          x,\n          y,\n        })\n      }\n    })\n  }\n}\n\n// The slots a FileTrigger hands its button: its press in the default slot,\n// in place of any overlay's around it. Built by a call rather than inline at\n// the prop, which is what react-perf's jsx-no-new-object-as-prop is after;\n// the React Compiler memoises the result on its inputs.\nfunction slotsOf(pick: () => void): ButtonSlots {\n  return { default: pick }\n}\n\nexport { DropZone, FileTrigger }\nexport type { DropZoneProps, FileTriggerProps }\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ComponentRef","ReactNode","Ref","GestureResponderEvent","HostInstance","StyleProp","TextStyle","ViewStyle","View","ViewType","useEffect","useEffectEvent","useRef","useState","Platform","Pressable","StyleSheet","Text","ButtonSlots","DragTypes","DropEnterEvent","DropEvent","DropExitEvent","DropOperation","PickedFile","ButtonSlotContext","fileItemOf","isDropTarget","operationOf","typesOf","watchDrops","pickThen","preparePicker","usePressFeedback","refsOf","withOpacity","useTheme","composeStyles","themedStyles","useTypeRole","MIN_HEIGHT","stylesOf","colors","radii","spacing","stateLayerOpacity","disabled","onSurface","disabledContent","create","label","color","onSurfaceVariant","textAlign","labelBox","pointerEvents","labelDisabled","labelOver","onPrimaryContainer","press","borderRadius","md","ring","outlineOffset","root","alignItems","backgroundColor","surface","borderColor","outlineVariant","borderStyle","borderWidth","boxSizing","gap","justifyContent","minHeight","padding","xl","rootDisabled","rootOver","primaryContainer","primary","DropZoneProps","children","getDropOperation","types","allowedOperations","isDisabled","onDrop","event","onDropEnter","onDropExit","ref","style","testID","FileTriggerProps","acceptedFileTypes","allowsMultiple","defaultCamera","onSelect","files","DropZone","t0","$","_c","ariaLabel","t1","undefined","theme","styles","bodyMedium","isOver","setOver","node","web","OS","t2","t3","corners","feedback","t4","handlersNow","t5","disabledNow","name","over","t6","target","current","t7","Symbol","for","T0","t8","t9","t10","t11","t12","t13","handlers","pressOf","absoluteFill","layer","t14","t15","FileTrigger","pick","slotsOf","locationX","x","locationY","y","nativeEvent","dropOperation","map","file","type","items","default","_c"],"sources":["../../../src/components/drop-zone/index.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode, Ref } from 'react'\nimport type {\n  GestureResponderEvent,\n  HostInstance,\n  StyleProp,\n  TextStyle,\n  ViewStyle,\n  View as ViewType,\n} from 'react-native'\n\nimport { useEffect, useEffectEvent, useRef, useState } from 'react'\nimport { Platform, Pressable, StyleSheet, Text, View } from 'react-native'\n\nimport type { ButtonSlots } from '../../button/slots'\nimport type {\n  DragTypes,\n  DropEnterEvent,\n  DropEvent,\n  DropExitEvent,\n  DropOperation,\n} from '../../drop'\nimport type { PickedFile } from '../../files'\n\nimport { ButtonSlotContext } from '../../button/slots'\nimport {\n  fileItemOf,\n  isDropTarget,\n  operationOf,\n  typesOf,\n  watchDrops,\n} from '../../drop'\nimport { pickThen, preparePicker } from '../../files'\nimport { usePressFeedback } from '../../press'\nimport { refsOf } from '../../ref'\nimport { withOpacity } from '../../theme/color'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\nimport { useTypeRole } from '../../typography/roles'\n\n// A place to drop files, and a way to open the file chooser from a button, as\n// kanso-ui's DropZone and FileTrigger are. Material Design carries no page for\n// either, so the target is drawn from the nearest thing it does carry, the\n// outlined card: the same surface, 1dp outline variant rule and medium\n// corner, at least 160dp tall with 24dp of padding and its label centred in\n// body medium. Web's two departures from that card are kept. **The rule is\n// dashed**, since a solid one reads as a card holding content and a dashed one\n// as a place to put something. **Something over it fills it** with primary\n// container, the rule turning primary and solid, the pair a selected row\n// takes, so \"this is the target\" looks like \"this is the one chosen\". It\n// switches at once rather than over web's short transition, as a card's\n// press colours do.\n//\n// What a drop is depends on the platform, since neither iOS nor Android hands\n// React Native a drag from another app. **Under React Native Web it is HTML5\n// drag and drop**, as on web, through src/drop. **On iOS and Android the\n// target is a press target** that opens the chooser and hands `onDrop` what\n// was picked, as file drop items, so a call site writes one handler for both.\n// The drop operation it reports is `copy`, which is true of a pick as it is\n// of a drop from the desktop: the chooser hands the app a copy in its cache,\n// and the person's own file stays where it was. So a call site reading the\n// operation is told nothing a pick does not do. The press target lies under\n// what the target holds, so a button inside it still takes its own presses,\n// and VoiceOver reaches both rather than one.\n//\n// Disabled is web's: the rule and the label in on surface at the disabled\n// content opacity, over the surface, so a dashed rule at full strength stops\n// reading as somewhere to aim at, and nothing is taken.\n//\n// FileTrigger renders nothing of its own. The Button, IconButton, Fab or Chip\n// it wraps opens the chooser through src/button's default slot, the way a\n// button opens the overlay around it, as web's React Aria hands its\n// FileTrigger's press to whatever it wraps.\n\n// The least height a target takes, from web: room enough to aim at.\nconst MIN_HEIGHT = 160\n\nconst stylesOf = themedStyles(\n  ({ colors, radii, spacing, stateLayerOpacity }) => {\n    const disabled = withOpacity(\n      colors.onSurface,\n      stateLayerOpacity.disabledContent,\n    )\n\n    return StyleSheet.create({\n      // The label, in the muted role, centred under the target's content.\n      label: {\n        color: colors.onSurfaceVariant,\n        textAlign: 'center',\n      },\n      labelBox: {\n        pointerEvents: 'none',\n      },\n      labelDisabled: {\n        color: disabled,\n      },\n      labelOver: {\n        color: colors.onPrimaryContainer,\n      },\n      // The press target fills the target under its content, inside the\n      // rule. Its ring is drawn over the target's edge rather than around\n      // it, as web's is, so a parent clipping its children never cuts the\n      // outer half away: set 1dp into the press target, it covers the rule\n      // and the 1dp inside it.\n      press: {\n        borderRadius: radii.md,\n      },\n      ring: {\n        outlineOffset: -1,\n      },\n      root: {\n        alignItems: 'center',\n        backgroundColor: colors.surface,\n        borderColor: colors.outlineVariant,\n        borderRadius: radii.md,\n        borderStyle: 'dashed',\n        borderWidth: 1,\n        boxSizing: 'border-box',\n        gap: spacing.md,\n        justifyContent: 'center',\n        minHeight: MIN_HEIGHT,\n        padding: spacing.xl,\n      },\n      rootDisabled: {\n        borderColor: disabled,\n      },\n      rootOver: {\n        backgroundColor: colors.primaryContainer,\n        borderColor: colors.primary,\n        borderStyle: 'solid',\n      },\n    })\n  },\n)\n\ntype DropZoneProps = {\n  /**\n   * Names the target without drawing anything, for a page that already says\n   * what it takes. Beats `label` as the name.\n   */\n  readonly 'aria-label'?: string\n  /** What the target holds beside its label, such as a FileTrigger. */\n  readonly children?: ReactNode\n  /**\n   * What a drop of these types would do, from the operations the drag\n   * allows: `cancel` refuses it. A pick on iOS and Android allows `copy`\n   * alone. Left out, the first the drag allows.\n   */\n  readonly getDropOperation?: (\n    types: DragTypes,\n    allowedOperations: readonly DropOperation[],\n  ) => DropOperation\n  /**\n   * Takes nothing: no drop, and on iOS and Android no press, drawn faded.\n   * @default false\n   */\n  readonly isDisabled?: boolean\n  /**\n   * What the target says it is for, drawn inside it and used as its name. A\n   * string rather than a node, since it is what names the target; anything\n   * richer goes in `children`.\n   */\n  readonly label?: string\n  /**\n   * Called with what landed: what was dropped under React Native Web, what\n   * was picked on iOS and Android.\n   */\n  readonly onDrop?: (event: DropEvent) => void\n  /** Called once something the target takes comes over it. Under React Native Web alone. */\n  readonly onDropEnter?: (event: DropEnterEvent) => void\n  /** Called once what came over it leaves, or lands. Under React Native Web alone. */\n  readonly onDropExit?: (event: DropExitEvent) => void\n  readonly ref?: Ref<ComponentRef<typeof ViewType>>\n  readonly style?: StyleProp<ViewStyle>\n  readonly testID?: string\n}\n\ntype FileTriggerProps = {\n  /** The MIME types the chooser offers, such as `image/png` or `image/*`. Every type when left out. */\n  readonly acceptedFileTypes?: readonly string[]\n  /** Whether more than one file can be picked. @default false */\n  readonly allowsMultiple?: boolean\n  /** The Button, IconButton, Fab or Chip that opens the chooser. */\n  readonly children?: ReactNode\n  /**\n   * Opens the camera rather than the chooser, facing away from the person\n   * for `environment` or towards them for `user`, as web's `capture` does.\n   * It takes one photo, or a video where `acceptedFileTypes` names a video\n   * type.\n   */\n  readonly defaultCamera?: 'environment' | 'user'\n  /** Called with what was picked. Not called when the person backs out. */\n  readonly onSelect?: (files: readonly PickedFile[]) => void\n}\n\n/**\n * A place to drop files. Under React Native Web it takes HTML5 drag and drop,\n * as kanso-ui's does; on iOS and Android, which hand an app no drag from\n * another, pressing it opens the file chooser, and `onDrop` is handed what\n * was picked. Either way `onDrop` is handed the items, which\n * `isFileDropItem` and `isTextDropItem` pick apart.\n *\n * ```tsx\n * <DropZone label=\"Drop here\" onDrop={handleDrop}>\n *   <FileTrigger onSelect={handleSelect}>\n *     <Button variant=\"outlined\">Label</Button>\n *   </FileTrigger>\n * </DropZone>\n * ```\n *\n * It is drawn from the outlined card, with a dashed rule rather than a solid\n * one, and fills with the primary container while something is over it.\n * `label` both draws the words and names the target; `aria-label` names it\n * without drawing anything.\n *\n * The chooser is expo-document-picker's, which an app installs alongside the\n * library. Without it a press writes to the console that the package is\n * missing, and nothing opens.\n *\n * `style`, `ref` and `testID` land on the target itself, which is what a\n * layout places.\n */\nfunction DropZone({\n  'aria-label': ariaLabel,\n  children,\n  getDropOperation,\n  isDisabled = false,\n  label,\n  onDrop,\n  onDropEnter,\n  onDropExit,\n  ref,\n  style,\n  testID,\n}: DropZoneProps) {\n  const theme = useTheme()\n  const { colors, radii } = theme\n  const styles = stylesOf(theme)\n  const bodyMedium = useTypeRole('bodyMedium')\n  const [isOver, setOver] = useState(false)\n  const node = useRef<HostInstance | null>(null)\n  const web = Platform.OS === 'web'\n  const feedback = usePressFeedback({\n    color: colors.onSurface,\n    corners: { borderRadius: radii.md },\n    disabled: isDisabled,\n  })\n  const handlersNow = useEffectEvent(() => ({\n    getDropOperation,\n    onDrop,\n    onDropEnter,\n    onDropExit,\n  }))\n  const disabledNow = useEffectEvent(() => isDisabled)\n  const name = ariaLabel ?? label\n  const over = isOver && !isDisabled\n\n  useEffect(() => {\n    if (!web) {\n      preparePicker({})\n      return undefined\n    }\n\n    const target = node.current\n\n    if (!isDropTarget(target)) {\n      return undefined\n    }\n    return watchDrops(\n      target,\n      () => handlersNow(),\n      () => disabledNow(),\n      setOver,\n    )\n  }, [web])\n\n  return (\n    <View\n      // Under React Native Web the target names itself, as a group, and says\n      // it is disabled, since there is no press target to carry either.\n      aria-disabled={web && isDisabled ? true : undefined}\n      aria-label={web ? name : undefined}\n      ref={refsOf<HostInstance>(ref, node)}\n      role={web && name !== undefined ? 'group' : undefined}\n      style={composeStyles<ViewStyle>(\n        styles.root,\n        over ? styles.rootOver : undefined,\n        isDisabled ? styles.rootDisabled : undefined,\n        style,\n      )}\n      testID={testID}\n    >\n      {web ? null : (\n        <Pressable\n          {...feedback.handlers}\n          aria-label={name}\n          disabled={isDisabled}\n          onPress={pressOf(getDropOperation, onDrop)}\n          role=\"button\"\n          style={composeStyles<ViewStyle>(\n            StyleSheet.absoluteFill,\n            styles.press,\n            feedback.ring,\n            feedback.ring === undefined ? undefined : styles.ring,\n          )}\n        >\n          {feedback.layer}\n        </Pressable>\n      )}\n      {label === undefined ? null : (\n        // Hidden from a screen reader, which hears it as the target's name,\n        // and from touches, which land on the press target under it.\n        <View aria-hidden style={styles.labelBox}>\n          <Text\n            style={composeStyles<TextStyle>(\n              bodyMedium,\n              styles.label,\n              over ? styles.labelOver : undefined,\n              isDisabled ? styles.labelDisabled : undefined,\n            )}\n          >\n            {label}\n          </Text>\n        </View>\n      )}\n      {children}\n    </View>\n  )\n}\n\n/**\n * Opens the file chooser from the button it wraps, and hands `onSelect`\n * what was picked.\n *\n * ```tsx\n * <FileTrigger acceptedFileTypes={['image/*']} onSelect={handleSelect}>\n *   <Button>Label</Button>\n * </FileTrigger>\n * ```\n *\n * It renders nothing of its own, so it takes no `style`: what is seen is the\n * Button, IconButton, Fab or Chip it wraps, which opens the chooser after its\n * own `onPress`. `allowsMultiple` takes more than one file, and `defaultCamera`\n * opens the camera instead. kanso-ui's `acceptDirectory` is not here, since\n * neither iOS's chooser nor Android's picks a folder.\n *\n * The chooser is expo-document-picker's and the camera expo-image-picker's,\n * which an app installs alongside the library, the second only for\n * `defaultCamera`. Without the one it needs, a press writes to the console\n * which package is missing, and nothing opens.\n */\nfunction FileTrigger({\n  acceptedFileTypes,\n  allowsMultiple,\n  children,\n  defaultCamera,\n  onSelect,\n}: FileTriggerProps) {\n  useEffect(() => {\n    preparePicker({ defaultCamera })\n  }, [defaultCamera])\n\n  const pick = () => {\n    void pickThen(\n      { acceptedFileTypes, allowsMultiple, defaultCamera },\n      (files) => {\n        onSelect?.(files)\n      },\n    )\n  }\n\n  return <ButtonSlotContext value={slotsOf(pick)}>{children}</ButtonSlotContext>\n}\n\n// What pressing the target does on iOS and Android: opens the chooser and\n// hands `onDrop` what was picked, as a drop that copies, where the call site\n// takes the copy. Built by a call rather than inline at the prop, which is\n// what react-perf's jsx-no-new-function-as-prop is after; the React Compiler\n// memoises the result on its inputs.\nfunction pressOf(\n  getDropOperation: DropZoneProps['getDropOperation'],\n  onDrop: DropZoneProps['onDrop'],\n) {\n  return (event: GestureResponderEvent) => {\n    const { locationX: x, locationY: y } = event.nativeEvent\n\n    void pickThen({ allowsMultiple: true }, (files) => {\n      const dropOperation = operationOf(\n        { getDropOperation },\n        typesOf(files.map((file) => file.type)),\n        ['copy'],\n      )\n\n      if (dropOperation !== 'cancel') {\n        onDrop?.({\n          dropOperation,\n          items: files.map(fileItemOf),\n          type: 'drop',\n          x,\n          y,\n        })\n      }\n    })\n  }\n}\n\n// The slots a FileTrigger hands its button: its press in the default slot,\n// in place of any overlay's around it. Built by a call rather than inline at\n// the prop, which is what react-perf's jsx-no-new-object-as-prop is after;\n// the React Compiler memoises the result on its inputs.\nfunction slotsOf(pick: () => void): ButtonSlots {\n  return { default: pick }\n}\n\nexport { DropZone, FileTrigger }\nexport type { DropZoneProps, FileTriggerProps }\n"],"mappings":"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"}

package/dist/components/menu/index.d.ts

@@ -200,9 +200,9 @@ type MenuTrigger = 'longPress' | 'press';
  * </Menu>
  * ```
  *
- * A `Button` or `IconButton` placed directly inside `Menu` is its trigger,
- * and a press on it toggles the menu. Everything the menu shows goes in
- * `Menu.Content`, since the trigger lives in the screen while the menu is
+ * A `Button`, `IconButton` or `Chip` placed directly inside `Menu` is its
+ * trigger, and a press on it toggles the menu. Everything the menu shows goes
+ * in `Menu.Content`, since the trigger lives in the screen while the menu is
  * drawn above it.
  */
 declare function Menu({ children, defaultOpen, isOpen, onOpenChange, trigger }: MenuProps): import("react").JSX.Element;

package/dist/components/menu/index.js

@@ -71,9 +71,9 @@ const LevelContext = createContext(null);
 * </Menu>
 * ```
 *
-* A `Button` or `IconButton` placed directly inside `Menu` is its trigger,
-* and a press on it toggles the menu. Everything the menu shows goes in
-* `Menu.Content`, since the trigger lives in the screen while the menu is
+* A `Button`, `IconButton` or `Chip` placed directly inside `Menu` is its
+* trigger, and a press on it toggles the menu. Everything the menu shows goes
+* in `Menu.Content`, since the trigger lives in the screen while the menu is
 * drawn above it.
 */
 function Menu(t0) {