@careevolution/mydatahelps-ui 1.9.0 → 1.9.2-DarkMode.10

package/dist/esm/types/components/presentational/ActivityMeter/ActivityMeter.d.ts

@@ -8,5 +8,6 @@ export interface ActivityMeterProps {
     averageFillPercent: number;
     color: string;
     message?: string;
+    className?: string;
 }
 export default function (props: ActivityMeterProps): JSX.Element;

package/dist/esm/types/components/presentational/Button/Button.d.ts

@@ -8,5 +8,9 @@ export interface ButtonProps {
      * */
     disabled?: boolean;
     onClick: Function;
+    className?: string;
+    color?: string;
+    loading?: boolean;
+    variant?: "default" | "subtle";
 }
 export default function (props: ButtonProps): JSX.Element;

package/dist/esm/types/components/presentational/Button/Button.stories.d.ts

@@ -4,3 +4,6 @@ declare const _default: ComponentMeta<typeof Button>;
 export default _default;
 export declare const Enabled: ComponentStory<typeof Button>;
 export declare const Disabled: ComponentStory<typeof Button>;
+export declare const CustomColor: ComponentStory<typeof Button>;
+export declare const Loading: ComponentStory<typeof Button>;
+export declare const SubtleVariant: ComponentStory<typeof Button>;

package/dist/esm/types/components/presentational/DateRangeNavigator/DateRangeNavigator.d.ts

@@ -4,6 +4,8 @@ import "./DateRangeNavigator.css";
 export interface DateRangeNavigatorProps {
     intervalType: "Week" | "Month";
     intervalStart: Date;
+    variant?: "default" | "rounded";
     onIntervalChange(newIntervalStart: Date, newIntervalEnd: Date): void;
+    className?: string;
 }
 export default function (props: DateRangeNavigatorProps): JSX.Element;

package/dist/esm/types/components/presentational/DateRangeNavigator/DateRangeNavigator.stories.d.ts

@@ -4,3 +4,4 @@ declare const _default: ComponentMeta<typeof DateRangeNavigator>;
 export default _default;
 export declare const Month: ComponentStory<typeof DateRangeNavigator>;
 export declare const Week: ComponentStory<typeof DateRangeNavigator>;
+export declare const Rounded: ComponentStory<typeof DateRangeNavigator>;

package/dist/esm/types/components/presentational/DayTrackerSymbol/DayTrackerSymbol.d.ts

@@ -3,5 +3,6 @@ import "./DayTrackerSymbol.css";
 export interface DayTrackerSymbolProps {
     primaryColors: string[];
     secondaryColors: string[];
+    className?: string;
 }
 export default function (props: DayTrackerSymbolProps): JSX.Element;

package/dist/esm/types/components/presentational/Face/Face.stories.d.ts

@@ -3,4 +3,5 @@ import Face from "./Face";
 declare const _default: ComponentMeta<typeof Face>;
 export default _default;
 export declare const Default: ComponentStory<typeof Face>;
+export declare const Unselected: ComponentStory<typeof Face>;
 export declare const Clickable: ComponentStory<typeof Face>;

package/dist/esm/types/components/presentational/Histogram/Histogram.d.ts

@@ -5,6 +5,8 @@ export interface HistogramProps {
         label: string;
         color: string;
         value: number;
+        onSelect?(): void;
     }[];
+    className?: string;
 }
 export default function (props: HistogramProps): JSX.Element;

package/dist/esm/types/components/presentational/Layout/Layout.d.ts

@@ -3,8 +3,15 @@ import { StatusBarStyle } from '@careevolution/mydatahelps-js';
 import "./Layout.css";
 export interface LayoutProps {
     children?: React.ReactNode;
-    stylesheetPath?: string;
     bodyBackgroundColor?: string;
     statusBarStyle?: StatusBarStyle;
+    className?: string;
+    autoDarkMode?: boolean;
+    noGlobalStyles?: boolean;
+    stylesheetPath?: string;
+}
+export interface LayoutContext {
+    darkMode: boolean;
 }
+export declare const LayoutContext: React.Context<LayoutContext>;
 export default function (props: LayoutProps): JSX.Element;

package/dist/esm/types/components/presentational/LoadingIndicator/LoadingIndicator.d.ts

@@ -1,5 +1,10 @@
 /// <reference types="react" />
 import "./LoadingIndicator.css";
 import '@fortawesome/fontawesome-svg-core/styles.css';
-declare function LoadingIndicator(): JSX.Element;
+export interface LoadingIndicatorProps {
+    variant?: "default" | "inline";
+    color?: string;
+    className?: string;
+}
+declare function LoadingIndicator(props: LoadingIndicatorProps): JSX.Element;
 export default LoadingIndicator;

package/dist/esm/types/components/presentational/NavigationBar/NavigationBar.d.ts

@@ -2,11 +2,13 @@ import React from 'react';
 import "./NavigationBar.css";
 import '@fortawesome/fontawesome-svg-core/styles.css';
 export interface NavigationBarProps {
-    title: string;
+    title?: string;
     showBackButton?: boolean;
     showCloseButton?: boolean;
     children?: React.ReactNode;
     closeButtonText?: string;
     backButtonText?: string;
+    className?: string;
+    variant?: "default" | "compressed";
 }
 export default function (props: NavigationBarProps): JSX.Element;

package/dist/esm/types/components/presentational/NavigationBar/NavigationBar.stories.d.ts

@@ -5,4 +5,6 @@ export default _default;
 export declare const Drilldown: ComponentStory<typeof NavigationBar>;
 export declare const Modal: ComponentStory<typeof NavigationBar>;
 export declare const CustomButtons: ComponentStory<typeof NavigationBar>;
+export declare const Compressed: ComponentStory<typeof NavigationBar>;
 export declare const WithDateRangeNavigator: ComponentStory<typeof NavigationBar>;
+export declare const WithRoundedDateRangeNavigator: ComponentStory<typeof NavigationBar>;

package/dist/esm/types/components/presentational/Section/Section.d.ts

@@ -2,5 +2,6 @@ import React from 'react';
 import "./Section.css";
 export interface SectionProps {
     children?: React.ReactNode;
+    className?: string;
 }
 export default function (props: SectionProps): JSX.Element | null;

package/dist/esm/types/components/presentational/SegmentedControl/SegmentedControl.d.ts

@@ -7,5 +7,7 @@ export interface SegmentedControlProps {
     }[];
     selectedSegment: string;
     onSegmentSelected: Function;
+    className?: string;
+    color?: string;
 }
 export default function (props: SegmentedControlProps): JSX.Element;

package/dist/esm/types/components/presentational/Switch/Switch.d.ts

@@ -4,5 +4,6 @@ export interface SwitchProps {
     isOn: Boolean;
     onBackgroundColor?: string;
     onValueChanged(value: boolean): void;
+    className?: string;
 }
 export default function (props: SwitchProps): JSX.Element;

package/dist/esm/types/components/presentational/TextBlock/TextBlock.d.ts

@@ -2,5 +2,6 @@ import React from 'react';
 import "./TextBlock.css";
 export interface TextBlockProps {
     children?: React.ReactNode;
+    className?: string;
 }
 export default function (props: TextBlockProps): JSX.Element | null;

package/dist/esm/types/components/presentational/TrackerItem/TrackerItem.d.ts

@@ -7,5 +7,6 @@ export interface TrackerItemProps {
     bordered?: boolean;
     badge?: string;
     onClick?: Function;
+    className?: string;
 }
 export default function (props: TrackerItemProps): JSX.Element;

package/dist/esm/types/helpers/globalCss.d.ts

@@ -0,0 +1,3 @@
+export declare const defaultVariables: import("@emotion/utils").SerializedStyles;
+export declare const darkMode: import("@emotion/utils").SerializedStyles;
+export declare const global: import("@emotion/utils").SerializedStyles;

package/dist/index.d.ts

@@ -22,6 +22,7 @@ interface ActivityMeterProps {
     averageFillPercent: number;
     color: string;
     message?: string;
+    className?: string;
 }
 declare function export_default$U(props: ActivityMeterProps): JSX.Element;
 
@@ -33,6 +34,10 @@ interface ButtonProps {
      * */
     disabled?: boolean;
     onClick: Function;
+    className?: string;
+    color?: string;
+    loading?: boolean;
+    variant?: "default" | "subtle";
 }
 declare function export_default$T(props: ButtonProps): JSX.Element;
 
@@ -61,13 +66,16 @@ declare function export_default$Q(props: CardTitleProps): JSX.Element;
 interface DateRangeNavigatorProps {
     intervalType: "Week" | "Month";
     intervalStart: Date;
+    variant?: "default" | "rounded";
     onIntervalChange(newIntervalStart: Date, newIntervalEnd: Date): void;
+    className?: string;
 }
 declare function export_default$P(props: DateRangeNavigatorProps): JSX.Element;
 
 interface DayTrackerSymbolProps {
     primaryColors: string[];
     secondaryColors: string[];
+    className?: string;
 }
 declare function export_default$O(props: DayTrackerSymbolProps): JSX.Element;
 
@@ -84,32 +92,45 @@ interface HistogramProps {
         label: string;
         color: string;
         value: number;
+        onSelect?(): void;
     }[];
+    className?: string;
 }
 declare function export_default$M(props: HistogramProps): JSX.Element;
 
 interface LayoutProps {
     children?: React.ReactNode;
-    stylesheetPath?: string;
     bodyBackgroundColor?: string;
     statusBarStyle?: StatusBarStyle;
+    className?: string;
+    autoDarkMode?: boolean;
+    noGlobalStyles?: boolean;
+    stylesheetPath?: string;
 }
 declare function export_default$L(props: LayoutProps): JSX.Element;
 
-declare function LoadingIndicator(): JSX.Element;
+interface LoadingIndicatorProps {
+    variant?: "default" | "inline";
+    color?: string;
+    className?: string;
+}
+declare function LoadingIndicator(props: LoadingIndicatorProps): JSX.Element;
 
 interface NavigationBarProps {
-    title: string;
+    title?: string;
     showBackButton?: boolean;
     showCloseButton?: boolean;
     children?: React.ReactNode;
     closeButtonText?: string;
     backButtonText?: string;
+    className?: string;
+    variant?: "default" | "compressed";
 }
 declare function export_default$K(props: NavigationBarProps): JSX.Element;
 
 interface SectionProps {
     children?: React.ReactNode;
+    className?: string;
 }
 declare function export_default$J(props: SectionProps): JSX.Element | null;
 
@@ -120,6 +141,8 @@ interface SegmentedControlProps {
     }[];
     selectedSegment: string;
     onSegmentSelected: Function;
+    className?: string;
+    color?: string;
 }
 declare function export_default$I(props: SegmentedControlProps): JSX.Element;
 
@@ -159,6 +182,7 @@ interface SwitchProps {
     isOn: Boolean;
     onBackgroundColor?: string;
     onValueChanged(value: boolean): void;
+    className?: string;
 }
 declare function export_default$C(props: SwitchProps): JSX.Element;
 
@@ -169,6 +193,7 @@ declare function StatusBarBackgroundProps(props: StatusBarBackgroundProps): JSX.
 
 interface TextBlockProps {
     children?: React.ReactNode;
+    className?: string;
 }
 declare function export_default$B(props: TextBlockProps): JSX.Element | null;
 
@@ -179,6 +204,7 @@ interface TrackerItemProps {
     bordered?: boolean;
     badge?: string;
     onClick?: Function;
+    className?: string;
 }
 declare function export_default$A(props: TrackerItemProps): JSX.Element;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@careevolution/mydatahelps-ui",
-  "version": "1.9.0",
+  "version": "1.9.2-DarkMode.10",
   "description": "MyDataHelps UI Library",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -52,10 +52,11 @@
     "typescript": "^4.6.2"
   },
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^6.0.0",
-    "@fortawesome/free-regular-svg-icons": "^6.0.0",
-    "@fortawesome/free-solid-svg-icons": "^6.0.0",
-    "@fortawesome/react-fontawesome": "^0.1.17",
+    "@emotion/react": "^11.7.1",
+    "@fortawesome/fontawesome-svg-core": "^6.4.0",
+    "@fortawesome/free-regular-svg-icons": "^6.4.0",
+    "@fortawesome/free-solid-svg-icons": "^6.4.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
     "date-fns": "^2.28.0",
     "html-react-parser": "^3.0.8",
     "markdown-it": "^13.0.1",