@lotte-innovate/ui-component-test 0.1.18 → 0.1.20
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +71 -71
- package/dist/globals.css +4 -4
- package/dist/lib/components/Accordion/index.d.ts +10 -4
- package/dist/lib/components/Accordion/index.js +17 -11
- package/dist/lib/components/AlertDialog/AlertDialogAction.js +1 -1
- package/dist/lib/components/AlertDialog/AlertDialogCancel.js +1 -1
- package/dist/lib/components/AlertDialog/AlertDialogContent.js +2 -2
- package/dist/lib/components/AlertDialog/AlertDialogRoot.d.ts +1 -1
- package/dist/lib/components/AlertDialog/AlertDialogRoot.js +7 -2
- package/dist/lib/components/AlertDialog/AlertDialogTrigger.js +1 -1
- package/dist/lib/components/Avatar/index.d.ts +3 -0
- package/dist/lib/components/Avatar/index.js +3 -2
- package/dist/lib/components/BarChart/index.d.ts +5 -3
- package/dist/lib/components/BarChart/index.js +12 -1
- package/dist/lib/components/BubbleChart/index.d.ts +3 -0
- package/dist/lib/components/Callout/CalloutIcon.js +3 -3
- package/dist/lib/components/Callout/CalloutRoot.d.ts +18 -0
- package/dist/lib/components/Callout/CalloutRoot.js +72 -0
- package/dist/lib/components/Callout/CalloutText.js +2 -2
- package/dist/lib/components/Callout/index.d.ts +6 -19
- package/dist/lib/components/Callout/index.js +7 -73
- package/dist/lib/components/CheckboxGroup/CheckboxGroupItem.js +2 -2
- package/dist/lib/components/CheckboxGroup/CheckboxGroupRoot.d.ts +16 -0
- package/dist/lib/components/CheckboxGroup/CheckboxGroupRoot.js +34 -0
- package/dist/lib/components/CheckboxGroup/index.d.ts +5 -16
- package/dist/lib/components/CheckboxGroup/index.js +3 -34
- package/dist/lib/components/ContextMenu/ContextMenuCheckboxItem.d.ts +1 -1
- package/dist/lib/components/ContextMenu/ContextMenuCheckboxItem.js +4 -2
- package/dist/lib/components/ContextMenu/ContextMenuContent.js +2 -2
- package/dist/lib/components/ContextMenu/ContextMenuGroup.d.ts +1 -1
- package/dist/lib/components/ContextMenu/ContextMenuGroup.js +1 -1
- package/dist/lib/components/ContextMenu/ContextMenuItem.js +2 -2
- package/dist/lib/components/ContextMenu/ContextMenuItemIndicator.js +2 -2
- package/dist/lib/components/ContextMenu/ContextMenuLabel.js +2 -2
- package/dist/lib/components/ContextMenu/ContextMenuRadioGroup.js +1 -1
- package/dist/lib/components/ContextMenu/ContextMenuRadioItem.d.ts +1 -1
- package/dist/lib/components/ContextMenu/ContextMenuRadioItem.js +5 -2
- package/dist/lib/components/ContextMenu/ContextMenuRoot.d.ts +13 -0
- package/dist/lib/components/ContextMenu/ContextMenuRoot.js +42 -0
- package/dist/lib/components/ContextMenu/ContextMenuSeparator.js +1 -1
- package/dist/lib/components/ContextMenu/ContextMenuSubContent.js +4 -3
- package/dist/lib/components/ContextMenu/ContextMenuSubTrigger.js +2 -2
- package/dist/lib/components/ContextMenu/ContextMenuTrigger.d.ts +1 -1
- package/dist/lib/components/ContextMenu/ContextMenuTrigger.js +2 -2
- package/dist/lib/components/ContextMenu/index.d.ts +16 -24
- package/dist/lib/components/ContextMenu/index.js +27 -52
- package/dist/lib/components/DataList/DataListItem.js +2 -2
- package/dist/lib/components/DataList/DataListLabel.js +2 -2
- package/dist/lib/components/DataList/DataListRoot.d.ts +14 -0
- package/dist/lib/components/DataList/DataListRoot.js +54 -0
- package/dist/lib/components/DataList/DataListValue.js +2 -2
- package/dist/lib/components/DataList/index.d.ts +7 -16
- package/dist/lib/components/DataList/index.js +5 -56
- package/dist/lib/components/Dialog/DialogAction.d.ts +0 -2
- package/dist/lib/components/Dialog/DialogAction.js +7 -5
- package/dist/lib/components/Dialog/DialogCancel.js +5 -3
- package/dist/lib/components/Dialog/DialogContent.js +5 -3
- package/dist/lib/components/Dialog/DialogDescription.js +5 -3
- package/dist/lib/components/Dialog/DialogRoot.d.ts +12 -0
- package/dist/lib/components/Dialog/DialogRoot.js +37 -0
- package/dist/lib/components/Dialog/DialogSlot.js +5 -3
- package/dist/lib/components/Dialog/DialogTitle.js +5 -3
- package/dist/lib/components/Dialog/DialogTrigger.js +1 -1
- package/dist/lib/components/Dialog/index.d.ts +11 -17
- package/dist/lib/components/Dialog/index.js +17 -36
- package/dist/lib/components/DoughnutChart/index.js +9 -18
- package/dist/lib/components/DropdownMenu/DropdonMenuRadioGroup.d.ts +0 -5
- package/dist/lib/components/DropdownMenu/DropdonMenuRadioGroup.js +3 -4
- package/dist/lib/components/DropdownMenu/DropdonMenuSubContent.js +5 -3
- package/dist/lib/components/DropdownMenu/DropdownMenuCheckboxItem.d.ts +1 -1
- package/dist/lib/components/DropdownMenu/DropdownMenuCheckboxItem.js +7 -4
- package/dist/lib/components/DropdownMenu/DropdownMenuContent.js +5 -3
- package/dist/lib/components/DropdownMenu/DropdownMenuItem.d.ts +2 -0
- package/dist/lib/components/DropdownMenu/DropdownMenuItem.js +5 -3
- package/dist/lib/components/DropdownMenu/DropdownMenuItemIndicator.js +5 -3
- package/dist/lib/components/DropdownMenu/DropdownMenuLable.d.ts +0 -1
- package/dist/lib/components/DropdownMenu/DropdownMenuLable.js +5 -6
- package/dist/lib/components/DropdownMenu/DropdownMenuRadioItem.d.ts +4 -2
- package/dist/lib/components/DropdownMenu/DropdownMenuRadioItem.js +8 -6
- package/dist/lib/components/DropdownMenu/DropdownMenuRoot.d.ts +12 -0
- package/dist/lib/components/DropdownMenu/DropdownMenuRoot.js +38 -0
- package/dist/lib/components/DropdownMenu/DropdownMenuSeparator.js +1 -1
- package/dist/lib/components/DropdownMenu/DropdownMenuSub.js +1 -1
- package/dist/lib/components/DropdownMenu/DropdownMenuSubTrigger.js +5 -3
- package/dist/lib/components/DropdownMenu/DropdownMenuTrigger.d.ts +2 -1
- package/dist/lib/components/DropdownMenu/DropdownMenuTrigger.js +5 -3
- package/dist/lib/components/DropdownMenu/index.d.ts +16 -22
- package/dist/lib/components/DropdownMenu/index.js +27 -41
- package/dist/lib/components/HoverCard/HoverCardContent.js +5 -3
- package/dist/lib/components/HoverCard/HoverCardRoot.d.ts +8 -0
- package/dist/lib/components/HoverCard/HoverCardRoot.js +38 -0
- package/dist/lib/components/HoverCard/HoverCardTrigger.js +1 -1
- package/dist/lib/components/HoverCard/index.d.ts +6 -9
- package/dist/lib/components/HoverCard/index.js +7 -31
- package/dist/lib/components/LineChart/index.d.ts +87 -0
- package/dist/lib/components/LineChart/index.js +58 -0
- package/dist/lib/components/Menubar/MenubarCheckboxItem.js +2 -2
- package/dist/lib/components/Menubar/MenubarContent.js +2 -2
- package/dist/lib/components/Menubar/MenubarItem.js +2 -2
- package/dist/lib/components/Menubar/MenubarItemIndicator.js +2 -2
- package/dist/lib/components/Menubar/MenubarMenu.js +1 -1
- package/dist/lib/components/Menubar/MenubarRadioGroup.js +1 -1
- package/dist/lib/components/Menubar/MenubarRadioItem.js +2 -2
- package/dist/lib/components/Menubar/MenubarRoot.d.ts +19 -0
- package/dist/lib/components/Menubar/MenubarRoot.js +61 -0
- package/dist/lib/components/Menubar/MenubarSeparator.js +1 -1
- package/dist/lib/components/Menubar/MenubarSub.js +1 -1
- package/dist/lib/components/Menubar/MenubarSubContent.js +2 -2
- package/dist/lib/components/Menubar/MenubarSubTrigger.js +2 -2
- package/dist/lib/components/Menubar/MenubarTrigger.js +2 -2
- package/dist/lib/components/Menubar/index.d.ts +16 -30
- package/dist/lib/components/Menubar/index.js +27 -71
- package/dist/lib/components/NavigationMenu/NavigationMenuContent.js +2 -2
- package/dist/lib/components/NavigationMenu/NavigationMenuIndicator.js +1 -1
- package/dist/lib/components/NavigationMenu/NavigationMenuItem.js +1 -1
- package/dist/lib/components/NavigationMenu/NavigationMenuLink.js +2 -2
- package/dist/lib/components/NavigationMenu/NavigationMenuList.js +2 -2
- package/dist/lib/components/NavigationMenu/NavigationMenuRoot.d.ts +14 -0
- package/dist/lib/components/NavigationMenu/NavigationMenuRoot.js +43 -0
- package/dist/lib/components/NavigationMenu/NavigationMenuTrigger.js +2 -2
- package/dist/lib/components/NavigationMenu/NavigationMenuViewport.js +2 -2
- package/dist/lib/components/NavigationMenu/index.d.ts +11 -20
- package/dist/lib/components/NavigationMenu/index.js +9 -49
- package/dist/lib/components/PieChart/index.js +9 -18
- package/dist/lib/components/Popover/PopoverClose.js +5 -3
- package/dist/lib/components/Popover/PopoverContent.js +5 -3
- package/dist/lib/components/Popover/PopoverRoot.d.ts +9 -0
- package/dist/lib/components/Popover/PopoverRoot.js +36 -0
- package/dist/lib/components/Popover/PopoverTrigger.js +1 -1
- package/dist/lib/components/Popover/index.d.ts +7 -11
- package/dist/lib/components/Popover/index.js +9 -32
- package/dist/lib/components/RadioCards/RadioCardsItem.js +5 -3
- package/dist/lib/components/RadioCards/RadioCardsRoot.d.ts +14 -0
- package/dist/lib/components/RadioCards/RadioCardsRoot.js +46 -0
- package/dist/lib/components/RadioCards/index.d.ts +5 -13
- package/dist/lib/components/RadioCards/index.js +5 -41
- package/dist/lib/components/RadioGroup/RadioGroupItem.js +5 -3
- package/dist/lib/components/RadioGroup/RadioGroupRoot.d.ts +16 -0
- package/dist/lib/components/RadioGroup/RadioGroupRoot.js +53 -0
- package/dist/lib/components/RadioGroup/index.d.ts +5 -15
- package/dist/lib/components/RadioGroup/index.js +5 -49
- package/dist/lib/components/SegmentedControl/SegmentedControlItem.js +1 -1
- package/dist/lib/components/SegmentedControl/SegmentedControlRoot.d.ts +14 -0
- package/dist/lib/components/SegmentedControl/SegmentedControlRoot.js +47 -0
- package/dist/lib/components/SegmentedControl/index.d.ts +5 -14
- package/dist/lib/components/SegmentedControl/index.js +5 -46
- package/dist/lib/components/Select/index.d.ts +16 -7
- package/dist/lib/components/Select/index.js +23 -14
- package/dist/lib/components/TabNav/index.d.ts +6 -2
- package/dist/lib/components/TabNav/index.js +9 -5
- package/dist/lib/components/Table/index.d.ts +16 -7
- package/dist/lib/components/Table/index.js +23 -14
- package/dist/lib/components/Tabs/index.d.ts +10 -4
- package/dist/lib/components/Tabs/index.js +15 -9
- package/dist/lib/components/TextField/index.d.ts +6 -2
- package/dist/lib/components/TextField/index.js +8 -4
- package/dist/lib/components/Toast/ToastActionButton.js +2 -2
- package/dist/lib/components/Toast/ToastDescription.js +2 -2
- package/dist/lib/components/Toast/ToastRoot.d.ts +27 -0
- package/dist/lib/components/Toast/ToastRoot.js +90 -0
- package/dist/lib/components/Toast/ToastTitle.js +2 -2
- package/dist/lib/components/Toast/index.d.ts +7 -29
- package/dist/lib/components/Toast/index.js +9 -92
- package/dist/lib/components/ToggleGroup/{toggleGroupItem.js → ToggleGroupItem.js} +6 -4
- package/dist/lib/components/ToggleGroup/ToggleGroupRoot.d.ts +18 -0
- package/dist/lib/components/ToggleGroup/ToggleGroupRoot.js +47 -0
- package/dist/lib/components/ToggleGroup/index.d.ts +5 -19
- package/dist/lib/components/ToggleGroup/index.js +5 -41
- package/dist/lib/components/Tooltip/index.d.ts +3 -3
- package/dist/lib/components/Tooltip/index.js +3 -2
- package/dist/lib/components/index.d.ts +1 -0
- package/dist/lib/components/index.js +1 -0
- package/dist/lib/constants.d.ts +0 -9
- package/dist/lib/constants.js +0 -7
- package/package.json +131 -132
- /package/dist/lib/components/ToggleGroup/{toggleGroupItem.d.ts → ToggleGroupItem.d.ts} +0 -0
@@ -28,11 +28,11 @@ import { cn } from '../../../lib/utils/utils';
|
|
28
28
|
import { menubarItemVariants } from './MenubarItem';
|
29
29
|
import { MenubarItemIndicator } from './MenubarItemIndicator';
|
30
30
|
import { menuItemAppearanceStyle } from '../../../lib/constants';
|
31
|
-
import { useMenubarContext } from '
|
31
|
+
import { useMenubarContext } from './MenubarRoot';
|
32
32
|
export var MenubarCheckboxItem = forwardRef(function (_a, ref) {
|
33
33
|
var children = _a.children, className = _a.className, checked = _a.checked, props = __rest(_a, ["children", "className", "checked"]);
|
34
34
|
var _b = useMenubarContext(), radius = _b.radius, scaling = _b.scaling, size = _b.size, _c = _b.color, color = _c === void 0 ? 'red' : _c, _d = _b.itemAppearance, itemAppearance = _d === void 0 ? 'solid' : _d;
|
35
35
|
var itemClassName = cn(menubarItemVariants({ radius: radius, scaling: scaling, size: size }), 'pl-7', menuItemAppearanceStyle(itemAppearance, color), className);
|
36
36
|
return (_jsxs(MenubarPrimitive.CheckboxItem, __assign({ ref: ref, className: itemClassName }, props, { children: [_jsx(MenubarItemIndicator, { forceMount: true, radius: 'medium', size: size, children: checked && _jsx(CheckIcon, {}) }), children] })));
|
37
37
|
});
|
38
|
-
MenubarCheckboxItem.displayName = '
|
38
|
+
MenubarCheckboxItem.displayName = 'Menubar.CheckboxItem';
|
@@ -26,7 +26,7 @@ import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
|
26
26
|
import { cva } from 'class-variance-authority';
|
27
27
|
import { cn } from '../../../lib/utils/utils';
|
28
28
|
import { scalingVariants } from '../../../lib/constants';
|
29
|
-
import { useMenubarContext } from '
|
29
|
+
import { useMenubarContext } from './MenubarRoot';
|
30
30
|
export var menubarContentVariants = cva("p-[5px] w-fit bg-white dark:bg-slateDark-1 will-change-[transform,opacity]\n shadow-[0px_10px_38px_-10px_rgba(22,_23,_24,_0.35),_0px_10px_20px_-15px_rgba(22,_23,_24,_0.2)] \n [animation-duration:_400ms] [animation-timing-function:_cubic-bezier(0.16,_1,_0.3,_1)]", {
|
31
31
|
variants: {
|
32
32
|
radius: {
|
@@ -57,4 +57,4 @@ export var MenubarContent = forwardRef(function (_a, ref) {
|
|
57
57
|
scaling: scaling,
|
58
58
|
}), className), align: "start", sideOffset: 5, alignOffset: -3 }, props, { children: children })) }));
|
59
59
|
});
|
60
|
-
MenubarContent.displayName = '
|
60
|
+
MenubarContent.displayName = 'Menubar.Content';
|
@@ -26,7 +26,7 @@ import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
|
26
26
|
import { cva } from 'class-variance-authority';
|
27
27
|
import { cn } from '../../../lib/utils/utils';
|
28
28
|
import { blackText, menuItemAppearanceStyle, radiusVariants, scalingVariants } from '../../../lib/constants';
|
29
|
-
import { useMenubarContext } from '
|
29
|
+
import { useMenubarContext } from './MenubarRoot';
|
30
30
|
export var menubarItemVariants = cva("flex group relative leading-none select-none outline-none items-center justify-between font-normal\n data-[disabled]:text-slate-8 data-[disabled]:cursor-not-allowed text-slate-12 dark:text-slateDark-12\n data-[disabled]:hover:bg-transparent dark:data-[disabled]:text-slateDark-8 data-[disabled]:dark:hover:bg-transparent", {
|
31
31
|
variants: {
|
32
32
|
radius: __assign({}, radiusVariants['menu-item']),
|
@@ -51,4 +51,4 @@ export var MenubarItem = forwardRef(function (_a, ref) {
|
|
51
51
|
: '');
|
52
52
|
return (_jsxs(MenubarPrimitive.Item, __assign({ ref: ref, className: itemClassName }, props, { children: [children, shortcut && _jsx("span", { className: shortcutClassName, children: shortcut })] })));
|
53
53
|
});
|
54
|
-
MenubarItem.displayName = '
|
54
|
+
MenubarItem.displayName = 'Menubar.Item';
|
@@ -26,7 +26,7 @@ import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
|
26
26
|
import { cn } from '../../../lib/utils/utils';
|
27
27
|
import { cva } from 'class-variance-authority';
|
28
28
|
import { radiusVariants } from '../../../lib/constants';
|
29
|
-
import { useMenubarContext } from '
|
29
|
+
import { useMenubarContext } from './MenubarRoot';
|
30
30
|
export var menubarItemIndicatorVariants = cva("absolute left-0 inline-flex items-center justify-center ml-1 border", {
|
31
31
|
variants: {
|
32
32
|
radius: __assign({}, radiusVariants['base']),
|
@@ -46,4 +46,4 @@ export var MenubarItemIndicator = forwardRef(function (_a, ref) {
|
|
46
46
|
var indicatorClassName = cn(menubarItemIndicatorVariants({ size: size, radius: radius }), className);
|
47
47
|
return (_jsx(MenubarPrimitive.ItemIndicator, __assign({ ref: ref, className: indicatorClassName }, props, { children: children })));
|
48
48
|
});
|
49
|
-
MenubarItemIndicator.displayName = '
|
49
|
+
MenubarItemIndicator.displayName = 'Menubar.ItemIndicator';
|
@@ -27,4 +27,4 @@ export var MenubarMenu = forwardRef(function (_a, ref) {
|
|
27
27
|
var children = _a.children, props = __rest(_a, ["children"]);
|
28
28
|
return _jsx(MenubarPrimitive.Menu, __assign({}, props, { children: children }));
|
29
29
|
});
|
30
|
-
MenubarMenu.displayName = '
|
30
|
+
MenubarMenu.displayName = 'Menubar.Menu';
|
@@ -28,4 +28,4 @@ export var MenubarRadioGroup = forwardRef(function (_a, ref) {
|
|
28
28
|
var children = _a.children, className = _a.className, value = _a.value, props = __rest(_a, ["children", "className", "value"]);
|
29
29
|
return (_jsx(MenubarPrimitive.RadioGroup, __assign({ ref: ref, className: className }, props, { children: _jsx(RadioContext.Provider, { value: { selectedValue: value !== null && value !== void 0 ? value : '' }, children: children }) })));
|
30
30
|
});
|
31
|
-
MenubarRadioGroup.displayName = '
|
31
|
+
MenubarRadioGroup.displayName = 'Menubar.RadioGroup';
|
@@ -29,7 +29,7 @@ import { menuItemAppearanceStyle } from '../../../lib/constants';
|
|
29
29
|
import { menubarItemVariants } from './MenubarItem';
|
30
30
|
import { MenubarItemIndicator } from './MenubarItemIndicator';
|
31
31
|
import { RadioContext } from './MenubarRadioGroup';
|
32
|
-
import { useMenubarContext } from '
|
32
|
+
import { useMenubarContext } from './MenubarRoot';
|
33
33
|
export var MenubarRadioItem = forwardRef(function (_a, ref) {
|
34
34
|
var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
|
35
35
|
var _b = useMenubarContext(), radius = _b.radius, scaling = _b.scaling, size = _b.size, _c = _b.color, color = _c === void 0 ? 'red' : _c, _d = _b.itemAppearance, itemAppearance = _d === void 0 ? 'solid' : _d;
|
@@ -37,4 +37,4 @@ export var MenubarRadioItem = forwardRef(function (_a, ref) {
|
|
37
37
|
var radioGroup = useContext(RadioContext);
|
38
38
|
return (_jsxs(MenubarPrimitive.RadioItem, __assign({ ref: ref, className: itemClassName }, props, { children: [_jsx(MenubarItemIndicator, { forceMount: true, radius: 'full', size: size, children: radioGroup.selectedValue === props.value && _jsx(DotFilledIcon, {}) }), children] })));
|
39
39
|
});
|
40
|
-
MenubarRadioItem.displayName = '
|
40
|
+
MenubarRadioItem.displayName = 'Menubar.RadioItem';
|
@@ -0,0 +1,19 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
3
|
+
import { VariantProps } from 'class-variance-authority';
|
4
|
+
import { IColor } from '../../../lib/types';
|
5
|
+
import { menubarTriggerVariants } from './MenubarTrigger';
|
6
|
+
import { menubarItemVariants } from './MenubarItem';
|
7
|
+
export interface MenubarProps extends VariantProps<typeof menubarVariants>, VariantProps<typeof menubarTriggerVariants>, VariantProps<typeof menubarItemVariants> {
|
8
|
+
appearance?: 'ghost' | 'solid';
|
9
|
+
itemAppearance?: 'ghost' | 'solid';
|
10
|
+
color?: IColor;
|
11
|
+
}
|
12
|
+
export declare const menubarVariants: (props?: ({
|
13
|
+
radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
|
14
|
+
size?: "small" | "medium" | null | undefined;
|
15
|
+
scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
|
16
|
+
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
17
|
+
export declare const useMenubarContext: () => MenubarProps;
|
18
|
+
export declare const MenubarRoot: React.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarProps & React.RefAttributes<HTMLDivElement>, "ref"> & MenubarProps & React.RefAttributes<HTMLDivElement>>;
|
19
|
+
export default MenubarRoot;
|
@@ -0,0 +1,61 @@
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
2
|
+
__assign = Object.assign || function(t) {
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
4
|
+
s = arguments[i];
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
6
|
+
t[p] = s[p];
|
7
|
+
}
|
8
|
+
return t;
|
9
|
+
};
|
10
|
+
return __assign.apply(this, arguments);
|
11
|
+
};
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
13
|
+
var t = {};
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
15
|
+
t[p] = s[p];
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
19
|
+
t[p[i]] = s[p[i]];
|
20
|
+
}
|
21
|
+
return t;
|
22
|
+
};
|
23
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
24
|
+
import { createContext, forwardRef, useContext, useMemo, } from 'react';
|
25
|
+
import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
26
|
+
import { cva } from 'class-variance-authority';
|
27
|
+
import { cn } from '../../../lib/utils/utils';
|
28
|
+
import { radiusVariants, scalingVariants } from '../../../lib/constants';
|
29
|
+
export var menubarVariants = cva('flex p-1 shadow bg-white dark:bg-slateDark-1', {
|
30
|
+
variants: {
|
31
|
+
radius: __assign({}, radiusVariants['base']),
|
32
|
+
size: {
|
33
|
+
small: 'text-xs',
|
34
|
+
medium: 'text-sm',
|
35
|
+
},
|
36
|
+
scaling: __assign({}, scalingVariants),
|
37
|
+
},
|
38
|
+
defaultVariants: {
|
39
|
+
radius: 'small',
|
40
|
+
size: 'medium',
|
41
|
+
},
|
42
|
+
});
|
43
|
+
var MenubarContext = createContext({
|
44
|
+
radius: 'medium',
|
45
|
+
scaling: '100%',
|
46
|
+
size: 'medium',
|
47
|
+
color: 'red',
|
48
|
+
appearance: 'ghost',
|
49
|
+
itemAppearance: 'solid',
|
50
|
+
});
|
51
|
+
export var useMenubarContext = function () {
|
52
|
+
return useContext(MenubarContext);
|
53
|
+
};
|
54
|
+
export var MenubarRoot = forwardRef(function (_a, ref) {
|
55
|
+
var children = _a.children, className = _a.className, radius = _a.radius, scaling = _a.scaling, size = _a.size, _b = _a.color, color = _b === void 0 ? 'red' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'ghost' : _c, _d = _a.itemAppearance, itemAppearance = _d === void 0 ? 'solid' : _d, props = __rest(_a, ["children", "className", "radius", "scaling", "size", "color", "appearance", "itemAppearance"]);
|
56
|
+
var contextValue = useMemo(function () { return ({ radius: radius, size: size, scaling: scaling, color: color, appearance: appearance, itemAppearance: itemAppearance }); }, [radius, size, scaling, color, appearance, itemAppearance]);
|
57
|
+
var menuClassName = cn(menubarVariants({ radius: radius, scaling: scaling, size: size }), appearance === 'solid' && "bg-".concat(color, "-9 dark:bg-$").concat(color, "Dark-9"), 'w-fit', className);
|
58
|
+
return (_jsx(MenubarContext.Provider, { value: contextValue, children: _jsx(MenubarPrimitive.Root, __assign({ ref: ref, className: menuClassName }, props, { children: children })) }));
|
59
|
+
});
|
60
|
+
MenubarRoot.displayName = 'Menubar.Root';
|
61
|
+
export default MenubarRoot;
|
@@ -28,4 +28,4 @@ export var MenubarSeparator = forwardRef(function (_a, ref) {
|
|
28
28
|
var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
|
29
29
|
return (_jsx(MenubarPrimitive.Separator, __assign({ ref: ref, className: cn('h-[1px] m-[5px] bg-slate-6 dark:bg-slateDark-6', className) }, props, { children: children })));
|
30
30
|
});
|
31
|
-
MenubarSeparator.displayName = '
|
31
|
+
MenubarSeparator.displayName = 'Menubar.Separator';
|
@@ -27,4 +27,4 @@ export var MenubarSub = forwardRef(function (_a, ref) {
|
|
27
27
|
var children = _a.children, props = __rest(_a, ["children"]);
|
28
28
|
return _jsx(MenubarPrimitive.Sub, __assign({}, props, { children: children }));
|
29
29
|
});
|
30
|
-
MenubarSub.displayName = '
|
30
|
+
MenubarSub.displayName = 'Menubar.Sub';
|
@@ -26,7 +26,7 @@ import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
|
26
26
|
import { cva } from 'class-variance-authority';
|
27
27
|
import { cn } from '../../../lib/utils/utils';
|
28
28
|
import { radiusVariants } from '../../../lib/constants';
|
29
|
-
import { useMenubarContext } from '
|
29
|
+
import { useMenubarContext } from './MenubarRoot';
|
30
30
|
export var menubarSubContentVariants = cva("p-[5px] w-fit bg-white dark:bg-slateDark-1 will-change-[transform,opacity]\n shadow-[0px_10px_38px_-10px_rgba(22,_23,_24,_0.35),_0px_10px_20px_-15px_rgba(22,_23,_24,_0.2)] \n [animation-duration:_400ms] [animation-timing-function:_cubic-bezier(0.16,_1,_0.3,_1)]", {
|
31
31
|
variants: {
|
32
32
|
radius: __assign({}, radiusVariants['extra-large']),
|
@@ -48,4 +48,4 @@ export var MenubarSubContent = forwardRef(function (_a, ref) {
|
|
48
48
|
size: size,
|
49
49
|
}), className), alignOffset: -5 }, props, { children: children })));
|
50
50
|
});
|
51
|
-
MenubarSubContent.displayName = '
|
51
|
+
MenubarSubContent.displayName = 'Menubar.SubContent';
|
@@ -27,7 +27,7 @@ import { ChevronRightIcon } from '@radix-ui/react-icons';
|
|
27
27
|
import { cn } from '../../../lib/utils/utils';
|
28
28
|
import { blackText, menuItemAppearanceStyle } from '../../../lib/constants';
|
29
29
|
import { menubarItemVariants } from './MenubarItem';
|
30
|
-
import { useMenubarContext } from '
|
30
|
+
import { useMenubarContext } from './MenubarRoot';
|
31
31
|
export var MenubarSubTrigger = forwardRef(function (_a, ref) {
|
32
32
|
var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
|
33
33
|
var _b = useMenubarContext(), scaling = _b.scaling, size = _b.size, radius = _b.radius, _c = _b.color, color = _c === void 0 ? 'red' : _c, _d = _b.itemAppearance, itemAppearance = _d === void 0 ? 'solid' : _d;
|
@@ -38,4 +38,4 @@ export var MenubarSubTrigger = forwardRef(function (_a, ref) {
|
|
38
38
|
}
|
39
39
|
return (_jsxs(MenubarPrimitive.SubTrigger, __assign({ ref: ref, className: triggerClassName }, props, { children: [children, _jsx("div", { className: iconClassName, children: _jsx(ChevronRightIcon, {}) })] })));
|
40
40
|
});
|
41
|
-
MenubarSubTrigger.displayName = '
|
41
|
+
MenubarSubTrigger.displayName = 'Menubar.SubTrigger';
|
@@ -26,7 +26,7 @@ import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
|
26
26
|
import { cva } from 'class-variance-authority';
|
27
27
|
import { cn } from '../../../lib/utils/utils';
|
28
28
|
import { appearanceStyle, scalingVariants } from '../../../lib/constants';
|
29
|
-
import { useMenubarContext } from '
|
29
|
+
import { useMenubarContext } from './MenubarRoot';
|
30
30
|
export var menubarTriggerVariants = cva("flex items-center justify-between gap-[2px] outline-none select-none leading-none py-1 px-3 font-medium", {
|
31
31
|
variants: {
|
32
32
|
size: {
|
@@ -54,4 +54,4 @@ export var MenubarTrigger = forwardRef(function (_a, ref) {
|
|
54
54
|
var triggerClassName = cn(menubarTriggerVariants({ scaling: scaling, size: size, radius: radius }), appearanceStyle(appearance, color), className);
|
55
55
|
return (_jsx(MenubarPrimitive.Trigger, __assign({ ref: ref, className: triggerClassName }, props, { children: children })));
|
56
56
|
});
|
57
|
-
MenubarTrigger.displayName = '
|
57
|
+
MenubarTrigger.displayName = 'Menubar.Trigger';
|
@@ -1,31 +1,17 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
import
|
4
|
-
import
|
5
|
-
import
|
6
|
-
import
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
export * from './MenubarRadioGroup';
|
18
|
-
export * from './MenubarRadioItem';
|
19
|
-
export interface MenubarProps extends VariantProps<typeof menubarVariants>, VariantProps<typeof menubarTriggerVariants>, VariantProps<typeof menubarItemVariants> {
|
20
|
-
appearance?: 'ghost' | 'solid';
|
21
|
-
itemAppearance?: 'ghost' | 'solid';
|
22
|
-
color?: IColor;
|
23
|
-
}
|
24
|
-
export declare const menubarVariants: (props?: ({
|
25
|
-
radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
|
26
|
-
size?: "small" | "medium" | null | undefined;
|
27
|
-
scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
|
28
|
-
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
29
|
-
export declare const useMenubarContext: () => MenubarProps;
|
30
|
-
export declare const Menubar: React.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarProps & React.RefAttributes<HTMLDivElement>, "ref"> & MenubarProps & React.RefAttributes<HTMLDivElement>>;
|
1
|
+
/// <reference types="react" />
|
2
|
+
declare const Menubar: {
|
3
|
+
Root: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarRoot").MenubarProps & import("react").RefAttributes<HTMLDivElement>>;
|
4
|
+
Menu: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<never>>;
|
5
|
+
Trigger: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./MenubarTrigger").MenubarTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
6
|
+
Content: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarContent").MenubarContentProps & import("react").RefAttributes<HTMLDivElement>>;
|
7
|
+
Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarItem").MenubarItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
8
|
+
Separator: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarSeparatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
9
|
+
Sub: import("react").ForwardRefExoticComponent<import("@radix-ui/react-menubar").MenubarSubProps & import("react").RefAttributes<never>>;
|
10
|
+
SubTrigger: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarSubTriggerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarItem").MenubarItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
11
|
+
SubContent: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarSubContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarSubContent").MenubarSubContentProps & import("react").RefAttributes<HTMLDivElement>>;
|
12
|
+
CheckboxItem: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarCheckboxItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarItem").MenubarItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
13
|
+
ItemIndicator: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarItemIndicatorProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("./MenubarItemIndicator").MenubarItemIndicatorProps & import("react").RefAttributes<HTMLSpanElement>>;
|
14
|
+
RadioGroup: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarRadioGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
15
|
+
RadioItem: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarRadioItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarItem").MenubarItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
16
|
+
};
|
31
17
|
export default Menubar;
|
@@ -1,73 +1,29 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
1
|
+
import { MenubarRoot as Root } from './MenubarRoot';
|
2
|
+
import { MenubarMenu as Menu } from './MenubarMenu';
|
3
|
+
import { MenubarTrigger as Trigger } from './MenubarTrigger';
|
4
|
+
import { MenubarContent as Content } from './MenubarContent';
|
5
|
+
import { MenubarItem as Item } from './MenubarItem';
|
6
|
+
import { MenubarSeparator as Separator } from './MenubarSeparator';
|
7
|
+
import { MenubarSub as Sub } from './MenubarSub';
|
8
|
+
import { MenubarSubTrigger as SubTrigger } from './MenubarSubTrigger';
|
9
|
+
import { MenubarSubContent as SubContent } from './MenubarSubContent';
|
10
|
+
import { MenubarCheckboxItem as CheckboxItem } from './MenubarCheckboxItem';
|
11
|
+
import { MenubarItemIndicator as ItemIndicator } from './MenubarItemIndicator';
|
12
|
+
import { MenubarRadioGroup as RadioGroup } from './MenubarRadioGroup';
|
13
|
+
import { MenubarRadioItem as RadioItem } from './MenubarRadioItem';
|
14
|
+
var Menubar = {
|
15
|
+
Root: Root,
|
16
|
+
Menu: Menu,
|
17
|
+
Trigger: Trigger,
|
18
|
+
Content: Content,
|
19
|
+
Item: Item,
|
20
|
+
Separator: Separator,
|
21
|
+
Sub: Sub,
|
22
|
+
SubTrigger: SubTrigger,
|
23
|
+
SubContent: SubContent,
|
24
|
+
CheckboxItem: CheckboxItem,
|
25
|
+
ItemIndicator: ItemIndicator,
|
26
|
+
RadioGroup: RadioGroup,
|
27
|
+
RadioItem: RadioItem,
|
11
28
|
};
|
12
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
13
|
-
var t = {};
|
14
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
15
|
-
t[p] = s[p];
|
16
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
17
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
18
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
19
|
-
t[p[i]] = s[p[i]];
|
20
|
-
}
|
21
|
-
return t;
|
22
|
-
};
|
23
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
24
|
-
import { createContext, forwardRef, useContext, } from 'react';
|
25
|
-
import * as MenubarPrimitive from '@radix-ui/react-menubar';
|
26
|
-
import { cva } from 'class-variance-authority';
|
27
|
-
import { cn } from '../../../lib/utils/utils';
|
28
|
-
import { radiusVariants, scalingVariants } from '../../../lib/constants';
|
29
|
-
export * from './MenubarMenu';
|
30
|
-
export * from './MenubarTrigger';
|
31
|
-
export * from './MenubarContent';
|
32
|
-
export * from './MenubarItem';
|
33
|
-
export * from './MenubarSeparator';
|
34
|
-
export * from './MenubarSub';
|
35
|
-
export * from './MenubarSubTrigger';
|
36
|
-
export * from './MenubarSubContent';
|
37
|
-
export * from './MenubarCheckboxItem';
|
38
|
-
export * from './MenubarItemIndicator';
|
39
|
-
export * from './MenubarRadioGroup';
|
40
|
-
export * from './MenubarRadioItem';
|
41
|
-
export var menubarVariants = cva('flex p-1 shadow bg-white dark:bg-slateDark-1', {
|
42
|
-
variants: {
|
43
|
-
radius: __assign({}, radiusVariants['base']),
|
44
|
-
size: {
|
45
|
-
small: 'text-xs',
|
46
|
-
medium: 'text-sm',
|
47
|
-
},
|
48
|
-
scaling: __assign({}, scalingVariants),
|
49
|
-
},
|
50
|
-
defaultVariants: {
|
51
|
-
radius: 'small',
|
52
|
-
size: 'medium',
|
53
|
-
},
|
54
|
-
});
|
55
|
-
var MenubarContext = createContext({
|
56
|
-
radius: 'medium',
|
57
|
-
scaling: '100%',
|
58
|
-
size: 'medium',
|
59
|
-
color: 'red',
|
60
|
-
appearance: 'ghost',
|
61
|
-
itemAppearance: 'solid',
|
62
|
-
});
|
63
|
-
export var useMenubarContext = function () {
|
64
|
-
return useContext(MenubarContext);
|
65
|
-
};
|
66
|
-
export var Menubar = forwardRef(function (_a, ref) {
|
67
|
-
var children = _a.children, className = _a.className, radius = _a.radius, scaling = _a.scaling, size = _a.size, _b = _a.color, color = _b === void 0 ? 'red' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'ghost' : _c, _d = _a.itemAppearance, itemAppearance = _d === void 0 ? 'solid' : _d, props = __rest(_a, ["children", "className", "radius", "scaling", "size", "color", "appearance", "itemAppearance"]);
|
68
|
-
var contextValue = { radius: radius, size: size, scaling: scaling, color: color, appearance: appearance, itemAppearance: itemAppearance };
|
69
|
-
var menuClassName = cn(menubarVariants({ radius: radius, scaling: scaling, size: size }), appearance === 'solid' && "bg-".concat(color, "-9 dark:bg-$").concat(color, "Dark-9"), 'w-fit', className);
|
70
|
-
return (_jsx(MenubarContext.Provider, { value: contextValue, children: _jsx(MenubarPrimitive.Root, __assign({ ref: ref, className: menuClassName }, props, { children: children })) }));
|
71
|
-
});
|
72
|
-
Menubar.displayName = 'Menubar';
|
73
29
|
export default Menubar;
|
@@ -26,7 +26,7 @@ import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
|
26
26
|
import { cn } from '../../../lib/utils/utils';
|
27
27
|
import { cva } from 'class-variance-authority';
|
28
28
|
import { radiusVariants } from '../../../lib/constants';
|
29
|
-
import { useNavigationMenuContext } from '
|
29
|
+
import { useNavigationMenuContext } from './NavigationMenuRoot';
|
30
30
|
export var navigationMenuContentVariants = cva("text-slate-12 dark:text-slateDark-12 bg-white dark:bg-slateDark-1 p-2", {
|
31
31
|
variants: {
|
32
32
|
radius: __assign({}, radiusVariants['extra-large']),
|
@@ -45,4 +45,4 @@ export var NavigationMenuContent = forwardRef(function (_a, ref) {
|
|
45
45
|
var _b = useNavigationMenuContext(), radius = _b.radius, size = _b.size;
|
46
46
|
return (_jsx(NavigationMenuPrimitive.Content, __assign({ ref: ref, className: cn("absolute top-0 left-0 w-full sm:w-auto\n data-[motion=from-start]:animate-enterFromLeft \n data-[motion=from-end]:animate-enterFromRight \n data-[motion=to-start]:animate-exitToLeft \n data-[motion=to-end]:animate-exitToRight", navigationMenuContentVariants({ radius: radius, size: size }), className) }, props, { children: children })));
|
47
47
|
});
|
48
|
-
NavigationMenuContent.displayName = '
|
48
|
+
NavigationMenuContent.displayName = 'NavigationMenu.Content';
|
@@ -28,4 +28,4 @@ export var NavigationMenuIndicator = forwardRef(function (_a, ref) {
|
|
28
28
|
var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
|
29
29
|
return (_jsxs(NavigationMenuPrimitive.Indicator, __assign({ ref: ref, className: "flex z-[1] top-full h-[10px] items-end justify-center overflow-hidden\n data-[state=visible]:animate-fadeIn data-[state=hidden]:animate-fadeOut \n transition-[width,transform_250ms_ease]" }, props, { children: [_jsx("div", { className: cn("relative top-[70%] h-[10px] w-[10px] rotate-[45deg] rounded-tl-[2px] \n bg-white dark:bg-slateDark-2 shadow-slate-4 shadow dark:shadow-slateDark-4", className) }), children] })));
|
30
30
|
});
|
31
|
-
NavigationMenuIndicator.displayName = '
|
31
|
+
NavigationMenuIndicator.displayName = 'NavigationMenu.Indicator';
|
@@ -27,4 +27,4 @@ export var NavigationMenuItem = forwardRef(function (_a, ref) {
|
|
27
27
|
var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
|
28
28
|
return (_jsx(NavigationMenuPrimitive.Item, __assign({ ref: ref, className: className }, props, { children: children })));
|
29
29
|
});
|
30
|
-
NavigationMenuItem.displayName = '
|
30
|
+
NavigationMenuItem.displayName = 'NavigationMenu.Item';
|
@@ -26,7 +26,7 @@ import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
|
26
26
|
import { cn } from '../../../lib/utils/utils';
|
27
27
|
import { cva } from 'class-variance-authority';
|
28
28
|
import { appearanceStyle, radiusVariants, scalingVariants } from '../../../lib/constants';
|
29
|
-
import { useNavigationMenuContext } from '
|
29
|
+
import { useNavigationMenuContext } from './NavigationMenuRoot';
|
30
30
|
export var navigationMenuLinkVariants = cva("block select-none leading-none outline-none py-1 px-3 cursor-alias hover:underline font-medium", {
|
31
31
|
variants: {
|
32
32
|
size: {
|
@@ -48,4 +48,4 @@ export var NavigationMenuLink = forwardRef(function (_a, ref) {
|
|
48
48
|
var linkClassName = cn(navigationMenuLinkVariants({ scaling: scaling, size: size, radius: radius }), appearanceStyle(appearance, color), className);
|
49
49
|
return (_jsx(NavigationMenuPrimitive.Link, __assign({ ref: ref, href: href, title: href, className: linkClassName }, props, { children: children })));
|
50
50
|
});
|
51
|
-
NavigationMenuLink.displayName = '
|
51
|
+
NavigationMenuLink.displayName = 'NavigationMenu.Link';
|
@@ -27,7 +27,7 @@ import { cn } from '../../../lib/utils/utils';
|
|
27
27
|
import { cva } from 'class-variance-authority';
|
28
28
|
import { appearanceStyle, radiusVariants, scalingVariants } from '../../../lib/constants';
|
29
29
|
import { NavigationMenuIndicator } from './NavigationMenuIndicator';
|
30
|
-
import { useNavigationMenuContext } from '
|
30
|
+
import { useNavigationMenuContext } from './NavigationMenuRoot';
|
31
31
|
export var navigationMenuListVariants = cva('flex items-center p-1 space-x-1 shadow-slate-4 shadow dark:shadow-slateDark-4 bg-white dark:bg-slateDark-1', {
|
32
32
|
variants: {
|
33
33
|
radius: __assign({}, radiusVariants['base']),
|
@@ -44,4 +44,4 @@ export var NavigationMenuList = forwardRef(function (_a, ref) {
|
|
44
44
|
var navigationMenuListClassName = cn(navigationMenuListVariants({ scaling: scaling, radius: radius }), appearanceStyle(appearance, color, false), 'border-none', appearance === 'ghost' && 'bg-white', className);
|
45
45
|
return (_jsxs(NavigationMenuPrimitive.List, __assign({ ref: ref, className: navigationMenuListClassName }, props, { children: [children, isShowIndicator && _jsx(NavigationMenuIndicator, {})] })));
|
46
46
|
});
|
47
|
-
NavigationMenuList.displayName = '
|
47
|
+
NavigationMenuList.displayName = 'NavigationMenu.List';
|
@@ -0,0 +1,14 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
3
|
+
import { VariantProps } from 'class-variance-authority';
|
4
|
+
import { navigationMenuListVariants } from './NavigationMenuList';
|
5
|
+
import { navigationMenuTriggerVariants } from './NavigationMenuTrigger';
|
6
|
+
import { navigationMenuLinkVariants } from './NavigationMenuLink';
|
7
|
+
import { IColor } from '../../../lib/types';
|
8
|
+
export interface NavigationMenuProps extends VariantProps<typeof navigationMenuListVariants>, VariantProps<typeof navigationMenuTriggerVariants>, VariantProps<typeof navigationMenuLinkVariants> {
|
9
|
+
appearance?: 'ghost' | 'solid';
|
10
|
+
color?: IColor;
|
11
|
+
}
|
12
|
+
export declare const useNavigationMenuContext: () => NavigationMenuProps;
|
13
|
+
export declare const NavigationMenuRoot: React.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuProps & React.RefAttributes<HTMLElement>, "ref"> & NavigationMenuProps & React.RefAttributes<HTMLElement>>;
|
14
|
+
export default NavigationMenuRoot;
|
@@ -0,0 +1,43 @@
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
2
|
+
__assign = Object.assign || function(t) {
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
4
|
+
s = arguments[i];
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
6
|
+
t[p] = s[p];
|
7
|
+
}
|
8
|
+
return t;
|
9
|
+
};
|
10
|
+
return __assign.apply(this, arguments);
|
11
|
+
};
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
13
|
+
var t = {};
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
15
|
+
t[p] = s[p];
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
19
|
+
t[p[i]] = s[p[i]];
|
20
|
+
}
|
21
|
+
return t;
|
22
|
+
};
|
23
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
24
|
+
import { forwardRef, createContext, useContext, useMemo, } from 'react';
|
25
|
+
import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
26
|
+
import { cn } from '../../../lib/utils/utils';
|
27
|
+
var NavigationMenuContext = createContext({
|
28
|
+
radius: 'medium',
|
29
|
+
scaling: '100%',
|
30
|
+
size: 'medium',
|
31
|
+
color: 'red',
|
32
|
+
appearance: 'ghost',
|
33
|
+
});
|
34
|
+
export var useNavigationMenuContext = function () {
|
35
|
+
return useContext(NavigationMenuContext);
|
36
|
+
};
|
37
|
+
export var NavigationMenuRoot = forwardRef(function (_a, ref) {
|
38
|
+
var className = _a.className, children = _a.children, radius = _a.radius, size = _a.size, scaling = _a.scaling, color = _a.color, appearance = _a.appearance, props = __rest(_a, ["className", "children", "radius", "size", "scaling", "color", "appearance"]);
|
39
|
+
var contextValue = useMemo(function () { return ({ radius: radius, size: size, scaling: scaling, color: color, appearance: appearance }); }, [radius, size, scaling, color, appearance]);
|
40
|
+
return (_jsx(NavigationMenuContext.Provider, { value: contextValue, children: _jsx(NavigationMenuPrimitive.Root, __assign({ ref: ref, className: cn('flex relative z-[1] w-screen justify-center', className) }, props, { children: children })) }));
|
41
|
+
});
|
42
|
+
NavigationMenuRoot.displayName = 'NavigationMenu.Root';
|
43
|
+
export default NavigationMenuRoot;
|
@@ -27,7 +27,7 @@ import { cn } from '../../../lib/utils/utils';
|
|
27
27
|
import { cva } from 'class-variance-authority';
|
28
28
|
import { appearanceStyle, scalingVariants } from '../../../lib/constants';
|
29
29
|
import { CaretDownIcon } from '@radix-ui/react-icons';
|
30
|
-
import { useNavigationMenuContext } from '
|
30
|
+
import { useNavigationMenuContext } from './NavigationMenuRoot';
|
31
31
|
export var navigationMenuTriggerVariants = cva("flex items-center justify-between outline-none select-none leading-none py-1 px-3 font-medium", {
|
32
32
|
variants: {
|
33
33
|
size: {
|
@@ -55,4 +55,4 @@ export var NavigationMenuTrigger = forwardRef(function (_a, ref) {
|
|
55
55
|
var triggerClassName = cn(navigationMenuTriggerVariants({ scaling: scaling, size: size, radius: radius }), appearanceStyle(appearance, color), className);
|
56
56
|
return (_jsxs(NavigationMenuPrimitive.Trigger, __assign({ ref: ref, className: triggerClassName }, props, { children: [children, isShowIcon && (_jsx(CaretDownIcon, { className: cn("relative top-[1px] transition-transform duration-[250] ease-in group-data-[state=open]:-rotate-180"), "aria-hidden": true }))] })));
|
57
57
|
});
|
58
|
-
NavigationMenuTrigger.displayName = '
|
58
|
+
NavigationMenuTrigger.displayName = 'NavigationMenu.Trigger';
|
@@ -26,7 +26,7 @@ import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
|
26
26
|
import { cn } from '../../../lib/utils/utils';
|
27
27
|
import { cva } from 'class-variance-authority';
|
28
28
|
import { radiusVariants, scalingVariants, weightVariants } from '../../../lib/constants';
|
29
|
-
import { useNavigationMenuContext } from '
|
29
|
+
import { useNavigationMenuContext } from './NavigationMenuRoot';
|
30
30
|
export var navigationViewportVariants = cva("data-[state=open]:animate-scaleIn data-[state=closed]:animate-scaleOut relative mt-[10px] \n h-[var(--radix-navigation-menu-viewport-height)] w-full origin-[top_center] overflow-hidden \n transition-[width,_height] duration-300 shadow-slate-4 shadow dark:shadow-slateDark-4\n sm:w-[var(--radix-navigation-menu-viewport-width)]", {
|
31
31
|
variants: {
|
32
32
|
radius: __assign({}, radiusVariants['extra-large']),
|
@@ -50,4 +50,4 @@ export var NavigationMenuViewport = forwardRef(function (_a, ref) {
|
|
50
50
|
var viewportClassName = cn(navigationViewportVariants({ size: size, scaling: scaling, radius: radius }), className);
|
51
51
|
return (_jsx("div", { className: "perspective-[2000px] absolute top-full left-0 flex w-full justify-center ", children: _jsx(NavigationMenuPrimitive.Viewport, __assign({ ref: ref, className: viewportClassName }, props)) }));
|
52
52
|
});
|
53
|
-
NavigationMenuViewport.displayName = '
|
53
|
+
NavigationMenuViewport.displayName = 'NavigationMenu.Viewport';
|
@@ -1,21 +1,12 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
import
|
4
|
-
import
|
5
|
-
import
|
6
|
-
import
|
7
|
-
import
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
export * from './NavigationMenuViewport';
|
13
|
-
export * from './NavigationMenuIndicator';
|
14
|
-
export * from './NavigationMenuLink';
|
15
|
-
export interface NavigationMenuProps extends VariantProps<typeof navigationMenuListVariants>, VariantProps<typeof navigationMenuTriggerVariants>, VariantProps<typeof navigationMenuLinkVariants> {
|
16
|
-
appearance?: 'ghost' | 'solid';
|
17
|
-
color?: IColor;
|
18
|
-
}
|
19
|
-
export declare const useNavigationMenuContext: () => NavigationMenuProps;
|
20
|
-
export declare const NavigationMenu: React.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuProps & React.RefAttributes<HTMLElement>, "ref"> & NavigationMenuProps & React.RefAttributes<HTMLElement>>;
|
1
|
+
/// <reference types="react" />
|
2
|
+
declare const NavigationMenu: {
|
3
|
+
Root: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuProps & import("react").RefAttributes<HTMLElement>, "ref"> & import("./NavigationMenuRoot").NavigationMenuProps & import("react").RefAttributes<HTMLElement>>;
|
4
|
+
List: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, "ref"> & import("./NavigationMenuList").NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>;
|
5
|
+
Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
|
6
|
+
Trigger: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./NavigationMenuTrigger").NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
7
|
+
Content: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./NavigationMenuContent").NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>;
|
8
|
+
Viewport: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuViewportProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./NavigationMenuViewport").NavigationViewportProps & import("react").RefAttributes<HTMLDivElement>>;
|
9
|
+
Indicator: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuIndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
10
|
+
Link: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, "ref"> & import("./NavigationMenuLink").NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>;
|
11
|
+
};
|
21
12
|
export default NavigationMenu;
|