import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
import { CanvasProvider, ContentDirection, useTheme, } from '@workday/canvas-kit-react/common';
import { createStyles } from '@workday/canvas-kit-styling';
import { Demo } from './Demo';
import { system } from '@workday/canvas-tokens-web';
const mainContentStyles = createStyles({
    padding: system.space.x4,
});
export const App = () => {
    // useTheme is filling in the Canvas theme object if any keys are missing
    const canvasTheme = useTheme({
        canvas: {
            direction: ContentDirection.LTR,
        },
    });
    return (_jsx(CanvasProvider, { theme: canvasTheme, children: _jsx(_Fragment, { children: _jsx("main", { className: mainContentStyles, children: _jsx(Demo, {}) }) }) }));
};
