import {
  CairoProvider as CairoProviderBase,
  CairoProviderProps as CairoProviderBaseProps,
} from '@wix/bex-core/react';
import { configure } from '@wix/bex-utils/react-dom';
import React, { useState } from 'react';
import { version as cairoVersion } from '../version';

import '@wix/design-system/styles.global.css';
import '../styles.global.css';

import * as wixDesignSystemVersion from '../wix-design-system-version';
import { minimalRequiredWdsRuntimeCheck } from '../minimalRequiredWdsRuntimeCheck';

configure();

if (process.env.NODE_ENV !== 'production') {
  minimalRequiredWdsRuntimeCheck({
    required: wixDesignSystemVersion.required,
  });
}

export interface CairoProviderProps extends CairoProviderBaseProps {}

export function CairoProvider({
  value: valueProp,
  children,
  ...rest
}: CairoProviderProps) {
  const [value] = useState(() => ({
    ...valueProp,
    environment: {
      ...valueProp.environment,
      uiLibVersion: cairoVersion,
    },
  }));

  return (
    <CairoProviderBase {...rest} value={value}>
      {children}
    </CairoProviderBase>
  );
}
