@wildo-ai/saas-frontend-lib 1.0.1 → 1.1.0

package/dist/esm/components/resources/skeleton/SectionPresentationContext.js

@@ -9,4 +9,4 @@ export function SectionPresentationProvider({ value, children, }) {
 export function useOptionalSectionPresentationContext() {
     return useContext(SectionPresentationContext);
 }
-//# sourceMappingURL=SectionPresentationContext.js.map
+//# sourceMappingURL=SectionPresentationContext.js.map

package/dist/esm/components/resources/skeleton/SectionPresentationContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionPresentationContext.js","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/SectionPresentationContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAkB,MAAM,OAAO,CAAC;AAYlF,MAAM,0BAA0B,GAAG,aAAa,CAAyC,IAAI,CAAC,CAAC;AAE/F,MAAM,UAAU,2BAA2B,CAAC,EAC1C,KAAK,EACL,QAAQ,GAIT;IACC,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEnD,OAAO,CACL,KAAC,0BAA0B,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,YACrD,QAAQ,GAC2B,CACvC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,qCAAqC;IACnD,OAAO,UAAU,CAAC,0BAA0B,CAAC,CAAC;AAChD,CAAC"}
+{"version":3,"file":"SectionPresentationContext.js","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SectionPresentationContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAkB,MAAM,OAAO,CAAC;AAYlF,MAAM,0BAA0B,GAAG,aAAa,CAAyC,IAAI,CAAC,CAAC;AAE/F,MAAM,UAAU,2BAA2B,CAAC,EAC1C,KAAK,EACL,QAAQ,GAIT;IACC,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEnD,OAAO,CACL,KAAC,0BAA0B,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,YACrD,QAAQ,GAC2B,CACvC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,qCAAqC;IACnD,OAAO,UAAU,CAAC,0BAA0B,CAAC,CAAC;AAChD,CAAC","sourcesContent":["'use client';\n\nimport React, { createContext, useContext, useMemo, type ReactNode } from 'react';\n\nexport interface SectionPresentationEntry {\n  title?: ReactNode;\n  description?: ReactNode;\n  icon?: ReactNode;\n}\n\nexport interface SectionPresentationContextValue {\n  sectionEntries?: Record<string, SectionPresentationEntry>;\n}\n\nconst SectionPresentationContext = createContext<SectionPresentationContextValue | null>(null);\n\nexport function SectionPresentationProvider({\n  value,\n  children,\n}: {\n  value: SectionPresentationContextValue;\n  children: ReactNode;\n}): React.JSX.Element {\n  const contextValue = useMemo(() => value, [value]);\n\n  return (\n    <SectionPresentationContext.Provider value={contextValue}>\n      {children}\n    </SectionPresentationContext.Provider>\n  );\n}\n\nexport function useOptionalSectionPresentationContext(): SectionPresentationContextValue | null {\n  return useContext(SectionPresentationContext);\n}\n"]}

package/dist/esm/components/resources/skeleton/SubmitButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SubmitButton.d.ts","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/SubmitButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,MAAM,WAAW,iBAAiB;IAChC,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0FAA0F;IAC1F,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,EAAE,iBAAiB,GAAG,SAAS,CAyB3G;yBAzBe,YAAY"}
+{"version":3,"file":"SubmitButton.d.ts","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SubmitButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASvC,MAAM,WAAW,iBAAiB;IAChC,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0FAA0F;IAC1F,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,EAAE,iBAAiB,GAAG,SAAS,CAmC3G;yBAnCe,YAAY"}

package/dist/esm/components/resources/skeleton/SubmitButton.js

@@ -3,6 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useFormContext } from 'react-hook-form';
 import { FrontendComponentType } from '@wildo-ai/presets-components-models';
 import { Button } from '../../../components/actions/button.js';
+import { SkeletonText } from '../../../components/feedback/skeleton-text.js';
 import { useI18n } from '../../../core/i18n/useI18n.js';
 import { useOptionalFormTemplateContext } from '../../../components/form/automated/FormTemplateContext.js';
 import { useSlotRegistration } from './FormLayoutSlotContext.js';
@@ -32,16 +33,25 @@ export function SubmitButton({ className, label, submittingLabel, fullWidth }) {
     useSlotRegistration('submitButton');
     const { formState } = useFormContext();
     const templateCtx = useOptionalFormTemplateContext();
-    const { tComponent } = useI18n({
+    const { tComponent, isReady } = useI18n({
         component: FrontendComponentType.LOW_LEVEL_FORM_MESSAGE,
     });
+    // An explicit `label` needs no i18n; only the default ("Save") fallback waits
+    // on the form-message bundle. Render the button structure immediately either
+    // way (no `return null`, which would unmount the slot and stall the form's
+    // single-wave reveal) and skeleton ONLY the label text while a needed fallback
+    // is still loading.
+    const usesI18nFallback = label === undefined;
+    const labelLoading = usesI18nFallback && !isReady;
     const resolvedLabel = label
-        ?? tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'submitSave');
-    const isDisabled = formState.isSubmitting || !!templateCtx?.disabled;
+        ?? (isReady ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'submitSave') : undefined);
+    // Disabled while the label is still resolving — can't submit a button whose
+    // action label isn't known yet.
+    const isDisabled = formState.isSubmitting || !!templateCtx?.disabled || labelLoading;
     const displayLabel = formState.isSubmitting && submittingLabel
         ? submittingLabel
         : resolvedLabel;
-    return (_jsx("div", { className: className, children: _jsx(Button, { type: "submit", disabled: isDisabled, className: fullWidth ? 'w-full' : undefined, children: displayLabel }) }));
+    return (_jsx("div", { className: className, children: _jsx(Button, { type: "submit", disabled: isDisabled, className: fullWidth ? 'w-full' : undefined, children: _jsx(SkeletonText, { loading: labelLoading, width: "5em", children: displayLabel }) }) }));
 }
 SubmitButton.displayName = 'SubmitButton';
-//# sourceMappingURL=SubmitButton.js.map
+//# sourceMappingURL=SubmitButton.js.map

package/dist/esm/components/resources/skeleton/SubmitButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubmitButton.js","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/SubmitButton.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,+CAA+C,CAAC;AACvE,OAAO,EAAE,OAAO,EAAE,MAAM,uCAAuC,CAAC;AAChE,OAAO,EAAE,8BAA8B,EAAE,MAAM,mEAAmE,CAAC;AACnH,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAa9D;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,eAAe,EAAE,SAAS,EAAqB;IAC9F,mBAAmB,CAAC,cAAc,CAAC,CAAC;IAEpC,MAAM,EAAE,SAAS,EAAE,GAAG,cAAc,EAAE,CAAC;IACvC,MAAM,WAAW,GAAG,8BAA8B,EAAE,CAAC;IACrD,MAAM,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC;QAC7B,SAAS,EAAE,qBAAqB,CAAC,sBAAsB;KACxD,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,KAAK;WACtB,UAAU,CAAC,qBAAqB,CAAC,sBAAsB,EAAE,YAAY,CAAC,CAAC;IAE5E,MAAM,UAAU,GAAG,SAAS,CAAC,YAAY,IAAI,CAAC,CAAC,WAAW,EAAE,QAAQ,CAAC;IAErE,MAAM,YAAY,GAAG,SAAS,CAAC,YAAY,IAAI,eAAe;QAC5D,CAAC,CAAC,eAAe;QACjB,CAAC,CAAC,aAAa,CAAC;IAElB,OAAO,CACL,cAAK,SAAS,EAAE,SAAS,YACvB,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,YACpF,YAAY,GACN,GACL,CACP,CAAC;AACJ,CAAC;AAED,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC"}
+{"version":3,"file":"SubmitButton.js","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SubmitButton.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,+CAA+C,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,uDAAuD,CAAC;AACrF,OAAO,EAAE,OAAO,EAAE,MAAM,uCAAuC,CAAC;AAChE,OAAO,EAAE,8BAA8B,EAAE,MAAM,mEAAmE,CAAC;AACnH,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAa9D;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,eAAe,EAAE,SAAS,EAAqB;IAC9F,mBAAmB,CAAC,cAAc,CAAC,CAAC;IAEpC,MAAM,EAAE,SAAS,EAAE,GAAG,cAAc,EAAE,CAAC;IACvC,MAAM,WAAW,GAAG,8BAA8B,EAAE,CAAC;IACrD,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC;QACtC,SAAS,EAAE,qBAAqB,CAAC,sBAAsB;KACxD,CAAC,CAAC;IAEH,8EAA8E;IAC9E,6EAA6E;IAC7E,2EAA2E;IAC3E,+EAA+E;IAC/E,oBAAoB;IACpB,MAAM,gBAAgB,GAAG,KAAK,KAAK,SAAS,CAAC;IAC7C,MAAM,YAAY,GAAG,gBAAgB,IAAI,CAAC,OAAO,CAAC;IAElD,MAAM,aAAa,GAAG,KAAK;WACtB,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,qBAAqB,CAAC,sBAAsB,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAEpG,4EAA4E;IAC5E,gCAAgC;IAChC,MAAM,UAAU,GAAG,SAAS,CAAC,YAAY,IAAI,CAAC,CAAC,WAAW,EAAE,QAAQ,IAAI,YAAY,CAAC;IAErF,MAAM,YAAY,GAAG,SAAS,CAAC,YAAY,IAAI,eAAe;QAC5D,CAAC,CAAC,eAAe;QACjB,CAAC,CAAC,aAAa,CAAC;IAElB,OAAO,CACL,cAAK,SAAS,EAAE,SAAS,YACvB,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,YACrF,KAAC,YAAY,IAAC,OAAO,EAAE,YAAY,EAAE,KAAK,EAAC,KAAK,YAAE,YAAY,GAAgB,GACvE,GACL,CACP,CAAC;AACJ,CAAC;AAED,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { FrontendComponentType } from '@wildo-ai/presets-components-models';\nimport { Button } from '~wildo-frontend-lib/components/actions/button';\nimport { SkeletonText } from '~wildo-frontend-lib/components/feedback/skeleton-text';\nimport { useI18n } from '~wildo-frontend-lib/core/i18n/useI18n';\nimport { useOptionalFormTemplateContext } from '~wildo-frontend-lib/components/form/automated/FormTemplateContext';\nimport { useSlotRegistration } from './FormLayoutSlotContext';\n\nexport interface SubmitButtonProps {\n  /** Label for the submit button. Falls back to i18n default (\"Save\"). */\n  label?: string;\n  /** Label shown while the form is submitting. Falls back to `label` (no visual change). */\n  submittingLabel?: string;\n  /** Additional CSS classes for the button container. */\n  className?: string;\n  /** When true, the button stretches to full container width. */\n  fullWidth?: boolean;\n}\n\n/**\n * Form submit action slot — placed by the template author where desired.\n *\n * Labels are resolved from explicit props, falling back to i18n (\"Save\").\n * Templates pass labels directly — no context dependency for label text.\n *\n * Disabled when `formState.isSubmitting` or `FormTemplateContext.disabled` is true.\n * (FormTemplateContext is used only for the disabled flag — a skeleton-layer concern.)\n *\n * In wizard mode, the wizard layout manages its own submit/next buttons,\n * so this component is only used in non-wizard templates.\n *\n * @example\n * ```tsx\n * <FormLayout>\n *   <Section name=\"general\">\n *     <FormField name=\"title\" />\n *   </Section>\n *   <SubmitButton label=\"Create\" submittingLabel=\"Creating...\" fullWidth />\n * </FormLayout>\n * ```\n */\nexport function SubmitButton({ className, label, submittingLabel, fullWidth }: SubmitButtonProps): ReactNode {\n  useSlotRegistration('submitButton');\n\n  const { formState } = useFormContext();\n  const templateCtx = useOptionalFormTemplateContext();\n  const { tComponent, isReady } = useI18n({\n    component: FrontendComponentType.LOW_LEVEL_FORM_MESSAGE,\n  });\n\n  // An explicit `label` needs no i18n; only the default (\"Save\") fallback waits\n  // on the form-message bundle. Render the button structure immediately either\n  // way (no `return null`, which would unmount the slot and stall the form's\n  // single-wave reveal) and skeleton ONLY the label text while a needed fallback\n  // is still loading.\n  const usesI18nFallback = label === undefined;\n  const labelLoading = usesI18nFallback && !isReady;\n\n  const resolvedLabel = label\n    ?? (isReady ? tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'submitSave') : undefined);\n\n  // Disabled while the label is still resolving — can't submit a button whose\n  // action label isn't known yet.\n  const isDisabled = formState.isSubmitting || !!templateCtx?.disabled || labelLoading;\n\n  const displayLabel = formState.isSubmitting && submittingLabel\n    ? submittingLabel\n    : resolvedLabel;\n\n  return (\n    <div className={className}>\n      <Button type=\"submit\" disabled={isDisabled} className={fullWidth ? 'w-full' : undefined}>\n        <SkeletonText loading={labelLoading} width=\"5em\">{displayLabel}</SkeletonText>\n      </Button>\n    </div>\n  );\n}\n\nSubmitButton.displayName = 'SubmitButton';\n"]}

package/dist/esm/components/resources/skeleton/SummaryHeader.d.ts

@@ -0,0 +1,34 @@
+/**
+ * SummaryHeader — a single-line header row for summary templates: the primary
+ * title plus one or more inline accessories (a status badge, a marker) on the
+ * same line.
+ *
+ * Replaces the old `layout.summaryTitleAccessory` bolt-on. Where authors used to
+ * declare a SECOND template just to place a badge beside the host-owned title,
+ * they now compose it directly in the template flow:
+ *
+ * ```tsx
+ * <SummaryLayout titlePlacement={SummaryTitlePlacement.TEMPLATE_OWNED}>
+ *   <SummaryHeader>
+ *     <SummaryTitle />
+ *     <DisplayField name="status" hideLabel />
+ *   </SummaryHeader>
+ *   <DisplayField name="createdAt" />
+ * </SummaryLayout>
+ * ```
+ *
+ * The title (first child, typically `<SummaryTitle />`) truncates and shrinks;
+ * trailing accessories keep their intrinsic size (`shrink-0`). This is the same
+ * geometry the list-card host used to hand-roll for the accessory slot, now owned
+ * once here so every summary surface (list card AND FK popover) renders it
+ * identically.
+ */
+import type { ReactNode } from 'react';
+export interface SummaryHeaderProps {
+    /** Extra classes merged over the default flex-row layout. */
+    className?: string;
+    /** Title element (usually `<SummaryTitle />`) followed by inline accessories. */
+    children?: ReactNode;
+}
+export declare function SummaryHeader({ className, children }: SummaryHeaderProps): ReactNode;
+//# sourceMappingURL=SummaryHeader.d.ts.map

package/dist/esm/components/resources/skeleton/SummaryHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryHeader.d.ts","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SummaryHeader.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,WAAW,kBAAkB;IACjC,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iFAAiF;IACjF,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB,GAAG,SAAS,CAoBpF"}

package/dist/esm/components/resources/skeleton/SummaryHeader.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../../../core/ui/cn.js';
+export function SummaryHeader({ className, children }) {
+    return (
+    // The title (`<SummaryTitle />`) grows + truncates via `flex-1 min-w-0` on the
+    // title element ITSELF (not a `:first-child` selector here — that would hand
+    // the grow to a trailing accessory when the title renders null). Accessories
+    // keep intrinsic size: `shrink-0` stops them shrinking, and `w-auto` NEUTRALISES
+    // the `w-full` field-chrome root a `<DisplayField>` accessory renders with —
+    // without it, a `w-full` badge claims the whole row and squashes the title to
+    // zero width (title text present but invisible). Higher specificity than the
+    // field's own `.w-full`, so it wins.
+    _jsx("div", { className: cn('flex min-w-0 items-center gap-element-sm', '[&>*:not(:first-child)]:shrink-0 [&>*:not(:first-child)]:w-auto', className), children: children }));
+}
+//# sourceMappingURL=SummaryHeader.js.map

package/dist/esm/components/resources/skeleton/SummaryHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryHeader.js","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SummaryHeader.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AA6Bb,OAAO,EAAE,EAAE,EAAE,MAAM,gCAAgC,CAAC;AASpD,MAAM,UAAU,aAAa,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAsB;IACvE,OAAO;IACL,+EAA+E;IAC/E,6EAA6E;IAC7E,6EAA6E;IAC7E,iFAAiF;IACjF,6EAA6E;IAC7E,8EAA8E;IAC9E,6EAA6E;IAC7E,qCAAqC;IACrC,cACE,SAAS,EAAE,EAAE,CACX,0CAA0C,EAC1C,iEAAiE,EACjE,SAAS,CACV,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC","sourcesContent":["'use client';\n\n/**\n * SummaryHeader — a single-line header row for summary templates: the primary\n * title plus one or more inline accessories (a status badge, a marker) on the\n * same line.\n *\n * Replaces the old `layout.summaryTitleAccessory` bolt-on. Where authors used to\n * declare a SECOND template just to place a badge beside the host-owned title,\n * they now compose it directly in the template flow:\n *\n * ```tsx\n * <SummaryLayout titlePlacement={SummaryTitlePlacement.TEMPLATE_OWNED}>\n *   <SummaryHeader>\n *     <SummaryTitle />\n *     <DisplayField name=\"status\" hideLabel />\n *   </SummaryHeader>\n *   <DisplayField name=\"createdAt\" />\n * </SummaryLayout>\n * ```\n *\n * The title (first child, typically `<SummaryTitle />`) truncates and shrinks;\n * trailing accessories keep their intrinsic size (`shrink-0`). This is the same\n * geometry the list-card host used to hand-roll for the accessory slot, now owned\n * once here so every summary surface (list card AND FK popover) renders it\n * identically.\n */\n\nimport type { ReactNode } from 'react';\nimport { cn } from '~wildo-frontend-lib/core/ui/cn';\n\nexport interface SummaryHeaderProps {\n  /** Extra classes merged over the default flex-row layout. */\n  className?: string;\n  /** Title element (usually `<SummaryTitle />`) followed by inline accessories. */\n  children?: ReactNode;\n}\n\nexport function SummaryHeader({ className, children }: SummaryHeaderProps): ReactNode {\n  return (\n    // The title (`<SummaryTitle />`) grows + truncates via `flex-1 min-w-0` on the\n    // title element ITSELF (not a `:first-child` selector here — that would hand\n    // the grow to a trailing accessory when the title renders null). Accessories\n    // keep intrinsic size: `shrink-0` stops them shrinking, and `w-auto` NEUTRALISES\n    // the `w-full` field-chrome root a `<DisplayField>` accessory renders with —\n    // without it, a `w-full` badge claims the whole row and squashes the title to\n    // zero width (title text present but invisible). Higher specificity than the\n    // field's own `.w-full`, so it wins.\n    <div\n      className={cn(\n        'flex min-w-0 items-center gap-element-sm',\n        '[&>*:not(:first-child)]:shrink-0 [&>*:not(:first-child)]:w-auto',\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/esm/components/resources/skeleton/SummaryLayout.d.ts

@@ -1,24 +1,67 @@
 import type { ReactNode } from 'react';
+/**
+ * Where the primary title (`<SummaryTitle />`) is placed within a summary
+ * template. The placement decision lives HERE, in the template markup that
+ * governs it — not in a parallel `layout.*` config field.
+ */
+export declare enum SummaryTitlePlacement {
+    /**
+     * Framework places the title automatically at the top of the template, above
+     * the authored children. The zero-boilerplate, title-above-body default —
+     * matches the classic list/card summary look.
+     */
+    AUTO = "auto",
+    /**
+     * The author owns title placement: `SummaryLayout` renders only its children,
+     * and the author drops `<SummaryTitle />` wherever it belongs (e.g. inside a
+     * `<SummaryHeader>` beside a status badge). Required whenever the title must
+     * share a line with other content.
+     */
+    TEMPLATE_OWNED = "template-owned"
+}
 export interface SummaryLayoutProps {
     /** Additional CSS classes for the root container. */
     className?: string;
+    /**
+     * Title placement. Defaults to {@link SummaryTitlePlacement.AUTO} (title
+     * rendered at the top). Switch to `TEMPLATE_OWNED` to place `<SummaryTitle />`
+     * yourself within the flow.
+     */
+    titlePlacement?: SummaryTitlePlacement;
     children?: ReactNode;
 }
 /**
  * Root wrapper for summary layout templates (cards, list items, FK references).
  *
- * Typically renders a compact single-line or small card layout.
+ * Owns TITLE PLACEMENT for the template: under `AUTO` (default) it renders
+ * `<SummaryTitle />` at the top, then the children body — so an author who just
+ * wants "title above a couple of fields" writes nothing about the title. Under
+ * `TEMPLATE_OWNED` it renders only the children, and the author composes
+ * `<SummaryTitle />` into the flow (see {@link SummaryHeader}).
+ *
+ * The title resolves its text from `SummaryContext` (provided by
+ * `ResourceSummaryDisplayer`); on body-only surfaces with no title (inline
+ * FK-field references) `<SummaryTitle />` renders nothing, so `AUTO` shows no
+ * empty title slot.
+ *
  * Provides a root `FieldScopeContext` with empty prefix.
  *
  * @example
  * ```tsx
+ * // AUTO — title rendered above the body automatically:
  * <SummaryLayout>
- *   <div className="flex items-center gap-2">
- *     <DisplayField name="title" />
- *     <DisplayField name="status" />
- *   </div>
+ *   <DisplayField name="createdAt" />
+ * </SummaryLayout>
+ *
+ * // TEMPLATE_OWNED — badge on the same line as the title:
+ * <SummaryLayout titlePlacement={SummaryTitlePlacement.TEMPLATE_OWNED}>
+ *   <SummaryHeader>
+ *     <SummaryTitle />
+ *     <DisplayField name="status" hideLabel />
+ *   </SummaryHeader>
+ *   <DisplayField name="createdAt" />
  * </SummaryLayout>
  * ```
  */
-export declare function SummaryLayout({ className, children }: SummaryLayoutProps): ReactNode;
+export declare function SummaryLayout({ className, titlePlacement, children, }: SummaryLayoutProps): ReactNode;
 //# sourceMappingURL=SummaryLayout.d.ts.map

package/dist/esm/components/resources/skeleton/SummaryLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SummaryLayout.d.ts","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/SummaryLayout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,WAAW,kBAAkB;IACjC,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB,GAAG,SAAS,CAMpF"}
+{"version":3,"file":"SummaryLayout.d.ts","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SummaryLayout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC;;;;GAIG;AACH,oBAAY,qBAAqB;IAC/B;;;;OAIG;IACH,IAAI,SAAS;IACb;;;;;OAKG;IACH,cAAc,mBAAmB;CAClC;AAED,MAAM,WAAW,kBAAkB;IACjC,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,qBAAqB,CAAC;IACvC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,cAA2C,EAC3C,QAAQ,GACT,EAAE,kBAAkB,GAAG,SAAS,CAShC"}

package/dist/esm/components/resources/skeleton/SummaryLayout.js

@@ -1,23 +1,62 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { FieldScopeProvider } from './FieldScopeContext.js';
+import { SummaryTitle } from './SummaryTitle.js';
+/**
+ * Where the primary title (`<SummaryTitle />`) is placed within a summary
+ * template. The placement decision lives HERE, in the template markup that
+ * governs it — not in a parallel `layout.*` config field.
+ */
+export var SummaryTitlePlacement;
+(function (SummaryTitlePlacement) {
+    /**
+     * Framework places the title automatically at the top of the template, above
+     * the authored children. The zero-boilerplate, title-above-body default —
+     * matches the classic list/card summary look.
+     */
+    SummaryTitlePlacement["AUTO"] = "auto";
+    /**
+     * The author owns title placement: `SummaryLayout` renders only its children,
+     * and the author drops `<SummaryTitle />` wherever it belongs (e.g. inside a
+     * `<SummaryHeader>` beside a status badge). Required whenever the title must
+     * share a line with other content.
+     */
+    SummaryTitlePlacement["TEMPLATE_OWNED"] = "template-owned";
+})(SummaryTitlePlacement || (SummaryTitlePlacement = {}));
 /**
  * Root wrapper for summary layout templates (cards, list items, FK references).
  *
- * Typically renders a compact single-line or small card layout.
+ * Owns TITLE PLACEMENT for the template: under `AUTO` (default) it renders
+ * `<SummaryTitle />` at the top, then the children body — so an author who just
+ * wants "title above a couple of fields" writes nothing about the title. Under
+ * `TEMPLATE_OWNED` it renders only the children, and the author composes
+ * `<SummaryTitle />` into the flow (see {@link SummaryHeader}).
+ *
+ * The title resolves its text from `SummaryContext` (provided by
+ * `ResourceSummaryDisplayer`); on body-only surfaces with no title (inline
+ * FK-field references) `<SummaryTitle />` renders nothing, so `AUTO` shows no
+ * empty title slot.
+ *
  * Provides a root `FieldScopeContext` with empty prefix.
  *
  * @example
  * ```tsx
+ * // AUTO — title rendered above the body automatically:
  * <SummaryLayout>
- *   <div className="flex items-center gap-2">
- *     <DisplayField name="title" />
- *     <DisplayField name="status" />
- *   </div>
+ *   <DisplayField name="createdAt" />
+ * </SummaryLayout>
+ *
+ * // TEMPLATE_OWNED — badge on the same line as the title:
+ * <SummaryLayout titlePlacement={SummaryTitlePlacement.TEMPLATE_OWNED}>
+ *   <SummaryHeader>
+ *     <SummaryTitle />
+ *     <DisplayField name="status" hideLabel />
+ *   </SummaryHeader>
+ *   <DisplayField name="createdAt" />
  * </SummaryLayout>
  * ```
  */
-export function SummaryLayout({ className, children }) {
-    return (_jsx(FieldScopeProvider, { pathPrefix: "", children: _jsx("div", { className: className, children: children }) }));
+export function SummaryLayout({ className, titlePlacement = SummaryTitlePlacement.AUTO, children, }) {
+    return (_jsx(FieldScopeProvider, { pathPrefix: "", children: _jsxs("div", { className: className, children: [titlePlacement === SummaryTitlePlacement.AUTO && _jsx(SummaryTitle, {}), children] }) }));
 }
-//# sourceMappingURL=SummaryLayout.js.map
+//# sourceMappingURL=SummaryLayout.js.map

package/dist/esm/components/resources/skeleton/SummaryLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"SummaryLayout.js","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/SummaryLayout.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAQzD;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,aAAa,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAsB;IACvE,OAAO,CACL,KAAC,kBAAkB,IAAC,UAAU,EAAC,EAAE,YAC/B,cAAK,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAO,GACxB,CACtB,CAAC;AACJ,CAAC"}
+{"version":3,"file":"SummaryLayout.js","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SummaryLayout.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C;;;;GAIG;AACH,MAAM,CAAN,IAAY,qBAcX;AAdD,WAAY,qBAAqB;IAC/B;;;;OAIG;IACH,sCAAa,CAAA;IACb;;;;;OAKG;IACH,0DAAiC,CAAA;AACnC,CAAC,EAdW,qBAAqB,KAArB,qBAAqB,QAchC;AAcD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,SAAS,EACT,cAAc,GAAG,qBAAqB,CAAC,IAAI,EAC3C,QAAQ,GACW;IACnB,OAAO,CACL,KAAC,kBAAkB,IAAC,UAAU,EAAC,EAAE,YAC/B,eAAK,SAAS,EAAE,SAAS,aACtB,cAAc,KAAK,qBAAqB,CAAC,IAAI,IAAI,KAAC,YAAY,KAAG,EACjE,QAAQ,IACL,GACa,CACtB,CAAC;AACJ,CAAC","sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport { FieldScopeProvider } from './FieldScopeContext';\nimport { SummaryTitle } from './SummaryTitle';\n\n/**\n * Where the primary title (`<SummaryTitle />`) is placed within a summary\n * template. The placement decision lives HERE, in the template markup that\n * governs it — not in a parallel `layout.*` config field.\n */\nexport enum SummaryTitlePlacement {\n  /**\n   * Framework places the title automatically at the top of the template, above\n   * the authored children. The zero-boilerplate, title-above-body default —\n   * matches the classic list/card summary look.\n   */\n  AUTO = 'auto',\n  /**\n   * The author owns title placement: `SummaryLayout` renders only its children,\n   * and the author drops `<SummaryTitle />` wherever it belongs (e.g. inside a\n   * `<SummaryHeader>` beside a status badge). Required whenever the title must\n   * share a line with other content.\n   */\n  TEMPLATE_OWNED = 'template-owned',\n}\n\nexport interface SummaryLayoutProps {\n  /** Additional CSS classes for the root container. */\n  className?: string;\n  /**\n   * Title placement. Defaults to {@link SummaryTitlePlacement.AUTO} (title\n   * rendered at the top). Switch to `TEMPLATE_OWNED` to place `<SummaryTitle />`\n   * yourself within the flow.\n   */\n  titlePlacement?: SummaryTitlePlacement;\n  children?: ReactNode;\n}\n\n/**\n * Root wrapper for summary layout templates (cards, list items, FK references).\n *\n * Owns TITLE PLACEMENT for the template: under `AUTO` (default) it renders\n * `<SummaryTitle />` at the top, then the children body — so an author who just\n * wants \"title above a couple of fields\" writes nothing about the title. Under\n * `TEMPLATE_OWNED` it renders only the children, and the author composes\n * `<SummaryTitle />` into the flow (see {@link SummaryHeader}).\n *\n * The title resolves its text from `SummaryContext` (provided by\n * `ResourceSummaryDisplayer`); on body-only surfaces with no title (inline\n * FK-field references) `<SummaryTitle />` renders nothing, so `AUTO` shows no\n * empty title slot.\n *\n * Provides a root `FieldScopeContext` with empty prefix.\n *\n * @example\n * ```tsx\n * // AUTO — title rendered above the body automatically:\n * <SummaryLayout>\n *   <DisplayField name=\"createdAt\" />\n * </SummaryLayout>\n *\n * // TEMPLATE_OWNED — badge on the same line as the title:\n * <SummaryLayout titlePlacement={SummaryTitlePlacement.TEMPLATE_OWNED}>\n *   <SummaryHeader>\n *     <SummaryTitle />\n *     <DisplayField name=\"status\" hideLabel />\n *   </SummaryHeader>\n *   <DisplayField name=\"createdAt\" />\n * </SummaryLayout>\n * ```\n */\nexport function SummaryLayout({\n  className,\n  titlePlacement = SummaryTitlePlacement.AUTO,\n  children,\n}: SummaryLayoutProps): ReactNode {\n  return (\n    <FieldScopeProvider pathPrefix=\"\">\n      <div className={className}>\n        {titlePlacement === SummaryTitlePlacement.AUTO && <SummaryTitle />}\n        {children}\n      </div>\n    </FieldScopeProvider>\n  );\n}\n"]}

package/dist/esm/components/resources/skeleton/SummaryTitle.d.ts

@@ -0,0 +1,26 @@
+/**
+ * SummaryTitle — the resource's PRIMARY LABEL (title) as a first-class, composable
+ * element of the summary template flow.
+ *
+ * Reads the resolved label from {@link SummaryContext} (provided by
+ * `ResourceSummaryDisplayer`). Renders the same medium-weight, truncating title
+ * the card/list/popover hosts render, so moving the title into the template flow
+ * is pixel-neutral for the common `AUTO` case.
+ *
+ * Usage:
+ * - `<SummaryLayout>` (default `titlePlacement={AUTO}`) renders this automatically
+ *   at the top of the template — authors write nothing.
+ * - `<SummaryLayout titlePlacement={TEMPLATE_OWNED}>` cedes placement to the
+ *   author, who drops `<SummaryTitle />` wherever it belongs — e.g. inside a
+ *   `<SummaryHeader>` beside a status badge.
+ *
+ * Renders nothing when there is no title to show (body-only surfaces such as an
+ * inline FK-field reference pass a `null` label — see {@link SummaryContext}).
+ */
+import type { ReactNode } from 'react';
+export interface SummaryTitleProps {
+    /** Extra classes merged over the default `font-medium text-foreground` title styling. */
+    className?: string;
+}
+export declare function SummaryTitle({ className }: SummaryTitleProps): ReactNode;
+//# sourceMappingURL=SummaryTitle.d.ts.map

package/dist/esm/components/resources/skeleton/SummaryTitle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryTitle.d.ts","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SummaryTitle.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,MAAM,WAAW,iBAAiB;IAChC,yFAAyF;IACzF,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,EAAE,iBAAiB,GAAG,SAAS,CAqBxE"}

package/dist/esm/components/resources/skeleton/SummaryTitle.js

@@ -0,0 +1,27 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../../../core/ui/cn.js';
+import { Text } from '../../../components/typography/text.js';
+import { useOptionalSummaryContext } from '../../../components/data-display/SummaryContext.js';
+export function SummaryTitle({ className }) {
+    const summary = useOptionalSummaryContext();
+    // Register with the displayer's missing-title diagnostic BEFORE the empty-label
+    // early return: mounting `<SummaryTitle />` discharges the template's contract
+    // even when the current record resolves no label (that is data-driven, not an
+    // authoring bug). Render-time ref mutation on purpose — the flag is read only
+    // after render and must not schedule updates.
+    if (summary?.titleMountTracker)
+        summary.titleMountTracker.titleMounted = true;
+    const primaryLabel = summary?.primaryLabel;
+    if (!primaryLabel)
+        return null;
+    return (
+    // `flex-1 min-w-0` lives HERE (not via a `:first-child` selector on
+    // SummaryHeader): when the title renders inside a flex header it grows and
+    // truncates; when it renders null (no label / body-only FK surface) there is
+    // simply no growing element, so a lone accessory keeps its intrinsic size
+    // instead of inheriting the grow. In a block context (SummaryLayout AUTO) the
+    // flex utility is inert.
+    _jsx(Text, { as: "p", className: cn('min-w-0 flex-1 font-medium text-foreground', className), truncate: true, children: primaryLabel }));
+}
+//# sourceMappingURL=SummaryTitle.js.map

package/dist/esm/components/resources/skeleton/SummaryTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryTitle.js","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/SummaryTitle.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAuBb,OAAO,EAAE,EAAE,EAAE,MAAM,gCAAgC,CAAC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,gDAAgD,CAAC;AACtE,OAAO,EAAE,yBAAyB,EAAE,MAAM,4DAA4D,CAAC;AAOvG,MAAM,UAAU,YAAY,CAAC,EAAE,SAAS,EAAqB;IAC3D,MAAM,OAAO,GAAG,yBAAyB,EAAE,CAAC;IAC5C,gFAAgF;IAChF,+EAA+E;IAC/E,8EAA8E;IAC9E,8EAA8E;IAC9E,8CAA8C;IAC9C,IAAI,OAAO,EAAE,iBAAiB;QAAE,OAAO,CAAC,iBAAiB,CAAC,YAAY,GAAG,IAAI,CAAC;IAC9E,MAAM,YAAY,GAAG,OAAO,EAAE,YAAY,CAAC;IAC3C,IAAI,CAAC,YAAY;QAAE,OAAO,IAAI,CAAC;IAC/B,OAAO;IACL,oEAAoE;IACpE,2EAA2E;IAC3E,6EAA6E;IAC7E,0EAA0E;IAC1E,8EAA8E;IAC9E,yBAAyB;IACzB,KAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,SAAS,EAAE,EAAE,CAAC,4CAA4C,EAAE,SAAS,CAAC,EAAE,QAAQ,kBAC1F,YAAY,GACR,CACR,CAAC;AACJ,CAAC","sourcesContent":["'use client';\n\n/**\n * SummaryTitle — the resource's PRIMARY LABEL (title) as a first-class, composable\n * element of the summary template flow.\n *\n * Reads the resolved label from {@link SummaryContext} (provided by\n * `ResourceSummaryDisplayer`). Renders the same medium-weight, truncating title\n * the card/list/popover hosts render, so moving the title into the template flow\n * is pixel-neutral for the common `AUTO` case.\n *\n * Usage:\n * - `<SummaryLayout>` (default `titlePlacement={AUTO}`) renders this automatically\n *   at the top of the template — authors write nothing.\n * - `<SummaryLayout titlePlacement={TEMPLATE_OWNED}>` cedes placement to the\n *   author, who drops `<SummaryTitle />` wherever it belongs — e.g. inside a\n *   `<SummaryHeader>` beside a status badge.\n *\n * Renders nothing when there is no title to show (body-only surfaces such as an\n * inline FK-field reference pass a `null` label — see {@link SummaryContext}).\n */\n\nimport type { ReactNode } from 'react';\nimport { cn } from '~wildo-frontend-lib/core/ui/cn';\nimport { Text } from '~wildo-frontend-lib/components/typography/text';\nimport { useOptionalSummaryContext } from '~wildo-frontend-lib/components/data-display/SummaryContext';\n\nexport interface SummaryTitleProps {\n  /** Extra classes merged over the default `font-medium text-foreground` title styling. */\n  className?: string;\n}\n\nexport function SummaryTitle({ className }: SummaryTitleProps): ReactNode {\n  const summary = useOptionalSummaryContext();\n  // Register with the displayer's missing-title diagnostic BEFORE the empty-label\n  // early return: mounting `<SummaryTitle />` discharges the template's contract\n  // even when the current record resolves no label (that is data-driven, not an\n  // authoring bug). Render-time ref mutation on purpose — the flag is read only\n  // after render and must not schedule updates.\n  if (summary?.titleMountTracker) summary.titleMountTracker.titleMounted = true;\n  const primaryLabel = summary?.primaryLabel;\n  if (!primaryLabel) return null;\n  return (\n    // `flex-1 min-w-0` lives HERE (not via a `:first-child` selector on\n    // SummaryHeader): when the title renders inside a flex header it grows and\n    // truncates; when it renders null (no label / body-only FK surface) there is\n    // simply no growing element, so a lone accessory keeps its intrinsic size\n    // instead of inheriting the grow. In a block context (SummaryLayout AUTO) the\n    // flex utility is inert.\n    <Text as=\"p\" className={cn('min-w-0 flex-1 font-medium text-foreground', className)} truncate>\n      {primaryLabel}\n    </Text>\n  );\n}\n"]}

package/dist/esm/components/resources/skeleton/WizardLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WizardLayout.d.ts","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/WizardLayout.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA0C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAmBtF,MAAM,WAAW,iBAAiB;IAChC,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6DAA6D;IAC7D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mGAAmG;IACnG,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uEAAuE;IACvE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,8EAA8E;IAC9E,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,WAAe,EACf,oBAA2B,EAC3B,YAAY,EACZ,YAAY,EACZ,QAAQ,GACT,EAAE,iBAAiB,GAAG,SAAS,CAkK/B"}
+{"version":3,"file":"WizardLayout.d.ts","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/WizardLayout.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA0C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAoBtF,MAAM,WAAW,iBAAiB;IAChC,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6DAA6D;IAC7D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mGAAmG;IACnG,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uEAAuE;IACvE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,8EAA8E;IAC9E,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,WAAe,EACf,oBAA2B,EAC3B,YAAY,EACZ,YAAY,EACZ,QAAQ,GACT,EAAE,iBAAiB,GAAG,SAAS,CA2K/B"}

package/dist/esm/components/resources/skeleton/WizardLayout.js

@@ -9,6 +9,7 @@ import { Stepper, StepperItem, StepperIndicator, StepperSeparator, StepperTitle,
 import { ErrorBoundary } from '../../../core/errors/ErrorBoundary.js';
 import { useI18n } from '../../../core/i18n/useI18n.js';
 import { useOptionalFormTemplateContext } from '../../../components/form/automated/FormTemplateContext.js';
+import { scrollAndFocusFirstErroredField } from '../../../components/form/validation-errors/scroll-to-first-error.utils.js';
 import { useWizardRootRegistration } from './FormLayoutSlotContext.js';
 import { WizardLayoutContext } from './WizardLayoutContext.js';
 import { WizardStep } from './WizardStep.js';
@@ -45,7 +46,7 @@ export function WizardLayout({ className, initialStep = 0, validateOnStepChange
     const wizardTopRef = useRef(null);
     const form = useFormContext();
     const templateCtx = useOptionalFormTemplateContext();
-    const { tComponent } = useI18n({
+    const { tComponent, isReady } = useI18n({
         component: FrontendComponentType.LOW_LEVEL_FORM_MESSAGE,
     });
     const wizardSteps = useMemo(() => {
@@ -64,7 +65,14 @@ export function WizardLayout({ className, initialStep = 0, validateOnStepChange
     const registerStep = useCallback((name, fields) => {
         stepFieldsRef.current.set(name, fields);
     }, []);
-    const wizardContextValue = useMemo(() => ({ registerStep, currentStep, totalSteps }), [registerStep, currentStep, totalSteps]);
+    const getCurrentStepFieldNames = useCallback(() => {
+        const currentStepName = wizardSteps[currentStep]?.name;
+        if (!currentStepName)
+            return undefined;
+        const stepFields = stepFieldsRef.current.get(currentStepName);
+        return stepFields ? Array.from(stepFields) : undefined;
+    }, [currentStep, wizardSteps]);
+    const wizardContextValue = useMemo(() => ({ registerStep, getCurrentStepFieldNames, currentStep, totalSteps }), [registerStep, getCurrentStepFieldNames, currentStep, totalSteps]);
     const getStepLabel = (stepName, index) => {
         if (templateCtx?.wizardStepLabels?.[stepName]) {
             return templateCtx.wizardStepLabels[stepName];
@@ -108,6 +116,8 @@ export function WizardLayout({ className, initialStep = 0, validateOnStepChange
     };
     const isFirstStep = currentStep === 0;
     const isLastStep = currentStep === totalSteps - 1;
+    if (!isReady)
+        return null;
     const previousLabel = tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'wizardPrevious');
     const nextLabel = tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'wizardNext');
     return (_jsx(WizardLayoutContext.Provider, { value: wizardContextValue, children: _jsxs("div", { className: className, "data-guidance-wizard": "", children: [_jsx("div", { ref: wizardTopRef, children: _jsx(Stepper, { currentStep: currentStep, totalSteps: totalSteps, orientation: DisplayDirection.HORIZONTAL, className: "mb-region", children: wizardSteps.map((step, index) => (_jsxs(React.Fragment, { children: [_jsxs(StepperItem, { step: index, children: [_jsx(StepperIndicator, { step: index }), _jsx("div", { className: "flex flex-col items-center text-center", children: _jsx(StepperTitle, { step: index, children: _jsx("span", { id: `wizard-tab-${step.name}`, children: getStepLabel(step.name, index) }) }) })] }), index < totalSteps - 1 && _jsx(StepperSeparator, { step: index })] }, step.name))) }) }), wizardSteps.map((step, index) => (_jsx("div", { style: { display: index === currentStep ? undefined : 'none' }, "aria-hidden": index !== currentStep, children: _jsx(ErrorBoundary, { children: step.element }) }, step.name))), _jsxs("div", { className: "flex justify-between gap-field pt-field", children: [_jsx(Button, { type: "button", variant: ButtonVariants_Variant.OUTLINE, onClick: handlePrevious, disabled: isFirstStep || templateCtx?.disabled, children: previousLabel }), _jsx("div", { className: "flex gap-element", children: isLastStep ? (submitButton ?? (_jsx(Button, { type: "submit", disabled: templateCtx?.disabled, children: tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'wizardSubmit') }))) : (_jsx(Button, { type: "button", onClick: handleNext, disabled: templateCtx?.disabled, children: nextLabel })) })] })] }) }));
@@ -140,24 +150,10 @@ function scrollToFirstError(form, fieldNames) {
     }
     if (!firstErrorField)
         return;
-    const element = document.querySelector(`[data-field="${firstErrorField}"], [name="${firstErrorField}"]`);
-    if (element) {
-        element.scrollIntoView({ behavior: 'smooth', block: 'center' });
-        setTimeout(() => {
-            if (!document.body.contains(element))
-                return;
-            if (element instanceof HTMLInputElement ||
-                element instanceof HTMLTextAreaElement ||
-                element instanceof HTMLSelectElement) {
-                element.focus();
-            }
-            else {
-                const focusable = element.querySelector('input, textarea, select, [tabindex]:not([tabindex="-1"])');
-                if (focusable && document.body.contains(focusable)) {
-                    focusable.focus();
-                }
-            }
-        }, 100);
-    }
+    // Shared scroll+focus mechanics (see scroll-to-first-error.utils, audit D4) —
+    // this wizard keeps its own STEP-SCOPED first-error selection above, but the
+    // DOM lookup / scroll / focus behavior is the same contract the whole-form
+    // submit path uses.
+    scrollAndFocusFirstErroredField([firstErrorField]);
 }
-//# sourceMappingURL=WizardLayout.js.map
+//# sourceMappingURL=WizardLayout.js.map

package/dist/esm/components/resources/skeleton/WizardLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"WizardLayout.js","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/WizardLayout.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"WizardLayout.js","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/WizardLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport React, { useCallback, useMemo, useRef, useState, type ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { DisplayDirection } from '@wildo-ai/zod-decorators';\nimport { FrontendComponentType } from '@wildo-ai/presets-components-models';\nimport { Button, ButtonVariants_Variant } from '~wildo-frontend-lib/components/actions/button';\nimport {\n  Stepper,\n  StepperItem,\n  StepperIndicator,\n  StepperSeparator,\n  StepperTitle,\n} from '~wildo-frontend-lib/components/sections/stepper';\nimport { ErrorBoundary } from '~wildo-frontend-lib/core/errors/ErrorBoundary';\nimport { useI18n } from '~wildo-frontend-lib/core/i18n/useI18n';\nimport { useOptionalFormTemplateContext } from '~wildo-frontend-lib/components/form/automated/FormTemplateContext';\nimport { scrollAndFocusFirstErroredField } from '~wildo-frontend-lib/components/form/validation-errors/scroll-to-first-error.utils';\nimport { useWizardRootRegistration } from './FormLayoutSlotContext';\nimport { WizardLayoutContext } from './WizardLayoutContext';\nimport { WizardStep } from './WizardStep';\n\nexport interface WizardLayoutProps {\n  /** Additional CSS classes for the wizard container. */\n  className?: string;\n  /** 0-based index of the initially active step. @default 0 */\n  initialStep?: number;\n  /** When `true`, validates current step fields before allowing navigation forward. @default true */\n  validateOnStepChange?: boolean;\n  /** Callback fired when step changes (after validation, if enabled). */\n  onStepChange?: (from: number, to: number) => void;\n  /** Custom submit button to render on the last step instead of the default. */\n  submitButton?: ReactNode;\n  children: ReactNode;\n}\n\n/**\n * Wizard container for multi-step form templates.\n *\n * Manages step state, renders a Stepper UI, navigation buttons (prev/next/submit),\n * and per-step validation. All steps remain mounted (hidden with `display: none`)\n * so that RHF retains field state across steps.\n *\n * Children must be `<WizardStep>` components. Non-WizardStep children are\n * silently filtered out.\n *\n * @example\n * ```tsx\n * <FormLayout>\n *   <WizardLayout>\n *     <WizardStep name=\"basics\">\n *       <FormField name=\"title\" />\n *       <FormField name=\"description\" />\n *     </WizardStep>\n *     <WizardStep name=\"settings\">\n *       <FormField name=\"priority\" />\n *       <FormField name=\"dueDate\" />\n *     </WizardStep>\n *   </WizardLayout>\n * </FormLayout>\n * ```\n */\nexport function WizardLayout({\n  className,\n  initialStep = 0,\n  validateOnStepChange = true,\n  onStepChange,\n  submitButton,\n  children,\n}: WizardLayoutProps): ReactNode {\n  useWizardRootRegistration();\n\n  const [currentStep, setCurrentStep] = useState(initialStep);\n  const stepFieldsRef = useRef<Map<string, Set<string>>>(new Map());\n  const wizardTopRef = useRef<HTMLDivElement>(null);\n\n  const form = useFormContext();\n  const templateCtx = useOptionalFormTemplateContext();\n  const { tComponent, isReady } = useI18n({\n    component: FrontendComponentType.LOW_LEVEL_FORM_MESSAGE,\n  });\n\n  const wizardSteps = useMemo(() => {\n    const steps: Array<{ name: string; element: React.ReactElement }> = [];\n    React.Children.forEach(children, (child) => {\n      if (React.isValidElement(child) && child.type === WizardStep) {\n        steps.push({\n          name: (child.props as { name: string }).name,\n          element: child,\n        });\n      }\n    });\n    return steps;\n  }, [children]);\n\n  const totalSteps = wizardSteps.length;\n\n  const registerStep = useCallback((name: string, fields: Set<string>) => {\n    stepFieldsRef.current.set(name, fields);\n  }, []);\n\n  const getCurrentStepFieldNames = useCallback(() => {\n    const currentStepName = wizardSteps[currentStep]?.name;\n    if (!currentStepName) return undefined;\n    const stepFields = stepFieldsRef.current.get(currentStepName);\n    return stepFields ? Array.from(stepFields) : undefined;\n  }, [currentStep, wizardSteps]);\n\n  const wizardContextValue = useMemo<React.ContextType<typeof WizardLayoutContext>>(\n    () => ({ registerStep, getCurrentStepFieldNames, currentStep, totalSteps }),\n    [registerStep, getCurrentStepFieldNames, currentStep, totalSteps],\n  );\n\n  const getStepLabel = (stepName: string, index: number): string => {\n    if (templateCtx?.wizardStepLabels?.[stepName]) {\n      return templateCtx.wizardStepLabels[stepName];\n    }\n    return tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'wizardStepDefault', {\n      index: String(index + 1),\n    });\n  };\n\n  const scrollToTop = () => {\n    wizardTopRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });\n  };\n\n  const goToStep = (to: number) => {\n    const from = currentStep;\n    setCurrentStep(to);\n    onStepChange?.(from, to);\n    scrollToTop();\n  };\n\n  const handlePrevious = () => {\n    if (currentStep > 0) {\n      goToStep(currentStep - 1);\n    }\n  };\n\n  const handleNext = async () => {\n    if (validateOnStepChange && form) {\n      const currentStepName = wizardSteps[currentStep]?.name;\n      const stepFields = currentStepName\n        ? stepFieldsRef.current.get(currentStepName)\n        : undefined;\n\n      const fieldNames = stepFields ? Array.from(stepFields) : [];\n      const isValid = fieldNames.length\n        ? await form.trigger(fieldNames)\n        : await form.trigger();\n\n      if (!isValid) {\n        scrollToFirstError(form, fieldNames);\n        return;\n      }\n    }\n    if (currentStep < totalSteps - 1) {\n      goToStep(currentStep + 1);\n    }\n  };\n\n  const isFirstStep = currentStep === 0;\n  const isLastStep = currentStep === totalSteps - 1;\n\n  if (!isReady) return null;\n\n  const previousLabel = tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'wizardPrevious');\n  const nextLabel = tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'wizardNext');\n\n  return (\n    <WizardLayoutContext.Provider value={wizardContextValue}>\n      <div className={className} data-guidance-wizard=\"\">\n        <div ref={wizardTopRef}>\n          <Stepper\n            currentStep={currentStep}\n            totalSteps={totalSteps}\n            orientation={DisplayDirection.HORIZONTAL}\n            className=\"mb-region\"\n          >\n            {wizardSteps.map((step, index) => (\n              <React.Fragment key={step.name}>\n                <StepperItem step={index}>\n                  <StepperIndicator step={index} />\n                  <div className=\"flex flex-col items-center text-center\">\n                    <StepperTitle step={index}>\n                      <span id={`wizard-tab-${step.name}`}>\n                        {getStepLabel(step.name, index)}\n                      </span>\n                    </StepperTitle>\n                  </div>\n                </StepperItem>\n                {index < totalSteps - 1 && <StepperSeparator step={index} />}\n              </React.Fragment>\n            ))}\n          </Stepper>\n        </div>\n\n        {wizardSteps.map((step, index) => (\n          <div\n            key={step.name}\n            style={{ display: index === currentStep ? undefined : 'none' }}\n            aria-hidden={index !== currentStep}\n          >\n            <ErrorBoundary>\n              {step.element}\n            </ErrorBoundary>\n          </div>\n        ))}\n\n        <div className=\"flex justify-between gap-field pt-field\">\n          <Button\n            type=\"button\"\n            variant={ButtonVariants_Variant.OUTLINE}\n            onClick={handlePrevious}\n            disabled={isFirstStep || templateCtx?.disabled}\n          >\n            {previousLabel}\n          </Button>\n\n          <div className=\"flex gap-element\">\n            {isLastStep ? (\n              submitButton ?? (\n                <Button type=\"submit\" disabled={templateCtx?.disabled}>\n                  {tComponent(FrontendComponentType.LOW_LEVEL_FORM_MESSAGE, 'wizardSubmit')}\n                </Button>\n              )\n            ) : (\n              <Button\n                type=\"button\"\n                onClick={handleNext}\n                disabled={templateCtx?.disabled}\n              >\n                {nextLabel}\n              </Button>\n            )}\n          </div>\n        </div>\n      </div>\n    </WizardLayoutContext.Provider>\n  );\n}\n\n/**\n * Scroll to the first field with a validation error.\n * Uses `data-field` or `name` attributes to locate the DOM element.\n */\nfunction scrollToFirstError(\n  form: ReturnType<typeof useFormContext>,\n  fieldNames?: string[],\n): void {\n  const errors = form.formState.errors;\n  let firstErrorField: string | null = null;\n\n  if (fieldNames?.length) {\n    for (const fieldName of fieldNames) {\n      const parts = fieldName.split('.');\n      let errorObj: unknown = errors;\n      for (const part of parts) {\n        if (errorObj && typeof errorObj === 'object' && part in errorObj) {\n          errorObj = (errorObj as Record<string, unknown>)[part];\n        } else {\n          errorObj = undefined;\n          break;\n        }\n      }\n      if (errorObj) {\n        firstErrorField = fieldName;\n        break;\n      }\n    }\n  }\n\n  if (!firstErrorField) return;\n\n  // Shared scroll+focus mechanics (see scroll-to-first-error.utils, audit D4) —\n  // this wizard keeps its own STEP-SCOPED first-error selection above, but the\n  // DOM lookup / scroll / focus behavior is the same contract the whole-form\n  // submit path uses.\n  scrollAndFocusFirstErroredField([firstErrorField]);\n}\n"]}

package/dist/esm/components/resources/skeleton/WizardLayoutContext.d.ts

@@ -8,6 +8,8 @@
 export interface WizardLayoutContextValue {
     /** Called by WizardStep on mount to register its field set. */
     registerStep: (name: string, fields: Set<string>) => void;
+    /** Returns field names for the currently visible step. */
+    getCurrentStepFieldNames: () => string[] | undefined;
     /** 0-based index of the currently visible step. */
     currentStep: number;
     /** Total number of wizard steps. */

package/dist/esm/components/resources/skeleton/WizardLayoutContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WizardLayoutContext.d.ts","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/WizardLayoutContext.tsx"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH,MAAM,WAAW,wBAAwB;IACvC,+DAA+D;IAC/D,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IAC1D,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,mBAAmB,mDAAuD,CAAC;AAExF,wBAAgB,sBAAsB,IAAI,wBAAwB,GAAG,IAAI,CAExE"}
+{"version":3,"file":"WizardLayoutContext.d.ts","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/WizardLayoutContext.tsx"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH,MAAM,WAAW,wBAAwB;IACvC,+DAA+D;IAC/D,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IAC1D,0DAA0D;IAC1D,wBAAwB,EAAE,MAAM,MAAM,EAAE,GAAG,SAAS,CAAC;IACrD,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,mBAAmB,mDAAuD,CAAC;AAExF,wBAAgB,sBAAsB,IAAI,wBAAwB,GAAG,IAAI,CAExE"}

package/dist/esm/components/resources/skeleton/WizardLayoutContext.js

@@ -4,4 +4,4 @@ export const WizardLayoutContext = createContext(null);
 export function useWizardLayoutContext() {
     return useContext(WizardLayoutContext);
 }
-//# sourceMappingURL=WizardLayoutContext.js.map
+//# sourceMappingURL=WizardLayoutContext.js.map

package/dist/esm/components/resources/skeleton/WizardLayoutContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"WizardLayoutContext.js","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/WizardLayoutContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAkBlD,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAkC,IAAI,CAAC,CAAC;AAExF,MAAM,UAAU,sBAAsB;IACpC,OAAO,UAAU,CAAC,mBAAmB,CAAC,CAAC;AACzC,CAAC"}
+{"version":3,"file":"WizardLayoutContext.js","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/WizardLayoutContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAoBlD,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAkC,IAAI,CAAC,CAAC;AAExF,MAAM,UAAU,sBAAsB;IACpC,OAAO,UAAU,CAAC,mBAAmB,CAAC,CAAC;AACzC,CAAC","sourcesContent":["'use client';\n\nimport { createContext, useContext } from 'react';\n\n/**\n * Contract between WizardLayout (provider) and WizardStep (consumer).\n *\n * Each WizardStep calls `registerStep` during mount to report its name\n * and the set of field names it contains — WizardLayout uses this for\n * per-step validation (trigger only the fields in the active step).\n */\nexport interface WizardLayoutContextValue {\n  /** Called by WizardStep on mount to register its field set. */\n  registerStep: (name: string, fields: Set<string>) => void;\n  /** Returns field names for the currently visible step. */\n  getCurrentStepFieldNames: () => string[] | undefined;\n  /** 0-based index of the currently visible step. */\n  currentStep: number;\n  /** Total number of wizard steps. */\n  totalSteps: number;\n}\n\nexport const WizardLayoutContext = createContext<WizardLayoutContextValue | null>(null);\n\nexport function useWizardLayoutContext(): WizardLayoutContextValue | null {\n  return useContext(WizardLayoutContext);\n}\n"]}

package/dist/esm/components/resources/skeleton/WizardStep.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WizardStep.d.ts","sourceRoot":"","sources":["../../../../../src/components/resources/skeleton/WizardStep.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAqD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKjG,MAAM,WAAW,eAAe;IAC9B;;;;;;OAMG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,eAAe,GAAG,SAAS,CA+CpF"}
+{"version":3,"file":"WizardStep.d.ts","sourceRoot":"","sources":["../../../../../../src/components/resources/skeleton/WizardStep.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAqD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKjG,MAAM,WAAW,eAAe;IAC9B;;;;;;OAMG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,eAAe,GAAG,SAAS,CAiDpF"}

package/dist/esm/components/resources/skeleton/WizardStep.js

@@ -29,10 +29,12 @@ export function WizardStep({ name, className, children }) {
     const registeredRef = useRef(false);
     const registerField = useCallback((fieldName) => {
         fields.add(fieldName);
-    }, [fields]);
+        wizardCtx?.registerStep(name, fields);
+    }, [fields, name, wizardCtx]);
     const unregisterField = useCallback((fieldName) => {
         fields.delete(fieldName);
-    }, [fields]);
+        wizardCtx?.registerStep(name, fields);
+    }, [fields, name, wizardCtx]);
     const fieldsContextValue = useMemo(() => ({ registerField, unregisterField }), [registerField, unregisterField]);
     /**
      * After initial render, report our field set to the parent WizardLayout.
@@ -50,4 +52,4 @@ export function WizardStep({ name, className, children }) {
     const stepId = `wizard-step-${name}`;
     return (_jsx(WizardStepFieldsContext.Provider, { value: fieldsContextValue, children: _jsx("div", { className: className, id: stepId, "data-guidance-wizard-step": name, role: "tabpanel", "aria-labelledby": `wizard-tab-${name}`, children: children }) }));
 }
-//# sourceMappingURL=WizardStep.js.map
+//# sourceMappingURL=WizardStep.js.map