@cakejp/design-system 0.16.0 → 0.17.0

package/dist/lib/field-labelling.js

@@ -0,0 +1,29 @@
+import * as a from "react";
+const n = a.createContext(null);
+function t() {
+  return a.useContext(n);
+}
+function d(r, e) {
+  if (!e) return {};
+  const i = [e.descriptionId, e.errorId].filter(Boolean).join(" ");
+  return {
+    id: r.id ?? e.controlId,
+    // aria-label が明示されていれば labelledby は当てない（二重命名を避ける）
+    "aria-labelledby": r["aria-labelledby"] ?? (r["aria-label"] ? void 0 : e.labelId),
+    "aria-describedby": r["aria-describedby"] ?? (i || void 0)
+  };
+}
+function o(r, e) {
+  if (!e) return {};
+  const i = [e.descriptionId, e.errorId].filter(Boolean).join(" ");
+  return {
+    id: r.id ?? e.controlId,
+    "aria-describedby": r["aria-describedby"] ?? (i || void 0)
+  };
+}
+export {
+  n as FieldLabellingContext,
+  d as resolveFieldAria,
+  o as resolveNativeFieldAria,
+  t as useFieldLabelling
+};

package/dist/lib/focus-ring.js

@@ -0,0 +1,6 @@
+const i = "focus-visible:border-[var(--Focus-High-Emphasis)] focus-visible:ring-[3px] focus-visible:ring-[var(--Focus-High-Emphasis)]/50", s = "focus-within:border-[var(--Focus-High-Emphasis)] focus-within:ring-[3px] focus-within:ring-[var(--Focus-High-Emphasis)]/50", o = "focus-visible:ring-[3px] focus-visible:ring-inset focus-visible:ring-[var(--Focus-High-Emphasis)]/50";
+export {
+  i as FOCUS_RING,
+  o as FOCUS_RING_INSET,
+  s as FOCUS_RING_WITHIN
+};

package/dist/lib/pagination-range.js

@@ -0,0 +1,42 @@
+function p({
+  currentPage: f,
+  totalPages: g,
+  siblingCount: c = 1
+}) {
+  const t = Math.max(0, Math.floor(g));
+  if (t === 0) return [];
+  const n = Math.max(0, Math.floor(c)), e = Math.min(t, Math.max(1, Math.floor(f))), m = n * 2 + 5;
+  if (t <= m)
+    return Array.from({ length: t }, (r, i) => i + 1);
+  const s = Math.max(e - n, 1), l = Math.min(e + n, t), a = s > 2, h = l < t - 1, o = n * 2 + 3;
+  if (!a && h)
+    return [
+      ...Array.from({ length: o }, (r, i) => i + 1),
+      "ellipsis",
+      t
+    ];
+  if (a && !h) {
+    const r = t - o + 1;
+    return [
+      1,
+      "ellipsis",
+      ...Array.from(
+        { length: o },
+        (i, M) => r + M
+      )
+    ];
+  }
+  return [
+    1,
+    "ellipsis",
+    ...Array.from(
+      { length: l - s + 1 },
+      (r, i) => s + i
+    ),
+    "ellipsis",
+    t
+  ];
+}
+export {
+  p as getPaginationRange
+};

package/dist/lib/use-value-length.js

@@ -0,0 +1,63 @@
+import * as u from "react";
+function a(e, c) {
+  if (typeof e == "function") {
+    const r = e(c);
+    return typeof r == "function" ? r : void 0;
+  }
+  e && typeof e == "object" && (e.current = c);
+}
+function y(e, c) {
+  const r = Object.getOwnPropertyDescriptor(e, "value"), i = Object.getOwnPropertyDescriptor(
+    Object.getPrototypeOf(e),
+    "value"
+  ), t = r ?? i;
+  if (!t?.get || !t.set || t.configurable === !1)
+    return;
+  const l = function() {
+    return t.get.call(this);
+  }, s = function(n) {
+    t.set.call(this, n), c();
+  };
+  return Object.defineProperty(e, "value", {
+    configurable: !0,
+    enumerable: t.enumerable,
+    get: l,
+    set: s
+  }), () => {
+    const n = Object.getOwnPropertyDescriptor(e, "value");
+    n?.get !== l || n.set !== s || (r ? Object.defineProperty(e, "value", r) : Reflect.deleteProperty(e, "value"));
+  };
+}
+function O({
+  enabled: e,
+  value: c,
+  defaultValue: r,
+  forwardedRef: i
+}) {
+  const t = c !== void 0, l = u.useRef(null), s = u.useRef(void 0), n = u.useRef(void 0), [g, v] = u.useState(
+    () => r != null ? String(r).length : 0
+  ), f = u.useCallback(() => {
+    const o = l.current;
+    o && v(o.value.length);
+  }, []), b = u.useCallback(
+    (o) => {
+      if (s.current?.(), s.current = void 0, l.current = o, !o) {
+        const p = n.current;
+        n.current = void 0, p ? p() : a(i, null);
+        return;
+      }
+      n.current = a(i, o), e && !t && (s.current = y(o, f));
+    },
+    [e, i, t, f]
+  );
+  return u.useLayoutEffect(() => {
+    !e || t || f();
+  }), {
+    ref: b,
+    length: t ? String(c ?? "").length : g,
+    syncFromDom: f
+  };
+}
+export {
+  O as useValueLength
+};

package/dist/lib/utils.js

@@ -0,0 +1,33 @@
+import { clsx as t } from "clsx";
+import { extendTailwindMerge as e } from "tailwind-merge";
+const p = [
+  "typo-heading-5xl",
+  "typo-heading-4xl",
+  "typo-heading-3xl",
+  "typo-heading-2xl",
+  "typo-heading-xl",
+  "typo-heading-lg",
+  "typo-heading-md",
+  "typo-heading-sm",
+  "typo-body-lg",
+  "typo-body-md",
+  "typo-body-sm",
+  "typo-body-xs",
+  "typo-label-lg",
+  "typo-label-md",
+  "typo-label-sm",
+  "typo-label-xs"
+], y = e({
+  extend: {
+    classGroups: {
+      "cake-typography": p
+    }
+  }
+});
+function n(...o) {
+  return y(t(o));
+}
+export {
+  p as TYPO_PRESET_CLASS_NAMES,
+  n as cn
+};

package/dist/types/components/ec/_mypage-menu-data.d.ts

@@ -1,4 +1,4 @@
-import type { SideNavGroup } from "../../components/primitives/side-nav";
+import type { SideNavGroup } from "../../../components/primitives/side-nav";
 /**
  * Cake.jp マイページのメニュー定義
  *
@@ -6,8 +6,8 @@ import type { SideNavGroup } from "../../components/primitives/side-nav";
  *
  * ### 使い方
  * ```tsx
- * import { SideNav } from '../../components/primitives/side-nav'
- * import { mypageMenuGroups } from '../../components/ec/_mypage-menu-data'
+ * import { SideNav } from '../../../components/primitives/side-nav'
+ * import { mypageMenuGroups } from '../../../components/ec/_mypage-menu-data'
  *
  * <SideNav groups={mypageMenuGroups} activeMenu="news" ariaLabel="マイページメニュー" />
  * ```

package/dist/types/components/ec/admin-shell.d.ts

@@ -27,7 +27,7 @@
  * - CSS: admin_shops/layout/nav_layout.css
  */
 import * as React from "react";
-import { type AdminNavItem } from "../../components/primitives/admin-side-nav";
+import { type AdminNavItem } from "../../../components/primitives/admin-side-nav";
 export declare function MissingComponent({ name, children, className, }: {
     name: string;
     children: React.ReactNode;

package/dist/types/components/ec/anniversary-card.d.ts

@@ -25,7 +25,7 @@ export interface AnniversaryCardProps extends React.HTMLAttributes<HTMLDivElemen
  *
  * ### インポート
  * ```tsx
- * import { AnniversaryCard } from '../../components/ec/anniversary-card'
+ * import { AnniversaryCard } from '../../../components/ec/anniversary-card'
  * ```
  *
  * ### Props（主要なもの）

package/dist/types/components/ec/mypage-shell.d.ts

@@ -27,9 +27,9 @@
  * 「マイページ配下だけ Cake.jp ロゴに割れる」問題を避けられる。
  */
 import React from "react";
-import { type HeaderAction, type HeaderNavItem } from "../../components/primitives/header";
-import { type SideNavGroup, type SideNavItem } from "../../components/primitives/side-nav";
-import { type BottomTabBarItem } from "../../components/primitives/bottom-tab-bar";
+import { type HeaderAction, type HeaderNavItem } from "../../../components/primitives/header";
+import { type SideNavGroup, type SideNavItem } from "../../../components/primitives/side-nav";
+import { type BottomTabBarItem } from "../../../components/primitives/bottom-tab-bar";
 export interface MypageShellBreadcrumb {
     label: string;
     href?: string;

package/dist/types/components/ec/product-card.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { type TagProps } from "../../components/primitives/tag";
+import { type TagProps } from "../../../components/primitives/tag";
 export interface ProductCardProps extends React.HTMLAttributes<HTMLDivElement> {
     /** 商品名 */
     name: string;

package/dist/types/components/ec/product-carousel.d.ts

@@ -1,5 +1,5 @@
-import { type SectionHeaderSize } from "../../components/primitives/section-header";
-import { type ProductCardProps } from "../../components/ec/product-card";
+import { type SectionHeaderSize } from "../../../components/primitives/section-header";
+import { type ProductCardProps } from "../../../components/ec/product-card";
 export interface ProductCarouselProps {
     /** セクションタイトル */
     title: string;
@@ -40,7 +40,7 @@ export interface ProductCarouselProps {
  *
  * ### インポート
  * ```tsx
- * import { ProductCarousel } from '../../components/ec/product-carousel'
+ * import { ProductCarousel } from '../../../components/ec/product-carousel'
  * ```
  *
  * ### AI 向け使用ルール

package/dist/types/components/ec/stat-card.d.ts

@@ -6,7 +6,7 @@
  *
  * ### インポート
  * ```tsx
- * import { StatCard } from '../../components/ec/stat-card'
+ * import { StatCard } from '../../../components/ec/stat-card'
  * ```
  *
  * ### Props

package/dist/types/components/foundations/accordion.d.ts

@@ -2,6 +2,13 @@ import * as React from "react";
 import { Accordion as AccordionPrimitive } from "radix-ui";
 declare function Accordion({ ...props }: React.ComponentProps<typeof AccordionPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
 declare function AccordionItem({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
-declare function AccordionTrigger({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+interface AccordionTriggerProps extends React.ComponentProps<typeof AccordionPrimitive.Trigger> {
+    /**
+     * 見出し要素のレベル（既定: 3 = radix Accordion.Header の既定 <h3>）。
+     * ページの見出し階層に合わせて変更する（例: サイドバーのカテゴリナビで h2）。
+     */
+    headingLevel?: 2 | 3 | 4 | 5 | 6;
+}
+declare function AccordionTrigger({ className, children, headingLevel, ...props }: AccordionTriggerProps): import("react/jsx-runtime").JSX.Element;
 declare function AccordionContent({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
 export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/types/components/foundations/alert-dialog.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { AlertDialog as AlertDialogPrimitive } from "radix-ui";
-import { Button } from "../../components/foundations/button";
+import { Button } from "../../../components/foundations/button";
 declare function AlertDialog({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogTrigger({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
 declare function AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/foundations/calendar.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { DayPicker, type DayButton } from "react-day-picker";
-import { Button } from "../../components/foundations/button";
+import { Button } from "../../../components/foundations/button";
 declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
     buttonVariant?: React.ComponentProps<typeof Button>["variant"];
 }): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/foundations/checkbox-group.d.ts

@@ -6,7 +6,7 @@
  *
  * ### インポート
  * ```tsx
- * import { CheckboxGroup, CheckboxGroupItem } from "../../components/foundations/checkbox-group"
+ * import { CheckboxGroup, CheckboxGroupItem } from "../../../components/foundations/checkbox-group"
  * ```
  *
  * ### Props（CheckboxGroup）

package/dist/types/components/foundations/command.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { Command as CommandPrimitive } from "cmdk";
-import { Dialog } from "../../components/foundations/dialog";
+import { Dialog } from "../../../components/foundations/dialog";
 declare function Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>): import("react/jsx-runtime").JSX.Element;
 declare function CommandDialog({ title, description, children, className, showCloseButton, ...props }: React.ComponentProps<typeof Dialog> & {
     title?: string;

package/dist/types/components/foundations/data-table.d.ts

@@ -91,7 +91,7 @@ declare function DataTableInputCell({ className, value, onChange, placeholder, t
     type?: string;
     name?: string;
 }): import("react/jsx-runtime").JSX.Element;
-declare function DataTableSelectCell({ className, value, onValueChange, options, placeholder, ...props }: Omit<React.ComponentProps<"td">, "children" | "width" | "align"> & {
+declare function DataTableSelectCell({ className, value, onValueChange, options, placeholder, "aria-label": ariaLabel, ...props }: Omit<React.ComponentProps<"td">, "children" | "width" | "align"> & {
     value?: string;
     onValueChange?: (value: string) => void;
     options: Array<{
@@ -99,6 +99,11 @@ declare function DataTableSelectCell({ className, value, onValueChange, options,
         label: string;
     }>;
     placeholder?: string;
+    /**
+     * セレクトのアクセシブルネーム（日本語）。表の見出しに相当する語を渡す。
+     * 未指定時は placeholder を名前に使う（`role="combobox"` は内容から名前が付かないため）。
+     */
+    "aria-label"?: string;
 }): import("react/jsx-runtime").JSX.Element;
 declare function DataTableNumberCell({ className, children, ...props }: Omit<React.ComponentProps<"td">, "width" | "align">): import("react/jsx-runtime").JSX.Element;
 export { DataTable, DataTableTable, DataTableHeader, DataTableBody, DataTableRow, DataTableHead, DataTableCell, DataTableAvatarCell, DataTableImageCell, DataTableLinkCell, DataTableCheckboxCell, DataTableActionCell, DataTableInputCell, DataTableSelectCell, DataTableNumberCell, DataTableDragHandleCell, DataTableBulkActions, DataTableSectionRow, DataTableAddRow, DataTableEmptyState, };

package/dist/types/components/foundations/field.d.ts

@@ -7,7 +7,7 @@
  *
  * ### インポート
  * ```tsx
- * import { Field, FieldLabel, FieldSet, FieldLegend, FieldGroup, FieldDescription, FieldError, FieldSeparator } from "../../components/foundations/field"
+ * import { Field, FieldLabel, FieldSet, FieldLegend, FieldGroup, FieldDescription, FieldError, FieldSeparator } from "../../../components/foundations/field"
  * ```
  *
  * ### 構成要素
@@ -32,7 +32,7 @@
  */
 import * as React from "react";
 import { type VariantProps } from "class-variance-authority";
-import { Label } from "../../components/foundations/label";
+import { Label } from "../../../components/foundations/label";
 /**
  * Field — 1 フィールド分の箱（ラベル + 入力 + 説明/エラー）。
  * `FieldGroup`（gap-4）の中に並べる**縦リズムの最小単位**。

package/dist/types/components/foundations/file-input.d.ts

@@ -63,7 +63,7 @@ export declare function validateFileSize(files: File[], maxSize?: number): {
  *
  * ### インポート
  * ```tsx
- * import { FileInput } from '../../components/foundations/file-input'
+ * import { FileInput } from '../../../components/foundations/file-input'
  * ```
  *
  * ### AI 向け使用ルール

package/dist/types/components/foundations/pagination.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { type Button } from "../../components/foundations/button";
+import { type Button } from "../../../components/foundations/button";
 declare function Pagination({ className, ...props }: React.ComponentProps<"nav">): import("react/jsx-runtime").JSX.Element;
 declare function PaginationContent({ className, ...props }: React.ComponentProps<"ul">): import("react/jsx-runtime").JSX.Element;
 declare function PaginationItem({ ...props }: React.ComponentProps<"li">): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/foundations/responsive-dialog.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { DialogClose, DialogContent, DialogDescription, DialogTitle, DialogTrigger } from "../../components/foundations/dialog";
+import { DialogClose, DialogContent, DialogDescription, DialogTitle, DialogTrigger } from "../../../components/foundations/dialog";
 declare function useIsMobile(breakpoint?: number): boolean;
 interface ResponsiveDialogProps {
     children: React.ReactNode;

package/dist/types/components/foundations/skip-link.d.ts

@@ -19,7 +19,7 @@ export interface SkipLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElem
  *
  * ### インポート
  * ```tsx
- * import { SkipLink } from '../../components/foundations/skip-link'
+ * import { SkipLink } from '../../../components/foundations/skip-link'
  * ```
  *
  * ### 使い方（シェルを使わず素の DOM に置く場合）

package/dist/types/components/foundations/slider.d.ts

@@ -1,4 +1,16 @@
 import * as React from "react";
 import { Slider as SliderPrimitive } from "radix-ui";
-declare function Slider({ className, defaultValue, value, min, max, ...props }: React.ComponentProps<typeof SliderPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+export interface SliderProps extends React.ComponentProps<typeof SliderPrimitive.Root> {
+    /**
+     * つまみ（thumb）ごとのアクセシブルネーム（日本語）。
+     *
+     * `role="slider"` を持つのは **つまみ側**なので、名前はつまみに付ける必要がある。
+     * 未指定のときは次の順で決まる（issue #202）:
+     * 1. `aria-label` … つまみが 2 つ以上なら「（下限）」「（上限）」を補って区別する
+     * 2. `FormField` 配下ならそのラベル
+     * 3. `aria-labelledby`
+     */
+    thumbLabels?: string[];
+}
+declare function Slider({ className, defaultValue, value, min, max, thumbLabels, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...props }: SliderProps): import("react/jsx-runtime").JSX.Element;
 export { Slider };

package/dist/types/components/primitives/admin-header.d.ts

@@ -15,9 +15,19 @@ export interface AdminHeaderProps {
  * のレール（--Z-Sticky = 30）が始まる＝ヘッダーが最前面・全幅で、レールはヘッダー帯に重ならない。
  * 「{shopName}管理」のような文言合成は行わない（利用側が `brand` に組み立てて渡す）。
  *
+ * ### ページタイトルを複製しない
+ *
+ * ページ名の正は本文の h1（`AdminShell` の `title`）。ヘッダーにはブランド・パンくず（現在地の文脈）・
+ * グローバル操作を置き、同じページ名をヘッダーにも出さない。置くものが無ければヘッダーバー自体を省いてよい。
+ *
+ * ### 水平 padding は本文コンテナの gutter と揃える
+ *
+ * `px-4 @md:px-6` は `AdminShell` の `<main>`（`p-4 @md:p-6`）と同値。ヘッダー内要素の左端と
+ * 本文 h1 の左端が同じ面に乗る。片方だけ変えるとズレが視認されるので、変更するときは両方揃えて変える。
+ *
  * ### インポート
  * ```tsx
- * import { AdminHeader } from '../../components/primitives/admin-header'
+ * import { AdminHeader } from '../../../components/primitives/admin-header'
  * ```
  *
  * ### Props

package/dist/types/components/primitives/admin-side-nav.d.ts

@@ -48,9 +48,27 @@ export interface AdminSideNavProps {
  * SP は制御された左スライドドロワー（サブメニューはアコーディオン）で表示する。
  * メニュー定義・文言・データは全て `items` prop で受け取り、部品側には焼き込まない。
  *
+ * ### サイドバーは 1 枚のパネルとして読ませる
+ *
+ * ヘッダー行（SP ドロワー上部の見出し + 閉じるボタン）に **border-bottom を引かない**。
+ * フッター（ユーザーブロック・ヘルプ導線等）を設ける場合も **上に border-top を引かない**。
+ * サイドバー内部を横線で区切るとパネルが分割されて見え、ナビの一体感が失われる。分離は余白が担う。
+ * 画面全体で見える横罫線は ①サイドバー右端の縦線 ②コンテンツヘッダー下の横線 の 2 本に絞り、
+ * サイドバー内で横線を引くと 2 本が十字に交差して見える（正しくは T 字で突き当たる）。
+ *
+ * ### 折りたたみトリガーはサイドバー自身に置く
+ *
+ * サイドバーに開閉（折りたたみ）を持たせる場合、トリガーは **サイドバー内ヘッダー行の右端** に置く。
+ * コンテンツヘッダーの左端に置くと、動かす対象と操作する場所が離れて所属が読めなくなる。
+ *
+ * ### 項目高は 44px を確保する
+ *
+ * メイン項目・サブメニュー項目とも 44px（WCAG 2.5.5 の最小ターゲット）以上にする。
+ * 行高が小さいテキストで縦 padding だけに頼ると割り込むため、`min-h-11` で下限を固定する。
+ *
  * ### インポート
  * ```tsx
- * import { AdminSideNav } from '../../components/primitives/admin-side-nav'
+ * import { AdminSideNav } from '../../../components/primitives/admin-side-nav'
  * ```
  *
  * ### Props

package/dist/types/components/primitives/banner-carousel.d.ts

@@ -1,4 +1,4 @@
-import { type SectionHeaderSize } from "../../components/primitives/section-header";
+import { type SectionHeaderSize } from "../../../components/primitives/section-header";
 export interface BannerItem {
     /** バナー画像URL */
     imageUrl: string;
@@ -40,7 +40,7 @@ export interface BannerCarouselProps {
  *
  * ### インポート
  * ```tsx
- * import { BannerCarousel } from '../../components/primitives/banner-carousel'
+ * import { BannerCarousel } from '../../../components/primitives/banner-carousel'
  * ```
  *
  * ### AI 向け使用ルール

package/dist/types/components/primitives/category-scroll.d.ts

@@ -1,4 +1,4 @@
-import { type SectionHeaderSize } from "../../components/primitives/section-header";
+import { type SectionHeaderSize } from "../../../components/primitives/section-header";
 export interface CategoryItem {
     /** カテゴリ名 */
     name: string;
@@ -47,7 +47,7 @@ export interface CategoryScrollProps {
  *
  * ### インポート
  * ```tsx
- * import { CategoryScroll } from '../../components/primitives/category-scroll'
+ * import { CategoryScroll } from '../../../components/primitives/category-scroll'
  * ```
  *
  * ### Props（主要なもの）

package/dist/types/components/primitives/category-shortcuts.d.ts

@@ -31,7 +31,7 @@ export interface CategoryShortcutsProps {
  *
  * ### インポート
  * ```tsx
- * import { CategoryShortcuts } from '../../components/primitives/category-shortcuts'
+ * import { CategoryShortcuts } from '../../../components/primitives/category-shortcuts'
  * ```
  *
  * ### AI 向け使用ルール

package/dist/types/components/primitives/chat-composer.d.ts

@@ -70,7 +70,7 @@ export interface ChatComposerProps {
  *
  * ### インポート
  * ```tsx
- * import { ChatComposer } from "../../components/primitives/chat-composer"
+ * import { ChatComposer } from "../../../components/primitives/chat-composer"
  * ```
  *
  * ### 送信キー

package/dist/types/components/primitives/chip.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { chipVariants, type ChipVariantProps } from "../../components/foundations/chip-variants";
+import { chipVariants, type ChipVariantProps } from "../../../components/foundations/chip-variants";
 export interface ChipProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, ChipVariantProps {
     /** リンクとして使う場合のURL */
     href?: string;

package/dist/types/components/primitives/combobox.d.ts

@@ -19,6 +19,14 @@ export interface ComboboxProps {
     "aria-invalid"?: boolean;
     /** FieldError / FieldDescription の id */
     "aria-describedby"?: string;
+    /**
+     * トリガーのアクセシブルネーム（日本語）。
+     * `role="combobox"` は内容からは名前が付かないため、FormField の外で単体利用する
+     * ときはこれか `aria-labelledby` を指定する（未指定時は placeholder を名前に使う）。
+     */
+    "aria-label"?: string;
+    /** ラベル要素の id を直接指定する場合 */
+    "aria-labelledby"?: string;
 }
-declare function Combobox({ options, value, onValueChange, placeholder, searchPlaceholder, emptyLabel, disabled, className, id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: ComboboxProps): import("react/jsx-runtime").JSX.Element;
+declare function Combobox({ options, value, onValueChange, placeholder, searchPlaceholder, emptyLabel, disabled, className, id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, }: ComboboxProps): import("react/jsx-runtime").JSX.Element;
 export { Combobox };

package/dist/types/components/primitives/content-carousel.d.ts

@@ -44,7 +44,7 @@ export interface ContentCarouselProps extends Omit<React.HTMLAttributes<HTMLDivE
  *
  * ### インポート
  * ```tsx
- * import { ContentCarousel } from '../../components/primitives/content-carousel'
+ * import { ContentCarousel } from '../../../components/primitives/content-carousel'
  * ```
  *
  * ### AI 向け使用ルール

package/dist/types/components/primitives/form-field.d.ts

@@ -6,7 +6,7 @@
  *
  * ### インポート
  * ```tsx
- * import { FormField } from '../../components/primitives/form-field'
+ * import { FormField } from '../../../components/primitives/form-field'
  * ```
  *
  * ### Props

package/dist/types/components/primitives/image-input.d.ts

@@ -93,7 +93,7 @@ export interface ImageInputProps extends VariantProps<typeof imageInputPreviewVa
  *
  * ### インポート
  * ```tsx
- * import { ImageInput } from "../../components/primitives/image-input"
+ * import { ImageInput } from "../../../components/primitives/image-input"
  * ```
  *
  * ### 表示サイズ

package/dist/types/components/primitives/kebab-menu.d.ts

@@ -6,7 +6,7 @@
  *
  * ### インポート
  * ```tsx
- * import { KebabMenu } from '../../components/primitives/kebab-menu'
+ * import { KebabMenu } from '../../../components/primitives/kebab-menu'
  * ```
  *
  * ### Props

package/dist/types/components/primitives/menu-drawer.d.ts

@@ -55,21 +55,5 @@ export interface MenuDrawerProps extends React.HTMLAttributes<HTMLDivElement> {
     /** ログインリンクのhref（デフォルト: /security/login_link/） */
     loginHref?: string;
 }
-/**
- * メニュードロワー
- *
- * ハンバーガーメニューの中身。本番サイドナビと同じ構造。
- * Figma: Menu - Contents
- *
- * ### AI 向け使用ルール
- *
- * - ログイン時: `<MenuDrawer isLoggedIn userName="田中花子" sections={[...]} />`
- * - 未ログイン: `<MenuDrawer isLoggedIn={false} sections={[...]} />`
- * - Drawer コンポーネントの中に配置して使用
- * - セクションの `border` を true にするとセクション上部に区切り線を表示
- * - アイテムの `hasChildren` を true にすると右矢印（ドリルダウン）を表示
- * - カテゴリ系アイテムは `thumb` にサムネイル画像URLを指定
- * - `itemsExtra` は「すべて表示」で展開されるアイテム群
- */
 declare function MenuDrawer({ userName, isLoggedIn, hideLoginLink, sections, banners, onClose, onLogin, loginHref, className, ...props }: MenuDrawerProps): import("react/jsx-runtime").JSX.Element;
 export { MenuDrawer };

package/dist/types/components/primitives/multi-select.d.ts

@@ -19,6 +19,14 @@ export interface MultiSelectProps {
     "aria-invalid"?: boolean;
     /** FieldError / FieldDescription の id */
     "aria-describedby"?: string;
+    /**
+     * トリガーのアクセシブルネーム（日本語）。
+     * `role="combobox"` は内容からは名前が付かないため、FormField の外で単体利用する
+     * ときはこれか `aria-labelledby` を指定する（未指定時は placeholder を名前に使う）。
+     */
+    "aria-label"?: string;
+    /** ラベル要素の id を直接指定する場合 */
+    "aria-labelledby"?: string;
 }
-declare function MultiSelect({ options, value, onValueChange, placeholder, searchPlaceholder, emptyLabel, disabled, className, id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: MultiSelectProps): import("react/jsx-runtime").JSX.Element;
+declare function MultiSelect({ options, value, onValueChange, placeholder, searchPlaceholder, emptyLabel, disabled, className, id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, }: MultiSelectProps): import("react/jsx-runtime").JSX.Element;
 export { MultiSelect };