@sproutsocial/racine 11.8.0 → 11.9.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Change Log
 
+## 11.9.0
+
+### Minor Changes
+
+- 6c3e703: Extend the sprout theme to add colors for trend arrows
+
+### Patch Changes
+
+- 1c10a77: Fix args
+
 ## 11.8.0
 
 ### Minor Changes

package/__flow__/Checkbox/index.stories.js

@@ -1,114 +1,131 @@
 import React from "react";
-import { boolean } from "@storybook/addon-knobs";
 import { action } from "@storybook/addon-actions";
 
 import Checkbox from "./";
 
 export default {
   title: "Checkbox",
+  component: Checkbox,
 };
 
-export const Checked = () => <Checkbox checked={boolean("checked", true)} />;
-export const Unchecked = () => <Checkbox checked={boolean("checked", false)} />;
+export const Checked = (args) => <Checkbox {...args} />;
 
-export const PillChecked = () => (
-  <Checkbox appearance="pill" checked={boolean("checked", true)} />
-);
+Checked.args = { checked: true };
+
+export const Unchecked = (args) => <Checkbox {...args} />;
+
+Unchecked.args = { checked: false };
+
+export const PillChecked = (args) => <Checkbox {...args} />;
+
+PillChecked.args = {
+  checked: true,
+  appearance: "pill",
+};
 
 PillChecked.story = {
   name: "Pill/Checked",
 };
 
-export const PillUnchecked = () => (
-  <Checkbox appearance="pill" checked={boolean("checked", false)} />
-);
+export const PillUnchecked = (args) => <Checkbox {...args} />;
+
+PillUnchecked.args = {
+  checked: false,
+  appearance: "pill",
+};
 
 PillUnchecked.story = {
   name: "Pill/Unchecked",
 };
 
-export const DisabledChecked = () => (
-  <Checkbox
-    checked={boolean("checked", true)}
-    disabled={boolean("disabled", true)}
-  />
-);
+export const DisabledChecked = (args) => <Checkbox {...args} />;
+
+DisabledChecked.args = {
+  checked: true,
+  disabled: true,
+};
 
 DisabledChecked.story = {
   name: "Disabled/Checked",
 };
 
-export const DisabledUnchecked = () => (
-  <Checkbox
-    checked={boolean("checked", false)}
-    disabled={boolean("disabled", true)}
-  />
-);
+export const DisabledUnchecked = (args) => <Checkbox {...args} />;
+
+DisabledUnchecked.args = {
+  checked: false,
+  disabled: true,
+};
 
 DisabledUnchecked.story = {
   name: "Disabled/Unchecked",
 };
 
-export const IndeterminateChecked = () => (
-  <Checkbox
-    checked={boolean("checked", true)}
-    indeterminate={boolean("indeterminate", true)}
-  />
-);
+export const IndeterminateChecked = (args) => <Checkbox {...args} />;
+
+IndeterminateChecked.args = {
+  checked: true,
+  indeterminate: true,
+};
 
 IndeterminateChecked.story = {
   name: "Indeterminate/Checked",
 };
 
-export const IndeterminateUnchecked = () => (
-  <Checkbox
-    checked={boolean("checked", false)}
-    indeterminate={boolean("indeterminate", true)}
-  />
-);
+export const IndeterminateUnchecked = (args) => <Checkbox {...args} />;
+
+IndeterminateUnchecked.args = {
+  checked: false,
+  indeterminate: true,
+};
 
 IndeterminateUnchecked.story = {
   name: "Indeterminate/Unchecked",
 };
 
-export const LabelledChecked = () => (
-  <Checkbox checked={boolean("checked", true)} label="Check Me" />
-);
+export const LabelledChecked = (args) => <Checkbox {...args} />;
+
+LabelledChecked.args = {
+  checked: true,
+  label: "Labelled checkbox",
+};
 
 LabelledChecked.story = {
   name: "Labelled/Checked",
 };
 
-export const LabelledUnchecked = () => (
-  <Checkbox checked={boolean("checked", false)} label="Check Me" />
-);
+export const LabelledUnchecked = (args) => <Checkbox {...args} />;
+
+LabelledUnchecked.args = {
+  checked: false,
+  label: "Labelled checkbox",
+};
 
 LabelledUnchecked.story = {
   name: "Labelled/Unchecked",
 };
 
-export const LabelledDisabled = () => (
-  <Checkbox
-    checked={boolean("checked", true)}
-    disabled={boolean("disabled", true)}
-    label="Check Me"
-  />
-);
+export const LabelledDisabled = (args) => <Checkbox {...args} />;
+
+LabelledDisabled.args = {
+  checked: true,
+  disabled: true,
+  label: "Labelled checkbox",
+};
 
 LabelledDisabled.story = {
   name: "Labelled/Disabled",
 };
 
-export const InputPropsOnMouseOver = () => (
-  <Checkbox
-    checked={boolean("checked", true)}
-    label="Check Me"
-    inputProps={{
-      onMouseOver: action("checkbox-mouseOver"),
-      onClick: action("checkbox-click"),
-    }}
-  />
-);
+export const InputPropsOnMouseOver = (args) => <Checkbox {...args} />;
+
+InputPropsOnMouseOver.args = {
+  checked: true,
+  label: "Labelled checkbox",
+  inputProps: {
+    onMouseOver: action("checkbox-mouseOver"),
+    onClick: action("checkbox-click"),
+  },
+};
 
 InputPropsOnMouseOver.story = {
   name: "InputProps/OnMouseOver",

package/__flow__/Icon/index.stories.js

@@ -1,6 +1,4 @@
 import React, { useState } from "react";
-import { text } from "@storybook/addon-knobs";
-
 import Icon from "./";
 import Button from "../Button";
 import Box from "../Box";
@@ -10,65 +8,72 @@ export default {
   title: "Icon",
 };
 
-export const mini12X12 = () => (
-  <Icon
-    color="icon.base"
-    name={text("name", "dashboard")}
-    size={text("size", "mini")}
-  />
-);
+export const mini12X12 = (args) => <Icon {...args} />;
+
+mini12X12.args = {
+  color: "icon.base",
+  name: "dashboard",
+  size: "mini",
+};
 
 mini12X12.story = {
   name: "Mini (12 x 12)",
 };
 
-export const default16X16 = () => (
-  <Icon color="icon.base" name={text("name", "dashboard")} />
-);
+export const default16X16 = (args) => <Icon {...args} />;
+
+default16X16.args = {
+  color: "icon.base",
+  name: "dashboard",
+};
 
 default16X16.story = {
   name: "Default (16 x 16)",
 };
 
-export const medium24X24 = () => (
-  <Icon
-    color="icon.base"
-    name={text("name", "dashboard")}
-    size={text("size", "medium")}
-  />
-);
+export const medium24X24 = (args) => <Icon {...args} />;
+
+medium24X24.args = {
+  color: "icon.base",
+  name: "dashboard",
+  size: "medium",
+};
 
 medium24X24.story = {
   name: "Medium (24 x 24)",
 };
 
-export const large32X32 = () => (
-  <Icon
-    color="icon.base"
-    name={text("name", "dashboard")}
-    size={text("size", "large")}
-  />
-);
+export const large32X32 = (args) => <Icon {...args} />;
+
+large32X32.args = {
+  color: "icon.base",
+  name: "dashboard",
+  size: "large",
+};
 
 large32X32.story = {
   name: "Large (32 x 32)",
 };
 
-export const jumbo64X64 = () => (
-  <Icon
-    color="icon.base"
-    name={text("name", "dashboard")}
-    size={text("size", "jumbo")}
-  />
-);
+export const jumbo64X64 = (args) => <Icon {...args} />;
+
+jumbo64X64.args = {
+  color: "icon.base",
+  name: "dashboard",
+  size: "jumbo",
+};
 
 jumbo64X64.story = {
   name: "Jumbo (64 x 64)",
 };
 
-export const defaultFixedWidth = () => (
-  <Icon color="icon.success" name={text("name", "dashboard")} fixedWidth />
-);
+export const defaultFixedWidth = (args) => <Icon {...args} />;
+
+defaultFixedWidth.args = {
+  color: "icon.success",
+  name: "dashboard",
+  fixedWidth: true,
+};
 
 defaultFixedWidth.story = {
   name: "Fixed Width (16 x 16)",

package/__flow__/Loader/index.stories.js

@@ -1,34 +1,38 @@
 import React from "react";
-import { boolean, text } from "@storybook/addon-knobs";
-
 import Loader from "./";
 
 export default {
   title: "Loader",
+  component: Loader,
 };
 
-export const defaultStory = () => (
-  <Loader text={text("text", "Content loading")} />
-);
+export const defaultStory = (args) => <Loader {...args} />;
+
+defaultStory.args = {
+  text: "Content loading",
+};
 
 defaultStory.story = {
   name: "Default",
 };
 
-export const small = () => (
-  <Loader text={text("text", "Content loading")} size={text("size", "small")} />
-);
+export const small = (args) => <Loader {...args} />;
+
+small.args = {
+  text: "Content loading",
+  size: "small",
+};
 
 small.story = {
   name: "Small",
 };
 
-export const noDelay = () => (
-  <Loader
-    text={text("text", "Content loading")}
-    delay={boolean("delay", false)}
-  />
-);
+export const noDelay = (args) => <Loader {...args} />;
+
+noDelay.args = {
+  text: "Content loading",
+  delay: false,
+};
 
 noDelay.story = {
   name: "No delay",

package/__flow__/Numeral/index.stories.js

@@ -1,9 +1,22 @@
 import React from "react";
-import { number, select } from "@storybook/addon-knobs";
 import Numeral from "./index";
 
-const localeOptions = {
-  "": null,
+const localeOptions = [
+  "United States (en-US)",
+  "English (en)",
+  "Arabic (ar-EG)",
+  "Brazil (pt-BR)",
+  "India (en-IN)",
+  "French (fr-FR)",
+  "Spain (es-ES)",
+  "Mexico (es-MX)",
+  "Germany (de-DE)",
+  "German (de)",
+  "Japan (ja-JP)",
+  "Japanese (ja)",
+];
+
+const localeMapping = {
   "United States (en-US)": "en-US",
   "English (en)": "en",
   "Arabic (ar-EG)": "ar-EG",
@@ -18,8 +31,15 @@ const localeOptions = {
   "Japanese (ja)": "ja",
 };
 
-const currencyOptions = {
-  "": null,
+const currencyOptions = [
+  "Egyptian £",
+  "European €",
+  "Indian ₹",
+  "Japanese ¥",
+  "USA $",
+];
+
+const currencyMapping = {
   "Egyptian £": "EGP",
   "European €": "EUR",
   "Indian ₹": "INR",
@@ -27,15 +47,24 @@ const currencyOptions = {
   "USA $": "USD",
 };
 
-const formatOptions = {
-  "": null,
+const formatOptions = ["decimal", "currency", "percent"];
+
+const formatMapping = {
   decimal: "decimal",
   currency: "currency",
   percent: "percent",
 };
 
-const abbreviateOptions = {
-  "": null,
+const abbreviateOptions = [
+  "true",
+  "false",
+  " 500",
+  "1_000",
+  "10_000",
+  "100_000",
+];
+
+const abbreviateMapping = {
   true: true,
   false: false,
   " 500": 500,
@@ -44,79 +73,109 @@ const abbreviateOptions = {
   "100_000": 100000,
 };
 
-const precisionOptions = {
-  "": null,
-  " 0": 0,
-  " 1": 1,
-  " 2": 2,
-  " 3": 3,
-  " 6": 6,
+const precisionOptions = ["0", "1", "2", "3", "6", "none"];
+
+const precisionMapping = {
+  "0": 0,
+  "1": 1,
+  "2": 2,
+  "3": 3,
+  "6": 6,
   none: "none",
 };
 
 export default {
   title: "Numeral",
+  component: Numeral,
+  argTypes: {
+    locale: {
+      control: "select",
+      options: localeOptions,
+      mapping: localeMapping,
+    },
+    format: {
+      control: "select",
+      options: formatOptions,
+      mapping: formatMapping,
+    },
+    currency: {
+      control: "select",
+      options: currencyOptions,
+      mapping: currencyMapping,
+    },
+    abbreviate: {
+      control: "select",
+      options: abbreviateOptions,
+      mapping: abbreviateMapping,
+    },
+    precision: {
+      control: "select",
+      options: precisionOptions,
+      mapping: precisionMapping,
+    },
+  },
+  args: {
+    color: "text.headline",
+    number: 12.89,
+  },
 };
 
-// We wrap the knobs select function to properly create undefined values
-const _select = (...args) => {
-  const answer = select(...args);
-
-  return answer === null ? undefined : answer;
-};
-
-export const defaultStory = () => (
-  <Numeral
-    number={number("Number", 12.89)}
-    locale={_select("Locale", localeOptions)}
-    format={_select("Format", formatOptions)}
-    currency={_select("Currency", currencyOptions)}
-    abbreviate={_select("Abbreviate", abbreviateOptions)}
-    precision={_select("Precision", precisionOptions)}
-    color="text.headline"
-  />
-);
+export const defaultStory = (args) => <Numeral {...args} />;
 
 defaultStory.story = {
   name: "Default",
 };
 
-export const total = () => (
-  <Numeral
-    number={100}
-    fontWeight="semibold"
-    fontSize={500}
-    color="text.headline"
-  />
-);
+export const total = (args) => <Numeral {...args} />;
+
+total.args = {
+  number: 100,
+  fontWeight: "semibold",
+  fontSize: 500,
+};
 
 total.story = {
   name: "Total",
 };
 
-export const trend = () => <Numeral number={100} color="teal.500" />;
+export const trend = (args) => <Numeral {...args} />;
+
+trend.args = {
+  number: 100,
+  color: "teal.500",
+};
 
 trend.story = {
   name: "Trend",
 };
 
-export const noPrecision = () => (
-  <Numeral number={123.45678} precision="none" color="text.headline" />
-);
+export const noPrecision = (args) => <Numeral {...args} />;
+
+noPrecision.args = {
+  number: 123.45678,
+  precision: "none",
+};
 
 noPrecision.story = {
   name: "No Precision",
 };
 
-export const currencyPrecision = () => (
-  <Numeral number={123.4} format="currency" color="text.headline" />
-);
+export const currencyPrecision = (args) => <Numeral {...args} />;
+
+currencyPrecision.args = {
+  number: 123.4,
+  format: "currency",
+};
 
 currencyPrecision.story = {
   name: "Currency precision",
 };
 
-export const invalid = () => <Numeral number={null} />;
+export const invalid = (args) => <Numeral {...args} />;
+
+invalid.args = {
+  number: null,
+};
 
 invalid.story = {
   name: "Invalid",

package/__flow__/Radio/index.stories.js

@@ -1,58 +1,73 @@
 import React from "react";
-import { boolean } from "@storybook/addon-knobs";
-
 import Radio from "./";
 
 export default {
   title: "Radio",
+  component: Radio,
+};
+
+export const Unchecked = (args) => <Radio {...args} />;
+
+Unchecked.args = {
+  checked: false,
 };
 
-export const Unchecked = () => <Radio checked={boolean("checked", false)} />;
+export const Checked = (args) => <Radio {...args} />;
 
-export const Checked = () => <Radio checked={boolean("checked", true)} />;
+Checked.args = {
+  checked: true,
+};
+
+export const DisabledUnchecked = (args) => <Radio {...args} />;
 
-export const DisabledUnchecked = () => (
-  <Radio disabled={boolean("disabled", true)} />
-);
+DisabledUnchecked.args = {
+  disabled: true,
+};
 
 DisabledUnchecked.story = {
   name: "Disabled/Unchecked",
 };
 
-export const DisabledChecked = () => (
-  <Radio
-    checked={boolean("checked", true)}
-    disabled={boolean("disabled", true)}
-  />
-);
+export const DisabledChecked = (args) => <Radio {...args} />;
+
+DisabledChecked.args = {
+  checked: true,
+  disabled: true,
+};
 
 DisabledChecked.story = {
   name: "Disabled/Checked",
 };
 
-export const LabelledChecked = () => (
-  <Radio checked={boolean("checked", true)} label="Toggle Me" />
-);
+export const LabelledChecked = (args) => <Radio {...args} />;
+
+LabelledChecked.args = {
+  checked: true,
+  label: "Toggle Me",
+};
 
 LabelledChecked.story = {
   name: "Labelled/Checked",
 };
 
-export const LabelledUnchecked = () => (
-  <Radio checked={boolean("checked", false)} label="Toggle Me" />
-);
+export const LabelledUnchecked = (args) => <Radio {...args} />;
+
+LabelledUnchecked.args = {
+  checked: false,
+  label: "Toggle Me",
+};
 
 LabelledUnchecked.story = {
   name: "Labelled/Unchecked",
 };
 
-export const LabelledDisabled = () => (
-  <Radio
-    checked={boolean("checked", true)}
-    disabled={boolean("disabled", true)}
-    label="Toggle Me"
-  />
-);
+export const LabelledDisabled = (args) => <Radio {...args} />;
+
+LabelledDisabled.args = {
+  checked: false,
+  disabled: true,
+  label: "Toggle Me",
+};
 
 LabelledDisabled.story = {
   name: "Labelled/Disabled",

package/__flow__/Switch/index.stories.js

@@ -1,33 +1,41 @@
 import React from "react";
-import { boolean } from "@storybook/addon-knobs";
-
 import Switch from "./";
 
 export default {
   title: "Switch",
+  component: Switch,
 };
 
-export const Off = () => <Switch checked={boolean("checked", false)} />;
-export const On = () => <Switch checked={boolean("checked", true)} />;
+export const On = (args) => <Switch {...args} />;
 
-export const DisabledOff = () => (
-  <Switch
-    checked={boolean("checked", false)}
-    disabled={boolean("disabled", true)}
-  />
-);
+On.args = {
+  checked: true,
+};
 
-DisabledOff.story = {
-  name: "Disabled/Off",
+export const Off = (args) => <Switch {...args} />;
+
+Off.args = {
+  checked: false,
 };
 
-export const DisabledOn = () => (
-  <Switch
-    checked={boolean("checked", true)}
-    disabled={boolean("disabled", true)}
-  />
-);
+export const DisabledOn = (args) => <Switch {...args} />;
+
+DisabledOn.args = {
+  checked: true,
+  disabled: true,
+};
 
 DisabledOn.story = {
   name: "Disabled/On",
 };
+
+export const DisabledOff = (args) => <Switch {...args} />;
+
+DisabledOff.args = {
+  checked: false,
+  disabled: true,
+};
+
+DisabledOff.story = {
+  name: "Disabled/Off",
+};

package/__flow__/themes/extendedThemes/sproutTheme/dark/theme.js

@@ -42,12 +42,21 @@ export const datePicker = {
   },
 };
 
+export const analytics = {
+  trend: {
+    positive: baseDarkTheme.colors.teal[500],
+    neutral: baseDarkTheme.colors.neutral[100],
+    negative: baseDarkTheme.colors.neutral[100],
+  },
+};
+
 const darkTheme: TypeSproutTheme = {
   ...baseDarkTheme,
   colors: {
     ...baseDarkTheme.colors,
     navigation,
     datePicker,
+    analytics,
   },
 };
 

package/__flow__/themes/extendedThemes/sproutTheme/light/theme.js

@@ -42,12 +42,21 @@ export const datePicker = {
   },
 };
 
+export const analytics = {
+  trend: {
+    positive: baseLightTheme.colors.teal[800],
+    neutral: baseLightTheme.colors.neutral[800],
+    negative: baseLightTheme.colors.neutral[800],
+  },
+};
+
 const lightTheme: TypeSproutTheme = {
   ...baseLightTheme,
   colors: {
     ...baseLightTheme.colors,
     navigation,
     datePicker,
+    analytics,
   },
 };
 

package/__flow__/types/theme.flow.js

@@ -16,6 +16,7 @@ import type { TypeFontFamilyString } from "../themes/light/theme";
 import {
   datePicker,
   navigation,
+  analytics,
 } from "../themes/extendedThemes/sproutTheme/light/theme";
 
 export type TypeThemeUtils = {| interact: (color: string) => string |};
@@ -57,5 +58,6 @@ export type TypeSproutTheme = {
     ...$Exact<TypeColor>,
     navigation: typeof navigation,
     datePicker: typeof datePicker,
+    analytics: typeof analytics,
   |},
 };

package/commonjs/themes/extendedThemes/sproutTheme/dark/theme.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.navigation = exports.default = exports.datePicker = void 0;
+exports.navigation = exports.default = exports.datePicker = exports.analytics = void 0;
 
 var _theme = _interopRequireDefault(require("../../../dark/theme"));
 
@@ -49,11 +49,20 @@ var datePicker = {
   }
 };
 exports.datePicker = datePicker;
+var analytics = {
+  trend: {
+    positive: _theme.default.colors.teal[500],
+    neutral: _theme.default.colors.neutral[100],
+    negative: _theme.default.colors.neutral[100]
+  }
+};
+exports.analytics = analytics;
 
 var darkTheme = _extends({}, _theme.default, {
   colors: _extends({}, _theme.default.colors, {
     navigation: navigation,
-    datePicker: datePicker
+    datePicker: datePicker,
+    analytics: analytics
   })
 });
 

package/commonjs/themes/extendedThemes/sproutTheme/light/theme.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.navigation = exports.default = exports.datePicker = void 0;
+exports.navigation = exports.default = exports.datePicker = exports.analytics = void 0;
 
 var _theme = _interopRequireDefault(require("../../../light/theme"));
 
@@ -49,11 +49,20 @@ var datePicker = {
   }
 };
 exports.datePicker = datePicker;
+var analytics = {
+  trend: {
+    positive: _theme.default.colors.teal[800],
+    neutral: _theme.default.colors.neutral[800],
+    negative: _theme.default.colors.neutral[800]
+  }
+};
+exports.analytics = analytics;
 
 var lightTheme = _extends({}, _theme.default, {
   colors: _extends({}, _theme.default.colors, {
     navigation: navigation,
-    datePicker: datePicker
+    datePicker: datePicker,
+    analytics: analytics
   })
 });
 

package/dist/themes/extendedThemes/sproutTheme/dark/theme.scss

@@ -1,5 +1,12 @@
 $theme: (
   __esModule: true,
+  analytics: (
+    trend: (
+      positive: #08c4b2,
+      neutral: #f3f4f4,
+      negative: #f3f4f4
+    )
+  ),
   datePicker: (
     comparison: (
       background: (
@@ -478,6 +485,13 @@ $theme: (
             base: #364141
           )
         )
+      ),
+      analytics: (
+        trend: (
+          positive: #08c4b2,
+          neutral: #f3f4f4,
+          negative: #f3f4f4
+        )
       )
     ),
     typography: (

package/dist/themes/extendedThemes/sproutTheme/light/theme.scss

@@ -1,5 +1,12 @@
 $theme: (
   __esModule: true,
+  analytics: (
+    trend: (
+      positive: #067c7c,
+      neutral: #364141,
+      negative: #364141
+    )
+  ),
   datePicker: (
     comparison: (
       background: (
@@ -478,6 +485,13 @@ $theme: (
             base: #364141
           )
         )
+      ),
+      analytics: (
+        trend: (
+          positive: #067c7c,
+          neutral: #364141,
+          negative: #364141
+        )
       )
     ),
     typography: (

package/lib/themes/extendedThemes/sproutTheme/dark/theme.js

@@ -39,11 +39,19 @@ export var datePicker = {
     }
   }
 };
+export var analytics = {
+  trend: {
+    positive: baseDarkTheme.colors.teal[500],
+    neutral: baseDarkTheme.colors.neutral[100],
+    negative: baseDarkTheme.colors.neutral[100]
+  }
+};
 
 var darkTheme = _extends({}, baseDarkTheme, {
   colors: _extends({}, baseDarkTheme.colors, {
     navigation: navigation,
-    datePicker: datePicker
+    datePicker: datePicker,
+    analytics: analytics
   })
 });
 

package/lib/themes/extendedThemes/sproutTheme/light/theme.js

@@ -39,11 +39,19 @@ export var datePicker = {
     }
   }
 };
+export var analytics = {
+  trend: {
+    positive: baseLightTheme.colors.teal[800],
+    neutral: baseLightTheme.colors.neutral[800],
+    negative: baseLightTheme.colors.neutral[800]
+  }
+};
 
 var lightTheme = _extends({}, baseLightTheme, {
   colors: _extends({}, baseLightTheme.colors, {
     navigation: navigation,
-    datePicker: datePicker
+    datePicker: datePicker,
+    analytics: analytics
   })
 });
 

package/lib/types/theme.flow.js

@@ -1,2 +1,2 @@
 import { breakpoints, typography, fontWeights, radii, borders, borderWidths, shadows, space, easing, duration } from "../themes/light/theme";
-import { datePicker, navigation } from "../themes/extendedThemes/sproutTheme/light/theme";
+import { datePicker, navigation, analytics } from "../themes/extendedThemes/sproutTheme/light/theme";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/racine",
-  "version": "11.8.0",
+  "version": "11.9.0",
   "license": "MIT",
   "files": [
     "__flow__",