@mirai/ui 1.0.174 → 1.0.176
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.
- package/README.md +36 -1
- package/build/components/Button/Button.js +5 -2
- package/build/components/Button/Button.js.map +1 -1
- package/build/components/Button/Button.module.css +18 -3
- package/build/components/Button/Button.stories.js +1 -0
- package/build/components/Button/Button.stories.js.map +1 -1
- package/build/components/Button/__tests__/__snapshots__/Button.test.js.snap +32 -0
- package/build/components/Calendar/Calendar.Month.js +2 -2
- package/build/components/Calendar/Calendar.Month.js.map +1 -1
- package/build/components/Calendar/Calendar.Week.js +1 -1
- package/build/components/Calendar/Calendar.Week.js.map +1 -1
- package/build/components/Calendar/Calendar.js +5 -6
- package/build/components/Calendar/Calendar.js.map +1 -1
- package/build/components/Calendar/Calendar.module.css +10 -11
- package/build/components/Calendar/Calendar.stories.js +2 -2
- package/build/components/Calendar/Calendar.stories.js.map +1 -1
- package/build/components/Calendar/__tests__/__snapshots__/Calendar.test.jsx.snap +122 -122
- package/build/components/Slider/Slider.constants.js +9 -0
- package/build/components/Slider/Slider.constants.js.map +1 -0
- package/build/components/Slider/Slider.js +190 -0
- package/build/components/Slider/Slider.js.map +1 -0
- package/build/components/Slider/Slider.module.css +121 -0
- package/build/components/Slider/Slider.stories.js +52 -0
- package/build/components/Slider/Slider.stories.js.map +1 -0
- package/build/components/Slider/__tests__/__snapshots__/Slider.test.js.snap +816 -0
- package/build/components/Slider/helpers/getMotionExpand.js +15 -0
- package/build/components/Slider/helpers/getMotionExpand.js.map +1 -0
- package/build/components/Slider/helpers/index.js +17 -0
- package/build/components/Slider/helpers/index.js.map +1 -0
- package/build/components/Slider/index.js +17 -0
- package/build/components/Slider/index.js.map +1 -0
- package/build/components/Tooltip/Tooltip.js +5 -3
- package/build/components/Tooltip/Tooltip.js.map +1 -1
- package/build/theme/default.theme.css +17 -0
- package/package.json +1 -1
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getMotionExpand = void 0;
|
|
7
|
+
var _theme = require("../../../theme");
|
|
8
|
+
var getMotionExpand = function getMotionExpand() {
|
|
9
|
+
var _Theme$get = _theme.Theme.get(),
|
|
10
|
+
_Theme$get$motionExpa = _Theme$get.motionExpand,
|
|
11
|
+
motionExpand = _Theme$get$motionExpa === void 0 ? '300ms' : _Theme$get$motionExpa;
|
|
12
|
+
return parseInt(motionExpand.split('ms')[0]);
|
|
13
|
+
};
|
|
14
|
+
exports.getMotionExpand = getMotionExpand;
|
|
15
|
+
//# sourceMappingURL=getMotionExpand.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getMotionExpand.js","names":["getMotionExpand","Theme","get","motionExpand","parseInt","split"],"sources":["../../../../src/components/Slider/helpers/getMotionExpand.js"],"sourcesContent":["import { Theme } from '../../../theme';\n\nexport const getMotionExpand = () => {\n let { motionExpand = '300ms' } = Theme.get();\n\n return parseInt(motionExpand.split('ms')[0]);\n};\n"],"mappings":";;;;;;AAAA;AAEO,IAAMA,eAAe,GAAG,SAAlBA,eAAe,GAAS;EACnC,iBAAiCC,YAAK,CAACC,GAAG,EAAE;IAAA,mCAAtCC,YAAY;IAAZA,YAAY,sCAAG,OAAO;EAE5B,OAAOC,QAAQ,CAACD,YAAY,CAACE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AAC9C,CAAC;AAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
var _getMotionExpand = require("./getMotionExpand");
|
|
7
|
+
Object.keys(_getMotionExpand).forEach(function (key) {
|
|
8
|
+
if (key === "default" || key === "__esModule") return;
|
|
9
|
+
if (key in exports && exports[key] === _getMotionExpand[key]) return;
|
|
10
|
+
Object.defineProperty(exports, key, {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function get() {
|
|
13
|
+
return _getMotionExpand[key];
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
});
|
|
17
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/Slider/helpers/index.js"],"sourcesContent":["export * from './getMotionExpand';\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
var _Slider = require("./Slider");
|
|
7
|
+
Object.keys(_Slider).forEach(function (key) {
|
|
8
|
+
if (key === "default" || key === "__esModule") return;
|
|
9
|
+
if (key in exports && exports[key] === _Slider[key]) return;
|
|
10
|
+
Object.defineProperty(exports, key, {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function get() {
|
|
13
|
+
return _Slider[key];
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
});
|
|
17
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Slider/index.js"],"sourcesContent":["export * from './Slider';\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
|
@@ -72,9 +72,11 @@ var Tooltip = function Tooltip(_ref) {
|
|
|
72
72
|
var _objectSpread2;
|
|
73
73
|
return /*#__PURE__*/_react.default.cloneElement(child, _objectSpread(_objectSpread({
|
|
74
74
|
key: index
|
|
75
|
-
}, child.props), {}, (_objectSpread2 = {
|
|
76
|
-
|
|
77
|
-
|
|
75
|
+
}, child.props), {}, (_objectSpread2 = {
|
|
76
|
+
onClick: pressable ? function () {
|
|
77
|
+
return setVisible(!visible);
|
|
78
|
+
} : undefined
|
|
79
|
+
}, _defineProperty(_objectSpread2, (0, _helpers2.isPressableInstance)(child) ? 'onEnter' : 'onMouseEnter', !pressable ? function () {
|
|
78
80
|
return setVisible(true);
|
|
79
81
|
} : undefined), _defineProperty(_objectSpread2, (0, _helpers2.isPressableInstance)(child) ? 'onLeave' : 'onMouseLeave', function () {
|
|
80
82
|
return setVisible(false);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","names":["Tooltip","children","propLeft","left","pressable","propRight","right","Template","text","timestamp","propTop","top","visible","propVisible","others","useState","setVisible","position","setPosition","testId","rest","role","React","Children","map","child","index","cloneElement","key","props","
|
|
1
|
+
{"version":3,"file":"Tooltip.js","names":["Tooltip","children","propLeft","left","pressable","propRight","right","Template","text","timestamp","propTop","top","visible","propVisible","others","useState","setVisible","position","setPosition","testId","rest","role","React","Children","map","child","index","cloneElement","key","props","onClick","undefined","isPressableInstance","styles","style","dispatcher","className","tooltip","aline","bottom","propTypes","PropTypes","node","isRequired","bool","oneOfType","func","string","number"],"sources":["../../../src/components/Tooltip/Tooltip.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Layer, LayerContent, Text, View } from '../../primitives';\nimport { isPressableInstance } from './helpers';\nimport style from './Tooltip.module.css';\n\nconst Tooltip = ({\n children,\n left: propLeft,\n pressable = false,\n right: propRight,\n Template,\n text,\n timestamp,\n top: propTop,\n visible: propVisible = false,\n ...others\n}) => {\n const [visible, setVisible] = useState(propVisible);\n const [position, setPosition] = useState({});\n\n const { testId, ...rest } = others;\n\n const { left, right, top = propTop } = position;\n\n return text || Template ? (\n <Layer\n centered\n forceRender={false}\n left={propLeft}\n right={propRight}\n role={others.role || 'tooltip'}\n timestamp={timestamp}\n top={top}\n visible={visible}\n onPosition={setPosition}\n testId={testId}\n >\n {React.Children.map(children, (child, index) =>\n React.cloneElement(child, {\n key: index,\n ...child.props,\n onClick: pressable ? () => setVisible(!visible) : undefined,\n [isPressableInstance(child) ? 'onEnter' : 'onMouseEnter']: !pressable ? () => setVisible(true) : undefined,\n [isPressableInstance(child) ? 'onLeave' : 'onMouseLeave']: () => setVisible(false),\n className: styles(style.dispatcher, child.props.className),\n testId: testId ? `${testId}-dispatcher` : undefined,\n }),\n )}\n\n <LayerContent>\n <View\n {...rest}\n className={styles(\n style.tooltip,\n (propLeft || propRight) && style.aline,\n left && style.left,\n right && style.right,\n top ? style.top : style.bottom,\n rest.className,\n )}\n >\n {Template ? (\n <Template />\n ) : (\n <Text bold small className={style.text}>\n {text}\n </Text>\n )}\n </View>\n </LayerContent>\n </Layer>\n ) : (\n <>{children}</>\n );\n};\n\nTooltip.propTypes = {\n children: PropTypes.node.isRequired,\n left: PropTypes.bool,\n pressable: PropTypes.bool,\n right: PropTypes.bool,\n Template: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n text: PropTypes.string,\n timestamp: PropTypes.number,\n top: PropTypes.bool,\n visible: PropTypes.bool,\n};\n\nexport { Tooltip };\n"],"mappings":"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"}
|
|
@@ -186,6 +186,7 @@
|
|
|
186
186
|
--mirai-ui-calendar-caption-line-height: calc(var(--mirai-ui-calendar-caption-font-size) * 1.5);
|
|
187
187
|
--mirai-ui-calendar-caption-color: var(--mirai-ui-content-light);
|
|
188
188
|
--mirai-ui-calendar-cell: var(--mirai-ui-space-XL);
|
|
189
|
+
--mirai-ui-calendar-cell-border-radius: var(--mirai-ui-border-radius);
|
|
189
190
|
--mirai-ui-calendar-highlight-color: var(--mirai-ui-accent);
|
|
190
191
|
--mirai-ui-calendar-padding: var(--mirai-ui-space-XS);
|
|
191
192
|
--mirai-ui-calendar-range-background: var(--mirai-ui-content-background);
|
|
@@ -249,6 +250,12 @@
|
|
|
249
250
|
--mirai-ui-progress-height: var(--mirai-ui-space-XS);
|
|
250
251
|
--mirai-ui-progress-motion: calc(var(--mirai-ui-motion-expand) * 3);
|
|
251
252
|
|
|
253
|
+
/* Slider */
|
|
254
|
+
--mirai-ui-slider-background: var(--mirai-ui-content-dark);
|
|
255
|
+
--mirai-ui-slider-overlay: rgba(0, 0, 0, 0.66);
|
|
256
|
+
--mirai-ui-slider-color: var(--mirai-ui-base);
|
|
257
|
+
--mirai-ui-slider-border-radius: var(--mirai-ui-border-radius);
|
|
258
|
+
|
|
252
259
|
/* Table */
|
|
253
260
|
--mirai-ui-table-background: var(--mirai-ui-base);
|
|
254
261
|
--mirai-ui-table-border-color: var(--mirai-ui-content-border);
|
|
@@ -289,6 +296,16 @@
|
|
|
289
296
|
}
|
|
290
297
|
}
|
|
291
298
|
|
|
299
|
+
@keyframes mirai-button-transparent-busy {
|
|
300
|
+
0% {
|
|
301
|
+
background-color: var(--mirai-ui-content);
|
|
302
|
+
}
|
|
303
|
+
50%,
|
|
304
|
+
100% {
|
|
305
|
+
background-color: var(--mirai-ui-content-border);
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
|
|
292
309
|
@keyframes mirai-progress-indeterminate {
|
|
293
310
|
0% {
|
|
294
311
|
transform: translateX(0) scaleX(0);
|