@shopify/hydrogen-react/dist/types/Metafield.d.ts

React components, hooks, and utilities for creating custom Shopify storefronts

import { type ElementType, type ComponentPropsWithoutRef } from 'react';
import type { Metafield as MetafieldType } from './storefront-api-types.js';
import type { PartialDeep, JsonValue } from 'type-fest';
interface BaseProps<ComponentGeneric extends ElementType> {
    /** An object with fields that correspond to the Storefront API's [Metafield object](https://shopify.dev/api/storefront/reference/common-objects/metafield). */
    data: PartialDeep<MetafieldType, {
        recurseIntoArrays: true;
    }> | null;
    /** An HTML tag or React component to be rendered as the base element wrapper. The default value varies depending on [metafield.type](https://shopify.dev/apps/metafields/types). */
    as?: ComponentGeneric;
}
export declare type MetafieldProps<ComponentGeneric extends ElementType> = ComponentPropsWithoutRef<ComponentGeneric> & BaseProps<ComponentGeneric>;
/**
 * The `Metafield` component renders the value of a Storefront
 * API's [Metafield object](https://shopify.dev/api/storefront/reference/common-objects/metafield).
 * Relies on the `locale` property of the `useShop()` hook, so it must be a desendent of `<ShopifyProvider/>`
 *
 * Renders a smart default of the Metafield's `value`. For more information, refer to the [Default output](#default-output) section.
 */
export declare function Metafield<ComponentGeneric extends ElementType>(props: MetafieldProps<ComponentGeneric>): JSX.Element | null;
/**
 * The `parseMetafield` utility transforms a [Metafield](https://shopify.dev/api/storefront/reference/common-objects/Metafield)
 * into a new object whose `values` have been parsed according to the metafield `type`.
 * If the metafield is `null`, then it returns `null` back.
 */
export declare function parseMetafield(
/** A [Metafield](https://shopify.dev/api/storefront/reference/common-objects/Metafield) or null */
metafield: PartialDeep<MetafieldType, {
    recurseIntoArrays: true;
}> | null): PartialDeep<ParsedMetafield, {
    recurseIntoArrays: true;
}> | null;
/**
 * The `parseMetafieldValue` function parses a [Metafield](https://shopify.dev/api/storefront/reference/common-objects/metafield)'s `value` from a string into a sensible type corresponding to the [Metafield](https://shopify.dev/api/storefront/reference/common-objects/metafield)'s `type`.
 */
export declare function parseMetafieldValue(metafield: PartialDeep<MetafieldType, {
    recurseIntoArrays: true;
}> | null): ParsedMetafield['value'];
/**
 * Parses a JSON string while preventing prototype injection attacks.
 */
export declare function parseJSON(json: string): any;
export declare function getMeasurementAsString(measurement: Measurement, locale?: string, options?: Intl.NumberFormatOptions): string;
declare type ParsedMetafield = Omit<PartialDeep<MetafieldType, {
    recurseIntoArrays: true;
}>, 'value'> & {
    value?: string | number | boolean | JsonValue | Date | Rating | Measurement;
};
export interface Rating {
    value: number;
    scale_min: number;
    scale_max: number;
}
interface Measurement {
    unit: string;
    value: number;
}
export {};