@antsoo-lib/components 0.1.11 → 0.1.13

package/src/menu/src/hooks/useMenuContext.ts

@@ -1,144 +0,0 @@
-import type { ComputedRef, InjectionKey, PropType, Ref } from 'vue'
-import { defineComponent, inject, provide, toRef } from 'vue'
-
-import type { CSSMotionProps } from '../../../_util/transition'
-import type { Key } from '../../../_util/type'
-import type {
-  BuiltinPlacements,
-  MenuClickEventHandler,
-  MenuMode,
-  MenuTheme,
-  TriggerSubMenuAction,
-} from '../interface'
-
-export interface StoreMenuInfo {
-  eventKey: string
-  key: Key
-  parentEventKeys: Ref<string[]>
-  childrenEventKeys?: Ref<string[]>
-  isLeaf?: boolean
-  parentKeys: Ref<Key[]>
-}
-export interface MenuContextProps {
-  rootClassName: Ref<string>
-  registerMenuInfo: (key: string, info: StoreMenuInfo) => void
-  unRegisterMenuInfo: (key: string) => void
-  prefixCls: ComputedRef<string>
-  openKeys: Ref<Key[]>
-  selectedKeys: Ref<Key[]>
-
-  selectedSubMenuKeys: Ref<Array<number | string>>
-  rtl?: ComputedRef<boolean>
-
-  inlineCollapsed: Ref<boolean>
-  theme?: ComputedRef<MenuTheme>
-
-  siderCollapsed?: Ref<boolean>
-
-  // // Mode
-  mode: Ref<MenuMode>
-
-  // // Disabled
-  disabled?: ComputedRef<boolean>
-  // // Used for overflow only. Prevent hidden node trigger open
-  overflowDisabled?: Ref<boolean>
-
-  // // Active
-  activeKeys: Ref<Key[]>
-  changeActiveKeys: (keys: Key[]) => void
-  // onActive: (key: string) => void;
-  // onInactive: (key: string) => void;
-
-  // // Selection
-  // selectedKeys: string[];
-
-  // // Level
-  inlineIndent: ComputedRef<number>
-
-  // // Motion
-  motion?: ComputedRef<CSSMotionProps | null>
-  defaultMotions?: ComputedRef<Partial<{
-    [key in MenuMode | 'other']: CSSMotionProps | ((name?: string) => CSSMotionProps)
-  }> | null>
-
-  // // Popup
-  subMenuOpenDelay: ComputedRef<number>
-  subMenuCloseDelay: ComputedRef<number>
-  forceSubMenuRender: ComputedRef<boolean>
-  builtinPlacements?: ComputedRef<BuiltinPlacements>
-  triggerSubMenuAction?: ComputedRef<TriggerSubMenuAction>
-
-  // // Icon
-  // itemIcon?: RenderIconType;
-  expandIcon?: ComputedRef<(p?: { isOpen: boolean; [key: string]: any }) => any>
-
-  // // Function
-  onItemClick: MenuClickEventHandler
-  onOpenChange: (key: Key, open: boolean) => void
-  getPopupContainer: ComputedRef<(node: HTMLElement) => HTMLElement>
-}
-
-const MenuContextKey: InjectionKey<MenuContextProps> = Symbol('menuContextKey')
-
-const useProvideMenu = (props: MenuContextProps) => {
-  provide(MenuContextKey, props)
-}
-
-const useInjectMenu = () => {
-  return inject(MenuContextKey)
-}
-
-const ForceRenderKey: InjectionKey<boolean> = Symbol('ForceRenderKey')
-
-export const useProvideForceRender = (forceRender: boolean) => {
-  provide(ForceRenderKey, forceRender)
-}
-
-export const useInjectForceRender = () => {
-  return inject(ForceRenderKey, false)
-}
-
-const MenuFirstLevelContextKey: InjectionKey<boolean> = Symbol('menuFirstLevelContextKey')
-const useProvideFirstLevel = (firstLevel: boolean) => {
-  provide(MenuFirstLevelContextKey, firstLevel)
-}
-
-const useInjectFirstLevel = () => {
-  return inject(MenuFirstLevelContextKey, true)
-}
-
-const MenuContextProvider = defineComponent({
-  compatConfig: { MODE: 3 },
-  name: 'MenuContextProvider',
-  inheritAttrs: false,
-  props: {
-    mode: { type: String as PropType<MenuMode>, default: undefined },
-    overflowDisabled: { type: Boolean, default: undefined },
-  },
-  setup(props, { slots }) {
-    const menuContext = useInjectMenu()
-    const newContext = { ...menuContext }
-    // 确保传入的属性不会动态增删
-    // 不需要 watch 变化
-    if (props.mode !== undefined) {
-      newContext.mode = toRef(props, 'mode')
-    }
-    if (props.overflowDisabled !== undefined) {
-      newContext.overflowDisabled = toRef(props, 'overflowDisabled')
-    }
-    useProvideMenu(newContext)
-    return () => slots.default?.()
-  },
-})
-
-export {
-  MenuContextKey,
-  MenuContextProvider,
-  MenuFirstLevelContextKey,
-  useInjectFirstLevel,
-  useInjectMenu,
-  useProvideFirstLevel,
-  useProvideMenu,
-}
-
-export default useProvideMenu

package/src/menu/src/interface.ts

@@ -1,116 +0,0 @@
-import type { CSSProperties } from 'vue'
-
-import type { Key } from '../../_util/type'
-import type { MenuItemProps } from './MenuItem'
-
-// ========================= Options =========================
-interface ItemSharedProps {
-  style?: CSSProperties
-  class?: string
-}
-
-export interface SubMenuType extends ItemSharedProps {
-  label?: any
-
-  children: ItemType[]
-
-  disabled?: boolean
-
-  key: Key
-  theme?: MenuTheme
-  rootClassName?: string
-
-  // >>>>> Icon
-  itemIcon?: RenderIconType
-  expandIcon?: RenderIconType
-
-  // >>>>> Active
-  onMouseenter?: MenuHoverEventHandler
-  onMouseleave?: MenuHoverEventHandler
-
-  // >>>>> Popup
-  popupClassName?: string
-  popupOffset?: number[]
-
-  // >>>>> Events
-  onClick?: MenuClickEventHandler
-  onTitleClick?: (info: MenuTitleInfo) => void
-  onTitleMouseenter?: MenuHoverEventHandler
-  onTitleMouseleave?: MenuHoverEventHandler
-}
-
-export interface MenuItemType extends ItemSharedProps {
-  label?: any
-
-  disabled?: boolean
-
-  itemIcon?: RenderIconType
-
-  key: Key
-
-  // >>>>> Active
-  onMouseenter?: MenuHoverEventHandler
-  onMouseleave?: MenuHoverEventHandler
-
-  // >>>>> Events
-  onClick?: MenuClickEventHandler
-}
-
-export interface MenuItemGroupType extends ItemSharedProps {
-  type: 'group'
-
-  label?: any
-
-  children?: ItemType[]
-}
-
-export interface MenuDividerType extends ItemSharedProps {
-  type: 'divider'
-}
-
-export type ItemType = SubMenuType | MenuItemType | MenuItemGroupType | MenuDividerType | null
-
-export type MenuTheme = 'light' | 'dark'
-
-// ========================== Basic ==========================
-export type MenuMode = 'horizontal' | 'vertical' | 'inline'
-
-export type BuiltinPlacements = Record<string, any>
-
-export type TriggerSubMenuAction = 'click' | 'hover'
-
-export interface RenderIconInfo {
-  isSelected?: boolean
-  isOpen?: boolean
-  isSubMenu?: boolean
-  disabled?: boolean
-}
-
-export type RenderIconType = (props: RenderIconInfo) => any
-
-export interface MenuInfo {
-  key: Key
-  eventKey: string
-  keyPath?: Key[]
-  eventKeyPath: string[]
-  domEvent: MouseEvent | KeyboardEvent
-  item: MenuItemProps & { [key: string]: any }
-}
-
-export interface MenuTitleInfo {
-  key: Key
-  domEvent: MouseEvent | KeyboardEvent
-}
-
-// ========================== Hover ==========================
-export type MenuHoverEventHandler = (info: { key: Key; domEvent: MouseEvent }) => void
-
-// ======================== Selection ========================
-export interface SelectInfo extends MenuInfo {
-  selectedKeys: Key[]
-}
-
-export type SelectEventHandler = (info: SelectInfo) => void
-
-// ========================== Click ==========================
-export type MenuClickEventHandler = (info: MenuInfo) => void

package/src/menu/src/placements.ts

@@ -1,52 +0,0 @@
-const autoAdjustOverflow = {
-  adjustX: 1,
-  adjustY: 1,
-}
-
-export const placements = {
-  topLeft: {
-    points: ['bl', 'tl'],
-    overflow: autoAdjustOverflow,
-    offset: [0, -7],
-  },
-  bottomLeft: {
-    points: ['tl', 'bl'],
-    overflow: autoAdjustOverflow,
-    offset: [0, 7],
-  },
-  leftTop: {
-    points: ['tr', 'tl'],
-    overflow: autoAdjustOverflow,
-    offset: [-4, 0],
-  },
-  rightTop: {
-    points: ['tl', 'tr'],
-    overflow: autoAdjustOverflow,
-    offset: [4, 0],
-  },
-}
-
-export const placementsRtl = {
-  topLeft: {
-    points: ['bl', 'tl'],
-    overflow: autoAdjustOverflow,
-    offset: [0, -7],
-  },
-  bottomLeft: {
-    points: ['tl', 'bl'],
-    overflow: autoAdjustOverflow,
-    offset: [0, 7],
-  },
-  rightTop: {
-    points: ['tr', 'tl'],
-    overflow: autoAdjustOverflow,
-    offset: [-4, 0],
-  },
-  leftTop: {
-    points: ['tl', 'tr'],
-    overflow: autoAdjustOverflow,
-    offset: [4, 0],
-  },
-}
-
-export default placements

package/src/menu/style/horizontal.ts

@@ -1,57 +0,0 @@
-import type { MenuToken } from '.'
-import type { GenerateStyle } from '../../theme/internal'
-
-const getHorizontalStyle: GenerateStyle<MenuToken> = (token) => {
-  const {
-    componentCls,
-    motionDurationSlow,
-    menuHorizontalHeight,
-    colorSplit,
-    lineWidth,
-    lineType,
-    menuItemPaddingInline,
-  } = token
-
-  return {
-    [`${componentCls}-horizontal`]: {
-      lineHeight: `${menuHorizontalHeight}px`,
-      border: 0,
-      borderBottom: `${lineWidth}px ${lineType} ${colorSplit}`,
-      boxShadow: 'none',
-
-      '&::after': {
-        display: 'block',
-        clear: 'both',
-        height: 0,
-        content: '"\\20"',
-      },
-
-      // ======================= Item =======================
-      [`${componentCls}-item, ${componentCls}-submenu`]: {
-        position: 'relative',
-        display: 'inline-block',
-        verticalAlign: 'bottom',
-        paddingInline: menuItemPaddingInline,
-      },
-
-      [`> ${componentCls}-item:hover,
-        > ${componentCls}-item-active,
-        > ${componentCls}-submenu ${componentCls}-submenu-title:hover`]: {
-        backgroundColor: 'transparent',
-      },
-
-      [`${componentCls}-item, ${componentCls}-submenu-title`]: {
-        transition: [`border-color ${motionDurationSlow}`, `background ${motionDurationSlow}`].join(
-          ',',
-        ),
-      },
-
-      // ===================== Sub Menu =====================
-      [`${componentCls}-submenu-arrow`]: {
-        display: 'none',
-      },
-    },
-  }
-}
-
-export default getHorizontalStyle