@daoyi/nmtl-ui 2.0.1-beta.94 → 2.0.1-beta.96

package/lib/components/{ContactModal-1997d146.js → ContactModal-560b9bdd.js}

@@ -7,7 +7,7 @@ import { M as Modal } from './Modal-5a27951f.js';
 import { c as commonjsGlobal, a as getDefaultExportFromCjs } from './_commonjsHelpers-70de2c37.js';
 import { c as classNames } from './index-b76a85f4.js';
 import { Input, Button, Box, Typography, FormControl, RadioGroup, FormControlLabel, Radio, TextField, TextareaAutosize } from '@material-ui/core';
-import { S as Select } from './Select-e550d0a5.js';
+import { S as Select } from './Select-ac580a1f.js';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-e3803ee1.js';

package/lib/components/ContactModal.js

@@ -1,4 +1,4 @@
-export { C as default } from './ContactModal-1997d146.js';
+export { C as default } from './ContactModal-560b9bdd.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
@@ -14,7 +14,7 @@ import './style-inject.es-1f59c1d0.js';
 import './Spin-8dc60bfe.js';
 import './globalConfig';
 import './_commonjsHelpers-70de2c37.js';
-import './Select-e550d0a5.js';
+import './Select-ac580a1f.js';
 import './Empty-bf77164f.js';
 import './createSvgIcon-e3803ee1.js';
 import './defaultTheme-ed7746fe.js';

package/lib/components/{Drawer-b9855a54.js → Drawer-41d3a91f.js}

@@ -3,7 +3,7 @@ import React__default, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { List, ListItem, ListItemIcon, ListItemText, IconButton, Drawer as Drawer$1, Divider } from '@material-ui/core';
 import { DehazeRounded } from '@material-ui/icons';
-import { S as Select } from './Select-e550d0a5.js';
+import { S as Select } from './Select-ac580a1f.js';
 import { useHistory, useRouteMatch } from 'react-router-dom';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';

package/lib/components/Drawer.js

@@ -1,10 +1,10 @@
-export { D as default } from './Drawer-b9855a54.js';
+export { D as default } from './Drawer-41d3a91f.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
 import '@material-ui/core';
 import '@material-ui/icons';
-import './Select-e550d0a5.js';
+import './Select-ac580a1f.js';
 import './index-b76a85f4.js';
 import './Empty-bf77164f.js';
 import './style-inject.es-1f59c1d0.js';

package/lib/components/{ExtraTools-5954ee3a.js → ExtraTools-94eeda8d.js}

@@ -1,6 +1,6 @@
 import { _ as _extends } from './_rollupPluginBabelHelpers-a52356f6.js';
 import * as React from 'react';
-import React__default, { Component, forwardRef, useState } from 'react';
+import React__default, { Component, forwardRef, useState, useRef, useEffect } from 'react';
 import { c as classNames } from './index-b76a85f4.js';
 import PropTypes from 'prop-types';
 import { a as getDefaultExportFromCjs } from './_commonjsHelpers-70de2c37.js';
@@ -3362,7 +3362,31 @@ const FontSizeChanger = _ref5 => {
     FontSizeTargets,
     FontSizeOptions
   } = _ref5;
+  /* WCAG 2.1.1/4.1.2 react-font-size-changer 渲染的 A+/A− 為純 div onClick、
+     無法聚焦也無鍵盤操作（第三方庫不提供 prop）：掛載後補 tabindex/role/aria-label/Enter+Space */
+  const rootRef = useRef(null);
+  useEffect(() => {
+    if (!rootRef.current) return;
+    rootRef.current.querySelectorAll('.font-size-up, .font-size-down').forEach(el => {
+      if (el.getAttribute('tabindex') === '0') return;
+      const isUp = el.classList.contains('font-size-up');
+      const labelId = isUp ? 'knowledge.writersAndWorksSNA.big' : 'knowledge.writersAndWorksSNA.small';
+      const fallback = isUp ? '字級放大' : '字級縮小';
+      el.setAttribute('tabindex', '0');
+      el.setAttribute('role', 'button');
+      el.setAttribute('aria-label', intl ? intl.formatMessage({
+        id: labelId
+      }) : fallback);
+      el.addEventListener('keydown', event => {
+        if (event.key === 'Enter' || event.key === ' ') {
+          event.preventDefault();
+          el.click();
+        }
+      });
+    });
+  });
   return /*#__PURE__*/React__default.createElement("div", {
+    ref: rootRef,
     className: classNames('extraTools__fontsize', className)
   }, /*#__PURE__*/React__default.createElement(FontSize, {
     targets: FontSizeTargets,

package/lib/components/ExtraTools.js

@@ -1,4 +1,4 @@
-export { E as default } from './ExtraTools-5954ee3a.js';
+export { E as default } from './ExtraTools-94eeda8d.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import './index-b76a85f4.js';

package/lib/components/Footer.js

@@ -3,7 +3,7 @@ import React__default, { useState, useEffect } from 'react';
 import { c as classNames } from './index-b76a85f4.js';
 import PropTypes from 'prop-types';
 import axios from 'axios';
-import { C as ContactModal } from './ContactModal-1997d146.js';
+import { C as ContactModal } from './ContactModal-560b9bdd.js';
 import { S as Spin } from './Spin-8dc60bfe.js';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './hoist-non-react-statics.cjs-3f408ad2.js';
@@ -14,7 +14,7 @@ import '@material-ui/icons';
 import './Button-305b69a0.js';
 import './globalConfig';
 import './_commonjsHelpers-70de2c37.js';
-import './Select-e550d0a5.js';
+import './Select-ac580a1f.js';
 import './Empty-bf77164f.js';
 import './createSvgIcon-e3803ee1.js';
 import './defaultTheme-ed7746fe.js';
@@ -187,6 +187,17 @@ var Footer = function Footer(props) {
   }).map(function (_ref5, i) {
     var name = _ref5.name,
       url = _ref5.url;
+    /* 站內連結（'/' 開頭，如網站導覽）同分頁開啟；外部連結維持另開新視窗 */
+    if (url && url.startsWith('/')) {
+      return /*#__PURE__*/React__default.createElement("a", {
+        className: "footer__content__item__link",
+        style: {
+          color: primaryColor
+        },
+        href: url,
+        key: i.toString()
+      }, name.toUpperCase());
+    }
     return /*#__PURE__*/React__default.createElement("a", {
       className: "footer__content__item__link",
       style: {
@@ -202,8 +213,17 @@ var Footer = function Footer(props) {
     style: {
       color: primaryColor
     },
+    role: "button",
+    tabIndex: 0,
+    "aria-haspopup": "dialog",
     onClick: function onClick() {
       return setContactModalOpen(true);
+    },
+    onKeyDown: function onKeyDown(event) {
+      if (event.key === 'Enter' || event.key === ' ') {
+        event.preventDefault();
+        setContactModalOpen(true);
+      }
     }
   }, formatMessage({
     id: 'common.has.problem'

package/lib/components/{ForwardLink-aa950a50.js → ForwardLink-83a7eea9.js}

@@ -1,6 +1,7 @@
 import { c as _objectWithoutProperties } from './_rollupPluginBabelHelpers-a52356f6.js';
 import React__default, { useMemo } from 'react';
 import PropTypes from 'prop-types';
+import { c as classNames } from './index-b76a85f4.js';
 import { q as queryString } from './index-b47819f3.js';
 import { useHistory, Link } from 'react-router-dom';
 import { Tooltip } from '@material-ui/core';
@@ -10,11 +11,12 @@ import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 var css_248z = ".forwardLink {\n  width: -moz-fit-content;\n  width: fit-content;\n  max-width: 100%;\n  display: flex;\n}\n.forwardLink__link {\n  color: unset;\n  text-decoration: none;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  cursor: pointer;\n  display: block;\n  width: 100%;\n}\n.forwardLink__link--disabled {\n  cursor: not-allowed;\n}";
 styleInject(css_248z);
 
-var _excluded = ["className", "title", "target", "disabled", "children", "tip", "onClick"];
+var _excluded = ["className", "linkClassName", "title", "target", "disabled", "children", "tip", "onClick"];
 var locale = '/zh-tw'; // 20230318 暫時寫死，若套件納入語系控制，可將其置換
 
 var ForwardLink = function ForwardLink(_ref) {
   var className = _ref.className,
+    linkClassName = _ref.linkClassName,
     title = _ref.title,
     target = _ref.target,
     disabled = _ref.disabled,
@@ -58,9 +60,14 @@ var ForwardLink = function ForwardLink(_ref) {
     className: "forwardLink"
   }, disabled ? /*#__PURE__*/React__default.createElement("div", {
     title: domTitle,
-    className: "forwardLink__link--disabled"
-  }, children) : /*#__PURE__*/React__default.createElement(Link, {
-    className: "forwardLink__link",
+    className: classNames('forwardLink__link--disabled', linkClassName)
+  }, children) :
+  /*#__PURE__*/
+  /* linkClassName 直接掛在可聚焦的 <a> 上：消費端的 ellipsis/overflow 樣式若掛在
+     外層 className（包裹 div），會裁掉 <a> 的焦點框（WCAG 2.4.7 走查實測）——
+     此類樣式應改傳 linkClassName */
+  React__default.createElement(Link, {
+    className: classNames('forwardLink__link', linkClassName),
     target: target,
     title: domTitle,
     "aria-label": newWindowLabel,
@@ -79,6 +86,7 @@ var ForwardLink = function ForwardLink(_ref) {
 };
 ForwardLink.defaultProps = {
   className: undefined,
+  linkClassName: undefined,
   title: undefined,
   target: '_blank',
   disabled: undefined,
@@ -92,8 +100,10 @@ ForwardLink.defaultProps = {
 
 /* Write props detail information and 'npm run updateStory' will help you generate stories's argTypes */
 ForwardLink.propTypes = {
-  /** Css Name */
+  /** Css Name（掛在外層包裹 div；帶 overflow/ellipsis 的樣式請改用 linkClassName，否則會裁掉焦點框） */
   className: PropTypes.string,
+  /** 直接掛在可聚焦 <a> 上的 Css Name */
+  linkClassName: PropTypes.string,
   /** DOM title */
   title: PropTypes.string,
   /** DOM title */

package/lib/components/ForwardLink.js

@@ -1,7 +1,8 @@
-export { F as default } from './ForwardLink-aa950a50.js';
+export { F as default } from './ForwardLink-83a7eea9.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
+import './index-b76a85f4.js';
 import './index-b47819f3.js';
 import 'react-router-dom';
 import '@material-ui/core';

package/lib/components/Header.js

@@ -7,8 +7,8 @@ import { useHistory, useRouteMatch, NavLink } from 'react-router-dom';
 import { Typography, IconButton } from '@material-ui/core';
 import { SearchOutlined } from '@material-ui/icons';
 import { K as KeywordSearch } from './KeywordSearch-33341dd3.js';
-import { S as Select } from './Select-e550d0a5.js';
-import { c as checkLanguageSupport, D as Drawer, d as defaultSupportLanguage } from './Drawer-b9855a54.js';
+import { S as Select } from './Select-ac580a1f.js';
+import { c as checkLanguageSupport, D as Drawer, d as defaultSupportLanguage } from './Drawer-41d3a91f.js';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './isObjectLike-e111475d.js';

package/lib/components/KeywordTicker.js

@@ -2,7 +2,7 @@ import { a as _slicedToArray } from './_rollupPluginBabelHelpers-a52356f6.js';
 import React__default, { useState, useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { c as classNames } from './index-b76a85f4.js';
-import { F as ForwardLink } from './ForwardLink-aa950a50.js';
+import { F as ForwardLink } from './ForwardLink-83a7eea9.js';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './index-b47819f3.js';
 import 'react-router-dom';

package/lib/components/SNA.js

@@ -2,7 +2,7 @@ import React__default, { useMemo, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { c as classNames } from './index-b76a85f4.js';
 import { e as event, d as d3Select, a as dispatch, c as customEvent, D as DragEvent, q as quadtree, m as map, t as timer, T as Transform, i as identity, b as interrupt, o as ordinal, f as category10 } from './transform-3a04288b.js';
-import { E as ExtraTools } from './ExtraTools-5954ee3a.js';
+import { E as ExtraTools } from './ExtraTools-94eeda8d.js';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import './_commonjsHelpers-70de2c37.js';

package/lib/components/{Select-e550d0a5.js → Select-ac580a1f.js}

@@ -6,7 +6,7 @@ import { FormControl, Select as Select$1, CircularProgress, MenuItem } from '@ma
 import { E as Empty } from './Empty-bf77164f.js';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 
-var css_248z = ".select__placeholder {\n  color: #999;\n}\n.select--small {\n  width: 100%;\n}\n.select--small .MuiSelect-root {\n  padding: 0.5rem 1.5rem 0.25rem;\n  color: white;\n}\n.select--small .MuiSelect-root .select__placeholder {\n  color: white;\n}\n.select--small .MuiSelect-root:hover, .select--small .MuiSelect-root:focus {\n  background: transparent;\n}\n.select--small .MuiSvgIcon-root {\n  color: white;\n}\n.select--small .MuiOutlinedInput-root {\n  border-radius: 45px;\n}";
+var css_248z = ".select .MuiSelect-nativeInput {\n  visibility: hidden;\n}\n.select__placeholder {\n  color: #6b6130;\n}\n.select--small {\n  width: 100%;\n}\n.select--small .MuiSelect-root {\n  padding: 0.5rem 1.5rem 0.25rem;\n  color: white;\n}\n.select--small .MuiSelect-root .select__placeholder {\n  color: white;\n}\n.select--small .MuiSelect-root:hover, .select--small .MuiSelect-root:focus {\n  background: transparent;\n}\n.select--small .MuiSvgIcon-root {\n  color: white;\n}\n.select--small .MuiOutlinedInput-root {\n  border-radius: 45px;\n}";
 styleInject(css_248z);
 
 var Select = function Select(props) {
@@ -41,14 +41,13 @@ var Select = function Select(props) {
     }),
     displayEmpty: true,
     disabled: disabled || loading
-    // WCAG 3.3.2 下拉選單需有可及名稱（含 MUI 隱藏 input），未提供時以 placeholder 代替
+    // WCAG 3.3.2 可及名稱：顯示層(role=button)預設以其文字內容(選中值/placeholder)為名稱；
+    // 僅在明確提供 ariaLabel/ariaLabelledby 時才覆蓋（避免蓋掉有意義的選中值文字）。
+    // 隱藏原生 input 由 select.scss 的 visibility:hidden 讓檢測工具略過，無需再標 label。
     ,
-    inputProps: {
-      'aria-label': ariaLabelledby ? undefined : ariaLabel || placeholder
-    },
     SelectDisplayProps: {
-      'aria-labelledby': ariaLabelledby,
-      'aria-label': ariaLabelledby ? undefined : ariaLabel || placeholder
+      'aria-labelledby': ariaLabelledby || undefined,
+      'aria-label': ariaLabelledby ? undefined : ariaLabel
     },
     renderValue: function renderValue(id) {
       var finder = itemFind(id);

package/lib/components/Select.js

@@ -1,4 +1,4 @@
-export { S as default } from './Select-e550d0a5.js';
+export { S as default } from './Select-ac580a1f.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';

package/package.json

@@ -1,125 +1,125 @@
-{
-	"name": "@daoyi/nmtl-ui",
-	"version": "2.0.1-beta.94",
-	"description": "This project is to be used as a starter kit for building React component using Storybook and Rollup",
-	"author": "daoyi",
-	"main": "lib/index.js",
-	"typings": "lib/index.d.ts",
-	"files": [
-		"lib"
-	],
-	"repository": {
-		"type": "git",
-		"url": "https://github.com/HsunTsai/react-storybook-jsx-starter"
-	},
-	"dependencies": {
-		"@geometricpanda/storybook-addon-badges": "0.2.2",
-		"@material-ui/core": "4.12.3",
-		"@material-ui/icons": "4.11.2",
-		"@material-ui/lab": "4.0.0-alpha.60",
-		"@material-ui/styles": "4.11.4",
-		"axios": "0.21.1",
-		"babel-eslint": "10.1.0",
-		"classnames": "2.3.1",
-		"d3": "5.16.0",
-		"d3-selection": "1.4.2",
-		"d3-transition": "1.3.2",
-		"dom-to-image": "2.6.0",
-		"formik": "2.2.9",
-		"html-to-react": "1.4.5",
-		"jquery": "3.6.0",
-		"js-file-download": "0.4.12",
-		"jszip": "3.7.1",
-		"lodash": "4.17.21",
-		"markdown-it": "12.0.6",
-		"moment": "^2.29.4",
-		"notistack": "1.0.10",
-		"prop-types": "15.7.2",
-		"query-string": "6.12.1",
-		"react": "16.14.0",
-		"react-awesome-lightbox": "^1.8.1",
-		"react-data-export": "0.6.0",
-		"react-dom": "16.14.0",
-		"react-dropzone": "11.3.2",
-		"react-facebook-login": "4.1.1",
-		"react-file-download": "0.3.5",
-		"react-font-size-changer": "0.2.0",
-		"react-google-login": "5.2.2",
-		"react-intl": "5.8.0",
-		"react-redux": "7.2.5",
-		"react-router-dom": "5.2.0",
-		"react-share": "4.4.0",
-		"react-slick": "^0.28.1",
-		"redux": "4.1.0",
-		"sass": "1.41.1",
-		"screenfull": "5.2.0",
-		"slick-carousel": "^1.8.1",
-		"styled-components": "5.3.5",
-		"xlsx": "0.18.5"
-	},
-	"devDependencies": {
-		"@babel/core": "7.14.8",
-		"@babel/preset-env": "7.14.8",
-		"@babel/preset-react": "7.14.5",
-		"@rollup/plugin-babel": "5.3.1",
-		"@rollup/plugin-commonjs": "22.0.0",
-		"@rollup/plugin-node-resolve": "13.2.1",
-		"@rollup/plugin-replace": "4.0.0",
-		"@rollup/plugin-image": "2.1.1",
-		"@rollup/plugin-json": "4.1.0",
-		"@storybook/addon-essentials": "6.5.13",
-		"@storybook/addon-links": "6.5.13",
-		"@storybook/addon-notes": "6.0.0-alpha.6",
-		"@storybook/addons": "6.5.13",
-		"@storybook/preset-scss": "1.0.3",
-		"@storybook/react": "6.5.13",
-		"autoprefixer": "9.8.6",
-		"babel-loader": "8.2.2",
-		"babel-plugin-transform-imports": "2.0.0",
-		"css-loader": "1.0.1",
-		"eslint": "7.2.0",
-		"eslint-config-airbnb": "18.2.1",
-		"eslint-config-node": "4.1.0",
-		"eslint-config-prettier": "8.3.0",
-		"eslint-loader": "4.0.2",
-		"eslint-plugin-import": "2.22.1",
-		"eslint-plugin-jsx-a11y": "6.4.1",
-		"eslint-plugin-node": "11.1.0",
-		"eslint-plugin-prettier": "3.4.1",
-		"eslint-plugin-react": "7.21.5",
-		"eslint-plugin-react-hooks": "1.7.0",
-		"http-proxy-middleware": "1.3.1",
-		"prettier": "2.4.1",
-		"rollup": "2.70.2",
-		"rollup-plugin-cleaner": "1.0.0",
-		"rollup-plugin-postcss": "4.0.1",
-		"rollup-plugin-terser": "7.0.2",
-		"sass-loader": "7.1.0",
-		"style-loader": "0.22.1"
-	},
-	"browserslist": {
-		"production": [
-			">0.2%",
-			"not dead",
-			"not op_mini all"
-		],
-		"development": [
-			"last 1 chrome version",
-			"last 1 firefox version",
-			"last 1 safari version"
-		]
-	},
-	"scripts": {
-		"start": "set NODE_OPTIONS=--max_old_space_size=16384 && yarn storybook",
-		"lint": "eslint ./src/**/*.{js,jsx}",
-		"format": "prettier --write --tab-width 4 --use-tabs true \"{,src/**/}*.{js,jsx}\"",
-		"storybook": "start-storybook -p 6006 --no-open",
-		"build": "rollup -c && npm run build-index",
-		"build-index": "node ./rollup.index.js",
-		"build-storybook": "build-storybook -c .storybook -o public",
-		"create": "node ./buildUtils/create.js",
-		"pub": "npm version patch -m Publish && npm publish",
-		"pub-alpha": "npm version prerelease --preid=alpha && npm publish --tag alpha",
-		"pub-beta": "npm version prerelease --preid=beta && npm publish --tag beta"
-	}
-}
+{
+	"name": "@daoyi/nmtl-ui",
+	"version": "2.0.1-beta.96",
+	"description": "This project is to be used as a starter kit for building React component using Storybook and Rollup",
+	"author": "daoyi",
+	"main": "lib/index.js",
+	"typings": "lib/index.d.ts",
+	"files": [
+		"lib"
+	],
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/HsunTsai/react-storybook-jsx-starter"
+	},
+	"dependencies": {
+		"@geometricpanda/storybook-addon-badges": "0.2.2",
+		"@material-ui/core": "4.12.3",
+		"@material-ui/icons": "4.11.2",
+		"@material-ui/lab": "4.0.0-alpha.60",
+		"@material-ui/styles": "4.11.4",
+		"axios": "0.21.1",
+		"babel-eslint": "10.1.0",
+		"classnames": "2.3.1",
+		"d3": "5.16.0",
+		"d3-selection": "1.4.2",
+		"d3-transition": "1.3.2",
+		"dom-to-image": "2.6.0",
+		"formik": "2.2.9",
+		"html-to-react": "1.4.5",
+		"jquery": "3.6.0",
+		"js-file-download": "0.4.12",
+		"jszip": "3.7.1",
+		"lodash": "4.17.21",
+		"markdown-it": "12.0.6",
+		"moment": "^2.29.4",
+		"notistack": "1.0.10",
+		"prop-types": "15.7.2",
+		"query-string": "6.12.1",
+		"react": "16.14.0",
+		"react-awesome-lightbox": "^1.8.1",
+		"react-data-export": "0.6.0",
+		"react-dom": "16.14.0",
+		"react-dropzone": "11.3.2",
+		"react-facebook-login": "4.1.1",
+		"react-file-download": "0.3.5",
+		"react-font-size-changer": "0.2.0",
+		"react-google-login": "5.2.2",
+		"react-intl": "5.8.0",
+		"react-redux": "7.2.5",
+		"react-router-dom": "5.2.0",
+		"react-share": "4.4.0",
+		"react-slick": "^0.28.1",
+		"redux": "4.1.0",
+		"sass": "1.41.1",
+		"screenfull": "5.2.0",
+		"slick-carousel": "^1.8.1",
+		"styled-components": "5.3.5",
+		"xlsx": "0.18.5"
+	},
+	"devDependencies": {
+		"@babel/core": "7.14.8",
+		"@babel/preset-env": "7.14.8",
+		"@babel/preset-react": "7.14.5",
+		"@rollup/plugin-babel": "5.3.1",
+		"@rollup/plugin-commonjs": "22.0.0",
+		"@rollup/plugin-node-resolve": "13.2.1",
+		"@rollup/plugin-replace": "4.0.0",
+		"@rollup/plugin-image": "2.1.1",
+		"@rollup/plugin-json": "4.1.0",
+		"@storybook/addon-essentials": "6.5.13",
+		"@storybook/addon-links": "6.5.13",
+		"@storybook/addon-notes": "6.0.0-alpha.6",
+		"@storybook/addons": "6.5.13",
+		"@storybook/preset-scss": "1.0.3",
+		"@storybook/react": "6.5.13",
+		"autoprefixer": "9.8.6",
+		"babel-loader": "8.2.2",
+		"babel-plugin-transform-imports": "2.0.0",
+		"css-loader": "1.0.1",
+		"eslint": "7.2.0",
+		"eslint-config-airbnb": "18.2.1",
+		"eslint-config-node": "4.1.0",
+		"eslint-config-prettier": "8.3.0",
+		"eslint-loader": "4.0.2",
+		"eslint-plugin-import": "2.22.1",
+		"eslint-plugin-jsx-a11y": "6.4.1",
+		"eslint-plugin-node": "11.1.0",
+		"eslint-plugin-prettier": "3.4.1",
+		"eslint-plugin-react": "7.21.5",
+		"eslint-plugin-react-hooks": "1.7.0",
+		"http-proxy-middleware": "1.3.1",
+		"prettier": "2.4.1",
+		"rollup": "2.70.2",
+		"rollup-plugin-cleaner": "1.0.0",
+		"rollup-plugin-postcss": "4.0.1",
+		"rollup-plugin-terser": "7.0.2",
+		"sass-loader": "7.1.0",
+		"style-loader": "0.22.1"
+	},
+	"browserslist": {
+		"production": [
+			">0.2%",
+			"not dead",
+			"not op_mini all"
+		],
+		"development": [
+			"last 1 chrome version",
+			"last 1 firefox version",
+			"last 1 safari version"
+		]
+	},
+	"scripts": {
+		"start": "set NODE_OPTIONS=--max_old_space_size=16384 && yarn storybook",
+		"lint": "eslint ./src/**/*.{js,jsx}",
+		"format": "prettier --write --tab-width 4 --use-tabs true \"{,src/**/}*.{js,jsx}\"",
+		"storybook": "start-storybook -p 6006 --no-open",
+		"build": "rollup -c && npm run build-index",
+		"build-index": "node ./rollup.index.js",
+		"build-storybook": "build-storybook -c .storybook -o public",
+		"create": "node ./buildUtils/create.js",
+		"pub": "npm version patch -m Publish && npm publish",
+		"pub-alpha": "npm version prerelease --preid=alpha && npm publish --tag alpha",
+		"pub-beta": "npm version prerelease --preid=beta && npm publish --tag beta"
+	}
+}