ActionSheetOptions — Kuito Dokumentation

Verwendung

Offer actions for an item

Dieser Typ wird verwendet von actionSheet

tsx

import { Pressable, Text, actionSheet } from 'kuito';

export function EpisodeMenu(props: {
  id: string;
  title: string;
  onDelete: (id: string) => Promise<void>;
}) {
  const remove = { text: 'Delete', style: 'destructive' } as const;

  return (
    <Pressable
      onPress={async (event) => {
        const picked = await actionSheet({
          buttons: [
            { text: 'Share' },
            { text: 'Add to list' },
            remove,
            { text: 'Cancel', style: 'cancel' },
          ],
          title: props.title,
          anchor: { x: event.pageX ?? 0, y: event.pageY ?? 0 },
        });

        if (picked === remove) await props.onDelete(props.id);
      }}
    >
      <Text>More</Text>
    </Pressable>
  );
}

Typdeklaration

export type ActionSheetOptions = {
  buttons: readonly ActionSheetButton[];
  title?: string;
  message?: string;
  /** iOS: the buttons' color; a hex color. */
  tintColor?: string;
  /**
   * iPad: where the popover points, in window coordinates, as a press event's
   * `pageX` and `pageY`. The middle of the window without one.
   */
  anchor?: { x: number; y: number };
  /** iOS: light or dark regardless of the app's appearance, as CSS's `color-scheme`. */
  colorScheme?: 'light' | 'dark';
};

Mitglieder 6

Name	Typ	Erforderlich	Beschreibung
`buttons`	`readonly ActionSheetButton[]`	Ja	—
`title`	`string`	Nein	—
`message`	`string`	Nein	—
`tintColor`	`string`	Nein	iOS: the buttons' color; a hex color.
`anchor`	`{ x: number; y: number;}`	Nein	iPad: where the popover points, in window coordinates, as a press event's `pageX` and `pageY`. The middle of the window without one.
`colorScheme`	`"light" \| "dark"`	Nein	iOS: light or dark regardless of the app's appearance, as CSS's `color-scheme`.

anchor — verschachtelte Felder

anchor Felder

Name	Typ	Erforderlich	Beschreibung
`x`	`number`	Ja	—
`y`	`number`	Ja	—

Generiert aus den öffentlichen TypeScript-Deklarationen: Signaturen, Props und Standardwerte stammen aus der geprüften Quelle, Beschreibungen aus deren JSDoc. Kein Standardwert ist erfunden.