@cniot/android-pda-components 0.2.30 → 0.2.32

package/packages/Toast/methods.jsx

@@ -1,77 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import { resolveContainer } from '../utils'
-import ReactDOM from 'react-dom'
-import { InternalToast } from './toast'
-import { mergeProps } from '../utils'
-
-const containers = [];
-
-function unmount(container) {
-  const unmountResult = ReactDOM.unmountComponentAtNode(container)
-  if (unmountResult && container.parentNode) {
-    container.parentNode.removeChild(container)
-  }
-}
-
-const defaultProps = {
-  duration: 2000,
-}
-
-export function show(p) {
-  const props = mergeProps(
-    defaultProps,
-    p,
-  )
-  let timer = 0;
-  const { getContainer = () => document.body } = props
-  const container = document.createElement('div')
-  const bodyContainer = resolveContainer(getContainer)
-  bodyContainer.appendChild(container)
-  // console.log('container: ', container);
-
-  clear()
-  containers.push(container)
-
-  function TempToast() {
-    const [visible, setVisible] = useState(true)
-    useEffect(() => {
-      return () => {
-        props.afterClose && props.afterClose()
-      }
-    }, [])
-
-    useEffect(() => {
-      if (props.duration === 0) {
-        return
-      }
-      timer = window.setTimeout(() => {
-        setVisible(false)
-      }, props.duration)
-      return () => {
-        window.clearTimeout(timer)
-      }
-    }, [])
-
-    return (
-      <InternalToast
-        {...props}
-        getContainer={() => container}
-        visible={visible}
-        afterClose={() => {
-          unmount(container)
-        }}
-      />
-    )
-    // return 'hello world: toast'
-  }
-
-  ReactDOM.render(<TempToast />, container)
-}
-
-export function clear() {
-  while (true) {
-    const container = containers.pop()
-    if (!container) break
-    unmount(container)
-  }
-}

package/packages/Toast/toast.jsx

@@ -1,96 +0,0 @@
-import React, { useState, useEffect, ReactNode, useMemo } from "react";
-import './index.less';
-
-import classNames from 'classnames'
-// import Mask from '../mask'
-import { mergeProps, playSound } from '../utils'
-// import { PropagationEvent } from '../utils'
-// import { GetContainer } from '../utils'
-import Overlay from '../Overlay'
-
-
-function getTypeClass(type) {
-    return {
-        "success": "toast-wrap success",
-        "warning": "toast-wrap warning",
-        "error": "toast-wrap error",
-    }[type] || "toast-wrap"
-}
-export default function Toast(props) {
-    const { title = "title", message = "message", type = "success", duration = null } = props;
-    const [hidden, setHidden] = useState(false)
-    useEffect(() => {
-      if(window.WindVane){
-        if(type === 'warning') {
-          playSound('error1');
-          window.WindVane.call('WVMotion', 'vibrate', {duration: 400});
-        } else if(type === 'error') {
-          playSound('error2');
-          window.WindVane.call('WVMotion', 'vibrate', {duration: 200});
-          setTimeout(() => {
-            window.WindVane.call('WVMotion', 'vibrate', {duration: 300});
-          }, 250);
-        }
-      }
-    }, [])
-    if (duration) {
-        setTimeout(() => {
-            setHidden(true);
-        }, duration);
-    }
-
-    return !hidden ? (
-        <div className={getTypeClass(type)}>
-            <div className="toast-title">{title}</div>
-            <div className="toast-message">{message}</div>
-        </div>
-    ) : null
-}
-
-
-const defaultProps = {
-    maskClickable: true,
-    stopPropagation: ['click'],
-}
-
-export const InternalToast = p => {
-    const props = mergeProps(defaultProps, p)
-    const { maskClickable, content, icon, position, title, message, type, visible } = props
-
-    return (
-        // <Mask
-        //     visible={props.visible}
-        //     destroyOnClose
-        //     opacity={0}
-        //     disableBodyScroll={!maskClickable}
-        //     getContainer={props.getContainer}
-        //     afterClose={props.afterClose}
-        //     style={{
-        //         pointerEvents: maskClickable ? 'none' : 'auto',
-        //         ...props.maskStyle,
-        //     }}
-        //     className={classNames(`${classPrefix}-mask`, props.maskClassName)}
-        //     stopPropagation={props.stopPropagation}
-        // >
-        //     <div
-        //         style={{ top }}
-        //         className={classNames(
-        //             `${classPrefix}-wrap`,
-        //             icon ? `${classPrefix}-wrap-icon` : `${classPrefix}-wrap-text`
-        //         )}
-        //     >
-        //         {/* {iconElement && (
-        //     <div className={`${classPrefix}-icon`}>{iconElement}</div>
-        //   )} */}
-        //         {content}
-        //     </div>
-        // </Mask>
-        <Overlay visible={visible} verticalPosition='bottom' closable={true}>
-            <Toast
-                title={title}
-                message={message}
-                type={type}
-            ></Toast>
-        </Overlay>
-    )
-}

package/packages/WakeKeyborard/doc.jsx

@@ -1,170 +0,0 @@
-import React, { useState } from "react";
-import WakeKeyborard from "./index";
-import Keyborard from "./keyborard";
-import Button from '../Button';
-
-export default function () {
-  const [input, setInput] = useState(false);
-  return (
-    <div>
-      <h1>WakeKeyborard</h1>
-      <p>WakeKeyborard</p>
-      <h2>示例</h2>
-
-      <div className="light-block">
-        <p>点击右下角键盘</p>
-        <WakeKeyborard
-          autoWakeup={true}
-          label='搜索'
-          onWakeKeyboard={() => { console.log('wake keyboard') }}
-          onHidden={() => { console.log('keyboard hidden') }}
-          onClick={v => { console.log('v is ', v); }}
-          type='text'
-        />
-        <p>点击下面按钮唤起</p>
-        <Button
-          onClick={e => {
-            setInput(!input);
-          }}
-        >输入</Button>
-        {
-          input ? (
-            <Keyborard
-              onWakeKeyboard={
-                e => {
-                  console.log('keyborard from button');
-                }
-              }
-              onClick={
-                v => {
-                  console.log('value: ', v);
-                }
-              }
-              onHidden={
-                e => {
-                  console.log('keyborard hidden from button');
-                  setInput(false);
-                }
-              }
-            />
-          ) : null
-        }
-
-      </div>
-      <code className="code">{`
-<WakeKeyborard
-  autoWakeup={true}
-  label='搜索'
-  onWakeKeyboard={() => { console.log('wake keyboard') }}
-  onHidden={() => { console.log('keyboard hidden') }}
-  onClick={v => { console.log('v is ', v); }}
-  type='text'
-/>
-
-
-
-const [input, setInput] = useState(false);
-
-<Button
-  onClick={e => {
-    setInput(!input);
-  }}
->输入</Button>
-{
-input ? (
-  <Keyborard
-    onWakeKeyboard={
-      e => {
-        console.log('keyborard from button');
-      }
-    }
-    onClick={
-      v => {
-        console.log('value: ', v);
-      }
-    }
-    onHidden={
-      e => {
-        console.log('keyborard hidden from button');
-        setInput(false);
-      }
-    }
-  />
-) : null
-}
-      `}</code>
-      <h2>WakeKeyborard 参数</h2>
-      <table className="pure-table pure-table-bordered">
-        <thead>
-          <tr>
-            <th>属性</th>
-            <th>说明</th>
-            <th>类型</th>
-            <th>默认值</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td>autoWakeup</td>
-            <td>自动唤起</td>
-            <td>boolean</td>
-            <td>false</td>
-          </tr>
-
-        </tbody>
-      </table>
-      <p>其他参数同下面 Keyboard 参数</p>
-
-      <h2>Keyborard 参数</h2>
-      <table className="pure-table pure-table-bordered">
-        <thead>
-          <tr>
-            <th>属性</th>
-            <th>说明</th>
-            <th>类型</th>
-            <th>默认值</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td>label</td>
-            <td>确认按键文案</td>
-            <td>string</td>
-            <td>查询</td>
-          </tr>
-          <tr>
-            <td>onWakeKeyboard</td>
-            <td>唤起键盘回调</td>
-            <td>function</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>onClick</td>
-            <td>点击查询回调</td>
-            <td>function: (value) => { }</td>
-            <td>(value) => { }</td>
-          </tr>
-          <tr>
-            <td>onHidden</td>
-            <td>键盘隐藏时回调</td>
-            <td>function: (value) => { }</td>
-            <td>(value) => { }</td>
-          </tr>
-          <tr>
-            <td>type</td>
-            <td>键盘 type</td>
-            <td>string</td>
-            <td>tel</td>
-          </tr>
-          <tr>
-            <td>placeholder</td>
-            <td>输入框 placeholder</td>
-            <td>string</td>
-            <td>请输入</td>
-          </tr>
-        </tbody>
-      </table>
-
-    </div>
-  );
-}

package/packages/WakeKeyborard/index.jsx

@@ -1,61 +0,0 @@
-import React, { useState, useEffect, useRef } from "react";
-// import OPInput from "../OPInput";
-import "./index.less";
-// import classNames from "classnames";
-import Button from '../Button'
-import Keyborard from "./keyborard";
-
-const blankFunc = () => { };
-export default function WakeKeyborard(props) {
-  const [inputVisible, setInputVisible] = useState(props.autoWakeup || false);
-  // const inputRef = useRef(null);
-
-  // const { label = "查询", onWakeKeyboard = blankFunc, onClick = blankFunc, onHidden = blankFunc } = props;
-  const { onClick = blankFunc, onHidden = blankFunc, ...keyborardProps } = props;
-
-  return (
-    <div className="wakekeyborard">
-      {
-        inputVisible ? (
-          <Keyborard
-            // label={label}
-            onClick={
-              (v, e) => {
-                onClick(v);
-                setInputVisible(!inputVisible);
-                // onHidden(true);
-              }
-            }
-            onHidden={
-              s => {
-                setInputVisible(false);
-                onHidden(s);
-              }
-            }
-            {...keyborardProps}
-          />
-        ) : null
-      }
-      {
-        !inputVisible ? (
-          <div
-            className="wakekeyborard-icon"
-            onClick={
-              e => {
-                // this.setState({ inputVisible: !inputVisible });
-                setInputVisible(!inputVisible);
-                // requestAnimationFrame(() => {
-                //   onWakeKeyboard();
-                // })
-              }
-            }
-          ></div>
-        ) : null
-      }
-
-    </div>
-  )
-}
-
-
-WakeKeyborard.Keyborard = Keyborard;

package/packages/WakeKeyborard/index.less

@@ -1,55 +0,0 @@
-.wakekeyborard {
-  .wakekeyborard-icon {
-    width: 80px;
-    height: 80px;
-    background-image: url(https://img.alicdn.com/imgextra/i3/O1CN01kxYh3U25Xzr9nAcYp_!!6000000007537-2-tps-240-240.png);
-    background-size: 100%;
-
-    position: fixed;
-    right: 24px;
-    bottom: 24px;
-  }
-}
-
-.wakekeyborard-overlay {
-  position: fixed;
-  top: 0;
-  right: 0;
-  left: 0;
-  bottom: 0;
-  background-color: rgba(222, 222, 222, 0.2);
-}
-.wakekeyborard-inputbox {
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  height: 85px;
-
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-
-  input {
-    // width: 330px;
-    width:100%;
-    border-radius: 16px 0 0 0 ;
-    border: 0;
-    font-size: 42px;
-    background-color: white;
-    padding-left: 20px;
-    &:focus {
-      outline: none;
-    }
-    &::-webkit-input-placeholder {
-      color: rgb(209, 209, 214);
-      font-size: 32px;
-    }
-  }
-  button {
-    width: 150px;
-    border: 0;
-    border-radius: 0 16px 0 0;
-    background-color: white;
-  }
-}

package/packages/WakeKeyborard/keyborard.jsx

@@ -1,61 +0,0 @@
-import React, { useState, useEffect, useRef } from "react";
-import "./index.less";
-import Button from '../Button'
-
-const blankFunc = () => { };
-export default function Keyborard(props) {
-  const { label = "查询", onWakeKeyboard = blankFunc, onClick = blankFunc, onHidden = blankFunc, type='tel', placeholder='请输入' } = props;
-  const inputRef = useRef(null);
-  const [visible, setVisible] = useState(true);
-
-  useEffect(() => {
-    const handleKeyUp = e => {
-      const { code, keyCode, key } = e;
-      if (code === 'Enter') {
-        e.preventDefault();
-        onClick(inputRef.current.value, e);
-        onHidden(true);
-        setVisible(false);
-        return;
-      }
-    }
-    requestAnimationFrame(() => {
-      inputRef.current.focus();
-      onWakeKeyboard();
-    })
-
-    document.addEventListener('keyup', handleKeyUp);
-    return () => {
-      document.removeEventListener('keyup', handleKeyUp);
-    }
-  }, [])
-
-  if(!visible) return null;
-  return (
-    <div
-      className="wakekeyborard-overlay"
-      onClick={e => {
-        if (e.target.className && e.target.className.includes('wakekeyborard-overlay')) {
-          onHidden(false);
-          setVisible(false);
-        }
-      }}
-    >
-      <div className="wakekeyborard-inputbox">
-        <input
-          ref={inputRef}
-          type={type}
-          placeholder={placeholder}
-        />
-        <Button
-          type="cutout"
-          onClick={ e => {
-            onClick(inputRef.current.value, e);
-            onHidden(true);
-            setVisible(false);
-          }}
-        >{label}</Button>
-      </div>
-    </div>
-  )
-}

package/packages/doc.jsx

@@ -1,19 +0,0 @@
-import React from "react";
-// import Button from "./index";
-export default function () {
-  return (
-    <div>
-      <h1>快速开始</h1>
-
-      <code className="code">{`
-
-tnpm install @cniot/android-pda-components --save
-
-import { Button } from '@cniot/android-pda-components';
-
-import '@cniot/android-pda-components/es/style.css';
-
-      `}</code>
-    </div>
-  );
-}

package/packages/global.less

@@ -1,7 +0,0 @@
-* {
-    margin: 0;
-    padding: 0;
-}
-div {
-    box-sizing: border-box;
-}

package/packages/index.jsx

@@ -1,60 +0,0 @@
-import './global.less';
-
-import Title from "./PdaTitle";
-import Header from "./Header";
-import Button from "./Button";
-import InfoCard from "./InfoCard";
-import TaskCard from "./TaskCard";
-import Confirm from './Confirm';
-import Toast from './Toast';
-import Overlay from "./Overlay";
-import PageFlowSystemPages from './pageflow-system-pages/index.jsx';
-import Presentation from "./Presentation";
-import List from "./List";
-import BaseLayout from "./BaseLayout";
-import WakeKeyborard from "./WakeKeyborard";
-import Keyborard from './WakeKeyborard/keyborard';
-
-import Steps from "./PdaSteps";
-import FinishCard from "./PdaFinishCard";
-import DistanceCard from "./PdaDistanceCard";
-import SubCard from './SubCard';
-import SelectCard from './SelectCard';
-import AppList from './AppList';
-import InfiniteScroll from './PdaInfiniteScroll';
-import ActionSheet from './PdaActionSheet';
-import Tag from './Tag';
-import SimpleCard from './SimpleCard';
-import SimpleCardBlock from './SimpleCardBlock';
-
-// 兼容之前 ListItem 卡片命名逻辑
-const ListItem = TaskCard;
-
-export {
-  Title,
-  Header,
-  Button,
-  InfoCard,
-  Steps,
-  ListItem,
-  TaskCard,
-  Confirm,
-  Toast,
-  Overlay,
-  DistanceCard,
-  PageFlowSystemPages,
-  Presentation,
-  List,
-  WakeKeyborard,
-  Keyborard,
-  SubCard,
-  SelectCard,
-  FinishCard,
-  InfiniteScroll,
-  BaseLayout,
-  ActionSheet,
-  AppList,
-  Tag,
-  SimpleCard,
-  SimpleCardBlock,
-};

package/packages/index.less

@@ -1,3 +0,0 @@
-html{
-  font-size:10px;
-}

package/packages/pageflow-system-pages/alert/doc.jsx

@@ -1,70 +0,0 @@
-import React from "react";
-import SystemAlert from "./index";
-
-import service from '../../../mock/service';
-export default function () {
-  return (
-    <div>
-      <h1>/system/alert</h1>
-      <p>弹出一个警告窗，用户必须点击确认才能继续</p>
-      <h2>示例</h2>
-      <code className="code">
-{
-  `
-    // gs 代码如下
-    pageFlow.alert({
-      title: '111',
-      message: '2222',
-      okText: "确认"
-    })
-  `
-}
-      </code>
-      <h2>页面效果</h2>
-      <div className="light-block light-block-overlay">
-        <SystemAlert service={service} data={{
-          title: '111',
-          message: '2222',
-          okText: "确认"
-        }} ></SystemAlert>
-      </div>
-      <h2>Alert</h2>
-      <table className="pure-table pure-table-bordered">
-        <thead>
-          <tr>
-            <th>属性</th>
-            <th>说明</th>
-            <th>类型</th>
-            <th>默认值</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td>title</td>
-            <td>标题</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>message</td>
-            <td>信息</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>okText</td>
-            <td>确认文本</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>okDataClick</td>
-            <td>ok 按钮 arms 监控</td>
-            <td>string</td>
-            <td></td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-  );
-}