Change default theme to Light theme

.storybook/preview.js

@@ -1,10 +1,6 @@
 import {themes} from '@storybook/theming';
 import {PolarisVizProvider} from '@shopify/polaris-viz';
-import {
-  DEFAULT_THEME,
-  LIGHT_THEME,
-  UPLIFT_THEME,
-} from '../packages/polaris-viz/src/constants';
+import {DARK_THEME, LIGHT_THEME} from '../packages/polaris-viz/src/constants';
 import {useTheme} from '../packages/polaris-viz/src/hooks';
 
 // https://github.com/storybookjs/storybook/issues/548
@@ -26,7 +22,7 @@ const storiesOrder = {
     Hooks: null,
     Utilities: null,
     Themes: {
-      'Default Themes': null,
+      'Available Themes': null,
       Customizing: null,
       'createTheme Utility': null,
       'Theme Definition': {
@@ -134,14 +130,14 @@ export const decorators = [
     return (
       <PolarisVizProvider
         themes={{
-          Default: {
+          Dark: {
             chartContainer: {
               padding: '20px',
             },
             grid: {
               horizontalMargin:
                 context.parameters.horizontalMargin ??
-                DEFAULT_THEME.grid.horizontalMargin,
+                DARK_THEME.grid.horizontalMargin,
               horizontalOverflow: true,
             },
           },
@@ -150,11 +146,6 @@ export const decorators = [
               padding: '20px',
             },
           },
-          Uplift: {
-            chartContainer: {
-              padding: '20px',
-            },
-          },
           NoSpline: {
             line: {hasSpline: false},
           },

package.json

@@ -160,5 +160,6 @@
   },
   "dependencies": {
     "concurrently": "^7.0.0"
-  }
+  },
+  "version": "1.0.0-light-theme-default-beta.1"
 }

packages/polaris-viz-core/src/components/LineSeries/tests/LineSeries.test.tsx

@@ -8,7 +8,10 @@ import '@shopify/react-testing/matchers';
 import type {LineSeriesProps} from '../LineSeries';
 import {LineSeries} from '../LineSeries';
 import {Area} from '../components';
-import {SHAPE_ANIMATION_HEIGHT_BUFFER} from '../../../constants';
+import {
+  DEFAULT_THEME_NAME,
+  SHAPE_ANIMATION_HEIGHT_BUFFER,
+} from '../../../constants';
 
 const someScale = scaleLinear().domain([0, 100]).range([0, 100]);
 
@@ -30,7 +33,7 @@ const defaultProps: LineSeriesProps = {
   data: mockData,
   svgDimensions: {width: 100, height: 100},
   index: 0,
-  theme: 'Default',
+  theme: DEFAULT_THEME_NAME,
 };
 
 describe('<LineSeries />', () => {
@@ -52,7 +55,7 @@ describe('<LineSeries />', () => {
         </svg>,
         {
           themes: {
-            Default: {
+            [DEFAULT_THEME_NAME]: {
               line: {
                 width: 10,
               },
@@ -105,7 +108,7 @@ describe('<LineSeries />', () => {
           </svg>,
           {
             themes: {
-              Default: {
+              [DEFAULT_THEME_NAME]: {
                 seriesColors: {
                   comparison: 'red',
                 },
@@ -140,7 +143,7 @@ describe('<LineSeries />', () => {
           </svg>,
           {
             themes: {
-              Default: {
+              [DEFAULT_THEME_NAME]: {
                 line: {
                   hasSpline: false,
                 },

packages/polaris-viz-core/src/components/PolarisVizProvider/PolarisVizProvider.tsx

@@ -7,10 +7,9 @@ import type {
   SvgComponents,
 } from '../../types';
 import {
-  DEFAULT_THEME as Default,
+  DARK_THEME as Dark,
   LIGHT_THEME as Light,
   PRINT_THEME as Print,
-  UPLIFT_THEME as Uplift,
   DEFAULT_COMPONENTS as DefaultComponents,
   DEFAULT_THEME_NAME,
 } from '../../constants';
@@ -41,10 +40,9 @@ export function PolarisVizProvider({
         ...components,
       },
       themes: createThemes({
-        Default,
+        Dark,
         Light,
         Print,
-        Uplift,
         ...themes,
       }),
       animated,

packages/polaris-viz-core/src/components/PolarisVizProvider/tests/PolarisVizProvider.test.tsx

@@ -5,9 +5,13 @@ import {createHost} from '@react-spring/animated';
 import {usePolarisVizContext} from '../../../hooks';
 import {PolarisVizProvider} from '../PolarisVizProvider';
 import {PolarisVizContext} from '../../../contexts';
-import {DEFAULT_THEME, DEFAULT_COMPONENTS} from '../../../constants';
+import {
+  DEFAULT_COMPONENTS,
+  DEFAULT_THEME_NAME,
+  LIGHT_THEME,
+} from '../../../constants';
 
-const MockChild = ({theme = 'Default'}) => {
+const MockChild = ({theme = DEFAULT_THEME_NAME}) => {
   const {themes} = usePolarisVizContext();
   return <div>{JSON.stringify(themes[theme])}</div>;
 };
@@ -41,30 +45,30 @@ describe('<PolarisVizProvider />', () => {
         </PolarisVizProvider>,
       );
 
-      expect(vizProvider).toContainReactText(JSON.stringify(DEFAULT_THEME));
+      expect(vizProvider).toContainReactText(JSON.stringify(LIGHT_THEME));
     });
 
     it('passes custom themes to children', () => {
       const vizProvider = mount(
         <PolarisVizProvider
           themes={{
-            Dark: {
+            Light: {
               bar: {
                 borderRadius: 3,
               },
             },
           }}
           animated={host.animated}
         >
-          <MockChild theme="Dark" />
+          <MockChild theme="Light" />
         </PolarisVizProvider>,
       );
 
       expect(vizProvider).toContainReactText(
         JSON.stringify({
-          ...DEFAULT_THEME,
+          ...LIGHT_THEME,
           bar: {
-            ...DEFAULT_THEME.bar,
+            ...LIGHT_THEME.bar,
             borderRadius: 3,
           },
         }),