smarthr-ui 98.1.1 → 99.1.0

package/lib/_virtual/{dayjs.min2.cjs → dayjs2.min.cjs}

@@ -3,4 +3,4 @@
 var dayjs_min = {exports: {}};
 
 exports.__module = dayjs_min;
-//# sourceMappingURL=dayjs.min2.cjs.map
+//# sourceMappingURL=dayjs2.min.cjs.map

package/lib/_virtual/dayjs2.min.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dayjs2.min.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/lib/_virtual/{dayjs.min2.js → dayjs2.min.js}

@@ -1,4 +1,4 @@
 var dayjs_min = {exports: {}};
 
 export { dayjs_min as __module };
-//# sourceMappingURL=dayjs.min2.js.map
+//# sourceMappingURL=dayjs2.min.js.map

package/lib/_virtual/dayjs2.min.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dayjs2.min.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/lib/_virtual/index3.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var _commonjsHelpers = require('./_commonjsHelpers.cjs');
-var index = require('./../vendor/.pnpm/react-innertext@1.1.5_@types_react@18.3.28_react@19.2.7/vendor/react-innertext/index.cjs');
+var index = require('./../vendor/.pnpm/react-innertext@1.1.5_@types_react@18.3.31_react@19.2.8/vendor/react-innertext/index.cjs');
 
 var reactInnertextExports = index.__require();
 var innerText = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(reactInnertextExports);

package/lib/_virtual/index3.js

@@ -1,5 +1,5 @@
 import { getDefaultExportFromCjs } from './_commonjsHelpers.js';
-import { __require as requireReactInnertext } from './../vendor/.pnpm/react-innertext@1.1.5_@types_react@18.3.28_react@19.2.7/vendor/react-innertext/index.js';
+import { __require as requireReactInnertext } from './../vendor/.pnpm/react-innertext@1.1.5_@types_react@18.3.31_react@19.2.8/vendor/react-innertext/index.js';
 
 var reactInnertextExports = requireReactInnertext();
 var innerText = /*@__PURE__*/getDefaultExportFromCjs(reactInnertextExports);

package/lib/_virtual/index5.cjs

@@ -1,6 +1,10 @@
 'use strict';
 
-var propTypes = {exports: {}};
+var _commonjsHelpers = require('./_commonjsHelpers.cjs');
+var index = require('./../vendor/.pnpm/prop-types@15.8.1/vendor/prop-types/index.cjs');
 
-exports.__module = propTypes;
+var propTypesExports = /*@__PURE__*/ index.__require();
+var PropTypes2 = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(propTypesExports);
+
+module.exports = PropTypes2;
 //# sourceMappingURL=index5.cjs.map

package/lib/_virtual/index5.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index5.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index5.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

package/lib/_virtual/index5.js

@@ -1,4 +1,8 @@
-var propTypes = {exports: {}};
+import { getDefaultExportFromCjs } from './_commonjsHelpers.js';
+import { __require as requirePropTypes } from './../vendor/.pnpm/prop-types@15.8.1/vendor/prop-types/index.js';
 
-export { propTypes as __module };
+var propTypesExports = /*@__PURE__*/ requirePropTypes();
+var PropTypes2 = /*@__PURE__*/getDefaultExportFromCjs(propTypesExports);
+
+export { PropTypes2 as default };
 //# sourceMappingURL=index5.js.map

package/lib/_virtual/index5.js.map

@@ -1 +1 @@
-{"version":3,"file":"index5.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index5.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/lib/_virtual/index6.cjs

@@ -0,0 +1,6 @@
+'use strict';
+
+var propTypes = {exports: {}};
+
+exports.__module = propTypes;
+//# sourceMappingURL=index6.cjs.map

package/lib/_virtual/index6.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index6.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/lib/_virtual/index6.js

@@ -0,0 +1,4 @@
+var propTypes = {exports: {}};
+
+export { propTypes as __module };
+//# sourceMappingURL=index6.js.map

package/lib/_virtual/index6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index6.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/lib/_virtual/plugin.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var _commonjsHelpers = require('./_commonjsHelpers.cjs');
-var plugin$1 = require('./../vendor/.pnpm/tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.17_@types_node@20.19.35_typescript@5.9.3_/vendor/tailwindcss/plugin.cjs');
+var plugin$1 = require('./../vendor/.pnpm/tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.46_@types_node@20.19.43_typescript@5.9.3_/vendor/tailwindcss/plugin.cjs');
 
 var pluginExports = plugin$1.__require();
 var plugin = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(pluginExports);

package/lib/_virtual/plugin.js

@@ -1,5 +1,5 @@
 import { getDefaultExportFromCjs } from './_commonjsHelpers.js';
-import { __require as requirePlugin } from './../vendor/.pnpm/tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.17_@types_node@20.19.35_typescript@5.9.3_/vendor/tailwindcss/plugin.js';
+import { __require as requirePlugin } from './../vendor/.pnpm/tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.46_@types_node@20.19.43_typescript@5.9.3_/vendor/tailwindcss/plugin.js';
 
 var pluginExports = requirePlugin();
 var plugin = /*@__PURE__*/getDefaultExportFromCjs(pluginExports);

package/lib/components/AccordionPanel/AccordionPanel.cjs

@@ -3,15 +3,20 @@
 
 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 index = require('./../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.46_@types_node@20.19.43_typescript@5.9.3__/vendor/tailwind-variants/dist/index.cjs');
+var hooks_useLatest = require('../../hooks/useLatest.cjs');
 var libs_map = require('../../libs/map.cjs');
 var components_AccordionPanel_accordionPanelHelper = require('./accordionPanelHelper.cjs');
 
+const DEFAULT_EXPANDED_ARRAY = [];
+const DEFAULT_EXPANDED_MAP = libs_map.flatArrayToMap(DEFAULT_EXPANDED_ARRAY);
 const AccordionPanelContext = React.createContext({
     iconPosition: 'left',
-    expandedItems: new Map(),
+    expandedItems: DEFAULT_EXPANDED_MAP,
     expandableMultiply: true,
     parentRef: null,
+    handleClickTrigger: () => { },
+    handleKeyDown: () => { },
 });
 const ROUNDED = {
     t_l: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tl-l',
@@ -37,20 +42,54 @@ const classNameGenerator = index.tv({
         rounded: false,
     },
 });
-const AccordionPanel = ({ iconPosition = 'left', expandableMultiply = true, defaultExpanded = [], className, onClick: onClickProps, rounded, ...rest }) => {
-    const [expandedItems, setExpanded] = React.useState(libs_map.flatArrayToMap(defaultExpanded));
+const AccordionPanel = ({ iconPosition = 'left', expandableMultiply = true, defaultExpanded = DEFAULT_EXPANDED_ARRAY, className, onClick, rounded, ...rest }) => {
+    const [expandedItems, setExpanded] = React.useState(() => libs_map.flatArrayToMap(defaultExpanded));
     const parentRef = React.useRef(null);
     const actualClassName = React.useMemo(() => classNameGenerator({ className, rounded }), [rounded, className]);
-    const onClickTrigger = React.useCallback((itemName, isExpanded) => {
-        setExpanded(components_AccordionPanel_accordionPanelHelper.getNewExpandedItems(expandedItems, itemName, isExpanded, expandableMultiply));
-    }, [expandableMultiply, expandedItems]);
-    React.useEffect(() => {
-        if (defaultExpanded.length > 0)
-            setExpanded(libs_map.flatArrayToMap(defaultExpanded));
-    }, [defaultExpanded]);
+    const latest = hooks_useLatest.useLatest({ onClick, expandableMultiply });
+    const functions = React.useMemo(() => ({
+        handleClickTrigger: (e) => {
+            const { currentTarget } = e;
+            setExpanded((prevExpandedItems) => {
+                const newExpandedItems = components_AccordionPanel_accordionPanelHelper.getNewExpandedItems(prevExpandedItems, currentTarget.value, currentTarget.getAttribute('aria-expanded') !== 'true', latest.expandableMultiply);
+                latest.onClick?.(libs_map.mapToKeyArray(newExpandedItems));
+                return newExpandedItems;
+            });
+        },
+        handleKeyDown: (e) => {
+            if (!parentRef.current) {
+                return;
+            }
+            const item = e.target;
+            switch (e.key) {
+                case 'Home': {
+                    e.preventDefault();
+                    components_AccordionPanel_accordionPanelHelper.focusFirstSibling(parentRef.current);
+                    break;
+                }
+                case 'End': {
+                    e.preventDefault();
+                    components_AccordionPanel_accordionPanelHelper.focusLastSibling(parentRef.current);
+                    break;
+                }
+                case 'ArrowLeft':
+                case 'ArrowUp': {
+                    e.preventDefault();
+                    components_AccordionPanel_accordionPanelHelper.focusPreviousSibling(item, parentRef.current);
+                    break;
+                }
+                case 'ArrowRight':
+                case 'ArrowDown': {
+                    e.preventDefault();
+                    components_AccordionPanel_accordionPanelHelper.focusNextSibling(item, parentRef.current);
+                    break;
+                }
+            }
+        },
+    }), [latest]);
     return (jsxRuntime.jsx(AccordionPanelContext.Provider, { value: {
-            onClickTrigger,
-            onClickProps,
+            handleClickTrigger: functions.handleClickTrigger,
+            handleKeyDown: functions.handleKeyDown,
             expandedItems,
             iconPosition,
             expandableMultiply,

package/lib/components/AccordionPanel/AccordionPanel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanel.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanel.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentProps,\n  type FC,\n  type PropsWithChildren,\n  type RefObject,\n  createContext,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { flatArrayToMap } from '../../libs/map'\n\nimport { getNewExpandedItems } from './accordionPanelHelper'\n\ntype AbstractProps = PropsWithChildren<{\n  /** アイコンの左右位置 */\n  iconPosition?: 'left' | 'right'\n  /** 複数のパネルを同時に開くことを許容するかどうか */\n  expandableMultiply?: boolean\n  /** デフォルトで開いた状態にするアイテムの `name` の配列 */\n  defaultExpanded?: string[]\n  /** トリガのクリックイベントを処理するハンドラ */\n  onClick?: (expandedItems: string[]) => void\n}> &\n  VariantProps<typeof classNameGenerator>\ntype Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>\n\nexport const AccordionPanelContext = createContext<{\n  iconPosition: 'left' | 'right'\n  expandedItems: Map<string, string>\n  expandableMultiply: boolean\n  parentRef: RefObject<HTMLDivElement> | null\n  onClickTrigger?: (itemName: string, isExpanded: boolean) => void\n  onClickProps?: (expandedItems: string[]) => void\n}>({\n  iconPosition: 'left',\n  expandedItems: new Map(),\n  expandableMultiply: true,\n  parentRef: null,\n})\n\nconst ROUNDED = {\n  t_l: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tl-l',\n  t_r: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tr-l',\n  b_l: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-bl-l',\n  b_r: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-br-l',\n}\n\nconst ROUNDED_ALL = [ROUNDED.t_l, ROUNDED.t_r, ROUNDED.b_l, ROUNDED.b_r]\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AccordionPanel',\n  variants: {\n    rounded: {\n      true: ROUNDED_ALL,\n      false: '',\n      all: ROUNDED_ALL,\n      top: [ROUNDED.t_l, ROUNDED.t_r],\n      right: [ROUNDED.t_r, ROUNDED.b_r],\n      bottom: [ROUNDED.b_l, ROUNDED.b_r],\n      left: [ROUNDED.t_l, ROUNDED.b_l],\n    },\n  },\n  defaultVariants: {\n    rounded: false,\n  },\n})\n\nexport const AccordionPanel: FC<Props> = ({\n  iconPosition = 'left',\n  expandableMultiply = true,\n  defaultExpanded = [],\n  className,\n  onClick: onClickProps,\n  rounded,\n  ...rest\n}) => {\n  const [expandedItems, setExpanded] = useState(flatArrayToMap(defaultExpanded))\n  const parentRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(\n    () => classNameGenerator({ className, rounded }),\n    [rounded, className],\n  )\n\n  const onClickTrigger = useCallback(\n    (itemName: string, isExpanded: boolean) => {\n      setExpanded(getNewExpandedItems(expandedItems, itemName, isExpanded, expandableMultiply))\n    },\n    [expandableMultiply, expandedItems],\n  )\n\n  useEffect(() => {\n    if (defaultExpanded.length > 0) setExpanded(flatArrayToMap(defaultExpanded))\n  }, [defaultExpanded])\n\n  return (\n    <AccordionPanelContext.Provider\n      value={{\n        onClickTrigger,\n        onClickProps,\n        expandedItems,\n        iconPosition,\n        expandableMultiply,\n        parentRef,\n      }}\n    >\n      <div {...rest} ref={parentRef} role=\"presentation\" className={actualClassName} />\n    </AccordionPanelContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;AAiCO;AAQL;;AAEA;AACA;AACD;AAED;AACE;AACA;AACA;AACA;;AAGF;AAEA;AACE;AACA;AACE;AACE;AACA;AACA;;;;;AAKD;AACF;AACD;AACE;AACD;AACF;AAEM;AASL;AACA;;;AAQI;AACF;;AAKA;AAAgC;AAClC;AAEA;;;;;;;AASK;AAKP;;;"}
+{"version":3,"file":"AccordionPanel.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanel.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentProps,\n  type FC,\n  type KeyboardEventHandler,\n  type MouseEvent,\n  type PropsWithChildren,\n  type RefObject,\n  createContext,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { useLatest } from '../../hooks/useLatest'\nimport { flatArrayToMap, mapToKeyArray } from '../../libs/map'\n\nimport {\n  focusFirstSibling,\n  focusLastSibling,\n  focusNextSibling,\n  focusPreviousSibling,\n  getNewExpandedItems,\n} from './accordionPanelHelper'\n\ntype BaseProps = PropsWithChildren<{\n  /** アイコンの左右位置 */\n  iconPosition?: 'left' | 'right'\n  /** 複数のパネルを同時に開くことを許容するかどうか */\n  expandableMultiply?: boolean\n  /** デフォルトで開いた状態にするアイテムの `name` の配列 */\n  defaultExpanded?: string[]\n  /** トリガのクリックイベントを処理するハンドラ */\n  onClick?: (expandedItems: string[]) => void\n}> &\n  VariantProps<typeof classNameGenerator>\ntype Props = BaseProps & Omit<ComponentProps<'div'>, keyof BaseProps>\n\nconst DEFAULT_EXPANDED_ARRAY: string[] = []\nconst DEFAULT_EXPANDED_MAP = flatArrayToMap(DEFAULT_EXPANDED_ARRAY)\n\nexport const AccordionPanelContext = createContext<{\n  iconPosition: 'left' | 'right'\n  expandedItems: Map<string, string>\n  expandableMultiply: boolean\n  parentRef: RefObject<HTMLDivElement> | null\n  handleClickTrigger: (e: MouseEvent<HTMLButtonElement>) => void\n  handleKeyDown: KeyboardEventHandler<HTMLButtonElement>\n}>({\n  iconPosition: 'left',\n  expandedItems: DEFAULT_EXPANDED_MAP,\n  expandableMultiply: true,\n  parentRef: null,\n  handleClickTrigger: () => {},\n  handleKeyDown: () => {},\n})\n\nconst ROUNDED = {\n  t_l: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tl-l',\n  t_r: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tr-l',\n  b_l: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-bl-l',\n  b_r: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-br-l',\n}\n\nconst ROUNDED_ALL = [ROUNDED.t_l, ROUNDED.t_r, ROUNDED.b_l, ROUNDED.b_r]\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AccordionPanel',\n  variants: {\n    rounded: {\n      true: ROUNDED_ALL,\n      false: '',\n      all: ROUNDED_ALL,\n      top: [ROUNDED.t_l, ROUNDED.t_r],\n      right: [ROUNDED.t_r, ROUNDED.b_r],\n      bottom: [ROUNDED.b_l, ROUNDED.b_r],\n      left: [ROUNDED.t_l, ROUNDED.b_l],\n    },\n  },\n  defaultVariants: {\n    rounded: false,\n  },\n})\n\nexport const AccordionPanel: FC<Props> = ({\n  iconPosition = 'left',\n  expandableMultiply = true,\n  defaultExpanded = DEFAULT_EXPANDED_ARRAY,\n  className,\n  onClick,\n  rounded,\n  ...rest\n}) => {\n  const [expandedItems, setExpanded] = useState(() => flatArrayToMap(defaultExpanded))\n  const parentRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(\n    () => classNameGenerator({ className, rounded }),\n    [rounded, className],\n  )\n\n  const latest = useLatest({ onClick, expandableMultiply })\n\n  const functions = useMemo(\n    () => ({\n      handleClickTrigger: (e: MouseEvent<HTMLButtonElement>) => {\n        const { currentTarget } = e\n\n        setExpanded((prevExpandedItems) => {\n          const newExpandedItems = getNewExpandedItems(\n            prevExpandedItems,\n            currentTarget.value,\n            currentTarget.getAttribute('aria-expanded') !== 'true',\n            latest.expandableMultiply,\n          )\n\n          latest.onClick?.(mapToKeyArray(newExpandedItems))\n\n          return newExpandedItems\n        })\n      },\n      handleKeyDown: (e: Parameters<KeyboardEventHandler<HTMLButtonElement>>[0]): void => {\n        if (!parentRef.current) {\n          return\n        }\n\n        const item = e.target as HTMLElement\n\n        switch (e.key) {\n          case 'Home': {\n            e.preventDefault()\n            focusFirstSibling(parentRef.current)\n            break\n          }\n          case 'End': {\n            e.preventDefault()\n            focusLastSibling(parentRef.current)\n            break\n          }\n          case 'ArrowLeft':\n          case 'ArrowUp': {\n            e.preventDefault()\n            focusPreviousSibling(item, parentRef.current)\n            break\n          }\n          case 'ArrowRight':\n          case 'ArrowDown': {\n            e.preventDefault()\n            focusNextSibling(item, parentRef.current)\n            break\n          }\n        }\n      },\n    }),\n    [latest],\n  )\n\n  return (\n    <AccordionPanelContext.Provider\n      value={{\n        handleClickTrigger: functions.handleClickTrigger,\n        handleKeyDown: functions.handleKeyDown,\n        expandedItems,\n        iconPosition,\n        expandableMultiply,\n        parentRef,\n      }}\n    >\n      <div {...rest} ref={parentRef} role=\"presentation\" className={actualClassName} />\n    </AccordionPanelContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;AAwCA;AACA;AAEO;AAQL;AACA;AACA;AACA;AACA;AACA;AACD;AAED;AACE;AACA;AACA;AACA;;AAGF;AAEA;AACE;AACA;AACE;AACE;AACA;AACA;;;;;AAKD;AACF;AACD;AACE;AACD;AACF;AAEM;AASL;AACA;;;AAQA;AAEI;AACE;AAEA;;;AAUE;AACF;;AAEF;AACE;;;AAIA;AAEA;;;AAGI;;;;;AAKA;;;AAGF;;;AAGE;;;AAGF;;;AAGE;;;;;AAKP;AAIH;;;;;;;AASK;AAKP;;;"}

package/lib/components/AccordionPanel/AccordionPanel.d.ts

@@ -1,6 +1,6 @@
-import { type ComponentProps, type FC, type PropsWithChildren, type RefObject } from 'react';
+import { type ComponentProps, type FC, type KeyboardEventHandler, type MouseEvent, type PropsWithChildren, type RefObject } from 'react';
 import { type VariantProps } from 'tailwind-variants';
-type AbstractProps = PropsWithChildren<{
+type BaseProps = PropsWithChildren<{
     /** アイコンの左右位置 */
     iconPosition?: 'left' | 'right';
     /** 複数のパネルを同時に開くことを許容するかどうか */
@@ -10,14 +10,14 @@ type AbstractProps = PropsWithChildren<{
     /** トリガのクリックイベントを処理するハンドラ */
     onClick?: (expandedItems: string[]) => void;
 }> & VariantProps<typeof classNameGenerator>;
-type Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>;
+type Props = BaseProps & Omit<ComponentProps<'div'>, keyof BaseProps>;
 export declare const AccordionPanelContext: import("react").Context<{
     iconPosition: "left" | "right";
     expandedItems: Map<string, string>;
     expandableMultiply: boolean;
     parentRef: RefObject<HTMLDivElement> | null;
-    onClickTrigger?: (itemName: string, isExpanded: boolean) => void;
-    onClickProps?: (expandedItems: string[]) => void;
+    handleClickTrigger: (e: MouseEvent<HTMLButtonElement>) => void;
+    handleKeyDown: KeyboardEventHandler<HTMLButtonElement>;
 }>;
 declare const classNameGenerator: import("tailwind-variants").TVReturnType<{
     rounded: {

package/lib/components/AccordionPanel/AccordionPanel.js

@@ -1,15 +1,20 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { createContext, useState, useRef, useMemo, useCallback, useEffect } 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 { flatArrayToMap } from '../../libs/map.js';
-import { getNewExpandedItems } from './accordionPanelHelper.js';
+import { createContext, useState, useRef, useMemo } 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.46_@types_node@20.19.43_typescript@5.9.3__/vendor/tailwind-variants/dist/index.js';
+import { useLatest } from '../../hooks/useLatest.js';
+import { flatArrayToMap, mapToKeyArray } from '../../libs/map.js';
+import { focusNextSibling, focusPreviousSibling, focusLastSibling, focusFirstSibling, getNewExpandedItems } from './accordionPanelHelper.js';
 
+const DEFAULT_EXPANDED_ARRAY = [];
+const DEFAULT_EXPANDED_MAP = flatArrayToMap(DEFAULT_EXPANDED_ARRAY);
 const AccordionPanelContext = createContext({
     iconPosition: 'left',
-    expandedItems: new Map(),
+    expandedItems: DEFAULT_EXPANDED_MAP,
     expandableMultiply: true,
     parentRef: null,
+    handleClickTrigger: () => { },
+    handleKeyDown: () => { },
 });
 const ROUNDED = {
     t_l: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tl-l',
@@ -35,20 +40,54 @@ const classNameGenerator = ce({
         rounded: false,
     },
 });
-const AccordionPanel = ({ iconPosition = 'left', expandableMultiply = true, defaultExpanded = [], className, onClick: onClickProps, rounded, ...rest }) => {
-    const [expandedItems, setExpanded] = useState(flatArrayToMap(defaultExpanded));
+const AccordionPanel = ({ iconPosition = 'left', expandableMultiply = true, defaultExpanded = DEFAULT_EXPANDED_ARRAY, className, onClick, rounded, ...rest }) => {
+    const [expandedItems, setExpanded] = useState(() => flatArrayToMap(defaultExpanded));
     const parentRef = useRef(null);
     const actualClassName = useMemo(() => classNameGenerator({ className, rounded }), [rounded, className]);
-    const onClickTrigger = useCallback((itemName, isExpanded) => {
-        setExpanded(getNewExpandedItems(expandedItems, itemName, isExpanded, expandableMultiply));
-    }, [expandableMultiply, expandedItems]);
-    useEffect(() => {
-        if (defaultExpanded.length > 0)
-            setExpanded(flatArrayToMap(defaultExpanded));
-    }, [defaultExpanded]);
+    const latest = useLatest({ onClick, expandableMultiply });
+    const functions = useMemo(() => ({
+        handleClickTrigger: (e) => {
+            const { currentTarget } = e;
+            setExpanded((prevExpandedItems) => {
+                const newExpandedItems = getNewExpandedItems(prevExpandedItems, currentTarget.value, currentTarget.getAttribute('aria-expanded') !== 'true', latest.expandableMultiply);
+                latest.onClick?.(mapToKeyArray(newExpandedItems));
+                return newExpandedItems;
+            });
+        },
+        handleKeyDown: (e) => {
+            if (!parentRef.current) {
+                return;
+            }
+            const item = e.target;
+            switch (e.key) {
+                case 'Home': {
+                    e.preventDefault();
+                    focusFirstSibling(parentRef.current);
+                    break;
+                }
+                case 'End': {
+                    e.preventDefault();
+                    focusLastSibling(parentRef.current);
+                    break;
+                }
+                case 'ArrowLeft':
+                case 'ArrowUp': {
+                    e.preventDefault();
+                    focusPreviousSibling(item, parentRef.current);
+                    break;
+                }
+                case 'ArrowRight':
+                case 'ArrowDown': {
+                    e.preventDefault();
+                    focusNextSibling(item, parentRef.current);
+                    break;
+                }
+            }
+        },
+    }), [latest]);
     return (jsx(AccordionPanelContext.Provider, { value: {
-            onClickTrigger,
-            onClickProps,
+            handleClickTrigger: functions.handleClickTrigger,
+            handleKeyDown: functions.handleKeyDown,
             expandedItems,
             iconPosition,
             expandableMultiply,

package/lib/components/AccordionPanel/AccordionPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanel.js","sources":["../../../src/components/AccordionPanel/AccordionPanel.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentProps,\n  type FC,\n  type PropsWithChildren,\n  type RefObject,\n  createContext,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { flatArrayToMap } from '../../libs/map'\n\nimport { getNewExpandedItems } from './accordionPanelHelper'\n\ntype AbstractProps = PropsWithChildren<{\n  /** アイコンの左右位置 */\n  iconPosition?: 'left' | 'right'\n  /** 複数のパネルを同時に開くことを許容するかどうか */\n  expandableMultiply?: boolean\n  /** デフォルトで開いた状態にするアイテムの `name` の配列 */\n  defaultExpanded?: string[]\n  /** トリガのクリックイベントを処理するハンドラ */\n  onClick?: (expandedItems: string[]) => void\n}> &\n  VariantProps<typeof classNameGenerator>\ntype Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>\n\nexport const AccordionPanelContext = createContext<{\n  iconPosition: 'left' | 'right'\n  expandedItems: Map<string, string>\n  expandableMultiply: boolean\n  parentRef: RefObject<HTMLDivElement> | null\n  onClickTrigger?: (itemName: string, isExpanded: boolean) => void\n  onClickProps?: (expandedItems: string[]) => void\n}>({\n  iconPosition: 'left',\n  expandedItems: new Map(),\n  expandableMultiply: true,\n  parentRef: null,\n})\n\nconst ROUNDED = {\n  t_l: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tl-l',\n  t_r: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tr-l',\n  b_l: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-bl-l',\n  b_r: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-br-l',\n}\n\nconst ROUNDED_ALL = [ROUNDED.t_l, ROUNDED.t_r, ROUNDED.b_l, ROUNDED.b_r]\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AccordionPanel',\n  variants: {\n    rounded: {\n      true: ROUNDED_ALL,\n      false: '',\n      all: ROUNDED_ALL,\n      top: [ROUNDED.t_l, ROUNDED.t_r],\n      right: [ROUNDED.t_r, ROUNDED.b_r],\n      bottom: [ROUNDED.b_l, ROUNDED.b_r],\n      left: [ROUNDED.t_l, ROUNDED.b_l],\n    },\n  },\n  defaultVariants: {\n    rounded: false,\n  },\n})\n\nexport const AccordionPanel: FC<Props> = ({\n  iconPosition = 'left',\n  expandableMultiply = true,\n  defaultExpanded = [],\n  className,\n  onClick: onClickProps,\n  rounded,\n  ...rest\n}) => {\n  const [expandedItems, setExpanded] = useState(flatArrayToMap(defaultExpanded))\n  const parentRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(\n    () => classNameGenerator({ className, rounded }),\n    [rounded, className],\n  )\n\n  const onClickTrigger = useCallback(\n    (itemName: string, isExpanded: boolean) => {\n      setExpanded(getNewExpandedItems(expandedItems, itemName, isExpanded, expandableMultiply))\n    },\n    [expandableMultiply, expandedItems],\n  )\n\n  useEffect(() => {\n    if (defaultExpanded.length > 0) setExpanded(flatArrayToMap(defaultExpanded))\n  }, [defaultExpanded])\n\n  return (\n    <AccordionPanelContext.Provider\n      value={{\n        onClickTrigger,\n        onClickProps,\n        expandedItems,\n        iconPosition,\n        expandableMultiply,\n        parentRef,\n      }}\n    >\n      <div {...rest} ref={parentRef} role=\"presentation\" className={actualClassName} />\n    </AccordionPanelContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;AAiCO;AAQL;;AAEA;AACA;AACD;AAED;AACE;AACA;AACA;AACA;;AAGF;AAEA;AACE;AACA;AACE;AACE;AACA;AACA;;;;;AAKD;AACF;AACD;AACE;AACD;AACF;AAEM;AASL;AACA;;;AAQI;AACF;;AAKA;AAAgC;AAClC;AAEA;;;;;;;AASK;AAKP;;"}
+{"version":3,"file":"AccordionPanel.js","sources":["../../../src/components/AccordionPanel/AccordionPanel.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentProps,\n  type FC,\n  type KeyboardEventHandler,\n  type MouseEvent,\n  type PropsWithChildren,\n  type RefObject,\n  createContext,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { useLatest } from '../../hooks/useLatest'\nimport { flatArrayToMap, mapToKeyArray } from '../../libs/map'\n\nimport {\n  focusFirstSibling,\n  focusLastSibling,\n  focusNextSibling,\n  focusPreviousSibling,\n  getNewExpandedItems,\n} from './accordionPanelHelper'\n\ntype BaseProps = PropsWithChildren<{\n  /** アイコンの左右位置 */\n  iconPosition?: 'left' | 'right'\n  /** 複数のパネルを同時に開くことを許容するかどうか */\n  expandableMultiply?: boolean\n  /** デフォルトで開いた状態にするアイテムの `name` の配列 */\n  defaultExpanded?: string[]\n  /** トリガのクリックイベントを処理するハンドラ */\n  onClick?: (expandedItems: string[]) => void\n}> &\n  VariantProps<typeof classNameGenerator>\ntype Props = BaseProps & Omit<ComponentProps<'div'>, keyof BaseProps>\n\nconst DEFAULT_EXPANDED_ARRAY: string[] = []\nconst DEFAULT_EXPANDED_MAP = flatArrayToMap(DEFAULT_EXPANDED_ARRAY)\n\nexport const AccordionPanelContext = createContext<{\n  iconPosition: 'left' | 'right'\n  expandedItems: Map<string, string>\n  expandableMultiply: boolean\n  parentRef: RefObject<HTMLDivElement> | null\n  handleClickTrigger: (e: MouseEvent<HTMLButtonElement>) => void\n  handleKeyDown: KeyboardEventHandler<HTMLButtonElement>\n}>({\n  iconPosition: 'left',\n  expandedItems: DEFAULT_EXPANDED_MAP,\n  expandableMultiply: true,\n  parentRef: null,\n  handleClickTrigger: () => {},\n  handleKeyDown: () => {},\n})\n\nconst ROUNDED = {\n  t_l: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tl-l',\n  t_r: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tr-l',\n  b_l: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-bl-l',\n  b_r: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-br-l',\n}\n\nconst ROUNDED_ALL = [ROUNDED.t_l, ROUNDED.t_r, ROUNDED.b_l, ROUNDED.b_r]\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AccordionPanel',\n  variants: {\n    rounded: {\n      true: ROUNDED_ALL,\n      false: '',\n      all: ROUNDED_ALL,\n      top: [ROUNDED.t_l, ROUNDED.t_r],\n      right: [ROUNDED.t_r, ROUNDED.b_r],\n      bottom: [ROUNDED.b_l, ROUNDED.b_r],\n      left: [ROUNDED.t_l, ROUNDED.b_l],\n    },\n  },\n  defaultVariants: {\n    rounded: false,\n  },\n})\n\nexport const AccordionPanel: FC<Props> = ({\n  iconPosition = 'left',\n  expandableMultiply = true,\n  defaultExpanded = DEFAULT_EXPANDED_ARRAY,\n  className,\n  onClick,\n  rounded,\n  ...rest\n}) => {\n  const [expandedItems, setExpanded] = useState(() => flatArrayToMap(defaultExpanded))\n  const parentRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(\n    () => classNameGenerator({ className, rounded }),\n    [rounded, className],\n  )\n\n  const latest = useLatest({ onClick, expandableMultiply })\n\n  const functions = useMemo(\n    () => ({\n      handleClickTrigger: (e: MouseEvent<HTMLButtonElement>) => {\n        const { currentTarget } = e\n\n        setExpanded((prevExpandedItems) => {\n          const newExpandedItems = getNewExpandedItems(\n            prevExpandedItems,\n            currentTarget.value,\n            currentTarget.getAttribute('aria-expanded') !== 'true',\n            latest.expandableMultiply,\n          )\n\n          latest.onClick?.(mapToKeyArray(newExpandedItems))\n\n          return newExpandedItems\n        })\n      },\n      handleKeyDown: (e: Parameters<KeyboardEventHandler<HTMLButtonElement>>[0]): void => {\n        if (!parentRef.current) {\n          return\n        }\n\n        const item = e.target as HTMLElement\n\n        switch (e.key) {\n          case 'Home': {\n            e.preventDefault()\n            focusFirstSibling(parentRef.current)\n            break\n          }\n          case 'End': {\n            e.preventDefault()\n            focusLastSibling(parentRef.current)\n            break\n          }\n          case 'ArrowLeft':\n          case 'ArrowUp': {\n            e.preventDefault()\n            focusPreviousSibling(item, parentRef.current)\n            break\n          }\n          case 'ArrowRight':\n          case 'ArrowDown': {\n            e.preventDefault()\n            focusNextSibling(item, parentRef.current)\n            break\n          }\n        }\n      },\n    }),\n    [latest],\n  )\n\n  return (\n    <AccordionPanelContext.Provider\n      value={{\n        handleClickTrigger: functions.handleClickTrigger,\n        handleKeyDown: functions.handleKeyDown,\n        expandedItems,\n        iconPosition,\n        expandableMultiply,\n        parentRef,\n      }}\n    >\n      <div {...rest} ref={parentRef} role=\"presentation\" className={actualClassName} />\n    </AccordionPanelContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;AAwCA;AACA;AAEO;AAQL;AACA;AACA;AACA;AACA;AACA;AACD;AAED;AACE;AACA;AACA;AACA;;AAGF;AAEA;AACE;AACA;AACE;AACE;AACA;AACA;;;;;AAKD;AACF;AACD;AACE;AACD;AACF;AAEM;AASL;AACA;;;AAQA;AAEI;AACE;AAEA;;;AAUE;AACF;;AAEF;AACE;;;AAIA;AAEA;;;AAGI;;;;;AAKA;;;AAGF;;;AAGE;;;AAGF;;;AAGE;;;;;AAKP;AAIH;;;;;;;AASK;AAKP;;"}

package/lib/components/AccordionPanel/AccordionPanelContent.cjs

@@ -3,11 +3,11 @@
 
 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 index = require('./../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.46_@types_node@20.19.43_typescript@5.9.3__/vendor/tailwind-variants/dist/index.cjs');
 var libs_map = require('../../libs/map.cjs');
 var components_AccordionPanel_AccordionPanel = require('./AccordionPanel.cjs');
 var components_AccordionPanel_AccordionPanelItem = require('./AccordionPanelItem.cjs');
-var Transition = require('./../../vendor/.pnpm/react-transition-group@4.4.5_react-dom@19.2.7_react@19.2.7__react@19.2.7/vendor/react-transition-group/esm/Transition.cjs');
+var Transition = require('./../../vendor/.pnpm/react-transition-group@4.4.5_react-dom@19.2.8_react@19.2.8__react@19.2.8/vendor/react-transition-group/esm/Transition.cjs');
 
 const classNameGenerator = index.tv({
     base: [

package/lib/components/AccordionPanel/AccordionPanelContent.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanelContent.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanelContent.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n  useMemo,\n  useRef,\n} from 'react'\nimport { Transition } from 'react-transition-group'\nimport { tv } from 'tailwind-variants'\n\nimport { getIsInclude } from '../../libs/map'\n\nimport { AccordionPanelContext } from './AccordionPanel'\nimport { AccordionPanelItemContext } from './AccordionPanelItem'\n\ntype AbstractProps = PropsWithChildren\ntype Props = AbstractProps & Omit<ComponentPropsWithoutRef<'div'>, keyof AbstractProps>\n\nconst classNameGenerator = tv({\n  base: [\n    'smarthr-ui-AccordionPanel-content',\n    'shr-invisible shr-max-h-0 shr-opacity-0 shr-transition-[max-height,_visible,_opacity] shr-duration-150 shr-ease-in-out',\n    '[&.entered]:shr-visible [&.entered]:shr-max-h-[revert] [&.entered]:shr-opacity-100',\n    // HINT: flexなどで囲まれると、非表示だが内容分高さが出てしまい、スクロール領域が不自然に伸びてしまう現象が起きる場合がある\n    // 非表示の場合、visually hiddenを適用することで、内容としては残しつつ、高さを0にすることで回避する\n    'aria-[hidden]:shr-absolute aria-[hidden]:shr-h-px aria-[hidden]:shr-overflow-hidden',\n  ],\n})\n\nexport const AccordionPanelContent: FC<Props> = ({ className, ...rest }) => {\n  const { name, contentId, triggerId } = useContext(AccordionPanelItemContext)\n  const { expandedItems } = useContext(AccordionPanelContext)\n  const visible = useMemo(() => getIsInclude(expandedItems, name), [expandedItems, name])\n  const wrapperRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <Transition in={visible} timeout={150} nodeRef={wrapperRef}>\n      {(status) => (\n        <div\n          {...rest}\n          ref={wrapperRef}\n          id={contentId}\n          aria-labelledby={triggerId}\n          aria-hidden={visible ? undefined : true}\n          className={`${actualClassName} ${status}`}\n        />\n      )}\n    </Transition>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAqBA;AACE;;;;;;;AAOC;AACF;AAEM;AACL;;;AAGA;AACA;;AAgBF;;"}
+{"version":3,"file":"AccordionPanelContent.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanelContent.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n  useMemo,\n  useRef,\n} from 'react'\nimport { Transition } from 'react-transition-group'\nimport { tv } from 'tailwind-variants'\n\nimport { getIsInclude } from '../../libs/map'\n\nimport { AccordionPanelContext } from './AccordionPanel'\nimport { AccordionPanelItemContext } from './AccordionPanelItem'\n\ntype BaseProps = PropsWithChildren\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nconst classNameGenerator = tv({\n  base: [\n    'smarthr-ui-AccordionPanel-content',\n    'shr-invisible shr-max-h-0 shr-opacity-0 shr-transition-[max-height,_visible,_opacity] shr-duration-150 shr-ease-in-out',\n    '[&.entered]:shr-visible [&.entered]:shr-max-h-[revert] [&.entered]:shr-opacity-100',\n    // HINT: flexなどで囲まれると、非表示だが内容分高さが出てしまい、スクロール領域が不自然に伸びてしまう現象が起きる場合がある\n    // 非表示の場合、visually hiddenを適用することで、内容としては残しつつ、高さを0にすることで回避する\n    'aria-[hidden]:shr-absolute aria-[hidden]:shr-h-px aria-[hidden]:shr-overflow-hidden',\n  ],\n})\n\nexport const AccordionPanelContent: FC<Props> = ({ className, ...rest }) => {\n  const { name, contentId, triggerId } = useContext(AccordionPanelItemContext)\n  const { expandedItems } = useContext(AccordionPanelContext)\n  const visible = useMemo(() => getIsInclude(expandedItems, name), [expandedItems, name])\n  const wrapperRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <Transition in={visible} timeout={150} nodeRef={wrapperRef}>\n      {(status) => (\n        <div\n          {...rest}\n          ref={wrapperRef}\n          id={contentId}\n          aria-labelledby={triggerId}\n          aria-hidden={visible ? undefined : true}\n          className={`${actualClassName} ${status}`}\n        />\n      )}\n    </Transition>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAqBA;AACE;;;;;;;AAOC;AACF;AAEM;AACL;;;AAGA;AACA;;AAgBF;;"}

package/lib/components/AccordionPanel/AccordionPanelContent.d.ts

@@ -1,5 +1,5 @@
 import { type ComponentPropsWithoutRef, type FC, type PropsWithChildren } from 'react';
-type AbstractProps = PropsWithChildren;
-type Props = AbstractProps & Omit<ComponentPropsWithoutRef<'div'>, keyof AbstractProps>;
+type BaseProps = PropsWithChildren;
+type Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>;
 export declare const AccordionPanelContent: FC<Props>;
 export {};

package/lib/components/AccordionPanel/AccordionPanelContent.js

@@ -1,11 +1,11 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { useContext, useMemo, useRef } 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 { tv as ce } from './../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.46_@types_node@20.19.43_typescript@5.9.3__/vendor/tailwind-variants/dist/index.js';
 import { getIsInclude } from '../../libs/map.js';
 import { AccordionPanelContext } from './AccordionPanel.js';
 import { AccordionPanelItemContext } from './AccordionPanelItem.js';
-import Transition from './../../vendor/.pnpm/react-transition-group@4.4.5_react-dom@19.2.7_react@19.2.7__react@19.2.7/vendor/react-transition-group/esm/Transition.js';
+import Transition from './../../vendor/.pnpm/react-transition-group@4.4.5_react-dom@19.2.8_react@19.2.8__react@19.2.8/vendor/react-transition-group/esm/Transition.js';
 
 const classNameGenerator = ce({
     base: [

package/lib/components/AccordionPanel/AccordionPanelContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanelContent.js","sources":["../../../src/components/AccordionPanel/AccordionPanelContent.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n  useMemo,\n  useRef,\n} from 'react'\nimport { Transition } from 'react-transition-group'\nimport { tv } from 'tailwind-variants'\n\nimport { getIsInclude } from '../../libs/map'\n\nimport { AccordionPanelContext } from './AccordionPanel'\nimport { AccordionPanelItemContext } from './AccordionPanelItem'\n\ntype AbstractProps = PropsWithChildren\ntype Props = AbstractProps & Omit<ComponentPropsWithoutRef<'div'>, keyof AbstractProps>\n\nconst classNameGenerator = tv({\n  base: [\n    'smarthr-ui-AccordionPanel-content',\n    'shr-invisible shr-max-h-0 shr-opacity-0 shr-transition-[max-height,_visible,_opacity] shr-duration-150 shr-ease-in-out',\n    '[&.entered]:shr-visible [&.entered]:shr-max-h-[revert] [&.entered]:shr-opacity-100',\n    // HINT: flexなどで囲まれると、非表示だが内容分高さが出てしまい、スクロール領域が不自然に伸びてしまう現象が起きる場合がある\n    // 非表示の場合、visually hiddenを適用することで、内容としては残しつつ、高さを0にすることで回避する\n    'aria-[hidden]:shr-absolute aria-[hidden]:shr-h-px aria-[hidden]:shr-overflow-hidden',\n  ],\n})\n\nexport const AccordionPanelContent: FC<Props> = ({ className, ...rest }) => {\n  const { name, contentId, triggerId } = useContext(AccordionPanelItemContext)\n  const { expandedItems } = useContext(AccordionPanelContext)\n  const visible = useMemo(() => getIsInclude(expandedItems, name), [expandedItems, name])\n  const wrapperRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <Transition in={visible} timeout={150} nodeRef={wrapperRef}>\n      {(status) => (\n        <div\n          {...rest}\n          ref={wrapperRef}\n          id={contentId}\n          aria-labelledby={triggerId}\n          aria-hidden={visible ? undefined : true}\n          className={`${actualClassName} ${status}`}\n        />\n      )}\n    </Transition>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;AAqBA;AACE;;;;;;;AAOC;AACF;AAEM;AACL;;;AAGA;AACA;;AAgBF;;"}
+{"version":3,"file":"AccordionPanelContent.js","sources":["../../../src/components/AccordionPanel/AccordionPanelContent.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n  useMemo,\n  useRef,\n} from 'react'\nimport { Transition } from 'react-transition-group'\nimport { tv } from 'tailwind-variants'\n\nimport { getIsInclude } from '../../libs/map'\n\nimport { AccordionPanelContext } from './AccordionPanel'\nimport { AccordionPanelItemContext } from './AccordionPanelItem'\n\ntype BaseProps = PropsWithChildren\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nconst classNameGenerator = tv({\n  base: [\n    'smarthr-ui-AccordionPanel-content',\n    'shr-invisible shr-max-h-0 shr-opacity-0 shr-transition-[max-height,_visible,_opacity] shr-duration-150 shr-ease-in-out',\n    '[&.entered]:shr-visible [&.entered]:shr-max-h-[revert] [&.entered]:shr-opacity-100',\n    // HINT: flexなどで囲まれると、非表示だが内容分高さが出てしまい、スクロール領域が不自然に伸びてしまう現象が起きる場合がある\n    // 非表示の場合、visually hiddenを適用することで、内容としては残しつつ、高さを0にすることで回避する\n    'aria-[hidden]:shr-absolute aria-[hidden]:shr-h-px aria-[hidden]:shr-overflow-hidden',\n  ],\n})\n\nexport const AccordionPanelContent: FC<Props> = ({ className, ...rest }) => {\n  const { name, contentId, triggerId } = useContext(AccordionPanelItemContext)\n  const { expandedItems } = useContext(AccordionPanelContext)\n  const visible = useMemo(() => getIsInclude(expandedItems, name), [expandedItems, name])\n  const wrapperRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <Transition in={visible} timeout={150} nodeRef={wrapperRef}>\n      {(status) => (\n        <div\n          {...rest}\n          ref={wrapperRef}\n          id={contentId}\n          aria-labelledby={triggerId}\n          aria-hidden={visible ? undefined : true}\n          className={`${actualClassName} ${status}`}\n        />\n      )}\n    </Transition>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;AAqBA;AACE;;;;;;;AAOC;AACF;AAEM;AACL;;;AAGA;AACA;;AAgBF;;"}

package/lib/components/AccordionPanel/AccordionPanelItem.cjs

@@ -3,7 +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 index = require('./../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.46_@types_node@20.19.43_typescript@5.9.3__/vendor/tailwind-variants/dist/index.cjs');
 var components_SectioningContent_SectioningContent = require('../SectioningContent/SectioningContent.cjs');
 require('../SectioningContent/levelContext.cjs');
 require('styled-components');

package/lib/components/AccordionPanel/AccordionPanelItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanelItem.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanelItem.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Section } from '../SectioningContent'\n\ntype AbstractProps = PropsWithChildren<{\n  /** アイテムを識別するための名前 */\n  name: string\n}>\ntype Props = AbstractProps & Omit<ComponentPropsWithoutRef<'section'>, keyof AbstractProps>\n\nexport const AccordionPanelItemContext = createContext<{\n  name: string\n  triggerId: string\n  contentId: string\n}>({\n  name: '',\n  triggerId: '',\n  contentId: '',\n})\n\nconst classNameGenerator = tv({\n  base: ['smarthr-ui-AccordionPanel-item', '[&_+_&]:shr-border-t-shorthand'],\n})\n\nexport const AccordionPanelItem: FC<Props> = ({ name, className, ...rest }) => {\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <AccordionPanelItemContext.Provider\n      value={{\n        name,\n        triggerId: `${name}-trigger`,\n        contentId: `${name}-content`,\n      }}\n    >\n      <Section {...rest} className={actualClassName} />\n    </AccordionPanelItemContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;AAmBO;AAKL;AACA;AACA;AACD;AAED;AACE;AACD;AAEM;AACL;AAEA;;;;;AAWF;;;"}
+{"version":3,"file":"AccordionPanelItem.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanelItem.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Section } from '../SectioningContent'\n\ntype BaseProps = PropsWithChildren<{\n  /** アイテムを識別するための名前 */\n  name: string\n}>\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'section'>, keyof BaseProps>\n\nexport const AccordionPanelItemContext = createContext<{\n  name: string\n  triggerId: string\n  contentId: string\n}>({\n  name: '',\n  triggerId: '',\n  contentId: '',\n})\n\nconst classNameGenerator = tv({\n  base: ['smarthr-ui-AccordionPanel-item', '[&_+_&]:shr-border-t-shorthand'],\n})\n\nexport const AccordionPanelItem: FC<Props> = ({ name, className, ...rest }) => {\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <AccordionPanelItemContext.Provider\n      value={{\n        name,\n        triggerId: `${name}-trigger`,\n        contentId: `${name}-content`,\n      }}\n    >\n      <Section {...rest} className={actualClassName} />\n    </AccordionPanelItemContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;AAmBO;AAKL;AACA;AACA;AACD;AAED;AACE;AACD;AAEM;AACL;AAEA;;;;;AAWF;;;"}

package/lib/components/AccordionPanel/AccordionPanelItem.d.ts

@@ -1,9 +1,9 @@
 import { type ComponentPropsWithoutRef, type FC, type PropsWithChildren } from 'react';
-type AbstractProps = PropsWithChildren<{
+type BaseProps = PropsWithChildren<{
     /** アイテムを識別するための名前 */
     name: string;
 }>;
-type Props = AbstractProps & Omit<ComponentPropsWithoutRef<'section'>, keyof AbstractProps>;
+type Props = BaseProps & Omit<ComponentPropsWithoutRef<'section'>, keyof BaseProps>;
 export declare const AccordionPanelItemContext: import("react").Context<{
     name: string;
     triggerId: string;

package/lib/components/AccordionPanel/AccordionPanelItem.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { createContext, useMemo } 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 { tv as ce } from './../../vendor/.pnpm/tailwind-variants@0.3.1_tailwindcss@3.4.19_ts-node@10.9.2_@swc_core@1.15.46_@types_node@20.19.43_typescript@5.9.3__/vendor/tailwind-variants/dist/index.js';
 import { Section } from '../SectioningContent/SectioningContent.js';
 import '../SectioningContent/levelContext.js';
 import 'styled-components';

package/lib/components/AccordionPanel/AccordionPanelItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanelItem.js","sources":["../../../src/components/AccordionPanel/AccordionPanelItem.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Section } from '../SectioningContent'\n\ntype AbstractProps = PropsWithChildren<{\n  /** アイテムを識別するための名前 */\n  name: string\n}>\ntype Props = AbstractProps & Omit<ComponentPropsWithoutRef<'section'>, keyof AbstractProps>\n\nexport const AccordionPanelItemContext = createContext<{\n  name: string\n  triggerId: string\n  contentId: string\n}>({\n  name: '',\n  triggerId: '',\n  contentId: '',\n})\n\nconst classNameGenerator = tv({\n  base: ['smarthr-ui-AccordionPanel-item', '[&_+_&]:shr-border-t-shorthand'],\n})\n\nexport const AccordionPanelItem: FC<Props> = ({ name, className, ...rest }) => {\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <AccordionPanelItemContext.Provider\n      value={{\n        name,\n        triggerId: `${name}-trigger`,\n        contentId: `${name}-content`,\n      }}\n    >\n      <Section {...rest} className={actualClassName} />\n    </AccordionPanelItemContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;AAmBO;AAKL;AACA;AACA;AACD;AAED;AACE;AACD;AAEM;AACL;AAEA;;;;;AAWF;;"}
+{"version":3,"file":"AccordionPanelItem.js","sources":["../../../src/components/AccordionPanel/AccordionPanelItem.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useMemo,\n} from 'react'\nimport { tv } from 'tailwind-variants'\n\nimport { Section } from '../SectioningContent'\n\ntype BaseProps = PropsWithChildren<{\n  /** アイテムを識別するための名前 */\n  name: string\n}>\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'section'>, keyof BaseProps>\n\nexport const AccordionPanelItemContext = createContext<{\n  name: string\n  triggerId: string\n  contentId: string\n}>({\n  name: '',\n  triggerId: '',\n  contentId: '',\n})\n\nconst classNameGenerator = tv({\n  base: ['smarthr-ui-AccordionPanel-item', '[&_+_&]:shr-border-t-shorthand'],\n})\n\nexport const AccordionPanelItem: FC<Props> = ({ name, className, ...rest }) => {\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <AccordionPanelItemContext.Provider\n      value={{\n        name,\n        triggerId: `${name}-trigger`,\n        contentId: `${name}-content`,\n      }}\n    >\n      <Section {...rest} className={actualClassName} />\n    </AccordionPanelItemContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;AAmBO;AAKL;AACA;AACA;AACD;AAED;AACE;AACD;AAEM;AACL;AAEA;;;;;AAWF;;"}