@mirai/ui 2.0.6 → 2.0.8

package/build/components/Action/Action.js

@@ -35,8 +35,7 @@ var Action = function Action(_ref) {
   return /*#__PURE__*/_react.default.createElement(_primitives.Pressable, _objectSpread(_objectSpread({}, others), {}, {
     disabled: disabled,
     href: href,
-    role: others.role || 'action',
-    tag: href ? 'a' : others.tag || 'action',
+    tag: href ? 'a' : 'action',
     onPress: function onPress(event) {
       _onPress && _onPress(event);
       if (href && target) window.open(href, target);else if (href) window.location = href;

package/build/components/Action/Action.js.map

@@ -1 +1 @@
-{"version":3,"file":"Action.js","names":["Action","bold","children","disabled","href","paragraph","small","target","tiny","underline","wide","onPress","others","React","createElement","Pressable","role","tag","event","window","open","location","className","styles","style","action","undefined","displayName","propTypes","PropTypes","bool","oneOfType","string","node","onEnter","func","onLeave"],"sources":["../../../src/components/Action/Action.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable } from '../../primitives';\nimport style from './Action.module.css';\n\nconst Action = ({\n  bold,\n  children,\n  disabled,\n  href,\n  paragraph,\n  small,\n  target,\n  tiny,\n  underline,\n  wide,\n  onPress,\n  ...others\n}) =>\n  React.createElement(\n    Pressable,\n    {\n      ...others,\n      disabled,\n      href,\n      role: others.role || 'action',\n      tag: href ? 'a' : others.tag || 'action',\n      onPress: (event) => {\n        onPress && onPress(event);\n        if (href && target) window.open(href, target);\n        else if (href) window.location = href;\n      },\n      className: styles(\n        style.action,\n        bold && style.bold,\n        disabled && style.disabled,\n        paragraph ? style.paragraph : small ? style.small : tiny ? style.tiny : undefined,\n        underline && style.underline,\n        wide && style.wide,\n        others.className,\n      ),\n    },\n    children,\n  );\n\nAction.displayName = 'Component:Action';\n\nAction.propTypes = {\n  bold: PropTypes.bool,\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  disabled: PropTypes.bool,\n  href: PropTypes.string,\n  paragraph: PropTypes.bool,\n  small: PropTypes.bool,\n  target: PropTypes.string,\n  tiny: PropTypes.bool,\n  underline: PropTypes.bool,\n  wide: PropTypes.bool,\n  onEnter: PropTypes.func,\n  onLeave: PropTypes.func,\n  onPress: PropTypes.func,\n};\n\nexport { Action };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AAAwC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAExC,IAAMA,MAAM,GAAG,SAATA,MAAM;EAAA,IACVC,IAAI,QAAJA,IAAI;IACJC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,IAAI,QAAJA,IAAI;IACJC,QAAO,QAAPA,OAAO;IACJC,MAAM;EAAA,oBAETC,cAAK,CAACC,aAAa,CACjBC,qBAAS,kCAEJH,MAAM;IACTT,QAAQ,EAARA,QAAQ;IACRC,IAAI,EAAJA,IAAI;IACJY,IAAI,EAAEJ,MAAM,CAACI,IAAI,IAAI,QAAQ;IAC7BC,GAAG,EAAEb,IAAI,GAAG,GAAG,GAAGQ,MAAM,CAACK,GAAG,IAAI,QAAQ;IACxCN,OAAO,EAAE,iBAACO,KAAK,EAAK;MAClBP,QAAO,IAAIA,QAAO,CAACO,KAAK,CAAC;MACzB,IAAId,IAAI,IAAIG,MAAM,EAAEY,MAAM,CAACC,IAAI,CAAChB,IAAI,EAAEG,MAAM,CAAC,CAAC,KACzC,IAAIH,IAAI,EAAEe,MAAM,CAACE,QAAQ,GAAGjB,IAAI;IACvC,CAAC;IACDkB,SAAS,EAAE,IAAAC,eAAM,EACfC,qBAAK,CAACC,MAAM,EACZxB,IAAI,IAAIuB,qBAAK,CAACvB,IAAI,EAClBE,QAAQ,IAAIqB,qBAAK,CAACrB,QAAQ,EAC1BE,SAAS,GAAGmB,qBAAK,CAACnB,SAAS,GAAGC,KAAK,GAAGkB,qBAAK,CAAClB,KAAK,GAAGE,IAAI,GAAGgB,qBAAK,CAAChB,IAAI,GAAGkB,SAAS,EACjFjB,SAAS,IAAIe,qBAAK,CAACf,SAAS,EAC5BC,IAAI,IAAIc,qBAAK,CAACd,IAAI,EAClBE,MAAM,CAACU,SAAS;EACjB,IAEHpB,QAAQ,CACT;AAAA;AAAC;AAEJF,MAAM,CAAC2B,WAAW,GAAG,kBAAkB;AAEvC3B,MAAM,CAAC4B,SAAS,GAAG;EACjB3B,IAAI,EAAE4B,kBAAS,CAACC,IAAI;EACpB5B,QAAQ,EAAE2B,kBAAS,CAACE,SAAS,CAAC,CAACF,kBAAS,CAACG,MAAM,EAAEH,kBAAS,CAACI,IAAI,CAAC,CAAC;EACjE9B,QAAQ,EAAE0B,kBAAS,CAACC,IAAI;EACxB1B,IAAI,EAAEyB,kBAAS,CAACG,MAAM;EACtB3B,SAAS,EAAEwB,kBAAS,CAACC,IAAI;EACzBxB,KAAK,EAAEuB,kBAAS,CAACC,IAAI;EACrBvB,MAAM,EAAEsB,kBAAS,CAACG,MAAM;EACxBxB,IAAI,EAAEqB,kBAAS,CAACC,IAAI;EACpBrB,SAAS,EAAEoB,kBAAS,CAACC,IAAI;EACzBpB,IAAI,EAAEmB,kBAAS,CAACC,IAAI;EACpBI,OAAO,EAAEL,kBAAS,CAACM,IAAI;EACvBC,OAAO,EAAEP,kBAAS,CAACM,IAAI;EACvBxB,OAAO,EAAEkB,kBAAS,CAACM;AACrB,CAAC"}
+{"version":3,"file":"Action.js","names":["Action","bold","children","disabled","href","paragraph","small","target","tiny","underline","wide","onPress","others","React","createElement","Pressable","tag","event","window","open","location","className","styles","style","action","undefined","displayName","propTypes","PropTypes","bool","oneOfType","string","node","onEnter","func","onLeave"],"sources":["../../../src/components/Action/Action.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable } from '../../primitives';\nimport style from './Action.module.css';\n\nconst Action = ({\n  bold,\n  children,\n  disabled,\n  href,\n  paragraph,\n  small,\n  target,\n  tiny,\n  underline,\n  wide,\n  onPress,\n  ...others\n}) =>\n  React.createElement(\n    Pressable,\n    {\n      ...others,\n      disabled,\n      href,\n      tag: href ? 'a' : 'action',\n      onPress: (event) => {\n        onPress && onPress(event);\n        if (href && target) window.open(href, target);\n        else if (href) window.location = href;\n      },\n      className: styles(\n        style.action,\n        bold && style.bold,\n        disabled && style.disabled,\n        paragraph ? style.paragraph : small ? style.small : tiny ? style.tiny : undefined,\n        underline && style.underline,\n        wide && style.wide,\n        others.className,\n      ),\n    },\n    children,\n  );\n\nAction.displayName = 'Component:Action';\n\nAction.propTypes = {\n  bold: PropTypes.bool,\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  disabled: PropTypes.bool,\n  href: PropTypes.string,\n  paragraph: PropTypes.bool,\n  small: PropTypes.bool,\n  target: PropTypes.string,\n  tiny: PropTypes.bool,\n  underline: PropTypes.bool,\n  wide: PropTypes.bool,\n  onEnter: PropTypes.func,\n  onLeave: PropTypes.func,\n  onPress: PropTypes.func,\n};\n\nexport { Action };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AAAwC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAExC,IAAMA,MAAM,GAAG,SAATA,MAAM;EAAA,IACVC,IAAI,QAAJA,IAAI;IACJC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,IAAI,QAAJA,IAAI;IACJC,QAAO,QAAPA,OAAO;IACJC,MAAM;EAAA,oBAETC,cAAK,CAACC,aAAa,CACjBC,qBAAS,kCAEJH,MAAM;IACTT,QAAQ,EAARA,QAAQ;IACRC,IAAI,EAAJA,IAAI;IACJY,GAAG,EAAEZ,IAAI,GAAG,GAAG,GAAG,QAAQ;IAC1BO,OAAO,EAAE,iBAACM,KAAK,EAAK;MAClBN,QAAO,IAAIA,QAAO,CAACM,KAAK,CAAC;MACzB,IAAIb,IAAI,IAAIG,MAAM,EAAEW,MAAM,CAACC,IAAI,CAACf,IAAI,EAAEG,MAAM,CAAC,CAAC,KACzC,IAAIH,IAAI,EAAEc,MAAM,CAACE,QAAQ,GAAGhB,IAAI;IACvC,CAAC;IACDiB,SAAS,EAAE,IAAAC,eAAM,EACfC,qBAAK,CAACC,MAAM,EACZvB,IAAI,IAAIsB,qBAAK,CAACtB,IAAI,EAClBE,QAAQ,IAAIoB,qBAAK,CAACpB,QAAQ,EAC1BE,SAAS,GAAGkB,qBAAK,CAAClB,SAAS,GAAGC,KAAK,GAAGiB,qBAAK,CAACjB,KAAK,GAAGE,IAAI,GAAGe,qBAAK,CAACf,IAAI,GAAGiB,SAAS,EACjFhB,SAAS,IAAIc,qBAAK,CAACd,SAAS,EAC5BC,IAAI,IAAIa,qBAAK,CAACb,IAAI,EAClBE,MAAM,CAACS,SAAS;EACjB,IAEHnB,QAAQ,CACT;AAAA;AAAC;AAEJF,MAAM,CAAC0B,WAAW,GAAG,kBAAkB;AAEvC1B,MAAM,CAAC2B,SAAS,GAAG;EACjB1B,IAAI,EAAE2B,kBAAS,CAACC,IAAI;EACpB3B,QAAQ,EAAE0B,kBAAS,CAACE,SAAS,CAAC,CAACF,kBAAS,CAACG,MAAM,EAAEH,kBAAS,CAACI,IAAI,CAAC,CAAC;EACjE7B,QAAQ,EAAEyB,kBAAS,CAACC,IAAI;EACxBzB,IAAI,EAAEwB,kBAAS,CAACG,MAAM;EACtB1B,SAAS,EAAEuB,kBAAS,CAACC,IAAI;EACzBvB,KAAK,EAAEsB,kBAAS,CAACC,IAAI;EACrBtB,MAAM,EAAEqB,kBAAS,CAACG,MAAM;EACxBvB,IAAI,EAAEoB,kBAAS,CAACC,IAAI;EACpBpB,SAAS,EAAEmB,kBAAS,CAACC,IAAI;EACzBnB,IAAI,EAAEkB,kBAAS,CAACC,IAAI;EACpBI,OAAO,EAAEL,kBAAS,CAACM,IAAI;EACvBC,OAAO,EAAEP,kBAAS,CAACM,IAAI;EACvBvB,OAAO,EAAEiB,kBAAS,CAACM;AACrB,CAAC"}

package/build/components/Action/Action.module.css

@@ -10,6 +10,10 @@
   width: fit-content;
 }
 
+.action:focus-visible {
+  outline-offset: calc(var(--mirai-ui-focus-width) / 2);
+}
+
 .action.bold {
   font-family: var(--mirai-ui-font-bold);
   font-weight: var(--mirai-ui-font-bold-weight);

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

@@ -2,34 +2,34 @@
 
 exports[`component:<Action> inherit:className 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action mirai"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> prop:bold 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action bold"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> prop:disabled 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable disabled action disabled"
-    disabled=""
+    disabled="true"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
@@ -59,89 +59,78 @@ exports[`component:<Action> prop:href 1`] = `
 
 exports[`component:<Action> prop:paragraph 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action paragraph"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> prop:small 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action small"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> prop:tiny 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action tiny"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> prop:underline 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action underline"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> prop:wide 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action wide"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> renders 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action"
     tabindex="0"
   >
     children
-  </ui_action>
-</DocumentFragment>
-`;
-
-exports[`component:<Action> tag 1`] = `
-<DocumentFragment>
-  <a
-    class="pressable action"
-    tabindex="0"
-  >
-    children
-  </a>
+  </ui-action>
 </DocumentFragment>
 `;
 
 exports[`component:<Action> testId 1`] = `
 <DocumentFragment>
-  <ui_action
+  <ui-action
     class="pressable action"
     data-testid="mirai"
     tabindex="0"
   >
     children
-  </ui_action>
+  </ui-action>
 </DocumentFragment>
 `;

package/build/components/Button/Button.js

@@ -50,8 +50,7 @@ var Button = function Button(_ref) {
     top: top
   } : undefined, /*#__PURE__*/_react.default.createElement(_primitives.Pressable, _objectSpread(_objectSpread({}, others), {}, {
     disabled: disabled || busy,
-    role: others.role || 'button',
-    tag: others.tag || 'button',
+    tag: 'button',
     onPress: onPress,
     className: (0, _helpers.styles)(_ButtonModule.default.button, busy && !disabled && _ButtonModule.default.busy, large && _ButtonModule.default.large, small && _ButtonModule.default.small, rounded && _ButtonModule.default.rounded, squared && _ButtonModule.default.squared, secondary && !transparent && !disabled && _ButtonModule.default.secondary, transparent && _ButtonModule.default.transparent, (disabled || busy) && _ButtonModule.default.disabled, wide && _ButtonModule.default.wide, others.className),
     'aria-label': inherit['aria-label'] || (typeof tooltip === 'string' ? tooltip : undefined)

package/build/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":["Button","busy","children","disabled","large","rounded","secondary","small","squared","transparent","tooltip","wide","onPress","inherit","fixed","left","right","top","others","React","createElement","Tooltip","Fragment","text","undefined","Pressable","role","tag","className","styles","style","button","busyContainer","active","spinner","displayName","propTypes","PropTypes","bool","oneOfType","string","node","onEnter","func","onLeave"],"sources":["../../../src/components/Button/Button.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable, View } from '../../primitives';\nimport { Tooltip } from '../Tooltip';\nimport style from './Button.module.css';\n\nconst Button = ({\n  busy,\n  children,\n  disabled,\n  large,\n  rounded,\n  secondary,\n  small,\n  squared = false,\n  transparent = false,\n  tooltip,\n  wide,\n  onPress,\n  ...inherit\n}) => {\n  const { fixed, left, right, top, ...others } = inherit;\n\n  return React.createElement(\n    tooltip ? Tooltip : React.Fragment,\n    tooltip ? { fixed, left, right, text: tooltip, top } : undefined,\n    React.createElement(\n      Pressable,\n      {\n        ...others,\n        disabled: disabled || busy,\n        role: others.role || 'button',\n        tag: others.tag || 'button',\n        onPress,\n        className: styles(\n          style.button,\n          busy && !disabled && style.busy,\n          large && style.large,\n          small && style.small,\n          rounded && style.rounded,\n          squared && style.squared,\n          secondary && !transparent && !disabled && style.secondary,\n          transparent && style.transparent,\n          (disabled || busy) && style.disabled,\n          wide && style.wide,\n          others.className,\n        ),\n        'aria-label': inherit['aria-label'] || (typeof tooltip === 'string' ? tooltip : undefined),\n      },\n      busy === undefined ? (\n        children\n      ) : (\n        <>\n          <View className={styles(style.busyContainer, busy && style.active)}>\n            <View className={style.spinner} />\n          </View>\n          <View row className={style.children}>\n            {children}\n          </View>\n        </>\n      ),\n    ),\n  );\n};\n\nButton.displayName = 'Component:Button';\nButton.propTypes = {\n  busy: PropTypes.bool,\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  disabled: PropTypes.bool,\n  large: PropTypes.bool,\n  rounded: PropTypes.bool,\n  secondary: PropTypes.bool,\n  small: PropTypes.bool,\n  squared: PropTypes.bool,\n  tooltip: PropTypes.string,\n  transparent: PropTypes.bool,\n  wide: PropTypes.bool,\n  onEnter: PropTypes.func,\n  onLeave: PropTypes.func,\n  onPress: PropTypes.func,\n};\n\nexport { Button };\n"],"mappings":"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"}
+{"version":3,"file":"Button.js","names":["Button","busy","children","disabled","large","rounded","secondary","small","squared","transparent","tooltip","wide","onPress","inherit","fixed","left","right","top","others","React","createElement","Tooltip","Fragment","text","undefined","Pressable","tag","className","styles","style","button","busyContainer","active","spinner","displayName","propTypes","PropTypes","bool","oneOfType","string","node","onEnter","func","onLeave"],"sources":["../../../src/components/Button/Button.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable, View } from '../../primitives';\nimport { Tooltip } from '../Tooltip';\nimport style from './Button.module.css';\n\nconst Button = ({\n  busy,\n  children,\n  disabled,\n  large,\n  rounded,\n  secondary,\n  small,\n  squared = false,\n  transparent = false,\n  tooltip,\n  wide,\n  onPress,\n  ...inherit\n}) => {\n  const { fixed, left, right, top, ...others } = inherit;\n\n  return React.createElement(\n    tooltip ? Tooltip : React.Fragment,\n    tooltip ? { fixed, left, right, text: tooltip, top } : undefined,\n    React.createElement(\n      Pressable,\n      {\n        ...others,\n        disabled: disabled || busy,\n        tag: 'button',\n        onPress,\n        className: styles(\n          style.button,\n          busy && !disabled && style.busy,\n          large && style.large,\n          small && style.small,\n          rounded && style.rounded,\n          squared && style.squared,\n          secondary && !transparent && !disabled && style.secondary,\n          transparent && style.transparent,\n          (disabled || busy) && style.disabled,\n          wide && style.wide,\n          others.className,\n        ),\n        'aria-label': inherit['aria-label'] || (typeof tooltip === 'string' ? tooltip : undefined),\n      },\n      busy === undefined ? (\n        children\n      ) : (\n        <>\n          <View className={styles(style.busyContainer, busy && style.active)}>\n            <View className={style.spinner} />\n          </View>\n          <View row className={style.children}>\n            {children}\n          </View>\n        </>\n      ),\n    ),\n  );\n};\n\nButton.displayName = 'Component:Button';\nButton.propTypes = {\n  busy: PropTypes.bool,\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  disabled: PropTypes.bool,\n  large: PropTypes.bool,\n  rounded: PropTypes.bool,\n  secondary: PropTypes.bool,\n  small: PropTypes.bool,\n  squared: PropTypes.bool,\n  tooltip: PropTypes.string,\n  transparent: PropTypes.bool,\n  wide: PropTypes.bool,\n  onEnter: PropTypes.func,\n  onLeave: PropTypes.func,\n  onPress: PropTypes.func,\n};\n\nexport { Button };\n"],"mappings":"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"}

package/build/components/Button/Button.module.css

@@ -1,4 +1,4 @@
-button.button {
+.button {
   align-items: center;
   background-color: var(--mirai-ui-button-background);
   border-radius: var(--mirai-ui-button-radius);
@@ -10,112 +10,112 @@ button.button {
   justify-content: center;
   max-height: var(--mirai-ui-button-height);
   min-height: var(--mirai-ui-button-height);
-  outline: none;
   overflow: hidden;
   padding: 0 var(--mirai-ui-button-padding-x);
   position: relative;
+  text-align: center;
   transition: background-color var(--mirai-ui-motion-collapse) var(--mirai-ui-motion-easing),
     box-shadow var(--mirai-ui-motion-collapse) var(--mirai-ui-motion-easing),
     color var(--mirai-ui-motion-collapse) var(--mirai-ui-motion-easing);
   width: fit-content;
 }
 
-button.button,
-button.button .children {
+.button,
+.button .children {
   gap: var(--mirai-ui-space-XXS);
 }
 
 /* -- variants */
-button.button:disabled:not(.busy) {
+.button.disabled:not(.busy) {
   background-color: var(--mirai-ui-button-disabled-background);
   color: var(--mirai-ui-button-disabled-color);
 }
 
-button.secondary {
+.secondary {
   background-color: var(--mirai-ui-button-secondary-background);
   box-shadow: inset 0 0 0 var(--mirai-ui-border-width) var(--mirai-ui-button-secondary-color);
   color: var(--mirai-ui-button-secondary-color);
 }
 
-button.button:not(:disabled).secondary:active,
-button.button:not(:disabled).secondary:hover {
+.button:not(.disabled).secondary:active,
+.button:not(.disabled).secondary:hover {
   background-color: var(--mirai-ui-button-secondary-background-active);
   box-shadow: inset 0 0 0 var(--mirai-ui-border-width) var(--mirai-ui-button-secondary-focus-color);
   color: var(--mirai-ui-button-secondary-focus-color);
 }
 
-button.transparent {
+.transparent {
   background-color: transparent;
   color: var(--mirai-ui-button-transparent-color);
 }
 
-button.transparent:not(:disabled):active,
-button.transparent:not(:disabled):hover {
+.transparent:not(.disabled):active,
+.transparent:not(.disabled):hover {
   background-color: var(--mirai-ui-button-transparent-background-active);
   color: var(--mirai-ui-button-focus-color);
 }
 
-button.button:not(:disabled):not(.secondary):not(.transparent):active,
-button.button:not(:disabled):not(.secondary):not(.transparent):hover {
+.button:not(.disabled):not(.secondary):not(.transparent):active,
+.button:not(.disabled):not(.secondary):not(.transparent):hover {
   background-color: var(--mirai-ui-button-focus-color);
 }
 
 /* -- sizing */
-button.large {
+.large {
   font-size: var(--mirai-ui-font-size-paragraph);
   max-height: var(--mirai-ui-button-large-height);
   min-height: var(--mirai-ui-button-large-height);
 }
 
-button.rounded {
+.rounded {
   border-radius: var(--mirai-ui-space-XXL);
 }
 
-button.small {
+.small {
   font-size: var(--mirai-ui-font-size-small);
   max-height: var(--mirai-ui-button-small-height);
   min-height: var(--mirai-ui-button-small-height);
   padding: 0 calc(var(--mirai-ui-button-padding-x) / 2);
 }
 
-button.squared {
+.squared {
   padding: 0;
   min-width: var(--mirai-ui-button-height);
   max-width: var(--mirai-ui-button-height);
 }
 
-button.large.squared {
+.large.squared {
   min-width: var(--mirai-ui-button-large-height);
   max-width: var(--mirai-ui-button-large-height);
 }
 
-button.small.squared {
+.small.squared {
   min-width: var(--mirai-ui-button-small-height);
   max-width: var(--mirai-ui-button-small-height);
 }
 
-button.wide {
-  width: 100%;
+.wide {
+  width: auto;
 }
 
 /* -- children */
-button.button .children,
-button.button .spinner {
+.button .children,
+.button .spinner {
   transition: opacity var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing),
     transform var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing);
 }
 
-button.button.busy .children {
+.button.busy .children {
   opacity: 0;
   transform: translateY(var(--mirai-ui-space-XL));
 }
 
-button.button .spinner {
+.button .spinner {
   opacity: 0;
   transform: translateY(calc(var(--mirai-ui-space-XL) * -1));
 }
 
-button.button.busy .spinner {
+.button.busy .spinner {
   opacity: 1;
   transform: translateY(0%);
 }
@@ -144,7 +144,7 @@ button.button.busy .spinner {
   transition: opacity var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing);
 }
 
-.secondary:not(:disabled) .busyContainer:before {
+.secondary:not(.disabled) .busyContainer:before {
   background-color: var(--mirai-ui-button-background);
 }
 

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

@@ -2,203 +2,192 @@
 
 exports[`component:<Button> inherit:className 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button mirai"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:busy 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable disabled button busy disabled"
-    disabled=""
+    disabled="true"
   >
-    <ui_view
+    <ui-view
       class="view busyContainer active"
     >
-      <ui_view
+      <ui-view
         class="view spinner"
       />
-    </ui_view>
-    <ui_view
+    </ui-view>
+    <ui-view
       class="view row children"
     >
       children
-    </ui_view>
-  </button>
+    </ui-view>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:disabled 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable disabled button disabled"
-    disabled=""
+    disabled="true"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:large 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button large"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:secondary && prop:busy 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable disabled button busy secondary disabled"
-    disabled=""
+    disabled="true"
   >
-    <ui_view
+    <ui-view
       class="view busyContainer active"
     >
-      <ui_view
+      <ui-view
         class="view spinner"
       />
-    </ui_view>
-    <ui_view
+    </ui-view>
+    <ui-view
       class="view row children"
     >
       children
-    </ui_view>
-  </button>
+    </ui-view>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:secondary && prop:busy 2`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable disabled button busy transparent disabled"
-    disabled=""
+    disabled="true"
   >
-    <ui_view
+    <ui-view
       class="view busyContainer active"
     >
-      <ui_view
+      <ui-view
         class="view spinner"
       />
-    </ui_view>
-    <ui_view
+    </ui-view>
+    <ui-view
       class="view row children"
     >
       children
-    </ui_view>
-  </button>
+    </ui-view>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:secondary 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button secondary"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:small 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button small"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:squared 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button squared"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:tooltip 1`] = `
 <DocumentFragment>
-  <ui_tooltip
+  <ui-tooltip
     class="container"
   >
-    <button
+    <ui-button
       class="pressable dispatcher button"
       tabindex="0"
     >
       children
-    </button>
-  </ui_tooltip>
+    </ui-button>
+  </ui-tooltip>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:transparent 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button transparent"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> prop:wide 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button wide"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> renders 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button"
     tabindex="0"
   >
     children
-  </button>
-</DocumentFragment>
-`;
-
-exports[`component:<Button> tag 1`] = `
-<DocumentFragment>
-  <ui_tag
-    class="pressable button"
-    tabindex="0"
-  >
-    children
-  </ui_tag>
+  </ui-button>
 </DocumentFragment>
 `;
 
 exports[`component:<Button> testId 1`] = `
 <DocumentFragment>
-  <button
+  <ui-button
     class="pressable button"
     data-testid="mirai"
     tabindex="0"
   >
     children
-  </button>
+  </ui-button>
 </DocumentFragment>
 `;

package/build/components/Calendar/Calendar.Month.js

@@ -50,6 +50,7 @@ var Month = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
   var weekNumber = (0, _helpers2.getWeekNumber)(instance);
   var testId = others.testId;
   return /*#__PURE__*/_react.default.createElement(_primitives.View, {
+    tag: "calendar-month",
     ref: ref,
     className: (0, _helpers.styles)(_CalendarModule.default.month, others.className)
   }, /*#__PURE__*/_react.default.createElement(_primitives.View, {