@nulogy/components 14.7.1 → 14.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/main.js +2732 -350
- package/dist/main.module.js +2731 -353
- package/dist/src/Alert/Alert.d.ts +1 -5
- package/dist/src/AppTag/AppTag.d.ts +2 -2
- package/dist/src/AppTag/constants.d.ts +0 -3
- package/dist/src/AppTag/index.d.ts +0 -1
- package/dist/src/BrandedNavBar/BrandLogoContainer.d.ts +2 -0
- package/dist/src/BrandedNavBar/DesktopMenu.d.ts +2 -0
- package/dist/src/BrandedNavBar/EnvironmentBanner.d.ts +2 -0
- package/dist/src/BrandedNavBar/MenuTrigger.d.ts +3 -0
- package/dist/src/BrandedNavBar/MenuTriggerButton.d.ts +1 -0
- package/dist/src/BrandedNavBar/MobileMenu.d.ts +1 -0
- package/dist/src/BrandedNavBar/NavBar.d.ts +2 -0
- package/dist/src/BrandedNavBar/NavBarBackground.d.ts +3 -5
- package/dist/src/BrandedNavBar/NavBarDropdownMenu.d.ts +1 -0
- package/dist/src/BrandedNavBar/NulogyLogoContainer.d.ts +1 -0
- package/dist/src/BrandedNavBar/SmallNavBar.d.ts +3 -0
- package/dist/src/BrandedNavBar/SubMenuTrigger.d.ts +1 -0
- package/dist/src/BrandedNavBar/SubMenuTriggerButton.d.ts +1 -0
- package/dist/src/BrandedNavBar/TriggerFunctionProps.d.ts +1 -0
- package/dist/src/BrandedNavBar/isValidMenuItem.d.ts +1 -0
- package/dist/src/BrandedNavBar/renderSubMenuItems.d.ts +1 -0
- package/dist/src/ButtonGroup/ButtonGroup.d.ts +1 -5
- package/dist/src/Card/CardSet.d.ts +1 -5
- package/dist/src/Decorations/index.d.ts +3 -0
- package/dist/src/DropdownMenu/DropdownMenu.d.ts +10 -5
- package/dist/src/DropdownMenu/DropdownMenu.story.d.ts +6 -0
- package/dist/src/Flex/Flex.d.ts +4 -6
- package/dist/src/Layout/Header.d.ts +1 -1
- package/dist/src/Link/Link.d.ts +2 -2
- package/dist/src/Navigation/Navigation.d.ts +16 -0
- package/dist/src/Navigation/components/AppSwitcher/NulogyAppSwitcher.d.ts +14 -0
- package/dist/src/Navigation/components/AppSwitcher/parts/Item.d.ts +4 -0
- package/dist/src/Navigation/components/AppSwitcher/parts/Link.d.ts +8 -0
- package/dist/src/Navigation/components/AppSwitcher/parts/index.d.ts +56 -0
- package/dist/src/Navigation/components/DesktopNav/DesktopNav.d.ts +5 -0
- package/dist/src/Navigation/components/DesktopNav/parts/MoreMenuItem.d.ts +8 -0
- package/dist/src/Navigation/components/MenuSubItem/MenuSubItem.d.ts +8 -0
- package/dist/src/Navigation/components/MenuSubItem/parts/styled.d.ts +8 -0
- package/dist/src/Navigation/components/MobileNav/MobileNav.d.ts +5 -0
- package/dist/src/Navigation/components/MobileNav/parts/MobileMenuItem.d.ts +9 -0
- package/dist/src/Navigation/components/MobileNav/parts/styled.d.ts +18 -0
- package/dist/src/Navigation/components/NulogyLogo/NulogyLogo.d.ts +6 -0
- package/dist/src/Navigation/components/NulogyLogo/SvgNulogyLogo.d.ts +2 -0
- package/dist/src/Navigation/components/UserMenu/UserMenu.d.ts +14 -0
- package/dist/src/Navigation/components/UserMenu/parts/Header.d.ts +7 -0
- package/dist/src/Navigation/components/UserMenu/parts/Item.d.ts +10 -0
- package/dist/src/Navigation/components/UserMenu/parts/MobileItem.d.ts +6 -0
- package/dist/src/Navigation/components/UserMenu/parts/styled.d.ts +10 -0
- package/dist/src/Navigation/components/shared/NavigationLogo.d.ts +8 -0
- package/dist/src/Navigation/components/shared/NavigationLogoLink.d.ts +7 -0
- package/dist/src/Navigation/components/shared/NavigationMenuContent.d.ts +7 -0
- package/dist/src/Navigation/components/shared/NavigationMenuItem.d.ts +12 -0
- package/dist/src/Navigation/components/shared/components.d.ts +17 -0
- package/dist/src/Navigation/components/shared/constants.d.ts +6 -0
- package/dist/src/Navigation/components/shared/disableHoverEvents.d.ts +6 -0
- package/dist/src/Navigation/components/utils/getNavigationBarItems.d.ts +2 -0
- package/dist/src/Navigation/hooks/useResponsiveMenu.d.ts +12 -0
- package/dist/src/Navigation/index.d.ts +7 -0
- package/dist/src/Navigation/stories/Navigation.appSwitcher.story.d.ts +12 -0
- package/dist/src/Navigation/stories/Navigation.logos.story.d.ts +22 -0
- package/dist/src/Navigation/stories/Navigation.mobileVisibility.story.d.ts +13 -0
- package/dist/src/Navigation/stories/Navigation.navigationMenus.story.d.ts +13 -0
- package/dist/src/Navigation/stories/Navigation.navigationMenus.subMenus.story.d.ts +11 -0
- package/dist/src/Navigation/stories/Navigation.story.d.ts +10 -0
- package/dist/src/Navigation/stories/Navigation.userMenu.story.d.ts +13 -0
- package/dist/src/Navigation/stories/fixtures/logos/CustomLogo2.d.ts +2 -0
- package/dist/src/Navigation/stories/fixtures/logos/CustomLogo3.d.ts +2 -0
- package/dist/src/Navigation/stories/fixtures/logos/Customlogo1.d.ts +2 -0
- package/dist/src/Navigation/types.d.ts +87 -0
- package/dist/src/Overlay/Overlay.d.ts +1 -5
- package/dist/src/Primitives/index.d.ts +5 -0
- package/dist/src/StyledProps/index.d.ts +7 -1
- package/dist/src/Tooltip2/index.d.ts +10 -0
- package/dist/src/index.d.ts +4 -1
- package/dist/src/types/NulogyApp.d.ts +3 -0
- package/dist/src/utils/story/resizable.d.ts +4 -4
- package/dist/src/utils/testing/useConditionalAutoClick.d.ts +60 -0
- package/package.json +3 -1
- package/dist/src/AppTag/components/Tooltip.d.ts +0 -8
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { NavigationMenuLinkProps } from "@radix-ui/react-navigation-menu";
|
|
3
|
+
interface NavigationLogoLinkProps extends Omit<NavigationMenuLinkProps, "asChild"> {
|
|
4
|
+
renderAsFragment?: boolean;
|
|
5
|
+
}
|
|
6
|
+
export declare const NavigationLogoLink: ({ href, renderAsFragment, ...props }: NavigationLogoLinkProps) => React.JSX.Element;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
|
|
3
|
+
import { StyledProps } from "../../../StyledProps";
|
|
4
|
+
export interface NavigationMenuContentProps extends RadixNavigationMenu.NavigationMenuContentProps, StyledProps {
|
|
5
|
+
}
|
|
6
|
+
declare const NavigationMenuContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, never>, NavigationMenuContentProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
|
|
7
|
+
export default NavigationMenuContent;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
|
|
3
|
+
import type { MenuItem } from "../../types";
|
|
4
|
+
export interface NavigationMenuItemProps extends RadixNavigationMenu.NavigationMenuItemProps {
|
|
5
|
+
item: MenuItem;
|
|
6
|
+
level?: number;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* A single Radix <NavigationMenu.Item> that can represent any MenuItem variant.
|
|
10
|
+
*/
|
|
11
|
+
export declare const NavigationMenuItem: React.ForwardRefExoticComponent<NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>>;
|
|
12
|
+
export declare const NavigationMenuSubList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>, never>> & string & Omit<React.ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>>, keyof React.Component<any, {}, any>>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
|
|
3
|
+
import { IconProps } from "../../../Icon/Icon";
|
|
4
|
+
import { StyledProps } from "../../../StyledProps";
|
|
5
|
+
export declare const NavigationMenuRoot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuProps & import("react").RefAttributes<HTMLElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuProps & import("react").RefAttributes<HTMLElement>>, keyof import("react").Component<any, {}, any>>;
|
|
6
|
+
export declare const NavigationMenuList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>, keyof import("react").Component<any, {}, any>>;
|
|
7
|
+
interface NavigationMenuTriggerProps extends RadixNavigationMenu.NavigationMenuTriggerProps, StyledProps {
|
|
8
|
+
disableMenuToggleOnHover?: boolean;
|
|
9
|
+
}
|
|
10
|
+
export declare const NavigationMenuTrigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, NavigationMenuTriggerProps>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
|
|
11
|
+
export declare const NavigationMenuLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
|
|
12
|
+
export declare const NavigationMenuIconLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, keyof StyledProps> & StyledProps, never>> & string;
|
|
13
|
+
export declare const NavigationMenuIconTrigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, NavigationMenuTriggerProps>, never>, never>> & string;
|
|
14
|
+
export declare const CaretDown: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps, import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps>, never>, Partial<IconProps>>> & string;
|
|
15
|
+
export declare const CaretRight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps, import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps>, never>, Partial<IconProps>>> & string;
|
|
16
|
+
export declare const RadixNavigationMenuItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>>, keyof import("react").Component<any, {}, any>>;
|
|
17
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { Breakpoints } from "../../../theme/theme.type";
|
|
2
|
+
export declare const NAVIGATION_MENU_HEIGHT_STYLED_UNITS = "x8";
|
|
3
|
+
export declare const NAVIGATION_MENU_CONTENT_WIDTH_MAX_WIDTH_PX = 400;
|
|
4
|
+
export declare const NAVIGATION_DEFAULT_BREAKPOINT_THEME_KEY: keyof Breakpoints;
|
|
5
|
+
export declare const NAVIGATION_SUB_MENU_MIN_WIDTH_PX = 180;
|
|
6
|
+
export declare const MIN_DISTANCE_BETWEEN_MENUS_PX = 64;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { MenuItems, MenuItem } from "../types";
|
|
3
|
+
type UseResponsiveMenu = (initialMenuItems: MenuItems) => {
|
|
4
|
+
menuItems: MenuItems;
|
|
5
|
+
moreMenu: MenuItems;
|
|
6
|
+
hiddenMenuItem: MenuItem | null;
|
|
7
|
+
primaryMenuRef: React.RefObject<HTMLUListElement>;
|
|
8
|
+
secondaryMenuRef: React.RefObject<HTMLUListElement>;
|
|
9
|
+
hiddenButtonRef: React.RefObject<HTMLLIElement>;
|
|
10
|
+
};
|
|
11
|
+
export declare const useResponsiveMenu: UseResponsiveMenu;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export { default as Navigation } from "./Navigation";
|
|
2
|
+
export { NulogyLogo } from "./components/NulogyLogo/NulogyLogo";
|
|
3
|
+
export { NavigationLogoLink } from "./components/shared/NavigationLogoLink";
|
|
4
|
+
export { NavigationLogo } from "./components/shared/NavigationLogo";
|
|
5
|
+
export type { NavigationProps } from "./Navigation";
|
|
6
|
+
export type { MenuItems, MenuItem, UserMenu, UserMenuItem, UserMenuInfo } from "./types";
|
|
7
|
+
export type { AppSwitcherConfig } from "./components/AppSwitcher/NulogyAppSwitcher";
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
parameters: {
|
|
5
|
+
layout: string;
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const AllApps: () => React.JSX.Element;
|
|
10
|
+
export declare const OnlySelectApps: () => React.JSX.Element;
|
|
11
|
+
export declare const WithConditionallyVisibleApps: () => React.JSX.Element;
|
|
12
|
+
export declare const WithAnIndicator: () => React.JSX.Element;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
parameters: {
|
|
5
|
+
layout: string;
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const PrimaryLogo: () => React.JSX.Element;
|
|
10
|
+
export declare const UsingClientRouting: () => React.JSX.Element;
|
|
11
|
+
export declare const WithANulogyApplicationName: () => React.JSX.Element;
|
|
12
|
+
export declare const SecondaryLogo: () => React.JSX.Element;
|
|
13
|
+
export declare const SecondaryLogoLink: () => React.JSX.Element;
|
|
14
|
+
export declare const WithoutPassingAPrimaryLogo: () => React.JSX.Element;
|
|
15
|
+
export declare const WithoutAPrimaryLogo: () => React.JSX.Element;
|
|
16
|
+
export declare const WithACustomPrimaryLogo: () => React.JSX.Element;
|
|
17
|
+
export declare const WithNavigationLogoWrapper: {
|
|
18
|
+
(): React.JSX.Element;
|
|
19
|
+
story: {
|
|
20
|
+
name: string;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
parameters: {
|
|
5
|
+
layout: string;
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const DefaultBehavior: () => React.JSX.Element;
|
|
10
|
+
export declare const ItemInNavigationBar: () => React.JSX.Element;
|
|
11
|
+
export declare const ItemInNavigationMenu: () => React.JSX.Element;
|
|
12
|
+
export declare const ItemHiddenOnMobile: () => React.JSX.Element;
|
|
13
|
+
export declare const MixedVisibility: () => React.JSX.Element;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
parameters: {
|
|
5
|
+
layout: string;
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const BasicUsage: () => React.JSX.Element;
|
|
10
|
+
export declare const Separators: () => React.JSX.Element;
|
|
11
|
+
export declare const CustomMenuItems: () => React.JSX.Element;
|
|
12
|
+
export declare const IconsAndLabels: () => React.JSX.Element;
|
|
13
|
+
export declare const WithClientRouting: () => React.JSX.Element;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
parameters: {
|
|
5
|
+
layout: string;
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const SubMenus: () => React.JSX.Element;
|
|
10
|
+
export declare const SubMenuSeparator: () => React.JSX.Element;
|
|
11
|
+
export declare const IconsAndLabels: () => React.JSX.Element;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
parameters: {
|
|
5
|
+
layout: string;
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const BasicUsage: () => React.JSX.Element;
|
|
10
|
+
export declare const WithACustomBreakpoint: () => React.JSX.Element;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
parameters: {
|
|
5
|
+
layout: string;
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const BasicUsage: () => React.JSX.Element;
|
|
10
|
+
export declare const WithoutATrigger: () => React.JSX.Element;
|
|
11
|
+
export declare const Header: () => React.JSX.Element;
|
|
12
|
+
export declare const Controls: () => React.JSX.Element;
|
|
13
|
+
export declare const MenuItems: () => React.JSX.Element;
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { IconName } from "@nulogy/icons";
|
|
3
|
+
export interface UserMenu {
|
|
4
|
+
triggerText: UserMenuInfo;
|
|
5
|
+
header?: UserMenuInfo;
|
|
6
|
+
controls?: (props: {
|
|
7
|
+
withinMobileNav: boolean;
|
|
8
|
+
}) => JSX.Element;
|
|
9
|
+
menuItems?: UserMenuItem[];
|
|
10
|
+
}
|
|
11
|
+
export type UserMenuInfo = {
|
|
12
|
+
title: string;
|
|
13
|
+
subtitle1?: string;
|
|
14
|
+
subtitle2?: string;
|
|
15
|
+
};
|
|
16
|
+
export type UserMenuItem = BaseUserMenuItem & (LinkUserMenuItem | ButtonUserMenuItem | CustomUserMenuItem);
|
|
17
|
+
interface BaseUserMenuItem {
|
|
18
|
+
key: string;
|
|
19
|
+
}
|
|
20
|
+
interface LinkUserMenuItem {
|
|
21
|
+
label: string;
|
|
22
|
+
type: "link";
|
|
23
|
+
props?: React.ComponentPropsWithoutRef<"a">;
|
|
24
|
+
element?: JSX.Element;
|
|
25
|
+
}
|
|
26
|
+
interface ButtonUserMenuItem {
|
|
27
|
+
label: string;
|
|
28
|
+
type: "button";
|
|
29
|
+
props?: React.ComponentPropsWithoutRef<"button">;
|
|
30
|
+
items?: UserMenuItem[];
|
|
31
|
+
}
|
|
32
|
+
interface CustomUserMenuItem {
|
|
33
|
+
type: "custom";
|
|
34
|
+
render: (props: {
|
|
35
|
+
level: number;
|
|
36
|
+
withinMobileNav: boolean;
|
|
37
|
+
}) => JSX.Element;
|
|
38
|
+
}
|
|
39
|
+
export type MenuItem = MenuItemBase & (CustomMenuItem | MenuItemButton | MenuItemLink | MenuItemSeparator);
|
|
40
|
+
export type MenuItems = MenuItem[];
|
|
41
|
+
type MobileVisibility =
|
|
42
|
+
/**
|
|
43
|
+
* Show on the navigation bar, just before the mobile navigation menu trigger
|
|
44
|
+
*/
|
|
45
|
+
"navigationBar"
|
|
46
|
+
/**
|
|
47
|
+
* Show inside the mobile navigation menu (default behavior)
|
|
48
|
+
*/
|
|
49
|
+
| "navigationMenu"
|
|
50
|
+
/**
|
|
51
|
+
* Hide item completely
|
|
52
|
+
*/
|
|
53
|
+
| "hidden";
|
|
54
|
+
export type MenuItemBase = {
|
|
55
|
+
mobileVisibility?: MobileVisibility;
|
|
56
|
+
key: string;
|
|
57
|
+
};
|
|
58
|
+
type WithIcon = {
|
|
59
|
+
icon: IconName;
|
|
60
|
+
tooltip: string;
|
|
61
|
+
label?: string;
|
|
62
|
+
};
|
|
63
|
+
type WithLabel = {
|
|
64
|
+
label: string;
|
|
65
|
+
};
|
|
66
|
+
type CustomMenuItem = {
|
|
67
|
+
type: "custom";
|
|
68
|
+
render: (props: {
|
|
69
|
+
withinSubMenu: boolean;
|
|
70
|
+
level: number;
|
|
71
|
+
withinMobileNav: boolean;
|
|
72
|
+
}) => JSX.Element;
|
|
73
|
+
};
|
|
74
|
+
type MenuItemButton = {
|
|
75
|
+
type: "button";
|
|
76
|
+
items?: MenuItem[];
|
|
77
|
+
props?: React.ComponentPropsWithoutRef<"button">;
|
|
78
|
+
} & (WithIcon | WithLabel);
|
|
79
|
+
type MenuItemLink = {
|
|
80
|
+
type: "link";
|
|
81
|
+
element?: JSX.Element;
|
|
82
|
+
props?: React.ComponentPropsWithoutRef<"a">;
|
|
83
|
+
} & (WithIcon | WithLabel);
|
|
84
|
+
type MenuItemSeparator = {
|
|
85
|
+
type: "separator";
|
|
86
|
+
};
|
|
87
|
+
export {};
|
|
@@ -3,9 +3,5 @@ import { FlexProps } from "../Flex/Flex";
|
|
|
3
3
|
interface Props extends FlexProps {
|
|
4
4
|
dark?: boolean;
|
|
5
5
|
}
|
|
6
|
-
declare const Overlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../Box").BoxProps> & import("../Box").BoxProps, keyof
|
|
7
|
-
gap?: import("csstype").Property.Gap<string | number>;
|
|
8
|
-
rowGap?: import("csstype").Property.RowGap<string | number>;
|
|
9
|
-
columnGap?: import("csstype").Property.ColumnGap<string | number>;
|
|
10
|
-
}, Props>> & string;
|
|
6
|
+
declare const Overlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../Box").BoxProps> & import("../Box").BoxProps, keyof FlexProps> & FlexProps, Props>> & string;
|
|
11
7
|
export default Overlay;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { StyledProps } from "../StyledProps";
|
|
3
|
+
declare const Ul: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, StyledProps>> & string;
|
|
4
|
+
declare const Li: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, StyledProps>> & string;
|
|
5
|
+
export { Ul, Li };
|
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import { styleFn, variant as styledSystemVariant } from "styled-system";
|
|
2
2
|
import type { SpaceProps, PaddingProps, MarginProps, WidthProps, FontSizeProps, FontFamilyProps, TextAlignProps, LineHeightProps, FontWeightProps, FontStyleProps, LetterSpacingProps, DisplayProps, MaxWidthProps, MinWidthProps, HeightProps, MaxHeightProps, MinHeightProps, SizeProps, VerticalAlignProps, AlignItemsProps, AlignContentProps, JustifyItemsProps, JustifyContentProps, FlexWrapProps, FlexBasisProps, FlexDirectionProps, FlexProps, JustifySelfProps, AlignSelfProps, OrderProps, GridGapProps, GridColumnGapProps, GridRowGapProps, GridColumnProps, GridRowProps, GridAutoFlowProps, GridAutoColumnsProps, GridAutoRowsProps, GridTemplateColumnsProps, GridTemplateRowsProps, GridTemplateAreasProps, GridAreaProps, BorderProps, BorderTopProps, BorderRightProps, BorderBottomProps, BorderLeftProps, BordersProps, BorderColorProps, BorderRadiusProps, BoxShadowProps, OpacityProps, OverflowProps, BackgroundProps, BackgroundImageProps, BackgroundPositionProps, BackgroundRepeatProps, BackgroundSizeProps, PositionProps, ZIndexProps, TopProps, RightProps, BottomProps, LeftProps, TextStyleProps, ColorStyleProps, ButtonStyleProps, FlexboxProps, GridProps, BackgroundColorProps, FlexGrowProps, TypographyProps, LayoutProps } from "styled-system";
|
|
3
3
|
import { CSSProperties } from "react";
|
|
4
|
+
export interface GapProps {
|
|
5
|
+
gap?: CSSProperties["gap"];
|
|
6
|
+
rowGap?: CSSProperties["rowGap"];
|
|
7
|
+
columnGap?: CSSProperties["columnGap"];
|
|
8
|
+
}
|
|
9
|
+
export declare const gap: styleFn;
|
|
4
10
|
export declare function getStyledPropNames(...styleFns: styleFn[]): string[];
|
|
5
11
|
export declare const excludeStyledProps: (...styleFns: styleFn[]) => (prop: string | number) => boolean;
|
|
6
12
|
export declare const variant: typeof styledSystemVariant;
|
|
@@ -28,6 +34,6 @@ export type VisibilityProps = {
|
|
|
28
34
|
export type CursorProps = {
|
|
29
35
|
cursor?: CSSProperties["cursor"];
|
|
30
36
|
};
|
|
31
|
-
export interface StyledProps extends SpaceProps, BackgroundColorProps, LayoutProps, FlexGrowProps, TypographyProps, MarginProps, PaddingProps, WidthProps, FontSizeProps, FontFamilyProps, TextAlignProps, LineHeightProps, FontWeightProps, FontStyleProps, LetterSpacingProps, DisplayProps, MaxWidthProps, MinWidthProps, HeightProps, MaxHeightProps, MinHeightProps, SizeProps, VerticalAlignProps, AlignItemsProps, AlignContentProps, JustifyItemsProps, JustifyContentProps, FlexWrapProps, FlexBasisProps, FlexDirectionProps, FlexProps, FlexboxProps, JustifySelfProps, AlignSelfProps, OrderProps, GridProps, GridGapProps, GridColumnGapProps, GridRowGapProps, GridColumnProps, GridRowProps, GridAutoFlowProps, GridAutoColumnsProps, GridAutoRowsProps, GridTemplateColumnsProps, GridTemplateRowsProps, GridTemplateAreasProps, GridAreaProps, BorderProps, BorderTopProps, BorderRightProps, BorderBottomProps, BorderLeftProps, BordersProps, BorderRadiusProps, BoxShadowProps, OpacityProps, OverflowProps, BorderColorProps, BackgroundProps, PositionProps, ZIndexProps, TopProps, RightProps, BottomProps, LeftProps, TextStyleProps, ColorStyleProps, ButtonStyleProps, TransitionProps, TransformProps, BackgroundImageProps, BackgroundPositionProps, BackgroundRepeatProps, BackgroundSizeProps, TextOverflowProps, VisibilityProps, CursorProps {
|
|
37
|
+
export interface StyledProps extends SpaceProps, BackgroundColorProps, LayoutProps, FlexGrowProps, TypographyProps, MarginProps, PaddingProps, WidthProps, FontSizeProps, FontFamilyProps, TextAlignProps, LineHeightProps, FontWeightProps, FontStyleProps, LetterSpacingProps, DisplayProps, MaxWidthProps, MinWidthProps, HeightProps, MaxHeightProps, MinHeightProps, SizeProps, VerticalAlignProps, AlignItemsProps, AlignContentProps, JustifyItemsProps, JustifyContentProps, FlexWrapProps, FlexBasisProps, FlexDirectionProps, FlexProps, FlexboxProps, JustifySelfProps, AlignSelfProps, OrderProps, GridProps, GridGapProps, GridColumnGapProps, GridRowGapProps, GridColumnProps, GridRowProps, GridAutoFlowProps, GridAutoColumnsProps, GridAutoRowsProps, GridTemplateColumnsProps, GridTemplateRowsProps, GridTemplateAreasProps, GridAreaProps, BorderProps, BorderTopProps, BorderRightProps, BorderBottomProps, BorderLeftProps, BordersProps, BorderRadiusProps, BoxShadowProps, OpacityProps, OverflowProps, BorderColorProps, BackgroundProps, PositionProps, ZIndexProps, TopProps, RightProps, BottomProps, LeftProps, TextStyleProps, ColorStyleProps, ButtonStyleProps, TransitionProps, TransformProps, BackgroundImageProps, BackgroundPositionProps, BackgroundRepeatProps, BackgroundSizeProps, TextOverflowProps, VisibilityProps, CursorProps, GapProps {
|
|
32
38
|
}
|
|
33
39
|
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React, { ReactNode } from "react";
|
|
2
|
+
type TooltipProps = {
|
|
3
|
+
children: ReactNode;
|
|
4
|
+
content: ReactNode;
|
|
5
|
+
hideTooltip?: boolean;
|
|
6
|
+
sideOffset?: number;
|
|
7
|
+
delayDuration?: number;
|
|
8
|
+
};
|
|
9
|
+
export declare function Tooltip({ children, content, sideOffset, hideTooltip, delayDuration }: TooltipProps): React.JSX.Element;
|
|
10
|
+
export {};
|
package/dist/src/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export { Alert, NotificationTypes } from "./Alert";
|
|
2
2
|
export type { NotificationType } from "./Alert";
|
|
3
3
|
export { AppTag } from "./AppTag";
|
|
4
|
-
export type {
|
|
4
|
+
export type { AppTagProps } from "./AppTag";
|
|
5
5
|
export { AsyncSelect } from "./AsyncSelect";
|
|
6
6
|
export { Banner } from "./Banner";
|
|
7
7
|
export { BottomSheet, BottomSheetParts } from "./BottomSheet";
|
|
@@ -33,6 +33,8 @@ export { List, ListItem } from "./List";
|
|
|
33
33
|
export { LoadingAnimation } from "./LoadingAnimation";
|
|
34
34
|
export { ALL_NDS_LOCALES } from "./locales.const";
|
|
35
35
|
export { Modal } from "./Modal";
|
|
36
|
+
export { Navigation, NulogyLogo, NavigationLogoLink, NavigationLogo } from "./Navigation";
|
|
37
|
+
export type { NavigationProps, MenuItems, MenuItem, UserMenu, UserMenuItem, UserMenuInfo, AppSwitcherConfig, } from "./Navigation";
|
|
36
38
|
export { NDSProvider } from "./NDSProvider";
|
|
37
39
|
export { Overlay } from "./Overlay";
|
|
38
40
|
export { Pagination } from "./Pagination";
|
|
@@ -63,6 +65,7 @@ export type { MenuItemLinkProps } from "./TopBar";
|
|
|
63
65
|
export { TruncatedText } from "./TruncatedText";
|
|
64
66
|
export { Heading1, Heading2, Heading3, Heading4, Text } from "./Type";
|
|
65
67
|
export type { TextProps } from "./Type";
|
|
68
|
+
export type { NulogyAppName } from "./types/NulogyApp";
|
|
66
69
|
export { useWindowDimensions } from "./utils";
|
|
67
70
|
export { InlineValidation } from "./Validation";
|
|
68
71
|
export { VerticalDivider } from "./VerticalDivider";
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export type NulogyAppName = "production-scheduling" | "supplier-collaboration" | "digital-quality-inspection" | "shop-floor" | "smart-factory" | "connections" | "data";
|
|
2
|
+
export declare const APP_ABBREVIATIONS: Record<NulogyAppName, string>;
|
|
3
|
+
export declare const APP_DISPLAY_NAMES: Record<NulogyAppName, string>;
|
|
@@ -6,19 +6,19 @@ interface ResizableProps {
|
|
|
6
6
|
showContainerOutline?: boolean;
|
|
7
7
|
}
|
|
8
8
|
export declare const Resizable: ({ children, containerWidth, onResize, showContainerOutline, }: ResizableProps) => React.JSX.Element;
|
|
9
|
-
export declare const WidthText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "inline" | "compact" | "disabled" | keyof React.HTMLAttributes<HTMLParagraphElement> |
|
|
9
|
+
export declare const WidthText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "inline" | "compact" | "disabled" | "textTransform" | keyof React.HTMLAttributes<HTMLParagraphElement> | keyof import("../..").StyledProps> & React.HTMLAttributes<HTMLParagraphElement> & {
|
|
10
10
|
variant?: import("../../NDSProvider/ComponentVariantContext").ComponentVariant;
|
|
11
11
|
inline?: boolean;
|
|
12
12
|
compact?: boolean;
|
|
13
13
|
disabled?: boolean;
|
|
14
|
-
textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "
|
|
14
|
+
textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase";
|
|
15
15
|
fontSize?: string;
|
|
16
|
-
} & import("../..").StyledProps & import("framer-motion").MotionProps, "ref"> & React.RefAttributes<HTMLElement | SVGElement>, never>> & string & Omit<import("framer-motion").CustomDomComponent<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "inline" | "compact" | "disabled" | keyof React.HTMLAttributes<HTMLParagraphElement> |
|
|
16
|
+
} & import("../..").StyledProps & import("framer-motion").MotionProps, "ref"> & React.RefAttributes<HTMLElement | SVGElement>, never>> & string & Omit<import("framer-motion").CustomDomComponent<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "inline" | "compact" | "disabled" | "textTransform" | keyof React.HTMLAttributes<HTMLParagraphElement> | keyof import("../..").StyledProps> & React.HTMLAttributes<HTMLParagraphElement> & {
|
|
17
17
|
variant?: import("../../NDSProvider/ComponentVariantContext").ComponentVariant;
|
|
18
18
|
inline?: boolean;
|
|
19
19
|
compact?: boolean;
|
|
20
20
|
disabled?: boolean;
|
|
21
|
-
textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "
|
|
21
|
+
textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase";
|
|
22
22
|
fontSize?: string;
|
|
23
23
|
} & import("../..").StyledProps>, keyof React.Component<any, {}, any>>;
|
|
24
24
|
export declare const ResizeHandle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
interface ConditionConfig {
|
|
2
|
+
/**
|
|
3
|
+
* Query parameter to check for in the URL
|
|
4
|
+
* @default "autoClick"
|
|
5
|
+
*/
|
|
6
|
+
queryParam?: string;
|
|
7
|
+
/**
|
|
8
|
+
* When to trigger the auto-click
|
|
9
|
+
* @default "present"
|
|
10
|
+
*/
|
|
11
|
+
when?: "present" | "absent";
|
|
12
|
+
}
|
|
13
|
+
interface UseConditionalAutoClickProps {
|
|
14
|
+
/**
|
|
15
|
+
* CSS selector for the element to click
|
|
16
|
+
*/
|
|
17
|
+
selector: string;
|
|
18
|
+
/**
|
|
19
|
+
* Condition configuration for when to auto-click
|
|
20
|
+
*/
|
|
21
|
+
condition?: ConditionConfig;
|
|
22
|
+
/**
|
|
23
|
+
* Delay in milliseconds before attempting to click the element
|
|
24
|
+
* @default 100
|
|
25
|
+
*/
|
|
26
|
+
delay?: number;
|
|
27
|
+
/**
|
|
28
|
+
* Whether to log the action to the console
|
|
29
|
+
* @default true
|
|
30
|
+
*/
|
|
31
|
+
logging?: boolean;
|
|
32
|
+
/**
|
|
33
|
+
* Callback to execute when the element is found and clicked
|
|
34
|
+
*/
|
|
35
|
+
onSuccess?: () => void;
|
|
36
|
+
/**
|
|
37
|
+
* Callback to execute when the element is not found
|
|
38
|
+
*/
|
|
39
|
+
onNotFound?: () => void;
|
|
40
|
+
/**
|
|
41
|
+
* Callback to execute when an error occurs
|
|
42
|
+
*/
|
|
43
|
+
onError?: (error: Error) => void;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* Hook that conditionally auto-clicks an element based on URL query parameters.
|
|
47
|
+
* Useful for preventing double-clicks during automated testing.
|
|
48
|
+
*
|
|
49
|
+
* @example
|
|
50
|
+
* // Only auto-click when NOT in Cypress testing
|
|
51
|
+
* useConditionalAutoClick({
|
|
52
|
+
* selector: 'button[aria-label="Menu"]',
|
|
53
|
+
* condition: {
|
|
54
|
+
* queryParam: "cypressTest",
|
|
55
|
+
* when: "absent"
|
|
56
|
+
* }
|
|
57
|
+
* });
|
|
58
|
+
*/
|
|
59
|
+
export default function useConditionalAutoClick({ selector, condition, delay, logging, onSuccess, onNotFound, onError, }: UseConditionalAutoClickProps): void;
|
|
60
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nulogy/components",
|
|
3
|
-
"version": "14.
|
|
3
|
+
"version": "14.8.0",
|
|
4
4
|
"description": "Component library for the Nulogy Design System - http://nulogy.design",
|
|
5
5
|
"private": false,
|
|
6
6
|
"publishConfig": {
|
|
@@ -92,6 +92,7 @@
|
|
|
92
92
|
"@testing-library/jest-dom": "5.11.5",
|
|
93
93
|
"@testing-library/react": "^12.1.5",
|
|
94
94
|
"@types/css-mediaquery": "^0.1.4",
|
|
95
|
+
"@types/deep-equal": "^1.0.4",
|
|
95
96
|
"@types/jest": "^29.5.1",
|
|
96
97
|
"@types/node": "^14.0.14",
|
|
97
98
|
"@types/react": "^17.0.39",
|
|
@@ -154,6 +155,7 @@
|
|
|
154
155
|
"@babel/runtime": "^7.9.6",
|
|
155
156
|
"@emotion/is-prop-valid": "^1.3.1",
|
|
156
157
|
"@nulogy/tokens": "^6.1.1",
|
|
158
|
+
"@radix-ui/react-navigation-menu": "^1.1.4",
|
|
157
159
|
"@radix-ui/react-tooltip": "1.0.7",
|
|
158
160
|
"@reach/dialog": "0.17.0",
|
|
159
161
|
"@styled-system/prop-types": "^5.1.4",
|