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

package/README.md

@@ -1,11 +1,11 @@
-# `tour`
-
-> TODO: description
-
-## Usage
-
-```
-const tour = require('tour');
-
-// TODO: DEMONSTRATE API
-```
+# `tour`
+
+> TODO: description
+
+## Usage
+
+```
+const tour = require('tour');
+
+// TODO: DEMONSTRATE API
+```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gm-pc/tour",
-  "version": "1.27.0",
+  "version": "1.27.1-beta.0",
   "description": "观麦科技引导设置",
   "author": "zhongsink <zhongink@gmail.com>",
   "homepage": "https://github.com/gmfe/gm-pc#readme",
@@ -27,12 +27,12 @@
     "styled-components": "^5.1.0"
   },
   "dependencies": {
-    "@gm-pc/locales": "^1.27.0",
-    "@gm-pc/react": "^1.27.0",
-    "@gm-pc/table-x": "^1.27.0",
+    "@gm-pc/locales": "^1.27.1-beta.0",
+    "@gm-pc/react": "^1.27.1-beta.0",
+    "@gm-pc/table-x": "^1.27.1-beta.0",
     "classnames": "^2.2.5",
     "lodash": "^4.17.19",
     "styled-components": "^5.1.0"
   },
-  "gitHead": "8382eb70be310e125ec7e14a918c2ae359dc075a"
+  "gitHead": "eecad3bce81dd37787dc6e90f6ecfc2ee666ad26"
 }

package/src/components/action.tsx

@@ -1,29 +1,29 @@
-import React, { FC, MouseEvent } from 'react'
-import { Button } from '@gm-pc/react'
-import { getLocale } from '@gm-pc/locales'
-
-interface ActionProps {
-  isLastItem: boolean
-
-  onNextStep(): void
-
-  onClose(event: MouseEvent): void
-}
-
-const Action: FC<ActionProps> = ({ isLastItem, onNextStep, onClose }) => {
-  return (
-    <div className='gm-flex gm-flex-justify-end gm-padding-top-10'>
-      {isLastItem ? (
-        <Button type='primary' onClick={onClose}>
-          {getLocale('马上尝试')}
-        </Button>
-      ) : (
-        <Button type='primary' onClick={onNextStep}>
-          {getLocale('下一步')}
-        </Button>
-      )}
-    </div>
-  )
-}
-
-export default Action
+import React, { FC, MouseEvent } from 'react'
+import { Button } from '@gm-pc/react'
+import { getLocale } from '@gm-pc/locales'
+
+interface ActionProps {
+  isLastItem: boolean
+
+  onNextStep(): void
+
+  onClose(event: MouseEvent): void
+}
+
+const Action: FC<ActionProps> = ({ isLastItem, onNextStep, onClose }) => {
+  return (
+    <div className='gm-flex gm-flex-justify-end gm-padding-top-10'>
+      {isLastItem ? (
+        <Button type='primary' onClick={onClose}>
+          {getLocale('马上尝试')}
+        </Button>
+      ) : (
+        <Button type='primary' onClick={onNextStep}>
+          {getLocale('下一步')}
+        </Button>
+      )}
+    </div>
+  )
+}
+
+export default Action

package/src/components/guide.tsx

@@ -1,140 +1,140 @@
-import React, { CSSProperties, FC, HTMLAttributes, RefObject } from 'react'
-import * as utils from '../utils'
-import { ReducerState } from '../reducer'
-import { TourStepItem } from '../types'
-
-type Position = TourStepItem['position']
-
-interface GuideProps extends HTMLAttributes<HTMLDivElement> {
-  ref: RefObject<HTMLDivElement>
-  windowWidth: number
-  windowHeight: number
-  targetWidth: number
-  targetHeight: number
-  targetTop: number
-  targetLeft: number
-  targetRight: number
-  targetBottom: number
-  helperWidth: number
-  helperHeight: number
-  helperPosition: ReducerState['helperPosition']
-  padding: number
-  current: number
-  rounded: number
-}
-
-const Guide: FC<GuideProps> = (props) => {
-  const transform = () => {
-    const {
-      targetTop,
-      targetRight,
-      targetBottom,
-      targetLeft,
-      windowWidth,
-      windowHeight,
-      helperWidth,
-      helperHeight,
-      helperPosition,
-      padding,
-    } = props
-
-    const available = {
-      left: targetLeft,
-      right: windowWidth - targetRight,
-      top: targetTop,
-      bottom: windowHeight - targetBottom,
-    }
-
-    const couldPositionAt = (position: Position) => {
-      return (
-        available[position as Exclude<Position, undefined | number[] | 'center'>] >
-        (utils.isHoriz(position as string)
-          ? helperWidth + padding * 2
-          : helperHeight + padding * 2)
-      )
-    }
-
-    const autoPosition = (coords: {
-      left: number[]
-      right: number[]
-      top: number[]
-      bottom: number[]
-      center: number[]
-    }) => {
-      const positionsOrder = utils.bestPositionOf(available)
-      for (let j = 0; j < positionsOrder.length; j++) {
-        if (couldPositionAt(positionsOrder[j] as Position)) {
-          return coords[
-            positionsOrder[j] as 'left' | 'right' | 'top' | 'bottom' | 'center'
-          ]
-        }
-      }
-      return coords.center
-    }
-
-    const pos = (helperPosition: TourStepItem['position']) => {
-      if (Array.isArray(helperPosition)) {
-        const isOutX = utils.isOutsideX(helperPosition[0], windowWidth)
-        const isOutY = utils.isOutsideY(helperPosition[1], windowHeight)
-        const warn = (axis: string, num: number) => {
-          console.warn(`${axis}:${num} is outside window, falling back to center`)
-        }
-        if (isOutX) warn('x', helperPosition[0])
-        if (isOutY) warn('y', helperPosition[1])
-        return [
-          isOutX ? windowWidth / 2 - helperWidth / 2 : helperPosition[0],
-          isOutY ? windowHeight / 2 - helperHeight / 2 : helperPosition[1],
-        ]
-      }
-
-      const hX = utils.isOutsideX(targetLeft + helperWidth, windowWidth)
-        ? utils.isOutsideX(targetRight + padding, windowWidth)
-          ? targetRight - helperWidth
-          : targetRight - helperWidth + padding
-        : targetLeft - padding
-      const x = hX > padding ? hX : padding
-      const hY = utils.isOutsideY(targetTop + helperHeight, windowHeight)
-        ? utils.isOutsideY(targetBottom + padding, windowHeight)
-          ? targetBottom - helperHeight
-          : targetBottom - helperHeight + padding
-        : targetTop - padding
-      const y = hY > padding ? hY : padding
-      const coords = {
-        top: [x, targetTop - helperHeight - padding * 2],
-        right: [targetRight + padding * 2, y],
-        bottom: [x, targetBottom + padding * 2],
-        left: [targetLeft - helperWidth - padding * 2, y],
-        center: [windowWidth / 2 - helperWidth / 2, windowHeight / 2 - helperHeight / 2],
-      }
-      if (helperPosition === 'center' || couldPositionAt(helperPosition)) {
-        return coords[helperPosition!]
-      }
-      return autoPosition(coords)
-    }
-
-    const p = pos(helperPosition)
-
-    return `translate(${Math.round(p[0])}px, ${Math.round(p[1])}px)`
-  }
-
-  const style: CSSProperties = {
-    maxWidth: '350px',
-    minWidth: '200px',
-    paddingRight: '40px',
-    backgroundColor: '#fff',
-    boxShadow: '0 0.5em 3em rgba(0, 0, 0, 0.3)',
-    color: 'inherit',
-    borderRadius: `${props.rounded}px`,
-    position: 'fixed',
-    transition: 'transform 0.3s',
-    top: 0,
-    left: 0,
-    outline: 'none',
-    zIndex: 1000000,
-    transform: transform(),
-  }
-
-  return <div {...props} style={style} />
-}
-
-export default Guide
+import React, { CSSProperties, FC, HTMLAttributes, RefObject } from 'react'
+import * as utils from '../utils'
+import { ReducerState } from '../reducer'
+import { TourStepItem } from '../types'
+
+type Position = TourStepItem['position']
+
+interface GuideProps extends HTMLAttributes<HTMLDivElement> {
+  ref: RefObject<HTMLDivElement>
+  windowWidth: number
+  windowHeight: number
+  targetWidth: number
+  targetHeight: number
+  targetTop: number
+  targetLeft: number
+  targetRight: number
+  targetBottom: number
+  helperWidth: number
+  helperHeight: number
+  helperPosition: ReducerState['helperPosition']
+  padding: number
+  current: number
+  rounded: number
+}
+
+const Guide: FC<GuideProps> = (props) => {
+  const transform = () => {
+    const {
+      targetTop,
+      targetRight,
+      targetBottom,
+      targetLeft,
+      windowWidth,
+      windowHeight,
+      helperWidth,
+      helperHeight,
+      helperPosition,
+      padding,
+    } = props
+
+    const available = {
+      left: targetLeft,
+      right: windowWidth - targetRight,
+      top: targetTop,
+      bottom: windowHeight - targetBottom,
+    }
+
+    const couldPositionAt = (position: Position) => {
+      return (
+        available[position as Exclude<Position, undefined | number[] | 'center'>] >
+        (utils.isHoriz(position as string)
+          ? helperWidth + padding * 2
+          : helperHeight + padding * 2)
+      )
+    }
+
+    const autoPosition = (coords: {
+      left: number[]
+      right: number[]
+      top: number[]
+      bottom: number[]
+      center: number[]
+    }) => {
+      const positionsOrder = utils.bestPositionOf(available)
+      for (let j = 0; j < positionsOrder.length; j++) {
+        if (couldPositionAt(positionsOrder[j] as Position)) {
+          return coords[
+            positionsOrder[j] as 'left' | 'right' | 'top' | 'bottom' | 'center'
+          ]
+        }
+      }
+      return coords.center
+    }
+
+    const pos = (helperPosition: TourStepItem['position']) => {
+      if (Array.isArray(helperPosition)) {
+        const isOutX = utils.isOutsideX(helperPosition[0], windowWidth)
+        const isOutY = utils.isOutsideY(helperPosition[1], windowHeight)
+        const warn = (axis: string, num: number) => {
+          console.warn(`${axis}:${num} is outside window, falling back to center`)
+        }
+        if (isOutX) warn('x', helperPosition[0])
+        if (isOutY) warn('y', helperPosition[1])
+        return [
+          isOutX ? windowWidth / 2 - helperWidth / 2 : helperPosition[0],
+          isOutY ? windowHeight / 2 - helperHeight / 2 : helperPosition[1],
+        ]
+      }
+
+      const hX = utils.isOutsideX(targetLeft + helperWidth, windowWidth)
+        ? utils.isOutsideX(targetRight + padding, windowWidth)
+          ? targetRight - helperWidth
+          : targetRight - helperWidth + padding
+        : targetLeft - padding
+      const x = hX > padding ? hX : padding
+      const hY = utils.isOutsideY(targetTop + helperHeight, windowHeight)
+        ? utils.isOutsideY(targetBottom + padding, windowHeight)
+          ? targetBottom - helperHeight
+          : targetBottom - helperHeight + padding
+        : targetTop - padding
+      const y = hY > padding ? hY : padding
+      const coords = {
+        top: [x, targetTop - helperHeight - padding * 2],
+        right: [targetRight + padding * 2, y],
+        bottom: [x, targetBottom + padding * 2],
+        left: [targetLeft - helperWidth - padding * 2, y],
+        center: [windowWidth / 2 - helperWidth / 2, windowHeight / 2 - helperHeight / 2],
+      }
+      if (helperPosition === 'center' || couldPositionAt(helperPosition)) {
+        return coords[helperPosition!]
+      }
+      return autoPosition(coords)
+    }
+
+    const p = pos(helperPosition)
+
+    return `translate(${Math.round(p[0])}px, ${Math.round(p[1])}px)`
+  }
+
+  const style: CSSProperties = {
+    maxWidth: '350px',
+    minWidth: '200px',
+    paddingRight: '40px',
+    backgroundColor: '#fff',
+    boxShadow: '0 0.5em 3em rgba(0, 0, 0, 0.3)',
+    color: 'inherit',
+    borderRadius: `${props.rounded}px`,
+    position: 'fixed',
+    transition: 'transform 0.3s',
+    top: 0,
+    left: 0,
+    outline: 'none',
+    zIndex: 1000000,
+    transform: transform(),
+  }
+
+  return <div {...props} style={style} />
+}
+
+export default Guide

package/src/components/index.ts

@@ -1 +1 @@
-export { default as Portal } from './portal'
+export { default as Portal } from './portal'

package/src/components/portal.tsx

@@ -1,23 +1,23 @@
-import { FC, useEffect, useRef } from 'react'
-import { createPortal } from 'react-dom'
-import _ from 'lodash'
-
-const Portal: FC = ({ children }) => {
-  const ref = useRef<HTMLDivElement>()
-
-  if (_.isNil(ref.current)) {
-    ref.current = document.createElement('div')
-    ref.current!.setAttribute('id', '___gmtour')
-  }
-
-  useEffect(() => {
-    ref.current && document.body.appendChild(ref.current)
-    return () => {
-      document.body.removeChild(ref.current!)
-    }
-  }, [ref])
-
-  return createPortal(children, ref.current!)
-}
-
-export default Portal
+import { FC, useEffect, useRef } from 'react'
+import { createPortal } from 'react-dom'
+import _ from 'lodash'
+
+const Portal: FC = ({ children }) => {
+  const ref = useRef<HTMLDivElement>()
+
+  if (_.isNil(ref.current)) {
+    ref.current = document.createElement('div')
+    ref.current!.setAttribute('id', '___gmtour')
+  }
+
+  useEffect(() => {
+    ref.current && document.body.appendChild(ref.current)
+    return () => {
+      document.body.removeChild(ref.current!)
+    }
+  }, [ref])
+
+  return createPortal(children, ref.current!)
+}
+
+export default Portal