diff --git a/apps/vr-tests/src/stories/Nav.stories.tsx b/apps/vr-tests/src/stories/Nav.stories.tsx
index 80b7f91c3e2fd7..b03ca034f1b2b3 100644
--- a/apps/vr-tests/src/stories/Nav.stories.tsx
+++ b/apps/vr-tests/src/stories/Nav.stories.tsx
@@ -18,25 +18,25 @@ storiesOf('Nav', module)
.click('.ms-Nav-chevronButton')
.hover('.ms-Nav-compositeLink')
.snapshot('click', { cropTo: '.testWrapper' })
- .end()
- }
+ .end()}
>
{story()}
))
- .addStory('Root', () => (
- // tslint:disable-next-line:jsx-ban-props
-
-
+ ),
+ { rtl: true }
+ );
diff --git a/common/changes/@uifabric/experiments/const-enum_2018-11-17-00-03.json b/common/changes/@uifabric/experiments/const-enum_2018-11-17-00-03.json
new file mode 100644
index 00000000000000..f7f3b778f7cbce
--- /dev/null
+++ b/common/changes/@uifabric/experiments/const-enum_2018-11-17-00-03.json
@@ -0,0 +1,11 @@
+{
+ "changes": [
+ {
+ "packageName": "@uifabric/experiments",
+ "comment": "DevExp: const enums are replaced with constants, this allows the use of isolatedModules mode of compilation",
+ "type": "minor"
+ }
+ ],
+ "packageName": "@uifabric/experiments",
+ "email": "kchau@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/const-enum_2018-11-17-00-03.json b/common/changes/@uifabric/variants/const-enum_2018-11-17-00-03.json
new file mode 100644
index 00000000000000..89b83321691eaf
--- /dev/null
+++ b/common/changes/@uifabric/variants/const-enum_2018-11-17-00-03.json
@@ -0,0 +1,11 @@
+{
+ "changes": [
+ {
+ "packageName": "@uifabric/variants",
+ "comment": "DevExp: const enums are replaced with constants, this allows the use of isolatedModules mode of compilation",
+ "type": "minor"
+ }
+ ],
+ "packageName": "@uifabric/variants",
+ "email": "kchau@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index 181335481ef065..d9d7dd1c9b33b7 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -13,13 +13,13 @@ export interface IFolderCoverState {
// TODO Add animation support for drag/drop events.
}
-const enum FolderCoverLayoutValues {
- smallWidth = 72,
- smallHeight = 52,
- largeWidth = 112,
- largeHeight = 80,
- contentPadding = 4
-}
+const FolderCoverLayoutValues = {
+ smallWidth: 72 as 72,
+ smallHeight: 52 as 52,
+ largeWidth: 112 as 112,
+ largeHeight: 80 as 80,
+ contentPadding: 4 as 4
+};
const ASSET_CDN_BASE_URL = 'https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets';
diff --git a/packages/experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx b/packages/experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx
index 48acb94a047ec2..43a8b6c5d37a5b 100644
--- a/packages/experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx
+++ b/packages/experiments/src/components/Tile/ShimmerTile/ShimmerTile.base.tsx
@@ -7,20 +7,20 @@ import { ShimmerGap } from '../../Shimmer/ShimmerGap/ShimmerGap';
import { ShimmerElementsGroup } from '../../Shimmer/ShimmerElementsGroup/ShimmerElementsGroup';
import { ShimmerElementType as ElemType } from '../../Shimmer/Shimmer.types';
-const enum ShimmerTileLayoutValues {
- largeSquareWidth = 96,
- largeSquareHeight = 96,
- largeNameWidth = 144,
- largeNameHeight = 7,
- largeActivityWidth = 96,
- largeActivityHeight = 7,
- smallSquareWidth = 62,
- smallSquareHeight = 61,
- smallNameWidth = 106,
- smallNameHeight = 5,
- smallActivityWidth = 62,
- smallActivityHeight = 5
-}
+const ShimmerTileLayoutValues = {
+ largeSquareWidth: 96,
+ largeSquareHeight: 96,
+ largeNameWidth: 144,
+ largeNameHeight: 7,
+ largeActivityWidth: 96,
+ largeActivityHeight: 7,
+ smallSquareWidth: 62,
+ smallSquareHeight: 61,
+ smallNameWidth: 106,
+ smallNameHeight: 5,
+ smallActivityWidth: 62,
+ smallActivityHeight: 5
+};
const PLACEHOLDER_SIZES: {
[P in TileSize]: {
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 0c9d2f4227017d..47d37eb441bcbe 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -13,15 +13,17 @@ const SignalStyles: any = SignalStylesModule;
const CheckStyles: any = CheckStylesModule;
// tslint:enable:no-any
-export const enum TileLayoutValues {
- nameplatePadding = 12,
- largeNameplateNameHeight = 15,
- smallNameplateNameHeight = 12,
- nameplateMargin = 0,
- largeNameplateActivityHeight = 20,
- smallNameplateActivityHeight = 20,
- foregroundMargin = 16
-}
+export const TileLayoutValues = {
+ nameplatePadding: 12 as 12,
+ largeNameplateNameHeight: 15 as 15,
+ smallNameplateNameHeight: 12 as 12,
+ nameplateMargin: 0 as 0,
+ largeNameplateActivityHeight: 20 as 20,
+ smallNameplateActivityHeight: 20 as 20,
+ foregroundMargin: 16 as 16
+};
+
+export type TileLayoutValues = typeof TileLayoutValues[keyof typeof TileLayoutValues];
export interface ITileState {
isSelected?: boolean;
diff --git a/packages/variants/src/variantThemeType.ts b/packages/variants/src/variantThemeType.ts
index 3f8a9ad6410d65..35688e8ea5368e 100644
--- a/packages/variants/src/variantThemeType.ts
+++ b/packages/variants/src/variantThemeType.ts
@@ -1,26 +1,28 @@
/**
- * Const enum for variant theme types.
+ * Variant theme types values
*
* @public
*/
-export const enum VariantThemeType {
+export const VariantThemeType = {
/*
- * No variant.
- */
- None = 0,
+ * No variant.
+ */
+ None: 0 as 0,
/*
- * A variant where the background is a soft version of the background color. Most other colors remain unchanged.
- */
- Neutral = 1,
+ * A variant where the background is a soft version of the background color. Most other colors remain unchanged.
+ */
+ Neutral: 1 as 1,
/*
- * A variant where the background is a soft version of the primary color. Most other colors remain unchanged.
- */
- Soft = 2,
+ * A variant where the background is a soft version of the primary color. Most other colors remain unchanged.
+ */
+ Soft: 2 as 2,
/*
- * A variant where the background is a strong version of the primary color. All colors change.
- * The background becomes shades of the primary color.
- * The foreground/text becomes shades of the background color.
- * The primary color becomes shades of the background.
- */
- Strong = 3
-}
+ * A variant where the background is a strong version of the primary color. All colors change.
+ * The background becomes shades of the primary color.
+ * The foreground/text becomes shades of the background color.
+ * The primary color becomes shades of the background.
+ */
+ Strong: 3 as 3
+};
+
+export type VariantThemeType = typeof VariantThemeType[keyof typeof VariantThemeType];