@sendoutcards/quantum-design-ui 1.8.39-alpha.5 → 2.0.0-alpha.0

package/dist/src/helpers/style-functions/computeTextTypeFromSize.d.ts

@@ -1,10 +1,10 @@
-import { SizeType } from "../../types/global";
-import { TextType } from "../../atoms/typography/text";
-export declare const computeTextTypeFromIconLinkSize: (size: SizeType) => TextType;
-export declare const computeTextTypeFromSize: (size: SizeType) => TextType;
-export declare const computeTextTypeFromButtonSize: (size: SizeType) => TextType;
-export declare type InfoBlockSize = {
-    heading: TextType;
-    caption: TextType;
-};
-export declare const computeTextTypeFromInfoBlockSize: (size: SizeType) => InfoBlockSize;
+import { SizeType } from 'src/types/global';
+import { TextType } from 'src/atoms/typography/text';
+export declare const computeTextTypeFromIconLinkSize: (size: SizeType) => TextType;
+export declare const computeTextTypeFromSize: (size: SizeType) => TextType;
+export declare const computeTextTypeFromButtonSize: (size: SizeType) => TextType;
+export type InfoBlockSize = {
+    heading: TextType;
+    caption: TextType;
+};
+export declare const computeTextTypeFromInfoBlockSize: (size: SizeType) => InfoBlockSize;

package/dist/src/helpers/style-functions/convertTextColorToIconColor.d.ts

@@ -1,3 +1,3 @@
-import { TextColor } from "../../atoms/typography/text";
-import { IconColors } from "../../exports/atoms";
-export declare const convertTextColorToIconColor: (textColor: TextColor) => IconColors;
+import { TextColor } from 'src/atoms/typography/text';
+import { IconColors } from 'src/exports/atoms';
+export declare const convertTextColorToIconColor: (textColor: TextColor) => IconColors;

package/dist/src/helpers/style-functions/getIconProperties.d.ts

@@ -1,6 +1,6 @@
-import { IconsEntity } from "../../theme/theming/entities";
-import { SizeType } from "../../types/global";
-import { IconColors } from "../../exports/atoms";
-import { LiteralUnion } from '../hoc-types/entityValueTypes';
-export declare const getIconColor: (color: LiteralUnion<IconColors>, entity: IconsEntity) => any;
-export declare const getIconSize: (size: LiteralUnion<SizeType> | number, entity: IconsEntity) => any;
+import { IconsEntity } from 'src/theme/theming/entities';
+import { SizeType } from 'src/types/global';
+import { IconColors } from 'src/exports/atoms';
+import { LiteralUnion } from '../hoc-types/entityValueTypes';
+export declare const getIconColor: (color: LiteralUnion<IconColors>, entity: IconsEntity) => any;
+export declare const getIconSize: (size: LiteralUnion<SizeType> | number, entity: IconsEntity) => any;

package/dist/src/helpers/style-functions/getNumberFromString.d.ts

@@ -1 +1 @@
-export declare const getNumberFromString: (str: string) => number;
+export declare const getNumberFromString: (str: string) => number;

package/dist/src/helpers/style-functions/mapSizeType.d.ts

@@ -1,2 +1,2 @@
-import { SizeType } from "../../types/global";
-export declare const mapSizeType: <T>(size: SizeType, sizeMap: Record<keyof import("../../types/global").SizeProperties<never>, T>) => T;
+import { SizeType } from 'src/types/global';
+export declare const mapSizeType: <T>(size: SizeType, sizeMap: Record<SizeType, T>) => T;

package/dist/src/helpers/theme-functions/computeColorSwatch.d.ts

@@ -1,14 +1,14 @@
-export declare type ColorSwatch = {
-    base: string;
-    _100?: string;
-    _200?: string;
-    _300?: string;
-    _400?: string;
-    _500?: string;
-    _600?: string;
-    _700?: string;
-    _800?: string;
-    _900?: string;
-    _1000?: string;
-};
-export declare const computeColorSwatch: (hexValue: string) => ColorSwatch;
+export type ColorSwatch = {
+    base: string;
+    _100?: string;
+    _200?: string;
+    _300?: string;
+    _400?: string;
+    _500?: string;
+    _600?: string;
+    _700?: string;
+    _800?: string;
+    _900?: string;
+    _1000?: string;
+};
+export declare const computeColorSwatch: (hexValue: string) => ColorSwatch;

package/dist/src/helpers/theme-functions/computeGrayScale.d.ts

@@ -1,2 +1,2 @@
-import { ColorSwatch } from './computeColorSwatch';
-export declare const computeGrayScale: (swatch: ColorSwatch) => ColorSwatch;
+import { ColorSwatch } from './computeColorSwatch';
+export declare const computeGrayScale: (swatch: ColorSwatch) => ColorSwatch;

package/dist/src/helpers/theme-functions/computeShadow.d.ts

@@ -1,4 +1,4 @@
-import { shadows } from "../../theme/tokens/shadows";
-declare type ShadowConceptKey = keyof typeof shadows;
-export declare const computeShadow: (shadow: ShadowConceptKey | number[], color?: string, reverseOffset?: boolean) => string;
-export {};
+import { shadows } from 'src/theme/tokens/shadows';
+type ShadowConceptKey = keyof typeof shadows;
+export declare const computeShadow: (shadow: ShadowConceptKey | number[], color?: string, reverseOffset?: boolean) => string;
+export {};

package/dist/src/helpers/theme-functions/computeSpacing.d.ts

@@ -1 +1 @@
-export declare const computeSpace: (baseValue: number, baseUnits: string) => (multiplier: number) => string;
+export declare const computeSpace: (baseValue: number, baseUnits: string) => (multiplier: number) => string;

package/dist/src/helpers/utils.d.ts

@@ -1 +1 @@
-export declare const atomicDir: (file: any) => any;
+export declare const atomicDir: (file: any) => any;

package/dist/src/hooks/useColorSwatch.d.ts

@@ -1,11 +1,11 @@
-export declare const useColorSwatch: () => {
-    primaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
-    secondaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
-    success: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
-    danger: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
-    warning: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
-    accent: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
-    grayScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
-    blueScale: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
-    purpleScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
-};
+export declare const useColorSwatch: () => {
+    primaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+    secondaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+    success: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+    danger: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+    warning: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+    accent: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+    grayScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+    blueScale: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+    purpleScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+};

package/dist/src/hooks/useCurrentDevice.d.ts

@@ -1,2 +1,2 @@
-export declare const currentDevice: (currentWidth: number) => "xSmall" | "small" | "medium" | "large" | "xLarge" | "Couldn't find device";
-export declare const useCurrentDevice: (innerWidth: number) => "xSmall" | "small" | "medium" | "large" | "xLarge" | "Couldn't find device";
+export declare const currentDevice: (currentWidth: number) => "small" | "xSmall" | "large" | "medium" | "xLarge" | "Couldn't find device";
+export declare const useCurrentDevice: (innerWidth: number) => "small" | "xSmall" | "large" | "medium" | "xLarge" | "Couldn't find device";

package/dist/src/hooks/useDeviceSize.d.ts

@@ -1,5 +1,5 @@
-import { MediaQueriesEntity } from '../theme/theming/entities';
-export declare const deviceSize: (currentWidth: number, querySizes: MediaQueriesEntity) => "xSmall" | "small" | "medium" | "large" | "xLarge" | "Couldn't find device";
-export declare const useDeviceSize: () => {
-    device: string;
-};
+import { MediaQueriesEntity } from '../theme/theming/entities';
+export declare const deviceSize: (currentWidth: number, querySizes: MediaQueriesEntity) => "small" | "xSmall" | "large" | "medium" | "xLarge" | "Couldn't find device";
+export declare const useDeviceSize: () => {
+    device: string;
+};

package/dist/src/hooks/useEntities.d.ts

@@ -1 +1,504 @@
-export declare const useEntities: () => import("@emotion/react").Theme;
+export declare const useEntities: () => {
+    mediaQueries: {
+        queries: {
+            xSmall: string;
+            small: string;
+            medium: string;
+            large: string;
+            xLarge: string;
+        };
+        rawValues: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+    };
+    hocs: {
+        colors: {
+            swatches: {
+                primaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                secondaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                success: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                danger: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                warning: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                accent: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                grayScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+                blueScale: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                purpleScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+            };
+            background: string;
+            foreground: string;
+        };
+        textColors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        spacing: {
+            x0: string;
+            x_25: string;
+            x_5: string;
+            x_75: string;
+            x1: string;
+            x1_5: string;
+            x2: string;
+            x2_5: string;
+            x3: string;
+            x4: string;
+            x5: string;
+            x6: string;
+            x7: string;
+            x8: string;
+            x9: string;
+        };
+        borderRadius: {
+            none: string;
+            small: string;
+            medium: string;
+            default: string;
+            large: string;
+            circle: string;
+        };
+        shadows: {
+            light: string;
+            mediumLight: string;
+            mediumDark: string;
+            dark: string;
+            generate: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        };
+        borders: {
+            thin: string;
+            default: string;
+            bold: string;
+        };
+    };
+    text: {
+        imports: {
+            body: string;
+            heading: string;
+        };
+        families: {
+            body: string;
+            heading: string;
+        };
+        types: {
+            heroTitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            title: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            subtitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            largeBody: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            body: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            caption: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            footnote: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+        };
+        colors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        weights: {
+            thin: number;
+            regular: number;
+            semiBold: number;
+            bold: number;
+            extraBold: number;
+        };
+    };
+    spacing: {
+        x0: string;
+        x_25: string;
+        x_5: string;
+        x_75: string;
+        x1: string;
+        x1_5: string;
+        x2: string;
+        x2_5: string;
+        x3: string;
+        x4: string;
+        x5: string;
+        x6: string;
+        x7: string;
+        x8: string;
+        x9: string;
+    };
+    buttons: {
+        primary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        secondary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        warning: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        success: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        danger: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        shadow: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        accent: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        smoke: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        boxShadow: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        borderSize: string;
+        outlinedBackgroundColor: string;
+        fontWeight: number;
+        sizes: {
+            xSmall: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            small: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            medium: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            large: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            xLarge: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+        };
+    };
+    inputs: {
+        checkbox: {
+            border: string;
+            borderRadius: string;
+            unCheckedBackgroundColor: string | undefined;
+            checkmarkColor: string;
+            labelColor: string;
+        };
+        text: {
+            borderRadius: string;
+            labelColor: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+            placeholderColor: string;
+            labelFontSize: string;
+            textFontSize: string;
+            borderWidth: string;
+            defaultFocusColor: string;
+        };
+        select: {
+            dropDownShadow: string;
+            dropDownBackgroundColor: string;
+            boxShadow: string;
+            borderRadius: string;
+        };
+        number: {
+            backgroundColor: string | undefined;
+            fontColor: string;
+            fontSize: string;
+            borderRadius: string;
+        };
+        backgroundColor: string;
+        fontSize: string;
+        fontColor: string;
+        fontFamily: string;
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+            accent: string;
+            dark: string;
+            blue: string;
+        };
+    };
+    icons: {
+        sizes: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            default: string | undefined;
+            primaryBodyText: string;
+            primaryHeadingText: string | undefined;
+            inverseBodyText: string;
+            inverseHeadingText: string;
+            primaryBrand: string;
+            secondaryBrand: string;
+            warning: string;
+            danger: string;
+            success: string;
+            background: string;
+            accent: string;
+        };
+    };
+    card: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    separator: {
+        border: string;
+        color: string | undefined;
+    };
+    loadingSpinner: {
+        size: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+        };
+    };
+    animatedCheckmark: {
+        sizeMap: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+        };
+        strokeWidth: {
+            small: number;
+            default: number;
+            large: number;
+        };
+        borderRadius: string;
+        checkmarkFilledColor: string;
+    };
+    avatar: {
+        borderWidth: string;
+        borderColor: string | undefined;
+        borderRadius: string;
+        boxShadow: string;
+        backgroundColor: string;
+        bubbleBackgroundColors: {
+            isActive: string;
+            default: string | undefined;
+        };
+        defaultBackgroundColors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+            warning: string;
+            danger: string;
+        };
+        sizes: {
+            xSmall: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            small: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            medium: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            large: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            xLarge: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+        };
+    };
+    dialog: {
+        backgroundColor: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    drawer: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        bottomDirectionShadow: string;
+        hoverBoxShadow: string;
+        hoverBottomDirectionShadow: string;
+        defaultInset: string;
+        tab: {
+            dark: {
+                backgroundColor: string | undefined;
+                arrowColor: string;
+            };
+            light: {
+                backgroundColor: string;
+                arrowColor: string | undefined;
+            };
+        };
+    };
+    sheet: {
+        mobileBorderRadius: string;
+        desktopBorderRadius: string;
+        backgroundColor: string;
+        boxShadow: string;
+    };
+    slider: {
+        backgroundColor: string;
+        borderRadius: string;
+        handleRadius: string;
+        handleColor: string;
+        handleShadow: string;
+    };
+    navigation: {
+        backgroundColor: string;
+        border: string;
+        borderColor: string | undefined;
+    };
+    toggle: {
+        isActiveColor: string;
+        isNotActiveColor: string | undefined;
+    };
+    tooltip: {
+        lightBackgroundColor: string;
+        darkBackgroundColor: string | undefined;
+        boxShadow: string;
+        borderColor: string;
+    };
+    colorPicker: {
+        backgroundColor: string;
+        borderColor: string;
+        boxShadow: string;
+        borderRadius: string;
+    };
+    sphere: import("../theme/types").Sphere;
+    widget: import("../theme/types").Widget;
+    colorOption: {
+        defaults: {
+            circleFill: string;
+            innerRing: string;
+            outerRing: string;
+        };
+    };
+};

package/dist/src/hooks/useEvent.d.ts

@@ -1 +1 @@
-export declare const useEvent: (event: string, handler: () => void) => void;
+export declare const useEvent: (event: string, handler: () => void) => void;

package/dist/src/hooks/useInnerHeight.d.ts

@@ -1 +1 @@
-export declare const useInnerHeight: () => number;
+export declare const useInnerHeight: () => number;

package/dist/src/hooks/useInnerWidth.d.ts

@@ -1 +1 @@
-export declare const useInnerWidth: () => number;
+export declare const useInnerWidth: () => number;

package/dist/src/hooks/useLinearGradient.d.ts

@@ -1,5 +1,5 @@
-import { ColorStop } from "../types/global";
-import { LiteralUnion, HOCSwatchColorKeys } from "../helpers/hoc-types/entityValueTypes";
-declare type LinearColorStop = number | LiteralUnion<HOCSwatchColorKeys> | ColorStop;
-export declare const useLinearGradient: (angle: number, colors: LinearColorStop[]) => string;
-export {};
+import { ColorStop } from 'src/types/global';
+import { LiteralUnion, HOCSwatchColorKeys } from 'src/helpers/hoc-types/entityValueTypes';
+type LinearColorStop = number | LiteralUnion<HOCSwatchColorKeys> | ColorStop;
+export declare const useLinearGradient: (angle: number, colors: LinearColorStop[]) => string;
+export {};