@sendoutcards/quantum-design-ui 1.8.34 → 1.8.35

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

@@ -1,510 +1 @@
-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: number[] | "dark" | "mediumDark" | "mediumLight" | "light" | "xLight", color?: string | undefined, reverseOffset?: boolean | undefined) => 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: number[] | "dark" | "mediumDark" | "mediumLight" | "light" | "xLight", color?: string | undefined, reverseOffset?: boolean | undefined) => 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("../types/global").SizeProperties<{
-        circumference: number;
-        textType: "heroTitle" | "title" | "subtitle" | "largeBody" | "body" | "caption" | "footnote";
-    }>;
-    widget: import("../types/global").ThemeModeProperies<{
-        backgroundColor: string;
-        fontColor: "primaryBrand" | "secondaryBrand" | "primaryHeading" | "primaryBody" | "inverseHeading" | "inverseBody" | "accent" | "success" | "warning" | "danger" | "anchorBlue";
-    }>;
-    colorOption: {
-        defaults: {
-            circleFill: string;
-            innerRing: string;
-            outerRing: string;
-        };
-    };
-};
+export declare const useEntities: () => import("@emotion/react").Theme;

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

@@ -1 +1 @@
-export declare const useOutsideClick: (ref: any, handler: (event: any) => void, targetIdBypass?: string | undefined) => void;
+export declare const useOutsideClick: (ref: any, handler: (event: any) => void, targetIdBypass?: string) => void;

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

@@ -1,2 +1,5 @@
 import { ColorStop } from "../types/global";
-export declare const useRadialGradient: (colors: ColorStop[], shape?: "circle" | "ellipse" | undefined, size?: "farthest-corner" | "closest-corner" | "closest-side" | "farthest-side" | undefined, position?: string | undefined) => string;
+declare type RadialShape = 'ellipse' | 'circle';
+declare type RadialSize = 'farthest-corner' | 'closest-corner' | 'closest-side' | 'farthest-side';
+export declare const useRadialGradient: (colors: ColorStop[], shape?: RadialShape, size?: RadialSize, position?: string) => string;
+export {};

package/dist/src/molecules/blockQuote/blockQuote.d.ts

@@ -14,5 +14,5 @@ export declare type BlockQuoteProps = {
     boxShadow?: Shadows;
     children?: React.ReactNode;
 };
-export declare const BlockQuote: ({ author, background, textColor, type, content, contentTextType, borderRadius, boxShadow, children, }: BlockQuoteProps) => JSX.Element;
+export declare const BlockQuote: ({ author, background, textColor, type, content, contentTextType, borderRadius, boxShadow, children, }: BlockQuoteProps) => React.JSX.Element;
 export {};

package/dist/src/molecules/button/button.d.ts

@@ -30,4 +30,4 @@ export declare type ButtonProps = {
     boxShadow?: boolean;
 };
 export declare type ButtonStyle = typeof entities.buttons.primary;
-export declare const Button: ({ title, type, size, onClick, children, disabled, hover, outlined, onMouseEvent, fullWidth, textColorOverride, backgroundColorOverride, disabledCaption, id, icon, fontWeight, boxShadow, }: ButtonProps) => JSX.Element;
+export declare const Button: ({ title, type, size, onClick, children, disabled, hover, outlined, onMouseEvent, fullWidth, textColorOverride, backgroundColorOverride, disabledCaption, id, icon, fontWeight, boxShadow, }: ButtonProps) => React.JSX.Element;

package/dist/src/molecules/button/styles.d.ts

@@ -1,8 +1,9 @@
 import { ButtonsEntity, Entities, TextEntity } from "../../theme/theming/entities";
 import { SizeType } from "../../types/global";
 import { ButtonType, ButtonStyle } from './button';
+import { WeightType } from "../../exports/atoms";
 declare const _default: {
-    buttonStyles: (type: ButtonType, buttonStyle: ButtonStyle, entities: Entities, size: SizeType, hover?: boolean | undefined, outlined?: boolean | undefined, fullWidth?: boolean | undefined, backgroundColorOverride?: string | undefined, boxShadow?: boolean | undefined) => import("@emotion/utils").SerializedStyles;
-    buttonTitle: (type: ButtonType, buttonEntity: ButtonsEntity, size: SizeType, textEntity: TextEntity, fontWeight?: "thin" | "regular" | "semiBold" | "bold" | "extraBold" | undefined) => import("@emotion/utils").SerializedStyles;
+    buttonStyles: (type: ButtonType, buttonStyle: ButtonStyle, entities: Entities, size: SizeType, hover?: boolean, outlined?: boolean, fullWidth?: boolean, backgroundColorOverride?: string, boxShadow?: boolean) => import("@emotion/react").SerializedStyles;
+    buttonTitle: (type: ButtonType, buttonEntity: ButtonsEntity, size: SizeType, textEntity: TextEntity, fontWeight?: WeightType) => import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/checkbox/styles.d.ts

@@ -1,9 +1,9 @@
 import { CheckboxType } from './checkbox';
 import { InputsEntity } from "../../theme/theming/entities";
 declare const _default: {
-    app: import("@emotion/utils").SerializedStyles;
-    checkboxContainer: (inputsEntity: InputsEntity, type: CheckboxType) => import("@emotion/utils").SerializedStyles;
-    box: (inputsEntity: InputsEntity) => import("@emotion/utils").SerializedStyles;
-    boxInner: import("@emotion/utils").SerializedStyles;
+    app: import("@emotion/react").SerializedStyles;
+    checkboxContainer: (inputsEntity: InputsEntity, type: CheckboxType) => import("@emotion/react").SerializedStyles;
+    box: (inputsEntity: InputsEntity) => import("@emotion/react").SerializedStyles;
+    boxInner: import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/closeButton/styles.d.ts

@@ -1,4 +1,4 @@
 declare const _default: {
-    closeButtonContainer: (top?: string | undefined, right?: string | undefined) => import("@emotion/utils").SerializedStyles;
+    closeButtonContainer: (top?: string, right?: string) => import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/contextBar/contextBar.d.ts

@@ -2,5 +2,5 @@ import React from 'react';
 declare type ContextBarProps = {
     children?: React.ReactNode;
 };
-export declare const ContextBar: ({ children }: ContextBarProps) => JSX.Element;
+export declare const ContextBar: ({ children }: ContextBarProps) => React.JSX.Element;
 export {};

package/dist/src/molecules/dialog/styles.d.ts

@@ -1,5 +1,5 @@
 declare const _default: {
-    dialogContainer: import("@emotion/utils").SerializedStyles;
-    closeIconWrapper: import("@emotion/utils").SerializedStyles;
+    dialogContainer: import("@emotion/react").SerializedStyles;
+    closeIconWrapper: import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/displayCard/displayCard.d.ts

@@ -4,4 +4,4 @@ export declare type DisplayCardProps = {
     description: string;
     children?: React.ReactNode;
 };
-export declare const DisplayCard: ({ title, description, children, }: DisplayCardProps) => JSX.Element;
+export declare const DisplayCard: ({ title, description, children, }: DisplayCardProps) => React.JSX.Element;

package/dist/src/molecules/dragBar/styles.d.ts

@@ -1,4 +1,4 @@
 declare const _default: {
-    tapBox: import("@emotion/utils").SerializedStyles;
+    tapBox: import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/dragBox/styles.d.ts

@@ -1,4 +1,4 @@
 declare const _default: {
-    dragBox: import("@emotion/utils").SerializedStyles;
+    dragBox: import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/drawer/drawer.d.ts

@@ -20,4 +20,4 @@ export declare type DrawerProps = {
     shouldHideScroll?: boolean;
     backgroundColor?: LiteralUnion<'blurredGlass'>;
 };
-export declare const Drawer: ({ children, location, isOpen, isTabHidden, onClick, openValue, offset, zIndex, showTab, inset, overflow, closedValue, tabMode, shouldHideScroll, backgroundColor, }: DrawerProps) => JSX.Element;
+export declare const Drawer: ({ children, location, isOpen, isTabHidden, onClick, openValue, offset, zIndex, showTab, inset, overflow, closedValue, tabMode, shouldHideScroll, backgroundColor, }: DrawerProps) => React.JSX.Element;

package/dist/src/molecules/drawer/styles.d.ts

@@ -1,7 +1,7 @@
 import { DrawerLocation } from './drawer';
 declare const _default: {
-    drawerContainer: (location: DrawerLocation) => import("@emotion/utils").SerializedStyles;
-    childContainer: (shouldHideScroll?: boolean | undefined) => import("@emotion/utils").SerializedStyles;
-    drawerTab: (location: DrawerLocation, openValue: number) => import("@emotion/utils").SerializedStyles;
+    drawerContainer: (location: DrawerLocation) => import("@emotion/react").SerializedStyles;
+    childContainer: (shouldHideScroll?: boolean) => import("@emotion/react").SerializedStyles;
+    drawerTab: (location: DrawerLocation, openValue: number) => import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/grid/components/gridItem.d.ts

@@ -9,5 +9,5 @@ declare type GridItemProps = {
     aspectRatio?: string;
     children?: React.ReactNode;
 };
-export declare const GridItem: ({ gridRowSpan, gridColSpan, gridRowStart, gridColStart, borderRadius, aspectRatio, children, }: GridItemProps) => JSX.Element;
+export declare const GridItem: ({ gridRowSpan, gridColSpan, gridRowStart, gridColStart, borderRadius, aspectRatio, children, }: GridItemProps) => React.JSX.Element;
 export {};

package/dist/src/molecules/grid/grid.d.ts

@@ -14,5 +14,5 @@ export declare type GridProps = {
     exit?: TargetAndTransition | VariantLabels;
     children?: React.ReactNode;
 };
-export declare const Grid: ({ columnSize, rowSize, gap, maxWidth, children, height, overflow, isDense, animate, exit, initial, }: GridProps) => JSX.Element;
+export declare const Grid: ({ columnSize, rowSize, gap, maxWidth, children, height, overflow, isDense, animate, exit, initial, }: GridProps) => React.JSX.Element;
 export {};

package/dist/src/molecules/grid/styles.d.ts

@@ -1,5 +1,5 @@
 declare const _default: {
-    grid: (gap: number, columnSize: number, rowSize: number, maxWidth?: number | undefined, height?: string | undefined, overflow?: string | undefined, isDense?: boolean | undefined) => import("@emotion/utils").SerializedStyles;
-    gridItem: (gridRowSpan?: number | undefined, gridColSpan?: number | undefined, gridRowStart?: number | undefined, gridColStart?: number | undefined, aspectRatio?: string | undefined) => import("@emotion/utils").SerializedStyles;
+    grid: (gap: number, columnSize: number, rowSize: number, maxWidth?: number, height?: string, overflow?: string, isDense?: boolean) => import("@emotion/react").SerializedStyles;
+    gridItem: (gridRowSpan?: number, gridColSpan?: number, gridRowStart?: number, gridColStart?: number, aspectRatio?: string) => import("@emotion/react").SerializedStyles;
 };
 export default _default;

package/dist/src/molecules/iconLink/styles.d.ts

@@ -1,7 +1,7 @@
 import { IconsEntity } from "../../theme/theming/entities";
 declare const _default: {
-    iconLinkContainer: (isStacked: boolean, isActive: boolean, icons: IconsEntity, isBackgroundDisabled?: boolean | undefined) => import("@emotion/utils").SerializedStyles;
-    iconContainer: import("@emotion/utils").SerializedStyles;
-    titleContainer: import("@emotion/utils").SerializedStyles;
+    iconLinkContainer: (isStacked: boolean, isActive: boolean, icons: IconsEntity, isBackgroundDisabled?: boolean) => import("@emotion/react").SerializedStyles;
+    iconContainer: import("@emotion/react").SerializedStyles;
+    titleContainer: import("@emotion/react").SerializedStyles;
 };
 export default _default;