npm - @mirai/ui - Versions diffs - 1.0.221 → 1.1.0-c - Mend

@mirai/ui 1.0.221 → 1.1.0-c

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 (116) hide show

package/build/components/InputText/partials/InputText.IconState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InputText.IconState.js","names":["IconState","error","success","warning","getIconState","styles","style","icon","undefined","displayName","propTypes","PropTypes","bool"],"sources":["../../../../src/components/InputText/partials/InputText.IconState.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { getIconState, styles } from '../../../helpers';\nimport { Icon } from '../../../primitives';\nimport style from '../InputText.module.css';\n\nconst IconState = ({ error, success, warning }) => (\n <Icon\n value={getIconState({ error, success, warning })}\n className={styles(style.icon, error ? style.error : warning ? style.warning : success ? style.success : undefined)}\n />\n);\n\nIconState.displayName = 'Component:InputText.IconState';\n\nIconState.propTypes = {\n error: PropTypes.bool,\n success: PropTypes.bool,\n warning: PropTypes.bool,\n};\n\nexport { IconState };\n"],"mappings":"~~;;;;;;~~AAAA;AACA;AAEA;AACA;AACA;~~AAA4C~~;~~AAE5C~~,IAAMA,SAAS,GAAG,SAAZA,SAAS;EAAA,IAAMC,KAAK,QAALA,KAAK;IAAEC,OAAO,QAAPA,OAAO;IAAEC,OAAO,QAAPA,OAAO;EAAA,oBAC1C,6BAAC,gBAAI;IACH,KAAK,EAAE,IAAAC,qBAAY,EAAC;MAAEH,KAAK,EAALA,KAAK;MAAEC,OAAO,EAAPA,OAAO;MAAEC,OAAO,EAAPA;IAAQ,CAAC,CAAE;IACjD,SAAS,EAAE,IAAAE,eAAM,EAACC,~~wBAAK~~,CAACC,IAAI,EAAEN,KAAK,GAAGK,~~wBAAK~~,CAACL,KAAK,GAAGE,OAAO,GAAGG,~~wBAAK~~,CAACH,OAAO,GAAGD,OAAO,GAAGI,~~wBAAK~~,CAACJ,OAAO,GAAGM,SAAS;EAAE,EACnH;AAAA,CACH;AAAC;AAEFR,SAAS,CAACS,WAAW,GAAG,+BAA+B;AAEvDT,SAAS,CAACU,SAAS,GAAG;EACpBT,KAAK,EAAEU,kBAAS,CAACC,IAAI;EACrBV,OAAO,EAAES,kBAAS,CAACC,IAAI;EACvBT,OAAO,EAAEQ,kBAAS,CAACC;AACrB,CAAC"}
1	+ {"version":3,"file":"InputText.IconState.js","names":["IconState","error","success","warning","getIconState","styles","style","icon","undefined","displayName","propTypes","PropTypes","bool"],"sources":["../../../../src/components/InputText/partials/InputText.IconState.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { getIconState, styles } from '../../../helpers';\nimport { Icon } from '../../../primitives';\nimport * as style from '../InputText.module.css';\n\nconst IconState = ({ error, success, warning }) => (\n <Icon\n value={getIconState({ error, success, warning })}\n className={styles(style.icon, error ? style.error : warning ? style.warning : success ? style.success : undefined)}\n />\n);\n\nIconState.displayName = 'Component:InputText.IconState';\n\nIconState.propTypes = {\n error: PropTypes.bool,\n success: PropTypes.bool,\n warning: PropTypes.bool,\n};\n\nexport { IconState };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AAAiD;AAAA;AAAA;AAEjD,IAAMA,SAAS,GAAG,SAAZA,SAAS;EAAA,IAAMC,KAAK,QAALA,KAAK;IAAEC,OAAO,QAAPA,OAAO;IAAEC,OAAO,QAAPA,OAAO;EAAA,oBAC1C,6BAAC,gBAAI;IACH,KAAK,EAAE,IAAAC,qBAAY,EAAC;MAAEH,KAAK,EAALA,KAAK;MAAEC,OAAO,EAAPA,OAAO;MAAEC,OAAO,EAAPA;IAAQ,CAAC,CAAE;IACjD,SAAS,EAAE,IAAAE,eAAM,EAACC,KAAK,CAACC,IAAI,EAAEN,KAAK,GAAGK,KAAK,CAACL,KAAK,GAAGE,OAAO,GAAGG,KAAK,CAACH,OAAO,GAAGD,OAAO,GAAGI,KAAK,CAACJ,OAAO,GAAGM,SAAS;EAAE,EACnH;AAAA,CACH;AAAC;AAEFR,SAAS,CAACS,WAAW,GAAG,+BAA+B;AAEvDT,SAAS,CAACU,SAAS,GAAG;EACpBT,KAAK,EAAEU,kBAAS,CAACC,IAAI;EACrBV,OAAO,EAAES,kBAAS,CAACC,IAAI;EACvBT,OAAO,EAAEQ,kBAAS,CAACC;AACrB,CAAC"}

package/build/components/InputText/partials/InputText.Label.js CHANGED Viewed

@@ -1,5 +1,6 @@
 "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
 });
@@ -8,8 +9,10 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireDefault(require("react"));
 var _helpers = require("../../../helpers");
 var _primitives = require("../../../primitives");
-var _InputTextModule = _interopRequireDefault(require("../InputText.module.css"));
+var style = _interopRequireWildcard(require("../InputText.module.css"));
 var _excluded = ["disabled", "error", "focus", "label", "required", "value"];
+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; }
@@ -24,9 +27,9 @@ var Label = function Label(_ref) {
     value = _ref.value,
     others = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_primitives.Text, _extends({}, others, {
-    className: (0, _helpers.styles)(_InputTextModule.default.text, others.className || _InputTextModule.default.label, disabled && _InputTextModule.default.disabled, focus && _InputTextModule.default.focus, error && _InputTextModule.default.error, (focus || error || value !== undefined && ((value === null || value === void 0 ? void 0 : value.length) > 0 || typeof value === 'number')) && _InputTextModule.default.withValue)
+    className: (0, _helpers.styles)(style.text, others.className || style.label, disabled && style.disabled, focus && style.focus, error && style.error, (focus || error || value !== undefined && ((value === null || value === void 0 ? void 0 : value.length) > 0 || typeof value === 'number')) && style.withValue)
   }), label, required && !disabled && /*#__PURE__*/_react.default.createElement("span", {
-    className: _InputTextModule.default.required
+    className: style.required
   }, " *"));
 };
 exports.Label = Label;

package/build/components/InputText/partials/InputText.Label.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InputText.Label.js","names":["Label","disabled","error","focus","label","required","value","others","styles","style","text","className","undefined","length","withValue","displayName","propTypes","PropTypes","bool","string"],"sources":["../../../../src/components/InputText/partials/InputText.Label.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../../helpers';\nimport { Text } from '../../../primitives';\nimport style from '../InputText.module.css';\n\nconst Label = ({ disabled, error, focus, label, required = false, value, ...others }) => (\n <Text\n {...others}\n className={styles(\n style.text,\n others.className \|\| style.label,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n (focus \|\| error \|\| (value !== undefined && (value?.length > 0 \|\| typeof value === 'number'))) && style.withValue,\n )}\n >\n {label}\n {required && !disabled && <span className={style.required}> *</span>}\n </Text>\n);\n\nLabel.displayName = 'Component:InputText.Label';\n\nLabel.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n focus: PropTypes.bool,\n label: PropTypes.string,\n required: PropTypes.bool,\n value: PropTypes.string,\n};\n\nexport { Label };\n"],"mappings":"~~;;;;;;~~AAAA;AACA;AAEA;AACA;AACA;~~AAA4C~~;AAAA;AAAA;AAAA;AAAA;~~AAE5C~~,IAAMA,KAAK,GAAG,SAARA,KAAK;EAAA,IAAMC,QAAQ,QAARA,QAAQ;IAAEC,KAAK,QAALA,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAKC,MAAM;EAAA,oBAChF,6BAAC,gBAAI,eACCA,MAAM;IACV,SAAS,EAAE,IAAAC,eAAM,EACfC,~~wBAAK~~,CAACC,IAAI,EACVH,MAAM,CAACI,SAAS,IAAIF,~~wBAAK~~,CAACL,KAAK,EAC/BH,QAAQ,IAAIQ,~~wBAAK~~,CAACR,QAAQ,EAC1BE,KAAK,IAAIM,~~wBAAK~~,CAACN,KAAK,EACpBD,KAAK,IAAIO,~~wBAAK~~,CAACP,KAAK,EACpB,CAACC,KAAK,IAAID,KAAK,IAAKI,KAAK,KAAKM,SAAS,KAAK,CAAAN,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,MAAM,IAAG,CAAC,IAAI,OAAOP,KAAK,KAAK,QAAQ,CAAE,KAAKG,~~wBAAK~~,CAACK,SAAS;EAChH,IAEDV,KAAK,EACLC,QAAQ,IAAI,CAACJ,QAAQ,iBAAI;IAAM,SAAS,EAAEQ,~~wBAAK~~,CAACJ;EAAS,QAAU,CAC/D;AAAA,CACR;AAAC;AAEFL,KAAK,CAACe,WAAW,GAAG,2BAA2B;AAE/Cf,KAAK,CAACgB,SAAS,GAAG;EAChBf,QAAQ,EAAEgB,kBAAS,CAACC,IAAI;EACxBhB,KAAK,EAAEe,kBAAS,CAACC,IAAI;EACrBf,KAAK,EAAEc,kBAAS,CAACC,IAAI;EACrBd,KAAK,EAAEa,kBAAS,CAACE,MAAM;EACvBd,QAAQ,EAAEY,kBAAS,CAACC,IAAI;EACxBZ,KAAK,EAAEW,kBAAS,CAACE;AACnB,CAAC"}
1	+ {"version":3,"file":"InputText.Label.js","names":["Label","disabled","error","focus","label","required","value","others","styles","style","text","className","undefined","length","withValue","displayName","propTypes","PropTypes","bool","string"],"sources":["../../../../src/components/InputText/partials/InputText.Label.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../../helpers';\nimport { Text } from '../../../primitives';\nimport * as style from '../InputText.module.css';\n\nconst Label = ({ disabled, error, focus, label, required = false, value, ...others }) => (\n <Text\n {...others}\n className={styles(\n style.text,\n others.className \|\| style.label,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n (focus \|\| error \|\| (value !== undefined && (value?.length > 0 \|\| typeof value === 'number'))) && style.withValue,\n )}\n >\n {label}\n {required && !disabled && <span className={style.required}> *</span>}\n </Text>\n);\n\nLabel.displayName = 'Component:InputText.Label';\n\nLabel.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n focus: PropTypes.bool,\n label: PropTypes.string,\n required: PropTypes.bool,\n value: PropTypes.string,\n};\n\nexport { Label };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AAAiD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEjD,IAAMA,KAAK,GAAG,SAARA,KAAK;EAAA,IAAMC,QAAQ,QAARA,QAAQ;IAAEC,KAAK,QAALA,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAKC,MAAM;EAAA,oBAChF,6BAAC,gBAAI,eACCA,MAAM;IACV,SAAS,EAAE,IAAAC,eAAM,EACfC,KAAK,CAACC,IAAI,EACVH,MAAM,CAACI,SAAS,IAAIF,KAAK,CAACL,KAAK,EAC/BH,QAAQ,IAAIQ,KAAK,CAACR,QAAQ,EAC1BE,KAAK,IAAIM,KAAK,CAACN,KAAK,EACpBD,KAAK,IAAIO,KAAK,CAACP,KAAK,EACpB,CAACC,KAAK,IAAID,KAAK,IAAKI,KAAK,KAAKM,SAAS,KAAK,CAAAN,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,MAAM,IAAG,CAAC,IAAI,OAAOP,KAAK,KAAK,QAAQ,CAAE,KAAKG,KAAK,CAACK,SAAS;EAChH,IAEDV,KAAK,EACLC,QAAQ,IAAI,CAACJ,QAAQ,iBAAI;IAAM,SAAS,EAAEQ,KAAK,CAACJ;EAAS,QAAU,CAC/D;AAAA,CACR;AAAC;AAEFL,KAAK,CAACe,WAAW,GAAG,2BAA2B;AAE/Cf,KAAK,CAACgB,SAAS,GAAG;EAChBf,QAAQ,EAAEgB,kBAAS,CAACC,IAAI;EACxBhB,KAAK,EAAEe,kBAAS,CAACC,IAAI;EACrBf,KAAK,EAAEc,kBAAS,CAACC,IAAI;EACrBd,KAAK,EAAEa,kBAAS,CAACE,MAAM;EACvBd,QAAQ,EAAEY,kBAAS,CAACC,IAAI;EACxBZ,KAAK,EAAEW,kBAAS,CAACE;AACnB,CAAC"}

package/build/components/Menu/Menu.Option.js CHANGED Viewed

@@ -1,5 +1,6 @@
 "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
 });
@@ -8,8 +9,10 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireDefault(require("react"));
 var _helpers = require("../../helpers");
 var _primitives = require("../../primitives");
-var _MenuModule = _interopRequireDefault(require("./Menu.module.css"));
+var style = _interopRequireWildcard(require("./Menu.module.css"));
 var _excluded = ["children", "disabled", "divider", "icon", "label", "value", "onPress"];
+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; }
@@ -24,17 +27,17 @@ var Option = function Option(_ref) {
     onPress = _ref.onPress,
     others = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_primitives.Pressable, _extends({}, others, {
-    className: (0, _helpers.styles)(_MenuModule.default.option, value && _MenuModule.default.value, divider && _MenuModule.default.divider, disabled && _MenuModule.default.disabled),
+    className: (0, _helpers.styles)(style.option, value && style.value, divider && style.divider, disabled && style.disabled),
     onPress: !disabled && value ? onPress : undefined
   }), /*#__PURE__*/_react.default.createElement(_primitives.View, {
     row: true,
     wide: true,
-    className: _MenuModule.default.content
+    className: style.content
   }, icon && /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     value: icon,
-    className: _MenuModule.default.icon
+    className: style.icon
   }), label && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
-    className: _MenuModule.default.label
+    className: style.label
   }, label), children));
 };
 exports.Option = Option;

package/build/components/Menu/Menu.Option.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.Option.js","names":["Option","children","disabled","divider","icon","label","value","onPress","others","styles","style","option","undefined","content","displayName","propTypes","PropTypes","node","bool","func","string","oneOfType","number"],"sources":["../../../src/components/Menu/Menu.Option.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Icon, Pressable, Text, View } from '../../primitives';\nimport style from './Menu.module.css';\n\nconst Option = ({ children, disabled, divider, icon, label, value, onPress, ...others }) => (\n <Pressable\n {...others}\n className={styles(style.option, value && style.value, divider && style.divider, disabled && style.disabled)}\n onPress={!disabled && value ? onPress : undefined}\n >\n <View row wide className={style.content}>\n {icon && <Icon value={icon} className={style.icon} />}\n {label && <Text className={style.label}>{label}</Text>}\n {children}\n </View>\n </Pressable>\n);\n\nOption.displayName = 'Component:Menu:Option';\n\nOption.propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n divider: PropTypes.bool,\n icon: PropTypes.func,\n label: PropTypes.string,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n onPress: PropTypes.func,\n};\n\nexport { Option };\n"],"mappings":"~~;;;;;;~~AAAA;AACA;AAEA;AACA;AACA;~~AAAsC~~;AAAA;AAAA;AAAA;AAAA;~~AAEtC~~,IAAMA,MAAM,GAAG,SAATA,MAAM;EAAA,IAAMC,QAAQ,QAARA,QAAQ;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,OAAO,QAAPA,OAAO;IAAEC,IAAI,QAAJA,IAAI;IAAEC,KAAK,QAALA,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAEC,OAAO,QAAPA,OAAO;IAAKC,MAAM;EAAA,oBACnF,6BAAC,qBAAS,eACJA,MAAM;IACV,SAAS,EAAE,IAAAC,eAAM,EAACC,~~mBAAK~~,CAACC,MAAM,EAAEL,KAAK,IAAII,~~mBAAK~~,CAACJ,KAAK,EAAEH,OAAO,IAAIO,~~mBAAK~~,CAACP,OAAO,EAAED,QAAQ,IAAIQ,~~mBAAK~~,CAACR,QAAQ,CAAE;IAC5G,OAAO,EAAE,CAACA,QAAQ,IAAII,KAAK,GAAGC,OAAO,GAAGK;EAAU,iBAElD,6BAAC,gBAAI;IAAC,GAAG;IAAC,IAAI;IAAC,SAAS,EAAEF,~~mBAAK~~,CAACG;EAAQ,GACrCT,IAAI,iBAAI,6BAAC,gBAAI;IAAC,KAAK,EAAEA,IAAK;IAAC,SAAS,EAAEM,~~mBAAK~~,CAACN;EAAK,EAAG,EACpDC,KAAK,iBAAI,6BAAC,gBAAI;IAAC,SAAS,EAAEK,~~mBAAK~~,CAACL;EAAM,GAAEA,KAAK,CAAQ,EACrDJ,QAAQ,CACJ,CACG;AAAA,CACb;AAAC;AAEFD,MAAM,CAACc,WAAW,GAAG,uBAAuB;AAE5Cd,MAAM,CAACe,SAAS,GAAG;EACjBd,QAAQ,EAAEe,kBAAS,CAACC,IAAI;EACxBf,QAAQ,EAAEc,kBAAS,CAACE,IAAI;EACxBf,OAAO,EAAEa,kBAAS,CAACE,IAAI;EACvBd,IAAI,EAAEY,kBAAS,CAACG,IAAI;EACpBd,KAAK,EAAEW,kBAAS,CAACI,MAAM;EACvBd,KAAK,EAAEU,kBAAS,CAACK,SAAS,CAAC,CAACL,kBAAS,CAACI,MAAM,EAAEJ,kBAAS,CAACM,MAAM,CAAC,CAAC;EAChEf,OAAO,EAAES,kBAAS,CAACG;AACrB,CAAC"}
1	+ {"version":3,"file":"Menu.Option.js","names":["Option","children","disabled","divider","icon","label","value","onPress","others","styles","style","option","undefined","content","displayName","propTypes","PropTypes","node","bool","func","string","oneOfType","number"],"sources":["../../../src/components/Menu/Menu.Option.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Icon, Pressable, Text, View } from '../../primitives';\nimport * as style from './Menu.module.css';\n\nconst Option = ({ children, disabled, divider, icon, label, value, onPress, ...others }) => (\n <Pressable\n {...others}\n className={styles(style.option, value && style.value, divider && style.divider, disabled && style.disabled)}\n onPress={!disabled && value ? onPress : undefined}\n >\n <View row wide className={style.content}>\n {icon && <Icon value={icon} className={style.icon} />}\n {label && <Text className={style.label}>{label}</Text>}\n {children}\n </View>\n </Pressable>\n);\n\nOption.displayName = 'Component:Menu:Option';\n\nOption.propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n divider: PropTypes.bool,\n icon: PropTypes.func,\n label: PropTypes.string,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n onPress: PropTypes.func,\n};\n\nexport { Option };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AAA2C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAE3C,IAAMA,MAAM,GAAG,SAATA,MAAM;EAAA,IAAMC,QAAQ,QAARA,QAAQ;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,OAAO,QAAPA,OAAO;IAAEC,IAAI,QAAJA,IAAI;IAAEC,KAAK,QAALA,KAAK;IAAEC,KAAK,QAALA,KAAK;IAAEC,OAAO,QAAPA,OAAO;IAAKC,MAAM;EAAA,oBACnF,6BAAC,qBAAS,eACJA,MAAM;IACV,SAAS,EAAE,IAAAC,eAAM,EAACC,KAAK,CAACC,MAAM,EAAEL,KAAK,IAAII,KAAK,CAACJ,KAAK,EAAEH,OAAO,IAAIO,KAAK,CAACP,OAAO,EAAED,QAAQ,IAAIQ,KAAK,CAACR,QAAQ,CAAE;IAC5G,OAAO,EAAE,CAACA,QAAQ,IAAII,KAAK,GAAGC,OAAO,GAAGK;EAAU,iBAElD,6BAAC,gBAAI;IAAC,GAAG;IAAC,IAAI;IAAC,SAAS,EAAEF,KAAK,CAACG;EAAQ,GACrCT,IAAI,iBAAI,6BAAC,gBAAI;IAAC,KAAK,EAAEA,IAAK;IAAC,SAAS,EAAEM,KAAK,CAACN;EAAK,EAAG,EACpDC,KAAK,iBAAI,6BAAC,gBAAI;IAAC,SAAS,EAAEK,KAAK,CAACL;EAAM,GAAEA,KAAK,CAAQ,EACrDJ,QAAQ,CACJ,CACG;AAAA,CACb;AAAC;AAEFD,MAAM,CAACc,WAAW,GAAG,uBAAuB;AAE5Cd,MAAM,CAACe,SAAS,GAAG;EACjBd,QAAQ,EAAEe,kBAAS,CAACC,IAAI;EACxBf,QAAQ,EAAEc,kBAAS,CAACE,IAAI;EACxBf,OAAO,EAAEa,kBAAS,CAACE,IAAI;EACvBd,IAAI,EAAEY,kBAAS,CAACG,IAAI;EACpBd,KAAK,EAAEW,kBAAS,CAACI,MAAM;EACvBd,KAAK,EAAEU,kBAAS,CAACK,SAAS,CAAC,CAACL,kBAAS,CAACI,MAAM,EAAEJ,kBAAS,CAACM,MAAM,CAAC,CAAC;EAChEf,OAAO,EAAES,kBAAS,CAACG;AACrB,CAAC"}

package/build/components/Menu/Menu.js CHANGED Viewed

@@ -1,5 +1,6 @@
 "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
 });
@@ -10,9 +11,11 @@ var _helpers = require("../../helpers");
 var _hooks = require("../../hooks");
 var _primitives = require("../../primitives");
 var _Modal = require("../Modal");
-var _MenuModule = _interopRequireDefault(require("./Menu.module.css"));
+var style = _interopRequireWildcard(require("./Menu.module.css"));
 var _Menu = require("./Menu.Option");
 var _excluded = ["children", "options", "Template", "title", "visible", "onPress"];
+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; }
@@ -51,7 +54,7 @@ var Menu = function Menu(_ref) {
   }, others, {
     visible: visible,
     role: others.role || 'menu',
-    className: (0, _helpers.styles)(_MenuModule.default.menu, visible && _MenuModule.default.visible, others.className)
+    className: (0, _helpers.styles)(style.menu, visible && style.visible, others.className)
   }), children, /*#__PURE__*/_react.default.createElement(_primitives.LayerContent, null, renderOptions())) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children, /*#__PURE__*/_react.default.createElement(_Modal.Modal, {
     title: title,
     visible: visible,
@@ -61,7 +64,7 @@ var Menu = function Menu(_ref) {
     onOverflow: function onOverflow(event) {
       return _onPress(undefined, event);
     },
-    className: (0, _helpers.styles)(_MenuModule.default.menu, others.className)
+    className: (0, _helpers.styles)(style.menu, others.className)
   }, renderOptions()));
 };
 exports.Menu = Menu;

package/build/components/Menu/Menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.js","names":["Menu","children","options","Template","Option","title","visible","onPress","others","useDevice","isMobile","renderOptions","filter","option","map","index","testId","undefined","event","value","role","styles","style","menu","className","displayName","propTypes","PropTypes","node","arrayOf","shape","disabled","bool","divider","icon","func","label","string","oneOfType","number","any"],"sources":["../../../src/components/Menu/Menu.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Layer, LayerContent } from '../../primitives';\nimport { Modal } from '../Modal';\nimport style from './Menu.module.css';\nimport { Option } from './Menu.Option';\n\nconst Menu = ({ children, options = [], Template = Option, title, visible, onPress = () => {}, ...others }) => {\n const { isMobile } = useDevice();\n\n const renderOptions = () =>\n options\n .filter((option) => !!option)\n .map((option = {}, index) => (\n <Template\n testId={others.testId ? `${others.testId}-${index}` : undefined}\n {...option}\n key={index}\n onPress={(event) => onPress(option.value, event)}\n />\n ));\n\n return !isMobile ? (\n <Layer\n forceRender={false}\n {...others}\n visible={visible}\n role={others.role \|\| 'menu'}\n className={styles(style.menu, visible && style.visible, others.className)}\n >\n {children}\n <LayerContent>{renderOptions()}</LayerContent>\n </Layer>\n ) : (\n <>\n {children}\n <Modal\n title={title}\n visible={visible}\n onClose={(event) => onPress(undefined, event)}\n onOverflow={(event) => onPress(undefined, event)}\n className={styles(style.menu, others.className)}\n >\n {renderOptions()}\n </Modal>\n </>\n );\n};\n\nMenu.displayName = 'Component:Menu';\n\nMenu.propTypes = {\n children: PropTypes.node,\n options: PropTypes.arrayOf(\n PropTypes.shape({\n children: PropTypes.node,\n disabled: PropTypes.bool,\n divider: PropTypes.bool,\n icon: PropTypes.func,\n label: PropTypes.string,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n }),\n ),\n Template: PropTypes.any,\n title: PropTypes.string,\n visible: PropTypes.bool,\n onPress: PropTypes.func,\n};\n\nexport { Menu };\n"],"mappings":"~~;;;;;;~~AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAuC;AAAA;AAAA;AAAA;AAAA;AAEvC,IAAMA,IAAI,GAAG,SAAPA,IAAI,OAAqG;EAAA,IAA/FC,QAAQ,QAARA,QAAQ;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,EAAE;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAGC,YAAM;IAAEC,KAAK,QAALA,KAAK;IAAEC,OAAO,QAAPA,OAAO;IAAA,oBAAEC,OAAO;IAAPA,QAAO,6BAAG,YAAM,CAAC,CAAC;IAAKC,MAAM;EACtG,iBAAqB,IAAAC,gBAAS,GAAE;IAAxBC,QAAQ,cAARA,QAAQ;EAEhB,IAAMC,aAAa,GAAG,SAAhBA,aAAa;IAAA,OACjBT,OAAO,CACJU,MAAM,CAAC,UAACC,MAAM;MAAA,OAAK,CAAC,CAACA,MAAM;IAAA,EAAC,CAC5BC,GAAG,CAAC;MAAA,IAACD,MAAM,uEAAG,CAAC,CAAC;MAAA,IAAEE,KAAK;MAAA,oBACtB,6BAAC,QAAQ;QACP,MAAM,EAAEP,MAAM,CAACQ,MAAM,aAAMR,MAAM,CAACQ,MAAM,cAAID,KAAK,IAAKE;MAAU,GAC5DJ,MAAM;QACV,GAAG,EAAEE,KAAM;QACX,OAAO,EAAE,iBAACG,KAAK;UAAA,OAAKX,QAAO,CAACM,MAAM,CAACM,KAAK,EAAED,KAAK,CAAC;QAAA;MAAC,GACjD;IAAA,CACH,CAAC;EAAA;EAEN,OAAO,CAACR,QAAQ,gBACd,6BAAC,iBAAK;IACJ,WAAW,EAAE;EAAM,GACfF,MAAM;IACV,OAAO,EAAEF,OAAQ;IACjB,IAAI,EAAEE,MAAM,CAACY,IAAI,IAAI,MAAO;IAC5B,SAAS,EAAE,IAAAC,eAAM,EAACC,~~mBAAK~~,CAACC,IAAI,EAAEjB,OAAO,IAAIgB,~~mBAAK~~,CAAChB,OAAO,EAAEE,MAAM,CAACgB,SAAS;EAAE,IAEzEvB,QAAQ,eACT,6BAAC,wBAAY,QAAEU,aAAa,EAAE,CAAgB,CACxC,gBAER,4DACGV,QAAQ,eACT,6BAAC,YAAK;IACJ,KAAK,EAAEI,KAAM;IACb,OAAO,EAAEC,OAAQ;IACjB,OAAO,EAAE,iBAACY,KAAK;MAAA,OAAKX,QAAO,CAACU,SAAS,EAAEC,KAAK,CAAC;IAAA,CAAC;IAC9C,UAAU,EAAE,oBAACA,KAAK;MAAA,OAAKX,QAAO,CAACU,SAAS,EAAEC,KAAK,CAAC;IAAA,CAAC;IACjD,SAAS,EAAE,IAAAG,eAAM,EAACC,~~mBAAK~~,CAACC,IAAI,EAAEf,MAAM,CAACgB,SAAS;EAAE,GAE/Cb,aAAa,EAAE,CACV,CAEX;AACH,CAAC;AAAC;AAEFX,IAAI,CAACyB,WAAW,GAAG,gBAAgB;AAEnCzB,IAAI,CAAC0B,SAAS,GAAG;EACfzB,QAAQ,EAAE0B,kBAAS,CAACC,IAAI;EACxB1B,OAAO,EAAEyB,kBAAS,CAACE,OAAO,CACxBF,kBAAS,CAACG,KAAK,CAAC;IACd7B,QAAQ,EAAE0B,kBAAS,CAACC,IAAI;IACxBG,QAAQ,EAAEJ,kBAAS,CAACK,IAAI;IACxBC,OAAO,EAAEN,kBAAS,CAACK,IAAI;IACvBE,IAAI,EAAEP,kBAAS,CAACQ,IAAI;IACpBC,KAAK,EAAET,kBAAS,CAACU,MAAM;IACvBlB,KAAK,EAAEQ,kBAAS,CAACW,SAAS,CAAC,CAACX,kBAAS,CAACU,MAAM,EAAEV,kBAAS,CAACY,MAAM,CAAC;EACjE,CAAC,CAAC,CACH;EACDpC,QAAQ,EAAEwB,kBAAS,CAACa,GAAG;EACvBnC,KAAK,EAAEsB,kBAAS,CAACU,MAAM;EACvB/B,OAAO,EAAEqB,kBAAS,CAACK,IAAI;EACvBzB,OAAO,EAAEoB,kBAAS,CAACQ;AACrB,CAAC"}
1	+ {"version":3,"file":"Menu.js","names":["Menu","children","options","Template","Option","title","visible","onPress","others","useDevice","isMobile","renderOptions","filter","option","map","index","testId","undefined","event","value","role","styles","style","menu","className","displayName","propTypes","PropTypes","node","arrayOf","shape","disabled","bool","divider","icon","func","label","string","oneOfType","number","any"],"sources":["../../../src/components/Menu/Menu.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Layer, LayerContent } from '../../primitives';\nimport { Modal } from '../Modal';\nimport * as style from './Menu.module.css';\nimport { Option } from './Menu.Option';\n\nconst Menu = ({ children, options = [], Template = Option, title, visible, onPress = () => {}, ...others }) => {\n const { isMobile } = useDevice();\n\n const renderOptions = () =>\n options\n .filter((option) => !!option)\n .map((option = {}, index) => (\n <Template\n testId={others.testId ? `${others.testId}-${index}` : undefined}\n {...option}\n key={index}\n onPress={(event) => onPress(option.value, event)}\n />\n ));\n\n return !isMobile ? (\n <Layer\n forceRender={false}\n {...others}\n visible={visible}\n role={others.role \|\| 'menu'}\n className={styles(style.menu, visible && style.visible, others.className)}\n >\n {children}\n <LayerContent>{renderOptions()}</LayerContent>\n </Layer>\n ) : (\n <>\n {children}\n <Modal\n title={title}\n visible={visible}\n onClose={(event) => onPress(undefined, event)}\n onOverflow={(event) => onPress(undefined, event)}\n className={styles(style.menu, others.className)}\n >\n {renderOptions()}\n </Modal>\n </>\n );\n};\n\nMenu.displayName = 'Component:Menu';\n\nMenu.propTypes = {\n children: PropTypes.node,\n options: PropTypes.arrayOf(\n PropTypes.shape({\n children: PropTypes.node,\n disabled: PropTypes.bool,\n divider: PropTypes.bool,\n icon: PropTypes.func,\n label: PropTypes.string,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n }),\n ),\n Template: PropTypes.any,\n title: PropTypes.string,\n visible: PropTypes.bool,\n onPress: PropTypes.func,\n};\n\nexport { Menu };\n"],"mappings":"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"}

package/build/components/Menu/__tests__/__snapshots__/Menu.test.jsx.snap CHANGED Viewed

@@ -2,70 +2,75 @@
 exports[`component:<Menu> inherit:className 1`] = `
 <DocumentFragment>
-  <span />
+  <ui_layer />
 </DocumentFragment>
 `;
 exports[`component:<Menu> prop:Template 1`] = `
 <DocumentFragment>
-  <span>
+  <ui_layer>
     <button
       class="pressable button"
+      tabindex="0"
     >
       Action
     </button>
-  </span>
+  </ui_layer>
 </DocumentFragment>
 `;
 exports[`component:<Menu> prop:children 1`] = `
 <DocumentFragment>
-  <span>
+  <ui_layer>
     <button
       class="pressable button"
+      tabindex="0"
     >
       Action
     </button>
-  </span>
+  </ui_layer>
 </DocumentFragment>
 `;
 exports[`component:<Menu> prop:options & visible 1`] = `
 <DocumentFragment>
-  <span>
+  <ui_layer>
     <button
       class="pressable button"
+      tabindex="0"
     >
       Action
     </button>
-  </span>
-  <div
+  </ui_layer>
+  <ui_layer_content
     class="layer"
     style="left: 0px; top: 0px;"
   >
     <div
       class="menu visible"
     >
-      <div
+      <ui_pressable
         class="pressable option divider"
+        tabindex="0"
       >
-        <div
+        <ui_view
           class="view row wide content"
         >
-          <span
+          <ui_text
             class="text paragraph label"
           >
             Lorem Ipsum...
-          </span>
-        </div>
-      </div>
-      <div
+          </ui_text>
+        </ui_view>
+      </ui_pressable>
+      <ui_pressable
         class="pressable option value"
+        tabindex="0"
       >
-        <div
+        <ui_view
           class="view row wide content"
         >
-          <span
+          <ui_icon
             class="icon headline-3 icon"
           >
             <svg
@@ -85,22 +90,23 @@ exports[`component:<Menu> prop:options & visible 1`] = `
                 d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"
               />
             </svg>
-          </span>
-          <span
+          </ui_icon>
+          <ui_text
             class="text paragraph label"
           >
             Item 1
-          </span>
-        </div>
-      </div>
-      <div
+          </ui_text>
+        </ui_view>
+      </ui_pressable>
+      <ui_pressable
         class="pressable option value disabled"
         data-testid="two"
+        tabindex="0"
       >
-        <div
+        <ui_view
           class="view row wide content"
         >
-          <span
+          <ui_icon
             class="icon headline-3 icon"
           >
             <svg
@@ -120,104 +126,111 @@ exports[`component:<Menu> prop:options & visible 1`] = `
                 d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"
               />
             </svg>
-          </span>
-          <span
+          </ui_icon>
+          <ui_text
             class="text paragraph label"
           >
             Item 2
-          </span>
-        </div>
-      </div>
-      <div
+          </ui_text>
+        </ui_view>
+      </ui_pressable>
+      <ui_pressable
         class="pressable option value divider"
+        tabindex="0"
       >
-        <div
+        <ui_view
           class="view row wide content"
         >
-          <span
+          <ui_text
             class="text paragraph label"
           >
             Item 3
-          </span>
-        </div>
-      </div>
-      <div
+          </ui_text>
+        </ui_view>
+      </ui_pressable>
+      <ui_pressable
         class="pressable option value"
+        tabindex="0"
       >
-        <div
+        <ui_view
           class="view row wide content"
         >
-          <span
+          <ui_text
             class="text paragraph label"
           >
             Item 4
-          </span>
+          </ui_text>
           <button
             class="pressable button small"
+            tabindex="0"
           >
             Add
           </button>
-        </div>
-      </div>
-      <div
+        </ui_view>
+      </ui_pressable>
+      <ui_pressable
         class="pressable option"
+        tabindex="0"
       >
-        <div
+        <ui_view
           class="view row wide content"
         >
           <button
             class="pressable button"
+            tabindex="0"
           >
             Add
           </button>
-        </div>
-      </div>
+        </ui_view>
+      </ui_pressable>
     </div>
-  </div>
+  </ui_layer_content>
 </DocumentFragment>
 `;
 exports[`component:<Menu> prop:options 1`] = `
 <DocumentFragment>
-  <span>
+  <ui_layer>
     <button
       class="pressable button"
+      tabindex="0"
     >
       Action
     </button>
-  </span>
+  </ui_layer>
 </DocumentFragment>
 `;
 exports[`component:<Menu> prop:title 1`] = `
 <DocumentFragment>
-  <span>
+  <ui_layer>
     <button
       class="pressable button"
+      tabindex="0"
     >
       Action
     </button>
-  </span>
-  <div
+  </ui_layer>
+  <ui_layer_content
     class="layer"
     style="left: 0px; top: 0px;"
   >
     <div
       class="menu visible"
     />
-  </div>
+  </ui_layer_content>
 </DocumentFragment>
 `;
 exports[`component:<Menu> renders 1`] = `
 <DocumentFragment>
-  <span />
+  <ui_layer />
 </DocumentFragment>
 `;
 exports[`component:<Menu> testId 1`] = `
 <DocumentFragment>
-  <span
+  <ui_layer
     data-testid="mirai"
   />
 </DocumentFragment>

package/build/components/Modal/Modal.js CHANGED Viewed

@@ -12,7 +12,7 @@ var _components = require("../../components");
 var _helpers = require("../../helpers");
 var _hooks = require("../../hooks");
 var _primitives = require("../../primitives");
-var _ModalModule = _interopRequireDefault(require("./Modal.module.css"));
+var style = _interopRequireWildcard(require("./Modal.module.css"));
 var _excluded = ["blur", "children", "fit", "overflow", "portal", "preventDefault", "title", "visible", "onBack", "onClose", "onOverflow"];
 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; }
@@ -66,6 +66,7 @@ var Modal = function Modal(_ref) {
     return function () {
       return document.removeEventListener('keydown', handleKeydown);
     };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [visible]);
   (0, _react.useEffect)(function () {
     if (visible && !dataset) {
@@ -92,7 +93,7 @@ var Modal = function Modal(_ref) {
     preventDefault: preventDefault,
     role: others.role ? "".concat(others.role, "-overflow") : 'modal-overflow',
     onPress: visible && overflow ? handleOverflow : undefined,
-    className: (0, _helpers.styles)(_ModalModule.default.container, overflow && _ModalModule.default.overflow, overflow && blur && _ModalModule.default.blur, visible && _ModalModule.default.visible, onOverflow && _ModalModule.default.onOverflow),
+    className: (0, _helpers.styles)(style.container, overflow && style.overflow, overflow && blur && style.blur, visible && style.visible, onOverflow && style.onOverflow),
     style: {
       height: height
     },
@@ -101,10 +102,10 @@ var Modal = function Modal(_ref) {
     fit: true,
     ref: ref,
     role: others.role || 'modal',
-    className: (0, _helpers.styles)(_ModalModule.default.modal, !fit && _ModalModule.default.calcWidth, visible && _ModalModule.default.visible, others.className)
+    className: (0, _helpers.styles)(style.modal, !fit && style.calcWidth, visible && style.visible, others.className)
   }), (title || onBack || onClose) && /*#__PURE__*/_react.default.createElement(_primitives.View, {
     forceRow: true,
-    className: _ModalModule.default.header
+    className: style.header
   }, onBack && /*#__PURE__*/_react.default.createElement(_components.Button, {
     transparent: true,
     small: true,
@@ -113,20 +114,20 @@ var Modal = function Modal(_ref) {
     testId: testId ? "".concat(testId, "-button-back") : undefined
   }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     value: _primitives.ICON.LEFT,
-    className: _ModalModule.default.icon
+    className: style.icon
   })), title && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
     headline: true,
-    className: (0, _helpers.styles)(_ModalModule.default.title, !onBack && _ModalModule.default.left, !onClose && _ModalModule.default.right)
+    className: (0, _helpers.styles)(style.title, !onBack && style.left, !onClose && style.right)
   }, title), onClose && /*#__PURE__*/_react.default.createElement(_components.Button, {
     transparent: true,
     small: true,
     squared: true,
     onPress: onClose,
     testId: testId ? "".concat(testId, "-button-close") : undefined,
-    className: _ModalModule.default.button
+    className: style.button
   }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     value: isDesktop || title !== undefined ? _primitives.ICON.CLOSE : _primitives.ICON.EXPAND_MORE,
-    className: _ModalModule.default.icon
+    className: style.icon
   }))), _react.default.Children.map(children, function (child, index) {
     return !child || child === null ? null : /*#__PURE__*/_react.default.cloneElement(child, _objectSpread(_objectSpread({
       key: child.key || index

package/build/components/Modal/Modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.js","names":["Modal","blur","children","fit","overflow","portal","preventDefault","title","visible","onBack","onClose","onOverflow","others","useDevice","isDesktop","height","ref","useRef","useState","dataset","setDataset","useEffect","handleKeydown","event","key","document","addEventListener","removeEventListener","body","miraiModal","undefined","handleOverflow","target","current","contains","renderer","IS_JEST","jsx","ReactDOM","createPortal","testId","role","styles","style","container","modal","calcWidth","className","header","ICON","LEFT","icon","left","right","button","CLOSE","EXPAND_MORE","React","Children","map","child","index","cloneElement","props","propTypes","PropTypes","bool","node","string","func"],"sources":["../../../src/components/Modal/Modal.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\n\nimport { Button } from '../../components';\nimport { IS_JEST, styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Icon, ICON, Pressable, Text, View } from '../../primitives';\nimport style from './Modal.module.css';\n\nconst Modal = ({\n blur = false,\n children,\n fit = false,\n overflow = true,\n portal = false,\n preventDefault = true,\n title,\n visible,\n onBack,\n onClose,\n onOverflow,\n ...others\n}) => {\n const { isDesktop, height } = useDevice();\n const ref = useRef();\n\n const [dataset, setDataset] = useState();\n\n useEffect(() => {\n if (!visible \|\| !onClose) return;\n\n const handleKeydown = (event) => event.key === 'Escape' && onClose();\n\n document.addEventListener('keydown', handleKeydown);\n return () => document.removeEventListener('keydown', handleKeydown);\n }, [visible]);\n\n useEffect(() => {\n if (visible && !dataset) {\n setDataset(true);\n document.body.dataset.miraiModal = true;\n }\n\n return () => {\n if (visible && dataset) {\n setDataset(undefined);\n delete document.body.dataset.miraiModal;\n }\n };\n }, [dataset, visible]);\n\n const handleOverflow = (event) => {\n const { target } = event;\n onOverflow && !ref.current?.contains(target) && onOverflow(event);\n };\n\n const renderer = IS_JEST \|\| !portal ? (jsx) => jsx : ReactDOM.createPortal;\n\n const { testId } = others;\n\n return renderer(\n <Pressable\n preventDefault={preventDefault}\n role={others.role ? `${others.role}-overflow` : 'modal-overflow'}\n onPress={visible && overflow ? handleOverflow : undefined}\n className={styles(\n style.container,\n overflow && style.overflow,\n overflow && blur && style.blur,\n visible && style.visible,\n onOverflow && style.onOverflow,\n )}\n style={{ height }}\n testId={testId ? `${testId}-overflow` : undefined}\n >\n <View\n {...others}\n fit\n ref={ref}\n role={others.role \|\| 'modal'}\n className={styles(style.modal, !fit && style.calcWidth, visible && style.visible, others.className)}\n >\n {(title \|\| onBack \|\| onClose) && (\n <View forceRow className={style.header}>\n {onBack && (\n <Button transparent small squared onPress={onBack} testId={testId ? `${testId}-button-back` : undefined}>\n <Icon value={ICON.LEFT} className={style.icon} />\n </Button>\n )}\n {title && (\n <Text headline className={styles(style.title, !onBack && style.left, !onClose && style.right)}>\n {title}\n </Text>\n )}\n {onClose && (\n <Button\n transparent\n small\n squared\n onPress={onClose}\n testId={testId ? `${testId}-button-close` : undefined}\n className={style.button}\n >\n <Icon value={isDesktop \|\| title !== undefined ? ICON.CLOSE : ICON.EXPAND_MORE} className={style.icon} />\n </Button>\n )}\n </View>\n )}\n\n {React.Children.map(children, (child, index) =>\n !child \|\| child === null\n ? null\n : React.cloneElement(child, { key: child.key \|\| index, ...child.props, role: 'modal-content' }),\n )}\n </View>\n </Pressable>,\n document.body,\n );\n};\n\nModal.propTypes = {\n blur: PropTypes.bool,\n children: PropTypes.node,\n fit: PropTypes.bool,\n overflow: PropTypes.bool,\n portal: PropTypes.bool,\n preventDefault: PropTypes.bool,\n title: PropTypes.string,\n visible: PropTypes.bool,\n onBack: PropTypes.func,\n onClose: PropTypes.func,\n onOverflow: PropTypes.func,\n};\n\nexport { Modal };\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;~~AAAuC~~;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;~~AAEvC~~,IAAMA,KAAK,GAAG,SAARA,KAAK,OAaL;EAAA,qBAZJC,IAAI;IAAJA,IAAI,0BAAG,KAAK;IACZC,QAAQ,QAARA,QAAQ;IAAA,gBACRC,GAAG;IAAHA,GAAG,yBAAG,KAAK;IAAA,qBACXC,QAAQ;IAARA,QAAQ,8BAAG,IAAI;IAAA,mBACfC,MAAM;IAANA,MAAM,4BAAG,KAAK;IAAA,2BACdC,cAAc;IAAdA,cAAc,oCAAG,IAAI;IACrBC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,MAAM,QAANA,MAAM;IACNC,OAAO,QAAPA,OAAO;IACPC,UAAU,QAAVA,UAAU;IACPC,MAAM;EAET,iBAA8B,IAAAC,gBAAS,GAAE;IAAjCC,SAAS,cAATA,SAAS;IAAEC,MAAM,cAANA,MAAM;EACzB,IAAMC,GAAG,GAAG,IAAAC,aAAM,GAAE;EAEpB,gBAA8B,IAAAC,eAAQ,GAAE;IAAA;IAAjCC,OAAO;IAAEC,UAAU;EAE1B,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAI,CAACb,OAAO,IAAI,CAACE,OAAO,EAAE;IAE1B,IAAMY,aAAa,GAAG,SAAhBA,aAAa,CAAIC,KAAK;MAAA,OAAKA,KAAK,CAACC,GAAG,KAAK,QAAQ,IAAId,OAAO,EAAE;IAAA;IAEpEe,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEJ,aAAa,CAAC;IACnD,OAAO;MAAA,OAAMG,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEL,aAAa,CAAC;IAAA;~~EACrE~~,CAAC,EAAE,CAACd,OAAO,CAAC,CAAC;EAEb,IAAAa,gBAAS,EAAC,YAAM;IACd,IAAIb,OAAO,IAAI,CAACW,OAAO,EAAE;MACvBC,UAAU,CAAC,IAAI,CAAC;MAChBK,QAAQ,CAACG,IAAI,CAACT,OAAO,CAACU,UAAU,GAAG,IAAI;IACzC;IAEA,OAAO,YAAM;MACX,IAAIrB,OAAO,IAAIW,OAAO,EAAE;QACtBC,UAAU,CAACU,SAAS,CAAC;QACrB,OAAOL,QAAQ,CAACG,IAAI,CAACT,OAAO,CAACU,UAAU;MACzC;IACF,CAAC;EACH,CAAC,EAAE,CAACV,OAAO,EAAEX,OAAO,CAAC,CAAC;EAEtB,IAAMuB,cAAc,GAAG,SAAjBA,cAAc,CAAIR,KAAK,EAAK;IAAA;IAChC,IAAQS,MAAM,GAAKT,KAAK,CAAhBS,MAAM;IACdrB,UAAU,IAAI,kBAACK,GAAG,CAACiB,OAAO,yCAAX,aAAaC,QAAQ,CAACF,MAAM,CAAC,KAAIrB,UAAU,CAACY,KAAK,CAAC;EACnE,CAAC;EAED,IAAMY,QAAQ,GAAGC,gBAAO,IAAI,CAAC/B,MAAM,GAAG,UAACgC,GAAG;IAAA,OAAKA,GAAG;EAAA,IAAGC,iBAAQ,CAACC,YAAY;EAE1E,IAAQC,MAAM,GAAK5B,MAAM,CAAjB4B,MAAM;EAEd,OAAOL,QAAQ,eACb,6BAAC,qBAAS;IACR,cAAc,EAAE7B,cAAe;IAC/B,IAAI,EAAEM,MAAM,CAAC6B,IAAI,aAAM7B,MAAM,CAAC6B,IAAI,iBAAc,gBAAiB;IACjE,OAAO,EAAEjC,OAAO,IAAIJ,QAAQ,GAAG2B,cAAc,GAAGD,SAAU;IAC1D,SAAS,EAAE,IAAAY,eAAM,EACfC,~~oBAAK~~,CAACC,SAAS,EACfxC,QAAQ,IAAIuC,~~oBAAK~~,CAACvC,QAAQ,EAC1BA,QAAQ,IAAIH,IAAI,IAAI0C,~~oBAAK~~,CAAC1C,IAAI,EAC9BO,OAAO,IAAImC,~~oBAAK~~,CAACnC,OAAO,EACxBG,UAAU,IAAIgC,~~oBAAK~~,CAAChC,UAAU,CAC9B;IACF,KAAK,EAAE;MAAEI,MAAM,EAANA;IAAO,CAAE;IAClB,MAAM,EAAEyB,MAAM,aAAMA,MAAM,iBAAcV;EAAU,gBAElD,6BAAC,gBAAI,eACClB,MAAM;IACV,GAAG;IACH,GAAG,EAAEI,GAAI;IACT,IAAI,EAAEJ,MAAM,CAAC6B,IAAI,IAAI,OAAQ;IAC7B,SAAS,EAAE,IAAAC,eAAM,EAACC,~~oBAAK~~,CAACE,KAAK,EAAE,CAAC1C,GAAG,IAAIwC,~~oBAAK~~,CAACG,SAAS,EAAEtC,OAAO,IAAImC,~~oBAAK~~,CAACnC,OAAO,EAAEI,MAAM,CAACmC,SAAS;EAAE,IAEnG,CAACxC,KAAK,IAAIE,MAAM,IAAIC,OAAO,kBAC1B,6BAAC,gBAAI;IAAC,QAAQ;IAAC,SAAS,EAAEiC,~~oBAAK~~,CAACK;EAAO,GACpCvC,MAAM,iBACL,6BAAC,kBAAM;IAAC,WAAW;IAAC,KAAK;IAAC,OAAO;IAAC,OAAO,EAAEA,MAAO;IAAC,MAAM,EAAE+B,MAAM,aAAMA,MAAM,oBAAiBV;EAAU,gBACtG,6BAAC,gBAAI;IAAC,KAAK,EAAEmB,gBAAI,CAACC,IAAK;IAAC,SAAS,EAAEP,~~oBAAK~~,CAACQ;EAAK,EAAG,CAEpD,EACA5C,KAAK,iBACJ,6BAAC,gBAAI;IAAC,QAAQ;IAAC,SAAS,EAAE,IAAAmC,eAAM,EAACC,~~oBAAK~~,CAACpC,KAAK,EAAE,CAACE,MAAM,IAAIkC,~~oBAAK~~,CAACS,IAAI,EAAE,CAAC1C,OAAO,IAAIiC,~~oBAAK~~,CAACU,KAAK;EAAE,GAC3F9C,KAAK,CAET,EACAG,OAAO,iBACN,6BAAC,kBAAM;IACL,WAAW;IACX,KAAK;IACL,OAAO;IACP,OAAO,EAAEA,OAAQ;IACjB,MAAM,EAAE8B,MAAM,aAAMA,MAAM,qBAAkBV,SAAU;IACtD,SAAS,EAAEa,~~oBAAK~~,CAACW;EAAO,gBAExB,6BAAC,gBAAI;IAAC,KAAK,EAAExC,SAAS,IAAIP,KAAK,KAAKuB,SAAS,GAAGmB,gBAAI,CAACM,KAAK,GAAGN,gBAAI,CAACO,WAAY;IAAC,SAAS,EAAEb,~~oBAAK~~,CAACQ;EAAK,EAAG,CAE3G,CAEJ,EAEAM,cAAK,CAACC,QAAQ,CAACC,GAAG,CAACzD,QAAQ,EAAE,UAAC0D,KAAK,EAAEC,KAAK;IAAA,OACzC,CAACD,KAAK,IAAIA,KAAK,KAAK,IAAI,GACpB,IAAI,gBACJH,cAAK,CAACK,YAAY,CAACF,KAAK;MAAIpC,GAAG,EAAEoC,KAAK,CAACpC,GAAG,IAAIqC;IAAK,GAAKD,KAAK,CAACG,KAAK;MAAEtB,IAAI,EAAE;IAAe,GAAG;EAAA,EAClG,CACI,CACG,EACZhB,QAAQ,CAACG,IAAI,CACd;AACH,CAAC;AAAC;AAEF5B,KAAK,CAACgE,SAAS,GAAG;EAChB/D,IAAI,EAAEgE,kBAAS,CAACC,IAAI;EACpBhE,QAAQ,EAAE+D,kBAAS,CAACE,IAAI;EACxBhE,GAAG,EAAE8D,kBAAS,CAACC,IAAI;EACnB9D,QAAQ,EAAE6D,kBAAS,CAACC,IAAI;EACxB7D,MAAM,EAAE4D,kBAAS,CAACC,IAAI;EACtB5D,cAAc,EAAE2D,kBAAS,CAACC,IAAI;EAC9B3D,KAAK,EAAE0D,kBAAS,CAACG,MAAM;EACvB5D,OAAO,EAAEyD,kBAAS,CAACC,IAAI;EACvBzD,MAAM,EAAEwD,kBAAS,CAACI,IAAI;EACtB3D,OAAO,EAAEuD,kBAAS,CAACI,IAAI;EACvB1D,UAAU,EAAEsD,kBAAS,CAACI;AACxB,CAAC"}
1	+ {"version":3,"file":"Modal.js","names":["Modal","blur","children","fit","overflow","portal","preventDefault","title","visible","onBack","onClose","onOverflow","others","useDevice","isDesktop","height","ref","useRef","useState","dataset","setDataset","useEffect","handleKeydown","event","key","document","addEventListener","removeEventListener","body","miraiModal","undefined","handleOverflow","target","current","contains","renderer","IS_JEST","jsx","ReactDOM","createPortal","testId","role","styles","style","container","modal","calcWidth","className","header","ICON","LEFT","icon","left","right","button","CLOSE","EXPAND_MORE","React","Children","map","child","index","cloneElement","props","propTypes","PropTypes","bool","node","string","func"],"sources":["../../../src/components/Modal/Modal.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\n\nimport { Button } from '../../components';\nimport { IS_JEST, styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Icon, ICON, Pressable, Text, View } from '../../primitives';\nimport * as style from './Modal.module.css';\n\nconst Modal = ({\n blur = false,\n children,\n fit = false,\n overflow = true,\n portal = false,\n preventDefault = true,\n title,\n visible,\n onBack,\n onClose,\n onOverflow,\n ...others\n}) => {\n const { isDesktop, height } = useDevice();\n const ref = useRef();\n\n const [dataset, setDataset] = useState();\n\n useEffect(() => {\n if (!visible \|\| !onClose) return;\n\n const handleKeydown = (event) => event.key === 'Escape' && onClose();\n\n document.addEventListener('keydown', handleKeydown);\n return () => document.removeEventListener('keydown', handleKeydown);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [visible]);\n\n useEffect(() => {\n if (visible && !dataset) {\n setDataset(true);\n document.body.dataset.miraiModal = true;\n }\n\n return () => {\n if (visible && dataset) {\n setDataset(undefined);\n delete document.body.dataset.miraiModal;\n }\n };\n }, [dataset, visible]);\n\n const handleOverflow = (event) => {\n const { target } = event;\n onOverflow && !ref.current?.contains(target) && onOverflow(event);\n };\n\n const renderer = IS_JEST \|\| !portal ? (jsx) => jsx : ReactDOM.createPortal;\n\n const { testId } = others;\n\n return renderer(\n <Pressable\n preventDefault={preventDefault}\n role={others.role ? `${others.role}-overflow` : 'modal-overflow'}\n onPress={visible && overflow ? handleOverflow : undefined}\n className={styles(\n style.container,\n overflow && style.overflow,\n overflow && blur && style.blur,\n visible && style.visible,\n onOverflow && style.onOverflow,\n )}\n style={{ height }}\n testId={testId ? `${testId}-overflow` : undefined}\n >\n <View\n {...others}\n fit\n ref={ref}\n role={others.role \|\| 'modal'}\n className={styles(style.modal, !fit && style.calcWidth, visible && style.visible, others.className)}\n >\n {(title \|\| onBack \|\| onClose) && (\n <View forceRow className={style.header}>\n {onBack && (\n <Button transparent small squared onPress={onBack} testId={testId ? `${testId}-button-back` : undefined}>\n <Icon value={ICON.LEFT} className={style.icon} />\n </Button>\n )}\n {title && (\n <Text headline className={styles(style.title, !onBack && style.left, !onClose && style.right)}>\n {title}\n </Text>\n )}\n {onClose && (\n <Button\n transparent\n small\n squared\n onPress={onClose}\n testId={testId ? `${testId}-button-close` : undefined}\n className={style.button}\n >\n <Icon value={isDesktop \|\| title !== undefined ? ICON.CLOSE : ICON.EXPAND_MORE} className={style.icon} />\n </Button>\n )}\n </View>\n )}\n\n {React.Children.map(children, (child, index) =>\n !child \|\| child === null\n ? null\n : React.cloneElement(child, { key: child.key \|\| index, ...child.props, role: 'modal-content' }),\n )}\n </View>\n </Pressable>,\n document.body,\n );\n};\n\nModal.propTypes = {\n blur: PropTypes.bool,\n children: PropTypes.node,\n fit: PropTypes.bool,\n overflow: PropTypes.bool,\n portal: PropTypes.bool,\n preventDefault: PropTypes.bool,\n title: PropTypes.string,\n visible: PropTypes.bool,\n onBack: PropTypes.func,\n onClose: PropTypes.func,\n onOverflow: PropTypes.func,\n};\n\nexport { Modal };\n"],"mappings":"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"}