@tiny-design/react 1.0.4

package/es/menu/index.d.ts

@@ -0,0 +1,17 @@
+import { Menu } from "./menu.js";
+import { MenuItem } from "./menu-item.js";
+import { SubMenu } from "./sub-menu.js";
+import { MenuItemGroup } from "./menu-item-group.js";
+import { MenuDivider } from "./menu-divider.js";
+
+//#region src/menu/index.d.ts
+type IMenu = typeof Menu & {
+  Item: typeof MenuItem;
+  SubMenu: typeof SubMenu;
+  ItemGroup: typeof MenuItemGroup;
+  Divider: typeof MenuDivider;
+};
+declare const DefaultMenu: IMenu;
+//#endregion
+export { DefaultMenu };
+//# sourceMappingURL=index.d.ts.map

package/es/menu/index.js

@@ -0,0 +1,19 @@
+import '../style/base.css';
+import './style/index.css';
+import '../popup/style/index.css';
+import '../collapse-transition/style/index.css';
+import Menu from "./menu.js";
+import MenuItem from "./menu-item.js";
+import SubMenu from "./sub-menu.js";
+import MenuItemGroup from "./menu-item-group.js";
+import MenuDivider from "./menu-divider.js";
+//#region src/menu/index.tsx
+const DefaultMenu = Menu;
+DefaultMenu.Item = MenuItem;
+DefaultMenu.SubMenu = SubMenu;
+DefaultMenu.ItemGroup = MenuItemGroup;
+DefaultMenu.Divider = MenuDivider;
+//#endregion
+export { DefaultMenu as default };
+
+//# sourceMappingURL=index.js.map

package/es/menu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/menu/index.tsx"],"sourcesContent":["import Menu from './menu';\nimport MenuItem from './menu-item';\nimport SubMenu from './sub-menu';\nimport MenuItemGroup from './menu-item-group';\nimport MenuDivider from './menu-divider';\n\ntype IMenu = typeof Menu & {\n  Item: typeof MenuItem;\n  SubMenu: typeof SubMenu;\n  ItemGroup: typeof MenuItemGroup;\n  Divider: typeof MenuDivider;\n};\n\nconst DefaultMenu = Menu as IMenu;\nDefaultMenu.Item = MenuItem;\nDefaultMenu.SubMenu = SubMenu;\nDefaultMenu.ItemGroup = MenuItemGroup;\nDefaultMenu.Divider = MenuDivider;\n\nexport default DefaultMenu;\n"],"mappings":";;;;;;AAaA,MAAM,cAAc;AACpB,YAAY,OAAO;AACnB,YAAY,UAAU;AACtB,YAAY,YAAY;AACxB,YAAY,UAAU"}

package/es/menu/menu-context.js

@@ -0,0 +1,11 @@
+import React from "react";
+//#region src/menu/menu-context.ts
+const MenuContext = React.createContext({
+	index: "0",
+	inlineIndent: 20,
+	mode: "horizontal"
+});
+//#endregion
+export { MenuContext };
+
+//# sourceMappingURL=menu-context.js.map

package/es/menu/menu-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-context.js","names":[],"sources":["../../src/menu/menu-context.ts"],"sourcesContent":["import React from 'react';\nimport { MenuMode } from './types';\n\ntype Props = {\n  index: string;\n  mode: MenuMode;\n  inlineIndent: number;\n  onSelect?: (selectedIndex: string) => void;\n};\n\nexport const MenuContext = React.createContext<Props>({\n  index: '0',\n  inlineIndent: 20,\n  mode: 'horizontal',\n});\n"],"mappings":";;AAUA,MAAa,cAAc,MAAM,cAAqB;CACpD,OAAO;CACP,cAAc;CACd,MAAM;CACP,CAAC"}

package/es/menu/menu-divider.d.ts

@@ -0,0 +1,10 @@
+import { BaseProps } from "../_utils/props.js";
+
+//#region src/menu/menu-divider.d.ts
+declare const MenuDivider: {
+  (props: BaseProps): JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { MenuDivider };
+//# sourceMappingURL=menu-divider.d.ts.map

package/es/menu/menu-divider.js

@@ -0,0 +1,15 @@
+import { ConfigContext } from "../config-provider/config-context.js";
+import { getPrefixCls } from "../_utils/general.js";
+import { useContext } from "react";
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+//#region src/menu/menu-divider.tsx
+const MenuDivider = (props) => {
+	const { prefixCls: customisedCls, className } = props;
+	return /* @__PURE__ */ jsx("li", { className: classNames(getPrefixCls("menu-divider", useContext(ConfigContext).prefixCls, customisedCls), className) });
+};
+MenuDivider.displayName = "MenuDivider";
+//#endregion
+export { MenuDivider as default };
+
+//# sourceMappingURL=menu-divider.js.map

package/es/menu/menu-divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-divider.js","names":[],"sources":["../../src/menu/menu-divider.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport classNames from 'classnames';\nimport { ConfigContext } from '../config-provider/config-context';\nimport { getPrefixCls } from '../_utils/general';\nimport { BaseProps } from '../_utils/props';\n\nconst MenuDivider = (props: BaseProps): JSX.Element => {\n  const { prefixCls: customisedCls, className } = props;\n  const configContext = useContext(ConfigContext);\n  const prefixCls = getPrefixCls('menu-divider', configContext.prefixCls, customisedCls);\n  const cls = classNames(prefixCls, className);\n\n  return <li className={cls} />;\n};\n\nMenuDivider.displayName = 'MenuDivider';\n\nexport default MenuDivider;\n"],"mappings":";;;;;;AAMA,MAAM,eAAe,UAAkC;CACrD,MAAM,EAAE,WAAW,eAAe,cAAc;AAKhD,QAAO,oBAAC,MAAD,EAAI,WAFC,WADM,aAAa,gBADT,WAAW,cAAc,CACc,WAAW,cAAc,EACpD,UAAU,EAEf,CAAA;;AAG/B,YAAY,cAAc"}

package/es/menu/menu-item-group.d.ts

@@ -0,0 +1,10 @@
+import { MenuItemGroupProps } from "./types.js";
+
+//#region src/menu/menu-item-group.d.ts
+declare const MenuItemGroup: {
+  (props: MenuItemGroupProps): JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { MenuItemGroup };
+//# sourceMappingURL=menu-item-group.d.ts.map

package/es/menu/menu-item-group.js

@@ -0,0 +1,43 @@
+import { ConfigContext } from "../config-provider/config-context.js";
+import { getPrefixCls } from "../_utils/general.js";
+import { MenuContext } from "./menu-context.js";
+import { SubMenuContext } from "./sub-menu-context.js";
+import React, { createElement, useContext } from "react";
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+//#region src/menu/menu-item-group.tsx
+const MenuItemGroup = (props) => {
+	const { index, title, className, style, children, prefixCls: customisedCls, ...otherProps } = props;
+	const configContext = useContext(ConfigContext);
+	const { inlineIndent } = useContext(MenuContext);
+	const { level = 1 } = useContext(SubMenuContext);
+	const prefixCls = getPrefixCls("menu-item-group", configContext.prefixCls, customisedCls);
+	const cls = classNames(prefixCls, className);
+	return /* @__PURE__ */ createElement("li", {
+		...otherProps,
+		key: title,
+		className: cls,
+		style
+	}, /* @__PURE__ */ jsx("div", {
+		className: `${prefixCls}__title`,
+		style: { paddingLeft: inlineIndent * level - inlineIndent / 2 },
+		children: title
+	}), /* @__PURE__ */ jsx("ul", {
+		className: `${prefixCls}__list`,
+		children: React.Children.map(children, (child, idx) => {
+			const childElement = child;
+			if (childElement.type.displayName === "MenuItem") {
+				const childProps = { index: `${index}-${idx}` };
+				return React.cloneElement(childElement, childProps);
+			} else {
+				console.warn("Menu has a child that is not a MenuItem component.");
+				return null;
+			}
+		})
+	}));
+};
+MenuItemGroup.displayName = "MenuItemGroup";
+//#endregion
+export { MenuItemGroup as default };
+
+//# sourceMappingURL=menu-item-group.js.map

package/es/menu/menu-item-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item-group.js","names":[],"sources":["../../src/menu/menu-item-group.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport classNames from 'classnames';\nimport { ConfigContext } from '../config-provider/config-context';\nimport { getPrefixCls } from '../_utils/general';\nimport { MenuItemGroupProps, MenuItemProps } from './types';\nimport { MenuContext } from './menu-context';\nimport { SubMenuContext } from './sub-menu-context';\n\nconst MenuItemGroup = (props: MenuItemGroupProps): JSX.Element => {\n  const {\n    index,\n    title,\n    className,\n    style,\n    children,\n    prefixCls: customisedCls,\n    ...otherProps\n  } = props;\n  const configContext = useContext(ConfigContext);\n  const { inlineIndent } = useContext(MenuContext);\n  const { level = 1 } = useContext(SubMenuContext);\n  const prefixCls = getPrefixCls('menu-item-group', configContext.prefixCls, customisedCls);\n  const cls = classNames(prefixCls, className);\n\n  return (\n    <li {...otherProps} key={title} className={cls} style={style}>\n      <div\n        className={`${prefixCls}__title`}\n        style={{\n          paddingLeft: inlineIndent * level - inlineIndent / 2,\n        }}>\n        {title}\n      </div>\n      <ul className={`${prefixCls}__list`}>\n        {React.Children.map(children, (child, idx) => {\n          const childElement = child as React.FunctionComponentElement<MenuItemProps>;\n          if (childElement.type.displayName === 'MenuItem') {\n            const childProps: Partial<MenuItemProps> = {\n              index: `${index}-${idx}`,\n            };\n            return React.cloneElement(childElement, childProps);\n          } else {\n            console.warn('Menu has a child that is not a MenuItem component.');\n            return null;\n          }\n        })}\n      </ul>\n    </li>\n  );\n};\n\nMenuItemGroup.displayName = 'MenuItemGroup';\n\nexport default MenuItemGroup;\n"],"mappings":";;;;;;;;AAQA,MAAM,iBAAiB,UAA2C;CAChE,MAAM,EACJ,OACA,OACA,WACA,OACA,UACA,WAAW,eACX,GAAG,eACD;CACJ,MAAM,gBAAgB,WAAW,cAAc;CAC/C,MAAM,EAAE,iBAAiB,WAAW,YAAY;CAChD,MAAM,EAAE,QAAQ,MAAM,WAAW,eAAe;CAChD,MAAM,YAAY,aAAa,mBAAmB,cAAc,WAAW,cAAc;CACzF,MAAM,MAAM,WAAW,WAAW,UAAU;AAE5C,QACE,8BAAC,MAAD;EAAI,GAAI;EAAY,KAAK;EAAO,WAAW;EAAY;EAsBlD,EArBH,oBAAC,OAAD;EACE,WAAW,GAAG,UAAU;EACxB,OAAO,EACL,aAAa,eAAe,QAAQ,eAAe,GACpD;YACA;EACG,CAAA,EACN,oBAAC,MAAD;EAAI,WAAW,GAAG,UAAU;YACzB,MAAM,SAAS,IAAI,WAAW,OAAO,QAAQ;GAC5C,MAAM,eAAe;AACrB,OAAI,aAAa,KAAK,gBAAgB,YAAY;IAChD,MAAM,aAAqC,EACzC,OAAO,GAAG,MAAM,GAAG,OACpB;AACD,WAAO,MAAM,aAAa,cAAc,WAAW;UAC9C;AACL,YAAQ,KAAK,qDAAqD;AAClE,WAAO;;IAET;EACC,CAAA,CACF;;AAIT,cAAc,cAAc"}

package/es/menu/menu-item.d.ts

@@ -0,0 +1,10 @@
+import { MenuItemProps } from "./types.js";
+
+//#region src/menu/menu-item.d.ts
+declare const MenuItem: {
+  (props: MenuItemProps): JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { MenuItem };
+//# sourceMappingURL=menu-item.d.ts.map

package/es/menu/menu-item.js

@@ -0,0 +1,49 @@
+import { ConfigContext } from "../config-provider/config-context.js";
+import { getPrefixCls } from "../_utils/general.js";
+import { MenuContext } from "./menu-context.js";
+import { SubMenuContext } from "./sub-menu-context.js";
+import { createElement, useContext } from "react";
+import classNames from "classnames";
+//#region src/menu/menu-item.tsx
+const MenuItem = (props) => {
+	const { disabled = false, index, className, style, children, onClick, prefixCls: customisedCls, ...otherProps } = props;
+	const menuContext = useContext(MenuContext);
+	const subMenuContext = useContext(SubMenuContext);
+	const { inlineIndent, mode } = menuContext;
+	const { level = 1, onMenuItemClick } = subMenuContext;
+	const prefixCls = getPrefixCls("menu-item", useContext(ConfigContext).prefixCls, customisedCls);
+	const cls = classNames(prefixCls, className, {
+		[`${prefixCls}_disabled`]: disabled,
+		[`${prefixCls}_active`]: menuContext.index === index
+	});
+	const onItemClick = (e) => {
+		if (disabled) return;
+		onClick && onClick(e);
+		onMenuItemClick && onMenuItemClick();
+		if (menuContext.onSelect && typeof index === "string") menuContext.onSelect(index);
+	};
+	return /* @__PURE__ */ createElement("li", {
+		...otherProps,
+		key: index,
+		role: "menuitem",
+		tabIndex: disabled ? -1 : 0,
+		"aria-disabled": disabled || void 0,
+		className: cls,
+		style: {
+			paddingLeft: mode === "inline" ? level * inlineIndent : void 0,
+			...style
+		},
+		onClick: onItemClick,
+		onKeyDown: (e) => {
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				onItemClick(e);
+			}
+		}
+	}, children);
+};
+MenuItem.displayName = "MenuItem";
+//#endregion
+export { MenuItem as default };
+
+//# sourceMappingURL=menu-item.js.map

package/es/menu/menu-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.js","names":[],"sources":["../../src/menu/menu-item.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport classNames from 'classnames';\nimport { MenuContext } from './menu-context';\nimport { SubMenuContext } from './sub-menu-context';\nimport { ConfigContext } from '../config-provider/config-context';\nimport { getPrefixCls } from '../_utils/general';\nimport { MenuItemProps } from './types';\n\nconst MenuItem = (props: MenuItemProps): JSX.Element => {\n  const {\n    disabled = false,\n    index,\n    className,\n    style,\n    children,\n    onClick,\n    prefixCls: customisedCls,\n    ...otherProps\n  } = props;\n  const menuContext = useContext(MenuContext);\n  const subMenuContext = useContext(SubMenuContext);\n  const { inlineIndent, mode } = menuContext;\n  const { level = 1, onMenuItemClick } = subMenuContext;\n  const configContext = useContext(ConfigContext);\n  const prefixCls = getPrefixCls('menu-item', configContext.prefixCls, customisedCls);\n  const cls = classNames(prefixCls, className, {\n    [`${prefixCls}_disabled`]: disabled,\n    [`${prefixCls}_active`]: menuContext.index === index,\n  });\n\n  const onItemClick = (e: React.MouseEvent): void => {\n    if (disabled) {\n      return;\n    }\n\n    onClick && onClick(e);\n    onMenuItemClick && onMenuItemClick();\n    if (menuContext.onSelect && typeof index === 'string') {\n      menuContext.onSelect(index);\n    }\n  };\n\n  return (\n    <li\n      {...otherProps}\n      key={index}\n      role=\"menuitem\"\n      tabIndex={disabled ? -1 : 0}\n      aria-disabled={disabled || undefined}\n      className={cls}\n      style={{ paddingLeft: mode === 'inline' ? level * inlineIndent : undefined, ...style }}\n      onClick={onItemClick}\n      onKeyDown={(e: React.KeyboardEvent) => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault();\n          onItemClick(e as unknown as React.MouseEvent);\n        }\n      }}>\n      {children}\n    </li>\n  );\n};\n\nMenuItem.displayName = 'MenuItem';\n\nexport default MenuItem;\n"],"mappings":";;;;;;;AAQA,MAAM,YAAY,UAAsC;CACtD,MAAM,EACJ,WAAW,OACX,OACA,WACA,OACA,UACA,SACA,WAAW,eACX,GAAG,eACD;CACJ,MAAM,cAAc,WAAW,YAAY;CAC3C,MAAM,iBAAiB,WAAW,eAAe;CACjD,MAAM,EAAE,cAAc,SAAS;CAC/B,MAAM,EAAE,QAAQ,GAAG,oBAAoB;CAEvC,MAAM,YAAY,aAAa,aADT,WAAW,cAAc,CACW,WAAW,cAAc;CACnF,MAAM,MAAM,WAAW,WAAW,WAAW;GAC1C,GAAG,UAAU,aAAa;GAC1B,GAAG,UAAU,WAAW,YAAY,UAAU;EAChD,CAAC;CAEF,MAAM,eAAe,MAA8B;AACjD,MAAI,SACF;AAGF,aAAW,QAAQ,EAAE;AACrB,qBAAmB,iBAAiB;AACpC,MAAI,YAAY,YAAY,OAAO,UAAU,SAC3C,aAAY,SAAS,MAAM;;AAI/B,QACE,8BAAC,MAAD;EACE,GAAI;EACJ,KAAK;EACL,MAAK;EACL,UAAU,WAAW,KAAK;EAC1B,iBAAe,YAAY,KAAA;EAC3B,WAAW;EACX,OAAO;GAAE,aAAa,SAAS,WAAW,QAAQ,eAAe,KAAA;GAAW,GAAG;GAAO;EACtF,SAAS;EACT,YAAY,MAA2B;AACrC,OAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,MAAE,gBAAgB;AAClB,gBAAY,EAAiC;;;EAI9C,EADF,SACE;;AAIT,SAAS,cAAc"}

package/es/menu/menu.d.ts

@@ -0,0 +1,10 @@
+import { MenuProps } from "./types.js";
+
+//#region src/menu/menu.d.ts
+declare const Menu: {
+  (props: MenuProps): JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { Menu };
+//# sourceMappingURL=menu.d.ts.map

package/es/menu/menu.js

@@ -0,0 +1,51 @@
+import { ConfigContext } from "../config-provider/config-context.js";
+import { getPrefixCls } from "../_utils/general.js";
+import { MenuContext } from "./menu-context.js";
+import React, { useContext, useState } from "react";
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+//#region src/menu/menu.tsx
+const Menu = (props) => {
+	const { defaultIndex = "0", mode = "horizontal", theme = "light", inlineIndent = 20, onSelect, className, overlayClassName, style, children, prefixCls: customisedCls, ...otherProps } = props;
+	const prefixCls = getPrefixCls("menu", useContext(ConfigContext).prefixCls, customisedCls);
+	const cls = classNames(prefixCls, className, `${prefixCls}_root`, `${prefixCls}_${theme}`, `${prefixCls}_${mode}`);
+	const [activeIndex, setActiveIndex] = useState(defaultIndex);
+	const contextValue = {
+		mode,
+		inlineIndent,
+		index: activeIndex,
+		onSelect: (index) => {
+			setActiveIndex(index);
+			onSelect && onSelect(index);
+		}
+	};
+	return /* @__PURE__ */ jsx("ul", {
+		...otherProps,
+		role: "menu",
+		"aria-orientation": mode === "horizontal" ? "horizontal" : "vertical",
+		className: cls,
+		style,
+		children: /* @__PURE__ */ jsx(MenuContext.Provider, {
+			value: contextValue,
+			children: React.Children.map(children, (child, index) => {
+				const childElement = child;
+				const { displayName } = childElement.type;
+				if (displayName === "MenuItem" || displayName === "SubMenu" || displayName === "MenuItemGroup" || displayName === "MenuDivider" && mode !== "horizontal") {
+					const childProps = displayName === "SubMenu" && overlayClassName ? {
+						index: `${index}`,
+						overlayClassName
+					} : { index: `${index}` };
+					return React.cloneElement(childElement, childProps);
+				} else {
+					console.warn("Menu has a child that is not a MenuItem component.");
+					return null;
+				}
+			})
+		})
+	});
+};
+Menu.displayName = "Menu";
+//#endregion
+export { Menu as default };
+
+//# sourceMappingURL=menu.js.map

package/es/menu/menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.js","names":[],"sources":["../../src/menu/menu.tsx"],"sourcesContent":["import React, { useContext, useState } from 'react';\nimport classNames from 'classnames';\nimport { MenuContext } from './menu-context';\nimport { ConfigContext } from '../config-provider/config-context';\nimport { getPrefixCls } from '../_utils/general';\nimport { MenuItemProps, MenuProps } from './types';\n\nconst Menu = (props: MenuProps): JSX.Element => {\n  const {\n    defaultIndex = '0',\n    mode = 'horizontal',\n    theme = 'light',\n    inlineIndent = 20,\n    onSelect,\n    className,\n    overlayClassName,\n    style,\n    children,\n    prefixCls: customisedCls,\n    ...otherProps\n  } = props;\n  const configContext = useContext(ConfigContext);\n  const prefixCls = getPrefixCls('menu', configContext.prefixCls, customisedCls);\n  const cls = classNames(\n    prefixCls,\n    className,\n    `${prefixCls}_root`,\n    `${prefixCls}_${theme}`,\n    `${prefixCls}_${mode}`\n  );\n  const [activeIndex, setActiveIndex] = useState<string>(defaultIndex);\n  const contextValue = {\n    mode,\n    inlineIndent,\n    index: activeIndex,\n    onSelect: (index: string): void => {\n      setActiveIndex(index);\n      onSelect && onSelect(index);\n    },\n  };\n\n  return (\n    <ul {...otherProps} role=\"menu\" aria-orientation={mode === 'horizontal' ? 'horizontal' : 'vertical'} className={cls} style={style}>\n      <MenuContext.Provider value={contextValue}>\n        {React.Children.map(children, (child, index) => {\n          const childElement = child as React.FunctionComponentElement<MenuItemProps>;\n          const { displayName } = childElement.type;\n          if (\n            displayName === 'MenuItem' ||\n            displayName === 'SubMenu' ||\n            displayName === 'MenuItemGroup' ||\n            (displayName === 'MenuDivider' && mode !== 'horizontal')\n          ) {\n            const childProps = displayName === 'SubMenu' && overlayClassName\n              ? { index: `${index}`, overlayClassName }\n              : { index: `${index}` };\n            return React.cloneElement(childElement, childProps);\n          } else {\n            console.warn('Menu has a child that is not a MenuItem component.');\n            return null;\n          }\n        })}\n      </MenuContext.Provider>\n    </ul>\n  );\n};\n\nMenu.displayName = 'Menu';\n\nexport default Menu;\n"],"mappings":";;;;;;;AAOA,MAAM,QAAQ,UAAkC;CAC9C,MAAM,EACJ,eAAe,KACf,OAAO,cACP,QAAQ,SACR,eAAe,IACf,UACA,WACA,kBACA,OACA,UACA,WAAW,eACX,GAAG,eACD;CAEJ,MAAM,YAAY,aAAa,QADT,WAAW,cAAc,CACM,WAAW,cAAc;CAC9E,MAAM,MAAM,WACV,WACA,WACA,GAAG,UAAU,QACb,GAAG,UAAU,GAAG,SAChB,GAAG,UAAU,GAAG,OACjB;CACD,MAAM,CAAC,aAAa,kBAAkB,SAAiB,aAAa;CACpE,MAAM,eAAe;EACnB;EACA;EACA,OAAO;EACP,WAAW,UAAwB;AACjC,kBAAe,MAAM;AACrB,eAAY,SAAS,MAAM;;EAE9B;AAED,QACE,oBAAC,MAAD;EAAI,GAAI;EAAY,MAAK;EAAO,oBAAkB,SAAS,eAAe,eAAe;EAAY,WAAW;EAAY;YAC1H,oBAAC,YAAY,UAAb;GAAsB,OAAO;aAC1B,MAAM,SAAS,IAAI,WAAW,OAAO,UAAU;IAC9C,MAAM,eAAe;IACrB,MAAM,EAAE,gBAAgB,aAAa;AACrC,QACE,gBAAgB,cAChB,gBAAgB,aAChB,gBAAgB,mBACf,gBAAgB,iBAAiB,SAAS,cAC3C;KACA,MAAM,aAAa,gBAAgB,aAAa,mBAC5C;MAAE,OAAO,GAAG;MAAS;MAAkB,GACvC,EAAE,OAAO,GAAG,SAAS;AACzB,YAAO,MAAM,aAAa,cAAc,WAAW;WAC9C;AACL,aAAQ,KAAK,qDAAqD;AAClE,YAAO;;KAET;GACmB,CAAA;EACpB,CAAA;;AAIT,KAAK,cAAc"}

package/es/menu/style/_index.scss

@@ -0,0 +1,183 @@
+@use "../../style/variables" as *;
+@use "./mixin" as *;
+
+.#{$prefix}-menu {
+  display: flex;
+  flex-wrap: nowrap;
+  box-sizing: border-box;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  white-space: nowrap;
+  border: 0;
+
+  &_horizontal {
+    position: relative;
+
+    &:before {
+      content: '';
+      position: absolute;
+      border-bottom: 1px solid;
+      width: 100%;
+      bottom: 0;
+    }
+
+    .#{$prefix}-menu-item {
+      height: 48px;
+      padding: 0 15px;
+      line-height: 48px;
+      margin: 0 5px;
+      border-bottom: 2px solid transparent;
+      position: relative;
+
+      &_active {
+        color: var(--ty-color-primary);
+        border-bottom-color: var(--ty-color-primary);
+      }
+    }
+  }
+
+  &_inline, &_vertical {
+    flex-direction: column;
+    position: relative;
+
+    &:before {
+      content: '';
+      position: absolute;
+      border-right: 1px solid;
+      height: 100%;
+      right: 0;
+    }
+
+    .#{$prefix}-menu-item {
+      padding: $menu-item-padding-vertical;
+      margin: 5px 0;
+      position: relative;
+    }
+  }
+
+  &_inline li.#{$prefix}-menu-item_active {
+    @include menu-item-active(var(--ty-color-primary), true);
+  }
+
+  &_vertical li.#{$prefix}-menu-item_active {
+    @include menu-item-active(var(--ty-color-primary));
+  }
+
+  &_light {
+    color: var(--ty-menu-light-color);
+    background: var(--ty-menu-light-bg);
+
+    &:before {
+      border-color: var(--ty-menu-light-border);
+    }
+  }
+
+  &_dark {
+    color: var(--ty-menu-dark-color);
+    background: var(--ty-menu-dark-bg);
+
+    &:before {
+      border-color: var(--ty-menu-dark-border);
+    }
+  }
+}
+
+.#{$prefix}-menu-item {
+  box-sizing: border-box;
+  white-space: nowrap;
+  cursor: pointer;
+  transition: background-color 300ms, color 250ms;
+
+  &:hover {
+    color: var(--ty-color-primary);
+  }
+
+  &_disabled {
+    color: $gray-700 !important;
+    opacity: .5;
+    cursor: not-allowed;
+  }
+}
+
+.#{$prefix}-menu-sub {
+
+  .#{$prefix}-popup__wrapper {
+    display: block;
+  }
+
+  &__list {
+    margin: 0;
+    min-width: 100%;
+    list-style: none;
+    padding-left: 0;
+    white-space: nowrap;
+
+    .#{$prefix}-menu-item {
+      @include menu-sub-item-style();
+    }
+
+    &_popup {
+      min-width: 160px;
+
+      li.#{$prefix}-menu-item_active {
+        @include menu-item-active(var(--ty-color-primary));
+      }
+    }
+  }
+
+  &__title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    &.#{$prefix}-menu-item_active {
+      color: var(--ty-color-primary);
+    }
+  }
+
+  &__arrow {
+    display: inline-block;
+    transition: transform 300ms;
+    margin-left: 20px;
+
+    &_reverse {
+      transform: rotate(180deg);
+    }
+
+    &_right {
+      transform: rotate(-90deg);
+    }
+  }
+}
+
+.#{$prefix}-menu-item-group {
+  box-sizing: border-box;
+
+  &__title {
+    padding: 10px 16px;
+    color: var(--ty-menu-group-title-color);
+    font-size: 14px;
+    cursor: default;
+
+    &:first-child {
+      margin-top: 4px;
+    }
+  }
+
+  &__list {
+    list-style: none;
+    padding-left: 0;
+    white-space: nowrap;
+
+    > .#{$prefix}-menu-item {
+      padding: 12px 35px 12px 25px;
+    }
+  }
+}
+
+.#{$prefix}-menu-divider {
+  height: 1px;
+  background-color: var(--ty-menu-divider-color);
+  margin: 5px 0;
+}

package/es/menu/style/_mixin.scss

@@ -0,0 +1,16 @@
+@mixin menu-sub-item-style($padding: 12px 20px){
+  padding: $padding;
+  margin-top: 4px;
+  margin-bottom: 4px;
+  overflow: hidden;
+  font-size: 14px;
+  text-overflow: ellipsis;
+}
+
+@mixin menu-item-active($color, $display-right-border: false){
+  background-color: var(--ty-color-primary-bg);
+  color: $color;
+  @if $display-right-border {
+    border-right: 3px solid $color;
+  }
+}

package/es/menu/style/index.css

@@ -0,0 +1,158 @@
+.ty-menu {
+  display: flex;
+  flex-wrap: nowrap;
+  box-sizing: border-box;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  white-space: nowrap;
+  border: 0;
+}
+.ty-menu_horizontal {
+  position: relative;
+}
+.ty-menu_horizontal:before {
+  content: "";
+  position: absolute;
+  border-bottom: 1px solid;
+  width: 100%;
+  bottom: 0;
+}
+.ty-menu_horizontal .ty-menu-item {
+  height: 48px;
+  padding: 0 15px;
+  line-height: 48px;
+  margin: 0 5px;
+  border-bottom: 2px solid transparent;
+  position: relative;
+}
+.ty-menu_horizontal .ty-menu-item_active {
+  color: var(--ty-color-primary);
+  border-bottom-color: var(--ty-color-primary);
+}
+.ty-menu_inline, .ty-menu_vertical {
+  flex-direction: column;
+  position: relative;
+}
+.ty-menu_inline:before, .ty-menu_vertical:before {
+  content: "";
+  position: absolute;
+  border-right: 1px solid;
+  height: 100%;
+  right: 0;
+}
+.ty-menu_inline .ty-menu-item, .ty-menu_vertical .ty-menu-item {
+  padding: 15px 20px;
+  margin: 5px 0;
+  position: relative;
+}
+.ty-menu_inline li.ty-menu-item_active {
+  background-color: var(--ty-color-primary-bg);
+  color: var(--ty-color-primary);
+  border-right: 3px solid var(--ty-color-primary);
+}
+.ty-menu_vertical li.ty-menu-item_active {
+  background-color: var(--ty-color-primary-bg);
+  color: var(--ty-color-primary);
+}
+.ty-menu_light {
+  color: var(--ty-menu-light-color);
+  background: var(--ty-menu-light-bg);
+}
+.ty-menu_light:before {
+  border-color: var(--ty-menu-light-border);
+}
+.ty-menu_dark {
+  color: var(--ty-menu-dark-color);
+  background: var(--ty-menu-dark-bg);
+}
+.ty-menu_dark:before {
+  border-color: var(--ty-menu-dark-border);
+}
+
+.ty-menu-item {
+  box-sizing: border-box;
+  white-space: nowrap;
+  cursor: pointer;
+  transition: background-color 300ms, color 250ms;
+}
+.ty-menu-item:hover {
+  color: var(--ty-color-primary);
+}
+.ty-menu-item_disabled {
+  color: #525f7f !important;
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.ty-menu-sub .ty-popup__wrapper {
+  display: block;
+}
+.ty-menu-sub__list {
+  margin: 0;
+  min-width: 100%;
+  list-style: none;
+  padding-left: 0;
+  white-space: nowrap;
+}
+.ty-menu-sub__list .ty-menu-item {
+  padding: 12px 20px;
+  margin-top: 4px;
+  margin-bottom: 4px;
+  overflow: hidden;
+  font-size: 14px;
+  text-overflow: ellipsis;
+}
+.ty-menu-sub__list_popup {
+  min-width: 160px;
+}
+.ty-menu-sub__list_popup li.ty-menu-item_active {
+  background-color: var(--ty-color-primary-bg);
+  color: var(--ty-color-primary);
+}
+.ty-menu-sub__title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.ty-menu-sub__title.ty-menu-item_active {
+  color: var(--ty-color-primary);
+}
+.ty-menu-sub__arrow {
+  display: inline-block;
+  transition: transform 300ms;
+  margin-left: 20px;
+}
+.ty-menu-sub__arrow_reverse {
+  transform: rotate(180deg);
+}
+.ty-menu-sub__arrow_right {
+  transform: rotate(-90deg);
+}
+
+.ty-menu-item-group {
+  box-sizing: border-box;
+}
+.ty-menu-item-group__title {
+  padding: 10px 16px;
+  color: var(--ty-menu-group-title-color);
+  font-size: 14px;
+  cursor: default;
+}
+.ty-menu-item-group__title:first-child {
+  margin-top: 4px;
+}
+.ty-menu-item-group__list {
+  list-style: none;
+  padding-left: 0;
+  white-space: nowrap;
+}
+.ty-menu-item-group__list > .ty-menu-item {
+  padding: 12px 35px 12px 25px;
+}
+
+.ty-menu-divider {
+  height: 1px;
+  background-color: var(--ty-menu-divider-color);
+  margin: 5px 0;
+}

package/es/menu/style/index.d.ts

@@ -0,0 +1 @@
+export { };

package/es/menu/style/index.js

@@ -0,0 +1,3 @@
+import "./index.css";
+import "../../popup/style/index.css";
+import "../../collapse-transition/style/index.css";

package/es/menu/sub-menu-context.js

@@ -0,0 +1,7 @@
+import React from "react";
+//#region src/menu/sub-menu-context.ts
+const SubMenuContext = React.createContext({});
+//#endregion
+export { SubMenuContext };
+
+//# sourceMappingURL=sub-menu-context.js.map

package/es/menu/sub-menu-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sub-menu-context.js","names":[],"sources":["../../src/menu/sub-menu-context.ts"],"sourcesContent":["import React from 'react';\n\ntype Props = {\n  level?: number;\n  onMenuItemClick?: () => void;\n};\n\nexport const SubMenuContext = React.createContext<Props>({});\n"],"mappings":";;AAOA,MAAa,iBAAiB,MAAM,cAAqB,EAAE,CAAC"}