@godxjp/ui 31.1.0 → 31.3.0

package/dist/components/feedback/auth-expiry.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+const AuthExpiryContext = React.createContext(null);
+function AuthExpiryProvider({ onAuthExpired, children }) {
+  const handlerRef = React.useRef(onAuthExpired);
+  handlerRef.current = onAuthExpired;
+  const countRef = React.useRef(0);
+  const firedRef = React.useRef(false);
+  const [failed, setFailed] = React.useState(false);
+  const invoke = React.useCallback((error) => {
+    firedRef.current = true;
+    setFailed(false);
+    const fail = () => setFailed(true);
+    try {
+      const result = handlerRef.current({ error });
+      if (result && typeof result.then === "function") {
+        result.then(void 0, fail);
+      }
+    } catch {
+      fail();
+    }
+  }, []);
+  const register = React.useCallback(
+    (error) => {
+      countRef.current += 1;
+      if (!firedRef.current) invoke(error);
+      return () => {
+        countRef.current -= 1;
+        setTimeout(() => {
+          if (countRef.current === 0) {
+            firedRef.current = false;
+            setFailed(false);
+          }
+        }, 0);
+      };
+    },
+    [invoke]
+  );
+  const value = React.useMemo(
+    () => ({ register, retry: invoke, failed }),
+    [register, invoke, failed]
+  );
+  return /* @__PURE__ */ jsx(AuthExpiryContext.Provider, { value, children });
+}
+function useAuthExpiry(active, error) {
+  const ctx = React.useContext(AuthExpiryContext);
+  const errorRef = React.useRef(error);
+  errorRef.current = error;
+  const register = ctx?.register;
+  React.useEffect(() => {
+    if (!register || !active) return void 0;
+    return register(errorRef.current);
+  }, [register, active]);
+  if (!ctx || !active) return null;
+  return {
+    status: ctx.failed ? "failed" : "redirecting",
+    retry: () => ctx.retry(errorRef.current)
+  };
+}
+export {
+  AuthExpiryProvider,
+  useAuthExpiry
+};

package/dist/components/feedback/index.d.ts

@@ -14,4 +14,6 @@ export { Callout } from "./callout.js";
 export type { CalloutProp, CalloutProps } from "./callout.js";
 export { Alert, AlertTitle, AlertContent, AlertDescription, AlertActions, AlertQueryError, } from "./alert.js";
 export type { AlertProp, AlertProps, AlertTitleProp, AlertTitleProps, AlertContentProp, AlertContentProps, AlertDescriptionProp, AlertDescriptionProps, AlertActionsProp, AlertActionsProps, AlertQueryErrorProp, AlertQueryErrorProps, } from "./alert.js";
+export { AuthExpiryProvider } from "./auth-expiry.js";
+export type { AuthExpiryProviderProp, AuthExpiryProviderProps } from "./auth-expiry.js";
 export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from "./tooltip.js";

package/dist/components/feedback/index.js

@@ -66,6 +66,7 @@ import {
   AlertActions,
   AlertQueryError
 } from "./alert.js";
+import { AuthExpiryProvider } from "./auth-expiry.js";
 import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from "./tooltip.js";
 export {
   Alert,
@@ -86,6 +87,7 @@ export {
   AlertDialogTrigger,
   AlertQueryError,
   AlertTitle,
+  AuthExpiryProvider,
   Banner,
   Callout,
   Dialog,

package/dist/components/query/data-state.js

@@ -2,6 +2,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { AlertQueryError } from "../feedback/alert.js";
+import { useAuthExpiry } from "../feedback/auth-expiry.js";
 import { useTranslation } from "../../i18n/use-translation.js";
 import { classifyQueryError } from "../../lib/query-error.js";
 function defaultIsEmpty(data) {
@@ -34,10 +35,18 @@ function DataState({
     }
     void query.refetch();
   }, [onRetry, query]);
+  const showingAuthError = query.isError && !query.isFetching && classifyQueryError(query.error).category === "auth";
+  const authExpiry = useAuthExpiry(showingAuthError, query.error);
   if (query.isPending && query.fetchStatus === "idle") return /* @__PURE__ */ jsx(Fragment, { children: prerequisite });
   if (query.isPending) return /* @__PURE__ */ jsx(Fragment, { children: skeleton });
   if (query.isError) {
     if (query.isFetching) return /* @__PURE__ */ jsx(Fragment, { children: skeleton });
+    if (authExpiry?.status === "redirecting") {
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        skeleton,
+        /* @__PURE__ */ jsx("span", { role: "status", "aria-live": "polite", className: "sr-only", children: t("query.authExpiry.redirecting") })
+      ] });
+    }
     if (errorRenderer) return /* @__PURE__ */ jsx(Fragment, { children: errorRenderer(query.error, retry) });
     const info = classifyQueryError(query.error);
     const canRetry = (info.category === "transient" || info.category === "unknown") && (info.retryable || showRetry || Boolean(onRetry));

package/dist/components/query/index.d.ts

@@ -1,6 +1,8 @@
 export { DataState } from "./data-state.js";
 export type { DataStateProp, DataStateProps } from "./data-state.js";
 export { AlertMutationFeedback } from "./mutation-feedback.js";
+export { AuthExpiryProvider } from "../feedback/auth-expiry.js";
+export type { AuthExpiryProviderProp, AuthExpiryProviderProps } from "../feedback/auth-expiry.js";
 export type { AlertMutationFeedbackProp, AlertMutationFeedbackProps } from "./mutation-feedback.js";
 export { ButtonRefetch } from "./query-refetch-button.js";
 export type { ButtonRefetchProp, ButtonRefetchProps } from "./query-refetch-button.js";

package/dist/components/query/index.js

@@ -1,10 +1,12 @@
 import { DataState } from "./data-state.js";
 import { AlertMutationFeedback } from "./mutation-feedback.js";
+import { AuthExpiryProvider } from "../feedback/auth-expiry.js";
 import { ButtonRefetch } from "./query-refetch-button.js";
 import { InfiniteQueryState, flattenItemPages } from "./infinite-query-state.js";
 import { classifyQueryError, isRetryableQueryError } from "../../lib/query-error.js";
 export {
   AlertMutationFeedback,
+  AuthExpiryProvider,
   ButtonRefetch,
   DataState,
   InfiniteQueryState,

package/dist/components/query/infinite-query-state.js

@@ -2,6 +2,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { AlertQueryError } from "../feedback/alert.js";
+import { useAuthExpiry } from "../feedback/auth-expiry.js";
 import { Button } from "../general/button.js";
 import { useTranslation } from "../../i18n/use-translation.js";
 import { classifyQueryError } from "../../lib/query-error.js";
@@ -36,9 +37,17 @@ function InfiniteQueryState({
     }
     void query.refetch();
   }, [onRetry, query]);
+  const showingAuthError = query.isError && !(query.isFetching && !query.isFetchingNextPage) && classifyQueryError(query.error).category === "auth";
+  const authExpiry = useAuthExpiry(showingAuthError, query.error);
   if (query.isPending) return /* @__PURE__ */ jsx(Fragment, { children: skeleton });
   if (query.isError) {
     if (query.isFetching && !query.isFetchingNextPage) return /* @__PURE__ */ jsx(Fragment, { children: skeleton });
+    if (authExpiry?.status === "redirecting") {
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        skeleton,
+        /* @__PURE__ */ jsx("span", { role: "status", "aria-live": "polite", className: "sr-only", children: t("query.authExpiry.redirecting") })
+      ] });
+    }
     if (errorRenderer) return /* @__PURE__ */ jsx(Fragment, { children: errorRenderer(query.error, retry) });
     const info = classifyQueryError(query.error);
     const canRetry = (info.category === "transient" || info.category === "unknown") && (info.retryable || showRetry || Boolean(onRetry));

package/dist/contracts/measurement.json

@@ -1,6 +1,6 @@
 {
   "$comment": "AUTO-GENERATED by scripts/gen-measurement-contract.mjs — do not edit. Read this instead of guessing: docs/MEASUREMENT-CONTRACT.md.",
-  "version": "31.1.0",
+  "version": "31.3.0",
   "targetSize": {
     "standard": "WCAG 2.2 SC 2.5.8 Target Size (Minimum), level AA — 24×24 CSS px",
     "min": 24,

package/dist/i18n/messages/en.json

@@ -635,6 +635,9 @@
       "action": {
         "signIn": "Sign in again"
       }
+    },
+    "authExpiry": {
+      "redirecting": "Your session has ended. Redirecting to sign-in…"
     }
   },
   "chart": {

package/dist/i18n/messages/ja.json

@@ -622,6 +622,9 @@
       "action": {
         "signIn": "再度サインイン"
       }
+    },
+    "authExpiry": {
+      "redirecting": "セッションの有効期限が切れました。サインイン画面へ移動しています…"
     }
   },
   "chart": {

package/dist/i18n/messages/vi.json

@@ -623,6 +623,9 @@
       "action": {
         "signIn": "Đăng nhập lại"
       }
+    },
+    "authExpiry": {
+      "redirecting": "Phiên đăng nhập đã hết hạn. Đang chuyển đến trang đăng nhập…"
     }
   },
   "chart": {

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

@@ -71,6 +71,19 @@ export type AlertQueryErrorProp = {
     onAuthAction?: HandlerProp;
     className?: ClassNameProp;
 };
+/** @see AuthExpiryProvider — central, deduplicated handling of an expired session (gh#1022). */
+export type AuthExpiryProviderProp = {
+    /**
+     * Called ONCE when a query/mutation surface under the provider meets an auth-class error (401 /
+     * invalid or expired token); simultaneous 401s share one call, re-armed after every auth-errored
+     * view has gone. Typically redirects to the IdP with the current URL as the return target.
+     * Return a promise for a silent refresh: a rejection brings back the sign-in alert.
+     */
+    onAuthExpired: (context: {
+        error: unknown;
+    }) => void | Promise<void>;
+    children?: ChildrenProp;
+};
 /** @see Alert */
 export type AlertProp = React.HTMLAttributes<HTMLDivElement> & {
     variant?: AlertVariantProp;

package/dist/props/components/index.d.ts

@@ -3,7 +3,7 @@ export type { ButtonProp } from "./general.prop.js";
 export type { CommandProp, InputProp, TextareaProp, FormFieldProp, SearchInputProp, CheckboxProp, CheckboxGroupProp, ChoiceOptionProp, RadioProp, RadioGroupProp, SwitchProp, SliderProp, CalendarProp, DatePickerProp, TimePickerProp, ColorPickerProp, UploadProp, UploadFileItemProp, UploadVariantProp, TreeOptionProp, TreeFieldNamesProp, CascaderProp, TreeSelectProp, ShowCheckedStrategyProp, TransferProp, TransferItemProp, } from "./data-entry.prop.js";
 export type { AvatarProp, EmptyStateProp, DescriptionsProp, DescriptionsItemProp, BadgeProp, DataTableProp, QrCodeProp, } from "./data-display.prop.js";
 export type { ChartDatum, ChartSeriesProp, LineChartProp, BarChartProp, AreaChartProp, PieChartProp, } from "./charts.prop.js";
-export type { AlertQueryErrorProp, AlertProp, DialogProp, DialogContentProp, AlertTitleProp, AlertContentProp, AlertDescriptionProp, AlertActionsProp, SheetResponsiveProp, SkeletonRowsProp, } from "./feedback.prop.js";
+export type { AlertQueryErrorProp, AuthExpiryProviderProp, AlertProp, DialogProp, DialogContentProp, AlertTitleProp, AlertContentProp, AlertDescriptionProp, AlertActionsProp, SheetResponsiveProp, SkeletonRowsProp, } from "./feedback.prop.js";
 export type { DataStateProp, InfiniteQueryStateProp, InfiniteQueryHelpers, PrefetchLinkProp, } from "./query.prop.js";
 export type { DropdownMenuPlacementProp, DropdownMenuTriggerActionProp, PaginationProp, PaginationSizeProp, PaginationAlignProp, StepsProp, StepItemProp, StepStatusProp, StepsTypeProp, TabsProp, TabItemProp, TabsVariantProp, TabsPlacementProp, TabsExtraProp, TabsOnEditProp, } from "./navigation.prop.js";
 export type { AppProviderProp, AppContextValue, AppSettingKind, AppSettingPickerProp, AppSettingToggleKind, AppSettingToggleProp, ThemeScopeProp, } from "./app.prop.js";

package/dist/props/registry.d.ts

@@ -848,7 +848,7 @@ export declare const COMPONENT_PROP_REGISTRY: {
         readonly vocabulary: readonly ["OrientationProp", {
             readonly field: "vertical";
             readonly local: true;
-            readonly reason: "antd's boolean spelling of orientation=\"vertical\"; orientation wins over it.";
+            readonly reason: 'antd\'s boolean spelling of orientation="vertical"; orientation wins over it.';
         }, {
             readonly field: "fullWidth";
             readonly local: true;
@@ -2415,6 +2415,15 @@ export declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/query.prop.ts";
         readonly vocabulary: readonly [];
     };
+    readonly AuthExpiryProviderProp: {
+        readonly group: "feedback";
+        readonly file: "components/feedback.prop.ts";
+        readonly vocabulary: readonly [{
+            readonly field: "onAuthExpired";
+            readonly local: true;
+            readonly reason: "App-wide session-expiry callback receiving the triggering error; fired once per expiry (gh#1022).";
+        }, "ChildrenProp"];
+    };
     readonly AlertQueryErrorProp: {
         readonly group: "feedback";
         readonly file: "components/feedback.prop.ts";

package/dist/props/registry.js

@@ -2833,6 +2833,18 @@ const COMPONENT_PROP_REGISTRY = {
     vocabulary: ["HandlerProp"]
   },
   PrefetchLinkProp: { group: "query", file: "components/query.prop.ts", vocabulary: [] },
+  AuthExpiryProviderProp: {
+    group: "feedback",
+    file: "components/feedback.prop.ts",
+    vocabulary: [
+      {
+        field: "onAuthExpired",
+        local: true,
+        reason: "App-wide session-expiry callback receiving the triggering error; fired once per expiry (gh#1022)."
+      },
+      "ChildrenProp"
+    ]
+  },
   AlertQueryErrorProp: {
     group: "feedback",
     file: "components/feedback.prop.ts",

package/dist/props/vocabulary/data.prop.d.ts

@@ -5,6 +5,7 @@
 import type * as React from "react";
 import type { BreakpointProp, ColumnAlignProp, SortDirectionProp } from "./interaction.prop.js";
 import type { TableDensityProp } from "./layout.prop.js";
+import type { FlushProp } from "./shared.prop.js";
 /** Generic row identifier extractor for tables with selection. */
 export type GetRowIdProp<T> = (row: T) => string;
 /**
@@ -82,6 +83,13 @@ export type ColumnDefProp<T> = {
      * is kept reachable as the cell's `title`, so nothing is silently lost.
      */
     ellipsis?: boolean;
+    /**
+     * The cell's CONTENT owns its inset (the same contract as `TableCell flush`): the column's body
+     * cells drop their padding so a self-padded row primitive — a `ListRow` in a selectable list —
+     * sits on the column's text axis instead of stacking a second inset on the cell's (gh#1016).
+     * The header cell keeps its padding, which lines the header label up with the row's own inset.
+     */
+    flush?: FlushProp;
     /**
      * Sort declaration (antd `ColumnType.sorter`). `sorter: true` is the same opt-in as `sortable`;
      * a comparator sorts by it; `{ compare, multiple }` joins the MULTI-column sort, highest

package/dist/styles/alert-layout.css

@@ -50,6 +50,10 @@
     color: hsl(var(--foreground));
   }
 
+  [data-slot="alert"][data-query-category="auth"] {
+    max-inline-size: var(--query-auth-alert-max-inline-size);
+  }
+
   [data-slot="alert"][data-variant="banner"] {
     border-radius: var(--banner-radius);
     border-block-start-width: 0;

package/dist/styles/layers.json

@@ -1,5 +1,5 @@
 {
-  "version": "31.1.0",
+  "version": "31.3.0",
   "generatedBy": "scripts/gen-style-layers.mjs — do not edit by hand; run `pnpm gen:style-layers`",
   "base": "base.css",
   "fonts": "fonts.css",
@@ -67,6 +67,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css"
       ]
     },
@@ -74,6 +76,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
@@ -83,6 +86,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
@@ -99,6 +103,7 @@
         "shell-layout.css",
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
@@ -157,6 +162,9 @@
         "layout.css"
       ]
     },
+    "AuthExpiryProvider": {
+      "layers": []
+    },
     "AuthFooter": {
       "layers": [
         "shell-layout.css"
@@ -195,6 +203,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css"
       ]
     },
@@ -241,6 +251,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css"
       ]
     },
@@ -357,6 +369,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
@@ -390,6 +403,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css"
       ]
     },
@@ -397,6 +412,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "table-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
@@ -423,6 +439,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
@@ -490,6 +507,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
       ]
@@ -498,6 +517,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css"
       ]
     },
@@ -505,6 +526,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
       ]
@@ -516,6 +539,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
       ]
@@ -524,6 +549,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
       ]
@@ -549,6 +576,8 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
+        "dialog-layout.css",
         "alert-layout.css"
       ]
     },
@@ -649,6 +678,7 @@
         "shell-layout.css",
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"
@@ -666,6 +696,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css",
@@ -1103,6 +1134,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "data-display-layout.css",
@@ -1150,6 +1182,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "data-display-layout.css",
@@ -1162,6 +1195,7 @@
       "layers": [
         "layout.css",
         "control.css",
+        "text-layout.css",
         "dialog-layout.css",
         "alert-layout.css",
         "form-layout.css"

package/dist/styles/table-layout.css

@@ -136,7 +136,7 @@
     white-space: nowrap;
   }
 
-  [data-slot="table-head"]:has([role="checkbox"]) {
+  [data-slot="table-head"]:has([data-slot="checkbox"], [role="checkbox"]) {
     padding-inline-end: 0;
   }
 
@@ -151,7 +151,7 @@
     white-space: nowrap;
   }
 
-  [data-slot="table-cell"]:has([role="checkbox"]) {
+  [data-slot="table-cell"]:has([data-slot="checkbox"], [role="checkbox"]) {
     padding-inline-end: 0;
   }
 
@@ -187,6 +187,10 @@
     padding: 0;
   }
 
+  .ui-table-row:has(> [data-slot="table-cell"][data-flush] > [data-slot="list-row"][data-unread]) {
+    background-color: var(--list-row-unread-background, hsl(var(--muted)));
+  }
+
   .ui-data-table-toolbar {
     display: flex;
     flex-wrap: wrap;

package/dist/tokens/components/feedback.css

@@ -133,6 +133,8 @@
   --query-load-more-space-block-start: var(--space-stack-md);
   --query-loading-more-space-block-start: var(--space-stack-sm);
 
+  --query-auth-alert-max-inline-size: 36rem;
+
   --tooltip-max-width: 20rem;
   --tooltip-space-inline: var(--space-2);
   --tooltip-space-block: var(--space-1);

package/docs/FRAME-COVERAGE-REPORT.md

@@ -3,8 +3,8 @@
 > Generated by `scripts/frame-coverage.mjs` (issue #163). Do not edit by hand — run `pnpm check:frame-coverage`.
 > Standard: [FRAME-COVERAGE-STANDARD.md](./FRAME-COVERAGE-STANDARD.md). A missing dimension is **UNTESTED**, never a pass.
 
-- Public components: **175**
-- With ≥1 frame: **152** · zero-frame: **23**
+- Public components: **176**
+- With ≥1 frame: **152** · zero-frame: **24**
 - Fully covered (every contract axis declared): **0**
 
 ## UNTESTED — no `/frame/**` route
@@ -20,6 +20,7 @@
 - [ ] `Paragraph`
 - [ ] `Link`
 - [ ] `ServiceCatalogCta`
+- [ ] `AuthExpiryProvider`
 - [ ] `SkeletonRows`
 - [ ] `OverlayPortalProvider`
 - [ ] `SkeletonDetail`
@@ -101,6 +102,7 @@ Legend: ✓ covered · N/A reasoned skip · · UNTESTED (blank cell = UNTESTED).
 | TimelineGrid | ✓ | N/A | N/A | N/A | · | · | · | · | · | · |
 | Table | ✓ | N/A | N/A | N/A | · | · | · | · | · | · |
 | DataState | ✓ | N/A | · | N/A | · | · | · | · | · | · |
+| AuthExpiryProvider | **✗** | N/A | N/A | N/A | · | · | · | · | · | · |
 | InfiniteQueryState | ✓ | N/A | · | N/A | · | · | · | · | · | · |
 | Form | ✓ | ✓ | · | N/A | · | · | · | · | · | · |
 | FormField | ✓ | N/A | · | N/A | · | · | · | · | · | · |