Migrate to the Polaris consent checkbox component

The Polaris consent checkbox component renders a checkbox tied to a customer consent policy. It replaces the previous ConsentCheckbox component and is available as <s-consent-checkbox> in API versions 2025-10 and newer.

Anchor to Updated propertiesUpdated properties

The following properties are different in the Polaris consent checkbox component.

Anchor to togglestoggles

The previous ConsentCheckbox toggles prop has been replaced with command and commandFor.

The example below pairs the consent checkbox with an optional <s-details> panel disclosed by the command pattern. The <s-details> element isn't required by the migration — use it when you want a related details panel that opens when the checkbox is checked.

import '@shopify/ui-extensions/preact';
import {render} from 'preact';

export default function extension() {
  render(<Extension />, document.body);
}

function Extension() {
  return (
    <>
      <s-consent-checkbox
        policy="sms-marketing"
        command="--toggle"
        commandFor="sms-details"
      >
        I want to receive SMS updates
      </s-consent-checkbox>
      <s-details id="sms-details">
        <s-text>
          By checking this box, you agree to receive text messages about your
          order.
        </s-text>
      </s-details>
    </>
  );
}

import {
  reactExtension,
  ConsentCheckbox,
  Disclosure,
  Text,
  View,
} from '@shopify/ui-extensions-react/checkout';

export default reactExtension(
  'purchase.checkout.block.render',
  () => <Extension />,
);

function Extension() {
  return (
    <Disclosure>
      <ConsentCheckbox
        policy="sms-marketing"
        toggles="sms-details"
      >
        I want to receive SMS updates
      </ConsentCheckbox>
      <View id="sms-details">
        <Text>
          By checking this box, you agree to receive text messages about your
          order.
        </Text>
      </View>
    </Disclosure>
  );
}

Anchor to New propertiesNew properties

The Polaris consent checkbox component introduces the following new properties: