@mirai/ui 1.1.0-f → 1.1.2

package/build/primitives/Input/Input.js

@@ -11,7 +11,7 @@ var _helpers = require("../../helpers");
 var _Primitive = require("../Primitive");
 var _helpers2 = require("./helpers");
 var _InputModule = _interopRequireDefault(require("./Input.module.css"));
-var _excluded = ["autoResize", "disabled", "multiLine", "type", "onChange", "onEnter", "onError", "onLeave"];
+var _excluded = ["autoResize", "disabled", "max", "min", "multiLine", "type", "onChange", "onEnter", "onError", "onLeave"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -31,6 +31,10 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 var Input = function Input(_ref) {
   var autoResize = _ref.autoResize,
     disabled = _ref.disabled,
+    _ref$max = _ref.max,
+    max = _ref$max === void 0 ? 0 : _ref$max,
+    _ref$min = _ref.min,
+    min = _ref$min === void 0 ? 0 : _ref$min,
     multiLine = _ref.multiLine,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'text' : _ref$type,
@@ -64,7 +68,7 @@ var Input = function Input(_ref) {
       type: type,
       value: value
     })));
-    onChange && onChange(value || '', event);
+    onChange && onChange(value !== undefined ? type === 'number' && (max || min) ? Math.min(Math.max(value, min ? min : value), max ? max : value) : value : '', event);
     if (autoResize && multiLine) resize(value);
   };
   var resize = function resize(value) {
@@ -78,7 +82,7 @@ var Input = function Input(_ref) {
     tag: multiLine ? 'textarea' : 'input',
     test: undefined,
     type: !multiLine ? type : undefined,
-    value: others.value || ''
+    value: others.value !== undefined ? others.value : ''
   }, !disabled ? {
     onChange: function onChange(event) {
       return handleChange(event.target.value, event);
@@ -94,6 +98,8 @@ Input.displayName = 'Primitive:Input';
 Input.propTypes = {
   autoResize: _propTypes.default.bool,
   disabled: _propTypes.default.bool,
+  max: _propTypes.default.number,
+  min: _propTypes.default.number,
   multiLine: _propTypes.default.bool,
   name: _propTypes.default.string.isRequired,
   type: _propTypes.default.string,

package/build/primitives/Input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","names":["Input","autoResize","disabled","multiLine","type","onChange","onEnter","onError","onLeave","others","ref","useRef","useState","height","setHeight","useEffect","errors","getInputErrors","current","clientHeight","resize","value","handleChange","next","event","isNaN","parseValue","style","scrollHeight","React","createElement","Primitive","undefined","role","tag","test","target","onFocus","onBlur","className","styles","input","displayName","propTypes","PropTypes","bool","name","string","isRequired","func"],"sources":["../../../src/primitives/Input/Input.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { getInputErrors, styles } from '../../helpers';\nimport { Primitive } from '../Primitive';\nimport { parseValue } from './helpers';\nimport style from './Input.module.css';\n\nconst Input = ({ autoResize, disabled, multiLine, type = 'text', onChange, onEnter, onError, onLeave, ...others }) => {\n  const ref = useRef(null);\n\n  const [height, setHeight] = useState();\n\n  useEffect(() => {\n    const errors = getInputErrors({ ...others, type });\n    if (errors && onError) onError(errors);\n\n    if (autoResize && multiLine) {\n      setHeight(ref.current.clientHeight);\n      resize(others.value);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleChange = (next = '', event) => {\n    if (type === 'number' && isNaN(next)) return;\n    const value = parseValue(next, type, others);\n\n    onError && onError(getInputErrors({ ...others, type, value }));\n    onChange && onChange(value || '', event);\n    if (autoResize && multiLine) resize(value);\n  };\n\n  const resize = (value) => {\n    if (!ref?.current) return;\n    ref.current.style.height = `${value ? ref.current.scrollHeight : height}px`;\n  };\n\n  return React.createElement(Primitive, {\n    ...others,\n    disabled,\n    ref: autoResize ? ref : undefined,\n    role: others.role || 'input',\n    tag: multiLine ? 'textarea' : 'input',\n    test: undefined,\n    type: !multiLine ? type : undefined,\n    value: others.value || '',\n    ...(!disabled\n      ? {\n          onChange: (event) => handleChange(event.target.value, event),\n          onFocus: onEnter,\n          onBlur: onLeave,\n        }\n      : {}),\n    className: styles(style.input, autoResize && multiLine && style.autoResize, others.className),\n  });\n};\n\nInput.displayName = 'Primitive:Input';\n\nInput.propTypes = {\n  autoResize: PropTypes.bool,\n  disabled: PropTypes.bool,\n  multiLine: PropTypes.bool,\n  name: PropTypes.string.isRequired,\n  type: PropTypes.string,\n  onChange: PropTypes.func,\n  onEnter: PropTypes.func,\n  onError: PropTypes.func,\n  onLeave: PropTypes.func,\n};\n\nexport { Input };\n"],"mappings":"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"}
+{"version":3,"file":"Input.js","names":["Input","autoResize","disabled","max","min","multiLine","type","onChange","onEnter","onError","onLeave","others","ref","useRef","useState","height","setHeight","useEffect","errors","getInputErrors","current","clientHeight","resize","value","handleChange","next","event","isNaN","parseValue","undefined","Math","style","scrollHeight","React","createElement","Primitive","role","tag","test","target","onFocus","onBlur","className","styles","input","displayName","propTypes","PropTypes","bool","number","name","string","isRequired","func"],"sources":["../../../src/primitives/Input/Input.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { getInputErrors, styles } from '../../helpers';\nimport { Primitive } from '../Primitive';\nimport { parseValue } from './helpers';\nimport style from './Input.module.css';\n\nconst Input = ({\n  autoResize,\n  disabled,\n  max = 0,\n  min = 0,\n  multiLine,\n  type = 'text',\n  onChange,\n  onEnter,\n  onError,\n  onLeave,\n  ...others\n}) => {\n  const ref = useRef(null);\n\n  const [height, setHeight] = useState();\n\n  useEffect(() => {\n    const errors = getInputErrors({ ...others, type });\n    if (errors && onError) onError(errors);\n\n    if (autoResize && multiLine) {\n      setHeight(ref.current.clientHeight);\n      resize(others.value);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleChange = (next = '', event) => {\n    if (type === 'number' && isNaN(next)) return;\n    const value = parseValue(next, type, others);\n\n    onError && onError(getInputErrors({ ...others, type, value }));\n    onChange &&\n      onChange(\n        value !== undefined\n          ? type === 'number' && (max || min)\n            ? Math.min(Math.max(value, min ? min : value), max ? max : value)\n            : value\n          : '',\n        event,\n      );\n    if (autoResize && multiLine) resize(value);\n  };\n\n  const resize = (value) => {\n    if (!ref?.current) return;\n    ref.current.style.height = `${value ? ref.current.scrollHeight : height}px`;\n  };\n\n  return React.createElement(Primitive, {\n    ...others,\n    disabled,\n    ref: autoResize ? ref : undefined,\n    role: others.role || 'input',\n    tag: multiLine ? 'textarea' : 'input',\n    test: undefined,\n    type: !multiLine ? type : undefined,\n    value: others.value !== undefined ? others.value : '',\n    ...(!disabled\n      ? {\n          onChange: (event) => handleChange(event.target.value, event),\n          onFocus: onEnter,\n          onBlur: onLeave,\n        }\n      : {}),\n    className: styles(style.input, autoResize && multiLine && style.autoResize, others.className),\n  });\n};\n\nInput.displayName = 'Primitive:Input';\n\nInput.propTypes = {\n  autoResize: PropTypes.bool,\n  disabled: PropTypes.bool,\n  max: PropTypes.number,\n  min: PropTypes.number,\n  multiLine: PropTypes.bool,\n  name: PropTypes.string.isRequired,\n  type: PropTypes.string,\n  onChange: PropTypes.func,\n  onEnter: PropTypes.func,\n  onError: PropTypes.func,\n  onLeave: PropTypes.func,\n};\n\nexport { Input };\n"],"mappings":"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"}

package/build/primitives/Input/Input.stories.js

@@ -43,6 +43,8 @@ Story.storyName = 'Input';
 Story.args = {
   autoResize: false,
   disabled: false,
+  max: 100,
+  min: 1,
   multiLine: false,
   name: 'Input',
   placeholder: 'placeholder',

package/build/primitives/Input/Input.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.stories.js","names":["title","Story","props","useState","value","setValue","handleChange","next","others","console","log","storyName","args","autoResize","disabled","multiLine","name","placeholder","type","onEnter","onError","onLeave","testId","style","argTypes","options","control","defaultValue"],"sources":["../../../src/primitives/Input/Input.stories.jsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport { Input } from './Input';\n\nexport default { title: 'Primitives' };\n\nexport const Story = (props) => {\n  const [value, setValue] = useState();\n\n  const handleChange = (next, ...others) => {\n    setValue(next);\n    console.log('<Input>::onChange', next, ...others);\n  };\n\n  return <Input {...props} value={value} onChange={handleChange} />;\n};\n\nStory.storyName = 'Input';\n\nStory.args = {\n  autoResize: false,\n  disabled: false,\n  multiLine: false,\n  name: 'Input',\n  placeholder: 'placeholder',\n  type: 'text',\n  onEnter: (...props) => console.log('<Select>::onEnter', ...props),\n  onError: (...props) => console.log('<Select>::onError', ...props),\n  onLeave: (...props) => console.log('<Select>::onLeave', ...props),\n  // inherited properties\n  testId: 'test-story',\n  style: {},\n};\n\nStory.argTypes = {\n  type: {\n    options: ['text', 'password', 'number', 'email', 'date'],\n    control: { type: 'select' },\n    defaultValue: 'text',\n  },\n};\n"],"mappings":";;;;;;;AAAA;AAEA;AAAgC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAEjB;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAE/B,IAAMC,KAAK,GAAG,SAARA,KAAK,CAAIC,KAAK,EAAK;EAC9B,gBAA0B,IAAAC,eAAQ,GAAE;IAAA;IAA7BC,KAAK;IAAEC,QAAQ;EAEtB,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,IAAI,EAAgB;IAAA;IACxCF,QAAQ,CAACE,IAAI,CAAC;IAAC,kCADcC,MAAM;MAANA,MAAM;IAAA;IAEnC,YAAAC,OAAO,EAACC,GAAG,kBAAC,mBAAmB,EAAEH,IAAI,SAAKC,MAAM,EAAC;EACnD,CAAC;EAED,oBAAO,6BAAC,YAAK,eAAKN,KAAK;IAAE,KAAK,EAAEE,KAAM;IAAC,QAAQ,EAAEE;EAAa,GAAG;AACnE,CAAC;AAAC;AAEFL,KAAK,CAACU,SAAS,GAAG,OAAO;AAEzBV,KAAK,CAACW,IAAI,GAAG;EACXC,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAE,KAAK;EACfC,SAAS,EAAE,KAAK;EAChBC,IAAI,EAAE,OAAO;EACbC,WAAW,EAAE,aAAa;EAC1BC,IAAI,EAAE,MAAM;EACZC,OAAO,EAAE;IAAA;IAAA,mCAAIjB,KAAK;MAALA,KAAK;IAAA;IAAA,OAAK,aAAAO,OAAO,EAACC,GAAG,mBAAC,mBAAmB,SAAKR,KAAK,EAAC;EAAA;EACjEkB,OAAO,EAAE;IAAA;IAAA,mCAAIlB,KAAK;MAALA,KAAK;IAAA;IAAA,OAAK,aAAAO,OAAO,EAACC,GAAG,mBAAC,mBAAmB,SAAKR,KAAK,EAAC;EAAA;EACjEmB,OAAO,EAAE;IAAA;IAAA,mCAAInB,KAAK;MAALA,KAAK;IAAA;IAAA,OAAK,aAAAO,OAAO,EAACC,GAAG,mBAAC,mBAAmB,SAAKR,KAAK,EAAC;EAAA;EACjE;EACAoB,MAAM,EAAE,YAAY;EACpBC,KAAK,EAAE,CAAC;AACV,CAAC;AAEDtB,KAAK,CAACuB,QAAQ,GAAG;EACfN,IAAI,EAAE;IACJO,OAAO,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC;IACxDC,OAAO,EAAE;MAAER,IAAI,EAAE;IAAS,CAAC;IAC3BS,YAAY,EAAE;EAChB;AACF,CAAC"}
+{"version":3,"file":"Input.stories.js","names":["title","Story","props","useState","value","setValue","handleChange","next","others","console","log","storyName","args","autoResize","disabled","max","min","multiLine","name","placeholder","type","onEnter","onError","onLeave","testId","style","argTypes","options","control","defaultValue"],"sources":["../../../src/primitives/Input/Input.stories.jsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport { Input } from './Input';\n\nexport default { title: 'Primitives' };\n\nexport const Story = (props) => {\n  const [value, setValue] = useState();\n\n  const handleChange = (next, ...others) => {\n    setValue(next);\n    console.log('<Input>::onChange', next, ...others);\n  };\n\n  return <Input {...props} value={value} onChange={handleChange} />;\n};\n\nStory.storyName = 'Input';\n\nStory.args = {\n  autoResize: false,\n  disabled: false,\n  max: 100,\n  min: 1,\n  multiLine: false,\n  name: 'Input',\n  placeholder: 'placeholder',\n  type: 'text',\n  onEnter: (...props) => console.log('<Select>::onEnter', ...props),\n  onError: (...props) => console.log('<Select>::onError', ...props),\n  onLeave: (...props) => console.log('<Select>::onLeave', ...props),\n  // inherited properties\n  testId: 'test-story',\n  style: {},\n};\n\nStory.argTypes = {\n  type: {\n    options: ['text', 'password', 'number', 'email', 'date'],\n    control: { type: 'select' },\n    defaultValue: 'text',\n  },\n};\n"],"mappings":";;;;;;;AAAA;AAEA;AAAgC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAEjB;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAE/B,IAAMC,KAAK,GAAG,SAARA,KAAK,CAAIC,KAAK,EAAK;EAC9B,gBAA0B,IAAAC,eAAQ,GAAE;IAAA;IAA7BC,KAAK;IAAEC,QAAQ;EAEtB,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,IAAI,EAAgB;IAAA;IACxCF,QAAQ,CAACE,IAAI,CAAC;IAAC,kCADcC,MAAM;MAANA,MAAM;IAAA;IAEnC,YAAAC,OAAO,EAACC,GAAG,kBAAC,mBAAmB,EAAEH,IAAI,SAAKC,MAAM,EAAC;EACnD,CAAC;EAED,oBAAO,6BAAC,YAAK,eAAKN,KAAK;IAAE,KAAK,EAAEE,KAAM;IAAC,QAAQ,EAAEE;EAAa,GAAG;AACnE,CAAC;AAAC;AAEFL,KAAK,CAACU,SAAS,GAAG,OAAO;AAEzBV,KAAK,CAACW,IAAI,GAAG;EACXC,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAE,KAAK;EACfC,GAAG,EAAE,GAAG;EACRC,GAAG,EAAE,CAAC;EACNC,SAAS,EAAE,KAAK;EAChBC,IAAI,EAAE,OAAO;EACbC,WAAW,EAAE,aAAa;EAC1BC,IAAI,EAAE,MAAM;EACZC,OAAO,EAAE;IAAA;IAAA,mCAAInB,KAAK;MAALA,KAAK;IAAA;IAAA,OAAK,aAAAO,OAAO,EAACC,GAAG,mBAAC,mBAAmB,SAAKR,KAAK,EAAC;EAAA;EACjEoB,OAAO,EAAE;IAAA;IAAA,mCAAIpB,KAAK;MAALA,KAAK;IAAA;IAAA,OAAK,aAAAO,OAAO,EAACC,GAAG,mBAAC,mBAAmB,SAAKR,KAAK,EAAC;EAAA;EACjEqB,OAAO,EAAE;IAAA;IAAA,mCAAIrB,KAAK;MAALA,KAAK;IAAA;IAAA,OAAK,aAAAO,OAAO,EAACC,GAAG,mBAAC,mBAAmB,SAAKR,KAAK,EAAC;EAAA;EACjE;EACAsB,MAAM,EAAE,YAAY;EACpBC,KAAK,EAAE,CAAC;AACV,CAAC;AAEDxB,KAAK,CAACyB,QAAQ,GAAG;EACfN,IAAI,EAAE;IACJO,OAAO,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC;IACxDC,OAAO,EAAE;MAAER,IAAI,EAAE;IAAS,CAAC;IAC3BS,YAAY,EAAE;EAChB;AACF,CAAC"}

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

@@ -34,6 +34,28 @@ exports[`primitive:<Input> prop:disabled 1`] = `
 </DocumentFragment>
 `;
 
+exports[`primitive:<Input> prop:max 1`] = `
+<DocumentFragment>
+  <input
+    class="input"
+    name="name"
+    type="number"
+    value=""
+  />
+</DocumentFragment>
+`;
+
+exports[`primitive:<Input> prop:min 1`] = `
+<DocumentFragment>
+  <input
+    class="input"
+    name="name"
+    type="number"
+    value=""
+  />
+</DocumentFragment>
+`;
+
 exports[`primitive:<Input> prop:multiLine && prop:autoResize 1`] = `
 <DocumentFragment>
   <textarea

package/build/primitives/Layer/Layer.js

@@ -33,7 +33,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 var Layer = function Layer(_ref) {
   var forceBottom = _ref.bottom,
     centered = _ref.centered,
-    fixed = _ref.fixed,
+    propFixed = _ref.fixed,
     _ref$forceRender = _ref.forceRender,
     forceRender = _ref$forceRender === void 0 ? true : _ref$forceRender,
     forceLeft = _ref.left,
@@ -49,8 +49,12 @@ var Layer = function Layer(_ref) {
   var contentRef = (0, _react.useRef)();
   var _useState = (0, _react.useState)(),
     _useState2 = _slicedToArray(_useState, 2),
-    position = _useState2[0],
-    setPosition = _useState2[1];
+    fixed = _useState2[0],
+    setFixed = _useState2[1];
+  var _useState3 = (0, _react.useState)(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    position = _useState4[0],
+    setPosition = _useState4[1];
   (0, _react.useLayoutEffect)(function () {
     var content = contentRef === null || contentRef === void 0 ? void 0 : contentRef.current;
     if (!content || typeof ResizeObserver === 'undefined') return;
@@ -91,6 +95,7 @@ var Layer = function Layer(_ref) {
       top = _getLayerPosition$top === void 0 ? 0 : _getLayerPosition$top,
       _getLayerPosition$ori = _getLayerPosition.orientation,
       orientation = _getLayerPosition$ori === void 0 ? {} : _getLayerPosition$ori;
+    setFixed(propFixed || (0, _helpers2.isComponentFixed)(componentEl));
     setPosition({
       left: "".concat(left, "px"),
       top: "".concat(top, "px")
@@ -106,7 +111,8 @@ var Layer = function Layer(_ref) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Primitive.Primitive, {
     ref: componentRef,
     role: others.role || 'layer',
-    tag: "layer",
+    tag: "span",
+    className: _LayerModule.default.container,
     testId: others.testId
   }, children.find(function (_ref2) {
     var name = _ref2.type.name;
@@ -114,7 +120,6 @@ var Layer = function Layer(_ref) {
   })), (forceRender || visible) && /*#__PURE__*/_react.default.createElement(_Primitive.Primitive, {
     ref: contentRef,
     role: others.role ? "".concat(others.role, "-content") : 'layer-content',
-    tag: "layer_content",
     className: (0, _helpers.styles)(_LayerModule.default.layer, fixed && _LayerModule.default.fixed, !visible && _LayerModule.default.hidden),
     style: _objectSpread({}, position)
   }, /*#__PURE__*/_react.default.createElement(createWrapper ? 'div' : _react.default.Fragment, createWrapper ? {
@@ -126,6 +131,7 @@ var Layer = function Layer(_ref) {
   }))));
 };
 exports.Layer = Layer;
+Layer.displayName = 'Primitive:Layer';
 Layer.propTypes = {
   bottom: _propTypes.default.bool,
   centered: _propTypes.default.bool,

package/build/primitives/Layer/Layer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layer.js","names":["Layer","forceBottom","bottom","centered","fixed","forceRender","forceLeft","left","forceRight","right","forceTop","top","timestamp","visible","onPosition","others","device","useDevice","componentRef","useRef","contentRef","useState","position","setPosition","useLayoutEffect","content","current","ResizeObserver","observer","calcPosition","observe","unobserve","componentEl","firstChild","contentEl","componentLayout","getElementLayout","scrollTop","getScrollParent","contentLayout","modal","getModalParent","getLayerPosition","orientation","children","React","Children","map","child","className","contentStyle","style","createWrapper","role","testId","find","name","type","LayerContent","styles","layer","hidden","createElement","Fragment","undefined","propTypes","PropTypes","bool","node","number","func"],"sources":["../../../src/primitives/Layer/Layer.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Primitive } from '../Primitive';\nimport { getElementLayout, getLayerPosition, getModalParent, getScrollParent } from './helpers';\nimport style from './Layer.module.css';\nimport { LayerContent } from './LayerContent';\n\nconst Layer = ({\n  bottom: forceBottom,\n  centered,\n  fixed,\n  forceRender = true,\n  left: forceLeft,\n  right: forceRight,\n  top: forceTop,\n  timestamp,\n  visible,\n  onPosition = () => {},\n  ...others\n}) => {\n  const device = useDevice();\n  const componentRef = useRef();\n  const contentRef = useRef();\n\n  const [position, setPosition] = useState();\n\n  useLayoutEffect(() => {\n    const content = contentRef?.current;\n    if (!content || typeof ResizeObserver === 'undefined') return;\n\n    const observer = new ResizeObserver(calcPosition);\n    observer.observe(content);\n\n    return () => observer.unobserve(content);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useLayoutEffect(\n    () => calcPosition(),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [centered, device, forceBottom, forceLeft, forceRight, forceTop, timestamp, visible],\n  );\n\n  const calcPosition = () => {\n    const { current: { firstChild: componentEl } = {} } = componentRef;\n    const { current: contentEl } = contentRef;\n\n    if (!componentEl || !contentEl) return setPosition();\n\n    const componentLayout = { ...getElementLayout(componentEl), scrollTop: getScrollParent(componentEl)?.scrollTop };\n    const contentLayout = getElementLayout(contentEl);\n    const modal = getModalParent(componentEl);\n    const {\n      left = 0,\n      top = 0,\n      orientation = {},\n    } = getLayerPosition(componentLayout, contentLayout, device, modal, {\n      centered,\n      forceBottom,\n      forceLeft,\n      forceRight,\n      forceTop,\n    });\n\n    setPosition({ left: `${left}px`, top: `${top}px` });\n    onPosition(orientation);\n  };\n\n  const children = React.Children.map(others.children || [], (child) => child);\n  const { className, style: contentStyle } = others;\n  const createWrapper = className || contentStyle;\n\n  return (\n    <>\n      <Primitive ref={componentRef} role={others.role || 'layer'} tag=\"layer\" testId={others.testId}>\n        {children.find(({ type: { name } }) => name !== LayerContent.name)}\n      </Primitive>\n\n      {(forceRender || visible) && (\n        <Primitive\n          ref={contentRef}\n          role={others.role ? `${others.role}-content` : 'layer-content'}\n          tag=\"layer_content\"\n          className={styles(style.layer, fixed && style.fixed, !visible && style.hidden)}\n          style={{ ...position }}\n        >\n          {React.createElement(\n            createWrapper ? 'div' : React.Fragment,\n            createWrapper ? { className, style: contentStyle } : undefined,\n            children?.find(({ type: { name } }) => name === LayerContent.name),\n          )}\n        </Primitive>\n      )}\n    </>\n  );\n};\n\nLayer.propTypes = {\n  bottom: PropTypes.bool,\n  centered: PropTypes.bool,\n  children: PropTypes.node,\n  fixed: PropTypes.bool,\n  forceRender: PropTypes.bool,\n  left: PropTypes.bool,\n  right: PropTypes.bool,\n  timestamp: PropTypes.number,\n  top: PropTypes.bool,\n  visible: PropTypes.bool,\n  onPosition: PropTypes.func,\n};\n\nexport { Layer };\n"],"mappings":"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"}
+{"version":3,"file":"Layer.js","names":["Layer","forceBottom","bottom","centered","propFixed","fixed","forceRender","forceLeft","left","forceRight","right","forceTop","top","timestamp","visible","onPosition","others","device","useDevice","componentRef","useRef","contentRef","useState","setFixed","position","setPosition","useLayoutEffect","content","current","ResizeObserver","observer","calcPosition","observe","unobserve","componentEl","firstChild","contentEl","componentLayout","getElementLayout","scrollTop","getScrollParent","contentLayout","modal","getModalParent","getLayerPosition","orientation","isComponentFixed","children","React","Children","map","child","className","contentStyle","style","createWrapper","role","container","testId","find","name","type","LayerContent","styles","layer","hidden","createElement","Fragment","undefined","displayName","propTypes","PropTypes","bool","node","number","func"],"sources":["../../../src/primitives/Layer/Layer.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { useDevice } from '../../hooks';\nimport { Primitive } from '../Primitive';\nimport { getElementLayout, getLayerPosition, getModalParent, getScrollParent, isComponentFixed } from './helpers';\nimport style from './Layer.module.css';\nimport { LayerContent } from './LayerContent';\n\nconst Layer = ({\n  bottom: forceBottom,\n  centered,\n  fixed: propFixed,\n  forceRender = true,\n  left: forceLeft,\n  right: forceRight,\n  top: forceTop,\n  timestamp,\n  visible,\n  onPosition = () => {},\n  ...others\n}) => {\n  const device = useDevice();\n  const componentRef = useRef();\n  const contentRef = useRef();\n\n  const [fixed, setFixed] = useState();\n  const [position, setPosition] = useState();\n\n  useLayoutEffect(() => {\n    const content = contentRef?.current;\n    if (!content || typeof ResizeObserver === 'undefined') return;\n\n    const observer = new ResizeObserver(calcPosition);\n    observer.observe(content);\n\n    return () => observer.unobserve(content);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useLayoutEffect(\n    () => calcPosition(),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [centered, device, forceBottom, forceLeft, forceRight, forceTop, timestamp, visible],\n  );\n\n  const calcPosition = () => {\n    const { current: { firstChild: componentEl } = {} } = componentRef;\n    const { current: contentEl } = contentRef;\n\n    if (!componentEl || !contentEl) return setPosition();\n\n    const componentLayout = { ...getElementLayout(componentEl), scrollTop: getScrollParent(componentEl)?.scrollTop };\n    const contentLayout = getElementLayout(contentEl);\n    const modal = getModalParent(componentEl);\n    const {\n      left = 0,\n      top = 0,\n      orientation = {},\n    } = getLayerPosition(componentLayout, contentLayout, device, modal, {\n      centered,\n      forceBottom,\n      forceLeft,\n      forceRight,\n      forceTop,\n    });\n\n    setFixed(propFixed || isComponentFixed(componentEl));\n    setPosition({ left: `${left}px`, top: `${top}px` });\n    onPosition(orientation);\n  };\n\n  const children = React.Children.map(others.children || [], (child) => child);\n  const { className, style: contentStyle } = others;\n  const createWrapper = className || contentStyle;\n\n  return (\n    <>\n      <Primitive\n        ref={componentRef}\n        role={others.role || 'layer'}\n        tag=\"span\"\n        className={style.container}\n        testId={others.testId}\n      >\n        {children.find(({ type: { name } }) => name !== LayerContent.name)}\n      </Primitive>\n\n      {(forceRender || visible) && (\n        <Primitive\n          ref={contentRef}\n          role={others.role ? `${others.role}-content` : 'layer-content'}\n          className={styles(style.layer, fixed && style.fixed, !visible && style.hidden)}\n          style={{ ...position }}\n        >\n          {React.createElement(\n            createWrapper ? 'div' : React.Fragment,\n            createWrapper ? { className, style: contentStyle } : undefined,\n            children?.find(({ type: { name } }) => name === LayerContent.name),\n          )}\n        </Primitive>\n      )}\n    </>\n  );\n};\n\nLayer.displayName = 'Primitive:Layer';\n\nLayer.propTypes = {\n  bottom: PropTypes.bool,\n  centered: PropTypes.bool,\n  children: PropTypes.node,\n  fixed: PropTypes.bool,\n  forceRender: PropTypes.bool,\n  left: PropTypes.bool,\n  right: PropTypes.bool,\n  timestamp: PropTypes.number,\n  top: PropTypes.bool,\n  visible: PropTypes.bool,\n  onPosition: PropTypes.func,\n};\n\nexport { Layer };\n"],"mappings":"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"}

package/build/primitives/Layer/Layer.module.css

@@ -1,3 +1,7 @@
+.container {
+  width: fit-content;
+}
+
 .layer {
   z-index: var(--mirai-ui-layer-content);
 }

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

@@ -2,21 +2,25 @@
 
 exports[`primitive:<Layer> inherit:className 1`] = `
 <DocumentFragment>
-  <ui_layer />
-  <ui_layer_content
+  <span
+    class="container"
+  />
+  <div
     class="layer hidden"
   >
     <div
       class="mirai"
     />
-  </ui_layer_content>
+  </div>
 </DocumentFragment>
 `;
 
 exports[`primitive:<Layer> renders 1`] = `
 <DocumentFragment>
-  <ui_layer />
-  <ui_layer_content
+  <span
+    class="container"
+  />
+  <div
     class="layer hidden"
   />
 </DocumentFragment>
@@ -24,10 +28,11 @@ exports[`primitive:<Layer> renders 1`] = `
 
 exports[`primitive:<Layer> testId 1`] = `
 <DocumentFragment>
-  <ui_layer
+  <span
+    class="container"
     data-testid="mirai"
   />
-  <ui_layer_content
+  <div
     class="layer hidden"
   />
 </DocumentFragment>
@@ -35,61 +40,89 @@ exports[`primitive:<Layer> testId 1`] = `
 
 exports[`primitive:<Layer> w/ centered && visible 1`] = `
 <DocumentFragment>
-  <ui_layer>
+  <span
+    class="container"
+  >
     <button
       class="pressable button"
-      tabindex="0"
     >
       Action
     </button>
-  </ui_layer>
-  <ui_layer_content
+  </span>
+  <div
     class="layer"
     style="left: 0px; top: 0px;"
   >
-    <ui_text
+    <span
+      class="text paragraph"
+    >
+      Mirai
+    </span>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`primitive:<Layer> w/ child fixed 1`] = `
+<DocumentFragment>
+  <span
+    class="container"
+  >
+    <button
+      class="pressable button"
+      style="position: fixed;"
+    >
+      Action
+    </button>
+  </span>
+  <div
+    class="layer fixed hidden"
+    style="left: 0px; top: 0px;"
+  >
+    <span
       class="text paragraph"
     >
       Mirai
-    </ui_text>
-  </ui_layer_content>
+    </span>
+  </div>
 </DocumentFragment>
 `;
 
 exports[`primitive:<Layer> w/ component & <LayerContent> 1`] = `
 <DocumentFragment>
-  <ui_layer>
+  <span
+    class="container"
+  >
     <button
       class="pressable button"
-      tabindex="0"
     >
       Action
     </button>
-  </ui_layer>
-  <ui_layer_content
+  </span>
+  <div
     class="layer hidden"
     style="left: 0px; top: 0px;"
   >
-    <ui_text
+    <span
       class="text paragraph"
     >
       Mirai
-    </ui_text>
-  </ui_layer_content>
+    </span>
+  </div>
 </DocumentFragment>
 `;
 
 exports[`primitive:<Layer> w/ component 1`] = `
 <DocumentFragment>
-  <ui_layer>
+  <span
+    class="container"
+  >
     <button
       class="pressable button"
-      tabindex="0"
     >
       Action
     </button>
-  </ui_layer>
-  <ui_layer_content
+  </span>
+  <div
     class="layer hidden"
     style="left: 0px; top: 0px;"
   />
@@ -98,59 +131,62 @@ exports[`primitive:<Layer> w/ component 1`] = `
 
 exports[`primitive:<Layer> w/ fixed 1`] = `
 <DocumentFragment>
-  <ui_layer>
+  <span
+    class="container"
+  >
     <button
       class="pressable button"
-      tabindex="0"
     >
       Action
     </button>
-  </ui_layer>
-  <ui_layer_content
+  </span>
+  <div
     class="layer fixed hidden"
     style="left: 0px; top: 0px;"
   >
-    <ui_text
+    <span
       class="text paragraph"
     >
       Mirai
-    </ui_text>
-  </ui_layer_content>
+    </span>
+  </div>
 </DocumentFragment>
 `;
 
 exports[`primitive:<Layer> w/ forceRender={false} & <LayerContent> 1`] = `
 <DocumentFragment>
-  <ui_layer>
+  <span
+    class="container"
+  >
     <button
       class="pressable button"
-      tabindex="0"
     >
       Action
     </button>
-  </ui_layer>
+  </span>
 </DocumentFragment>
 `;
 
 exports[`primitive:<Layer> w/ visible 1`] = `
 <DocumentFragment>
-  <ui_layer>
+  <span
+    class="container"
+  >
     <button
       class="pressable button"
-      tabindex="0"
     >
       Action
     </button>
-  </ui_layer>
-  <ui_layer_content
+  </span>
+  <div
     class="layer"
     style="left: 0px; top: 0px;"
   >
-    <ui_text
+    <span
       class="text paragraph"
     >
       Mirai
-    </ui_text>
-  </ui_layer_content>
+    </span>
+  </div>
 </DocumentFragment>
 `;

package/build/primitives/Layer/helpers/index.js

@@ -47,4 +47,15 @@ Object.keys(_getScrollParent).forEach(function (key) {
     }
   });
 });
+var _isComponentFixed = require("./isComponentFixed");
+Object.keys(_isComponentFixed).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _isComponentFixed[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _isComponentFixed[key];
+    }
+  });
+});
 //# sourceMappingURL=index.js.map

package/build/primitives/Layer/helpers/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/primitives/Layer/helpers/index.js"],"sourcesContent":["export * from './getElementLayout';\nexport * from './getLayerPosition';\nexport * from './getModalParent';\nexport * from './getScrollParent';\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/primitives/Layer/helpers/index.js"],"sourcesContent":["export * from './getElementLayout';\nexport * from './getLayerPosition';\nexport * from './getModalParent';\nexport * from './getScrollParent';\nexport * from './isComponentFixed';\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

package/build/primitives/Layer/helpers/isComponentFixed.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isComponentFixed = void 0;
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+var isComponentFixed = function isComponentFixed(node) {
+  if (!node) return;
+  var getValue = function getValue(nodes) {
+    if (!(nodes !== null && nodes !== void 0 && nodes.length)) return;
+    var _iterator = _createForOfIteratorHelper(nodes),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var _node = _step.value;
+        var _getComputedStyle = getComputedStyle(_node),
+          position = _getComputedStyle.position;
+        if (position === 'fixed' || getValue(_node.children)) return true;
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  };
+  return getValue([node]);
+};
+exports.isComponentFixed = isComponentFixed;
+//# sourceMappingURL=isComponentFixed.js.map

package/build/primitives/Layer/helpers/isComponentFixed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isComponentFixed.js","names":["isComponentFixed","node","getValue","nodes","length","getComputedStyle","position","children"],"sources":["../../../../src/primitives/Layer/helpers/isComponentFixed.js"],"sourcesContent":["export const isComponentFixed = (node) => {\n  if (!node) return;\n\n  const getValue = (nodes) => {\n    if (!nodes?.length) return;\n\n    for (const node of nodes) {\n      const { position } = getComputedStyle(node);\n\n      if (position === 'fixed' || getValue(node.children)) return true;\n    }\n  };\n\n  return getValue([node]);\n};\n"],"mappings":";;;;;;;;;AAAO,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIC,IAAI,EAAK;EACxC,IAAI,CAACA,IAAI,EAAE;EAEX,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,CAAIC,KAAK,EAAK;IAC1B,IAAI,EAACA,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEC,MAAM,GAAE;IAAO,2CAERD,KAAK;MAAA;IAAA;MAAxB,oDAA0B;QAAA,IAAfF,KAAI;QACb,wBAAqBI,gBAAgB,CAACJ,KAAI,CAAC;UAAnCK,QAAQ,qBAARA,QAAQ;QAEhB,IAAIA,QAAQ,KAAK,OAAO,IAAIJ,QAAQ,CAACD,KAAI,CAACM,QAAQ,CAAC,EAAE,OAAO,IAAI;MAClE;IAAC;MAAA;IAAA;MAAA;IAAA;EACH,CAAC;EAED,OAAOL,QAAQ,CAAC,CAACD,IAAI,CAAC,CAAC;AACzB,CAAC;AAAC"}

package/build/primitives/Pressable/Pressable.constants.js

@@ -4,6 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.KEY_ENTER = void 0;
-var KEY_ENTER = 'Enter';
+var KEY_ENTER = 13;
 exports.KEY_ENTER = KEY_ENTER;
 //# sourceMappingURL=Pressable.constants.js.map

package/build/primitives/Pressable/Pressable.constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pressable.constants.js","names":["KEY_ENTER"],"sources":["../../../src/primitives/Pressable/Pressable.constants.js"],"sourcesContent":["const KEY_ENTER = 'Enter';\n\nexport { KEY_ENTER };\n"],"mappings":";;;;;;AAAA,IAAMA,SAAS,GAAG,OAAO;AAAC"}
+{"version":3,"file":"Pressable.constants.js","names":["KEY_ENTER"],"sources":["../../../src/primitives/Pressable/Pressable.constants.js"],"sourcesContent":["const KEY_ENTER = 13;\n\nexport { KEY_ENTER };\n"],"mappings":";;;;;;AAAA,IAAMA,SAAS,GAAG,EAAE;AAAC"}

package/build/primitives/Pressable/Pressable.js

@@ -11,7 +11,7 @@ var _helpers = require("../../helpers");
 var _Primitive = require("../Primitive");
 var _Pressable = require("./Pressable.constants");
 var _PressableModule = _interopRequireDefault(require("./Pressable.module.css"));
-var _excluded = ["children", "disabled", "preventDefault", "tabIndex", "tag", "onEnter", "onLeave", "onPress"];
+var _excluded = ["children", "disabled", "preventDefault", "tag", "onEnter", "onLeave", "onPress"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -25,10 +25,8 @@ var Pressable = function Pressable(_ref) {
     disabled = _ref.disabled,
     _ref$preventDefault = _ref.preventDefault,
     preventDefault = _ref$preventDefault === void 0 ? true : _ref$preventDefault,
-    _ref$tabIndex = _ref.tabIndex,
-    tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
     _ref$tag = _ref.tag,
-    tag = _ref$tag === void 0 ? 'pressable' : _ref$tag,
+    tag = _ref$tag === void 0 ? 'div' : _ref$tag,
     onEnter = _ref.onEnter,
     onLeave = _ref.onLeave,
     _ref$onPress = _ref.onPress,
@@ -39,7 +37,6 @@ var Pressable = function Pressable(_ref) {
     role: others.role || 'pressable',
     tag: tag
   }, !disabled ? {
-    tabIndex: tabIndex,
     onClick: function onClick(event) {
       if (preventDefault) {
         event.preventDefault();
@@ -48,7 +45,7 @@ var Pressable = function Pressable(_ref) {
       onPress(event);
     },
     onKeyPress: function onKeyPress(event) {
-      if (event.key === _Pressable.KEY_ENTER) {
+      if (event.keyCode === _Pressable.KEY_ENTER) {
         if (preventDefault) {
           event.preventDefault();
           event.stopPropagation();
@@ -68,7 +65,6 @@ Pressable.propTypes = {
   children: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
   disabled: _propTypes.default.bool,
   preventDefault: _propTypes.default.bool,
-  tabIndex: _propTypes.default.number,
   tag: _propTypes.default.string,
   onEnter: _propTypes.default.func,
   onLeave: _propTypes.default.func,

package/build/primitives/Pressable/Pressable.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pressable.js","names":["Pressable","children","disabled","preventDefault","tabIndex","tag","onEnter","onLeave","onPress","others","React","createElement","Primitive","role","onClick","event","stopPropagation","onKeyPress","key","KEY_ENTER","onMouseEnter","onMouseLeave","className","styles","style","pressable","displayName","propTypes","PropTypes","oneOfType","string","node","bool","number","func"],"sources":["../../../src/primitives/Pressable/Pressable.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Primitive } from '../Primitive';\nimport { KEY_ENTER } from './Pressable.constants';\nimport style from './Pressable.module.css';\n\nconst Pressable = ({\n  children,\n  disabled,\n  preventDefault = true,\n  tabIndex = 0,\n  tag = 'pressable',\n  onEnter,\n  onLeave,\n  onPress = () => {},\n  ...others\n}) =>\n  React.createElement(\n    Primitive,\n    {\n      ...others,\n      disabled,\n      role: others.role || 'pressable',\n      tag,\n      ...(!disabled\n        ? {\n            tabIndex,\n            onClick: (event) => {\n              if (preventDefault) {\n                event.preventDefault();\n                event.stopPropagation();\n              }\n              onPress(event);\n            },\n            onKeyPress: (event) => {\n              if (event.key === KEY_ENTER) {\n                if (preventDefault) {\n                  event.preventDefault();\n                  event.stopPropagation();\n                }\n                onPress(event);\n              }\n            },\n            onMouseEnter: onEnter,\n            onMouseLeave: onLeave,\n          }\n        : {}),\n      className: styles(style.pressable, disabled && style.disabled, others.className),\n    },\n    children,\n  );\n\nPressable.displayName = 'Primitive:Pressable';\n\nPressable.propTypes = {\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  disabled: PropTypes.bool,\n  preventDefault: PropTypes.bool,\n  tabIndex: PropTypes.number,\n  tag: PropTypes.string,\n  onEnter: PropTypes.func,\n  onLeave: PropTypes.func,\n  onPress: PropTypes.func,\n};\n\nexport { Pressable };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AAA2C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAE3C,IAAMA,SAAS,GAAG,SAAZA,SAAS;EAAA,IACbC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IAAA,2BACRC,cAAc;IAAdA,cAAc,oCAAG,IAAI;IAAA,qBACrBC,QAAQ;IAARA,QAAQ,8BAAG,CAAC;IAAA,gBACZC,GAAG;IAAHA,GAAG,yBAAG,WAAW;IACjBC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IAAA,oBACPC,OAAO;IAAPA,OAAO,6BAAG,YAAM,CAAC,CAAC;IACfC,MAAM;EAAA,oBAETC,cAAK,CAACC,aAAa,CACjBC,oBAAS,gDAEJH,MAAM;IACTP,QAAQ,EAARA,QAAQ;IACRW,IAAI,EAAEJ,MAAM,CAACI,IAAI,IAAI,WAAW;IAChCR,GAAG,EAAHA;EAAG,GACC,CAACH,QAAQ,GACT;IACEE,QAAQ,EAARA,QAAQ;IACRU,OAAO,EAAE,iBAACC,KAAK,EAAK;MAClB,IAAIZ,cAAc,EAAE;QAClBY,KAAK,CAACZ,cAAc,EAAE;QACtBY,KAAK,CAACC,eAAe,EAAE;MACzB;MACAR,OAAO,CAACO,KAAK,CAAC;IAChB,CAAC;IACDE,UAAU,EAAE,oBAACF,KAAK,EAAK;MACrB,IAAIA,KAAK,CAACG,GAAG,KAAKC,oBAAS,EAAE;QAC3B,IAAIhB,cAAc,EAAE;UAClBY,KAAK,CAACZ,cAAc,EAAE;UACtBY,KAAK,CAACC,eAAe,EAAE;QACzB;QACAR,OAAO,CAACO,KAAK,CAAC;MAChB;IACF,CAAC;IACDK,YAAY,EAAEd,OAAO;IACrBe,YAAY,EAAEd;EAChB,CAAC,GACD,CAAC,CAAC;IACNe,SAAS,EAAE,IAAAC,eAAM,EAACC,wBAAK,CAACC,SAAS,EAAEvB,QAAQ,IAAIsB,wBAAK,CAACtB,QAAQ,EAAEO,MAAM,CAACa,SAAS;EAAC,IAElFrB,QAAQ,CACT;AAAA;AAAC;AAEJD,SAAS,CAAC0B,WAAW,GAAG,qBAAqB;AAE7C1B,SAAS,CAAC2B,SAAS,GAAG;EACpB1B,QAAQ,EAAE2B,kBAAS,CAACC,SAAS,CAAC,CAACD,kBAAS,CAACE,MAAM,EAAEF,kBAAS,CAACG,IAAI,CAAC,CAAC;EACjE7B,QAAQ,EAAE0B,kBAAS,CAACI,IAAI;EACxB7B,cAAc,EAAEyB,kBAAS,CAACI,IAAI;EAC9B5B,QAAQ,EAAEwB,kBAAS,CAACK,MAAM;EAC1B5B,GAAG,EAAEuB,kBAAS,CAACE,MAAM;EACrBxB,OAAO,EAAEsB,kBAAS,CAACM,IAAI;EACvB3B,OAAO,EAAEqB,kBAAS,CAACM,IAAI;EACvB1B,OAAO,EAAEoB,kBAAS,CAACM;AACrB,CAAC"}
+{"version":3,"file":"Pressable.js","names":["Pressable","children","disabled","preventDefault","tag","onEnter","onLeave","onPress","others","React","createElement","Primitive","role","onClick","event","stopPropagation","onKeyPress","keyCode","KEY_ENTER","onMouseEnter","onMouseLeave","className","styles","style","pressable","displayName","propTypes","PropTypes","oneOfType","string","node","bool","func"],"sources":["../../../src/primitives/Pressable/Pressable.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Primitive } from '../Primitive';\nimport { KEY_ENTER } from './Pressable.constants';\nimport style from './Pressable.module.css';\n\nconst Pressable = ({\n  children,\n  disabled,\n  preventDefault = true,\n  tag = 'div',\n  onEnter,\n  onLeave,\n  onPress = () => {},\n  ...others\n}) =>\n  React.createElement(\n    Primitive,\n    {\n      ...others,\n      disabled,\n      role: others.role || 'pressable',\n      tag,\n      ...(!disabled\n        ? {\n            onClick: (event) => {\n              if (preventDefault) {\n                event.preventDefault();\n                event.stopPropagation();\n              }\n              onPress(event);\n            },\n            onKeyPress: (event) => {\n              if (event.keyCode === KEY_ENTER) {\n                if (preventDefault) {\n                  event.preventDefault();\n                  event.stopPropagation();\n                }\n                onPress(event);\n              }\n            },\n            onMouseEnter: onEnter,\n            onMouseLeave: onLeave,\n          }\n        : {}),\n      className: styles(style.pressable, disabled && style.disabled, others.className),\n    },\n    children,\n  );\n\nPressable.displayName = 'Primitive:Pressable';\n\nPressable.propTypes = {\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  disabled: PropTypes.bool,\n  preventDefault: PropTypes.bool,\n  tag: PropTypes.string,\n  onEnter: PropTypes.func,\n  onLeave: PropTypes.func,\n  onPress: PropTypes.func,\n};\n\nexport { Pressable };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AAA2C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAE3C,IAAMA,SAAS,GAAG,SAAZA,SAAS;EAAA,IACbC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IAAA,2BACRC,cAAc;IAAdA,cAAc,oCAAG,IAAI;IAAA,gBACrBC,GAAG;IAAHA,GAAG,yBAAG,KAAK;IACXC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IAAA,oBACPC,OAAO;IAAPA,OAAO,6BAAG,YAAM,CAAC,CAAC;IACfC,MAAM;EAAA,oBAETC,cAAK,CAACC,aAAa,CACjBC,oBAAS,gDAEJH,MAAM;IACTN,QAAQ,EAARA,QAAQ;IACRU,IAAI,EAAEJ,MAAM,CAACI,IAAI,IAAI,WAAW;IAChCR,GAAG,EAAHA;EAAG,GACC,CAACF,QAAQ,GACT;IACEW,OAAO,EAAE,iBAACC,KAAK,EAAK;MAClB,IAAIX,cAAc,EAAE;QAClBW,KAAK,CAACX,cAAc,EAAE;QACtBW,KAAK,CAACC,eAAe,EAAE;MACzB;MACAR,OAAO,CAACO,KAAK,CAAC;IAChB,CAAC;IACDE,UAAU,EAAE,oBAACF,KAAK,EAAK;MACrB,IAAIA,KAAK,CAACG,OAAO,KAAKC,oBAAS,EAAE;QAC/B,IAAIf,cAAc,EAAE;UAClBW,KAAK,CAACX,cAAc,EAAE;UACtBW,KAAK,CAACC,eAAe,EAAE;QACzB;QACAR,OAAO,CAACO,KAAK,CAAC;MAChB;IACF,CAAC;IACDK,YAAY,EAAEd,OAAO;IACrBe,YAAY,EAAEd;EAChB,CAAC,GACD,CAAC,CAAC;IACNe,SAAS,EAAE,IAAAC,eAAM,EAACC,wBAAK,CAACC,SAAS,EAAEtB,QAAQ,IAAIqB,wBAAK,CAACrB,QAAQ,EAAEM,MAAM,CAACa,SAAS;EAAC,IAElFpB,QAAQ,CACT;AAAA;AAAC;AAEJD,SAAS,CAACyB,WAAW,GAAG,qBAAqB;AAE7CzB,SAAS,CAAC0B,SAAS,GAAG;EACpBzB,QAAQ,EAAE0B,kBAAS,CAACC,SAAS,CAAC,CAACD,kBAAS,CAACE,MAAM,EAAEF,kBAAS,CAACG,IAAI,CAAC,CAAC;EACjE5B,QAAQ,EAAEyB,kBAAS,CAACI,IAAI;EACxB5B,cAAc,EAAEwB,kBAAS,CAACI,IAAI;EAC9B3B,GAAG,EAAEuB,kBAAS,CAACE,MAAM;EACrBxB,OAAO,EAAEsB,kBAAS,CAACK,IAAI;EACvB1B,OAAO,EAAEqB,kBAAS,CAACK,IAAI;EACvBzB,OAAO,EAAEoB,kBAAS,CAACK;AACrB,CAAC"}