@spothero/ui 25.12.0 → 25.16.0-beta.2

package/dist/components/Accordion/AccordionActionButton.d.ts

@@ -1,3 +1,7 @@
-export default AccordionActionButton;
-declare const AccordionActionButton: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
 import React from 'react';
+export type AccordionActionButtonProps = {
+    onClick?: () => void;
+    children: React.ReactNode;
+};
+declare const AccordionActionButton: React.ForwardRefExoticComponent<AccordionActionButtonProps & React.RefAttributes<HTMLDivElement>>;
+export default AccordionActionButton;

package/dist/components/Button/Button.styles.d.ts

@@ -78,6 +78,26 @@ export declare const variants: {
             readonly bg: string;
         };
     };
+    readonly iconSecondary: {
+        readonly bg: "white";
+        readonly borderColor: "gray.medium";
+        readonly color: "black";
+        readonly minW: "unset";
+        readonly px: 3;
+        readonly py: 3;
+        readonly _hover: {
+            readonly _disabled: {
+                bg: string;
+                borderColor: string;
+                color: string;
+            };
+            readonly bg: string;
+            readonly color: "black";
+        };
+        readonly _active: {
+            readonly bg: string;
+        };
+    };
     readonly secondaryOnDark: {
         readonly bg: "none";
         readonly borderColor: "white";
@@ -120,6 +140,32 @@ export declare const variants: {
             };
         };
     };
+    readonly iconTertiary: {
+        readonly bg: "none";
+        readonly borderWidth: "none";
+        readonly borderRadius: "unset";
+        readonly color: "black";
+        readonly h: "unset";
+        readonly m: "unset";
+        readonly minW: "unset";
+        readonly px: 2;
+        readonly py: 2;
+        readonly lineHeight: 1;
+        readonly _disabled: {
+            readonly bg: "none";
+            readonly color: "gray.dark";
+        };
+        readonly _hover: {
+            readonly _disabled: {
+                readonly color: "gray.dark";
+            };
+        };
+        readonly _active: {
+            readonly _disabled: {
+                readonly color: "gray.dark";
+            };
+        };
+    };
     readonly tertiaryOnDark: {
         readonly bg: "none";
         readonly borderRadius: "unset";

package/dist/components/Menu/Menu.d.ts

@@ -0,0 +1,6 @@
+import { type MenuProps as ChakraMenuProps } from '@chakra-ui/react';
+import type { ForwardRefComponent } from '../../types/forwardRefComponent';
+export interface MenuProps extends ChakraMenuProps {
+}
+declare const Menu: ForwardRefComponent<HTMLDivElement, MenuProps>;
+export default Menu;

package/dist/components/Menu/Menu.styles.d.ts

@@ -1,258 +1,4 @@
-declare const _default: {
-    baseStyle?: {
-        button: {
-            transitionProperty: string;
-            transitionDuration: string;
-        };
-        list: {
-            [x: string]: string | number | {
-                [x: string]: string;
-            };
-            _dark: {
-                [x: string]: string;
-            };
-            color: string;
-            minW: string;
-            py: string;
-            zIndex: number;
-            borderRadius: string;
-            borderWidth: string;
-            bg: string;
-            boxShadow: string;
-        };
-        item: {
-            py: string;
-            px: string;
-            transitionProperty: string;
-            transitionDuration: string;
-            transitionTimingFunction: string;
-            _focus: {
-                [x: string]: string | {
-                    [x: string]: string;
-                };
-                _dark: {
-                    [x: string]: string;
-                };
-            };
-            _active: {
-                [x: string]: string | {
-                    [x: string]: string;
-                };
-                _dark: {
-                    [x: string]: string;
-                };
-            };
-            _expanded: {
-                [x: string]: string | {
-                    [x: string]: string;
-                };
-                _dark: {
-                    [x: string]: string;
-                };
-            };
-            _disabled: {
-                opacity: number;
-                cursor: string;
-            };
-            bg: string;
-        };
-        groupTitle: {
-            mx: number;
-            my: number;
-            fontWeight: string;
-            fontSize: string;
-        };
-        icon: {
-            display: string;
-            alignItems: string;
-            justifyContent: string;
-            flexShrink: number;
-        };
-        command: {
-            opacity: number;
-        };
-        divider: {
-            border: number;
-            borderBottom: string;
-            borderColor: string;
-            my: string;
-            opacity: number;
-        };
-    } | undefined;
-    sizes?: {
-        [key: string]: import("@chakra-ui/react").PartsStyleInterpolation<{
-            keys: ("button" | "icon" | "item" | "list" | "groupTitle" | "command" | "divider")[];
-        }>;
-    } | undefined;
-    variants?: {
-        [key: string]: import("@chakra-ui/react").PartsStyleInterpolation<{
-            keys: ("button" | "icon" | "item" | "list" | "groupTitle" | "command" | "divider")[];
-        }>;
-    } | undefined;
-    defaultProps?: {
-        size?: string | number | undefined;
-        variant?: string | number | undefined;
-        colorScheme?: string | undefined;
-    } | undefined;
-    parts: ("button" | "icon" | "item" | "list" | "groupTitle" | "command" | "divider")[];
-} & {
-    baseStyle: {
-        button: {
-            px: number;
-            py: number;
-            fontSize: string;
-            fontFamily: string;
-            lineHeight: number;
-            fontWeight: string;
-            borderWidth: string;
-            borderStyle: string;
-            borderRadius: string;
-            textTransform: string;
-            transition: string;
-            _hover: {
-                bg: string;
-                borderColor: string;
-            };
-            _disabled: {
-                cursor: string;
-                opacity: number;
-                bg: string;
-                borderColor: string;
-                color: string;
-            };
-            _focus: {
-                zIndex: number;
-                boxShadow: string;
-            };
-        };
-        list: {
-            bg: string;
-            boxShadow: string;
-            padding: number;
-            zIndex: string;
-            width: number;
-        };
-        item: {
-            paddingX: number;
-            paddingY: number;
-            _focus: {
-                zIndex: number;
-                boxShadow: string;
-            };
-        };
-        groupTitle: {
-            fontWeight: string;
-            color: string;
-            padding: number;
-        };
-        command: {
-            opacity: string;
-            fontFamily: string;
-            fontSize: string;
-            letterSpacing: string;
-            paddingL: number;
-        };
-        divider: {
-            marginY: number;
-            borderColor: string;
-        };
-    };
-    variants: {
-        basic: {
-            button: {
-                bg: string;
-                borderColor: string;
-                color: string;
-                _hover: {
-                    bg: string;
-                    borderColor: string;
-                    color: string;
-                    _disabled: {
-                        bg: string;
-                        borderColor: string;
-                        color: string;
-                    };
-                };
-            };
-            list: {
-                bg: string;
-                boxShadow: string;
-                zIndex: string;
-                borderColor: string;
-                borderWidth: string;
-                borderStyle: string;
-                borderRadius: string;
-                padding: number;
-                width: number;
-            };
-            groupTitle: {
-                fontWeight: string;
-                fontSize: string;
-                color: string;
-                padding: number;
-            };
-            item: {
-                fontWeight: string;
-                _hover: {
-                    color: string;
-                };
-            };
-        };
-        full: {
-            button: {
-                height: number;
-                fontSize: string;
-                fontWeight: string;
-                color: string;
-                borderColor: string;
-                backgroundColor: string;
-                borderRadius: string;
-                paddingX: number;
-                paddingY: string;
-                _hover: {
-                    color: string;
-                    backgroundColor: string;
-                    borderColor: string;
-                };
-                _active: {
-                    color: string;
-                    backgroundColor: string;
-                    borderColor: string;
-                    _hover: {
-                        color: string;
-                        backgroundColor: string;
-                        borderColor: string;
-                    };
-                };
-            };
-            list: {
-                height: string;
-                width: string;
-                padding: number;
-                backgroundColor: string;
-            };
-            groupTitle: {
-                fontSize: string;
-                weight: string;
-                color: string;
-            };
-            item: {
-                display: string;
-                paddingX: number;
-                paddingY: number;
-                marginBottom: number;
-                _last: {
-                    marginBottom: number;
-                };
-                _hover: {
-                    backgroundColor: string;
-                };
-                _focus: {
-                    boxShadow: string;
-                    backgroundColor: string;
-                };
-            };
-        };
-    };
-};
-export default _default;
+import { theme as chakraDefaultTheme } from '@chakra-ui/react';
+type MenuStyle = NonNullable<typeof chakraDefaultTheme.components.Menu>;
+declare const menuStyle: MenuStyle;
+export default menuStyle;

package/dist/components/Menu/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Menu';
+export { MenuButton, MenuList, MenuItem, MenuItemOption, MenuGroup, MenuOptionGroup, MenuDivider, } from '@chakra-ui/react';

package/dist/components/Modal/AlwaysMountedModal.d.ts

@@ -0,0 +1,7 @@
+import type { ForwardRefComponent } from '../../types/forwardRefComponent';
+import type { ModalProps } from './Modal';
+export interface AlwaysMountedModalProps extends ModalProps {
+    onCloseComplete?: () => void;
+}
+declare const AlwaysMountedModal: ForwardRefComponent<HTMLDivElement, AlwaysMountedModalProps>;
+export default AlwaysMountedModal;

package/dist/components/Modal/Modal.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { ModalOverlay, ModalContent, Modal as ChakraModal } from '@chakra-ui/react';
+import type { ForwardRefComponent } from '../../types/forwardRefComponent';
+import type { ModalSize, ModalStyleProps } from './types';
+type ChakraModalProps = Omit<React.ComponentProps<typeof ChakraModal>, 'children' | 'size'>;
+type ModalContentProps = React.ComponentProps<typeof ModalContent>;
+type ModalOverlayProps = React.ComponentProps<typeof ModalOverlay>;
+export interface ModalProps extends ChakraModalProps, ModalStyleProps {
+    children: React.ReactNode;
+    isOpen: boolean;
+    size?: ModalSize;
+    isMobile?: boolean;
+    contentStyling?: ModalContentProps;
+    overlayProps?: ModalOverlayProps;
+}
+declare const Modal: ForwardRefComponent<HTMLDivElement, ModalProps>;
+export default Modal;

package/dist/components/Modal/index.d.ts

@@ -0,0 +1,3 @@
+export { ModalBody, ModalFooter, ModalHeader } from '@chakra-ui/react';
+export { default as Modal } from './Modal';
+export { default as AlwaysMountedModal } from './AlwaysMountedModal';

package/dist/components/Modal/styles/body.d.ts

@@ -1,8 +1,5 @@
-declare function _default({ hasFooter, hasHeader, hideCloseButton }: {
-    hasFooter: any;
-    hasHeader: any;
-    hideCloseButton: any;
-}): {
+import type { ModalStyleProps } from '../types';
+declare const body: ({ hasFooter, hasHeader, hideCloseButton }: ModalStyleProps) => {
     background: string;
     backgroundRepeat: string;
     backgroundColor: string;
@@ -27,4 +24,4 @@ declare function _default({ hasFooter, hasHeader, hideCloseButton }: {
     overflow: string;
     display: string;
 };
-export default _default;
+export default body;

package/dist/components/Modal/styles/closeButton.d.ts

@@ -1,6 +1,5 @@
-declare function _default({ hasHeader }: {
-    hasHeader: any;
-}): {
+import type { ModalStyleProps } from '../types';
+declare const closeButton: ({ hasHeader }: ModalStyleProps) => {
     position: string;
     top: number;
     insetEnd: number;
@@ -15,4 +14,4 @@ declare function _default({ hasHeader }: {
         bg: string;
     };
 };
-export default _default;
+export default closeButton;

package/dist/components/Modal/styles/dialog.d.ts

@@ -1,6 +1,5 @@
-declare function _default({ hasFooter }: {
-    hasFooter: any;
-}): {
+import type { ModalStyleProps } from '../types';
+declare const dialog: ({ hasFooter }: ModalStyleProps) => {
     borderRadius: string;
     borderBottomRadius: {
         base: string;
@@ -13,4 +12,4 @@ declare function _default({ hasFooter }: {
     boxShadow: string;
     paddingBottom: number;
 };
-export default _default;
+export default dialog;

package/dist/components/Modal/styles/dialogContainer.d.ts

@@ -1,12 +1,12 @@
-declare namespace _default {
-    let display: string;
-    let zIndex: string;
-    let justifyContent: string;
-    namespace alignItems {
-        let base: string;
-        let tablet: string;
-    }
-    let height: string;
-    let minHeight: string;
-}
-export default _default;
+declare const dialogContainer: {
+    readonly display: "flex";
+    readonly zIndex: "layer8";
+    readonly justifyContent: "center";
+    readonly alignItems: {
+        readonly base: "flex-end";
+        readonly tablet: "center";
+    };
+    readonly height: "100%";
+    readonly minHeight: "fill-available";
+};
+export default dialogContainer;

package/dist/components/Modal/styles/footer.d.ts

@@ -1,12 +1,13 @@
-declare namespace _default {
-    let borderTop: string;
-    let borderColor: string;
-    let padding: number;
-    let gap: number;
-    let justifyContent: string;
-    namespace flexDirection {
-        let base: string;
-        let desktop: string;
-    }
-}
-export default _default;
+declare const footer: {
+    readonly borderTop: "1px";
+    readonly borderColor: "gray.100";
+    readonly padding: 4;
+    readonly gap: 4;
+    readonly justifyContent: "flex-start";
+    readonly alignItems: "normal";
+    readonly flexDirection: {
+        readonly base: "column";
+        readonly desktop: "row-reverse";
+    };
+};
+export default footer;

package/dist/components/Modal/styles/header.d.ts

@@ -1,10 +1,8 @@
-declare function _default({ hideCloseButton, hasHeader }: {
-    hideCloseButton: any;
-    hasHeader: any;
-}): {
+import type { ModalStyleProps } from '../types';
+declare const header: ({ hideCloseButton, hasHeader }: ModalStyleProps) => {
     padding: number;
     fontSize: string;
     fontWeight: string;
-    minHeight: number | null;
+    minHeight: number | undefined;
 };
-export default _default;
+export default header;