@godxjp/ui 18.0.0 → 18.0.1

package/dist/components/data-display/data-table.js

@@ -428,7 +428,7 @@ DataTable.Content = function DataTableContent() {
           className: "ui-data-table-surface min-w-[640px] sm:min-w-0",
           "data-striped": striped ? "" : void 0,
           "data-hoverable": hoverable ? "" : void 0,
-          children: /* @__PURE__ */ jsxs(Table, { children: [
+          children: /* @__PURE__ */ jsxs(Table, { scrollable: false, children: [
             /* @__PURE__ */ jsx(TableHeader, { className: cn("bg-secondary", stickyHeader && "sticky top-0 z-10"), children: /* @__PURE__ */ jsxs(TableRow, { children: [
               selectable && /* @__PURE__ */ jsx(TableHead, { className: "w-10", children: /* @__PURE__ */ jsx(DataTable.SelectAll, {}) }),
               visibleColumns.map((col) => {

package/dist/components/data-display/table.d.ts

@@ -1,5 +1,24 @@
 import * as React from "react";
-export declare const Table: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableElement> & React.RefAttributes<HTMLTableElement>>;
+export type TableProps = React.HTMLAttributes<HTMLTableElement> & {
+    /**
+     * Whether the Table owns its own horizontal-scroll region (default `true`). When `true` a
+     * table wider than its container scrolls inside a keyboard-reachable wrapper (WCAG 2.1.1 / axe
+     * `scrollable-region-focusable`). Set `false` when an ancestor already provides the scroll
+     * region (e.g. `DataTable`, whose `.ui-data-table-scroll` owns the overflow + tab stop) — this
+     * avoids a redundant NESTED scroll container and a duplicate keyboard focus stop for one table.
+     */
+    scrollable?: boolean;
+};
+export declare const Table: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableElement> & {
+    /**
+     * Whether the Table owns its own horizontal-scroll region (default `true`). When `true` a
+     * table wider than its container scrolls inside a keyboard-reachable wrapper (WCAG 2.1.1 / axe
+     * `scrollable-region-focusable`). Set `false` when an ancestor already provides the scroll
+     * region (e.g. `DataTable`, whose `.ui-data-table-scroll` owns the overflow + tab stop) — this
+     * avoids a redundant NESTED scroll container and a duplicate keyboard focus stop for one table.
+     */
+    scrollable?: boolean;
+} & React.RefAttributes<HTMLTableElement>>;
 export declare const TableHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
 export declare const TableBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
 export declare const TableRow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableRowElement> & React.RefAttributes<HTMLTableRowElement>>;

package/dist/components/data-display/table.js

@@ -3,19 +3,28 @@ import * as React from "react";
 import { tableHeadHeightClass } from "../../lib/control-styles.js";
 import { cn } from "../../lib/utils.js";
 const Table = React.forwardRef(
-  ({ className, ...props }, ref) => (
+  ({ className, scrollable = true, ...props }, ref) => (
     // A table wider than its container scrolls horizontally in this wrapper; keep it
     // keyboard-reachable so it can be scrolled without a pointer (WCAG 2.1.1 / axe
     // scrollable-region-focusable). No landmark role — avoids landmark-unique collisions.
-    /* @__PURE__ */ jsx("div", { className: "relative w-full overflow-auto", tabIndex: 0, children: /* @__PURE__ */ jsx(
-      "table",
+    // When `scrollable` is false an ancestor owns the scroll region, so this is a bare
+    // positioning box (no `overflow`, no tab stop) to avoid a redundant nested scroller.
+    /* @__PURE__ */ jsx(
+      "div",
       {
-        ref,
-        "data-slot": "table",
-        className: cn("w-full caption-bottom text-sm", className),
-        ...props
+        className: scrollable ? "relative w-full overflow-auto" : "relative w-full",
+        ...scrollable ? { tabIndex: 0 } : {},
+        children: /* @__PURE__ */ jsx(
+          "table",
+          {
+            ref,
+            "data-slot": "table",
+            className: cn("w-full caption-bottom text-sm", className),
+            ...props
+          }
+        )
       }
-    ) })
+    )
   )
 );
 Table.displayName = "Table";

package/dist/components/navigation/app-setting-picker.js

@@ -63,7 +63,8 @@ const ARIA_KEY = {
 };
 const BRAND_NONE = "__app__";
 const AppSettingPicker = React.forwardRef(
-  function AppSettingPicker2({ kind, appearance = "labeled", className, disabled, id, name, value, onValueChange }, ref) {
+  function AppSettingPicker2({ kind, appearance, className, disabled, id, name, value, onValueChange }, ref) {
+    const resolvedAppearance = appearance ?? (kind === "locale" ? "icon" : "labeled");
     const ctx = useOptionalAppContext();
     const { t, locale, fallbackLocale } = useTranslation();
     const raw = value ?? ctx?.[kind];
@@ -119,7 +120,7 @@ const AppSettingPicker = React.forwardRef(
     }, [kind, ctx?.timezoneOptions, current, t, locale, fallbackLocale]);
     const unbound = current === void 0 || !handleChange;
     const Icon = ICON[kind];
-    const iconOnly = appearance === "icon";
+    const iconOnly = resolvedAppearance === "icon";
     return /* @__PURE__ */ jsxs(
       Select,
       {
@@ -134,12 +135,12 @@ const AppSettingPicker = React.forwardRef(
             {
               ref,
               id,
+              showIndicator: !iconOnly,
               className: cn(
                 iconOnly ? (
-                  // Structurally icon-only: drop the owned width + value spacing, square the box to
-                  // the density-aware --control-height tap target, centre the icon and hide the
-                  // trailing chevron — no consumer descendant-selector overrides required.
-                  "w-[length:var(--control-height)] justify-center ps-0 pe-0 [&_[data-slot=select-chevron]]:hidden"
+                  // Structurally icon-only: drop the owned width + value spacing and square the box to
+                  // the density-aware --control-height tap target, centring the icon.
+                  "w-[length:var(--control-height)] justify-center ps-0 pe-0"
                 ) : (
                   // Labeled: sized to a per-kind width from `sm` up; below `sm` it hugs its content and
                   // caps at the container (`w-auto max-w-full`) instead of the old UNCONDITIONAL

package/dist/components/ui/tag-input.js

@@ -43,6 +43,7 @@ const TagInput = React.forwardRef(
       "div",
       {
         "data-slot": "tag-input",
+        "aria-disabled": disabled || void 0,
         className: cn("ui-tag-input", disabled && "ui-tag-input-disabled", className),
         children: [
           tags.length > 0 ? /* @__PURE__ */ jsx("ul", { role: "list", className: "ui-tag-input-list", "data-slot": "tag-input-list", children: tags.map((tag, i) => /* @__PURE__ */ jsxs(

package/dist/props/components/app.prop.d.ts

@@ -69,11 +69,15 @@ export type AppSettingKind = "locale" | "timezone" | "dateFormat" | "timeFormat"
 export type AppSettingPickerProp = {
     kind: AppSettingKind;
     /**
-     * Trigger presentation. `"labeled"` (default) shows the leading icon + the selected value in a
-     * full-width control. `"icon"` renders a supported square, icon-only topbar trigger (e.g. a globe
-     * language switcher): it structurally drops the value text and the picker's owned width — no
-     * descendant-selector CSS overrides needed — while always keeping the localized `aria-label`, so
-     * an icon-only trigger can never ship without an accessible name.
+     * Trigger presentation. `"labeled"` shows the leading icon + the selected value in a control
+     * sized to the setting. `"icon"` renders a supported square, icon-only topbar trigger (e.g. a
+     * globe language switcher): it structurally drops the value text and the picker's owned width —
+     * no descendant-selector CSS overrides needed — while always keeping the localized `aria-label`,
+     * so an icon-only trigger can never ship without an accessible name.
+     *
+     * Default is kind-dependent: `kind="locale"` defaults to `"icon"` (its product contract is the
+     * compact language switcher); every other kind defaults to `"labeled"`. Override explicitly for
+     * e.g. a labeled locale row inside a settings form (`appearance="labeled"`).
      */
     appearance?: AppSettingPickerAppearanceProp;
     className?: ClassNameProp;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@godxjp/ui",
-  "version": "18.0.0",
-  "godxUiMcp": "17.0.1",
+  "version": "18.0.1",
+  "godxUiMcp": "18.0.0",
   "type": "module",
   "packageManager": "pnpm@10.29.1",
   "sideEffects": false,