# Defaults (/themes/sdk/reference/forms/defaults)

```ts
import { … } from '@poltura/theme-sdk/forms';
```

## `StoreForm` [#storeform]

A merchant's published form, drawn with its fields, steps, validation, captcha and success message.

```ts
StoreForm(props: StoreFormProps): ReactElement
```

The host loads the form, checks the captcha and stores the submission.

**Props:** [`StoreFormProps`](/themes/sdk/reference/forms/types-2#storeformprops)

**Example**

```tsx
import { StoreForm } from '@poltura/theme-sdk/forms';

export function WholesaleEnquiry() {
  return <StoreForm handle="wholesale" layout="compact" copy={{ submitLabel: 'Ask for prices' }} />;
}
```

**See also:** [`useStoreForm`](/themes/sdk/reference/forms/hooks#usestoreform), [`FormField`](/themes/sdk/reference/forms/parts#formfield), [`SubmitButton`](/themes/sdk/reference/forms/parts#submitbutton)

## `NewsletterForm` [#newsletterform]

The newsletter sign-up, inline, stacked, as the footer column or as a full-width band; nothing when it is off.

```ts
NewsletterForm(props: NewsletterFormProps): ReactElement | null
```

A sign-up records the shopper's marketing consent and emits the lead event.

**Props:** [`NewsletterFormProps`](/themes/sdk/reference/forms/types-2#newsletterformprops)

**Example**

```tsx
import { NewsletterForm } from '@poltura/theme-sdk/forms';

export function FooterSignUp() {
  return <NewsletterForm layout="footer" />;
}
```

**See also:** [`useNewsletter`](/themes/sdk/reference/forms/hooks#usenewsletter), [`StoreForm`](/themes/sdk/reference/forms/defaults#storeform), [`NewsletterTrigger`](/themes/sdk/reference/forms/parts#newslettertrigger)

## `ContactForm` [#contactform]

The store's contact form: name, email, subject and message, sent to the merchant's inbox.

```ts
ContactForm(props: ContactFormProps): ReactElement
```

Sending emits the lead event.

**Props:** [`ContactFormProps`](/themes/sdk/reference/forms/types-2#contactformprops)

<Tab value='Example'>

```tsx
import { ContactForm } from '@poltura/theme-sdk/forms';

export function AskUs() {
  return <ContactForm formTitle="Ask us anything" showSubject={false} />;
}
```

</Tab>
<Tab value='Source'>

```tsx title="source/contact-form.tsx"
import { useMemo, type ReactElement } from 'react';
import { StoreForm, type ContactFormProps } from '@poltura/theme-sdk/forms';
import { useTranslations } from '@poltura/theme-sdk/i18n';

function pick(value: string | undefined, fallback: string): string {
  const trimmed = value?.trim();
  return trimmed ? trimmed : fallback;
}

export function ContactForm({
  formTitle,
  formSubtitle,
  showName = true,
  showSubject = true,
  nameLabel,
  namePlaceholder,
  emailLabel,
  emailPlaceholder,
  subjectLabel,
  subjectPlaceholder,
  messageLabel,
  messagePlaceholder,
  submitLabel,
  successTitle,
  successMessage,
  newMessageLabel,
}: ContactFormProps): ReactElement {
  const t = useTranslations('contactForm');
  const copy = useMemo(
    () => ({
      title: pick(formTitle, t('title')),
      description: pick(formSubtitle, t('subtitle')),
      submitLabel: pick(submitLabel, t('submit')),
      successTitle: pick(successTitle, t('successTitle')),
      successMessage: pick(successMessage, t('successMessage')),
      newSubmissionLabel: pick(newMessageLabel, t('newMessage')),
      labels: {
        name: pick(nameLabel, t('nameLabel')),
        email: pick(emailLabel, t('emailLabel')),
        subject: pick(subjectLabel, t('subjectLabel')),
        message: pick(messageLabel, t('messageLabel')),
      },
      placeholders: {
        name: pick(namePlaceholder, t('namePlaceholder')),
        email: pick(emailPlaceholder, t('emailPlaceholder')),
        subject: pick(subjectPlaceholder, t('subjectPlaceholder')),
        message: pick(messagePlaceholder, t('messagePlaceholder')),
      },
    }),
    [
      emailLabel,
      emailPlaceholder,
      formSubtitle,
      formTitle,
      messageLabel,
      messagePlaceholder,
      nameLabel,
      namePlaceholder,
      newMessageLabel,
      subjectLabel,
      subjectPlaceholder,
      submitLabel,
      successMessage,
      successTitle,
      t,
    ],
  );

  return (
    <StoreForm
      handle='contact'
      copy={copy}
      fieldVisibility={{ name: showName, subject: showSubject }}
    />
  );
}
```

</Tab>


**See also:** [`StoreForm`](/themes/sdk/reference/forms/defaults#storeform), [`FormField`](/themes/sdk/reference/forms/parts#formfield)