@cerberus-design/react 0.0.1-next-0a882b5 → 0.0.1-next-07911db

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.
Files changed (50) hide show
  1. package/build/legacy/_tsup-dts-rollup.d.cts +57 -24
  2. package/build/legacy/_tsup-dts-rollup.d.ts +57 -24
  3. package/build/legacy/aria-helpers/nav-menu.aria.cjs.map +1 -1
  4. package/build/legacy/aria-helpers/nav-menu.aria.js.map +1 -1
  5. package/build/legacy/components/Button.cjs.map +1 -1
  6. package/build/legacy/components/Button.js.map +1 -1
  7. package/build/legacy/components/NavMenuLink.cjs.map +1 -1
  8. package/build/legacy/components/NavMenuLink.js.map +1 -1
  9. package/build/legacy/components/NavMenuList.cjs.map +1 -1
  10. package/build/legacy/components/NavMenuList.js.map +1 -1
  11. package/build/legacy/components/NavMenuTrigger.cjs.map +1 -1
  12. package/build/legacy/components/NavMenuTrigger.js.map +1 -1
  13. package/build/legacy/components/Show.cjs.map +1 -1
  14. package/build/legacy/components/Show.js.map +1 -1
  15. package/build/legacy/context/navMenu.cjs.map +1 -1
  16. package/build/legacy/context/navMenu.js.map +1 -1
  17. package/build/legacy/context/theme.cjs.map +1 -1
  18. package/build/legacy/context/theme.js.map +1 -1
  19. package/build/legacy/hooks/useTheme.cjs.map +1 -1
  20. package/build/legacy/hooks/useTheme.js.map +1 -1
  21. package/build/modern/_tsup-dts-rollup.d.cts +57 -24
  22. package/build/modern/_tsup-dts-rollup.d.ts +57 -24
  23. package/build/modern/aria-helpers/nav-menu.aria.cjs.map +1 -1
  24. package/build/modern/aria-helpers/nav-menu.aria.js.map +1 -1
  25. package/build/modern/components/Button.cjs.map +1 -1
  26. package/build/modern/components/Button.js.map +1 -1
  27. package/build/modern/components/NavMenuLink.cjs.map +1 -1
  28. package/build/modern/components/NavMenuLink.js.map +1 -1
  29. package/build/modern/components/NavMenuList.cjs.map +1 -1
  30. package/build/modern/components/NavMenuList.js.map +1 -1
  31. package/build/modern/components/NavMenuTrigger.cjs.map +1 -1
  32. package/build/modern/components/NavMenuTrigger.js.map +1 -1
  33. package/build/modern/components/Show.cjs.map +1 -1
  34. package/build/modern/components/Show.js.map +1 -1
  35. package/build/modern/context/navMenu.cjs.map +1 -1
  36. package/build/modern/context/navMenu.js.map +1 -1
  37. package/build/modern/context/theme.cjs.map +1 -1
  38. package/build/modern/context/theme.js.map +1 -1
  39. package/build/modern/hooks/useTheme.cjs.map +1 -1
  40. package/build/modern/hooks/useTheme.js.map +1 -1
  41. package/package.json +2 -2
  42. package/src/aria-helpers/nav-menu.aria.ts +8 -1
  43. package/src/components/Button.tsx +1 -1
  44. package/src/components/NavMenuLink.tsx +1 -1
  45. package/src/components/NavMenuList.tsx +22 -4
  46. package/src/components/NavMenuTrigger.tsx +10 -2
  47. package/src/components/Show.tsx +7 -2
  48. package/src/context/navMenu.tsx +2 -2
  49. package/src/context/theme.tsx +11 -2
  50. package/src/hooks/useTheme.ts +2 -1
@@ -2,7 +2,6 @@ import type { AnchorHTMLAttributes } from 'react';
2
2
  import { ButtonHTMLAttributes } from 'react';
3
3
  import { ElementType } from 'react';
4
4
  import { HTMLAttributes } from 'react';
5
- import { JSX as JSX_2 } from 'react/jsx-runtime';
6
5
  import { PropsWithChildren } from 'react';
7
6
  import { ReactNode } from 'react';
8
7
  import { RefObject } from 'react';
@@ -11,7 +10,7 @@ import { RefObject } from 'react';
11
10
  * A component that allows the user to perform actions
12
11
  * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx
13
12
  */
14
- declare function Button(props: ButtonProps): JSX_2.Element;
13
+ declare function Button(props: ButtonProps): JSX.Element;
15
14
  export { Button }
16
15
  export { Button as Button_alias_1 }
17
16
 
@@ -27,10 +26,7 @@ declare type ColorModes = 'light' | 'dark';
27
26
  export { ColorModes }
28
27
  export { ColorModes as ColorModes_alias_1 }
29
28
 
30
- declare function createNavTriggerProps(values: NavTriggerAriaValues): {
31
- "aria-controls": string;
32
- "aria-expanded": boolean;
33
- };
29
+ declare function createNavTriggerProps(values: NavTriggerAriaValues): NavTriggerAriaReturn;
34
30
  export { createNavTriggerProps }
35
31
  export { createNavTriggerProps as createNavTriggerProps_alias_1 }
36
32
 
@@ -42,20 +38,22 @@ declare type DefaultThemes = 'cerberus';
42
38
  export { DefaultThemes }
43
39
  export { DefaultThemes as DefaultThemes_alias_1 }
44
40
 
45
- declare function getPosition(position: Positions): {
41
+ declare function getPosition(position: Positions): GetPositionResult;
42
+ export { getPosition }
43
+ export { getPosition as getPosition_alias_1 }
44
+
45
+ declare interface GetPositionResult {
46
46
  left: string;
47
47
  right: string;
48
48
  top: string;
49
49
  bottom: string;
50
- };
51
- export { getPosition }
52
- export { getPosition as getPosition_alias_1 }
50
+ }
53
51
 
54
52
  declare const MODE_KEY = "cerberus-mode";
55
53
  export { MODE_KEY }
56
54
  export { MODE_KEY as MODE_KEY_alias_1 }
57
55
 
58
- declare function NavMenu(props: PropsWithChildren): JSX_2.Element;
56
+ declare function NavMenu(props: PropsWithChildren): JSX.Element;
59
57
  export { NavMenu }
60
58
  export { NavMenu as NavMenu_alias_1 }
61
59
 
@@ -68,7 +66,7 @@ declare interface NavMenuContextValue {
68
66
  export { NavMenuContextValue }
69
67
  export { NavMenuContextValue as NavMenuContextValue_alias_1 }
70
68
 
71
- declare function NavMenuLink(props: NavMenuLinkProps): JSX_2.Element;
69
+ declare function NavMenuLink(props: NavMenuLinkProps): JSX.Element;
72
70
  export { NavMenuLink }
73
71
  export { NavMenuLink as NavMenuLink_alias_1 }
74
72
 
@@ -78,7 +76,20 @@ declare interface NavMenuLinkProps extends AnchorHTMLAttributes<HTMLAnchorElemen
78
76
  export { NavMenuLinkProps }
79
77
  export { NavMenuLinkProps as NavMenuLinkProps_alias_1 }
80
78
 
81
- declare function NavMenuList(props: NavMenuListProps): JSX_2.Element;
79
+ /**
80
+ * A component that allows the user to display a menu of navigation links.
81
+ * @definition [Disclosure Nav](https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-navigation/)
82
+ * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)
83
+ *
84
+ * @example
85
+ * ```tsx
86
+ * <NavMenuList id="nav-menu-list" position="bottom">
87
+ * <NavMenuLink href="/home">Home</NavMenuLink>
88
+ * <NavMenuLink href="/about">About</NavMenuLink>
89
+ * </NavMenuList>
90
+ * ```
91
+ **/
92
+ declare function NavMenuList(props: NavMenuListProps): JSX.Element;
82
93
  export { NavMenuList }
83
94
  export { NavMenuList as NavMenuList_alias_1 }
84
95
 
@@ -95,9 +106,17 @@ export { NavMenuRef as NavMenuRef_alias_1 }
95
106
 
96
107
  /**
97
108
  * 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
109
+ * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)
110
+ * @example
111
+ * ```tsx
112
+ * <NavMenu>
113
+ * <NavMenuTrigger controls="nav-menu-list">
114
+ * Menu
115
+ * </NavMenuTrigger>
116
+ * </NavMenu>
117
+ * ```
99
118
  */
100
- declare function NavMenuTrigger(props: NavMenuTriggerProps): JSX_2.Element;
119
+ declare function NavMenuTrigger(props: NavMenuTriggerProps): JSX.Element;
101
120
  export { NavMenuTrigger }
102
121
  export { NavMenuTrigger as NavMenuTrigger_alias_1 }
103
122
 
@@ -107,6 +126,11 @@ declare interface NavMenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonEle
107
126
  export { NavMenuTriggerProps }
108
127
  export { NavMenuTriggerProps as NavMenuTriggerProps_alias_1 }
109
128
 
129
+ declare interface NavTriggerAriaReturn {
130
+ ['aria-controls']: string;
131
+ ['aria-expanded']: boolean;
132
+ }
133
+
110
134
  declare interface NavTriggerAriaValues {
111
135
  controls: string;
112
136
  expanded?: boolean;
@@ -125,7 +149,12 @@ export { Positions as Positions_alias_1 }
125
149
  /**
126
150
  * Conditionally render its children or an optional fallback component
127
151
  * based on the SolidJS component.
128
- * @description https://docs.solidjs.com/reference/components/show
152
+ * @definition [Show docs](https://cerberus.digitalu.design/react/show)
153
+ * @example
154
+ * ```tsx
155
+ * <Show when={condition}>
156
+ * <div>Content</div>
157
+ * </Show>
129
158
  */
130
159
  declare function Show(props: PropsWithChildren<ShowProps>): ReactNode;
131
160
  export { Show }
@@ -142,7 +171,7 @@ declare const THEME_KEY = "cerberus-theme";
142
171
  export { THEME_KEY }
143
172
  export { THEME_KEY as THEME_KEY_alias_1 }
144
173
 
145
- declare interface ThemeContextValue<T extends DefaultThemes> {
174
+ declare interface ThemeContextValue<T extends string = DefaultThemes> {
146
175
  theme: CustomThemes<T>;
147
176
  mode: ColorModes;
148
177
  updateTheme: (theme: T) => void;
@@ -151,7 +180,16 @@ declare interface ThemeContextValue<T extends DefaultThemes> {
151
180
  export { ThemeContextValue }
152
181
  export { ThemeContextValue as ThemeContextValue_alias_1 }
153
182
 
154
- declare function ThemeProvider(props: PropsWithChildren<unknown>): JSX_2.Element;
183
+ /**
184
+ * A context provider that allows the user to set the theme and mode of the application.
185
+ * @example
186
+ * ```tsx
187
+ * <ThemeProvider>
188
+ * <App />
189
+ * </ThemeProvider>
190
+ * ```
191
+ */
192
+ declare function ThemeProvider(props: PropsWithChildren<unknown>): JSX.Element;
155
193
  export { ThemeProvider }
156
194
  export { ThemeProvider as ThemeProvider_alias_1 }
157
195
 
@@ -159,12 +197,7 @@ declare function useNavMenuContext(): NavMenuContextValue;
159
197
  export { useNavMenuContext }
160
198
  export { useNavMenuContext as useNavMenuContext_alias_1 }
161
199
 
162
- declare function useTheme<C extends string = DefaultThemes>(defaultTheme?: CustomThemes<C>, defaultColorMode?: ColorModes): {
163
- theme: CustomThemes<C>;
164
- mode: ColorModes;
165
- updateTheme: (newTheme: CustomThemes<C>) => void;
166
- updateMode: () => void;
167
- };
200
+ declare function useTheme<C extends string = DefaultThemes>(defaultTheme?: CustomThemes<C>, defaultColorMode?: ColorModes): ThemeContextValue<C>;
168
201
  export { useTheme }
169
202
  export { useTheme as useTheme_alias_1 }
170
203
 
@@ -2,7 +2,6 @@ import type { AnchorHTMLAttributes } from 'react';
2
2
  import { ButtonHTMLAttributes } from 'react';
3
3
  import { ElementType } from 'react';
4
4
  import { HTMLAttributes } from 'react';
5
- import { JSX as JSX_2 } from 'react/jsx-runtime';
6
5
  import { PropsWithChildren } from 'react';
7
6
  import { ReactNode } from 'react';
8
7
  import { RefObject } from 'react';
@@ -11,7 +10,7 @@ import { RefObject } from 'react';
11
10
  * A component that allows the user to perform actions
12
11
  * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/Button.tsx
13
12
  */
14
- declare function Button(props: ButtonProps): JSX_2.Element;
13
+ declare function Button(props: ButtonProps): JSX.Element;
15
14
  export { Button }
16
15
  export { Button as Button_alias_1 }
17
16
 
@@ -27,10 +26,7 @@ declare type ColorModes = 'light' | 'dark';
27
26
  export { ColorModes }
28
27
  export { ColorModes as ColorModes_alias_1 }
29
28
 
30
- declare function createNavTriggerProps(values: NavTriggerAriaValues): {
31
- "aria-controls": string;
32
- "aria-expanded": boolean;
33
- };
29
+ declare function createNavTriggerProps(values: NavTriggerAriaValues): NavTriggerAriaReturn;
34
30
  export { createNavTriggerProps }
35
31
  export { createNavTriggerProps as createNavTriggerProps_alias_1 }
36
32
 
@@ -42,20 +38,22 @@ declare type DefaultThemes = 'cerberus';
42
38
  export { DefaultThemes }
43
39
  export { DefaultThemes as DefaultThemes_alias_1 }
44
40
 
45
- declare function getPosition(position: Positions): {
41
+ declare function getPosition(position: Positions): GetPositionResult;
42
+ export { getPosition }
43
+ export { getPosition as getPosition_alias_1 }
44
+
45
+ declare interface GetPositionResult {
46
46
  left: string;
47
47
  right: string;
48
48
  top: string;
49
49
  bottom: string;
50
- };
51
- export { getPosition }
52
- export { getPosition as getPosition_alias_1 }
50
+ }
53
51
 
54
52
  declare const MODE_KEY = "cerberus-mode";
55
53
  export { MODE_KEY }
56
54
  export { MODE_KEY as MODE_KEY_alias_1 }
57
55
 
58
- declare function NavMenu(props: PropsWithChildren): JSX_2.Element;
56
+ declare function NavMenu(props: PropsWithChildren): JSX.Element;
59
57
  export { NavMenu }
60
58
  export { NavMenu as NavMenu_alias_1 }
61
59
 
@@ -68,7 +66,7 @@ declare interface NavMenuContextValue {
68
66
  export { NavMenuContextValue }
69
67
  export { NavMenuContextValue as NavMenuContextValue_alias_1 }
70
68
 
71
- declare function NavMenuLink(props: NavMenuLinkProps): JSX_2.Element;
69
+ declare function NavMenuLink(props: NavMenuLinkProps): JSX.Element;
72
70
  export { NavMenuLink }
73
71
  export { NavMenuLink as NavMenuLink_alias_1 }
74
72
 
@@ -78,7 +76,20 @@ declare interface NavMenuLinkProps extends AnchorHTMLAttributes<HTMLAnchorElemen
78
76
  export { NavMenuLinkProps }
79
77
  export { NavMenuLinkProps as NavMenuLinkProps_alias_1 }
80
78
 
81
- declare function NavMenuList(props: NavMenuListProps): JSX_2.Element;
79
+ /**
80
+ * A component that allows the user to display a menu of navigation links.
81
+ * @definition [Disclosure Nav](https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-navigation/)
82
+ * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)
83
+ *
84
+ * @example
85
+ * ```tsx
86
+ * <NavMenuList id="nav-menu-list" position="bottom">
87
+ * <NavMenuLink href="/home">Home</NavMenuLink>
88
+ * <NavMenuLink href="/about">About</NavMenuLink>
89
+ * </NavMenuList>
90
+ * ```
91
+ **/
92
+ declare function NavMenuList(props: NavMenuListProps): JSX.Element;
82
93
  export { NavMenuList }
83
94
  export { NavMenuList as NavMenuList_alias_1 }
84
95
 
@@ -95,9 +106,17 @@ export { NavMenuRef as NavMenuRef_alias_1 }
95
106
 
96
107
  /**
97
108
  * 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
109
+ * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)
110
+ * @example
111
+ * ```tsx
112
+ * <NavMenu>
113
+ * <NavMenuTrigger controls="nav-menu-list">
114
+ * Menu
115
+ * </NavMenuTrigger>
116
+ * </NavMenu>
117
+ * ```
99
118
  */
100
- declare function NavMenuTrigger(props: NavMenuTriggerProps): JSX_2.Element;
119
+ declare function NavMenuTrigger(props: NavMenuTriggerProps): JSX.Element;
101
120
  export { NavMenuTrigger }
102
121
  export { NavMenuTrigger as NavMenuTrigger_alias_1 }
103
122
 
@@ -107,6 +126,11 @@ declare interface NavMenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonEle
107
126
  export { NavMenuTriggerProps }
108
127
  export { NavMenuTriggerProps as NavMenuTriggerProps_alias_1 }
109
128
 
129
+ declare interface NavTriggerAriaReturn {
130
+ ['aria-controls']: string;
131
+ ['aria-expanded']: boolean;
132
+ }
133
+
110
134
  declare interface NavTriggerAriaValues {
111
135
  controls: string;
112
136
  expanded?: boolean;
@@ -125,7 +149,12 @@ export { Positions as Positions_alias_1 }
125
149
  /**
126
150
  * Conditionally render its children or an optional fallback component
127
151
  * based on the SolidJS component.
128
- * @description https://docs.solidjs.com/reference/components/show
152
+ * @definition [Show docs](https://cerberus.digitalu.design/react/show)
153
+ * @example
154
+ * ```tsx
155
+ * <Show when={condition}>
156
+ * <div>Content</div>
157
+ * </Show>
129
158
  */
130
159
  declare function Show(props: PropsWithChildren<ShowProps>): ReactNode;
131
160
  export { Show }
@@ -142,7 +171,7 @@ declare const THEME_KEY = "cerberus-theme";
142
171
  export { THEME_KEY }
143
172
  export { THEME_KEY as THEME_KEY_alias_1 }
144
173
 
145
- declare interface ThemeContextValue<T extends DefaultThemes> {
174
+ declare interface ThemeContextValue<T extends string = DefaultThemes> {
146
175
  theme: CustomThemes<T>;
147
176
  mode: ColorModes;
148
177
  updateTheme: (theme: T) => void;
@@ -151,7 +180,16 @@ declare interface ThemeContextValue<T extends DefaultThemes> {
151
180
  export { ThemeContextValue }
152
181
  export { ThemeContextValue as ThemeContextValue_alias_1 }
153
182
 
154
- declare function ThemeProvider(props: PropsWithChildren<unknown>): JSX_2.Element;
183
+ /**
184
+ * A context provider that allows the user to set the theme and mode of the application.
185
+ * @example
186
+ * ```tsx
187
+ * <ThemeProvider>
188
+ * <App />
189
+ * </ThemeProvider>
190
+ * ```
191
+ */
192
+ declare function ThemeProvider(props: PropsWithChildren<unknown>): JSX.Element;
155
193
  export { ThemeProvider }
156
194
  export { ThemeProvider as ThemeProvider_alias_1 }
157
195
 
@@ -159,12 +197,7 @@ declare function useNavMenuContext(): NavMenuContextValue;
159
197
  export { useNavMenuContext }
160
198
  export { useNavMenuContext as useNavMenuContext_alias_1 }
161
199
 
162
- declare function useTheme<C extends string = DefaultThemes>(defaultTheme?: CustomThemes<C>, defaultColorMode?: ColorModes): {
163
- theme: CustomThemes<C>;
164
- mode: ColorModes;
165
- updateTheme: (newTheme: CustomThemes<C>) => void;
166
- updateMode: () => void;
167
- };
200
+ declare function useTheme<C extends string = DefaultThemes>(defaultTheme?: CustomThemes<C>, defaultColorMode?: ColorModes): ThemeContextValue<C>;
168
201
  export { useTheme }
169
202
  export { useTheme as useTheme_alias_1 }
170
203
 
@@ -1 +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":[]}
1
+ {"version":3,"sources":["../../../src/aria-helpers/nav-menu.aria.ts"],"sourcesContent":["export interface NavTriggerAriaValues {\n controls: string\n expanded?: boolean\n}\n\ninterface NavTriggerAriaReturn {\n ['aria-controls']: string\n ['aria-expanded']: boolean\n}\n\nexport function createNavTriggerProps(\n values: NavTriggerAriaValues,\n): NavTriggerAriaReturn {\n return {\n ['aria-controls']: values.controls,\n ['aria-expanded']: values.expanded ?? false,\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAUO,SAAS,sBACd,QACsB;AACtB,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/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
+ {"version":3,"sources":["../../../src/aria-helpers/nav-menu.aria.ts"],"sourcesContent":["export interface NavTriggerAriaValues {\n controls: string\n expanded?: boolean\n}\n\ninterface NavTriggerAriaReturn {\n ['aria-controls']: string\n ['aria-expanded']: boolean\n}\n\nexport function createNavTriggerProps(\n values: NavTriggerAriaValues,\n): NavTriggerAriaReturn {\n return {\n ['aria-controls']: values.controls,\n ['aria-expanded']: values.expanded ?? false,\n }\n}\n"],"mappings":";AAUO,SAAS,sBACd,QACsB;AACtB,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\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
+ {"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): JSX.Element {\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,OAAiC;AACtD,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\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":[]}
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): JSX.Element {\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,OAAiC;AACtD,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":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/NavMenuLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ElementType } from 'react'\nimport { Show } from './Show'\nimport { css, cx } from '@cerberus-design/styled-system/css'\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 className={css({\n w: 'full',\n })}\n >\n <Show\n when={hasAs}\n fallback={\n <a\n {...nativeProps}\n className={cx(\n nativeProps.className,\n css({\n color: 'action.navigation.initial',\n textStyle: 'link',\n _hover: {\n color: 'action.navigation.hover',\n },\n }),\n )}\n />\n }\n >\n {hasAs && <AsSub {...nativeProps} />}\n </Show>\n </li>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAAqB;AACrB,iBAAwB;AAqBd;AAdH,SAAS,YAAY,OAAyB;AACnD,QAAM,EAAE,IAAI,GAAG,YAAY,IAAI;AAC/B,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,gBAAI;AAAA,QACb,GAAG;AAAA,MACL,CAAC;AAAA,MAED;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,UACE;AAAA,YAAC;AAAA;AAAA,cACE,GAAG;AAAA,cACJ,eAAW;AAAA,gBACT,YAAY;AAAA,oBACZ,gBAAI;AAAA,kBACF,OAAO;AAAA,kBACP,WAAW;AAAA,kBACX,QAAQ;AAAA,oBACN,OAAO;AAAA,kBACT;AAAA,gBACF,CAAC;AAAA,cACH;AAAA;AAAA,UACF;AAAA,UAGD,mBAAS,4CAAC,SAAO,GAAG,aAAa;AAAA;AAAA,MACpC;AAAA;AAAA,EACF;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../src/components/NavMenuLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ElementType } from 'react'\nimport { Show } from './Show'\nimport { css, cx } from '@cerberus-design/styled-system/css'\n\nexport interface NavMenuLinkProps\n extends AnchorHTMLAttributes<HTMLAnchorElement> {\n as?: ElementType\n}\n\nexport function NavMenuLink(props: NavMenuLinkProps): JSX.Element {\n const { as, ...nativeProps } = props\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n return (\n <li\n className={css({\n w: 'full',\n })}\n >\n <Show\n when={hasAs}\n fallback={\n <a\n {...nativeProps}\n className={cx(\n nativeProps.className,\n css({\n color: 'action.navigation.initial',\n textStyle: 'link',\n _hover: {\n color: 'action.navigation.hover',\n },\n }),\n )}\n />\n }\n >\n {hasAs && <AsSub {...nativeProps} />}\n </Show>\n </li>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAAqB;AACrB,iBAAwB;AAqBd;AAdH,SAAS,YAAY,OAAsC;AAChE,QAAM,EAAE,IAAI,GAAG,YAAY,IAAI;AAC/B,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,gBAAI;AAAA,QACb,GAAG;AAAA,MACL,CAAC;AAAA,MAED;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,UACE;AAAA,YAAC;AAAA;AAAA,cACE,GAAG;AAAA,cACJ,eAAW;AAAA,gBACT,YAAY;AAAA,oBACZ,gBAAI;AAAA,kBACF,OAAO;AAAA,kBACP,WAAW;AAAA,kBACX,QAAQ;AAAA,oBACN,OAAO;AAAA,kBACT;AAAA,gBACF,CAAC;AAAA,cACH;AAAA;AAAA,UACF;AAAA,UAGD,mBAAS,4CAAC,SAAO,GAAG,aAAa;AAAA;AAAA,MACpC;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/NavMenuLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ElementType } from 'react'\nimport { Show } from './Show'\nimport { css, cx } from '@cerberus-design/styled-system/css'\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 className={css({\n w: 'full',\n })}\n >\n <Show\n when={hasAs}\n fallback={\n <a\n {...nativeProps}\n className={cx(\n nativeProps.className,\n css({\n color: 'action.navigation.initial',\n textStyle: 'link',\n _hover: {\n color: 'action.navigation.hover',\n },\n }),\n )}\n />\n }\n >\n {hasAs && <AsSub {...nativeProps} />}\n </Show>\n </li>\n )\n}\n"],"mappings":";AACA,SAAS,YAAY;AACrB,SAAS,KAAK,UAAU;AAqBd;AAdH,SAAS,YAAY,OAAyB;AACnD,QAAM,EAAE,IAAI,GAAG,YAAY,IAAI;AAC/B,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,IAAI;AAAA,QACb,GAAG;AAAA,MACL,CAAC;AAAA,MAED;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,UACE;AAAA,YAAC;AAAA;AAAA,cACE,GAAG;AAAA,cACJ,WAAW;AAAA,gBACT,YAAY;AAAA,gBACZ,IAAI;AAAA,kBACF,OAAO;AAAA,kBACP,WAAW;AAAA,kBACX,QAAQ;AAAA,oBACN,OAAO;AAAA,kBACT;AAAA,gBACF,CAAC;AAAA,cACH;AAAA;AAAA,UACF;AAAA,UAGD,mBAAS,oBAAC,SAAO,GAAG,aAAa;AAAA;AAAA,MACpC;AAAA;AAAA,EACF;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../src/components/NavMenuLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ElementType } from 'react'\nimport { Show } from './Show'\nimport { css, cx } from '@cerberus-design/styled-system/css'\n\nexport interface NavMenuLinkProps\n extends AnchorHTMLAttributes<HTMLAnchorElement> {\n as?: ElementType\n}\n\nexport function NavMenuLink(props: NavMenuLinkProps): JSX.Element {\n const { as, ...nativeProps } = props\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n return (\n <li\n className={css({\n w: 'full',\n })}\n >\n <Show\n when={hasAs}\n fallback={\n <a\n {...nativeProps}\n className={cx(\n nativeProps.className,\n css({\n color: 'action.navigation.initial',\n textStyle: 'link',\n _hover: {\n color: 'action.navigation.hover',\n },\n }),\n )}\n />\n }\n >\n {hasAs && <AsSub {...nativeProps} />}\n </Show>\n </li>\n )\n}\n"],"mappings":";AACA,SAAS,YAAY;AACrB,SAAS,KAAK,UAAU;AAqBd;AAdH,SAAS,YAAY,OAAsC;AAChE,QAAM,EAAE,IAAI,GAAG,YAAY,IAAI;AAC/B,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,IAAI;AAAA,QACb,GAAG;AAAA,MACL,CAAC;AAAA,MAED;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,UACE;AAAA,YAAC;AAAA;AAAA,cACE,GAAG;AAAA,cACJ,WAAW;AAAA,gBACT,YAAY;AAAA,gBACZ,IAAI;AAAA,kBACF,OAAO;AAAA,kBACP,WAAW;AAAA,kBACX,QAAQ;AAAA,oBACN,OAAO;AAAA,kBACT;AAAA,gBACF,CAAC;AAAA,cACH;AAAA;AAAA,UACF;AAAA,UAGD,mBAAS,oBAAC,SAAO,GAAG,aAAa;AAAA;AAAA,MACpC;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -1 +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 { cx } from '@cerberus-design/styled-system/css'\nimport { vstack } from '@cerberus-design/styled-system/patterns'\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, top: '0%', left: '105%' }\n case 'left':\n return { ...defaultPositions, top: '0%', right: '105%' }\n case 'bottom':\n return { ...defaultPositions, top: '110%' }\n case 'top':\n return { ...defaultPositions, bottom: '110%' }\n default:\n return defaultPositions\n }\n}\n\nconst navListStyles = vstack({\n alignItems: 'flex-start',\n bgColor: 'neutral.surface.100',\n boxShadow: 'lg',\n gap: '2',\n opacity: '0',\n p: '4',\n position: 'absolute',\n rounded: 'md',\n zIndex: 'dropdown',\n _motionSafe: {\n animationName: 'zoomIn',\n animationDelay: '100ms',\n animationDuration: '150ms',\n animationFillMode: 'both',\n animationTimingFunction: 'ease-in-out',\n },\n _positionBottom: {\n transformOrigin: 'top left',\n },\n _positionTop: {\n transformOrigin: 'bottom left',\n },\n _positionLeft: {\n transformOrigin: 'top right',\n },\n _positionRight: {\n transformOrigin: 'top left',\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 data-position={position ?? 'bottom'}\n className={cx(nativeProps.className, navListStyles)}\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,iBAAmB;AACnB,sBAAuB;AAuEjB;AArEC,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,KAAK,MAAM,MAAM,OAAO;AAAA,IACxD,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,KAAK,MAAM,OAAO,OAAO;AAAA,IACzD,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;AAEA,IAAM,oBAAgB,wBAAO;AAAA,EAC3B,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AAAA,EACX,KAAK;AAAA,EACL,SAAS;AAAA,EACT,GAAG;AAAA,EACH,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa;AAAA,IACX,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,EAC3B;AAAA,EACA,iBAAiB;AAAA,IACf,iBAAiB;AAAA,EACnB;AAAA,EACA,cAAc;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,EACA,eAAe;AAAA,IACb,iBAAiB;AAAA,EACnB;AAAA,EACA,gBAAgB;AAAA,IACd,iBAAiB;AAAA,EACnB;AACF,CAAC;AASM,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,iBAAe,YAAY;AAAA,MAC3B,eAAW,eAAG,YAAY,WAAW,aAAa;AAAA,MAClD,KAAK;AAAA,MACL,OAAO;AAAA;AAAA,EACT,GACF;AAEJ;","names":[]}
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 { cx } from '@cerberus-design/styled-system/css'\nimport { vstack } from '@cerberus-design/styled-system/patterns'\n\ninterface GetPositionResult {\n left: string\n right: string\n top: string\n bottom: string\n}\n\nexport function getPosition(position: Positions): GetPositionResult {\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, top: '0%', left: '105%' }\n case 'left':\n return { ...defaultPositions, top: '0%', right: '105%' }\n case 'bottom':\n return { ...defaultPositions, top: '110%' }\n case 'top':\n return { ...defaultPositions, bottom: '110%' }\n default:\n return defaultPositions\n }\n}\n\nconst navListStyles = vstack({\n alignItems: 'flex-start',\n bgColor: 'neutral.surface.100',\n boxShadow: 'lg',\n gap: '2',\n opacity: '0',\n p: '4',\n position: 'absolute',\n rounded: 'md',\n zIndex: 'dropdown',\n _motionSafe: {\n animationName: 'zoomIn',\n animationDelay: '100ms',\n animationDuration: '150ms',\n animationFillMode: 'both',\n animationTimingFunction: 'ease-in-out',\n },\n _positionBottom: {\n transformOrigin: 'top left',\n },\n _positionTop: {\n transformOrigin: 'bottom left',\n },\n _positionLeft: {\n transformOrigin: 'top right',\n },\n _positionRight: {\n transformOrigin: 'top left',\n },\n})\n\nexport interface NavMenuListProps extends HTMLAttributes<HTMLUListElement> {\n id: string\n position?: Positions\n}\n\n/**\n * A component that allows the user to display a menu of navigation links.\n * @definition [Disclosure Nav](https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-navigation/)\n * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)\n *\n * @example\n * ```tsx\n * <NavMenuList id=\"nav-menu-list\" position=\"bottom\">\n * <NavMenuLink href=\"/home\">Home</NavMenuLink>\n * <NavMenuLink href=\"/about\">About</NavMenuLink>\n * </NavMenuList>\n * ```\n **/\nexport function NavMenuList(props: NavMenuListProps): JSX.Element {\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 data-position={position ?? 'bottom'}\n className={cx(nativeProps.className, navListStyles)}\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,iBAAmB;AACnB,sBAAuB;AAyFjB;AAhFC,SAAS,YAAY,UAAwC;AAClE,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,KAAK,MAAM,MAAM,OAAO;AAAA,IACxD,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,KAAK,MAAM,OAAO,OAAO;AAAA,IACzD,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;AAEA,IAAM,oBAAgB,wBAAO;AAAA,EAC3B,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AAAA,EACX,KAAK;AAAA,EACL,SAAS;AAAA,EACT,GAAG;AAAA,EACH,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa;AAAA,IACX,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,EAC3B;AAAA,EACA,iBAAiB;AAAA,IACf,iBAAiB;AAAA,EACnB;AAAA,EACA,cAAc;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,EACA,eAAe;AAAA,IACb,iBAAiB;AAAA,EACnB;AAAA,EACA,gBAAgB;AAAA,IACd,iBAAiB;AAAA,EACnB;AACF,CAAC;AAoBM,SAAS,YAAY,OAAsC;AAChE,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,iBAAe,YAAY;AAAA,MAC3B,eAAW,eAAG,YAAY,WAAW,aAAa;AAAA,MAClD,KAAK;AAAA,MACL,OAAO;AAAA;AAAA,EACT,GACF;AAEJ;","names":[]}
@@ -1 +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 { cx } from '@cerberus-design/styled-system/css'\nimport { vstack } from '@cerberus-design/styled-system/patterns'\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, top: '0%', left: '105%' }\n case 'left':\n return { ...defaultPositions, top: '0%', right: '105%' }\n case 'bottom':\n return { ...defaultPositions, top: '110%' }\n case 'top':\n return { ...defaultPositions, bottom: '110%' }\n default:\n return defaultPositions\n }\n}\n\nconst navListStyles = vstack({\n alignItems: 'flex-start',\n bgColor: 'neutral.surface.100',\n boxShadow: 'lg',\n gap: '2',\n opacity: '0',\n p: '4',\n position: 'absolute',\n rounded: 'md',\n zIndex: 'dropdown',\n _motionSafe: {\n animationName: 'zoomIn',\n animationDelay: '100ms',\n animationDuration: '150ms',\n animationFillMode: 'both',\n animationTimingFunction: 'ease-in-out',\n },\n _positionBottom: {\n transformOrigin: 'top left',\n },\n _positionTop: {\n transformOrigin: 'bottom left',\n },\n _positionLeft: {\n transformOrigin: 'top right',\n },\n _positionRight: {\n transformOrigin: 'top left',\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 data-position={position ?? 'bottom'}\n className={cx(nativeProps.className, navListStyles)}\n ref={menuRef}\n style={locationStyles}\n />\n </Show>\n )\n}\n"],"mappings":";;;AAEA,SAAS,eAAoC;AAC7C,SAAS,yBAAyB;AAClC,SAAS,YAAY;AAErB,SAAS,UAAU;AACnB,SAAS,cAAc;AAuEjB;AArEC,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,KAAK,MAAM,MAAM,OAAO;AAAA,IACxD,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,KAAK,MAAM,OAAO,OAAO;AAAA,IACzD,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;AAEA,IAAM,gBAAgB,OAAO;AAAA,EAC3B,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AAAA,EACX,KAAK;AAAA,EACL,SAAS;AAAA,EACT,GAAG;AAAA,EACH,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa;AAAA,IACX,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,EAC3B;AAAA,EACA,iBAAiB;AAAA,IACf,iBAAiB;AAAA,EACnB;AAAA,EACA,cAAc;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,EACA,eAAe;AAAA,IACb,iBAAiB;AAAA,EACnB;AAAA,EACA,gBAAgB;AAAA,IACd,iBAAiB;AAAA,EACnB;AACF,CAAC;AASM,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,iBAAe,YAAY;AAAA,MAC3B,WAAW,GAAG,YAAY,WAAW,aAAa;AAAA,MAClD,KAAK;AAAA,MACL,OAAO;AAAA;AAAA,EACT,GACF;AAEJ;","names":[]}
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 { cx } from '@cerberus-design/styled-system/css'\nimport { vstack } from '@cerberus-design/styled-system/patterns'\n\ninterface GetPositionResult {\n left: string\n right: string\n top: string\n bottom: string\n}\n\nexport function getPosition(position: Positions): GetPositionResult {\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, top: '0%', left: '105%' }\n case 'left':\n return { ...defaultPositions, top: '0%', right: '105%' }\n case 'bottom':\n return { ...defaultPositions, top: '110%' }\n case 'top':\n return { ...defaultPositions, bottom: '110%' }\n default:\n return defaultPositions\n }\n}\n\nconst navListStyles = vstack({\n alignItems: 'flex-start',\n bgColor: 'neutral.surface.100',\n boxShadow: 'lg',\n gap: '2',\n opacity: '0',\n p: '4',\n position: 'absolute',\n rounded: 'md',\n zIndex: 'dropdown',\n _motionSafe: {\n animationName: 'zoomIn',\n animationDelay: '100ms',\n animationDuration: '150ms',\n animationFillMode: 'both',\n animationTimingFunction: 'ease-in-out',\n },\n _positionBottom: {\n transformOrigin: 'top left',\n },\n _positionTop: {\n transformOrigin: 'bottom left',\n },\n _positionLeft: {\n transformOrigin: 'top right',\n },\n _positionRight: {\n transformOrigin: 'top left',\n },\n})\n\nexport interface NavMenuListProps extends HTMLAttributes<HTMLUListElement> {\n id: string\n position?: Positions\n}\n\n/**\n * A component that allows the user to display a menu of navigation links.\n * @definition [Disclosure Nav](https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-navigation/)\n * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)\n *\n * @example\n * ```tsx\n * <NavMenuList id=\"nav-menu-list\" position=\"bottom\">\n * <NavMenuLink href=\"/home\">Home</NavMenuLink>\n * <NavMenuLink href=\"/about\">About</NavMenuLink>\n * </NavMenuList>\n * ```\n **/\nexport function NavMenuList(props: NavMenuListProps): JSX.Element {\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 data-position={position ?? 'bottom'}\n className={cx(nativeProps.className, navListStyles)}\n ref={menuRef}\n style={locationStyles}\n />\n </Show>\n )\n}\n"],"mappings":";;;AAEA,SAAS,eAAoC;AAC7C,SAAS,yBAAyB;AAClC,SAAS,YAAY;AAErB,SAAS,UAAU;AACnB,SAAS,cAAc;AAyFjB;AAhFC,SAAS,YAAY,UAAwC;AAClE,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,KAAK,MAAM,MAAM,OAAO;AAAA,IACxD,KAAK;AACH,aAAO,EAAE,GAAG,kBAAkB,KAAK,MAAM,OAAO,OAAO;AAAA,IACzD,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;AAEA,IAAM,gBAAgB,OAAO;AAAA,EAC3B,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AAAA,EACX,KAAK;AAAA,EACL,SAAS;AAAA,EACT,GAAG;AAAA,EACH,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa;AAAA,IACX,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,EAC3B;AAAA,EACA,iBAAiB;AAAA,IACf,iBAAiB;AAAA,EACnB;AAAA,EACA,cAAc;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,EACA,eAAe;AAAA,IACb,iBAAiB;AAAA,EACnB;AAAA,EACA,gBAAgB;AAAA,IACd,iBAAiB;AAAA,EACnB;AACF,CAAC;AAoBM,SAAS,YAAY,OAAsC;AAChE,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,iBAAe,YAAY;AAAA,MAC3B,WAAW,GAAG,YAAY,WAAW,aAAa;AAAA,MAClD,KAAK;AAAA,MACL,OAAO;AAAA;AAAA,EACT,GACF;AAEJ;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/NavMenuTrigger.tsx"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n type ButtonHTMLAttributes,\n type ElementType,\n type MouseEvent,\n} from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\nimport {\n createNavTriggerProps,\n type NavTriggerAriaValues,\n} from '../aria-helpers/nav-menu.aria'\nimport { Show } from './Show'\nimport type { ButtonProps } from './Button'\nimport { useNavMenuContext } from '../context/navMenu'\n\nexport interface NavMenuTriggerProps\n extends ButtonHTMLAttributes<HTMLButtonElement>,\n ButtonProps,\n NavTriggerAriaValues {\n as?: ElementType\n}\n\n/**\n * A component that allows the user to trigger a navigation menu.\n * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/NavMenuTrigger.tsx\n */\nexport function NavMenuTrigger(props: NavMenuTriggerProps) {\n const {\n as,\n palette,\n usage,\n shape,\n controls,\n expanded: propsExpanded,\n onClick,\n ...nativeProps\n } = props\n const { triggerRef, onToggle, expanded } = useNavMenuContext()\n const ariaProps = createNavTriggerProps({\n controls,\n expanded: propsExpanded ?? expanded,\n })\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n const handleClick = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n if (onClick) return onClick(e)\n onToggle()\n },\n [onClick, onToggle],\n )\n\n return (\n <Show\n when={hasAs}\n fallback={\n <button\n {...nativeProps}\n {...ariaProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n onClick={handleClick}\n ref={triggerRef}\n >\n {props.children}\n </button>\n }\n >\n {hasAs && (\n <AsSub\n {...nativeProps}\n {...ariaProps}\n onClick={handleClick}\n ref={triggerRef}\n />\n )}\n </Show>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAKO;AACP,iBAAmB;AACnB,qBAAuB;AACvB,sBAGO;AACP,kBAAqB;AAErB,qBAAkC;AA4C1B;AA/BD,SAAS,eAAe,OAA4B;AACzD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,EAAE,YAAY,UAAU,SAAS,QAAI,kCAAkB;AAC7D,QAAM,gBAAY,uCAAsB;AAAA,IACtC;AAAA,IACA,UAAU,iBAAiB;AAAA,EAC7B,CAAC;AACD,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,QAAM,kBAAc;AAAA,IAClB,CAAC,MAAqC;AACpC,UAAI;AAAS,eAAO,QAAQ,CAAC;AAC7B,eAAS;AAAA,IACX;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,EACpB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,UACE;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,eAAW;AAAA,YACT,YAAY;AAAA,gBACZ,uBAAO;AAAA,cACL;AAAA,cACA;AAAA,cACA;AAAA,YACF,CAAC;AAAA,UACH;AAAA,UACA,SAAS;AAAA,UACT,KAAK;AAAA,UAEJ,gBAAM;AAAA;AAAA,MACT;AAAA,MAGD,mBACC;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,SAAS;AAAA,UACT,KAAK;AAAA;AAAA,MACP;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../src/components/NavMenuTrigger.tsx"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n type ButtonHTMLAttributes,\n type ElementType,\n type MouseEvent,\n} from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\nimport {\n createNavTriggerProps,\n type NavTriggerAriaValues,\n} from '../aria-helpers/nav-menu.aria'\nimport { Show } from './Show'\nimport type { ButtonProps } from './Button'\nimport { useNavMenuContext } from '../context/navMenu'\n\nexport interface NavMenuTriggerProps\n extends ButtonHTMLAttributes<HTMLButtonElement>,\n ButtonProps,\n NavTriggerAriaValues {\n as?: ElementType\n}\n\n/**\n * A component that allows the user to trigger a navigation menu.\n * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)\n * @example\n * ```tsx\n * <NavMenu>\n * <NavMenuTrigger controls=\"nav-menu-list\">\n * Menu\n * </NavMenuTrigger>\n * </NavMenu>\n * ```\n */\nexport function NavMenuTrigger(props: NavMenuTriggerProps): JSX.Element {\n const {\n as,\n palette,\n usage,\n shape,\n controls,\n expanded: propsExpanded,\n onClick,\n ...nativeProps\n } = props\n const { triggerRef, onToggle, expanded } = useNavMenuContext()\n const ariaProps = createNavTriggerProps({\n controls,\n expanded: propsExpanded ?? expanded,\n })\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n const handleClick = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n if (onClick) return onClick(e)\n onToggle()\n },\n [onClick, onToggle],\n )\n\n return (\n <Show\n when={hasAs}\n fallback={\n <button\n {...nativeProps}\n {...ariaProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n onClick={handleClick}\n ref={triggerRef}\n >\n {props.children}\n </button>\n }\n >\n {hasAs && (\n <AsSub\n {...nativeProps}\n {...ariaProps}\n onClick={handleClick}\n ref={triggerRef}\n />\n )}\n </Show>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAKO;AACP,iBAAmB;AACnB,qBAAuB;AACvB,sBAGO;AACP,kBAAqB;AAErB,qBAAkC;AAoD1B;AA/BD,SAAS,eAAe,OAAyC;AACtE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,EAAE,YAAY,UAAU,SAAS,QAAI,kCAAkB;AAC7D,QAAM,gBAAY,uCAAsB;AAAA,IACtC;AAAA,IACA,UAAU,iBAAiB;AAAA,EAC7B,CAAC;AACD,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,QAAM,kBAAc;AAAA,IAClB,CAAC,MAAqC;AACpC,UAAI;AAAS,eAAO,QAAQ,CAAC;AAC7B,eAAS;AAAA,IACX;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,EACpB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,UACE;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,eAAW;AAAA,YACT,YAAY;AAAA,gBACZ,uBAAO;AAAA,cACL;AAAA,cACA;AAAA,cACA;AAAA,YACF,CAAC;AAAA,UACH;AAAA,UACA,SAAS;AAAA,UACT,KAAK;AAAA,UAEJ,gBAAM;AAAA;AAAA,MACT;AAAA,MAGD,mBACC;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,SAAS;AAAA,UACT,KAAK;AAAA;AAAA,MACP;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/NavMenuTrigger.tsx"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n type ButtonHTMLAttributes,\n type ElementType,\n type MouseEvent,\n} from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\nimport {\n createNavTriggerProps,\n type NavTriggerAriaValues,\n} from '../aria-helpers/nav-menu.aria'\nimport { Show } from './Show'\nimport type { ButtonProps } from './Button'\nimport { useNavMenuContext } from '../context/navMenu'\n\nexport interface NavMenuTriggerProps\n extends ButtonHTMLAttributes<HTMLButtonElement>,\n ButtonProps,\n NavTriggerAriaValues {\n as?: ElementType\n}\n\n/**\n * A component that allows the user to trigger a navigation menu.\n * @description https://github.com/omnifed/cerberus/blob/main/packages/react/src/components/NavMenuTrigger.tsx\n */\nexport function NavMenuTrigger(props: NavMenuTriggerProps) {\n const {\n as,\n palette,\n usage,\n shape,\n controls,\n expanded: propsExpanded,\n onClick,\n ...nativeProps\n } = props\n const { triggerRef, onToggle, expanded } = useNavMenuContext()\n const ariaProps = createNavTriggerProps({\n controls,\n expanded: propsExpanded ?? expanded,\n })\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n const handleClick = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n if (onClick) return onClick(e)\n onToggle()\n },\n [onClick, onToggle],\n )\n\n return (\n <Show\n when={hasAs}\n fallback={\n <button\n {...nativeProps}\n {...ariaProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n onClick={handleClick}\n ref={triggerRef}\n >\n {props.children}\n </button>\n }\n >\n {hasAs && (\n <AsSub\n {...nativeProps}\n {...ariaProps}\n onClick={handleClick}\n ref={triggerRef}\n />\n )}\n </Show>\n )\n}\n"],"mappings":";;;AAEA;AAAA,EACE;AAAA,OAIK;AACP,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,OAEK;AACP,SAAS,YAAY;AAErB,SAAS,yBAAyB;AA4C1B;AA/BD,SAAS,eAAe,OAA4B;AACzD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,EAAE,YAAY,UAAU,SAAS,IAAI,kBAAkB;AAC7D,QAAM,YAAY,sBAAsB;AAAA,IACtC;AAAA,IACA,UAAU,iBAAiB;AAAA,EAC7B,CAAC;AACD,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,QAAM,cAAc;AAAA,IAClB,CAAC,MAAqC;AACpC,UAAI;AAAS,eAAO,QAAQ,CAAC;AAC7B,eAAS;AAAA,IACX;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,EACpB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,UACE;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,WAAW;AAAA,YACT,YAAY;AAAA,YACZ,OAAO;AAAA,cACL;AAAA,cACA;AAAA,cACA;AAAA,YACF,CAAC;AAAA,UACH;AAAA,UACA,SAAS;AAAA,UACT,KAAK;AAAA,UAEJ,gBAAM;AAAA;AAAA,MACT;AAAA,MAGD,mBACC;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,SAAS;AAAA,UACT,KAAK;AAAA;AAAA,MACP;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../src/components/NavMenuTrigger.tsx"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n type ButtonHTMLAttributes,\n type ElementType,\n type MouseEvent,\n} from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\nimport {\n createNavTriggerProps,\n type NavTriggerAriaValues,\n} from '../aria-helpers/nav-menu.aria'\nimport { Show } from './Show'\nimport type { ButtonProps } from './Button'\nimport { useNavMenuContext } from '../context/navMenu'\n\nexport interface NavMenuTriggerProps\n extends ButtonHTMLAttributes<HTMLButtonElement>,\n ButtonProps,\n NavTriggerAriaValues {\n as?: ElementType\n}\n\n/**\n * A component that allows the user to trigger a navigation menu.\n * @definition [NavMenu Docs](https://cerberus.digitalu.design/react/nav-menu)\n * @example\n * ```tsx\n * <NavMenu>\n * <NavMenuTrigger controls=\"nav-menu-list\">\n * Menu\n * </NavMenuTrigger>\n * </NavMenu>\n * ```\n */\nexport function NavMenuTrigger(props: NavMenuTriggerProps): JSX.Element {\n const {\n as,\n palette,\n usage,\n shape,\n controls,\n expanded: propsExpanded,\n onClick,\n ...nativeProps\n } = props\n const { triggerRef, onToggle, expanded } = useNavMenuContext()\n const ariaProps = createNavTriggerProps({\n controls,\n expanded: propsExpanded ?? expanded,\n })\n const hasAs = Boolean(as)\n const AsSub: ElementType = as!\n\n const handleClick = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n if (onClick) return onClick(e)\n onToggle()\n },\n [onClick, onToggle],\n )\n\n return (\n <Show\n when={hasAs}\n fallback={\n <button\n {...nativeProps}\n {...ariaProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n }),\n )}\n onClick={handleClick}\n ref={triggerRef}\n >\n {props.children}\n </button>\n }\n >\n {hasAs && (\n <AsSub\n {...nativeProps}\n {...ariaProps}\n onClick={handleClick}\n ref={triggerRef}\n />\n )}\n </Show>\n )\n}\n"],"mappings":";;;AAEA;AAAA,EACE;AAAA,OAIK;AACP,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,OAEK;AACP,SAAS,YAAY;AAErB,SAAS,yBAAyB;AAoD1B;AA/BD,SAAS,eAAe,OAAyC;AACtE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,EAAE,YAAY,UAAU,SAAS,IAAI,kBAAkB;AAC7D,QAAM,YAAY,sBAAsB;AAAA,IACtC;AAAA,IACA,UAAU,iBAAiB;AAAA,EAC7B,CAAC;AACD,QAAM,QAAQ,QAAQ,EAAE;AACxB,QAAM,QAAqB;AAE3B,QAAM,cAAc;AAAA,IAClB,CAAC,MAAqC;AACpC,UAAI;AAAS,eAAO,QAAQ,CAAC;AAC7B,eAAS;AAAA,IACX;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,EACpB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,UACE;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,WAAW;AAAA,YACT,YAAY;AAAA,YACZ,OAAO;AAAA,cACL;AAAA,cACA;AAAA,cACA;AAAA,YACF,CAAC;AAAA,UACH;AAAA,UACA,SAAS;AAAA,UACT,KAAK;AAAA,UAEJ,gBAAM;AAAA;AAAA,MACT;AAAA,MAGD,mBACC;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACH,GAAG;AAAA,UACJ,SAAS;AAAA,UACT,KAAK;AAAA;AAAA,MACP;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n when: boolean | null | undefined\n fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show(props: PropsWithChildren<ShowProps>) {\n const { when, children, fallback } = props\n const condition = useMemo(() => when ?? false, [when])\n\n return useMemo(() => {\n if (condition) return children\n return fallback ?? null\n }, [condition, children, fallback])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAgE;AAYzD,SAAS,KAAK,OAAqC;AACxD,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}
1
+ {"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n when: boolean | null | undefined\n fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @definition [Show docs](https://cerberus.digitalu.design/react/show)\n * @example\n * ```tsx\n * <Show when={condition}>\n * <div>Content</div>\n * </Show>\n */\nexport function Show(props: PropsWithChildren<ShowProps>): ReactNode {\n const { when, children, fallback } = props\n const condition = useMemo(() => when ?? false, [when])\n\n return useMemo(() => {\n if (condition) return children\n return fallback ?? null\n }, [condition, children, fallback])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAgE;AAiBzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n when: boolean | null | undefined\n fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show(props: PropsWithChildren<ShowProps>) {\n const { when, children, fallback } = props\n const condition = useMemo(() => when ?? false, [when])\n\n return useMemo(() => {\n if (condition) return children\n return fallback ?? null\n }, [condition, children, fallback])\n}\n"],"mappings":";;;AAEA,SAAS,eAAuD;AAYzD,SAAS,KAAK,OAAqC;AACxD,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,YAAY,QAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,SAAO,QAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}
1
+ {"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n when: boolean | null | undefined\n fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @definition [Show docs](https://cerberus.digitalu.design/react/show)\n * @example\n * ```tsx\n * <Show when={condition}>\n * <div>Content</div>\n * </Show>\n */\nexport function Show(props: PropsWithChildren<ShowProps>): ReactNode {\n const { when, children, fallback } = props\n const condition = useMemo(() => when ?? false, [when])\n\n return useMemo(() => {\n if (condition) return children\n return fallback ?? null\n }, [condition, children, fallback])\n}\n"],"mappings":";;;AAEA,SAAS,eAAuD;AAiBzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,YAAY,QAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,SAAO,QAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/context/navMenu.tsx"],"sourcesContent":["'use client'\n\nimport { css } from '@cerberus-design/styled-system/css'\nimport {\n createContext,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n type PropsWithChildren,\n type RefObject,\n} from 'react'\n\nexport type NavTriggerRef = RefObject<HTMLButtonElement>\nexport type NavMenuRef = RefObject<HTMLUListElement>\n\nexport interface NavMenuContextValue {\n triggerRef: NavTriggerRef | null\n menuRef: NavMenuRef | null\n expanded: boolean\n onToggle: () => void\n}\n\nconst NavMenuContext = createContext<NavMenuContextValue | null>(null)\n\nexport function NavMenu(props: PropsWithChildren) {\n const triggerRef = useRef<HTMLButtonElement>(null)\n const menuRef = useRef<HTMLUListElement>(null)\n const [expanded, setExpanded] = useState<boolean>(false)\n\n const handleToggle = useCallback(() => {\n setExpanded((prev) => !prev)\n }, [])\n\n const value = useMemo(\n () => ({\n triggerRef,\n menuRef,\n expanded,\n onToggle: handleToggle,\n }),\n [expanded, handleToggle],\n )\n\n return (\n <NavMenuContext.Provider value={value}>\n <nav\n className={css({\n position: 'relative',\n })}\n >\n {props.children}\n </nav>\n </NavMenuContext.Provider>\n )\n}\n\nexport function useNavMenuContext() {\n const context = useContext(NavMenuContext)\n if (!context) {\n throw new Error('useNavMenuContext must be used within a NavMenu.')\n }\n return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,iBAAoB;AACpB,mBASO;AAmCD;AAvBN,IAAM,qBAAiB,4BAA0C,IAAI;AAE9D,SAAS,QAAQ,OAA0B;AAChD,QAAM,iBAAa,qBAA0B,IAAI;AACjD,QAAM,cAAU,qBAAyB,IAAI;AAC7C,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAkB,KAAK;AAEvD,QAAM,mBAAe,0BAAY,MAAM;AACrC,gBAAY,CAAC,SAAS,CAAC,IAAI;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,QAAM,YAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,UAAU,YAAY;AAAA,EACzB;AAEA,SACE,4CAAC,eAAe,UAAf,EAAwB,OACvB;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,gBAAI;AAAA,QACb,UAAU;AAAA,MACZ,CAAC;AAAA,MAEA,gBAAM;AAAA;AAAA,EACT,GACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,QAAM,cAAU,yBAAW,cAAc;AACzC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,kDAAkD;AAAA,EACpE;AACA,SAAO;AACT;","names":[]}
1
+ {"version":3,"sources":["../../../src/context/navMenu.tsx"],"sourcesContent":["'use client'\n\nimport { css } from '@cerberus-design/styled-system/css'\nimport {\n createContext,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n type PropsWithChildren,\n type RefObject,\n} from 'react'\n\nexport type NavTriggerRef = RefObject<HTMLButtonElement>\nexport type NavMenuRef = RefObject<HTMLUListElement>\n\nexport interface NavMenuContextValue {\n triggerRef: NavTriggerRef | null\n menuRef: NavMenuRef | null\n expanded: boolean\n onToggle: () => void\n}\n\nconst NavMenuContext = createContext<NavMenuContextValue | null>(null)\n\nexport function NavMenu(props: PropsWithChildren): JSX.Element {\n const triggerRef = useRef<HTMLButtonElement>(null)\n const menuRef = useRef<HTMLUListElement>(null)\n const [expanded, setExpanded] = useState<boolean>(false)\n\n const handleToggle = useCallback(() => {\n setExpanded((prev) => !prev)\n }, [])\n\n const value = useMemo(\n () => ({\n triggerRef,\n menuRef,\n expanded,\n onToggle: handleToggle,\n }),\n [expanded, handleToggle],\n )\n\n return (\n <NavMenuContext.Provider value={value}>\n <nav\n className={css({\n position: 'relative',\n })}\n >\n {props.children}\n </nav>\n </NavMenuContext.Provider>\n )\n}\n\nexport function useNavMenuContext(): NavMenuContextValue {\n const context = useContext(NavMenuContext)\n if (!context) {\n throw new Error('useNavMenuContext must be used within a NavMenu.')\n }\n return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,iBAAoB;AACpB,mBASO;AAmCD;AAvBN,IAAM,qBAAiB,4BAA0C,IAAI;AAE9D,SAAS,QAAQ,OAAuC;AAC7D,QAAM,iBAAa,qBAA0B,IAAI;AACjD,QAAM,cAAU,qBAAyB,IAAI;AAC7C,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAkB,KAAK;AAEvD,QAAM,mBAAe,0BAAY,MAAM;AACrC,gBAAY,CAAC,SAAS,CAAC,IAAI;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,QAAM,YAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,UAAU,YAAY;AAAA,EACzB;AAEA,SACE,4CAAC,eAAe,UAAf,EAAwB,OACvB;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,gBAAI;AAAA,QACb,UAAU;AAAA,MACZ,CAAC;AAAA,MAEA,gBAAM;AAAA;AAAA,EACT,GACF;AAEJ;AAEO,SAAS,oBAAyC;AACvD,QAAM,cAAU,yBAAW,cAAc;AACzC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,kDAAkD;AAAA,EACpE;AACA,SAAO;AACT;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/context/navMenu.tsx"],"sourcesContent":["'use client'\n\nimport { css } from '@cerberus-design/styled-system/css'\nimport {\n createContext,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n type PropsWithChildren,\n type RefObject,\n} from 'react'\n\nexport type NavTriggerRef = RefObject<HTMLButtonElement>\nexport type NavMenuRef = RefObject<HTMLUListElement>\n\nexport interface NavMenuContextValue {\n triggerRef: NavTriggerRef | null\n menuRef: NavMenuRef | null\n expanded: boolean\n onToggle: () => void\n}\n\nconst NavMenuContext = createContext<NavMenuContextValue | null>(null)\n\nexport function NavMenu(props: PropsWithChildren) {\n const triggerRef = useRef<HTMLButtonElement>(null)\n const menuRef = useRef<HTMLUListElement>(null)\n const [expanded, setExpanded] = useState<boolean>(false)\n\n const handleToggle = useCallback(() => {\n setExpanded((prev) => !prev)\n }, [])\n\n const value = useMemo(\n () => ({\n triggerRef,\n menuRef,\n expanded,\n onToggle: handleToggle,\n }),\n [expanded, handleToggle],\n )\n\n return (\n <NavMenuContext.Provider value={value}>\n <nav\n className={css({\n position: 'relative',\n })}\n >\n {props.children}\n </nav>\n </NavMenuContext.Provider>\n )\n}\n\nexport function useNavMenuContext() {\n const context = useContext(NavMenuContext)\n if (!context) {\n throw new Error('useNavMenuContext must be used within a NavMenu.')\n }\n return context\n}\n"],"mappings":";;;AAEA,SAAS,WAAW;AACpB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AAmCD;AAvBN,IAAM,iBAAiB,cAA0C,IAAI;AAE9D,SAAS,QAAQ,OAA0B;AAChD,QAAM,aAAa,OAA0B,IAAI;AACjD,QAAM,UAAU,OAAyB,IAAI;AAC7C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAkB,KAAK;AAEvD,QAAM,eAAe,YAAY,MAAM;AACrC,gBAAY,CAAC,SAAS,CAAC,IAAI;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,UAAU,YAAY;AAAA,EACzB;AAEA,SACE,oBAAC,eAAe,UAAf,EAAwB,OACvB;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,IAAI;AAAA,QACb,UAAU;AAAA,MACZ,CAAC;AAAA,MAEA,gBAAM;AAAA;AAAA,EACT,GACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,QAAM,UAAU,WAAW,cAAc;AACzC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,kDAAkD;AAAA,EACpE;AACA,SAAO;AACT;","names":[]}
1
+ {"version":3,"sources":["../../../src/context/navMenu.tsx"],"sourcesContent":["'use client'\n\nimport { css } from '@cerberus-design/styled-system/css'\nimport {\n createContext,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n type PropsWithChildren,\n type RefObject,\n} from 'react'\n\nexport type NavTriggerRef = RefObject<HTMLButtonElement>\nexport type NavMenuRef = RefObject<HTMLUListElement>\n\nexport interface NavMenuContextValue {\n triggerRef: NavTriggerRef | null\n menuRef: NavMenuRef | null\n expanded: boolean\n onToggle: () => void\n}\n\nconst NavMenuContext = createContext<NavMenuContextValue | null>(null)\n\nexport function NavMenu(props: PropsWithChildren): JSX.Element {\n const triggerRef = useRef<HTMLButtonElement>(null)\n const menuRef = useRef<HTMLUListElement>(null)\n const [expanded, setExpanded] = useState<boolean>(false)\n\n const handleToggle = useCallback(() => {\n setExpanded((prev) => !prev)\n }, [])\n\n const value = useMemo(\n () => ({\n triggerRef,\n menuRef,\n expanded,\n onToggle: handleToggle,\n }),\n [expanded, handleToggle],\n )\n\n return (\n <NavMenuContext.Provider value={value}>\n <nav\n className={css({\n position: 'relative',\n })}\n >\n {props.children}\n </nav>\n </NavMenuContext.Provider>\n )\n}\n\nexport function useNavMenuContext(): NavMenuContextValue {\n const context = useContext(NavMenuContext)\n if (!context) {\n throw new Error('useNavMenuContext must be used within a NavMenu.')\n }\n return context\n}\n"],"mappings":";;;AAEA,SAAS,WAAW;AACpB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AAmCD;AAvBN,IAAM,iBAAiB,cAA0C,IAAI;AAE9D,SAAS,QAAQ,OAAuC;AAC7D,QAAM,aAAa,OAA0B,IAAI;AACjD,QAAM,UAAU,OAAyB,IAAI;AAC7C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAkB,KAAK;AAEvD,QAAM,eAAe,YAAY,MAAM;AACrC,gBAAY,CAAC,SAAS,CAAC,IAAI;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,UAAU,YAAY;AAAA,EACzB;AAEA,SACE,oBAAC,eAAe,UAAf,EAAwB,OACvB;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,IAAI;AAAA,QACb,UAAU;AAAA,MACZ,CAAC;AAAA,MAEA,gBAAM;AAAA;AAAA,EACT,GACF;AAEJ;AAEO,SAAS,oBAAyC;AACvD,QAAM,UAAU,WAAW,cAAc;AACzC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,kDAAkD;AAAA,EACpE;AACA,SAAO;AACT;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends DefaultThemes> {\n theme: CustomThemes<T>\n mode: ColorModes\n updateTheme: (theme: T) => void\n updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst ThemeContext = createContext<ThemeContextValue<DefaultThemes> | null>(\n null,\n)\n\nexport function ThemeProvider(props: PropsWithChildren<unknown>) {\n const state = useTheme()\n return (\n <ThemeContext.Provider value={state}>\n {props.children}\n </ThemeContext.Provider>\n )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n const context = useContext(ThemeContext)\n if (!context) {\n throw new Error('useThemeContext must be used within a ThemeProvider')\n }\n return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAkE;AAClE,sBAAyB;AAuBrB;AAVG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,mBAAe;AAAA,EACnB;AACF;AAEO,SAAS,cAAc,OAAmC;AAC/D,QAAM,YAAQ,0BAAS;AACvB,SACE,4CAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,cAAU,yBAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}
1
+ {"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends string = DefaultThemes> {\n theme: CustomThemes<T>\n mode: ColorModes\n updateTheme: (theme: T) => void\n updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst ThemeContext = createContext<ThemeContextValue<DefaultThemes> | null>(\n null,\n)\n\n/**\n * A context provider that allows the user to set the theme and mode of the application.\n * @example\n * ```tsx\n * <ThemeProvider>\n * <App />\n * </ThemeProvider>\n * ```\n */\nexport function ThemeProvider(props: PropsWithChildren<unknown>): JSX.Element {\n const state = useTheme()\n return (\n <ThemeContext.Provider value={state}>\n {props.children}\n </ThemeContext.Provider>\n )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n const context = useContext(ThemeContext)\n if (!context) {\n throw new Error('useThemeContext must be used within a ThemeProvider')\n }\n return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAkE;AAClE,sBAAyB;AAgCrB;AAnBG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,mBAAe;AAAA,EACnB;AACF;AAWO,SAAS,cAAc,OAAgD;AAC5E,QAAM,YAAQ,0BAAS;AACvB,SACE,4CAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,cAAU,yBAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends DefaultThemes> {\n theme: CustomThemes<T>\n mode: ColorModes\n updateTheme: (theme: T) => void\n updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst ThemeContext = createContext<ThemeContextValue<DefaultThemes> | null>(\n null,\n)\n\nexport function ThemeProvider(props: PropsWithChildren<unknown>) {\n const state = useTheme()\n return (\n <ThemeContext.Provider value={state}>\n {props.children}\n </ThemeContext.Provider>\n )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n const context = useContext(ThemeContext)\n if (!context) {\n throw new Error('useThemeContext must be used within a ThemeProvider')\n }\n return context\n}\n"],"mappings":";;;AAEA,SAAS,eAAe,kBAA0C;AAClE,SAAS,gBAAgB;AAuBrB;AAVG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,eAAe;AAAA,EACnB;AACF;AAEO,SAAS,cAAc,OAAmC;AAC/D,QAAM,QAAQ,SAAS;AACvB,SACE,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,UAAU,WAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}
1
+ {"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends string = DefaultThemes> {\n theme: CustomThemes<T>\n mode: ColorModes\n updateTheme: (theme: T) => void\n updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst ThemeContext = createContext<ThemeContextValue<DefaultThemes> | null>(\n null,\n)\n\n/**\n * A context provider that allows the user to set the theme and mode of the application.\n * @example\n * ```tsx\n * <ThemeProvider>\n * <App />\n * </ThemeProvider>\n * ```\n */\nexport function ThemeProvider(props: PropsWithChildren<unknown>): JSX.Element {\n const state = useTheme()\n return (\n <ThemeContext.Provider value={state}>\n {props.children}\n </ThemeContext.Provider>\n )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n const context = useContext(ThemeContext)\n if (!context) {\n throw new Error('useThemeContext must be used within a ThemeProvider')\n }\n return context\n}\n"],"mappings":";;;AAEA,SAAS,eAAe,kBAA0C;AAClE,SAAS,gBAAgB;AAgCrB;AAnBG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,eAAe;AAAA,EACnB;AACF;AAWO,SAAS,cAAc,OAAgD;AAC5E,QAAM,QAAQ,SAAS;AACvB,SACE,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,UAAU,WAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/hooks/useTheme.ts"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react'\nimport {\n MODE_KEY,\n THEME_KEY,\n type ColorModes,\n type CustomThemes,\n type DefaultThemes,\n} from '../context/theme'\n\nexport function useTheme<C extends string = DefaultThemes>(\n defaultTheme: CustomThemes<C> = 'cerberus',\n defaultColorMode: ColorModes = 'light',\n) {\n const [theme, setTheme] = useState<CustomThemes<C>>(defaultTheme)\n const [colorMode, setColorMode] = useState<ColorModes>(defaultColorMode)\n\n const handleThemeChange = useCallback((newTheme: CustomThemes<C>) => {\n setTheme(newTheme)\n localStorage.setItem(THEME_KEY, newTheme)\n }, [])\n\n const handleColorModeChange = useCallback(() => {\n setColorMode((prev) => {\n const newMode = prev === 'light' ? 'dark' : 'light'\n localStorage.setItem(MODE_KEY, newMode)\n return newMode\n })\n }, [])\n\n useLayoutEffect(() => {\n const theme = localStorage.getItem(THEME_KEY)\n if (theme) {\n setTheme(theme as CustomThemes<C>)\n }\n }, [])\n\n useLayoutEffect(() => {\n const mode = localStorage.getItem(MODE_KEY)\n if (mode) {\n setColorMode(mode as ColorModes)\n }\n }, [])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.theme = theme\n }, [theme])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.colorMode = colorMode\n }, [colorMode])\n\n return useMemo(\n () => ({\n theme,\n mode: colorMode,\n updateTheme: handleThemeChange,\n updateMode: handleColorModeChange,\n }),\n [theme, colorMode, handleThemeChange, handleColorModeChange],\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAMO;AACP,mBAMO;AAEA,SAAS,SACd,eAAgC,YAChC,mBAA+B,SAC/B;AACA,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAA0B,YAAY;AAChE,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAqB,gBAAgB;AAEvE,QAAM,wBAAoB,0BAAY,CAAC,aAA8B;AACnE,aAAS,QAAQ;AACjB,iBAAa,QAAQ,wBAAW,QAAQ;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,QAAM,4BAAwB,0BAAY,MAAM;AAC9C,iBAAa,CAAC,SAAS;AACrB,YAAM,UAAU,SAAS,UAAU,SAAS;AAC5C,mBAAa,QAAQ,uBAAU,OAAO;AACtC,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,oCAAgB,MAAM;AACpB,UAAMA,SAAQ,aAAa,QAAQ,sBAAS;AAC5C,QAAIA,QAAO;AACT,eAASA,MAAwB;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,oCAAgB,MAAM;AACpB,UAAM,OAAO,aAAa,QAAQ,qBAAQ;AAC1C,QAAI,MAAM;AACR,mBAAa,IAAkB;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,QAAQ;AAAA,EACvB,GAAG,CAAC,KAAK,CAAC;AAEV,8BAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,YAAY;AAAA,EAC3B,GAAG,CAAC,SAAS,CAAC;AAEd,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA,MAAM;AAAA,MACN,aAAa;AAAA,MACb,YAAY;AAAA,IACd;AAAA,IACA,CAAC,OAAO,WAAW,mBAAmB,qBAAqB;AAAA,EAC7D;AACF;","names":["theme"]}
1
+ {"version":3,"sources":["../../../src/hooks/useTheme.ts"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react'\nimport {\n MODE_KEY,\n THEME_KEY,\n type ColorModes,\n type CustomThemes,\n type DefaultThemes,\n type ThemeContextValue,\n} from '../context/theme'\n\nexport function useTheme<C extends string = DefaultThemes>(\n defaultTheme: CustomThemes<C> = 'cerberus',\n defaultColorMode: ColorModes = 'light',\n): ThemeContextValue<C> {\n const [theme, setTheme] = useState<CustomThemes<C>>(defaultTheme)\n const [colorMode, setColorMode] = useState<ColorModes>(defaultColorMode)\n\n const handleThemeChange = useCallback((newTheme: CustomThemes<C>) => {\n setTheme(newTheme)\n localStorage.setItem(THEME_KEY, newTheme)\n }, [])\n\n const handleColorModeChange = useCallback(() => {\n setColorMode((prev) => {\n const newMode = prev === 'light' ? 'dark' : 'light'\n localStorage.setItem(MODE_KEY, newMode)\n return newMode\n })\n }, [])\n\n useLayoutEffect(() => {\n const theme = localStorage.getItem(THEME_KEY)\n if (theme) {\n setTheme(theme as CustomThemes<C>)\n }\n }, [])\n\n useLayoutEffect(() => {\n const mode = localStorage.getItem(MODE_KEY)\n if (mode) {\n setColorMode(mode as ColorModes)\n }\n }, [])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.theme = theme\n }, [theme])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.colorMode = colorMode\n }, [colorMode])\n\n return useMemo(\n () => ({\n theme,\n mode: colorMode,\n updateTheme: handleThemeChange,\n updateMode: handleColorModeChange,\n }),\n [theme, colorMode, handleThemeChange, handleColorModeChange],\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAMO;AACP,mBAOO;AAEA,SAAS,SACd,eAAgC,YAChC,mBAA+B,SACT;AACtB,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAA0B,YAAY;AAChE,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAqB,gBAAgB;AAEvE,QAAM,wBAAoB,0BAAY,CAAC,aAA8B;AACnE,aAAS,QAAQ;AACjB,iBAAa,QAAQ,wBAAW,QAAQ;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,QAAM,4BAAwB,0BAAY,MAAM;AAC9C,iBAAa,CAAC,SAAS;AACrB,YAAM,UAAU,SAAS,UAAU,SAAS;AAC5C,mBAAa,QAAQ,uBAAU,OAAO;AACtC,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,oCAAgB,MAAM;AACpB,UAAMA,SAAQ,aAAa,QAAQ,sBAAS;AAC5C,QAAIA,QAAO;AACT,eAASA,MAAwB;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,oCAAgB,MAAM;AACpB,UAAM,OAAO,aAAa,QAAQ,qBAAQ;AAC1C,QAAI,MAAM;AACR,mBAAa,IAAkB;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,QAAQ;AAAA,EACvB,GAAG,CAAC,KAAK,CAAC;AAEV,8BAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,YAAY;AAAA,EAC3B,GAAG,CAAC,SAAS,CAAC;AAEd,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA,MAAM;AAAA,MACN,aAAa;AAAA,MACb,YAAY;AAAA,IACd;AAAA,IACA,CAAC,OAAO,WAAW,mBAAmB,qBAAqB;AAAA,EAC7D;AACF;","names":["theme"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/hooks/useTheme.ts"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react'\nimport {\n MODE_KEY,\n THEME_KEY,\n type ColorModes,\n type CustomThemes,\n type DefaultThemes,\n} from '../context/theme'\n\nexport function useTheme<C extends string = DefaultThemes>(\n defaultTheme: CustomThemes<C> = 'cerberus',\n defaultColorMode: ColorModes = 'light',\n) {\n const [theme, setTheme] = useState<CustomThemes<C>>(defaultTheme)\n const [colorMode, setColorMode] = useState<ColorModes>(defaultColorMode)\n\n const handleThemeChange = useCallback((newTheme: CustomThemes<C>) => {\n setTheme(newTheme)\n localStorage.setItem(THEME_KEY, newTheme)\n }, [])\n\n const handleColorModeChange = useCallback(() => {\n setColorMode((prev) => {\n const newMode = prev === 'light' ? 'dark' : 'light'\n localStorage.setItem(MODE_KEY, newMode)\n return newMode\n })\n }, [])\n\n useLayoutEffect(() => {\n const theme = localStorage.getItem(THEME_KEY)\n if (theme) {\n setTheme(theme as CustomThemes<C>)\n }\n }, [])\n\n useLayoutEffect(() => {\n const mode = localStorage.getItem(MODE_KEY)\n if (mode) {\n setColorMode(mode as ColorModes)\n }\n }, [])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.theme = theme\n }, [theme])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.colorMode = colorMode\n }, [colorMode])\n\n return useMemo(\n () => ({\n theme,\n mode: colorMode,\n updateTheme: handleThemeChange,\n updateMode: handleColorModeChange,\n }),\n [theme, colorMode, handleThemeChange, handleColorModeChange],\n )\n}\n"],"mappings":";;;AAEA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,OAIK;AAEA,SAAS,SACd,eAAgC,YAChC,mBAA+B,SAC/B;AACA,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA0B,YAAY;AAChE,QAAM,CAAC,WAAW,YAAY,IAAI,SAAqB,gBAAgB;AAEvE,QAAM,oBAAoB,YAAY,CAAC,aAA8B;AACnE,aAAS,QAAQ;AACjB,iBAAa,QAAQ,WAAW,QAAQ;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,QAAM,wBAAwB,YAAY,MAAM;AAC9C,iBAAa,CAAC,SAAS;AACrB,YAAM,UAAU,SAAS,UAAU,SAAS;AAC5C,mBAAa,QAAQ,UAAU,OAAO;AACtC,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,kBAAgB,MAAM;AACpB,UAAMA,SAAQ,aAAa,QAAQ,SAAS;AAC5C,QAAIA,QAAO;AACT,eAASA,MAAwB;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,kBAAgB,MAAM;AACpB,UAAM,OAAO,aAAa,QAAQ,QAAQ;AAC1C,QAAI,MAAM;AACR,mBAAa,IAAkB;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,QAAQ;AAAA,EACvB,GAAG,CAAC,KAAK,CAAC;AAEV,YAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,YAAY;AAAA,EAC3B,GAAG,CAAC,SAAS,CAAC;AAEd,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA,MAAM;AAAA,MACN,aAAa;AAAA,MACb,YAAY;AAAA,IACd;AAAA,IACA,CAAC,OAAO,WAAW,mBAAmB,qBAAqB;AAAA,EAC7D;AACF;","names":["theme"]}
1
+ {"version":3,"sources":["../../../src/hooks/useTheme.ts"],"sourcesContent":["'use client'\n\nimport {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react'\nimport {\n MODE_KEY,\n THEME_KEY,\n type ColorModes,\n type CustomThemes,\n type DefaultThemes,\n type ThemeContextValue,\n} from '../context/theme'\n\nexport function useTheme<C extends string = DefaultThemes>(\n defaultTheme: CustomThemes<C> = 'cerberus',\n defaultColorMode: ColorModes = 'light',\n): ThemeContextValue<C> {\n const [theme, setTheme] = useState<CustomThemes<C>>(defaultTheme)\n const [colorMode, setColorMode] = useState<ColorModes>(defaultColorMode)\n\n const handleThemeChange = useCallback((newTheme: CustomThemes<C>) => {\n setTheme(newTheme)\n localStorage.setItem(THEME_KEY, newTheme)\n }, [])\n\n const handleColorModeChange = useCallback(() => {\n setColorMode((prev) => {\n const newMode = prev === 'light' ? 'dark' : 'light'\n localStorage.setItem(MODE_KEY, newMode)\n return newMode\n })\n }, [])\n\n useLayoutEffect(() => {\n const theme = localStorage.getItem(THEME_KEY)\n if (theme) {\n setTheme(theme as CustomThemes<C>)\n }\n }, [])\n\n useLayoutEffect(() => {\n const mode = localStorage.getItem(MODE_KEY)\n if (mode) {\n setColorMode(mode as ColorModes)\n }\n }, [])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.theme = theme\n }, [theme])\n\n useEffect(() => {\n const root = document.documentElement\n root.dataset.colorMode = colorMode\n }, [colorMode])\n\n return useMemo(\n () => ({\n theme,\n mode: colorMode,\n updateTheme: handleThemeChange,\n updateMode: handleColorModeChange,\n }),\n [theme, colorMode, handleThemeChange, handleColorModeChange],\n )\n}\n"],"mappings":";;;AAEA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,OAKK;AAEA,SAAS,SACd,eAAgC,YAChC,mBAA+B,SACT;AACtB,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA0B,YAAY;AAChE,QAAM,CAAC,WAAW,YAAY,IAAI,SAAqB,gBAAgB;AAEvE,QAAM,oBAAoB,YAAY,CAAC,aAA8B;AACnE,aAAS,QAAQ;AACjB,iBAAa,QAAQ,WAAW,QAAQ;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,QAAM,wBAAwB,YAAY,MAAM;AAC9C,iBAAa,CAAC,SAAS;AACrB,YAAM,UAAU,SAAS,UAAU,SAAS;AAC5C,mBAAa,QAAQ,UAAU,OAAO;AACtC,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,kBAAgB,MAAM;AACpB,UAAMA,SAAQ,aAAa,QAAQ,SAAS;AAC5C,QAAIA,QAAO;AACT,eAASA,MAAwB;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,kBAAgB,MAAM;AACpB,UAAM,OAAO,aAAa,QAAQ,QAAQ;AAC1C,QAAI,MAAM;AACR,mBAAa,IAAkB;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,QAAQ;AAAA,EACvB,GAAG,CAAC,KAAK,CAAC;AAEV,YAAU,MAAM;AACd,UAAM,OAAO,SAAS;AACtB,SAAK,QAAQ,YAAY;AAAA,EAC3B,GAAG,CAAC,SAAS,CAAC;AAEd,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA,MAAM;AAAA,MACN,aAAa;AAAA,MACb,YAAY;AAAA,IACd;AAAA,IACA,CAAC,OAAO,WAAW,mBAAmB,qBAAqB;AAAA,EAC7D;AACF;","names":["theme"]}