@blockchain-com/constellation - npm Package Compare versions

Comparing version 0.0.27 to 0.0.28-alpha1

dist/cjs/types/components/index.d.ts

@@ -1,5 +0,12 @@
-import CopyToClipboard from './CopyToClipboard';
-import Icon, { IconName } from './Icon';
-import Switch from './Switch';
-import Text from './Text';
-export { CopyToClipboard, Icon, IconName, Switch, Text };
+export { default as Avatar } from './Avatar';
+export { default as Button } from './Button';
+export { default as Checkbox } from './Checkbox';
+export { default as Popover } from './Popover';
+export { default as ProgressBar } from './ProgressBar';
+export { default as Separator } from './Separator';
+export { default as Slider } from './Slider';
+export { default as Switch } from './Switch';
+export { default as Text } from './Text';
+export { default as Toggle } from './Toggle';
+export { default as ToggleGroup } from './ToggleGroup';
+export { default as Tooltip } from './Tooltip';

dist/cjs/types/components/Switch/index.d.ts

 /// <reference types="react" />
-import { SwitchProps } from './types';
-declare const Switch: ({ activeColor, disabled, disabledColor, firstItem, handleFirstItemClicked, handleSecondItemClicked, hoverColor, isFirstItemActive, isFullWidth, regularColor, secondItem, selectedActiveColor, selectedColor, selectedHoverColor, selectedTextColor, textColor, }: SwitchProps) => JSX.Element;
+declare const Switch: () => JSX.Element;
 export default Switch;

dist/cjs/types/components/Text/index.d.ts

 import React from 'react';
 declare const Text: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLHeadingElement | HTMLParagraphElement>, "ref" | "as"> & {
     children: React.ReactNode;
-    htmlFor?: ("h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span") | undefined;
+    color?: "white1" | "white100" | "white200" | "white400" | "white60" | "white600" | "white800" | "teal0" | "teal100" | "teal200" | "teal300" | "teal400" | "teal500" | "teal600" | "teal700" | "teal800" | "teal900" | "red0" | "red100" | "red200" | "red300" | "red400" | "red500" | "red600" | "red700" | "red800" | "red900" | "purple0" | "purple100" | "purple200" | "purple300" | "purple400" | "purple500" | "purple600" | "purple700" | "purple800" | "purple900" | "orange0" | "orange100" | "orange200" | "orange300" | "orange400" | "orange500" | "orange600" | "orange700" | "orange800" | "orange900" | "grey0" | "grey100" | "grey200" | "grey300" | "grey400" | "grey500" | "grey600" | "grey700" | "grey800" | "grey900" | "green0" | "green100" | "green200" | "green300" | "green400" | "green500" | "green600" | "green700" | "green800" | "green900" | "dark100" | "dark200" | "dark400" | "dark60" | "dark600" | "dark700" | "dark800" | "dark900" | "blue0" | "blue100" | "blue200" | "blue300" | "blue400" | "blue500" | "blue600" | "blue700" | "blue800" | "blue900" | undefined;
+    htmlFor?: ("h2" | "h3" | "p" | "span" | "h1" | "h4" | "h5" | "h6") | undefined;
     variant?: ("display" | "title-1" | "title-2" | "title-3" | "subheading" | "body-mono" | "body-1" | "body-2" | "paragraph-mono" | "paragraph-1" | "paragraph-2" | "caption-1" | "caption-2" | "overline" | "micro") | undefined;
 } & React.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
 export default Text;

dist/cjs/types/components/Text/Text.stories.d.ts

@@ -1,20 +0,12 @@
-import { Story } from '@storybook/react';
+import { ComponentMeta, ComponentStory } from '@storybook/react';
 import React from 'react';
-import { TextProps } from './types';
-declare const _default: {
-    argTypes: {
-        htmlFor: {
-            description: string;
-            options: string[];
-            type: string;
-        };
-    };
-    component: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLHeadingElement | HTMLParagraphElement>, "ref" | "as"> & {
-        children: React.ReactNode;
-        htmlFor?: ("h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span") | undefined;
-        variant?: ("display" | "title-1" | "title-2" | "title-3" | "subheading" | "body-mono" | "body-1" | "body-2" | "paragraph-mono" | "paragraph-1" | "paragraph-2" | "caption-1" | "caption-2" | "overline" | "micro") | undefined;
-    } & React.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
-    title: string;
-};
+import Text from '.';
+declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLHeadingElement | HTMLParagraphElement>, "ref" | "as"> & {
+    children: React.ReactNode;
+    color?: "white1" | "white100" | "white200" | "white400" | "white60" | "white600" | "white800" | "teal0" | "teal100" | "teal200" | "teal300" | "teal400" | "teal500" | "teal600" | "teal700" | "teal800" | "teal900" | "red0" | "red100" | "red200" | "red300" | "red400" | "red500" | "red600" | "red700" | "red800" | "red900" | "purple0" | "purple100" | "purple200" | "purple300" | "purple400" | "purple500" | "purple600" | "purple700" | "purple800" | "purple900" | "orange0" | "orange100" | "orange200" | "orange300" | "orange400" | "orange500" | "orange600" | "orange700" | "orange800" | "orange900" | "grey0" | "grey100" | "grey200" | "grey300" | "grey400" | "grey500" | "grey600" | "grey700" | "grey800" | "grey900" | "green0" | "green100" | "green200" | "green300" | "green400" | "green500" | "green600" | "green700" | "green800" | "green900" | "dark100" | "dark200" | "dark400" | "dark60" | "dark600" | "dark700" | "dark800" | "dark900" | "blue0" | "blue100" | "blue200" | "blue300" | "blue400" | "blue500" | "blue600" | "blue700" | "blue800" | "blue900" | undefined;
+    htmlFor?: ("h2" | "h3" | "p" | "span" | "h1" | "h4" | "h5" | "h6") | undefined;
+    variant?: ("display" | "title-1" | "title-2" | "title-3" | "subheading" | "body-mono" | "body-1" | "body-2" | "paragraph-mono" | "paragraph-1" | "paragraph-2" | "caption-1" | "caption-2" | "overline" | "micro") | undefined;
+} & React.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>>;
 export default _default;
-export declare const Text: Story<TextProps>;
+export declare const Default: ComponentStory<typeof Text>;
+export declare const AllVariants: ComponentStory<typeof Text>;

dist/cjs/types/components/Text/types.d.ts

 import { HTMLProps, ReactNode } from 'react';
+import { ColorKeysType } from '../../colors/types';
 declare type VariantType = 'display' | 'title-1' | 'title-2' | 'title-3' | 'subheading' | 'body-mono' | 'body-1' | 'body-2' | 'paragraph-mono' | 'paragraph-1' | 'paragraph-2' | 'caption-1' | 'caption-2' | 'overline' | 'micro';
@@ -6,2 +7,3 @@ declare type HtmlFor = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span';
     children: ReactNode;
+    color?: ColorKeysType;
     htmlFor?: HtmlFor;
@@ -8,0 +10,0 @@ variant?: VariantType;

dist/esm/types/components/index.d.ts

@@ -1,5 +0,12 @@
-import CopyToClipboard from './CopyToClipboard';
-import Icon, { IconName } from './Icon';
-import Switch from './Switch';
-import Text from './Text';
-export { CopyToClipboard, Icon, IconName, Switch, Text };
+export { default as Avatar } from './Avatar';
+export { default as Button } from './Button';
+export { default as Checkbox } from './Checkbox';
+export { default as Popover } from './Popover';
+export { default as ProgressBar } from './ProgressBar';
+export { default as Separator } from './Separator';
+export { default as Slider } from './Slider';
+export { default as Switch } from './Switch';
+export { default as Text } from './Text';
+export { default as Toggle } from './Toggle';
+export { default as ToggleGroup } from './ToggleGroup';
+export { default as Tooltip } from './Tooltip';

dist/esm/types/components/Switch/index.d.ts

 /// <reference types="react" />
-import { SwitchProps } from './types';
-declare const Switch: ({ activeColor, disabled, disabledColor, firstItem, handleFirstItemClicked, handleSecondItemClicked, hoverColor, isFirstItemActive, isFullWidth, regularColor, secondItem, selectedActiveColor, selectedColor, selectedHoverColor, selectedTextColor, textColor, }: SwitchProps) => JSX.Element;
+declare const Switch: () => JSX.Element;
 export default Switch;

dist/esm/types/components/Text/index.d.ts

 import React from 'react';
 declare const Text: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLHeadingElement | HTMLParagraphElement>, "ref" | "as"> & {
     children: React.ReactNode;
-    htmlFor?: ("h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span") | undefined;
+    color?: "white1" | "white100" | "white200" | "white400" | "white60" | "white600" | "white800" | "teal0" | "teal100" | "teal200" | "teal300" | "teal400" | "teal500" | "teal600" | "teal700" | "teal800" | "teal900" | "red0" | "red100" | "red200" | "red300" | "red400" | "red500" | "red600" | "red700" | "red800" | "red900" | "purple0" | "purple100" | "purple200" | "purple300" | "purple400" | "purple500" | "purple600" | "purple700" | "purple800" | "purple900" | "orange0" | "orange100" | "orange200" | "orange300" | "orange400" | "orange500" | "orange600" | "orange700" | "orange800" | "orange900" | "grey0" | "grey100" | "grey200" | "grey300" | "grey400" | "grey500" | "grey600" | "grey700" | "grey800" | "grey900" | "green0" | "green100" | "green200" | "green300" | "green400" | "green500" | "green600" | "green700" | "green800" | "green900" | "dark100" | "dark200" | "dark400" | "dark60" | "dark600" | "dark700" | "dark800" | "dark900" | "blue0" | "blue100" | "blue200" | "blue300" | "blue400" | "blue500" | "blue600" | "blue700" | "blue800" | "blue900" | undefined;
+    htmlFor?: ("h2" | "h3" | "p" | "span" | "h1" | "h4" | "h5" | "h6") | undefined;
     variant?: ("display" | "title-1" | "title-2" | "title-3" | "subheading" | "body-mono" | "body-1" | "body-2" | "paragraph-mono" | "paragraph-1" | "paragraph-2" | "caption-1" | "caption-2" | "overline" | "micro") | undefined;
 } & React.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
 export default Text;

dist/esm/types/components/Text/Text.stories.d.ts

@@ -1,20 +0,12 @@
-import { Story } from '@storybook/react';
+import { ComponentMeta, ComponentStory } from '@storybook/react';
 import React from 'react';
-import { TextProps } from './types';
-declare const _default: {
-    argTypes: {
-        htmlFor: {
-            description: string;
-            options: string[];
-            type: string;
-        };
-    };
-    component: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLHeadingElement | HTMLParagraphElement>, "ref" | "as"> & {
-        children: React.ReactNode;
-        htmlFor?: ("h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span") | undefined;
-        variant?: ("display" | "title-1" | "title-2" | "title-3" | "subheading" | "body-mono" | "body-1" | "body-2" | "paragraph-mono" | "paragraph-1" | "paragraph-2" | "caption-1" | "caption-2" | "overline" | "micro") | undefined;
-    } & React.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
-    title: string;
-};
+import Text from '.';
+declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLHeadingElement | HTMLParagraphElement>, "ref" | "as"> & {
+    children: React.ReactNode;
+    color?: "white1" | "white100" | "white200" | "white400" | "white60" | "white600" | "white800" | "teal0" | "teal100" | "teal200" | "teal300" | "teal400" | "teal500" | "teal600" | "teal700" | "teal800" | "teal900" | "red0" | "red100" | "red200" | "red300" | "red400" | "red500" | "red600" | "red700" | "red800" | "red900" | "purple0" | "purple100" | "purple200" | "purple300" | "purple400" | "purple500" | "purple600" | "purple700" | "purple800" | "purple900" | "orange0" | "orange100" | "orange200" | "orange300" | "orange400" | "orange500" | "orange600" | "orange700" | "orange800" | "orange900" | "grey0" | "grey100" | "grey200" | "grey300" | "grey400" | "grey500" | "grey600" | "grey700" | "grey800" | "grey900" | "green0" | "green100" | "green200" | "green300" | "green400" | "green500" | "green600" | "green700" | "green800" | "green900" | "dark100" | "dark200" | "dark400" | "dark60" | "dark600" | "dark700" | "dark800" | "dark900" | "blue0" | "blue100" | "blue200" | "blue300" | "blue400" | "blue500" | "blue600" | "blue700" | "blue800" | "blue900" | undefined;
+    htmlFor?: ("h2" | "h3" | "p" | "span" | "h1" | "h4" | "h5" | "h6") | undefined;
+    variant?: ("display" | "title-1" | "title-2" | "title-3" | "subheading" | "body-mono" | "body-1" | "body-2" | "paragraph-mono" | "paragraph-1" | "paragraph-2" | "caption-1" | "caption-2" | "overline" | "micro") | undefined;
+} & React.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>>;
 export default _default;
-export declare const Text: Story<TextProps>;
+export declare const Default: ComponentStory<typeof Text>;
+export declare const AllVariants: ComponentStory<typeof Text>;

dist/esm/types/components/Text/types.d.ts

 import { HTMLProps, ReactNode } from 'react';
+import { ColorKeysType } from '../../colors/types';
 declare type VariantType = 'display' | 'title-1' | 'title-2' | 'title-3' | 'subheading' | 'body-mono' | 'body-1' | 'body-2' | 'paragraph-mono' | 'paragraph-1' | 'paragraph-2' | 'caption-1' | 'caption-2' | 'overline' | 'micro';
@@ -6,2 +7,3 @@ declare type HtmlFor = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span';
     children: ReactNode;
+    color?: ColorKeysType;
     htmlFor?: HtmlFor;
@@ -8,0 +10,0 @@ variant?: VariantType;

dist/index.d.ts

 /// <reference types="react" />
 import * as React from 'react';
-import React__default, { SVGProps } from 'react';
+import React__default from 'react';
 
@@ -93,206 +93,31 @@ declare const colors: {
 
-declare type ColorKeysType = keyof typeof colors;
+declare const Avatar: () => JSX.Element;
 
-declare type IconProps = SVGProps<SVGSVGElement> & {
-    bgColor?: string;
-    color?: string;
-    height?: number;
-    width?: number;
-};
+declare const Button: () => JSX.Element;
 
-declare enum IconName {
-    ACTIVITY = "activity",
-    AIRDROP = "airdrop",
-    ALERT = "alert",
-    ANDROID = "android",
-    APPLE = "apple",
-    ARROW_BI_DIRECTIONAL = "arrow-bi-directional",
-    ARROW_DOWN = "arrow-down",
-    ARROW_LEFT = "arrow-left",
-    ARROW_RIGHT = "arrow-right",
-    ARROW_UP = "arrow-up",
-    BACKSPACE = "backspace",
-    BACKUP = "backup",
-    BANK = "bank",
-    BLOCKCHAIN = "blockchain",
-    BLOCKCHAIN_CIRCLE = "blockchain-circle",
-    CALENDAR = "calendar",
-    CALL = "call",
-    CAMERA = "camera",
-    CART = "cart",
-    CHART = "chart",
-    CHART_BUBBLES = "chart-bubbles",
-    CHART_PIE = "chart-pie",
-    CHECK = "check",
-    CHECK_CIRCLE = "check-circle",
-    CHEVRON_DOWN = "chevron-down",
-    CHEVRON_LEFT = "chevron-left",
-    CHEVRON_RIGHT = "chevron-right",
-    CHEVRON_UP = "chevron-up",
-    CLIPBOARD = "clipboard",
-    CLOSE = "close",
-    CLOSE_CIRCLE = "close-circle",
-    CLOSE_CIRCLE_V2 = "close-circle-v2",
-    CLOSE_V2 = "close-v2",
-    COLOR_PICKER = "color-picker",
-    COMMENT = "comment",
-    COMPONENTS = "components",
-    COMPUTER = "computer",
-    COPY = "copy",
-    CREDIT_CARD = "credit-card",
-    DELETE = "delete",
-    DEPOSIT = "deposit",
-    DOWNLOAD = "download",
-    EDIT = "edit",
-    EDUCATION = "education",
-    EMAIL = "email",
-    ERROR = "error",
-    EXCHANGE = "exchange",
-    EXPANDLESS = "expandless",
-    EXPANDMORE = "expandmore",
-    EXPLORE = "explore",
-    FACEID = "faceid",
-    FAVORITE = "favorite",
-    FILTER = "filter",
-    FINGERPRINT = "fingerprint",
-    FLAG = "flag",
-    FLASHOFF = "flashoff",
-    FLASHON = "flashon",
-    FULLSCREEN = "fullscreen",
-    FULLSCREEN_EXIT = "fullscreen-exit",
-    GLOBE = "globe",
-    GOOGLE_TRANSLATE = "google-translate",
-    HARDWARE = "hardware",
-    HISTORY = "history",
-    HOME = "home",
-    IDENTIFICATION = "identification",
-    INFORMATION = "information",
-    KEY = "key",
-    KEYBOARD = "keyboard",
-    LAPTOP = "laptop",
-    LEGAL = "legal",
-    LINE_CHART_UP = "line-chart-up",
-    LINK = "link",
-    LIST_BULLET = "list-bullet",
-    LOADING = "loading",
-    LOCK = "lock",
-    LOGOUT = "logout",
-    MARKETUP = "marketup",
-    MENU = "menu",
-    MICROPHONE = "microphone",
-    MINUS_CIRCLE = "minus-circle",
-    MONEY_USD = "money-usd",
-    MORE_HORIZONTAL = "more-horizontal",
-    MORE_VERTICAL = "more-vertical",
-    NEW_WINDOW = "new-window",
-    NOTIFICATION = "notification",
-    NOTIFICATION_OFF = "notification-off",
-    PAPERCLIP = "paperclip",
-    PENDING = "pending",
-    PEOPLE = "people",
-    PHONE = "phone",
-    PLACEHOLDER = "placeholder",
-    PLAY_CIRCLE = "play-circle",
-    PLUS = "plus",
-    PLUS_CIRCLE = "plus-circle",
-    PORTFOLIO = "portfolio",
-    PRESENT = "present",
-    PRINT = "print",
-    PRIVATE = "private",
-    QRCODE = "qrcode",
-    QUESTION = "question",
-    QUESTION_CIRCLE = "question-circle",
-    RECEIVE = "receive",
-    RECEIVE_V2 = "receive-v2",
-    REFRESH = "refresh",
-    REPEAT = "repeat",
-    REWARDS = "rewards",
-    REWARDS_CIRCLE = "rewards-circle",
-    SEARCH = "search",
-    SECURITY = "security",
-    SELL = "sell",
-    SEND = "send",
-    SEND_V2 = "send-v2",
-    SETTINGS = "settings",
-    SHARE_ANDROID = "share-android",
-    SHARE_IOS = "share-ios",
-    SIGNOUT = "signout",
-    SUBDIRECTORY = "subdirectory",
-    SUPPORT = "support",
-    SWAP = "swap",
-    SYNC = "sync",
-    TAG_SELL = "tag-sell",
-    TIMEOUT = "timeout",
-    TOR = "tor",
-    TRADE = "trade",
-    TRADE_FAB = "trade_fab",
-    TRANSACT = "transact",
-    TRANSACT_CLOSE = "transact-close",
-    TRIANGLE_DOWN = "triangle-down",
-    TRIANGLE_UP = "triangle-up",
-    UNFOLD_LESS = "unfold-less",
-    UNFOLD_MORE = "unfold-more",
-    UNLOCKED = "unlocked",
-    USER = "user",
-    USER_ADD = "user-add",
-    VERIFIED = "verified",
-    VISIBILITY_OFF = "visibility-off",
-    VISIBILITY_ON = "visibility-on",
-    WALLET = "wallet",
-    WITHDRAW = "withdraw"
-}
-declare type IconSize = 'sm' | 'md' | 'lg' | 'xl' | 'xm';
-declare type IconPropsType = IconProps & {
-    name: IconName;
-    size?: IconSize;
-};
+declare const Checkbox: () => JSX.Element;
 
-declare const iconSize: {
-    lg: number;
-    md: number;
-    sm: number;
-    xl: number;
-    xm: number;
-};
-declare const Icon: (props: IconPropsType) => JSX.Element;
+declare const Popover: () => JSX.Element;
 
-declare type CopyToClipboardTypes = {
-    color?: ColorKeysType;
-    customHandler?: () => void;
-    hoverColor?: ColorKeysType;
-    size?: keyof typeof iconSize;
-    successColor?: ColorKeysType;
-    successHoverColor?: ColorKeysType;
-    value: string;
-};
+declare const Progress: () => JSX.Element;
 
-declare const CopyToClipboard: ({ color, customHandler, hoverColor, size, successColor, successHoverColor, value, }: CopyToClipboardTypes) => JSX.Element;
+declare const Separator: () => JSX.Element;
 
-declare type SwitchProps = {
-    activeColor?: string;
-    disabled?: boolean;
-    disabledColor?: string;
-    firstItem: string;
-    handleFirstItemClicked: () => void;
-    handleSecondItemClicked: () => void;
-    hoverColor?: string;
-    isFirstItemActive: boolean;
-    isFullWidth?: boolean;
-    regularColor?: string;
-    secondItem: string;
-    selectedActiveColor?: string;
-    selectedColor?: string;
-    selectedHoverColor?: string;
-    selectedTextColor?: string;
-    textColor?: string;
-};
+declare const Slider: () => JSX.Element;
 
-declare const Switch: ({ activeColor, disabled, disabledColor, firstItem, handleFirstItemClicked, handleSecondItemClicked, hoverColor, isFirstItemActive, isFullWidth, regularColor, secondItem, selectedActiveColor, selectedColor, selectedHoverColor, selectedTextColor, textColor, }: SwitchProps) => JSX.Element;
+declare const Switch: () => JSX.Element;
 
 declare const Text: React__default.ForwardRefExoticComponent<Omit<React__default.HTMLProps<HTMLHeadingElement | HTMLParagraphElement>, "ref" | "as"> & {
     children: React__default.ReactNode;
-    htmlFor?: ("h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span") | undefined;
+    color?: "white1" | "white100" | "white200" | "white400" | "white60" | "white600" | "white800" | "teal0" | "teal100" | "teal200" | "teal300" | "teal400" | "teal500" | "teal600" | "teal700" | "teal800" | "teal900" | "red0" | "red100" | "red200" | "red300" | "red400" | "red500" | "red600" | "red700" | "red800" | "red900" | "purple0" | "purple100" | "purple200" | "purple300" | "purple400" | "purple500" | "purple600" | "purple700" | "purple800" | "purple900" | "orange0" | "orange100" | "orange200" | "orange300" | "orange400" | "orange500" | "orange600" | "orange700" | "orange800" | "orange900" | "grey0" | "grey100" | "grey200" | "grey300" | "grey400" | "grey500" | "grey600" | "grey700" | "grey800" | "grey900" | "green0" | "green100" | "green200" | "green300" | "green400" | "green500" | "green600" | "green700" | "green800" | "green900" | "dark100" | "dark200" | "dark400" | "dark60" | "dark600" | "dark700" | "dark800" | "dark900" | "blue0" | "blue100" | "blue200" | "blue300" | "blue400" | "blue500" | "blue600" | "blue700" | "blue800" | "blue900" | undefined;
+    htmlFor?: ("h2" | "h3" | "p" | "span" | "h1" | "h4" | "h5" | "h6") | undefined;
     variant?: ("display" | "title-1" | "title-2" | "title-3" | "subheading" | "body-mono" | "body-1" | "body-2" | "paragraph-mono" | "paragraph-1" | "paragraph-2" | "caption-1" | "caption-2" | "overline" | "micro") | undefined;
 } & React__default.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
 
+declare const Toggle: () => JSX.Element;
+
+declare const ToggleGroup: () => JSX.Element;
+
+declare const Tooltip: () => JSX.Element;
+
 declare const useClickOutside: <T extends HTMLElement = any>(handler: () => void, events?: string[] | null | undefined, nodes?: HTMLElement[] | undefined) => React.MutableRefObject<T | undefined>;
@@ -367,2 +192,2 @@
 
-export { CopyToClipboard, Icon, IconName, Switch, Text, colors, debounce, parseSymbol, parseUTM, queuevent, screenSizes, tracking, useClickOutside, useCopyToClipboard, useViewportSize, useWindowEvent, utmCampaignBuilder };
+export { Avatar, Button, Checkbox, Popover, Progress as ProgressBar, Separator, Slider, Switch, Text, Toggle, ToggleGroup, Tooltip, colors, debounce, parseSymbol, parseUTM, queuevent, screenSizes, tracking, useClickOutside, useCopyToClipboard, useViewportSize, useWindowEvent, utmCampaignBuilder };

package.json

 {
   "name": "@blockchain-com/constellation",
-  "version": "0.0.27",
+  "version": "0.0.28-alpha1",
   "license": "MIT",
@@ -26,65 +26,79 @@ "main": "dist/cjs/index.js",
     "storybook": "start-storybook -p 9009",
-    "test": "jest --passWithNoTests"
+    "test": "jest"
   },
   "devDependencies": {
-    "@babel/core": "^7.15.0",
-    "@mdx-js/react": "^1.6.22",
-    "@rollup/plugin-commonjs": "^21.0.1",
-    "@rollup/plugin-node-resolve": "^13.1.2",
-    "@rollup/plugin-typescript": "^8.3.0",
-    "@storybook/addon-actions": "^6.3.7",
-    "@storybook/addon-docs": "^6.3.7",
-    "@storybook/addon-essentials": "^6.3.7",
-    "@storybook/addon-links": "^6.3.7",
-    "@storybook/react": "^6.3.7",
-    "@storybook/storybook-deployer": "^2.8.10",
-    "@types/react": "^17.0.16",
-    "@types/react-dom": "^17.0.9",
-    "@types/styled-components": "^5.1.12",
-    "@typescript-eslint/eslint-plugin": "^4.17.0",
-    "@typescript-eslint/parser": "^4.22.0",
-    "babel-loader": "^8.2.2",
-    "eslint": "^7.21.0",
-    "eslint-config-airbnb": "^18.2.1",
-    "eslint-config-constellation": "0.0.26",
-    "eslint-config-prettier": "^8.1.0",
-    "eslint-import-resolver-typescript": "^2.4.0",
-    "eslint-plugin-import": "^2.22.1",
-    "eslint-plugin-jest": "^24.3.1",
-    "eslint-plugin-jest-dom": "^3.6.5",
-    "eslint-plugin-json": "^2.1.2",
-    "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-prettier": "^3.3.1",
-    "eslint-plugin-react": "^7.22.0",
-    "eslint-plugin-react-hooks": "^4.2.0",
-    "eslint-plugin-simple-import-sort": "^7.0.0",
-    "eslint-plugin-sort-destructure-keys": "^1.3.5",
-    "eslint-plugin-sort-keys-fix": "^1.1.1",
-    "eslint-plugin-typescript-sort-keys": "^1.5.0",
-    "jest": "^26.6.3",
-    "prettier": "^2.3.0",
-    "prettier-config-constellation": "0.0.5",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.63.0",
-    "rollup-plugin-dts": "^4.1.0",
-    "rollup-plugin-peer-deps-external": "^2.2.4",
-    "rollup-plugin-terser": "^7.0.2",
-    "stylelint": "^13.12.0",
-    "stylelint-config-constellation": "0.0.5",
-    "stylelint-config-prettier": "^8.0.2",
-    "stylelint-config-recommended": "^4.0.0",
-    "stylelint-config-styled-components": "^0.1.1",
-    "stylelint-prettier": "^1.2.0",
-    "stylelint-processor-styled-components": "^1.10.0",
-    "typescript": "^4.2.4"
+    "@mdx-js/react": "1.6.22",
+    "@rollup/plugin-commonjs": "21.0.1",
+    "@rollup/plugin-node-resolve": "13.1.2",
+    "@rollup/plugin-typescript": "8.3.0",
+    "@storybook/addon-actions": "6.4.13",
+    "@storybook/addon-docs": "6.4.13",
+    "@storybook/addon-essentials": "6.4.13",
+    "@storybook/addon-links": "6.4.13",
+    "@storybook/react": "6.4.13",
+    "@storybook/storybook-deployer": "2.8.10",
+    "@testing-library/jest-dom": "5.16.1",
+    "@testing-library/react": "12.1.2",
+    "@testing-library/user-event": "13.5.0",
+    "@types/jest": "27.4.0",
+    "@types/react": "17.0.16",
+    "@types/react-dom": "17.0.9",
+    "@types/styled-components": "5.1.12",
+    "@typescript-eslint/eslint-plugin": "4.17.0",
+    "@typescript-eslint/parser": "4.22.0",
+    "eslint": "7.21.0",
+    "eslint-config-airbnb": "18.2.1",
+    "eslint-config-constellation": "workspace:*",
+    "eslint-config-prettier": "8.1.0",
+    "eslint-import-resolver-typescript": "2.4.0",
+    "eslint-plugin-import": "2.22.1",
+    "eslint-plugin-jest": "24.3.1",
+    "eslint-plugin-jest-dom": "3.6.5",
+    "eslint-plugin-json": "2.1.2",
+    "eslint-plugin-jsx-a11y": "6.4.1",
+    "eslint-plugin-prettier": "3.3.1",
+    "eslint-plugin-react": "7.22.0",
+    "eslint-plugin-react-hooks": "4.2.0",
+    "eslint-plugin-simple-import-sort": "7.0.0",
+    "eslint-plugin-sort-destructure-keys": "1.3.5",
+    "eslint-plugin-sort-keys-fix": "1.1.1",
+    "eslint-plugin-typescript-sort-keys": "1.5.0",
+    "jest": "27.4.7",
+    "prettier": "2.3.0",
+    "prettier-config-constellation": "workspace:*",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "rimraf": "3.0.2",
+    "rollup": "2.63.0",
+    "rollup-plugin-dts": "4.1.0",
+    "rollup-plugin-peer-deps-external": "2.2.4",
+    "rollup-plugin-terser": "7.0.2",
+    "stylelint": "13.12.0",
+    "stylelint-config-constellation": "workspace:*",
+    "stylelint-config-prettier": "8.0.2",
+    "stylelint-config-recommended": "4.0.0",
+    "stylelint-config-styled-components": "0.1.1",
+    "stylelint-prettier": "1.2.0",
+    "stylelint-processor-styled-components": "1.10.0",
+    "ts-jest": "27.1.3",
+    "ts-node": "10.4.0",
+    "typescript": "4.2.4"
   },
   "peerDependencies": {
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react": "17.0.2",
+    "react-dom": "17.0.2"
   },
   "dependencies": {
+    "@radix-ui/react-avatar": "0.1.3",
+    "@radix-ui/react-checkbox": "0.1.3",
+    "@radix-ui/react-popover": "0.1.3",
+    "@radix-ui/react-progress": "0.1.3",
+    "@radix-ui/react-separator": "0.1.3",
+    "@radix-ui/react-slider": "0.1.3",
+    "@radix-ui/react-switch": "0.1.3",
+    "@radix-ui/react-toggle": "0.1.3",
+    "@radix-ui/react-toggle-group": "0.1.3",
+    "@radix-ui/react-tooltip": "0.1.3",
     "styled-components": "4.4.1"
   }
-}
+}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

658879

increased by21.39%

Number of low supply chain risk alerts

1

decreased by-90.91%

Worsened metrics

Dependency count

13

increased by333.33%

Dev dependency count

56

increased by7.69%

Number of package files

93

decreased by-74.66%

Lines of code

1652

decreased by-61.89%

Number of medium supply chain risk alerts

9

increased by12.5%

Dependency changes

• + Added@radix-ui/react-avatar@0.1.3

• + Added@radix-ui/react-checkbox@0.1.3

• + Added@radix-ui/react-popover@0.1.3

• + Added@radix-ui/react-progress@0.1.3

• + Added@radix-ui/react-separator@0.1.3

• + Added@radix-ui/react-slider@0.1.3

• + Added@radix-ui/react-switch@0.1.3

• + Added@radix-ui/react-toggle@0.1.3

• + Added@radix-ui/react-toggle-group@0.1.3

• + Added@radix-ui/react-tooltip@0.1.3

• + Added@babel/runtime@7.26.0(transitive)

• + Added@radix-ui/number@0.1.0(transitive)

• + Added@radix-ui/popper@0.1.0(transitive)

• + Added@radix-ui/primitive@0.1.0(transitive)

• + Added@radix-ui/react-arrow@0.1.2(transitive)

• + Added@radix-ui/react-avatar@0.1.3(transitive)

• + Added@radix-ui/react-checkbox@0.1.3(transitive)

• + Added@radix-ui/react-collection@0.1.20.1.3(transitive)

• + Added@radix-ui/react-compose-refs@0.1.0(transitive)

• + Added@radix-ui/react-context@0.1.1(transitive)

• + Added@radix-ui/react-dismissable-layer@0.1.2(transitive)

• + Added@radix-ui/react-focus-guards@0.1.0(transitive)

• + Added@radix-ui/react-focus-scope@0.1.2(transitive)

• + Added@radix-ui/react-id@0.1.3(transitive)

• + Added@radix-ui/react-label@0.1.3(transitive)

• + Added@radix-ui/react-popover@0.1.3(transitive)

• + Added@radix-ui/react-popper@0.1.2(transitive)

• + Added@radix-ui/react-portal@0.1.2(transitive)

• + Added@radix-ui/react-presence@0.1.1(transitive)

• + Added@radix-ui/react-primitive@0.1.20.1.3(transitive)

• + Added@radix-ui/react-progress@0.1.3(transitive)

• + Added@radix-ui/react-roving-focus@0.1.3(transitive)

• + Added@radix-ui/react-separator@0.1.3(transitive)

• + Added@radix-ui/react-slider@0.1.3(transitive)

• + Added@radix-ui/react-slot@0.1.2(transitive)

• + Added@radix-ui/react-switch@0.1.3(transitive)

• + Added@radix-ui/react-toggle@0.1.20.1.3(transitive)

• + Added@radix-ui/react-toggle-group@0.1.3(transitive)

• + Added@radix-ui/react-tooltip@0.1.3(transitive)

• + Added@radix-ui/react-use-body-pointer-events@0.1.0(transitive)

• + Added@radix-ui/react-use-callback-ref@0.1.0(transitive)

• + Added@radix-ui/react-use-controllable-state@0.1.0(transitive)

• + Added@radix-ui/react-use-direction@0.1.0(transitive)

• + Added@radix-ui/react-use-escape-keydown@0.1.0(transitive)

• + Added@radix-ui/react-use-layout-effect@0.1.0(transitive)

• + Added@radix-ui/react-use-previous@0.1.0(transitive)

• + Added@radix-ui/react-use-rect@0.1.1(transitive)

• + Added@radix-ui/react-use-size@0.1.0(transitive)

• + Added@radix-ui/react-visually-hidden@0.1.2(transitive)

• + Added@radix-ui/rect@0.1.1(transitive)

• + Addedaria-hidden@1.2.4(transitive)

• + Addedcsstype@3.1.3(transitive)

• + Addeddetect-node-es@1.1.0(transitive)

• + Addedget-nonce@1.0.1(transitive)

• + Addedinvariant@2.2.4(transitive)

• + Addedreact-remove-scroll@2.6.0(transitive)

• + Addedreact-remove-scroll-bar@2.3.6(transitive)

• + Addedreact-style-singleton@2.2.1(transitive)

• + Addedregenerator-runtime@0.14.1(transitive)

• + Addedtslib@2.8.1(transitive)

• + Addeduse-callback-ref@1.3.2(transitive)

• + Addeduse-sidecar@1.1.2(transitive)