@mirai/ui 1.0.1 → 1.0.2

package/build/components/Calendar/Calendar.Week.js

@@ -51,8 +51,6 @@ var Week = function Week(_ref) {
 
   var disabledDatesTS = disabledDates.map(function (date) {
     return (0, _locale.UTC)((0, _locale.parseDate)(date, format)).getTime();
-  }).filter(function (date) {
-    return !isNaN(date);
   });
   var firstDate = (0, _helpers2.getFirstDateOfWeek)(number, year);
   var todayTS = (0, _helpers2.getToday)().getTime();

package/build/components/Calendar/Calendar.Week.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Calendar/Calendar.Week.jsx"],"names":["Week","captions","disabledDates","disabledPast","focus","locale","format","from","month","number","range","selected","to","year","onPress","onFocus","others","disabledDatesTS","map","date","getTime","filter","isNaN","firstDate","todayTS","fromTS","toTS","rangeTS","start","end","undefined","focusTS","ts","sort","outbound","DAYS","day","Date","getFullYear","getMonth","getDate","dateTS","is","disabled","includes","outOfRange","rangeLimit","ranging","today","touchable","visible","isSelected","textStyle","style","textDisabled","textSelected","cell","daySelected","dayRange","dayRangeLimit","dayTouchable","caption","displayName"],"mappings":";;;;;;;;;;;;;AAAA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;AAEO,IAAMA,IAAI,GAAG,SAAPA,IAAO,OAiBd;AAAA,MAhBJC,QAgBI,QAhBJA,QAgBI;AAAA,gCAfJC,aAeI;AAAA,MAfJA,aAeI,mCAfY,EAeZ;AAAA,+BAdJC,YAcI;AAAA,MAdJA,YAcI,kCAdW,KAcX;AAAA,MAbJC,KAaI,QAbJA,KAaI;AAAA,MAZJC,MAYI,QAZJA,MAYI;AAAA,MAXJC,MAWI,QAXJA,MAWI;AAAA,MAVJC,IAUI,QAVJA,IAUI;AAAA,MATJC,KASI,QATJA,KASI;AAAA,MARJC,MAQI,QARJA,MAQI;AAAA,MAPJC,KAOI,QAPJA,KAOI;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,EAKI,QALJA,EAKI;AAAA,MAJJC,IAII,QAJJA,IAII;AAAA,0BAHJC,OAGI;AAAA,MAHJA,QAGI,6BAHM,YAAM,CAAE,CAGd;AAAA,0BAFJC,OAEI;AAAA,MAFJA,OAEI,6BAFM,YAAM,CAAE,CAEd;AAAA,MADDC,MACC;;AACJ,MAAMC,eAAe,GAAGf,aAAa,CAClCgB,GADqB,CACjB,UAACC,IAAD;AAAA,WAAU,iBAAI,uBAAUA,IAAV,EAAgBb,MAAhB,CAAJ,EAA6Bc,OAA7B,EAAV;AAAA,GADiB,EAErBC,MAFqB,CAEd,UAACF,IAAD;AAAA,WAAU,CAACG,KAAK,CAACH,IAAD,CAAhB;AAAA,GAFc,CAAxB;AAGA,MAAMI,SAAS,GAAG,kCAAmBd,MAAnB,EAA2BI,IAA3B,CAAlB;AACA,MAAMW,OAAO,GAAG,0BAAWJ,OAAX,EAAhB;AACA,MAAMK,MAAM,GAAGlB,IAAH,aAAGA,IAAH,uBAAGA,IAAI,CAAEa,OAAN,EAAf;AACA,MAAMM,IAAI,GAAGd,EAAH,aAAGA,EAAH,uBAAGA,EAAE,CAAEQ,OAAJ,EAAb;AAEA,MAAIO,OAAO,GAAG,EAAd;;AACA,MAAIjB,KAAJ,EAAW;AACT,iDAAqBC,QAArB;AAAA,QAAOiB,KAAP;AAAA,QAAcC,GAAd;;AACAF,IAAAA,OAAO,GAAG;AAAEC,MAAAA,KAAK,EAAEA,KAAK,GAAGA,KAAK,CAACR,OAAN,EAAH,GAAqBU,SAAnC;AAA8CD,MAAAA,GAAG,EAAEA,GAAG,GAAGA,GAAG,CAACT,OAAJ,EAAH,GAAmBU;AAAzE,KAAV;;AAEA,QAAI1B,KAAJ,EAAW;AACT,UAAM2B,OAAO,GAAG3B,KAAK,CAACgB,OAAN,EAAhB;;AACA,kCAAmBH,eAAe,CAACI,MAAhB,CAAuB,UAACW,EAAD;AAAA,eAAQA,EAAE,GAAGL,OAAO,CAACC,KAAb,IAAsBG,OAAO,IAAIC,EAAzC;AAAA,OAAvB,EAAoEC,IAApE,EAAnB;AAAA;AAAA,UAAOC,QAAP;;AAEAP,MAAAA,OAAO,CAACE,GAAR,GAAcK,QAAQ,GAAGA,QAAQ,GAAG,CAAd,GAAkBH,OAAxC;AACAJ,MAAAA,OAAO,CAACO,QAAR,GAAmBA,QAAQ,GAAG,CAA9B;AACD;AACF;;AAED,sBACE,6BAAC,gBAAD;AAAM,IAAA,GAAG;AAAT,KACGC,eAAKjB,GAAL,CAAS,UAACkB,GAAD,EAAS;AACjB,QAAMjB,IAAI,GAAG,iBAAI,IAAIkB,IAAJ,CAASd,SAAS,CAACe,WAAV,EAAT,EAAkCf,SAAS,CAACgB,QAAV,EAAlC,EAAwDhB,SAAS,CAACiB,OAAV,KAAsBJ,GAA9E,CAAJ,CAAb;AACA,QAAMK,MAAM,GAAGtB,IAAI,CAACC,OAAL,EAAf;AAEA,QAAMsB,EAAE,GAAG;AACTC,MAAAA,QAAQ,EACLxC,YAAY,IAAIgB,IAAI,CAACC,OAAL,KAAiBI,OAAlC,IAA8C;AAC9C,OAACL,IAAI,CAACoB,QAAL,EAAD,KAAqB/B,KADrB,IAC8B;AAC9BS,MAAAA,eAAe,CAAC2B,QAAhB,CAAyBH,MAAzB,CAFA,IAEoC;AACpCA,MAAAA,MAAM,GAAGhB,MAHT,IAGmB;AACnBgB,MAAAA,MAAM,GAAGf,IANF;AAMQ;AACjBmB,MAAAA,UAAU,EAAEJ,MAAM,GAAGd,OAAO,CAACO,QAPpB;AAQTxB,MAAAA,KAAK,EAAE+B,MAAM,GAAGd,OAAO,CAACC,KAAjB,IAA0Ba,MAAM,GAAGd,OAAO,CAACE,GARzC;AASTiB,MAAAA,UAAU,EAAEL,MAAM,KAAKd,OAAO,CAACC,KAAnB,IAA4Ba,MAAM,KAAKd,OAAO,CAACE,GATlD;AAUT;AACAkB,MAAAA,OAAO,EAAErC,KAAK,KAAIC,QAAJ,aAAIA,QAAJ,uBAAIA,QAAQ,CAAG,CAAH,CAAZ,CAAL,IAA0B,CAACA,QAAQ,CAAC,CAAD,CAXnC;AAYTqC,MAAAA,KAAK,EAAEP,MAAM,KAAKjB,OAZT;AAaTyB,MAAAA,SAAS,EAAE,IAbF;AAcTC,MAAAA,OAAO,EAAE/B,IAAI,CAACoB,QAAL,OAAoB/B;AAdpB,KAAX;AAiBA,QAAM2C,UAAU,GACdzC,KAAK,IAAIC,QAAT,GACIA,QAAQ,CAAC,CAAD,CAAR,IAAe,CAACA,QAAQ,CAAC,CAAD,CAAxB,GACE8B,MAAM,KAAK9B,QAAQ,CAAC,CAAD,CAAR,CAAYS,OAAZ,EADb,GAEET,QAAQ,CAAC,CAAD,CAAR,IAAeA,QAAQ,CAAC,CAAD,CAAvB,GACA8B,MAAM,IAAI9B,QAAQ,CAAC,CAAD,CAAR,CAAYS,OAAZ,EAAV,IAAmCqB,MAAM,IAAI9B,QAAQ,CAAC,CAAD,CAAR,CAAYS,OAAZ,EAD7C,GAEAU,SALN,GAMIW,MAAM,MAAK9B,QAAL,aAAKA,QAAL,uBAAKA,QAAQ,CAAES,OAAV,EAAL,CAPZ;AASA,QAAMgC,SAAS,GAAGV,EAAE,CAACC,QAAH,GACdU,wBAAMC,YADQ,GAEdH,UAAU,IAAIV,MAAM,KAAKd,OAAO,CAACE,GAAjC,GACAwB,wBAAME,YADN,GAEAzB,SAJJ;AAMA,wBACE,6BAAC,qBAAD;AACE,MAAA,QAAQ,EAAEY,EAAE,CAACC,QAAH,IAAeD,EAAE,CAACG,UAAlB,IAAgC,CAACH,EAAE,CAACQ,OADhD;AAEE,MAAA,GAAG,EAAEd,GAFP;AAGE,MAAA,QAAQ,EAAEM,EAAE,CAACQ,OAAH,IAAc,CAACR,EAAE,CAACC,QAAlB,GAA6BxB,IAAI,CAACqB,OAAL,EAA7B,GAA8CV,SAH1D;AAIE,+BAAgBd,MAAM,CAAC,aAAD,CAAN,IAAyB,UAAzC,cAAuDP,MAAvD,cAAiE2B,GAAjE,CAJF;AAKE,MAAA,SAAS,EAAEiB,wBAAMG,IALnB;AAME,MAAA,OAAO,EAAEd,EAAE,CAACK,OAAH,GAAa;AAAA,eAAMhC,OAAO,CAACI,IAAD,CAAb;AAAA,OAAb,GAAmCW,SAN9C;AAOE,MAAA,OAAO,EAAEY,EAAE,CAACK,OAAH,GAAa;AAAA,eAAMhC,OAAO,EAAb;AAAA,OAAb,GAA+Be,SAP1C;AAQE,MAAA,OAAO,EAAE;AAAA,eAAMhB,QAAO,CAACK,IAAD,CAAb;AAAA;AARX,OAUGuB,EAAE,CAACQ,OAAH,iBACC,6BAAC,gBAAD;AACE,MAAA,SAAS,EAAE,qBACTG,wBAAMjB,GADG,EAETM,EAAE,CAAChC,KAAH,IAAYyC,UAAZ,IAA0BE,wBAAMI,WAFvB,EAGTf,EAAE,CAAChC,KAAH,IAAY2C,wBAAMK,QAHT,EAIT,CAAChB,EAAE,CAACI,UAAH,IAAkB,CAACJ,EAAE,CAAChC,KAAJ,IAAayC,UAAhC,KAAgDE,wBAAMM,aAJ7C,EAKT,CAACR,UAAD,IAAe,CAACT,EAAE,CAACC,QAAnB,IAA+BU,wBAAMO,YAL5B;AADb,oBASE,6BAAC,gBAAD;AAAM,MAAA,IAAI,EAAElB,EAAE,CAACM,KAAf;AAAsB,MAAA,SAAS,EAAEI;AAAjC,OACG,wBAAWjC,IAAX,EAAiB;AAAEd,MAAAA,MAAM,EAANA,MAAF;AAAU+B,MAAAA,GAAG,EAAE;AAAf,KAAjB,CADH,CATF,EAaGnC,QAAQ,iBACP,6BAAC,gBAAD;AAAM,MAAA,KAAK,MAAX;AAAY,MAAA,SAAS,EAAE,qBAAOmD,SAAP,EAAkBC,wBAAMQ,OAAxB;AAAvB,OACG5D,QAAQ,CAAC,wBAAWkB,IAAX,EAAiB;AAAEb,MAAAA,MAAM,EAANA;AAAF,KAAjB,CAAD,CAAR,IAA0C,EAD7C,CAdJ,CAXJ,CADF;AAkCD,GAtEA,CADH,CADF;AA2ED,CAnHM;;;AAqHPN,IAAI,CAAC8D,WAAL,GAAmB,yBAAnB","sourcesContent":["import { dateFormat, parseDate, UTC } from '@mirai/locale';\nimport PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable, Text, View } from '../../primitives';\nimport { DAYS } from './Calendar.constants';\nimport style from './Calendar.module.css';\nimport { getFirstDateOfWeek, getToday } from './helpers';\n\nexport const Week = ({\n  captions,\n  disabledDates = [],\n  disabledPast = false,\n  focus,\n  locale,\n  format,\n  from,\n  month,\n  number,\n  range,\n  selected,\n  to,\n  year,\n  onPress = () => {},\n  onFocus = () => {},\n  ...others\n}) => {\n  const disabledDatesTS = disabledDates\n    .map((date) => UTC(parseDate(date, format)).getTime())\n    .filter((date) => !isNaN(date));\n  const firstDate = getFirstDateOfWeek(number, year);\n  const todayTS = getToday().getTime();\n  const fromTS = from?.getTime();\n  const toTS = to?.getTime();\n\n  let rangeTS = {};\n  if (range) {\n    const [start, end] = selected;\n    rangeTS = { start: start ? start.getTime() : undefined, end: end ? end.getTime() : undefined };\n\n    if (focus) {\n      const focusTS = focus.getTime();\n      const [outbound] = disabledDatesTS.filter((ts) => ts > rangeTS.start && focusTS >= ts).sort();\n\n      rangeTS.end = outbound ? outbound - 1 : focusTS;\n      rangeTS.outbound = outbound - 1;\n    }\n  }\n\n  return (\n    <View row>\n      {DAYS.map((day) => {\n        const date = UTC(new Date(firstDate.getFullYear(), firstDate.getMonth(), firstDate.getDate() + day));\n        const dateTS = date.getTime();\n\n        const is = {\n          disabled:\n            (disabledPast && date.getTime() < todayTS) || // past\n            !date.getMonth() === month || // days out of month\n            disabledDatesTS.includes(dateTS) || // disabled dates\n            dateTS < fromTS || // less than range\n            dateTS > toTS, // more than range\n          outOfRange: dateTS > rangeTS.outbound,\n          range: dateTS > rangeTS.start && dateTS < rangeTS.end,\n          rangeLimit: dateTS === rangeTS.start || dateTS === rangeTS.end,\n          // ranged:\n          ranging: range && selected?.[0] && !selected[1],\n          today: dateTS === todayTS,\n          touchable: true,\n          visible: date.getMonth() === month,\n        };\n\n        const isSelected =\n          range && selected\n            ? selected[0] && !selected[1]\n              ? dateTS === selected[0].getTime()\n              : selected[0] && selected[1]\n              ? dateTS >= selected[0].getTime() && dateTS <= selected[1].getTime()\n              : undefined\n            : dateTS === selected?.getTime();\n\n        const textStyle = is.disabled\n          ? style.textDisabled\n          : isSelected || dateTS === rangeTS.end\n          ? style.textSelected\n          : undefined;\n\n        return (\n          <Pressable\n            disabled={is.disabled || is.outOfRange || !is.visible}\n            key={day}\n            tabIndex={is.visible && !is.disabled ? date.getDate() : undefined}\n            data-testid={`${others['data-testid'] || 'calendar'}-${number}-${day}`}\n            className={style.cell}\n            onEnter={is.ranging ? () => onFocus(date) : undefined}\n            onLeave={is.ranging ? () => onFocus() : undefined}\n            onPress={() => onPress(date)}\n          >\n            {is.visible && (\n              <View\n                className={styles(\n                  style.day,\n                  is.range && isSelected && style.daySelected,\n                  is.range && style.dayRange,\n                  (is.rangeLimit || (!is.range && isSelected)) && style.dayRangeLimit,\n                  !isSelected && !is.disabled && style.dayTouchable,\n                )}\n              >\n                <Text bold={is.today} className={textStyle}>\n                  {dateFormat(date, { locale, day: 'numeric' })}\n                </Text>\n\n                {captions && (\n                  <Text small className={styles(textStyle, style.caption)}>\n                    {captions[dateFormat(date, { format })] || ''}\n                  </Text>\n                )}\n              </View>\n            )}\n          </Pressable>\n        );\n      })}\n    </View>\n  );\n};\n\nWeek.displayName = 'Component:Calendar:Week';\n\nWeek.propTypes = {\n  captions: PropTypes.shape({}),\n  disabledDates: PropTypes.arrayOf(PropTypes.string),\n  disabledPast: PropTypes.bool,\n  focus: PropTypes.object,\n  locale: PropTypes.string,\n  format: PropTypes.string,\n  from: PropTypes.instanceOf(Date),\n  to: PropTypes.instanceOf(Date),\n  year: PropTypes.number.isRequired,\n  month: PropTypes.number.isRequired,\n  number: PropTypes.number.isRequired,\n  range: PropTypes.bool,\n  selected: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]),\n  onFocus: PropTypes.func,\n  onPress: PropTypes.func,\n};\n"],"file":"Calendar.Week.js"}
+{"version":3,"sources":["../../../src/components/Calendar/Calendar.Week.jsx"],"names":["Week","captions","disabledDates","disabledPast","focus","locale","format","from","month","number","range","selected","to","year","onPress","onFocus","others","disabledDatesTS","map","date","getTime","firstDate","todayTS","fromTS","toTS","rangeTS","start","end","undefined","focusTS","filter","ts","sort","outbound","DAYS","day","Date","getFullYear","getMonth","getDate","dateTS","is","disabled","includes","outOfRange","rangeLimit","ranging","today","touchable","visible","isSelected","textStyle","style","textDisabled","textSelected","cell","daySelected","dayRange","dayRangeLimit","dayTouchable","caption","displayName"],"mappings":"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","sourcesContent":["import { dateFormat, parseDate, UTC } from '@mirai/locale';\nimport PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable, Text, View } from '../../primitives';\nimport { DAYS } from './Calendar.constants';\nimport style from './Calendar.module.css';\nimport { getFirstDateOfWeek, getToday } from './helpers';\n\nexport const Week = ({\n  captions,\n  disabledDates = [],\n  disabledPast = false,\n  focus,\n  locale,\n  format,\n  from,\n  month,\n  number,\n  range,\n  selected,\n  to,\n  year,\n  onPress = () => {},\n  onFocus = () => {},\n  ...others\n}) => {\n  const disabledDatesTS = disabledDates.map((date) => UTC(parseDate(date, format)).getTime());\n  const firstDate = getFirstDateOfWeek(number, year);\n  const todayTS = getToday().getTime();\n  const fromTS = from?.getTime();\n  const toTS = to?.getTime();\n\n  let rangeTS = {};\n  if (range) {\n    const [start, end] = selected;\n    rangeTS = { start: start ? start.getTime() : undefined, end: end ? end.getTime() : undefined };\n\n    if (focus) {\n      const focusTS = focus.getTime();\n      const [outbound] = disabledDatesTS.filter((ts) => ts > rangeTS.start && focusTS >= ts).sort();\n\n      rangeTS.end = outbound ? outbound - 1 : focusTS;\n      rangeTS.outbound = outbound - 1;\n    }\n  }\n\n  return (\n    <View row>\n      {DAYS.map((day) => {\n        const date = UTC(new Date(firstDate.getFullYear(), firstDate.getMonth(), firstDate.getDate() + day));\n        const dateTS = date.getTime();\n\n        const is = {\n          disabled:\n            (disabledPast && date.getTime() < todayTS) || // past\n            !date.getMonth() === month || // days out of month\n            disabledDatesTS.includes(dateTS) || // disabled dates\n            dateTS < fromTS || // less than range\n            dateTS > toTS, // more than range\n          outOfRange: dateTS > rangeTS.outbound,\n          range: dateTS > rangeTS.start && dateTS < rangeTS.end,\n          rangeLimit: dateTS === rangeTS.start || dateTS === rangeTS.end,\n          // ranged:\n          ranging: range && selected?.[0] && !selected[1],\n          today: dateTS === todayTS,\n          touchable: true,\n          visible: date.getMonth() === month,\n        };\n\n        const isSelected =\n          range && selected\n            ? selected[0] && !selected[1]\n              ? dateTS === selected[0].getTime()\n              : selected[0] && selected[1]\n              ? dateTS >= selected[0].getTime() && dateTS <= selected[1].getTime()\n              : undefined\n            : dateTS === selected?.getTime();\n\n        const textStyle = is.disabled\n          ? style.textDisabled\n          : isSelected || dateTS === rangeTS.end\n          ? style.textSelected\n          : undefined;\n\n        return (\n          <Pressable\n            disabled={is.disabled || is.outOfRange || !is.visible}\n            key={day}\n            tabIndex={is.visible && !is.disabled ? date.getDate() : undefined}\n            data-testid={`${others['data-testid'] || 'calendar'}-${number}-${day}`}\n            className={style.cell}\n            onEnter={is.ranging ? () => onFocus(date) : undefined}\n            onLeave={is.ranging ? () => onFocus() : undefined}\n            onPress={() => onPress(date)}\n          >\n            {is.visible && (\n              <View\n                className={styles(\n                  style.day,\n                  is.range && isSelected && style.daySelected,\n                  is.range && style.dayRange,\n                  (is.rangeLimit || (!is.range && isSelected)) && style.dayRangeLimit,\n                  !isSelected && !is.disabled && style.dayTouchable,\n                )}\n              >\n                <Text bold={is.today} className={textStyle}>\n                  {dateFormat(date, { locale, day: 'numeric' })}\n                </Text>\n\n                {captions && (\n                  <Text small className={styles(textStyle, style.caption)}>\n                    {captions[dateFormat(date, { format })] || ''}\n                  </Text>\n                )}\n              </View>\n            )}\n          </Pressable>\n        );\n      })}\n    </View>\n  );\n};\n\nWeek.displayName = 'Component:Calendar:Week';\n\nWeek.propTypes = {\n  captions: PropTypes.shape({}),\n  disabledDates: PropTypes.arrayOf(PropTypes.string),\n  disabledPast: PropTypes.bool,\n  focus: PropTypes.object,\n  locale: PropTypes.string,\n  format: PropTypes.string,\n  from: PropTypes.instanceOf(Date),\n  to: PropTypes.instanceOf(Date),\n  year: PropTypes.number.isRequired,\n  month: PropTypes.number.isRequired,\n  number: PropTypes.number.isRequired,\n  range: PropTypes.bool,\n  selected: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]),\n  onFocus: PropTypes.func,\n  onPress: PropTypes.func,\n};\n"],"file":"Calendar.Week.js"}

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

@@ -10,7 +10,7 @@ exports[`component:<Form> prop:children 1`] = `
 <DocumentFragment>
   <form>
     <div
-      class="view inputText"
+      class="view inputContainer"
     >
       <span
         class="text paragraph text label"
@@ -18,7 +18,7 @@ exports[`component:<Form> prop:children 1`] = `
         label
       </span>
       <div
-        class="view content"
+        class="view row inputBorder"
       >
         <input
           class="input input"

package/build/components/InputSelect/InputSelect.js

@@ -0,0 +1,92 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InputSelect = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _helpers = require("../../helpers");
+
+var _primitives = require("../../primitives");
+
+var _InputTextModule = _interopRequireDefault(require("../InputText/InputText.module.css"));
+
+var _excluded = ["disabled", "error", "hint", "label", "onChange", "onEnter", "onLeave"];
+
+var InputSelect = function InputSelect(_ref) {
+  var _others$value;
+
+  var disabled = _ref.disabled,
+      error = _ref.error,
+      hint = _ref.hint,
+      label = _ref.label,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
+      _ref$onEnter = _ref.onEnter,
+      onEnter = _ref$onEnter === void 0 ? function () {} : _ref$onEnter,
+      _ref$onLeave = _ref.onLeave,
+      onLeave = _ref$onLeave === void 0 ? function () {} : _ref$onLeave,
+      others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      focus = _useState2[0],
+      setFocus = _useState2[1];
+
+  var handleChange = function handleChange(value, event) {
+    var _event$target;
+
+    onChange(value, event);
+    (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.blur();
+  };
+
+  var handleEnter = function handleEnter(event) {
+    setFocus(true);
+    onEnter(event);
+  };
+
+  var handleLeave = function handleLeave(event) {
+    setFocus(false);
+    onLeave(event);
+  };
+
+  var has = {
+    value: others.value !== undefined && ((_others$value = others.value) === null || _others$value === void 0 ? void 0 : _others$value.length) > 0
+  };
+  return /*#__PURE__*/_react.default.createElement(_primitives.View, {
+    className: (0, _helpers.styles)(_InputTextModule.default.inputContainer, others.className),
+    style: others.style
+  }, label && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
+    className: (0, _helpers.styles)(_InputTextModule.default.text, _InputTextModule.default.label, focus && _InputTextModule.default.focus, error && _InputTextModule.default.error, (focus || error || has.value) && _InputTextModule.default.value)
+  }, label), /*#__PURE__*/_react.default.createElement(_primitives.View, {
+    row: true,
+    className: (0, _helpers.styles)(_InputTextModule.default.inputBorder, focus && !error && _InputTextModule.default.focus, error && _InputTextModule.default.error)
+  }, /*#__PURE__*/_react.default.createElement(_primitives.Select, Object.assign({}, others, {
+    disabled: disabled,
+    value: others.value || '',
+    className: _InputTextModule.default.input,
+    style: undefined,
+    onChange: handleChange,
+    onEnter: handleEnter,
+    onLeave: handleLeave
+  })), !disabled && /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
+    name: "CloseArrow"
+  })), hint && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
+    small: true,
+    className: (0, _helpers.styles)(_InputTextModule.default.text, _InputTextModule.default.hint, error && _InputTextModule.default.error)
+  }, hint));
+};
+
+exports.InputSelect = InputSelect;
+InputSelect.displayName = 'Component:InputSelect';
+//# sourceMappingURL=InputSelect.js.map

package/build/components/InputSelect/InputSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/InputSelect/InputSelect.jsx"],"names":["InputSelect","disabled","error","hint","label","onChange","onEnter","onLeave","others","focus","setFocus","handleChange","value","event","target","blur","handleEnter","handleLeave","has","undefined","length","style","inputContainer","className","text","inputBorder","input","displayName"],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Icon, Select, Text, View } from '../../primitives';\nimport style from '../InputText/InputText.module.css';\n\nconst InputSelect = ({\n  disabled,\n  error,\n  hint,\n  label,\n  onChange = () => {},\n  onEnter = () => {},\n  onLeave = () => {},\n  ...others\n}) => {\n  const [focus, setFocus] = useState(false);\n\n  const handleChange = (value, event) => {\n    onChange(value, event);\n    event.target?.blur();\n  };\n\n  const handleEnter = (event) => {\n    setFocus(true);\n    onEnter(event);\n  };\n\n  const handleLeave = (event) => {\n    setFocus(false);\n    onLeave(event);\n  };\n\n  const has = {\n    value: others.value !== undefined && others.value?.length > 0,\n  };\n\n  return (\n    <View className={styles(style.inputContainer, others.className)} style={others.style}>\n      {label && (\n        <Text\n          className={styles(\n            style.text,\n            style.label,\n            focus && style.focus,\n            error && style.error,\n            (focus || error || has.value) && style.value,\n          )}\n        >\n          {label}\n        </Text>\n      )}\n\n      <View row className={styles(style.inputBorder, focus && !error && style.focus, error && style.error)}>\n        <Select\n          {...others}\n          disabled={disabled}\n          value={others.value || ''}\n          className={style.input}\n          style={undefined}\n          onChange={handleChange}\n          onEnter={handleEnter}\n          onLeave={handleLeave}\n        />\n        {!disabled && <Icon name=\"CloseArrow\" />}\n      </View>\n\n      {hint && (\n        <Text small className={styles(style.text, style.hint, error && style.error)}>\n          {hint}\n        </Text>\n      )}\n    </View>\n  );\n};\n\nInputSelect.displayName = 'Component:InputSelect';\n\nInputSelect.propTypes = {\n  disabled: PropTypes.bool,\n  error: PropTypes.bool,\n  hint: PropTypes.string,\n  label: PropTypes.string,\n  name: PropTypes.string.isRequired,\n  onChange: PropTypes.func,\n  onEnter: PropTypes.func,\n  onLeave: PropTypes.func,\n};\n\nexport { InputSelect };\n"],"file":"InputSelect.js"}

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

@@ -0,0 +1,490 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`component:<InputSelect> inherit:className 1`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer mirai"
+  >
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select empty input"
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+      <span
+        class="icon"
+      >
+        <svg
+          fill="none"
+          height="1em"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <polyline
+            points="6 9 12 15 18 9"
+          />
+        </svg>
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<InputSelect> prop:disabled 1`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer"
+  >
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select empty input"
+        disabled=""
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<InputSelect> prop:error 1`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer"
+  >
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select empty input"
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+      <span
+        class="icon"
+      >
+        <svg
+          fill="none"
+          height="1em"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <polyline
+            points="6 9 12 15 18 9"
+          />
+        </svg>
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<InputSelect> prop:hint 1`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer"
+  >
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select empty input"
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+      <span
+        class="icon"
+      >
+        <svg
+          fill="none"
+          height="1em"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <polyline
+            points="6 9 12 15 18 9"
+          />
+        </svg>
+      </span>
+    </div>
+    <span
+      class="text small text hint"
+    >
+      hint
+    </span>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<InputSelect> prop:label 1`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer"
+  >
+    <span
+      class="text paragraph text label"
+    >
+      label
+    </span>
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select empty input"
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+      <span
+        class="icon"
+      >
+        <svg
+          fill="none"
+          height="1em"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <polyline
+            points="6 9 12 15 18 9"
+          />
+        </svg>
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<InputSelect> prop:label 2`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer"
+  >
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select input"
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+      <span
+        class="icon"
+      >
+        <svg
+          fill="none"
+          height="1em"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <polyline
+            points="6 9 12 15 18 9"
+          />
+        </svg>
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<InputSelect> renders 1`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer"
+  >
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select empty input"
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+      <span
+        class="icon"
+      >
+        <svg
+          fill="none"
+          height="1em"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <polyline
+            points="6 9 12 15 18 9"
+          />
+        </svg>
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<InputSelect> testID 1`] = `
+<DocumentFragment>
+  <div
+    class="view inputContainer"
+  >
+    <div
+      class="view row inputBorder"
+    >
+      <select
+        class="select empty input"
+        data-testid="mirai"
+        name="name"
+      >
+        <option
+          svalue="one"
+        >
+          one
+        </option>
+        <option
+          svalue="two"
+        >
+          two
+        </option>
+        <option
+          svalue="three"
+        >
+          three
+        </option>
+        <option
+          svalue="four"
+        >
+          four
+        </option>
+        <option
+          svalue="five"
+        >
+          five
+        </option>
+      </select>
+      <span
+        class="icon"
+      >
+        <svg
+          fill="none"
+          height="1em"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <polyline
+            points="6 9 12 15 18 9"
+          />
+        </svg>
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;

package/build/components/InputSelect/index.js

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