From 2d431719290a8193bbd3be3174a19812264af233 Mon Sep 17 00:00:00 2001 From: "sagiv.bengiat" Date: Wed, 9 Dec 2020 21:45:14 +0200 Subject: [PATCH] added demo app --- demoApp/src/index.js | 100 ++++++++++++++++++++++++++++++++++++++++++ package.json | 4 ++ rollup.config.demo.js | 56 +++++++++++++++++++++++ yarn.lock | 90 +++++++++++++++++++++++++++++++++++-- 4 files changed, 247 insertions(+), 3 deletions(-) create mode 100644 demoApp/src/index.js create mode 100644 rollup.config.demo.js diff --git a/demoApp/src/index.js b/demoApp/src/index.js new file mode 100644 index 0000000..9472f54 --- /dev/null +++ b/demoApp/src/index.js @@ -0,0 +1,100 @@ +import React, { useState, useEffect } from "react"; +import ReactDOM from "react-dom"; +import Carousel from "react-elastic-carousel"; +import styled from "styled-components"; + +const Item = styled.div` + display: flex; + justify-content: center; + align-items: center; + color: #fff; + background-color: green; + width: 100%; + height: 150px; + margin: 0 15px; +`; + +const Layout = styled.div` + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + height: 100vh; +`; + +const ControlsLayout = styled.div` + display: flex; + flex-direction: column; + margin: 25px; +`; + + const ControlFields = styled.div` + display: flex; + margin: 5px; + `; + +const DemoApp = () => { + const [items, setItems] = useState([1, 2, 3, 4, 5]); + const [itemsToShow, setItemsToShow] = useState(3); + const [showArrows, setShowArrows] = useState(true); + const [pagination, setPagination] = useState(true); + + const addItem = () => { + setItems((currentItems) => [...currentItems, currentItems.length + 1]); + }; + + const removeItem = () => { + setItems((currentItems) => currentItems.slice(0, currentItems.length - 1)); + }; + + const updateItemsToShow = ({ target }) => + setItemsToShow(Number(target.value)); + + const toggle = (updater) => () => updater((o) => !o); + + return ( + + + + + + + + + + + + + + + + + + + + + {items.map((item) => ( + {item} + ))} + + + ); +}; + +ReactDOM.render(, document.getElementById("app")); diff --git a/package.json b/package.json index c82d52f..d081b0e 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ }, "scripts": { "start": "concurrently -r -k -s all \"docz dev\" \"yarn run lint:watch\"", + "demo": "rollup --config rollup.config.demo.js --watch", "lint:fix": "eslint src/. --fix", "lint:watch": "esw --watch --fix src/.", "test": "cross-env CI=1 react-scripts test --env=jsdom", @@ -61,6 +62,7 @@ "@babel/plugin-syntax-import-meta": "^7.0.0", "@babel/preset-env": "^7.3.4", "@babel/preset-react": "^7.0.0", + "@rollup/plugin-replace": "^2.3.4", "babel-eslint": "^9.0.0", "concurrently": "^4.1.0", "cross-env": "^5.1.4", @@ -95,8 +97,10 @@ "rollup-plugin-babel": "^4.3.2", "rollup-plugin-commonjs": "^9.1.3", "rollup-plugin-copy": "^3.3.0", + "rollup-plugin-livereload": "^2.0.0", "rollup-plugin-node-resolve": "^3.3.0", "rollup-plugin-postcss": "^1.6.2", + "rollup-plugin-serve": "^1.1.0", "rollup-plugin-url": "^1.4.0", "styled-components": "^5.1.0" }, diff --git a/rollup.config.demo.js b/rollup.config.demo.js new file mode 100644 index 0000000..5496226 --- /dev/null +++ b/rollup.config.demo.js @@ -0,0 +1,56 @@ +import babel from "rollup-plugin-babel"; +import commonjs from "rollup-plugin-commonjs"; +import postcss from "rollup-plugin-postcss"; +import resolve from "rollup-plugin-node-resolve"; +import url from "rollup-plugin-url"; +import alias from "rollup-plugin-alias"; +import serve from "rollup-plugin-serve"; +import replace from "@rollup/plugin-replace"; +import livereload from 'rollup-plugin-livereload' + +import libName from "./libName"; + +import * as ReactNamedExports from 'react'; +import * as ReactIsNamedExports from 'react-is'; + +export default { + input: `demoApp/src/index.js`, + output: [ + { + file: "demoApp/dist/bundle.js", + format: "cjs", + sourcemap: true, + exports: "named", + }, + ], + plugins: [ + alias({ + "react-elastic-carousel": `src/${libName}/index.js`, + }), + //external(), + postcss({ + modules: false, + }), + url(), + babel({ + exclude: "node_modules/**", + plugins: ["@babel/external-helpers"], + }), + resolve(), + commonjs({ + include: "node_modules/**", + namedExports: { + "node_modules/react-is/index.js": Object.keys(ReactIsNamedExports), + "node_modules/react/index.js": Object.keys(ReactNamedExports), + }, + }), + serve({ + open: true, + contentBase: "demoApp/dist", + }), + livereload(), + replace({ + "process.env.NODE_ENV": JSON.stringify("production"), + }), + ], +}; diff --git a/yarn.lock b/yarn.lock index f928c92..2676130 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1855,6 +1855,23 @@ dependencies: tslib "^2.0.0" +"@rollup/plugin-replace@^2.3.4": + version "2.3.4" + resolved "https://registry.yarnpkg.com/@rollup/plugin-replace/-/plugin-replace-2.3.4.tgz#7dd84c17755d62b509577f2db37eb524d7ca88ca" + integrity sha512-waBhMzyAtjCL1GwZes2jaE9MjuQ/DQF2BatH3fRivUF3z0JBFrU0U6iBNC/4WR+2rLKhaAhPWDNPYp4mI6RqdQ== + dependencies: + "@rollup/pluginutils" "^3.1.0" + magic-string "^0.25.7" + +"@rollup/pluginutils@^3.1.0": + version "3.1.0" + resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-3.1.0.tgz#706b4524ee6dc8b103b3c995533e5ad680c02b9b" + integrity sha512-GksZ6pr6TpIjHm8h9lSQ8pi8BE9VeubNT0OMJ3B5uZJ8pz73NPiqOtCog/x2/QzM1ENChPKxMDhiQuRHsqc+lg== + dependencies: + "@types/estree" "0.0.39" + estree-walker "^1.0.1" + picomatch "^2.2.2" + "@sindresorhus/is@^0.14.0": version "0.14.0" resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.14.0.tgz#9fb3a3cf3132328151f353de4632e01e52102bea" @@ -4543,6 +4560,21 @@ chokidar@^3.0.2, chokidar@^3.4.1: optionalDependencies: fsevents "~2.1.2" +chokidar@^3.3.0: + version "3.4.3" + resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.4.3.tgz#c1df38231448e45ca4ac588e6c79573ba6a57d5b" + integrity sha512-DtM3g7juCXQxFVSNPNByEC2+NImtBuxQQvWlHunpJIS5Ocr0lG306cC7FCi7cEA0fzmybPUIl4txBIobk1gGOQ== + dependencies: + anymatch "~3.1.1" + braces "~3.0.2" + glob-parent "~5.1.0" + is-binary-path "~2.1.0" + is-glob "~4.0.1" + normalize-path "~3.0.0" + readdirp "~3.5.0" + optionalDependencies: + fsevents "~2.1.2" + chownr@^1.1.1: version "1.1.4" resolved "https://registry.yarnpkg.com/chownr/-/chownr-1.1.4.tgz#6fc9d7b42d32a583596337666e7d08084da2cc6b" @@ -7248,6 +7280,11 @@ estree-walker@^0.6.0, estree-walker@^0.6.1: resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-0.6.1.tgz#53049143f40c6eb918b23671d1fe3219f3a1b362" integrity sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w== +estree-walker@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-1.0.1.tgz#31bc5d612c96b704106b477e6dd5d8aa138cb700" + integrity sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg== + esutils@^2.0.2: version "2.0.3" resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64" @@ -11588,6 +11625,21 @@ listr2@^3.2.2: rxjs "^6.6.3" through "^2.3.8" +livereload-js@^3.1.0: + version "3.3.1" + resolved "https://registry.yarnpkg.com/livereload-js/-/livereload-js-3.3.1.tgz#61f887468086762e61fb2987412cf9d1dda99202" + integrity sha512-CBu1gTEfzVhlOK1WASKAAJ9Qx1fHECTq0SUB67sfxwQssopTyvzqTlgl+c0h9pZ6V+Fzd2rc510ppuNusg9teQ== + +livereload@^0.9.1: + version "0.9.1" + resolved "https://registry.yarnpkg.com/livereload/-/livereload-0.9.1.tgz#65125dabdf2db4fd3f1169e953fe56e3bcc6f477" + integrity sha512-9g7sua11kkyZNo2hLRCG3LuZZwqexoyEyecSlV8cAsfAVVCZqLzVir6XDqmH0r+Vzgnd5LrdHDMyjtFnJQLAYw== + dependencies: + chokidar "^3.3.0" + livereload-js "^3.1.0" + opts ">= 1.2.0" + ws "^6.2.1" + load-cfg@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/load-cfg/-/load-cfg-2.1.0.tgz#230ef6950466df59be934363988d35eee48ce8b9" @@ -12017,7 +12069,7 @@ lru-cache@^6.0.0: dependencies: yallist "^4.0.0" -magic-string@^0.25.1, magic-string@^0.25.2, magic-string@^0.25.3: +magic-string@^0.25.1, magic-string@^0.25.2, magic-string@^0.25.3, magic-string@^0.25.7: version "0.25.7" resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.7.tgz#3f497d6fd34c669c6798dcb821f2ef31f5445051" integrity sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA== @@ -12414,7 +12466,7 @@ mime@1.6.0: resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1" integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg== -mime@^2.0.3, mime@^2.3.1, mime@^2.4.4, mime@^2.4.6: +mime@>=2.4.6, mime@^2.0.3, mime@^2.3.1, mime@^2.4.4, mime@^2.4.6: version "2.4.6" resolved "https://registry.yarnpkg.com/mime/-/mime-2.4.6.tgz#e5b407c90db442f2beb5b162373d07b69affa4d1" integrity sha512-RZKhC3EmpBchfTGBVb8fb+RL2cWyw/32lshnsETttkBAyAUXSGHxbEJWWRXc751DrIxG1q04b8QwMbAwkRPpUA== @@ -13174,6 +13226,11 @@ opencollective-postinstall@^2.0.2: resolved "https://registry.yarnpkg.com/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz#7a0fff978f6dbfa4d006238fbac98ed4198c3259" integrity sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q== +opener@1: + version "1.5.2" + resolved "https://registry.yarnpkg.com/opener/-/opener-1.5.2.tgz#5d37e1f35077b9dcac4301372271afdeb2a13598" + integrity sha512-ur5UIdyw5Y7yEj9wLzhqXiy6GZ3Mwx0yGI+5sMn2r0N0v3cKJvUmFH5yPP+WXh9e0xfyzyJX95D8l088DNFj7A== + opentracing@^0.14.4: version "0.14.4" resolved "https://registry.yarnpkg.com/opentracing/-/opentracing-0.14.4.tgz#a113408ea740da3a90fde5b3b0011a375c2e4268" @@ -13228,6 +13285,11 @@ optionator@^0.8.1, optionator@^0.8.2, optionator@^0.8.3: type-check "~0.3.2" word-wrap "~1.2.3" +"opts@>= 1.2.0": + version "2.0.2" + resolved "https://registry.yarnpkg.com/opts/-/opts-2.0.2.tgz#a17e189fbbfee171da559edd8a42423bc5993ce1" + integrity sha512-k41FwbcLnlgnFh69f4qdUfvDQ+5vaSDnVPFI/y5XuhKRq97EnVVneO9F1ESVCdiVu4fCS2L8usX3mU331hB7pg== + ora@^3.4.0: version "3.4.0" resolved "https://registry.yarnpkg.com/ora/-/ora-3.4.0.tgz#bf0752491059a3ef3ed4c85097531de9fdbcd318" @@ -13763,7 +13825,7 @@ physical-cpu-count@^2.0.0: resolved "https://registry.yarnpkg.com/physical-cpu-count/-/physical-cpu-count-2.0.0.tgz#18de2f97e4bf7a9551ad7511942b5496f7aba660" integrity sha1-GN4vl+S/epVRrXURlCtUlverpmA= -picomatch@^2.0.4, picomatch@^2.0.5, picomatch@^2.2.1: +picomatch@^2.0.4, picomatch@^2.0.5, picomatch@^2.2.1, picomatch@^2.2.2: version "2.2.2" resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad" integrity sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg== @@ -15802,6 +15864,13 @@ readdirp@~3.4.0: dependencies: picomatch "^2.2.1" +readdirp@~3.5.0: + version "3.5.0" + resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.5.0.tgz#9ba74c019b15d365278d2e91bb8c48d7b4d42c9e" + integrity sha512-cMhu7c/8rdhkHXWsY+osBhfSy0JikwpHK/5+imo+LpeasTF8ouErHrlYkwT0++njiyuDvc7OFY5T3ukvZ8qmFQ== + dependencies: + picomatch "^2.2.1" + realpath-native@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/realpath-native/-/realpath-native-1.1.0.tgz#2003294fea23fb0672f2476ebe22fcf498a2d65c" @@ -16618,6 +16687,13 @@ rollup-plugin-copy@^3.3.0: globby "10.0.1" is-plain-object "^3.0.0" +rollup-plugin-livereload@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/rollup-plugin-livereload/-/rollup-plugin-livereload-2.0.0.tgz#d3928d74e8cf2ae4286c5dd46b770fd3f3b82313" + integrity sha512-oC/8NqumGYuphkqrfszOHUUIwzKsaHBICw6QRwT5uD07gvePTS+HW+GFwu6f9K8W02CUuTvtIM9AWJrbj4wE1A== + dependencies: + livereload "^0.9.1" + rollup-plugin-node-resolve@^3.3.0: version "3.4.0" resolved "https://registry.yarnpkg.com/rollup-plugin-node-resolve/-/rollup-plugin-node-resolve-3.4.0.tgz#908585eda12e393caac7498715a01e08606abc89" @@ -16648,6 +16724,14 @@ rollup-plugin-postcss@^1.6.2: rollup-pluginutils "^2.0.1" style-inject "^0.3.0" +rollup-plugin-serve@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/rollup-plugin-serve/-/rollup-plugin-serve-1.1.0.tgz#0654a57021a21b903340c69940f7463706e8288d" + integrity sha512-pYkSsuA0/psKqhhictkJw1c2klya5b+LlCvipWqI9OE1aG2M97mRumZCbBlry5CMEOzYBBgSDgd1694sNbmyIw== + dependencies: + mime ">=2.4.6" + opener "1" + rollup-plugin-url@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/rollup-plugin-url/-/rollup-plugin-url-1.4.0.tgz#346124cad853267b324cba0991f10bfd4be60c65"