@daoyi/nmtl-ui 2.0.1-beta.131 → 2.0.1-beta.133

package/lib/components/{Autocomplete-3b418e5f.js → Autocomplete-0ea4a31c.js}

@@ -6,10 +6,10 @@ import { d as debounce_1 } from './debounce-127da66c.js';
 import { Autocomplete as Autocomplete$1 } from '@material-ui/lab';
 import { Chip, TextField, CircularProgress } from '@material-ui/core';
 import { Close, SearchOutlined } from '@material-ui/icons';
-import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-e3803ee1.js';
-import { _ as _extends, m as merge, d as defaultTheme, c as compose, b as borders, a as display, f as flexbox, g as grid, p as positions, e as palette, h as boxShadow, s as sizing, i as spacing, t as typography } from './defaultTheme-ed7746fe.js';
+import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-dc603596.js';
+import { _ as _extends, m as merge, d as defaultTheme, c as compose, b as borders, a as display, f as flexbox, g as grid, p as positions, e as palette, h as boxShadow, s as sizing, i as spacing, t as typography } from './defaultTheme-c5dd0f64.js';
 import 'react-is';
-import { _ as _toConsumableArray } from './toConsumableArray-dbe8af76.js';
+import { _ as _toConsumableArray } from './toConsumableArray-c268c112.js';
 import { styled as styled$1 } from '@material-ui/styles';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';

package/lib/components/Autocomplete.js

@@ -1,4 +1,4 @@
-export { A as default } from './Autocomplete-3b418e5f.js';
+export { A as default } from './Autocomplete-0ea4a31c.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
@@ -9,12 +9,12 @@ import './_commonjsHelpers-70de2c37.js';
 import '@material-ui/lab';
 import '@material-ui/core';
 import '@material-ui/icons';
-import './createSvgIcon-e3803ee1.js';
-import './defaultTheme-ed7746fe.js';
+import './createSvgIcon-dc603596.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
 import 'react-dom';
-import './toConsumableArray-dbe8af76.js';
+import './toConsumableArray-c268c112.js';
 import './globalConfig';
 import './style-inject.es-1f59c1d0.js';
 import './Empty-c6a44967.js';

package/lib/components/BackTop.js

@@ -4,12 +4,12 @@ import PropTypes from 'prop-types';
 import { c as classNames } from './index-b76a85f4.js';
 import { d as debounce_1 } from './debounce-127da66c.js';
 import { Fade, NoSsr, Box } from '@material-ui/core';
-import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-e3803ee1.js';
+import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-dc603596.js';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './isObjectLike-e111475d.js';
 import './_commonjsHelpers-70de2c37.js';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
 import 'react-dom';

package/lib/components/{ContactModal-eaed02b8.js → ContactModal-159de99c.js}

@@ -2,21 +2,21 @@ import { _ as _extends$1, a as _slicedToArray$2, b as _objectSpread2, e as _defi
 import React__default, { createContext, forwardRef, createElement, useContext, useRef, useEffect, useReducer, useCallback, useMemo, useLayoutEffect, useState, useImperativeHandle, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import './hoist-non-react-statics.cjs-3f408ad2.js';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
-import { u as useTheme } from './useTheme-d16d02d9.js';
-import './withTheme-2d778133.js';
+import { u as useTheme } from './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
 import axios from 'axios';
 import { M as Modal } from './Modal-e04532fa.js';
 import { c as commonjsGlobal, a as getDefaultExportFromCjs } from './_commonjsHelpers-70de2c37.js';
 import { c as classNames } from './index-b76a85f4.js';
 import { Input, IconButton, Button, Box, Typography, FormControl, RadioGroup, FormControlLabel, Radio, TextField, TextareaAutosize } from '@material-ui/core';
-import { S as Select } from './Select-cb3e1ba1.js';
+import { S as Select } from './Select-89841c71.js';
 import { VolumeUp } from '@material-ui/icons';
 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';
+import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-dc603596.js';
 
 var isArray$1 = Array.isArray;
 var keyList = Object.keys;

package/lib/components/ContactModal.js

@@ -1,13 +1,13 @@
-export { C as default } from './ContactModal-eaed02b8.js';
+export { C as default } from './ContactModal-159de99c.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
 import './hoist-non-react-statics.cjs-3f408ad2.js';
 import 'react-is';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import '@material-ui/styles';
-import './useTheme-d16d02d9.js';
-import './withTheme-2d778133.js';
+import './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
 import 'axios';
 import './Modal-e04532fa.js';
 import './index-b76a85f4.js';
@@ -18,7 +18,7 @@ import './style-inject.es-1f59c1d0.js';
 import './Spin-8f87eadc.js';
 import './globalConfig';
 import './_commonjsHelpers-70de2c37.js';
-import './Select-cb3e1ba1.js';
+import './Select-89841c71.js';
 import './Empty-c6a44967.js';
-import './createSvgIcon-e3803ee1.js';
+import './createSvgIcon-dc603596.js';
 import 'react-dom';

package/lib/components/Drawer-a5be9257.js

@@ -0,0 +1,245 @@
+import { _ as _extends, a as _slicedToArray } from './_rollupPluginBabelHelpers-a52356f6.js';
+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, CloseRounded } from '@material-ui/icons';
+import { S as Select } from './Select-89841c71.js';
+import { S as SegmentedControl } from './SegmentedControl-81f63afc.js';
+import { useRouteMatch, NavLink } from 'react-router-dom';
+import { getIntl } from './globalConfig';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+
+var defaultSupportLanguage = [
+// { value: 'en', label: 'English' },
+{
+  value: 'zh-tw',
+  label: '繁體中文'
+}
+// { value: 'zh-cn', label: '簡體中文' },
+];
+
+/* [檢查-語系]本系統是否支援該語系 並回傳語系 */
+var checkLanguageSupport = function checkLanguageSupport(_ref) {
+  var language = _ref.language,
+    supportLanguages = _ref.supportLanguages;
+  var isSupport = supportLanguages.some(function (_ref2) {
+    var value = _ref2.value;
+    return value === language;
+  });
+  return isSupport ? language : supportLanguages[0].value;
+};
+
+/* 抽屜內的主選單：與桌機頁首一致用真連結（可長按另開、讀屏唸「連結」）。
+ * 保留 MUI List／ListItem／ListItemText 結構：各站以主題或 app.scss 覆蓋了這些 class
+ * （ada 的 MuiList 深底白字、tahl 的 hover 色），換成自訂標記會讓那些樣式失效。
+ * - ListItem 以 NavLink 渲染成 <a href>；目前所在頁由 NavLink 自動加 aria-current="page"，
+ *   並掛上 Mui-selected（沿用各站既有的選中底色）與 drawer__link--active（左側色條＋粗體）
+ * - ButtonBase 對非 <button> 元件會補 role="button"，須明確清掉，否則讀屏仍唸成按鈕 */
+const DrawerList = _ref => {
+  let {
+    drawerList,
+    setOpen
+  } = _ref;
+  const {
+    url
+  } = useRouteMatch();
+  return /*#__PURE__*/React__default.createElement("nav", null, /*#__PURE__*/React__default.createElement(List, {
+    className: "drawer__list"
+  }, Array.isArray(drawerList) && drawerList.map((_ref2, index) => {
+    let {
+      name,
+      icon,
+      path = ''
+    } = _ref2;
+    const internalProps = {
+      component: NavLink,
+      to: `${url}${path}`,
+      activeClassName: 'Mui-selected drawer__link--active'
+    };
+    /* 外部連結比照桌機頁首另開新視窗，並預先提示（WCAG 3.2.2） */
+    const externalProps = {
+      component: 'a',
+      href: path,
+      target: '_blank',
+      rel: 'noopener noreferrer',
+      'aria-label': `${name}${getIntl().formatMessage({
+        id: 'aria.newWindow'
+      })}`
+    };
+    const linkProps = path.indexOf('http') > -1 ? externalProps : internalProps;
+    return /*#__PURE__*/React__default.createElement("li", {
+      key: index.toString()
+    }, /*#__PURE__*/React__default.createElement(ListItem, _extends({
+      button: true,
+      className: "drawer__link",
+      role: undefined,
+      onClick: () => setOpen(false)
+    }, linkProps), icon && /*#__PURE__*/React__default.createElement(ListItemIcon, {
+      style: {
+        marginRight: 24
+      }
+    }, icon), /*#__PURE__*/React__default.createElement(ListItemText, {
+      primary: name
+    })));
+  })));
+};
+DrawerList.defaultProps = {};
+DrawerList.propTypes = {
+  drawerList: PropTypes.arrayOf(PropTypes.any).isRequired,
+  setOpen: PropTypes.func.isRequired
+};
+
+var css_248z = "@charset \"UTF-8\";\n/* 抽屜內容統一靠左對齊在同一條線上（選單文字、工具區標籤都從 1.5rem 起排） */\n.drawer {\n  /* 兩層 class 提高權重，蓋過 MUI 主題注入的 .MuiIconButton-root */\n  /* ListItem（渲染成 <a>）。hover／選中底色沿用 MUI 與各站主題的 MuiListItem、Mui-selected 設定 */\n  /* 目前所在頁：左側色條＋粗體，不只靠底色（WCAG 1.4.1）。\n     色條畫在文字元素上取 currentColor：各站常以 !important 改抽屜文字色（ada 白字、tahl 藍綠），\n     色條才會與文字同色；ListItem 本身是 position:relative，色條貼齊整列左緣 */\n  /* 語系超過 3 種時退回下拉：撐滿工具區寬度 */\n}\n.drawer__icon {\n  display: none !important;\n}\n.drawer__paper {\n  width: 20rem;\n  max-width: 90vw;\n  /* 開啟時 MUI 把焦點放在紙面本身（tabindex=-1 的容器，非操作元件），不畫焦點框；\n     須 !important 才蓋得過各站 a11y.scss 的全域 :focus-visible */\n}\n.drawer__paper:focus {\n  outline: none !important;\n}\n.drawer__header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.5rem;\n  padding: 0.75rem 0.5rem 0.75rem 1.5rem;\n}\n.drawer__header-brand {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n}\n.drawer__header-title {\n  font-size: 1.125rem;\n  font-weight: bold;\n}\n.drawer__header .drawer__close {\n  flex-shrink: 0;\n  /* 觸控目標 48px（WCAG 2.5.5）：共用主題把 IconButton padding 改成 8（只剩 40px），\n     部分子站手機版又把根字級縮到 70%，故用 px 保底 */\n  min-width: 48px;\n  min-height: 48px;\n  margin-left: auto;\n  /* 深色主題（palette.type=dark，如 ada、tahl）的 IconButton 預設白色，在淺色抽屜上看不見 → 沿用抽屜文字色 */\n  color: inherit;\n}\n.drawer__header .drawer__close.Mui-focusVisible {\n  outline: 2px solid currentColor;\n}\n.drawer__list > li {\n  list-style: none;\n}\n.drawer__list .drawer__link {\n  /* 觸控目標 48px（WCAG 2.5.5） */\n  min-height: 3rem;\n  /* 文字與工具區標籤對齊 1.5rem（蓋過 MuiListItem-gutters 的 16px） */\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n  color: inherit;\n  text-decoration: none;\n  /* 連結撐滿抽屜寬度，紙面又會捲動（overflow:auto），外凸的焦點框左右會被裁掉 → 內縮完整框。\n     各站 a11y.scss 的全域 :focus-visible 以 !important 設 outline-offset，這裡也須 !important 才蓋得過 */\n}\n.drawer__list .drawer__link:focus-visible {\n  outline: 2px solid currentColor;\n  outline-offset: -4px !important;\n}\n.drawer__link--active .MuiTypography-root {\n  font-weight: 700;\n}\n.drawer__link--active .MuiTypography-root::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  width: 0.25rem;\n  background: currentColor;\n}\n.drawer__tools {\n  display: flex;\n  flex-direction: column;\n  gap: 1.25rem;\n  padding: 1.25rem 1.5rem;\n}\n.drawer__lang.select {\n  width: 100%;\n}\n\n@media screen and (max-width: 768px) {\n  .drawer {\n    display: flex;\n    justify-content: flex-end;\n  }\n  .drawer__icon {\n    display: flex !important;\n  }\n}";
+styleInject(css_248z);
+
+/* 語系不多時並排成分段按鈕（點一下即切換），太多才退回下拉 */
+var MAX_SEGMENTED_LANGUAGES = 3;
+var Drawer = function Drawer(_ref) {
+  var title = _ref.title,
+    logo = _ref.logo,
+    locale = _ref.locale,
+    supportLanguages = _ref.supportLanguages,
+    drawerList = _ref.drawerList,
+    onLanguageChange = _ref.onLanguageChange,
+    languageSelectLabel = _ref.languageSelectLabel,
+    extraTools = _ref.extraTools;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  var languages = Array.isArray(supportLanguages) ? supportLanguages : [];
+  var currentLanguage = languages.length > 0 ? checkLanguageSupport({
+    language: locale,
+    supportLanguages: languages
+  }) : undefined;
+  /* extraTools 可傳函式，依擺放位置（header／drawer）給不同版面 */
+  var tools = typeof extraTools === 'function' ? extraTools({
+    placement: 'drawer'
+  }) : extraTools;
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "drawer"
+  }, /*#__PURE__*/React__default.createElement(IconButton, {
+    className: "drawer__icon",
+    "aria-label": getIntl().formatMessage({
+      id: 'aria.header.menuOpen'
+    }),
+    "aria-haspopup": "dialog",
+    "aria-expanded": open,
+    onClick: function onClick() {
+      return setOpen(true);
+    }
+  }, /*#__PURE__*/React__default.createElement(DehazeRounded, {
+    fontSize: "large",
+    "aria-hidden": "true"
+  })), /*#__PURE__*/React__default.createElement(Drawer$1, {
+    anchor: "right",
+    open: open,
+    onClose: function onClose() {
+      return setOpen(false);
+    },
+    onKeyDown: function onKeyDown(event) {
+      if (event.key === 'Escape') setOpen(false);
+    }
+    /* 抽屜是強制回應的浮層（背景不可操作），以 dialog 語意讓讀屏在開啟時唸出名稱（WCAG 4.1.2） */,
+    PaperProps: {
+      className: 'drawer__paper',
+      role: 'dialog',
+      'aria-modal': true,
+      'aria-label': getIntl().formatMessage({
+        id: 'aria.header.navigation'
+      })
+    }
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "drawer__header"
+  }, (logo || title) && /*#__PURE__*/React__default.createElement("div", {
+    className: "drawer__header-brand"
+  }, logo && /*#__PURE__*/React__default.createElement("div", {
+    className: "drawer__header-logo"
+  }, logo), title && /*#__PURE__*/React__default.createElement("div", {
+    className: "drawer__header-title"
+  }, title)), /*#__PURE__*/React__default.createElement(IconButton, {
+    className: "drawer__close",
+    "aria-label": getIntl().formatMessage({
+      id: 'aria.header.menuClose'
+    }),
+    onClick: function onClick() {
+      return setOpen(false);
+    }
+  }, /*#__PURE__*/React__default.createElement(CloseRounded, {
+    "aria-hidden": "true"
+  }))), /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(DrawerList, {
+    drawerList: (Array.isArray(drawerList) ? drawerList : []).filter(function (_ref2) {
+      var showInHeader = _ref2.showInHeader;
+      return showInHeader;
+    }),
+    setOpen: setOpen
+  }), (languages.length > 0 || tools) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement("div", {
+    className: "drawer__tools"
+  }, languages.length > 0 && languages.length <= MAX_SEGMENTED_LANGUAGES && /*#__PURE__*/React__default.createElement(SegmentedControl, {
+    className: "drawer__lang",
+    label: getIntl().formatMessage({
+      id: 'header.language'
+    }),
+    options: languages.map(function (_ref3) {
+      var value = _ref3.value,
+        label = _ref3.label,
+        lang = _ref3.lang;
+      return {
+        value: value,
+        label: label,
+        lang: lang
+      };
+    }),
+    value: currentLanguage,
+    onChange: function onChange(value) {
+      return onLanguageChange(value);
+    }
+  }), languages.length > MAX_SEGMENTED_LANGUAGES && /*#__PURE__*/React__default.createElement(Select, {
+    className: "drawer__lang",
+    ariaLabel: languageSelectLabel || getIntl().formatMessage({
+      id: 'aria.header.languageSelect'
+    }),
+    defaultValue: currentLanguage,
+    onChange: function onChange(value) {
+      return onLanguageChange(value);
+    },
+    options: languages
+  }), tools && /*#__PURE__*/React__default.createElement("div", {
+    className: "drawer__extraTools"
+  }, tools)))));
+};
+Drawer.defaultProps = {
+  title: undefined,
+  logo: undefined,
+  locale: undefined,
+  supportLanguages: [
+  // { value: 'en', label: 'English' },
+  {
+    value: 'zh-tw',
+    label: '繁體中文'
+  }
+  // { value: 'zh-cn', label: '簡體中文' },
+  ],
+
+  drawerList: undefined,
+  onLanguageChange: function onLanguageChange() {},
+  languageSelectLabel: undefined,
+  extraTools: undefined
+};
+Drawer.propTypes = {
+  title: PropTypes.string,
+  logo: PropTypes.node,
+  /** 目前語系（決定語言切換鈕的選中狀態） */
+  locale: PropTypes.string,
+  /** 支援的語系；3 種以內並排成分段按鈕，超過改用下拉 */
+  supportLanguages: PropTypes.arrayOf(PropTypes.any),
+  drawerList: PropTypes.arrayOf(PropTypes.any),
+  onLanguageChange: PropTypes.func,
+  /** 語言下拉的無障礙名稱（WCAG 3.3.2）；未提供時使用套件內 aria.header.languageSelect */
+  languageSelectLabel: PropTypes.string,
+  /** 呼叫端自訂的工具區（如字級縮放）；由 Header 一併傳入，窄畫面時顯示於抽屜內。
+      傳函式時以 ({ placement: 'drawer' }) 呼叫，可給抽屜專用的版面 */
+  extraTools: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
+};
+
+export { Drawer as D, checkLanguageSupport as c, defaultSupportLanguage as d };

package/lib/components/Drawer.js

@@ -1,17 +1,18 @@
-export { D as default } from './Drawer-629e59c7.js';
+export { D as default } from './Drawer-a5be9257.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
 import '@material-ui/core';
 import '@material-ui/icons';
-import './Select-cb3e1ba1.js';
+import './Select-89841c71.js';
 import './index-b76a85f4.js';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
-import './useTheme-d16d02d9.js';
-import './withTheme-2d778133.js';
+import './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
 import './Empty-c6a44967.js';
 import './style-inject.es-1f59c1d0.js';
 import './globalConfig';
+import './SegmentedControl-81f63afc.js';
 import 'react-router-dom';

package/lib/components/Footer.js

@@ -3,24 +3,24 @@ 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-eaed02b8.js';
+import { C as ContactModal } from './ContactModal-159de99c.js';
 import { S as Spin } from './Spin-8f87eadc.js';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './hoist-non-react-statics.cjs-3f408ad2.js';
 import 'react-is';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import '@material-ui/styles';
-import './useTheme-d16d02d9.js';
-import './withTheme-2d778133.js';
+import './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
 import './Modal-e04532fa.js';
 import '@material-ui/core';
 import '@material-ui/icons';
 import './Button-7bd5aa09.js';
 import './_commonjsHelpers-70de2c37.js';
-import './Select-cb3e1ba1.js';
+import './Select-89841c71.js';
 import './Empty-c6a44967.js';
-import './createSvgIcon-e3803ee1.js';
+import './createSvgIcon-dc603596.js';
 import 'react-dom';
 
 /* eslint-disable max-len */

package/lib/components/Header.js

@@ -6,25 +6,26 @@ import { d as debounce_1 } from './debounce-127da66c.js';
 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-fec33a2c.js';
-import { S as Select } from './Select-cb3e1ba1.js';
-import { c as checkLanguageSupport, D as Drawer, d as defaultSupportLanguage } from './Drawer-629e59c7.js';
+import { K as KeywordSearch } from './KeywordSearch-db9c45d9.js';
+import { S as Select } from './Select-89841c71.js';
+import { c as checkLanguageSupport, D as Drawer, d as defaultSupportLanguage } from './Drawer-a5be9257.js';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './isObjectLike-e111475d.js';
 import './_commonjsHelpers-70de2c37.js';
 import 'axios';
-import './Autocomplete-3b418e5f.js';
+import './Autocomplete-0ea4a31c.js';
 import '@material-ui/lab';
-import './createSvgIcon-e3803ee1.js';
-import './defaultTheme-ed7746fe.js';
+import './createSvgIcon-dc603596.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
 import 'react-dom';
-import './toConsumableArray-dbe8af76.js';
+import './toConsumableArray-c268c112.js';
 import './Empty-c6a44967.js';
-import './useTheme-d16d02d9.js';
-import './withTheme-2d778133.js';
+import './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
+import './SegmentedControl-81f63afc.js';
 
 var css_248z = "@charset \"UTF-8\";\n.header {\n  display: flex;\n  align-items: center;\n  background: rgba(255, 255, 255, 0.6);\n  background-color: rgba(255, 255, 255, 0.6);\n  padding: 12px 36px !important;\n  position: fixed;\n  top: 0;\n  z-index: 10;\n  width: 100% !important;\n  transition: top 0.3s ease-in-out;\n  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);\n  /* 呼叫端自訂工具區（如字級縮放）：與語系選單同屬右側工具列 */\n}\n.header__logo {\n  display: flex;\n  width: -moz-fit-content !important;\n  width: fit-content !important;\n  margin-right: 30px !important;\n  cursor: pointer;\n  text-decoration: none;\n}\n.header__logo__img {\n  display: flex;\n  align-items: center;\n}\n.header__logo__title {\n  white-space: nowrap;\n  margin-left: 1rem !important;\n  font-size: 1.5rem !important;\n  font-weight: 700 !important;\n  font-family: \"Noto Sans TC\" !important;\n}\n.header__links {\n  display: flex;\n  justify-content: flex-end;\n  padding-right: 14px;\n}\n.header__links a {\n  text-decoration: none;\n}\n.header__links--full {\n  flex: 1;\n}\n.header__links__item {\n  color: rgba(0, 0, 0, 0.85);\n  font-size: 1.125rem !important;\n  font-weight: 500 !important;\n  white-space: nowrap;\n  padding: 6px 14px;\n  font-family: \"Noto Sans TC\" !important;\n}\n.header__links__item--active .header__links__item {\n  font-weight: 800 !important;\n  background: transparent;\n  border-radius: 45px;\n}\n.header__links__item:hover {\n  font-weight: 800 !important;\n}\n.header__language {\n  min-width: 100px !important;\n}\n.header__extraTools {\n  display: flex;\n  align-items: center;\n  margin-right: 8px;\n}\n.header__searchIcon {\n  display: none !important;\n}\n@media screen and (max-width: 768px) {\n  .header--smallUseSearchIcon .header__searchIcon {\n    display: flex !important;\n    margin-right: 10px !important;\n  }\n  .header--smallUseSearchIcon .keywordSearch {\n    visibility: hidden;\n    flex: 1;\n    width: 0;\n  }\n}\n.header--hide {\n  top: -100px;\n}\n.header--focus .header__links {\n  display: none;\n}\n.header .MuiTypography-root {\n  width: 100%;\n  display: flex;\n  align-items: center;\n}\n.header .autocomplete {\n  float: right;\n}\n.header .autocomplete .MuiAutocomplete-inputRoot[class*=MuiOutlinedInput-root] {\n  padding: 1px 8px !important;\n}\n.header .keywordSearch {\n  margin-right: 8px;\n}\n.header .keywordSearch--focus .autocomplete {\n  width: 100% !important;\n}\n.header .keywordSearch--animation .autocomplete {\n  width: 240px;\n  transition: width 0.3s ease-in-out;\n}\n\n/* 避免寬度460以下炸版 */\n@media screen and (max-width: 460px) {\n  .header .keywordSearch--animation .autocomplete {\n    width: 100%;\n  }\n}\n@media screen and (max-width: 768px) {\n  .header {\n    padding: 12px 15px !important;\n    /* 窄畫面比照語系選單收進抽屜，避免擠壓搜尋框 */\n  }\n  .header__logo {\n    margin-right: 16px !important;\n  }\n  .header__logo__title {\n    display: none !important;\n  }\n  .header__links {\n    display: none;\n  }\n  .header__links__item {\n    font-size: 1rem !important;\n  }\n  .header__language {\n    display: none !important;\n  }\n  .header__extraTools {\n    display: none !important;\n  }\n  .header--focus .header__logo {\n    display: none !important;\n  }\n\n  .autocomplete__icon {\n    display: none !important;\n  }\n}";
 styleInject(css_248z);
@@ -152,7 +153,9 @@ var Header = function Header(props) {
     "aria-hidden": "true"
   })), showDarkModeSwitch , extraTools && /*#__PURE__*/React__default.createElement("div", {
     className: "header__extraTools"
-  }, extraTools), Array.isArray(supportLanguages) && supportLanguages.length > 0 && /*#__PURE__*/React__default.createElement(Select, {
+  }, typeof extraTools === 'function' ? extraTools({
+    placement: 'header'
+  }) : extraTools), Array.isArray(supportLanguages) && supportLanguages.length > 0 && /*#__PURE__*/React__default.createElement(Select, {
     className: "header__language",
     ariaLabel: languageSelectLabel || getIntl().formatMessage({
       id: 'aria.header.languageSelect'
@@ -168,6 +171,7 @@ var Header = function Header(props) {
   }), /*#__PURE__*/React__default.createElement(Drawer, {
     title: title,
     logo: logo,
+    locale: locale,
     drawerList: pages,
     supportLanguages: supportLanguages,
     onLanguageChange: onLanguageChange,
@@ -226,8 +230,9 @@ Header.propTypes = {
   onSearchIconClick: PropTypes.func,
   /** 語言下拉的無障礙名稱（WCAG 3.3.2）；未提供時使用套件內 aria.header.languageSelect */
   languageSelectLabel: PropTypes.string,
-  /** 呼叫端自訂的工具區（如字級縮放）：寬畫面顯示於語系選單之前，窄畫面隨語系一起收進抽屜 */
-  extraTools: PropTypes.node
+  /** 呼叫端自訂的工具區（如字級縮放）：寬畫面顯示於語系選單之前，窄畫面隨語系一起收進抽屜。
+      傳函式時以 ({ placement: 'header' | 'drawer' }) 呼叫，可依位置給不同版面 */
+  extraTools: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
 };
 
 export { Header as default };

package/lib/components/{KeywordSearch-fec33a2c.js → KeywordSearch-db9c45d9.js}

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { c as classNames } from './index-b76a85f4.js';
 import axios from 'axios';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
-import { A as Autocomplete } from './Autocomplete-3b418e5f.js';
+import { A as Autocomplete } from './Autocomplete-0ea4a31c.js';
 
 var css_248z = ".keywordSearch {\n  border-radius: 4px;\n  width: 100%;\n  margin-right: 14px;\n}\n.keywordSearch--animation .autocomplete {\n  transition: max-width 0.3s ease-out;\n  max-width: 240px;\n}\n.keywordSearch--focus {\n  flex: 1;\n}\n.keywordSearch--focus .autocomplete {\n  max-width: 100%;\n}\n.keywordSearch .MuiAutocomplete-hasPopupIcon.MuiAutocomplete-hasClearIcon .MuiAutocomplete-inputRoot[class*=MuiOutlinedInput-root] {\n  border-radius: 10px;\n  background-color: #ffffff66;\n}";
 styleInject(css_248z);

package/lib/components/KeywordSearch.js

@@ -1,22 +1,22 @@
-export { K as default } from './KeywordSearch-fec33a2c.js';
+export { K as default } from './KeywordSearch-db9c45d9.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
 import './index-b76a85f4.js';
 import 'axios';
 import './style-inject.es-1f59c1d0.js';
-import './Autocomplete-3b418e5f.js';
+import './Autocomplete-0ea4a31c.js';
 import './debounce-127da66c.js';
 import './isObjectLike-e111475d.js';
 import './_commonjsHelpers-70de2c37.js';
 import '@material-ui/lab';
 import '@material-ui/core';
 import '@material-ui/icons';
-import './createSvgIcon-e3803ee1.js';
-import './defaultTheme-ed7746fe.js';
+import './createSvgIcon-dc603596.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
 import 'react-dom';
-import './toConsumableArray-dbe8af76.js';
+import './toConsumableArray-c268c112.js';
 import './globalConfig';
 import './Empty-c6a44967.js';

package/lib/components/Keywords.js

@@ -4,14 +4,14 @@ import PropTypes from 'prop-types';
 import { c as classNames } from './index-b76a85f4.js';
 import { M as Modal } from './Modal-e04532fa.js';
 import { Typography } from '@material-ui/core';
-import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-e3803ee1.js';
+import { r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-dc603596.js';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import '@material-ui/icons';
 import './Button-7bd5aa09.js';
 import './Spin-8f87eadc.js';
 import './_commonjsHelpers-70de2c37.js';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
 import 'react-dom';

package/lib/components/MUITheme.js

@@ -2,10 +2,10 @@ import React__default from 'react';
 import PropTypes from 'prop-types';
 import { a as _baseGetTag, b as isObject_1, _ as _root, i as isObjectLike_1, c as _freeGlobal } from './isObjectLike-e111475d.js';
 import { CssBaseline } from '@material-ui/core';
-import { u as createTheme } from './defaultTheme-ed7746fe.js';
+import { v as createTheme } from './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import { ThemeProvider } from '@material-ui/styles';
-import './withTheme-2d778133.js';
+import './withTheme-3486f38b.js';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';
 import './_commonjsHelpers-70de2c37.js';
 

package/lib/components/Pagination.js

@@ -2,13 +2,13 @@ import { c as _objectWithoutProperties$1, a as _slicedToArray$1 } from './_rollu
 import * as React$2 from 'react';
 import React__default, { Children, isValidElement, cloneElement, useState, useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import { k as _objectWithoutProperties, o as _slicedToArray, _ as _extends, q as _objectWithoutPropertiesLoose, r as alpha, j as formatMuiErrorMessage } from './defaultTheme-ed7746fe.js';
-import { u as useControlled, c as clsx, b as useEventCallback, w as withStyles, d as useIsFocusVisible, e as useForkRef, f as createSvgIcon, g as capitalize, h as debounce, r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-e3803ee1.js';
+import { k as _objectWithoutProperties, q as _slicedToArray, _ as _extends, r as _objectWithoutPropertiesLoose, u as alpha, j as formatMuiErrorMessage } from './defaultTheme-c5dd0f64.js';
+import { u as useControlled, c as clsx, b as useEventCallback, w as withStyles, d as useIsFocusVisible, e as useForkRef, f as createSvgIcon, g as capitalize, h as debounce, r as requireCreateSvgIcon, i as interopRequireDefault, a as interopRequireWildcard } from './createSvgIcon-dc603596.js';
 import 'react-is';
 import '@material-ui/styles';
-import './withTheme-2d778133.js';
-import { _ as _toConsumableArray } from './toConsumableArray-dbe8af76.js';
-import { u as useTheme } from './useTheme-d16d02d9.js';
+import './withTheme-3486f38b.js';
+import { _ as _toConsumableArray } from './toConsumableArray-c268c112.js';
+import { u as useTheme } from './useTheme-98b6cf17.js';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default from 'react-dom';
 import { c as classNames } from './index-b76a85f4.js';

package/lib/components/SegmentedControl-81f63afc.js

@@ -0,0 +1,113 @@
+import { b as _objectSpread2 } from './_rollupPluginBabelHelpers-a52356f6.js';
+import React__default, { useRef } from 'react';
+import PropTypes from 'prop-types';
+import { c as classNames } from './index-b76a85f4.js';
+import { o as getContrastRatio } from './defaultTheme-c5dd0f64.js';
+import 'react-is';
+import '@material-ui/styles';
+import { u as useTheme } from './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+
+var css_248z = "@charset \"UTF-8\";\n.segmentedControl__label {\n  display: block;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  font-weight: 700;\n}\n.segmentedControl__group {\n  display: flex;\n}\n.segmentedControl__btn {\n  flex: 1 1 0;\n  min-width: 0;\n  /* 觸控目標 44px（WCAG 2.5.5） */\n  min-height: 2.75rem;\n  padding: 0.25rem 0.5rem;\n  border: 1px solid;\n  background: transparent;\n  color: inherit;\n  font-family: inherit;\n  font-size: 1rem;\n  line-height: 1.25;\n  cursor: pointer;\n  /* 相鄰框線疊成一條 */\n  /* 焦點框顏色由元件以 outlineColor 給主題文字色；拉到上層避免被相鄰按鈕蓋住 */\n}\n.segmentedControl__btn + .segmentedControl__btn {\n  margin-left: -1px;\n}\n.segmentedControl__btn:first-child {\n  border-radius: 4px 0 0 4px;\n}\n.segmentedControl__btn:last-child {\n  border-radius: 0 4px 4px 0;\n}\n.segmentedControl__btn:hover {\n  background: rgba(0, 0, 0, 0.04);\n}\n.segmentedControl__btn:focus-visible {\n  position: relative;\n  z-index: 1;\n  outline-width: 2px;\n  outline-style: solid;\n  outline-offset: 2px;\n}\n.segmentedControl__btn--active {\n  font-weight: 700;\n}";
+styleInject(css_248z);
+
+/* 每個實例需要唯一 id 才能做 aria-labelledby 串接 */
+var segmentedSeq = 0;
+
+/* 選中底色優先用主題主色（與站台色調一致）；主色配字對比不足 4.5:1（WCAG 1.4.3）
+   或主色框線對紙張不足 3:1（WCAG 1.4.11）時，退回「文字色／紙張色」反白，對比必然足夠 */
+var pickColors = function pickColors(_ref) {
+  var primary = _ref.primary,
+    text = _ref.text,
+    background = _ref.background;
+  var primaryOk = getContrastRatio(primary.main, primary.contrastText) >= 4.5 && getContrastRatio(primary.main, background.paper) >= 3;
+  return primaryOk ? {
+    fill: primary.main,
+    onFill: primary.contrastText
+  } : {
+    fill: text.primary,
+    onFill: background.paper
+  };
+};
+
+/* 分段按鈕（少量互斥選項並排，點一下即切換，如抽屜內的語言、字級）。
+ * - 可見標籤即群組名稱：role="group" + aria-labelledby 指向標籤（WCAG 1.3.1／2.5.3）
+ * - 每個選項是切換鈕，以 aria-pressed 表達目前選中者（WCAG 4.1.2）
+ * - 選中態反白（配色見 pickColors），另加粗體，不只靠顏色區分（WCAG 1.4.1） */
+var SegmentedControl = function SegmentedControl(_ref2) {
+  var className = _ref2.className,
+    label = _ref2.label,
+    options = _ref2.options,
+    value = _ref2.value,
+    onChange = _ref2.onChange;
+  var theme = useTheme();
+  var _pickColors = pickColors(theme.palette),
+    fill = _pickColors.fill,
+    onFill = _pickColors.onFill;
+  var labelIdRef = useRef(null);
+  if (!labelIdRef.current) {
+    segmentedSeq += 1;
+    labelIdRef.current = "nmtl-segmented-".concat(segmentedSeq, "-label");
+  }
+  var labelId = labelIdRef.current;
+  /* 框線、焦點框與選中底色同色（站台若有全域焦點樣式會以 !important 蓋過焦點框色，屬預期） */
+  var baseStyle = {
+    borderColor: fill,
+    outlineColor: fill
+  };
+  var activeStyle = _objectSpread2(_objectSpread2({}, baseStyle), {}, {
+    backgroundColor: fill,
+    color: onFill
+  });
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: classNames('segmentedControl', className)
+  }, /*#__PURE__*/React__default.createElement("span", {
+    id: labelId,
+    className: "segmentedControl__label"
+  }, label), /*#__PURE__*/React__default.createElement("div", {
+    className: "segmentedControl__group",
+    role: "group",
+    "aria-labelledby": labelId
+  }, options.map(function (option) {
+    var active = option.value === value;
+    return /*#__PURE__*/React__default.createElement("button", {
+      key: option.value,
+      type: "button",
+      className: classNames('segmentedControl__btn', {
+        'segmentedControl__btn--active': active
+      }),
+      "aria-pressed": active,
+      "aria-label": option.ariaLabel,
+      lang: option.lang,
+      style: active ? activeStyle : baseStyle,
+      onClick: function onClick() {
+        if (!active) onChange(option.value);
+      }
+    }, option.label);
+  })));
+};
+SegmentedControl.defaultProps = {
+  className: undefined,
+  value: undefined,
+  onChange: function onChange() {}
+};
+SegmentedControl.propTypes = {
+  /** Css Name */
+  className: PropTypes.string,
+  /** 可見標籤，同時作為群組的可及名稱 */
+  label: PropTypes.string.isRequired,
+  /** 選項：label 為可見文字；ariaLabel 在可見文字對讀屏沒有意義時提供（如 A+）；lang 標示與頁面不同的語言 */
+  options: PropTypes.arrayOf(PropTypes.shape({
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+    label: PropTypes.string.isRequired,
+    ariaLabel: PropTypes.string,
+    lang: PropTypes.string
+  })).isRequired,
+  /** 目前選中的值 */
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  /** 選擇其他選項時的 callback（點選已選中的選項不會觸發） */
+  onChange: PropTypes.func
+};
+
+export { SegmentedControl as S };

package/lib/components/SegmentedControl.js

@@ -0,0 +1,11 @@
+export { S as default } from './SegmentedControl-81f63afc.js';
+import './_rollupPluginBabelHelpers-a52356f6.js';
+import 'react';
+import 'prop-types';
+import './index-b76a85f4.js';
+import './defaultTheme-c5dd0f64.js';
+import 'react-is';
+import '@material-ui/styles';
+import './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
+import './style-inject.es-1f59c1d0.js';

package/lib/components/{Select-cb3e1ba1.js → Select-89841c71.js}

@@ -3,11 +3,11 @@ import React__default, { useRef } from 'react';
 import PropTypes from 'prop-types';
 import { c as classNames } from './index-b76a85f4.js';
 import { FormControl, Select as Select$1, CircularProgress, MenuItem } from '@material-ui/core';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
-import { u as useTheme } from './useTheme-d16d02d9.js';
-import './withTheme-2d778133.js';
+import { u as useTheme } from './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
 import { E as Empty } from './Empty-c6a44967.js';
 import { getIntl } from './globalConfig';
 import { s as styleInject } from './style-inject.es-1f59c1d0.js';

package/lib/components/Select.js

@@ -1,14 +1,14 @@
-export { S as default } from './Select-cb3e1ba1.js';
+export { S as default } from './Select-89841c71.js';
 import './_rollupPluginBabelHelpers-a52356f6.js';
 import 'react';
 import 'prop-types';
 import './index-b76a85f4.js';
 import '@material-ui/core';
-import './defaultTheme-ed7746fe.js';
+import './defaultTheme-c5dd0f64.js';
 import 'react-is';
 import '@material-ui/styles';
-import './useTheme-d16d02d9.js';
-import './withTheme-2d778133.js';
+import './useTheme-98b6cf17.js';
+import './withTheme-3486f38b.js';
 import './Empty-c6a44967.js';
 import './style-inject.es-1f59c1d0.js';
 import './globalConfig';

package/lib/components/{createSvgIcon-e3803ee1.js → createSvgIcon-dc603596.js}

@@ -1,5 +1,5 @@
 import { g as getAugmentedNamespace } from './_commonjsHelpers-70de2c37.js';
-import { j as formatMuiErrorMessage, _ as _extends, d as defaultTheme, k as _objectWithoutProperties } from './defaultTheme-ed7746fe.js';
+import { j as formatMuiErrorMessage, _ as _extends, d as defaultTheme, k as _objectWithoutProperties } from './defaultTheme-c5dd0f64.js';
 import 'prop-types';
 import 'react-is';
 import * as React from 'react';

package/lib/components/{defaultTheme-ed7746fe.js → defaultTheme-c5dd0f64.js}

@@ -1658,4 +1658,4 @@ function createTheme() {
 
 var defaultTheme = createTheme();
 
-export { _extends as _, display as a, borders as b, compose as c, defaultTheme as d, palette as e, flexbox as f, grid as g, boxShadow as h, spacing as i, formatMuiErrorMessage as j, _objectWithoutProperties as k, _arrayLikeToArray as l, merge as m, _unsupportedIterableToArray as n, _slicedToArray as o, positions as p, _objectWithoutPropertiesLoose as q, alpha as r, sizing as s, typography as t, createTheme as u };
+export { _extends as _, display as a, borders as b, compose as c, defaultTheme as d, palette as e, flexbox as f, grid as g, boxShadow as h, spacing as i, formatMuiErrorMessage as j, _objectWithoutProperties as k, _arrayLikeToArray as l, merge as m, _unsupportedIterableToArray as n, getContrastRatio as o, positions as p, _slicedToArray as q, _objectWithoutPropertiesLoose as r, sizing as s, typography as t, alpha as u, createTheme as v };

package/lib/components/globalConfig.js

@@ -59,6 +59,8 @@ var zhtw = {
 	"common.sna.reset": "回到原來位置與大小",
 	"aria.header.searchOpen": "開啟搜尋",
 	"aria.header.menuOpen": "開啟主選單",
+	"aria.header.menuClose": "關閉主選單",
+	"header.language": "語言",
 	"aria.header.logoHome": "回首頁",
 	"aria.header.logoHomeWithTitle": "{title}，回首頁",
 	"aria.header.navigation": "主選單",
@@ -184,6 +186,8 @@ var zhcn = {
 	"common.form.errorSummary": "表单有 {count} 个字段需要修正，点击下列项目可前往该字段：",
 	"aria.header.searchOpen": "开启搜寻",
 	"aria.header.menuOpen": "开启主选单",
+	"aria.header.menuClose": "关闭主选单",
+	"header.language": "语言",
 	"aria.header.logoHome": "回首页",
 	"aria.header.logoHomeWithTitle": "{title}，回首页",
 	"aria.header.navigation": "主选单",
@@ -311,6 +315,8 @@ var enus = {
 	"common.form.errorSummary": "{count} field(s) need to be corrected. Select an item below to go to that field:",
 	"aria.header.searchOpen": "Open search",
 	"aria.header.menuOpen": "Open main menu",
+	"aria.header.menuClose": "Close main menu",
+	"header.language": "Language",
 	"aria.header.logoHome": "Back to home",
 	"aria.header.logoHomeWithTitle": "{title}, back to home",
 	"aria.header.navigation": "Main menu",

package/lib/components/{toConsumableArray-dbe8af76.js → toConsumableArray-c268c112.js}

@@ -1,4 +1,4 @@
-import { l as _arrayLikeToArray, n as _unsupportedIterableToArray } from './defaultTheme-ed7746fe.js';
+import { l as _arrayLikeToArray, n as _unsupportedIterableToArray } from './defaultTheme-c5dd0f64.js';
 
 function _arrayWithoutHoles(arr) {
   if (Array.isArray(arr)) return _arrayLikeToArray(arr);

package/lib/components/{useTheme-d16d02d9.js → useTheme-98b6cf17.js}

@@ -1,6 +1,6 @@
 import { useTheme as useTheme$1 } from '@material-ui/styles';
 import 'react';
-import { d as defaultTheme } from './defaultTheme-ed7746fe.js';
+import { d as defaultTheme } from './defaultTheme-c5dd0f64.js';
 
 function useTheme() {
   var theme = useTheme$1() || defaultTheme;

package/lib/components/{withTheme-2d778133.js → withTheme-3486f38b.js}

@@ -1,5 +1,5 @@
 import { withThemeCreator } from '@material-ui/styles';
-import { d as defaultTheme } from './defaultTheme-ed7746fe.js';
+import { d as defaultTheme } from './defaultTheme-c5dd0f64.js';
 
 withThemeCreator({
   defaultTheme: defaultTheme

package/lib/index.d.ts

@@ -23,6 +23,7 @@ export { default as SNA } from './components/SNA';
 export { default as BarChart } from './components/BarChart';
 export { default as ForwardLink } from './components/ForwardLink';
 export { default as Pagination } from './components/Pagination';
+export { default as SegmentedControl } from './components/SegmentedControl';
 
 export { default as ContactModal } from './components/ContactModal';
 export { default as KeywordSearch } from './components/KeywordSearch';

package/lib/index.js

@@ -23,6 +23,7 @@ export { default as SNA } from './components/SNA';
 export { default as BarChart } from './components/BarChart';
 export { default as ForwardLink } from './components/ForwardLink';
 export { default as Pagination } from './components/Pagination';
+export { default as SegmentedControl } from './components/SegmentedControl';
 
 export { default as ContactModal } from './components/ContactModal';
 export { default as KeywordSearch } from './components/KeywordSearch';

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@daoyi/nmtl-ui",
 	"packageManager": "pnpm@10.34.5",
-	"version": "2.0.1-beta.131",
+	"version": "2.0.1-beta.133",
 	"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",
@@ -123,6 +123,12 @@
 		"pub-alpha": "npm version prerelease --preid=alpha && npm publish --tag alpha",
 		"pub-beta": "npm version prerelease --preid=beta && npm publish --tag beta"
 	},
+	"volta": {
+		"node": "24.20.0"
+	},
+	"engines": {
+		"node": "24.x"
+	},
 	"pnpm": {
 		"onlyBuiltDependencies": [
 			"core-js",

package/lib/components/Drawer-629e59c7.js

@@ -1,176 +0,0 @@
-import { a as _slicedToArray } from './_rollupPluginBabelHelpers-a52356f6.js';
-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-cb3e1ba1.js';
-import { useHistory, useRouteMatch } from 'react-router-dom';
-import { getIntl } from './globalConfig';
-import { s as styleInject } from './style-inject.es-1f59c1d0.js';
-
-var defaultSupportLanguage = [
-// { value: 'en', label: 'English' },
-{
-  value: 'zh-tw',
-  label: '繁體中文'
-}
-// { value: 'zh-cn', label: '簡體中文' },
-];
-
-/* [檢查-語系]本系統是否支援該語系 並回傳語系 */
-var checkLanguageSupport = function checkLanguageSupport(_ref) {
-  var language = _ref.language,
-    supportLanguages = _ref.supportLanguages;
-  var isSupport = supportLanguages.some(function (_ref2) {
-    var value = _ref2.value;
-    return value === language;
-  });
-  return isSupport ? language : supportLanguages[0].value;
-};
-
-const DrawerList = _ref => {
-  let {
-    drawerList,
-    setOpen
-  } = _ref;
-  const history = useHistory();
-  const {
-    url
-  } = useRouteMatch();
-  return /*#__PURE__*/React__default.createElement(List, {
-    className: "drawer__list"
-  }, Array.isArray(drawerList) && drawerList.map((_ref2, index) => {
-    let {
-      name,
-      icon,
-      path
-    } = _ref2;
-    return /*#__PURE__*/React__default.createElement(ListItem, {
-      button: true,
-      key: index.toString(),
-      onClick: () => {
-        if (path.indexOf('http') > -1) {
-          window.location = path;
-        } else {
-          history.push({
-            pathname: `${url}${path}`
-          });
-        }
-        setOpen(false);
-      }
-    }, icon && /*#__PURE__*/React__default.createElement(ListItemIcon, {
-      style: {
-        marginRight: 24
-      }
-    }, icon), /*#__PURE__*/React__default.createElement(ListItemText, {
-      primary: name
-    }));
-  }));
-};
-DrawerList.defaultProps = {};
-DrawerList.propTypes = {
-  drawerList: PropTypes.arrayOf(PropTypes.any).isRequired,
-  setOpen: PropTypes.func.isRequired
-};
-
-var css_248z = "@charset \"UTF-8\";\n.drawer__icon {\n  display: none !important;\n}\n.drawer__header {\n  display: flex;\n  align-items: center;\n  padding: 20px;\n}\n.drawer__header-title {\n  font-size: 1.125rem;\n  font-weight: bold;\n}\n.drawer__list {\n  padding: 10px !important;\n}\n.drawer__list .MuiSvgIcon-root {\n  margin-left: 8px;\n}\n.drawer__lang {\n  margin: 24px 36px !important;\n}\n\n@media screen and (max-width: 768px) {\n  .drawer {\n    display: flex;\n    justify-content: flex-end;\n  }\n  .drawer__icon {\n    display: flex !important;\n  }\n}\n/* 呼叫端自訂工具區（如字級縮放）：窄畫面時由 Header 收進抽屜 */\n.drawer__extraTools {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 8px 16px;\n}";
-styleInject(css_248z);
-
-var Drawer = function Drawer(_ref) {
-  var title = _ref.title,
-    logo = _ref.logo,
-    locale = _ref.locale,
-    supportLanguages = _ref.supportLanguages,
-    drawerList = _ref.drawerList,
-    onLanguageChange = _ref.onLanguageChange,
-    languageSelectLabel = _ref.languageSelectLabel,
-    extraTools = _ref.extraTools;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    open = _useState2[0],
-    setOpen = _useState2[1];
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: "drawer"
-  }, /*#__PURE__*/React__default.createElement(IconButton, {
-    className: "drawer__icon",
-    "aria-label": getIntl().formatMessage({
-      id: 'aria.header.menuOpen'
-    }),
-    "aria-haspopup": "menu",
-    "aria-expanded": open,
-    onClick: function onClick() {
-      return setOpen(true);
-    }
-  }, /*#__PURE__*/React__default.createElement(DehazeRounded, {
-    fontSize: "large",
-    "aria-hidden": "true"
-  })), /*#__PURE__*/React__default.createElement(Drawer$1, {
-    anchor: "right",
-    open: open,
-    onClose: function onClose() {
-      return setOpen(false);
-    },
-    onKeyDown: function onKeyDown(event) {
-      if (event.key === 'Escape') setOpen(false);
-    }
-  }, (logo || title) && /*#__PURE__*/React__default.createElement("div", {
-    className: "drawer__header"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "drawer__header-logo"
-  }, logo), /*#__PURE__*/React__default.createElement("div", {
-    className: "drawer__header-title"
-  }, title)), /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(DrawerList, {
-    drawerList: (Array.isArray(drawerList) ? drawerList : []).filter(function (_ref2) {
-      var showInHeader = _ref2.showInHeader;
-      return showInHeader;
-    }),
-    setOpen: setOpen
-  }), /*#__PURE__*/React__default.createElement(Divider, null), Array.isArray(supportLanguages) && supportLanguages.length > 0 && /*#__PURE__*/React__default.createElement(Select, {
-    className: "drawer__lang",
-    ariaLabel: languageSelectLabel || getIntl().formatMessage({
-      id: 'aria.header.languageSelect'
-    }),
-    defaultValue: checkLanguageSupport({
-      language: locale,
-      supportLanguages: supportLanguages
-    }),
-    onChange: function onChange(value) {
-      return onLanguageChange(value);
-    },
-    options: supportLanguages
-  }), extraTools && /*#__PURE__*/React__default.createElement("div", {
-    className: "drawer__extraTools"
-  }, extraTools)));
-};
-Drawer.defaultProps = {
-  title: undefined,
-  logo: undefined,
-  locale: undefined,
-  supportLanguages: [
-  // { value: 'en', label: 'English' },
-  {
-    value: 'zh-tw',
-    label: '繁體中文'
-  }
-  // { value: 'zh-cn', label: '簡體中文' },
-  ],
-
-  drawerList: undefined,
-  onLanguageChange: function onLanguageChange() {},
-  languageSelectLabel: undefined,
-  extraTools: undefined
-};
-Drawer.propTypes = {
-  title: PropTypes.string,
-  logo: PropTypes.node,
-  locale: PropTypes.string,
-  supportLanguages: PropTypes.arrayOf(PropTypes.any),
-  drawerList: PropTypes.arrayOf(PropTypes.any),
-  onLanguageChange: PropTypes.func,
-  /** 語言下拉的無障礙名稱（WCAG 3.3.2）；未提供時使用套件內 aria.header.languageSelect */
-  languageSelectLabel: PropTypes.string,
-  /** 呼叫端自訂的工具區（如字級縮放）；由 Header 一併傳入，窄畫面時顯示於抽屜內 */
-  extraTools: PropTypes.node
-};
-
-export { Drawer as D, checkLanguageSupport as c, defaultSupportLanguage as d };