cbvirtua 1.0.109 → 1.0.115

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/components/dynamic-content.js

@@ -1,71 +0,0 @@
-import React, { useState, useRef, useEffect } from 'react'
-import BScroll from '@better-scroll/core'
-
-const createArray = (length) => Array.from({ length }, (_v, i) => i + 1)
-const nums1 = createArray(30)
-const nums2 = createArray(60)
-
-const DynamicContent = () => {
-  const [switcher, setSwitcher] = useState(false)
-
-  const wrapperRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      const BS = (scrollRef.current = new BScroll(wrapperRef.current, {
-        probeType: 3,
-      }))
-
-      BS.on('contentChanged', (content) => {
-        console.log('--- newContent ---')
-        console.log(content)
-      })
-      BS.on('scroll', () => {
-        console.log('scrolling-')
-      })
-      BS.on('scrollEnd', () => {
-        console.log('scrollingEnd')
-      })
-    }
-  }, [])
-
-  useEffect(() => {
-    if (scrollRef.current) {
-      scrollRef.current.refresh()
-    }
-  }, [switcher])
-
-  const handleClick = () => {
-    setSwitcher((value) => !value)
-  }
-
-  return (
-    <div className="core-dynamic-content-container view">
-      <div className="scroll-wrapper" ref={wrapperRef}>
-        {switcher ? (
-          <div className="scroll-content c2" key="c2">
-            {nums2.map((item) => (
-              <div key={item} className="scroll-item">
-                {nums2.length - item + 1}
-              </div>
-            ))}
-          </div>
-        ) : (
-          <div className="scroll-content c1" key="c1">
-            {nums1.map((item) => (
-              <div key={item} className="scroll-item">
-                {item}
-              </div>
-            ))}
-          </div>
-        )}
-      </div>
-      <button className="btn" onClick={handleClick}>
-        switch content element
-      </button>
-    </div>
-  )
-}
-
-export default DynamicContent

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/components/freescroll.js

@@ -1,114 +0,0 @@
-import React, { useRef, useEffect } from 'react'
-import BScroll from '@better-scroll/core'
-
-const FreeScroll = () => {
-  const wrapperRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      scrollRef.current = new BScroll(wrapperRef.current, {
-        freeScroll: true,
-        bounce: {
-          bottom: false,
-          left: false,
-          right: false,
-          top: false,
-        },
-      })
-    }
-  }, [])
-
-  return (
-    <div className="free-scroll-container view">
-      <div className="free-scroll-wrapper">
-        <div className="scroll-wrapper" ref={wrapperRef}>
-          <div className="scroll-content">
-            <p>
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-            </p>
-            <p>
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-            </p>
-            <p>
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-            </p>
-            <p>
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-            </p>
-            <p>
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-              eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
-              enim ad minim veniam, quis nostrud exercitation ullamco laboris
-              nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
-              reprehenderit in voluptate velit esse cillum dolore eu fugiat
-              nulla pariatur. Excepteur sint occaecat cupidatat non proident,
-              sunt in culpa qui officia deserunt mollit anim id est laborum.
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export default FreeScroll

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/components/horizontal-rotated.js

@@ -1,38 +0,0 @@
-import React, { useRef, useEffect } from 'react'
-import BScroll from '@better-scroll/core'
-
-const createArray = (length) => Array.from({ length }, (_v, i) => i + 1)
-const nums = createArray(8)
-
-const HorizontalRotated = () => {
-  const wrapperRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      scrollRef.current = new BScroll(wrapperRef.current, {
-        scrollX: true,
-        scrollY: false,
-        // v2.3.0
-        quadrant: 3, // rotate 180
-      })
-    }
-  }, [])
-
-  return (
-    <div className="horizontal-rotated-container view">
-      <div className="description">Flipping layout via CSS</div>
-      <div className="scroll-wrapper" ref={wrapperRef}>
-        <div className="scroll-content">
-          {nums.map((item, index) => (
-            <div key={index} className="scroll-item">
-              {item}
-            </div>
-          ))}
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export default HorizontalRotated

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/components/horizontal.js

@@ -1,57 +0,0 @@
-import React, { useRef, useEffect } from 'react'
-import BScroll from '@better-scroll/core'
-
-const emojis = [
-  '👉🏼 😁 😂 🤣 👈🏼',
-  '😄 😅 😆 😉 😊',
-  '😫 😴 😌 😛 😜',
-  '👆🏻 😒 😓 😔 👇🏻',
-  '😑 😶 🙄 😏 😣',
-  '😞 😟 😤 😢 😭',
-  '🤑 😲 ☹️ 🙁 😖',
-  '👍 👎 👊 ✊ 🤛',
-  '☝️ ✋ 🤚 🖐 🖖',
-  '👍🏼 👎🏼 👊🏼 ✊🏼 🤛🏼',
-  '☝🏽 ✋🏽 🤚🏽 🖐🏽 🖖🏽',
-  '🌖 🌗 🌘 🌑 🌒',
-]
-
-const Horizontal = () => {
-  const wrapperRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      const BS = (scrollRef.current = new BScroll(wrapperRef.current, {
-        scrollX: true,
-        probeType: 3, // listening scroll event
-      }))
-
-      BS.on('scrollStart', () => {
-        console.log('scrollStart-')
-      })
-      BS.on('scroll', ({ y }) => {
-        console.log('scrolling-')
-      })
-      BS.on('scrollEnd', (pos) => {
-        console.log(pos)
-      })
-    }
-  }, [])
-
-  return (
-    <div className="horizontal-container view">
-      <div className="scroll-wrapper" ref={wrapperRef}>
-        <div className="scroll-content">
-          {emojis.map((item, index) => (
-            <div key={index} className="scroll-item">
-              {item}
-            </div>
-          ))}
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export default Horizontal

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/components/specified-content.js

@@ -1,45 +0,0 @@
-import React, { useRef, useEffect } from 'react'
-import BScroll from '@better-scroll/core'
-
-const createArray = (length) => Array.from({ length }, (_v, i) => i + 1)
-const nums = createArray(30)
-
-const SpecifiedContent = () => {
-  const wrapperRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      const BS = (scrollRef.current = new BScroll(wrapperRef.current, {
-        specifiedIndexAsContent: 1,
-        probeType: 3,
-      }))
-
-      BS.on('scroll', () => {
-        console.log('scrolling-')
-      })
-      BS.on('scrollEnd', () => {
-        console.log('scrollingEnd')
-      })
-    }
-  }, [])
-
-  return (
-    <div className="core-specified-content-container view">
-      <div className="scroll-wrapper" ref={wrapperRef}>
-        <div className="ignore-content">
-          The Blue area is not taken as BetterScroll's content
-        </div>
-        <div className="scroll-content">
-          {nums.map((item) => (
-            <div key={item} className="scroll-item">
-              {item}
-            </div>
-          ))}
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export default SpecifiedContent

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/components/vertical-rotated.js

@@ -1,36 +0,0 @@
-import React, { useRef, useEffect } from 'react'
-import BScroll from '@better-scroll/core'
-
-const createArray = (length) => Array.from({ length }, (_v, i) => i + 1)
-const nums = createArray(8)
-
-const VerticalRotated = () => {
-  const wrapperRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      scrollRef.current = new BScroll(wrapperRef.current, {
-        // v2.3.0
-        quadrant: 2, // rotate 90
-      })
-    }
-  }, [])
-
-  return (
-    <div className="vertical-rotated-container view">
-      <div className="description">Horizontal layout via CSS</div>
-      <div className="scroll-wrapper" ref={wrapperRef}>
-        <div className="scroll-content">
-          {nums.map((item, index) => (
-            <div key={index} className="scroll-item">
-              {item}
-            </div>
-          ))}
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export default VerticalRotated

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/index.js

@@ -1,59 +0,0 @@
-import React from 'react'
-
-import './index.styl'
-
-const examples = [
-  {
-    path: '/core/default',
-    name: 'vertical',
-  },
-  {
-    path: '/core/horizontal',
-    name: 'horizontal',
-  },
-  {
-    path: '/core/dynamic-content',
-    name: 'dynamic-content',
-  },
-  {
-    path: '/core/specified-content',
-    name: 'specified-content',
-  },
-  {
-    path: '/core/freescroll',
-    name: 'freescroll',
-  },
-  {
-    path: '/core/vertical-rotated',
-    name: 'vertical-rotated(v2.3.0)',
-  },
-  {
-    path: '/core/horizontal-rotated',
-    name: 'horizontal-rotated(v2.3.0)',
-  },
-]
-
-const Core = (props) => {
-  const goPage = (path) => {
-    props.history.push(path)
-  }
-
-  return (
-    <div className="view core">
-      <ul className="example-list">
-        {examples.map((item) => (
-          <li
-            className="example-item"
-            onClick={() => goPage(item.path)}
-            key={item.path}
-          >
-            <span>{item.name}</span>
-          </li>
-        ))}
-      </ul>
-      {props.children}
-    </div>
-  )
-}
-
-export default Core

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/core/index.styl

@@ -1,166 +0,0 @@
-.free-scroll-container
-  &.view
-    position fixed!important
-
-.core-container
-  .scroll-wrapper
-    height 400px
-    position relative
-    overflow hidden
-    .scroll-item
-      height 50px
-      line-height 50px
-      font-size 24px
-      font-weight bold
-      border-bottom 1px solid #eee
-      text-align center
-      &:nth-child(2n)
-        background-color #f3f5f7
-      &:nth-child(2n+1)
-        background-color #42b983
-
-.horizontal-container
-  .scroll-wrapper
-    position relative
-    width 90%
-    margin 80px auto
-    white-space nowrap
-    border 3px solid #42b983
-    border-radius 5px
-    overflow hidden
-    .scroll-content
-      display inline-block
-    .scroll-item
-      height 50px
-      line-height 50px
-      font-size 24px
-      display inline-block
-      text-align center
-      padding 0 10px
-
-
-.core-dynamic-content-container
-  text-align center
-  .scroll-wrapper
-    height 300px
-    overflow hidden
-    .scroll-item
-      height 50px
-      line-height 50px
-      font-size 24px
-      font-weight bold
-      border-bottom 1px solid #eee
-      text-align center
-      &:nth-child(2n)
-        background-color #f3f5f7
-      &:nth-child(2n+1)
-        background-color #42b983
-	.btn
-		margin 40px auto
-		padding 10px
-		color #fff!important
-		border-radius 4px
-		font-size 20px
-		background-color #666!important
-
-.core-specified-content-container
-  text-align center
-  .scroll-wrapper
-    height 400px
-    overflow hidden
-    border 1px solid #42b983
-    .ignore-content
-      padding 20px
-      color white
-      font-size 20px
-      font-weight bold
-      background-color #2c3e50
-    .scroll-item
-      height 50px
-      line-height 50px
-      font-size 24px
-      font-weight bold
-      border-bottom 1px solid #eee
-      text-align center
-      &:nth-child(2n)
-        background-color #f3f5f7
-      &:nth-child(2n+1)
-        background-color #42b983
-
-.free-scroll-container
-  position: relative
-  width: 100%
-  height: 100%
-  .free-scroll-wrapper
-    position: relative
-    width: 100%
-    height: 100%
-    border: 1px solid rgb(96, 108, 113)
-    box-sizing: border-box
-    .scroll-wrapper
-      position: absolute
-      top: 0
-      left: 0
-      right: 0
-      bottom: 0
-      overflow: hidden
-      .scroll-content
-        background-color: #efeff4
-        width: 1500px
-        height: 1000px
-        p
-          font-size: 16px
-          padding: 20px
-          line-height: 200%
-          margin: 0
-
-.vertical-rotated-container
-  .description
-    text-align center
-  .scroll-wrapper
-    height 250px
-    width 100px
-    position relative
-    overflow hidden
-    margin 0 auto
-    border 1px solid #ccc
-    transform rotate(90deg)
-    .scroll-item
-      height 100px
-      width 100px
-      line-height 100px
-      font-size 24px
-      font-weight bold
-      text-align center
-      &:nth-child(2n)
-        background-color #f3f5f7
-      &:nth-child(2n+1)
-        background-color #42b983
-
-.horizontal-rotated-container
-  .description
-    margin-bottom 40px
-    text-align center
-  .scroll-wrapper
-    height 100px
-    width 250px
-    position relative
-    overflow hidden
-    white-space nowrap
-    margin 0 auto
-    border 1px solid #ccc
-    transform rotate(180deg)
-    .scroll-content
-      display inline-block
-    .scroll-item
-      height 100px
-      width 100px
-      line-height 100px
-      font-size 24px
-      font-weight bold
-      text-align center
-      display inline-block
-      &:nth-child(2n)
-        background-color #f3f5f7
-      &:nth-child(2n+1)
-        background-color #42b983

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/form/components/textarea.js

@@ -1,45 +0,0 @@
-import React, { useRef, useEffect } from 'react'
-import BScroll from '@better-scroll/core'
-
-const createArray = (length) => Array.from({ length }, (_v, i) => i + 1)
-const data = createArray(10)
-
-const Textarea = () => {
-  const wrapperRef = useRef(null)
-  const scrollRef = useRef(null)
-
-  useEffect(() => {
-    if (!scrollRef.current) {
-      scrollRef.current = new BScroll(wrapperRef.current, {
-        autoBlur: true, // for blur
-      })
-    }
-  }, [])
-
-  return (
-    <div className="textarea-container view">
-      <div className="textarea-wrapper" ref={wrapperRef}>
-        <div className="textarea-scroller">
-          <ul className="textarea-list">
-            {data.map((item) => (
-              <li key={item} className="textarea-list-item"></li>
-            ))}
-            <textarea
-              className="textarea-text"
-              name=""
-              id=""
-              cols="30"
-              rows="10"
-              defaultValue="Manipulating this area can not make BetterScroll work."
-            ></textarea>
-            {data.map((item) => (
-              <li key={item} className="textarea-list-item"></li>
-            ))}
-          </ul>
-        </div>
-      </div>
-    </div>
-  )
-}
-
-export default Textarea

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/form/index.js

@@ -1,35 +0,0 @@
-import React from 'react'
-
-import './index.styl'
-
-const examples = [
-  {
-    path: '/form/textarea',
-    name: 'textarea',
-  },
-]
-
-const Form = (props) => {
-  const goPage = (path) => {
-    props.history.push(path)
-  }
-
-  return (
-    <div className="view">
-      <ul className="example-list">
-        {examples.map((item) => (
-          <li
-            className="example-item"
-            onClick={() => goPage(item.path)}
-            key={item.path}
-          >
-            <span>{item.name}</span>
-          </li>
-        ))}
-      </ul>
-      {props.children}
-    </div>
-  )
-}
-
-export default Form

package/better-scroll-dev/better-scroll-dev/packages/react-examples/src/pages/form/index.styl

@@ -1,22 +0,0 @@
-.textarea-container
-  height: 100%
-.textarea-wrapper
-  height: 100%
-  padding: 0 10px
-  border: 1px solid #ccc
-  overflow: hidden
-.textarea-list
-  padding: 0
-  text-align: center
-.textarea-list-item
-  padding: 10px 0
-  height: 40px
-  list-style: none
-  border-bottom: 1px solid #ccc
-.textarea-text
-  border: 2px solid #62B791
-  border-radius: 5px
-  margin: 40px auto 0
-  line-height: 2
-  font-size: 20px
-  height: 200px