@spaced-out/ui-design-system 0.4.15 → 0.5.1

package/lib/components/Card/Card.stories.d.ts

@@ -0,0 +1,150 @@
+import * as React from 'react';
+import type { CardProps } from './Card';
+declare const _default: {
+    tags: string[];
+    title: string;
+    component: import("flow-to-typescript-codemod").Flow.AbstractComponent<CardProps, HTMLDivElement>;
+    argTypes: {
+        onClick: {
+            description: string;
+            action: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        disabled: {
+            name: string;
+            description: string;
+            options: boolean[];
+            control: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: boolean;
+                };
+            };
+        };
+        paddingTop: {
+            description: string;
+            options: unknown[];
+            control: {
+                type: string;
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        paddingRight: {
+            description: string;
+            options: unknown[];
+            control: {
+                type: string;
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        paddingBottom: {
+            description: string;
+            options: unknown[];
+            control: {
+                type: string;
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        paddingLeft: {
+            description: string;
+            options: unknown[];
+            control: {
+                type: string;
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        classNames: {
+            description: string;
+            control: {
+                type: string;
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        children: {
+            type: {
+                required: boolean;
+            };
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+    };
+    parameters: {
+        docs: {
+            subtitle: string;
+            description: {
+                component: string;
+            };
+        };
+        storySource: {
+            componentPath: string;
+        };
+    };
+};
+export default _default;
+export declare const _Default: (args: CardProps) => React.JSX.Element;
+export declare const _WithHeader: {
+    (args: CardProps): React.JSX.Element;
+    args: {
+        classNames: {
+            wrapper: string;
+        };
+    };
+};
+export declare const _WithFooter: {
+    (args: CardProps): React.JSX.Element;
+    args: {
+        classNames: {
+            wrapper: string;
+        };
+    } | {
+        classNames: {
+            wrapper: string;
+        };
+    };
+};
+export declare const _WithHeaderAndFooter: (args: CardProps) => React.JSX.Element;
+export declare const _Clickable: (args: CardProps) => React.JSX.Element;
+//# sourceMappingURL=Card.stories.d.ts.map

package/lib/components/Card/Card.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,QAAQ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBtC,wBAgHE;AAEF,eAAO,MAAM,QAAQ,GAAI,MAAM,SAAS,sBAQvC,CAAC;AAEF,eAAO,MAAM,WAAW;WAAU,SAAS;;;;;;CAmB1C,CAAC;AAMF,eAAO,MAAM,WAAW;WAAU,SAAS;;;;;;;;;;CAuB1C,CAAC;AAMF,eAAO,MAAM,oBAAoB,GAAI,MAAM,SAAS,sBAgCnD,CAAC;AAMF,eAAO,MAAM,UAAU,GAAI,MAAM,SAAS,sBAYzC,CAAC"}

package/lib/components/Card/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Card';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}

package/lib/components/Charts/ChartTooltip/index.d.ts

@@ -0,0 +1,3 @@
+import type { ChartTooltip } from '../../../types/charts';
+export declare const tooltipTheme: ChartTooltip;
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Charts/ChartTooltip/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/ChartTooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,uBAAuB,CAAC;AAMxD,eAAO,MAAM,YAAY,EAAE,YAM1B,CAAC"}

package/lib/components/Charts/ChartWrapper/ChartWrapper.d.ts

@@ -0,0 +1,50 @@
+import * as React from 'react';
+import type { Flow } from 'flow-to-typescript-codemod';
+export type ExportOptionType = {
+    key: string;
+    label: string;
+    format: string;
+};
+export declare const EXPORT_OPTIONS: Readonly<{
+    download_as_png: {
+        key: string;
+        label: string;
+        format: string;
+    };
+    download_as_jpeg: {
+        key: string;
+        label: string;
+        format: string;
+    };
+    download_as_pdf: {
+        key: string;
+        label: string;
+        format: string;
+    };
+    download_as_svg: {
+        key: string;
+        label: string;
+        format: string;
+    };
+}>;
+export type ChartWrapperClassNames = Readonly<{
+    wrapper?: string;
+    header?: string;
+    title?: string;
+    actions?: string;
+    content?: string;
+    loader?: string;
+}>;
+type ChartWrapperProps = {
+    isLoading?: boolean;
+    title: React.ReactNode;
+    children?: React.ReactNode;
+    classNames?: ChartWrapperClassNames;
+    customExportOptions?: Array<ExportOptionType> | null;
+    headerActions?: React.ReactNode;
+    hasEmptyData?: boolean;
+    emptyText?: React.ReactNode;
+};
+export declare const ChartWrapper: Flow.AbstractComponent<ChartWrapperProps, HTMLDivElement>;
+export {};
+//# sourceMappingURL=ChartWrapper.d.ts.map

package/lib/components/Charts/ChartWrapper/ChartWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartWrapper.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/ChartWrapper/ChartWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAsBrD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;EAqBzB,CAAC;AA6DH,MAAM,MAAM,sBAAsB,GAAG,QAAQ,CAAC;IAC5C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC,CAAC;AAEH,KAAK,iBAAiB,GAAG;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,sBAAsB,CAAC;IACpC,mBAAmB,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;IACrD,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAC/C,iBAAiB,EACjB,cAAc,CAoDf,CAAC"}

package/lib/components/Charts/ChartWrapper/ChartWrapper.js

@@ -17,10 +17,6 @@ var _CircularLoader = require("../../CircularLoader");
 var _ChartWrapperModule = _interopRequireDefault(require("./ChartWrapper.module.css"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-//$FlowFixMe[untyped-import]
-//$FlowFixMe[untyped-import]
-//$FlowFixMe[untyped-import]
-//$FlowFixMe[untyped-import]
 const EXPORT_OPTIONS = exports.EXPORT_OPTIONS = Object.freeze({
   download_as_png: {
     key: 'download_as_png',
@@ -45,7 +41,9 @@ const EXPORT_OPTIONS = exports.EXPORT_OPTIONS = Object.freeze({
 });
 
 // on assumption that all export options will be shown by default
-const DEFAULT_EXPORT_OPTIONS = Object.keys(EXPORT_OPTIONS).map(exportKey => EXPORT_OPTIONS[exportKey]);
+const DEFAULT_EXPORT_OPTIONS = Object.keys(EXPORT_OPTIONS).map(
+// @ts-ignore - TS7053 - Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'Readonly<{ download_as_png: { key: string; label: string; format: string; }; download_as_jpeg: { key: string; label: string; format: string; }; download_as_pdf: { key: string; label: string; format: string; }; download_as_svg: { ...; }; }>'.
+exportKey => EXPORT_OPTIONS[exportKey]);
 const CustomExportButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     customExportOptions = null
@@ -67,9 +65,9 @@ const CustomExportButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   const handleDownload = exportKey => {
     const exportOptionObject = exportOptions.find(exportOption => exportOption.key === exportKey);
     const exportFormat = exportOptionObject?.format || '';
+    // @ts-ignore - TS2531 - Object is possibly 'null'. | TS2339 - Property 'current' does not exist on type '((instance: HTMLDivElement | null) => void) | MutableRefObject<HTMLDivElement | null>'.
     if (ref.current) {
-      // $FlowFixMe[prop-missing]
-      // $FlowFixMe[incompatible-use]
+      // @ts-ignore - TS2531 - Object is possibly 'null'. | TS2339 - Property 'current' does not exist on type '((instance: HTMLDivElement | null) => void) | MutableRefObject<HTMLDivElement | null>'.
       ref.current.chart?.exportChart({
         type: exportFormat
       });

package/lib/components/Charts/ChartWrapper/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ChartWrapper';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Charts/ChartWrapper/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/ChartWrapper/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/lib/components/Charts/ColumnChart/ColumnChart.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import type { ChartOptions, DataOptionsType, Drilldown } from '../../../types/charts';
+import type { ChartWrapperClassNames, ExportOptionType } from '../ChartWrapper';
+type ClassNames = Readonly<ChartWrapperClassNames & {
+    highChart?: string;
+}>;
+export type ColumnSeries = {
+    name: string;
+    data: DataOptionsType[];
+};
+export type ColumnChartProps = ChartOptions & {
+    isLoading?: boolean;
+    classNames?: ClassNames;
+    cardTitle?: React.ReactNode;
+    customExportOptions?: Array<ExportOptionType> | null;
+    series: Array<ColumnSeries>;
+    drilldown?: Drilldown;
+    headerActions?: React.ReactNode;
+    hasEmptyData?: boolean;
+    emptyText?: React.ReactNode;
+};
+export declare const ColumnChart: ({ isLoading, classNames, cardTitle, customExportOptions, series, drilldown, headerActions, hasEmptyData, emptyText, ...userOptions }: ColumnChartProps) => React.JSX.Element;
+export {};
+//# sourceMappingURL=ColumnChart.d.ts.map

package/lib/components/Charts/ColumnChart/ColumnChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/ColumnChart/ColumnChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EACV,YAAY,EACZ,eAAe,EACf,SAAS,EACV,MAAM,uBAAuB,CAAC;AAQ/B,OAAO,KAAK,EAAC,sBAAsB,EAAE,gBAAgB,EAAC,MAAM,iBAAiB,CAAC;AAM9E,KAAK,UAAU,GAAG,QAAQ,CACxB,sBAAsB,GAAG;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CACF,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,eAAe,EAAE,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,YAAY,GAAG;IAC5C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,mBAAmB,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;IACrD,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAC5B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,sIAWzB,gBAAgB,sBAkElB,CAAC"}

package/lib/components/Charts/ColumnChart/ColumnChart.js

@@ -13,8 +13,6 @@ var _ChartWrapper = require("../ChartWrapper");
 var _ColumnChartModule = _interopRequireDefault(require("./ColumnChart.module.css"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-//$FlowFixMe[untyped-import]
-//$FlowFixMe[untyped-import]
 const ColumnChart = _ref => {
   let {
     isLoading,
@@ -38,6 +36,7 @@ const ColumnChart = _ref => {
   }));
   const addColorToDrilldownSeries = series => series?.map(seriesItem => ({
     ...seriesItem,
+    // @ts-ignore - TS7006 - Parameter 'dataItem' implicitly has an 'any' type. | TS7006 - Parameter 'index' implicitly has an 'any' type.
     data: seriesItem.data.map((dataItem, index) => ({
       ...dataItem,
       color: (0, _charts.getDataVizColor)(index),
@@ -46,14 +45,13 @@ const ColumnChart = _ref => {
   }));
   const columnDrilldown = drilldown ? {
     ...drilldown,
+    // @ts-ignore
     series: addColorToDrilldownSeries(drilldown.series),
     breadcrumbs: {
       floating: false
     }
   } : {};
   const defaultColumnChartOptions = (0, _charts.getColumnChartOptions)();
-
-  //$FlowFixMe[cannot-spread-inexact]
   const chartOptions = (0, _charts.mergeChartUserOptions)(defaultColumnChartOptions, {
     series: columnChartSeries,
     drilldown: columnDrilldown,
@@ -65,7 +63,9 @@ const ColumnChart = _ref => {
   } = classNames || {};
   return /*#__PURE__*/React.createElement(_ChartWrapper.ChartWrapper, {
     isLoading: isLoading,
-    title: cardTitle,
+    title: cardTitle
+    // @ts-ignore - TS2769 - No overload matches this call.
+    ,
     ref: chartRef,
     classNames: wrapperClassNames,
     customExportOptions: customExportOptions,
@@ -76,7 +76,9 @@ const ColumnChart = _ref => {
     highcharts: _highcharts.default,
     containerProps: {
       className: (0, _classify.default)(_ColumnChartModule.default.columnChartContainer, highChart)
-    },
+    }
+    // @ts-ignore - TS2322 - Type 'RefObject<unknown>' is not assignable to type 'Ref<HighchartsReactRefObject> | undefined'.
+    ,
     ref: chartRef,
     options: chartOptions
   }));