Additional types API reference

ModelAnchor

interface Model {
  apiId: string;
  apiIdPlural: string;
  id: string;
  description: string | null;
  displayName: string;
  isLocalized: boolean;
}

FormAnchor

interface Form {
  change: <Value = any>(name: string, value: Value) => Promise<void>;
  changeBulk: (values: Record<string, any>) => Promise<void>;
  // @see https://hygraph.com/docs/ui-extensions/react-sdk/state-getters#get-state
  getState: <Values = Record<string, any>>() => Promise<FormState<Values>>;
  // @see https://hygraph.com/docs/ui-extensions/react-sdk/state-getters#get-field-state
  getFieldState: <Value = any>(fieldName: string) => Promise<FieldState<Value>>;
  // @see https://hygraph.com/docs/ui-extensions/react-sdk/state-subscriptions#subscribe-to-field-state
  subscribeToFieldState: <Value = any>(
    name: string,
    callback: (state: FieldState<Value>) => any,
    subscription: FieldSubscription,
  ) => Promise<() => any>;
  // @see https://hygraph.com/docs/ui-extensions/react-sdk/state-subscriptions#subscribe-to-form-state
  subscribeToFormState: <Values = Record<string, any>>(
    callback: Subscriber<FormState<Values>>,
    subscription: FormSubscription,
  ) => Promise<() => any>;
  // @see https://hygraph.com/docs/ui-extensions/field-extension/interacting-with-fields#set-fields-visibility
  setFieldsVisibility: (
    arg:
      | VisibilityMap
      | ((currentVisibilityMap: VisibilityMap) => VisibilityMap),
  ) => void;
}

LocaleAnchor

interface Locale {
  apiId: string;
  id: string;
  displayName: string;
  isDefault: boolean;
}

StageAnchor

interface Stage {
  id: string;
  apiId: string;
  color: string;
  colorPaletteId: keyof typeof StageColorPalette;
  backgroundColor: string;
  displayName: string;
  description?: string | null | undefined;
  isSystem: boolean;
  position: number;
}

export const StageColorPalette = {
  PINK: 'PINK',
  PURPLE: 'PURPLE',
  ORANGE: 'ORANGE',
  RED: 'RED',
  BROWN: 'BROWN',
  TEAL: 'TEAL',
  GREEN: 'GREEN',
  YELLOW: 'YELLOW',
} as const;

UserAnchor

interface User {
  id: string;
  kind: keyof typeof UserKind;
  name: string;
  picture: string | null;
  isActive: boolean;
}

export const UserKind = {
  MEMBER: 'MEMBER',
  PAT: 'PAT',
  PUBLIC: 'PUBLIC',
  WEBHOOK: 'WEBHOOK',
} as const;

DialogAnchor

export type OpenDialog = <
  DialogReturn = any,
  DialogProps = Record<string, any>,
>(
  src: string,
  props?: {
    disableOverlayClick?: boolean;
    maxWidth?: string;
    ariaLabel?: string;
  } & DialogProps,
) => Promise<DialogReturn | null>;

ToastsAnchor

export type ShowToast = (options: ToastOptions) => Promise<Id>;

export type ToastOptions = {
  title: string;
  description?: string;
  variantColor: keyof typeof ToastVariantColor;
  id?: Id;
  isClosable?: boolean;
  position?: keyof typeof ToastPosition;
  duration?: number;
};

type Id = number | string;

export const ToastVariantColor = {
  success: 'success',
  error: 'error',
  warning: 'warning',
  info: 'info',
  primary: 'primary',
  dark: 'dark',
  publish: 'publish',
} as const;

export const ToastPosition = {
  'top-right': 'top-right',
  'top-center': 'top-center',
  'top-left': 'top-left',
  'bottom-right': 'bottom-right',
  'bottom-center': 'bottom-center',
  'bottom-left': 'bottom-left',
} as const;