@gm-pc/react 1.27.0 → 1.27.1-beta.0

package/src/component/popover/stories.tsx

@@ -1,104 +1,104 @@
-import React from 'react'
-import Popover from './popover'
-import { Button } from '../button'
-
-const renderPopup = () => {
-  return (
-    <div style={{ width: '200px', height: '200px' }}>
-      <div>啦啦啦啦啦啦啦啦啦啦啦</div>
-      <div>啦啦啦啦啦啦啦啦啦啦啦</div>
-      <div>啦啦啦</div>
-    </div>
-  )
-}
-
-export const ComPopover = () => (
-  <div>
-    <div>四种行为 focus click hover realFocus</div>
-    <div>
-      <Popover popup={renderPopup()}>
-        <Button>focus me default</Button>
-      </Popover>
-      <Popover type='click' popup={renderPopup()}>
-        <Button>click me</Button>
-      </Popover>
-      <Popover showArrow type='hover' popup={renderPopup()}>
-        <Button>hover me</Button>
-      </Popover>
-      <Popover showArrow type='realFocus' popup={renderPopup()}>
-        <Button>realFocus me</Button>
-      </Popover>
-    </div>
-    <div>各种位置</div>
-    <div>
-      <Popover popup={renderPopup()}>
-        <Button>focus me(default)</Button>
-      </Popover>
-      <Popover right popup={renderPopup()}>
-        <Button>focus me(right)</Button>
-      </Popover>
-      <Popover center popup={renderPopup()}>
-        <Button>focus me(center)</Button>
-      </Popover>
-    </div>
-    <div>
-      <Popover top popup={renderPopup()}>
-        <Button>focus me(top)</Button>
-      </Popover>
-      <Popover right top popup={renderPopup()}>
-        <Button>focus me(right top)</Button>
-      </Popover>
-      <Popover center top popup={renderPopup()}>
-        <Button>focus me(center top)</Button>
-      </Popover>
-    </div>
-
-    <div>偏移位置</div>
-    <div>
-      <Popover offset={20} popup={renderPopup()}>
-        <Button>focus me(20)</Button>
-      </Popover>
-      <Popover offset={-20} popup={renderPopup()}>
-        <Button>focus me(-20)</Button>
-      </Popover>
-      <Popover right offset={20} popup={renderPopup()}>
-        <Button>focus me(right 20)</Button>
-      </Popover>
-      <Popover right top offset={20} popup={renderPopup()}>
-        <Button>focus me(right top 20)</Button>
-      </Popover>
-      <Popover center offset={20} popup={renderPopup()}>
-        <Button>focus me(center 20)</Button>
-      </Popover>
-      <Popover showArrow offset={20} popup={renderPopup()}>
-        <Button>showArrow(offset 20)</Button>
-      </Popover>
-    </div>
-
-    <div>加角标</div>
-    <div>
-      <Popover top showArrow popup={renderPopup()}>
-        <Button>showArrow toptoptoptop</Button>
-      </Popover>
-      <Popover showArrow right popup={renderPopup()}>
-        <Button>showArrow right</Button>
-      </Popover>
-      <Popover showArrow arrowLeft='0px' popup={renderPopup()}>
-        <Button>showArrow arrowLeft 0</Button>
-      </Popover>
-    </div>
-    <div>disabled</div>
-    <div>
-      <Popover disabled popup={renderPopup()}>
-        <Button>focus me(disabled)</Button>
-      </Popover>
-      <Popover popup={renderPopup()}>
-        <Button disabled>focus me(inner disabled)</Button>
-      </Popover>
-    </div>
-  </div>
-)
-
-export default {
-  title: '反馈/Popover',
-}
+import React from 'react'
+import Popover from './popover'
+import { Button } from '../button'
+
+const renderPopup = () => {
+  return (
+    <div style={{ width: '200px', height: '200px' }}>
+      <div>啦啦啦啦啦啦啦啦啦啦啦</div>
+      <div>啦啦啦啦啦啦啦啦啦啦啦</div>
+      <div>啦啦啦</div>
+    </div>
+  )
+}
+
+export const ComPopover = () => (
+  <div>
+    <div>四种行为 focus click hover realFocus</div>
+    <div>
+      <Popover popup={renderPopup()}>
+        <Button>focus me default</Button>
+      </Popover>
+      <Popover type='click' popup={renderPopup()}>
+        <Button>click me</Button>
+      </Popover>
+      <Popover showArrow type='hover' popup={renderPopup()}>
+        <Button>hover me</Button>
+      </Popover>
+      <Popover showArrow type='realFocus' popup={renderPopup()}>
+        <Button>realFocus me</Button>
+      </Popover>
+    </div>
+    <div>各种位置</div>
+    <div>
+      <Popover popup={renderPopup()}>
+        <Button>focus me(default)</Button>
+      </Popover>
+      <Popover right popup={renderPopup()}>
+        <Button>focus me(right)</Button>
+      </Popover>
+      <Popover center popup={renderPopup()}>
+        <Button>focus me(center)</Button>
+      </Popover>
+    </div>
+    <div>
+      <Popover top popup={renderPopup()}>
+        <Button>focus me(top)</Button>
+      </Popover>
+      <Popover right top popup={renderPopup()}>
+        <Button>focus me(right top)</Button>
+      </Popover>
+      <Popover center top popup={renderPopup()}>
+        <Button>focus me(center top)</Button>
+      </Popover>
+    </div>
+
+    <div>偏移位置</div>
+    <div>
+      <Popover offset={20} popup={renderPopup()}>
+        <Button>focus me(20)</Button>
+      </Popover>
+      <Popover offset={-20} popup={renderPopup()}>
+        <Button>focus me(-20)</Button>
+      </Popover>
+      <Popover right offset={20} popup={renderPopup()}>
+        <Button>focus me(right 20)</Button>
+      </Popover>
+      <Popover right top offset={20} popup={renderPopup()}>
+        <Button>focus me(right top 20)</Button>
+      </Popover>
+      <Popover center offset={20} popup={renderPopup()}>
+        <Button>focus me(center 20)</Button>
+      </Popover>
+      <Popover showArrow offset={20} popup={renderPopup()}>
+        <Button>showArrow(offset 20)</Button>
+      </Popover>
+    </div>
+
+    <div>加角标</div>
+    <div>
+      <Popover top showArrow popup={renderPopup()}>
+        <Button>showArrow toptoptoptop</Button>
+      </Popover>
+      <Popover showArrow right popup={renderPopup()}>
+        <Button>showArrow right</Button>
+      </Popover>
+      <Popover showArrow arrowLeft='0px' popup={renderPopup()}>
+        <Button>showArrow arrowLeft 0</Button>
+      </Popover>
+    </div>
+    <div>disabled</div>
+    <div>
+      <Popover disabled popup={renderPopup()}>
+        <Button>focus me(disabled)</Button>
+      </Popover>
+      <Popover popup={renderPopup()}>
+        <Button disabled>focus me(inner disabled)</Button>
+      </Popover>
+    </div>
+  </div>
+)
+
+export default {
+  title: '反馈/Popover',
+}

package/src/component/popover/types.ts

@@ -1,25 +1,25 @@
-import { CSSProperties, ReactNode } from 'react'
-import { anyCallback } from '../../types'
-
-type PopoverTrigger = 'focus' | 'click' | 'hover' | 'realFocus'
-type Popup = ((closePopover: anyCallback) => ReactNode) | ReactNode
-
-interface PopoverProps {
-  type?: PopoverTrigger
-  popup: Popup
-  disabled?: boolean
-  right?: boolean
-  top?: boolean
-  center?: boolean
-  offset?: number
-  showArrow?: boolean
-  arrowLeft?: string | number
-  pureContainer?: boolean
-  isInPopup?: boolean
-  predictingHeight?: number
-  className?: string
-  style?: CSSProperties
-  onVisibleChange?: (value: boolean) => void
-}
-
-export type { Popup, PopoverTrigger, PopoverProps }
+import { CSSProperties, ReactNode } from 'react'
+import { anyCallback } from '../../types'
+
+type PopoverTrigger = 'focus' | 'click' | 'hover' | 'realFocus'
+type Popup = ((closePopover: anyCallback) => ReactNode) | ReactNode
+
+interface PopoverProps {
+  type?: PopoverTrigger
+  popup: Popup
+  disabled?: boolean
+  right?: boolean
+  top?: boolean
+  center?: boolean
+  offset?: number
+  showArrow?: boolean
+  arrowLeft?: string | number
+  pureContainer?: boolean
+  isInPopup?: boolean
+  predictingHeight?: number
+  className?: string
+  style?: CSSProperties
+  onVisibleChange?: (value: boolean) => void
+}
+
+export type { Popup, PopoverTrigger, PopoverProps }

package/src/component/popover/utils.ts

@@ -1,22 +1,22 @@
-import { getScrollLeft, getScrollTop } from '@gm-common/tool'
-
-function getElementPositionWithScroll(element: HTMLElement) {
-  let { left, top } = element.getBoundingClientRect()
-  left += getScrollLeft()
-  top += getScrollTop()
-
-  return { left, top }
-}
-
-function isContains(target: HTMLElement, fc: (node: HTMLElement) => boolean): boolean {
-  let node = target
-  while (node) {
-    if (fc(node)) {
-      return true
-    }
-    node = node.parentNode as HTMLElement
-  }
-  return false
-}
-
-export { getElementPositionWithScroll, isContains }
+import { getScrollLeft, getScrollTop } from '@gm-common/tool'
+
+function getElementPositionWithScroll(element: HTMLElement) {
+  let { left, top } = element.getBoundingClientRect()
+  left += getScrollLeft()
+  top += getScrollTop()
+
+  return { left, top }
+}
+
+function isContains(target: HTMLElement, fc: (node: HTMLElement) => boolean): boolean {
+  let node = target
+  while (node) {
+    if (fc(node)) {
+      return true
+    }
+    node = node.parentNode as HTMLElement
+  }
+  return false
+}
+
+export { getElementPositionWithScroll, isContains }

package/src/component/popup/element_in_viewport.ts

@@ -1,33 +1,33 @@
-export interface ElementInViewportReturnOptions {
-  topInViewport: boolean
-  bottomInViewport: boolean | null
-}
-
-interface ElementInView {
-  (
-    top: boolean,
-    dom: HTMLDivElement,
-    targetHeight: number,
-    predictingHeight?: number
-  ): ElementInViewportReturnOptions
-}
-
-const elementInView: ElementInView = (top, dom, targetHeight, predictingHeight) => {
-  const buf = 5
-  const rect = dom.getBoundingClientRect()
-  const windowHeight = window.innerHeight ?? document.documentElement.clientHeight
-  const domHeight = predictingHeight ?? rect.height
-
-  if (top) {
-    return {
-      topInViewport: rect.top - domHeight - buf >= 0,
-      bottomInViewport: null,
-    }
-  }
-  return {
-    topInViewport: rect.top - targetHeight - domHeight - buf >= 0,
-    bottomInViewport: rect.top + domHeight + buf <= windowHeight,
-  }
-}
-
-export default elementInView
+export interface ElementInViewportReturnOptions {
+  topInViewport: boolean
+  bottomInViewport: boolean | null
+}
+
+interface ElementInView {
+  (
+    top: boolean,
+    dom: HTMLDivElement,
+    targetHeight: number,
+    predictingHeight?: number
+  ): ElementInViewportReturnOptions
+}
+
+const elementInView: ElementInView = (top, dom, targetHeight, predictingHeight) => {
+  const buf = 5
+  const rect = dom.getBoundingClientRect()
+  const windowHeight = window.innerHeight ?? document.documentElement.clientHeight
+  const domHeight = predictingHeight ?? rect.height
+
+  if (top) {
+    return {
+      topInViewport: rect.top - domHeight - buf >= 0,
+      bottomInViewport: null,
+    }
+  }
+  return {
+    topInViewport: rect.top - targetHeight - domHeight - buf >= 0,
+    bottomInViewport: rect.top + domHeight + buf <= windowHeight,
+  }
+}
+
+export default elementInView

package/src/component/popup/index.ts

@@ -1,4 +1,4 @@
-export { default as Popup } from './popup'
-export type { PopupRectOptions, PopupProps } from './popup'
-export { default as PopupContentConfirm } from './popup_content_confirm'
-export type { PopupContentConfirmProps } from './popup_content_confirm'
+export { default as Popup } from './popup'
+export type { PopupRectOptions, PopupProps } from './popup'
+export { default as PopupContentConfirm } from './popup_content_confirm'
+export type { PopupContentConfirmProps } from './popup_content_confirm'