@gm-pc/react 1.24.9-beta.13 → 1.24.9-beta.15

package/src/component/nav/style.less

@@ -1,246 +1,246 @@
-:root {
-  --gm-nav-popup-item-color: #333;
-  --gm-nav-popup-item-hover-color: #0363ff;
-  --gm-nav-background-color: #282c36;
-}
-
-.gm-nav {
-  width: inherit;
-  height: 100vh;
-  background: var(--gm-nav-background-color);
-
-  .gm-nav-logo {
-    display: flex;
-    align-content: center;
-    justify-content: center;
-    height: 64px;
-    text-align: center;
-    cursor: pointer;
-    background-color: #fff;
-    box-shadow: inset -1px 0 0 0 #e8ecf3;
-  }
-
-  .gm-nav-content {
-    padding-top: 16px;
-    overflow-y: auto;
-
-    &::-webkit-scrollbar {
-      width: 0 !important;
-      height: 0 !important;
-    }
-  }
-
-  .gm-nav-one {
-    display: flex;
-    align-items: center;
-    position: relative;
-    padding: 16px 20px;
-    color: #fff;
-    text-decoration: none;
-
-    .gm-nav-one-icon {
-      margin-right: 10px;
-      font-size: 20px;
-      line-height: 1;
-    }
-
-    .gm-nav-one-text {
-      font-size: 16px;
-    }
-
-    .gm-nav-one-arrow {
-      position: absolute;
-      top: 25px;
-      right: 16px;
-      width: 10px;
-      color: rgba(0, 0, 0, 0.85);
-      opacity: 0.45;
-      transform: rotate(-90deg);
-
-      &::before {
-        content: '';
-        position: absolute;
-        width: 6px;
-        height: 1.5px;
-        background-color: #fff;
-        border-radius: 2px;
-        transform: rotate(-45deg) translateX(2.5px);
-      }
-
-      &::after {
-        content: '';
-        position: absolute;
-        width: 6px;
-        height: 1.5px;
-        background-color: #fff;
-        border-radius: 2px;
-        transform: rotate(45deg) translateX(-2.5px);
-      }
-    }
-  }
-
-  .gm-nav-popup {
-    position: absolute;
-    top: 0;
-    left: 136px;
-    padding: 24px 8px 0 32px;
-    color: var(--gm-color-default);
-    background: #fff;
-    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
-
-    .gm-nav-two {
-      min-width: 148px;
-      margin-right: 24px;
-      margin-bottom: 24px;
-
-      .gm-nav-two-title {
-        margin-bottom: 16px;
-        font-size: 16px;
-        font-weight: 600;
-        color: var(--gm-nav-popup-item-color);
-        letter-spacing: 0.2px;
-      }
-    }
-
-    .gm-nav-three-wrap {
-      position: relative;
-      margin-bottom: 8px;
-      background: #f7f7f7;
-      border-radius: 2px;
-
-      &.gm-nav-three-wrap-bg {
-        background-color: #dae7ff;
-      }
-
-      &.active {
-        color: var(--gm-color-primary-active);
-        background-color: #dae7ff;
-        border-radius: 2px;
-      }
-
-      .gm-nav-three {
-        display: inline-block;
-        padding: 8px;
-        width: 100%;
-        font-size: 14px;
-        color: #333;
-        text-decoration: none;
-        white-space: nowrap;
-        letter-spacing: 0.2px;
-
-        &:last-child {
-          margin-bottom: 0;
-        }
-
-        &:hover {
-          color: var(--gm-nav-popup-item-hover-color);
-          background-color: #dae7ff;
-        }
-
-        span {
-          font-size: 18px;
-          color: #99999a;
-          cursor: pointer;
-
-          &:hover {
-            color: var(--gm-nav-popup-item-hover-color);
-          }
-        }
-      }
-
-      .gm-nav-three-create {
-        position: absolute;
-        top: 7px;
-        right: 8px;
-        z-index: 10;
-        width: 20px;
-        height: 20px;
-        background-image: url(../../images/add.png);
-        background-size: cover;
-        cursor: pointer;
-
-        &:hover {
-          background-image: url(../../images/add-hover.png);
-        }
-      }
-    }
-  }
-
-  // 第一级 item
-  .gm-nav-one-box {
-    position: relative;
-
-    // 三角形
-    .gm-nav-one-triangle {
-      position: absolute;
-      top: 21px;
-      right: -1px;
-      display: none;
-      width: 0;
-      height: 0;
-      border: 6px solid transparent;
-      border-right: 6px solid white;
-    }
-
-    &.hover {
-      .gm-nav-one {
-        color: white;
-        background-color: #1c2129;
-        opacity: 1;
-      }
-
-      .gm-nav-one-triangle {
-        display: block;
-      }
-
-      .gm-nav-one-arrow {
-        opacity: 1;
-      }
-    }
-
-    &.active {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      width: 136px;
-      text-align: center;
-      padding-top: 10px;
-      padding-bottom: 10px;
-
-      // active hack
-      .gm-nav-one {
-        width: 120px;
-        height: 34px;
-        color: #fff;
-        font-weight: 600;
-        background: #0363ff;
-        border-radius: 4px;
-        padding-left: 12px;
-
-        .gm-nav-one-arrow {
-          right: 8px;
-          top: 20px;
-          opacity: 1;
-        }
-      }
-
-      .gm-nav-one-triangle {
-        display: none;
-      }
-    }
-  }
-
-  .gm-nav-footer-iot {
-    width: 100%;
-    height: 64px;
-    cursor: pointer;
-
-    // 兼容 footImage 下的 active 样式不变化
-    .gm-nav-one-box.active {
-      display: block;
-      width: 100%;
-      height: 100%;
-      padding-top: 0;
-    }
-  }
-}
+:root {
+  --gm-nav-popup-item-color: #333;
+  --gm-nav-popup-item-hover-color: #0363ff;
+  --gm-nav-background-color: #282c36;
+}
+
+.gm-nav {
+  width: inherit;
+  height: 100vh;
+  background: var(--gm-nav-background-color);
+
+  .gm-nav-logo {
+    display: flex;
+    align-content: center;
+    justify-content: center;
+    height: 64px;
+    text-align: center;
+    cursor: pointer;
+    background-color: #fff;
+    box-shadow: inset -1px 0 0 0 #e8ecf3;
+  }
+
+  .gm-nav-content {
+    padding-top: 16px;
+    overflow-y: auto;
+
+    &::-webkit-scrollbar {
+      width: 0 !important;
+      height: 0 !important;
+    }
+  }
+
+  .gm-nav-one {
+    display: flex;
+    align-items: center;
+    position: relative;
+    padding: 16px 20px;
+    color: #fff;
+    text-decoration: none;
+
+    .gm-nav-one-icon {
+      margin-right: 10px;
+      font-size: 20px;
+      line-height: 1;
+    }
+
+    .gm-nav-one-text {
+      font-size: 16px;
+    }
+
+    .gm-nav-one-arrow {
+      position: absolute;
+      top: 25px;
+      right: 16px;
+      width: 10px;
+      color: rgba(0, 0, 0, 0.85);
+      opacity: 0.45;
+      transform: rotate(-90deg);
+
+      &::before {
+        content: '';
+        position: absolute;
+        width: 6px;
+        height: 1.5px;
+        background-color: #fff;
+        border-radius: 2px;
+        transform: rotate(-45deg) translateX(2.5px);
+      }
+
+      &::after {
+        content: '';
+        position: absolute;
+        width: 6px;
+        height: 1.5px;
+        background-color: #fff;
+        border-radius: 2px;
+        transform: rotate(45deg) translateX(-2.5px);
+      }
+    }
+  }
+
+  .gm-nav-popup {
+    position: absolute;
+    top: 0;
+    left: 136px;
+    padding: 24px 8px 0 32px;
+    color: var(--gm-color-default);
+    background: #fff;
+    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
+
+    .gm-nav-two {
+      min-width: 148px;
+      margin-right: 24px;
+      margin-bottom: 24px;
+
+      .gm-nav-two-title {
+        margin-bottom: 16px;
+        font-size: 16px;
+        font-weight: 600;
+        color: var(--gm-nav-popup-item-color);
+        letter-spacing: 0.2px;
+      }
+    }
+
+    .gm-nav-three-wrap {
+      position: relative;
+      margin-bottom: 8px;
+      background: #f7f7f7;
+      border-radius: 2px;
+
+      &.gm-nav-three-wrap-bg {
+        background-color: #dae7ff;
+      }
+
+      &.active {
+        color: var(--gm-color-primary-active);
+        background-color: #dae7ff;
+        border-radius: 2px;
+      }
+
+      .gm-nav-three {
+        display: inline-block;
+        padding: 8px;
+        width: 100%;
+        font-size: 14px;
+        color: #333;
+        text-decoration: none;
+        white-space: nowrap;
+        letter-spacing: 0.2px;
+
+        &:last-child {
+          margin-bottom: 0;
+        }
+
+        &:hover {
+          color: var(--gm-nav-popup-item-hover-color);
+          background-color: #dae7ff;
+        }
+
+        span {
+          font-size: 18px;
+          color: #99999a;
+          cursor: pointer;
+
+          &:hover {
+            color: var(--gm-nav-popup-item-hover-color);
+          }
+        }
+      }
+
+      .gm-nav-three-create {
+        position: absolute;
+        top: 7px;
+        right: 8px;
+        z-index: 10;
+        width: 20px;
+        height: 20px;
+        background-image: url(../../images/add.png);
+        background-size: cover;
+        cursor: pointer;
+
+        &:hover {
+          background-image: url(../../images/add-hover.png);
+        }
+      }
+    }
+  }
+
+  // 第一级 item
+  .gm-nav-one-box {
+    position: relative;
+
+    // 三角形
+    .gm-nav-one-triangle {
+      position: absolute;
+      top: 21px;
+      right: -1px;
+      display: none;
+      width: 0;
+      height: 0;
+      border: 6px solid transparent;
+      border-right: 6px solid white;
+    }
+
+    &.hover {
+      .gm-nav-one {
+        color: white;
+        background-color: #1c2129;
+        opacity: 1;
+      }
+
+      .gm-nav-one-triangle {
+        display: block;
+      }
+
+      .gm-nav-one-arrow {
+        opacity: 1;
+      }
+    }
+
+    &.active {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 136px;
+      text-align: center;
+      padding-top: 10px;
+      padding-bottom: 10px;
+
+      // active hack
+      .gm-nav-one {
+        width: 120px;
+        height: 34px;
+        color: #fff;
+        font-weight: 600;
+        background: #0363ff;
+        border-radius: 4px;
+        padding-left: 12px;
+
+        .gm-nav-one-arrow {
+          right: 8px;
+          top: 20px;
+          opacity: 1;
+        }
+      }
+
+      .gm-nav-one-triangle {
+        display: none;
+      }
+    }
+  }
+
+  .gm-nav-footer-iot {
+    width: 100%;
+    height: 64px;
+    cursor: pointer;
+
+    // 兼容 footImage 下的 active 样式不变化
+    .gm-nav-one-box.active {
+      display: block;
+      width: 100%;
+      height: 100%;
+      padding-top: 0;
+    }
+  }
+}

package/src/component/nav/types.ts

@@ -1,93 +1,93 @@
-import { CSSProperties, ReactNode, MouseEvent } from 'react'
-
-interface NavExtraProps {
-  /** 直接到达新建页面 */
-  onPushCreate(data: NavDataLevel3): void
-  /** 底部一级菜单显示图片 */
-  footerImage?: ReactNode
-}
-
-interface NavExtraProps {
-  /** 直接到达新建页面 */
-  onPushCreate(data: NavDataLevel3): void
-  /** 底部一级菜单显示图片 */
-  footerImage?: ReactNode
-}
-
-interface NavDataLevel3 {
-  link: string
-  name: string
-  /** 配置跳转到对应新建页的 提示 和 地址 */
-  toCreate?: {
-    tip: string
-    href: string
-  }
-}
-
-interface NavDataLevel2 {
-  link: string
-  name: string
-  sub: NavDataLevel3[]
-  style?: CSSProperties
-}
-
-interface NavData {
-  icon?: ReactNode
-  iconActive?: ReactNode
-  link: string
-  name: string
-  sub: NavDataLevel2[]
-}
-
-interface NavProps extends NavExtraProps {
-  logo?: ReactNode
-  /** 三级菜单 没有sub就没有浮层 */
-  data: NavData[]
-  /** pathname 会匹配到第三级的 link */
-  selected: string
-  /** 如果是选中一二级，会直接返回改分级下第三级的 item */
-  onSelect(data: NavDataLevel3): void
-  /** 控制 浮层的线上，如商品库传 merchandise */
-  showActive?: string
-  other?: ReactNode
-  className?: string
-  style?: CSSProperties
-  /** 底部 iot 图片 & 数据 */
-  footerConfig?: NavData[]
-}
-
-interface NavItemProps extends NavExtraProps {
-  data: NavData
-  selected: string
-  onSelect(data: NavDataLevel3): void
-  /** onMouseMove 的回调 */
-  onMouseMove(event: MouseEvent, link: string): void
-  /** 控制子导航列表的显示 */
-  showSub?: boolean
-}
-
-interface PopupProps {
-  parentRect: DOMRect
-  data: NavDataLevel2[]
-  selected: string
-  onSelect(data: NavDataLevel3): void
-  onPushCreate(data: NavDataLevel3): void
-}
-
-type NavSingleItemData = Omit<NavData, 'sub'>
-
-interface NavSingleItemProps {
-  data: NavSingleItemData
-  selected: string
-  onSelect(data: NavSingleItemData): void
-}
-
-export type {
-  NavProps,
-  NavData,
-  NavDataLevel2,
-  NavDataLevel3,
-  NavItemProps,
-  PopupProps,
-  NavSingleItemProps,
-}
+import { CSSProperties, ReactNode, MouseEvent } from 'react'
+
+interface NavExtraProps {
+  /** 直接到达新建页面 */
+  onPushCreate(data: NavDataLevel3): void
+  /** 底部一级菜单显示图片 */
+  footerImage?: ReactNode
+}
+
+interface NavExtraProps {
+  /** 直接到达新建页面 */
+  onPushCreate(data: NavDataLevel3): void
+  /** 底部一级菜单显示图片 */
+  footerImage?: ReactNode
+}
+
+interface NavDataLevel3 {
+  link: string
+  name: string
+  /** 配置跳转到对应新建页的 提示 和 地址 */
+  toCreate?: {
+    tip: string
+    href: string
+  }
+}
+
+interface NavDataLevel2 {
+  link: string
+  name: string
+  sub: NavDataLevel3[]
+  style?: CSSProperties
+}
+
+interface NavData {
+  icon?: ReactNode
+  iconActive?: ReactNode
+  link: string
+  name: string
+  sub: NavDataLevel2[]
+}
+
+interface NavProps extends NavExtraProps {
+  logo?: ReactNode
+  /** 三级菜单 没有sub就没有浮层 */
+  data: NavData[]
+  /** pathname 会匹配到第三级的 link */
+  selected: string
+  /** 如果是选中一二级，会直接返回改分级下第三级的 item */
+  onSelect(data: NavDataLevel3): void
+  /** 控制 浮层的线上，如商品库传 merchandise */
+  showActive?: string
+  other?: ReactNode
+  className?: string
+  style?: CSSProperties
+  /** 底部 iot 图片 & 数据 */
+  footerConfig?: NavData[]
+}
+
+interface NavItemProps extends NavExtraProps {
+  data: NavData
+  selected: string
+  onSelect(data: NavDataLevel3): void
+  /** onMouseMove 的回调 */
+  onMouseMove(event: MouseEvent, link: string): void
+  /** 控制子导航列表的显示 */
+  showSub?: boolean
+}
+
+interface PopupProps {
+  parentRect: DOMRect
+  data: NavDataLevel2[]
+  selected: string
+  onSelect(data: NavDataLevel3): void
+  onPushCreate(data: NavDataLevel3): void
+}
+
+type NavSingleItemData = Omit<NavData, 'sub'>
+
+interface NavSingleItemProps {
+  data: NavSingleItemData
+  selected: string
+  onSelect(data: NavSingleItemData): void
+}
+
+export type {
+  NavProps,
+  NavData,
+  NavDataLevel2,
+  NavDataLevel3,
+  NavItemProps,
+  PopupProps,
+  NavSingleItemProps,
+}

package/src/component/pagination/index.ts

@@ -1,2 +1,2 @@
-export { default as Pagination } from './pagination'
-export type { PaginationProps, PaginationPaging } from './types'
+export { default as Pagination } from './pagination'
+export type { PaginationProps, PaginationPaging } from './types'