@citygross/components 0.7.78 → 0.7.80

package/build/@types/components/Button/Button.d.ts

@@ -18,5 +18,6 @@ export declare type TBaseButton = styles.TButton & {
     xsSize?: keyof typeof ButtonSize;
     children: React.ReactNode;
     color?: TButtonColor;
+    buttonBadge?: string;
 };
-export declare function Button({ center, color, fullWidth, flexReverse, icon, selected, isDisabled, loading, noWrap, onClick, size, xsSize, children }: TBaseButton): JSX.Element;
+export declare function Button({ center, color, fullWidth, flexReverse, icon, selected, isDisabled, loading, noWrap, onClick, size, xsSize, borderRadius, childGap, buttonBadge, children }: TBaseButton): JSX.Element;

package/build/@types/components/Button/Button.stories.d.ts

@@ -47,3 +47,4 @@ export declare const WithIconButton: Story<TBaseButton>;
 export declare const paginationButton: Story<TPaginationButton>;
 export declare const iconButton: Story<TIconButton>;
 export declare const SelectButton: Story<TBaseButton>;
+export declare const ButtonWithBadge: Story<TBaseButton>;

package/build/@types/components/Button/Button.styles.d.ts

@@ -9,9 +9,16 @@ export declare type TButton = {
     isDisabled?: boolean;
     loading?: boolean | null;
     noWrap?: boolean;
+    borderRadius?: number;
+    childGap?: number;
     onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 };
 declare type TButtonSize = keyof typeof ButtonSize;
+declare type TBasePrimaryButton = TButton & {
+    color: string;
+    size: TButtonSize;
+    xsSize?: TButtonSize;
+};
 export declare type TBaseSmallButton = Omit<TButton, 'size' | 'flexReverse' | 'fullWidth' | 'center'> & {
     width?: number;
     height?: number;
@@ -23,12 +30,14 @@ export declare type TButtonLoadingSpinner = {
     size?: TButtonSize;
     xsSize?: TButtonSize;
 };
+export declare type TButtonChildContainer = Pick<TBasePrimaryButton, 'childGap' | 'flexReverse' | 'noWrap' | 'size'>;
 export declare const BaseButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, TButton, never>;
 export declare const BasePrimaryButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, TButton & {
     color: string;
     size: TButtonSize;
     xsSize?: "small" | "medium" | "large" | undefined;
 }, never>;
+export declare const ButtonChildContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TButtonChildContainer, never>;
 export declare const Loading: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const LoadingContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TButtonLoadingSpinner, never>;
 export declare const LoadingSpinner: import("styled-components").StyledComponent<({ spinnerColor, borderColor, animationSpeedMs, size, ...props }: import("../../components/Spinner/Spinner").TSpinner) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
@@ -46,4 +55,5 @@ export declare const BasePaginationButton: import("styled-components").StyledCom
     border?: string | undefined;
     shadow?: boolean | undefined;
 }, never>;
+export declare const ButtonBadge: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export {};

package/build/@types/components/IconText/IconText.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare type TIconText = {
+    icon?: React.ReactNode;
+    children?: React.ReactNode;
+    showOnlyIcon?: boolean;
+    spacing?: number;
+};
+declare const IconText: ({ icon, spacing, children, showOnlyIcon }: TIconText) => JSX.Element;
+export default IconText;

package/build/@types/components/IconText/IconText.stories.d.ts

@@ -0,0 +1,9 @@
+import { Story } from '@storybook/react';
+import { TIconText } from './IconText';
+declare const _default: {
+    component: ({ icon, spacing, children, showOnlyIcon }: TIconText) => JSX.Element;
+    title: string;
+    argTypes: {};
+};
+export default _default;
+export declare const Default: Story<TIconText>;

package/build/@types/components/IconText/IconText.styles.d.ts

@@ -0,0 +1,5 @@
+declare type TIconTextContainer = {
+    spacing?: number;
+};
+export declare const IconTextContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TIconTextContainer, never>;
+export {};

package/build/@types/components/Nav/Nav.d.ts

@@ -0,0 +1,20 @@
+import React, { ChangeEventHandler } from 'react';
+import { TNavMainLink } from '../NavMainLink/NavMainLink';
+export declare type TNav = {
+    logo: React.ReactNode;
+    maxWidth?: number;
+    height?: number;
+    topPosition?: number;
+    mainLinks?: TNavMainLink[];
+    mainLinksBorderColor?: string;
+    rightContent?: React.ReactNode;
+    searchResultElement?: React.ReactNode;
+    searchPlaceHolder?: string;
+    searchCancelLabel?: React.ReactNode;
+    searchIcon?: React.ReactNode;
+    searchOnChange?: ChangeEventHandler<HTMLInputElement>;
+    searchValue?: string;
+    onSearchClick?: () => void;
+};
+declare const Nav: ({ logo, maxWidth, height, topPosition, mainLinks, mainLinksBorderColor, rightContent, searchResultElement, searchCancelLabel, searchIcon, searchPlaceHolder, searchOnChange, searchValue, onSearchClick }: TNav) => JSX.Element;
+export default Nav;

package/build/@types/components/Nav/Nav.stories.d.ts

@@ -0,0 +1,14 @@
+import { Story } from '@storybook/react';
+import { TNav } from './Nav';
+declare const _default: {
+    component: ({ logo, maxWidth, height, topPosition, mainLinks, mainLinksBorderColor, rightContent, searchResultElement, searchCancelLabel, searchIcon, searchPlaceHolder, searchOnChange, searchValue, onSearchClick }: TNav) => JSX.Element;
+    title: string;
+    argTypes: {
+        onScroll: {
+            control: boolean;
+        };
+    };
+};
+export default _default;
+export declare const Default: Story<TNav>;
+export declare const mobileNav: Story<TNav>;

package/build/@types/components/Nav/Nav.styles.d.ts

@@ -0,0 +1,19 @@
+declare type TNav = {
+    background?: string;
+    topPosition?: number;
+    height?: number;
+};
+declare type TNavContainer = {
+    maxWidth?: number;
+};
+declare type TNavSearchOverlay = {
+    show?: boolean;
+};
+export declare const Nav: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TNav, never>;
+export declare const NavContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TNavContainer, never>;
+export declare const NavChildContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const NavMainLinks: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const NavDummySearchContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const NavSearchContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const SearchResultOverlay: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TNavSearchOverlay, never>;
+export {};

package/build/@types/components/NavMainLink/NavMainLink.d.ts

@@ -0,0 +1,9 @@
+export declare type TNavMainLink = {
+    text: string;
+    href?: string;
+    active?: boolean;
+    target?: '_blank' | '_self';
+    borderColor?: string;
+};
+declare const NavMainLink: ({ text, href, target, active, borderColor }: TNavMainLink) => JSX.Element;
+export default NavMainLink;

package/build/@types/components/NavMainLink/NavMainLink.stories.d.ts

@@ -0,0 +1,8 @@
+import { Story } from '@storybook/react';
+import { TNavMainLink } from './NavMainLink';
+declare const _default: {
+    component: ({ text, href, target, active, borderColor }: TNavMainLink) => JSX.Element;
+    title: string;
+};
+export default _default;
+export declare const Default: Story<TNavMainLink>;

package/build/@types/components/NavMainLink/NavMainLink.styled.d.ts

@@ -0,0 +1,6 @@
+declare type TMainLinkContainer = {
+    borderColor?: string;
+    active?: boolean;
+};
+export declare const MainLinkContainer: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, TMainLinkContainer, never>;
+export {};

package/build/@types/components/Pagination/Pagination.d.ts

@@ -3,5 +3,6 @@ export declare type TPagination = {
     fetchItems: (page: number) => void;
     currentPage: number;
     itemsPerPage?: number;
+    setPage?: (page: number) => void;
 };
-export declare function Pagination({ totalItems, currentPage, fetchItems, itemsPerPage }: TPagination): JSX.Element;
+export declare function Pagination({ totalItems, currentPage, fetchItems, itemsPerPage, setPage }: TPagination): JSX.Element;

package/build/@types/components/SearchBar/SearchBar.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import * as styles from './SearchBar.styles';
+export declare type TSearchBar = styles.SearchInputProps & {
+    cancelLabel?: React.ReactNode;
+    icon?: React.ReactNode;
+    resultBoxTopPosition?: string;
+    inputRef?: React.RefObject<HTMLInputElement>;
+    onCancelClick?: () => void;
+    isOpen?: boolean;
+    children?: React.ReactNode;
+};
+declare const SearchBar: ({ flexGrow, isValid, inputSize, activeBorderColor, cancelLabel, icon, value, resultBoxTopPosition, children, inputRef, isOpen, onCancelClick, ...props }: TSearchBar) => JSX.Element;
+export default SearchBar;

package/build/@types/components/SearchBar/SearchBar.stories.d.ts

@@ -0,0 +1,23 @@
+import { Story } from '@storybook/react';
+declare const _default: {
+    component: ({ flexGrow, isValid, inputSize, activeBorderColor, cancelLabel, icon, value, resultBoxTopPosition, children, inputRef, isOpen, onCancelClick, ...props }: import("./SearchBar").TSearchBar) => JSX.Element;
+    title: string;
+    args: {
+        placeholder: string;
+    };
+    argTypes: {
+        disabled: {
+            control: {
+                type: string;
+            };
+        };
+        placeholder: {
+            control: {
+                type: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Default: Story;
+export declare const WithRightIcon: Story;

package/build/@types/components/SearchBar/SearchBar.styles.d.ts

@@ -0,0 +1,19 @@
+import { InputHTMLAttributes } from 'react';
+export interface SearchInputProps extends InputHTMLAttributes<HTMLInputElement> {
+    readonly isValid?: boolean;
+    flexGrow?: number;
+    inputSize?: 'small' | 'medium';
+    isOpen?: boolean;
+    activeBorderColor?: string;
+}
+declare type SearchResultContainerProps = {
+    background?: string;
+    topPosition?: string;
+    isOpen?: boolean;
+};
+export declare const SearchResultContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, SearchResultContainerProps, never>;
+export declare const SearchRightLabel: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Pick<SearchResultContainerProps, "isOpen">, never>;
+export declare const SearchBarContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, SearchInputProps, never>;
+export declare const SearchInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, SearchInputProps, never>;
+export declare const SearchLeftIcon: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export {};

package/build/@types/index.d.ts

@@ -59,3 +59,10 @@ export * from './containers/TwoColumnsContainer/TwoColumnsPageContainer';
 export * from './components/UnorderedList';
 export * from './components/WarningLabel/WarningLabel';
 export * from './components/MobileTable';
+export * from './components/Nav/Nav';
+export * from './components/NavMainLink/NavMainLink';
+export * from './components/SearchBar/SearchBar';
+export * from './components/SideModal/SideModal';
+export * from './components/IconText/IconText';
+export * from './components/Logo/Logo';
+export * from './components/Dropdown/Dropdown';

package/build/cjs/components/src/components/AddressBlock/AddressBlock.js

@@ -73,6 +73,13 @@ require('../../containers/TwoColumnsContainer/TwoColumnsPageContainer.styles.js'
 require('../UnorderedList/UnorderedList.styles.js');
 require('../WarningLabel/WarningLabel.styles.js');
 require('../MobileTable/MobileTable.styles.js');
+require('../NavMainLink/NavMainLink.styled.js');
+require('../SearchBar/SearchBar.styles.js');
+require('../Nav/Nav.styles.js');
+require('framer-motion');
+require('../SideModal/SideModal.styles.js');
+require('../IconText/IconText.styles.js');
+require('../Dropdown/Dropdown.styles.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/build/cjs/components/src/components/AddressBlock/AddressBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/Button/Button.js

@@ -26,19 +26,20 @@ exports.ButtonColor = void 0;
 })(exports.ButtonColor || (exports.ButtonColor = {}));
 function Button(_a) {
     var _b;
-    var _c = _a.center, center = _c === void 0 ? true : _c, _d = _a.color, color = _d === void 0 ? 'primary' : _d, fullWidth = _a.fullWidth, flexReverse = _a.flexReverse, icon = _a.icon, selected = _a.selected, isDisabled = _a.isDisabled, loading = _a.loading, noWrap = _a.noWrap, onClick = _a.onClick, _e = _a.size, size = _e === void 0 ? 'large' : _e, xsSize = _a.xsSize, children = _a.children;
+    var _c = _a.center, center = _c === void 0 ? true : _c, _d = _a.color, color = _d === void 0 ? 'primary' : _d, fullWidth = _a.fullWidth, flexReverse = _a.flexReverse, icon = _a.icon, selected = _a.selected, isDisabled = _a.isDisabled, loading = _a.loading, noWrap = _a.noWrap, onClick = _a.onClick, _e = _a.size, size = _e === void 0 ? 'large' : _e, xsSize = _a.xsSize, borderRadius = _a.borderRadius, _f = _a.childGap, childGap = _f === void 0 ? 4 : _f, buttonBadge = _a.buttonBadge, children = _a.children;
     return (React__default["default"].createElement(Button_styles.BasePrimaryButton, { center: center, color: designTokens.theme && designTokens.theme.palette
             ? selected
                 ? (_b = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.white
                 : designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette[color]
-            : 'white', fullWidth: fullWidth, flexReverse: flexReverse, icon: icon, selected: selected, isDisabled: loading || isDisabled, loading: loading || null, noWrap: noWrap, size: size, xsSize: xsSize, onClick: function (e) { return onClick && onClick(e); } },
+            : 'white', fullWidth: fullWidth, flexReverse: flexReverse, icon: icon, selected: selected, isDisabled: loading || isDisabled, loading: loading || null, noWrap: noWrap, size: size, xsSize: xsSize, onClick: function (e) { return onClick && onClick(e); }, borderRadius: borderRadius, childGap: childGap },
         loading && (React__default["default"].createElement(Button_styles.Loading, null,
             React__default["default"].createElement(Button_styles.LoadingContainer, { xsSize: xsSize, size: size },
                 React__default["default"].createElement(Button_styles.LoadingSpinner, null)))),
-        icon ? (React__default["default"].createElement("div", null,
+        icon ? (React__default["default"].createElement(Button_styles.ButtonChildContainer, { size: size, flexReverse: flexReverse, noWrap: noWrap, childGap: childGap },
             icon,
             children)) : (children),
-        React__default["default"].createElement("span", { className: "ripple" })));
+        React__default["default"].createElement("span", { className: "ripple" }),
+        buttonBadge && React__default["default"].createElement(Button_styles.ButtonBadge, null, buttonBadge)));
 }
 
 exports.Button = Button;

package/build/cjs/components/src/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/Button/Button.styles.js

@@ -62,15 +62,15 @@ var SpinnerSize = function (size) {
             return '26px';
     }
 };
-var BaseButton = styled__default["default"].button(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  /* reset */\n  outline: none;\n  border: none;\n\n  backface-visibility: hidden;\n  cursor: pointer;\n  border-radius: ", "px;\n  /* overflow: hidden; */\n  pointer-events: ", ";\n  -webkit-font-smoothing: antialiased;\n  user-select: ", ";\n\n  position: relative;\n\n  /* typography */\n\n  font-family: ", ";\n  font-weight: ", ";\n  text-align: ", ";\n  white-space: ", ";\n\n  /* colors */\n\n  background: ", ";\n  color: ", ";\n\n  /* Width & Height */\n\n  width: ", ";\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  &::before {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  /* Hover Effect */\n\n  &:hover {\n    ::after {\n      opacity: 1;\n    }\n  }\n  &:active {\n    ::before {\n      opacity: 1;\n    }\n    ::after {\n      opacity: 0;\n    }\n  }\n  /* Media Queries */\n\n  @media (max-width: ", "px) {\n    align-self: ", ";\n  }\n"], ["\n  /* reset */\n  outline: none;\n  border: none;\n\n  backface-visibility: hidden;\n  cursor: pointer;\n  border-radius: ", "px;\n  /* overflow: hidden; */\n  pointer-events: ", ";\n  -webkit-font-smoothing: antialiased;\n  user-select: ", ";\n\n  position: relative;\n\n  /* typography */\n\n  font-family: ", ";\n  font-weight: ", ";\n  text-align: ", ";\n  white-space: ", ";\n\n  /* colors */\n\n  background: ", ";\n  color: ", ";\n\n  /* Width & Height */\n\n  width: ", ";\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  &::before {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  /* Hover Effect */\n\n  &:hover {\n    ::after {\n      opacity: 1;\n    }\n  }\n  &:active {\n    ::before {\n      opacity: 1;\n    }\n    ::after {\n      opacity: 0;\n    }\n  }\n  /* Media Queries */\n\n  @media (max-width: ", "px) {\n    align-self: ", ";\n  }\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.isDisabled && 'none'; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.type.primary; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.weight.medium; }, function (props) { return (props.center ? 'center' : 'initial'); }, function (props) { return (props.noWrap ? 'nowrap' : 'normal'); }, function (props) { var _a, _b; return props.isDisabled ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium : props.color; }, function (props) {
+var BaseButton = styled__default["default"].button(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  /* reset */\n  outline: none;\n  border: none;\n\n  backface-visibility: hidden;\n  cursor: pointer;\n  border-radius: ", "px;\n  /* overflow: hidden; */\n  pointer-events: ", ";\n  -webkit-font-smoothing: antialiased;\n  user-select: ", ";\n\n  position: relative;\n\n  /* typography */\n\n  font-family: ", ";\n  font-weight: ", ";\n  text-align: ", ";\n  white-space: ", ";\n\n  /* colors */\n\n  background: ", ";\n  color: ", ";\n\n  /* Width & Height */\n\n  width: ", ";\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  &::before {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  /* Hover Effect */\n\n  &:hover {\n    ::after {\n      opacity: 1;\n    }\n  }\n  &:active {\n    ::before {\n      opacity: 1;\n    }\n    ::after {\n      opacity: 0;\n    }\n  }\n  /* Media Queries */\n\n  @media (max-width: ", "px) {\n    align-self: ", ";\n  }\n"], ["\n  /* reset */\n  outline: none;\n  border: none;\n\n  backface-visibility: hidden;\n  cursor: pointer;\n  border-radius: ", "px;\n  /* overflow: hidden; */\n  pointer-events: ", ";\n  -webkit-font-smoothing: antialiased;\n  user-select: ", ";\n\n  position: relative;\n\n  /* typography */\n\n  font-family: ", ";\n  font-weight: ", ";\n  text-align: ", ";\n  white-space: ", ";\n\n  /* colors */\n\n  background: ", ";\n  color: ", ";\n\n  /* Width & Height */\n\n  width: ", ";\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  &::before {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border-radius: ", "px;\n    top: 0;\n    left: 0;\n    box-shadow: ", ";\n    opacity: 0;\n    -webkit-transition: ", ";\n    transition: ", ";\n  }\n\n  /* Hover Effect */\n\n  &:hover {\n    ::after {\n      opacity: 1;\n    }\n  }\n  &:active {\n    ::before {\n      opacity: 1;\n    }\n    ::after {\n      opacity: 0;\n    }\n  }\n  /* Media Queries */\n\n  @media (max-width: ", "px) {\n    align-self: ", ";\n  }\n"])), function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.isDisabled && 'none'; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.type.primary; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.weight.medium; }, function (props) { return (props.center ? 'center' : 'initial'); }, function (props) { return (props.noWrap ? 'nowrap' : 'normal'); }, function (props) { var _a, _b; return props.isDisabled ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium : props.color; }, function (props) {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     return props.color === ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.secondary) ||
         props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.darkest) ||
         props.isDisabled
         ? (_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.white
         : (_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.darkest;
-}, function (props) { return (props.fullWidth ? '100%' : 'auto'); }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonActive; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { return (props.center ? 'center' : 'initial'); });
-var BasePrimaryButton = styled__default["default"](BaseButton)(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  /* TypoGraphy */\n\n  font-size: ", ";\n  line-height: ", ";\n\n  /* shadow */\n\n  box-shadow: ", ";\n\n  /* Padding */\n\n  padding: ", ";\n\n  @media (min-width: ", "px) {\n    font-size: ", ";\n\n    padding: ", ";\n\n    box-shadow: ", ";\n  }\n\n  /* children */\n\n  > div {\n    display: flex;\n    flex-direction: ", ";\n    width: 100%;\n    gap: ", ";\n    align-items: center;\n    justify-content: center;\n    flex-wrap: ", ";\n  }\n"], ["\n  /* TypoGraphy */\n\n  font-size: ", ";\n  line-height: ", ";\n\n  /* shadow */\n\n  box-shadow: ", ";\n\n  /* Padding */\n\n  padding: ", ";\n\n  @media (min-width: ", "px) {\n    font-size: ", ";\n\n    padding: ", ";\n\n    box-shadow: ", ";\n  }\n\n  /* children */\n\n  > div {\n    display: flex;\n    flex-direction: ", ";\n    width: 100%;\n    gap: ", ";\n    align-items: center;\n    justify-content: center;\n    flex-wrap: ", ";\n  }\n"])), function (props) { return ButtonFontSize(props.xsSize || props.size); }, function (props) {
+}, function (props) { return (props.fullWidth ? '100%' : 'auto'); }, function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonActive; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { return (props.center ? 'center' : 'initial'); });
+var BasePrimaryButton = styled__default["default"](BaseButton)(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  /* TypoGraphy */\n\n  font-size: ", ";\n  line-height: ", ";\n\n  /* shadow */\n\n  box-shadow: ", ";\n\n  /* Padding */\n\n  padding: ", ";\n\n  @media (min-width: ", "px) {\n    font-size: ", ";\n\n    padding: ", ";\n\n    box-shadow: ", ";\n  }\n"], ["\n  /* TypoGraphy */\n\n  font-size: ", ";\n  line-height: ", ";\n\n  /* shadow */\n\n  box-shadow: ", ";\n\n  /* Padding */\n\n  padding: ", ";\n\n  @media (min-width: ", "px) {\n    font-size: ", ";\n\n    padding: ", ";\n\n    box-shadow: ", ";\n  }\n"])), function (props) { return ButtonFontSize(props.xsSize || props.size); }, function (props) {
     var _a, _b;
     return props.size === 'small'
         ? ((_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2) + "px"
@@ -104,11 +104,19 @@ var BasePrimaryButton = styled__default["default"](BaseButton)(templateObject_2
                 props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.lightest)
                 ? "inset 0px 0px 0px 1px " + ((_l = props.theme.palette) === null || _l === void 0 ? void 0 : _l.medium)
                 : 'none';
-}, function (props) { return (props.flexReverse ? 'row-reverse' : 'row'); }, function (props) { return (props.size === 'small' ? '8px' : '12px'); }, function (props) { return (props.noWrap ? 'nowrap' : 'wrap'); });
-var Loading = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  position: absolute;\n  z-index: 3;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"], ["\n  position: absolute;\n  z-index: 3;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"])));
-var LoadingContainer = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n  width: ", ";\n  height: ", ";\n\n  @media (min-width: ", "px) {\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  width: ", ";\n  height: ", ";\n\n  @media (min-width: ", "px) {\n    width: ", ";\n    height: ", ";\n  }\n"])), function (props) { return SpinnerSize(props.xsSize || props.size); }, function (props) { return SpinnerSize(props.xsSize || props.size); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { return SpinnerSize(props.size); }, function (props) { return SpinnerSize(props.size); });
-var LoadingSpinner = styled__default["default"](Spinner.Spinner)(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n"], ["\n  width: 100%;\n  height: 100%;\n"])));
-var BaseIconButton = styled__default["default"](BaseButton)(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n  padding: ", "px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0;\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  ", ";\n\n  &::after {\n    border-radius: 50%;\n    box-shadow: ", ";\n  }\n  &::before {\n    border-radius: 50%;\n  }\n"], ["\n  padding: ", "px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0;\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  ", ";\n\n  &::after {\n    border-radius: 50%;\n    box-shadow: ", ";\n  }\n  &::before {\n    border-radius: 50%;\n  }\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { return props.height || 32; }, function (props) { return props.width || 32; }, function (props) { return props.width || 32; }, function (props) {
+});
+var ButtonChildContainer = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  display: flex;\n  flex-direction: ", ";\n  width: 100%;\n  gap: ", "px;\n  align-items: center;\n  justify-content: center;\n  flex-wrap: ", ";\n"], ["\n  display: flex;\n  flex-direction: ", ";\n  width: 100%;\n  gap: ", "px;\n  align-items: center;\n  justify-content: center;\n  flex-wrap: ", ";\n"])), function (props) { return (props.flexReverse ? 'row-reverse' : 'row'); }, function (props) {
+    var _a, _b;
+    return props.childGap
+        ? props.childGap
+        : props.size === 'small'
+            ? (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonChildSmallGap
+            : (_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.buttonChildGap;
+}, function (props) { return (props.noWrap ? 'nowrap' : 'wrap'); });
+var Loading = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n  position: absolute;\n  z-index: 3;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"], ["\n  position: absolute;\n  z-index: 3;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"])));
+var LoadingContainer = styled__default["default"].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n  width: ", ";\n  height: ", ";\n\n  @media (min-width: ", "px) {\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  width: ", ";\n  height: ", ";\n\n  @media (min-width: ", "px) {\n    width: ", ";\n    height: ", ";\n  }\n"])), function (props) { return SpinnerSize(props.xsSize || props.size); }, function (props) { return SpinnerSize(props.xsSize || props.size); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { return SpinnerSize(props.size); }, function (props) { return SpinnerSize(props.size); });
+var LoadingSpinner = styled__default["default"](Spinner.Spinner)(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n"], ["\n  width: 100%;\n  height: 100%;\n"])));
+var BaseIconButton = styled__default["default"](BaseButton)(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n  padding: ", "px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0;\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  ", ";\n\n  &::after {\n    border-radius: 50%;\n    box-shadow: ", ";\n  }\n  &::before {\n    border-radius: 50%;\n  }\n"], ["\n  padding: ", "px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0;\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  ", ";\n\n  &::after {\n    border-radius: 50%;\n    box-shadow: ", ";\n  }\n  &::before {\n    border-radius: 50%;\n  }\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { return props.height || 32; }, function (props) { return props.width || 32; }, function (props) { return props.width || 32; }, function (props) {
     var _a;
     return props.shadow && props.border
         ? "box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.15), inset 0px 0px 0px 1px " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium)
@@ -118,18 +126,21 @@ var BaseIconButton = styled__default["default"](BaseButton)(templateObject_6 ||
                 ? "box-shadow: inset 0px 0px 0px 1px " + props.border
                 : '';
 }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow) === null || _b === void 0 ? void 0 : _b.iconButtonHover; });
-var BasePaginationButton = styled__default["default"](BaseButton)(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  text-align: center;\n  ", ";\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n"], ["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  text-align: center;\n  ", ";\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n"])), function (props) { return props.height || 36; }, function (props) { return props.width || 36; }, function (props) { return props.width || 36; }, function (props) {
+var BasePaginationButton = styled__default["default"](BaseButton)(templateObject_8 || (templateObject_8 = _tslib.__makeTemplateObject(["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  text-align: center;\n  ", ";\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n"], ["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  text-align: center;\n  ", ";\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n"])), function (props) { return props.height || 36; }, function (props) { return props.width || 36; }, function (props) { return props.width || 36; }, function (props) {
     var _a, _b, _c;
     return props.color !== ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white)
         ? 'box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.15)'
         : "box-shadow: inset 0px 0px 0px 1px " + ((_c = props.theme.palette) === null || _c === void 0 ? void 0 : _c.medium);
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
+var ButtonBadge = styled__default["default"].div(templateObject_9 || (templateObject_9 = _tslib.__makeTemplateObject(["\n  position: absolute;\n  top: ", "px;\n  right: ", "px;\n  padding: 0 7px;\n  background: black;\n  color: white;\n  width: fit-content;\n  border-radius: 100px;\n  font-size: ", "px;\n  line-height: ", "px;\n"], ["\n  position: absolute;\n  top: ", "px;\n  right: ", "px;\n  padding: 0 7px;\n  background: black;\n  color: white;\n  width: fit-content;\n  border-radius: 100px;\n  font-size: ", "px;\n  line-height: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeTopPosition; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeRightPosition; }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight) === null || _b === void 0 ? void 0 : _b.xs; });
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
 
 exports.BaseButton = BaseButton;
 exports.BaseIconButton = BaseIconButton;
 exports.BasePaginationButton = BasePaginationButton;
 exports.BasePrimaryButton = BasePrimaryButton;
+exports.ButtonBadge = ButtonBadge;
+exports.ButtonChildContainer = ButtonChildContainer;
 exports.Loading = Loading;
 exports.LoadingContainer = LoadingContainer;
 exports.LoadingSpinner = LoadingSpinner;

package/build/cjs/components/src/components/Button/Button.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/Dropdown/Dropdown.js

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var framerMotion = require('framer-motion');
+var React = require('react');
+var Dropdown_styles = require('./Dropdown.styles.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var Dropdown = function (_a) {
+    var isOpen = _a.isOpen, onClick = _a.onClick, dropdownHeader = _a.dropdownHeader, children = _a.children;
+    return (React__default["default"].createElement(Dropdown_styles.DropdownContainer, null,
+        React__default["default"].createElement(Dropdown_styles.DropdownHeader, { onClick: onClick }, dropdownHeader),
+        React__default["default"].createElement(framerMotion.AnimatePresence, { initial: false }, isOpen && (React__default["default"].createElement(Dropdown_styles.DropdownChildContainer, { isOpen: isOpen, initial: "collapsed", animate: "open", exit: "collapsed", variants: {
+                open: { height: 'auto' },
+                collapsed: { height: 0 }
+            }, transition: { duration: 0.3, ease: [0.04, 0.62, 0.23, 0.98] } }, children)))));
+};
+
+exports.Dropdown = Dropdown;
+//# sourceMappingURL=Dropdown.js.map

package/build/cjs/components/src/components/Dropdown/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/Dropdown/Dropdown.styles.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var styled = require('styled-components');
+var framerMotion = require('framer-motion');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var DropdownContainer = styled__default["default"](framerMotion.motion.div)(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject([""], [""])));
+var DropdownHeader = styled__default["default"](framerMotion.motion.div)(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  cursor: pointer;\n"], ["\n  cursor: pointer;\n"])));
+var DropdownChildContainer = styled__default["default"](framerMotion.motion.div)(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  overflow: hidden;\n"], ["\n  overflow: hidden;\n"])));
+var templateObject_1, templateObject_2, templateObject_3;
+
+exports.DropdownChildContainer = DropdownChildContainer;
+exports.DropdownContainer = DropdownContainer;
+exports.DropdownHeader = DropdownHeader;
+//# sourceMappingURL=Dropdown.styles.js.map

package/build/cjs/components/src/components/Dropdown/Dropdown.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/IconText/IconText.styles.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  display: flex;\n  gap: ", "px;\n  align-items: center;\n  flex-wrap: nowrap;\n  white-space: nowrap;\n"], ["\n  display: flex;\n  gap: ", "px;\n  align-items: center;\n  flex-wrap: nowrap;\n  white-space: nowrap;\n"])), function (props) { var _a, _b; return (_a = props.spacing) !== null && _a !== void 0 ? _a : (_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs; });
+var templateObject_1;
+//# sourceMappingURL=IconText.styles.js.map

package/build/cjs/components/src/components/IconText/IconText.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconText.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/build/cjs/components/src/components/Nav/Nav.styles.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  display: flex;\n  background: ", ";\n  position: fixed;\n  top: ", "px;\n  left: 0;\n  height: ", "px;\n  width: 100%;\n  align-items: center;\n\n  @media (min-width: ", "px) {\n    height: ", "px;\n  }\n"], ["\n  display: flex;\n  background: ", ";\n  position: fixed;\n  top: ", "px;\n  left: 0;\n  height: ", "px;\n  width: 100%;\n  align-items: center;\n\n  @media (min-width: ", "px) {\n    height: ", "px;\n  }\n"])), function (props) { var _a, _b; return (_a = props === null || props === void 0 ? void 0 : props.background) !== null && _a !== void 0 ? _a : (_b = props.theme.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a; return (_a = props.topPosition) !== null && _a !== void 0 ? _a : 0; }, function (props) { var _a, _b; return (_a = props === null || props === void 0 ? void 0 : props.height) !== null && _a !== void 0 ? _a : (_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.navHeaderHeightSmall; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.navHeaderHeight; });
+styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  margin: 0 auto;\n  max-width: ", "px;\n  width: 100%;\n  display: flex;\n  padding: ", "px;\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n"], ["\n  margin: 0 auto;\n  max-width: ", "px;\n  width: 100%;\n  display: flex;\n  padding: ", "px;\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n"])), function (props) { return props.maxWidth; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; });
+styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  justify-content: flex-end;\n  display: flex;\n  flex: 1;\n  align-items: center;\n  z-index: 20;\n"], ["\n  justify-content: flex-end;\n  display: flex;\n  flex: 1;\n  align-items: center;\n  z-index: 20;\n"])));
+styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n  display: none;\n  @media (min-width: ", "px) {\n    height: 100%;\n    display: flex;\n\n    gap: ", "px;\n    align-items: center;\n    width: auto;\n    margin-left: ", "px;\n  }\n"], ["\n  display: none;\n  @media (min-width: ", "px) {\n    height: 100%;\n    display: flex;\n\n    gap: ", "px;\n    align-items: center;\n    width: auto;\n    margin-left: ", "px;\n  }\n"])), function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; });
+var NavDummySearchContainer = styled__default["default"].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n  margin-left: ", "px;\n  display: flex;\n  align-items: center;\n  flex: 1;\n"], ["\n  margin-left: ", "px;\n  display: flex;\n  align-items: center;\n  flex: 1;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; });
+styled__default["default"](NavDummySearchContainer)(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n  display: none;\n  @media (min-width: ", "px) {\n    display: flex;\n  }\n"], ["\n  display: none;\n  @media (min-width: ", "px) {\n    display: flex;\n  }\n"])), function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.md; });
+styled__default["default"].div(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n  display: ", ";\n  background: #333;\n  opacity: 0.5;\n  width: 100vw;\n  height: ", ";\n  position: fixed;\n  top: ", ";\n  left: 0;\n  overflow: hidden;\n  z-index: 10;\n  @media (min-width: ", "px) {\n    height: calc(100vh - ", "px);\n    top: ", ";\n  }\n"], ["\n  display: ", ";\n  background: #333;\n  opacity: 0.5;\n  width: 100vw;\n  height: ", ";\n  position: fixed;\n  top: ", ";\n  left: 0;\n  overflow: hidden;\n  z-index: 10;\n  @media (min-width: ", "px) {\n    height: calc(100vh - ", "px);\n    top: ", ";\n  }\n"])), function (props) { return (props.show ? 'block' : 'none'); }, function (props) { var _a; return "calc(100vh - " + ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.navHeaderHeightSmall) + "px)"; }, function (props) { var _a, _b; return "calc(" + ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.navHeaderHeightSmall) + "px - " + ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs) + "px)"; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.navHeaderHeight; }, function (props) { var _a; return "calc(" + ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.navHeaderHeight) + "px - 8px)"; });
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
+
+exports.NavDummySearchContainer = NavDummySearchContainer;
+//# sourceMappingURL=Nav.styles.js.map

package/build/cjs/components/src/components/Nav/Nav.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Nav.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/NavMainLink/NavMainLink.styled.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+styled__default["default"].a(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  height: 100%;\n  display: inline-flex;\n  cursor: pointer;\n  align-items: center;\n  white-space: nowrap;\n  font-weight: ", ";\n  ", ";\n  &:hover {\n    box-shadow: inset 0 -4px 0 ", ";\n  }\n"], ["\n  height: 100%;\n  display: inline-flex;\n  cursor: pointer;\n  align-items: center;\n  white-space: nowrap;\n  font-weight: ", ";\n  ", ";\n  &:hover {\n    box-shadow: inset 0 -4px 0 ", ";\n  }\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.weight.semiBold; }, function (props) {
+    var _a, _b;
+    return (props === null || props === void 0 ? void 0 : props.active) &&
+        "\n    box-shadow: inset 0 -4px 0 " + ((_a = props === null || props === void 0 ? void 0 : props.borderColor) !== null && _a !== void 0 ? _a : (_b = props.theme.palette) === null || _b === void 0 ? void 0 : _b.primary) + ";\n  ";
+}, function (props) { var _a, _b; return (_a = props === null || props === void 0 ? void 0 : props.borderColor) !== null && _a !== void 0 ? _a : (_b = props.theme.palette) === null || _b === void 0 ? void 0 : _b.primary; });
+var templateObject_1;
+//# sourceMappingURL=NavMainLink.styled.js.map

package/build/cjs/components/src/components/NavMainLink/NavMainLink.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavMainLink.styled.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/Pagination/Pagination.js

@@ -38,12 +38,15 @@ function createPagination(totalItems, itemsPerPage) {
     return pagination;
 }
 function Pagination(_a) {
-    var totalItems = _a.totalItems, currentPage = _a.currentPage, fetchItems = _a.fetchItems, itemsPerPage = _a.itemsPerPage;
+    var totalItems = _a.totalItems, currentPage = _a.currentPage, fetchItems = _a.fetchItems, itemsPerPage = _a.itemsPerPage, setPage = _a.setPage;
     var _b = React.useState(Math.floor((currentPage - 1) / 4)), currentIndex = _b[0], setIndex = _b[1];
     var pagination = createPagination(totalItems, itemsPerPage);
     return (React__default["default"].createElement(Box.Box, null, pagination && pagination.length > 0 && (React__default["default"].createElement(Pagination_styles.Flex, null,
         currentIndex > 0 && (React__default["default"].createElement(Pagination_styles.PaginationButtonWrapper, null,
-            React__default["default"].createElement(PaginationButton.PaginationButton, { color: 'white', onClick: function () { return setIndex(currentIndex - 1); }, width: 36, height: 36 }, '...'))),
+            React__default["default"].createElement(PaginationButton.PaginationButton, { color: 'white', onClick: function () {
+                    setPage && setPage(currentPage - 1);
+                    setIndex(currentIndex - 1);
+                }, width: 36, height: 36 }, '...'))),
         pagination[currentIndex].map(function (page) { return (React__default["default"].createElement(Pagination_styles.PaginationButtonWrapper, { key: page },
             React__default["default"].createElement(PaginationButton.PaginationButton, { color: currentPage === page + 1 ? 'primary' : 'white', width: 36, height: 36, onClick: function () { return fetchItems(page + 1); } }, page + 1))); }),
         pagination.length > 1 && currentIndex < pagination.length - 1 && (React__default["default"].createElement(Pagination_styles.PaginationButtonWrapper, null,

package/build/cjs/components/src/components/Pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Pagination.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}