@taiv/ui 2.1.0 → 2.1.2

package/dist/components/Data/Cards/StatsCard/StatsCard.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { CardProps } from '../../../Layout/Card/Card';
 import { primitives } from '../../../../constants/colors';
-import { formats } from '../../../../constants/data';
+import { formats, truncation } from '../../../../constants/data';
 export interface StatsCardProps extends Omit<CardProps, 'children'> {
     value: number;
     title: string;
@@ -12,6 +12,7 @@ export interface StatsCardProps extends Omit<CardProps, 'children'> {
     iconColor?: keyof typeof primitives;
     tooltip?: React.ReactNode;
     increaseDescription?: string;
+    truncateAt?: keyof typeof truncation;
 }
-export declare const StatsCard: ({ value, format, isDelta, title, description, increaseDescription, icon: Icon, iconColor, tooltip, ...cardProps }: StatsCardProps) => React.JSX.Element;
+export declare const StatsCard: ({ value, format, isDelta, title, description, increaseDescription, icon: Icon, iconColor, tooltip, truncateAt, ...cardProps }: StatsCardProps) => React.JSX.Element;
 //# sourceMappingURL=StatsCard.d.ts.map

package/dist/components/Data/Cards/StatsCard/StatsCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatsCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/Data/Cards/StatsCard/StatsCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAQ,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAO5D,OAAO,EAAE,UAAU,EAAoB,MAAM,8BAA8B,CAAC;AAC5E,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAGrD,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACjE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,OAAO,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,OAAO,UAAU,CAAC;IACpC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED,eAAO,MAAM,SAAS,GAAI,mHAAgJ,cAAc,sBA4DvL,CAAC"}
+{"version":3,"file":"StatsCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/Data/Cards/StatsCard/StatsCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAQ,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAO5D,OAAO,EAAE,UAAU,EAAoB,MAAM,8BAA8B,CAAC;AAC5E,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAGjE,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACjE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,OAAO,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,OAAO,UAAU,CAAC;IACpC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,OAAO,UAAU,CAAC;CACtC;AAED,eAAO,MAAM,SAAS,GAAI,+HAA4J,cAAc,sBAmEnM,CAAC"}

package/dist/components/Data/Cards/StatsCard/StatsCard.js

@@ -7,9 +7,9 @@ import { Group } from '../../../Layout/Group/Group';
 import { Stack } from '../../../Layout/Stack/Stack';
 import { IconBadge } from '../../../Misc/IconBadge/IconBadge';
 import { success, neutral } from '../../../../constants/colors';
-import { formats } from '../../../../constants/data';
+import { formats, truncation } from '../../../../constants/data';
 import { spacing } from '../../../../constants/spacing';
-export const StatsCard = ({ value, format = 'decimal', isDelta = false, title, description, increaseDescription, icon: Icon, iconColor = 'blue', tooltip, ...cardProps }) => {
+export const StatsCard = ({ value, format = 'decimal', isDelta = false, title, description, increaseDescription, icon: Icon, iconColor = 'blue', tooltip, truncateAt, ...cardProps }) => {
     const getDelta = () => {
         const currentDirection = isDelta ? (value > 0 ? 'positive' : value < 0 ? 'negative' : null) : null;
         return {
@@ -21,10 +21,17 @@ export const StatsCard = ({ value, format = 'decimal', isDelta = false, title, d
     const delta = getDelta();
     const formatValue = () => {
         const config = formats[format];
-        const formattedNumber = value.toLocaleString('en-US', {
-            minimumFractionDigits: config.decimalPlaces,
-            maximumFractionDigits: config.decimalPlaces,
-        });
+        let formattedNumber;
+        if (truncateAt && value >= truncation[truncateAt].threshold) {
+            const truncConfig = truncation[truncateAt];
+            formattedNumber = `${(value / truncConfig.threshold).toFixed(1)}${truncConfig.suffix}`;
+        }
+        else {
+            formattedNumber = value.toLocaleString('en-US', {
+                minimumFractionDigits: config.decimalPlaces,
+                maximumFractionDigits: config.decimalPlaces,
+            });
+        }
         let result = formattedNumber;
         if (delta.direction === 'positive') {
             result = `+${result}`;

package/dist/components/Info/Notifications/Notifications.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Notifications.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Info/Notifications/Notifications.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AAMnF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,oBAAoB,CAuC3C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAqBnC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC;AAgBF,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAQF,eAAO,MAAM,YAAY,EAAE,KAE1B,CAAC;AAyCF,eAAO,MAAM,kBAAkB,EAAE,KAEhC,CAAC;AAiDF,eAAO,MAAM,qBAAqB,EAAE,KAEnC,CAAC"}
+{"version":3,"file":"Notifications.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Info/Notifications/Notifications.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AAMnF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,oBAAoB,CA0C3C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAqBnC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC;AAkBF,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAQF,eAAO,MAAM,YAAY,EAAE,KAE1B,CAAC;AAyCF,eAAO,MAAM,kBAAkB,EAAE,KAEhC,CAAC;AAiDF,eAAO,MAAM,qBAAqB,EAAE,KAEnC,CAAC"}

package/dist/components/Info/Notifications/Notifications.stories.js

@@ -15,10 +15,12 @@ const meta = {
     argTypes: {
         variant: {
             control: { type: 'select' },
-            options: ['success', 'error', 'warning', 'info', 'copy'],
+            options: ['success', 'error', 'warning', 'info', 'copy', 'lock', 'unlock'],
             description: 'Visual style and icon of the notification',
             table: {
-                type: { summary: "'success' | 'error' | 'warning' | 'info' | 'copy'" },
+                type: {
+                    summary: "'success' | 'error' | 'warning' | 'info' | 'copy' | 'lock' | 'unlock'",
+                },
                 defaultValue: { summary: "'info'" },
             },
         },
@@ -66,7 +68,7 @@ export const Default = {
 };
 const VariantsDemo = () => {
     const { show } = useNotifications();
-    return (_jsxs(Group, { gap: spacing.xs, children: [_jsx(Button, { variant: "success", onClick: () => show({ variant: 'success', message: 'Operation completed successfully!' }), children: "Success" }), _jsx(Button, { variant: "cancel", onClick: () => show({ variant: 'error', message: 'Something went wrong!' }), children: "Error" }), _jsx(Button, { variant: "warning", onClick: () => show({ variant: 'warning', message: 'Please review your input' }), children: "Warning" }), _jsx(Button, { variant: "primary", onClick: () => show({ variant: 'info', message: 'Here is some useful information' }), children: "Info" }), _jsx(Button, { variant: "secondary", onClick: () => show({ variant: 'copy', message: 'Copied to clipboard!' }), children: "Copy" })] }));
+    return (_jsxs(Group, { gap: spacing.xs, children: [_jsx(Button, { variant: "success", onClick: () => show({ variant: 'success', message: 'Operation completed successfully!' }), children: "Success" }), _jsx(Button, { variant: "cancel", onClick: () => show({ variant: 'error', message: 'Something went wrong!' }), children: "Error" }), _jsx(Button, { variant: "warning", onClick: () => show({ variant: 'warning', message: 'Please review your input' }), children: "Warning" }), _jsx(Button, { variant: "primary", onClick: () => show({ variant: 'info', message: 'Here is some useful information' }), children: "Info" }), _jsx(Button, { variant: "secondary", onClick: () => show({ variant: 'copy', message: 'Copied to clipboard!' }), children: "Copy" }), _jsx(Button, { variant: "warning", onClick: () => show({ variant: 'lock', message: 'Bar TV 3 is now locked to Demo Mode. It won\'t follow your automations until you unlock it.' }), children: "Lock" }), _jsx(Button, { variant: "success", onClick: () => show({ variant: 'unlock', message: 'Bar TV 3 will now follow your venue\'s default mode and automations.' }), children: "Unlock" })] }));
 };
 export const Variants = {
     render: () => _jsx(VariantsDemo, {}),

package/dist/components/Info/Notifications/variants.d.ts

@@ -42,5 +42,17 @@ export declare const componentVariants: {
         readonly defaultTitle: "Warning";
         readonly icon: React.JSX.Element;
     };
+    readonly lock: {
+        readonly autoClose: 4000;
+        readonly color: "#FE9A00";
+        readonly defaultTitle: "Locked";
+        readonly icon: React.JSX.Element;
+    };
+    readonly unlock: {
+        readonly autoClose: 4000;
+        readonly color: "#00A84F";
+        readonly defaultTitle: "Unlocked";
+        readonly icon: React.JSX.Element;
+    };
 };
 //# sourceMappingURL=variants.d.ts.map

package/dist/components/Info/Notifications/variants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../../src/components/Info/Notifications/variants.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkDpB,CAAC"}
+{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../../src/components/Info/Notifications/variants.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8DpB,CAAC"}

package/dist/components/Info/Notifications/variants.js

@@ -44,4 +44,16 @@ export const componentVariants = {
         defaultTitle: 'Warning',
         icon: (_jsx("i", { className: 'fas fa-exclamation-triangle', style: { color: warning[100] } })),
     },
+    lock: {
+        autoClose: 4000,
+        color: warning[100],
+        defaultTitle: 'Locked',
+        icon: _jsx("i", { className: 'fas fa-lock', style: { color: warning[100] } }),
+    },
+    unlock: {
+        autoClose: 4000,
+        color: success[300],
+        defaultTitle: 'Unlocked',
+        icon: _jsx("i", { className: 'fas fa-lock-open', style: { color: success[300] } }),
+    },
 };

package/package.json

@@ -85,5 +85,5 @@
     "storybook": "storybook dev -p 6006"
   },
   "types": "dist/index.d.ts",
-  "version": "2.1.0"
+  "version": "2.1.2"
 }