mainstack-design-system 0.4.7 → 0.4.8

package/build/src/components/AccordionItem/index.d.ts

@@ -7,9 +7,9 @@ export interface IAccordionItem extends AccordionItemProps {
     subtitle?: React.ReactNode;
     isDraggable?: boolean;
     error?: boolean;
-    maxWidthTitle?: string;
+    maxWidthTitle?: any;
     actionButton?: React.ReactNode;
     titleTag?: React.ReactNode;
 }
-declare const AccordionItem: ({ children, title, subtitle, isDraggable, error, maxWidthTitle, actionButton, titleTag, ...props }: IAccordionItem) => import("react/jsx-runtime").JSX.Element;
+declare const AccordionItem: import("react").ForwardRefExoticComponent<IAccordionItem & import("react").RefAttributes<import("@chakra-ui/system/dist/system.types").ComponentWithAs<"div", AccordionItemProps>>>;
 export default AccordionItem;

package/build/src/components/Button/IconButton.d.ts

@@ -9,5 +9,5 @@ export interface IconButtonProps extends ButtonProps {
     variant: "primary" | "secondary" | "tertiary" | "outline" | "link";
     disabled?: boolean;
 }
-declare const IconButton: ({ children, size, bgColor, variant, disabled, textColor, onClick, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const IconButton: ({ children, size, bgColor, variant, disabled, textColor, onClick, isLoading, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default IconButton;

package/build/src/components/InputFields/UrlInput.d.ts

@@ -0,0 +1,12 @@
+/** @format */
+import { InputProps } from "@chakra-ui/react";
+interface TUrlInput extends InputProps {
+    label?: string;
+    urlLabel: string;
+    status?: "loading" | "error" | "success" | null;
+    statusMessage?: string;
+    success?: boolean;
+    variant?: "left" | "right";
+}
+declare const UrlInput: ({ fontFamily, urlLabel, status, statusMessage, label, variant, ...rest }: TUrlInput) => import("react/jsx-runtime").JSX.Element;
+export default UrlInput;

package/build/src/components/Tiles/index.d.ts

@@ -1,6 +1,6 @@
 /** @format */
-/// <reference types="react" />
 import { BoxProps } from "@chakra-ui/react";
+import { ReactNode } from "react";
 export interface TileProps extends BoxProps {
     isSelected?: boolean;
     title: string;
@@ -8,7 +8,8 @@ export interface TileProps extends BoxProps {
     icon?: JSX.Element;
     iconPosition?: "leading" | "trailing" | "top";
     hasRadioButton?: boolean;
+    bottomComponent?: ReactNode;
     onClick?: () => void;
 }
-declare const Tile: ({ icon, iconPosition, hasRadioButton, isSelected, title, subText, onClick, width, ...props }: TileProps) => import("react/jsx-runtime").JSX.Element;
+declare const Tile: ({ icon, iconPosition, hasRadioButton, isSelected, title, subText, onClick, width, bottomComponent, ...props }: TileProps) => import("react/jsx-runtime").JSX.Element;
 export default Tile;

package/build/src/components/index.d.ts

@@ -3,7 +3,7 @@ export { ChakraProvider as MainstackProvider } from "@chakra-ui/react";
 export { default as Button } from "./Button";
 export { default as IconButton } from "./Button/IconButton";
 export { default as AccordionItem } from "./AccordionItem";
-export { Accordion } from "@chakra-ui/react";
+export { Accordion, AccordionPanel } from "@chakra-ui/react";
 export { default as Avatars } from "./Avatars";
 export { default as Chip } from "./controls/Chip";
 export { default as DoubleTab } from "./controls/DoubleTab";
@@ -23,7 +23,6 @@ export { default as UsernameInput } from "./InputFields/UsernameInput";
 export { default as Banner } from "./notifications/Banner";
 export { default as ClickTooltip } from "./notifications/ClickTooltip";
 export { default as HoverTooltip } from "./notifications/HoverTooltip";
-export { default as Snackbar } from "./notifications/Snackbar";
 export { default as Colors } from "./styleGuide/Colors";
 export { default as Tiles } from "./Tiles";
 export { default as Display } from "./Typography/Display";
@@ -33,3 +32,4 @@ export { default as Subtitle } from "./Typography/Subtitle";
 export { default as FileUploader } from "./Uploader/FileUploader";
 export { default as ImageUploader } from "./Uploader/ImageUploader";
 export { default as Loader } from "./Animations/Loader";
+export { customSnackbar, CustomSnackbarContainer, SnackbarType, } from "./notifications/Snackbar";

package/build/src/components/notifications/ClickTooltip.d.ts

@@ -5,9 +5,19 @@ export interface ICustomTooltip {
     triggerComponent: JSX.Element;
     body: string | JSX.Element;
     label: string;
+    confirmButtonLabel?: string;
+    unConfirmButtonLabel?: string;
     hasSpecialArrow?: boolean;
     placement?: PlacementWithLogical;
     fontFamily?: string;
+    hasSteppers?: boolean;
+    steppersRange?: number;
+    activeStepperIndex?: number;
+    closeToolTipOnStepperShuttle?: boolean;
+    onStepperCancel?: () => void;
+    onStepperForward?: () => void;
+    onStepperBackward?: () => void;
+    getOnToggleTooltipVisibility?: (cb: Function) => void;
 }
-declare const ClickTooltip: ({ label, body, hasSpecialArrow, triggerComponent, placement, fontFamily, ...props }: ICustomTooltip) => import("react/jsx-runtime").JSX.Element;
+declare const ClickTooltip: ({ label, body, hasSpecialArrow, triggerComponent, placement, fontFamily, confirmButtonLabel, unConfirmButtonLabel, hasSteppers, steppersRange, activeStepperIndex, closeToolTipOnStepperShuttle, onStepperCancel, onStepperForward, onStepperBackward, getOnToggleTooltipVisibility, ...props }: ICustomTooltip) => import("react/jsx-runtime").JSX.Element;
 export default ClickTooltip;

package/build/src/components/notifications/Snackbar.d.ts

@@ -1,10 +1,12 @@
 /** @format */
 import { TypeOptions } from "react-toastify";
-export declare enum SnackbarType {
+declare enum SnackbarType {
     info = "info",
     success = "success",
     warning = "warning",
     error = "error",
     default = "default"
 }
-export default function customSnackbar(title: string, type: TypeOptions, subtext?: string, showUndoButton?: boolean, handleUndo?: () => void): void;
+declare const CustomSnackbarContainer: () => import("react/jsx-runtime").JSX.Element;
+declare function customSnackbar(title: string, type: TypeOptions, subtext?: string, showUndoButton?: boolean, handleUndo?: () => void): void;
+export { customSnackbar, CustomSnackbarContainer, SnackbarType };

package/build/src/components/notifications/TagsUpdate.d.ts

@@ -0,0 +1,8 @@
+/** @format */
+import { ReactNode } from "react";
+export interface ITagsUpdate {
+    status: "Successful" | "Pending" | "Failed";
+    icon?: ReactNode;
+}
+declare const TagsUpdate: ({ status, icon }: ITagsUpdate) => import("react/jsx-runtime").JSX.Element;
+export default TagsUpdate;

package/build/src/icons/KeyIcon.d.ts

@@ -0,0 +1,4 @@
+/** @format */
+import { IconProps } from "@chakra-ui/icons";
+declare const KeyIcon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default KeyIcon;

package/build/src/icons/KeyOffIcon.d.ts

@@ -0,0 +1,4 @@
+/** @format */
+import { IconProps } from "@chakra-ui/icons";
+declare const KeyOffIcon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default KeyOffIcon;

package/build/src/icons/index.d.ts

@@ -178,6 +178,8 @@ export { default as InsertChartIcon } from "./InsertChartIcon";
 export { default as InventoryIcon } from "./InventoryIcon";
 export { default as IosShareIcon } from "./IosShareIcon";
 export { default as KeyboardBackspaceIcon } from "./KeyboardBackspaceIcon";
+export { default as KeyIcon } from "./KeyIcon";
+export { default as KeyOffIcon } from "./KeyOffIcon";
 export { default as LabelIcon } from "./LabelIcon";
 export { default as LanguageIcon } from "./LanguageIcon";
 export { default as LibraryMusicIcon } from "./LibraryMusicIcon";

package/build/src/stories/InputFields/UrlInput.stories.d.ts

@@ -0,0 +1,14 @@
+/** @format */
+import UrlInput from "components/InputFields/UrlInput";
+import type { Meta, StoryObj } from "@storybook/react";
+declare const meta: Meta<typeof UrlInput>;
+export default meta;
+type Story = StoryObj<typeof UrlInput>;
+export declare const Default: Story;
+export declare const UrlInputError: Story;
+export declare const UrlInputLoading: Story;
+export declare const UrlInputSuccess: Story;
+export declare const UrlInputLeftVariantDefault: Story;
+export declare const UrlInputLeftVariantError: Story;
+export declare const UrlInputLeftVariantLoading: Story;
+export declare const UrlInputLeftVariantSuccess: Story;

package/build/src/stories/Tiles/Tile.stories.d.ts

@@ -10,3 +10,4 @@ export declare const TileWithTopIconAndSubtext: Story;
 export declare const TileWithTopIcon: Story;
 export declare const TileWithSubtext: Story;
 export declare const TileWithLeadingRadioIconAndSubtext: Story;
+export declare const TileWithBottomComponent: Story;

package/build/src/stories/icons/index.d.ts

@@ -179,6 +179,8 @@ declare const IconsObject: {
     InventoryIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;
     IosShareIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;
     KeyboardBackspaceIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;
+    KeyIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;
+    KeyOffIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;
     LanguageIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;
     LocalActivityIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;
     LibraryMusicIcon: (props: import("@chakra-ui/icon/dist/icon").IconProps) => import("react/jsx-runtime").JSX.Element;

package/build/src/stories/notifications/ClickTooltip.stories.d.ts

@@ -4,4 +4,11 @@ import type { Meta } from "@storybook/react";
 declare const meta: Meta<typeof ClickTooltipWrapper>;
 export default meta;
 type Story = typeof meta;
+/**
+ * Tooltip default usage
+ */
 export declare const Default: Story;
+/**
+ * Tooltip usage with steppers enabled
+ */
+export declare const WithSteppers: Story;

package/build/src/stories/notifications/ClickTooltipWrapper.d.ts

@@ -1,4 +1,4 @@
 /** @format */
 import { ICustomTooltip } from "components/notifications/ClickTooltip";
-declare const ClickTooltipWrapper: ({ label, body }: ICustomTooltip) => import("react/jsx-runtime").JSX.Element;
+declare const ClickTooltipWrapper: ({ label, body, triggerComponent, ...rest }: ICustomTooltip) => import("react/jsx-runtime").JSX.Element;
 export default ClickTooltipWrapper;

package/build/src/stories/notifications/Snackbar.stories.d.ts

@@ -1,7 +1,22 @@
 /** @format */
-import SnackbarWrapper from "./SnackbarWrapper";
+import { CustomSnackbarContainer } from "components/notifications/Snackbar";
 import type { Meta } from "@storybook/react";
-declare const meta: Meta<typeof SnackbarWrapper>;
+/**
+ * Please Note: That `<CustomSnackbarContainer />` only needs to be placed once at the root layout or route in your project E.g in your `App.tsx` file in react or root `layout.tsx` file when using Next14 App Router.
+ * You don't need to use `<CustomSnackbarContainer />` in each component file where you want to trigger a toast.
+ */
+declare const meta: Meta<typeof CustomSnackbarContainer>;
 export default meta;
 type Story = typeof meta;
 export declare const Default: Story;
+export declare const Success: Story;
+export declare const Warning: Story;
+export declare const Error: Story;
+export declare const WithUndoButton: Story;
+export declare const DefaultWithSubtext: Story;
+export declare const SuccessWithSubtext: Story;
+export declare const WarningWithSubtext: Story;
+export declare const ErrorWithSubtext: Story;
+export declare const SuccessWithSubtextAndUndoButton: Story;
+export declare const WarningWithSubtextAndUndoButton: Story;
+export declare const ErrorWithSubtextAndUndoButton: Story;

package/build/src/stories/notifications/SnackbarWrapper.d.ts

@@ -1,3 +1,2 @@
 /** @format */
-declare const SnackbarWrapper: () => import("react/jsx-runtime").JSX.Element;
-export default SnackbarWrapper;
+export declare const SnackbarWrapper: () => import("react/jsx-runtime").JSX.Element;

package/build/src/stories/notifications/TagsUpdate.stories.d.ts

@@ -0,0 +1,8 @@
+/** @format */
+import TagsUpdate from "components/notifications/TagsUpdate";
+import type { Meta } from "@storybook/react";
+declare const meta: Meta<typeof TagsUpdate>;
+export default meta;
+type Story = typeof meta;
+export declare const Default: Story;
+export declare const WithIcon: Story;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mainstack-design-system",
-  "version": "0.4.7",
+  "version": "0.4.8",
   "type": "module",
   "main": "build/mainstack-design-system.js",
   "types": "build/src/index.d.ts",
@@ -47,6 +47,7 @@
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.6",
     "@storybook/preview-api": "^7.6.3",
+    "@storybook/test": "^8.1.6",
     "eslint-config-prettier": "^8.6.0",
     "eslint-plugin-prettier": "^4.2.1",
     "framer-motion": "^10.0.1",