@mirai/ui 2.0.7 → 2.0.8

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

@@ -112,18 +112,18 @@ exports[`component:<Table>:<ColumnFilter> inherit:className 1`] = `
           <ui-view
             class="view row wide items"
           >
-            <button
+            <ui-button
               class="pressable button secondary wide"
               tabindex="0"
             >
               $Cancel
-            </button>
-            <button
+            </ui-button>
+            <ui-button
               class="pressable disabled button disabled wide"
-              disabled=""
+              disabled="true"
             >
               $Submit
-            </button>
+            </ui-button>
           </ui-view>
         </ui-view>
       </ui-pressable>
@@ -244,18 +244,18 @@ exports[`component:<Table>:<ColumnFilter> prop:l10n 1`] = `
           <ui-view
             class="view row wide items"
           >
-            <button
+            <ui-button
               class="pressable button secondary wide"
               tabindex="0"
             >
               Cancel
-            </button>
-            <button
+            </ui-button>
+            <ui-button
               class="pressable disabled button disabled wide"
-              disabled=""
+              disabled="true"
             >
               Submit
-            </button>
+            </ui-button>
           </ui-view>
         </ui-view>
       </ui-pressable>
@@ -376,18 +376,18 @@ exports[`component:<Table>:<ColumnFilter> prop:schema type:number 1`] = `
           <ui-view
             class="view row wide items"
           >
-            <button
+            <ui-button
               class="pressable button secondary wide"
               tabindex="0"
             >
               Cancel
-            </button>
-            <button
+            </ui-button>
+            <ui-button
               class="pressable disabled button disabled wide"
-              disabled=""
+              disabled="true"
             >
               Submit
-            </button>
+            </ui-button>
           </ui-view>
         </ui-view>
       </ui-pressable>
@@ -508,18 +508,18 @@ exports[`component:<Table>:<ColumnFilter> prop:schema type:text 1`] = `
           <ui-view
             class="view row wide items"
           >
-            <button
+            <ui-button
               class="pressable button secondary wide"
               tabindex="0"
             >
               Cancel
-            </button>
-            <button
+            </ui-button>
+            <ui-button
               class="pressable disabled button disabled wide"
-              disabled=""
+              disabled="true"
             >
               Submit
-            </button>
+            </ui-button>
           </ui-view>
         </ui-view>
       </ui-pressable>
@@ -640,18 +640,18 @@ exports[`component:<Table>:<ColumnFilter> renders 1`] = `
           <ui-view
             class="view row wide items"
           >
-            <button
+            <ui-button
               class="pressable button secondary wide"
               tabindex="0"
             >
               $Cancel
-            </button>
-            <button
+            </ui-button>
+            <ui-button
               class="pressable disabled button disabled wide"
-              disabled=""
+              disabled="true"
             >
               $Submit
-            </button>
+            </ui-button>
           </ui-view>
         </ui-view>
       </ui-pressable>
@@ -776,19 +776,19 @@ exports[`component:<Table>:<ColumnFilter> testId 1`] = `
           <ui-view
             class="view row wide items"
           >
-            <button
+            <ui-button
               class="pressable button secondary wide"
               tabindex="0"
             >
               $Cancel
-            </button>
-            <button
+            </ui-button>
+            <ui-button
               class="pressable disabled button disabled wide"
               data-testid="mirai-submit"
-              disabled=""
+              disabled="true"
             >
               $Submit
-            </button>
+            </ui-button>
           </ui-view>
         </ui-view>
       </ui-pressable>

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

@@ -6,13 +6,13 @@ exports[` 1`] = `
     class="container"
     data-testid="onEnter"
   >
-    <button
+    <ui-button
       class="pressable button dispatcher"
       data-testid="onEnter-dispatcher"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-tooltip>
 </DocumentFragment>
 `;
@@ -23,13 +23,13 @@ exports[` 2`] = `
     class="container"
     data-testid="onEnter"
   >
-    <button
+    <ui-button
       class="pressable button dispatcher"
       data-testid="onEnter-dispatcher"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-tooltip>
 </DocumentFragment>
 `;
@@ -43,13 +43,13 @@ exports[` 3`] = `
     <ui-view
       class="view"
     >
-      <button
+      <ui-button
         class="pressable button dispatcher"
         data-testid="onPress-dispatcher"
         tabindex="0"
       >
         Action
-      </button>
+      </ui-button>
     </ui-view>
   </ui-tooltip>
 </DocumentFragment>
@@ -64,13 +64,13 @@ exports[` 4`] = `
     <ui-view
       class="view"
     >
-      <button
+      <ui-button
         class="pressable button dispatcher"
         data-testid="onPress-dispatcher"
         tabindex="0"
       >
         Action
-      </button>
+      </ui-button>
     </ui-view>
   </ui-tooltip>
 </DocumentFragment>
@@ -78,12 +78,12 @@ exports[` 4`] = `
 
 exports[`component:<Tooltip> inherit:className 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button"
     tabindex="0"
   >
     Action
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
@@ -92,12 +92,12 @@ exports[`component:<Tooltip> prop:Template 1`] = `
   <ui-tooltip
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button dispatcher"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-tooltip>
   <ui-tooltip-content
     class="layer"
@@ -119,12 +119,12 @@ exports[`component:<Tooltip> prop:text 1`] = `
   <ui-tooltip
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button dispatcher"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-tooltip>
   <ui-tooltip-content
     class="layer"
@@ -145,23 +145,23 @@ exports[`component:<Tooltip> prop:text 1`] = `
 
 exports[`component:<Tooltip> prop:top 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button"
     tabindex="0"
   >
     Action
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Tooltip> renders 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button"
     tabindex="0"
   >
     Action
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
@@ -171,13 +171,13 @@ exports[`component:<Tooltip> testId 1`] = `
     class="container"
     data-testid="mirai"
   >
-    <button
+    <ui-button
       class="pressable button dispatcher"
       data-testid="mirai-dispatcher"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-tooltip>
 </DocumentFragment>
 `;

package/build/components/components.customElements.js

@@ -0,0 +1,6 @@
+"use strict";
+
+var _helpers = require("../helpers");
+(0, _helpers.CustomElement)('ui-button', HTMLButtonElement, 'button');
+(0, _helpers.CustomElement)('ui-label', HTMLLabelElement, 'label');
+//# sourceMappingURL=components.customElements.js.map

package/build/components/components.customElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components.customElements.js","names":["CustomElement","HTMLButtonElement","HTMLLabelElement"],"sources":["../../src/components/components.customElements.js"],"sourcesContent":["import { CustomElement } from '../helpers';\n\nCustomElement('ui-button', HTMLButtonElement, 'button');\nCustomElement('ui-label', HTMLLabelElement, 'label');\n"],"mappings":";;AAAA;AAEA,IAAAA,sBAAa,EAAC,WAAW,EAAEC,iBAAiB,EAAE,QAAQ,CAAC;AACvD,IAAAD,sBAAa,EAAC,UAAU,EAAEE,gBAAgB,EAAE,OAAO,CAAC"}

package/build/components/index.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+require("./components.customElements");
 var _Action = require("./Action");
 Object.keys(_Action).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/build/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/components/index.js"],"sourcesContent":["export * from './Action';\nexport * from './Button';\nexport * from './Calendar';\nexport * from './Form';\nexport * from './InputDate';\nexport * from './InputNumber';\nexport * from './InputOption';\nexport * from './InputPhone';\nexport * from './InputSelect';\nexport * from './InputText';\nexport * from './Menu';\nexport * from './Modal';\nexport * from './Notification';\nexport * from './Progress';\nexport * from './Slider';\nexport * from './Table';\nexport * from './Tooltip';\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;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;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;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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/components/index.js"],"sourcesContent":["import './components.customElements';\n\nexport * from './Action';\nexport * from './Button';\nexport * from './Calendar';\nexport * from './Form';\nexport * from './InputDate';\nexport * from './InputNumber';\nexport * from './InputOption';\nexport * from './InputPhone';\nexport * from './InputSelect';\nexport * from './InputText';\nexport * from './Menu';\nexport * from './Modal';\nexport * from './Notification';\nexport * from './Progress';\nexport * from './Slider';\nexport * from './Table';\nexport * from './Tooltip';\n"],"mappings":";;;;;AAAA;AAEA;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;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;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;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/helpers/CustomElement.js

@@ -0,0 +1,39 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CustomElement = void 0;
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+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); }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+var userAgent = navigator.userAgent.toLowerCase();
+var isSafari = userAgent.includes('safari') && !userAgent.includes('chrome') && !userAgent.includes('android');
+var CustomElement = function CustomElement(component) {
+  var TagElement = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : HTMLElement;
+  var tag = arguments.length > 2 ? arguments[2] : undefined;
+  var ClassElement = isSafari ? HTMLElement : TagElement;
+  return customElements.define(component, /*#__PURE__*/function (_ClassElement) {
+    _inherits(_class, _ClassElement);
+    var _super = _createSuper(_class);
+    function _class() {
+      _classCallCheck(this, _class);
+      return _super.apply(this, arguments);
+    }
+    return _createClass(_class);
+  }(ClassElement), {
+    extends: tag
+  });
+};
+exports.CustomElement = CustomElement;
+//# sourceMappingURL=CustomElement.js.map

package/build/helpers/CustomElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomElement.js","names":["userAgent","navigator","toLowerCase","isSafari","includes","CustomElement","component","TagElement","HTMLElement","tag","ClassElement","customElements","define","extends"],"sources":["../../src/helpers/CustomElement.js"],"sourcesContent":["const userAgent = navigator.userAgent.toLowerCase();\nconst isSafari = userAgent.includes('safari') && !userAgent.includes('chrome') && !userAgent.includes('android');\n\nexport const CustomElement = (component, TagElement = HTMLElement, tag) => {\n  const ClassElement = isSafari ? HTMLElement : TagElement;\n\n  return customElements.define(component, class extends ClassElement {}, { extends: tag });\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,IAAMA,SAAS,GAAGC,SAAS,CAACD,SAAS,CAACE,WAAW,EAAE;AACnD,IAAMC,QAAQ,GAAGH,SAAS,CAACI,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAACJ,SAAS,CAACI,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAACJ,SAAS,CAACI,QAAQ,CAAC,SAAS,CAAC;AAEzG,IAAMC,aAAa,GAAG,SAAhBA,aAAa,CAAIC,SAAS,EAAoC;EAAA,IAAlCC,UAAU,uEAAGC,WAAW;EAAA,IAAEC,GAAG;EACpE,IAAMC,YAAY,GAAGP,QAAQ,GAAGK,WAAW,GAAGD,UAAU;EAExD,OAAOI,cAAc,CAACC,MAAM,CAACN,SAAS;IAAA;IAAA;IAAA;MAAA;MAAA;IAAA;IAAA;EAAA,EAAgBI,YAAY,GAAK;IAAEG,OAAO,EAAEJ;EAAI,CAAC,CAAC;AAC1F,CAAC;AAAC"}

package/build/helpers/index.js

@@ -3,6 +3,17 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _CustomElement = require("./CustomElement");
+Object.keys(_CustomElement).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _CustomElement[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _CustomElement[key];
+    }
+  });
+});
 var _getIconState = require("./getIconState");
 Object.keys(_getIconState).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/build/helpers/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/helpers/index.js"],"sourcesContent":["export * from './getIconState';\nexport * from './getInputDateErrors';\nexport * from './getInputPhoneErrors';\nexport * from './getInputErrors';\nexport * from './isJest';\nexport * from './styles';\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;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/helpers/index.js"],"sourcesContent":["export * from './CustomElement';\nexport * from './getIconState';\nexport * from './getInputDateErrors';\nexport * from './getInputPhoneErrors';\nexport * from './getInputErrors';\nexport * from './isJest';\nexport * from './styles';\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;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/__tests__/__snapshots__/Layer.test.js.snap

@@ -54,12 +54,12 @@ exports[`primitive:<Layer> w/ centered && visible 1`] = `
   <ui-layer
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-layer>
   <ui-layer-content
     class="layer"
@@ -79,13 +79,13 @@ exports[`primitive:<Layer> w/ child fixed 1`] = `
   <ui-layer
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button"
       style="position: fixed;"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-layer>
   <ui-layer-content
     class="layer fixed hidden"
@@ -105,12 +105,12 @@ exports[`primitive:<Layer> w/ component & <LayerContent> 1`] = `
   <ui-layer
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-layer>
   <ui-layer-content
     class="layer hidden"
@@ -130,12 +130,12 @@ exports[`primitive:<Layer> w/ component 1`] = `
   <ui-layer
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-layer>
   <ui-layer-content
     class="layer hidden"
@@ -149,12 +149,12 @@ exports[`primitive:<Layer> w/ fixed 1`] = `
   <ui-layer
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-layer>
   <ui-layer-content
     class="layer fixed hidden"
@@ -174,12 +174,12 @@ exports[`primitive:<Layer> w/ forceRender={false} & <LayerContent> 1`] = `
   <ui-layer
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-layer>
 </DocumentFragment>
 `;
@@ -189,12 +189,12 @@ exports[`primitive:<Layer> w/ visible 1`] = `
   <ui-layer
     class="container"
   >
-    <button
+    <ui-button
       class="pressable button"
       tabindex="0"
     >
       Action
-    </button>
+    </ui-button>
   </ui-layer>
   <ui-layer-content
     class="layer"

package/build/primitives/Pressable/Pressable.module.css

@@ -6,12 +6,20 @@
   display: inline-block;
   height: fit-content;
   margin: 0;
+  outline: none;
   padding: 0;
   user-select: none;
   width: fit-content;
   -webkit-tap-highlight-color: transparent;
 }
 
+.pressable:focus-visible {
+  border-radius: var(--mirai-ui-border-radius);
+  outline: var(--mirai-ui-focus-width) solid var(--mirai-ui-focus-color);
+  outline-offset: calc(var(--mirai-ui-focus-width) * -0.5);
+  z-index: var(--mirai-ui-layer-S);
+}
+
 .pressable.disabled,
 .pressable:disabled {
   cursor: unset;

package/build/primitives/Primitive/Primitive.constants.js

@@ -22,8 +22,6 @@ var NATIVE_TAGS = [
 // -- COMPONENTS -------------------------------------------------------------
 // <Action>
 'a',
-// <Button>
-'button',
 // <Form>
 'form',
 // <Table>

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

@@ -1 +1 @@
-{"version":3,"file":"Primitive.constants.js","names":["BANNED_JEST_PROPS","COMMON_PROPS","for","role","testId","NATIVE_TAGS"],"sources":["../../../src/primitives/Primitive/Primitive.constants.js"],"sourcesContent":["const BANNED_JEST_PROPS = ['is', 'role', 'aria-hidden', 'aria-label'];\n\nconst COMMON_PROPS = {\n  for: 'htmlFor',\n  role: 'data-role',\n  testId: 'data-testid',\n};\n\nconst NATIVE_TAGS = [\n  // -- PRIMITIVES -------------------------------------------------------------\n  'iframe',\n  'img',\n  // <Input>\n  'input',\n  'textarea',\n  // <Select>\n  'select',\n  'option',\n  // -- COMPONENTS -------------------------------------------------------------\n  // <Action>\n  'a',\n  // <Button>\n  'button',\n  // <Form>\n  'form',\n  // <Table>\n  'table',\n  'thead',\n  'tbody',\n  'tr',\n  'th',\n  'td',\n];\n\nexport { BANNED_JEST_PROPS, COMMON_PROPS, NATIVE_TAGS };\n"],"mappings":";;;;;;AAAA,IAAMA,iBAAiB,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,CAAC;AAAC;AAEtE,IAAMC,YAAY,GAAG;EACnBC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAE,WAAW;EACjBC,MAAM,EAAE;AACV,CAAC;AAAC;AAEF,IAAMC,WAAW,GAAG;AAClB;AACA,QAAQ,EACR,KAAK;AACL;AACA,OAAO,EACP,UAAU;AACV;AACA,QAAQ,EACR,QAAQ;AACR;AACA;AACA,GAAG;AACH;AACA,QAAQ;AACR;AACA,MAAM;AACN;AACA,OAAO,EACP,OAAO,EACP,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,IAAI,CACL;AAAC"}
+{"version":3,"file":"Primitive.constants.js","names":["BANNED_JEST_PROPS","COMMON_PROPS","for","role","testId","NATIVE_TAGS"],"sources":["../../../src/primitives/Primitive/Primitive.constants.js"],"sourcesContent":["const BANNED_JEST_PROPS = ['is', 'role', 'aria-hidden', 'aria-label'];\n\nconst COMMON_PROPS = {\n  for: 'htmlFor',\n  role: 'data-role',\n  testId: 'data-testid',\n};\n\nconst NATIVE_TAGS = [\n  // -- PRIMITIVES -------------------------------------------------------------\n  'iframe',\n  'img',\n  // <Input>\n  'input',\n  'textarea',\n  // <Select>\n  'select',\n  'option',\n  // -- COMPONENTS -------------------------------------------------------------\n  // <Action>\n  'a',\n  // <Form>\n  'form',\n  // <Table>\n  'table',\n  'thead',\n  'tbody',\n  'tr',\n  'th',\n  'td',\n];\n\nexport { BANNED_JEST_PROPS, COMMON_PROPS, NATIVE_TAGS };\n"],"mappings":";;;;;;AAAA,IAAMA,iBAAiB,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,CAAC;AAAC;AAEtE,IAAMC,YAAY,GAAG;EACnBC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAE,WAAW;EACjBC,MAAM,EAAE;AACV,CAAC;AAAC;AAEF,IAAMC,WAAW,GAAG;AAClB;AACA,QAAQ,EACR,KAAK;AACL;AACA,OAAO,EACP,UAAU;AACV;AACA,QAAQ,EACR,QAAQ;AACR;AACA;AACA,GAAG;AACH;AACA,MAAM;AACN;AACA,OAAO,EACP,OAAO,EACP,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,IAAI,CACL;AAAC"}

package/build/primitives/index.js

@@ -1,9 +1,9 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+require("./primitives.customElements");
 var _Checkbox = require("./Checkbox");
 Object.keys(_Checkbox).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -136,67 +136,4 @@ Object.keys(_View).forEach(function (key) {
     }
   });
 });
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-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); }
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-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; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var CUSTOM_ELEMENTS = {
-  'ui-label': {
-    HtmlElement: HTMLLabelElement,
-    tag: 'label'
-  },
-  'ui-text': {
-    HtmlElement: HTMLSpanElement,
-    tag: 'span'
-  },
-  'ui-view': {
-    HtmlElement: HTMLDivElement,
-    tag: 'div'
-  },
-  'ui-h1': {
-    HtmlElement: HTMLHeadingElement,
-    tag: 'h1'
-  },
-  'ui-h2': {
-    HtmlElement: HTMLHeadingElement,
-    tag: 'h2'
-  },
-  'ui-h3': {
-    HtmlElement: HTMLHeadingElement,
-    tag: 'h3'
-  }
-};
-Object.entries(CUSTOM_ELEMENTS).forEach(function (_ref) {
-  var _ref2 = _slicedToArray(_ref, 2),
-    customElement = _ref2[0],
-    _ref2$ = _ref2[1];
-  _ref2$ = _ref2$ === void 0 ? {} : _ref2$;
-  var HtmlElement = _ref2$.HtmlElement,
-    tag = _ref2$.tag;
-  return customElements.define(customElement, /*#__PURE__*/function (_HtmlElement) {
-    _inherits(_class, _HtmlElement);
-    var _super = _createSuper(_class);
-    function _class() {
-      _classCallCheck(this, _class);
-      return _super.apply(this, arguments);
-    }
-    return _createClass(_class);
-  }(HtmlElement), {
-    extends: tag
-  });
-});
 //# sourceMappingURL=index.js.map

package/build/primitives/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["CUSTOM_ELEMENTS","HtmlElement","HTMLLabelElement","tag","HTMLSpanElement","HTMLDivElement","HTMLHeadingElement","Object","entries","forEach","customElement","customElements","define","extends"],"sources":["../../src/primitives/index.js"],"sourcesContent":["const CUSTOM_ELEMENTS = {\n  'ui-label': { HtmlElement: HTMLLabelElement, tag: 'label' },\n  'ui-text': { HtmlElement: HTMLSpanElement, tag: 'span' },\n  'ui-view': { HtmlElement: HTMLDivElement, tag: 'div' },\n  'ui-h1': { HtmlElement: HTMLHeadingElement, tag: 'h1' },\n  'ui-h2': { HtmlElement: HTMLHeadingElement, tag: 'h2' },\n  'ui-h3': { HtmlElement: HTMLHeadingElement, tag: 'h3' },\n};\n\nObject.entries(CUSTOM_ELEMENTS).forEach(([customElement, { HtmlElement, tag } = {}]) =>\n  customElements.define(customElement, class extends HtmlElement {}, { extends: tag }),\n);\n\nexport * from './Checkbox';\nexport * from './Icon';\nexport * from './Input';\nexport * from './Layer';\nexport * from './Pressable';\nexport * from './Primitive';\nexport * from './Radio';\nexport * from './ScrollView';\nexport * from './Select';\nexport * from './Switch';\nexport * from './Text';\nexport * from './View';\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;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;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;AAAuB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAxBvB,IAAMA,eAAe,GAAG;EACtB,UAAU,EAAE;IAAEC,WAAW,EAAEC,gBAAgB;IAAEC,GAAG,EAAE;EAAQ,CAAC;EAC3D,SAAS,EAAE;IAAEF,WAAW,EAAEG,eAAe;IAAED,GAAG,EAAE;EAAO,CAAC;EACxD,SAAS,EAAE;IAAEF,WAAW,EAAEI,cAAc;IAAEF,GAAG,EAAE;EAAM,CAAC;EACtD,OAAO,EAAE;IAAEF,WAAW,EAAEK,kBAAkB;IAAEH,GAAG,EAAE;EAAK,CAAC;EACvD,OAAO,EAAE;IAAEF,WAAW,EAAEK,kBAAkB;IAAEH,GAAG,EAAE;EAAK,CAAC;EACvD,OAAO,EAAE;IAAEF,WAAW,EAAEK,kBAAkB;IAAEH,GAAG,EAAE;EAAK;AACxD,CAAC;AAEDI,MAAM,CAACC,OAAO,CAACR,eAAe,CAAC,CAACS,OAAO,CAAC;EAAA;IAAEC,aAAa;IAAA;EAAA,6BAAyB,CAAC,CAAC;EAAA,IAAvBT,WAAW,UAAXA,WAAW;IAAEE,GAAG,UAAHA,GAAG;EAAA,OACzEQ,cAAc,CAACC,MAAM,CAACF,aAAa;IAAA;IAAA;IAAA;MAAA;MAAA;IAAA;IAAA;EAAA,EAAgBT,WAAW,GAAK;IAAEY,OAAO,EAAEV;EAAI,CAAC,CAAC;AAAA,EACrF"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/primitives/index.js"],"sourcesContent":["import './primitives.customElements';\n\nexport * from './Checkbox';\nexport * from './Icon';\nexport * from './Input';\nexport * from './Layer';\nexport * from './Pressable';\nexport * from './Primitive';\nexport * from './Radio';\nexport * from './ScrollView';\nexport * from './Select';\nexport * from './Switch';\nexport * from './Text';\nexport * from './View';\n"],"mappings":";;;;;AAAA;AAEA;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;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;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"}