Provider

Example

import {EzProvider, EzButton, stitchesMarketplaceTheme} from '@ezcater/recipe';

function App() {
  return (
    <EzProvider theme={stitchesMarketplaceTheme}>
      <EzButton>Click me</EzButton>
    </EzProvider>
  );
}

Application Provider

A Provider should be the root component of your application. All other Recipe components rely on the Provider to define the theme necessary to render with the appropriate styles for your application.

Themes

In order to provide the styling attributes that components need to render, you must pass a theme as a prop to the root provider in your application. Themes are specified by passing a Theme object to the Provider component. This object includes several css modules which define the values for the variables controlling the color scheme and platform scale. Each CSS module defines a CSS class which includes the variables it defines, and Provider applies these classes to ensure that the contained content is styled according to the provided theme.