diff --git a/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json b/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json new file mode 100644 index 0000000000000..919622252dcf8 --- /dev/null +++ b/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json @@ -0,0 +1,11 @@ +{ + "changes": [ + { + "packageName": "@uifabric/styling", + "comment": "ITheme: Make palette a required prop", + "type": "minor" + } + ], + "packageName": "@uifabric/styling", + "email": "chrisgo@microsoft.com" +} \ No newline at end of file diff --git a/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json b/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json new file mode 100644 index 0000000000000..b0fe8eef65633 --- /dev/null +++ b/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json @@ -0,0 +1,11 @@ +{ + "changes": [ + { + "packageName": "office-ui-fabric-react", + "comment": "ITheme: Make palette a required prop", + "type": "patch" + } + ], + "packageName": "office-ui-fabric-react", + "email": "chrisgo@microsoft.com" +} \ No newline at end of file diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx index cd61d36733073..b565083304bd1 100644 --- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx +++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { loadTheme, FontClassNames, ITheme } from 'office-ui-fabric-react/lib/Styling'; +import { loadTheme, FontClassNames, ITheme, IPalette } from 'office-ui-fabric-react/lib/Styling'; import { Highlight } from '@uifabric/example-app-base'; import { defaultTheme } from './defaultTheme'; import { Callout } from 'office-ui-fabric-react/lib/Callout'; @@ -115,17 +115,17 @@ export class ThemePage extends React.Component { private _onColorChanged(index: number, newColor: string) { let { colors } = this.state; let color = colors[index]; - let theme: ITheme = {}; + let palette: Partial = {}; color.value = newColor; for (let i = 0; i < colors.length; i++) { let themeColor = colors[i]; - theme[themeColor.key] = themeColor.value; + palette[themeColor.key] = themeColor.value; } - loadTheme({ palette: theme }); + loadTheme({ palette }); // The theme has changed values, but color state is the same. Force an update on the list. this.refs.list.forceUpdate(); diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/utilities/theme.ts index 680ec7dff0b57..a4d6166a9a829 100644 --- a/packages/styling/src/utilities/theme.ts +++ b/packages/styling/src/utilities/theme.ts @@ -9,8 +9,8 @@ import { } from '../styles/index'; import { Customizer } from '@uifabric/utilities/lib/index'; export interface ITheme { - palette?: IPalette; - fonts?: IFontStyles; + palette: IPalette; + fonts: IFontStyles; semanticColors?: ISemanticColors; } import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles'; @@ -33,7 +33,7 @@ export function getTheme(): ITheme { /** * Loads the default global theme definition. */ -export function loadTheme(theme: ITheme): void { +export function loadTheme(theme: Partial): void { _theme = createTheme(theme); // Load the legacy theme from the palette. @@ -45,7 +45,7 @@ export function loadTheme(theme: ITheme): void { /** * Creates a custom theme definition which can be used with the Customizer. */ -export function createTheme(theme: ITheme): ITheme { +export function createTheme(theme: Partial): ITheme { let newPalette = { ..._theme.palette, ...theme.palette