@mirai/ui 2.0.35 → 2.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/build/components/Slider/Slider.js +24 -17
  2. package/build/components/Slider/Slider.js.map +1 -1
  3. package/build/components/Slider/Slider.stories.js +23 -4
  4. package/build/components/Slider/Slider.stories.js.map +1 -1
  5. package/package.json +1 -1
package/build/components/Slider/Slider.js CHANGED
@@ -15,7 +15,7 @@ var _Progress = require("../Progress");
15
15
  var _Slider = require("./Slider.constants");
16
16
  var _Slider2 = require("./Slider.Item");
17
17
  var _SliderModule = _interopRequireDefault(require("./Slider.module.css"));
18
- var _excluded = ["auto", "behavior", "captions", "height", "images", "index", "indicator", "preloadImages", "width", "onChange", "onCounter"];
18
+ var _excluded = ["auto", "behavior", "captions", "children", "height", "images", "index", "indicator", "preloadImages", "visibleItems", "width", "onChange", "onCounter"];
19
19
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
20
20
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
21
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -42,6 +42,7 @@ var Slider = function Slider(_ref) {
42
42
  behavior = _ref$behavior === void 0 ? 'smooth' : _ref$behavior,
43
43
  _ref$captions = _ref.captions,
44
44
  captions = _ref$captions === void 0 ? [] : _ref$captions,
45
+ children = _ref.children,
45
46
  _ref$height = _ref.height,
46
47
  propHeight = _ref$height === void 0 ? 240 : _ref$height,
47
48
  _ref$images = _ref.images,
@@ -52,6 +53,8 @@ var Slider = function Slider(_ref) {
52
53
  indicator = _ref$indicator === void 0 ? false : _ref$indicator,
53
54
  _ref$preloadImages = _ref.preloadImages,
54
55
  preloadImages = _ref$preloadImages === void 0 ? _Slider.PRELOAD_IMAGES : _ref$preloadImages,
56
+ _ref$visibleItems = _ref.visibleItems,
57
+ visibleItems = _ref$visibleItems === void 0 ? 1 : _ref$visibleItems,
55
58
  _ref$width = _ref.width,
56
59
  propWidth = _ref$width === void 0 ? 320 : _ref$width,
57
60
  _ref$onChange = _ref.onChange,
@@ -78,7 +81,7 @@ var Slider = function Slider(_ref) {
78
81
  setReplay = _useState8[1];
79
82
  (0, _react.useEffect)(function () {
80
83
  if (auto) interval = setInterval(function () {
81
- return setIndex(index < images.length - 1 ? index + 1 : 0);
84
+ return setIndex(index < items - 1 ? index + 1 : 0);
82
85
  }, 2000);
83
86
  return function () {
84
87
  return clearInterval(interval);
@@ -89,18 +92,23 @@ var Slider = function Slider(_ref) {
89
92
  timeout = setTimeout(function () {
90
93
  return setDisabledScroll(false);
91
94
  }, _Slider.SCROLL_DELAY);
92
- if (!replay && index + 1 === images.length) setReplay(true);
95
+ if (!replay && index + 1 === items) setReplay(true);
93
96
  onChange(index);
94
97
  return function () {
95
98
  return clearTimeout(timeout);
96
99
  };
97
100
  // eslint-disable-next-line react-hooks/exhaustive-deps
98
101
  }, [index]);
102
+ var defaultDirection = _theme.Theme.getDirection() === _theme.DIRECTION_TYPE.LEFT;
99
103
  var height = propHeight;
100
104
  var width = propWidth;
105
+ var items = images.length || _react.default.Children.count(children);
106
+ var hasChildren = !!children;
107
+ var hasItems = items > 1;
108
+ var isEnd = Math.abs(index) >= items - 1;
101
109
  var handleIndex = function handleIndex(nextIndex) {
102
110
  setDisabledScroll(true);
103
- setIndex(Math.abs(nextIndex) === images.length ? 0 : Math.abs(nextIndex) * (defaultDirection ? 1 : -1));
111
+ setIndex(Math.abs(nextIndex) === items ? 0 : Math.abs(nextIndex) * (defaultDirection ? 1 : -1));
104
112
  };
105
113
  var handleScroll = function handleScroll() {
106
114
  var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
@@ -109,9 +117,6 @@ var Slider = function Slider(_ref) {
109
117
  var nextIndex = x / width;
110
118
  if (Number.isInteger(nextIndex) && nextIndex !== index) setIndex(nextIndex);
111
119
  };
112
- var defaultDirection = _theme.Theme.getDirection() === _theme.DIRECTION_TYPE.LEFT;
113
- var hasImages = images.length > 1;
114
- var isEnd = Math.abs(index) >= images.length - 1;
115
120
  return /*#__PURE__*/_react.default.createElement(_primitives.View, _extends({}, others, {
116
121
  tag: "slider",
117
122
  onMouseEnter: isDesktop ? function () {
@@ -122,9 +127,9 @@ var Slider = function Slider(_ref) {
122
127
  } : undefined,
123
128
  className: (0, _helpers.styles)(_SliderModule.default.slider, others.className),
124
129
  style: _objectSpread(_objectSpread({}, others.style), {}, {
125
- width: width
130
+ width: width * visibleItems
126
131
  })
127
- }), hasImages && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
132
+ }), hasItems && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
128
133
  onPress: function onPress() {
129
134
  return handleIndex(index - 1);
130
135
  },
@@ -138,10 +143,10 @@ var Slider = function Slider(_ref) {
138
143
  scrollEventThrottle: _Slider.SCROLL_DELAY,
139
144
  scrollTo: index * Math.floor(width),
140
145
  snap: true,
141
- width: width,
146
+ width: width * visibleItems,
142
147
  onScroll: disabledScroll ? undefined : handleScroll,
143
148
  className: _SliderModule.default.scrollView
144
- }, images.map(function (image, imageIndex) {
149
+ }, hasChildren ? children : images.map(function (image, imageIndex) {
145
150
  return /*#__PURE__*/_react.default.createElement(_primitives.View, {
146
151
  key: imageIndex,
147
152
  tag: "images",
@@ -158,15 +163,15 @@ var Slider = function Slider(_ref) {
158
163
  small: true,
159
164
  className: [_SliderModule.default.overlay, _SliderModule.default.text]
160
165
  }, captions[imageIndex])));
161
- })), hasImages && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
166
+ })), hasItems && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
162
167
  onPress: function onPress() {
163
168
  return handleIndex(index + 1);
164
169
  },
165
170
  className: (0, _helpers.styles)(_SliderModule.default.button, ((defaultDirection ? replay ? false : isEnd : index === 0) || isDesktop && !focus) && _SliderModule.default.hide, _SliderModule.default.second)
166
171
  }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
167
- value: replay && defaultDirection && index === images.length - 1 ? _primitives.ICON.REPLAY : _primitives.ICON.RIGHT,
172
+ value: replay && defaultDirection && index === items - 1 ? _primitives.ICON.REPLAY : _primitives.ICON.RIGHT,
168
173
  className: _SliderModule.default.icon
169
- })), hasImages && onCounter && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
174
+ })), hasItems && onCounter && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
170
175
  onPress: onCounter,
171
176
  className: (0, _helpers.styles)(_SliderModule.default.overlay, _SliderModule.default.counter, !defaultDirection && _SliderModule.default.reverse)
172
177
  }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
@@ -175,8 +180,8 @@ var Slider = function Slider(_ref) {
175
180
  }), /*#__PURE__*/_react.default.createElement(_primitives.Text, {
176
181
  bold: true,
177
182
  small: true
178
- }, images.length)), indicator && /*#__PURE__*/_react.default.createElement(_Progress.Progress, {
179
- value: index * 100 / (images.length - 1),
183
+ }, items)), indicator && /*#__PURE__*/_react.default.createElement(_Progress.Progress, {
184
+ value: index * 100 / (items - 1),
180
185
  className: (0, _helpers.styles)(_SliderModule.default.progress, index > 0 && _SliderModule.default.visible)
181
186
  }));
182
187
  };
@@ -186,12 +191,14 @@ Slider.propTypes = {
186
191
  auto: _propTypes.default.bool,
187
192
  behavior: _propTypes.default.string,
188
193
  captions: _propTypes.default.arrayOf(_propTypes.default.string),
194
+ children: _propTypes.default.node,
189
195
  height: _propTypes.default.number.isRequired,
190
- images: _propTypes.default.arrayOf(_propTypes.default.string).isRequired,
196
+ images: _propTypes.default.arrayOf(_propTypes.default.string),
191
197
  index: _propTypes.default.number,
192
198
  indicator: _propTypes.default.bool,
193
199
  preloadImages: _propTypes.default.number,
194
200
  replay: _propTypes.default.bool,
201
+ visibleItems: _propTypes.default.number,
195
202
  width: _propTypes.default.number.isRequired,
196
203
  onChange: _propTypes.default.func,
197
204
  onCounter: _propTypes.default.func
package/build/components/Slider/Slider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.js","names":["interval","timeout","Slider","auto","behavior","captions","height","propHeight","images","index","propIndex","indicator","preloadImages","PRELOAD_IMAGES","width","propWidth","onChange","onCounter","others","useDevice","isDesktop","useState","disabledScroll","setDisabledScroll","focus","setFocus","setIndex","replay","setReplay","useEffect","setInterval","length","clearInterval","setTimeout","SCROLL_DELAY","clearTimeout","handleIndex","nextIndex","Math","abs","defaultDirection","handleScroll","x","Number","isInteger","Theme","getDirection","DIRECTION_TYPE","LEFT","hasImages","isEnd","undefined","styles","style","slider","className","button","hide","first","ICON","REPLAY","icon","floor","scrollView","map","image","imageIndex","item","caption","overlay","text","second","RIGHT","counter","reverse","PHOTO_LIBRARY","progress","visible","displayName","propTypes","PropTypes","bool","string","arrayOf","number","isRequired","func"],"sources":["../../../src/components/Slider/Slider.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Icon, ICON, ScrollView, Pressable, Text, View } from '../../primitives';\nimport { DIRECTION_TYPE, Theme } from '../../theme';\nimport { Progress } from '../Progress';\nimport { PRELOAD_IMAGES, SCROLL_DELAY } from './Slider.constants';\nimport { Item } from './Slider.Item';\nimport style from './Slider.module.css';\n\nlet interval;\nlet timeout;\n\nconst Slider = ({\n auto = false,\n behavior = 'smooth',\n captions = [],\n height: propHeight = 240,\n images = [],\n index: propIndex = 0,\n indicator = false,\n preloadImages = PRELOAD_IMAGES,\n width: propWidth = 320,\n onChange = () => {},\n onCounter,\n ...others\n}) => {\n const { isDesktop } = useDevice();\n\n const [disabledScroll, setDisabledScroll] = useState(true);\n const [focus, setFocus] = useState(false);\n const [index, setIndex] = useState(propIndex);\n const [replay, setReplay] = useState(false);\n\n useEffect(() => {\n if (auto) interval = setInterval(() => setIndex(index < images.length - 1 ? index + 1 : 0), 2000);\n return () => clearInterval(interval);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [auto, index]);\n\n useEffect(() => {\n timeout = setTimeout(() => setDisabledScroll(false), SCROLL_DELAY);\n\n if (!replay && index + 1 === images.length) setReplay(true);\n\n onChange(index);\n\n return () => clearTimeout(timeout);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [index]);\n\n const height = propHeight;\n\n const width = propWidth;\n\n const handleIndex = (nextIndex) => {\n setDisabledScroll(true);\n setIndex(Math.abs(nextIndex) === images.length ? 0 : Math.abs(nextIndex) * (defaultDirection ? 1 : -1));\n };\n\n const handleScroll = ({ x = 0 } = {}) => {\n const nextIndex = x / width;\n\n if (Number.isInteger(nextIndex) && nextIndex !== index) setIndex(nextIndex);\n };\n\n const defaultDirection = Theme.getDirection() === DIRECTION_TYPE.LEFT;\n const hasImages = images.length > 1;\n const isEnd = Math.abs(index) >= images.length - 1;\n\n return (\n <View\n {...others}\n tag=\"slider\"\n onMouseEnter={isDesktop ? () => setFocus(true) : undefined}\n onMouseLeave={isDesktop ? () => setFocus(false) : undefined}\n className={styles(style.slider, others.className)}\n style={{ ...others.style, width }}\n >\n {hasImages && (\n <Pressable\n onPress={() => handleIndex(index - 1)}\n className={styles(\n style.button,\n ((defaultDirection ? index <= 0 : replay ? false : isEnd) || (isDesktop && !focus)) && style.hide,\n style.first,\n )}\n >\n <Icon value={replay && !defaultDirection && isEnd ? ICON.REPLAY : ICON.LEFT} className={style.icon} />\n </Pressable>\n )}\n\n <ScrollView\n behavior={behavior}\n horizontal\n scrollEventThrottle={SCROLL_DELAY}\n scrollTo={index * Math.floor(width)}\n snap\n width={width}\n onScroll={disabledScroll ? undefined : handleScroll}\n className={style.scrollView}\n >\n {images.map((image, imageIndex) => (\n <View key={imageIndex} tag=\"images\" className={style.item}>\n <Item\n {...{ height, width }}\n image={\n replay ||\n (imageIndex >= Math.abs(index) - preloadImages && imageIndex <= Math.abs(index) + preloadImages)\n ? image\n : undefined\n }\n />\n {captions[imageIndex] && (\n <View tag=\"image-caption\" className={style.caption}>\n <Text bold small className={[style.overlay, style.text]}>\n {captions[imageIndex]}\n </Text>\n </View>\n )}\n </View>\n ))}\n </ScrollView>\n\n {hasImages && (\n <Pressable\n onPress={() => handleIndex(index + 1)}\n className={styles(\n style.button,\n ((defaultDirection ? (replay ? false : isEnd) : index === 0) || (isDesktop && !focus)) && style.hide,\n style.second,\n )}\n >\n <Icon\n value={replay && defaultDirection && index === images.length - 1 ? ICON.REPLAY : ICON.RIGHT}\n className={style.icon}\n />\n </Pressable>\n )}\n\n {hasImages && onCounter && (\n <Pressable\n onPress={onCounter}\n className={styles(style.overlay, style.counter, !defaultDirection && style.reverse)}\n >\n <Icon action value={ICON.PHOTO_LIBRARY} />\n <Text bold small>\n {images.length}\n </Text>\n </Pressable>\n )}\n\n {indicator && (\n <Progress\n value={(index * 100) / (images.length - 1)}\n className={styles(style.progress, index > 0 && style.visible)}\n />\n )}\n </View>\n );\n};\n\nSlider.displayName = 'Component:Slider';\n\nSlider.propTypes = {\n auto: PropTypes.bool,\n behavior: PropTypes.string,\n captions: PropTypes.arrayOf(PropTypes.string),\n height: PropTypes.number.isRequired,\n images: PropTypes.arrayOf(PropTypes.string).isRequired,\n index: PropTypes.number,\n indicator: PropTypes.bool,\n preloadImages: PropTypes.number,\n replay: PropTypes.bool,\n width: PropTypes.number.isRequired,\n onChange: PropTypes.func,\n onCounter: PropTypes.func,\n};\n\nexport { Slider };\n"],"mappings":"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"}
1
+ {"version":3,"file":"Slider.js","names":["interval","timeout","Slider","auto","behavior","captions","children","height","propHeight","images","index","propIndex","indicator","preloadImages","PRELOAD_IMAGES","visibleItems","width","propWidth","onChange","onCounter","others","useDevice","isDesktop","useState","disabledScroll","setDisabledScroll","focus","setFocus","setIndex","replay","setReplay","useEffect","setInterval","items","clearInterval","setTimeout","SCROLL_DELAY","clearTimeout","defaultDirection","Theme","getDirection","DIRECTION_TYPE","LEFT","length","React","Children","count","hasChildren","hasItems","isEnd","Math","abs","handleIndex","nextIndex","handleScroll","x","Number","isInteger","undefined","styles","style","slider","className","button","hide","first","ICON","REPLAY","icon","floor","scrollView","map","image","imageIndex","item","caption","overlay","text","second","RIGHT","counter","reverse","PHOTO_LIBRARY","progress","visible","displayName","propTypes","PropTypes","bool","string","arrayOf","node","number","isRequired","func"],"sources":["../../../src/components/Slider/Slider.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Icon, ICON, ScrollView, Pressable, Text, View } from '../../primitives';\nimport { DIRECTION_TYPE, Theme } from '../../theme';\nimport { Progress } from '../Progress';\nimport { PRELOAD_IMAGES, SCROLL_DELAY } from './Slider.constants';\nimport { Item } from './Slider.Item';\nimport style from './Slider.module.css';\n\nlet interval;\nlet timeout;\n\nconst Slider = ({\n auto = false,\n behavior = 'smooth',\n captions = [],\n children,\n height: propHeight = 240,\n images = [],\n index: propIndex = 0,\n indicator = false,\n preloadImages = PRELOAD_IMAGES,\n visibleItems = 1,\n width: propWidth = 320,\n onChange = () => {},\n onCounter,\n ...others\n}) => {\n const { isDesktop } = useDevice();\n\n const [disabledScroll, setDisabledScroll] = useState(true);\n const [focus, setFocus] = useState(false);\n const [index, setIndex] = useState(propIndex);\n const [replay, setReplay] = useState(false);\n\n useEffect(() => {\n if (auto) interval = setInterval(() => setIndex(index < items - 1 ? index + 1 : 0), 2000);\n return () => clearInterval(interval);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [auto, index]);\n\n useEffect(() => {\n timeout = setTimeout(() => setDisabledScroll(false), SCROLL_DELAY);\n\n if (!replay && index + 1 === items) setReplay(true);\n\n onChange(index);\n\n return () => clearTimeout(timeout);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [index]);\n\n const defaultDirection = Theme.getDirection() === DIRECTION_TYPE.LEFT;\n const height = propHeight;\n const width = propWidth;\n const items = images.length || React.Children.count(children);\n const hasChildren = !!children;\n const hasItems = items > 1;\n const isEnd = Math.abs(index) >= items - 1;\n\n const handleIndex = (nextIndex) => {\n setDisabledScroll(true);\n setIndex(Math.abs(nextIndex) === items ? 0 : Math.abs(nextIndex) * (defaultDirection ? 1 : -1));\n };\n\n const handleScroll = ({ x = 0 } = {}) => {\n const nextIndex = x / width;\n if (Number.isInteger(nextIndex) && nextIndex !== index) setIndex(nextIndex);\n };\n\n return (\n <View\n {...others}\n tag=\"slider\"\n onMouseEnter={isDesktop ? () => setFocus(true) : undefined}\n onMouseLeave={isDesktop ? () => setFocus(false) : undefined}\n className={styles(style.slider, others.className)}\n style={{ ...others.style, width: width * visibleItems }}\n >\n {hasItems && (\n <Pressable\n onPress={() => handleIndex(index - 1)}\n className={styles(\n style.button,\n ((defaultDirection ? index <= 0 : replay ? false : isEnd) || (isDesktop && !focus)) && style.hide,\n style.first,\n )}\n >\n <Icon value={replay && !defaultDirection && isEnd ? ICON.REPLAY : ICON.LEFT} className={style.icon} />\n </Pressable>\n )}\n\n <ScrollView\n behavior={behavior}\n horizontal\n scrollEventThrottle={SCROLL_DELAY}\n scrollTo={index * Math.floor(width)}\n snap\n width={width * visibleItems}\n onScroll={disabledScroll ? undefined : handleScroll}\n className={style.scrollView}\n >\n {hasChildren\n ? children\n : images.map((image, imageIndex) => (\n <View key={imageIndex} tag=\"images\" className={style.item}>\n <Item\n {...{ height, width }}\n image={\n replay ||\n (imageIndex >= Math.abs(index) - preloadImages && imageIndex <= Math.abs(index) + preloadImages)\n ? image\n : undefined\n }\n />\n {captions[imageIndex] && (\n <View tag=\"image-caption\" className={style.caption}>\n <Text bold small className={[style.overlay, style.text]}>\n {captions[imageIndex]}\n </Text>\n </View>\n )}\n </View>\n ))}\n </ScrollView>\n\n {hasItems && (\n <Pressable\n onPress={() => handleIndex(index + 1)}\n className={styles(\n style.button,\n ((defaultDirection ? (replay ? false : isEnd) : index === 0) || (isDesktop && !focus)) && style.hide,\n style.second,\n )}\n >\n <Icon\n value={replay && defaultDirection && index === items - 1 ? ICON.REPLAY : ICON.RIGHT}\n className={style.icon}\n />\n </Pressable>\n )}\n\n {hasItems && onCounter && (\n <Pressable\n onPress={onCounter}\n className={styles(style.overlay, style.counter, !defaultDirection && style.reverse)}\n >\n <Icon action value={ICON.PHOTO_LIBRARY} />\n <Text bold small>\n {items}\n </Text>\n </Pressable>\n )}\n\n {indicator && (\n <Progress value={(index * 100) / (items - 1)} className={styles(style.progress, index > 0 && style.visible)} />\n )}\n </View>\n );\n};\n\nSlider.displayName = 'Component:Slider';\n\nSlider.propTypes = {\n auto: PropTypes.bool,\n behavior: PropTypes.string,\n captions: PropTypes.arrayOf(PropTypes.string),\n children: PropTypes.node,\n height: PropTypes.number.isRequired,\n images: PropTypes.arrayOf(PropTypes.string),\n index: PropTypes.number,\n indicator: PropTypes.bool,\n preloadImages: PropTypes.number,\n replay: PropTypes.bool,\n visibleItems: PropTypes.number,\n width: PropTypes.number.isRequired,\n onChange: PropTypes.func,\n onCounter: PropTypes.func,\n};\n\nexport { Slider };\n"],"mappings":"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"}
package/build/components/Slider/Slider.stories.js CHANGED
@@ -6,15 +6,25 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.default = exports.Story = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _Slider = require("./Slider");
9
- var _Icon = require("../../primitives/Icon");
9
+ var _primitives = require("../../primitives");
10
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
11
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
12
12
  var _default = {
13
13
  title: 'Components'
14
14
  };
15
15
  exports.default = _default;
16
+ var ITEM_WIDTH = 320;
17
+ var itemProps = {
18
+ style: {
19
+ backgroundColor: 'red',
20
+ height: 208,
21
+ marginRight: 16,
22
+ minWidth: ITEM_WIDTH,
23
+ padding: 16
24
+ }
25
+ };
16
26
  var Story = function Story(props) {
17
- return /*#__PURE__*/_react.default.createElement(_Slider.Slider, _extends({}, props, {
27
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_primitives.Text, null, "Default"), /*#__PURE__*/_react.default.createElement(_Slider.Slider, _extends({}, props, {
18
28
  onChange: function onChange() {
19
29
  var _console;
20
30
  for (var _len = arguments.length, params = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -29,7 +39,15 @@ var Story = function Story(props) {
29
39
  }
30
40
  return (_console2 = console).log.apply(_console2, ['onCounter'].concat(params));
31
41
  }
32
- }));
42
+ })), /*#__PURE__*/_react.default.createElement(_primitives.Text, null, "w/ children"), /*#__PURE__*/_react.default.createElement(_Slider.Slider, _extends({}, props, {
43
+ height: 240,
44
+ index: 0,
45
+ visibleItems: 1.2,
46
+ width: ITEM_WIDTH,
47
+ style: {
48
+ backgroundColor: 'green'
49
+ }
50
+ }), /*#__PURE__*/_react.default.createElement(_primitives.View, itemProps, /*#__PURE__*/_react.default.createElement(_primitives.Text, null, "1")), /*#__PURE__*/_react.default.createElement(_primitives.View, itemProps, /*#__PURE__*/_react.default.createElement(_primitives.Text, null, "2")), /*#__PURE__*/_react.default.createElement(_primitives.View, itemProps, /*#__PURE__*/_react.default.createElement(_primitives.Text, null, "3")), /*#__PURE__*/_react.default.createElement(_primitives.View, itemProps, /*#__PURE__*/_react.default.createElement(_primitives.Text, null, "4")), /*#__PURE__*/_react.default.createElement(_primitives.View, itemProps, /*#__PURE__*/_react.default.createElement(_primitives.Text, null, "5"))));
33
51
  };
34
52
  exports.Story = Story;
35
53
  Story.storyName = 'Slider';
@@ -39,10 +57,11 @@ Story.args = {
39
57
  captions: ['javi', 'jose', undefined, 'victor', 'svet', 'mario2'],
40
58
  height: 208,
41
59
  images: ['https://picsum.photos/seed/@soyjavi/1024/768', 'https://picsum.photos/seed/@jose/768/1024', 'https://picsum.photos/seed/@mario1/1024/768', 'https://picsum.photos/seed/@victor/1024/768', 'https://picsum.photos/seed/@svet/1024/768', 'https://picsum.photos/seed/@mario2/1024/768', 'https://picsum.photos/seed/1/1024/768', 'https://picsum.photos/seed/2/1024/768', 'https://picsum.photos/seed/3/1024/768', 'https://picsum.photos/seed/4/1024/768', 'https://picsum.photos/seed/5/1024/768', 'https://picsum.photos/seed/6/1024/768', 'https://picsum.photos/seed/7/1024/768', 'https://picsum.photos/seed/8/1024/768', 'https://picsum.photos/seed/9/1024/768', 'https://picsum.photos/seed/10/1024/768', 'https://picsum.photos/seed/11/1024/768', 'https://picsum.photos/seed/12/1024/768'],
42
- fullScreen: false,
43
60
  index: 0,
44
61
  indicator: true,
45
62
  preloadImages: 1,
63
+ replay: false,
64
+ visibleItems: 1,
46
65
  width: 408,
47
66
  // inherited properties
48
67
  testId: 'test-story',
package/build/components/Slider/Slider.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.stories.js","names":["title","Story","props","params","console","log","storyName","args","auto","behavior","captions","undefined","height","images","fullScreen","index","indicator","preloadImages","width","testId","style","borderRadius","argTypes"],"sources":["../../../src/components/Slider/Slider.stories.jsx"],"sourcesContent":["import React from 'react';\n\nimport { Slider } from './Slider';\nimport { Icon, ICON } from '../../primitives/Icon';\n\nexport default { title: 'Components' };\n\nexport const Story = (props) => (\n <Slider\n {...props}\n onChange={(...params) => console.log('onChange', ...params)}\n onCounter={(...params) => console.log('onCounter', ...params)}\n />\n);\n\nStory.storyName = 'Slider';\n\nStory.args = {\n auto: false,\n behavior: 'smooth',\n captions: ['javi', 'jose', undefined, 'victor', 'svet', 'mario2'],\n height: 208,\n images: [\n 'https://picsum.photos/seed/@soyjavi/1024/768',\n 'https://picsum.photos/seed/@jose/768/1024',\n 'https://picsum.photos/seed/@mario1/1024/768',\n 'https://picsum.photos/seed/@victor/1024/768',\n 'https://picsum.photos/seed/@svet/1024/768',\n 'https://picsum.photos/seed/@mario2/1024/768',\n 'https://picsum.photos/seed/1/1024/768',\n 'https://picsum.photos/seed/2/1024/768',\n 'https://picsum.photos/seed/3/1024/768',\n 'https://picsum.photos/seed/4/1024/768',\n 'https://picsum.photos/seed/5/1024/768',\n 'https://picsum.photos/seed/6/1024/768',\n 'https://picsum.photos/seed/7/1024/768',\n 'https://picsum.photos/seed/8/1024/768',\n 'https://picsum.photos/seed/9/1024/768',\n 'https://picsum.photos/seed/10/1024/768',\n 'https://picsum.photos/seed/11/1024/768',\n 'https://picsum.photos/seed/12/1024/768',\n ],\n fullScreen: false,\n index: 0,\n indicator: true,\n preloadImages: 1,\n width: 408,\n // inherited properties\n testId: 'test-story',\n style: { borderRadius: 2 },\n};\n\nStory.argTypes = {};\n"],"mappings":";;;;;;AAAA;AAEA;AACA;AAAmD;AAAA;AAAA,eAEpC;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAE/B,IAAMC,KAAK,GAAG,SAARA,KAAK,CAAIC,KAAK;EAAA,oBACzB,6BAAC,cAAM,eACDA,KAAK;IACT,QAAQ,EAAE;MAAA;MAAA,kCAAIC,MAAM;QAANA,MAAM;MAAA;MAAA,OAAK,YAAAC,OAAO,EAACC,GAAG,kBAAC,UAAU,SAAKF,MAAM,EAAC;IAAA,CAAC;IAC5D,SAAS,EAAE;MAAA;MAAA,mCAAIA,MAAM;QAANA,MAAM;MAAA;MAAA,OAAK,aAAAC,OAAO,EAACC,GAAG,mBAAC,WAAW,SAAKF,MAAM,EAAC;IAAA;EAAC,GAC9D;AAAA,CACH;AAAC;AAEFF,KAAK,CAACK,SAAS,GAAG,QAAQ;AAE1BL,KAAK,CAACM,IAAI,GAAG;EACXC,IAAI,EAAE,KAAK;EACXC,QAAQ,EAAE,QAAQ;EAClBC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAEC,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,CAAC;EACjEC,MAAM,EAAE,GAAG;EACXC,MAAM,EAAE,CACN,8CAA8C,EAC9C,2CAA2C,EAC3C,6CAA6C,EAC7C,6CAA6C,EAC7C,2CAA2C,EAC3C,6CAA6C,EAC7C,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,wCAAwC,EACxC,wCAAwC,EACxC,wCAAwC,CACzC;EACDC,UAAU,EAAE,KAAK;EACjBC,KAAK,EAAE,CAAC;EACRC,SAAS,EAAE,IAAI;EACfC,aAAa,EAAE,CAAC;EAChBC,KAAK,EAAE,GAAG;EACV;EACAC,MAAM,EAAE,YAAY;EACpBC,KAAK,EAAE;IAAEC,YAAY,EAAE;EAAE;AAC3B,CAAC;AAEDpB,KAAK,CAACqB,QAAQ,GAAG,CAAC,CAAC"}
1
+ {"version":3,"file":"Slider.stories.js","names":["title","ITEM_WIDTH","itemProps","style","backgroundColor","height","marginRight","minWidth","padding","Story","props","params","console","log","storyName","args","auto","behavior","captions","undefined","images","index","indicator","preloadImages","replay","visibleItems","width","testId","borderRadius","argTypes"],"sources":["../../../src/components/Slider/Slider.stories.jsx"],"sourcesContent":["import React from 'react';\n\nimport { Slider } from './Slider';\nimport { View, Text } from '../../primitives';\n\nexport default { title: 'Components' };\n\nconst ITEM_WIDTH = 320;\nconst itemProps = {\n style: { backgroundColor: 'red', height: 208, marginRight: 16, minWidth: ITEM_WIDTH, padding: 16 },\n};\n\nexport const Story = (props) => (\n <>\n <Text>Default</Text>\n <Slider\n {...props}\n onChange={(...params) => console.log('onChange', ...params)}\n onCounter={(...params) => console.log('onCounter', ...params)}\n />\n <Text>w/ children</Text>\n\n <Slider\n {...props}\n height={240}\n index={0}\n visibleItems={1.2}\n width={ITEM_WIDTH}\n style={{ backgroundColor: 'green' }}\n >\n <View {...itemProps}>\n <Text>1</Text>\n </View>\n <View {...itemProps}>\n <Text>2</Text>\n </View>\n <View {...itemProps}>\n <Text>3</Text>\n </View>\n <View {...itemProps}>\n <Text>4</Text>\n </View>\n <View {...itemProps}>\n <Text>5</Text>\n </View>\n </Slider>\n </>\n);\n\nStory.storyName = 'Slider';\n\nStory.args = {\n auto: false,\n behavior: 'smooth',\n captions: ['javi', 'jose', undefined, 'victor', 'svet', 'mario2'],\n height: 208,\n images: [\n 'https://picsum.photos/seed/@soyjavi/1024/768',\n 'https://picsum.photos/seed/@jose/768/1024',\n 'https://picsum.photos/seed/@mario1/1024/768',\n 'https://picsum.photos/seed/@victor/1024/768',\n 'https://picsum.photos/seed/@svet/1024/768',\n 'https://picsum.photos/seed/@mario2/1024/768',\n 'https://picsum.photos/seed/1/1024/768',\n 'https://picsum.photos/seed/2/1024/768',\n 'https://picsum.photos/seed/3/1024/768',\n 'https://picsum.photos/seed/4/1024/768',\n 'https://picsum.photos/seed/5/1024/768',\n 'https://picsum.photos/seed/6/1024/768',\n 'https://picsum.photos/seed/7/1024/768',\n 'https://picsum.photos/seed/8/1024/768',\n 'https://picsum.photos/seed/9/1024/768',\n 'https://picsum.photos/seed/10/1024/768',\n 'https://picsum.photos/seed/11/1024/768',\n 'https://picsum.photos/seed/12/1024/768',\n ],\n index: 0,\n indicator: true,\n preloadImages: 1,\n replay: false,\n visibleItems: 1,\n width: 408,\n // inherited properties\n testId: 'test-story',\n style: { borderRadius: 2 },\n};\n\nStory.argTypes = {};\n"],"mappings":";;;;;;AAAA;AAEA;AACA;AAA8C;AAAA;AAAA,eAE/B;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAEtC,IAAMC,UAAU,GAAG,GAAG;AACtB,IAAMC,SAAS,GAAG;EAChBC,KAAK,EAAE;IAAEC,eAAe,EAAE,KAAK;IAAEC,MAAM,EAAE,GAAG;IAAEC,WAAW,EAAE,EAAE;IAAEC,QAAQ,EAAEN,UAAU;IAAEO,OAAO,EAAE;EAAG;AACnG,CAAC;AAEM,IAAMC,KAAK,GAAG,SAARA,KAAK,CAAIC,KAAK;EAAA,oBACzB,yEACE,6BAAC,gBAAI,kBAAe,eACpB,6BAAC,cAAM,eACDA,KAAK;IACT,QAAQ,EAAE;MAAA;MAAA,kCAAIC,MAAM;QAANA,MAAM;MAAA;MAAA,OAAK,YAAAC,OAAO,EAACC,GAAG,kBAAC,UAAU,SAAKF,MAAM,EAAC;IAAA,CAAC;IAC5D,SAAS,EAAE;MAAA;MAAA,mCAAIA,MAAM;QAANA,MAAM;MAAA;MAAA,OAAK,aAAAC,OAAO,EAACC,GAAG,mBAAC,WAAW,SAAKF,MAAM,EAAC;IAAA;EAAC,GAC9D,eACF,6BAAC,gBAAI,sBAAmB,eAExB,6BAAC,cAAM,eACDD,KAAK;IACT,MAAM,EAAE,GAAI;IACZ,KAAK,EAAE,CAAE;IACT,YAAY,EAAE,GAAI;IAClB,KAAK,EAAET,UAAW;IAClB,KAAK,EAAE;MAAEG,eAAe,EAAE;IAAQ;EAAE,iBAEpC,6BAAC,gBAAI,EAAKF,SAAS,eACjB,6BAAC,gBAAI,YAAS,CACT,eACP,6BAAC,gBAAI,EAAKA,SAAS,eACjB,6BAAC,gBAAI,YAAS,CACT,eACP,6BAAC,gBAAI,EAAKA,SAAS,eACjB,6BAAC,gBAAI,YAAS,CACT,eACP,6BAAC,gBAAI,EAAKA,SAAS,eACjB,6BAAC,gBAAI,YAAS,CACT,eACP,6BAAC,gBAAI,EAAKA,SAAS,eACjB,6BAAC,gBAAI,YAAS,CACT,CACA,CACR;AAAA,CACJ;AAAC;AAEFO,KAAK,CAACK,SAAS,GAAG,QAAQ;AAE1BL,KAAK,CAACM,IAAI,GAAG;EACXC,IAAI,EAAE,KAAK;EACXC,QAAQ,EAAE,QAAQ;EAClBC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAEC,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,CAAC;EACjEd,MAAM,EAAE,GAAG;EACXe,MAAM,EAAE,CACN,8CAA8C,EAC9C,2CAA2C,EAC3C,6CAA6C,EAC7C,6CAA6C,EAC7C,2CAA2C,EAC3C,6CAA6C,EAC7C,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,uCAAuC,EACvC,wCAAwC,EACxC,wCAAwC,EACxC,wCAAwC,CACzC;EACDC,KAAK,EAAE,CAAC;EACRC,SAAS,EAAE,IAAI;EACfC,aAAa,EAAE,CAAC;EAChBC,MAAM,EAAE,KAAK;EACbC,YAAY,EAAE,CAAC;EACfC,KAAK,EAAE,GAAG;EACV;EACAC,MAAM,EAAE,YAAY;EACpBxB,KAAK,EAAE;IAAEyB,YAAY,EAAE;EAAE;AAC3B,CAAC;AAEDnB,KAAK,CAACoB,QAAQ,GAAG,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mirai/ui",
3
- "version": "2.0.35",
3
+ "version": "2.0.36",
4
4
  "repository": "git@gitlab.com:miraicorp/dev/frontend/ui.git",
5
5
  "author": "JΛVI <hello@soyjavi.com>",
6
6
  "license": "MIT",