@cerberus-design/react 0.0.1-next-b88d5af → 0.0.1-next-7d9e858
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/build/legacy/_tsup-dts-rollup.d.cts +96 -1
- package/build/legacy/_tsup-dts-rollup.d.ts +96 -1
- package/build/legacy/aria-helpers/nav-menu.aria.cjs +36 -0
- package/build/legacy/aria-helpers/nav-menu.aria.cjs.map +1 -0
- package/build/legacy/aria-helpers/nav-menu.aria.d.cts +2 -0
- package/build/legacy/aria-helpers/nav-menu.aria.d.ts +2 -0
- package/build/legacy/aria-helpers/nav-menu.aria.js +11 -0
- package/build/legacy/aria-helpers/nav-menu.aria.js.map +1 -0
- package/build/legacy/components/Button.cjs.map +1 -1
- package/build/legacy/components/Button.js.map +1 -1
- package/build/legacy/components/NavMenuLink.cjs +38 -0
- package/build/legacy/components/NavMenuLink.cjs.map +1 -0
- package/build/legacy/components/NavMenuLink.d.cts +2 -0
- package/build/legacy/components/NavMenuLink.d.ts +2 -0
- package/build/legacy/components/NavMenuLink.js +13 -0
- package/build/legacy/components/NavMenuLink.js.map +1 -0
- package/build/legacy/components/NavMenuList.cjs +81 -0
- package/build/legacy/components/NavMenuList.cjs.map +1 -0
- package/build/legacy/components/NavMenuList.d.cts +3 -0
- package/build/legacy/components/NavMenuList.d.ts +3 -0
- package/build/legacy/components/NavMenuList.js +56 -0
- package/build/legacy/components/NavMenuList.js.map +1 -0
- package/build/legacy/components/NavMenuTrigger.cjs +98 -0
- package/build/legacy/components/NavMenuTrigger.cjs.map +1 -0
- package/build/legacy/components/NavMenuTrigger.d.cts +2 -0
- package/build/legacy/components/NavMenuTrigger.d.ts +2 -0
- package/build/legacy/components/NavMenuTrigger.js +78 -0
- package/build/legacy/components/NavMenuTrigger.js.map +1 -0
- package/build/legacy/context/navMenu.cjs +70 -0
- package/build/legacy/context/navMenu.cjs.map +1 -0
- package/build/legacy/context/navMenu.d.cts +5 -0
- package/build/legacy/context/navMenu.d.ts +5 -0
- package/build/legacy/context/navMenu.js +52 -0
- package/build/legacy/context/navMenu.js.map +1 -0
- package/build/legacy/context/theme.cjs +3 -9
- package/build/legacy/context/theme.cjs.map +1 -1
- package/build/legacy/context/theme.js +3 -9
- package/build/legacy/context/theme.js.map +1 -1
- package/build/legacy/index.cjs +13 -1
- package/build/legacy/index.cjs.map +1 -1
- package/build/legacy/index.d.cts +15 -0
- package/build/legacy/index.d.ts +15 -0
- package/build/legacy/index.js +6 -0
- package/build/legacy/index.js.map +1 -1
- package/build/legacy/types.cjs +19 -0
- package/build/legacy/types.cjs.map +1 -0
- package/build/legacy/types.d.cts +1 -0
- package/build/legacy/types.d.ts +1 -0
- package/build/legacy/types.js +1 -0
- package/build/legacy/types.js.map +1 -0
- package/build/modern/_tsup-dts-rollup.d.cts +96 -1
- package/build/modern/_tsup-dts-rollup.d.ts +96 -1
- package/build/modern/aria-helpers/nav-menu.aria.cjs +36 -0
- package/build/modern/aria-helpers/nav-menu.aria.cjs.map +1 -0
- package/build/modern/aria-helpers/nav-menu.aria.d.cts +2 -0
- package/build/modern/aria-helpers/nav-menu.aria.d.ts +2 -0
- package/build/modern/aria-helpers/nav-menu.aria.js +11 -0
- package/build/modern/aria-helpers/nav-menu.aria.js.map +1 -0
- package/build/modern/components/Button.cjs.map +1 -1
- package/build/modern/components/Button.js.map +1 -1
- package/build/modern/components/NavMenuLink.cjs +38 -0
- package/build/modern/components/NavMenuLink.cjs.map +1 -0
- package/build/modern/components/NavMenuLink.d.cts +2 -0
- package/build/modern/components/NavMenuLink.d.ts +2 -0
- package/build/modern/components/NavMenuLink.js +13 -0
- package/build/modern/components/NavMenuLink.js.map +1 -0
- package/build/modern/components/NavMenuList.cjs +81 -0
- package/build/modern/components/NavMenuList.cjs.map +1 -0
- package/build/modern/components/NavMenuList.d.cts +3 -0
- package/build/modern/components/NavMenuList.d.ts +3 -0
- package/build/modern/components/NavMenuList.js +56 -0
- package/build/modern/components/NavMenuList.js.map +1 -0
- package/build/modern/components/NavMenuTrigger.cjs +98 -0
- package/build/modern/components/NavMenuTrigger.cjs.map +1 -0
- package/build/modern/components/NavMenuTrigger.d.cts +2 -0
- package/build/modern/components/NavMenuTrigger.d.ts +2 -0
- package/build/modern/components/NavMenuTrigger.js +78 -0
- package/build/modern/components/NavMenuTrigger.js.map +1 -0
- package/build/modern/context/navMenu.cjs +70 -0
- package/build/modern/context/navMenu.cjs.map +1 -0
- package/build/modern/context/navMenu.d.cts +5 -0
- package/build/modern/context/navMenu.d.ts +5 -0
- package/build/modern/context/navMenu.js +52 -0
- package/build/modern/context/navMenu.js.map +1 -0
- package/build/modern/context/theme.cjs +3 -9
- package/build/modern/context/theme.cjs.map +1 -1
- package/build/modern/context/theme.js +3 -9
- package/build/modern/context/theme.js.map +1 -1
- package/build/modern/index.cjs +13 -1
- package/build/modern/index.cjs.map +1 -1
- package/build/modern/index.d.cts +15 -0
- package/build/modern/index.d.ts +15 -0
- package/build/modern/index.js +6 -0
- package/build/modern/index.js.map +1 -1
- package/build/modern/types.cjs +19 -0
- package/build/modern/types.cjs.map +1 -0
- package/build/modern/types.d.cts +1 -0
- package/build/modern/types.d.ts +1 -0
- package/build/modern/types.js +1 -0
- package/build/modern/types.js.map +1 -0
- package/package.json +3 -3
- package/src/aria-helpers/nav-menu.aria.ts +11 -0
- package/src/components/Button.tsx +4 -0
- package/src/components/NavMenuLink.tsx +21 -0
- package/src/components/NavMenuList.tsx +61 -0
- package/src/components/NavMenuTrigger.tsx +89 -0
- package/src/context/navMenu.tsx +65 -0
- package/src/context/theme.tsx +3 -9
- package/src/index.ts +12 -0
- package/src/types.ts +1 -0
|
@@ -1,8 +1,16 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { AnchorHTMLAttributes } from 'react';
|
|
2
|
+
import { ButtonHTMLAttributes } from 'react';
|
|
3
|
+
import { ElementType } from 'react';
|
|
4
|
+
import { HTMLAttributes } from 'react';
|
|
2
5
|
import { JSX as JSX_2 } from 'react/jsx-runtime';
|
|
3
6
|
import { PropsWithChildren } from 'react';
|
|
4
7
|
import { ReactNode } from 'react';
|
|
8
|
+
import { RefObject } from 'react';
|
|
5
9
|
|
|
10
|
+
/**
|
|
11
|
+
* A component that allows the user to perform actions
|
|
12
|
+
* @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx
|
|
13
|
+
*/
|
|
6
14
|
declare function Button(props: ButtonProps): JSX_2.Element;
|
|
7
15
|
export { Button }
|
|
8
16
|
export { Button as Button_alias_1 }
|
|
@@ -19,6 +27,13 @@ declare type ColorModes = 'light' | 'dark';
|
|
|
19
27
|
export { ColorModes }
|
|
20
28
|
export { ColorModes as ColorModes_alias_1 }
|
|
21
29
|
|
|
30
|
+
declare function createNavTriggerProps(values: NavTriggerAriaValues): {
|
|
31
|
+
"aria-controls": string;
|
|
32
|
+
"aria-expanded": boolean;
|
|
33
|
+
};
|
|
34
|
+
export { createNavTriggerProps }
|
|
35
|
+
export { createNavTriggerProps as createNavTriggerProps_alias_1 }
|
|
36
|
+
|
|
22
37
|
declare type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K;
|
|
23
38
|
export { CustomThemes }
|
|
24
39
|
export { CustomThemes as CustomThemes_alias_1 }
|
|
@@ -27,10 +42,86 @@ declare type DefaultThemes = 'cerberus';
|
|
|
27
42
|
export { DefaultThemes }
|
|
28
43
|
export { DefaultThemes as DefaultThemes_alias_1 }
|
|
29
44
|
|
|
45
|
+
declare function getPosition(position: Positions): {
|
|
46
|
+
left: string;
|
|
47
|
+
right: string;
|
|
48
|
+
top: string;
|
|
49
|
+
bottom: string;
|
|
50
|
+
};
|
|
51
|
+
export { getPosition }
|
|
52
|
+
export { getPosition as getPosition_alias_1 }
|
|
53
|
+
|
|
30
54
|
declare const MODE_KEY = "cerberus-mode";
|
|
31
55
|
export { MODE_KEY }
|
|
32
56
|
export { MODE_KEY as MODE_KEY_alias_1 }
|
|
33
57
|
|
|
58
|
+
declare function NavMenu(props: PropsWithChildren): JSX_2.Element;
|
|
59
|
+
export { NavMenu }
|
|
60
|
+
export { NavMenu as NavMenu_alias_1 }
|
|
61
|
+
|
|
62
|
+
declare interface NavMenuContextValue {
|
|
63
|
+
triggerRef: NavTriggerRef | null;
|
|
64
|
+
menuRef: NavMenuRef | null;
|
|
65
|
+
expanded: boolean;
|
|
66
|
+
onToggle: () => void;
|
|
67
|
+
}
|
|
68
|
+
export { NavMenuContextValue }
|
|
69
|
+
export { NavMenuContextValue as NavMenuContextValue_alias_1 }
|
|
70
|
+
|
|
71
|
+
declare function NavMenuLink(props: NavMenuLinkProps): JSX_2.Element;
|
|
72
|
+
export { NavMenuLink }
|
|
73
|
+
export { NavMenuLink as NavMenuLink_alias_1 }
|
|
74
|
+
|
|
75
|
+
declare interface NavMenuLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
76
|
+
as?: ElementType;
|
|
77
|
+
}
|
|
78
|
+
export { NavMenuLinkProps }
|
|
79
|
+
export { NavMenuLinkProps as NavMenuLinkProps_alias_1 }
|
|
80
|
+
|
|
81
|
+
declare function NavMenuList(props: NavMenuListProps): JSX_2.Element;
|
|
82
|
+
export { NavMenuList }
|
|
83
|
+
export { NavMenuList as NavMenuList_alias_1 }
|
|
84
|
+
|
|
85
|
+
declare interface NavMenuListProps extends HTMLAttributes<HTMLUListElement> {
|
|
86
|
+
id: string;
|
|
87
|
+
position?: Positions;
|
|
88
|
+
}
|
|
89
|
+
export { NavMenuListProps }
|
|
90
|
+
export { NavMenuListProps as NavMenuListProps_alias_1 }
|
|
91
|
+
|
|
92
|
+
declare type NavMenuRef = RefObject<HTMLUListElement>;
|
|
93
|
+
export { NavMenuRef }
|
|
94
|
+
export { NavMenuRef as NavMenuRef_alias_1 }
|
|
95
|
+
|
|
96
|
+
/**
|
|
97
|
+
* A component that allows the user to trigger a navigation menu.
|
|
98
|
+
* @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/NavMenuTrigger.tsx
|
|
99
|
+
*/
|
|
100
|
+
declare function NavMenuTrigger(props: NavMenuTriggerProps): JSX_2.Element;
|
|
101
|
+
export { NavMenuTrigger }
|
|
102
|
+
export { NavMenuTrigger as NavMenuTrigger_alias_1 }
|
|
103
|
+
|
|
104
|
+
declare interface NavMenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonProps, NavTriggerAriaValues {
|
|
105
|
+
as?: ElementType;
|
|
106
|
+
}
|
|
107
|
+
export { NavMenuTriggerProps }
|
|
108
|
+
export { NavMenuTriggerProps as NavMenuTriggerProps_alias_1 }
|
|
109
|
+
|
|
110
|
+
declare interface NavTriggerAriaValues {
|
|
111
|
+
controls: string;
|
|
112
|
+
expanded?: boolean;
|
|
113
|
+
}
|
|
114
|
+
export { NavTriggerAriaValues }
|
|
115
|
+
export { NavTriggerAriaValues as NavTriggerAriaValues_alias_1 }
|
|
116
|
+
|
|
117
|
+
declare type NavTriggerRef = RefObject<HTMLButtonElement>;
|
|
118
|
+
export { NavTriggerRef }
|
|
119
|
+
export { NavTriggerRef as NavTriggerRef_alias_1 }
|
|
120
|
+
|
|
121
|
+
declare type Positions = 'top' | 'right' | 'bottom' | 'left';
|
|
122
|
+
export { Positions }
|
|
123
|
+
export { Positions as Positions_alias_1 }
|
|
124
|
+
|
|
34
125
|
/**
|
|
35
126
|
* Conditionally render its children or an optional fallback component
|
|
36
127
|
* based on the SolidJS component.
|
|
@@ -64,6 +155,10 @@ declare function ThemeProvider(props: PropsWithChildren<unknown>): JSX_2.Element
|
|
|
64
155
|
export { ThemeProvider }
|
|
65
156
|
export { ThemeProvider as ThemeProvider_alias_1 }
|
|
66
157
|
|
|
158
|
+
declare function useNavMenuContext(): NavMenuContextValue;
|
|
159
|
+
export { useNavMenuContext }
|
|
160
|
+
export { useNavMenuContext as useNavMenuContext_alias_1 }
|
|
161
|
+
|
|
67
162
|
declare function useTheme<C extends string = DefaultThemes>(defaultTheme?: CustomThemes<C>, defaultColorMode?: ColorModes): {
|
|
68
163
|
theme: CustomThemes<C>;
|
|
69
164
|
mode: ColorModes;
|
|
@@ -1,8 +1,16 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { AnchorHTMLAttributes } from 'react';
|
|
2
|
+
import { ButtonHTMLAttributes } from 'react';
|
|
3
|
+
import { ElementType } from 'react';
|
|
4
|
+
import { HTMLAttributes } from 'react';
|
|
2
5
|
import { JSX as JSX_2 } from 'react/jsx-runtime';
|
|
3
6
|
import { PropsWithChildren } from 'react';
|
|
4
7
|
import { ReactNode } from 'react';
|
|
8
|
+
import { RefObject } from 'react';
|
|
5
9
|
|
|
10
|
+
/**
|
|
11
|
+
* A component that allows the user to perform actions
|
|
12
|
+
* @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx
|
|
13
|
+
*/
|
|
6
14
|
declare function Button(props: ButtonProps): JSX_2.Element;
|
|
7
15
|
export { Button }
|
|
8
16
|
export { Button as Button_alias_1 }
|
|
@@ -19,6 +27,13 @@ declare type ColorModes = 'light' | 'dark';
|
|
|
19
27
|
export { ColorModes }
|
|
20
28
|
export { ColorModes as ColorModes_alias_1 }
|
|
21
29
|
|
|
30
|
+
declare function createNavTriggerProps(values: NavTriggerAriaValues): {
|
|
31
|
+
"aria-controls": string;
|
|
32
|
+
"aria-expanded": boolean;
|
|
33
|
+
};
|
|
34
|
+
export { createNavTriggerProps }
|
|
35
|
+
export { createNavTriggerProps as createNavTriggerProps_alias_1 }
|
|
36
|
+
|
|
22
37
|
declare type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K;
|
|
23
38
|
export { CustomThemes }
|
|
24
39
|
export { CustomThemes as CustomThemes_alias_1 }
|
|
@@ -27,10 +42,86 @@ declare type DefaultThemes = 'cerberus';
|
|
|
27
42
|
export { DefaultThemes }
|
|
28
43
|
export { DefaultThemes as DefaultThemes_alias_1 }
|
|
29
44
|
|
|
45
|
+
declare function getPosition(position: Positions): {
|
|
46
|
+
left: string;
|
|
47
|
+
right: string;
|
|
48
|
+
top: string;
|
|
49
|
+
bottom: string;
|
|
50
|
+
};
|
|
51
|
+
export { getPosition }
|
|
52
|
+
export { getPosition as getPosition_alias_1 }
|
|
53
|
+
|
|
30
54
|
declare const MODE_KEY = "cerberus-mode";
|
|
31
55
|
export { MODE_KEY }
|
|
32
56
|
export { MODE_KEY as MODE_KEY_alias_1 }
|
|
33
57
|
|
|
58
|
+
declare function NavMenu(props: PropsWithChildren): JSX_2.Element;
|
|
59
|
+
export { NavMenu }
|
|
60
|
+
export { NavMenu as NavMenu_alias_1 }
|
|
61
|
+
|
|
62
|
+
declare interface NavMenuContextValue {
|
|
63
|
+
triggerRef: NavTriggerRef | null;
|
|
64
|
+
menuRef: NavMenuRef | null;
|
|
65
|
+
expanded: boolean;
|
|
66
|
+
onToggle: () => void;
|
|
67
|
+
}
|
|
68
|
+
export { NavMenuContextValue }
|
|
69
|
+
export { NavMenuContextValue as NavMenuContextValue_alias_1 }
|
|
70
|
+
|
|
71
|
+
declare function NavMenuLink(props: NavMenuLinkProps): JSX_2.Element;
|
|
72
|
+
export { NavMenuLink }
|
|
73
|
+
export { NavMenuLink as NavMenuLink_alias_1 }
|
|
74
|
+
|
|
75
|
+
declare interface NavMenuLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
76
|
+
as?: ElementType;
|
|
77
|
+
}
|
|
78
|
+
export { NavMenuLinkProps }
|
|
79
|
+
export { NavMenuLinkProps as NavMenuLinkProps_alias_1 }
|
|
80
|
+
|
|
81
|
+
declare function NavMenuList(props: NavMenuListProps): JSX_2.Element;
|
|
82
|
+
export { NavMenuList }
|
|
83
|
+
export { NavMenuList as NavMenuList_alias_1 }
|
|
84
|
+
|
|
85
|
+
declare interface NavMenuListProps extends HTMLAttributes<HTMLUListElement> {
|
|
86
|
+
id: string;
|
|
87
|
+
position?: Positions;
|
|
88
|
+
}
|
|
89
|
+
export { NavMenuListProps }
|
|
90
|
+
export { NavMenuListProps as NavMenuListProps_alias_1 }
|
|
91
|
+
|
|
92
|
+
declare type NavMenuRef = RefObject<HTMLUListElement>;
|
|
93
|
+
export { NavMenuRef }
|
|
94
|
+
export { NavMenuRef as NavMenuRef_alias_1 }
|
|
95
|
+
|
|
96
|
+
/**
|
|
97
|
+
* A component that allows the user to trigger a navigation menu.
|
|
98
|
+
* @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/NavMenuTrigger.tsx
|
|
99
|
+
*/
|
|
100
|
+
declare function NavMenuTrigger(props: NavMenuTriggerProps): JSX_2.Element;
|
|
101
|
+
export { NavMenuTrigger }
|
|
102
|
+
export { NavMenuTrigger as NavMenuTrigger_alias_1 }
|
|
103
|
+
|
|
104
|
+
declare interface NavMenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonProps, NavTriggerAriaValues {
|
|
105
|
+
as?: ElementType;
|
|
106
|
+
}
|
|
107
|
+
export { NavMenuTriggerProps }
|
|
108
|
+
export { NavMenuTriggerProps as NavMenuTriggerProps_alias_1 }
|
|
109
|
+
|
|
110
|
+
declare interface NavTriggerAriaValues {
|
|
111
|
+
controls: string;
|
|
112
|
+
expanded?: boolean;
|
|
113
|
+
}
|
|
114
|
+
export { NavTriggerAriaValues }
|
|
115
|
+
export { NavTriggerAriaValues as NavTriggerAriaValues_alias_1 }
|
|
116
|
+
|
|
117
|
+
declare type NavTriggerRef = RefObject<HTMLButtonElement>;
|
|
118
|
+
export { NavTriggerRef }
|
|
119
|
+
export { NavTriggerRef as NavTriggerRef_alias_1 }
|
|
120
|
+
|
|
121
|
+
declare type Positions = 'top' | 'right' | 'bottom' | 'left';
|
|
122
|
+
export { Positions }
|
|
123
|
+
export { Positions as Positions_alias_1 }
|
|
124
|
+
|
|
34
125
|
/**
|
|
35
126
|
* Conditionally render its children or an optional fallback component
|
|
36
127
|
* based on the SolidJS component.
|
|
@@ -64,6 +155,10 @@ declare function ThemeProvider(props: PropsWithChildren<unknown>): JSX_2.Element
|
|
|
64
155
|
export { ThemeProvider }
|
|
65
156
|
export { ThemeProvider as ThemeProvider_alias_1 }
|
|
66
157
|
|
|
158
|
+
declare function useNavMenuContext(): NavMenuContextValue;
|
|
159
|
+
export { useNavMenuContext }
|
|
160
|
+
export { useNavMenuContext as useNavMenuContext_alias_1 }
|
|
161
|
+
|
|
67
162
|
declare function useTheme<C extends string = DefaultThemes>(defaultTheme?: CustomThemes<C>, defaultColorMode?: ColorModes): {
|
|
68
163
|
theme: CustomThemes<C>;
|
|
69
164
|
mode: ColorModes;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/aria-helpers/nav-menu.aria.ts
|
|
21
|
+
var nav_menu_aria_exports = {};
|
|
22
|
+
__export(nav_menu_aria_exports, {
|
|
23
|
+
createNavTriggerProps: () => createNavTriggerProps
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(nav_menu_aria_exports);
|
|
26
|
+
function createNavTriggerProps(values) {
|
|
27
|
+
return {
|
|
28
|
+
["aria-controls"]: values.controls,
|
|
29
|
+
["aria-expanded"]: values.expanded ?? false
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
33
|
+
0 && (module.exports = {
|
|
34
|
+
createNavTriggerProps
|
|
35
|
+
});
|
|
36
|
+
//# sourceMappingURL=nav-menu.aria.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/aria-helpers/nav-menu.aria.ts"],"sourcesContent":["export interface NavTriggerAriaValues {\n controls: string\n expanded?: boolean\n}\n\nexport function createNavTriggerProps(values: NavTriggerAriaValues) {\n return {\n ['aria-controls']: values.controls,\n ['aria-expanded']: values.expanded ?? false,\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKO,SAAS,sBAAsB,QAA8B;AAClE,SAAO;AAAA,IACL,CAAC,eAAe,GAAG,OAAO;AAAA,IAC1B,CAAC,eAAe,GAAG,OAAO,YAAY;AAAA,EACxC;AACF;","names":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
// src/aria-helpers/nav-menu.aria.ts
|
|
2
|
+
function createNavTriggerProps(values) {
|
|
3
|
+
return {
|
|
4
|
+
["aria-controls"]: values.controls,
|
|
5
|
+
["aria-expanded"]: values.expanded ?? false
|
|
6
|
+
};
|
|
7
|
+
}
|
|
8
|
+
export {
|
|
9
|
+
createNavTriggerProps
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=nav-menu.aria.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/aria-helpers/nav-menu.aria.ts"],"sourcesContent":["export interface NavTriggerAriaValues {\n controls: string\n expanded?: boolean\n}\n\nexport function createNavTriggerProps(values: NavTriggerAriaValues) {\n return {\n ['aria-controls']: values.controls,\n ['aria-expanded']: values.expanded ?? false,\n }\n}\n"],"mappings":";AAKO,SAAS,sBAAsB,QAA8B;AAClE,SAAO;AAAA,IACL,CAAC,eAAe,GAAG,OAAO;AAAA,IAC1B,CAAC,eAAe,GAAG,OAAO,YAAY;AAAA,EACxC;AACF;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n palette?: 'action' | 'danger'\n usage?: 'filled' | 'outline' | 'text'\n shape?: 'sharp' | 'rounded'\n}\n\nexport function Button(props: ButtonProps) {\n const { palette, usage, shape, ...nativeProps } = props\n return (\n <button\n {...nativeProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,iBAAmB;AACnB,qBAAuB;
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n palette?: 'action' | 'danger'\n usage?: 'filled' | 'outline' | 'text'\n shape?: 'sharp' | 'rounded'\n}\n\n/**\n * A component that allows the user to perform actions\n * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx\n */\nexport function Button(props: ButtonProps) {\n const { palette, usage, shape, ...nativeProps } = props\n return (\n <button\n {...nativeProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,iBAAmB;AACnB,qBAAuB;AAenB;AAHG,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,GAAG,YAAY,IAAI;AAClD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n palette?: 'action' | 'danger'\n usage?: 'filled' | 'outline' | 'text'\n shape?: 'sharp' | 'rounded'\n}\n\nexport function Button(props: ButtonProps) {\n const { palette, usage, shape, ...nativeProps } = props\n return (\n <button\n {...nativeProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n />\n )\n}\n"],"mappings":";AACA,SAAS,UAAU;AACnB,SAAS,cAAc;
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n palette?: 'action' | 'danger'\n usage?: 'filled' | 'outline' | 'text'\n shape?: 'sharp' | 'rounded'\n}\n\n/**\n * A component that allows the user to perform actions\n * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx\n */\nexport function Button(props: ButtonProps) {\n const { palette, usage, shape, ...nativeProps } = props\n return (\n <button\n {...nativeProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n />\n )\n}\n"],"mappings":";AACA,SAAS,UAAU;AACnB,SAAS,cAAc;AAenB;AAHG,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,GAAG,YAAY,IAAI;AAClD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/components/NavMenuLink.tsx
|
|
21
|
+
var NavMenuLink_exports = {};
|
|
22
|
+
__export(NavMenuLink_exports, {
|
|
23
|
+
NavMenuLink: () => NavMenuLink
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(NavMenuLink_exports);
|
|
26
|
+
var import_Show = require("./Show.cjs");
|
|
27
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
28
|
+
function NavMenuLink(props) {
|
|
29
|
+
const { as, ...nativeProps } = props;
|
|
30
|
+
const hasAs = Boolean(as);
|
|
31
|
+
const AsSub = as;
|
|
32
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Show.Show, { when: hasAs, fallback: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { ...nativeProps }), children: hasAs && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AsSub, { ...nativeProps }) }) });
|
|
33
|
+
}
|
|
34
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
35
|
+
0 && (module.exports = {
|
|
36
|
+
NavMenuLink
|
|
37
|
+
});
|
|
38
|
+
//# sourceMappingURL=NavMenuLink.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/NavMenuLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ElementType } from 'react'\nimport { Show } from './Show'\n\nexport interface NavMenuLinkProps\n extends AnchorHTMLAttributes<HTMLAnchorElement> {\n as?: ElementType\n}\n\nexport function NavMenuLink(props: NavMenuLinkProps) {\n const { as, ...nativeProps } = props\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n return (\n <li>\n <Show when={hasAs} fallback={<a {...nativeProps} />}>\n {hasAs && <AsSub {...nativeProps} />}\n </Show>\n </li>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAAqB;AAcc;AAP5B,SAAS,YAAY,OAAyB;AACnD,QAAM,EAAE,IAAI,GAAG,YAAY,IAAI;AAC/B,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,SACE,4CAAC,QACC,sDAAC,oBAAK,MAAM,OAAO,UAAU,4CAAC,OAAG,GAAG,aAAa,GAC9C,mBAAS,4CAAC,SAAO,GAAG,aAAa,GACpC,GACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// src/components/NavMenuLink.tsx
|
|
2
|
+
import { Show } from "./Show.js";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
function NavMenuLink(props) {
|
|
5
|
+
const { as, ...nativeProps } = props;
|
|
6
|
+
const hasAs = Boolean(as);
|
|
7
|
+
const AsSub = as;
|
|
8
|
+
return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Show, { when: hasAs, fallback: /* @__PURE__ */ jsx("a", { ...nativeProps }), children: hasAs && /* @__PURE__ */ jsx(AsSub, { ...nativeProps }) }) });
|
|
9
|
+
}
|
|
10
|
+
export {
|
|
11
|
+
NavMenuLink
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=NavMenuLink.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/NavMenuLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ElementType } from 'react'\nimport { Show } from './Show'\n\nexport interface NavMenuLinkProps\n extends AnchorHTMLAttributes<HTMLAnchorElement> {\n as?: ElementType\n}\n\nexport function NavMenuLink(props: NavMenuLinkProps) {\n const { as, ...nativeProps } = props\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n return (\n <li>\n <Show when={hasAs} fallback={<a {...nativeProps} />}>\n {hasAs && <AsSub {...nativeProps} />}\n </Show>\n </li>\n )\n}\n"],"mappings":";AACA,SAAS,YAAY;AAcc;AAP5B,SAAS,YAAY,OAAyB;AACnD,QAAM,EAAE,IAAI,GAAG,YAAY,IAAI;AAC/B,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,SACE,oBAAC,QACC,8BAAC,QAAK,MAAM,OAAO,UAAU,oBAAC,OAAG,GAAG,aAAa,GAC9C,mBAAS,oBAAC,SAAO,GAAG,aAAa,GACpC,GACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
|
|
21
|
+
// src/components/NavMenuList.tsx
|
|
22
|
+
var NavMenuList_exports = {};
|
|
23
|
+
__export(NavMenuList_exports, {
|
|
24
|
+
NavMenuList: () => NavMenuList,
|
|
25
|
+
getPosition: () => getPosition
|
|
26
|
+
});
|
|
27
|
+
module.exports = __toCommonJS(NavMenuList_exports);
|
|
28
|
+
var import_react = require("react");
|
|
29
|
+
var import_navMenu = require("../context/navMenu.cjs");
|
|
30
|
+
var import_Show = require("./Show.cjs");
|
|
31
|
+
var import_css = require("@cerberus-design/styled-system/css");
|
|
32
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
33
|
+
function getPosition(position) {
|
|
34
|
+
const defaultPositions = {
|
|
35
|
+
left: "auto",
|
|
36
|
+
right: "auto",
|
|
37
|
+
top: "auto",
|
|
38
|
+
bottom: "auto"
|
|
39
|
+
};
|
|
40
|
+
switch (position) {
|
|
41
|
+
case "right":
|
|
42
|
+
return { ...defaultPositions, bottom: "50%", left: "110%" };
|
|
43
|
+
case "left":
|
|
44
|
+
return { ...defaultPositions, bottom: "50%", right: "110%" };
|
|
45
|
+
case "bottom":
|
|
46
|
+
return { ...defaultPositions, top: "110%" };
|
|
47
|
+
case "top":
|
|
48
|
+
return { ...defaultPositions, bottom: "110%" };
|
|
49
|
+
default:
|
|
50
|
+
return defaultPositions;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
function NavMenuList(props) {
|
|
54
|
+
const { position, ...nativeProps } = props;
|
|
55
|
+
const { menuRef, expanded } = (0, import_navMenu.useNavMenuContext)();
|
|
56
|
+
const locationStyles = (0, import_react.useMemo)(
|
|
57
|
+
() => getPosition(position ?? "bottom"),
|
|
58
|
+
[position]
|
|
59
|
+
);
|
|
60
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Show.Show, { when: expanded, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
61
|
+
"ul",
|
|
62
|
+
{
|
|
63
|
+
...nativeProps,
|
|
64
|
+
className: (0, import_css.cx)(
|
|
65
|
+
nativeProps.className,
|
|
66
|
+
(0, import_css.css)({
|
|
67
|
+
position: "absolute",
|
|
68
|
+
zIndex: "dropdown"
|
|
69
|
+
})
|
|
70
|
+
),
|
|
71
|
+
ref: menuRef,
|
|
72
|
+
style: locationStyles
|
|
73
|
+
}
|
|
74
|
+
) });
|
|
75
|
+
}
|
|
76
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
77
|
+
0 && (module.exports = {
|
|
78
|
+
NavMenuList,
|
|
79
|
+
getPosition
|
|
80
|
+
});
|
|
81
|
+
//# sourceMappingURL=NavMenuList.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/NavMenuList.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type HTMLAttributes } from 'react'\nimport { useNavMenuContext } from '../context/navMenu'\nimport { Show } from './Show'\nimport type { Positions } from '../types'\nimport { css, cx } from '@cerberus-design/styled-system/css'\n\nexport function getPosition(position: Positions) {\n const defaultPositions = {\n left: 'auto',\n right: 'auto',\n top: 'auto',\n bottom: 'auto',\n }\n switch (position) {\n case 'right':\n return { ...defaultPositions, bottom: '50%', left: '110%' }\n case 'left':\n return { ...defaultPositions, bottom: '50%', right: '110%' }\n case 'bottom':\n return { ...defaultPositions, top: '110%' }\n case 'top':\n return { ...defaultPositions, bottom: '110%' }\n default:\n return defaultPositions\n }\n}\n\n// <NavMenuList />\n\nexport interface NavMenuListProps extends HTMLAttributes<HTMLUListElement> {\n id: string\n position?: Positions\n}\n\nexport function NavMenuList(props: NavMenuListProps) {\n const { position, ...nativeProps } = props\n const { menuRef, expanded } = useNavMenuContext()\n const locationStyles = useMemo(\n () => getPosition(position ?? 'bottom'),\n [position],\n )\n\n return (\n <Show when={expanded}>\n <ul\n {...nativeProps}\n className={cx(\n nativeProps.className,\n css({\n position: 'absolute',\n zIndex: 'dropdown',\n }),\n )}\n ref={menuRef}\n style={locationStyles}\n />\n </Show>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA6C;AAC7C,qBAAkC;AAClC,kBAAqB;AAErB,iBAAwB;AAwClB;AAtCC,SAAS,YAAY,UAAqB;AAC/C,QAAM,mBAAmB;AAAA,IACvB,MAAM;AAAA,IACN,OAAO;AAAA,IACP,KAAK;AAAA,IACL,QAAQ;AAAA,EACV;AACA,UAAQ,UAAU;AAAA,IAChB,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,QAAQ,OAAO,MAAM,OAAO;AAAA,IAC5D,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,QAAQ,OAAO,OAAO,OAAO;AAAA,IAC7D,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,KAAK,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,QAAQ,OAAO;AAAA,IAC/C;AACE,aAAO;AAAA,EACX;AACF;AASO,SAAS,YAAY,OAAyB;AACnD,QAAM,EAAE,UAAU,GAAG,YAAY,IAAI;AACrC,QAAM,EAAE,SAAS,SAAS,QAAI,kCAAkB;AAChD,QAAM,qBAAiB;AAAA,IACrB,MAAM,YAAY,YAAY,QAAQ;AAAA,IACtC,CAAC,QAAQ;AAAA,EACX;AAEA,SACE,4CAAC,oBAAK,MAAM,UACV;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,gBAAI;AAAA,UACF,UAAU;AAAA,UACV,QAAQ;AAAA,QACV,CAAC;AAAA,MACH;AAAA,MACA,KAAK;AAAA,MACL,OAAO;AAAA;AAAA,EACT,GACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/components/NavMenuList.tsx
|
|
4
|
+
import { useMemo } from "react";
|
|
5
|
+
import { useNavMenuContext } from "../context/navMenu.js";
|
|
6
|
+
import { Show } from "./Show.js";
|
|
7
|
+
import { css, cx } from "@cerberus-design/styled-system/css";
|
|
8
|
+
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
function getPosition(position) {
|
|
10
|
+
const defaultPositions = {
|
|
11
|
+
left: "auto",
|
|
12
|
+
right: "auto",
|
|
13
|
+
top: "auto",
|
|
14
|
+
bottom: "auto"
|
|
15
|
+
};
|
|
16
|
+
switch (position) {
|
|
17
|
+
case "right":
|
|
18
|
+
return { ...defaultPositions, bottom: "50%", left: "110%" };
|
|
19
|
+
case "left":
|
|
20
|
+
return { ...defaultPositions, bottom: "50%", right: "110%" };
|
|
21
|
+
case "bottom":
|
|
22
|
+
return { ...defaultPositions, top: "110%" };
|
|
23
|
+
case "top":
|
|
24
|
+
return { ...defaultPositions, bottom: "110%" };
|
|
25
|
+
default:
|
|
26
|
+
return defaultPositions;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
function NavMenuList(props) {
|
|
30
|
+
const { position, ...nativeProps } = props;
|
|
31
|
+
const { menuRef, expanded } = useNavMenuContext();
|
|
32
|
+
const locationStyles = useMemo(
|
|
33
|
+
() => getPosition(position ?? "bottom"),
|
|
34
|
+
[position]
|
|
35
|
+
);
|
|
36
|
+
return /* @__PURE__ */ jsx(Show, { when: expanded, children: /* @__PURE__ */ jsx(
|
|
37
|
+
"ul",
|
|
38
|
+
{
|
|
39
|
+
...nativeProps,
|
|
40
|
+
className: cx(
|
|
41
|
+
nativeProps.className,
|
|
42
|
+
css({
|
|
43
|
+
position: "absolute",
|
|
44
|
+
zIndex: "dropdown"
|
|
45
|
+
})
|
|
46
|
+
),
|
|
47
|
+
ref: menuRef,
|
|
48
|
+
style: locationStyles
|
|
49
|
+
}
|
|
50
|
+
) });
|
|
51
|
+
}
|
|
52
|
+
export {
|
|
53
|
+
NavMenuList,
|
|
54
|
+
getPosition
|
|
55
|
+
};
|
|
56
|
+
//# sourceMappingURL=NavMenuList.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/NavMenuList.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type HTMLAttributes } from 'react'\nimport { useNavMenuContext } from '../context/navMenu'\nimport { Show } from './Show'\nimport type { Positions } from '../types'\nimport { css, cx } from '@cerberus-design/styled-system/css'\n\nexport function getPosition(position: Positions) {\n const defaultPositions = {\n left: 'auto',\n right: 'auto',\n top: 'auto',\n bottom: 'auto',\n }\n switch (position) {\n case 'right':\n return { ...defaultPositions, bottom: '50%', left: '110%' }\n case 'left':\n return { ...defaultPositions, bottom: '50%', right: '110%' }\n case 'bottom':\n return { ...defaultPositions, top: '110%' }\n case 'top':\n return { ...defaultPositions, bottom: '110%' }\n default:\n return defaultPositions\n }\n}\n\n// <NavMenuList />\n\nexport interface NavMenuListProps extends HTMLAttributes<HTMLUListElement> {\n id: string\n position?: Positions\n}\n\nexport function NavMenuList(props: NavMenuListProps) {\n const { position, ...nativeProps } = props\n const { menuRef, expanded } = useNavMenuContext()\n const locationStyles = useMemo(\n () => getPosition(position ?? 'bottom'),\n [position],\n )\n\n return (\n <Show when={expanded}>\n <ul\n {...nativeProps}\n className={cx(\n nativeProps.className,\n css({\n position: 'absolute',\n zIndex: 'dropdown',\n }),\n )}\n ref={menuRef}\n style={locationStyles}\n />\n </Show>\n )\n}\n"],"mappings":";;;AAEA,SAAS,eAAoC;AAC7C,SAAS,yBAAyB;AAClC,SAAS,YAAY;AAErB,SAAS,KAAK,UAAU;AAwClB;AAtCC,SAAS,YAAY,UAAqB;AAC/C,QAAM,mBAAmB;AAAA,IACvB,MAAM;AAAA,IACN,OAAO;AAAA,IACP,KAAK;AAAA,IACL,QAAQ;AAAA,EACV;AACA,UAAQ,UAAU;AAAA,IAChB,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,QAAQ,OAAO,MAAM,OAAO;AAAA,IAC5D,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,QAAQ,OAAO,OAAO,OAAO;AAAA,IAC7D,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,KAAK,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,QAAQ,OAAO;AAAA,IAC/C;AACE,aAAO;AAAA,EACX;AACF;AASO,SAAS,YAAY,OAAyB;AACnD,QAAM,EAAE,UAAU,GAAG,YAAY,IAAI;AACrC,QAAM,EAAE,SAAS,SAAS,IAAI,kBAAkB;AAChD,QAAM,iBAAiB;AAAA,IACrB,MAAM,YAAY,YAAY,QAAQ;AAAA,IACtC,CAAC,QAAQ;AAAA,EACX;AAEA,SACE,oBAAC,QAAK,MAAM,UACV;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,IAAI;AAAA,UACF,UAAU;AAAA,UACV,QAAQ;AAAA,QACV,CAAC;AAAA,MACH;AAAA,MACA,KAAK;AAAA,MACL,OAAO;AAAA;AAAA,EACT,GACF;AAEJ;","names":[]}
|