@mirai/ui 1.0.43 → 1.0.45

package/build/components/Form/Form.js

@@ -176,8 +176,8 @@ var Form = function Form(_ref) {
   return (0, _react.useMemo)(function () {
     return /*#__PURE__*/_react.default.createElement("form", {
       "data-testid": others['data-testid'],
-      style: others.style,
-      onSubmit: handleSubmit
+      onSubmit: handleSubmit,
+      className: others.className
     }, _react.default.Children.map(children, function (child, index) {
       if (!child || child === null) return;
 

package/build/components/Form/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","names":["Form","children","debounce","DEFAULT_TIMEOUT_ONCHANGE","schema","showErrors","validateOnMount","onBlur","onChange","onError","onFocus","onSubmit","others","error","setError","initialValue","setInitialValue","touched","setTouched","values","setValues","nextValues","nextChildrenKeys","Object","keys","sort","length","JSON","stringify","nextError","collision","some","key","timer","setTimeout","value","clearTimeout","handleChange","field","fieldValue","handleError","DEFAULT_TIMEOUT_ONERROR","hasError","changed","errors","handleFocus","event","handleSubmit","preventDefault","style","React","Children","map","child","index","props","type","cloneElement","undefined","onPress","displayName","propTypes","PropTypes","node","number","shape","bool","func"],"sources":["../../../src/components/Form/Form.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { DEFAULT_TIMEOUT_ONCHANGE, DEFAULT_TIMEOUT_ONERROR } from './Form.constants';\nimport { getChildrenErrors, getChildrenValues, getField, groupState } from './helpers';\n\nconst Form = ({\n  children,\n  debounce = DEFAULT_TIMEOUT_ONCHANGE,\n  schema = {},\n  showErrors,\n  validateOnMount = false,\n  onBlur,\n  onChange,\n  onError,\n  onFocus,\n  onSubmit,\n  ...others\n}) => {\n  const [error, setError] = useState({});\n  const [initialValue, setInitialValue] = useState({});\n  const [touched, setTouched] = useState({});\n  const [values, setValues] = useState({});\n\n  useEffect(() => {\n    const nextValues = getChildrenValues(children);\n    const nextChildrenKeys = Object.keys(nextValues).sort();\n\n    if (!Object.keys(nextValues).length) return;\n\n    if (JSON.stringify(nextChildrenKeys) !== JSON.stringify(Object.keys(initialValue).sort())) {\n      setInitialValue(nextValues);\n      setValues(nextValues);\n\n      if (validateOnMount) {\n        const nextError = getChildrenErrors({ children, schema, values: nextValues });\n        setError(nextError);\n        onError && onError(nextError);\n      } else {\n        setError({});\n      }\n      setTouched({});\n    } else {\n      const collision = nextChildrenKeys.some((key) => JSON.stringify(values[key]) !== JSON.stringify(nextValues[key]));\n      if (collision) setValues(nextValues);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [children]);\n\n  useEffect(() => {\n    if (!onChange || values === initialValue || !Object.keys(values).length) return;\n\n    const timer = setTimeout(() => onChange(values, groupState({ initialValue, value: values, touched })), debounce);\n    return () => clearTimeout(timer);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [values]);\n\n  const handleChange = (field, fieldValue) => {\n    const nextValues = { ...values, [field]: fieldValue };\n\n    setValues(nextValues);\n    setTimeout(() => handleError(nextValues), DEFAULT_TIMEOUT_ONERROR);\n  };\n\n  const handleError = (values) => {\n    const nextError = getChildrenErrors({ children, schema, values });\n    const hasError = Object.keys(nextError).length > 0;\n    const changed = JSON.stringify(error) !== JSON.stringify(nextError);\n\n    if (changed) {\n      setError(nextError);\n      onError && onError(nextError, hasError);\n    }\n\n    return { changed, errors: nextError, hasError };\n  };\n\n  const handleFocus = (field, event) => {\n    setTouched({ ...touched, [field]: true });\n    if (onFocus) onFocus(field, event);\n  };\n\n  const handleSubmit = (event) => {\n    const { errors, hasError } = handleError(values);\n\n    if (hasError && onError) onError(errors, hasError);\n    else if (onSubmit) onSubmit(values, groupState({ initialValue, value: values, touched }), event);\n    event.preventDefault();\n  };\n\n  return useMemo(\n    () => (\n      <form data-testid={others['data-testid']} style={others.style} onSubmit={handleSubmit}>\n        {React.Children.map(children, (child, index) => {\n          if (!child || child === null) return;\n\n          const { props = {} } = child || {};\n          const { type } = props;\n          const field = getField(props);\n\n          return React.cloneElement(child, {\n            key: index,\n            ...(field\n              ? {\n                  ...props,\n                  ...schema[field],\n                  error: props.error ? props.error : showErrors && error[field],\n                  onBlur: onBlur ? (event) => onBlur(field, event) : undefined,\n                  onChange: (value) => handleChange(field, value),\n                  onFocus: (event) => handleFocus(field, event),\n                }\n              : type === 'submit'\n              ? { ...props, onPress: handleSubmit }\n              : undefined),\n          });\n        })}\n      </form>\n    ),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [children, error, others, schema],\n  );\n};\n\nForm.displayName = 'Component:Form';\n\nForm.propTypes = {\n  children: PropTypes.node,\n  debounce: PropTypes.number,\n  schema: PropTypes.shape({}),\n  showErrors: PropTypes.bool,\n  validateOnMount: PropTypes.bool,\n  onBlur: PropTypes.func,\n  onChange: PropTypes.func,\n  onError: PropTypes.func,\n  onFocus: PropTypes.func,\n  onSubmit: PropTypes.func,\n};\n\nexport { Form };\n"],"mappings":"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"}
+{"version":3,"file":"Form.js","names":["Form","children","debounce","DEFAULT_TIMEOUT_ONCHANGE","schema","showErrors","validateOnMount","onBlur","onChange","onError","onFocus","onSubmit","others","error","setError","initialValue","setInitialValue","touched","setTouched","values","setValues","nextValues","nextChildrenKeys","Object","keys","sort","length","JSON","stringify","nextError","collision","some","key","timer","setTimeout","value","clearTimeout","handleChange","field","fieldValue","handleError","DEFAULT_TIMEOUT_ONERROR","hasError","changed","errors","handleFocus","event","handleSubmit","preventDefault","className","React","Children","map","child","index","props","type","cloneElement","undefined","onPress","displayName","propTypes","PropTypes","node","number","shape","bool","func"],"sources":["../../../src/components/Form/Form.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { DEFAULT_TIMEOUT_ONCHANGE, DEFAULT_TIMEOUT_ONERROR } from './Form.constants';\nimport { getChildrenErrors, getChildrenValues, getField, groupState } from './helpers';\n\nconst Form = ({\n  children,\n  debounce = DEFAULT_TIMEOUT_ONCHANGE,\n  schema = {},\n  showErrors,\n  validateOnMount = false,\n  onBlur,\n  onChange,\n  onError,\n  onFocus,\n  onSubmit,\n  ...others\n}) => {\n  const [error, setError] = useState({});\n  const [initialValue, setInitialValue] = useState({});\n  const [touched, setTouched] = useState({});\n  const [values, setValues] = useState({});\n\n  useEffect(() => {\n    const nextValues = getChildrenValues(children);\n    const nextChildrenKeys = Object.keys(nextValues).sort();\n\n    if (!Object.keys(nextValues).length) return;\n\n    if (JSON.stringify(nextChildrenKeys) !== JSON.stringify(Object.keys(initialValue).sort())) {\n      setInitialValue(nextValues);\n      setValues(nextValues);\n\n      if (validateOnMount) {\n        const nextError = getChildrenErrors({ children, schema, values: nextValues });\n        setError(nextError);\n        onError && onError(nextError);\n      } else {\n        setError({});\n      }\n      setTouched({});\n    } else {\n      const collision = nextChildrenKeys.some((key) => JSON.stringify(values[key]) !== JSON.stringify(nextValues[key]));\n      if (collision) setValues(nextValues);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [children]);\n\n  useEffect(() => {\n    if (!onChange || values === initialValue || !Object.keys(values).length) return;\n\n    const timer = setTimeout(() => onChange(values, groupState({ initialValue, value: values, touched })), debounce);\n    return () => clearTimeout(timer);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [values]);\n\n  const handleChange = (field, fieldValue) => {\n    const nextValues = { ...values, [field]: fieldValue };\n\n    setValues(nextValues);\n    setTimeout(() => handleError(nextValues), DEFAULT_TIMEOUT_ONERROR);\n  };\n\n  const handleError = (values) => {\n    const nextError = getChildrenErrors({ children, schema, values });\n    const hasError = Object.keys(nextError).length > 0;\n    const changed = JSON.stringify(error) !== JSON.stringify(nextError);\n\n    if (changed) {\n      setError(nextError);\n      onError && onError(nextError, hasError);\n    }\n\n    return { changed, errors: nextError, hasError };\n  };\n\n  const handleFocus = (field, event) => {\n    setTouched({ ...touched, [field]: true });\n    if (onFocus) onFocus(field, event);\n  };\n\n  const handleSubmit = (event) => {\n    const { errors, hasError } = handleError(values);\n\n    if (hasError && onError) onError(errors, hasError);\n    else if (onSubmit) onSubmit(values, groupState({ initialValue, value: values, touched }), event);\n    event.preventDefault();\n  };\n\n  return useMemo(\n    () => (\n      <form data-testid={others['data-testid']} onSubmit={handleSubmit} className={others.className}>\n        {React.Children.map(children, (child, index) => {\n          if (!child || child === null) return;\n\n          const { props = {} } = child || {};\n          const { type } = props;\n          const field = getField(props);\n\n          return React.cloneElement(child, {\n            key: index,\n            ...(field\n              ? {\n                  ...props,\n                  ...schema[field],\n                  error: props.error ? props.error : showErrors && error[field],\n                  onBlur: onBlur ? (event) => onBlur(field, event) : undefined,\n                  onChange: (value) => handleChange(field, value),\n                  onFocus: (event) => handleFocus(field, event),\n                }\n              : type === 'submit'\n              ? { ...props, onPress: handleSubmit }\n              : undefined),\n          });\n        })}\n      </form>\n    ),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [children, error, others, schema],\n  );\n};\n\nForm.displayName = 'Component:Form';\n\nForm.propTypes = {\n  children: PropTypes.node,\n  debounce: PropTypes.number,\n  schema: PropTypes.shape({}),\n  showErrors: PropTypes.bool,\n  validateOnMount: PropTypes.bool,\n  onBlur: PropTypes.func,\n  onChange: PropTypes.func,\n  onError: PropTypes.func,\n  onFocus: PropTypes.func,\n  onSubmit: PropTypes.func,\n};\n\nexport { Form };\n"],"mappings":"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"}

package/build/components/Form/__tests__/__snapshots__/Form.test.jsx.snap

@@ -2,7 +2,9 @@
 
 exports[`component:<Form> inherit:className 1`] = `
 <DocumentFragment>
-  <form />
+  <form
+    class="mirai"
+  />
 </DocumentFragment>
 `;
 

package/build/components/Form/helpers/getChildrenErrors.js

@@ -29,10 +29,9 @@ var getChildrenErrors = function getChildrenErrors() {
 
   var errors = {};
 
-  _react.default.Children.forEach(children, function () {
-    var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-        _ref2$props = _ref2.props,
-        props = _ref2$props === void 0 ? {} : _ref2$props;
+  _react.default.Children.forEach(children, function (child) {
+    var _ref2 = child || {},
+        props = _ref2.props;
 
     var field = (0, _getField.getField)(props);
 

package/build/components/Form/helpers/getChildrenErrors.js.map

@@ -1 +1 @@
-{"version":3,"file":"getChildrenErrors.js","names":["getChildrenErrors","children","schema","values","errors","React","Children","forEach","props","field","inputErrors","value"],"sources":["../../../../src/components/Form/helpers/getChildrenErrors.js"],"sourcesContent":["import React from 'react';\n\nimport { getInputErrors } from '../../../helpers';\nimport { getField } from './getField';\n\nexport const getChildrenErrors = ({ children, schema = {}, values = {} } = {}) => {\n  const errors = {};\n\n  React.Children.forEach(children, ({ props = {} } = {}) => {\n    const field = getField(props);\n\n    if (field) {\n      const inputErrors = getInputErrors({ ...props, ...schema[field], value: values[field] });\n      if (inputErrors) errors[field] = inputErrors;\n    }\n  });\n\n  return errors;\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;;;;;;;;;AAEO,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,GAAiD;EAAA,+EAAP,EAAO;EAAA,IAA9CC,QAA8C,QAA9CA,QAA8C;EAAA,uBAApCC,MAAoC;EAAA,IAApCA,MAAoC,4BAA3B,EAA2B;EAAA,uBAAvBC,MAAuB;EAAA,IAAvBA,MAAuB,4BAAd,EAAc;;EAChF,IAAMC,MAAM,GAAG,EAAf;;EAEAC,eAAMC,QAAN,CAAeC,OAAf,CAAuBN,QAAvB,EAAiC,YAAyB;IAAA,gFAAP,EAAO;IAAA,wBAAtBO,KAAsB;IAAA,IAAtBA,KAAsB,4BAAd,EAAc;;IACxD,IAAMC,KAAK,GAAG,wBAASD,KAAT,CAAd;;IAEA,IAAIC,KAAJ,EAAW;MACT,IAAMC,WAAW,GAAG,2EAAoBF,KAApB,GAA8BN,MAAM,CAACO,KAAD,CAApC;QAA6CE,KAAK,EAAER,MAAM,CAACM,KAAD;MAA1D,GAApB;MACA,IAAIC,WAAJ,EAAiBN,MAAM,CAACK,KAAD,CAAN,GAAgBC,WAAhB;IAClB;EACF,CAPD;;EASA,OAAON,MAAP;AACD,CAbM"}
+{"version":3,"file":"getChildrenErrors.js","names":["getChildrenErrors","children","schema","values","errors","React","Children","forEach","child","props","field","inputErrors","value"],"sources":["../../../../src/components/Form/helpers/getChildrenErrors.js"],"sourcesContent":["import React from 'react';\n\nimport { getInputErrors } from '../../../helpers';\nimport { getField } from './getField';\n\nexport const getChildrenErrors = ({ children, schema = {}, values = {} } = {}) => {\n  const errors = {};\n\n  React.Children.forEach(children, (child) => {\n    const { props } = child || {};\n    const field = getField(props);\n\n    if (field) {\n      const inputErrors = getInputErrors({ ...props, ...schema[field], value: values[field] });\n      if (inputErrors) errors[field] = inputErrors;\n    }\n  });\n\n  return errors;\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;;;;;;;;;AAEO,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,GAAiD;EAAA,+EAAP,EAAO;EAAA,IAA9CC,QAA8C,QAA9CA,QAA8C;EAAA,uBAApCC,MAAoC;EAAA,IAApCA,MAAoC,4BAA3B,EAA2B;EAAA,uBAAvBC,MAAuB;EAAA,IAAvBA,MAAuB,4BAAd,EAAc;;EAChF,IAAMC,MAAM,GAAG,EAAf;;EAEAC,eAAMC,QAAN,CAAeC,OAAf,CAAuBN,QAAvB,EAAiC,UAACO,KAAD,EAAW;IAC1C,YAAkBA,KAAK,IAAI,EAA3B;IAAA,IAAQC,KAAR,SAAQA,KAAR;;IACA,IAAMC,KAAK,GAAG,wBAASD,KAAT,CAAd;;IAEA,IAAIC,KAAJ,EAAW;MACT,IAAMC,WAAW,GAAG,2EAAoBF,KAApB,GAA8BP,MAAM,CAACQ,KAAD,CAApC;QAA6CE,KAAK,EAAET,MAAM,CAACO,KAAD;MAA1D,GAApB;MACA,IAAIC,WAAJ,EAAiBP,MAAM,CAACM,KAAD,CAAN,GAAgBC,WAAhB;IAClB;EACF,CARD;;EAUA,OAAOP,MAAP;AACD,CAdM"}

package/build/components/Form/helpers/getChildrenValues.js

@@ -22,23 +22,19 @@ var BOOLEAN_TYPES = ['checkbox', 'radio'];
 var getChildrenValues = function getChildrenValues(children) {
   var values = {};
 
-  _react.default.Children.forEach(children, function () {
-    var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-        _ref$props = _ref.props;
-
-    _ref$props = _ref$props === void 0 ? {} : _ref$props;
-
-    var _ref$props$checked = _ref$props.checked,
-        checked = _ref$props$checked === void 0 ? false : _ref$props$checked,
-        _ref$props$defaultChe = _ref$props.defaultChecked,
-        defaultChecked = _ref$props$defaultChe === void 0 ? false : _ref$props$defaultChe,
-        _ref$props$defaultVal = _ref$props.defaultValue,
-        defaultValue = _ref$props$defaultVal === void 0 ? undefined : _ref$props$defaultVal,
-        _ref$props$type = _ref$props.type,
-        type = _ref$props$type === void 0 ? undefined : _ref$props$type,
-        _ref$props$value = _ref$props.value,
-        value = _ref$props$value === void 0 ? undefined : _ref$props$value,
-        props = _objectWithoutProperties(_ref$props, _excluded);
+  _react.default.Children.forEach(children, function (child) {
+    var _ref = (child === null || child === void 0 ? void 0 : child.props) || {},
+        _ref$checked = _ref.checked,
+        checked = _ref$checked === void 0 ? false : _ref$checked,
+        _ref$defaultChecked = _ref.defaultChecked,
+        defaultChecked = _ref$defaultChecked === void 0 ? false : _ref$defaultChecked,
+        _ref$defaultValue = _ref.defaultValue,
+        defaultValue = _ref$defaultValue === void 0 ? undefined : _ref$defaultValue,
+        _ref$type = _ref.type,
+        type = _ref$type === void 0 ? undefined : _ref$type,
+        _ref$value = _ref.value,
+        value = _ref$value === void 0 ? undefined : _ref$value,
+        props = _objectWithoutProperties(_ref, _excluded);
 
     var field = (0, _getField.getField)(props);
     if (field) values[field] = BOOLEAN_TYPES.includes(type) ? checked || defaultChecked : value || defaultValue;

package/build/components/Form/helpers/getChildrenValues.js.map

@@ -1 +1 @@
-{"version":3,"file":"getChildrenValues.js","names":["BOOLEAN_TYPES","getChildrenValues","children","values","React","Children","forEach","props","checked","defaultChecked","defaultValue","undefined","type","value","field","includes"],"sources":["../../../../src/components/Form/helpers/getChildrenValues.js"],"sourcesContent":["import React from 'react';\n\nimport { getField } from './getField';\n\nconst BOOLEAN_TYPES = ['checkbox', 'radio'];\n\nexport const getChildrenValues = (children) => {\n  const values = {};\n\n  React.Children.forEach(\n    children,\n    ({\n      props: {\n        checked = false,\n        defaultChecked = false,\n        defaultValue = undefined,\n        type = undefined,\n        value = undefined,\n        ...props\n      } = {},\n    } = {}) => {\n      const field = getField(props);\n      if (field) values[field] = BOOLEAN_TYPES.includes(type) ? checked || defaultChecked : value || defaultValue;\n    },\n  );\n\n  return values;\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;;;;;;;;;AAEA,IAAMA,aAAa,GAAG,CAAC,UAAD,EAAa,OAAb,CAAtB;;AAEO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,QAAD,EAAc;EAC7C,IAAMC,MAAM,GAAG,EAAf;;EAEAC,eAAMC,QAAN,CAAeC,OAAf,CACEJ,QADF,EAEE,YASW;IAAA,+EAAP,EAAO;IAAA,sBARTK,KAQS;;IAAA,qCADL,EACK;;IAAA,oCAPPC,OAOO;IAAA,IAPPA,OAOO,mCAPG,KAOH;IAAA,uCANPC,cAMO;IAAA,IANPA,cAMO,sCANU,KAMV;IAAA,uCALPC,YAKO;IAAA,IALPA,YAKO,sCALQC,SAKR;IAAA,iCAJPC,IAIO;IAAA,IAJPA,IAIO,gCAJAD,SAIA;IAAA,kCAHPE,KAGO;IAAA,IAHPA,KAGO,iCAHCF,SAGD;IAAA,IAFJJ,KAEI;;IACT,IAAMO,KAAK,GAAG,wBAASP,KAAT,CAAd;IACA,IAAIO,KAAJ,EAAWX,MAAM,CAACW,KAAD,CAAN,GAAgBd,aAAa,CAACe,QAAd,CAAuBH,IAAvB,IAA+BJ,OAAO,IAAIC,cAA1C,GAA2DI,KAAK,IAAIH,YAApF;EACZ,CAdH;;EAiBA,OAAOP,MAAP;AACD,CArBM"}
+{"version":3,"file":"getChildrenValues.js","names":["BOOLEAN_TYPES","getChildrenValues","children","values","React","Children","forEach","child","props","checked","defaultChecked","defaultValue","undefined","type","value","field","includes"],"sources":["../../../../src/components/Form/helpers/getChildrenValues.js"],"sourcesContent":["import React from 'react';\n\nimport { getField } from './getField';\n\nconst BOOLEAN_TYPES = ['checkbox', 'radio'];\n\nexport const getChildrenValues = (children) => {\n  const values = {};\n\n  React.Children.forEach(children, (child) => {\n    const {\n      checked = false,\n      defaultChecked = false,\n      defaultValue = undefined,\n      type = undefined,\n      value = undefined,\n      ...props\n    } = child?.props || {};\n\n    const field = getField(props);\n    if (field) values[field] = BOOLEAN_TYPES.includes(type) ? checked || defaultChecked : value || defaultValue;\n  });\n\n  return values;\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;;;;;;;;;AAEA,IAAMA,aAAa,GAAG,CAAC,UAAD,EAAa,OAAb,CAAtB;;AAEO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,QAAD,EAAc;EAC7C,IAAMC,MAAM,GAAG,EAAf;;EAEAC,eAAMC,QAAN,CAAeC,OAAf,CAAuBJ,QAAvB,EAAiC,UAACK,KAAD,EAAW;IAC1C,WAOI,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEC,KAAP,KAAgB,EAPpB;IAAA,wBACEC,OADF;IAAA,IACEA,OADF,6BACY,KADZ;IAAA,+BAEEC,cAFF;IAAA,IAEEA,cAFF,oCAEmB,KAFnB;IAAA,6BAGEC,YAHF;IAAA,IAGEA,YAHF,kCAGiBC,SAHjB;IAAA,qBAIEC,IAJF;IAAA,IAIEA,IAJF,0BAISD,SAJT;IAAA,sBAKEE,KALF;IAAA,IAKEA,KALF,2BAKUF,SALV;IAAA,IAMKJ,KANL;;IASA,IAAMO,KAAK,GAAG,wBAASP,KAAT,CAAd;IACA,IAAIO,KAAJ,EAAWZ,MAAM,CAACY,KAAD,CAAN,GAAgBf,aAAa,CAACgB,QAAd,CAAuBH,IAAvB,IAA+BJ,OAAO,IAAIC,cAA1C,GAA2DI,KAAK,IAAIH,YAApF;EACZ,CAZD;;EAcA,OAAOR,MAAP;AACD,CAlBM"}

package/build/components/Notification/Notification.js

@@ -15,7 +15,7 @@ var _primitives = require("../../primitives");
 
 var _NotificationModule = _interopRequireDefault(require("./Notification.module.css"));
 
-var _excluded = ["children", "error", "success", "title", "warning", "onClose"];
+var _excluded = ["children", "error", "outlined", "small", "success", "title", "warning", "onClose"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -28,6 +28,10 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 var Notification = function Notification(_ref) {
   var children = _ref.children,
       error = _ref.error,
+      _ref$outlined = _ref.outlined,
+      outlined = _ref$outlined === void 0 ? true : _ref$outlined,
+      _ref$small = _ref.small,
+      small = _ref$small === void 0 ? false : _ref$small,
       success = _ref.success,
       title = _ref.title,
       warning = _ref.warning,
@@ -36,7 +40,7 @@ var Notification = function Notification(_ref) {
 
   return /*#__PURE__*/_react.default.createElement(_primitives.View, _extends({}, others, {
     row: true,
-    className: (0, _helpers.styles)(_NotificationModule.default.notification, error ? _NotificationModule.default.error : warning ? _NotificationModule.default.warning : success ? _NotificationModule.default.success : undefined, others.className)
+    className: (0, _helpers.styles)(_NotificationModule.default.notification, error ? _NotificationModule.default.error : warning ? _NotificationModule.default.warning : success ? _NotificationModule.default.success : undefined, outlined && _NotificationModule.default.outlined, small && _NotificationModule.default.small, others.className)
   }), /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
     name: error ? 'Error' : warning ? 'Warning' : success ? 'Success' : 'Info',
     className: _NotificationModule.default.icon
@@ -61,6 +65,8 @@ Notification.displayName = 'Component:Notification';
 Notification.propTypes = {
   children: _propTypes.default.string.isRequired,
   error: _propTypes.default.bool,
+  outlined: _propTypes.default.bool,
+  small: _propTypes.default.bool,
   success: _propTypes.default.bool,
   title: _propTypes.default.string,
   warning: _propTypes.default.bool,

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

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","names":["Notification","children","error","success","title","warning","onClose","others","style","notification","undefined","className","icon","text","pressable","displayName","propTypes","PropTypes","string","isRequired","bool","func"],"sources":["../../../src/components/Notification/Notification.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 './Notification.module.css';\n\nconst Notification = ({ children, error, success, title, warning, onClose, ...others }) => (\n  <View\n    {...others}\n    row\n    className={styles(\n      style.notification,\n      error ? style.error : warning ? style.warning : success ? style.success : undefined,\n      others.className,\n    )}\n  >\n    <Icon name={error ? 'Error' : warning ? 'Warning' : success ? 'Success' : 'Info'} className={style.icon} />\n    <View\n      className={styles(\n        style.text,\n        error ? style.error : warning ? style.warning : success ? style.success : undefined,\n      )}\n    >\n      {title && (\n        <Text bold action>\n          Title\n        </Text>\n      )}\n      <Text action>{children}</Text>\n    </View>\n    {onClose && (\n      <Pressable className={style.pressable} onPress={onClose}>\n        <Icon name=\"Close\" className={style.icon} />\n      </Pressable>\n    )}\n  </View>\n);\n\nNotification.displayName = 'Component:Notification';\n\nNotification.propTypes = {\n  children: PropTypes.string.isRequired,\n  error: PropTypes.bool,\n  success: PropTypes.bool,\n  title: PropTypes.string,\n  warning: PropTypes.bool,\n  onClose: PropTypes.func,\n};\n\nexport { Notification };\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,YAAY,GAAG,SAAfA,YAAe;EAAA,IAAGC,QAAH,QAAGA,QAAH;EAAA,IAAaC,KAAb,QAAaA,KAAb;EAAA,IAAoBC,OAApB,QAAoBA,OAApB;EAAA,IAA6BC,KAA7B,QAA6BA,KAA7B;EAAA,IAAoCC,OAApC,QAAoCA,OAApC;EAAA,IAA6CC,OAA7C,QAA6CA,OAA7C;EAAA,IAAyDC,MAAzD;;EAAA,oBACnB,6BAAC,gBAAD,eACMA,MADN;IAEE,GAAG,MAFL;IAGE,SAAS,EAAE,qBACTC,4BAAMC,YADG,EAETP,KAAK,GAAGM,4BAAMN,KAAT,GAAiBG,OAAO,GAAGG,4BAAMH,OAAT,GAAmBF,OAAO,GAAGK,4BAAML,OAAT,GAAmBO,SAFjE,EAGTH,MAAM,CAACI,SAHE;EAHb,iBASE,6BAAC,gBAAD;IAAM,IAAI,EAAET,KAAK,GAAG,OAAH,GAAaG,OAAO,GAAG,SAAH,GAAeF,OAAO,GAAG,SAAH,GAAe,MAA1E;IAAkF,SAAS,EAAEK,4BAAMI;EAAnG,EATF,eAUE,6BAAC,gBAAD;IACE,SAAS,EAAE,qBACTJ,4BAAMK,IADG,EAETX,KAAK,GAAGM,4BAAMN,KAAT,GAAiBG,OAAO,GAAGG,4BAAMH,OAAT,GAAmBF,OAAO,GAAGK,4BAAML,OAAT,GAAmBO,SAFjE;EADb,GAMGN,KAAK,iBACJ,6BAAC,gBAAD;IAAM,IAAI,MAAV;IAAW,MAAM;EAAjB,WAPJ,eAWE,6BAAC,gBAAD;IAAM,MAAM;EAAZ,GAAcH,QAAd,CAXF,CAVF,EAuBGK,OAAO,iBACN,6BAAC,qBAAD;IAAW,SAAS,EAAEE,4BAAMM,SAA5B;IAAuC,OAAO,EAAER;EAAhD,gBACE,6BAAC,gBAAD;IAAM,IAAI,EAAC,OAAX;IAAmB,SAAS,EAAEE,4BAAMI;EAApC,EADF,CAxBJ,CADmB;AAAA,CAArB;;;AAgCAZ,YAAY,CAACe,WAAb,GAA2B,wBAA3B;AAEAf,YAAY,CAACgB,SAAb,GAAyB;EACvBf,QAAQ,EAAEgB,mBAAUC,MAAV,CAAiBC,UADJ;EAEvBjB,KAAK,EAAEe,mBAAUG,IAFM;EAGvBjB,OAAO,EAAEc,mBAAUG,IAHI;EAIvBhB,KAAK,EAAEa,mBAAUC,MAJM;EAKvBb,OAAO,EAAEY,mBAAUG,IALI;EAMvBd,OAAO,EAAEW,mBAAUI;AANI,CAAzB"}
+{"version":3,"file":"Notification.js","names":["Notification","children","error","outlined","small","success","title","warning","onClose","others","style","notification","undefined","className","icon","text","pressable","displayName","propTypes","PropTypes","string","isRequired","bool","func"],"sources":["../../../src/components/Notification/Notification.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 './Notification.module.css';\n\nconst Notification = ({\n  children,\n  error,\n  outlined = true,\n  small = false,\n  success,\n  title,\n  warning,\n  onClose,\n  ...others\n}) => (\n  <View\n    {...others}\n    row\n    className={styles(\n      style.notification,\n      error ? style.error : warning ? style.warning : success ? style.success : undefined,\n      outlined && style.outlined,\n      small && style.small,\n      others.className,\n    )}\n  >\n    <Icon name={error ? 'Error' : warning ? 'Warning' : success ? 'Success' : 'Info'} className={style.icon} />\n    <View\n      className={styles(\n        style.text,\n        error ? style.error : warning ? style.warning : success ? style.success : undefined,\n      )}\n    >\n      {title && (\n        <Text bold action>\n          Title\n        </Text>\n      )}\n      <Text action>{children}</Text>\n    </View>\n    {onClose && (\n      <Pressable className={style.pressable} onPress={onClose}>\n        <Icon name=\"Close\" className={style.icon} />\n      </Pressable>\n    )}\n  </View>\n);\n\nNotification.displayName = 'Component:Notification';\n\nNotification.propTypes = {\n  children: PropTypes.string.isRequired,\n  error: PropTypes.bool,\n  outlined: PropTypes.bool,\n  small: PropTypes.bool,\n  success: PropTypes.bool,\n  title: PropTypes.string,\n  warning: PropTypes.bool,\n  onClose: PropTypes.func,\n};\n\nexport { Notification };\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,YAAY,GAAG,SAAfA,YAAe;EAAA,IACnBC,QADmB,QACnBA,QADmB;EAAA,IAEnBC,KAFmB,QAEnBA,KAFmB;EAAA,yBAGnBC,QAHmB;EAAA,IAGnBA,QAHmB,8BAGR,IAHQ;EAAA,sBAInBC,KAJmB;EAAA,IAInBA,KAJmB,2BAIX,KAJW;EAAA,IAKnBC,OALmB,QAKnBA,OALmB;EAAA,IAMnBC,KANmB,QAMnBA,KANmB;EAAA,IAOnBC,OAPmB,QAOnBA,OAPmB;EAAA,IAQnBC,OARmB,QAQnBA,OARmB;EAAA,IAShBC,MATgB;;EAAA,oBAWnB,6BAAC,gBAAD,eACMA,MADN;IAEE,GAAG,MAFL;IAGE,SAAS,EAAE,qBACTC,4BAAMC,YADG,EAETT,KAAK,GAAGQ,4BAAMR,KAAT,GAAiBK,OAAO,GAAGG,4BAAMH,OAAT,GAAmBF,OAAO,GAAGK,4BAAML,OAAT,GAAmBO,SAFjE,EAGTT,QAAQ,IAAIO,4BAAMP,QAHT,EAITC,KAAK,IAAIM,4BAAMN,KAJN,EAKTK,MAAM,CAACI,SALE;EAHb,iBAWE,6BAAC,gBAAD;IAAM,IAAI,EAAEX,KAAK,GAAG,OAAH,GAAaK,OAAO,GAAG,SAAH,GAAeF,OAAO,GAAG,SAAH,GAAe,MAA1E;IAAkF,SAAS,EAAEK,4BAAMI;EAAnG,EAXF,eAYE,6BAAC,gBAAD;IACE,SAAS,EAAE,qBACTJ,4BAAMK,IADG,EAETb,KAAK,GAAGQ,4BAAMR,KAAT,GAAiBK,OAAO,GAAGG,4BAAMH,OAAT,GAAmBF,OAAO,GAAGK,4BAAML,OAAT,GAAmBO,SAFjE;EADb,GAMGN,KAAK,iBACJ,6BAAC,gBAAD;IAAM,IAAI,MAAV;IAAW,MAAM;EAAjB,WAPJ,eAWE,6BAAC,gBAAD;IAAM,MAAM;EAAZ,GAAcL,QAAd,CAXF,CAZF,EAyBGO,OAAO,iBACN,6BAAC,qBAAD;IAAW,SAAS,EAAEE,4BAAMM,SAA5B;IAAuC,OAAO,EAAER;EAAhD,gBACE,6BAAC,gBAAD;IAAM,IAAI,EAAC,OAAX;IAAmB,SAAS,EAAEE,4BAAMI;EAApC,EADF,CA1BJ,CAXmB;AAAA,CAArB;;;AA4CAd,YAAY,CAACiB,WAAb,GAA2B,wBAA3B;AAEAjB,YAAY,CAACkB,SAAb,GAAyB;EACvBjB,QAAQ,EAAEkB,mBAAUC,MAAV,CAAiBC,UADJ;EAEvBnB,KAAK,EAAEiB,mBAAUG,IAFM;EAGvBnB,QAAQ,EAAEgB,mBAAUG,IAHG;EAIvBlB,KAAK,EAAEe,mBAAUG,IAJM;EAKvBjB,OAAO,EAAEc,mBAAUG,IALI;EAMvBhB,KAAK,EAAEa,mBAAUC,MANM;EAOvBb,OAAO,EAAEY,mBAAUG,IAPI;EAQvBd,OAAO,EAAEW,mBAAUI;AARI,CAAzB"}

package/build/components/Notification/Notification.module.css

@@ -9,14 +9,23 @@
   background-color: var(--mirai-ui-accent-background);
   border-radius: var(--mirai-ui-notification-border-radius);
   padding: var(--mirai-ui-notification-padding);
+}
+
+.notification.outlined {
   border: solid 1px var(--mirai-ui-accent-border);
 }
 
+.notification.small {
+  padding: 0;
+  border: none;
+  background-color: transparent;
+}
+
 .notification * {
   color: var(--mirai-ui-accent);
 }
 
-.notification.success {
+.notification.success:not(.small) {
   background-color: var(--mirai-ui-success-background);
   border-color: var(--mirai-ui-success-border);
 }
@@ -25,7 +34,7 @@
   color: var(--mirai-ui-success);
 }
 
-.notification.error {
+.notification.error:not(.small) {
   background-color: var(--mirai-ui-error-background);
   border-color: var(--mirai-ui-error-border);
 }
@@ -34,7 +43,7 @@
   color: var(--mirai-ui-error);
 }
 
-.notification.warning {
+.notification.warning:not(.small) {
   background-color: var(--mirai-ui-warning-background);
   border-color: var(--mirai-ui-warning-border);
 }

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

@@ -3,7 +3,7 @@
 exports[`component:<Notification> inherit:className 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification mirai"
+    class="view row notification outlined mirai"
   >
     <span
       class="icon icon"
@@ -42,7 +42,7 @@ exports[`component:<Notification> inherit:className 1`] = `
 exports[`component:<Notification> prop:error 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification error"
+    class="view row notification error outlined"
   >
     <span
       class="icon icon"
@@ -81,7 +81,7 @@ exports[`component:<Notification> prop:error 1`] = `
 exports[`component:<Notification> prop:onClose 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification"
+    class="view row notification outlined"
   >
     <span
       class="icon icon"
@@ -149,10 +149,88 @@ exports[`component:<Notification> prop:onClose 1`] = `
 </DocumentFragment>
 `;
 
+exports[`component:<Notification> prop:outlined 1`] = `
+<DocumentFragment>
+  <div
+    class="view row notification"
+  >
+    <span
+      class="icon icon"
+    >
+      <svg
+        fill="currentColor"
+        height="1em"
+        stroke="currentColor"
+        stroke-width="0"
+        viewBox="0 0 24 24"
+        width="1em"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M0 0h24v24H0z"
+          fill="none"
+        />
+        <path
+          d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"
+        />
+      </svg>
+    </span>
+    <div
+      class="view text"
+    >
+      <span
+        class="text action"
+      >
+        Lorem Ipsum...
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<Notification> prop:small 1`] = `
+<DocumentFragment>
+  <div
+    class="view row notification outlined small"
+  >
+    <span
+      class="icon icon"
+    >
+      <svg
+        fill="currentColor"
+        height="1em"
+        stroke="currentColor"
+        stroke-width="0"
+        viewBox="0 0 24 24"
+        width="1em"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M0 0h24v24H0z"
+          fill="none"
+        />
+        <path
+          d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"
+        />
+      </svg>
+    </span>
+    <div
+      class="view text"
+    >
+      <span
+        class="text action"
+      >
+        Lorem Ipsum...
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
 exports[`component:<Notification> prop:success 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification success"
+    class="view row notification success outlined"
   >
     <span
       class="icon icon"
@@ -191,7 +269,7 @@ exports[`component:<Notification> prop:success 1`] = `
 exports[`component:<Notification> prop:title 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification"
+    class="view row notification outlined"
   >
     <span
       class="icon icon"
@@ -235,7 +313,7 @@ exports[`component:<Notification> prop:title 1`] = `
 exports[`component:<Notification> prop:warning 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification warning"
+    class="view row notification warning outlined"
   >
     <span
       class="icon icon"
@@ -274,7 +352,7 @@ exports[`component:<Notification> prop:warning 1`] = `
 exports[`component:<Notification> renders 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification"
+    class="view row notification outlined"
   >
     <span
       class="icon icon"
@@ -313,7 +391,7 @@ exports[`component:<Notification> renders 1`] = `
 exports[`component:<Notification> testID 1`] = `
 <DocumentFragment>
   <div
-    class="view row notification"
+    class="view row notification outlined"
     data-testid="mirai"
   >
     <span

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirai/ui",
-  "version": "1.0.43",
+  "version": "1.0.45",
   "repository": "git@gitlab.com:miraicorp/dev/frontend/ui.git",
   "author": "JΛVI <hello@soyjavi.com>",
   "license": "MIT",