smarthr-ui 75.4.1 → 76.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (82) hide show
  1. package/esm/components/AppHeader/AppHeader.js +3 -7
  2. package/esm/components/AppHeader/AppHeader.js.map +1 -1
  3. package/esm/components/AppHeader/components/desktop/DesktopHeader.js +4 -6
  4. package/esm/components/AppHeader/components/desktop/DesktopHeader.js.map +1 -1
  5. package/esm/components/AppHeader/components/mobile/LanguageSelector.js +13 -7
  6. package/esm/components/AppHeader/components/mobile/LanguageSelector.js.map +1 -1
  7. package/esm/components/AppHeader/components/mobile/MobileHeader.js +1 -3
  8. package/esm/components/AppHeader/components/mobile/MobileHeader.js.map +1 -1
  9. package/esm/components/AppHeader/components/mobile/UserInfo.js +3 -5
  10. package/esm/components/AppHeader/components/mobile/UserInfo.js.map +1 -1
  11. package/esm/components/AppHeader/stories/args.js +0 -1
  12. package/esm/components/AppHeader/stories/args.js.map +1 -1
  13. package/esm/components/AppHeader/types.d.ts +1 -2
  14. package/esm/components/Header/LanguageSwitcher/LanguageSwitcher.d.ts +2 -2
  15. package/esm/components/Header/LanguageSwitcher/LanguageSwitcher.js +3 -3
  16. package/esm/components/Header/LanguageSwitcher/LanguageSwitcher.js.map +1 -1
  17. package/esm/components/SpreadsheetTable/SpreadsheetTable.js +1 -1
  18. package/esm/components/SpreadsheetTable/SpreadsheetTable.js.map +1 -1
  19. package/esm/intl/IntlProvider.d.ts +4 -4
  20. package/esm/intl/IntlProvider.js +2 -1
  21. package/esm/intl/IntlProvider.js.map +1 -1
  22. package/esm/intl/localeMap.d.ts +3 -0
  23. package/esm/{components/AppHeader/multilingualization → intl}/localeMap.js +3 -2
  24. package/esm/intl/localeMap.js.map +1 -0
  25. package/esm/types/index.d.ts +0 -1
  26. package/lib/components/AppHeader/AppHeader.js +2 -4
  27. package/lib/components/AppHeader/AppHeader.js.map +1 -1
  28. package/lib/components/AppHeader/components/desktop/DesktopHeader.js +4 -6
  29. package/lib/components/AppHeader/components/desktop/DesktopHeader.js.map +1 -1
  30. package/lib/components/AppHeader/components/mobile/LanguageSelector.js +11 -7
  31. package/lib/components/AppHeader/components/mobile/LanguageSelector.js.map +1 -1
  32. package/lib/components/AppHeader/components/mobile/MobileHeader.js +1 -3
  33. package/lib/components/AppHeader/components/mobile/MobileHeader.js.map +1 -1
  34. package/lib/components/AppHeader/components/mobile/UserInfo.js +3 -5
  35. package/lib/components/AppHeader/components/mobile/UserInfo.js.map +1 -1
  36. package/lib/components/AppHeader/stories/args.js +0 -1
  37. package/lib/components/AppHeader/stories/args.js.map +1 -1
  38. package/lib/components/AppHeader/types.d.ts +1 -2
  39. package/lib/components/AppHeader/types.js.map +1 -1
  40. package/lib/components/Header/LanguageSwitcher/LanguageSwitcher.d.ts +2 -2
  41. package/lib/components/Header/LanguageSwitcher/LanguageSwitcher.js +3 -3
  42. package/lib/components/Header/LanguageSwitcher/LanguageSwitcher.js.map +1 -1
  43. package/lib/components/SpreadsheetTable/SpreadsheetTable.js +1 -1
  44. package/lib/components/SpreadsheetTable/SpreadsheetTable.js.map +1 -1
  45. package/lib/intl/IntlProvider.d.ts +4 -4
  46. package/lib/intl/IntlProvider.js +2 -1
  47. package/lib/intl/IntlProvider.js.map +1 -1
  48. package/lib/intl/localeMap.d.ts +3 -0
  49. package/lib/{components/AppHeader/multilingualization → intl}/localeMap.js +3 -2
  50. package/lib/intl/localeMap.js.map +1 -0
  51. package/lib/types/index.d.ts +0 -1
  52. package/lib/types/index.js.map +1 -1
  53. package/package.json +1 -1
  54. package/smarthr-ui.css +2 -2
  55. package/esm/components/AppHeader/hooks/useLocale.d.ts +0 -11
  56. package/esm/components/AppHeader/hooks/useLocale.js +0 -11
  57. package/esm/components/AppHeader/hooks/useLocale.js.map +0 -1
  58. package/esm/components/AppHeader/multilingualization/index.d.ts +0 -2
  59. package/esm/components/AppHeader/multilingualization/index.js +0 -2
  60. package/esm/components/AppHeader/multilingualization/index.js.map +0 -1
  61. package/esm/components/AppHeader/multilingualization/localeMap.d.ts +0 -10
  62. package/esm/components/AppHeader/multilingualization/localeMap.js.map +0 -1
  63. package/esm/components/AppHeader/multilingualization/types.d.ts +0 -3
  64. package/esm/components/AppHeader/multilingualization/types.js +0 -4
  65. package/esm/components/AppHeader/multilingualization/types.js.map +0 -1
  66. package/esm/types/Locale.d.ts +0 -3
  67. package/esm/types/Locale.js +0 -2
  68. package/esm/types/Locale.js.map +0 -1
  69. package/lib/components/AppHeader/hooks/useLocale.d.ts +0 -11
  70. package/lib/components/AppHeader/hooks/useLocale.js +0 -13
  71. package/lib/components/AppHeader/hooks/useLocale.js.map +0 -1
  72. package/lib/components/AppHeader/multilingualization/index.d.ts +0 -2
  73. package/lib/components/AppHeader/multilingualization/index.js +0 -6
  74. package/lib/components/AppHeader/multilingualization/index.js.map +0 -1
  75. package/lib/components/AppHeader/multilingualization/localeMap.d.ts +0 -10
  76. package/lib/components/AppHeader/multilingualization/localeMap.js.map +0 -1
  77. package/lib/components/AppHeader/multilingualization/types.d.ts +0 -3
  78. package/lib/components/AppHeader/multilingualization/types.js +0 -5
  79. package/lib/components/AppHeader/multilingualization/types.js.map +0 -1
  80. package/lib/types/Locale.d.ts +0 -3
  81. package/lib/types/Locale.js +0 -3
  82. package/lib/types/Locale.js.map +0 -1
@@ -1,21 +1,17 @@
1
1
  "use client";
2
- import { jsx, jsxs } from 'react/jsx-runtime';
3
- import { IntlProvider } from '../../intl/IntlProvider.js';
4
- import 'react';
5
- import 'react-intl';
2
+ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
6
3
  import { DesktopHeader } from './components/desktop/DesktopHeader.js';
7
4
  import { MobileHeader } from './components/mobile/MobileHeader.js';
8
- import { LocaleContextProvider } from './hooks/useLocale.js';
9
5
  import { useMediaQuery, mediaQuery } from './hooks/useMediaQuery.js';
10
6
 
11
- const AppHeader = ({ locale, children, ...props }) => {
7
+ const AppHeader = ({ children, ...props }) => {
12
8
  // NOTE: ヘッダーの出し分けは CSS によって行われているので、useMediaQuery による children の出し分けは本来不要ですが、
13
9
  // wovn の言語切替カスタム UI の挿入対象となる DOM ("wovn-embedded-widget-anchor" クラスを持った div) が複数描画されていると、
14
10
  // wovn のスクリプトの仕様上1つ目の DOM にしか UI が挿入されないため、やむを得ず children のみ React のレンダリングレベルでの出し分けをしています。
15
11
  const isDesktop = useMediaQuery(mediaQuery.desktop);
16
12
  // HINT: Desktop,Mobileの両ヘッダーは常にHTML上に存在し、cssでvisibleを切り替えることでSSR環境でのレイアウトシフトが発生しないようにしています
17
13
  // 表示切替は画面幅によって決まり、SSR環境では判定出来ないためです
18
- return (jsx(IntlProvider, { locale: locale?.selectedLocale ?? 'ja', children: jsxs(LocaleContextProvider, { locale: locale, children: [jsx(DesktopHeader, { ...props, children: isDesktop ? children : undefined }), jsx(MobileHeader, { ...props, children: isDesktop ? undefined : children })] }) }));
14
+ return (jsxs(Fragment, { children: [jsx(DesktopHeader, { ...props, children: isDesktop ? children : undefined }), jsx(MobileHeader, { ...props, children: isDesktop ? undefined : children })] }));
19
15
  };
20
16
 
21
17
  export { AppHeader };
@@ -1 +1 @@
1
- {"version":3,"file":"AppHeader.js","sources":["../../../src/components/AppHeader/AppHeader.tsx"],"sourcesContent":["'use client'\n\nimport { IntlProvider } from '../../intl'\n\nimport { DesktopHeader } from './components/desktop/DesktopHeader'\nimport { MobileHeader } from './components/mobile/MobileHeader'\nimport { LocaleContextProvider } from './hooks/useLocale'\nimport { mediaQuery, useMediaQuery } from './hooks/useMediaQuery'\n\nimport type { HeaderProps } from './types'\nimport type { FC } from 'react'\n\nexport const AppHeader: FC<HeaderProps> = ({ locale, children, ...props }) => {\n // NOTE: ヘッダーの出し分けは CSS によって行われているので、useMediaQuery による children の出し分けは本来不要ですが、\n // wovn の言語切替カスタム UI の挿入対象となる DOM (\"wovn-embedded-widget-anchor\" クラスを持った div) が複数描画されていると、\n // wovn のスクリプトの仕様上1つ目の DOM にしか UI が挿入されないため、やむを得ず children のみ React のレンダリングレベルでの出し分けをしています。\n const isDesktop = useMediaQuery(mediaQuery.desktop)\n\n // HINT: Desktop,Mobileの両ヘッダーは常にHTML上に存在し、cssでvisibleを切り替えることでSSR環境でのレイアウトシフトが発生しないようにしています\n // 表示切替は画面幅によって決まり、SSR環境では判定出来ないためです\n return (\n <IntlProvider locale={locale?.selectedLocale ?? 'ja'}>\n <LocaleContextProvider locale={locale}>\n <DesktopHeader {...props}>{isDesktop ? children : undefined}</DesktopHeader>\n <MobileHeader {...props}>{isDesktop ? undefined : children}</MobileHeader>\n </LocaleContextProvider>\n </IntlProvider>\n )\n}\n"],"names":[],"mappings":";;;;;;;;;;AAYO;;;;;;;;AAgBP;;"}
1
+ {"version":3,"file":"AppHeader.js","sources":["../../../src/components/AppHeader/AppHeader.tsx"],"sourcesContent":["'use client'\n\nimport { DesktopHeader } from './components/desktop/DesktopHeader'\nimport { MobileHeader } from './components/mobile/MobileHeader'\nimport { mediaQuery, useMediaQuery } from './hooks/useMediaQuery'\n\nimport type { HeaderProps } from './types'\nimport type { FC } from 'react'\n\nexport const AppHeader: FC<HeaderProps> = ({ children, ...props }) => {\n // NOTE: ヘッダーの出し分けは CSS によって行われているので、useMediaQuery による children の出し分けは本来不要ですが、\n // wovn の言語切替カスタム UI の挿入対象となる DOM (\"wovn-embedded-widget-anchor\" クラスを持った div) が複数描画されていると、\n // wovn のスクリプトの仕様上1つ目の DOM にしか UI が挿入されないため、やむを得ず children のみ React のレンダリングレベルでの出し分けをしています。\n const isDesktop = useMediaQuery(mediaQuery.desktop)\n\n // HINT: Desktop,Mobileの両ヘッダーは常にHTML上に存在し、cssでvisibleを切り替えることでSSR環境でのレイアウトシフトが発生しないようにしています\n // 表示切替は画面幅によって決まり、SSR環境では判定出来ないためです\n return (\n <>\n <DesktopHeader {...props}>{isDesktop ? children : undefined}</DesktopHeader>\n <MobileHeader {...props}>{isDesktop ? undefined : children}</MobileHeader>\n </>\n )\n}\n"],"names":[],"mappings":";;;;;;AASO;;;;;;;AAQL;AAMF;;"}
@@ -4,6 +4,7 @@ import { tv as ce } from './../../../../vendor/.pnpm/tailwind-variants@0.3.1_tai
4
4
  import '../../../../intl/IntlProvider.js';
5
5
  import { useIntl } from '../../../../intl/useIntl.js';
6
6
  import 'react-intl';
7
+ import { localeMap } from '../../../../intl/localeMap.js';
7
8
  import { Button } from '../../../Button/Button.js';
8
9
  import '../../../Button/AnchorButton.js';
9
10
  import '../../../Button/UnstyledButton.js';
@@ -28,8 +29,6 @@ import '../../../Layout/Reel/Reel.js';
28
29
  import '../../../Layout/Sidebar/Sidebar.js';
29
30
  import '../../../Layout/Center/Center.js';
30
31
  import '../../../Layout/Container/Container.js';
31
- import { useLocale } from '../../hooks/useLocale.js';
32
- import { localeMap } from '../../multilingualization/localeMap.js';
33
32
  import { Translate } from '../common/Translate.js';
34
33
  import { AppLauncher } from './AppLauncher.js';
35
34
  import { Navigation } from './Navigation.js';
@@ -46,7 +45,7 @@ const classNameGenerator = ce({
46
45
  ],
47
46
  },
48
47
  });
49
- const DesktopHeader = ({ enableNew, className = '', appName, tenants, currentTenantId, schoolUrl, helpPageUrl, children, userInfo, desktopAdditionalContent, navigations, desktopNavigationAdditionalContent, releaseNote, features, ...props }) => {
48
+ const DesktopHeader = ({ enableNew, className = '', appName, tenants, currentTenantId, schoolUrl, helpPageUrl, children, userInfo, desktopAdditionalContent, navigations, desktopNavigationAdditionalContent, releaseNote, features, locale: localeProps, ...props }) => {
50
49
  const classNames = useMemo(() => {
51
50
  const { wrapper, appsButton } = classNameGenerator();
52
51
  return {
@@ -54,8 +53,7 @@ const DesktopHeader = ({ enableNew, className = '', appName, tenants, currentTen
54
53
  appsButton: appsButton(),
55
54
  };
56
55
  }, [className]);
57
- const { locale } = useLocale();
58
- const { localize } = useIntl();
56
+ const { localize, locale } = useIntl();
59
57
  const translated = useMemo(() => ({
60
58
  appLauncherLabel: localize({
61
59
  id: 'smarthr-ui/AppHeader/DesktopHeader/appLauncherLabel',
@@ -64,7 +62,7 @@ const DesktopHeader = ({ enableNew, className = '', appName, tenants, currentTen
64
62
  school: localize({ id: 'smarthr-ui/AppHeader/school', defaultText: 'スクール' }),
65
63
  help: localize({ id: 'smarthr-ui/AppHeader/help', defaultText: 'ヘルプ' }),
66
64
  }), [localize]);
67
- return (jsxs(Fragment, { children: [jsx(Header, { ...props, enableNew: enableNew, className: classNames.wrapper, featureName: appName, tenants: tenants, currentTenantId: currentTenantId, children: jsxs(Cluster, { align: "center", className: "shr--me-0.25", children: [!enableNew && (jsxs(Fragment, { children: [features && features.length > 0 && (jsxs(Dropdown, { children: [jsx(AppLauncherButton, { enableNew: enableNew, className: classNames.appsButton, children: translated.appLauncherLabel }), jsx(DropdownContent, { controllable: true, children: jsx(AppLauncher, { features: features }) })] })), schoolUrl && (jsx(HeaderLink, { href: schoolUrl, prefix: jsx(FaGraduationCapIcon, {}), className: "shr-flex shr-items-center shr-py-0.75 shr-leading-none", children: jsx(Translate, { children: translated.school }) }))] })), helpPageUrl && (jsx(HeaderLink, { href: helpPageUrl, prefix: enableNew ? jsx(FaRegCircleQuestionIcon, {}) : jsx(FaCircleQuestionIcon, {}), className: enableNew ? undefined : 'shr-flex shr-items-center shr-py-0.75 shr-leading-none', enableNew: enableNew, children: jsx(Translate, { children: translated.help }) })), locale && (jsx(LanguageSwitcher, { localeMap: localeMap, locale: locale.selectedLocale, onLanguageSelect: locale.onSelectLocale, enableNew: enableNew })), children, userInfo && (jsx(UserInfo, { ...userInfo, tenants: tenants, currentTenantId: currentTenantId, desktopAdditionalContent: desktopAdditionalContent, enableNew: enableNew }))] }) }), navigations && (jsx(Navigation, { appName: appName, navigations: navigations, additionalContent: desktopNavigationAdditionalContent, releaseNote: releaseNote, enableNew: enableNew }))] }));
65
+ return (jsxs(Fragment, { children: [jsx(Header, { ...props, enableNew: enableNew, className: classNames.wrapper, featureName: appName, tenants: tenants, currentTenantId: currentTenantId, children: jsxs(Cluster, { align: "center", className: "shr--me-0.25", children: [!enableNew && (jsxs(Fragment, { children: [features && features.length > 0 && (jsxs(Dropdown, { children: [jsx(AppLauncherButton, { enableNew: enableNew, className: classNames.appsButton, children: translated.appLauncherLabel }), jsx(DropdownContent, { controllable: true, children: jsx(AppLauncher, { features: features }) })] })), schoolUrl && (jsx(HeaderLink, { href: schoolUrl, prefix: jsx(FaGraduationCapIcon, {}), className: "shr-flex shr-items-center shr-py-0.75 shr-leading-none", children: jsx(Translate, { children: translated.school }) }))] })), helpPageUrl && (jsx(HeaderLink, { href: helpPageUrl, prefix: enableNew ? jsx(FaRegCircleQuestionIcon, {}) : jsx(FaCircleQuestionIcon, {}), className: enableNew ? undefined : 'shr-flex shr-items-center shr-py-0.75 shr-leading-none', enableNew: enableNew, children: jsx(Translate, { children: translated.help }) })), localeProps && (jsx(LanguageSwitcher, { localeMap: localeMap, locale: locale, onLanguageSelect: localeProps.onSelectLocale, enableNew: enableNew })), children, userInfo && (jsx(UserInfo, { ...userInfo, tenants: tenants, currentTenantId: currentTenantId, desktopAdditionalContent: desktopAdditionalContent, enableNew: enableNew }))] }) }), navigations && (jsx(Navigation, { appName: appName, navigations: navigations, additionalContent: desktopNavigationAdditionalContent, releaseNote: releaseNote, enableNew: enableNew }))] }));
68
66
  };
69
67
  const AppLauncherButton = memo(({ enableNew, children, className }) => (jsx(DropdownTrigger, { children: jsx(Button, { prefix: enableNew ?? jsx(FaToolboxIcon, {}), className: className, children: jsx(Translate, { children: children }) }) })));
70
68
 
@@ -1 +1 @@
1
- {"version":3,"file":"DesktopHeader.js","sources":["../../../../../src/components/AppHeader/components/desktop/DesktopHeader.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren, memo, useMemo } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { Button } from '../../../Button'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { Header, HeaderLink, LanguageSwitcher } from '../../../Header'\nimport {\n FaCircleQuestionIcon,\n FaGraduationCapIcon,\n FaRegCircleQuestionIcon,\n FaToolboxIcon,\n} from '../../../Icon'\nimport { Cluster } from '../../../Layout'\nimport { useLocale } from '../../hooks/useLocale'\nimport { localeMap } from '../../multilingualization'\nimport { Translate } from '../common/Translate'\n\nimport { AppLauncher } from './AppLauncher'\nimport { Navigation } from './Navigation'\nimport { UserInfo } from './UserInfo'\n\nimport type { HeaderProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n wrapper: 'max-[751px]:!shr-hidden',\n appsButton: [\n 'shr-border-none shr-bg-transparent shr-px-0.25 shr-font-normal shr-text-white',\n 'hover:shr-border-transparent hover:shr-bg-transparent',\n 'focus-visible:shr-border-transparent focus-visible:shr-bg-transparent',\n 'forced-colors:shr-border-shorthand',\n ],\n },\n})\n\nexport const DesktopHeader: FC<HeaderProps> = ({\n enableNew,\n className = '',\n appName,\n tenants,\n currentTenantId,\n schoolUrl,\n helpPageUrl,\n children,\n userInfo,\n desktopAdditionalContent,\n navigations,\n desktopNavigationAdditionalContent,\n releaseNote,\n features,\n ...props\n}) => {\n const classNames = useMemo(() => {\n const { wrapper, appsButton } = classNameGenerator()\n\n return {\n wrapper: wrapper({ className }),\n appsButton: appsButton(),\n }\n }, [className])\n\n const { locale } = useLocale()\n\n const { localize } = useIntl()\n const translated = useMemo(\n () => ({\n appLauncherLabel: localize({\n id: 'smarthr-ui/AppHeader/DesktopHeader/appLauncherLabel',\n defaultText: 'アプリ',\n }),\n school: localize({ id: 'smarthr-ui/AppHeader/school', defaultText: 'スクール' }),\n help: localize({ id: 'smarthr-ui/AppHeader/help', defaultText: 'ヘルプ' }),\n }),\n [localize],\n )\n\n return (\n <>\n <Header\n {...props}\n enableNew={enableNew}\n className={classNames.wrapper}\n featureName={appName}\n tenants={tenants}\n currentTenantId={currentTenantId}\n >\n <Cluster align=\"center\" className=\"shr--me-0.25\">\n {!enableNew && (\n <>\n {features && features.length > 0 && (\n <Dropdown>\n <AppLauncherButton enableNew={enableNew} className={classNames.appsButton}>\n {translated.appLauncherLabel}\n </AppLauncherButton>\n <DropdownContent controllable>\n <AppLauncher features={features} />\n </DropdownContent>\n </Dropdown>\n )}\n\n {schoolUrl && (\n <HeaderLink\n href={schoolUrl}\n prefix={<FaGraduationCapIcon />}\n className=\"shr-flex shr-items-center shr-py-0.75 shr-leading-none\"\n >\n <Translate>{translated.school}</Translate>\n </HeaderLink>\n )}\n </>\n )}\n\n {helpPageUrl && (\n <HeaderLink\n href={helpPageUrl}\n prefix={enableNew ? <FaRegCircleQuestionIcon /> : <FaCircleQuestionIcon />}\n className={\n enableNew ? undefined : 'shr-flex shr-items-center shr-py-0.75 shr-leading-none'\n }\n enableNew={enableNew}\n >\n <Translate>{translated.help}</Translate>\n </HeaderLink>\n )}\n\n {locale && (\n <LanguageSwitcher\n localeMap={localeMap}\n locale={locale.selectedLocale}\n onLanguageSelect={locale.onSelectLocale as (locale: string) => void}\n enableNew={enableNew}\n />\n )}\n\n {children}\n\n {userInfo && (\n <UserInfo\n {...userInfo}\n tenants={tenants}\n currentTenantId={currentTenantId}\n desktopAdditionalContent={desktopAdditionalContent}\n enableNew={enableNew}\n />\n )}\n </Cluster>\n </Header>\n\n {navigations && (\n <Navigation\n appName={appName}\n navigations={navigations}\n additionalContent={desktopNavigationAdditionalContent}\n releaseNote={releaseNote}\n enableNew={enableNew}\n />\n )}\n </>\n )\n}\n\nconst AppLauncherButton = memo<\n Pick<HeaderProps, 'enableNew'> & PropsWithChildren<{ className: string }>\n>(({ enableNew, children, className }) => (\n <DropdownTrigger>\n <Button prefix={enableNew ?? <FaToolboxIcon />} className={className}>\n <Translate>{children}</Translate>\n </Button>\n </DropdownTrigger>\n))\n"],"names":["tv","_jsxs","_Fragment","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"DesktopHeader.js","sources":["../../../../../src/components/AppHeader/components/desktop/DesktopHeader.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren, memo, useMemo } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { localeMap } from '../../../../intl/localeMap'\nimport { Button } from '../../../Button'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { Header, HeaderLink, LanguageSwitcher } from '../../../Header'\nimport {\n FaCircleQuestionIcon,\n FaGraduationCapIcon,\n FaRegCircleQuestionIcon,\n FaToolboxIcon,\n} from '../../../Icon'\nimport { Cluster } from '../../../Layout'\nimport { Translate } from '../common/Translate'\n\nimport { AppLauncher } from './AppLauncher'\nimport { Navigation } from './Navigation'\nimport { UserInfo } from './UserInfo'\n\nimport type { HeaderProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n wrapper: 'max-[751px]:!shr-hidden',\n appsButton: [\n 'shr-border-none shr-bg-transparent shr-px-0.25 shr-font-normal shr-text-white',\n 'hover:shr-border-transparent hover:shr-bg-transparent',\n 'focus-visible:shr-border-transparent focus-visible:shr-bg-transparent',\n 'forced-colors:shr-border-shorthand',\n ],\n },\n})\n\nexport const DesktopHeader: FC<HeaderProps> = ({\n enableNew,\n className = '',\n appName,\n tenants,\n currentTenantId,\n schoolUrl,\n helpPageUrl,\n children,\n userInfo,\n desktopAdditionalContent,\n navigations,\n desktopNavigationAdditionalContent,\n releaseNote,\n features,\n locale: localeProps,\n ...props\n}) => {\n const classNames = useMemo(() => {\n const { wrapper, appsButton } = classNameGenerator()\n\n return {\n wrapper: wrapper({ className }),\n appsButton: appsButton(),\n }\n }, [className])\n\n const { localize, locale } = useIntl()\n const translated = useMemo(\n () => ({\n appLauncherLabel: localize({\n id: 'smarthr-ui/AppHeader/DesktopHeader/appLauncherLabel',\n defaultText: 'アプリ',\n }),\n school: localize({ id: 'smarthr-ui/AppHeader/school', defaultText: 'スクール' }),\n help: localize({ id: 'smarthr-ui/AppHeader/help', defaultText: 'ヘルプ' }),\n }),\n [localize],\n )\n\n return (\n <>\n <Header\n {...props}\n enableNew={enableNew}\n className={classNames.wrapper}\n featureName={appName}\n tenants={tenants}\n currentTenantId={currentTenantId}\n >\n <Cluster align=\"center\" className=\"shr--me-0.25\">\n {!enableNew && (\n <>\n {features && features.length > 0 && (\n <Dropdown>\n <AppLauncherButton enableNew={enableNew} className={classNames.appsButton}>\n {translated.appLauncherLabel}\n </AppLauncherButton>\n <DropdownContent controllable>\n <AppLauncher features={features} />\n </DropdownContent>\n </Dropdown>\n )}\n\n {schoolUrl && (\n <HeaderLink\n href={schoolUrl}\n prefix={<FaGraduationCapIcon />}\n className=\"shr-flex shr-items-center shr-py-0.75 shr-leading-none\"\n >\n <Translate>{translated.school}</Translate>\n </HeaderLink>\n )}\n </>\n )}\n\n {helpPageUrl && (\n <HeaderLink\n href={helpPageUrl}\n prefix={enableNew ? <FaRegCircleQuestionIcon /> : <FaCircleQuestionIcon />}\n className={\n enableNew ? undefined : 'shr-flex shr-items-center shr-py-0.75 shr-leading-none'\n }\n enableNew={enableNew}\n >\n <Translate>{translated.help}</Translate>\n </HeaderLink>\n )}\n\n {localeProps && (\n <LanguageSwitcher\n localeMap={localeMap}\n locale={locale}\n onLanguageSelect={localeProps.onSelectLocale as (locale: string) => void}\n enableNew={enableNew}\n />\n )}\n\n {children}\n\n {userInfo && (\n <UserInfo\n {...userInfo}\n tenants={tenants}\n currentTenantId={currentTenantId}\n desktopAdditionalContent={desktopAdditionalContent}\n enableNew={enableNew}\n />\n )}\n </Cluster>\n </Header>\n\n {navigations && (\n <Navigation\n appName={appName}\n navigations={navigations}\n additionalContent={desktopNavigationAdditionalContent}\n releaseNote={releaseNote}\n enableNew={enableNew}\n />\n )}\n </>\n )\n}\n\nconst AppLauncherButton = memo<\n Pick<HeaderProps, 'enableNew'> & PropsWithChildren<{ className: string }>\n>(({ enableNew, children, className }) => (\n <DropdownTrigger>\n <Button prefix={enableNew ?? <FaToolboxIcon />} className={className}>\n <Translate>{children}</Translate>\n </Button>\n </DropdownTrigger>\n))\n"],"names":["tv","_jsxs","_Fragment","_jsx"],"mappings":"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"}
@@ -1,6 +1,10 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import { memo, useMemo, useCallback } from 'react';
3
3
  import { tv as ce } from './../../../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.17_ts-node@10.9.2_@swc_core@1.13.2_@types_node@20.19.9_typescript@5.8.3__/vendor/tailwind-variants/dist/index.js';
4
+ import '../../../../intl/IntlProvider.js';
5
+ import { useIntl } from '../../../../intl/useIntl.js';
6
+ import 'react-intl';
7
+ import { localeMap } from '../../../../intl/localeMap.js';
4
8
  import { Button } from '../../../Button/Button.js';
5
9
  import '../../../Button/AnchorButton.js';
6
10
  import '../../../Button/UnstyledButton.js';
@@ -9,7 +13,6 @@ import { FaXmarkIcon, FaCheckIcon } from '../../../Icon/Icon.js';
9
13
  import '../../../Icon/generateIcon.js';
10
14
  import { Section } from '../../../SectioningContent/SectioningContent.js';
11
15
  import '../../../SectioningContent/levelContext.js';
12
- import { localeMap } from '../../multilingualization/localeMap.js';
13
16
  import { CommonButton } from '../common/CommonButton.js';
14
17
 
15
18
  const classNameGenerator = ce({
@@ -22,8 +25,11 @@ const classNameGenerator = ce({
22
25
  button: ['[&&:not(:has(svg))]:shr-ps-2.5'],
23
26
  },
24
27
  });
25
- const LOCALE_KEYS = Object.keys(localeMap);
26
- const LanguageSelector = memo(({ locale, onClickClose }) => {
28
+ const LanguageSelector = memo(({ locale: localeProps, onClickClose }) => {
29
+ const { locale, availableLocales } = useIntl();
30
+ const { locales } = useMemo(() => ({
31
+ locales: Object.entries(localeMap).filter(([code]) => availableLocales.includes(code)),
32
+ }), [availableLocales]);
27
33
  const classNames = useMemo(() => {
28
34
  const { header, headerTitle, buttonWrapper, button } = classNameGenerator();
29
35
  return {
@@ -34,12 +40,12 @@ const LanguageSelector = memo(({ locale, onClickClose }) => {
34
40
  };
35
41
  }, []);
36
42
  const onClickLocale = useCallback((e) => {
37
- locale.onSelectLocale(e.currentTarget.value);
38
- }, [locale]);
39
- return (jsxs(Section, { children: [jsx(SelectorHeading, { onClickClose: onClickClose, wrapperClassName: classNames.header, className: classNames.headerTitle }), jsx("div", { className: classNames.buttonWrapper, children: LOCALE_KEYS.map((localeKey) => (jsx(LocaleButton, { value: localeKey, onClick: onClickLocale, selected: localeKey === locale.selectedLocale, className: classNames.button }, localeKey))) })] }));
43
+ localeProps.onSelectLocale(e.currentTarget.value);
44
+ }, [localeProps]);
45
+ return (jsxs(Section, { children: [jsx(SelectorHeading, { onClickClose: onClickClose, wrapperClassName: classNames.header, className: classNames.headerTitle }), jsx("div", { className: classNames.buttonWrapper, children: locales.map(([localeKey, label]) => (jsx(LocaleButton, { value: localeKey, onClick: onClickLocale, selected: localeKey === locale, className: classNames.button, children: label }, localeKey))) })] }));
40
46
  });
41
47
  const SelectorHeading = memo(({ onClickClose, wrapperClassName, className }) => (jsxs("div", { className: wrapperClassName, children: [jsx(Heading, { className: className, children: "Language" }), jsx(Button, { type: "button", size: "s", onClick: onClickClose, children: jsx(FaXmarkIcon, { alt: "close" }) })] })));
42
- const LocaleButton = memo(({ value, selected, className, onClick }) => (jsx(CommonButton, { elementAs: "button", type: "button", value: value, onClick: onClick, prefix: selected && jsx(FaCheckIcon, { color: "MAIN" }), className: className, children: localeMap[value] })));
48
+ const LocaleButton = memo(({ value, selected, className, children, onClick }) => (jsx(CommonButton, { elementAs: "button", type: "button", value: value, onClick: onClick, prefix: selected && jsx(FaCheckIcon, { color: "MAIN" }), className: className, children: children })));
43
49
 
44
50
  export { LanguageSelector };
45
51
  //# sourceMappingURL=LanguageSelector.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"LanguageSelector.js","sources":["../../../../../src/components/AppHeader/components/mobile/LanguageSelector.tsx"],"sourcesContent":["import { type MouseEvent, memo, useCallback, useMemo } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Button } from '../../../Button'\nimport { Heading } from '../../../Heading'\nimport { FaCheckIcon, FaXmarkIcon } from '../../../Icon'\nimport { Section } from '../../../SectioningContent'\nimport { type Locale, localeMap } from '../../multilingualization'\nimport { CommonButton } from '../common/CommonButton'\n\nimport type { LocaleProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n header: [\n 'shr-border-b-shorthand shr-flex shr-items-center shr-justify-between shr-gap-1 shr-px-1 shr-py-0.75',\n ],\n headerTitle: ['shr-font-normal [&&]:shr-text-base'],\n buttonWrapper: ['shr-p-0.5'],\n button: ['[&&:not(:has(svg))]:shr-ps-2.5'],\n },\n})\n\ntype Props = {\n locale: LocaleProps\n onClickClose: () => void\n}\n\nconst LOCALE_KEYS = Object.keys(localeMap)\n\nexport const LanguageSelector = memo<Props>(({ locale, onClickClose }) => {\n const classNames = useMemo(() => {\n const { header, headerTitle, buttonWrapper, button } = classNameGenerator()\n\n return {\n header: header(),\n headerTitle: headerTitle(),\n buttonWrapper: buttonWrapper(),\n button: button(),\n }\n }, [])\n\n const onClickLocale = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n locale.onSelectLocale(e.currentTarget.value as Locale)\n },\n [locale],\n )\n\n return (\n <Section>\n <SelectorHeading\n onClickClose={onClickClose}\n wrapperClassName={classNames.header}\n className={classNames.headerTitle}\n />\n <div className={classNames.buttonWrapper}>\n {LOCALE_KEYS.map((localeKey) => (\n <LocaleButton\n key={localeKey}\n value={localeKey as Locale}\n onClick={onClickLocale}\n selected={localeKey === locale.selectedLocale}\n className={classNames.button}\n />\n ))}\n </div>\n </Section>\n )\n})\n\nconst SelectorHeading = memo<\n Pick<Props, 'onClickClose'> & { wrapperClassName: string; className: string }\n>(({ onClickClose, wrapperClassName, className }) => (\n <div className={wrapperClassName}>\n <Heading className={className}>Language</Heading>\n <Button type=\"button\" size=\"s\" onClick={onClickClose}>\n <FaXmarkIcon alt=\"close\" />\n </Button>\n </div>\n))\n\nconst LocaleButton = memo<{\n value: Locale\n selected: boolean\n className: string\n onClick: (e: MouseEvent<HTMLButtonElement>) => void\n}>(({ value, selected, className, onClick }) => (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n value={value}\n onClick={onClick}\n prefix={selected && <FaCheckIcon color=\"MAIN\" />}\n className={className}\n >\n {localeMap[value]}\n </CommonButton>\n))\n"],"names":["tv","_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;AAYA,MAAM,kBAAkB,GAAGA,EAAE,CAAC;AAC5B,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;YACN,qGAAqG;AACtG,SAAA;QACD,WAAW,EAAE,CAAC,oCAAoC,CAAC;QACnD,aAAa,EAAE,CAAC,WAAW,CAAC;QAC5B,MAAM,EAAE,CAAC,gCAAgC,CAAC;AAC3C,KAAA;AACF,CAAA,CAAC;AAOF,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;AAEnC,MAAM,gBAAgB,GAAG,IAAI,CAAQ,CAAC,EAAE,MAAM,EAAE,YAAY,EAAE,KAAI;AACvE,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAK;AAC9B,QAAA,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,EAAE,GAAG,kBAAkB,EAAE;QAE3E,OAAO;YACL,MAAM,EAAE,MAAM,EAAE;YAChB,WAAW,EAAE,WAAW,EAAE;YAC1B,aAAa,EAAE,aAAa,EAAE;YAC9B,MAAM,EAAE,MAAM,EAAE;SACjB;IACH,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,CAAgC,KAAI;QACnC,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC,KAAe,CAAC;AACxD,IAAA,CAAC,EACD,CAAC,MAAM,CAAC,CACT;AAED,IAAA,QACEC,IAAA,CAAC,OAAO,EAAA,EAAA,QAAA,EAAA,CACNC,IAAC,eAAe,EAAA,EACd,YAAY,EAAE,YAAY,EAC1B,gBAAgB,EAAE,UAAU,CAAC,MAAM,EACnC,SAAS,EAAE,UAAU,CAAC,WAAW,EAAA,CACjC,EACFA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,aAAa,EAAA,QAAA,EACrC,WAAW,CAAC,GAAG,CAAC,CAAC,SAAS,MACzBA,GAAA,CAAC,YAAY,EAAA,EAEX,KAAK,EAAE,SAAmB,EAC1B,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,SAAS,KAAK,MAAM,CAAC,cAAc,EAC7C,SAAS,EAAE,UAAU,CAAC,MAAM,EAAA,EAJvB,SAAS,CAKd,CACH,CAAC,EAAA,CACE,CAAA,EAAA,CACE;AAEd,CAAC;AAED,MAAM,eAAe,GAAG,IAAI,CAE1B,CAAC,EAAE,YAAY,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAC9CD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,gBAAgB,EAAA,QAAA,EAAA,CAC9BC,GAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAE,SAAS,yBAAoB,EACjDA,GAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,YAAY,EAAA,QAAA,EAClDA,GAAA,CAAC,WAAW,EAAA,EAAC,GAAG,EAAC,OAAO,EAAA,CAAG,EAAA,CACpB,CAAA,EAAA,CACL,CACP,CAAC;AAEF,MAAM,YAAY,GAAG,IAAI,CAKtB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,MACzCA,GAAA,CAAC,YAAY,EAAA,EACX,SAAS,EAAC,QAAQ,EAClB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,QAAQ,IAAIA,GAAA,CAAC,WAAW,EAAA,EAAC,KAAK,EAAC,MAAM,EAAA,CAAG,EAChD,SAAS,EAAE,SAAS,EAAA,QAAA,EAEnB,SAAS,CAAC,KAAK,CAAC,EAAA,CACJ,CAChB,CAAC;;;;"}
1
+ {"version":3,"file":"LanguageSelector.js","sources":["../../../../../src/components/AppHeader/components/mobile/LanguageSelector.tsx"],"sourcesContent":["import { type MouseEvent, memo, useCallback, useMemo } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { type Locale, localeMap } from '../../../../intl/localeMap'\nimport { Button } from '../../../Button'\nimport { Heading } from '../../../Heading'\nimport { FaCheckIcon, FaXmarkIcon } from '../../../Icon'\nimport { Section } from '../../../SectioningContent'\nimport { CommonButton } from '../common/CommonButton'\n\nimport type { LocaleProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n header: [\n 'shr-border-b-shorthand shr-flex shr-items-center shr-justify-between shr-gap-1 shr-px-1 shr-py-0.75',\n ],\n headerTitle: ['shr-font-normal [&&]:shr-text-base'],\n buttonWrapper: ['shr-p-0.5'],\n button: ['[&&:not(:has(svg))]:shr-ps-2.5'],\n },\n})\n\ntype Props = {\n locale: LocaleProps\n onClickClose: () => void\n}\n\nexport const LanguageSelector = memo<Props>(({ locale: localeProps, onClickClose }) => {\n const { locale, availableLocales } = useIntl()\n const { locales } = useMemo(\n () => ({\n locales: Object.entries(localeMap).filter(([code]) => availableLocales.includes(code)),\n }),\n [availableLocales],\n )\n const classNames = useMemo(() => {\n const { header, headerTitle, buttonWrapper, button } = classNameGenerator()\n\n return {\n header: header(),\n headerTitle: headerTitle(),\n buttonWrapper: buttonWrapper(),\n button: button(),\n }\n }, [])\n\n const onClickLocale = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n localeProps.onSelectLocale(e.currentTarget.value as Locale)\n },\n [localeProps],\n )\n\n return (\n <Section>\n <SelectorHeading\n onClickClose={onClickClose}\n wrapperClassName={classNames.header}\n className={classNames.headerTitle}\n />\n <div className={classNames.buttonWrapper}>\n {locales.map(([localeKey, label]) => (\n <LocaleButton\n key={localeKey}\n value={localeKey as Locale}\n onClick={onClickLocale}\n selected={localeKey === locale}\n className={classNames.button}\n >\n {label}\n </LocaleButton>\n ))}\n </div>\n </Section>\n )\n})\n\nconst SelectorHeading = memo<\n Pick<Props, 'onClickClose'> & { wrapperClassName: string; className: string }\n>(({ onClickClose, wrapperClassName, className }) => (\n <div className={wrapperClassName}>\n <Heading className={className}>Language</Heading>\n <Button type=\"button\" size=\"s\" onClick={onClickClose}>\n <FaXmarkIcon alt=\"close\" />\n </Button>\n </div>\n))\n\nconst LocaleButton = memo<{\n value: Locale\n selected: boolean\n className: string\n children: string\n onClick: (e: MouseEvent<HTMLButtonElement>) => void\n}>(({ value, selected, className, children, onClick }) => (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n value={value}\n onClick={onClick}\n prefix={selected && <FaCheckIcon color=\"MAIN\" />}\n className={className}\n >\n {children}\n </CommonButton>\n))\n"],"names":["tv","_jsxs","_jsx"],"mappings":"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"}
@@ -5,7 +5,6 @@ import '../../../Header/LanguageSwitcher/LanguageSwitcher.js';
5
5
  import '../../../Header/HeaderLink.js';
6
6
  import '../../../Header/HeaderDropdownMenuButton.js';
7
7
  import '../../../Header/AppLauncher/AppLauncher.js';
8
- import { useLocale } from '../../hooks/useLocale.js';
9
8
  import { AppLauncherContext } from './AppLauncherContext.js';
10
9
  import { Help } from './Help.js';
11
10
  import { Menu } from './Menu.js';
@@ -14,11 +13,10 @@ import { ReleaseNoteContext } from './ReleaseNoteContext.js';
14
13
  import { TenantSelector } from './TenantSelector.js';
15
14
  import { UserInfo } from './UserInfo.js';
16
15
 
17
- const MobileHeader = ({ navigations, features, releaseNote, className = '', tenants, children, helpPageUrl, schoolUrl, userInfo, appName, currentTenantId, onTenantSelect, mobileAdditionalContent, ...props }) => {
16
+ const MobileHeader = ({ navigations, features, releaseNote, className = '', tenants, children, helpPageUrl, schoolUrl, userInfo, appName, currentTenantId, onTenantSelect, mobileAdditionalContent, locale, ...props }) => {
18
17
  const [isAppLauncherSelected, setIsAppLauncherSelected] = useState(false);
19
18
  const [isReleaseNoteSelected, setIsReleaseNoteSelected] = useState(false);
20
19
  const [selectedNavigationGroup, setSelectedNavigationGroup] = useState(null);
21
- const { locale } = useLocale();
22
20
  // navigations の設定をメニューの解放条件とする
23
21
  const isMenuAvailable = navigations && navigations.length > 0;
24
22
  return (jsx(AppLauncherContext.Provider, { value: {
@@ -1 +1 @@
1
- {"version":3,"file":"MobileHeader.js","sources":["../../../../../src/components/AppHeader/components/mobile/MobileHeader.tsx"],"sourcesContent":["import { type FC, useState } from 'react'\n\nimport { Header } from '../../../Header'\nimport { useLocale } from '../../hooks/useLocale'\n\nimport { AppLauncherContext } from './AppLauncherContext'\nimport { Help } from './Help'\nimport { Menu } from './Menu'\nimport { NavigationContext } from './NavigationContext'\nimport { ReleaseNoteContext } from './ReleaseNoteContext'\nimport { TenantSelector } from './TenantSelector'\nimport { UserInfo } from './UserInfo'\n\nimport type { HeaderProps, NavigationGroup } from '../../types'\n\nexport const MobileHeader: FC<HeaderProps> = ({\n navigations,\n features,\n releaseNote,\n className = '',\n tenants,\n children,\n helpPageUrl,\n schoolUrl,\n userInfo,\n appName,\n currentTenantId,\n onTenantSelect,\n mobileAdditionalContent,\n ...props\n}) => {\n const [isAppLauncherSelected, setIsAppLauncherSelected] = useState(false)\n const [isReleaseNoteSelected, setIsReleaseNoteSelected] = useState(false)\n const [selectedNavigationGroup, setSelectedNavigationGroup] = useState<NavigationGroup | null>(\n null,\n )\n\n const { locale } = useLocale()\n\n // navigations の設定をメニューの解放条件とする\n const isMenuAvailable = navigations && navigations.length > 0\n\n return (\n <AppLauncherContext.Provider\n value={{\n features,\n isAppLauncherSelected,\n setIsAppLauncherSelected,\n }}\n >\n <NavigationContext.Provider\n value={{\n navigations: navigations ?? [],\n selectedNavigationGroup,\n setSelectedNavigationGroup,\n }}\n >\n <ReleaseNoteContext.Provider\n value={{\n releaseNote,\n isReleaseNoteSelected,\n setIsReleaseNoteSelected,\n }}\n >\n <Header\n {...props}\n className={`${className} min-[752px]:!shr-hidden`}\n tenants={isMenuAvailable ? undefined : tenants}\n >\n {children}\n\n <Help helpPageUrl={helpPageUrl} schoolUrl={schoolUrl} />\n\n <UserInfo {...userInfo} locale={locale} />\n\n {isMenuAvailable && (\n <Menu\n appName={appName}\n tenantSelector={\n <TenantSelector\n tenants={tenants}\n currentTenantId={currentTenantId}\n onTenantSelect={onTenantSelect}\n />\n }\n additionalContent={mobileAdditionalContent}\n />\n )}\n </Header>\n </ReleaseNoteContext.Provider>\n </NavigationContext.Provider>\n </AppLauncherContext.Provider>\n )\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;AAeO,MAAM,YAAY,GAAoB,CAAC,EAC5C,WAAW,EACX,QAAQ,EACR,WAAW,EACX,SAAS,GAAG,EAAE,EACd,OAAO,EACP,QAAQ,EACR,WAAW,EACX,SAAS,EACT,QAAQ,EACR,OAAO,EACP,eAAe,EACf,cAAc,EACd,uBAAuB,EACvB,GAAG,KAAK,EACT,KAAI;IACH,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACzE,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACzE,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GAAG,QAAQ,CACpE,IAAI,CACL;AAED,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE;;IAG9B,MAAM,eAAe,GAAG,WAAW,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC;AAE7D,IAAA,QACEA,GAAA,CAAC,kBAAkB,CAAC,QAAQ,EAAA,EAC1B,KAAK,EAAE;YACL,QAAQ;YACR,qBAAqB;YACrB,wBAAwB;AACzB,SAAA,EAAA,QAAA,EAEDA,IAAC,iBAAiB,CAAC,QAAQ,EAAA,EACzB,KAAK,EAAE;gBACL,WAAW,EAAE,WAAW,IAAI,EAAE;gBAC9B,uBAAuB;gBACvB,0BAA0B;AAC3B,aAAA,EAAA,QAAA,EAEDA,IAAC,kBAAkB,CAAC,QAAQ,EAAA,EAC1B,KAAK,EAAE;oBACL,WAAW;oBACX,qBAAqB;oBACrB,wBAAwB;AACzB,iBAAA,EAAA,QAAA,EAEDC,KAAC,MAAM,EAAA,EAAA,GACD,KAAK,EACT,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,wBAAA,CAA0B,EACjD,OAAO,EAAE,eAAe,GAAG,SAAS,GAAG,OAAO,aAE7C,QAAQ,EAETD,IAAC,IAAI,EAAA,EAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAA,CAAI,EAExDA,GAAA,CAAC,QAAQ,OAAK,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAA,CAAI,EAEzC,eAAe,KACdA,IAAC,IAAI,EAAA,EACH,OAAO,EAAE,OAAO,EAChB,cAAc,EACZA,GAAA,CAAC,cAAc,IACb,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,cAAc,EAAA,CAC9B,EAEJ,iBAAiB,EAAE,uBAAuB,GAC1C,CACH,CAAA,EAAA,CACM,GACmB,EAAA,CACH,EAAA,CACD;AAElC;;;;"}
1
+ {"version":3,"file":"MobileHeader.js","sources":["../../../../../src/components/AppHeader/components/mobile/MobileHeader.tsx"],"sourcesContent":["import { type FC, useState } from 'react'\n\nimport { Header } from '../../../Header'\n\nimport { AppLauncherContext } from './AppLauncherContext'\nimport { Help } from './Help'\nimport { Menu } from './Menu'\nimport { NavigationContext } from './NavigationContext'\nimport { ReleaseNoteContext } from './ReleaseNoteContext'\nimport { TenantSelector } from './TenantSelector'\nimport { UserInfo } from './UserInfo'\n\nimport type { HeaderProps, NavigationGroup } from '../../types'\n\nexport const MobileHeader: FC<HeaderProps> = ({\n navigations,\n features,\n releaseNote,\n className = '',\n tenants,\n children,\n helpPageUrl,\n schoolUrl,\n userInfo,\n appName,\n currentTenantId,\n onTenantSelect,\n mobileAdditionalContent,\n locale,\n ...props\n}) => {\n const [isAppLauncherSelected, setIsAppLauncherSelected] = useState(false)\n const [isReleaseNoteSelected, setIsReleaseNoteSelected] = useState(false)\n const [selectedNavigationGroup, setSelectedNavigationGroup] = useState<NavigationGroup | null>(\n null,\n )\n\n // navigations の設定をメニューの解放条件とする\n const isMenuAvailable = navigations && navigations.length > 0\n\n return (\n <AppLauncherContext.Provider\n value={{\n features,\n isAppLauncherSelected,\n setIsAppLauncherSelected,\n }}\n >\n <NavigationContext.Provider\n value={{\n navigations: navigations ?? [],\n selectedNavigationGroup,\n setSelectedNavigationGroup,\n }}\n >\n <ReleaseNoteContext.Provider\n value={{\n releaseNote,\n isReleaseNoteSelected,\n setIsReleaseNoteSelected,\n }}\n >\n <Header\n {...props}\n className={`${className} min-[752px]:!shr-hidden`}\n tenants={isMenuAvailable ? undefined : tenants}\n >\n {children}\n\n <Help helpPageUrl={helpPageUrl} schoolUrl={schoolUrl} />\n\n <UserInfo {...userInfo} locale={locale} />\n\n {isMenuAvailable && (\n <Menu\n appName={appName}\n tenantSelector={\n <TenantSelector\n tenants={tenants}\n currentTenantId={currentTenantId}\n onTenantSelect={onTenantSelect}\n />\n }\n additionalContent={mobileAdditionalContent}\n />\n )}\n </Header>\n </ReleaseNoteContext.Provider>\n </NavigationContext.Provider>\n </AppLauncherContext.Provider>\n )\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;AAcO,MAAM,YAAY,GAAoB,CAAC,EAC5C,WAAW,EACX,QAAQ,EACR,WAAW,EACX,SAAS,GAAG,EAAE,EACd,OAAO,EACP,QAAQ,EACR,WAAW,EACX,SAAS,EACT,QAAQ,EACR,OAAO,EACP,eAAe,EACf,cAAc,EACd,uBAAuB,EACvB,MAAM,EACN,GAAG,KAAK,EACT,KAAI;IACH,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACzE,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACzE,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GAAG,QAAQ,CACpE,IAAI,CACL;;IAGD,MAAM,eAAe,GAAG,WAAW,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC;AAE7D,IAAA,QACEA,GAAA,CAAC,kBAAkB,CAAC,QAAQ,EAAA,EAC1B,KAAK,EAAE;YACL,QAAQ;YACR,qBAAqB;YACrB,wBAAwB;AACzB,SAAA,EAAA,QAAA,EAEDA,IAAC,iBAAiB,CAAC,QAAQ,EAAA,EACzB,KAAK,EAAE;gBACL,WAAW,EAAE,WAAW,IAAI,EAAE;gBAC9B,uBAAuB;gBACvB,0BAA0B;AAC3B,aAAA,EAAA,QAAA,EAEDA,IAAC,kBAAkB,CAAC,QAAQ,EAAA,EAC1B,KAAK,EAAE;oBACL,WAAW;oBACX,qBAAqB;oBACrB,wBAAwB;AACzB,iBAAA,EAAA,QAAA,EAEDC,KAAC,MAAM,EAAA,EAAA,GACD,KAAK,EACT,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,wBAAA,CAA0B,EACjD,OAAO,EAAE,eAAe,GAAG,SAAS,GAAG,OAAO,aAE7C,QAAQ,EAETD,IAAC,IAAI,EAAA,EAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAA,CAAI,EAExDA,GAAA,CAAC,QAAQ,OAAK,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAA,CAAI,EAEzC,eAAe,KACdA,IAAC,IAAI,EAAA,EACH,OAAO,EAAE,OAAO,EAChB,cAAc,EACZA,GAAA,CAAC,cAAc,IACb,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,cAAc,EAAA,CAC9B,EAEJ,iBAAiB,EAAE,uBAAuB,GAC1C,CACH,CAAA,EAAA,CACM,GACmB,EAAA,CACH,EAAA,CACD;AAElC;;;;"}
@@ -39,7 +39,6 @@ import '../../../Dropdown/DropdownMenuButton/DropdownMenuGroup.js';
39
39
  import '../../../Dropdown/SortDropdown/SortDropdown.js';
40
40
  import { FaUserLargeIcon, FaGlobeIcon, FaGearIcon } from '../../../Icon/Icon.js';
41
41
  import '../../../Icon/generateIcon.js';
42
- import { useLocale } from '../../hooks/useLocale.js';
43
42
  import { buildDisplayName } from '../../utils.js';
44
43
  import { CommonButton } from '../common/CommonButton.js';
45
44
  import { Translate } from '../common/Translate.js';
@@ -55,7 +54,7 @@ const classNameGenerator = ce({
55
54
  dropdownButtonArea: ['shr-border-t-shorthand shr-p-0.5'],
56
55
  },
57
56
  });
58
- const UserInfo = memo(({ arbitraryDisplayName, email, empCode, firstName, lastName, accountUrl }) => {
57
+ const UserInfo = memo(({ arbitraryDisplayName, email, empCode, firstName, lastName, accountUrl, locale }) => {
59
58
  const displayName = useMemo(() => arbitraryDisplayName ??
60
59
  buildDisplayName({
61
60
  email,
@@ -63,13 +62,12 @@ const UserInfo = memo(({ arbitraryDisplayName, email, empCode, firstName, lastNa
63
62
  firstName,
64
63
  lastName,
65
64
  }), [arbitraryDisplayName, email, empCode, firstName, lastName]);
66
- return displayName ? jsx(ActualUserInfo, { accountUrl: accountUrl, displayName: displayName }) : null;
65
+ return displayName ? (jsx(ActualUserInfo, { accountUrl: accountUrl, displayName: displayName, locale: locale })) : null;
67
66
  });
68
- const ActualUserInfo = ({ displayName, accountUrl, }) => {
67
+ const ActualUserInfo = ({ displayName, accountUrl, locale, }) => {
69
68
  const [languageDialogOpen, setLanguageDialogOpen] = useState(false);
70
69
  const dialogOpen = useCallback(() => setLanguageDialogOpen(true), []);
71
70
  const dialogClose = useCallback(() => setLanguageDialogOpen(false), []);
72
- const { locale } = useLocale();
73
71
  const { localize } = useIntl();
74
72
  const translated = useMemo(() => ({
75
73
  account: localize({
@@ -1 +1 @@
1
- {"version":3,"file":"UserInfo.js","sources":["../../../../../src/components/AppHeader/components/mobile/UserInfo.tsx"],"sourcesContent":["import { type FC, memo, useCallback, useMemo, useState } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { Button } from '../../../Button'\nimport { Dialog } from '../../../Dialog'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { FaGearIcon, FaGlobeIcon, FaUserLargeIcon } from '../../../Icon'\nimport { useLocale } from '../../hooks/useLocale'\nimport { buildDisplayName } from '../../utils'\nimport { CommonButton } from '../common/CommonButton'\nimport { Translate } from '../common/Translate'\n\nimport { LanguageSelector } from './LanguageSelector'\n\nimport type { HeaderProps, UserInfoProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n iconButton: ['[&&&]:shr-border-transparent [&&]:shr-p-0.25'],\n iconButtonInner: [\n 'shr-border-shorthand shr-block shr-flex shr-items-center shr-justify-center shr-rounded-full shr-bg-white shr-p-0.25',\n ],\n dropdownUserName: ['shr-box-border shr-min-w-[246px] shr-px-1 shr-py-0.75 shr-text-sm'],\n dropdownButtonArea: ['shr-border-t-shorthand shr-p-0.5'],\n },\n})\n\ntype Props = UserInfoProps & Pick<HeaderProps, 'locale'>\n\nexport const UserInfo = memo<Props>(\n ({ arbitraryDisplayName, email, empCode, firstName, lastName, accountUrl }) => {\n const displayName = useMemo(\n () =>\n arbitraryDisplayName ??\n buildDisplayName({\n email,\n empCode,\n firstName,\n lastName,\n }),\n [arbitraryDisplayName, email, empCode, firstName, lastName],\n )\n\n return displayName ? <ActualUserInfo accountUrl={accountUrl} displayName={displayName} /> : null\n },\n)\n\nconst ActualUserInfo: FC<Pick<Props, 'accountUrl'> & { displayName: string }> = ({\n displayName,\n accountUrl,\n}) => {\n const [languageDialogOpen, setLanguageDialogOpen] = useState(false)\n\n const dialogOpen = useCallback(() => setLanguageDialogOpen(true), [])\n const dialogClose = useCallback(() => setLanguageDialogOpen(false), [])\n\n const { locale } = useLocale()\n\n const { localize } = useIntl()\n const translated = useMemo(\n () => ({\n account: localize({\n id: 'smarthr-ui/AppHeader/MobileHeader/account',\n defaultText: 'アカウント',\n }),\n userSetting: localize({\n id: 'smarthr-ui/AppHeader/userSettings',\n defaultText: '個人設定',\n }),\n }),\n [localize],\n )\n\n const classNames = useMemo(() => {\n const { iconButton, iconButtonInner, dropdownUserName, dropdownButtonArea } =\n classNameGenerator()\n\n return {\n iconButton: iconButton(),\n iconButtonInner: iconButtonInner(),\n dropdownUserName: dropdownUserName(),\n dropdownButtonArea: dropdownButtonArea(),\n }\n }, [])\n\n return (\n <>\n <Dropdown>\n <DropdownTrigger>\n <Button variant=\"skeleton\" size=\"s\" className={classNames.iconButton}>\n <span className={classNames.iconButtonInner}>\n <FaUserLargeIcon alt={translated.account} className=\"shr-fill-grey\" />\n </span>\n </Button>\n </DropdownTrigger>\n\n <DropdownContent>\n <div className={classNames.dropdownUserName}>\n <p>{displayName}</p>\n </div>\n\n {(locale || accountUrl) && (\n <div className={classNames.dropdownButtonArea}>\n {locale && (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n onClick={dialogOpen}\n prefix={<FaGlobeIcon />}\n >\n Language\n </CommonButton>\n )}\n\n {accountUrl && (\n <CommonButton\n elementAs=\"a\"\n href={accountUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n prefix={<FaGearIcon />}\n >\n <Translate>{translated.userSetting}</Translate>\n </CommonButton>\n )}\n </div>\n )}\n </DropdownContent>\n </Dropdown>\n\n {locale && (\n <Dialog isOpen={languageDialogOpen} onClickOverlay={dialogClose} width={246}>\n <LanguageSelector locale={locale} onClickClose={dialogClose} />\n </Dialog>\n )}\n </>\n )\n}\n"],"names":["tv","_jsx","_jsxs","_Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"UserInfo.js","sources":["../../../../../src/components/AppHeader/components/mobile/UserInfo.tsx"],"sourcesContent":["import { type FC, memo, useCallback, useMemo, useState } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { Button } from '../../../Button'\nimport { Dialog } from '../../../Dialog'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { FaGearIcon, FaGlobeIcon, FaUserLargeIcon } from '../../../Icon'\nimport { buildDisplayName } from '../../utils'\nimport { CommonButton } from '../common/CommonButton'\nimport { Translate } from '../common/Translate'\n\nimport { LanguageSelector } from './LanguageSelector'\n\nimport type { HeaderProps, UserInfoProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n iconButton: ['[&&&]:shr-border-transparent [&&]:shr-p-0.25'],\n iconButtonInner: [\n 'shr-border-shorthand shr-block shr-flex shr-items-center shr-justify-center shr-rounded-full shr-bg-white shr-p-0.25',\n ],\n dropdownUserName: ['shr-box-border shr-min-w-[246px] shr-px-1 shr-py-0.75 shr-text-sm'],\n dropdownButtonArea: ['shr-border-t-shorthand shr-p-0.5'],\n },\n})\n\ntype Props = UserInfoProps & Pick<HeaderProps, 'locale'>\n\nexport const UserInfo = memo<Props>(\n ({ arbitraryDisplayName, email, empCode, firstName, lastName, accountUrl, locale }) => {\n const displayName = useMemo(\n () =>\n arbitraryDisplayName ??\n buildDisplayName({\n email,\n empCode,\n firstName,\n lastName,\n }),\n [arbitraryDisplayName, email, empCode, firstName, lastName],\n )\n\n return displayName ? (\n <ActualUserInfo accountUrl={accountUrl} displayName={displayName} locale={locale} />\n ) : null\n },\n)\n\nconst ActualUserInfo: FC<Pick<Props, 'accountUrl' | 'locale'> & { displayName: string }> = ({\n displayName,\n accountUrl,\n locale,\n}) => {\n const [languageDialogOpen, setLanguageDialogOpen] = useState(false)\n\n const dialogOpen = useCallback(() => setLanguageDialogOpen(true), [])\n const dialogClose = useCallback(() => setLanguageDialogOpen(false), [])\n\n const { localize } = useIntl()\n const translated = useMemo(\n () => ({\n account: localize({\n id: 'smarthr-ui/AppHeader/MobileHeader/account',\n defaultText: 'アカウント',\n }),\n userSetting: localize({\n id: 'smarthr-ui/AppHeader/userSettings',\n defaultText: '個人設定',\n }),\n }),\n [localize],\n )\n\n const classNames = useMemo(() => {\n const { iconButton, iconButtonInner, dropdownUserName, dropdownButtonArea } =\n classNameGenerator()\n\n return {\n iconButton: iconButton(),\n iconButtonInner: iconButtonInner(),\n dropdownUserName: dropdownUserName(),\n dropdownButtonArea: dropdownButtonArea(),\n }\n }, [])\n\n return (\n <>\n <Dropdown>\n <DropdownTrigger>\n <Button variant=\"skeleton\" size=\"s\" className={classNames.iconButton}>\n <span className={classNames.iconButtonInner}>\n <FaUserLargeIcon alt={translated.account} className=\"shr-fill-grey\" />\n </span>\n </Button>\n </DropdownTrigger>\n\n <DropdownContent>\n <div className={classNames.dropdownUserName}>\n <p>{displayName}</p>\n </div>\n\n {(locale || accountUrl) && (\n <div className={classNames.dropdownButtonArea}>\n {locale && (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n onClick={dialogOpen}\n prefix={<FaGlobeIcon />}\n >\n Language\n </CommonButton>\n )}\n\n {accountUrl && (\n <CommonButton\n elementAs=\"a\"\n href={accountUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n prefix={<FaGearIcon />}\n >\n <Translate>{translated.userSetting}</Translate>\n </CommonButton>\n )}\n </div>\n )}\n </DropdownContent>\n </Dropdown>\n\n {locale && (\n <Dialog isOpen={languageDialogOpen} onClickOverlay={dialogClose} width={246}>\n <LanguageSelector locale={locale} onClickClose={dialogClose} />\n </Dialog>\n )}\n </>\n )\n}\n"],"names":["tv","_jsx","_jsxs","_Fragment"],"mappings":"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"}
@@ -28,7 +28,6 @@ const args = {
28
28
  schoolUrl: 'https://example.com',
29
29
  helpPageUrl: 'https://example.com',
30
30
  locale: {
31
- selectedLocale: 'ja',
32
31
  onSelectLocale: g('locale'),
33
32
  },
34
33
  userInfo: {
@@ -1 +1 @@
1
- {"version":3,"file":"args.js","sources":["../../../../src/components/AppHeader/stories/args.tsx"],"sourcesContent":["import { action } from 'storybook/actions'\n\nimport type { AppHeader } from '../AppHeader'\nimport type { ComponentProps, FC, PropsWithChildren } from 'react'\n\nconst CustomLink: FC<PropsWithChildren<{ to: string; className?: string }>> = (props) => (\n <a {...props} href={props.to} className={props.className ?? ''}>\n {props.children}\n </a>\n)\n\nconst AdditionalContent: FC<PropsWithChildren> = ({ children }) => (\n <div style={{ background: 'rgb(242 242 242)', padding: '4px 8px' }}>{children}</div>\n)\n\nconst buildFeature = (index: number, name: string, favorite: boolean, position?: number) => ({\n id: `feature-${index}`,\n url: 'https://example.com',\n name,\n favorite,\n position: position ?? null,\n})\n\nexport const args: ComponentProps<typeof AppHeader> = {\n children: <AdditionalContent>children</AdditionalContent>,\n appName: '勤怠管理',\n tenants: [\n {\n id: 'tenant-1',\n name: '株式会社テストテナント壱',\n },\n {\n id: 'tenant-2',\n name: '株式会社テストテナント弐',\n },\n ],\n currentTenantId: 'tenant-1',\n onTenantSelect: action('テナント選択'),\n schoolUrl: 'https://example.com',\n helpPageUrl: 'https://example.com',\n locale: {\n selectedLocale: 'ja',\n onSelectLocale: action('locale'),\n },\n userInfo: {\n email: 'smarthr@example.com',\n empCode: '001',\n firstName: '須磨',\n lastName: '栄子',\n accountUrl: 'https://example.com',\n },\n desktopAdditionalContent: <AdditionalContent>desktopAdditionalContent</AdditionalContent>,\n navigations: [\n {\n children: 'aタグ',\n href: 'https://example.com',\n },\n {\n children: 'カスタムタグ',\n elementAs: CustomLink,\n to: 'https://example.com',\n },\n {\n children: 'ボタン',\n onClick: action('AppNavボタンクリック'),\n },\n {\n children: 'ドロップダウン',\n childNavigations: [\n {\n children: 'aタグ',\n href: 'https://example.com',\n },\n {\n children: 'カスタムタグ',\n elementAs: CustomLink,\n to: 'https://example.com',\n },\n {\n children: 'ボタン',\n onClick: action('ボタンクリック'),\n },\n ],\n },\n {\n children: 'グループ',\n childNavigations: [\n {\n title: 'グループ1',\n childNavigations: [\n {\n children: 'グループ1_アイテム1',\n href: 'https://example.com',\n current: true,\n },\n {\n children: 'グループ1_アイテム2',\n href: 'https://example.com',\n },\n ],\n },\n {\n title: 'グループ2',\n childNavigations: [\n {\n children: 'グループ2_アイテム1',\n href: 'https://example.com',\n },\n {\n children: 'グループ2_アイテム2',\n href: 'https://example.com',\n },\n ],\n },\n ],\n },\n ],\n desktopNavigationAdditionalContent: (\n <AdditionalContent>desktopNavigationAdditionalContent</AdditionalContent>\n ),\n releaseNote: {\n links: [\n {\n title: 'リリースノート1',\n url: 'https://example.com',\n },\n {\n title: 'リリースノート2',\n url: 'https://example.com',\n },\n {\n title: 'リリースノート3',\n url: 'https://example.com',\n },\n ],\n indexUrl: 'https://example.com',\n },\n features: [\n buildFeature(1, '従業員リスト', false),\n buildFeature(2, '共通設定', true, 4),\n buildFeature(3, 'お知らせ管理', true, 3),\n buildFeature(4, '給与明細', true, 1),\n buildFeature(5, '申請', false),\n buildFeature(6, '給与明細管理', false),\n buildFeature(7, 'マイナンバー管理', false),\n buildFeature(8, '源泉徴収票管理', false),\n buildFeature(9, '手続き', false),\n buildFeature(10, '手続きToDo', false),\n buildFeature(11, '文書配付', false),\n buildFeature(12, 'IdP', true, 2),\n ],\n mobileAdditionalContent: <AdditionalContent>mobileAdditionalContent</AdditionalContent>,\n}\n"],"names":["_jsx","action"],"mappings":"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"}
1
+ {"version":3,"file":"args.js","sources":["../../../../src/components/AppHeader/stories/args.tsx"],"sourcesContent":["import { action } from 'storybook/actions'\n\nimport type { AppHeader } from '../AppHeader'\nimport type { ComponentProps, FC, PropsWithChildren } from 'react'\n\nconst CustomLink: FC<PropsWithChildren<{ to: string; className?: string }>> = (props) => (\n <a {...props} href={props.to} className={props.className ?? ''}>\n {props.children}\n </a>\n)\n\nconst AdditionalContent: FC<PropsWithChildren> = ({ children }) => (\n <div style={{ background: 'rgb(242 242 242)', padding: '4px 8px' }}>{children}</div>\n)\n\nconst buildFeature = (index: number, name: string, favorite: boolean, position?: number) => ({\n id: `feature-${index}`,\n url: 'https://example.com',\n name,\n favorite,\n position: position ?? null,\n})\n\nexport const args: ComponentProps<typeof AppHeader> = {\n children: <AdditionalContent>children</AdditionalContent>,\n appName: '勤怠管理',\n tenants: [\n {\n id: 'tenant-1',\n name: '株式会社テストテナント壱',\n },\n {\n id: 'tenant-2',\n name: '株式会社テストテナント弐',\n },\n ],\n currentTenantId: 'tenant-1',\n onTenantSelect: action('テナント選択'),\n schoolUrl: 'https://example.com',\n helpPageUrl: 'https://example.com',\n locale: {\n onSelectLocale: action('locale'),\n },\n userInfo: {\n email: 'smarthr@example.com',\n empCode: '001',\n firstName: '須磨',\n lastName: '栄子',\n accountUrl: 'https://example.com',\n },\n desktopAdditionalContent: <AdditionalContent>desktopAdditionalContent</AdditionalContent>,\n navigations: [\n {\n children: 'aタグ',\n href: 'https://example.com',\n },\n {\n children: 'カスタムタグ',\n elementAs: CustomLink,\n to: 'https://example.com',\n },\n {\n children: 'ボタン',\n onClick: action('AppNavボタンクリック'),\n },\n {\n children: 'ドロップダウン',\n childNavigations: [\n {\n children: 'aタグ',\n href: 'https://example.com',\n },\n {\n children: 'カスタムタグ',\n elementAs: CustomLink,\n to: 'https://example.com',\n },\n {\n children: 'ボタン',\n onClick: action('ボタンクリック'),\n },\n ],\n },\n {\n children: 'グループ',\n childNavigations: [\n {\n title: 'グループ1',\n childNavigations: [\n {\n children: 'グループ1_アイテム1',\n href: 'https://example.com',\n current: true,\n },\n {\n children: 'グループ1_アイテム2',\n href: 'https://example.com',\n },\n ],\n },\n {\n title: 'グループ2',\n childNavigations: [\n {\n children: 'グループ2_アイテム1',\n href: 'https://example.com',\n },\n {\n children: 'グループ2_アイテム2',\n href: 'https://example.com',\n },\n ],\n },\n ],\n },\n ],\n desktopNavigationAdditionalContent: (\n <AdditionalContent>desktopNavigationAdditionalContent</AdditionalContent>\n ),\n releaseNote: {\n links: [\n {\n title: 'リリースノート1',\n url: 'https://example.com',\n },\n {\n title: 'リリースノート2',\n url: 'https://example.com',\n },\n {\n title: 'リリースノート3',\n url: 'https://example.com',\n },\n ],\n indexUrl: 'https://example.com',\n },\n features: [\n buildFeature(1, '従業員リスト', false),\n buildFeature(2, '共通設定', true, 4),\n buildFeature(3, 'お知らせ管理', true, 3),\n buildFeature(4, '給与明細', true, 1),\n buildFeature(5, '申請', false),\n buildFeature(6, '給与明細管理', false),\n buildFeature(7, 'マイナンバー管理', false),\n buildFeature(8, '源泉徴収票管理', false),\n buildFeature(9, '手続き', false),\n buildFeature(10, '手続きToDo', false),\n buildFeature(11, '文書配付', false),\n buildFeature(12, 'IdP', true, 2),\n ],\n mobileAdditionalContent: <AdditionalContent>mobileAdditionalContent</AdditionalContent>,\n}\n"],"names":["_jsx","action"],"mappings":"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"}
@@ -1,8 +1,7 @@
1
+ import type { Locale } from '../../intl/localeMap';
1
2
  import type { Header } from '../Header';
2
3
  import type { ComponentProps, ComponentType, MouseEvent, ReactElement, ReactNode } from 'react';
3
- type Locale = 'ja' | 'en-us' | 'id-id' | 'pt' | 'vi' | 'ko' | 'zh-cn' | 'zh-tw';
4
4
  export type LocaleProps = {
5
- selectedLocale: Locale;
6
5
  onSelectLocale: (locale: Locale) => void;
7
6
  };
8
7
  export type UserInfoProps = {
@@ -1,10 +1,10 @@
1
1
  import { type FC, type HTMLAttributes } from 'react';
2
2
  import { type VariantProps } from 'tailwind-variants';
3
3
  import { type DecoratorsType } from '../../../hooks/useDecorators';
4
- import type { LocaleMap } from '../../../types';
4
+ import type { Locale } from '../../../intl/localeMap';
5
5
  export type Props = {
6
6
  narrow?: boolean;
7
- localeMap: LocaleMap;
7
+ localeMap: Partial<Record<Locale, string>>;
8
8
  locale?: string;
9
9
  defaultLocale?: string;
10
10
  /** コンポーネント内の文言を変更するための関数を設定 */
@@ -79,11 +79,11 @@ const classNameGenerator = ce({
79
79
  },
80
80
  });
81
81
  const LanguageSwitcher = ({ narrow, enableNew, invert = enableNew, decorators, localeMap, locale, defaultLocale, onLanguageSelect, ...rest }) => {
82
- const { localize } = useIntl();
82
+ const { localize, availableLocales } = useIntl();
83
83
  const { locales, defaultCurrentLang } = useMemo(() => ({
84
- locales: Object.entries(localeMap),
84
+ locales: Object.entries(localeMap).filter(([code]) => availableLocales.includes(code)),
85
85
  defaultCurrentLang: Object.keys(localeMap)[0],
86
- }), [localeMap]);
86
+ }), [localeMap, availableLocales]);
87
87
  const decoratorDefaultTexts = useMemo(() => ({
88
88
  triggerLabel: DECORATOR_DEFAULT_TEXTS.triggerLabel,
89
89
  checkIconAlt: localize({
@@ -1 +1 @@
1
- {"version":3,"file":"LanguageSwitcher.js","sources":["../../../../src/components/Header/LanguageSwitcher/LanguageSwitcher.tsx"],"sourcesContent":["'use client'\n\nimport {\n type FC,\n type HTMLAttributes,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n memo,\n useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { type DecoratorsType, useDecorators } from '../../../hooks/useDecorators'\nimport { useIntl } from '../../../intl'\nimport { tabbable } from '../../../libs/tabbable'\nimport { Button } from '../../Button'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../Dropdown'\nimport { FaCaretDownIcon, FaCheckIcon, FaGlobeIcon, LanguageIcon } from '../../Icon'\n\nimport type { LocaleMap } from '../../../types'\n\nexport type Props = {\n narrow?: boolean\n localeMap: LocaleMap\n locale?: string\n defaultLocale?: string\n /** コンポーネント内の文言を変更するための関数を設定 */\n decorators?: DecoratorsType<DecoratorKeyTypes>\n /** 言語切替UIで言語を選択した時に発火するコールバック関数 */\n onLanguageSelect?: (code: string) => void\n} & VariantProps<typeof classNameGenerator>\n\ntype ElementProps = Omit<HTMLAttributes<HTMLElement>, keyof Props>\n\n// トリガーはどの言語でも英語のままLanguageと表示するのが好ましいため、intlにはおかない。decoratorは一旦そのままにしている。\nconst DECORATOR_DEFAULT_TEXTS = {\n triggerLabel: 'Language',\n} as const\n\ntype DecoratorKeyTypes = 'checkIconAlt' | keyof typeof DECORATOR_DEFAULT_TEXTS\n\nconst ARROW_KEY_REGEX = /^Arrow(Up|Down|Left|Right)$/\nconst ARROW_UPS_REGEX = /^Arrow(Up|Left)$/\n\nconst onKeyDownContent = (e: KeyboardEvent<HTMLDivElement>) => {\n if (!ARROW_KEY_REGEX.test(e.key)) {\n return\n }\n\n e.preventDefault()\n\n const buttons = tabbable(e.currentTarget)\n const i = buttons.indexOf(e.target as HTMLElement)\n let buttonAt = 0\n\n if (ARROW_UPS_REGEX.test(e.key)) {\n buttonAt = i - 1\n } else if (i + 1 === buttons.length) {\n buttonAt = i + 1\n }\n\n buttons.at(buttonAt)?.focus()\n}\n\nconst classNameGenerator = tv({\n slots: {\n switchButton: [\n 'shr-border-none shr-bg-transparent shr-px-0.25 shr-font-normal shr-text-white shr-transition-transform shr-duration-100',\n 'hover:shr-border-transparent hover:shr-bg-transparent',\n 'focus-visible:shr-border-transparent focus-visible:shr-bg-transparent',\n 'forced-colors:shr-border-shorthand',\n '[&_.smarthr-ui-Icon]:aria-expanded:shr-rotate-180',\n ],\n languageItemsList: ['shr-p-0.5'],\n languageItem: ['shr-flex shr-items-center'],\n languageButton: [\n 'shr-justify-start shr-border-transparent shr-px-0.5 shr-font-normal',\n '[&:not(:has(svg))]:shr-ps-2',\n 'hover:shr-border-transparent',\n ],\n },\n variants: {\n invert: {\n true: {\n switchButton: [\n 'shr-text-black',\n 'hover:shr-bg-white-darken',\n 'focus-visible:shr-bg-white-darken',\n ],\n },\n },\n enableNew: {\n true: {\n switchButton: 'shr-px-0.5',\n },\n },\n },\n})\n\nexport const LanguageSwitcher: FC<Props & ElementProps> = ({\n narrow,\n enableNew,\n invert = enableNew,\n decorators,\n localeMap,\n locale,\n defaultLocale,\n onLanguageSelect,\n ...rest\n}) => {\n const { localize } = useIntl()\n const { locales, defaultCurrentLang } = useMemo(\n () => ({\n locales: Object.entries(localeMap),\n defaultCurrentLang: Object.keys(localeMap)[0],\n }),\n [localeMap],\n )\n\n const decoratorDefaultTexts = useMemo(\n () => ({\n triggerLabel: DECORATOR_DEFAULT_TEXTS.triggerLabel,\n checkIconAlt: localize({\n id: 'smarthr-ui/LanguageSwitcher/checkIconAlt',\n defaultText: '選択中',\n }),\n }),\n [localize],\n )\n\n const decorated = useDecorators<DecoratorKeyTypes>(decoratorDefaultTexts, decorators)\n const currentLang = locale || defaultLocale || defaultCurrentLang\n const classNames = useMemo(() => {\n const { languageButton, languageItemsList, languageItem, switchButton } = classNameGenerator()\n\n return {\n languageButton: languageButton(),\n languageItemsList: languageItemsList(),\n languageItem: languageItem(),\n switchButton: switchButton({ invert, enableNew }),\n }\n }, [enableNew, invert])\n\n const onClickLanguageSelect = useMemo(\n () =>\n onLanguageSelect\n ? (e: MouseEvent<HTMLButtonElement>) => {\n onLanguageSelect(e.currentTarget.value)\n }\n : undefined,\n [onLanguageSelect],\n )\n\n return (\n <Dropdown {...rest}>\n <MemoizedDropdownTrigger\n narrow={narrow}\n invert={invert}\n className={classNames.switchButton}\n label={decorated.triggerLabel}\n />\n <DropdownContent role=\"presentation\" onKeyDown={onKeyDownContent}>\n <ul className={classNames.languageItemsList}>\n {locales.map(([code, label]) => (\n <LanguageListItemButton\n key={code}\n code={code}\n className={classNames.languageItem}\n buttonStyle={classNames.languageButton}\n current={currentLang === code}\n onClick={onClickLanguageSelect}\n iconAlt={decorated.checkIconAlt}\n >\n {label}\n </LanguageListItemButton>\n ))}\n </ul>\n </DropdownContent>\n </Dropdown>\n )\n}\n\nconst LanguageListItemButton = memo<{\n code: string\n children: string\n className: string\n buttonStyle: string\n current: boolean\n iconAlt: ReactNode\n onClick?: (e: MouseEvent<HTMLButtonElement>) => void\n}>(({ code, children, buttonStyle, className, current, iconAlt, onClick }) => (\n <li key={code} className={className} aria-current={current} lang={code}>\n <Button\n value={code}\n onClick={onClick}\n wide\n prefix={current ? <FaCheckIcon color=\"MAIN\" alt={iconAlt} /> : null}\n className={buttonStyle}\n >\n {children}\n </Button>\n </li>\n))\n\nconst MemoizedDropdownTrigger = memo<\n Pick<Props, 'narrow' | 'invert'> & { className: string; label: ReactNode }\n>(({ narrow, invert, className, label }) => (\n <DropdownTrigger>\n {narrow ? (\n <Button suffix={<FaCaretDownIcon />} className={className}>\n {invert ? <LanguageIcon alt={label} /> : <FaGlobeIcon alt={label} />}\n </Button>\n ) : (\n <Button\n prefix={invert ? <LanguageIcon /> : <FaGlobeIcon />}\n suffix={<FaCaretDownIcon />}\n className={className}\n >\n {label}\n </Button>\n )}\n </DropdownTrigger>\n))\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAmCA;AACA;AACE;;AAKF;AACA;AAEA;;;;;;;;;AAYI;;;AAEA;;;AAIJ;AAEA;AACE;AACE;;;;;;AAMC;;;AAGD;;;;AAIC;AACF;AACD;AACE;AACE;AACE;;;;AAIC;AACF;AACF;AACD;AACE;AACE;AACD;AACF;AACF;AACF;AAEM;AAWL;;AAGI;;AAED;AAIH;;;AAIM;AACA;;AAEH;;AAKH;AACA;AACE;;;;;;;AAQF;AAEA;AAGM;AACI;;AAEJ;;AA+BR;AAEA;AAsBA;;"}
1
+ {"version":3,"file":"LanguageSwitcher.js","sources":["../../../../src/components/Header/LanguageSwitcher/LanguageSwitcher.tsx"],"sourcesContent":["'use client'\n\nimport {\n type FC,\n type HTMLAttributes,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n memo,\n useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { type DecoratorsType, useDecorators } from '../../../hooks/useDecorators'\nimport { useIntl } from '../../../intl'\nimport { tabbable } from '../../../libs/tabbable'\nimport { Button } from '../../Button'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../Dropdown'\nimport { FaCaretDownIcon, FaCheckIcon, FaGlobeIcon, LanguageIcon } from '../../Icon'\n\nimport type { Locale } from '../../../intl/localeMap'\n\nexport type Props = {\n narrow?: boolean\n localeMap: Partial<Record<Locale, string>>\n locale?: string\n defaultLocale?: string\n /** コンポーネント内の文言を変更するための関数を設定 */\n decorators?: DecoratorsType<DecoratorKeyTypes>\n /** 言語切替UIで言語を選択した時に発火するコールバック関数 */\n onLanguageSelect?: (code: string) => void\n} & VariantProps<typeof classNameGenerator>\n\ntype ElementProps = Omit<HTMLAttributes<HTMLElement>, keyof Props>\n\n// トリガーはどの言語でも英語のままLanguageと表示するのが好ましいため、intlにはおかない。decoratorは一旦そのままにしている。\nconst DECORATOR_DEFAULT_TEXTS = {\n triggerLabel: 'Language',\n} as const\n\ntype DecoratorKeyTypes = 'checkIconAlt' | keyof typeof DECORATOR_DEFAULT_TEXTS\n\nconst ARROW_KEY_REGEX = /^Arrow(Up|Down|Left|Right)$/\nconst ARROW_UPS_REGEX = /^Arrow(Up|Left)$/\n\nconst onKeyDownContent = (e: KeyboardEvent<HTMLDivElement>) => {\n if (!ARROW_KEY_REGEX.test(e.key)) {\n return\n }\n\n e.preventDefault()\n\n const buttons = tabbable(e.currentTarget)\n const i = buttons.indexOf(e.target as HTMLElement)\n let buttonAt = 0\n\n if (ARROW_UPS_REGEX.test(e.key)) {\n buttonAt = i - 1\n } else if (i + 1 === buttons.length) {\n buttonAt = i + 1\n }\n\n buttons.at(buttonAt)?.focus()\n}\n\nconst classNameGenerator = tv({\n slots: {\n switchButton: [\n 'shr-border-none shr-bg-transparent shr-px-0.25 shr-font-normal shr-text-white shr-transition-transform shr-duration-100',\n 'hover:shr-border-transparent hover:shr-bg-transparent',\n 'focus-visible:shr-border-transparent focus-visible:shr-bg-transparent',\n 'forced-colors:shr-border-shorthand',\n '[&_.smarthr-ui-Icon]:aria-expanded:shr-rotate-180',\n ],\n languageItemsList: ['shr-p-0.5'],\n languageItem: ['shr-flex shr-items-center'],\n languageButton: [\n 'shr-justify-start shr-border-transparent shr-px-0.5 shr-font-normal',\n '[&:not(:has(svg))]:shr-ps-2',\n 'hover:shr-border-transparent',\n ],\n },\n variants: {\n invert: {\n true: {\n switchButton: [\n 'shr-text-black',\n 'hover:shr-bg-white-darken',\n 'focus-visible:shr-bg-white-darken',\n ],\n },\n },\n enableNew: {\n true: {\n switchButton: 'shr-px-0.5',\n },\n },\n },\n})\n\nexport const LanguageSwitcher: FC<Props & ElementProps> = ({\n narrow,\n enableNew,\n invert = enableNew,\n decorators,\n localeMap,\n locale,\n defaultLocale,\n onLanguageSelect,\n ...rest\n}) => {\n const { localize, availableLocales } = useIntl()\n const { locales, defaultCurrentLang } = useMemo(\n () => ({\n locales: Object.entries(localeMap).filter(([code]) => availableLocales.includes(code)),\n defaultCurrentLang: Object.keys(localeMap)[0],\n }),\n [localeMap, availableLocales],\n )\n\n const decoratorDefaultTexts = useMemo(\n () => ({\n triggerLabel: DECORATOR_DEFAULT_TEXTS.triggerLabel,\n checkIconAlt: localize({\n id: 'smarthr-ui/LanguageSwitcher/checkIconAlt',\n defaultText: '選択中',\n }),\n }),\n [localize],\n )\n\n const decorated = useDecorators<DecoratorKeyTypes>(decoratorDefaultTexts, decorators)\n const currentLang = locale || defaultLocale || defaultCurrentLang\n const classNames = useMemo(() => {\n const { languageButton, languageItemsList, languageItem, switchButton } = classNameGenerator()\n\n return {\n languageButton: languageButton(),\n languageItemsList: languageItemsList(),\n languageItem: languageItem(),\n switchButton: switchButton({ invert, enableNew }),\n }\n }, [enableNew, invert])\n\n const onClickLanguageSelect = useMemo(\n () =>\n onLanguageSelect\n ? (e: MouseEvent<HTMLButtonElement>) => {\n onLanguageSelect(e.currentTarget.value)\n }\n : undefined,\n [onLanguageSelect],\n )\n\n return (\n <Dropdown {...rest}>\n <MemoizedDropdownTrigger\n narrow={narrow}\n invert={invert}\n className={classNames.switchButton}\n label={decorated.triggerLabel}\n />\n <DropdownContent role=\"presentation\" onKeyDown={onKeyDownContent}>\n <ul className={classNames.languageItemsList}>\n {locales.map(([code, label]) => (\n <LanguageListItemButton\n key={code}\n code={code}\n className={classNames.languageItem}\n buttonStyle={classNames.languageButton}\n current={currentLang === code}\n onClick={onClickLanguageSelect}\n iconAlt={decorated.checkIconAlt}\n >\n {label}\n </LanguageListItemButton>\n ))}\n </ul>\n </DropdownContent>\n </Dropdown>\n )\n}\n\nconst LanguageListItemButton = memo<{\n code: string\n children: string\n className: string\n buttonStyle: string\n current: boolean\n iconAlt: ReactNode\n onClick?: (e: MouseEvent<HTMLButtonElement>) => void\n}>(({ code, children, buttonStyle, className, current, iconAlt, onClick }) => (\n <li key={code} className={className} aria-current={current} lang={code}>\n <Button\n value={code}\n onClick={onClick}\n wide\n prefix={current ? <FaCheckIcon color=\"MAIN\" alt={iconAlt} /> : null}\n className={buttonStyle}\n >\n {children}\n </Button>\n </li>\n))\n\nconst MemoizedDropdownTrigger = memo<\n Pick<Props, 'narrow' | 'invert'> & { className: string; label: ReactNode }\n>(({ narrow, invert, className, label }) => (\n <DropdownTrigger>\n {narrow ? (\n <Button suffix={<FaCaretDownIcon />} className={className}>\n {invert ? <LanguageIcon alt={label} /> : <FaGlobeIcon alt={label} />}\n </Button>\n ) : (\n <Button\n prefix={invert ? <LanguageIcon /> : <FaGlobeIcon />}\n suffix={<FaCaretDownIcon />}\n className={className}\n >\n {label}\n </Button>\n )}\n </DropdownTrigger>\n))\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAmCA;AACA;AACE;;AAKF;AACA;AAEA;;;;;;;;;AAYI;;;AAEA;;;AAIJ;AAEA;AACE;AACE;;;;;;AAMC;;;AAGD;;;;AAIC;AACF;AACD;AACE;AACE;AACE;;;;AAIC;AACF;AACF;AACD;AACE;AACE;AACD;AACF;AACF;AACF;AAEM;;;;;AAgBF;AAIH;;;AAIM;AACA;;AAEH;;AAKH;AACA;AACE;;;;;;;AAQF;AAEA;AAGM;AACI;;AAEJ;;AA+BR;AAEA;AAsBA;;"}
@@ -7,7 +7,7 @@ const classNameGenerator = ce({
7
7
  base: [
8
8
  'smarthr-ui-SpreadsheetTable shr-border-shorthand shr-border-collapse shr-bg-head',
9
9
  // th
10
- '[&_th]:shr-p-0.25 [&_th]:shr-text-sm [&_th]:shr-font-normal [&_th]:shr-text-grey',
10
+ '[&_th]:shr-p-0.25 [&_th]:shr-text-sm [&_th]:shr-font-normal [&_th]:shr-text-black',
11
11
  // th + th
12
12
  '[&_th_+_th]:shr-border-l-shorthand [&_th_+_th]:shr-border-[theme(backgroundColor[head-darken])]',
13
13
  // 左上の角: tr:first-child th:first-child
@@ -1 +1 @@
1
- {"version":3,"file":"SpreadsheetTable.js","sources":["../../../src/components/SpreadsheetTable/SpreadsheetTable.tsx"],"sourcesContent":["import {\n type ComponentPropsWithoutRef,\n type FC,\n type PropsWithChildren,\n type ReactNode,\n memo,\n useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { SpreadsheetTableCorner } from './SpreadsheetTableCorner'\n\ntype Props = PropsWithChildren<{\n data?: ReactNode[][]\n}>\ntype ElementProps = Omit<ComponentPropsWithoutRef<'table'>, keyof Props>\n\nconst classNameGenerator = tv({\n base: [\n 'smarthr-ui-SpreadsheetTable shr-border-shorthand shr-border-collapse shr-bg-head',\n // th\n '[&_th]:shr-p-0.25 [&_th]:shr-text-sm [&_th]:shr-font-normal [&_th]:shr-text-grey',\n // th + th\n '[&_th_+_th]:shr-border-l-shorthand [&_th_+_th]:shr-border-[theme(backgroundColor[head-darken])]',\n // 左上の角: tr:first-child th:first-child\n '[&_tr:first-child_th:first-child]:shr-w-[calc(1em_*_theme(lineHeight.normal))]',\n // tr + tr th\n '[&_tr_+_tr_th]:shr-border-t-shorthand [&_tr_+_tr_th]:shr-border-[theme(backgroundColor[head-darken])]',\n // td\n '[&_td]:shr-border-shorthand [&_td]:shr-bg-white [&_td]:shr-p-0.25 [&_td]:shr-text-sm',\n ],\n})\n\nexport const SpreadsheetTable: FC<Props & ElementProps> = ({\n data,\n className,\n children,\n ...props\n}) => {\n const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n return (\n <table {...props} className={actualClassName}>\n {data && (\n <>\n <MemoizedThead cols={data[0].length} />\n <tbody>\n {data.map((row, i) => (\n <tr key={i}>\n <th>{i + 1}</th>\n {row.map((cell, j) => (\n <td key={`${i}-${j}`}>{cell}</td>\n ))}\n </tr>\n ))}\n </tbody>\n </>\n )}\n {children}\n </table>\n )\n}\n\nconst MemoizedThead = memo<{ cols: number }>(({ cols }) => {\n const columns: ReactNode[] = []\n\n for (let i = 0; i < cols; i++) {\n columns.push(\n <th key={i}>\n {\n // アルファベットを A から自動挿入\n String.fromCharCode(65 + i)\n }\n </th>,\n )\n }\n\n return (\n <thead>\n <tr>\n <SpreadsheetTableCorner />\n {columns}\n </tr>\n </thead>\n )\n})\n"],"names":["tv","_jsxs","_Fragment","_jsx"],"mappings":";;;;;AAiBA,MAAM,kBAAkB,GAAGA,EAAE,CAAC;AAC5B,IAAA,IAAI,EAAE;QACJ,kFAAkF;;QAElF,kFAAkF;;QAElF,iGAAiG;;QAEjG,gFAAgF;;QAEhF,uGAAuG;;QAEvG,sFAAsF;AACvF,KAAA;AACF,CAAA,CAAC;AAEK,MAAM,gBAAgB,GAA6B,CAAC,EACzD,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,eAAe,GAAG,OAAO,CAAC,MAAM,kBAAkB,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAErF,IAAA,QACEC,IAAA,CAAA,OAAA,EAAA,EAAA,GAAW,KAAK,EAAE,SAAS,EAAE,eAAe,EAAA,QAAA,EAAA,CACzC,IAAI,KACHA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACEC,GAAA,CAAC,aAAa,EAAA,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,EAAA,CAAI,EACvCA,GAAA,CAAA,OAAA,EAAA,EAAA,QAAA,EACG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,MACfF,IAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAA,CACEE,GAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAK,CAAC,GAAG,CAAC,EAAA,CAAM,EACf,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,MACfA,GAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAuB,IAAI,EAAA,EAAlB,CAAA,EAAG,CAAC,CAAA,CAAA,EAAI,CAAC,CAAA,CAAE,CAAa,CAClC,CAAC,KAJK,CAAC,CAKL,CACN,CAAC,GACI,CAAA,EAAA,CACP,CACJ,EACA,QAAQ,CAAA,EAAA,CACH;AAEZ;AAEA,MAAM,aAAa,GAAG,IAAI,CAAmB,CAAC,EAAE,IAAI,EAAE,KAAI;IACxD,MAAM,OAAO,GAAgB,EAAE;AAE/B,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,CAAC,EAAE,EAAE;QAC7B,OAAO,CAAC,IAAI,CACVA,GAAA,CAAA,IAAA,EAAA,EAAA,QAAA;;YAGI,MAAM,CAAC,YAAY,CAAC,EAAE,GAAG,CAAC,CAAC,EAAA,EAHtB,CAAC,CAKL,CACN;IACH;IAEA,QACEA,GAAA,CAAA,OAAA,EAAA,EAAA,QAAA,EACEF,IAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAA,CACEE,GAAA,CAAC,sBAAsB,EAAA,EAAA,CAAG,EACzB,OAAO,CAAA,EAAA,CACL,EAAA,CACC;AAEZ,CAAC,CAAC;;;;"}
1
+ {"version":3,"file":"SpreadsheetTable.js","sources":["../../../src/components/SpreadsheetTable/SpreadsheetTable.tsx"],"sourcesContent":["import {\n type ComponentPropsWithoutRef,\n type FC,\n type PropsWithChildren,\n type ReactNode,\n memo,\n useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { SpreadsheetTableCorner } from './SpreadsheetTableCorner'\n\ntype Props = PropsWithChildren<{\n data?: ReactNode[][]\n}>\ntype ElementProps = Omit<ComponentPropsWithoutRef<'table'>, keyof Props>\n\nconst classNameGenerator = tv({\n base: [\n 'smarthr-ui-SpreadsheetTable shr-border-shorthand shr-border-collapse shr-bg-head',\n // th\n '[&_th]:shr-p-0.25 [&_th]:shr-text-sm [&_th]:shr-font-normal [&_th]:shr-text-black',\n // th + th\n '[&_th_+_th]:shr-border-l-shorthand [&_th_+_th]:shr-border-[theme(backgroundColor[head-darken])]',\n // 左上の角: tr:first-child th:first-child\n '[&_tr:first-child_th:first-child]:shr-w-[calc(1em_*_theme(lineHeight.normal))]',\n // tr + tr th\n '[&_tr_+_tr_th]:shr-border-t-shorthand [&_tr_+_tr_th]:shr-border-[theme(backgroundColor[head-darken])]',\n // td\n '[&_td]:shr-border-shorthand [&_td]:shr-bg-white [&_td]:shr-p-0.25 [&_td]:shr-text-sm',\n ],\n})\n\nexport const SpreadsheetTable: FC<Props & ElementProps> = ({\n data,\n className,\n children,\n ...props\n}) => {\n const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n return (\n <table {...props} className={actualClassName}>\n {data && (\n <>\n <MemoizedThead cols={data[0].length} />\n <tbody>\n {data.map((row, i) => (\n <tr key={i}>\n <th>{i + 1}</th>\n {row.map((cell, j) => (\n <td key={`${i}-${j}`}>{cell}</td>\n ))}\n </tr>\n ))}\n </tbody>\n </>\n )}\n {children}\n </table>\n )\n}\n\nconst MemoizedThead = memo<{ cols: number }>(({ cols }) => {\n const columns: ReactNode[] = []\n\n for (let i = 0; i < cols; i++) {\n columns.push(\n <th key={i}>\n {\n // アルファベットを A から自動挿入\n String.fromCharCode(65 + i)\n }\n </th>,\n )\n }\n\n return (\n <thead>\n <tr>\n <SpreadsheetTableCorner />\n {columns}\n </tr>\n </thead>\n )\n})\n"],"names":["tv","_jsxs","_Fragment","_jsx"],"mappings":";;;;;AAiBA,MAAM,kBAAkB,GAAGA,EAAE,CAAC;AAC5B,IAAA,IAAI,EAAE;QACJ,kFAAkF;;QAElF,mFAAmF;;QAEnF,iGAAiG;;QAEjG,gFAAgF;;QAEhF,uGAAuG;;QAEvG,sFAAsF;AACvF,KAAA;AACF,CAAA,CAAC;AAEK,MAAM,gBAAgB,GAA6B,CAAC,EACzD,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,eAAe,GAAG,OAAO,CAAC,MAAM,kBAAkB,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAErF,IAAA,QACEC,IAAA,CAAA,OAAA,EAAA,EAAA,GAAW,KAAK,EAAE,SAAS,EAAE,eAAe,EAAA,QAAA,EAAA,CACzC,IAAI,KACHA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACEC,GAAA,CAAC,aAAa,EAAA,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,EAAA,CAAI,EACvCA,GAAA,CAAA,OAAA,EAAA,EAAA,QAAA,EACG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,MACfF,IAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAA,CACEE,GAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAK,CAAC,GAAG,CAAC,EAAA,CAAM,EACf,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,MACfA,GAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAuB,IAAI,EAAA,EAAlB,CAAA,EAAG,CAAC,CAAA,CAAA,EAAI,CAAC,CAAA,CAAE,CAAa,CAClC,CAAC,KAJK,CAAC,CAKL,CACN,CAAC,GACI,CAAA,EAAA,CACP,CACJ,EACA,QAAQ,CAAA,EAAA,CACH;AAEZ;AAEA,MAAM,aAAa,GAAG,IAAI,CAAmB,CAAC,EAAE,IAAI,EAAE,KAAI;IACxD,MAAM,OAAO,GAAgB,EAAE;AAE/B,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,CAAC,EAAE,EAAE;QAC7B,OAAO,CAAC,IAAI,CACVA,GAAA,CAAA,IAAA,EAAA,EAAA,QAAA;;YAGI,MAAM,CAAC,YAAY,CAAC,EAAE,GAAG,CAAC,CAAC,EAAA,EAHtB,CAAC,CAKL,CACN;IACH;IAEA,QACEA,GAAA,CAAA,OAAA,EAAA,EAAA,QAAA,EACEF,IAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EAAA,CACEE,GAAA,CAAC,sBAAsB,EAAA,EAAA,CAAG,EACzB,OAAO,CAAA,EAAA,CACL,EAAA,CACC;AAEZ,CAAC,CAAC;;;;"}
@@ -1,10 +1,10 @@
1
1
  import { type FC, type PropsWithChildren } from 'react';
2
- import * as locales from './locales';
3
- declare const allLocaleKeys: Array<keyof typeof locales>;
4
- type Props<AvailableLocales extends Array<keyof typeof locales> = typeof allLocaleKeys> = PropsWithChildren<{
2
+ import { type Locale } from './localeMap';
3
+ declare const allLocaleKeys: Locale[];
4
+ type Props<AvailableLocales extends Locale[] = typeof allLocaleKeys> = PropsWithChildren<{
5
5
  locale: AvailableLocales[number];
6
6
  availableLocales?: AvailableLocales;
7
7
  }>;
8
8
  export declare const useAvailableLocales: () => ("pt" | "ja" | "ja-easy" | "en-us" | "ko" | "vi" | "zh-cn" | "zh-tw" | "id-id")[];
9
- export declare const IntlProvider: <AvailableLocales extends Array<keyof typeof locales> = typeof allLocaleKeys>({ availableLocales, locale, children, }: Props<AvailableLocales>) => ReturnType<FC>;
9
+ export declare const IntlProvider: <AvailableLocales extends Locale[] = typeof allLocaleKeys>({ availableLocales, locale, children, }: Props<AvailableLocales>) => ReturnType<FC>;
10
10
  export {};
@@ -2,10 +2,11 @@
2
2
  import { jsx } from 'react/jsx-runtime';
3
3
  import { createContext, useContext, useMemo } from 'react';
4
4
  import { IntlContext, IntlProvider as IntlProvider$1 } from 'react-intl';
5
+ import { localeMap } from './localeMap.js';
5
6
  import * as intl_locales_index from './locales/index.js';
6
7
 
7
8
  // Object.keys は常に string[] を返却するが、locales は実行時に変更されないため、as 型キャストを使用することは自明に安全なので使用している
8
- const allLocaleKeys = Object.keys(intl_locales_index);
9
+ const allLocaleKeys = Object.keys(localeMap);
9
10
  const AvailableLocalesContext = createContext(allLocaleKeys);
10
11
  const useAvailableLocales = () => useContext(AvailableLocalesContext);
11
12
  const IntlProvider = ({ availableLocales, locale, children, }) => {
@@ -1 +1 @@
1
- {"version":3,"file":"IntlProvider.js","sources":["../../src/intl/IntlProvider.tsx"],"sourcesContent":["'use client'\n\nimport { type FC, type PropsWithChildren, createContext, useContext, useMemo } from 'react'\nimport { IntlContext, IntlProvider as ReactIntlProvider } from 'react-intl'\n\nimport * as locales from './locales'\n\n// Object.keys は常に string[] を返却するが、locales は実行時に変更されないため、as 型キャストを使用することは自明に安全なので使用している\nconst allLocaleKeys = Object.keys(locales) as Array<keyof typeof locales>\n\ntype Props<AvailableLocales extends Array<keyof typeof locales> = typeof allLocaleKeys> =\n PropsWithChildren<{\n locale: AvailableLocales[number]\n availableLocales?: AvailableLocales\n }>\n\nconst AvailableLocalesContext = createContext<Array<keyof typeof locales>>(allLocaleKeys)\n\nexport const useAvailableLocales = () => useContext(AvailableLocalesContext)\n\nexport const IntlProvider = <\n AvailableLocales extends Array<keyof typeof locales> = typeof allLocaleKeys,\n>({\n availableLocales,\n locale,\n children,\n}: Props<AvailableLocales>): ReturnType<FC> => {\n // プロダクト側でIntlProviderを使っている場合、プロダクト側のmessagesとマージして提供するためにContextから取得している\n const intl = useContext(IntlContext)\n const actualMessages = useMemo(() => ({ ...intl?.messages, ...locales[locale] }), [intl, locale])\n\n return (\n <AvailableLocalesContext.Provider value={availableLocales ?? allLocaleKeys}>\n <ReactIntlProvider locale={locale} messages={actualMessages}>\n {children}\n </ReactIntlProvider>\n </AvailableLocalesContext.Provider>\n )\n}\n"],"names":[],"mappings":";;;;;;AAOA;AACA;AAQA;AAEO;AAEA;;AAQL;AACA;;AASF;;"}
1
+ {"version":3,"file":"IntlProvider.js","sources":["../../src/intl/IntlProvider.tsx"],"sourcesContent":["'use client'\n\nimport { type FC, type PropsWithChildren, createContext, useContext, useMemo } from 'react'\nimport { IntlContext, IntlProvider as ReactIntlProvider } from 'react-intl'\n\nimport { type Locale, localeMap } from './localeMap'\nimport * as locales from './locales'\n\n// Object.keys は常に string[] を返却するが、locales は実行時に変更されないため、as 型キャストを使用することは自明に安全なので使用している\nconst allLocaleKeys = Object.keys(localeMap) as Locale[]\n\ntype Props<AvailableLocales extends Locale[] = typeof allLocaleKeys> = PropsWithChildren<{\n locale: AvailableLocales[number]\n availableLocales?: AvailableLocales\n}>\n\nconst AvailableLocalesContext = createContext<Locale[]>(allLocaleKeys)\n\nexport const useAvailableLocales = () => useContext(AvailableLocalesContext)\n\nexport const IntlProvider = <AvailableLocales extends Locale[] = typeof allLocaleKeys>({\n availableLocales,\n locale,\n children,\n}: Props<AvailableLocales>): ReturnType<FC> => {\n // プロダクト側でIntlProviderを使っている場合、プロダクト側のmessagesとマージして提供するためにContextから取得している\n const intl = useContext(IntlContext)\n const actualMessages = useMemo(() => ({ ...intl?.messages, ...locales[locale] }), [intl, locale])\n\n return (\n <AvailableLocalesContext.Provider value={availableLocales ?? allLocaleKeys}>\n <ReactIntlProvider locale={locale} messages={actualMessages}>\n {children}\n </ReactIntlProvider>\n </AvailableLocalesContext.Provider>\n )\n}\n"],"names":[],"mappings":";;;;;;;AAQA;AACA;AAOA;AAEO;AAEA;;AAML;AACA;;AASF;;"}
@@ -0,0 +1,3 @@
1
+ import type * as locales from './locales';
2
+ export type Locale = keyof typeof locales;
3
+ export declare const localeMap: Record<Locale, string>;
@@ -1,12 +1,13 @@
1
1
  const localeMap = {
2
2
  ja: '日本語',
3
- 'id-id': 'Bahasa Indonesia',
3
+ 'ja-easy': 'やさしい日本語',
4
4
  'en-us': 'English',
5
+ ko: '한국어',
5
6
  pt: 'Português',
6
7
  vi: 'Tiếng Việt',
7
- ko: '한국어',
8
8
  'zh-cn': '简体中文',
9
9
  'zh-tw': '繁體中文',
10
+ 'id-id': 'Bahasa Indonesia',
10
11
  };
11
12
 
12
13
  export { localeMap };
@@ -0,0 +1 @@
1
+ {"version":3,"file":"localeMap.js","sources":["../../src/intl/localeMap.ts"],"sourcesContent":["import type * as locales from './locales'\n\nexport type Locale = keyof typeof locales\n\nexport const localeMap: Record<Locale, string> = {\n ja: '日本語',\n 'ja-easy': 'やさしい日本語',\n 'en-us': 'English',\n ko: '한국어',\n pt: 'Português',\n vi: 'Tiếng Việt',\n 'zh-cn': '简体中文',\n 'zh-tw': '繁體中文',\n 'id-id': 'Bahasa Indonesia',\n}\n"],"names":[],"mappings":"AAIO,MAAM,SAAS,GAA2B;AAC/C,IAAA,EAAE,EAAE,KAAK;AACT,IAAA,SAAS,EAAE,SAAS;AACpB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,EAAE,EAAE,KAAK;AACT,IAAA,EAAE,EAAE,WAAW;AACf,IAAA,EAAE,EAAE,YAAY;AAChB,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,OAAO,EAAE,kBAAkB;;;;;"}