smarthr-ui 79.0.0 → 79.2.0

package/esm/components/Button/AnchorButton.js

@@ -12,7 +12,8 @@ const classNameGenerator = ce({
 const AnchorButton = forwardRef(({ size = 'default', prefix, suffix, wide = false, variant = 'secondary', inactiveReason, target, rel, elementAs, className, children, ...props }, ref) => {
     const actualClassName = useMemo(() => classNameGenerator({ className }), [className]);
     const actualSuffix = useMemo(() => {
-        if (target === '_blank' && !prefix && !suffix) {
+        // target="_blank" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている
+        if (target === '_blank' && !prefix && suffix === undefined) {
             return jsx(OpenInNewTabIcon, {});
         }
         return suffix;

package/esm/components/Button/AnchorButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnchorButton.js","sources":["../../../src/components/Button/AnchorButton.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type PropsWithoutRef,\n  type ReactElement,\n  type Ref,\n  forwardRef,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport { ButtonWrapper } from './ButtonWrapper'\nimport { DisabledReason } from './DisabledReason'\n\nimport type { BaseProps } from './types'\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  keyof Props<T> & ElementRefProps<T>\n>\n\ntype Props<T extends ElementType> = Omit<BaseProps, 'variant' | 'disabledReason'> & {\n  /** next/linkなどのカスタムコンポーネントを指定します。指定がない場合はデフォルトで `a` タグが使用されます。 */\n  elementAs?: T\n  // tertiaryはAnchorButtonでは使用不可\n  variant?: Exclude<BaseProps['variant'], 'tertiary'>\n  inactiveReason?: BaseProps['disabledReason']\n}\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AnchorButton',\n})\n\nconst AnchorButton = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      size = 'default',\n      prefix,\n      suffix,\n      wide = false,\n      variant = 'secondary',\n      inactiveReason,\n      target,\n      rel,\n      elementAs,\n      className,\n      children,\n      ...props\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ): ReactElement => {\n    const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n    const actualSuffix = useMemo(() => {\n      if (target === '_blank' && !prefix && !suffix) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n\n    const button = (\n      <ButtonWrapper\n        {...props}\n        size={size}\n        wide={wide}\n        variant={variant}\n        className={actualClassName}\n        target={target}\n        rel={rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel}\n        isAnchor\n        anchorRef={ref}\n        elementAs={elementAs}\n        prefix={prefix}\n        suffix={actualSuffix}\n      >\n        {children}\n      </ButtonWrapper>\n    )\n\n    if (!props.href && inactiveReason) {\n      return <DisabledReason button={button} disabledReason={inactiveReason} />\n    }\n\n    return button\n  },\n)\n\n// 型キャストなしで ForwardRefExoticComponent に合わせた型をエクスポートするための処理\ntype AnchorButtonType = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst ForwardedAnchorButton = AnchorButton as unknown as AnchorButtonType & {\n  displayName: string\n}\n\n// BottomFixedArea での判定に用いるために displayName を明示的に設定する\nForwardedAnchorButton.displayName = 'AnchorButton'\n\nexport { ForwardedAnchorButton as AnchorButton }\n"],"names":[],"mappings":";;;;;;;;AAmCA;AACE;AACD;AAED;AAkBI;AAEA;;;;AAKE;;AAGF;AAmBA;;;AAIA;AACF;AAQF;AAIA;AACA;;"}
+{"version":3,"file":"AnchorButton.js","sources":["../../../src/components/Button/AnchorButton.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type PropsWithoutRef,\n  type ReactElement,\n  type Ref,\n  forwardRef,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport { ButtonWrapper } from './ButtonWrapper'\nimport { DisabledReason } from './DisabledReason'\n\nimport type { BaseProps } from './types'\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  keyof Props<T> & ElementRefProps<T>\n>\n\ntype Props<T extends ElementType> = Omit<BaseProps, 'variant' | 'disabledReason'> & {\n  /** next/linkなどのカスタムコンポーネントを指定します。指定がない場合はデフォルトで `a` タグが使用されます。 */\n  elementAs?: T\n  // tertiaryはAnchorButtonでは使用不可\n  variant?: Exclude<BaseProps['variant'], 'tertiary'>\n  inactiveReason?: BaseProps['disabledReason']\n}\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AnchorButton',\n})\n\nconst AnchorButton = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      size = 'default',\n      prefix,\n      suffix,\n      wide = false,\n      variant = 'secondary',\n      inactiveReason,\n      target,\n      rel,\n      elementAs,\n      className,\n      children,\n      ...props\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ): ReactElement => {\n    const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n    const actualSuffix = useMemo(() => {\n      // target=\"_blank\" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている\n      if (target === '_blank' && !prefix && suffix === undefined) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n\n    const button = (\n      <ButtonWrapper\n        {...props}\n        size={size}\n        wide={wide}\n        variant={variant}\n        className={actualClassName}\n        target={target}\n        rel={rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel}\n        isAnchor\n        anchorRef={ref}\n        elementAs={elementAs}\n        prefix={prefix}\n        suffix={actualSuffix}\n      >\n        {children}\n      </ButtonWrapper>\n    )\n\n    if (!props.href && inactiveReason) {\n      return <DisabledReason button={button} disabledReason={inactiveReason} />\n    }\n\n    return button\n  },\n)\n\n// 型キャストなしで ForwardRefExoticComponent に合わせた型をエクスポートするための処理\ntype AnchorButtonType = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst ForwardedAnchorButton = AnchorButton as unknown as AnchorButtonType & {\n  displayName: string\n}\n\n// BottomFixedArea での判定に用いるために displayName を明示的に設定する\nForwardedAnchorButton.displayName = 'AnchorButton'\n\nexport { ForwardedAnchorButton as AnchorButton }\n"],"names":[],"mappings":";;;;;;;;AAmCA;AACE;AACD;AAED;AAkBI;AAEA;;;;;AAME;;AAGF;AAmBA;;;AAIA;AACF;AAQF;AAIA;AACA;;"}

package/esm/components/Heading/PageHeading/PageHeading.d.ts

@@ -10,6 +10,12 @@ export type Props = PropsWithChildren<{
     size?: Extract<TextProps['size'], 'XXL' | 'XL' | 'L'>;
     /** 視覚的に非表示にするフラグ */
     visuallyHidden?: boolean;
+    /** title要素の自動生成フラグ */
+    autoPageTitle?: boolean;
+    /** title要素のprefix */
+    pageTitle?: string;
+    /** title要素のsuffix */
+    pageTitleSuffix?: string;
 }>;
 export declare const PageHeading: import("react").NamedExoticComponent<{
     /**
@@ -20,6 +26,12 @@ export declare const PageHeading: import("react").NamedExoticComponent<{
     size?: Extract<TextProps["size"], "XXL" | "XL" | "L">;
     /** 視覚的に非表示にするフラグ */
     visuallyHidden?: boolean;
+    /** title要素の自動生成フラグ */
+    autoPageTitle?: boolean;
+    /** title要素のprefix */
+    pageTitle?: string;
+    /** title要素のsuffix */
+    pageTitleSuffix?: string;
 } & {
     children?: import("react").ReactNode | undefined;
 } & ElementProps>;

package/esm/components/Heading/PageHeading/PageHeading.js

@@ -1,9 +1,10 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { memo, useMemo } from 'react';
+import { memo, useMemo, useId, useEffect } from 'react';
+import innerText from '../../../_virtual/index3.js';
 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';
 import { STYLE_TYPE_MAP, Text } from '../../Text/Text.js';
-import { VisuallyHiddenText } from '../../VisuallyHiddenText/VisuallyHiddenText.js';
+import { visuallyHiddenTextClassNameGenerator, VisuallyHiddenText } from '../../VisuallyHiddenText/VisuallyHiddenText.js';
 
 const classNameGenerator = ce({
     base: 'smarthr-ui-Heading smarthr-ui-PageHeading',
@@ -16,7 +17,8 @@ const classNameGenerator = ce({
         visuallyHidden: false,
     },
 });
-const PageHeading = memo(({ size, className, visuallyHidden, ...props }) => {
+const PSEUDO_TITLE_CLASS_NAME = visuallyHiddenTextClassNameGenerator();
+const PageHeading = memo(({ size, className, visuallyHidden, autoPageTitle = true, pageTitleSuffix = 'SmartHR（スマートHR）', pageTitle, children, ...props }) => {
     const actualClassName = useMemo(() => classNameGenerator({ visuallyHidden, className }), [className, visuallyHidden]);
     const actualTypography = useMemo(() => {
         const defaultTypography = STYLE_TYPE_MAP.screenTitle;
@@ -25,8 +27,30 @@ const PageHeading = memo(({ size, className, visuallyHidden, ...props }) => {
         }
         return defaultTypography;
     }, [size]);
+    const pseudoTitleId = useId();
+    const titleText = useMemo(() => (autoPageTitle ? `${pageTitle || innerText(children)}｜${pageTitleSuffix}` : ''), [children, pageTitle, pageTitleSuffix, autoPageTitle]);
+    useEffect(() => {
+        if (titleText) {
+            // HINT: SPAで遷移する場合などの対策としてbody直下にaria-liveを仕込む
+            // head内はスクリーンリーダーの変更検知のチェック対象外のため、title要素にaria-liveは設定しない
+            const pseudoTitle = (document.getElementById(pseudoTitleId) ||
+                document.createElement('div'));
+            pseudoTitle.setAttribute('id', pseudoTitleId);
+            pseudoTitle.setAttribute('class', PSEUDO_TITLE_CLASS_NAME);
+            pseudoTitle.setAttribute('aria-live', 'polite');
+            document.body.prepend(pseudoTitle);
+            document.title = titleText;
+            requestAnimationFrame(() => {
+                pseudoTitle.innerText = titleText;
+            });
+            return () => {
+                pseudoTitle.remove();
+            };
+        }
+        return undefined;
+    }, [titleText, pseudoTitleId]);
     const Component = visuallyHidden ? VisuallyHiddenText : Text;
-    return jsx(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName });
+    return (jsx(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName, children: children }));
 });
 
 export { PageHeading };

package/esm/components/Heading/PageHeading/PageHeading.js.map

@@ -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\n  /** 視覚的に非表示にするフラグ */\n  visuallyHidden?: boolean\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\nexport const PageHeading = memo<Props & ElementProps>(\n  ({ size, className, visuallyHidden, ...props }) => {\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    const Component = visuallyHidden ? VisuallyHiddenText : Text\n\n    return <Component {...props} {...actualTypography} as=\"h1\" className={actualClassName} />\n  },\n)\n"],"names":[],"mappings":";;;;;;;AAsBA;AACE;AACA;AACE;AACE;AACD;AACF;AACD;AACE;AACD;AACF;AAEM;;AAMH;AACE;;AAGE;;AAGF;AACF;;AAGA;AACF;;"}
+{"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;;"}

package/esm/components/NotificationBar/NotificationBar.d.ts

@@ -257,7 +257,7 @@ declare const classNameGenerator: import("tailwind-variants").TVReturnType<{
 type StyleVariants = VariantProps<typeof classNameGenerator>;
 type Props = PropsWithChildren<Omit<StyleVariants, 'type'> & Required<Pick<StyleVariants, 'type'>> & {
     /** コンポーネント右の領域 */
-    subActionArea: ReactNode;
+    subActionArea?: ReactNode;
     /** 閉じるボタン押下時に発火させる関数 */
     onClose?: () => void;
     /** role 属性 */

package/esm/components/NotificationBar/NotificationBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationBar.js","sources":["../../../src/components/NotificationBar/NotificationBar.tsx"],"sourcesContent":["import {\n  type ComponentProps,\n  type ComponentPropsWithoutRef,\n  type FC,\n  Fragment,\n  type PropsWithChildren,\n  type ReactNode,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { Localizer } from '../../intl'\nimport { Base } from '../Base'\nimport { Button } from '../Button'\nimport {\n  FaCircleCheckIcon,\n  FaCircleExclamationIcon,\n  FaCircleInfoIcon,\n  FaRotateIcon,\n  FaTriangleExclamationIcon,\n  FaXmarkIcon,\n  WarningIcon,\n} from '../Icon'\nimport { Cluster } from '../Layout'\nimport { Text } from '../Text'\n\nconst classNameGenerator = tv({\n  slots: {\n    wrapper:\n      'smarthr-ui-NotificationBar shr-flex shr-items-baseline shr-justify-between shr-gap-0.5 shr-p-0.75',\n    inner: 'shr-flex-grow',\n    messageArea: [\n      'smarthr-ui-NotificationBar-messageArea',\n      'shr-flex shr-grow',\n      '[&_.smarthr-ui-Icon-withText]:shr-leading-tight',\n    ],\n    icon: '',\n    actionArea: 'smarthr-ui-NotificationBar-actionArea -shr-my-0.5 shr-shrink-0',\n    closeButton:\n      'smarthr-ui-NotificationBar-closeButton -shr-mb-0.5 -shr-mr-0.5 -shr-mt-0.5 shr-flex-shrink-0 shr-text-black',\n  },\n  variants: {\n    /** 下地 */\n    base: {\n      none: {},\n      base: {\n        wrapper: 'shr-py-1 shr-pe-1 shr-ps-1.5',\n      },\n    },\n    /** メッセージの種類 */\n    type: {\n      info: {\n        icon: 'shr-text-grey',\n      },\n      success: {},\n      warning: {\n        icon: 'shr-text-black',\n      },\n      error: {},\n      sync: {\n        icon: 'shr-text-main',\n      },\n    },\n    /** 強調するかどうか */\n    bold: {\n      true: '',\n      false: '',\n    },\n    /** スライドインするかどうか */\n    animate: {\n      true: {\n        wrapper: 'shr-animate-[notification-bar-slide-in_0.2s_ease-out]',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      type: ['info', 'success', 'warning', 'error', 'sync'],\n      bold: false,\n      className: {\n        wrapper: 'shr-bg-white shr-text-black',\n      },\n    },\n    {\n      type: 'success',\n      bold: false,\n      className: {\n        icon: 'shr-text-main',\n      },\n    },\n    {\n      type: 'error',\n      bold: false,\n      className: {\n        icon: 'shr-text-danger',\n      },\n    },\n    {\n      type: ['info', 'sync'],\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-white',\n      },\n    },\n    {\n      type: 'success',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-main shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-main-darken focus-visible:[&]:shr-bg-main-darken',\n      },\n    },\n    {\n      type: 'warning',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-warning-yellow shr-text-black',\n        closeButton:\n          'shr-text-black hover:[&]:shr-bg-warning-yellow-darken focus-visible:[&]:shr-bg-warning-yellow-darken',\n      },\n    },\n    {\n      type: 'error',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-danger shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-danger-darken focus-visible:[&]:shr-bg-danger-darken',\n      },\n    },\n  ],\n})\n\ntype StyleVariants = VariantProps<typeof classNameGenerator>\ntype Props = PropsWithChildren<\n  Omit<StyleVariants, 'type'> &\n    Required<Pick<StyleVariants, 'type'>> & {\n      /** コンポーネント右の領域 */\n      subActionArea: ReactNode\n      /** 閉じるボタン押下時に発火させる関数 */\n      onClose?: () => void\n      /** role 属性 */\n      role?: 'alert' | 'status'\n    }\n>\ntype ElementProps = Omit<ComponentPropsWithoutRef<'div'>, keyof Props>\ntype BaseProps = Pick<ComponentProps<typeof Base>, 'layer'>\ntype ActualProps = Props & ElementProps & BaseProps\n\nconst ABSTRACT_ICON_MAPPER = {\n  info: FaCircleInfoIcon,\n  success: FaCircleCheckIcon,\n  error: FaCircleExclamationIcon,\n  sync: FaRotateIcon,\n}\nconst ICON_MAPPER = {\n  normal: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: WarningIcon,\n  },\n  bold: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: FaTriangleExclamationIcon,\n  },\n} as const\n\nconst ROLE_STATUS_TYPE_REGEX = /^(info|sync)$/\n\nexport const NotificationBar: FC<ActualProps> = ({\n  type,\n  bold,\n  animate,\n  subActionArea,\n  onClose,\n  children,\n  role,\n  base,\n  layer,\n  className,\n  ...props\n}) => {\n  const actualRole = useMemo(() => {\n    if (role) {\n      return role\n    }\n\n    return ROLE_STATUS_TYPE_REGEX.test(type) ? 'status' : 'alert'\n  }, [role, type])\n  const { WrapBase, baseProps } = useMemo(\n    () =>\n      base === 'base'\n        ? {\n            WrapBase: Base,\n            baseProps: {\n              layer,\n              overflow: 'hidden' as ComponentProps<typeof Base>['overflow'],\n            },\n          }\n        : {\n            WrapBase: Fragment,\n            baseProps: {},\n          },\n    [base, layer],\n  )\n  const classNames = useMemo(() => {\n    const { wrapper, inner, messageArea, icon, actionArea, closeButton } = classNameGenerator({\n      type,\n      bold: !!bold,\n      base: base || 'none',\n    })\n\n    return {\n      wrapper: wrapper({ animate, className }),\n      inner: inner(),\n      messageArea: messageArea(),\n      icon: icon(),\n      actionArea: actionArea(),\n      closeButton: closeButton(),\n    }\n  }, [animate, base, bold, type, className])\n\n  return (\n    <WrapBase {...baseProps}>\n      <div {...props} className={classNames.wrapper} role={actualRole}>\n        <Cluster gap={1} align=\"center\" justify=\"flex-end\" className={classNames.inner}>\n          <MessageArea bold={bold} type={type} classNames={classNames}>\n            {children}\n          </MessageArea>\n          {subActionArea && (\n            <Cluster align=\"center\" justify=\"flex-end\" className={classNames.actionArea}>\n              {subActionArea}\n            </Cluster>\n          )}\n        </Cluster>\n        <CloseButton onClose={onClose} className={classNames.closeButton} />\n      </div>\n    </WrapBase>\n  )\n}\n\nconst MessageArea = memo<\n  Pick<ActualProps, 'children' | 'bold' | 'type'> & {\n    classNames: { messageArea: string; icon: string }\n  }\n>(({ children, bold, type, classNames }) => {\n  const Icon = ICON_MAPPER[bold ? 'bold' : 'normal'][type]\n\n  return (\n    <Text\n      prefixIcon={<Icon iconGap={0.5} className={classNames.icon} />}\n      className={classNames.messageArea}\n      as=\"div\"\n    >\n      {children}\n    </Text>\n  )\n})\n\nconst CloseButton = memo<Pick<ActualProps, 'onClose'> & { className: string }>(\n  ({ onClose, className }) =>\n    onClose && (\n      <Button variant=\"text\" size=\"s\" onClick={onClose} className={className}>\n        <FaXmarkIcon\n          alt={\n            <Localizer id=\"smarthr-ui/NotificationBar/closeButtonIconAlt\" defaultText=\"閉じる\" />\n          }\n        />\n      </Button>\n    ),\n)\n"],"names":["tv","_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"NotificationBar.js","sources":["../../../src/components/NotificationBar/NotificationBar.tsx"],"sourcesContent":["import {\n  type ComponentProps,\n  type ComponentPropsWithoutRef,\n  type FC,\n  Fragment,\n  type PropsWithChildren,\n  type ReactNode,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { Localizer } from '../../intl'\nimport { Base } from '../Base'\nimport { Button } from '../Button'\nimport {\n  FaCircleCheckIcon,\n  FaCircleExclamationIcon,\n  FaCircleInfoIcon,\n  FaRotateIcon,\n  FaTriangleExclamationIcon,\n  FaXmarkIcon,\n  WarningIcon,\n} from '../Icon'\nimport { Cluster } from '../Layout'\nimport { Text } from '../Text'\n\nconst classNameGenerator = tv({\n  slots: {\n    wrapper:\n      'smarthr-ui-NotificationBar shr-flex shr-items-baseline shr-justify-between shr-gap-0.5 shr-p-0.75',\n    inner: 'shr-flex-grow',\n    messageArea: [\n      'smarthr-ui-NotificationBar-messageArea',\n      'shr-flex shr-grow',\n      '[&_.smarthr-ui-Icon-withText]:shr-leading-tight',\n    ],\n    icon: '',\n    actionArea: 'smarthr-ui-NotificationBar-actionArea -shr-my-0.5 shr-shrink-0',\n    closeButton:\n      'smarthr-ui-NotificationBar-closeButton -shr-mb-0.5 -shr-mr-0.5 -shr-mt-0.5 shr-flex-shrink-0 shr-text-black',\n  },\n  variants: {\n    /** 下地 */\n    base: {\n      none: {},\n      base: {\n        wrapper: 'shr-py-1 shr-pe-1 shr-ps-1.5',\n      },\n    },\n    /** メッセージの種類 */\n    type: {\n      info: {\n        icon: 'shr-text-grey',\n      },\n      success: {},\n      warning: {\n        icon: 'shr-text-black',\n      },\n      error: {},\n      sync: {\n        icon: 'shr-text-main',\n      },\n    },\n    /** 強調するかどうか */\n    bold: {\n      true: '',\n      false: '',\n    },\n    /** スライドインするかどうか */\n    animate: {\n      true: {\n        wrapper: 'shr-animate-[notification-bar-slide-in_0.2s_ease-out]',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      type: ['info', 'success', 'warning', 'error', 'sync'],\n      bold: false,\n      className: {\n        wrapper: 'shr-bg-white shr-text-black',\n      },\n    },\n    {\n      type: 'success',\n      bold: false,\n      className: {\n        icon: 'shr-text-main',\n      },\n    },\n    {\n      type: 'error',\n      bold: false,\n      className: {\n        icon: 'shr-text-danger',\n      },\n    },\n    {\n      type: ['info', 'sync'],\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-white',\n      },\n    },\n    {\n      type: 'success',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-main shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-main-darken focus-visible:[&]:shr-bg-main-darken',\n      },\n    },\n    {\n      type: 'warning',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-warning-yellow shr-text-black',\n        closeButton:\n          'shr-text-black hover:[&]:shr-bg-warning-yellow-darken focus-visible:[&]:shr-bg-warning-yellow-darken',\n      },\n    },\n    {\n      type: 'error',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-danger shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-danger-darken focus-visible:[&]:shr-bg-danger-darken',\n      },\n    },\n  ],\n})\n\ntype StyleVariants = VariantProps<typeof classNameGenerator>\ntype Props = PropsWithChildren<\n  Omit<StyleVariants, 'type'> &\n    Required<Pick<StyleVariants, 'type'>> & {\n      /** コンポーネント右の領域 */\n      subActionArea?: ReactNode\n      /** 閉じるボタン押下時に発火させる関数 */\n      onClose?: () => void\n      /** role 属性 */\n      role?: 'alert' | 'status'\n    }\n>\ntype ElementProps = Omit<ComponentPropsWithoutRef<'div'>, keyof Props>\ntype BaseProps = Pick<ComponentProps<typeof Base>, 'layer'>\ntype ActualProps = Props & ElementProps & BaseProps\n\nconst ABSTRACT_ICON_MAPPER = {\n  info: FaCircleInfoIcon,\n  success: FaCircleCheckIcon,\n  error: FaCircleExclamationIcon,\n  sync: FaRotateIcon,\n}\nconst ICON_MAPPER = {\n  normal: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: WarningIcon,\n  },\n  bold: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: FaTriangleExclamationIcon,\n  },\n} as const\n\nconst ROLE_STATUS_TYPE_REGEX = /^(info|sync)$/\n\nexport const NotificationBar: FC<ActualProps> = ({\n  type,\n  bold,\n  animate,\n  subActionArea,\n  onClose,\n  children,\n  role,\n  base,\n  layer,\n  className,\n  ...props\n}) => {\n  const actualRole = useMemo(() => {\n    if (role) {\n      return role\n    }\n\n    return ROLE_STATUS_TYPE_REGEX.test(type) ? 'status' : 'alert'\n  }, [role, type])\n  const { WrapBase, baseProps } = useMemo(\n    () =>\n      base === 'base'\n        ? {\n            WrapBase: Base,\n            baseProps: {\n              layer,\n              overflow: 'hidden' as ComponentProps<typeof Base>['overflow'],\n            },\n          }\n        : {\n            WrapBase: Fragment,\n            baseProps: {},\n          },\n    [base, layer],\n  )\n  const classNames = useMemo(() => {\n    const { wrapper, inner, messageArea, icon, actionArea, closeButton } = classNameGenerator({\n      type,\n      bold: !!bold,\n      base: base || 'none',\n    })\n\n    return {\n      wrapper: wrapper({ animate, className }),\n      inner: inner(),\n      messageArea: messageArea(),\n      icon: icon(),\n      actionArea: actionArea(),\n      closeButton: closeButton(),\n    }\n  }, [animate, base, bold, type, className])\n\n  return (\n    <WrapBase {...baseProps}>\n      <div {...props} className={classNames.wrapper} role={actualRole}>\n        <Cluster gap={1} align=\"center\" justify=\"flex-end\" className={classNames.inner}>\n          <MessageArea bold={bold} type={type} classNames={classNames}>\n            {children}\n          </MessageArea>\n          {subActionArea && (\n            <Cluster align=\"center\" justify=\"flex-end\" className={classNames.actionArea}>\n              {subActionArea}\n            </Cluster>\n          )}\n        </Cluster>\n        <CloseButton onClose={onClose} className={classNames.closeButton} />\n      </div>\n    </WrapBase>\n  )\n}\n\nconst MessageArea = memo<\n  Pick<ActualProps, 'children' | 'bold' | 'type'> & {\n    classNames: { messageArea: string; icon: string }\n  }\n>(({ children, bold, type, classNames }) => {\n  const Icon = ICON_MAPPER[bold ? 'bold' : 'normal'][type]\n\n  return (\n    <Text\n      prefixIcon={<Icon iconGap={0.5} className={classNames.icon} />}\n      className={classNames.messageArea}\n      as=\"div\"\n    >\n      {children}\n    </Text>\n  )\n})\n\nconst CloseButton = memo<Pick<ActualProps, 'onClose'> & { className: string }>(\n  ({ onClose, className }) =>\n    onClose && (\n      <Button variant=\"text\" size=\"s\" onClick={onClose} className={className}>\n        <FaXmarkIcon\n          alt={\n            <Localizer id=\"smarthr-ui/NotificationBar/closeButtonIconAlt\" defaultText=\"閉じる\" />\n          }\n        />\n      </Button>\n    ),\n)\n"],"names":["tv","_jsx","_jsxs"],"mappings":"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"}

package/esm/components/TextLink/TextLink.js

@@ -34,7 +34,8 @@ const suffixWrapperClassName = suffixWrapper();
 const ActualTextLink = forwardRef(({ elementAs, href, target, rel, onClick, children, prefix, suffix, className, size, ...others }, ref) => {
     const Anchor = elementAs || 'a';
     const actualSuffix = useMemo(() => {
-        if (target === '_blank' && !prefix && !suffix) {
+        // target="_blank" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている
+        if (target === '_blank' && !prefix && suffix === undefined) {
             return jsx(OpenInNewTabIcon, {});
         }
         return suffix;

package/esm/components/TextLink/TextLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextLink.js","sources":["../../../src/components/TextLink/TextLink.tsx"],"sourcesContent":["import {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type MouseEvent,\n  type PropsWithoutRef,\n  type ReactNode,\n  type Ref,\n  forwardRef,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  (keyof Props<T> & ElementRefProps<T>) | 'color'\n>\n\ntype Props<T extends ElementType> = VariantProps<typeof classNameGenerator> & {\n  /** リンクをクリックした時に発火するコールバック関数 */\n  onClick?: (e: MouseEvent) => void\n  /** テキストの前に表示するアイコン */\n  prefix?: ReactNode\n  /** テキストの後ろに表示するアイコン */\n  suffix?: ReactNode\n  /** TextLinkを利用しつつnext/linkなどと併用する場合に指定する */\n  elementAs?: T\n}\n\ntype TextLinkComponent = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst classNameGenerator = tv({\n  slots: {\n    anchor: [\n      'shr-text-link shr-no-underline shr-shadow-underline',\n      'forced-colors:shr-underline',\n      '[&:not([href])]:shr-shadow-none [&:not([href])]:forced-colors:shr-no-underline',\n      '[.smarthr-ui-Th_&]:shr-text-link-darken',\n    ],\n    prefixWrapper: 'shr-me-0.25 shr-align-middle',\n    suffixWrapper: 'shr-ms-0.25 shr-align-middle',\n  },\n  variants: {\n    size: {\n      XS: {\n        anchor: 'shr-text-xs',\n      },\n      S: {\n        anchor: 'shr-text-sm',\n      },\n      M: {\n        anchor: 'shr-text-base',\n      },\n    },\n  },\n})\nconst { anchor, prefixWrapper, suffixWrapper } = classNameGenerator()\nconst prefixWrapperClassName = prefixWrapper()\nconst suffixWrapperClassName = suffixWrapper()\n\nconst ActualTextLink: TextLinkComponent = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      elementAs,\n      href,\n      target,\n      rel,\n      onClick,\n      children,\n      prefix,\n      suffix,\n      className,\n      size,\n      ...others\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ) => {\n    const Anchor = elementAs || 'a'\n    const actualSuffix = useMemo(() => {\n      if (target === '_blank' && !prefix && !suffix) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n    const actualHref = useMemo(() => {\n      if (href) {\n        return href\n      }\n\n      if (onClick) {\n        return ''\n      }\n\n      return undefined\n    }, [href, onClick])\n    const actualRel = useMemo(\n      () => (rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel),\n      [rel, target],\n    )\n    const anchorClassName = useMemo(() => anchor({ size, className }), [size, className])\n\n    const actualOnClick = useMemo(() => {\n      if (!onClick) {\n        return undefined\n      }\n\n      if (href) {\n        return onClick\n      }\n\n      return (e: MouseEvent) => {\n        e.preventDefault()\n        onClick(e)\n      }\n    }, [onClick, href])\n\n    return (\n      <Anchor\n        {...others}\n        ref={ref}\n        href={actualHref}\n        target={target}\n        rel={actualRel}\n        onClick={actualOnClick}\n        className={anchorClassName}\n      >\n        {prefix && <span className={prefixWrapperClassName}>{prefix}</span>}\n        {children}\n        {actualSuffix && <span className={suffixWrapperClassName}>{actualSuffix}</span>}\n      </Anchor>\n    )\n  },\n)\n\nexport const TextLink = memo(ActualTextLink) as typeof ActualTextLink\n"],"names":["tv","_jsx","_jsxs"],"mappings":";;;;;AAsCA,MAAM,kBAAkB,GAAGA,EAAE,CAAC;AAC5B,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;YACN,qDAAqD;YACrD,6BAA6B;YAC7B,gFAAgF;YAChF,yCAAyC;AAC1C,SAAA;AACD,QAAA,aAAa,EAAE,8BAA8B;AAC7C,QAAA,aAAa,EAAE,8BAA8B;AAC9C,KAAA;AACD,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE;AACF,gBAAA,MAAM,EAAE,aAAa;AACtB,aAAA;AACD,YAAA,CAAC,EAAE;AACD,gBAAA,MAAM,EAAE,aAAa;AACtB,aAAA;AACD,YAAA,CAAC,EAAE;AACD,gBAAA,MAAM,EAAE,eAAe;AACxB,aAAA;AACF,SAAA;AACF,KAAA;AACF,CAAA,CAAC;AACF,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,kBAAkB,EAAE;AACrE,MAAM,sBAAsB,GAAG,aAAa,EAAE;AAC9C,MAAM,sBAAsB,GAAG,aAAa,EAAE;AAE9C,MAAM,cAAc,GAAsB,UAAU,CAClD,CACE,EACE,SAAS,EACT,IAAI,EACJ,MAAM,EACN,GAAG,EACH,OAAO,EACP,QAAQ,EACR,MAAM,EACN,MAAM,EACN,SAAS,EACT,IAAI,EACJ,GAAG,MAAM,EACmC,EAC9C,GAAuB,KACrB;AACF,IAAA,MAAM,MAAM,GAAG,SAAS,IAAI,GAAG;AAC/B,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,MAAK;QAChC,IAAI,MAAM,KAAK,QAAQ,IAAI,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE;YAC7C,OAAOC,GAAA,CAAC,gBAAgB,EAAA,EAAA,CAAG;QAC7B;AAEA,QAAA,OAAO,MAAM;IACf,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AAC5B,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAK;QAC9B,IAAI,IAAI,EAAE;AACR,YAAA,OAAO,IAAI;QACb;QAEA,IAAI,OAAO,EAAE;AACX,YAAA,OAAO,EAAE;QACX;AAEA,QAAA,OAAO,SAAS;AAClB,IAAA,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;AACnB,IAAA,MAAM,SAAS,GAAG,OAAO,CACvB,OAAO,GAAG,KAAK,SAAS,IAAI,MAAM,KAAK,QAAQ,GAAG,qBAAqB,GAAG,GAAG,CAAC,EAC9E,CAAC,GAAG,EAAE,MAAM,CAAC,CACd;IACD,MAAM,eAAe,GAAG,OAAO,CAAC,MAAM,MAAM,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAErF,IAAA,MAAM,aAAa,GAAG,OAAO,CAAC,MAAK;QACjC,IAAI,CAAC,OAAO,EAAE;AACZ,YAAA,OAAO,SAAS;QAClB;QAEA,IAAI,IAAI,EAAE;AACR,YAAA,OAAO,OAAO;QAChB;QAEA,OAAO,CAAC,CAAa,KAAI;YACvB,CAAC,CAAC,cAAc,EAAE;YAClB,OAAO,CAAC,CAAC,CAAC;AACZ,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAEnB,QACEC,IAAA,CAAC,MAAM,EAAA,EAAA,GACD,MAAM,EACV,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,aAAa,EACtB,SAAS,EAAE,eAAe,EAAA,QAAA,EAAA,CAEzB,MAAM,IAAID,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,sBAAsB,EAAA,QAAA,EAAG,MAAM,EAAA,CAAQ,EAClE,QAAQ,EACR,YAAY,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,sBAAsB,EAAA,QAAA,EAAG,YAAY,EAAA,CAAQ,CAAA,EAAA,CACxE;AAEb,CAAC,CACF;MAEY,QAAQ,GAAG,IAAI,CAAC,cAAc;;;;"}
+{"version":3,"file":"TextLink.js","sources":["../../../src/components/TextLink/TextLink.tsx"],"sourcesContent":["import {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type MouseEvent,\n  type PropsWithoutRef,\n  type ReactNode,\n  type Ref,\n  forwardRef,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  (keyof Props<T> & ElementRefProps<T>) | 'color'\n>\n\ntype Props<T extends ElementType> = VariantProps<typeof classNameGenerator> & {\n  /** リンクをクリックした時に発火するコールバック関数 */\n  onClick?: (e: MouseEvent) => void\n  /** テキストの前に表示するアイコン */\n  prefix?: ReactNode\n  /** テキストの後ろに表示するアイコン */\n  suffix?: ReactNode\n  /** TextLinkを利用しつつnext/linkなどと併用する場合に指定する */\n  elementAs?: T\n}\n\ntype TextLinkComponent = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst classNameGenerator = tv({\n  slots: {\n    anchor: [\n      'shr-text-link shr-no-underline shr-shadow-underline',\n      'forced-colors:shr-underline',\n      '[&:not([href])]:shr-shadow-none [&:not([href])]:forced-colors:shr-no-underline',\n      '[.smarthr-ui-Th_&]:shr-text-link-darken',\n    ],\n    prefixWrapper: 'shr-me-0.25 shr-align-middle',\n    suffixWrapper: 'shr-ms-0.25 shr-align-middle',\n  },\n  variants: {\n    size: {\n      XS: {\n        anchor: 'shr-text-xs',\n      },\n      S: {\n        anchor: 'shr-text-sm',\n      },\n      M: {\n        anchor: 'shr-text-base',\n      },\n    },\n  },\n})\nconst { anchor, prefixWrapper, suffixWrapper } = classNameGenerator()\nconst prefixWrapperClassName = prefixWrapper()\nconst suffixWrapperClassName = suffixWrapper()\n\nconst ActualTextLink: TextLinkComponent = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      elementAs,\n      href,\n      target,\n      rel,\n      onClick,\n      children,\n      prefix,\n      suffix,\n      className,\n      size,\n      ...others\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ) => {\n    const Anchor = elementAs || 'a'\n    const actualSuffix = useMemo(() => {\n      // target=\"_blank\" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている\n      if (target === '_blank' && !prefix && suffix === undefined) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n    const actualHref = useMemo(() => {\n      if (href) {\n        return href\n      }\n\n      if (onClick) {\n        return ''\n      }\n\n      return undefined\n    }, [href, onClick])\n    const actualRel = useMemo(\n      () => (rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel),\n      [rel, target],\n    )\n    const anchorClassName = useMemo(() => anchor({ size, className }), [size, className])\n\n    const actualOnClick = useMemo(() => {\n      if (!onClick) {\n        return undefined\n      }\n\n      if (href) {\n        return onClick\n      }\n\n      return (e: MouseEvent) => {\n        e.preventDefault()\n        onClick(e)\n      }\n    }, [onClick, href])\n\n    return (\n      <Anchor\n        {...others}\n        ref={ref}\n        href={actualHref}\n        target={target}\n        rel={actualRel}\n        onClick={actualOnClick}\n        className={anchorClassName}\n      >\n        {prefix && <span className={prefixWrapperClassName}>{prefix}</span>}\n        {children}\n        {actualSuffix && <span className={suffixWrapperClassName}>{actualSuffix}</span>}\n      </Anchor>\n    )\n  },\n)\n\nexport const TextLink = memo(ActualTextLink) as typeof ActualTextLink\n"],"names":["tv","_jsx","_jsxs"],"mappings":";;;;;AAsCA,MAAM,kBAAkB,GAAGA,EAAE,CAAC;AAC5B,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;YACN,qDAAqD;YACrD,6BAA6B;YAC7B,gFAAgF;YAChF,yCAAyC;AAC1C,SAAA;AACD,QAAA,aAAa,EAAE,8BAA8B;AAC7C,QAAA,aAAa,EAAE,8BAA8B;AAC9C,KAAA;AACD,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE;AACF,gBAAA,MAAM,EAAE,aAAa;AACtB,aAAA;AACD,YAAA,CAAC,EAAE;AACD,gBAAA,MAAM,EAAE,aAAa;AACtB,aAAA;AACD,YAAA,CAAC,EAAE;AACD,gBAAA,MAAM,EAAE,eAAe;AACxB,aAAA;AACF,SAAA;AACF,KAAA;AACF,CAAA,CAAC;AACF,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,kBAAkB,EAAE;AACrE,MAAM,sBAAsB,GAAG,aAAa,EAAE;AAC9C,MAAM,sBAAsB,GAAG,aAAa,EAAE;AAE9C,MAAM,cAAc,GAAsB,UAAU,CAClD,CACE,EACE,SAAS,EACT,IAAI,EACJ,MAAM,EACN,GAAG,EACH,OAAO,EACP,QAAQ,EACR,MAAM,EACN,MAAM,EACN,SAAS,EACT,IAAI,EACJ,GAAG,MAAM,EACmC,EAC9C,GAAuB,KACrB;AACF,IAAA,MAAM,MAAM,GAAG,SAAS,IAAI,GAAG;AAC/B,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,MAAK;;QAEhC,IAAI,MAAM,KAAK,QAAQ,IAAI,CAAC,MAAM,IAAI,MAAM,KAAK,SAAS,EAAE;YAC1D,OAAOC,GAAA,CAAC,gBAAgB,EAAA,EAAA,CAAG;QAC7B;AAEA,QAAA,OAAO,MAAM;IACf,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AAC5B,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAK;QAC9B,IAAI,IAAI,EAAE;AACR,YAAA,OAAO,IAAI;QACb;QAEA,IAAI,OAAO,EAAE;AACX,YAAA,OAAO,EAAE;QACX;AAEA,QAAA,OAAO,SAAS;AAClB,IAAA,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;AACnB,IAAA,MAAM,SAAS,GAAG,OAAO,CACvB,OAAO,GAAG,KAAK,SAAS,IAAI,MAAM,KAAK,QAAQ,GAAG,qBAAqB,GAAG,GAAG,CAAC,EAC9E,CAAC,GAAG,EAAE,MAAM,CAAC,CACd;IACD,MAAM,eAAe,GAAG,OAAO,CAAC,MAAM,MAAM,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAErF,IAAA,MAAM,aAAa,GAAG,OAAO,CAAC,MAAK;QACjC,IAAI,CAAC,OAAO,EAAE;AACZ,YAAA,OAAO,SAAS;QAClB;QAEA,IAAI,IAAI,EAAE;AACR,YAAA,OAAO,OAAO;QAChB;QAEA,OAAO,CAAC,CAAa,KAAI;YACvB,CAAC,CAAC,cAAc,EAAE;YAClB,OAAO,CAAC,CAAC,CAAC;AACZ,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAEnB,QACEC,IAAA,CAAC,MAAM,EAAA,EAAA,GACD,MAAM,EACV,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,aAAa,EACtB,SAAS,EAAE,eAAe,EAAA,QAAA,EAAA,CAEzB,MAAM,IAAID,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,sBAAsB,EAAA,QAAA,EAAG,MAAM,EAAA,CAAQ,EAClE,QAAQ,EACR,YAAY,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,sBAAsB,EAAA,QAAA,EAAG,YAAY,EAAA,CAAQ,CAAA,EAAA,CACxE;AAEb,CAAC,CACF;MAEY,QAAQ,GAAG,IAAI,CAAC,cAAc;;;;"}

package/lib/components/Button/AnchorButton.js

@@ -14,7 +14,8 @@ const classNameGenerator = (0, tailwind_variants_1.tv)({
 const AnchorButton = (0, react_1.forwardRef)(({ size = 'default', prefix, suffix, wide = false, variant = 'secondary', inactiveReason, target, rel, elementAs, className, children, ...props }, ref) => {
     const actualClassName = (0, react_1.useMemo)(() => classNameGenerator({ className }), [className]);
     const actualSuffix = (0, react_1.useMemo)(() => {
-        if (target === '_blank' && !prefix && !suffix) {
+        // target="_blank" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている
+        if (target === '_blank' && !prefix && suffix === undefined) {
             return (0, jsx_runtime_1.jsx)(OpenInNewTabIcon_1.OpenInNewTabIcon, {});
         }
         return suffix;

package/lib/components/Button/AnchorButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnchorButton.js","sourceRoot":"","sources":["../../../src/components/Button/AnchorButton.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AAEZ,iCASc;AACd,yDAAsC;AAEtC,0DAAsD;AAEtD,mDAA+C;AAC/C,qDAAiD;AAkBjD,MAAM,kBAAkB,GAAG,IAAA,sBAAE,EAAC;IAC5B,IAAI,EAAE,yBAAyB;CAChC,CAAC,CAAA;AAEF,MAAM,YAAY,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,IAAI,GAAG,SAAS,EAChB,MAAM,EACN,MAAM,EACN,IAAI,GAAG,KAAK,EACZ,OAAO,GAAG,WAAW,EACrB,cAAc,EACd,MAAM,EACN,GAAG,EACH,SAAS,EACT,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACoC,EAC9C,GAAuB,EACT,EAAE;IAChB,MAAM,eAAe,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAErF,MAAM,YAAY,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAChC,IAAI,MAAM,KAAK,QAAQ,IAAI,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,CAAC;YAC9C,OAAO,uBAAC,mCAAgB,KAAG,CAAA;QAC7B,CAAC;QAED,OAAO,MAAM,CAAA;IACf,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IAE5B,MAAM,MAAM,GAAG,CACb,uBAAC,6BAAa,OACR,KAAK,EACT,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,eAAe,EAC1B,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,GAAG,KAAK,SAAS,IAAI,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,GAAG,EAC3E,QAAQ,QACR,SAAS,EAAE,GAAG,EACd,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,YAAY,YAEnB,QAAQ,GACK,CACjB,CAAA;IAED,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,cAAc,EAAE,CAAC;QAClC,OAAO,uBAAC,+BAAc,IAAC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,GAAI,CAAA;IAC3E,CAAC;IAED,OAAO,MAAM,CAAA;AACf,CAAC,CACF,CAAA;AAOD,MAAM,qBAAqB,GAAG,YAE7B,CAAA;AAKiC,6CAAY;AAH9C,oDAAoD;AACpD,qBAAqB,CAAC,WAAW,GAAG,cAAc,CAAA","sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type PropsWithoutRef,\n  type ReactElement,\n  type Ref,\n  forwardRef,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport { ButtonWrapper } from './ButtonWrapper'\nimport { DisabledReason } from './DisabledReason'\n\nimport type { BaseProps } from './types'\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  keyof Props<T> & ElementRefProps<T>\n>\n\ntype Props<T extends ElementType> = Omit<BaseProps, 'variant' | 'disabledReason'> & {\n  /** next/linkなどのカスタムコンポーネントを指定します。指定がない場合はデフォルトで `a` タグが使用されます。 */\n  elementAs?: T\n  // tertiaryはAnchorButtonでは使用不可\n  variant?: Exclude<BaseProps['variant'], 'tertiary'>\n  inactiveReason?: BaseProps['disabledReason']\n}\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AnchorButton',\n})\n\nconst AnchorButton = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      size = 'default',\n      prefix,\n      suffix,\n      wide = false,\n      variant = 'secondary',\n      inactiveReason,\n      target,\n      rel,\n      elementAs,\n      className,\n      children,\n      ...props\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ): ReactElement => {\n    const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n    const actualSuffix = useMemo(() => {\n      if (target === '_blank' && !prefix && !suffix) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n\n    const button = (\n      <ButtonWrapper\n        {...props}\n        size={size}\n        wide={wide}\n        variant={variant}\n        className={actualClassName}\n        target={target}\n        rel={rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel}\n        isAnchor\n        anchorRef={ref}\n        elementAs={elementAs}\n        prefix={prefix}\n        suffix={actualSuffix}\n      >\n        {children}\n      </ButtonWrapper>\n    )\n\n    if (!props.href && inactiveReason) {\n      return <DisabledReason button={button} disabledReason={inactiveReason} />\n    }\n\n    return button\n  },\n)\n\n// 型キャストなしで ForwardRefExoticComponent に合わせた型をエクスポートするための処理\ntype AnchorButtonType = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst ForwardedAnchorButton = AnchorButton as unknown as AnchorButtonType & {\n  displayName: string\n}\n\n// BottomFixedArea での判定に用いるために displayName を明示的に設定する\nForwardedAnchorButton.displayName = 'AnchorButton'\n\nexport { ForwardedAnchorButton as AnchorButton }\n"]}
+{"version":3,"file":"AnchorButton.js","sourceRoot":"","sources":["../../../src/components/Button/AnchorButton.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AAEZ,iCASc;AACd,yDAAsC;AAEtC,0DAAsD;AAEtD,mDAA+C;AAC/C,qDAAiD;AAkBjD,MAAM,kBAAkB,GAAG,IAAA,sBAAE,EAAC;IAC5B,IAAI,EAAE,yBAAyB;CAChC,CAAC,CAAA;AAEF,MAAM,YAAY,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,IAAI,GAAG,SAAS,EAChB,MAAM,EACN,MAAM,EACN,IAAI,GAAG,KAAK,EACZ,OAAO,GAAG,WAAW,EACrB,cAAc,EACd,MAAM,EACN,GAAG,EACH,SAAS,EACT,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACoC,EAC9C,GAAuB,EACT,EAAE;IAChB,MAAM,eAAe,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAErF,MAAM,YAAY,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAChC,kFAAkF;QAClF,IAAI,MAAM,KAAK,QAAQ,IAAI,CAAC,MAAM,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;YAC3D,OAAO,uBAAC,mCAAgB,KAAG,CAAA;QAC7B,CAAC;QAED,OAAO,MAAM,CAAA;IACf,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IAE5B,MAAM,MAAM,GAAG,CACb,uBAAC,6BAAa,OACR,KAAK,EACT,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,eAAe,EAC1B,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,GAAG,KAAK,SAAS,IAAI,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,GAAG,EAC3E,QAAQ,QACR,SAAS,EAAE,GAAG,EACd,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,YAAY,YAEnB,QAAQ,GACK,CACjB,CAAA;IAED,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,cAAc,EAAE,CAAC;QAClC,OAAO,uBAAC,+BAAc,IAAC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,GAAI,CAAA;IAC3E,CAAC;IAED,OAAO,MAAM,CAAA;AACf,CAAC,CACF,CAAA;AAOD,MAAM,qBAAqB,GAAG,YAE7B,CAAA;AAKiC,6CAAY;AAH9C,oDAAoD;AACpD,qBAAqB,CAAC,WAAW,GAAG,cAAc,CAAA","sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type PropsWithoutRef,\n  type ReactElement,\n  type Ref,\n  forwardRef,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport { ButtonWrapper } from './ButtonWrapper'\nimport { DisabledReason } from './DisabledReason'\n\nimport type { BaseProps } from './types'\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  keyof Props<T> & ElementRefProps<T>\n>\n\ntype Props<T extends ElementType> = Omit<BaseProps, 'variant' | 'disabledReason'> & {\n  /** next/linkなどのカスタムコンポーネントを指定します。指定がない場合はデフォルトで `a` タグが使用されます。 */\n  elementAs?: T\n  // tertiaryはAnchorButtonでは使用不可\n  variant?: Exclude<BaseProps['variant'], 'tertiary'>\n  inactiveReason?: BaseProps['disabledReason']\n}\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AnchorButton',\n})\n\nconst AnchorButton = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      size = 'default',\n      prefix,\n      suffix,\n      wide = false,\n      variant = 'secondary',\n      inactiveReason,\n      target,\n      rel,\n      elementAs,\n      className,\n      children,\n      ...props\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ): ReactElement => {\n    const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n    const actualSuffix = useMemo(() => {\n      // target=\"_blank\" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている\n      if (target === '_blank' && !prefix && suffix === undefined) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n\n    const button = (\n      <ButtonWrapper\n        {...props}\n        size={size}\n        wide={wide}\n        variant={variant}\n        className={actualClassName}\n        target={target}\n        rel={rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel}\n        isAnchor\n        anchorRef={ref}\n        elementAs={elementAs}\n        prefix={prefix}\n        suffix={actualSuffix}\n      >\n        {children}\n      </ButtonWrapper>\n    )\n\n    if (!props.href && inactiveReason) {\n      return <DisabledReason button={button} disabledReason={inactiveReason} />\n    }\n\n    return button\n  },\n)\n\n// 型キャストなしで ForwardRefExoticComponent に合わせた型をエクスポートするための処理\ntype AnchorButtonType = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst ForwardedAnchorButton = AnchorButton as unknown as AnchorButtonType & {\n  displayName: string\n}\n\n// BottomFixedArea での判定に用いるために displayName を明示的に設定する\nForwardedAnchorButton.displayName = 'AnchorButton'\n\nexport { ForwardedAnchorButton as AnchorButton }\n"]}

package/lib/components/Heading/PageHeading/PageHeading.d.ts

@@ -10,6 +10,12 @@ export type Props = PropsWithChildren<{
     size?: Extract<TextProps['size'], 'XXL' | 'XL' | 'L'>;
     /** 視覚的に非表示にするフラグ */
     visuallyHidden?: boolean;
+    /** title要素の自動生成フラグ */
+    autoPageTitle?: boolean;
+    /** title要素のprefix */
+    pageTitle?: string;
+    /** title要素のsuffix */
+    pageTitleSuffix?: string;
 }>;
 export declare const PageHeading: import("react").NamedExoticComponent<{
     /**
@@ -20,6 +26,12 @@ export declare const PageHeading: import("react").NamedExoticComponent<{
     size?: Extract<TextProps["size"], "XXL" | "XL" | "L">;
     /** 視覚的に非表示にするフラグ */
     visuallyHidden?: boolean;
+    /** title要素の自動生成フラグ */
+    autoPageTitle?: boolean;
+    /** title要素のprefix */
+    pageTitle?: string;
+    /** title要素のsuffix */
+    pageTitleSuffix?: string;
 } & {
     children?: import("react").ReactNode | undefined;
 } & ElementProps>;

package/lib/components/Heading/PageHeading/PageHeading.js

@@ -1,9 +1,13 @@
 "use strict";
 'use client';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PageHeading = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
+const react_innertext_1 = __importDefault(require("react-innertext"));
 const tailwind_variants_1 = require("tailwind-variants");
 const Text_1 = require("../../Text");
 const VisuallyHiddenText_1 = require("../../VisuallyHiddenText");
@@ -18,7 +22,8 @@ const classNameGenerator = (0, tailwind_variants_1.tv)({
         visuallyHidden: false,
     },
 });
-exports.PageHeading = (0, react_1.memo)(({ size, className, visuallyHidden, ...props }) => {
+const PSEUDO_TITLE_CLASS_NAME = (0, VisuallyHiddenText_1.visuallyHiddenTextClassNameGenerator)();
+exports.PageHeading = (0, react_1.memo)(({ size, className, visuallyHidden, autoPageTitle = true, pageTitleSuffix = 'SmartHR（スマートHR）', pageTitle, children, ...props }) => {
     const actualClassName = (0, react_1.useMemo)(() => classNameGenerator({ visuallyHidden, className }), [className, visuallyHidden]);
     const actualTypography = (0, react_1.useMemo)(() => {
         const defaultTypography = Text_1.STYLE_TYPE_MAP.screenTitle;
@@ -27,7 +32,29 @@ exports.PageHeading = (0, react_1.memo)(({ size, className, visuallyHidden, ...p
         }
         return defaultTypography;
     }, [size]);
+    const pseudoTitleId = (0, react_1.useId)();
+    const titleText = (0, react_1.useMemo)(() => (autoPageTitle ? `${pageTitle || (0, react_innertext_1.default)(children)}｜${pageTitleSuffix}` : ''), [children, pageTitle, pageTitleSuffix, autoPageTitle]);
+    (0, react_1.useEffect)(() => {
+        if (titleText) {
+            // HINT: SPAで遷移する場合などの対策としてbody直下にaria-liveを仕込む
+            // head内はスクリーンリーダーの変更検知のチェック対象外のため、title要素にaria-liveは設定しない
+            const pseudoTitle = (document.getElementById(pseudoTitleId) ||
+                document.createElement('div'));
+            pseudoTitle.setAttribute('id', pseudoTitleId);
+            pseudoTitle.setAttribute('class', PSEUDO_TITLE_CLASS_NAME);
+            pseudoTitle.setAttribute('aria-live', 'polite');
+            document.body.prepend(pseudoTitle);
+            document.title = titleText;
+            requestAnimationFrame(() => {
+                pseudoTitle.innerText = titleText;
+            });
+            return () => {
+                pseudoTitle.remove();
+            };
+        }
+        return undefined;
+    }, [titleText, pseudoTitleId]);
     const Component = visuallyHidden ? VisuallyHiddenText_1.VisuallyHiddenText : Text_1.Text;
-    return (0, jsx_runtime_1.jsx)(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName });
+    return ((0, jsx_runtime_1.jsx)(Component, { ...props, ...actualTypography, as: "h1", className: actualClassName, children: children }));
 });
 //# sourceMappingURL=PageHeading.js.map

package/lib/components/Heading/PageHeading/PageHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageHeading.js","sourceRoot":"","sources":["../../../../src/components/Heading/PageHeading/PageHeading.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AAEZ,iCAA6D;AAC7D,yDAAsC;AAEtC,qCAAiE;AACjE,iEAA6D;AAgB7D,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;AAEW,QAAA,WAAW,GAAG,IAAA,YAAI,EAC7B,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,cAAc,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAChD,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;IACV,MAAM,SAAS,GAAG,cAAc,CAAC,CAAC,CAAC,uCAAkB,CAAC,CAAC,CAAC,WAAI,CAAA;IAE5D,OAAO,uBAAC,SAAS,OAAK,KAAK,KAAM,gBAAgB,EAAE,EAAE,EAAC,IAAI,EAAC,SAAS,EAAE,eAAe,GAAI,CAAA;AAC3F,CAAC,CACF,CAAA","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\n  /** 視覚的に非表示にするフラグ */\n  visuallyHidden?: boolean\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\nexport const PageHeading = memo<Props & ElementProps>(\n  ({ size, className, visuallyHidden, ...props }) => {\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    const Component = visuallyHidden ? VisuallyHiddenText : Text\n\n    return <Component {...props} {...actualTypography} as=\"h1\" className={actualClassName} />\n  },\n)\n"]}
+{"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/lib/components/NotificationBar/NotificationBar.d.ts

@@ -257,7 +257,7 @@ declare const classNameGenerator: import("tailwind-variants").TVReturnType<{
 type StyleVariants = VariantProps<typeof classNameGenerator>;
 type Props = PropsWithChildren<Omit<StyleVariants, 'type'> & Required<Pick<StyleVariants, 'type'>> & {
     /** コンポーネント右の領域 */
-    subActionArea: ReactNode;
+    subActionArea?: ReactNode;
     /** 閉じるボタン押下時に発火させる関数 */
     onClose?: () => void;
     /** role 属性 */

package/lib/components/NotificationBar/NotificationBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationBar.js","sourceRoot":"","sources":["../../../src/components/NotificationBar/NotificationBar.tsx"],"names":[],"mappings":";;;;AAAA,iCASc;AACd,yDAAyD;AAEzD,qCAAsC;AACtC,kCAA8B;AAC9B,sCAAkC;AAClC,kCAQgB;AAChB,sCAAmC;AACnC,kCAA8B;AAE9B,MAAM,kBAAkB,GAAG,IAAA,sBAAE,EAAC;IAC5B,KAAK,EAAE;QACL,OAAO,EACL,mGAAmG;QACrG,KAAK,EAAE,eAAe;QACtB,WAAW,EAAE;YACX,wCAAwC;YACxC,mBAAmB;YACnB,iDAAiD;SAClD;QACD,IAAI,EAAE,EAAE;QACR,UAAU,EAAE,gEAAgE;QAC5E,WAAW,EACT,6GAA6G;KAChH;IACD,QAAQ,EAAE;QACR,SAAS;QACT,IAAI,EAAE;YACJ,IAAI,EAAE,EAAE;YACR,IAAI,EAAE;gBACJ,OAAO,EAAE,8BAA8B;aACxC;SACF;QACD,eAAe;QACf,IAAI,EAAE;YACJ,IAAI,EAAE;gBACJ,IAAI,EAAE,eAAe;aACtB;YACD,OAAO,EAAE,EAAE;YACX,OAAO,EAAE;gBACP,IAAI,EAAE,gBAAgB;aACvB;YACD,KAAK,EAAE,EAAE;YACT,IAAI,EAAE;gBACJ,IAAI,EAAE,eAAe;aACtB;SACF;QACD,eAAe;QACf,IAAI,EAAE;YACJ,IAAI,EAAE,EAAE;YACR,KAAK,EAAE,EAAE;SACV;QACD,mBAAmB;QACnB,OAAO,EAAE;YACP,IAAI,EAAE;gBACJ,OAAO,EAAE,uDAAuD;aACjE;SACF;KACF;IACD,gBAAgB,EAAE;QAChB;YACE,IAAI,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,CAAC;YACrD,IAAI,EAAE,KAAK;YACX,SAAS,EAAE;gBACT,OAAO,EAAE,6BAA6B;aACvC;SACF;QACD;YACE,IAAI,EAAE,SAAS;YACf,IAAI,EAAE,KAAK;YACX,SAAS,EAAE;gBACT,IAAI,EAAE,eAAe;aACtB;SACF;QACD;YACE,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,KAAK;YACX,SAAS,EAAE;gBACT,IAAI,EAAE,iBAAiB;aACxB;SACF;QACD;YACE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;YACtB,IAAI,EAAE,IAAI;YACV,SAAS,EAAE;gBACT,OAAO,EAAE,cAAc;aACxB;SACF;QACD;YACE,IAAI,EAAE,SAAS;YACf,IAAI,EAAE,IAAI;YACV,SAAS,EAAE;gBACT,OAAO,EAAE,4BAA4B;gBACrC,IAAI,EAAE,gBAAgB;gBACtB,WAAW,EACT,kFAAkF;aACrF;SACF;QACD;YACE,IAAI,EAAE,SAAS;YACf,IAAI,EAAE,IAAI;YACV,SAAS,EAAE;gBACT,OAAO,EAAE,sCAAsC;gBAC/C,WAAW,EACT,sGAAsG;aACzG;SACF;QACD;YACE,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,IAAI;YACV,SAAS,EAAE;gBACT,OAAO,EAAE,8BAA8B;gBACvC,IAAI,EAAE,gBAAgB;gBACtB,WAAW,EACT,sFAAsF;aACzF;SACF;KACF;CACF,CAAC,CAAA;AAkBF,MAAM,oBAAoB,GAAG;IAC3B,IAAI,EAAE,uBAAgB;IACtB,OAAO,EAAE,wBAAiB;IAC1B,KAAK,EAAE,8BAAuB;IAC9B,IAAI,EAAE,mBAAY;CACnB,CAAA;AACD,MAAM,WAAW,GAAG;IAClB,MAAM,EAAE;QACN,GAAG,oBAAoB;QACvB,OAAO,EAAE,kBAAW;KACrB;IACD,IAAI,EAAE;QACJ,GAAG,oBAAoB;QACvB,OAAO,EAAE,gCAAyB;KACnC;CACO,CAAA;AAEV,MAAM,sBAAsB,GAAG,eAAe,CAAA;AAEvC,MAAM,eAAe,GAAoB,CAAC,EAC/C,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,aAAa,EACb,OAAO,EACP,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,UAAU,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC9B,IAAI,IAAI,EAAE,CAAC;YACT,OAAO,IAAI,CAAA;QACb,CAAC;QAED,OAAO,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAA;IAC/D,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAA;IAChB,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAA,eAAO,EACrC,GAAG,EAAE,CACH,IAAI,KAAK,MAAM;QACb,CAAC,CAAC;YACE,QAAQ,EAAE,WAAI;YACd,SAAS,EAAE;gBACT,KAAK;gBACL,QAAQ,EAAE,QAAmD;aAC9D;SACF;QACH,CAAC,CAAC;YACE,QAAQ,EAAE,gBAAQ;YAClB,SAAS,EAAE,EAAE;SACd,EACP,CAAC,IAAI,EAAE,KAAK,CAAC,CACd,CAAA;IACD,MAAM,UAAU,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC9B,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,kBAAkB,CAAC;YACxF,IAAI;YACJ,IAAI,EAAE,CAAC,CAAC,IAAI;YACZ,IAAI,EAAE,IAAI,IAAI,MAAM;SACrB,CAAC,CAAA;QAEF,OAAO;YACL,OAAO,EAAE,OAAO,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC;YACxC,KAAK,EAAE,KAAK,EAAE;YACd,WAAW,EAAE,WAAW,EAAE;YAC1B,IAAI,EAAE,IAAI,EAAE;YACZ,UAAU,EAAE,UAAU,EAAE;YACxB,WAAW,EAAE,WAAW,EAAE;SAC3B,CAAA;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,CAAA;IAE1C,OAAO,CACL,uBAAC,QAAQ,OAAK,SAAS,YACrB,oCAAS,KAAK,EAAE,SAAS,EAAE,UAAU,CAAC,OAAO,EAAE,IAAI,EAAE,UAAU,aAC7D,wBAAC,gBAAO,IAAC,GAAG,EAAE,CAAC,EAAE,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,UAAU,EAAC,SAAS,EAAE,UAAU,CAAC,KAAK,aAC5E,uBAAC,WAAW,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,YACxD,QAAQ,GACG,EACb,aAAa,IAAI,CAChB,uBAAC,gBAAO,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,UAAU,EAAC,SAAS,EAAE,UAAU,CAAC,UAAU,YACxE,aAAa,GACN,CACX,IACO,EACV,uBAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,CAAC,WAAW,GAAI,IAChE,GACG,CACZ,CAAA;AACH,CAAC,CAAA;AAtEY,QAAA,eAAe,mBAsE3B;AAED,MAAM,WAAW,GAAG,IAAA,YAAI,EAItB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE;IACzC,MAAM,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAA;IAExD,OAAO,CACL,uBAAC,WAAI,IACH,UAAU,EAAE,uBAAC,IAAI,IAAC,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,UAAU,CAAC,IAAI,GAAI,EAC9D,SAAS,EAAE,UAAU,CAAC,WAAW,EACjC,EAAE,EAAC,KAAK,YAEP,QAAQ,GACJ,CACR,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,WAAW,GAAG,IAAA,YAAI,EACtB,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE,CACzB,OAAO,IAAI,CACT,uBAAC,eAAM,IAAC,OAAO,EAAC,MAAM,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,YACpE,uBAAC,kBAAW,IACV,GAAG,EACD,uBAAC,gBAAS,IAAC,EAAE,EAAC,+CAA+C,EAAC,WAAW,EAAC,oBAAK,GAAG,GAEpF,GACK,CACV,CACJ,CAAA","sourcesContent":["import {\n  type ComponentProps,\n  type ComponentPropsWithoutRef,\n  type FC,\n  Fragment,\n  type PropsWithChildren,\n  type ReactNode,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { Localizer } from '../../intl'\nimport { Base } from '../Base'\nimport { Button } from '../Button'\nimport {\n  FaCircleCheckIcon,\n  FaCircleExclamationIcon,\n  FaCircleInfoIcon,\n  FaRotateIcon,\n  FaTriangleExclamationIcon,\n  FaXmarkIcon,\n  WarningIcon,\n} from '../Icon'\nimport { Cluster } from '../Layout'\nimport { Text } from '../Text'\n\nconst classNameGenerator = tv({\n  slots: {\n    wrapper:\n      'smarthr-ui-NotificationBar shr-flex shr-items-baseline shr-justify-between shr-gap-0.5 shr-p-0.75',\n    inner: 'shr-flex-grow',\n    messageArea: [\n      'smarthr-ui-NotificationBar-messageArea',\n      'shr-flex shr-grow',\n      '[&_.smarthr-ui-Icon-withText]:shr-leading-tight',\n    ],\n    icon: '',\n    actionArea: 'smarthr-ui-NotificationBar-actionArea -shr-my-0.5 shr-shrink-0',\n    closeButton:\n      'smarthr-ui-NotificationBar-closeButton -shr-mb-0.5 -shr-mr-0.5 -shr-mt-0.5 shr-flex-shrink-0 shr-text-black',\n  },\n  variants: {\n    /** 下地 */\n    base: {\n      none: {},\n      base: {\n        wrapper: 'shr-py-1 shr-pe-1 shr-ps-1.5',\n      },\n    },\n    /** メッセージの種類 */\n    type: {\n      info: {\n        icon: 'shr-text-grey',\n      },\n      success: {},\n      warning: {\n        icon: 'shr-text-black',\n      },\n      error: {},\n      sync: {\n        icon: 'shr-text-main',\n      },\n    },\n    /** 強調するかどうか */\n    bold: {\n      true: '',\n      false: '',\n    },\n    /** スライドインするかどうか */\n    animate: {\n      true: {\n        wrapper: 'shr-animate-[notification-bar-slide-in_0.2s_ease-out]',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      type: ['info', 'success', 'warning', 'error', 'sync'],\n      bold: false,\n      className: {\n        wrapper: 'shr-bg-white shr-text-black',\n      },\n    },\n    {\n      type: 'success',\n      bold: false,\n      className: {\n        icon: 'shr-text-main',\n      },\n    },\n    {\n      type: 'error',\n      bold: false,\n      className: {\n        icon: 'shr-text-danger',\n      },\n    },\n    {\n      type: ['info', 'sync'],\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-white',\n      },\n    },\n    {\n      type: 'success',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-main shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-main-darken focus-visible:[&]:shr-bg-main-darken',\n      },\n    },\n    {\n      type: 'warning',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-warning-yellow shr-text-black',\n        closeButton:\n          'shr-text-black hover:[&]:shr-bg-warning-yellow-darken focus-visible:[&]:shr-bg-warning-yellow-darken',\n      },\n    },\n    {\n      type: 'error',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-danger shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-danger-darken focus-visible:[&]:shr-bg-danger-darken',\n      },\n    },\n  ],\n})\n\ntype StyleVariants = VariantProps<typeof classNameGenerator>\ntype Props = PropsWithChildren<\n  Omit<StyleVariants, 'type'> &\n    Required<Pick<StyleVariants, 'type'>> & {\n      /** コンポーネント右の領域 */\n      subActionArea: ReactNode\n      /** 閉じるボタン押下時に発火させる関数 */\n      onClose?: () => void\n      /** role 属性 */\n      role?: 'alert' | 'status'\n    }\n>\ntype ElementProps = Omit<ComponentPropsWithoutRef<'div'>, keyof Props>\ntype BaseProps = Pick<ComponentProps<typeof Base>, 'layer'>\ntype ActualProps = Props & ElementProps & BaseProps\n\nconst ABSTRACT_ICON_MAPPER = {\n  info: FaCircleInfoIcon,\n  success: FaCircleCheckIcon,\n  error: FaCircleExclamationIcon,\n  sync: FaRotateIcon,\n}\nconst ICON_MAPPER = {\n  normal: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: WarningIcon,\n  },\n  bold: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: FaTriangleExclamationIcon,\n  },\n} as const\n\nconst ROLE_STATUS_TYPE_REGEX = /^(info|sync)$/\n\nexport const NotificationBar: FC<ActualProps> = ({\n  type,\n  bold,\n  animate,\n  subActionArea,\n  onClose,\n  children,\n  role,\n  base,\n  layer,\n  className,\n  ...props\n}) => {\n  const actualRole = useMemo(() => {\n    if (role) {\n      return role\n    }\n\n    return ROLE_STATUS_TYPE_REGEX.test(type) ? 'status' : 'alert'\n  }, [role, type])\n  const { WrapBase, baseProps } = useMemo(\n    () =>\n      base === 'base'\n        ? {\n            WrapBase: Base,\n            baseProps: {\n              layer,\n              overflow: 'hidden' as ComponentProps<typeof Base>['overflow'],\n            },\n          }\n        : {\n            WrapBase: Fragment,\n            baseProps: {},\n          },\n    [base, layer],\n  )\n  const classNames = useMemo(() => {\n    const { wrapper, inner, messageArea, icon, actionArea, closeButton } = classNameGenerator({\n      type,\n      bold: !!bold,\n      base: base || 'none',\n    })\n\n    return {\n      wrapper: wrapper({ animate, className }),\n      inner: inner(),\n      messageArea: messageArea(),\n      icon: icon(),\n      actionArea: actionArea(),\n      closeButton: closeButton(),\n    }\n  }, [animate, base, bold, type, className])\n\n  return (\n    <WrapBase {...baseProps}>\n      <div {...props} className={classNames.wrapper} role={actualRole}>\n        <Cluster gap={1} align=\"center\" justify=\"flex-end\" className={classNames.inner}>\n          <MessageArea bold={bold} type={type} classNames={classNames}>\n            {children}\n          </MessageArea>\n          {subActionArea && (\n            <Cluster align=\"center\" justify=\"flex-end\" className={classNames.actionArea}>\n              {subActionArea}\n            </Cluster>\n          )}\n        </Cluster>\n        <CloseButton onClose={onClose} className={classNames.closeButton} />\n      </div>\n    </WrapBase>\n  )\n}\n\nconst MessageArea = memo<\n  Pick<ActualProps, 'children' | 'bold' | 'type'> & {\n    classNames: { messageArea: string; icon: string }\n  }\n>(({ children, bold, type, classNames }) => {\n  const Icon = ICON_MAPPER[bold ? 'bold' : 'normal'][type]\n\n  return (\n    <Text\n      prefixIcon={<Icon iconGap={0.5} className={classNames.icon} />}\n      className={classNames.messageArea}\n      as=\"div\"\n    >\n      {children}\n    </Text>\n  )\n})\n\nconst CloseButton = memo<Pick<ActualProps, 'onClose'> & { className: string }>(\n  ({ onClose, className }) =>\n    onClose && (\n      <Button variant=\"text\" size=\"s\" onClick={onClose} className={className}>\n        <FaXmarkIcon\n          alt={\n            <Localizer id=\"smarthr-ui/NotificationBar/closeButtonIconAlt\" defaultText=\"閉じる\" />\n          }\n        />\n      </Button>\n    ),\n)\n"]}
+{"version":3,"file":"NotificationBar.js","sourceRoot":"","sources":["../../../src/components/NotificationBar/NotificationBar.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  type ComponentProps,\n  type ComponentPropsWithoutRef,\n  type FC,\n  Fragment,\n  type PropsWithChildren,\n  type ReactNode,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { Localizer } from '../../intl'\nimport { Base } from '../Base'\nimport { Button } from '../Button'\nimport {\n  FaCircleCheckIcon,\n  FaCircleExclamationIcon,\n  FaCircleInfoIcon,\n  FaRotateIcon,\n  FaTriangleExclamationIcon,\n  FaXmarkIcon,\n  WarningIcon,\n} from '../Icon'\nimport { Cluster } from '../Layout'\nimport { Text } from '../Text'\n\nconst classNameGenerator = tv({\n  slots: {\n    wrapper:\n      'smarthr-ui-NotificationBar shr-flex shr-items-baseline shr-justify-between shr-gap-0.5 shr-p-0.75',\n    inner: 'shr-flex-grow',\n    messageArea: [\n      'smarthr-ui-NotificationBar-messageArea',\n      'shr-flex shr-grow',\n      '[&_.smarthr-ui-Icon-withText]:shr-leading-tight',\n    ],\n    icon: '',\n    actionArea: 'smarthr-ui-NotificationBar-actionArea -shr-my-0.5 shr-shrink-0',\n    closeButton:\n      'smarthr-ui-NotificationBar-closeButton -shr-mb-0.5 -shr-mr-0.5 -shr-mt-0.5 shr-flex-shrink-0 shr-text-black',\n  },\n  variants: {\n    /** 下地 */\n    base: {\n      none: {},\n      base: {\n        wrapper: 'shr-py-1 shr-pe-1 shr-ps-1.5',\n      },\n    },\n    /** メッセージの種類 */\n    type: {\n      info: {\n        icon: 'shr-text-grey',\n      },\n      success: {},\n      warning: {\n        icon: 'shr-text-black',\n      },\n      error: {},\n      sync: {\n        icon: 'shr-text-main',\n      },\n    },\n    /** 強調するかどうか */\n    bold: {\n      true: '',\n      false: '',\n    },\n    /** スライドインするかどうか */\n    animate: {\n      true: {\n        wrapper: 'shr-animate-[notification-bar-slide-in_0.2s_ease-out]',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      type: ['info', 'success', 'warning', 'error', 'sync'],\n      bold: false,\n      className: {\n        wrapper: 'shr-bg-white shr-text-black',\n      },\n    },\n    {\n      type: 'success',\n      bold: false,\n      className: {\n        icon: 'shr-text-main',\n      },\n    },\n    {\n      type: 'error',\n      bold: false,\n      className: {\n        icon: 'shr-text-danger',\n      },\n    },\n    {\n      type: ['info', 'sync'],\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-white',\n      },\n    },\n    {\n      type: 'success',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-main shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-main-darken focus-visible:[&]:shr-bg-main-darken',\n      },\n    },\n    {\n      type: 'warning',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-warning-yellow shr-text-black',\n        closeButton:\n          'shr-text-black hover:[&]:shr-bg-warning-yellow-darken focus-visible:[&]:shr-bg-warning-yellow-darken',\n      },\n    },\n    {\n      type: 'error',\n      bold: true,\n      className: {\n        wrapper: 'shr-bg-danger shr-text-white',\n        icon: 'shr-text-white',\n        closeButton:\n          'shr-text-white hover:[&]:shr-bg-danger-darken focus-visible:[&]:shr-bg-danger-darken',\n      },\n    },\n  ],\n})\n\ntype StyleVariants = VariantProps<typeof classNameGenerator>\ntype Props = PropsWithChildren<\n  Omit<StyleVariants, 'type'> &\n    Required<Pick<StyleVariants, 'type'>> & {\n      /** コンポーネント右の領域 */\n      subActionArea?: ReactNode\n      /** 閉じるボタン押下時に発火させる関数 */\n      onClose?: () => void\n      /** role 属性 */\n      role?: 'alert' | 'status'\n    }\n>\ntype ElementProps = Omit<ComponentPropsWithoutRef<'div'>, keyof Props>\ntype BaseProps = Pick<ComponentProps<typeof Base>, 'layer'>\ntype ActualProps = Props & ElementProps & BaseProps\n\nconst ABSTRACT_ICON_MAPPER = {\n  info: FaCircleInfoIcon,\n  success: FaCircleCheckIcon,\n  error: FaCircleExclamationIcon,\n  sync: FaRotateIcon,\n}\nconst ICON_MAPPER = {\n  normal: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: WarningIcon,\n  },\n  bold: {\n    ...ABSTRACT_ICON_MAPPER,\n    warning: FaTriangleExclamationIcon,\n  },\n} as const\n\nconst ROLE_STATUS_TYPE_REGEX = /^(info|sync)$/\n\nexport const NotificationBar: FC<ActualProps> = ({\n  type,\n  bold,\n  animate,\n  subActionArea,\n  onClose,\n  children,\n  role,\n  base,\n  layer,\n  className,\n  ...props\n}) => {\n  const actualRole = useMemo(() => {\n    if (role) {\n      return role\n    }\n\n    return ROLE_STATUS_TYPE_REGEX.test(type) ? 'status' : 'alert'\n  }, [role, type])\n  const { WrapBase, baseProps } = useMemo(\n    () =>\n      base === 'base'\n        ? {\n            WrapBase: Base,\n            baseProps: {\n              layer,\n              overflow: 'hidden' as ComponentProps<typeof Base>['overflow'],\n            },\n          }\n        : {\n            WrapBase: Fragment,\n            baseProps: {},\n          },\n    [base, layer],\n  )\n  const classNames = useMemo(() => {\n    const { wrapper, inner, messageArea, icon, actionArea, closeButton } = classNameGenerator({\n      type,\n      bold: !!bold,\n      base: base || 'none',\n    })\n\n    return {\n      wrapper: wrapper({ animate, className }),\n      inner: inner(),\n      messageArea: messageArea(),\n      icon: icon(),\n      actionArea: actionArea(),\n      closeButton: closeButton(),\n    }\n  }, [animate, base, bold, type, className])\n\n  return (\n    <WrapBase {...baseProps}>\n      <div {...props} className={classNames.wrapper} role={actualRole}>\n        <Cluster gap={1} align=\"center\" justify=\"flex-end\" className={classNames.inner}>\n          <MessageArea bold={bold} type={type} classNames={classNames}>\n            {children}\n          </MessageArea>\n          {subActionArea && (\n            <Cluster align=\"center\" justify=\"flex-end\" className={classNames.actionArea}>\n              {subActionArea}\n            </Cluster>\n          )}\n        </Cluster>\n        <CloseButton onClose={onClose} className={classNames.closeButton} />\n      </div>\n    </WrapBase>\n  )\n}\n\nconst MessageArea = memo<\n  Pick<ActualProps, 'children' | 'bold' | 'type'> & {\n    classNames: { messageArea: string; icon: string }\n  }\n>(({ children, bold, type, classNames }) => {\n  const Icon = ICON_MAPPER[bold ? 'bold' : 'normal'][type]\n\n  return (\n    <Text\n      prefixIcon={<Icon iconGap={0.5} className={classNames.icon} />}\n      className={classNames.messageArea}\n      as=\"div\"\n    >\n      {children}\n    </Text>\n  )\n})\n\nconst CloseButton = memo<Pick<ActualProps, 'onClose'> & { className: string }>(\n  ({ onClose, className }) =>\n    onClose && (\n      <Button variant=\"text\" size=\"s\" onClick={onClose} className={className}>\n        <FaXmarkIcon\n          alt={\n            <Localizer id=\"smarthr-ui/NotificationBar/closeButtonIconAlt\" defaultText=\"閉じる\" />\n          }\n        />\n      </Button>\n    ),\n)\n"]}

package/lib/components/TextLink/TextLink.js

@@ -36,7 +36,8 @@ const suffixWrapperClassName = suffixWrapper();
 const ActualTextLink = (0, react_1.forwardRef)(({ elementAs, href, target, rel, onClick, children, prefix, suffix, className, size, ...others }, ref) => {
     const Anchor = elementAs || 'a';
     const actualSuffix = (0, react_1.useMemo)(() => {
-        if (target === '_blank' && !prefix && !suffix) {
+        // target="_blank" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている
+        if (target === '_blank' && !prefix && suffix === undefined) {
             return (0, jsx_runtime_1.jsx)(OpenInNewTabIcon_1.OpenInNewTabIcon, {});
         }
         return suffix;

package/lib/components/TextLink/TextLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextLink.js","sourceRoot":"","sources":["../../../src/components/TextLink/TextLink.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type MouseEvent,\n  type PropsWithoutRef,\n  type ReactNode,\n  type Ref,\n  forwardRef,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  (keyof Props<T> & ElementRefProps<T>) | 'color'\n>\n\ntype Props<T extends ElementType> = VariantProps<typeof classNameGenerator> & {\n  /** リンクをクリックした時に発火するコールバック関数 */\n  onClick?: (e: MouseEvent) => void\n  /** テキストの前に表示するアイコン */\n  prefix?: ReactNode\n  /** テキストの後ろに表示するアイコン */\n  suffix?: ReactNode\n  /** TextLinkを利用しつつnext/linkなどと併用する場合に指定する */\n  elementAs?: T\n}\n\ntype TextLinkComponent = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst classNameGenerator = tv({\n  slots: {\n    anchor: [\n      'shr-text-link shr-no-underline shr-shadow-underline',\n      'forced-colors:shr-underline',\n      '[&:not([href])]:shr-shadow-none [&:not([href])]:forced-colors:shr-no-underline',\n      '[.smarthr-ui-Th_&]:shr-text-link-darken',\n    ],\n    prefixWrapper: 'shr-me-0.25 shr-align-middle',\n    suffixWrapper: 'shr-ms-0.25 shr-align-middle',\n  },\n  variants: {\n    size: {\n      XS: {\n        anchor: 'shr-text-xs',\n      },\n      S: {\n        anchor: 'shr-text-sm',\n      },\n      M: {\n        anchor: 'shr-text-base',\n      },\n    },\n  },\n})\nconst { anchor, prefixWrapper, suffixWrapper } = classNameGenerator()\nconst prefixWrapperClassName = prefixWrapper()\nconst suffixWrapperClassName = suffixWrapper()\n\nconst ActualTextLink: TextLinkComponent = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      elementAs,\n      href,\n      target,\n      rel,\n      onClick,\n      children,\n      prefix,\n      suffix,\n      className,\n      size,\n      ...others\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ) => {\n    const Anchor = elementAs || 'a'\n    const actualSuffix = useMemo(() => {\n      if (target === '_blank' && !prefix && !suffix) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n    const actualHref = useMemo(() => {\n      if (href) {\n        return href\n      }\n\n      if (onClick) {\n        return ''\n      }\n\n      return undefined\n    }, [href, onClick])\n    const actualRel = useMemo(\n      () => (rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel),\n      [rel, target],\n    )\n    const anchorClassName = useMemo(() => anchor({ size, className }), [size, className])\n\n    const actualOnClick = useMemo(() => {\n      if (!onClick) {\n        return undefined\n      }\n\n      if (href) {\n        return onClick\n      }\n\n      return (e: MouseEvent) => {\n        e.preventDefault()\n        onClick(e)\n      }\n    }, [onClick, href])\n\n    return (\n      <Anchor\n        {...others}\n        ref={ref}\n        href={actualHref}\n        target={target}\n        rel={actualRel}\n        onClick={actualOnClick}\n        className={anchorClassName}\n      >\n        {prefix && <span className={prefixWrapperClassName}>{prefix}</span>}\n        {children}\n        {actualSuffix && <span className={suffixWrapperClassName}>{actualSuffix}</span>}\n      </Anchor>\n    )\n  },\n)\n\nexport const TextLink = memo(ActualTextLink) as typeof ActualTextLink\n"]}
+{"version":3,"file":"TextLink.js","sourceRoot":"","sources":["../../../src/components/TextLink/TextLink.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type FC,\n  type MouseEvent,\n  type PropsWithoutRef,\n  type ReactNode,\n  type Ref,\n  forwardRef,\n  memo,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { OpenInNewTabIcon } from '../OpenInNewTabIcon'\n\nimport type { ElementRef, ElementRefProps } from '../../types'\n\ntype ElementProps<T extends ElementType> = Omit<\n  ComponentPropsWithoutRef<T>,\n  (keyof Props<T> & ElementRefProps<T>) | 'color'\n>\n\ntype Props<T extends ElementType> = VariantProps<typeof classNameGenerator> & {\n  /** リンクをクリックした時に発火するコールバック関数 */\n  onClick?: (e: MouseEvent) => void\n  /** テキストの前に表示するアイコン */\n  prefix?: ReactNode\n  /** テキストの後ろに表示するアイコン */\n  suffix?: ReactNode\n  /** TextLinkを利用しつつnext/linkなどと併用する場合に指定する */\n  elementAs?: T\n}\n\ntype TextLinkComponent = <T extends ElementType = 'a'>(\n  props: Props<T> & ElementProps<T> & ElementRefProps<T>,\n) => ReturnType<FC>\n\nconst classNameGenerator = tv({\n  slots: {\n    anchor: [\n      'shr-text-link shr-no-underline shr-shadow-underline',\n      'forced-colors:shr-underline',\n      '[&:not([href])]:shr-shadow-none [&:not([href])]:forced-colors:shr-no-underline',\n      '[.smarthr-ui-Th_&]:shr-text-link-darken',\n    ],\n    prefixWrapper: 'shr-me-0.25 shr-align-middle',\n    suffixWrapper: 'shr-ms-0.25 shr-align-middle',\n  },\n  variants: {\n    size: {\n      XS: {\n        anchor: 'shr-text-xs',\n      },\n      S: {\n        anchor: 'shr-text-sm',\n      },\n      M: {\n        anchor: 'shr-text-base',\n      },\n    },\n  },\n})\nconst { anchor, prefixWrapper, suffixWrapper } = classNameGenerator()\nconst prefixWrapperClassName = prefixWrapper()\nconst suffixWrapperClassName = suffixWrapper()\n\nconst ActualTextLink: TextLinkComponent = forwardRef(\n  <T extends ElementType = 'a'>(\n    {\n      elementAs,\n      href,\n      target,\n      rel,\n      onClick,\n      children,\n      prefix,\n      suffix,\n      className,\n      size,\n      ...others\n    }: PropsWithoutRef<Props<T>> & ElementProps<T>,\n    ref: Ref<ElementRef<T>>,\n  ) => {\n    const Anchor = elementAs || 'a'\n    const actualSuffix = useMemo(() => {\n      // target=\"_blank\" だが OpenInNewTabIcon を表示したくない場合 suffix に null を指定すれば表示しないようにしている\n      if (target === '_blank' && !prefix && suffix === undefined) {\n        return <OpenInNewTabIcon />\n      }\n\n      return suffix\n    }, [prefix, suffix, target])\n    const actualHref = useMemo(() => {\n      if (href) {\n        return href\n      }\n\n      if (onClick) {\n        return ''\n      }\n\n      return undefined\n    }, [href, onClick])\n    const actualRel = useMemo(\n      () => (rel === undefined && target === '_blank' ? 'noopener noreferrer' : rel),\n      [rel, target],\n    )\n    const anchorClassName = useMemo(() => anchor({ size, className }), [size, className])\n\n    const actualOnClick = useMemo(() => {\n      if (!onClick) {\n        return undefined\n      }\n\n      if (href) {\n        return onClick\n      }\n\n      return (e: MouseEvent) => {\n        e.preventDefault()\n        onClick(e)\n      }\n    }, [onClick, href])\n\n    return (\n      <Anchor\n        {...others}\n        ref={ref}\n        href={actualHref}\n        target={target}\n        rel={actualRel}\n        onClick={actualOnClick}\n        className={anchorClassName}\n      >\n        {prefix && <span className={prefixWrapperClassName}>{prefix}</span>}\n        {children}\n        {actualSuffix && <span className={suffixWrapperClassName}>{actualSuffix}</span>}\n      </Anchor>\n    )\n  },\n)\n\nexport const TextLink = memo(ActualTextLink) as typeof ActualTextLink\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "smarthr-ui",
   "description": "SmartHR ui components built with React.",
-  "version": "79.0.0",
+  "version": "79.2.0",
   "author": "SmartHR-UI Team",
   "dependencies": {
     "@smarthr/wareki": "^1.3.0",
@@ -18,7 +18,7 @@
     "react-transition-group": "^4.4.5",
     "tailwind-variants": "^0.3.1",
     "tailwindcss": "^3.4.18",
-    "typescript-eslint": "^8.46.0"
+    "typescript-eslint": "^8.46.2"
   },
   "devDependencies": {
     "@babel/core": "^7.28.4",