smarthr-ui 79.1.0 → 79.2.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.
- package/esm/components/Heading/PageHeading/PageHeading.d.ts +12 -0
- package/esm/components/Heading/PageHeading/PageHeading.js +28 -4
- package/esm/components/Heading/PageHeading/PageHeading.js.map +1 -1
- package/lib/components/Heading/PageHeading/PageHeading.d.ts +12 -0
- package/lib/components/Heading/PageHeading/PageHeading.js +29 -2
- package/lib/components/Heading/PageHeading/PageHeading.js.map +1 -1
- package/package.json +2 -2
|
@@ -10,6 +10,12 @@ export type Props = PropsWithChildren<{
|
|
|
10
10
|
size?: Extract<TextProps['size'], 'XXL' | 'XL' | 'L'>;
|
|
11
11
|
/** 視覚的に非表示にするフラグ */
|
|
12
12
|
visuallyHidden?: boolean;
|
|
13
|
+
/** title要素の自動生成フラグ */
|
|
14
|
+
autoPageTitle?: boolean;
|
|
15
|
+
/** title要素のprefix */
|
|
16
|
+
pageTitle?: string;
|
|
17
|
+
/** title要素のsuffix */
|
|
18
|
+
pageTitleSuffix?: string;
|
|
13
19
|
}>;
|
|
14
20
|
export declare const PageHeading: import("react").NamedExoticComponent<{
|
|
15
21
|
/**
|
|
@@ -20,6 +26,12 @@ export declare const PageHeading: import("react").NamedExoticComponent<{
|
|
|
20
26
|
size?: Extract<TextProps["size"], "XXL" | "XL" | "L">;
|
|
21
27
|
/** 視覚的に非表示にするフラグ */
|
|
22
28
|
visuallyHidden?: boolean;
|
|
29
|
+
/** title要素の自動生成フラグ */
|
|
30
|
+
autoPageTitle?: boolean;
|
|
31
|
+
/** title要素のprefix */
|
|
32
|
+
pageTitle?: string;
|
|
33
|
+
/** title要素のsuffix */
|
|
34
|
+
pageTitleSuffix?: string;
|
|
23
35
|
} & {
|
|
24
36
|
children?: import("react").ReactNode | undefined;
|
|
25
37
|
} & ElementProps>;
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { memo, useMemo } from 'react';
|
|
3
|
+
import { memo, useMemo, useId, useEffect } from 'react';
|
|
4
|
+
import innerText from '../../../_virtual/index3.js';
|
|
4
5
|
import { tv as ce } from './../../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.18_ts-node@10.9.2_@swc_core@1.13.5_@types_node@20.19.20_typescript@5.8.3__/vendor/tailwind-variants/dist/index.js';
|
|
5
6
|
import { STYLE_TYPE_MAP, Text } from '../../Text/Text.js';
|
|
6
|
-
import { VisuallyHiddenText } from '../../VisuallyHiddenText/VisuallyHiddenText.js';
|
|
7
|
+
import { visuallyHiddenTextClassNameGenerator, VisuallyHiddenText } from '../../VisuallyHiddenText/VisuallyHiddenText.js';
|
|
7
8
|
|
|
8
9
|
const classNameGenerator = ce({
|
|
9
10
|
base: 'smarthr-ui-Heading smarthr-ui-PageHeading',
|
|
@@ -16,7 +17,8 @@ const classNameGenerator = ce({
|
|
|
16
17
|
visuallyHidden: false,
|
|
17
18
|
},
|
|
18
19
|
});
|
|
19
|
-
const
|
|
20
|
+
const PSEUDO_TITLE_CLASS_NAME = visuallyHiddenTextClassNameGenerator();
|
|
21
|
+
const PageHeading = memo(({ size, className, visuallyHidden, autoPageTitle = true, pageTitleSuffix = 'SmartHR（スマートHR）', pageTitle, children, ...props }) => {
|
|
20
22
|
const actualClassName = useMemo(() => classNameGenerator({ visuallyHidden, className }), [className, visuallyHidden]);
|
|
21
23
|
const actualTypography = useMemo(() => {
|
|
22
24
|
const defaultTypography = STYLE_TYPE_MAP.screenTitle;
|
|
@@ -25,8 +27,30 @@ const PageHeading = memo(({ size, className, visuallyHidden, ...props }) => {
|
|
|
25
27
|
}
|
|
26
28
|
return defaultTypography;
|
|
27
29
|
}, [size]);
|
|
30
|
+
const pseudoTitleId = useId();
|
|
31
|
+
const titleText = useMemo(() => (autoPageTitle ? `${pageTitle || innerText(children)}｜${pageTitleSuffix}` : ''), [children, pageTitle, pageTitleSuffix, autoPageTitle]);
|
|
32
|
+
useEffect(() => {
|
|
33
|
+
if (titleText) {
|
|
34
|
+
// HINT: SPAで遷移する場合などの対策としてbody直下にaria-liveを仕込む
|
|
35
|
+
// head内はスクリーンリーダーの変更検知のチェック対象外のため、title要素にaria-liveは設定しない
|
|
36
|
+
const pseudoTitle = (document.getElementById(pseudoTitleId) ||
|
|
37
|
+
document.createElement('div'));
|
|
38
|
+
pseudoTitle.setAttribute('id', pseudoTitleId);
|
|
39
|
+
pseudoTitle.setAttribute('class', PSEUDO_TITLE_CLASS_NAME);
|
|
40
|
+
pseudoTitle.setAttribute('aria-live', 'polite');
|
|
41
|
+
document.body.prepend(pseudoTitle);
|
|
42
|
+
document.title = titleText;
|
|
43
|
+
requestAnimationFrame(() => {
|
|
44
|
+
pseudoTitle.innerText = titleText;
|
|
45
|
+
});
|
|
46
|
+
return () => {
|
|
47
|
+
pseudoTitle.remove();
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
return undefined;
|
|
51
|
+
}, [titleText, pseudoTitleId]);
|
|
28
52
|
const Component = visuallyHidden ? VisuallyHiddenText : Text;
|
|
29
|
-
return jsx(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName });
|
|
53
|
+
return (jsx(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName, children: children }));
|
|
30
54
|
});
|
|
31
55
|
|
|
32
56
|
export { PageHeading };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageHeading.js","sources":["../../../../src/components/Heading/PageHeading/PageHeading.tsx"],"sourcesContent":["'use client'\n\nimport { type PropsWithChildren, memo, useMemo } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { STYLE_TYPE_MAP, Text, type TextProps } from '../../Text'\nimport { VisuallyHiddenText } from '../../VisuallyHiddenText'\n\nimport type { ElementProps } from '../Heading'\n\nexport type Props = PropsWithChildren<{\n /**\n * テキストのサイズ\n *\n * @default 'XL'\n */\n size?: Extract<TextProps['size'], 'XXL' | 'XL' | 'L'>\n
|
|
1
|
+
{"version":3,"file":"PageHeading.js","sources":["../../../../src/components/Heading/PageHeading/PageHeading.tsx"],"sourcesContent":["'use client'\n\nimport { type PropsWithChildren, memo, useEffect, useId, useMemo } from 'react'\nimport innerText from 'react-innertext'\nimport { tv } from 'tailwind-variants'\n\nimport { STYLE_TYPE_MAP, Text, type TextProps } from '../../Text'\nimport { VisuallyHiddenText, visuallyHiddenTextClassNameGenerator } from '../../VisuallyHiddenText'\n\nimport type { ElementProps } from '../Heading'\n\nexport type Props = PropsWithChildren<{\n /**\n * テキストのサイズ\n *\n * @default 'XL'\n */\n size?: Extract<TextProps['size'], 'XXL' | 'XL' | 'L'>\n /** 視覚的に非表示にするフラグ */\n visuallyHidden?: boolean\n /** title要素の自動生成フラグ */\n autoPageTitle?: boolean\n /** title要素のprefix */\n pageTitle?: string\n /** title要素のsuffix */\n pageTitleSuffix?: string\n}>\n\nconst classNameGenerator = tv({\n base: 'smarthr-ui-Heading smarthr-ui-PageHeading',\n variants: {\n visuallyHidden: {\n false: 'shr-m-[unset]',\n },\n },\n defaultVariants: {\n visuallyHidden: false,\n },\n})\n\nconst PSEUDO_TITLE_CLASS_NAME = visuallyHiddenTextClassNameGenerator()\n\nexport const PageHeading = memo<Props & ElementProps>(\n ({\n size,\n className,\n visuallyHidden,\n autoPageTitle = true,\n pageTitleSuffix = 'SmartHR（スマートHR）',\n pageTitle,\n children,\n ...props\n }) => {\n const actualClassName = useMemo(\n () => classNameGenerator({ visuallyHidden, className }),\n [className, visuallyHidden],\n )\n const actualTypography = useMemo(() => {\n const defaultTypography = STYLE_TYPE_MAP.screenTitle\n\n if (size) {\n return { ...defaultTypography, size }\n }\n\n return defaultTypography\n }, [size])\n\n const pseudoTitleId = useId()\n const titleText = useMemo(\n () => (autoPageTitle ? `${pageTitle || innerText(children)}｜${pageTitleSuffix}` : ''),\n [children, pageTitle, pageTitleSuffix, autoPageTitle],\n )\n\n useEffect(() => {\n if (titleText) {\n // HINT: SPAで遷移する場合などの対策としてbody直下にaria-liveを仕込む\n // head内はスクリーンリーダーの変更検知のチェック対象外のため、title要素にaria-liveは設定しない\n const pseudoTitle: HTMLDivElement = (document.getElementById(pseudoTitleId) ||\n document.createElement('div')) as HTMLDivElement\n\n pseudoTitle.setAttribute('id', pseudoTitleId)\n pseudoTitle.setAttribute('class', PSEUDO_TITLE_CLASS_NAME)\n pseudoTitle.setAttribute('aria-live', 'polite')\n document.body.prepend(pseudoTitle)\n\n document.title = titleText\n requestAnimationFrame(() => {\n pseudoTitle.innerText = titleText\n })\n\n return () => {\n pseudoTitle.remove()\n }\n }\n\n return undefined\n }, [titleText, pseudoTitleId])\n\n const Component = visuallyHidden ? VisuallyHiddenText : Text\n\n return (\n <Component {...props} {...actualTypography} as=\"h1\" className={actualClassName}>\n {children}\n </Component>\n )\n },\n)\n"],"names":[],"mappings":";;;;;;;;AA4BA;AACE;AACA;AACE;AACE;AACD;AACF;AACD;AACE;AACD;AACF;AAED;AAEO;;AAeH;AACE;;AAGE;;AAGF;AACF;AAEA;AACA;;;;;;AAUM;AAEF;AACA;AACA;AACA;AAEA;;AAEE;AACF;AAEA;;AAEA;;AAGF;AACF;;AAIA;AAKF;;"}
|
|
@@ -10,6 +10,12 @@ export type Props = PropsWithChildren<{
|
|
|
10
10
|
size?: Extract<TextProps['size'], 'XXL' | 'XL' | 'L'>;
|
|
11
11
|
/** 視覚的に非表示にするフラグ */
|
|
12
12
|
visuallyHidden?: boolean;
|
|
13
|
+
/** title要素の自動生成フラグ */
|
|
14
|
+
autoPageTitle?: boolean;
|
|
15
|
+
/** title要素のprefix */
|
|
16
|
+
pageTitle?: string;
|
|
17
|
+
/** title要素のsuffix */
|
|
18
|
+
pageTitleSuffix?: string;
|
|
13
19
|
}>;
|
|
14
20
|
export declare const PageHeading: import("react").NamedExoticComponent<{
|
|
15
21
|
/**
|
|
@@ -20,6 +26,12 @@ export declare const PageHeading: import("react").NamedExoticComponent<{
|
|
|
20
26
|
size?: Extract<TextProps["size"], "XXL" | "XL" | "L">;
|
|
21
27
|
/** 視覚的に非表示にするフラグ */
|
|
22
28
|
visuallyHidden?: boolean;
|
|
29
|
+
/** title要素の自動生成フラグ */
|
|
30
|
+
autoPageTitle?: boolean;
|
|
31
|
+
/** title要素のprefix */
|
|
32
|
+
pageTitle?: string;
|
|
33
|
+
/** title要素のsuffix */
|
|
34
|
+
pageTitleSuffix?: string;
|
|
23
35
|
} & {
|
|
24
36
|
children?: import("react").ReactNode | undefined;
|
|
25
37
|
} & ElementProps>;
|
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
'use client';
|
|
3
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
4
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
5
|
+
};
|
|
3
6
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
7
|
exports.PageHeading = void 0;
|
|
5
8
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
9
|
const react_1 = require("react");
|
|
10
|
+
const react_innertext_1 = __importDefault(require("react-innertext"));
|
|
7
11
|
const tailwind_variants_1 = require("tailwind-variants");
|
|
8
12
|
const Text_1 = require("../../Text");
|
|
9
13
|
const VisuallyHiddenText_1 = require("../../VisuallyHiddenText");
|
|
@@ -18,7 +22,8 @@ const classNameGenerator = (0, tailwind_variants_1.tv)({
|
|
|
18
22
|
visuallyHidden: false,
|
|
19
23
|
},
|
|
20
24
|
});
|
|
21
|
-
|
|
25
|
+
const PSEUDO_TITLE_CLASS_NAME = (0, VisuallyHiddenText_1.visuallyHiddenTextClassNameGenerator)();
|
|
26
|
+
exports.PageHeading = (0, react_1.memo)(({ size, className, visuallyHidden, autoPageTitle = true, pageTitleSuffix = 'SmartHR（スマートHR）', pageTitle, children, ...props }) => {
|
|
22
27
|
const actualClassName = (0, react_1.useMemo)(() => classNameGenerator({ visuallyHidden, className }), [className, visuallyHidden]);
|
|
23
28
|
const actualTypography = (0, react_1.useMemo)(() => {
|
|
24
29
|
const defaultTypography = Text_1.STYLE_TYPE_MAP.screenTitle;
|
|
@@ -27,7 +32,29 @@ exports.PageHeading = (0, react_1.memo)(({ size, className, visuallyHidden, ...p
|
|
|
27
32
|
}
|
|
28
33
|
return defaultTypography;
|
|
29
34
|
}, [size]);
|
|
35
|
+
const pseudoTitleId = (0, react_1.useId)();
|
|
36
|
+
const titleText = (0, react_1.useMemo)(() => (autoPageTitle ? `${pageTitle || (0, react_innertext_1.default)(children)}｜${pageTitleSuffix}` : ''), [children, pageTitle, pageTitleSuffix, autoPageTitle]);
|
|
37
|
+
(0, react_1.useEffect)(() => {
|
|
38
|
+
if (titleText) {
|
|
39
|
+
// HINT: SPAで遷移する場合などの対策としてbody直下にaria-liveを仕込む
|
|
40
|
+
// head内はスクリーンリーダーの変更検知のチェック対象外のため、title要素にaria-liveは設定しない
|
|
41
|
+
const pseudoTitle = (document.getElementById(pseudoTitleId) ||
|
|
42
|
+
document.createElement('div'));
|
|
43
|
+
pseudoTitle.setAttribute('id', pseudoTitleId);
|
|
44
|
+
pseudoTitle.setAttribute('class', PSEUDO_TITLE_CLASS_NAME);
|
|
45
|
+
pseudoTitle.setAttribute('aria-live', 'polite');
|
|
46
|
+
document.body.prepend(pseudoTitle);
|
|
47
|
+
document.title = titleText;
|
|
48
|
+
requestAnimationFrame(() => {
|
|
49
|
+
pseudoTitle.innerText = titleText;
|
|
50
|
+
});
|
|
51
|
+
return () => {
|
|
52
|
+
pseudoTitle.remove();
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
return undefined;
|
|
56
|
+
}, [titleText, pseudoTitleId]);
|
|
30
57
|
const Component = visuallyHidden ? VisuallyHiddenText_1.VisuallyHiddenText : Text_1.Text;
|
|
31
|
-
return (0, jsx_runtime_1.jsx)(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName });
|
|
58
|
+
return ((0, jsx_runtime_1.jsx)(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName, children: children }));
|
|
32
59
|
});
|
|
33
60
|
//# sourceMappingURL=PageHeading.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageHeading.js","sourceRoot":"","sources":["../../../../src/components/Heading/PageHeading/PageHeading.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA
|
|
1
|
+
{"version":3,"file":"PageHeading.js","sourceRoot":"","sources":["../../../../src/components/Heading/PageHeading/PageHeading.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;;;;AAEZ,iCAA+E;AAC/E,sEAAuC;AACvC,yDAAsC;AAEtC,qCAAiE;AACjE,iEAAmG;AAqBnG,MAAM,kBAAkB,GAAG,IAAA,sBAAE,EAAC;IAC5B,IAAI,EAAE,2CAA2C;IACjD,QAAQ,EAAE;QACR,cAAc,EAAE;YACd,KAAK,EAAE,eAAe;SACvB;KACF;IACD,eAAe,EAAE;QACf,cAAc,EAAE,KAAK;KACtB;CACF,CAAC,CAAA;AAEF,MAAM,uBAAuB,GAAG,IAAA,yDAAoC,GAAE,CAAA;AAEzD,QAAA,WAAW,GAAG,IAAA,YAAI,EAC7B,CAAC,EACC,IAAI,EACJ,SAAS,EACT,cAAc,EACd,aAAa,GAAG,IAAI,EACpB,eAAe,GAAG,iBAAiB,EACnC,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,IAAA,eAAO,EAC7B,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,cAAc,EAAE,SAAS,EAAE,CAAC,EACvD,CAAC,SAAS,EAAE,cAAc,CAAC,CAC5B,CAAA;IACD,MAAM,gBAAgB,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACpC,MAAM,iBAAiB,GAAG,qBAAc,CAAC,WAAW,CAAA;QAEpD,IAAI,IAAI,EAAE,CAAC;YACT,OAAO,EAAE,GAAG,iBAAiB,EAAE,IAAI,EAAE,CAAA;QACvC,CAAC;QAED,OAAO,iBAAiB,CAAA;IAC1B,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IAEV,MAAM,aAAa,GAAG,IAAA,aAAK,GAAE,CAAA;IAC7B,MAAM,SAAS,GAAG,IAAA,eAAO,EACvB,GAAG,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,SAAS,IAAI,IAAA,yBAAS,EAAC,QAAQ,CAAC,IAAI,eAAe,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACrF,CAAC,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,aAAa,CAAC,CACtD,CAAA;IAED,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE,CAAC;YACd,+CAA+C;YAC/C,0DAA0D;YAC1D,MAAM,WAAW,GAAmB,CAAC,QAAQ,CAAC,cAAc,CAAC,aAAa,CAAC;gBACzE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAmB,CAAA;YAElD,WAAW,CAAC,YAAY,CAAC,IAAI,EAAE,aAAa,CAAC,CAAA;YAC7C,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,uBAAuB,CAAC,CAAA;YAC1D,WAAW,CAAC,YAAY,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA;YAC/C,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAA;YAElC,QAAQ,CAAC,KAAK,GAAG,SAAS,CAAA;YAC1B,qBAAqB,CAAC,GAAG,EAAE;gBACzB,WAAW,CAAC,SAAS,GAAG,SAAS,CAAA;YACnC,CAAC,CAAC,CAAA;YAEF,OAAO,GAAG,EAAE;gBACV,WAAW,CAAC,MAAM,EAAE,CAAA;YACtB,CAAC,CAAA;QACH,CAAC;QAED,OAAO,SAAS,CAAA;IAClB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC,CAAA;IAE9B,MAAM,SAAS,GAAG,cAAc,CAAC,CAAC,CAAC,uCAAkB,CAAC,CAAC,CAAC,WAAI,CAAA;IAE5D,OAAO,CACL,uBAAC,SAAS,OAAK,KAAK,KAAM,gBAAgB,EAAE,EAAE,EAAC,IAAI,EAAC,SAAS,EAAE,eAAe,YAC3E,QAAQ,GACC,CACb,CAAA;AACH,CAAC,CACF,CAAA","sourcesContent":["'use client'\n\nimport { type PropsWithChildren, memo, useEffect, useId, useMemo } from 'react'\nimport innerText from 'react-innertext'\nimport { tv } from 'tailwind-variants'\n\nimport { STYLE_TYPE_MAP, Text, type TextProps } from '../../Text'\nimport { VisuallyHiddenText, visuallyHiddenTextClassNameGenerator } from '../../VisuallyHiddenText'\n\nimport type { ElementProps } from '../Heading'\n\nexport type Props = PropsWithChildren<{\n /**\n * テキストのサイズ\n *\n * @default 'XL'\n */\n size?: Extract<TextProps['size'], 'XXL' | 'XL' | 'L'>\n /** 視覚的に非表示にするフラグ */\n visuallyHidden?: boolean\n /** title要素の自動生成フラグ */\n autoPageTitle?: boolean\n /** title要素のprefix */\n pageTitle?: string\n /** title要素のsuffix */\n pageTitleSuffix?: string\n}>\n\nconst classNameGenerator = tv({\n base: 'smarthr-ui-Heading smarthr-ui-PageHeading',\n variants: {\n visuallyHidden: {\n false: 'shr-m-[unset]',\n },\n },\n defaultVariants: {\n visuallyHidden: false,\n },\n})\n\nconst PSEUDO_TITLE_CLASS_NAME = visuallyHiddenTextClassNameGenerator()\n\nexport const PageHeading = memo<Props & ElementProps>(\n ({\n size,\n className,\n visuallyHidden,\n autoPageTitle = true,\n pageTitleSuffix = 'SmartHR（スマートHR）',\n pageTitle,\n children,\n ...props\n }) => {\n const actualClassName = useMemo(\n () => classNameGenerator({ visuallyHidden, className }),\n [className, visuallyHidden],\n )\n const actualTypography = useMemo(() => {\n const defaultTypography = STYLE_TYPE_MAP.screenTitle\n\n if (size) {\n return { ...defaultTypography, size }\n }\n\n return defaultTypography\n }, [size])\n\n const pseudoTitleId = useId()\n const titleText = useMemo(\n () => (autoPageTitle ? `${pageTitle || innerText(children)}｜${pageTitleSuffix}` : ''),\n [children, pageTitle, pageTitleSuffix, autoPageTitle],\n )\n\n useEffect(() => {\n if (titleText) {\n // HINT: SPAで遷移する場合などの対策としてbody直下にaria-liveを仕込む\n // head内はスクリーンリーダーの変更検知のチェック対象外のため、title要素にaria-liveは設定しない\n const pseudoTitle: HTMLDivElement = (document.getElementById(pseudoTitleId) ||\n document.createElement('div')) as HTMLDivElement\n\n pseudoTitle.setAttribute('id', pseudoTitleId)\n pseudoTitle.setAttribute('class', PSEUDO_TITLE_CLASS_NAME)\n pseudoTitle.setAttribute('aria-live', 'polite')\n document.body.prepend(pseudoTitle)\n\n document.title = titleText\n requestAnimationFrame(() => {\n pseudoTitle.innerText = titleText\n })\n\n return () => {\n pseudoTitle.remove()\n }\n }\n\n return undefined\n }, [titleText, pseudoTitleId])\n\n const Component = visuallyHidden ? VisuallyHiddenText : Text\n\n return (\n <Component {...props} {...actualTypography} as=\"h1\" className={actualClassName}>\n {children}\n </Component>\n )\n },\n)\n"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "smarthr-ui",
|
|
3
3
|
"description": "SmartHR ui components built with React.",
|
|
4
|
-
"version": "79.
|
|
4
|
+
"version": "79.2.0",
|
|
5
5
|
"author": "SmartHR-UI Team",
|
|
6
6
|
"dependencies": {
|
|
7
7
|
"@smarthr/wareki": "^1.3.0",
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"react-transition-group": "^4.4.5",
|
|
19
19
|
"tailwind-variants": "^0.3.1",
|
|
20
20
|
"tailwindcss": "^3.4.18",
|
|
21
|
-
"typescript-eslint": "^8.46.
|
|
21
|
+
"typescript-eslint": "^8.46.2"
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
24
|
"@babel/core": "^7.28.4",
|