@mirai/ui 1.1.0-c → 1.1.0-f

package/build/components/Modal/__tests__/__snapshots__/Modal.test.js.snap

@@ -21,7 +21,7 @@ exports[`component:<Modal> Mobile environment prop:onClose 1`] = `
           tabindex="0"
         >
           <ui_icon
-            class="icon headline-3 icon"
+            class="icon h3 icon"
           >
             <svg
               fill="currentColor"
@@ -132,7 +132,7 @@ exports[`component:<Modal> prop:onBack 1`] = `
           tabindex="0"
         >
           <ui_icon
-            class="icon headline-3 icon"
+            class="icon h3 icon"
           >
             <svg
               fill="currentColor"
@@ -180,7 +180,7 @@ exports[`component:<Modal> prop:onClose 1`] = `
           tabindex="0"
         >
           <ui_icon
-            class="icon headline-3 icon"
+            class="icon h3 icon"
           >
             <svg
               fill="currentColor"

package/build/components/Notification/Notification.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,10 +8,8 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireDefault(require("react"));
 var _helpers = require("../../helpers");
 var _primitives = require("../../primitives");
-var style = _interopRequireWildcard(require("./Notification.module.css"));
+var _NotificationModule = _interopRequireDefault(require("./Notification.module.css"));
 var _excluded = ["children", "error", "info", "inline", "large", "small", "success", "warning", "wide", "onClose"];
-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); }
-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; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -33,7 +30,7 @@ var Notification = function Notification(_ref) {
   return /*#__PURE__*/_react.default.createElement(_primitives.View, _extends({}, others, {
     row: true,
     role: others.role || 'notification',
-    className: (0, _helpers.styles)(style.notification, error ? style.error : warning ? style.warning : success ? style.success : info ? style.info : undefined, inline ? style.inline : style.outlined, inline && style.inline, large ? style.large : small && style.small, wide && style.wide, others.className)
+    className: (0, _helpers.styles)(_NotificationModule.default.notification, error ? _NotificationModule.default.error : warning ? _NotificationModule.default.warning : success ? _NotificationModule.default.success : info ? _NotificationModule.default.info : undefined, inline ? _NotificationModule.default.inline : _NotificationModule.default.outlined, inline && _NotificationModule.default.inline, large ? _NotificationModule.default.large : small && _NotificationModule.default.small, wide && _NotificationModule.default.wide, others.className)
   }), /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     headline: large,
     level: large ? 1 : undefined,
@@ -43,13 +40,13 @@ var Notification = function Notification(_ref) {
       success: success,
       warning: warning
     }),
-    className: style.icon
+    className: _NotificationModule.default.icon
   }), /*#__PURE__*/_react.default.createElement(_primitives.Text, {
     small: small,
-    className: (0, _helpers.styles)(style.text, error ? style.error : warning ? style.warning : success ? style.success : undefined)
+    className: (0, _helpers.styles)(_NotificationModule.default.text, error ? _NotificationModule.default.error : warning ? _NotificationModule.default.warning : success ? _NotificationModule.default.success : undefined)
   }, children), !large && onClose && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
     onPress: onClose,
-    className: (0, _helpers.styles)(style.pressable, style.icon),
+    className: (0, _helpers.styles)(_NotificationModule.default.pressable, _NotificationModule.default.icon),
     testId: others.testId ? "".concat(others.testId, "-button-close") : undefined
   }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     value: _primitives.ICON.CLOSE,

package/build/components/Notification/Notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","names":["Notification","children","error","info","inline","large","small","success","warning","wide","onClose","others","role","styles","style","notification","undefined","outlined","className","getIconState","icon","text","pressable","testId","ICON","CLOSE","displayName","propTypes","PropTypes","any","isRequired","bool","func"],"sources":["../../../src/components/Notification/Notification.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { getIconState, styles } from '../../helpers';\nimport { Icon, ICON, Pressable, Text, View } from '../../primitives';\nimport * as style from './Notification.module.css';\n\nconst Notification = ({\n  children,\n  error,\n  info,\n  inline = false,\n  large,\n  small,\n  success,\n  warning,\n  wide,\n  onClose,\n  ...others\n}) => (\n  <View\n    {...others}\n    row\n    role={others.role || 'notification'}\n    className={styles(\n      style.notification,\n      error ? style.error : warning ? style.warning : success ? style.success : info ? style.info : undefined,\n      inline ? style.inline : style.outlined,\n      inline && style.inline,\n      large ? style.large : small && style.small,\n      wide && style.wide,\n      others.className,\n    )}\n  >\n    <Icon\n      headline={large}\n      level={large ? 1 : undefined}\n      paragraph={small}\n      value={getIconState({ error, success, warning })}\n      className={style.icon}\n    />\n    <Text\n      small={small}\n      className={styles(\n        style.text,\n        error ? style.error : warning ? style.warning : success ? style.success : undefined,\n      )}\n    >\n      {children}\n    </Text>\n    {!large && onClose && (\n      <Pressable\n        onPress={onClose}\n        className={styles(style.pressable, style.icon)}\n        testId={others.testId ? `${others.testId}-button-close` : undefined}\n      >\n        <Icon value={ICON.CLOSE} paragraph={small} />\n      </Pressable>\n    )}\n  </View>\n);\n\nNotification.displayName = 'Component:Notification';\n\nNotification.propTypes = {\n  children: PropTypes.any.isRequired,\n  error: PropTypes.bool,\n  info: PropTypes.bool,\n  inline: PropTypes.bool,\n  large: PropTypes.bool,\n  small: PropTypes.bool,\n  success: PropTypes.bool,\n  warning: PropTypes.bool,\n  wide: PropTypes.bool,\n  onClose: PropTypes.func,\n};\n\nexport { Notification };\n"],"mappings":"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"}
+{"version":3,"file":"Notification.js","names":["Notification","children","error","info","inline","large","small","success","warning","wide","onClose","others","role","styles","style","notification","undefined","outlined","className","getIconState","icon","text","pressable","testId","ICON","CLOSE","displayName","propTypes","PropTypes","any","isRequired","bool","func"],"sources":["../../../src/components/Notification/Notification.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { getIconState, styles } from '../../helpers';\nimport { Icon, ICON, Pressable, Text, View } from '../../primitives';\nimport style from './Notification.module.css';\n\nconst Notification = ({\n  children,\n  error,\n  info,\n  inline = false,\n  large,\n  small,\n  success,\n  warning,\n  wide,\n  onClose,\n  ...others\n}) => (\n  <View\n    {...others}\n    row\n    role={others.role || 'notification'}\n    className={styles(\n      style.notification,\n      error ? style.error : warning ? style.warning : success ? style.success : info ? style.info : undefined,\n      inline ? style.inline : style.outlined,\n      inline && style.inline,\n      large ? style.large : small && style.small,\n      wide && style.wide,\n      others.className,\n    )}\n  >\n    <Icon\n      headline={large}\n      level={large ? 1 : undefined}\n      paragraph={small}\n      value={getIconState({ error, success, warning })}\n      className={style.icon}\n    />\n    <Text\n      small={small}\n      className={styles(\n        style.text,\n        error ? style.error : warning ? style.warning : success ? style.success : undefined,\n      )}\n    >\n      {children}\n    </Text>\n    {!large && onClose && (\n      <Pressable\n        onPress={onClose}\n        className={styles(style.pressable, style.icon)}\n        testId={others.testId ? `${others.testId}-button-close` : undefined}\n      >\n        <Icon value={ICON.CLOSE} paragraph={small} />\n      </Pressable>\n    )}\n  </View>\n);\n\nNotification.displayName = 'Component:Notification';\n\nNotification.propTypes = {\n  children: PropTypes.any.isRequired,\n  error: PropTypes.bool,\n  info: PropTypes.bool,\n  inline: PropTypes.bool,\n  large: PropTypes.bool,\n  small: PropTypes.bool,\n  success: PropTypes.bool,\n  warning: PropTypes.bool,\n  wide: PropTypes.bool,\n  onClose: PropTypes.func,\n};\n\nexport { Notification };\n"],"mappings":"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"}

package/build/components/Notification/__tests__/__snapshots__/Notification.test.js.snap

@@ -6,7 +6,7 @@ exports[`component:<Notification> inherit:className 1`] = `
     class="view row notification outlined mirai"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -41,7 +41,7 @@ exports[`component:<Notification> prop:error 1`] = `
     class="view row notification error outlined"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -76,7 +76,7 @@ exports[`component:<Notification> prop:info & inline 1`] = `
     class="view row notification info inline inline"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -111,7 +111,7 @@ exports[`component:<Notification> prop:info & large 1`] = `
     class="view row notification info outlined large"
   >
     <ui_icon
-      class="icon headline-1 icon"
+      class="icon h1 icon"
     >
       <svg
         fill="currentColor"
@@ -181,7 +181,7 @@ exports[`component:<Notification> prop:info 1`] = `
     class="view row notification info outlined"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -216,7 +216,7 @@ exports[`component:<Notification> prop:inline 1`] = `
     class="view row notification inline inline"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -251,7 +251,7 @@ exports[`component:<Notification> prop:large & prop:inline 1`] = `
     class="view row notification inline inline large"
   >
     <ui_icon
-      class="icon headline-1 icon"
+      class="icon h1 icon"
     >
       <svg
         fill="currentColor"
@@ -286,7 +286,7 @@ exports[`component:<Notification> prop:large 1`] = `
     class="view row notification outlined large"
   >
     <ui_icon
-      class="icon headline-1 icon"
+      class="icon h1 icon"
     >
       <svg
         fill="currentColor"
@@ -322,7 +322,7 @@ exports[`component:<Notification> prop:onClose 1`] = `
     data-testid="mirai-onClose"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -353,7 +353,7 @@ exports[`component:<Notification> prop:onClose 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -454,7 +454,7 @@ exports[`component:<Notification> prop:success & inline 1`] = `
     class="view row notification success inline inline"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -489,7 +489,7 @@ exports[`component:<Notification> prop:success & large 1`] = `
     class="view row notification success outlined large"
   >
     <ui_icon
-      class="icon headline-1 icon"
+      class="icon h1 icon"
     >
       <svg
         fill="currentColor"
@@ -559,7 +559,7 @@ exports[`component:<Notification> prop:success 1`] = `
     class="view row notification success outlined"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -594,7 +594,7 @@ exports[`component:<Notification> prop:warning & inline 1`] = `
     class="view row notification warning inline inline"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -625,7 +625,7 @@ exports[`component:<Notification> prop:warning & large 1`] = `
     class="view row notification warning outlined large"
   >
     <ui_icon
-      class="icon headline-1 icon"
+      class="icon h1 icon"
     >
       <svg
         fill="currentColor"
@@ -687,7 +687,7 @@ exports[`component:<Notification> prop:warning 1`] = `
     class="view row notification warning outlined"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -718,7 +718,7 @@ exports[`component:<Notification> prop:wide 1`] = `
     class="view row notification outlined wide"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -753,7 +753,7 @@ exports[`component:<Notification> renders 1`] = `
     class="view row notification outlined"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"
@@ -789,7 +789,7 @@ exports[`component:<Notification> testId 1`] = `
     data-testid="mirai"
   >
     <ui_icon
-      class="icon headline-3 icon"
+      class="icon h3 icon"
     >
       <svg
         fill="currentColor"

package/build/components/Progress/Progress.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,10 +8,8 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireDefault(require("react"));
 var _helpers = require("../../helpers");
 var _primitives = require("../../primitives");
-var style = _interopRequireWildcard(require("./Progress.module.css"));
+var _ProgressModule = _interopRequireDefault(require("./Progress.module.css"));
 var _excluded = ["indeterminate", "value", "visible"];
-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); }
-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; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -27,9 +24,9 @@ var Progress = function Progress(_ref) {
     others = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_primitives.View, _extends({}, others, {
     role: others.role || 'progress',
-    className: (0, _helpers.styles)(style.progress, visible && style.visible, others.className)
+    className: (0, _helpers.styles)(_ProgressModule.default.progress, visible && _ProgressModule.default.visible, others.className)
   }), /*#__PURE__*/_react.default.createElement(_primitives.View, {
-    className: (0, _helpers.styles)(style.value, indeterminate && style.indeterminate),
+    className: (0, _helpers.styles)(_ProgressModule.default.value, indeterminate && _ProgressModule.default.indeterminate),
     style: !indeterminate ? {
       width: "".concat(value, "%")
     } : undefined

package/build/components/Progress/Progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"Progress.js","names":["Progress","indeterminate","value","visible","others","role","styles","style","progress","className","width","undefined","propTypes","PropTypes","bool","number"],"sources":["../../../src/components/Progress/Progress.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { View } from '../../primitives';\nimport * as style from './Progress.module.css';\n\nconst Progress = ({ indeterminate = false, value = 0, visible = false, ...others }) => (\n  <View\n    {...others}\n    role={others.role || 'progress'}\n    className={styles(style.progress, visible && style.visible, others.className)}\n  >\n    <View\n      className={styles(style.value, indeterminate && style.indeterminate)}\n      style={!indeterminate ? { width: `${value}%` } : undefined}\n    />\n  </View>\n);\n\nProgress.propTypes = {\n  indeterminate: PropTypes.bool,\n  value: PropTypes.number,\n  visible: PropTypes.bool,\n};\n\nexport { Progress };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AAA+C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAE/C,IAAMA,QAAQ,GAAG,SAAXA,QAAQ;EAAA,8BAAMC,aAAa;IAAbA,aAAa,mCAAG,KAAK;IAAA,kBAAEC,KAAK;IAALA,KAAK,2BAAG,CAAC;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAKC,MAAM;EAAA,oBAC9E,6BAAC,gBAAI,eACCA,MAAM;IACV,IAAI,EAAEA,MAAM,CAACC,IAAI,IAAI,UAAW;IAChC,SAAS,EAAE,IAAAC,eAAM,EAACC,KAAK,CAACC,QAAQ,EAAEL,OAAO,IAAII,KAAK,CAACJ,OAAO,EAAEC,MAAM,CAACK,SAAS;EAAE,iBAE9E,6BAAC,gBAAI;IACH,SAAS,EAAE,IAAAH,eAAM,EAACC,KAAK,CAACL,KAAK,EAAED,aAAa,IAAIM,KAAK,CAACN,aAAa,CAAE;IACrE,KAAK,EAAE,CAACA,aAAa,GAAG;MAAES,KAAK,YAAKR,KAAK;IAAI,CAAC,GAAGS;EAAU,EAC3D,CACG;AAAA,CACR;AAAC;AAEFX,QAAQ,CAACY,SAAS,GAAG;EACnBX,aAAa,EAAEY,kBAAS,CAACC,IAAI;EAC7BZ,KAAK,EAAEW,kBAAS,CAACE,MAAM;EACvBZ,OAAO,EAAEU,kBAAS,CAACC;AACrB,CAAC"}
+{"version":3,"file":"Progress.js","names":["Progress","indeterminate","value","visible","others","role","styles","style","progress","className","width","undefined","propTypes","PropTypes","bool","number"],"sources":["../../../src/components/Progress/Progress.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { View } from '../../primitives';\nimport style from './Progress.module.css';\n\nconst Progress = ({ indeterminate = false, value = 0, visible = false, ...others }) => (\n  <View\n    {...others}\n    role={others.role || 'progress'}\n    className={styles(style.progress, visible && style.visible, others.className)}\n  >\n    <View\n      className={styles(style.value, indeterminate && style.indeterminate)}\n      style={!indeterminate ? { width: `${value}%` } : undefined}\n    />\n  </View>\n);\n\nProgress.propTypes = {\n  indeterminate: PropTypes.bool,\n  value: PropTypes.number,\n  visible: PropTypes.bool,\n};\n\nexport { Progress };\n"],"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AACA;AAA0C;AAAA;AAAA;AAAA;AAAA;AAE1C,IAAMA,QAAQ,GAAG,SAAXA,QAAQ;EAAA,8BAAMC,aAAa;IAAbA,aAAa,mCAAG,KAAK;IAAA,kBAAEC,KAAK;IAALA,KAAK,2BAAG,CAAC;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAKC,MAAM;EAAA,oBAC9E,6BAAC,gBAAI,eACCA,MAAM;IACV,IAAI,EAAEA,MAAM,CAACC,IAAI,IAAI,UAAW;IAChC,SAAS,EAAE,IAAAC,eAAM,EAACC,uBAAK,CAACC,QAAQ,EAAEL,OAAO,IAAII,uBAAK,CAACJ,OAAO,EAAEC,MAAM,CAACK,SAAS;EAAE,iBAE9E,6BAAC,gBAAI;IACH,SAAS,EAAE,IAAAH,eAAM,EAACC,uBAAK,CAACL,KAAK,EAAED,aAAa,IAAIM,uBAAK,CAACN,aAAa,CAAE;IACrE,KAAK,EAAE,CAACA,aAAa,GAAG;MAAES,KAAK,YAAKR,KAAK;IAAI,CAAC,GAAGS;EAAU,EAC3D,CACG;AAAA,CACR;AAAC;AAEFX,QAAQ,CAACY,SAAS,GAAG;EACnBX,aAAa,EAAEY,kBAAS,CAACC,IAAI;EAC7BZ,KAAK,EAAEW,kBAAS,CAACE,MAAM;EACvBZ,OAAO,EAAEU,kBAAS,CAACC;AACrB,CAAC"}

package/build/components/Slider/Slider.js

@@ -12,7 +12,7 @@ var _hooks = require("../../hooks");
 var _primitives = require("../../primitives");
 var _helpers2 = require("./helpers");
 var _Slider = require("./Slider.constants");
-var style = _interopRequireWildcard(require("./Slider.module.css"));
+var _SliderModule = _interopRequireDefault(require("./Slider.module.css"));
 var _excluded = ["auto", "captions", "fullScreen", "height", "images", "index", "thumbnails", "width", "onChange", "onFullScreen"];
 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); }
 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; }
@@ -109,7 +109,7 @@ var Slider = function Slider(_ref) {
     onMouseLeave: isDesktop ? function () {
       return setFocus(false);
     } : undefined,
-    className: (0, _helpers.styles)(style.container, fullScreen && style.fullScreen, others.className),
+    className: (0, _helpers.styles)(_SliderModule.default.slider, fullScreen && _SliderModule.default.fullScreen, others.className),
     style: _objectSpread(_objectSpread({}, !fullScreen ? others.style : undefined), {}, {
       width: fullScreen ? screenWidth : width
     })
@@ -117,7 +117,7 @@ var Slider = function Slider(_ref) {
     onPress: function onPress() {
       return setIndex(index - 1);
     },
-    className: (0, _helpers.styles)(style.button, (index <= 0 || isDesktop && !focus) && style.hide, style.back)
+    className: (0, _helpers.styles)(_SliderModule.default.button, (index <= 0 || isDesktop && !focus) && _SliderModule.default.hide, _SliderModule.default.back)
   }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     value: _primitives.ICON.LEFT
   })), /*#__PURE__*/_react.default.createElement(_primitives.ScrollView, {
@@ -126,47 +126,47 @@ var Slider = function Slider(_ref) {
     snap: true,
     width: width,
     onScroll: handleScroll,
-    className: style.scrollView
+    className: _SliderModule.default.scrollView
   }, images.map(function (image, imageIndex) {
     return /*#__PURE__*/_react.default.createElement(_primitives.View, {
       key: imageIndex,
-      className: style.item
+      className: _SliderModule.default.item
     }, /*#__PURE__*/_react.default.createElement(_primitives.View, {
       role: "image",
       onClick: function onClick() {
         return setFullScreen(!fullScreen);
       },
-      className: style.image,
+      className: _SliderModule.default.image,
       style: {
         backgroundImage: fullScreen || imageIndex >= index - _Slider.PRELOAD_IMAGES && imageIndex <= index + _Slider.PRELOAD_IMAGES ? "url(".concat(image, ")") : undefined,
         height: height,
         width: width
       }
     }), captions[imageIndex] && /*#__PURE__*/_react.default.createElement(_primitives.View, {
-      className: style.caption
+      className: _SliderModule.default.caption
     }, /*#__PURE__*/_react.default.createElement(_primitives.Text, {
       bold: true,
       small: true,
-      className: style.text
+      className: _SliderModule.default.text
     }, captions[imageIndex])));
   })), !fullScreen && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
     onPress: function onPress() {
       return setIndex(index + 1);
     },
-    className: (0, _helpers.styles)(style.button, (index >= images.length - 1 || isDesktop && !focus) && style.hide && style.hide, style.forward)
+    className: (0, _helpers.styles)(_SliderModule.default.button, (index >= images.length - 1 || isDesktop && !focus) && _SliderModule.default.hide && _SliderModule.default.hide, _SliderModule.default.forward)
   }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     value: _primitives.ICON.RIGHT
   })), fullScreen && /*#__PURE__*/_react.default.createElement(_primitives.ScrollView, {
     horizontal: true,
     snap: true,
-    className: style.thumbnails
+    className: _SliderModule.default.thumbnails
   }, images.map(function (image, imageIndex) {
     return /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
       key: imageIndex,
       onPress: function onPress() {
         return setIndex(imageIndex);
       },
-      className: (0, _helpers.styles)(style.thumbnail, index === imageIndex && style.active),
+      className: (0, _helpers.styles)(_SliderModule.default.thumbnail, index === imageIndex && _SliderModule.default.active),
       style: {
         backgroundImage: "url(".concat(thumbnails[imageIndex] || image, ")")
       }

package/build/components/Slider/Slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","names":["interval","timeout","Slider","auto","captions","fullScreen","propFullScreen","height","propHeight","images","index","propIndex","thumbnails","width","propWidth","onChange","onFullScreen","others","useDevice","screenHeight","isDesktop","isLandscape","screenWidth","useState","focus","setFocus","setFullScreen","setIndex","useEffect","setInterval","length","clearInterval","handleScroll","x","clearTimeout","setTimeout","Math","round","getMotionExpand","undefined","styles","style","container","className","button","hide","back","ICON","LEFT","floor","scrollView","map","image","imageIndex","item","backgroundImage","PRELOAD_IMAGES","caption","text","forward","RIGHT","thumbnail","active","displayName","propTypes","PropTypes","bool","arrayOf","string","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 { getMotionExpand } from './helpers';\nimport { PRELOAD_IMAGES } from './Slider.constants';\nimport * as style from './Slider.module.css';\n\nlet interval;\nlet timeout;\n\nconst Slider = ({\n  auto = false,\n  captions = [],\n  fullScreen: propFullScreen = false,\n  height: propHeight = 240,\n  images = [],\n  index: propIndex = 0,\n  thumbnails = [],\n  width: propWidth = 320,\n  onChange = () => {},\n  onFullScreen = () => {},\n  ...others\n}) => {\n  const { height: screenHeight, isDesktop, isLandscape, width: screenWidth } = useDevice();\n\n  const [focus, setFocus] = useState(false);\n  const [fullScreen, setFullScreen] = useState(propFullScreen);\n  const [index, setIndex] = useState(propIndex);\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  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => onChange(index), [index]);\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => onFullScreen(fullScreen), [fullScreen]);\n\n  const height = fullScreen ? screenHeight * (isLandscape ? 0.9 : 0.4) : propHeight;\n\n  const width = fullScreen ? screenWidth * (isLandscape ? 0.85 : 0.9) : propWidth;\n\n  const handleScroll = ({ x } = {}) => {\n    clearTimeout(timeout);\n    timeout = setTimeout(() => {\n      setIndex(x < width ? 0 : Math.round(x / width));\n    }, getMotionExpand());\n  };\n\n  return (\n    <View\n      {...others}\n      role=\"slider\"\n      onMouseEnter={isDesktop ? () => setFocus(true) : undefined}\n      onMouseLeave={isDesktop ? () => setFocus(false) : undefined}\n      className={styles(style.container, fullScreen && style.fullScreen, others.className)}\n      style={{ ...(!fullScreen ? others.style : undefined), width: fullScreen ? screenWidth : width }}\n    >\n      {!fullScreen && (\n        <Pressable\n          onPress={() => setIndex(index - 1)}\n          className={styles(style.button, (index <= 0 || (isDesktop && !focus)) && style.hide, style.back)}\n        >\n          <Icon value={ICON.LEFT} />\n        </Pressable>\n      )}\n\n      <ScrollView\n        horizontal\n        scrollTo={index * Math.floor(width)}\n        snap\n        width={width}\n        onScroll={handleScroll}\n        className={style.scrollView}\n      >\n        {images.map((image, imageIndex) => (\n          <View key={imageIndex} className={style.item}>\n            <View\n              role=\"image\"\n              onClick={() => setFullScreen(!fullScreen)}\n              className={style.image}\n              style={{\n                backgroundImage:\n                  fullScreen || (imageIndex >= index - PRELOAD_IMAGES && imageIndex <= index + PRELOAD_IMAGES)\n                    ? `url(${image})`\n                    : undefined,\n                height,\n                width,\n              }}\n            />\n            {captions[imageIndex] && (\n              <View className={style.caption}>\n                <Text bold small className={style.text}>\n                  {captions[imageIndex]}\n                </Text>\n              </View>\n            )}\n          </View>\n        ))}\n      </ScrollView>\n\n      {!fullScreen && (\n        <Pressable\n          onPress={() => setIndex(index + 1)}\n          className={styles(\n            style.button,\n            (index >= images.length - 1 || (isDesktop && !focus)) && style.hide && style.hide,\n            style.forward,\n          )}\n        >\n          <Icon value={ICON.RIGHT} />\n        </Pressable>\n      )}\n\n      {fullScreen && (\n        <ScrollView horizontal snap className={style.thumbnails}>\n          {images.map((image, imageIndex) => (\n            <Pressable\n              key={imageIndex}\n              onPress={() => setIndex(imageIndex)}\n              className={styles(style.thumbnail, index === imageIndex && style.active)}\n              style={{ backgroundImage: `url(${thumbnails[imageIndex] || image})` }}\n            />\n          ))}\n        </ScrollView>\n      )}\n    </View>\n  );\n};\n\nSlider.displayName = 'Component:Slider';\n\nSlider.propTypes = {\n  auto: PropTypes.bool,\n  captions: PropTypes.arrayOf(PropTypes.string),\n  fullScreen: PropTypes.bool,\n  height: PropTypes.number.isRequired,\n  images: PropTypes.arrayOf(PropTypes.string).isRequired,\n  index: PropTypes.number,\n  thumbnails: PropTypes.arrayOf(PropTypes.string),\n  width: PropTypes.number.isRequired,\n  onChange: PropTypes.func,\n  onFullScreen: PropTypes.func,\n};\n\nexport { Slider };\n"],"mappings":"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"}
+{"version":3,"file":"Slider.js","names":["interval","timeout","Slider","auto","captions","fullScreen","propFullScreen","height","propHeight","images","index","propIndex","thumbnails","width","propWidth","onChange","onFullScreen","others","useDevice","screenHeight","isDesktop","isLandscape","screenWidth","useState","focus","setFocus","setFullScreen","setIndex","useEffect","setInterval","length","clearInterval","handleScroll","x","clearTimeout","setTimeout","Math","round","getMotionExpand","undefined","styles","style","slider","className","button","hide","back","ICON","LEFT","floor","scrollView","map","image","imageIndex","item","backgroundImage","PRELOAD_IMAGES","caption","text","forward","RIGHT","thumbnail","active","displayName","propTypes","PropTypes","bool","arrayOf","string","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 { getMotionExpand } from './helpers';\nimport { PRELOAD_IMAGES } from './Slider.constants';\nimport style from './Slider.module.css';\n\nlet interval;\nlet timeout;\n\nconst Slider = ({\n  auto = false,\n  captions = [],\n  fullScreen: propFullScreen = false,\n  height: propHeight = 240,\n  images = [],\n  index: propIndex = 0,\n  thumbnails = [],\n  width: propWidth = 320,\n  onChange = () => {},\n  onFullScreen = () => {},\n  ...others\n}) => {\n  const { height: screenHeight, isDesktop, isLandscape, width: screenWidth } = useDevice();\n\n  const [focus, setFocus] = useState(false);\n  const [fullScreen, setFullScreen] = useState(propFullScreen);\n  const [index, setIndex] = useState(propIndex);\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  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => onChange(index), [index]);\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => onFullScreen(fullScreen), [fullScreen]);\n\n  const height = fullScreen ? screenHeight * (isLandscape ? 0.9 : 0.4) : propHeight;\n\n  const width = fullScreen ? screenWidth * (isLandscape ? 0.85 : 0.9) : propWidth;\n\n  const handleScroll = ({ x } = {}) => {\n    clearTimeout(timeout);\n    timeout = setTimeout(() => {\n      setIndex(x < width ? 0 : Math.round(x / width));\n    }, getMotionExpand());\n  };\n\n  return (\n    <View\n      {...others}\n      role=\"slider\"\n      onMouseEnter={isDesktop ? () => setFocus(true) : undefined}\n      onMouseLeave={isDesktop ? () => setFocus(false) : undefined}\n      className={styles(style.slider, fullScreen && style.fullScreen, others.className)}\n      style={{ ...(!fullScreen ? others.style : undefined), width: fullScreen ? screenWidth : width }}\n    >\n      {!fullScreen && (\n        <Pressable\n          onPress={() => setIndex(index - 1)}\n          className={styles(style.button, (index <= 0 || (isDesktop && !focus)) && style.hide, style.back)}\n        >\n          <Icon value={ICON.LEFT} />\n        </Pressable>\n      )}\n\n      <ScrollView\n        horizontal\n        scrollTo={index * Math.floor(width)}\n        snap\n        width={width}\n        onScroll={handleScroll}\n        className={style.scrollView}\n      >\n        {images.map((image, imageIndex) => (\n          <View key={imageIndex} className={style.item}>\n            <View\n              role=\"image\"\n              onClick={() => setFullScreen(!fullScreen)}\n              className={style.image}\n              style={{\n                backgroundImage:\n                  fullScreen || (imageIndex >= index - PRELOAD_IMAGES && imageIndex <= index + PRELOAD_IMAGES)\n                    ? `url(${image})`\n                    : undefined,\n                height,\n                width,\n              }}\n            />\n            {captions[imageIndex] && (\n              <View className={style.caption}>\n                <Text bold small className={style.text}>\n                  {captions[imageIndex]}\n                </Text>\n              </View>\n            )}\n          </View>\n        ))}\n      </ScrollView>\n\n      {!fullScreen && (\n        <Pressable\n          onPress={() => setIndex(index + 1)}\n          className={styles(\n            style.button,\n            (index >= images.length - 1 || (isDesktop && !focus)) && style.hide && style.hide,\n            style.forward,\n          )}\n        >\n          <Icon value={ICON.RIGHT} />\n        </Pressable>\n      )}\n\n      {fullScreen && (\n        <ScrollView horizontal snap className={style.thumbnails}>\n          {images.map((image, imageIndex) => (\n            <Pressable\n              key={imageIndex}\n              onPress={() => setIndex(imageIndex)}\n              className={styles(style.thumbnail, index === imageIndex && style.active)}\n              style={{ backgroundImage: `url(${thumbnails[imageIndex] || image})` }}\n            />\n          ))}\n        </ScrollView>\n      )}\n    </View>\n  );\n};\n\nSlider.displayName = 'Component:Slider';\n\nSlider.propTypes = {\n  auto: PropTypes.bool,\n  captions: PropTypes.arrayOf(PropTypes.string),\n  fullScreen: PropTypes.bool,\n  height: PropTypes.number.isRequired,\n  images: PropTypes.arrayOf(PropTypes.string).isRequired,\n  index: PropTypes.number,\n  thumbnails: PropTypes.arrayOf(PropTypes.string),\n  width: PropTypes.number.isRequired,\n  onChange: PropTypes.func,\n  onFullScreen: PropTypes.func,\n};\n\nexport { Slider };\n"],"mappings":"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"}

package/build/components/Slider/Slider.module.css

@@ -1,11 +1,11 @@
-.container {
+.slider {
   align-items: center;
   justify-content: center;
   overflow: hidden;
   position: relative;
 }
 
-.container.fullScreen {
+.slider.fullScreen {
   background-color: var(--mirai-ui-slider-background);
   height: 100vh;
   justify-content: center;
@@ -45,9 +45,6 @@
   right: var(--mirai-ui-space-M);
 }
 
-.scrollView {
-}
-
 .fullScreen .scrollView {
   gap: var(--mirai-ui-space-M);
 }

package/build/components/Slider/__tests__/__snapshots__/Slider.test.js.snap

@@ -3,7 +3,7 @@
 exports[`component:<Slider> inherit:className 1`] = `
 <DocumentFragment>
   <ui_view
-    class="view container mirai"
+    class="view slider mirai"
     style="width: 360px;"
   >
     <ui_pressable
@@ -11,7 +11,7 @@ exports[`component:<Slider> inherit:className 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -90,7 +90,7 @@ exports[`component:<Slider> inherit:className 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -118,7 +118,7 @@ exports[`component:<Slider> inherit:className 1`] = `
 exports[`component:<Slider> prop:auto 1`] = `
 <DocumentFragment>
   <ui_view
-    class="view container"
+    class="view slider"
     style="width: 360px;"
   >
     <ui_pressable
@@ -126,7 +126,7 @@ exports[`component:<Slider> prop:auto 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -205,7 +205,7 @@ exports[`component:<Slider> prop:auto 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -233,7 +233,7 @@ exports[`component:<Slider> prop:auto 1`] = `
 exports[`component:<Slider> prop:captions 1`] = `
 <DocumentFragment>
   <ui_view
-    class="view container"
+    class="view slider"
     style="width: 360px;"
   >
     <ui_pressable
@@ -241,7 +241,7 @@ exports[`component:<Slider> prop:captions 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -365,7 +365,7 @@ exports[`component:<Slider> prop:captions 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -393,7 +393,7 @@ exports[`component:<Slider> prop:captions 1`] = `
 exports[`component:<Slider> prop:fullScreen 1`] = `
 <DocumentFragment>
   <ui_view
-    class="view container fullScreen"
+    class="view slider fullScreen"
     style="width: 1024px;"
   >
     <ui_scrollview
@@ -490,7 +490,7 @@ exports[`component:<Slider> prop:fullScreen 1`] = `
 exports[`component:<Slider> prop:index 1`] = `
 <DocumentFragment>
   <ui_view
-    class="view container"
+    class="view slider"
     style="width: 360px;"
   >
     <ui_pressable
@@ -498,7 +498,7 @@ exports[`component:<Slider> prop:index 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -577,7 +577,7 @@ exports[`component:<Slider> prop:index 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -605,7 +605,7 @@ exports[`component:<Slider> prop:index 1`] = `
 exports[`component:<Slider> renders 1`] = `
 <DocumentFragment>
   <ui_view
-    class="view container"
+    class="view slider"
     style="width: 360px;"
   >
     <ui_pressable
@@ -613,7 +613,7 @@ exports[`component:<Slider> renders 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -692,7 +692,7 @@ exports[`component:<Slider> renders 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -720,7 +720,7 @@ exports[`component:<Slider> renders 1`] = `
 exports[`component:<Slider> testId 1`] = `
 <DocumentFragment>
   <ui_view
-    class="view container"
+    class="view slider"
     data-testid="mirai"
     style="width: 360px;"
   >
@@ -729,7 +729,7 @@ exports[`component:<Slider> testId 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"
@@ -808,7 +808,7 @@ exports[`component:<Slider> testId 1`] = `
       tabindex="0"
     >
       <ui_icon
-        class="icon headline-3"
+        class="icon h3"
       >
         <svg
           fill="currentColor"