@mirai/ui 1.0.134 → 1.0.136

package/build/components/Progress/Progress.module.css

@@ -0,0 +1,37 @@
+.progress {
+  background-color: var(--mirai-ui-progress-background);
+  height: 0;
+  overflow: hidden;
+  transition: height var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing);
+  width: 100%;
+}
+
+.progress.visible {
+  height: var(--mirai-ui-progress-height);
+}
+
+.value {
+  background-color: var(--mirai-ui-progress-color);
+  height: 100%;
+  transition: all var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing);
+  width: 0%;
+}
+
+.value.indeterminate {
+  animation: mirai-progress-indeterminate var(--mirai-ui-progress-motion) infinite var(--mirai-ui-motion-easing)
+    alternate;
+  transform-origin: 0% 50%;
+  width: 100%;
+}
+
+@keyframes mirai-progress-indeterminate {
+  0% {
+    transform: translateX(0) scaleX(0);
+  }
+  50% {
+    transform: translateX(0) scaleX(1);
+  }
+  100% {
+    transform: translateX(100%) scaleX(0.5);
+  }
+}

package/build/components/Progress/Progress.stories.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Story = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _Progress = require("./Progress");
+var _Story$args;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+var _default = {
+  title: 'Components'
+};
+exports.default = _default;
+var INSTANCES = Array.from(Array(3).keys());
+var Story = function Story(props) {
+  return /*#__PURE__*/_react.default.createElement(_Progress.Progress, props);
+};
+exports.Story = Story;
+Story.storyName = 'Progress';
+Story.args = (_Story$args = {
+  indeterminate: false,
+  value: 25,
+  visible: true
+}, _defineProperty(_Story$args, 'data-testid', 'test-story'), _defineProperty(_Story$args, "style", {}), _Story$args);
+Story.argTypes = {};
+//# sourceMappingURL=Progress.stories.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Progress.stories.js","names":["title","INSTANCES","Array","from","keys","Story","props","storyName","args","indeterminate","value","visible","argTypes"],"sources":["../../../src/components/Progress/Progress.stories.jsx"],"sourcesContent":["import React from 'react';\n\nimport { Text, View } from '../..';\nimport { Progress } from './Progress';\n\nexport default { title: 'Components' };\n\nconst INSTANCES = Array.from(Array(3).keys());\n\nexport const Story = (props) => <Progress {...props} />;\n\nStory.storyName = 'Progress';\n\nStory.args = {\n  indeterminate: false,\n  value: 25,\n  visible: true,\n  // inherited properties\n  ['data-testid']: 'test-story',\n  style: {},\n};\n\nStory.argTypes = {};\n"],"mappings":";;;;;;AAAA;AAEA;AACA;AAAsC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAEvB;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAEtC,IAAMC,SAAS,GAAGC,KAAK,CAACC,IAAI,CAACD,KAAK,CAAC,CAAC,CAAC,CAACE,IAAI,EAAE,CAAC;AAEtC,IAAMC,KAAK,GAAG,SAARA,KAAK,CAAIC,KAAK;EAAA,oBAAK,6BAAC,kBAAQ,EAAKA,KAAK,CAAI;AAAA;AAAC;AAExDD,KAAK,CAACE,SAAS,GAAG,UAAU;AAE5BF,KAAK,CAACG,IAAI;EACRC,aAAa,EAAE,KAAK;EACpBC,KAAK,EAAE,EAAE;EACTC,OAAO,EAAE;AAAI,gCAEZ,aAAa,EAAG,YAAY,yCACtB,CAAC,CAAC,eACV;AAEDN,KAAK,CAACO,QAAQ,GAAG,CAAC,CAAC"}

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

@@ -0,0 +1,79 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`component:<Progress> inherit:className 1`] = `
+<DocumentFragment>
+  <div
+    class="view progress mirai"
+  >
+    <div
+      class="view value"
+      style="width: 0%;"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<Progress> prop:indeterminate 1`] = `
+<DocumentFragment>
+  <div
+    class="view progress"
+  >
+    <div
+      class="view value indeterminate"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<Progress> prop:value 1`] = `
+<DocumentFragment>
+  <div
+    class="view progress"
+  >
+    <div
+      class="view value"
+      style="width: 50%;"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<Progress> prop:visible 1`] = `
+<DocumentFragment>
+  <div
+    class="view progress visible"
+  >
+    <div
+      class="view value"
+      style="width: 50%;"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<Progress> renders 1`] = `
+<DocumentFragment>
+  <div
+    class="view progress"
+  >
+    <div
+      class="view value"
+      style="width: 0%;"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<Progress> testID 1`] = `
+<DocumentFragment>
+  <div
+    class="view progress"
+    data-testid="mirai"
+  >
+    <div
+      class="view value"
+      style="width: 0%;"
+    />
+  </div>
+</DocumentFragment>
+`;

package/build/components/Progress/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Progress = require("./Progress");
+Object.keys(_Progress).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Progress[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Progress[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Progress/index.js"],"sourcesContent":["export * from './Progress';\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

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

@@ -2445,7 +2445,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""
@@ -2778,7 +2778,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""
@@ -2840,7 +2840,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""
@@ -2902,7 +2902,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""
@@ -2964,7 +2964,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""
@@ -3030,7 +3030,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""
@@ -3094,7 +3094,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""
@@ -3156,7 +3156,7 @@ exports[`component:<Table> prop:onSelect 1`] = `
                 class="checkbox"
               >
                 <input
-                  class=""
+                  class="input"
                   name="checkbox"
                   type="checkbox"
                   value=""

package/build/primitives/Checkbox/Checkbox.js

@@ -38,7 +38,7 @@ var Checkbox = function Checkbox(_ref) {
     name: name,
     type: "checkbox",
     value: value,
-    className: (0, _helpers.styles)(checked && _CheckboxModule.default.checked),
+    className: (0, _helpers.styles)(checked && _CheckboxModule.default.checked, _CheckboxModule.default.input),
     onChange: handleChange
   }), children);
 };

package/build/primitives/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":["Checkbox","checked","children","disabled","name","value","onChange","others","handleChange","event","target","styles","style","checkbox","className","displayName","propTypes","PropTypes","bool","node","string","isRequired","oneOfType","func"],"sources":["../../../src/primitives/Checkbox/Checkbox.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport style from './Checkbox.module.css';\n\nconst Checkbox = ({ checked = false, children, disabled, name, value = '', onChange = () => {}, ...others }) => {\n  const handleChange = (event) => {\n    if (disabled) return;\n\n    const {\n      target: { checked },\n    } = event;\n    onChange(checked, event);\n  };\n\n  return (\n    <div className={styles(style.checkbox, others.className)} style={others.style}>\n      <input\n        checked={checked}\n        data-testid={others['data-testid']}\n        disabled={disabled}\n        name={name}\n        type=\"checkbox\"\n        value={value}\n        className={styles(checked && style.checked)}\n        onChange={handleChange}\n      />\n      {children}\n    </div>\n  );\n};\n\nCheckbox.displayName = 'Primitive:Checkbox';\n\nCheckbox.propTypes = {\n  checked: PropTypes.bool,\n  children: PropTypes.node,\n  disabled: PropTypes.bool,\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  onChange: PropTypes.func,\n};\n\nexport { Checkbox };\n"],"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AAA0C;AAAA;AAAA;AAAA;AAE1C,IAAMA,QAAQ,GAAG,SAAXA,QAAQ,OAAkG;EAAA,wBAA5FC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,IAAI,QAAJA,IAAI;IAAA,kBAAEC,KAAK;IAALA,KAAK,2BAAG,EAAE;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,YAAM,CAAC,CAAC;IAAKC,MAAM;EACvG,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,KAAK,EAAK;IAC9B,IAAIN,QAAQ,EAAE;IAEd,IACYF,OAAO,GACfQ,KAAK,CADPC,MAAM,CAAIT,OAAO;IAEnBK,QAAQ,CAACL,OAAO,EAAEQ,KAAK,CAAC;EAC1B,CAAC;EAED,oBACE;IAAK,SAAS,EAAE,IAAAE,eAAM,EAACC,uBAAK,CAACC,QAAQ,EAAEN,MAAM,CAACO,SAAS,CAAE;IAAC,KAAK,EAAEP,MAAM,CAACK;EAAM,gBAC5E;IACE,OAAO,EAAEX,OAAQ;IACjB,eAAaM,MAAM,CAAC,aAAa,CAAE;IACnC,QAAQ,EAAEJ,QAAS;IACnB,IAAI,EAAEC,IAAK;IACX,IAAI,EAAC,UAAU;IACf,KAAK,EAAEC,KAAM;IACb,SAAS,EAAE,IAAAM,eAAM,EAACV,OAAO,IAAIW,uBAAK,CAACX,OAAO,CAAE;IAC5C,QAAQ,EAAEO;EAAa,EACvB,EACDN,QAAQ,CACL;AAEV,CAAC;AAAC;AAEFF,QAAQ,CAACe,WAAW,GAAG,oBAAoB;AAE3Cf,QAAQ,CAACgB,SAAS,GAAG;EACnBf,OAAO,EAAEgB,kBAAS,CAACC,IAAI;EACvBhB,QAAQ,EAAEe,kBAAS,CAACE,IAAI;EACxBhB,QAAQ,EAAEc,kBAAS,CAACC,IAAI;EACxBd,IAAI,EAAEa,kBAAS,CAACG,MAAM,CAACC,UAAU;EACjChB,KAAK,EAAEY,kBAAS,CAACK,SAAS,CAAC,CAACL,kBAAS,CAACG,MAAM,EAAEH,kBAAS,CAACC,IAAI,CAAC,CAAC;EAC9DZ,QAAQ,EAAEW,kBAAS,CAACM;AACtB,CAAC"}
+{"version":3,"file":"Checkbox.js","names":["Checkbox","checked","children","disabled","name","value","onChange","others","handleChange","event","target","styles","style","checkbox","className","input","displayName","propTypes","PropTypes","bool","node","string","isRequired","oneOfType","func"],"sources":["../../../src/primitives/Checkbox/Checkbox.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport style from './Checkbox.module.css';\n\nconst Checkbox = ({ checked = false, children, disabled, name, value = '', onChange = () => {}, ...others }) => {\n  const handleChange = (event) => {\n    if (disabled) return;\n\n    const {\n      target: { checked },\n    } = event;\n    onChange(checked, event);\n  };\n\n  return (\n    <div className={styles(style.checkbox, others.className)} style={others.style}>\n      <input\n        checked={checked}\n        data-testid={others['data-testid']}\n        disabled={disabled}\n        name={name}\n        type=\"checkbox\"\n        value={value}\n        className={styles(checked && style.checked, style.input)}\n        onChange={handleChange}\n      />\n      {children}\n    </div>\n  );\n};\n\nCheckbox.displayName = 'Primitive:Checkbox';\n\nCheckbox.propTypes = {\n  checked: PropTypes.bool,\n  children: PropTypes.node,\n  disabled: PropTypes.bool,\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  onChange: PropTypes.func,\n};\n\nexport { Checkbox };\n"],"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AAA0C;AAAA;AAAA;AAAA;AAE1C,IAAMA,QAAQ,GAAG,SAAXA,QAAQ,OAAkG;EAAA,wBAA5FC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,IAAI,QAAJA,IAAI;IAAA,kBAAEC,KAAK;IAALA,KAAK,2BAAG,EAAE;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,YAAM,CAAC,CAAC;IAAKC,MAAM;EACvG,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,KAAK,EAAK;IAC9B,IAAIN,QAAQ,EAAE;IAEd,IACYF,OAAO,GACfQ,KAAK,CADPC,MAAM,CAAIT,OAAO;IAEnBK,QAAQ,CAACL,OAAO,EAAEQ,KAAK,CAAC;EAC1B,CAAC;EAED,oBACE;IAAK,SAAS,EAAE,IAAAE,eAAM,EAACC,uBAAK,CAACC,QAAQ,EAAEN,MAAM,CAACO,SAAS,CAAE;IAAC,KAAK,EAAEP,MAAM,CAACK;EAAM,gBAC5E;IACE,OAAO,EAAEX,OAAQ;IACjB,eAAaM,MAAM,CAAC,aAAa,CAAE;IACnC,QAAQ,EAAEJ,QAAS;IACnB,IAAI,EAAEC,IAAK;IACX,IAAI,EAAC,UAAU;IACf,KAAK,EAAEC,KAAM;IACb,SAAS,EAAE,IAAAM,eAAM,EAACV,OAAO,IAAIW,uBAAK,CAACX,OAAO,EAAEW,uBAAK,CAACG,KAAK,CAAE;IACzD,QAAQ,EAAEP;EAAa,EACvB,EACDN,QAAQ,CACL;AAEV,CAAC;AAAC;AAEFF,QAAQ,CAACgB,WAAW,GAAG,oBAAoB;AAE3ChB,QAAQ,CAACiB,SAAS,GAAG;EACnBhB,OAAO,EAAEiB,kBAAS,CAACC,IAAI;EACvBjB,QAAQ,EAAEgB,kBAAS,CAACE,IAAI;EACxBjB,QAAQ,EAAEe,kBAAS,CAACC,IAAI;EACxBf,IAAI,EAAEc,kBAAS,CAACG,MAAM,CAACC,UAAU;EACjCjB,KAAK,EAAEa,kBAAS,CAACK,SAAS,CAAC,CAACL,kBAAS,CAACG,MAAM,EAAEH,kBAAS,CAACC,IAAI,CAAC,CAAC;EAC9Db,QAAQ,EAAEY,kBAAS,CAACM;AACtB,CAAC"}

package/build/primitives/Checkbox/Checkbox.module.css

@@ -35,3 +35,9 @@
   background-color: var(--mirai-ui-checkbox-checked);
   border-color: var(--mirai-ui-checkbox-checked);
 }
+
+/* -- reset defaults -------------------------------------------------------- */
+.checkbox input.input {
+  margin-right: 0;
+  top: 0;
+}

package/build/primitives/Checkbox/__tests__/__snapshots__/Checkbox.test.js.snap

@@ -6,7 +6,7 @@ exports[`primitive:<Checkbox> inherit:className 1`] = `
     class="checkbox mirai"
   >
     <input
-      class=""
+      class="input"
       name="name"
       type="checkbox"
       value=""
@@ -22,7 +22,7 @@ exports[`primitive:<Checkbox> prop:checked && disabled 1`] = `
   >
     <input
       checked=""
-      class="checked"
+      class="checked input"
       disabled=""
       name="name"
       type="checkbox"
@@ -39,7 +39,7 @@ exports[`primitive:<Checkbox> prop:checked 1`] = `
   >
     <input
       checked=""
-      class="checked"
+      class="checked input"
       name="name"
       type="checkbox"
       value=""
@@ -54,7 +54,7 @@ exports[`primitive:<Checkbox> prop:children 1`] = `
     class="checkbox"
   >
     <input
-      class=""
+      class="input"
       name="name"
       type="checkbox"
       value=""
@@ -70,7 +70,7 @@ exports[`primitive:<Checkbox> prop:disabled 1`] = `
     class="checkbox"
   >
     <input
-      class=""
+      class="input"
       disabled=""
       name="name"
       type="checkbox"
@@ -86,7 +86,7 @@ exports[`primitive:<Checkbox> prop:value 1`] = `
     class="checkbox"
   >
     <input
-      class=""
+      class="input"
       name="name"
       type="checkbox"
       value="value"
@@ -101,7 +101,7 @@ exports[`primitive:<Checkbox> render 1`] = `
     class="checkbox"
   >
     <input
-      class=""
+      class="input"
       name="name"
       type="checkbox"
       value=""
@@ -116,7 +116,7 @@ exports[`primitive:<Checkbox> testID 1`] = `
     class="checkbox"
   >
     <input
-      class=""
+      class="input"
       data-testid="mirai"
       name="name"
       type="checkbox"

package/build/primitives/Radio/Radio.js

@@ -36,7 +36,8 @@ var Radio = function Radio(_ref) {
     name: name,
     type: "radio",
     value: value,
-    onChange: handleChange
+    onChange: handleChange,
+    className: _RadioModule.default.input
   }), /*#__PURE__*/_react.default.createElement("span", {
     className: _RadioModule.default.checkmark
   }));

package/build/primitives/Radio/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","names":["Radio","checked","disabled","name","value","onChange","others","handleChange","event","styles","style","radio","className","checkmark","displayName","propTypes","PropTypes","bool","string","isRequired","oneOfType","func"],"sources":["../../../src/primitives/Radio/Radio.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport style from './Radio.module.css';\n\nconst Radio = ({ checked = false, disabled, name, value = '', onChange = () => {}, ...others }) => {\n  const handleChange = (event) => {\n    if (disabled) return;\n\n    onChange(value, event);\n  };\n\n  return (\n    <div className={styles(style.radio, others.className)} style={others.style}>\n      <input\n        checked={checked}\n        data-testid={others['data-testid']}\n        disabled={disabled}\n        name={name}\n        type=\"radio\"\n        value={value}\n        onChange={handleChange}\n      />\n      <span className={style.checkmark} />\n    </div>\n  );\n};\n\nRadio.displayName = 'Primitive:Radio';\n\nRadio.propTypes = {\n  checked: PropTypes.bool,\n  disabled: PropTypes.bool,\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  onChange: PropTypes.func,\n};\n\nexport { Radio };\n"],"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AAAuC;AAAA;AAAA;AAAA;AAEvC,IAAMA,KAAK,GAAG,SAARA,KAAK,OAAwF;EAAA,wBAAlFC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,IAAI,QAAJA,IAAI;IAAA,kBAAEC,KAAK;IAALA,KAAK,2BAAG,EAAE;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,YAAM,CAAC,CAAC;IAAKC,MAAM;EAC1F,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,KAAK,EAAK;IAC9B,IAAIN,QAAQ,EAAE;IAEdG,QAAQ,CAACD,KAAK,EAAEI,KAAK,CAAC;EACxB,CAAC;EAED,oBACE;IAAK,SAAS,EAAE,IAAAC,eAAM,EAACC,oBAAK,CAACC,KAAK,EAAEL,MAAM,CAACM,SAAS,CAAE;IAAC,KAAK,EAAEN,MAAM,CAACI;EAAM,gBACzE;IACE,OAAO,EAAET,OAAQ;IACjB,eAAaK,MAAM,CAAC,aAAa,CAAE;IACnC,QAAQ,EAAEJ,QAAS;IACnB,IAAI,EAAEC,IAAK;IACX,IAAI,EAAC,OAAO;IACZ,KAAK,EAAEC,KAAM;IACb,QAAQ,EAAEG;EAAa,EACvB,eACF;IAAM,SAAS,EAAEG,oBAAK,CAACG;EAAU,EAAG,CAChC;AAEV,CAAC;AAAC;AAEFb,KAAK,CAACc,WAAW,GAAG,iBAAiB;AAErCd,KAAK,CAACe,SAAS,GAAG;EAChBd,OAAO,EAAEe,kBAAS,CAACC,IAAI;EACvBf,QAAQ,EAAEc,kBAAS,CAACC,IAAI;EACxBd,IAAI,EAAEa,kBAAS,CAACE,MAAM,CAACC,UAAU;EACjCf,KAAK,EAAEY,kBAAS,CAACI,SAAS,CAAC,CAACJ,kBAAS,CAACE,MAAM,EAAEF,kBAAS,CAACC,IAAI,CAAC,CAAC;EAC9DZ,QAAQ,EAAEW,kBAAS,CAACK;AACtB,CAAC"}
+{"version":3,"file":"Radio.js","names":["Radio","checked","disabled","name","value","onChange","others","handleChange","event","styles","style","radio","className","input","checkmark","displayName","propTypes","PropTypes","bool","string","isRequired","oneOfType","func"],"sources":["../../../src/primitives/Radio/Radio.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport style from './Radio.module.css';\n\nconst Radio = ({ checked = false, disabled, name, value = '', onChange = () => {}, ...others }) => {\n  const handleChange = (event) => {\n    if (disabled) return;\n\n    onChange(value, event);\n  };\n\n  return (\n    <div className={styles(style.radio, others.className)} style={others.style}>\n      <input\n        checked={checked}\n        data-testid={others['data-testid']}\n        disabled={disabled}\n        name={name}\n        type=\"radio\"\n        value={value}\n        onChange={handleChange}\n        className={style.input}\n      />\n      <span className={style.checkmark} />\n    </div>\n  );\n};\n\nRadio.displayName = 'Primitive:Radio';\n\nRadio.propTypes = {\n  checked: PropTypes.bool,\n  disabled: PropTypes.bool,\n  name: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  onChange: PropTypes.func,\n};\n\nexport { Radio };\n"],"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AAAuC;AAAA;AAAA;AAAA;AAEvC,IAAMA,KAAK,GAAG,SAARA,KAAK,OAAwF;EAAA,wBAAlFC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,IAAI,QAAJA,IAAI;IAAA,kBAAEC,KAAK;IAALA,KAAK,2BAAG,EAAE;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,YAAM,CAAC,CAAC;IAAKC,MAAM;EAC1F,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,KAAK,EAAK;IAC9B,IAAIN,QAAQ,EAAE;IAEdG,QAAQ,CAACD,KAAK,EAAEI,KAAK,CAAC;EACxB,CAAC;EAED,oBACE;IAAK,SAAS,EAAE,IAAAC,eAAM,EAACC,oBAAK,CAACC,KAAK,EAAEL,MAAM,CAACM,SAAS,CAAE;IAAC,KAAK,EAAEN,MAAM,CAACI;EAAM,gBACzE;IACE,OAAO,EAAET,OAAQ;IACjB,eAAaK,MAAM,CAAC,aAAa,CAAE;IACnC,QAAQ,EAAEJ,QAAS;IACnB,IAAI,EAAEC,IAAK;IACX,IAAI,EAAC,OAAO;IACZ,KAAK,EAAEC,KAAM;IACb,QAAQ,EAAEG,YAAa;IACvB,SAAS,EAAEG,oBAAK,CAACG;EAAM,EACvB,eACF;IAAM,SAAS,EAAEH,oBAAK,CAACI;EAAU,EAAG,CAChC;AAEV,CAAC;AAAC;AAEFd,KAAK,CAACe,WAAW,GAAG,iBAAiB;AAErCf,KAAK,CAACgB,SAAS,GAAG;EAChBf,OAAO,EAAEgB,kBAAS,CAACC,IAAI;EACvBhB,QAAQ,EAAEe,kBAAS,CAACC,IAAI;EACxBf,IAAI,EAAEc,kBAAS,CAACE,MAAM,CAACC,UAAU;EACjChB,KAAK,EAAEa,kBAAS,CAACI,SAAS,CAAC,CAACJ,kBAAS,CAACE,MAAM,EAAEF,kBAAS,CAACC,IAAI,CAAC,CAAC;EAC9Db,QAAQ,EAAEY,kBAAS,CAACK;AACtB,CAAC"}

package/build/primitives/Radio/Radio.module.css

@@ -50,3 +50,9 @@
 .radio input:checked:not(:disabled) ~ .checkmark {
   background-color: var(--mirai-ui-radio-base);
 }
+
+/* -- reset defaults -------------------------------------------------------- */
+.radio input.input {
+  margin-right: 0;
+  top: 0;
+}

package/build/primitives/Radio/__tests__/__snapshots__/Radio.test.js.snap

@@ -6,6 +6,7 @@ exports[`primitive:<Radio> inherit:className 1`] = `
     class="radio mirai"
   >
     <input
+      class="input"
       name="name"
       type="radio"
       value=""
@@ -24,6 +25,7 @@ exports[`primitive:<Radio> prop:checked && disabled 1`] = `
   >
     <input
       checked=""
+      class="input"
       disabled=""
       name="name"
       type="radio"
@@ -43,6 +45,7 @@ exports[`primitive:<Radio> prop:checked 1`] = `
   >
     <input
       checked=""
+      class="input"
       name="name"
       type="radio"
       value=""
@@ -60,6 +63,7 @@ exports[`primitive:<Radio> prop:disabled 1`] = `
     class="radio"
   >
     <input
+      class="input"
       disabled=""
       name="name"
       type="radio"
@@ -78,6 +82,7 @@ exports[`primitive:<Radio> prop:value 1`] = `
     class="radio"
   >
     <input
+      class="input"
       name="name"
       type="radio"
       value="value"
@@ -95,6 +100,7 @@ exports[`primitive:<Radio> render 1`] = `
     class="radio"
   >
     <input
+      class="input"
       name="name"
       type="radio"
       value=""
@@ -112,6 +118,7 @@ exports[`primitive:<Radio> testID 1`] = `
     class="radio"
   >
     <input
+      class="input"
       data-testid="mirai"
       name="name"
       type="radio"

package/build/theme/default.theme.css

@@ -243,6 +243,12 @@
   --mirai-ui-notification-padding-large: var(--mirai-ui-space-M);
   --mirai-ui-notification-padding-small: var(--mirai-ui-space-XS);
 
+  /* Progress */
+  --mirai-ui-progress-background: var(--mirai-ui-content-background);
+  --mirai-ui-progress-color: var(--mirai-ui-accent);
+  --mirai-ui-progress-height: var(--mirai-ui-space-XS);
+  --mirai-ui-progress-motion: calc(var(--mirai-ui-motion-expand) * 3);
+
   /* Table */
   --mirai-ui-table-background: var(--mirai-ui-base);
   --mirai-ui-table-border-color: var(--mirai-ui-content-border);

package/package.json

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