npm - smarthr-ui - Versions diffs - 98.0.0 → 98.1.1 - Mend

smarthr-ui 98.0.0 → 98.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (537) hide show

package/lib/components/AppHeader/components/mobile/UserInfo.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserInfo.cjs","sources":["../../../../../src/components/AppHeader/components/mobile/UserInfo.tsx"],"sourcesContent":["import { type FC, memo, useCallback, useMemo, useState } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { Button } from '../../../Button'\nimport { Dialog } from '../../../Dialog'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { FaGearIcon, FaGlobeIcon, FaUserLargeIcon } from '../../../Icon'\nimport { buildDisplayName } from '../../utils'\nimport { CommonButton } from '../common/CommonButton'\nimport { Translate } from '../common/Translate'\n\nimport { LanguageSelector } from './LanguageSelector'\n\nimport type { HeaderProps, UserInfoProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n iconButton: ['[&&&]:shr-border-transparent [&&]:shr-p-0.25'],\n iconButtonInner: [\n 'shr-border-shorthand shr-block shr-flex shr-items-center shr-justify-center shr-rounded-full shr-bg-white shr-p-0.25',\n ],\n dropdownUserName: ['shr-box-border shr-min-w-[246px] shr-px-1 shr-py-0.75 shr-text-sm'],\n dropdownButtonArea: ['shr-border-t-shorthand shr-p-0.5'],\n },\n})\n\ntype Props = UserInfoProps & Pick<HeaderProps, 'locale'>\n\nexport const UserInfo = memo<Props>(\n ({ email, empCode, firstName, lastName, accountUrl, locale }) => {\n const displayName = useMemo(\n () =>\n buildDisplayName({\n email,\n empCode,\n firstName,\n lastName,\n }),\n [email, empCode, firstName, lastName],\n )\n\n return displayName ? (\n <ActualUserInfo accountUrl={accountUrl} displayName={displayName} locale={locale} />\n ) : null\n },\n)\n\nconst ActualUserInfo: FC<Pick<Props, 'accountUrl' \| 'locale'> & { displayName: string }> = ({\n displayName,\n accountUrl,\n locale,\n}) => {\n const [languageDialogOpen, setLanguageDialogOpen] = useState(false)\n\n const dialogOpen = useCallback(() => setLanguageDialogOpen(true), [])\n const dialogClose = useCallback(() => setLanguageDialogOpen(false), [])\n\n const { localize } = useIntl()\n const translated = useMemo(\n () => ({\n account: localize({\n id: 'smarthr-ui/AppHeader/MobileHeader/account',\n defaultText: 'アカウント',\n }),\n userSetting: localize({\n id: 'smarthr-ui/AppHeader/userSettings',\n defaultText: '個人設定',\n }),\n }),\n [localize],\n )\n\n const classNames = useMemo(() => {\n const { iconButton, iconButtonInner, dropdownUserName, dropdownButtonArea } =\n classNameGenerator()\n\n return {\n iconButton: iconButton(),\n iconButtonInner: iconButtonInner(),\n dropdownUserName: dropdownUserName(),\n dropdownButtonArea: dropdownButtonArea(),\n }\n }, [])\n\n return (\n <>\n <Dropdown>\n <DropdownTrigger>\n <Button variant=\"skeleton\" size=\"S\" className={classNames.iconButton}>\n <span className={classNames.iconButtonInner}>\n <FaUserLargeIcon alt={translated.account} className=\"shr-fill-grey\" />\n </span>\n </Button>\n </DropdownTrigger>\n\n <DropdownContent>\n <div className={classNames.dropdownUserName}>\n <p>{displayName}</p>\n </div>\n\n {(locale \|\| accountUrl) && (\n <div className={classNames.dropdownButtonArea}>\n {locale && (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n onClick={dialogOpen}\n prefix={<FaGlobeIcon />}\n // eslint-disable-next-line smarthr/require-i18n-text\n >\n Language\n </CommonButton>\n )}\n\n {accountUrl && (\n <CommonButton\n elementAs=\"a\"\n href={accountUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n prefix={<FaGearIcon />}\n >\n <Translate>{translated.userSetting}</Translate>\n </CommonButton>\n )}\n </div>\n )}\n </DropdownContent>\n </Dropdown>\n\n {locale && (\n <Dialog isOpen={languageDialogOpen} onClickOverlay={dialogClose} width={246}>\n <LanguageSelector locale={locale} onClickClose={dialogClose} />\n </Dialog>\n )}\n </>\n )\n}\n"],"names":["tv","memo","useMemo","buildDisplayName","_jsx","useState","useCallback","useIntl","_jsxs","_Fragment","Dropdown","DropdownTrigger","Button","FaUserLargeIcon","DropdownContent","CommonButton","FaGlobeIcon","FaGearIcon","Translate","Dialog","LanguageSelector"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"UserInfo.cjs","sources":["../../../../../src/components/AppHeader/components/mobile/UserInfo.tsx"],"sourcesContent":["import { type FC, memo, useCallback, useMemo, useState } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { Button } from '../../../Button'\nimport { Dialog } from '../../../Dialog'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { FaGearIcon, FaGlobeIcon, FaUserLargeIcon } from '../../../Icon'\nimport { buildDisplayName } from '../../utils'\nimport { CommonButton } from '../common/CommonButton'\nimport { Translate } from '../common/Translate'\n\nimport { LanguageSelector } from './LanguageSelector'\n\nimport type { HeaderProps, UserInfoProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n iconButton: ['[&&&]:shr-border-transparent [&&]:shr-p-0.25'],\n iconButtonInner: [\n 'shr-border-shorthand shr-block shr-flex shr-items-center shr-justify-center shr-rounded-full shr-bg-white shr-p-0.25',\n ],\n dropdownUserName: ['shr-box-border shr-min-w-[246px] shr-px-1 shr-py-0.75 shr-text-sm'],\n dropdownButtonArea: ['shr-border-t-shorthand shr-p-0.5'],\n },\n})\n\ntype Props = UserInfoProps & Pick<HeaderProps, 'locale'>\n\nexport const UserInfo = memo<Props>(\n ({ email, empCode, firstName, lastName, accountUrl, locale }) => {\n const displayName = useMemo(\n () =>\n buildDisplayName({\n email,\n empCode,\n firstName,\n lastName,\n }),\n [email, empCode, firstName, lastName],\n )\n\n return displayName ? (\n <ActualUserInfo accountUrl={accountUrl} displayName={displayName} locale={locale} />\n ) : null\n },\n)\n\nconst ActualUserInfo: FC<Pick<Props, 'accountUrl' \| 'locale'> & { displayName: string }> = ({\n displayName,\n accountUrl,\n locale,\n}) => {\n const [languageDialogOpen, setLanguageDialogOpen] = useState(false)\n\n const dialogOpen = useCallback(() => setLanguageDialogOpen(true), [])\n const dialogClose = useCallback(() => setLanguageDialogOpen(false), [])\n\n const { localize } = useIntl()\n const translated = useMemo(\n () => ({\n account: localize({\n id: 'smarthr-ui/AppHeader/MobileHeader/account',\n defaultText: 'アカウント',\n }),\n userSetting: localize({\n id: 'smarthr-ui/AppHeader/userSettings',\n defaultText: '個人設定',\n }),\n }),\n [localize],\n )\n\n const classNames = useMemo(() => {\n const { iconButton, iconButtonInner, dropdownUserName, dropdownButtonArea } =\n classNameGenerator()\n\n return {\n iconButton: iconButton(),\n iconButtonInner: iconButtonInner(),\n dropdownUserName: dropdownUserName(),\n dropdownButtonArea: dropdownButtonArea(),\n }\n }, [])\n\n return (\n <>\n <Dropdown>\n <DropdownTrigger>\n <Button variant=\"skeleton\" size=\"S\" className={classNames.iconButton}>\n <span className={classNames.iconButtonInner}>\n <FaUserLargeIcon alt={translated.account} className=\"shr-fill-grey\" />\n </span>\n </Button>\n </DropdownTrigger>\n\n <DropdownContent>\n <div className={classNames.dropdownUserName}>\n <p>{displayName}</p>\n </div>\n\n {(locale \|\| accountUrl) && (\n <div className={classNames.dropdownButtonArea}>\n {locale && (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n onClick={dialogOpen}\n prefix={<FaGlobeIcon />}\n // eslint-disable-next-line smarthr/require-i18n-text\n >\n Language\n </CommonButton>\n )}\n\n {accountUrl && (\n <CommonButton\n elementAs=\"a\"\n href={accountUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n prefix={<FaGearIcon />}\n >\n <Translate>{translated.userSetting}</Translate>\n </CommonButton>\n )}\n </div>\n )}\n </DropdownContent>\n </Dropdown>\n\n {locale && (\n <Dialog isOpen={languageDialogOpen} onClickOverlay={dialogClose} width={246}>\n <LanguageSelector locale={locale} onClickClose={dialogClose} />\n </Dialog>\n )}\n </>\n )\n}\n"],"names":["tv","memo","useMemo","buildDisplayName","_jsx","useState","useCallback","useIntl","_jsxs","_Fragment","Dropdown","DropdownTrigger","Button","FaUserLargeIcon","DropdownContent","CommonButton","FaGlobeIcon","FaGearIcon","Translate","Dialog","LanguageSelector"],"mappings":"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"}

package/lib/components/AppHeader/components/mobile/UserInfo.js CHANGED Viewed

@@ -13,19 +13,7 @@ import { Dialog } from '../../../Dialog/Dialog.js';
 import '../../../Dialog/DialogContentInner.js';
 import 'react-dom';
 import '../../../Dialog/ControlledMessageDialog/MessageDialogContentInner.js';
-import '../../../Layout/Stack/Stack.js';
-import '../../../Layout/Cluster/Cluster.js';
-import '../../../Layout/Reel/Reel.js';
-import '../../../Layout/Sidebar/Sidebar.js';
-import '../../../Layout/Center/Center.js';
-import '../../../Layout/Container/Container.js';
-import '../../../SectioningContent/SectioningContent.js';
-import '../../../SectioningContent/levelContext.js';
-import 'styled-components';
-import '../../../Dialog/DialogBody.js';
-import '../../../ResponseMessage/ResponseMessage.js';
-import '../../../Dialog/DialogHeading.js';
-import '../../../Dialog/dialogInnerStyle.js';
+import '../../../Dialog/ControlledStepFormDialog/StepFormDialogContentInner.js';
 import '../../../Dialog/ControlledStepFormDialog/StepFormDialogProvider.js';
 import '../../../Dialog/ControlledFormDialog/FormDialogContentInner.js';
 import '../../../Dialog/ControlledActionDialog/ActionDialogContentInner.js';

package/lib/components/AppHeader/components/mobile/UserInfo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserInfo.js","sources":["../../../../../src/components/AppHeader/components/mobile/UserInfo.tsx"],"sourcesContent":["import { type FC, memo, useCallback, useMemo, useState } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { Button } from '../../../Button'\nimport { Dialog } from '../../../Dialog'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { FaGearIcon, FaGlobeIcon, FaUserLargeIcon } from '../../../Icon'\nimport { buildDisplayName } from '../../utils'\nimport { CommonButton } from '../common/CommonButton'\nimport { Translate } from '../common/Translate'\n\nimport { LanguageSelector } from './LanguageSelector'\n\nimport type { HeaderProps, UserInfoProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n iconButton: ['[&&&]:shr-border-transparent [&&]:shr-p-0.25'],\n iconButtonInner: [\n 'shr-border-shorthand shr-block shr-flex shr-items-center shr-justify-center shr-rounded-full shr-bg-white shr-p-0.25',\n ],\n dropdownUserName: ['shr-box-border shr-min-w-[246px] shr-px-1 shr-py-0.75 shr-text-sm'],\n dropdownButtonArea: ['shr-border-t-shorthand shr-p-0.5'],\n },\n})\n\ntype Props = UserInfoProps & Pick<HeaderProps, 'locale'>\n\nexport const UserInfo = memo<Props>(\n ({ email, empCode, firstName, lastName, accountUrl, locale }) => {\n const displayName = useMemo(\n () =>\n buildDisplayName({\n email,\n empCode,\n firstName,\n lastName,\n }),\n [email, empCode, firstName, lastName],\n )\n\n return displayName ? (\n <ActualUserInfo accountUrl={accountUrl} displayName={displayName} locale={locale} />\n ) : null\n },\n)\n\nconst ActualUserInfo: FC<Pick<Props, 'accountUrl' \| 'locale'> & { displayName: string }> = ({\n displayName,\n accountUrl,\n locale,\n}) => {\n const [languageDialogOpen, setLanguageDialogOpen] = useState(false)\n\n const dialogOpen = useCallback(() => setLanguageDialogOpen(true), [])\n const dialogClose = useCallback(() => setLanguageDialogOpen(false), [])\n\n const { localize } = useIntl()\n const translated = useMemo(\n () => ({\n account: localize({\n id: 'smarthr-ui/AppHeader/MobileHeader/account',\n defaultText: 'アカウント',\n }),\n userSetting: localize({\n id: 'smarthr-ui/AppHeader/userSettings',\n defaultText: '個人設定',\n }),\n }),\n [localize],\n )\n\n const classNames = useMemo(() => {\n const { iconButton, iconButtonInner, dropdownUserName, dropdownButtonArea } =\n classNameGenerator()\n\n return {\n iconButton: iconButton(),\n iconButtonInner: iconButtonInner(),\n dropdownUserName: dropdownUserName(),\n dropdownButtonArea: dropdownButtonArea(),\n }\n }, [])\n\n return (\n <>\n <Dropdown>\n <DropdownTrigger>\n <Button variant=\"skeleton\" size=\"S\" className={classNames.iconButton}>\n <span className={classNames.iconButtonInner}>\n <FaUserLargeIcon alt={translated.account} className=\"shr-fill-grey\" />\n </span>\n </Button>\n </DropdownTrigger>\n\n <DropdownContent>\n <div className={classNames.dropdownUserName}>\n <p>{displayName}</p>\n </div>\n\n {(locale \|\| accountUrl) && (\n <div className={classNames.dropdownButtonArea}>\n {locale && (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n onClick={dialogOpen}\n prefix={<FaGlobeIcon />}\n // eslint-disable-next-line smarthr/require-i18n-text\n >\n Language\n </CommonButton>\n )}\n\n {accountUrl && (\n <CommonButton\n elementAs=\"a\"\n href={accountUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n prefix={<FaGearIcon />}\n >\n <Translate>{translated.userSetting}</Translate>\n </CommonButton>\n )}\n </div>\n )}\n </DropdownContent>\n </Dropdown>\n\n {locale && (\n <Dialog isOpen={languageDialogOpen} onClickOverlay={dialogClose} width={246}>\n <LanguageSelector locale={locale} onClickClose={dialogClose} />\n </Dialog>\n )}\n </>\n )\n}\n"],"names":["tv","_jsx","_jsxs","_Fragment"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"UserInfo.js","sources":["../../../../../src/components/AppHeader/components/mobile/UserInfo.tsx"],"sourcesContent":["import { type FC, memo, useCallback, useMemo, useState } from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useIntl } from '../../../../intl'\nimport { Button } from '../../../Button'\nimport { Dialog } from '../../../Dialog'\nimport { Dropdown, DropdownContent, DropdownTrigger } from '../../../Dropdown'\nimport { FaGearIcon, FaGlobeIcon, FaUserLargeIcon } from '../../../Icon'\nimport { buildDisplayName } from '../../utils'\nimport { CommonButton } from '../common/CommonButton'\nimport { Translate } from '../common/Translate'\n\nimport { LanguageSelector } from './LanguageSelector'\n\nimport type { HeaderProps, UserInfoProps } from '../../types'\n\nconst classNameGenerator = tv({\n slots: {\n iconButton: ['[&&&]:shr-border-transparent [&&]:shr-p-0.25'],\n iconButtonInner: [\n 'shr-border-shorthand shr-block shr-flex shr-items-center shr-justify-center shr-rounded-full shr-bg-white shr-p-0.25',\n ],\n dropdownUserName: ['shr-box-border shr-min-w-[246px] shr-px-1 shr-py-0.75 shr-text-sm'],\n dropdownButtonArea: ['shr-border-t-shorthand shr-p-0.5'],\n },\n})\n\ntype Props = UserInfoProps & Pick<HeaderProps, 'locale'>\n\nexport const UserInfo = memo<Props>(\n ({ email, empCode, firstName, lastName, accountUrl, locale }) => {\n const displayName = useMemo(\n () =>\n buildDisplayName({\n email,\n empCode,\n firstName,\n lastName,\n }),\n [email, empCode, firstName, lastName],\n )\n\n return displayName ? (\n <ActualUserInfo accountUrl={accountUrl} displayName={displayName} locale={locale} />\n ) : null\n },\n)\n\nconst ActualUserInfo: FC<Pick<Props, 'accountUrl' \| 'locale'> & { displayName: string }> = ({\n displayName,\n accountUrl,\n locale,\n}) => {\n const [languageDialogOpen, setLanguageDialogOpen] = useState(false)\n\n const dialogOpen = useCallback(() => setLanguageDialogOpen(true), [])\n const dialogClose = useCallback(() => setLanguageDialogOpen(false), [])\n\n const { localize } = useIntl()\n const translated = useMemo(\n () => ({\n account: localize({\n id: 'smarthr-ui/AppHeader/MobileHeader/account',\n defaultText: 'アカウント',\n }),\n userSetting: localize({\n id: 'smarthr-ui/AppHeader/userSettings',\n defaultText: '個人設定',\n }),\n }),\n [localize],\n )\n\n const classNames = useMemo(() => {\n const { iconButton, iconButtonInner, dropdownUserName, dropdownButtonArea } =\n classNameGenerator()\n\n return {\n iconButton: iconButton(),\n iconButtonInner: iconButtonInner(),\n dropdownUserName: dropdownUserName(),\n dropdownButtonArea: dropdownButtonArea(),\n }\n }, [])\n\n return (\n <>\n <Dropdown>\n <DropdownTrigger>\n <Button variant=\"skeleton\" size=\"S\" className={classNames.iconButton}>\n <span className={classNames.iconButtonInner}>\n <FaUserLargeIcon alt={translated.account} className=\"shr-fill-grey\" />\n </span>\n </Button>\n </DropdownTrigger>\n\n <DropdownContent>\n <div className={classNames.dropdownUserName}>\n <p>{displayName}</p>\n </div>\n\n {(locale \|\| accountUrl) && (\n <div className={classNames.dropdownButtonArea}>\n {locale && (\n <CommonButton\n elementAs=\"button\"\n type=\"button\"\n onClick={dialogOpen}\n prefix={<FaGlobeIcon />}\n // eslint-disable-next-line smarthr/require-i18n-text\n >\n Language\n </CommonButton>\n )}\n\n {accountUrl && (\n <CommonButton\n elementAs=\"a\"\n href={accountUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n prefix={<FaGearIcon />}\n >\n <Translate>{translated.userSetting}</Translate>\n </CommonButton>\n )}\n </div>\n )}\n </DropdownContent>\n </Dropdown>\n\n {locale && (\n <Dialog isOpen={languageDialogOpen} onClickOverlay={dialogClose} width={246}>\n <LanguageSelector locale={locale} onClickClose={dialogClose} />\n </Dialog>\n )}\n </>\n )\n}\n"],"names":["tv","_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/lib/components/Browser/Browser.cjs CHANGED Viewed

@@ -3,6 +3,7 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var index = require('./../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.17_@types_node@20.19.35_typescript@5.9.3__/vendor/tailwind-variants/dist/index.cjs');
+var hooks_useLatest = require('../../hooks/useLatest.cjs');
 var components_Browser_BrowserColumn = require('./BrowserColumn.cjs');
 var components_Browser_models_ItemNode = require('./models/ItemNode.cjs');
 var components_Browser_models_RootNode = require('./models/RootNode.cjs');
@@ -51,14 +52,11 @@ const Browser = ({ value, items, onSelectItem, className, ...rest }) => {
             return [];
         return [...node.getAncestors().map((n) => n.value), node.value];
     }, [rootNode, value]);
-    const unstableRef = React.useRef({ onSelectItem, value, rootNode });
-    unstableRef.current = { onSelectItem, value, rootNode };
+    const latest = hooks_useLatest.useLatest({ onSelectItem, value, rootNode });
     // FIXME: focusメソッドのfocusVisibleが主要ブラウザでサポートされたら使うようにしたい(現状ではマウスクリックでもfocusのoutlineが出てしまう)
     // https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/focus
     const onDelegateKeyDown = React.useCallback((e) => {
-        const selectedNode = unstableRef.current.value
-            ? unstableRef.current.rootNode.findByValue(unstableRef.current.value)
-            : undefined;
+        const selectedNode = latest.value ? latest.rootNode.findByValue(latest.value) : undefined;
         if (!selectedNode) {
             return;
         }
@@ -88,13 +86,13 @@ const Browser = ({ value, items, onSelectItem, className, ...rest }) => {
         }
         if (target) {
             e.preventDefault();
-            unstableRef.current.onSelectItem?.(target.value);
+            latest.onSelectItem?.(target.value);
             document.getElementById(components_Browser_utils.getElementIdFromNode(target.value))?.focus();
         }
-    }, []);
+    }, [latest]);
     const onChangeInput = React.useCallback((e) => {
-        unstableRef.current.onSelectItem?.(e.currentTarget.value);
-    }, []);
+        latest.onSelectItem?.(e.currentTarget.value);
+    }, [latest]);
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     jsxRuntime.jsx("div", { ...rest, role: "application", onKeyDown: onDelegateKeyDown, className: classNames.wrapper, children: columns.map((colItems, index) => (jsxRuntime.jsx(components_Browser_BrowserColumn.BrowserColumn, { items: colItems, index: index, value: selectedPath[index], onChangeInput: onSelectItem ? onChangeInput : undefined, className: classNames.column }, index))) }));

package/lib/components/Browser/Browser.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Browser.cjs","sources":["../../../src/components/Browser/Browser.tsx"],"sourcesContent":["import {\n type ChangeEvent,\n type ComponentProps,\n type FC,\n type KeyboardEventHandler,\n useCallback,\n useMemo,\n ~~useRef,\n~~} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { BrowserColumn } from './BrowserColumn'\nimport { ItemNode, type ItemNodeLike, RootNode } from './models'\nimport { getElementIdFromNode } from './utils'\n\nconst classNameGenerator = tv({\n slots: {\n wrapper: ['smarthr-ui-Browser', 'shr-flex'],\n column: ['shr-min-w-[13em] shr-list-none', '[&_+_&]:shr-border-l-shorthand'],\n },\n variants: {\n maxColumn: {\n 1: {\n column: 'shr-max-w-[theme(width.1/3)]',\n },\n 2: {},\n 3: {},\n },\n },\n compoundVariants: [\n {\n maxColumn: [2, 3],\n className: {\n column: 'last:shr-grow',\n },\n },\n ],\n})\n\ntype AbstractProps = {\n /** 表示する item の配列 /\n items: ItemNodeLike[]\n /* 選択中の item の値 /\n value?: string\n /* 選択された際に呼び出されるコールバック。第一引数に item の value を取る。 */\n onSelectItem?: (value: string) => void\n}\ntype Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>\n\nexport const Browser: FC<Props> = ({ value, items, onSelectItem, className, ...rest }) => {\n const rootNode = useMemo(() => RootNode.from({ children: items }), [items])\n const columns = useMemo(() => rootNode.toViewData(value), [rootNode, value])\n\n const classNames = useMemo(() => {\n const { wrapper, column } = classNameGenerator({ className })\n return {\n wrapper: wrapper(),\n column: column({\n maxColumn: columns.length as 1 \| 2 \| 3,\n }),\n }\n }, [className, columns.length])\n\n const selectedPath = useMemo(() => {\n if (!value) return []\n const node = rootNode.findByValue(value)\n if (!node) return []\n return [...node.getAncestors().map((n) => n.value), node.value]\n }, [rootNode, value])\n\n const ~~unstableRef~~ = ~~useRef~~({ onSelectItem, value, rootNode })\n ~~unstableRef.current = { onSelectItem, value, rootNode }~~\n\n // FIXME: focusメソッドのfocusVisibleが主要ブラウザでサポートされたら使うようにしたい(現状ではマウスクリックでもfocusのoutlineが出てしまう)\n // https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/focus\n const onDelegateKeyDown: KeyboardEventHandler = useCallback((e) => {\n const selectedNode = ~~unstableRef~~.~~current.~~value\n ? ~~unstableRef~~.~~current.~~rootNode.findByValue(~~unstableRef~~.~~current.~~value)\n : undefined\n\n if (!selectedNode) {\n return\n }\n\n let target: ItemNode \| undefined = undefined\n\n switch (e.key) {\n case 'ArrowUp': {\n target = selectedNode.getPrev() ?? selectedNode.parent?.getLastChild()\n\n break\n }\n case 'ArrowDown': {\n target = selectedNode.getNext() ?? selectedNode.parent?.getFirstChild()\n\n break\n }\n case 'ArrowLeft': {\n const node = selectedNode.parent\n\n if (node instanceof ItemNode) {\n target = node\n }\n\n break\n }\n case 'ArrowRight':\n case 'Enter':\n case ' ': {\n target = selectedNode.getFirstChild()\n\n break\n }\n }\n\n if (target) {\n e.preventDefault()\n ~~unstableRef~~.~~current.~~onSelectItem?.(target.value)\n document.getElementById(getElementIdFromNode(target.value))?.focus()\n }\n }, [])\n\n const onChangeInput = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n ~~unstableRef~~.~~current.~~onSelectItem?.(e.currentTarget.value)\n }, [])\n\n return (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <div {...rest} role=\"application\" onKeyDown={onDelegateKeyDown} className={classNames.wrapper}>\n {columns.map((colItems, index) => (\n <BrowserColumn\n key={index}\n items={colItems}\n index={index}\n value={selectedPath[index]}\n onChangeInput={onSelectItem ? onChangeInput : undefined}\n className={classNames.column}\n />\n ))}\n </div>\n )\n}\n"],"names":["tv","useMemo","RootNode","~~useRef~~","useCallback","ItemNode","getElementIdFromNode","_jsx","BrowserColumn"],"mappings":"~~;;;;;;;;;;AAeA~~,MAAM,kBAAkB,GAAGA,QAAE,CAAC;AAC5B,IAAA,KAAK,EAAE;AACL,QAAA,OAAO,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC;AAC3C,QAAA,MAAM,EAAE,CAAC,gCAAgC,EAAE,gCAAgC,CAAC;AAC7E,KAAA;AACD,IAAA,QAAQ,EAAE;AACR,QAAA,SAAS,EAAE;AACT,YAAA,CAAC,EAAE;AACD,gBAAA,MAAM,EAAE,8BAA8B;AACvC,aAAA;AACD,YAAA,CAAC,EAAE,EAAE;AACL,YAAA,CAAC,EAAE,EAAE;AACN,SAAA;AACF,KAAA;AACD,IAAA,gBAAgB,EAAE;AAChB,QAAA;AACE,YAAA,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;AACjB,YAAA,SAAS,EAAE;AACT,gBAAA,MAAM,EAAE,eAAe;AACxB,aAAA;AACF,SAAA;AACF,KAAA;AACF,CAAA,CAAC;AAYK,MAAM,OAAO,GAAc,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,KAAI;IACvF,MAAM,QAAQ,GAAGC,aAAO,CAAC,MAAMC,2CAAQ,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAC3E,MAAM,OAAO,GAAGD,aAAO,CAAC,MAAM,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AAE5E,IAAA,MAAM,UAAU,GAAGA,aAAO,CAAC,MAAK;AAC9B,QAAA,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,kBAAkB,CAAC,EAAE,SAAS,EAAE,CAAC;QAC7D,OAAO;YACL,OAAO,EAAE,OAAO,EAAE;YAClB,MAAM,EAAE,MAAM,CAAC;gBACb,SAAS,EAAE,OAAO,CAAC,MAAmB;aACvC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;AAE/B,IAAA,MAAM,YAAY,GAAGA,aAAO,CAAC,MAAK;AAChC,QAAA,IAAI,CAAC,KAAK;AAAE,YAAA,OAAO,EAAE;QACrB,MAAM,IAAI,GAAG,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC;AACxC,QAAA,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,EAAE;QACpB,OAAO,CAAC,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC;AACjE,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AAErB,IAAA,MAAM,~~WAAW~~,GAAGE,~~YAAM~~,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC~~;IAC7D,WAAW,CAAC,OAAO,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE~~;;;~~AAIvD~~,IAAA,MAAM,iBAAiB,GAAyBC,iBAAW,~~CAAC~~,CAAC,CAAC,KAAI;~~AAChE~~,~~QAAA,~~MAAM,YAAY,GAAG,~~WAAW~~,CAAC,~~OAAO~~,~~CAAC;AACvC~~,~~cAAE~~,~~WAAW,~~CAAC,~~OAAO,CAAC,~~QAAQ,CAAC,WAAW,CAAC,~~WAAW~~,CAAC,~~OAAO~~,CAAC,~~KAAK;cAClE~~,SAAS;~~QAEb~~,IAAI,CAAC,YAAY,EAAE;YACjB;QACF;QAEA,IAAI,MAAM,GAAyB,SAAS;AAE5C,QAAA,QAAQ,CAAC,CAAC,GAAG;YACX,KAAK,SAAS,EAAE;AACd,gBAAA,MAAM,GAAG,YAAY,CAAC,OAAO,EAAE,IAAI,YAAY,CAAC,MAAM,EAAE,YAAY,EAAE;gBAEtE;YACF;YACA,KAAK,WAAW,EAAE;AAChB,gBAAA,MAAM,GAAG,YAAY,CAAC,OAAO,EAAE,IAAI,YAAY,CAAC,MAAM,EAAE,aAAa,EAAE;gBAEvE;YACF;YACA,KAAK,WAAW,EAAE;AAChB,gBAAA,MAAM,IAAI,GAAG,YAAY,CAAC,MAAM;AAEhC,gBAAA,IAAI,IAAI,YAAYC,2CAAQ,EAAE;oBAC5B,MAAM,GAAG,IAAI;gBACf;gBAEA;YACF;AACA,YAAA,KAAK,YAAY;AACjB,YAAA,KAAK,OAAO;YACZ,KAAK,GAAG,EAAE;AACR,gBAAA,MAAM,GAAG,YAAY,CAAC,aAAa,EAAE;gBAErC;YACF;;QAGF,IAAI,MAAM,EAAE;YACV,CAAC,CAAC,cAAc,EAAE;YAClB,~~WAAW~~,CAAC,~~OAAO,CAAC,~~YAAY,GAAG,MAAM,CAAC,KAAK,CAAC;~~AAChD~~,YAAA,QAAQ,CAAC,cAAc,CAACC,6CAAoB,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE;QACtE;~~IACF~~,CAAC,~~EAAE~~,~~EAAE~~,CAAC;~~AAEN~~,IAAA,MAAM,aAAa,GAAGF,iBAAW,~~CAAC~~,CAAC,CAAgC,KAAI;~~AACrE~~,~~QAAA~~,~~WAAW,~~CAAC,~~OAAO,CAAC,~~YAAY,GAAG,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC;~~IAC3D~~,CAAC,~~EAAE~~,~~EAAE~~,CAAC;~~IAEN~~;;AAEE,IAAAG,cAAA,CAAA,KAAA,EAAA,EAAA,GAAS,IAAI,EAAE,IAAI,EAAC,aAAa,EAAC,SAAS,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,CAAC,OAAO,EAAA,QAAA,EAC1F,OAAO,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK,MAC3BA,cAAA,CAACC,8CAAa,EAAA,EAEZ,KAAK,EAAE,QAAQ,EACf,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,EAC1B,aAAa,EAAE,YAAY,GAAG,aAAa,GAAG,SAAS,EACvD,SAAS,EAAE,UAAU,CAAC,MAAM,EAAA,EALvB,KAAK,CAMV,CACH,CAAC,EAAA,CACE;AAEV;;;;"}
1	+ {"version":3,"file":"Browser.cjs","sources":["../../../src/components/Browser/Browser.tsx"],"sourcesContent":["import {\n type ChangeEvent,\n type ComponentProps,\n type FC,\n type KeyboardEventHandler,\n useCallback,\n useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useLatest } from '../../hooks/useLatest'\n\nimport { BrowserColumn } from './BrowserColumn'\nimport { ItemNode, type ItemNodeLike, RootNode } from './models'\nimport { getElementIdFromNode } from './utils'\n\nconst classNameGenerator = tv({\n slots: {\n wrapper: ['smarthr-ui-Browser', 'shr-flex'],\n column: ['shr-min-w-[13em] shr-list-none', '[&_+_&]:shr-border-l-shorthand'],\n },\n variants: {\n maxColumn: {\n 1: {\n column: 'shr-max-w-[theme(width.1/3)]',\n },\n 2: {},\n 3: {},\n },\n },\n compoundVariants: [\n {\n maxColumn: [2, 3],\n className: {\n column: 'last:shr-grow',\n },\n },\n ],\n})\n\ntype AbstractProps = {\n /** 表示する item の配列 /\n items: ItemNodeLike[]\n /* 選択中の item の値 /\n value?: string\n /* 選択された際に呼び出されるコールバック。第一引数に item の value を取る。 */\n onSelectItem?: (value: string) => void\n}\ntype Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>\n\nexport const Browser: FC<Props> = ({ value, items, onSelectItem, className, ...rest }) => {\n const rootNode = useMemo(() => RootNode.from({ children: items }), [items])\n const columns = useMemo(() => rootNode.toViewData(value), [rootNode, value])\n\n const classNames = useMemo(() => {\n const { wrapper, column } = classNameGenerator({ className })\n return {\n wrapper: wrapper(),\n column: column({\n maxColumn: columns.length as 1 \| 2 \| 3,\n }),\n }\n }, [className, columns.length])\n\n const selectedPath = useMemo(() => {\n if (!value) return []\n const node = rootNode.findByValue(value)\n if (!node) return []\n return [...node.getAncestors().map((n) => n.value), node.value]\n }, [rootNode, value])\n\n const latest = useLatest({ onSelectItem, value, rootNode })\n\n // FIXME: focusメソッドのfocusVisibleが主要ブラウザでサポートされたら使うようにしたい(現状ではマウスクリックでもfocusのoutlineが出てしまう)\n // https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/focus\n const onDelegateKeyDown: KeyboardEventHandler = useCallback(\n (e) => {\n const selectedNode = latest.value ? latest.rootNode.findByValue(latest.value) : undefined\n\n if (!selectedNode) {\n return\n }\n\n let target: ItemNode \| undefined = undefined\n\n switch (e.key) {\n case 'ArrowUp': {\n target = selectedNode.getPrev() ?? selectedNode.parent?.getLastChild()\n\n break\n }\n case 'ArrowDown': {\n target = selectedNode.getNext() ?? selectedNode.parent?.getFirstChild()\n\n break\n }\n case 'ArrowLeft': {\n const node = selectedNode.parent\n\n if (node instanceof ItemNode) {\n target = node\n }\n\n break\n }\n case 'ArrowRight':\n case 'Enter':\n case ' ': {\n target = selectedNode.getFirstChild()\n\n break\n }\n }\n\n if (target) {\n e.preventDefault()\n latest.onSelectItem?.(target.value)\n document.getElementById(getElementIdFromNode(target.value))?.focus()\n }\n },\n [latest],\n )\n\n const onChangeInput = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n latest.onSelectItem?.(e.currentTarget.value)\n },\n [latest],\n )\n\n return (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <div {...rest} role=\"application\" onKeyDown={onDelegateKeyDown} className={classNames.wrapper}>\n {columns.map((colItems, index) => (\n <BrowserColumn\n key={index}\n items={colItems}\n index={index}\n value={selectedPath[index]}\n onChangeInput={onSelectItem ? onChangeInput : undefined}\n className={classNames.column}\n />\n ))}\n </div>\n )\n}\n"],"names":["tv","useMemo","RootNode","useLatest","useCallback","ItemNode","getElementIdFromNode","_jsx","BrowserColumn"],"mappings":"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"}

package/lib/components/Browser/Browser.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
-import { useMemo, useRef, useCallback } from 'react';
+import { useMemo, useCallback } from 'react';
 import { tv as ce } from './../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.17_@types_node@20.19.35_typescript@5.9.3__/vendor/tailwind-variants/dist/index.js';
+import { useLatest } from '../../hooks/useLatest.js';
 import { BrowserColumn } from './BrowserColumn.js';
 import { ItemNode } from './models/ItemNode.js';
 import { RootNode } from './models/RootNode.js';
@@ -49,14 +50,11 @@ const Browser = ({ value, items, onSelectItem, className, ...rest }) => {
             return [];
         return [...node.getAncestors().map((n) => n.value), node.value];
     }, [rootNode, value]);
-    const unstableRef = useRef({ onSelectItem, value, rootNode });
-    unstableRef.current = { onSelectItem, value, rootNode };
+    const latest = useLatest({ onSelectItem, value, rootNode });
     // FIXME: focusメソッドのfocusVisibleが主要ブラウザでサポートされたら使うようにしたい(現状ではマウスクリックでもfocusのoutlineが出てしまう)
     // https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/focus
     const onDelegateKeyDown = useCallback((e) => {
-        const selectedNode = unstableRef.current.value
-            ? unstableRef.current.rootNode.findByValue(unstableRef.current.value)
-            : undefined;
+        const selectedNode = latest.value ? latest.rootNode.findByValue(latest.value) : undefined;
         if (!selectedNode) {
             return;
         }
@@ -86,13 +84,13 @@ const Browser = ({ value, items, onSelectItem, className, ...rest }) => {
         }
         if (target) {
             e.preventDefault();
-            unstableRef.current.onSelectItem?.(target.value);
+            latest.onSelectItem?.(target.value);
             document.getElementById(getElementIdFromNode(target.value))?.focus();
         }
-    }, []);
+    }, [latest]);
     const onChangeInput = useCallback((e) => {
-        unstableRef.current.onSelectItem?.(e.currentTarget.value);
-    }, []);
+        latest.onSelectItem?.(e.currentTarget.value);
+    }, [latest]);
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     jsx("div", { ...rest, role: "application", onKeyDown: onDelegateKeyDown, className: classNames.wrapper, children: columns.map((colItems, index) => (jsx(BrowserColumn, { items: colItems, index: index, value: selectedPath[index], onChangeInput: onSelectItem ? onChangeInput : undefined, className: classNames.column }, index))) }));

package/lib/components/Browser/Browser.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Browser.js","sources":["../../../src/components/Browser/Browser.tsx"],"sourcesContent":["import {\n type ChangeEvent,\n type ComponentProps,\n type FC,\n type KeyboardEventHandler,\n useCallback,\n useMemo,\n ~~useRef,\n~~} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { BrowserColumn } from './BrowserColumn'\nimport { ItemNode, type ItemNodeLike, RootNode } from './models'\nimport { getElementIdFromNode } from './utils'\n\nconst classNameGenerator = tv({\n slots: {\n wrapper: ['smarthr-ui-Browser', 'shr-flex'],\n column: ['shr-min-w-[13em] shr-list-none', '[&_+_&]:shr-border-l-shorthand'],\n },\n variants: {\n maxColumn: {\n 1: {\n column: 'shr-max-w-[theme(width.1/3)]',\n },\n 2: {},\n 3: {},\n },\n },\n compoundVariants: [\n {\n maxColumn: [2, 3],\n className: {\n column: 'last:shr-grow',\n },\n },\n ],\n})\n\ntype AbstractProps = {\n /** 表示する item の配列 /\n items: ItemNodeLike[]\n /* 選択中の item の値 /\n value?: string\n /* 選択された際に呼び出されるコールバック。第一引数に item の value を取る。 */\n onSelectItem?: (value: string) => void\n}\ntype Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>\n\nexport const Browser: FC<Props> = ({ value, items, onSelectItem, className, ...rest }) => {\n const rootNode = useMemo(() => RootNode.from({ children: items }), [items])\n const columns = useMemo(() => rootNode.toViewData(value), [rootNode, value])\n\n const classNames = useMemo(() => {\n const { wrapper, column } = classNameGenerator({ className })\n return {\n wrapper: wrapper(),\n column: column({\n maxColumn: columns.length as 1 \| 2 \| 3,\n }),\n }\n }, [className, columns.length])\n\n const selectedPath = useMemo(() => {\n if (!value) return []\n const node = rootNode.findByValue(value)\n if (!node) return []\n return [...node.getAncestors().map((n) => n.value), node.value]\n }, [rootNode, value])\n\n const ~~unstableRef~~ = ~~useRef~~({ onSelectItem, value, rootNode })\n ~~unstableRef.current = { onSelectItem, value, rootNode }~~\n\n // FIXME: focusメソッドのfocusVisibleが主要ブラウザでサポートされたら使うようにしたい(現状ではマウスクリックでもfocusのoutlineが出てしまう)\n // https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/focus\n const onDelegateKeyDown: KeyboardEventHandler = useCallback((e) => {\n const selectedNode = ~~unstableRef~~.~~current.~~value\n ? ~~unstableRef~~.~~current.~~rootNode.findByValue(~~unstableRef~~.~~current.~~value)\n : undefined\n\n if (!selectedNode) {\n return\n }\n\n let target: ItemNode \| undefined = undefined\n\n switch (e.key) {\n case 'ArrowUp': {\n target = selectedNode.getPrev() ?? selectedNode.parent?.getLastChild()\n\n break\n }\n case 'ArrowDown': {\n target = selectedNode.getNext() ?? selectedNode.parent?.getFirstChild()\n\n break\n }\n case 'ArrowLeft': {\n const node = selectedNode.parent\n\n if (node instanceof ItemNode) {\n target = node\n }\n\n break\n }\n case 'ArrowRight':\n case 'Enter':\n case ' ': {\n target = selectedNode.getFirstChild()\n\n break\n }\n }\n\n if (target) {\n e.preventDefault()\n ~~unstableRef~~.~~current.~~onSelectItem?.(target.value)\n document.getElementById(getElementIdFromNode(target.value))?.focus()\n }\n }, [])\n\n const onChangeInput = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n ~~unstableRef~~.~~current.~~onSelectItem?.(e.currentTarget.value)\n }, [])\n\n return (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <div {...rest} role=\"application\" onKeyDown={onDelegateKeyDown} className={classNames.wrapper}>\n {columns.map((colItems, index) => (\n <BrowserColumn\n key={index}\n items={colItems}\n index={index}\n value={selectedPath[index]}\n onChangeInput={onSelectItem ? onChangeInput : undefined}\n className={classNames.column}\n />\n ))}\n </div>\n )\n}\n"],"names":["tv","_jsx"],"mappings":"~~;;;;;;;;AAeA~~,MAAM,kBAAkB,GAAGA,EAAE,CAAC;AAC5B,IAAA,KAAK,EAAE;AACL,QAAA,OAAO,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC;AAC3C,QAAA,MAAM,EAAE,CAAC,gCAAgC,EAAE,gCAAgC,CAAC;AAC7E,KAAA;AACD,IAAA,QAAQ,EAAE;AACR,QAAA,SAAS,EAAE;AACT,YAAA,CAAC,EAAE;AACD,gBAAA,MAAM,EAAE,8BAA8B;AACvC,aAAA;AACD,YAAA,CAAC,EAAE,EAAE;AACL,YAAA,CAAC,EAAE,EAAE;AACN,SAAA;AACF,KAAA;AACD,IAAA,gBAAgB,EAAE;AAChB,QAAA;AACE,YAAA,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;AACjB,YAAA,SAAS,EAAE;AACT,gBAAA,MAAM,EAAE,eAAe;AACxB,aAAA;AACF,SAAA;AACF,KAAA;AACF,CAAA,CAAC;AAYK,MAAM,OAAO,GAAc,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,KAAI;IACvF,MAAM,QAAQ,GAAG,OAAO,CAAC,MAAM,QAAQ,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAC3E,MAAM,OAAO,GAAG,OAAO,CAAC,MAAM,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AAE5E,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAK;AAC9B,QAAA,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,kBAAkB,CAAC,EAAE,SAAS,EAAE,CAAC;QAC7D,OAAO;YACL,OAAO,EAAE,OAAO,EAAE;YAClB,MAAM,EAAE,MAAM,CAAC;gBACb,SAAS,EAAE,OAAO,CAAC,MAAmB;aACvC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;AAE/B,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,MAAK;AAChC,QAAA,IAAI,CAAC,KAAK;AAAE,YAAA,OAAO,EAAE;QACrB,MAAM,IAAI,GAAG,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC;AACxC,QAAA,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,EAAE;QACpB,OAAO,CAAC,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC;AACjE,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AAErB,IAAA,MAAM,~~WAAW~~,GAAG,~~MAAM~~,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC~~;IAC7D,WAAW,CAAC,OAAO,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE~~;;;~~AAIvD~~,IAAA,MAAM,iBAAiB,GAAyB,WAAW,~~CAAC~~,CAAC,CAAC,KAAI;~~AAChE~~,~~QAAA,~~MAAM,YAAY,GAAG,~~WAAW~~,CAAC,~~OAAO~~,~~CAAC;AACvC~~,~~cAAE~~,~~WAAW,~~CAAC,~~OAAO,CAAC,~~QAAQ,CAAC,WAAW,CAAC,~~WAAW~~,CAAC,~~OAAO~~,CAAC,~~KAAK;cAClE~~,SAAS;~~QAEb~~,IAAI,CAAC,YAAY,EAAE;YACjB;QACF;QAEA,IAAI,MAAM,GAAyB,SAAS;AAE5C,QAAA,QAAQ,CAAC,CAAC,GAAG;YACX,KAAK,SAAS,EAAE;AACd,gBAAA,MAAM,GAAG,YAAY,CAAC,OAAO,EAAE,IAAI,YAAY,CAAC,MAAM,EAAE,YAAY,EAAE;gBAEtE;YACF;YACA,KAAK,WAAW,EAAE;AAChB,gBAAA,MAAM,GAAG,YAAY,CAAC,OAAO,EAAE,IAAI,YAAY,CAAC,MAAM,EAAE,aAAa,EAAE;gBAEvE;YACF;YACA,KAAK,WAAW,EAAE;AAChB,gBAAA,MAAM,IAAI,GAAG,YAAY,CAAC,MAAM;AAEhC,gBAAA,IAAI,IAAI,YAAY,QAAQ,EAAE;oBAC5B,MAAM,GAAG,IAAI;gBACf;gBAEA;YACF;AACA,YAAA,KAAK,YAAY;AACjB,YAAA,KAAK,OAAO;YACZ,KAAK,GAAG,EAAE;AACR,gBAAA,MAAM,GAAG,YAAY,CAAC,aAAa,EAAE;gBAErC;YACF;;QAGF,IAAI,MAAM,EAAE;YACV,CAAC,CAAC,cAAc,EAAE;YAClB,~~WAAW~~,CAAC,~~OAAO,CAAC,~~YAAY,GAAG,MAAM,CAAC,KAAK,CAAC;~~AAChD~~,YAAA,QAAQ,CAAC,cAAc,CAAC,oBAAoB,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE;QACtE;~~IACF~~,CAAC,~~EAAE~~,~~EAAE~~,CAAC;~~AAEN~~,IAAA,MAAM,aAAa,GAAG,WAAW,~~CAAC~~,CAAC,CAAgC,KAAI;~~AACrE~~,~~QAAA~~,~~WAAW,~~CAAC,~~OAAO,CAAC,~~YAAY,GAAG,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC;~~IAC3D~~,CAAC,~~EAAE~~,~~EAAE~~,CAAC;~~IAEN~~;;AAEE,IAAAC,GAAA,CAAA,KAAA,EAAA,EAAA,GAAS,IAAI,EAAE,IAAI,EAAC,aAAa,EAAC,SAAS,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,CAAC,OAAO,EAAA,QAAA,EAC1F,OAAO,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK,MAC3BA,GAAA,CAAC,aAAa,EAAA,EAEZ,KAAK,EAAE,QAAQ,EACf,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,EAC1B,aAAa,EAAE,YAAY,GAAG,aAAa,GAAG,SAAS,EACvD,SAAS,EAAE,UAAU,CAAC,MAAM,EAAA,EALvB,KAAK,CAMV,CACH,CAAC,EAAA,CACE;AAEV;;;;"}
1	+ {"version":3,"file":"Browser.js","sources":["../../../src/components/Browser/Browser.tsx"],"sourcesContent":["import {\n type ChangeEvent,\n type ComponentProps,\n type FC,\n type KeyboardEventHandler,\n useCallback,\n useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { useLatest } from '../../hooks/useLatest'\n\nimport { BrowserColumn } from './BrowserColumn'\nimport { ItemNode, type ItemNodeLike, RootNode } from './models'\nimport { getElementIdFromNode } from './utils'\n\nconst classNameGenerator = tv({\n slots: {\n wrapper: ['smarthr-ui-Browser', 'shr-flex'],\n column: ['shr-min-w-[13em] shr-list-none', '[&_+_&]:shr-border-l-shorthand'],\n },\n variants: {\n maxColumn: {\n 1: {\n column: 'shr-max-w-[theme(width.1/3)]',\n },\n 2: {},\n 3: {},\n },\n },\n compoundVariants: [\n {\n maxColumn: [2, 3],\n className: {\n column: 'last:shr-grow',\n },\n },\n ],\n})\n\ntype AbstractProps = {\n /** 表示する item の配列 /\n items: ItemNodeLike[]\n /* 選択中の item の値 /\n value?: string\n /* 選択された際に呼び出されるコールバック。第一引数に item の value を取る。 */\n onSelectItem?: (value: string) => void\n}\ntype Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>\n\nexport const Browser: FC<Props> = ({ value, items, onSelectItem, className, ...rest }) => {\n const rootNode = useMemo(() => RootNode.from({ children: items }), [items])\n const columns = useMemo(() => rootNode.toViewData(value), [rootNode, value])\n\n const classNames = useMemo(() => {\n const { wrapper, column } = classNameGenerator({ className })\n return {\n wrapper: wrapper(),\n column: column({\n maxColumn: columns.length as 1 \| 2 \| 3,\n }),\n }\n }, [className, columns.length])\n\n const selectedPath = useMemo(() => {\n if (!value) return []\n const node = rootNode.findByValue(value)\n if (!node) return []\n return [...node.getAncestors().map((n) => n.value), node.value]\n }, [rootNode, value])\n\n const latest = useLatest({ onSelectItem, value, rootNode })\n\n // FIXME: focusメソッドのfocusVisibleが主要ブラウザでサポートされたら使うようにしたい(現状ではマウスクリックでもfocusのoutlineが出てしまう)\n // https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/focus\n const onDelegateKeyDown: KeyboardEventHandler = useCallback(\n (e) => {\n const selectedNode = latest.value ? latest.rootNode.findByValue(latest.value) : undefined\n\n if (!selectedNode) {\n return\n }\n\n let target: ItemNode \| undefined = undefined\n\n switch (e.key) {\n case 'ArrowUp': {\n target = selectedNode.getPrev() ?? selectedNode.parent?.getLastChild()\n\n break\n }\n case 'ArrowDown': {\n target = selectedNode.getNext() ?? selectedNode.parent?.getFirstChild()\n\n break\n }\n case 'ArrowLeft': {\n const node = selectedNode.parent\n\n if (node instanceof ItemNode) {\n target = node\n }\n\n break\n }\n case 'ArrowRight':\n case 'Enter':\n case ' ': {\n target = selectedNode.getFirstChild()\n\n break\n }\n }\n\n if (target) {\n e.preventDefault()\n latest.onSelectItem?.(target.value)\n document.getElementById(getElementIdFromNode(target.value))?.focus()\n }\n },\n [latest],\n )\n\n const onChangeInput = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n latest.onSelectItem?.(e.currentTarget.value)\n },\n [latest],\n )\n\n return (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <div {...rest} role=\"application\" onKeyDown={onDelegateKeyDown} className={classNames.wrapper}>\n {columns.map((colItems, index) => (\n <BrowserColumn\n key={index}\n items={colItems}\n index={index}\n value={selectedPath[index]}\n onChangeInput={onSelectItem ? onChangeInput : undefined}\n className={classNames.column}\n />\n ))}\n </div>\n )\n}\n"],"names":["tv","_jsx"],"mappings":"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"}

package/lib/components/Button/useButtonWrapper.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useButtonWrapper.cjs","sources":["../../../src/components/Button/useButtonWrapper.tsx"],"sourcesContent":["import {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ElementType,\n type ForwardedRef,\n type PropsWithChildren,\n type ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Loader } from '../Loader'\n\nimport type { Variant } from './types'\n\n// HINT: prefix, suffixが存在せず、かつIcon,svg,img,Loaderのいずれかが単一でbodyに含まれるButtonかチェックしたい\n// このSELECTORはbody内の対象を列挙する\n// HINT: smarthr-ui-Icon-extendedはアイコン+α(例えば複数のアイコンをまとめて一つにしているなど)を表すclass\nconst ICON_SELECTOR = '.smarthr-ui-Icon, .smarthr-ui-Icon-extended, svg, img, .smarthr-ui-Loader'\n\ntype AbstractProps = PropsWithChildren<{\n size: 'M' \| 'S'\n wide: boolean\n variant: Variant\n $loading?: boolean\n className: string\n elementAs?: ElementType\n prefix?: ReactNode\n suffix?: ReactNode\n}>\n\ntype AbstractButtonProps = AbstractProps & {\n isAnchor?: never\n buttonRef?: ForwardedRef<HTMLButtonElement>\n}\ntype ButtonProps = AbstractButtonProps &\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof AbstractButtonProps>\n\ntype AbstractAnchorProps = AbstractProps & {\n isAnchor: true\n anchorRef?: ForwardedRef<HTMLAnchorElement>\n}\ntype AnchorProps = AbstractAnchorProps &\n Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof AbstractAnchorProps>\n\nexport type Props = ButtonProps \| AnchorProps\n\n// HINT: useButtonWrapperの引数を調整する場合、以下も調整する\ntype FilteredProps =\n \| 'size'\n \| 'wide'\n \| 'variant'\n \| 'className'\n \| 'prefix'\n \| 'suffix'\n \| 'children'\n \| 'isAnchor'\nexport type FilteredButtonProps = Omit<ButtonProps, FilteredProps>\nexport type FilteredAnchorProps = Omit<AnchorProps, FilteredProps>\n\nexport const useButtonWrapper = ({\n size,\n wide = false,\n variant,\n $loading,\n className,\n prefix,\n suffix,\n children,\n isAnchor,\n ...rest\n}: Props) => {\n const innerRef = useRef<HTMLElement>(null)\n // HINT: squareは\n // null: Buttonのレンダリング前\n // boolean: レンダリング後\n const [square, setSquare] = useState<null \| boolean>(null)\n\n const classNames = useMemo(() => {\n const { button, anchor, loader } = wrapperClassNameGenerator({\n variant,\n size,\n square: !!square,\n loading: !!$loading,\n wide,\n })\n\n const wrapper = isAnchor ? anchor : button\n\n return {\n wrapper: wrapper({ className }),\n loader: loader(),\n }\n }, [$loading, size, square, variant, wide, className, isAnchor])\n\n const innerClassName = useMemo(() => innerClassNameGenerator({ size }), [size])\n\n let actualPrefix = prefix\n let actualSuffix = suffix\n let actualChildren = children\n\n if ($loading) {\n actualPrefix = undefined\n const loader = <Loader size=\"S\" className={classNames.loader} role=\"presentation\" />\n\n // HINT: squareは null \| boolean のため、switchで判定する\n // nullの場合にactualSuffixにloaderを突っ込んでしまうとsquareの計算が狂ってしまう\n switch (square) {\n case true:\n actualChildren = loader\n break\n case false:\n actualSuffix = loader\n break\n }\n }\n\n // HINT: actualSuffixなどは$loadingの判定で置き換えられる可能性がある\n // あくまで利用者が設定したprefix, suffixがないかで判定する\n const onlyBody = !prefix && !suffix\n\n useEffect(() => {\n if (!onlyBody) {\n setSquare(false)\n\n return\n }\n\n const target = innerRef.current\n\n if (!target) return\n\n const checkSquare = () => {\n setSquare(target.children.length === 1 && target.children[0].matches(ICON_SELECTOR))\n }\n\n checkSquare()\n\n const observer = new MutationObserver(checkSquare)\n\n observer.observe(target, {\n childList: true,\n })\n\n return () => {\n observer.disconnect()\n }\n }, [onlyBody])\n\n return {\n filteredProps: { ...rest, $loading } as FilteredAnchorProps \| FilteredButtonProps,\n classNames,\n children: (\n <>\n {actualPrefix}\n <span ref={innerRef} className={innerClassName}>\n {actualChildren}\n </span>\n {actualSuffix}\n </>\n ),\n }\n}\n\nconst wrapperClassNameGenerator = tv({\n slots: {\n button: [\n 'aria-disabled:shr-cursor-not-allowed',\n /* alpha color を使用しているので、背景色と干渉させない /\n 'aria-disabled:shr-bg-clip-padding',\n / disabled ではなく aria-disabled で文字色が変わらないため、強制カラーモード時の色を指定 /\n 'aria-disabled:forced-colors:shr-border-[GrayText] aria-disabled:forced-colors:shr-text-[GrayText]',\n '[&_.smarthr-ui-Icon]:forced-colors:aria-disabled:shr-fill-[GrayText]',\n ],\n anchor: [\n 'shr-no-underline',\n '[&:not([href])]:shr-cursor-not-allowed',\n / alpha color を使用しているので、背景色と干渉させない /\n '[&:not([href])]:shr-bg-clip-padding',\n '[&_.smarthr-ui-Icon]:forced-colors:shr-fill-[LinkText]',\n '[&:not([href])_.smarthr-ui-Icon]:forced-colors:shr-fill-[CanvasText]',\n ],\n loader: [\n 'shr-align-bottom',\n '[&_.smarthr-ui-Loader-spinner]:shr-h-em [&_.smarthr-ui-Loader-spinner]:shr-w-em',\n ],\n },\n variants: {\n variant: {\n primary: {},\n secondary: {},\n danger: {},\n skeleton: {},\n text: {},\n tertiary: {},\n },\n size: {\n M: {},\n S: {},\n },\n square: {\n true: {},\n },\n loading: {\n true: {},\n },\n wide: {\n true: {},\n },\n },\n compoundSlots: [\n {\n slots: ['button', 'anchor'],\n className: [\n 'shr-box-border',\n 'shr-cursor-pointer',\n 'shr-inline-flex',\n 'shr-justify-center',\n 'shr-items-center',\n 'shr-gap-0.5',\n 'shr-text-center',\n 'shr-whitespace-nowrap',\n 'shr-rounded-m',\n / ボタンの高さを合わせるために指定 /\n 'shr-border-shorthand',\n 'shr-font-inherit',\n 'shr-font-bold',\n 'shr-leading-none',\n 'focus-visible:shr-focus-indicator',\n 'contrast-more:shr-border-high-contrast',\n / baseline より下の leading などの余白を埋める /\n '[&_.smarthr-ui-Icon]:shr-block',\n /* selector list は使えない\n * via https://github.com/tailwindlabs/tailwindcss/issues/10576#issuecomment-1440703413\n /\n '[&_svg]:shr-block',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'S',\n className: [\n 'shr-p-0.5',\n 'shr-text-sm',\n / ボタンラベルの line-height を 0 にしたため、高さを担保する /\n 'shr-min-h-[calc(theme(fontSize.sm)+theme(spacing.1)+theme(borderWidth.2))]',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n className: ['shr-text-base'],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: false,\n className: 'shr-px-1 shr-py-0.75',\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: true,\n className: 'shr-p-0.75',\n },\n {\n slots: ['button', 'anchor'],\n loading: true,\n className: 'shr-flex-row-reverse',\n },\n {\n slots: ['button', 'anchor'],\n wide: true,\n className: 'shr-w-full',\n },\n {\n slots: ['button', 'anchor'],\n variant: 'primary',\n className: [\n 'shr-border-main',\n 'shr-bg-main',\n 'shr-text-white',\n 'focus-visible:shr-border-main-darken',\n 'focus-visible:shr-bg-main-darken',\n 'hover:shr-border-main-darken',\n 'hover:shr-bg-main-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'primary',\n className: [\n 'aria-disabled:shr-border-main/50',\n 'aria-disabled:shr-bg-main/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'primary',\n className: [\n '[&:not([href])]:shr-border-main/50',\n '[&:not([href])]:shr-bg-main/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'secondary',\n className: [\n 'shr-border-default',\n 'shr-bg-white',\n 'shr-text-black',\n 'focus-visible:shr-border-darken',\n 'focus-visible:shr-bg-white-darken',\n 'focus-visible:contrast-more:shr-border-high-contrast',\n 'hover:shr-border-darken',\n 'hover:shr-bg-white-darken',\n 'hover:contrast-more:shr-border-high-contrast',\n ],\n },\n {\n slots: ['button'],\n variant: 'secondary',\n className: [\n 'aria-disabled:shr-border-disabled',\n 'aria-disabled:shr-bg-white-darken',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'secondary',\n className: [\n '[&:not([href])]:shr-border-disabled',\n '[&:not([href])]:shr-bg-white-darken',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['button'],\n variant: 'tertiary',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-link',\n 'shr-font-normal',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-link/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'danger',\n className: [\n 'shr-border-danger',\n 'shr-bg-danger',\n 'shr-text-white',\n 'focus-visible:shr-border-danger-darken',\n 'focus-visible:shr-bg-danger-darken',\n 'hover:shr-border-danger-darken',\n 'hover:shr-bg-danger-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'danger',\n className: [\n 'aria-disabled:shr-border-danger/50',\n 'aria-disabled:shr-bg-danger/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'danger',\n className: [\n '[&:not([href])]:shr-border-danger/50',\n '[&:not([href])]:shr-bg-danger/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'skeleton',\n className: [\n 'shr-border-white',\n 'shr-bg-transparent',\n 'shr-text-white',\n 'focus-visible:shr-border-white-darken',\n 'focus-visible:shr-bg-overlay',\n 'focus-visible:shr-text-white-darken',\n 'hover:shr-border-white-darken',\n 'hover:shr-bg-overlay',\n 'hover:shr-text-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'skeleton',\n className: [\n 'aria-disabled:shr-border-white/50',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'skeleton',\n className: [\n '[&:not([href])]:shr-border-white/50',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'text',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-black',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'text',\n className: [\n 'aria-disabled:shr-border-transparent',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'text',\n className: [\n '[&:not([href])]:shr-border-transparent',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['loader'],\n variant: ['primary', 'danger', 'skeleton'],\n className: [\n '[&_.smarthr-ui-Loader-line]:shr-border-white/50',\n '[&_.smarthr-ui-Loader-line]:forced-colors:shr-border-[ButtonBorder]',\n ],\n },\n {\n slots: ['loader'],\n variant: ['secondary', 'text'],\n className: '[&_.smarthr-ui-Loader-line]:shr-border-disabled',\n },\n {\n slots: ['loader'],\n variant: 'tertiary',\n className: '[&_.smarthr-ui-Loader-line]:shr-border-link/50',\n },\n ],\n})\n\nconst innerClassNameGenerator = tv({\n base: [\n 'smarthr-ui-Button-body',\n / LineClamp を併用する場合に、幅を計算してもらうために指定 /\n 'shr-min-w-0',\n ],\n variants: {\n size: {\n M: '',\n S: [\n / SVG とテキストコンテンツの縦位置を揃えるために指定 */\n 'shr-leading-[0]',\n ],\n },\n },\n})\n"],"names":["useRef","useState","useMemo","_jsx","Loader","useEffect","_jsxs","_Fragment","tv"],"mappings":"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"}
1	+ {"version":3,"file":"useButtonWrapper.cjs","sources":["../../../src/components/Button/useButtonWrapper.tsx"],"sourcesContent":["import {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ElementType,\n type ForwardedRef,\n type PropsWithChildren,\n type ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Loader } from '../Loader'\n\nimport type { Variant } from './types'\n\n// HINT: prefix, suffixが存在せず、かつIcon,svg,img,Loaderのいずれかが単一でbodyに含まれるButtonかチェックしたい\n// このSELECTORはbody内の対象を列挙する\n// HINT: smarthr-ui-Icon-extendedはアイコン+α(例えば複数のアイコンをまとめて一つにしているなど)を表すclass\nconst ICON_SELECTOR = '.smarthr-ui-Icon, .smarthr-ui-Icon-extended, svg, img, .smarthr-ui-Loader'\n\ntype AbstractProps = PropsWithChildren<{\n size: 'M' \| 'S'\n wide: boolean\n variant: Variant\n $loading?: boolean\n className: string\n elementAs?: ElementType\n prefix?: ReactNode\n suffix?: ReactNode\n}>\n\ntype AbstractButtonProps = AbstractProps & {\n isAnchor?: never\n buttonRef?: ForwardedRef<HTMLButtonElement>\n}\ntype ButtonProps = AbstractButtonProps &\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof AbstractButtonProps>\n\ntype AbstractAnchorProps = AbstractProps & {\n isAnchor: true\n anchorRef?: ForwardedRef<HTMLAnchorElement>\n}\ntype AnchorProps = AbstractAnchorProps &\n Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof AbstractAnchorProps>\n\nexport type Props = ButtonProps \| AnchorProps\n\n// HINT: useButtonWrapperの引数を調整する場合、以下も調整する\ntype FilteredProps =\n 'size' \| 'wide' \| 'variant' \| 'className' \| 'prefix' \| 'suffix' \| 'children' \| 'isAnchor'\nexport type FilteredButtonProps = Omit<ButtonProps, FilteredProps>\nexport type FilteredAnchorProps = Omit<AnchorProps, FilteredProps>\n\nexport const useButtonWrapper = ({\n size,\n wide = false,\n variant,\n $loading,\n className,\n prefix,\n suffix,\n children,\n isAnchor,\n ...rest\n}: Props) => {\n const innerRef = useRef<HTMLElement>(null)\n // HINT: squareは\n // null: Buttonのレンダリング前\n // boolean: レンダリング後\n const [square, setSquare] = useState<null \| boolean>(null)\n\n const classNames = useMemo(() => {\n const { button, anchor, loader } = wrapperClassNameGenerator({\n variant,\n size,\n square: !!square,\n loading: !!$loading,\n wide,\n })\n\n const wrapper = isAnchor ? anchor : button\n\n return {\n wrapper: wrapper({ className }),\n loader: loader(),\n }\n }, [$loading, size, square, variant, wide, className, isAnchor])\n\n const innerClassName = useMemo(() => innerClassNameGenerator({ size }), [size])\n\n let actualPrefix = prefix\n let actualSuffix = suffix\n let actualChildren = children\n\n if ($loading) {\n actualPrefix = undefined\n const loader = <Loader size=\"S\" className={classNames.loader} role=\"presentation\" />\n\n // HINT: squareは null \| boolean のため、switchで判定する\n // nullの場合にactualSuffixにloaderを突っ込んでしまうとsquareの計算が狂ってしまう\n switch (square) {\n case true:\n actualChildren = loader\n break\n case false:\n actualSuffix = loader\n break\n }\n }\n\n // HINT: actualSuffixなどは$loadingの判定で置き換えられる可能性がある\n // あくまで利用者が設定したprefix, suffixがないかで判定する\n const onlyBody = !prefix && !suffix\n\n useEffect(() => {\n if (!onlyBody) {\n setSquare(false)\n\n return\n }\n\n const target = innerRef.current\n\n if (!target) return\n\n const checkSquare = () => {\n setSquare(target.children.length === 1 && target.children[0].matches(ICON_SELECTOR))\n }\n\n checkSquare()\n\n const observer = new MutationObserver(checkSquare)\n\n observer.observe(target, {\n childList: true,\n })\n\n return () => {\n observer.disconnect()\n }\n }, [onlyBody])\n\n return {\n filteredProps: { ...rest, $loading } as FilteredAnchorProps \| FilteredButtonProps,\n classNames,\n children: (\n <>\n {actualPrefix}\n <span ref={innerRef} className={innerClassName}>\n {actualChildren}\n </span>\n {actualSuffix}\n </>\n ),\n }\n}\n\nconst wrapperClassNameGenerator = tv({\n slots: {\n button: [\n 'aria-disabled:shr-cursor-not-allowed',\n /* alpha color を使用しているので、背景色と干渉させない /\n 'aria-disabled:shr-bg-clip-padding',\n / disabled ではなく aria-disabled で文字色が変わらないため、強制カラーモード時の色を指定 /\n 'aria-disabled:forced-colors:shr-border-[GrayText] aria-disabled:forced-colors:shr-text-[GrayText]',\n '[&_.smarthr-ui-Icon]:forced-colors:aria-disabled:shr-fill-[GrayText]',\n ],\n anchor: [\n 'shr-no-underline',\n '[&:not([href])]:shr-cursor-not-allowed',\n / alpha color を使用しているので、背景色と干渉させない /\n '[&:not([href])]:shr-bg-clip-padding',\n '[&_.smarthr-ui-Icon]:forced-colors:shr-fill-[LinkText]',\n '[&:not([href])_.smarthr-ui-Icon]:forced-colors:shr-fill-[CanvasText]',\n ],\n loader: [\n 'shr-align-bottom',\n '[&_.smarthr-ui-Loader-spinner]:shr-h-em [&_.smarthr-ui-Loader-spinner]:shr-w-em',\n ],\n },\n variants: {\n variant: {\n primary: {},\n secondary: {},\n danger: {},\n skeleton: {},\n text: {},\n tertiary: {},\n },\n size: {\n M: {},\n S: {},\n },\n square: {\n true: {},\n },\n loading: {\n true: {},\n },\n wide: {\n true: {},\n },\n },\n compoundSlots: [\n {\n slots: ['button', 'anchor'],\n className: [\n 'shr-box-border',\n 'shr-cursor-pointer',\n 'shr-inline-flex',\n 'shr-justify-center',\n 'shr-items-center',\n 'shr-gap-0.5',\n 'shr-text-center',\n 'shr-whitespace-nowrap',\n 'shr-rounded-m',\n / ボタンの高さを合わせるために指定 /\n 'shr-border-shorthand',\n 'shr-font-inherit',\n 'shr-font-bold',\n 'shr-leading-none',\n 'focus-visible:shr-focus-indicator',\n 'contrast-more:shr-border-high-contrast',\n / baseline より下の leading などの余白を埋める /\n '[&_.smarthr-ui-Icon]:shr-block',\n /* selector list は使えない\n * via https://github.com/tailwindlabs/tailwindcss/issues/10576#issuecomment-1440703413\n /\n '[&_svg]:shr-block',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'S',\n className: [\n 'shr-p-0.5',\n 'shr-text-sm',\n / ボタンラベルの line-height を 0 にしたため、高さを担保する /\n 'shr-min-h-[calc(theme(fontSize.sm)+theme(spacing.1)+theme(borderWidth.2))]',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n className: ['shr-text-base'],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: false,\n className: 'shr-px-1 shr-py-0.75',\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: true,\n className: 'shr-p-0.75',\n },\n {\n slots: ['button', 'anchor'],\n loading: true,\n className: 'shr-flex-row-reverse',\n },\n {\n slots: ['button', 'anchor'],\n wide: true,\n className: 'shr-w-full',\n },\n {\n slots: ['button', 'anchor'],\n variant: 'primary',\n className: [\n 'shr-border-main',\n 'shr-bg-main',\n 'shr-text-white',\n 'focus-visible:shr-border-main-darken',\n 'focus-visible:shr-bg-main-darken',\n 'hover:shr-border-main-darken',\n 'hover:shr-bg-main-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'primary',\n className: [\n 'aria-disabled:shr-border-main/50',\n 'aria-disabled:shr-bg-main/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'primary',\n className: [\n '[&:not([href])]:shr-border-main/50',\n '[&:not([href])]:shr-bg-main/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'secondary',\n className: [\n 'shr-border-default',\n 'shr-bg-white',\n 'shr-text-black',\n 'focus-visible:shr-border-darken',\n 'focus-visible:shr-bg-white-darken',\n 'focus-visible:contrast-more:shr-border-high-contrast',\n 'hover:shr-border-darken',\n 'hover:shr-bg-white-darken',\n 'hover:contrast-more:shr-border-high-contrast',\n ],\n },\n {\n slots: ['button'],\n variant: 'secondary',\n className: [\n 'aria-disabled:shr-border-disabled',\n 'aria-disabled:shr-bg-white-darken',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'secondary',\n className: [\n '[&:not([href])]:shr-border-disabled',\n '[&:not([href])]:shr-bg-white-darken',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['button'],\n variant: 'tertiary',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-link',\n 'shr-font-normal',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-link/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'danger',\n className: [\n 'shr-border-danger',\n 'shr-bg-danger',\n 'shr-text-white',\n 'focus-visible:shr-border-danger-darken',\n 'focus-visible:shr-bg-danger-darken',\n 'hover:shr-border-danger-darken',\n 'hover:shr-bg-danger-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'danger',\n className: [\n 'aria-disabled:shr-border-danger/50',\n 'aria-disabled:shr-bg-danger/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'danger',\n className: [\n '[&:not([href])]:shr-border-danger/50',\n '[&:not([href])]:shr-bg-danger/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'skeleton',\n className: [\n 'shr-border-white',\n 'shr-bg-transparent',\n 'shr-text-white',\n 'focus-visible:shr-border-white-darken',\n 'focus-visible:shr-bg-overlay',\n 'focus-visible:shr-text-white-darken',\n 'hover:shr-border-white-darken',\n 'hover:shr-bg-overlay',\n 'hover:shr-text-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'skeleton',\n className: [\n 'aria-disabled:shr-border-white/50',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'skeleton',\n className: [\n '[&:not([href])]:shr-border-white/50',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'text',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-black',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'text',\n className: [\n 'aria-disabled:shr-border-transparent',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'text',\n className: [\n '[&:not([href])]:shr-border-transparent',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['loader'],\n variant: ['primary', 'danger', 'skeleton'],\n className: [\n '[&_.smarthr-ui-Loader-line]:shr-border-white/50',\n '[&_.smarthr-ui-Loader-line]:forced-colors:shr-border-[ButtonBorder]',\n ],\n },\n {\n slots: ['loader'],\n variant: ['secondary', 'text'],\n className: '[&_.smarthr-ui-Loader-line]:shr-border-disabled',\n },\n {\n slots: ['loader'],\n variant: 'tertiary',\n className: '[&_.smarthr-ui-Loader-line]:shr-border-link/50',\n },\n ],\n})\n\nconst innerClassNameGenerator = tv({\n base: [\n 'smarthr-ui-Button-body',\n / LineClamp を併用する場合に、幅を計算してもらうために指定 /\n 'shr-min-w-0',\n ],\n variants: {\n size: {\n M: '',\n S: [\n / SVG とテキストコンテンツの縦位置を揃えるために指定 */\n 'shr-leading-[0]',\n ],\n },\n },\n})\n"],"names":["useRef","useState","useMemo","_jsx","Loader","useEffect","_jsxs","_Fragment","tv"],"mappings":"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"}

package/lib/components/Button/useButtonWrapper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useButtonWrapper.js","sources":["../../../src/components/Button/useButtonWrapper.tsx"],"sourcesContent":["import {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ElementType,\n type ForwardedRef,\n type PropsWithChildren,\n type ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Loader } from '../Loader'\n\nimport type { Variant } from './types'\n\n// HINT: prefix, suffixが存在せず、かつIcon,svg,img,Loaderのいずれかが単一でbodyに含まれるButtonかチェックしたい\n// このSELECTORはbody内の対象を列挙する\n// HINT: smarthr-ui-Icon-extendedはアイコン+α(例えば複数のアイコンをまとめて一つにしているなど)を表すclass\nconst ICON_SELECTOR = '.smarthr-ui-Icon, .smarthr-ui-Icon-extended, svg, img, .smarthr-ui-Loader'\n\ntype AbstractProps = PropsWithChildren<{\n size: 'M' \| 'S'\n wide: boolean\n variant: Variant\n $loading?: boolean\n className: string\n elementAs?: ElementType\n prefix?: ReactNode\n suffix?: ReactNode\n}>\n\ntype AbstractButtonProps = AbstractProps & {\n isAnchor?: never\n buttonRef?: ForwardedRef<HTMLButtonElement>\n}\ntype ButtonProps = AbstractButtonProps &\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof AbstractButtonProps>\n\ntype AbstractAnchorProps = AbstractProps & {\n isAnchor: true\n anchorRef?: ForwardedRef<HTMLAnchorElement>\n}\ntype AnchorProps = AbstractAnchorProps &\n Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof AbstractAnchorProps>\n\nexport type Props = ButtonProps \| AnchorProps\n\n// HINT: useButtonWrapperの引数を調整する場合、以下も調整する\ntype FilteredProps =\n \| 'size'\n \| 'wide'\n \| 'variant'\n \| 'className'\n \| 'prefix'\n \| 'suffix'\n \| 'children'\n \| 'isAnchor'\nexport type FilteredButtonProps = Omit<ButtonProps, FilteredProps>\nexport type FilteredAnchorProps = Omit<AnchorProps, FilteredProps>\n\nexport const useButtonWrapper = ({\n size,\n wide = false,\n variant,\n $loading,\n className,\n prefix,\n suffix,\n children,\n isAnchor,\n ...rest\n}: Props) => {\n const innerRef = useRef<HTMLElement>(null)\n // HINT: squareは\n // null: Buttonのレンダリング前\n // boolean: レンダリング後\n const [square, setSquare] = useState<null \| boolean>(null)\n\n const classNames = useMemo(() => {\n const { button, anchor, loader } = wrapperClassNameGenerator({\n variant,\n size,\n square: !!square,\n loading: !!$loading,\n wide,\n })\n\n const wrapper = isAnchor ? anchor : button\n\n return {\n wrapper: wrapper({ className }),\n loader: loader(),\n }\n }, [$loading, size, square, variant, wide, className, isAnchor])\n\n const innerClassName = useMemo(() => innerClassNameGenerator({ size }), [size])\n\n let actualPrefix = prefix\n let actualSuffix = suffix\n let actualChildren = children\n\n if ($loading) {\n actualPrefix = undefined\n const loader = <Loader size=\"S\" className={classNames.loader} role=\"presentation\" />\n\n // HINT: squareは null \| boolean のため、switchで判定する\n // nullの場合にactualSuffixにloaderを突っ込んでしまうとsquareの計算が狂ってしまう\n switch (square) {\n case true:\n actualChildren = loader\n break\n case false:\n actualSuffix = loader\n break\n }\n }\n\n // HINT: actualSuffixなどは$loadingの判定で置き換えられる可能性がある\n // あくまで利用者が設定したprefix, suffixがないかで判定する\n const onlyBody = !prefix && !suffix\n\n useEffect(() => {\n if (!onlyBody) {\n setSquare(false)\n\n return\n }\n\n const target = innerRef.current\n\n if (!target) return\n\n const checkSquare = () => {\n setSquare(target.children.length === 1 && target.children[0].matches(ICON_SELECTOR))\n }\n\n checkSquare()\n\n const observer = new MutationObserver(checkSquare)\n\n observer.observe(target, {\n childList: true,\n })\n\n return () => {\n observer.disconnect()\n }\n }, [onlyBody])\n\n return {\n filteredProps: { ...rest, $loading } as FilteredAnchorProps \| FilteredButtonProps,\n classNames,\n children: (\n <>\n {actualPrefix}\n <span ref={innerRef} className={innerClassName}>\n {actualChildren}\n </span>\n {actualSuffix}\n </>\n ),\n }\n}\n\nconst wrapperClassNameGenerator = tv({\n slots: {\n button: [\n 'aria-disabled:shr-cursor-not-allowed',\n /* alpha color を使用しているので、背景色と干渉させない /\n 'aria-disabled:shr-bg-clip-padding',\n / disabled ではなく aria-disabled で文字色が変わらないため、強制カラーモード時の色を指定 /\n 'aria-disabled:forced-colors:shr-border-[GrayText] aria-disabled:forced-colors:shr-text-[GrayText]',\n '[&_.smarthr-ui-Icon]:forced-colors:aria-disabled:shr-fill-[GrayText]',\n ],\n anchor: [\n 'shr-no-underline',\n '[&:not([href])]:shr-cursor-not-allowed',\n / alpha color を使用しているので、背景色と干渉させない /\n '[&:not([href])]:shr-bg-clip-padding',\n '[&_.smarthr-ui-Icon]:forced-colors:shr-fill-[LinkText]',\n '[&:not([href])_.smarthr-ui-Icon]:forced-colors:shr-fill-[CanvasText]',\n ],\n loader: [\n 'shr-align-bottom',\n '[&_.smarthr-ui-Loader-spinner]:shr-h-em [&_.smarthr-ui-Loader-spinner]:shr-w-em',\n ],\n },\n variants: {\n variant: {\n primary: {},\n secondary: {},\n danger: {},\n skeleton: {},\n text: {},\n tertiary: {},\n },\n size: {\n M: {},\n S: {},\n },\n square: {\n true: {},\n },\n loading: {\n true: {},\n },\n wide: {\n true: {},\n },\n },\n compoundSlots: [\n {\n slots: ['button', 'anchor'],\n className: [\n 'shr-box-border',\n 'shr-cursor-pointer',\n 'shr-inline-flex',\n 'shr-justify-center',\n 'shr-items-center',\n 'shr-gap-0.5',\n 'shr-text-center',\n 'shr-whitespace-nowrap',\n 'shr-rounded-m',\n / ボタンの高さを合わせるために指定 /\n 'shr-border-shorthand',\n 'shr-font-inherit',\n 'shr-font-bold',\n 'shr-leading-none',\n 'focus-visible:shr-focus-indicator',\n 'contrast-more:shr-border-high-contrast',\n / baseline より下の leading などの余白を埋める /\n '[&_.smarthr-ui-Icon]:shr-block',\n /* selector list は使えない\n * via https://github.com/tailwindlabs/tailwindcss/issues/10576#issuecomment-1440703413\n /\n '[&_svg]:shr-block',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'S',\n className: [\n 'shr-p-0.5',\n 'shr-text-sm',\n / ボタンラベルの line-height を 0 にしたため、高さを担保する /\n 'shr-min-h-[calc(theme(fontSize.sm)+theme(spacing.1)+theme(borderWidth.2))]',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n className: ['shr-text-base'],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: false,\n className: 'shr-px-1 shr-py-0.75',\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: true,\n className: 'shr-p-0.75',\n },\n {\n slots: ['button', 'anchor'],\n loading: true,\n className: 'shr-flex-row-reverse',\n },\n {\n slots: ['button', 'anchor'],\n wide: true,\n className: 'shr-w-full',\n },\n {\n slots: ['button', 'anchor'],\n variant: 'primary',\n className: [\n 'shr-border-main',\n 'shr-bg-main',\n 'shr-text-white',\n 'focus-visible:shr-border-main-darken',\n 'focus-visible:shr-bg-main-darken',\n 'hover:shr-border-main-darken',\n 'hover:shr-bg-main-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'primary',\n className: [\n 'aria-disabled:shr-border-main/50',\n 'aria-disabled:shr-bg-main/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'primary',\n className: [\n '[&:not([href])]:shr-border-main/50',\n '[&:not([href])]:shr-bg-main/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'secondary',\n className: [\n 'shr-border-default',\n 'shr-bg-white',\n 'shr-text-black',\n 'focus-visible:shr-border-darken',\n 'focus-visible:shr-bg-white-darken',\n 'focus-visible:contrast-more:shr-border-high-contrast',\n 'hover:shr-border-darken',\n 'hover:shr-bg-white-darken',\n 'hover:contrast-more:shr-border-high-contrast',\n ],\n },\n {\n slots: ['button'],\n variant: 'secondary',\n className: [\n 'aria-disabled:shr-border-disabled',\n 'aria-disabled:shr-bg-white-darken',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'secondary',\n className: [\n '[&:not([href])]:shr-border-disabled',\n '[&:not([href])]:shr-bg-white-darken',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['button'],\n variant: 'tertiary',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-link',\n 'shr-font-normal',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-link/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'danger',\n className: [\n 'shr-border-danger',\n 'shr-bg-danger',\n 'shr-text-white',\n 'focus-visible:shr-border-danger-darken',\n 'focus-visible:shr-bg-danger-darken',\n 'hover:shr-border-danger-darken',\n 'hover:shr-bg-danger-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'danger',\n className: [\n 'aria-disabled:shr-border-danger/50',\n 'aria-disabled:shr-bg-danger/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'danger',\n className: [\n '[&:not([href])]:shr-border-danger/50',\n '[&:not([href])]:shr-bg-danger/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'skeleton',\n className: [\n 'shr-border-white',\n 'shr-bg-transparent',\n 'shr-text-white',\n 'focus-visible:shr-border-white-darken',\n 'focus-visible:shr-bg-overlay',\n 'focus-visible:shr-text-white-darken',\n 'hover:shr-border-white-darken',\n 'hover:shr-bg-overlay',\n 'hover:shr-text-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'skeleton',\n className: [\n 'aria-disabled:shr-border-white/50',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'skeleton',\n className: [\n '[&:not([href])]:shr-border-white/50',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'text',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-black',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'text',\n className: [\n 'aria-disabled:shr-border-transparent',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'text',\n className: [\n '[&:not([href])]:shr-border-transparent',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['loader'],\n variant: ['primary', 'danger', 'skeleton'],\n className: [\n '[&_.smarthr-ui-Loader-line]:shr-border-white/50',\n '[&_.smarthr-ui-Loader-line]:forced-colors:shr-border-[ButtonBorder]',\n ],\n },\n {\n slots: ['loader'],\n variant: ['secondary', 'text'],\n className: '[&_.smarthr-ui-Loader-line]:shr-border-disabled',\n },\n {\n slots: ['loader'],\n variant: 'tertiary',\n className: '[&_.smarthr-ui-Loader-line]:shr-border-link/50',\n },\n ],\n})\n\nconst innerClassNameGenerator = tv({\n base: [\n 'smarthr-ui-Button-body',\n / LineClamp を併用する場合に、幅を計算してもらうために指定 /\n 'shr-min-w-0',\n ],\n variants: {\n size: {\n M: '',\n S: [\n / SVG とテキストコンテンツの縦位置を揃えるために指定 */\n 'shr-leading-[0]',\n ],\n },\n },\n})\n"],"names":["_jsx","_jsxs","_Fragment","tv"],"mappings":";;;;;AAkBA;AACA;AACA;AACA,MAAM,aAAa,GAAG,2EAA2E;AA0C1F,MAAM,gBAAgB,GAAG,CAAC,EAC/B,IAAI,EACJ,IAAI,GAAG,KAAK,EACZ,OAAO,EACP,QAAQ,EACR,SAAS,EACT,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,GAAG,IAAI,EACD,KAAI;AACV,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAc,IAAI,CAAC;;;;IAI1C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC;AAE1D,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAK;QAC9B,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,yBAAyB,CAAC;YAC3D,OAAO;YACP,IAAI;YACJ,MAAM,EAAE,CAAC,CAAC,MAAM;YAChB,OAAO,EAAE,CAAC,CAAC,QAAQ;YACnB,IAAI;AACL,SAAA,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM;QAE1C,OAAO;AACL,YAAA,OAAO,EAAE,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;YAC/B,MAAM,EAAE,MAAM,EAAE;SACjB;AACH,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,CAAC,CAAC;AAEhE,IAAA,MAAM,cAAc,GAAG,OAAO,CAAC,MAAM,uBAAuB,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IAE/E,IAAI,YAAY,GAAG,MAAM;IACzB,IAAI,YAAY,GAAG,MAAM;IACzB,IAAI,cAAc,GAAG,QAAQ;IAE7B,IAAI,QAAQ,EAAE;QACZ,YAAY,GAAG,SAAS;AACxB,QAAA,MAAM,MAAM,GAAGA,GAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAC,GAAG,EAAC,SAAS,EAAE,UAAU,CAAC,MAAM,EAAE,IAAI,EAAC,cAAc,GAAG;;;QAIpF,QAAQ,MAAM;AACZ,YAAA,KAAK,IAAI;gBACP,cAAc,GAAG,MAAM;gBACvB;AACF,YAAA,KAAK,KAAK;gBACR,YAAY,GAAG,MAAM;gBACrB;;IAEN;;;AAIA,IAAA,MAAM,QAAQ,GAAG,CAAC,MAAM,IAAI,CAAC,MAAM;IAEnC,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,QAAQ,EAAE;YACb,SAAS,CAAC,KAAK,CAAC;YAEhB;QACF;AAEA,QAAA,MAAM,MAAM,GAAG,QAAQ,CAAC,OAAO;AAE/B,QAAA,IAAI,CAAC,MAAM;YAAE;QAEb,MAAM,WAAW,GAAG,MAAK;YACvB,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;AACtF,QAAA,CAAC;AAED,QAAA,WAAW,EAAE;AAEb,QAAA,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,WAAW,CAAC;AAElD,QAAA,QAAQ,CAAC,OAAO,CAAC,MAAM,EAAE;AACvB,YAAA,SAAS,EAAE,IAAI;AAChB,SAAA,CAAC;AAEF,QAAA,OAAO,MAAK;YACV,QAAQ,CAAC,UAAU,EAAE;AACvB,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,OAAO;AACL,QAAA,aAAa,EAAE,EAAE,GAAG,IAAI,EAAE,QAAQ,EAA+C;QACjF,UAAU;AACV,QAAA,QAAQ,GACNC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACG,YAAY,EACbF,GAAA,CAAA,MAAA,EAAA,EAAM,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAA,QAAA,EAC3C,cAAc,GACV,EACN,YAAY,IACZ,CACJ;KACF;AACH;AAEA,MAAM,yBAAyB,GAAGG,EAAE,CAAC;AACnC,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;YACN,sCAAsC;;YAEtC,mCAAmC;;YAEnC,mGAAmG;YACnG,sEAAsE;AACvE,SAAA;AACD,QAAA,MAAM,EAAE;YACN,kBAAkB;YAClB,wCAAwC;;YAExC,qCAAqC;YACrC,wDAAwD;YACxD,sEAAsE;AACvE,SAAA;AACD,QAAA,MAAM,EAAE;YACN,kBAAkB;YAClB,iFAAiF;AAClF,SAAA;AACF,KAAA;AACD,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,EAAE;AACX,YAAA,SAAS,EAAE,EAAE;AACb,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,QAAQ,EAAE,EAAE;AACZ,YAAA,IAAI,EAAE,EAAE;AACR,YAAA,QAAQ,EAAE,EAAE;AACb,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAE,EAAE;AACL,YAAA,CAAC,EAAE,EAAE;AACN,SAAA;AACD,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,EAAE;AACT,SAAA;AACD,QAAA,OAAO,EAAE;AACP,YAAA,IAAI,EAAE,EAAE;AACT,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,IAAI,EAAE,EAAE;AACT,SAAA;AACF,KAAA;AACD,IAAA,aAAa,EAAE;AACb,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,SAAS,EAAE;gBACT,gBAAgB;gBAChB,oBAAoB;gBACpB,iBAAiB;gBACjB,oBAAoB;gBACpB,kBAAkB;gBAClB,aAAa;gBACb,iBAAiB;gBACjB,uBAAuB;gBACvB,eAAe;;gBAEf,sBAAsB;gBACtB,kBAAkB;gBAClB,eAAe;gBACf,kBAAkB;gBAClB,mCAAmC;gBACnC,wCAAwC;;gBAExC,gCAAgC;AAChC;;AAEG;gBACH,mBAAmB;AACpB,aAAA;AACF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,IAAI,EAAE,GAAG;AACT,YAAA,SAAS,EAAE;gBACT,WAAW;gBACX,aAAa;;gBAEb,4EAA4E;AAC7E,aAAA;AACF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,IAAI,EAAE,GAAG;YACT,SAAS,EAAE,CAAC,eAAe,CAAC;AAC7B,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,IAAI,EAAE,GAAG;AACT,YAAA,MAAM,EAAE,KAAK;AACb,YAAA,SAAS,EAAE,sBAAsB;AAClC,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,IAAI,EAAE,GAAG;AACT,YAAA,MAAM,EAAE,IAAI;AACZ,YAAA,SAAS,EAAE,YAAY;AACxB,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,SAAS,EAAE,sBAAsB;AAClC,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,SAAS,EAAE,YAAY;AACxB,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,SAAS,EAAE;gBACT,iBAAiB;gBACjB,aAAa;gBACb,gBAAgB;gBAChB,sCAAsC;gBACtC,kCAAkC;gBAClC,8BAA8B;gBAC9B,0BAA0B;AAC3B,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,SAAS,EAAE;gBACT,kCAAkC;gBAClC,8BAA8B;gBAC9B,iCAAiC;AAClC,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,SAAS,EAAE;gBACT,oCAAoC;gBACpC,gCAAgC;gBAChC,mCAAmC;AACpC,aAAA;AACF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,SAAS,EAAE;gBACT,oBAAoB;gBACpB,cAAc;gBACd,gBAAgB;gBAChB,iCAAiC;gBACjC,mCAAmC;gBACnC,sDAAsD;gBACtD,yBAAyB;gBACzB,2BAA2B;gBAC3B,8CAA8C;AAC/C,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,SAAS,EAAE;gBACT,mCAAmC;gBACnC,mCAAmC;gBACnC,iCAAiC;AAClC,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,SAAS,EAAE;gBACT,qCAAqC;gBACrC,qCAAqC;gBACrC,mCAAmC;AACpC,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,UAAU;AACnB,YAAA,SAAS,EAAE;gBACT,wBAAwB;gBACxB,oBAAoB;gBACpB,eAAe;gBACf,iBAAiB;gBACjB,mCAAmC;gBACnC,2BAA2B;gBAC3B,kCAAkC;gBAClC,gCAAgC;AACjC,aAAA;AACF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,SAAS,EAAE;gBACT,mBAAmB;gBACnB,eAAe;gBACf,gBAAgB;gBAChB,wCAAwC;gBACxC,oCAAoC;gBACpC,gCAAgC;gBAChC,4BAA4B;AAC7B,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,SAAS,EAAE;gBACT,oCAAoC;gBACpC,gCAAgC;gBAChC,iCAAiC;AAClC,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,SAAS,EAAE;gBACT,sCAAsC;gBACtC,kCAAkC;gBAClC,mCAAmC;AACpC,aAAA;AACF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,OAAO,EAAE,UAAU;AACnB,YAAA,SAAS,EAAE;gBACT,kBAAkB;gBAClB,oBAAoB;gBACpB,gBAAgB;gBAChB,uCAAuC;gBACvC,8BAA8B;gBAC9B,qCAAqC;gBACrC,+BAA+B;gBAC/B,sBAAsB;gBACtB,6BAA6B;AAC9B,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,UAAU;AACnB,YAAA,SAAS,EAAE;gBACT,mCAAmC;gBACnC,kCAAkC;gBAClC,iCAAiC;AAClC,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,UAAU;AACnB,YAAA,SAAS,EAAE;gBACT,qCAAqC;gBACrC,oCAAoC;gBACpC,mCAAmC;AACpC,aAAA;AACF,SAAA;AACD,QAAA;AACE,YAAA,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3B,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,SAAS,EAAE;gBACT,wBAAwB;gBACxB,oBAAoB;gBACpB,gBAAgB;gBAChB,mCAAmC;gBACnC,2BAA2B;AAC5B,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,SAAS,EAAE;gBACT,sCAAsC;gBACtC,kCAAkC;gBAClC,iCAAiC;AAClC,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,SAAS,EAAE;gBACT,wCAAwC;gBACxC,oCAAoC;gBACpC,mCAAmC;AACpC,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,UAAU,CAAC;AAC1C,YAAA,SAAS,EAAE;gBACT,iDAAiD;gBACjD,qEAAqE;AACtE,aAAA;AACF,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC;AAC9B,YAAA,SAAS,EAAE,iDAAiD;AAC7D,SAAA;AACD,QAAA;YACE,KAAK,EAAE,CAAC,QAAQ,CAAC;AACjB,YAAA,OAAO,EAAE,UAAU;AACnB,YAAA,SAAS,EAAE,gDAAgD;AAC5D,SAAA;AACF,KAAA;AACF,CAAA,CAAC;AAEF,MAAM,uBAAuB,GAAGA,EAAE,CAAC;AACjC,IAAA,IAAI,EAAE;QACJ,wBAAwB;;QAExB,aAAa;AACd,KAAA;AACD,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAE,EAAE;AACL,YAAA,CAAC,EAAE;;gBAED,iBAAiB;AAClB,aAAA;AACF,SAAA;AACF,KAAA;AACF,CAAA,CAAC;;;;"}
1	+ {"version":3,"file":"useButtonWrapper.js","sources":["../../../src/components/Button/useButtonWrapper.tsx"],"sourcesContent":["import {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ElementType,\n type ForwardedRef,\n type PropsWithChildren,\n type ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Loader } from '../Loader'\n\nimport type { Variant } from './types'\n\n// HINT: prefix, suffixが存在せず、かつIcon,svg,img,Loaderのいずれかが単一でbodyに含まれるButtonかチェックしたい\n// このSELECTORはbody内の対象を列挙する\n// HINT: smarthr-ui-Icon-extendedはアイコン+α(例えば複数のアイコンをまとめて一つにしているなど)を表すclass\nconst ICON_SELECTOR = '.smarthr-ui-Icon, .smarthr-ui-Icon-extended, svg, img, .smarthr-ui-Loader'\n\ntype AbstractProps = PropsWithChildren<{\n size: 'M' \| 'S'\n wide: boolean\n variant: Variant\n $loading?: boolean\n className: string\n elementAs?: ElementType\n prefix?: ReactNode\n suffix?: ReactNode\n}>\n\ntype AbstractButtonProps = AbstractProps & {\n isAnchor?: never\n buttonRef?: ForwardedRef<HTMLButtonElement>\n}\ntype ButtonProps = AbstractButtonProps &\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof AbstractButtonProps>\n\ntype AbstractAnchorProps = AbstractProps & {\n isAnchor: true\n anchorRef?: ForwardedRef<HTMLAnchorElement>\n}\ntype AnchorProps = AbstractAnchorProps &\n Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof AbstractAnchorProps>\n\nexport type Props = ButtonProps \| AnchorProps\n\n// HINT: useButtonWrapperの引数を調整する場合、以下も調整する\ntype FilteredProps =\n 'size' \| 'wide' \| 'variant' \| 'className' \| 'prefix' \| 'suffix' \| 'children' \| 'isAnchor'\nexport type FilteredButtonProps = Omit<ButtonProps, FilteredProps>\nexport type FilteredAnchorProps = Omit<AnchorProps, FilteredProps>\n\nexport const useButtonWrapper = ({\n size,\n wide = false,\n variant,\n $loading,\n className,\n prefix,\n suffix,\n children,\n isAnchor,\n ...rest\n}: Props) => {\n const innerRef = useRef<HTMLElement>(null)\n // HINT: squareは\n // null: Buttonのレンダリング前\n // boolean: レンダリング後\n const [square, setSquare] = useState<null \| boolean>(null)\n\n const classNames = useMemo(() => {\n const { button, anchor, loader } = wrapperClassNameGenerator({\n variant,\n size,\n square: !!square,\n loading: !!$loading,\n wide,\n })\n\n const wrapper = isAnchor ? anchor : button\n\n return {\n wrapper: wrapper({ className }),\n loader: loader(),\n }\n }, [$loading, size, square, variant, wide, className, isAnchor])\n\n const innerClassName = useMemo(() => innerClassNameGenerator({ size }), [size])\n\n let actualPrefix = prefix\n let actualSuffix = suffix\n let actualChildren = children\n\n if ($loading) {\n actualPrefix = undefined\n const loader = <Loader size=\"S\" className={classNames.loader} role=\"presentation\" />\n\n // HINT: squareは null \| boolean のため、switchで判定する\n // nullの場合にactualSuffixにloaderを突っ込んでしまうとsquareの計算が狂ってしまう\n switch (square) {\n case true:\n actualChildren = loader\n break\n case false:\n actualSuffix = loader\n break\n }\n }\n\n // HINT: actualSuffixなどは$loadingの判定で置き換えられる可能性がある\n // あくまで利用者が設定したprefix, suffixがないかで判定する\n const onlyBody = !prefix && !suffix\n\n useEffect(() => {\n if (!onlyBody) {\n setSquare(false)\n\n return\n }\n\n const target = innerRef.current\n\n if (!target) return\n\n const checkSquare = () => {\n setSquare(target.children.length === 1 && target.children[0].matches(ICON_SELECTOR))\n }\n\n checkSquare()\n\n const observer = new MutationObserver(checkSquare)\n\n observer.observe(target, {\n childList: true,\n })\n\n return () => {\n observer.disconnect()\n }\n }, [onlyBody])\n\n return {\n filteredProps: { ...rest, $loading } as FilteredAnchorProps \| FilteredButtonProps,\n classNames,\n children: (\n <>\n {actualPrefix}\n <span ref={innerRef} className={innerClassName}>\n {actualChildren}\n </span>\n {actualSuffix}\n </>\n ),\n }\n}\n\nconst wrapperClassNameGenerator = tv({\n slots: {\n button: [\n 'aria-disabled:shr-cursor-not-allowed',\n /* alpha color を使用しているので、背景色と干渉させない /\n 'aria-disabled:shr-bg-clip-padding',\n / disabled ではなく aria-disabled で文字色が変わらないため、強制カラーモード時の色を指定 /\n 'aria-disabled:forced-colors:shr-border-[GrayText] aria-disabled:forced-colors:shr-text-[GrayText]',\n '[&_.smarthr-ui-Icon]:forced-colors:aria-disabled:shr-fill-[GrayText]',\n ],\n anchor: [\n 'shr-no-underline',\n '[&:not([href])]:shr-cursor-not-allowed',\n / alpha color を使用しているので、背景色と干渉させない /\n '[&:not([href])]:shr-bg-clip-padding',\n '[&_.smarthr-ui-Icon]:forced-colors:shr-fill-[LinkText]',\n '[&:not([href])_.smarthr-ui-Icon]:forced-colors:shr-fill-[CanvasText]',\n ],\n loader: [\n 'shr-align-bottom',\n '[&_.smarthr-ui-Loader-spinner]:shr-h-em [&_.smarthr-ui-Loader-spinner]:shr-w-em',\n ],\n },\n variants: {\n variant: {\n primary: {},\n secondary: {},\n danger: {},\n skeleton: {},\n text: {},\n tertiary: {},\n },\n size: {\n M: {},\n S: {},\n },\n square: {\n true: {},\n },\n loading: {\n true: {},\n },\n wide: {\n true: {},\n },\n },\n compoundSlots: [\n {\n slots: ['button', 'anchor'],\n className: [\n 'shr-box-border',\n 'shr-cursor-pointer',\n 'shr-inline-flex',\n 'shr-justify-center',\n 'shr-items-center',\n 'shr-gap-0.5',\n 'shr-text-center',\n 'shr-whitespace-nowrap',\n 'shr-rounded-m',\n / ボタンの高さを合わせるために指定 /\n 'shr-border-shorthand',\n 'shr-font-inherit',\n 'shr-font-bold',\n 'shr-leading-none',\n 'focus-visible:shr-focus-indicator',\n 'contrast-more:shr-border-high-contrast',\n / baseline より下の leading などの余白を埋める /\n '[&_.smarthr-ui-Icon]:shr-block',\n /* selector list は使えない\n * via https://github.com/tailwindlabs/tailwindcss/issues/10576#issuecomment-1440703413\n /\n '[&_svg]:shr-block',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'S',\n className: [\n 'shr-p-0.5',\n 'shr-text-sm',\n / ボタンラベルの line-height を 0 にしたため、高さを担保する /\n 'shr-min-h-[calc(theme(fontSize.sm)+theme(spacing.1)+theme(borderWidth.2))]',\n ],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n className: ['shr-text-base'],\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: false,\n className: 'shr-px-1 shr-py-0.75',\n },\n {\n slots: ['button', 'anchor'],\n size: 'M',\n square: true,\n className: 'shr-p-0.75',\n },\n {\n slots: ['button', 'anchor'],\n loading: true,\n className: 'shr-flex-row-reverse',\n },\n {\n slots: ['button', 'anchor'],\n wide: true,\n className: 'shr-w-full',\n },\n {\n slots: ['button', 'anchor'],\n variant: 'primary',\n className: [\n 'shr-border-main',\n 'shr-bg-main',\n 'shr-text-white',\n 'focus-visible:shr-border-main-darken',\n 'focus-visible:shr-bg-main-darken',\n 'hover:shr-border-main-darken',\n 'hover:shr-bg-main-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'primary',\n className: [\n 'aria-disabled:shr-border-main/50',\n 'aria-disabled:shr-bg-main/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'primary',\n className: [\n '[&:not([href])]:shr-border-main/50',\n '[&:not([href])]:shr-bg-main/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'secondary',\n className: [\n 'shr-border-default',\n 'shr-bg-white',\n 'shr-text-black',\n 'focus-visible:shr-border-darken',\n 'focus-visible:shr-bg-white-darken',\n 'focus-visible:contrast-more:shr-border-high-contrast',\n 'hover:shr-border-darken',\n 'hover:shr-bg-white-darken',\n 'hover:contrast-more:shr-border-high-contrast',\n ],\n },\n {\n slots: ['button'],\n variant: 'secondary',\n className: [\n 'aria-disabled:shr-border-disabled',\n 'aria-disabled:shr-bg-white-darken',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'secondary',\n className: [\n '[&:not([href])]:shr-border-disabled',\n '[&:not([href])]:shr-bg-white-darken',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['button'],\n variant: 'tertiary',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-link',\n 'shr-font-normal',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-link/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'danger',\n className: [\n 'shr-border-danger',\n 'shr-bg-danger',\n 'shr-text-white',\n 'focus-visible:shr-border-danger-darken',\n 'focus-visible:shr-bg-danger-darken',\n 'hover:shr-border-danger-darken',\n 'hover:shr-bg-danger-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'danger',\n className: [\n 'aria-disabled:shr-border-danger/50',\n 'aria-disabled:shr-bg-danger/50',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'danger',\n className: [\n '[&:not([href])]:shr-border-danger/50',\n '[&:not([href])]:shr-bg-danger/50',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'skeleton',\n className: [\n 'shr-border-white',\n 'shr-bg-transparent',\n 'shr-text-white',\n 'focus-visible:shr-border-white-darken',\n 'focus-visible:shr-bg-overlay',\n 'focus-visible:shr-text-white-darken',\n 'hover:shr-border-white-darken',\n 'hover:shr-bg-overlay',\n 'hover:shr-text-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'skeleton',\n className: [\n 'aria-disabled:shr-border-white/50',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-white/50',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'skeleton',\n className: [\n '[&:not([href])]:shr-border-white/50',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-white/50',\n ],\n },\n {\n slots: ['button', 'anchor'],\n variant: 'text',\n className: [\n 'shr-border-transparent',\n 'shr-bg-transparent',\n 'shr-text-black',\n 'focus-visible:shr-bg-white-darken',\n 'hover:shr-bg-white-darken',\n ],\n },\n {\n slots: ['button'],\n variant: 'text',\n className: [\n 'aria-disabled:shr-border-transparent',\n 'aria-disabled:shr-bg-transparent',\n 'aria-disabled:shr-text-disabled',\n ],\n },\n {\n slots: ['anchor'],\n variant: 'text',\n className: [\n '[&:not([href])]:shr-border-transparent',\n '[&:not([href])]:shr-bg-transparent',\n '[&:not([href])]:shr-text-disabled',\n ],\n },\n {\n slots: ['loader'],\n variant: ['primary', 'danger', 'skeleton'],\n className: [\n '[&_.smarthr-ui-Loader-line]:shr-border-white/50',\n '[&_.smarthr-ui-Loader-line]:forced-colors:shr-border-[ButtonBorder]',\n ],\n },\n {\n slots: ['loader'],\n variant: ['secondary', 'text'],\n className: '[&_.smarthr-ui-Loader-line]:shr-border-disabled',\n },\n {\n slots: ['loader'],\n variant: 'tertiary',\n className: '[&_.smarthr-ui-Loader-line]:shr-border-link/50',\n },\n ],\n})\n\nconst innerClassNameGenerator = tv({\n base: [\n 'smarthr-ui-Button-body',\n / LineClamp を併用する場合に、幅を計算してもらうために指定 /\n 'shr-min-w-0',\n ],\n variants: {\n size: {\n M: '',\n S: [\n / SVG とテキストコンテンツの縦位置を揃えるために指定 */\n 'shr-leading-[0]',\n ],\n },\n },\n})\n"],"names":["_jsx","_jsxs","_Fragment","tv"],"mappings":"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"}

package/lib/components/Calendar/CalendarTable.cjs CHANGED Viewed

@@ -4,6 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var dayjs_min = require('../../_virtual/dayjs.min.cjs');
 var React = require('react');
 var index = require('./../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.17_@types_node@20.19.35_typescript@5.9.3__/vendor/tailwind-variants/dist/index.cjs');
+var hooks_useLatest = require('../../hooks/useLatest.cjs');
 require('../../intl/IntlProvider.cjs');
 var intl_useIntl = require('../../intl/useIntl.cjs');
 require('../../intl/Localizer.cjs');
@@ -57,13 +58,17 @@ const CalendarTable = ({ current, from, to, onSelectDate, selectedDayText, class
         }
         return days;
     }, [formatDate, getWeekStartDay]);
+    const latest = hooks_useLatest.useLatest({ onSelectDate });
+    const handleSelectDate = React.useCallback((...argsRest) => {
+        latest.onSelectDate(...argsRest);
+    }, [latest]);
     // HINT: dayjsのisSameは文字列でも比較可能なため、cacheが効きやすいstringにする
     const nowDateText = dayjs_min().startOf('date').toString();
-    return (jsxRuntime.jsx("div", { className: classNames.wrapper, children: jsxRuntime.jsxs("table", { ...rest, className: classNames.table, children: [jsxRuntime.jsx(MemoizedThead, { thStyle: classNames.th, daysInWeek: daysInWeek }), jsxRuntime.jsx("tbody", { children: current.months.map((week, weekIndex) => (jsxRuntime.jsx("tr", { children: week.map((date, dateIndex) => date ? (jsxRuntime.jsx(SelectTdButton, { date: date, currentDay: current.day, selectedDayText: selectedDayText, from: from, to: to, nowDateText: nowDateText, onClick: onSelectDate, classNames: classNames }, dateIndex)) : (jsxRuntime.jsx(NullTd, { className: classNames.td }, dateIndex))) }, weekIndex))) })] }) }));
+    return (jsxRuntime.jsx("div", { className: classNames.wrapper, children: jsxRuntime.jsxs("table", { ...rest, className: classNames.table, children: [jsxRuntime.jsx(MemoizedThead, { thStyle: classNames.th, daysInWeek: daysInWeek }), jsxRuntime.jsx("tbody", { children: current.months.map((week, weekIndex) => (jsxRuntime.jsx("tr", { children: week.map((date, dateIndex) => date ? (jsxRuntime.jsx(SelectTdButton, { date: date, currentDay: current.day, selectedDayText: selectedDayText, from: from, to: to, nowDateText: nowDateText, handleClick: handleSelectDate, classNames: classNames }, dateIndex)) : (jsxRuntime.jsx(NullTd, { className: classNames.td }, dateIndex))) }, weekIndex))) })] }) }));
 };
 const MemoizedThead = React.memo(({ thStyle, daysInWeek }) => (jsxRuntime.jsx("thead", { children: jsxRuntime.jsx("tr", { children: daysInWeek.map((day) => (jsxRuntime.jsx("th", { className: thStyle, children: day }, day))) }) })));
 const NullTd = React.memo(({ className }) => jsxRuntime.jsx("td", { className: className }));
-const SelectTdButton = React.memo(({ date, currentDay, selectedDayText, from, to, nowDateText, onClick, classNames }) => {
+const SelectTdButton = React.memo(({ date, currentDay, selectedDayText, from, to, nowDateText, handleClick, classNames }) => {
     const target = React.useMemo(() => {
         const day = currentDay.date(date);
         return {
@@ -71,15 +76,10 @@ const SelectTdButton = React.memo(({ date, currentDay, selectedDayText, from, to
             date: day.toDate(),
         };
     }, [currentDay, date]);
-    const disabled = React.useMemo(() => !components_Calendar_calendarHelper.isBetween(target.date, from, to), [target.date, from, to]);
-    const ariaPressed = React.useMemo(() => target.day.isSame(selectedDayText, 'date'), [selectedDayText, target.day]);
-    const dataIsToday = React.useMemo(() => target.day.isSame(nowDateText, 'date'), [nowDateText, target.day]);
-    const actualOnClick = React.useCallback((e) => {
-        onClick(e, target.date);
-    }, [onClick, target.date]);
-    return (jsxRuntime.jsx("td", { className: classNames.td, children: jsxRuntime.jsx(components_Button_UnstyledButton.UnstyledButton, { type: "button", disabled: disabled, "aria-pressed": ariaPressed, onClick: actualOnClick, className: classNames.cellButton, "data-is-today": dataIsToday, children: jsxRuntime.jsx(SelectButtonTdDateCell, { className: classNames.dateCell, children: date }) }) }));
+    return (jsxRuntime.jsx("td", { className: classNames.td, children: jsxRuntime.jsx(components_Button_UnstyledButton.UnstyledButton, { type: "button", disabled: !components_Calendar_calendarHelper.isBetween(target.date, from, to), "aria-pressed": target.day.isSame(selectedDayText, 'date'), onClick: (e) => {
+                handleClick(e, target.date);
+            }, className: classNames.cellButton, "data-is-today": target.day.isSame(nowDateText, 'date'), children: jsxRuntime.jsx("span", { className: classNames.dateCell, children: date }) }) }));
 });
-const SelectButtonTdDateCell = React.memo(({ children, className }) => jsxRuntime.jsx("span", { className: className, children: children }));
 exports.CalendarTable = CalendarTable;
 //# sourceMappingURL=CalendarTable.cjs.map