@wildo-ai/presets-components 1.1.3 → 1.1.5

package/dist/esm/components/feedback/features/feature-unavailable-prompt.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feature-unavailable-prompt.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/features/feature-unavailable-prompt.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAQL,6BAA6B,EAC9B,MAAM,6BAA6B,CAAC;AAuCrC,wBAAgB,wBAAwB,CAAC,EACvC,QAAQ,EACR,eAAe,EACf,SAAS,EACT,mBAAmB,EACnB,QAAQ,EACR,SAAS,GACV,EAAE,6BAA6B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAgH1D"}
+{"version":3,"file":"feature-unavailable-prompt.d.ts","sourceRoot":"","sources":["../../../../../../src/components/feedback/features/feature-unavailable-prompt.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAQL,6BAA6B,EAC9B,MAAM,6BAA6B,CAAC;AAuCrC,wBAAgB,wBAAwB,CAAC,EACvC,QAAQ,EACR,eAAe,EACf,SAAS,EACT,mBAAmB,EACnB,QAAQ,EACR,SAAS,GACV,EAAE,6BAA6B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAgH1D"}

package/dist/esm/components/feedback/features/feature-unavailable-prompt.js.map

@@ -1 +1 @@
-{"version":3,"file":"feature-unavailable-prompt.js","sourceRoot":"","sources":["../../../../../src/components/feedback/features/feature-unavailable-prompt.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * FeatureUnavailablePrompt (Preset)\n *\n * Core reusable content for feature unavailability prompts.\n * Adapts its title, description, icon, and CTA based on `behavior`.\n *\n * Rendered both in the route content area (FeatureRouteGuard) and inside a Dialog.\n */\n\nimport React, { useMemo } from 'react';\nimport { ButtonSize, FrontendComponentType, SurfaceVariant } from '@wildo-ai/presets-components-models';\nimport {\n  Button,\n  ButtonVariants_Variant,\n  useI18n,\n  useIconRegistry,\n  StandardIconReference,\n  IconSize,\n  Surface,\n  FeatureUnavailablePromptProps,\n} from '@wildo-ai/saas-frontend-lib';\n\n// ── Behavior → icon / label key mapping ─────────────────────────────\n\ninterface BehaviorConfig {\n  icon: StandardIconReference;\n  titleKey: string;\n  descriptionKey: string;\n  ctaKey?: string;\n}\n\n/**\n * Maps FeatureUnavailabilityBehavior enum values (lowercase) to icon + label keys.\n * Keys must match the enum values exactly: 'upgrade_prompt', 'addon_prompt', etc.\n */\nconst BEHAVIOR_CONFIG: Record<string, BehaviorConfig> = {\n  upgrade_prompt: { icon: StandardIconReference.LOCK, titleKey: 'upgradeTitle', descriptionKey: 'upgradeDescription', ctaKey: 'upgradeCTA' },\n  addon_prompt: { icon: StandardIconReference.PLUS, titleKey: 'addonTitle', descriptionKey: 'addonDescription', ctaKey: 'addonCTA' },\n  contact_admin: { icon: StandardIconReference.USERS, titleKey: 'contactTitle', descriptionKey: 'contactDescription' },\n  limit_upgrade_prompt: { icon: StandardIconReference.WARNING, titleKey: 'limitTitle', descriptionKey: 'limitDescription', ctaKey: 'limitCTA' },\n  disable: { icon: StandardIconReference.LOCK, titleKey: 'disableTitle', descriptionKey: 'disableDescription' },\n  /*\n   * `custom` reaches this preset ONLY when the feature declared no `customComponentRef`: the engine\n   * wrapper resolves a declared ref through the component registry and renders that instead, and an\n   * unresolvable ref renders ComponentNotInjected (#440). So this row is the no-ref fallback, not an\n   * alias — it used to be the alias, which is why a CUSTOM feature rendered the DISABLE copy while\n   * `useResourceOperationActions` was treating CUSTOM as a prompt behaviour.\n   */\n  custom: { icon: StandardIconReference.LOCK, titleKey: 'disableTitle', descriptionKey: 'disableDescription' },\n};\n\nconst DEFAULT_CONFIG: BehaviorConfig = {\n  icon: StandardIconReference.LOCK,\n  titleKey: 'disableTitle',\n  descriptionKey: 'disableDescription',\n};\n\n// ── Component ───────────────────────────────────────────────────────\n\nexport function FeatureUnavailablePrompt({\n  behavior,\n  missingFeatures,\n  limitInfo,\n  upgradeOptionsCount,\n  onAction,\n  onDismiss,\n}: FeatureUnavailablePromptProps): React.JSX.Element | null {\n  const { makeTrComponent, isReady } = useI18n({ component: FrontendComponentType.LOW_LEVEL_FEATURE_UNAVAILABLE_PROMPT });\n  const { renderIcon } = useIconRegistry();\n\n  const t = useMemo(\n    () => makeTrComponent(FrontendComponentType.LOW_LEVEL_FEATURE_UNAVAILABLE_PROMPT),\n    [makeTrComponent],\n  );\n\n  const config = BEHAVIOR_CONFIG[behavior] ?? DEFAULT_CONFIG;\n\n  const limitPercentage = useMemo(() => {\n    if (!limitInfo || limitInfo.limit <= 0) return 0;\n    return Math.min(100, Math.round((limitInfo.current / limitInfo.limit) * 100));\n  }, [limitInfo]);\n\n  if (!isReady) return null;\n\n  return (\n    <div className=\"flex flex-col items-center justify-center min-h-[60vh] p-card text-center max-w-lg mx-auto\">\n      {/* Icon */}\n      <div className=\"w-16 h-16 rounded-full bg-muted flex items-center justify-center mb-section\">\n        {renderIcon(config.icon, { size: IconSize.LG, className: 'text-muted-foreground' })}\n      </div>\n\n      {/* Title */}\n      <h2 className=\"text-2xl font-semibold text-foreground mb-element\">\n        {t(config.titleKey)}\n      </h2>\n\n      {/* Description */}\n      <p className=\"text-muted-foreground mb-section max-w-sm\">\n        {t(config.descriptionKey)}\n      </p>\n\n      {/* Missing features badges */}\n      {missingFeatures && missingFeatures.length > 0 && (\n        <div className=\"mb-section space-y-element\">\n          <p className=\"text-xs font-medium text-muted-foreground\">\n            {t('requiredFeaturesLabel')}\n          </p>\n          <div className=\"flex flex-wrap justify-center gap-1\">\n            {missingFeatures.map(f => (\n              <span key={f} className=\"inline-flex items-center rounded-md bg-primary/10 px-2.5 py-1 text-xs font-medium text-primary\">\n                {f}\n              </span>\n            ))}\n          </div>\n        </div>\n      )}\n\n      {/* Limit usage bar */}\n      {limitInfo && (\n        <Surface asChild emitPolicyVars={false} variant={SurfaceVariant.INSET}>\n          <div className=\"bg-muted rounded-lg p-card-sm space-y-element w-full max-w-xs mb-section\">\n            <div className=\"flex justify-between text-sm\">\n              <span className=\"text-muted-foreground\">{limitInfo.featureId}</span>\n              <span className=\"font-medium text-foreground\">\n                {t('usageProgress', { current: limitInfo.current, limit: limitInfo.limit })}\n              </span>\n            </div>\n            <div\n              className=\"h-2.5 bg-muted-foreground/20 rounded-full overflow-hidden\"\n              role=\"progressbar\"\n              aria-valuenow={limitInfo.current}\n              aria-valuemin={0}\n              aria-valuemax={limitInfo.limit}\n              aria-label={`${limitInfo.featureId}: ${limitInfo.current} of ${limitInfo.limit}`}\n            >\n              <div\n                className={`h-full rounded-full transition-all duration-[var(--motion-duration-fast)] ${\n                  limitPercentage >= 100 ? 'bg-destructive' : limitPercentage >= 80 ? 'bg-warning' : 'bg-primary'\n                }`}\n                style={{ width: `${limitPercentage}%` }}\n              />\n            </div>\n          </div>\n        </Surface>\n      )}\n\n      {/* Upgrade options count */}\n      {upgradeOptionsCount != null && upgradeOptionsCount > 0 && (\n        <p className=\"text-sm text-muted-foreground mb-section\">\n          {t('upgradeOptionsAvailable', { count: upgradeOptionsCount })}\n        </p>\n      )}\n\n      {/* Actions */}\n      <div className=\"flex flex-col gap-element w-full max-w-xs\">\n        {config.ctaKey && (\n          <Button\n            type=\"button\"\n            variant={ButtonVariants_Variant.DEFAULT}\n            size={ButtonSize.MD}\n            onClick={onAction}\n          >\n            {t(config.ctaKey)}\n          </Button>\n        )}\n        {onDismiss && (\n          <Button\n            type=\"button\"\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.MD}\n            onClick={onDismiss}\n          >\n            {t('goBack')}\n          </Button>\n        )}\n      </div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"feature-unavailable-prompt.js","sourceRoot":"","sources":["../../../../../../src/components/feedback/features/feature-unavailable-prompt.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * FeatureUnavailablePrompt (Preset)\n *\n * Core reusable content for feature unavailability prompts.\n * Adapts its title, description, icon, and CTA based on `behavior`.\n *\n * Rendered both in the route content area (FeatureRouteGuard) and inside a Dialog.\n */\n\nimport React, { useMemo } from 'react';\nimport { ButtonSize, FrontendComponentType, SurfaceVariant } from '@wildo-ai/presets-components-models';\nimport {\n  Button,\n  ButtonVariants_Variant,\n  useI18n,\n  useIconRegistry,\n  StandardIconReference,\n  IconSize,\n  Surface,\n  FeatureUnavailablePromptProps,\n} from '@wildo-ai/saas-frontend-lib';\n\n// ── Behavior → icon / label key mapping ─────────────────────────────\n\ninterface BehaviorConfig {\n  icon: StandardIconReference;\n  titleKey: string;\n  descriptionKey: string;\n  ctaKey?: string;\n}\n\n/**\n * Maps FeatureUnavailabilityBehavior enum values (lowercase) to icon + label keys.\n * Keys must match the enum values exactly: 'upgrade_prompt', 'addon_prompt', etc.\n */\nconst BEHAVIOR_CONFIG: Record<string, BehaviorConfig> = {\n  upgrade_prompt: { icon: StandardIconReference.LOCK, titleKey: 'upgradeTitle', descriptionKey: 'upgradeDescription', ctaKey: 'upgradeCTA' },\n  addon_prompt: { icon: StandardIconReference.PLUS, titleKey: 'addonTitle', descriptionKey: 'addonDescription', ctaKey: 'addonCTA' },\n  contact_admin: { icon: StandardIconReference.USERS, titleKey: 'contactTitle', descriptionKey: 'contactDescription' },\n  limit_upgrade_prompt: { icon: StandardIconReference.WARNING, titleKey: 'limitTitle', descriptionKey: 'limitDescription', ctaKey: 'limitCTA' },\n  disable: { icon: StandardIconReference.LOCK, titleKey: 'disableTitle', descriptionKey: 'disableDescription' },\n  /*\n   * `custom` reaches this preset ONLY when the feature declared no `customComponentRef`: the engine\n   * wrapper resolves a declared ref through the component registry and renders that instead, and an\n   * unresolvable ref renders ComponentNotInjected (#440). So this row is the no-ref fallback, not an\n   * alias — it used to be the alias, which is why a CUSTOM feature rendered the DISABLE copy while\n   * `useResourceOperationActions` was treating CUSTOM as a prompt behaviour.\n   */\n  custom: { icon: StandardIconReference.LOCK, titleKey: 'disableTitle', descriptionKey: 'disableDescription' },\n};\n\nconst DEFAULT_CONFIG: BehaviorConfig = {\n  icon: StandardIconReference.LOCK,\n  titleKey: 'disableTitle',\n  descriptionKey: 'disableDescription',\n};\n\n// ── Component ───────────────────────────────────────────────────────\n\nexport function FeatureUnavailablePrompt({\n  behavior,\n  missingFeatures,\n  limitInfo,\n  upgradeOptionsCount,\n  onAction,\n  onDismiss,\n}: FeatureUnavailablePromptProps): React.JSX.Element | null {\n  const { makeTrComponent, isReady } = useI18n({ component: FrontendComponentType.LOW_LEVEL_FEATURE_UNAVAILABLE_PROMPT });\n  const { renderIcon } = useIconRegistry();\n\n  const t = useMemo(\n    () => makeTrComponent(FrontendComponentType.LOW_LEVEL_FEATURE_UNAVAILABLE_PROMPT),\n    [makeTrComponent],\n  );\n\n  const config = BEHAVIOR_CONFIG[behavior] ?? DEFAULT_CONFIG;\n\n  const limitPercentage = useMemo(() => {\n    if (!limitInfo || limitInfo.limit <= 0) return 0;\n    return Math.min(100, Math.round((limitInfo.current / limitInfo.limit) * 100));\n  }, [limitInfo]);\n\n  if (!isReady) return null;\n\n  return (\n    <div className=\"flex flex-col items-center justify-center min-h-[60vh] p-card text-center max-w-lg mx-auto\">\n      {/* Icon */}\n      <div className=\"w-16 h-16 rounded-full bg-muted flex items-center justify-center mb-section\">\n        {renderIcon(config.icon, { size: IconSize.LG, className: 'text-muted-foreground' })}\n      </div>\n\n      {/* Title */}\n      <h2 className=\"text-2xl font-semibold text-foreground mb-element\">\n        {t(config.titleKey)}\n      </h2>\n\n      {/* Description */}\n      <p className=\"text-muted-foreground mb-section max-w-sm\">\n        {t(config.descriptionKey)}\n      </p>\n\n      {/* Missing features badges */}\n      {missingFeatures && missingFeatures.length > 0 && (\n        <div className=\"mb-section space-y-element\">\n          <p className=\"text-xs font-medium text-muted-foreground\">\n            {t('requiredFeaturesLabel')}\n          </p>\n          <div className=\"flex flex-wrap justify-center gap-1\">\n            {missingFeatures.map(f => (\n              <span key={f} className=\"inline-flex items-center rounded-md bg-primary/10 px-2.5 py-1 text-xs font-medium text-primary\">\n                {f}\n              </span>\n            ))}\n          </div>\n        </div>\n      )}\n\n      {/* Limit usage bar */}\n      {limitInfo && (\n        <Surface asChild emitPolicyVars={false} variant={SurfaceVariant.INSET}>\n          <div className=\"bg-muted rounded-lg p-card-sm space-y-element w-full max-w-xs mb-section\">\n            <div className=\"flex justify-between text-sm\">\n              <span className=\"text-muted-foreground\">{limitInfo.featureId}</span>\n              <span className=\"font-medium text-foreground\">\n                {t('usageProgress', { current: limitInfo.current, limit: limitInfo.limit })}\n              </span>\n            </div>\n            <div\n              className=\"h-2.5 bg-muted-foreground/20 rounded-full overflow-hidden\"\n              role=\"progressbar\"\n              aria-valuenow={limitInfo.current}\n              aria-valuemin={0}\n              aria-valuemax={limitInfo.limit}\n              aria-label={`${limitInfo.featureId}: ${limitInfo.current} of ${limitInfo.limit}`}\n            >\n              <div\n                className={`h-full rounded-full transition-all duration-[var(--motion-duration-fast)] ${\n                  limitPercentage >= 100 ? 'bg-destructive' : limitPercentage >= 80 ? 'bg-warning' : 'bg-primary'\n                }`}\n                style={{ width: `${limitPercentage}%` }}\n              />\n            </div>\n          </div>\n        </Surface>\n      )}\n\n      {/* Upgrade options count */}\n      {upgradeOptionsCount != null && upgradeOptionsCount > 0 && (\n        <p className=\"text-sm text-muted-foreground mb-section\">\n          {t('upgradeOptionsAvailable', { count: upgradeOptionsCount })}\n        </p>\n      )}\n\n      {/* Actions */}\n      <div className=\"flex flex-col gap-element w-full max-w-xs\">\n        {config.ctaKey && (\n          <Button\n            type=\"button\"\n            variant={ButtonVariants_Variant.DEFAULT}\n            size={ButtonSize.MD}\n            onClick={onAction}\n          >\n            {t(config.ctaKey)}\n          </Button>\n        )}\n        {onDismiss && (\n          <Button\n            type=\"button\"\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.MD}\n            onClick={onDismiss}\n          >\n            {t('goBack')}\n          </Button>\n        )}\n      </div>\n    </div>\n  );\n}\n"]}

package/dist/esm/components/feedback/features/feature-unavailable-prompt.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feature-unavailable-prompt.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/features/feature-unavailable-prompt.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,sCAAsC,EAAE,mBAAmB,EA2GvE,CAAC"}
+{"version":3,"file":"feature-unavailable-prompt.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/feedback/features/feature-unavailable-prompt.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,sCAAsC,EAAE,mBAAmB,EA2GvE,CAAC"}

package/dist/esm/components/feedback/loading-overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loading-overlay.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/loading-overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEtE;;;;;;;GAOG;AACH,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,WAAgB,EAAE,WAAkB,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAwBpI;AAED,OAAO,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"loading-overlay.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/loading-overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEtE;;;;;;;GAOG;AACH,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,WAAgB,EAAE,WAAkB,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAwBpI;AAED,OAAO,EAAE,cAAc,EAAE,CAAA"}

package/dist/esm/components/feedback/loading-overlay.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loading-overlay.labels.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/loading-overlay.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,4BAA4B,EAAE,mBAAmB,EAM7D,CAAC"}
+{"version":3,"file":"loading-overlay.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/loading-overlay.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,4BAA4B,EAAE,mBAAmB,EAM7D,CAAC"}

package/dist/esm/components/feedback/loading-spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loading-spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/loading-spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEtE;;;;;GAKG;AACH,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,IAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA2CzG;AAED,OAAO,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"loading-spinner.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/loading-spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEtE;;;;;GAKG;AACH,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,IAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CA2CzG;AAED,OAAO,EAAE,cAAc,EAAE,CAAA"}

package/dist/esm/components/feedback/loading-spinner.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loading-spinner.labels.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/loading-spinner.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,4BAA4B,EAAE,mBAAmB,EAM7D,CAAC"}
+{"version":3,"file":"loading-spinner.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/loading-spinner.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,4BAA4B,EAAE,mBAAmB,EAM7D,CAAC"}

package/dist/esm/components/feedback/notification-center.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification-center.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/notification-center.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAEL,uBAAuB,EAMxB,MAAM,6BAA6B,CAAC;AAkCrC;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,kBAAkB,gGA2H9B,CAAC"}
+{"version":3,"file":"notification-center.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/notification-center.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAEL,uBAAuB,EAMxB,MAAM,6BAA6B,CAAC;AAkCrC;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,kBAAkB,gGA2H9B,CAAC"}

package/dist/esm/components/feedback/notification-center.js

@@ -11,12 +11,12 @@ function getRelativeTime(timestamp, labels) {
     const hours = Math.floor(diff / 3600000);
     const days = Math.floor(diff / 86400000);
     if (minutes < 1)
-        return labels.labelTimeJustNow ?? 'Just now';
+        return labels.labelTimeJustNow;
     if (minutes < 60)
-        return labels.formatTimeMinutesAgo?.(minutes) ?? `${minutes}m ago`;
+        return labels.formatTimeMinutesAgo(minutes);
     if (hours < 24)
-        return labels.formatTimeHoursAgo?.(hours) ?? `${hours}h ago`;
-    return labels.formatTimeDaysAgo?.(days) ?? `${days}d ago`;
+        return labels.formatTimeHoursAgo(hours);
+    return labels.formatTimeDaysAgo(days);
 }
 const TYPE_INDICATORS = {
     success: 'bg-success',
@@ -39,9 +39,9 @@ const TYPE_INDICATORS = {
  * For engine integration, see the notification-center wrapper in saas-frontend-lib
  * which wires NotificationContext and resolves i18n labels.
  */
-export const NotificationCenter = React.forwardRef(({ notifications, sessionCount, onRemove, onClearAll, labelTitle = 'Notifications', labelNoNotifications = 'Nothing since this page loaded', labelClearAll = 'Clear all', labelDismiss = 'Dismiss', labelTimeJustNow, formatTimeMinutesAgo, formatTimeHoursAgo, formatTimeDaysAgo, className, ...props }, ref) => {
+export const NotificationCenter = React.forwardRef(({ notifications, sessionCount, onRemove, onClearAll, labelTitle, labelNoNotifications, labelClearAll, labelDismiss, labelTimeJustNow, formatTimeMinutesAgo, formatTimeHoursAgo, formatTimeDaysAgo, className, ...props }, ref) => {
     const timeLabels = { labelTimeJustNow, formatTimeMinutesAgo, formatTimeHoursAgo, formatTimeDaysAgo };
-    return (_jsx(Surface, { asChild: true, emitPolicyVars: false, variant: SurfaceVariant.RAISED, children: _jsxs("div", { ref: ref, className: cn("flex flex-col w-full max-w-sm border border-border rounded-lg bg-popover shadow-[var(--shadow-lg)]", className), ...props, children: [_jsxs("div", { className: "flex items-center justify-between px-card py-element border-b border-border", children: [_jsxs("div", { className: "flex items-center gap-element", children: [_jsx("h3", { className: "text-sm font-semibold text-foreground", children: labelTitle }), sessionCount > 0 && (_jsx("span", { className: "inline-flex items-center justify-center h-5 min-w-[20px] px-1.5 text-xs font-medium bg-primary text-primary-foreground rounded-full", children: sessionCount }))] }), _jsx("div", { className: "flex items-center gap-element-sm", children: notifications.length > 0 && onClearAll && (_jsx(Button, { variant: ButtonVariants_Variant.GHOST, size: ButtonSize.XS, className: "text-muted-foreground", onClick: onClearAll, children: labelClearAll })) })] }), _jsx(ScrollArea, { className: "max-h-[24rem]", children: notifications.length === 0 ? (_jsx("div", { className: "flex items-center justify-center py-section text-sm text-muted-foreground", children: labelNoNotifications })) : (_jsx("div", { className: "flex flex-col", children: notifications.map((notification) => (_jsx(Surface, { asChild: true, emitPolicyVars: false, variant: SurfaceVariant.INSET, children: _jsxs("div", { className: cn("flex items-start gap-element px-card py-element-lg border-b border-border/50 last:border-b-0"), children: [_jsx("div", { className: "flex-shrink-0 mt-1.5", children: _jsx("div", { className: cn("w-2 h-2 rounded-full", TYPE_INDICATORS[notification.type] ?? TYPE_INDICATORS.info) }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-start justify-between gap-element-sm", children: [_jsxs("p", { className: "text-sm leading-snug font-medium text-foreground", children: [notification.wasCelebration && _jsx("span", { className: "me-1", children: "\uD83C\uDF89" }), notification.message] }), onRemove && (_jsx("button", { type: "button", className: "flex-shrink-0 text-muted-foreground/50 hover:text-muted-foreground text-xs", onClick: () => onRemove(notification.id), "aria-label": labelDismiss, children: "\u00D7" }))] }), _jsx("p", { className: "text-xs text-muted-foreground/70 mt-0.5", children: getRelativeTime(notification.timestamp, timeLabels) }), notification.nextStep && (_jsxs(Button, { variant: ButtonVariants_Variant.LINK, size: ButtonSize.SM, className: "h-auto p-0 text-xs mt-1", onClick: () => notification.nextStep.onClick(), children: [notification.nextStep.label, " \u2192"] }))] })] }) }, notification.id))) })) })] }) }));
+    return (_jsx(Surface, { asChild: true, emitPolicyVars: false, variant: SurfaceVariant.RAISED, children: _jsxs("div", { ref: ref, className: cn("flex flex-col w-full max-w-sm border border-border rounded-lg bg-popover shadow-[var(--shadow-lg)]", className), ...props, children: [_jsxs("div", { className: "flex items-center justify-between px-card py-element border-b border-border", children: [_jsxs("div", { className: "flex items-center gap-element", children: [_jsx("h3", { className: "text-sm font-semibold text-foreground", children: labelTitle }), sessionCount > 0 && (_jsx("span", { className: "inline-flex items-center justify-center h-5 min-w-[20px] px-1.5 text-xs font-medium bg-primary text-primary-foreground rounded-full", children: sessionCount }))] }), _jsx("div", { className: "flex items-center gap-element-sm", children: notifications.length > 0 && onClearAll && (_jsx(Button, { variant: ButtonVariants_Variant.GHOST, size: ButtonSize.XS, className: "text-muted-foreground", onClick: onClearAll, children: labelClearAll })) })] }), _jsx(ScrollArea, { className: "max-h-[24rem]", children: notifications.length === 0 ? (_jsx("div", { className: "flex items-center justify-center py-section text-sm text-muted-foreground", children: labelNoNotifications })) : (_jsx("div", { className: "flex flex-col", children: notifications.map((notification) => (_jsx(Surface, { asChild: true, emitPolicyVars: false, variant: SurfaceVariant.INSET, children: _jsxs("div", { className: cn("flex items-start gap-element px-card py-element-lg border-b border-border/50 last:border-b-0"), children: [_jsx("div", { className: "flex-shrink-0 mt-1.5", children: _jsx("div", { className: cn("w-2 h-2 rounded-full", TYPE_INDICATORS[notification.type] ?? TYPE_INDICATORS.info) }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-start justify-between gap-element-sm", children: [_jsxs("p", { className: "text-sm leading-snug font-medium text-foreground", children: [notification.wasCelebration && _jsx("span", { className: "me-1", children: "\uD83C\uDF89" }), notification.message] }), onRemove && (_jsx("button", { type: "button", className: "flex-shrink-0 text-muted-foreground/50 hover:text-muted-foreground text-xs", onClick: () => onRemove(notification.id), "aria-label": labelDismiss, children: "\u00D7" }))] }), _jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: getRelativeTime(notification.timestamp, timeLabels) }), notification.nextStep && (_jsxs(Button, { variant: ButtonVariants_Variant.LINK, size: ButtonSize.SM, className: "h-auto p-0 text-xs mt-1", onClick: () => notification.nextStep.onClick(), children: [notification.nextStep.label, " \u2192"] }))] })] }) }, notification.id))) })) })] }) }));
 });
 NotificationCenter.displayName = "NotificationCenter";
 //# sourceMappingURL=notification-center.js.map

package/dist/esm/components/feedback/notification-center.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification-center.js","sourceRoot":"","sources":["../../../../src/components/feedback/notification-center.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\"\nimport {\n  NotificationCenterNotification,\n  NotificationCenterProps,\n  cn,\n  Button,\n  ButtonVariants_Variant,\n  ScrollArea,\n  Surface,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport { ButtonSize, SurfaceVariant } from \"@wildo-ai/presets-components-models\"\n\n// ─────────────────────────────────────────────────────────────\n// Helpers\n// ─────────────────────────────────────────────────────────────\n\nfunction getRelativeTime(\n  timestamp: number,\n  labels: Pick<NotificationCenterProps, 'labelTimeJustNow' | 'formatTimeMinutesAgo' | 'formatTimeHoursAgo' | 'formatTimeDaysAgo'>\n): string {\n  const diff = Date.now() - timestamp;\n  const minutes = Math.floor(diff / 60000);\n  const hours = Math.floor(diff / 3600000);\n  const days = Math.floor(diff / 86400000);\n\n  if (minutes < 1) return labels.labelTimeJustNow ?? 'Just now';\n  if (minutes < 60) return labels.formatTimeMinutesAgo?.(minutes) ?? `${minutes}m ago`;\n  if (hours < 24) return labels.formatTimeHoursAgo?.(hours) ?? `${hours}h ago`;\n  return labels.formatTimeDaysAgo?.(days) ?? `${days}d ago`;\n}\n\nconst TYPE_INDICATORS: Record<string, string> = {\n  success: 'bg-success',\n  error: 'bg-destructive',\n  warning: 'bg-warning',\n  info: 'bg-info',\n};\n\n// ─────────────────────────────────────────────────────────────\n// Component\n// ─────────────────────────────────────────────────────────────\n\n/**\n * NotificationCenter — generic, resource-agnostic SESSION-FEED component.\n *\n * A pure UI component that displays what has arrived since the page loaded, with relative timestamps\n * and per-item actions. Read/unread state was removed on 2026-09-08 (#412): the store behind it has\n * no persistence, so \"read\" was a property that died with the page and marking something read meant\n * nothing. Does NOT know about resources, i18n, or\n * any engine concepts — all labels are passed as props.\n *\n * For engine integration, see the notification-center wrapper in saas-frontend-lib\n * which wires NotificationContext and resolves i18n labels.\n */\nexport const NotificationCenter = React.forwardRef<HTMLDivElement, NotificationCenterProps>(\n  (\n    {\n      notifications,\n      sessionCount,\n      onRemove,\n      onClearAll,\n      labelTitle = 'Notifications',\n      labelNoNotifications = 'Nothing since this page loaded',\n      labelClearAll = 'Clear all',\n      labelDismiss = 'Dismiss',\n      labelTimeJustNow,\n      formatTimeMinutesAgo,\n      formatTimeHoursAgo,\n      formatTimeDaysAgo,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const timeLabels = { labelTimeJustNow, formatTimeMinutesAgo, formatTimeHoursAgo, formatTimeDaysAgo };\n\n    return (\n      <Surface asChild emitPolicyVars={false} variant={SurfaceVariant.RAISED}>\n        <div\n          ref={ref}\n          className={cn(\n            \"flex flex-col w-full max-w-sm border border-border rounded-lg bg-popover shadow-[var(--shadow-lg)]\",\n            className,\n          )}\n          {...props}\n        >\n          {/* Header */}\n          <div className=\"flex items-center justify-between px-card py-element border-b border-border\">\n            <div className=\"flex items-center gap-element\">\n              <h3 className=\"text-sm font-semibold text-foreground\">{labelTitle}</h3>\n              {/* Counts what arrived this session — there is no unread state to count. */}\n              {sessionCount > 0 && (\n                <span className=\"inline-flex items-center justify-center h-5 min-w-[20px] px-1.5 text-xs font-medium bg-primary text-primary-foreground rounded-full\">\n                  {sessionCount}\n                </span>\n              )}\n            </div>\n            <div className=\"flex items-center gap-element-sm\">\n              {notifications.length > 0 && onClearAll && (\n                <Button variant={ButtonVariants_Variant.GHOST} size={ButtonSize.XS} className=\"text-muted-foreground\" onClick={onClearAll}>\n                  {labelClearAll}\n                </Button>\n              )}\n            </div>\n          </div>\n\n          {/* Notification List */}\n          <ScrollArea className=\"max-h-[24rem]\">\n            {notifications.length === 0 ? (\n              <div className=\"flex items-center justify-center py-section text-sm text-muted-foreground\">\n                {labelNoNotifications}\n              </div>\n            ) : (\n              <div className=\"flex flex-col\">\n                {notifications.map((notification) => (\n                  <Surface key={notification.id} asChild emitPolicyVars={false} variant={SurfaceVariant.INSET}>\n                    {/*\n                      * Not clickable, and not styled as if it were. The row's only click action was\n                      * marking it read; with that gone, `cursor-pointer` and a hover highlight would\n                      * advertise an interaction that does nothing. Dismiss and the next-step link are\n                      * the row's real actions.\n                      */}\n                    <div\n                      className={cn(\n                        \"flex items-start gap-element px-card py-element-lg border-b border-border/50 last:border-b-0\",\n                      )}\n                    >\n                      {/* Type indicator dot */}\n                      <div className=\"flex-shrink-0 mt-1.5\">\n                        <div className={cn(\n                          \"w-2 h-2 rounded-full\",\n                          TYPE_INDICATORS[notification.type] ?? TYPE_INDICATORS.info,\n                        )} />\n                      </div>\n\n                      {/* Content */}\n                      <div className=\"flex-1 min-w-0\">\n                        <div className=\"flex items-start justify-between gap-element-sm\">\n                          <p className=\"text-sm leading-snug font-medium text-foreground\">\n                            {notification.wasCelebration && <span className=\"me-1\">🎉</span>}\n                            {notification.message}\n                          </p>\n                          {onRemove && (\n                            <button\n                              type=\"button\"\n                              className=\"flex-shrink-0 text-muted-foreground/50 hover:text-muted-foreground text-xs\"\n                              onClick={() => onRemove(notification.id)}\n                              aria-label={labelDismiss}\n                            >\n                              ×\n                            </button>\n                          )}\n                        </div>\n                        <p className=\"text-xs text-muted-foreground/70 mt-0.5\">\n                          {getRelativeTime(notification.timestamp, timeLabels)}\n                        </p>\n                        {notification.nextStep && (\n                          <Button\n                            variant={ButtonVariants_Variant.LINK}\n                            size={ButtonSize.SM}\n                            className=\"h-auto p-0 text-xs mt-1\"\n                            onClick={() => notification.nextStep!.onClick()}\n                          >\n                            {notification.nextStep.label} →\n                          </Button>\n                        )}\n                      </div>\n                    </div>\n                  </Surface>\n                ))}\n              </div>\n            )}\n          </ScrollArea>\n        </div>\n      </Surface>\n    );\n  },\n);\n\nNotificationCenter.displayName = \"NotificationCenter\";\n"]}
+{"version":3,"file":"notification-center.js","sourceRoot":"","sources":["../../../../../src/components/feedback/notification-center.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\"\nimport {\n  NotificationCenterNotification,\n  NotificationCenterProps,\n  cn,\n  Button,\n  ButtonVariants_Variant,\n  ScrollArea,\n  Surface,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport { ButtonSize, SurfaceVariant } from \"@wildo-ai/presets-components-models\"\n\n// ─────────────────────────────────────────────────────────────\n// Helpers\n// ─────────────────────────────────────────────────────────────\n\nfunction getRelativeTime(\n  timestamp: number,\n  labels: Pick<NotificationCenterProps, 'labelTimeJustNow' | 'formatTimeMinutesAgo' | 'formatTimeHoursAgo' | 'formatTimeDaysAgo'>\n): string {\n  const diff = Date.now() - timestamp;\n  const minutes = Math.floor(diff / 60000);\n  const hours = Math.floor(diff / 3600000);\n  const days = Math.floor(diff / 86400000);\n\n  if (minutes < 1) return labels.labelTimeJustNow;\n  if (minutes < 60) return labels.formatTimeMinutesAgo(minutes);\n  if (hours < 24) return labels.formatTimeHoursAgo(hours);\n  return labels.formatTimeDaysAgo(days);\n}\n\nconst TYPE_INDICATORS: Record<string, string> = {\n  success: 'bg-success',\n  error: 'bg-destructive',\n  warning: 'bg-warning',\n  info: 'bg-info',\n};\n\n// ─────────────────────────────────────────────────────────────\n// Component\n// ─────────────────────────────────────────────────────────────\n\n/**\n * NotificationCenter — generic, resource-agnostic SESSION-FEED component.\n *\n * A pure UI component that displays what has arrived since the page loaded, with relative timestamps\n * and per-item actions. Read/unread state was removed on 2026-09-08 (#412): the store behind it has\n * no persistence, so \"read\" was a property that died with the page and marking something read meant\n * nothing. Does NOT know about resources, i18n, or\n * any engine concepts — all labels are passed as props.\n *\n * For engine integration, see the notification-center wrapper in saas-frontend-lib\n * which wires NotificationContext and resolves i18n labels.\n */\nexport const NotificationCenter = React.forwardRef<HTMLDivElement, NotificationCenterProps>(\n  (\n    {\n      notifications,\n      sessionCount,\n      onRemove,\n      onClearAll,\n      labelTitle,\n      labelNoNotifications,\n      labelClearAll,\n      labelDismiss,\n      labelTimeJustNow,\n      formatTimeMinutesAgo,\n      formatTimeHoursAgo,\n      formatTimeDaysAgo,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const timeLabels = { labelTimeJustNow, formatTimeMinutesAgo, formatTimeHoursAgo, formatTimeDaysAgo };\n\n    return (\n      <Surface asChild emitPolicyVars={false} variant={SurfaceVariant.RAISED}>\n        <div\n          ref={ref}\n          className={cn(\n            \"flex flex-col w-full max-w-sm border border-border rounded-lg bg-popover shadow-[var(--shadow-lg)]\",\n            className,\n          )}\n          {...props}\n        >\n          {/* Header */}\n          <div className=\"flex items-center justify-between px-card py-element border-b border-border\">\n            <div className=\"flex items-center gap-element\">\n              <h3 className=\"text-sm font-semibold text-foreground\">{labelTitle}</h3>\n              {/* Counts what arrived this session — there is no unread state to count. */}\n              {sessionCount > 0 && (\n                <span className=\"inline-flex items-center justify-center h-5 min-w-[20px] px-1.5 text-xs font-medium bg-primary text-primary-foreground rounded-full\">\n                  {sessionCount}\n                </span>\n              )}\n            </div>\n            <div className=\"flex items-center gap-element-sm\">\n              {notifications.length > 0 && onClearAll && (\n                <Button variant={ButtonVariants_Variant.GHOST} size={ButtonSize.XS} className=\"text-muted-foreground\" onClick={onClearAll}>\n                  {labelClearAll}\n                </Button>\n              )}\n            </div>\n          </div>\n\n          {/* Notification List */}\n          <ScrollArea className=\"max-h-[24rem]\">\n            {notifications.length === 0 ? (\n              <div className=\"flex items-center justify-center py-section text-sm text-muted-foreground\">\n                {labelNoNotifications}\n              </div>\n            ) : (\n              <div className=\"flex flex-col\">\n                {notifications.map((notification) => (\n                  <Surface key={notification.id} asChild emitPolicyVars={false} variant={SurfaceVariant.INSET}>\n                    {/*\n                      * Not clickable, and not styled as if it were. The row's only click action was\n                      * marking it read; with that gone, `cursor-pointer` and a hover highlight would\n                      * advertise an interaction that does nothing. Dismiss and the next-step link are\n                      * the row's real actions.\n                      */}\n                    <div\n                      className={cn(\n                        \"flex items-start gap-element px-card py-element-lg border-b border-border/50 last:border-b-0\",\n                      )}\n                    >\n                      {/* Type indicator dot */}\n                      <div className=\"flex-shrink-0 mt-1.5\">\n                        <div className={cn(\n                          \"w-2 h-2 rounded-full\",\n                          TYPE_INDICATORS[notification.type] ?? TYPE_INDICATORS.info,\n                        )} />\n                      </div>\n\n                      {/* Content */}\n                      <div className=\"flex-1 min-w-0\">\n                        <div className=\"flex items-start justify-between gap-element-sm\">\n                          <p className=\"text-sm leading-snug font-medium text-foreground\">\n                            {notification.wasCelebration && <span className=\"me-1\">🎉</span>}\n                            {notification.message}\n                          </p>\n                          {onRemove && (\n                            <button\n                              type=\"button\"\n                              className=\"flex-shrink-0 text-muted-foreground/50 hover:text-muted-foreground text-xs\"\n                              onClick={() => onRemove(notification.id)}\n                              aria-label={labelDismiss}\n                            >\n                              ×\n                            </button>\n                          )}\n                        </div>\n                        <p className=\"text-xs text-muted-foreground mt-0.5\">\n                          {getRelativeTime(notification.timestamp, timeLabels)}\n                        </p>\n                        {notification.nextStep && (\n                          <Button\n                            variant={ButtonVariants_Variant.LINK}\n                            size={ButtonSize.SM}\n                            className=\"h-auto p-0 text-xs mt-1\"\n                            onClick={() => notification.nextStep!.onClick()}\n                          >\n                            {notification.nextStep.label} →\n                          </Button>\n                        )}\n                      </div>\n                    </div>\n                  </Surface>\n                ))}\n              </div>\n            )}\n          </ScrollArea>\n        </div>\n      </Surface>\n    );\n  },\n);\n\nNotificationCenter.displayName = \"NotificationCenter\";\n"]}

package/dist/esm/components/feedback/operations-confirm-critical.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import type { OperationsConfirmCriticalProps } from '@wildo-ai/saas-frontend-lib';
-declare function OperationsConfirmCritical({ open, onOpenChange, cancelCallback, validationCallback, label, requireTypedConfirmation, confirmationPhrase, className, children, ...props }: OperationsConfirmCriticalProps): React.JSX.Element | null;
+declare function OperationsConfirmCritical({ open, onOpenChange, cancelCallback, validationCallback, label, description: descriptionProp, confirmLabel: confirmLabelProp, requireTypedConfirmation, confirmationPhrase, className, children, ...props }: OperationsConfirmCriticalProps): React.JSX.Element | null;
 export { OperationsConfirmCritical };
 //# sourceMappingURL=operations-confirm-critical.d.ts.map

package/dist/esm/components/feedback/operations-confirm-critical.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"operations-confirm-critical.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/operations-confirm-critical.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,6BAA6B,CAAA;AAejF,iBAAS,yBAAyB,CAAC,EACjC,IAAI,EACJ,YAAY,EACZ,cAAc,EACd,kBAAkB,EAClB,KAAK,EACL,wBAAgC,EAChC,kBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,8BAA8B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAiF3D;AAED,OAAO,EAAE,yBAAyB,EAAE,CAAA"}
+{"version":3,"file":"operations-confirm-critical.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/operations-confirm-critical.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,6BAA6B,CAAA;AAejF,iBAAS,yBAAyB,CAAC,EACjC,IAAI,EACJ,YAAY,EACZ,cAAc,EACd,kBAAkB,EAClB,KAAK,EACL,WAAW,EAAE,eAAe,EAC5B,YAAY,EAAE,gBAAgB,EAC9B,wBAAgC,EAChC,kBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,8BAA8B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAiF3D;AAED,OAAO,EAAE,yBAAyB,EAAE,CAAA"}

package/dist/esm/components/feedback/operations-confirm-critical.js

@@ -2,18 +2,20 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel, resolveComponentLabel, useI18n, } from "@wildo-ai/saas-frontend-lib";
 import { FrontendComponentType } from "@wildo-ai/presets-components-models";
-function OperationsConfirmCritical({ open, onOpenChange, cancelCallback, validationCallback, label, requireTypedConfirmation = false, confirmationPhrase = '', className, children, ...props }) {
+function OperationsConfirmCritical({ open, onOpenChange, cancelCallback, validationCallback, label, description: descriptionProp, confirmLabel: confirmLabelProp, requireTypedConfirmation = false, confirmationPhrase = '', className, children, ...props }) {
     const { tComponent, makeTrComponent, isReady } = useI18n({ component: FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL });
     const tcOps = makeTrComponent(FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL);
     const title = label || tcOps('title');
-    const description = tcOps('description');
+    // `null` means the host has said there is NO consequence line to show (a reversible action), which
+    // is different from not having said anything (the generic line).
+    const description = descriptionProp === null ? undefined : (descriptionProp ?? tcOps('description'));
     const cancelLabel = tcOps('cancel');
-    const confirmLabel = tcOps('confirm');
+    const confirmLabel = confirmLabelProp ?? tcOps('confirm');
     // Typed "double validation" for CRITICAL operations: the confirm button stays
     // disabled until the user types `confirmationPhrase` exactly. The phrase is shown
-    // structurally (so the gate is usable even before the i18n instruction copy is
-    // generated — `resolveComponentLabel` returns '' on a missing key rather than
-    // leaking it, per framework convention).
+    // structurally, so the gate is usable even before the i18n instruction copy is
+    // generated — until then the instruction renders as its KEY, which is what a
+    // missing label must look like (#1414).
     const [typed, setTyped] = React.useState('');
     const trimmedPhrase = confirmationPhrase.trim();
     const typedConfirmationActive = requireTypedConfirmation && trimmedPhrase.length > 0;
@@ -42,7 +44,7 @@ function OperationsConfirmCritical({ open, onOpenChange, cancelCallback, validat
     }, [typedConfirmationSatisfied, validationCallback, onOpenChange]);
     if (!isReady)
         return null;
-    return (_jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, ...props, children: _jsxs(AlertDialogContent, { className: className, children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: title }), description && _jsx(AlertDialogDescription, { children: description })] }), children && _jsx("div", { children: children }), typedConfirmationActive && (_jsxs("div", { className: "flex flex-col gap-item-xs", children: [typeToConfirmInstruction && (_jsx("p", { className: "text-sm text-muted-foreground", children: typeToConfirmInstruction })), _jsx("code", { className: "self-start rounded bg-muted px-element py-0.5 text-sm font-medium", children: trimmedPhrase }), _jsx("input", { type: "text", value: typed, onChange: (event) => setTyped(event.target.value), placeholder: trimmedPhrase, "aria-label": typeToConfirmInstruction || trimmedPhrase, autoComplete: "off", className: "flex h-9 w-full rounded-md border border-input bg-transparent px-element py-1 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring" })] })), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { onClick: handleCancel, children: cancelLabel }), _jsx(AlertDialogAction, { onClick: handleConfirm, disabled: !typedConfirmationSatisfied, children: confirmLabel })] })] }) }));
+    return (_jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, ...props, children: _jsxs(AlertDialogContent, { className: className, children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: title }), description && _jsx(AlertDialogDescription, { children: description })] }), children && _jsx("div", { children: children }), typedConfirmationActive && (_jsxs("div", { className: "flex flex-col gap-item-xs", children: [_jsx("p", { className: "text-sm text-muted-foreground", children: typeToConfirmInstruction }), _jsx("code", { className: "self-start rounded bg-muted px-element py-0.5 text-sm font-medium", children: trimmedPhrase }), _jsx("input", { type: "text", value: typed, onChange: (event) => setTyped(event.target.value), placeholder: trimmedPhrase, "aria-label": typeToConfirmInstruction, autoComplete: "off", className: "flex h-9 w-full rounded-md border border-input bg-transparent px-element py-1 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring" })] })), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { onClick: handleCancel, children: cancelLabel }), _jsx(AlertDialogAction, { onClick: handleConfirm, disabled: !typedConfirmationSatisfied, children: confirmLabel })] })] }) }));
 }
 export { OperationsConfirmCritical };
 //# sourceMappingURL=operations-confirm-critical.js.map

package/dist/esm/components/feedback/operations-confirm-critical.js.map

@@ -1 +1 @@
-{"version":3,"file":"operations-confirm-critical.js","sourceRoot":"","sources":["../../../../../src/components/feedback/operations-confirm-critical.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\"\nimport type { OperationsConfirmCriticalProps } from '@wildo-ai/saas-frontend-lib'\nimport {\n  AlertDialog,\n  AlertDialogContent,\n  AlertDialogHeader,\n  AlertDialogTitle,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogAction,\n  AlertDialogCancel,\n  resolveComponentLabel,\n  useI18n,\n} from \"@wildo-ai/saas-frontend-lib\"\nimport { FrontendComponentType } from \"@wildo-ai/presets-components-models\"\n\nfunction OperationsConfirmCritical({\n  open,\n  onOpenChange,\n  cancelCallback,\n  validationCallback,\n  label,\n  requireTypedConfirmation = false,\n  confirmationPhrase = '',\n  className,\n  children,\n  ...props\n}: OperationsConfirmCriticalProps): React.JSX.Element | null {\n  const { tComponent, makeTrComponent, isReady } = useI18n({ component: FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL })\n  const tcOps = makeTrComponent(FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL)\n\n  const title = label || tcOps('title')\n  const description = tcOps('description')\n  const cancelLabel = tcOps('cancel')\n  const confirmLabel = tcOps('confirm')\n\n  // Typed \"double validation\" for CRITICAL operations: the confirm button stays\n  // disabled until the user types `confirmationPhrase` exactly. The phrase is shown\n  // structurally (so the gate is usable even before the i18n instruction copy is\n  // generated — `resolveComponentLabel` returns '' on a missing key rather than\n  // leaking it, per framework convention).\n  const [typed, setTyped] = React.useState('')\n  const trimmedPhrase = confirmationPhrase.trim()\n  const typedConfirmationActive = requireTypedConfirmation && trimmedPhrase.length > 0\n  const typedConfirmationSatisfied = !typedConfirmationActive || typed.trim() === trimmedPhrase\n\n  // Reset the typed value when the dialog closes so a reused dialog never carries\n  // a stale match into the next critical action.\n  React.useEffect(() => {\n    if (!open) setTyped('')\n  }, [open])\n\n  const typeToConfirmInstruction = resolveComponentLabel({\n    tComponent,\n    componentType: FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL,\n    key: 'typeToConfirmInstruction',\n    params: { phrase: trimmedPhrase },\n  })\n\n  const handleCancel = React.useCallback(() => {\n    cancelCallback()\n    onOpenChange?.(false)\n  }, [cancelCallback, onOpenChange])\n\n  const handleConfirm = React.useCallback(() => {\n    if (!typedConfirmationSatisfied) return\n    validationCallback()\n    onOpenChange?.(false)\n  }, [typedConfirmationSatisfied, validationCallback, onOpenChange])\n\n  if (!isReady) return null\n\n  return (\n    <AlertDialog open={open} onOpenChange={onOpenChange} {...props}>\n      <AlertDialogContent className={className}>\n        <AlertDialogHeader>\n          <AlertDialogTitle>{title}</AlertDialogTitle>\n          {description && <AlertDialogDescription>{description}</AlertDialogDescription>}\n        </AlertDialogHeader>\n        {children && <div>{children}</div>}\n        {typedConfirmationActive && (\n          <div className=\"flex flex-col gap-item-xs\">\n            {typeToConfirmInstruction && (\n              <p className=\"text-sm text-muted-foreground\">{typeToConfirmInstruction}</p>\n            )}\n            <code className=\"self-start rounded bg-muted px-element py-0.5 text-sm font-medium\">{trimmedPhrase}</code>\n            <input\n              type=\"text\"\n              value={typed}\n              onChange={(event) => setTyped(event.target.value)}\n              placeholder={trimmedPhrase}\n              aria-label={typeToConfirmInstruction || trimmedPhrase}\n              autoComplete=\"off\"\n              className=\"flex h-9 w-full rounded-md border border-input bg-transparent px-element py-1 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\"\n            />\n          </div>\n        )}\n        <AlertDialogFooter>\n          <AlertDialogCancel onClick={handleCancel}>\n            {cancelLabel}\n          </AlertDialogCancel>\n          <AlertDialogAction onClick={handleConfirm} disabled={!typedConfirmationSatisfied}>\n            {confirmLabel}\n          </AlertDialogAction>\n        </AlertDialogFooter>\n      </AlertDialogContent>\n    </AlertDialog>\n  )\n}\n\nexport { OperationsConfirmCritical }\n"]}
+{"version":3,"file":"operations-confirm-critical.js","sourceRoot":"","sources":["../../../../../src/components/feedback/operations-confirm-critical.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\"\nimport type { OperationsConfirmCriticalProps } from '@wildo-ai/saas-frontend-lib'\nimport {\n  AlertDialog,\n  AlertDialogContent,\n  AlertDialogHeader,\n  AlertDialogTitle,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogAction,\n  AlertDialogCancel,\n  resolveComponentLabel,\n  useI18n,\n} from \"@wildo-ai/saas-frontend-lib\"\nimport { FrontendComponentType } from \"@wildo-ai/presets-components-models\"\n\nfunction OperationsConfirmCritical({\n  open,\n  onOpenChange,\n  cancelCallback,\n  validationCallback,\n  label,\n  description: descriptionProp,\n  confirmLabel: confirmLabelProp,\n  requireTypedConfirmation = false,\n  confirmationPhrase = '',\n  className,\n  children,\n  ...props\n}: OperationsConfirmCriticalProps): React.JSX.Element | null {\n  const { tComponent, makeTrComponent, isReady } = useI18n({ component: FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL })\n  const tcOps = makeTrComponent(FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL)\n\n  const title = label || tcOps('title')\n  // `null` means the host has said there is NO consequence line to show (a reversible action), which\n  // is different from not having said anything (the generic line).\n  const description = descriptionProp === null ? undefined : (descriptionProp ?? tcOps('description'))\n  const cancelLabel = tcOps('cancel')\n  const confirmLabel = confirmLabelProp ?? tcOps('confirm')\n\n  // Typed \"double validation\" for CRITICAL operations: the confirm button stays\n  // disabled until the user types `confirmationPhrase` exactly. The phrase is shown\n  // structurally, so the gate is usable even before the i18n instruction copy is\n  // generated — until then the instruction renders as its KEY, which is what a\n  // missing label must look like (#1414).\n  const [typed, setTyped] = React.useState('')\n  const trimmedPhrase = confirmationPhrase.trim()\n  const typedConfirmationActive = requireTypedConfirmation && trimmedPhrase.length > 0\n  const typedConfirmationSatisfied = !typedConfirmationActive || typed.trim() === trimmedPhrase\n\n  // Reset the typed value when the dialog closes so a reused dialog never carries\n  // a stale match into the next critical action.\n  React.useEffect(() => {\n    if (!open) setTyped('')\n  }, [open])\n\n  const typeToConfirmInstruction = resolveComponentLabel({\n    tComponent,\n    componentType: FrontendComponentType.LOW_LEVEL_OPERATIONS_CONFIRM_CRITICAL,\n    key: 'typeToConfirmInstruction',\n    params: { phrase: trimmedPhrase },\n  })\n\n  const handleCancel = React.useCallback(() => {\n    cancelCallback()\n    onOpenChange?.(false)\n  }, [cancelCallback, onOpenChange])\n\n  const handleConfirm = React.useCallback(() => {\n    if (!typedConfirmationSatisfied) return\n    validationCallback()\n    onOpenChange?.(false)\n  }, [typedConfirmationSatisfied, validationCallback, onOpenChange])\n\n  if (!isReady) return null\n\n  return (\n    <AlertDialog open={open} onOpenChange={onOpenChange} {...props}>\n      <AlertDialogContent className={className}>\n        <AlertDialogHeader>\n          <AlertDialogTitle>{title}</AlertDialogTitle>\n          {description && <AlertDialogDescription>{description}</AlertDialogDescription>}\n        </AlertDialogHeader>\n        {children && <div>{children}</div>}\n        {typedConfirmationActive && (\n          <div className=\"flex flex-col gap-item-xs\">\n            <p className=\"text-sm text-muted-foreground\">{typeToConfirmInstruction}</p>\n            <code className=\"self-start rounded bg-muted px-element py-0.5 text-sm font-medium\">{trimmedPhrase}</code>\n            <input\n              type=\"text\"\n              value={typed}\n              onChange={(event) => setTyped(event.target.value)}\n              placeholder={trimmedPhrase}\n              aria-label={typeToConfirmInstruction}\n              autoComplete=\"off\"\n              className=\"flex h-9 w-full rounded-md border border-input bg-transparent px-element py-1 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\"\n            />\n          </div>\n        )}\n        <AlertDialogFooter>\n          <AlertDialogCancel onClick={handleCancel}>\n            {cancelLabel}\n          </AlertDialogCancel>\n          <AlertDialogAction onClick={handleConfirm} disabled={!typedConfirmationSatisfied}>\n            {confirmLabel}\n          </AlertDialogAction>\n        </AlertDialogFooter>\n      </AlertDialogContent>\n    </AlertDialog>\n  )\n}\n\nexport { OperationsConfirmCritical }\n"]}

package/dist/esm/components/feedback/operations-confirm-critical.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"operations-confirm-critical.labels.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/operations-confirm-critical.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,uCAAuC,EAAE,mBAAmB,EA2BxE,CAAC"}
+{"version":3,"file":"operations-confirm-critical.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/operations-confirm-critical.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,uCAAuC,EAAE,mBAAmB,EA2BxE,CAAC"}

package/dist/esm/components/feedback/progress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/progress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAA;AAK7D,QAAA,MAAM,QAAQ,2JAmCZ,CAAA;AAEF,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/progress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAA;AAK7D,QAAA,MAAM,QAAQ,2JAmCZ,CAAA;AAEF,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/esm/components/feedback/progress.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress.labels.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/progress.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,sBAAsB,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"progress.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/progress.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,sBAAsB,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/feedback/skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAWzF;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAWzF;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/esm/components/feedback/skeleton.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.labels.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/skeleton.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,sBAAsB,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"skeleton.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/skeleton.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,sBAAsB,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/feedback/toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/toast.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC5B,OAAO,EAAqB,YAAY,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAGjE,QAAA,MAAM,OAAO,GAAI,cAAc,YAAY,KAAG,KAAK,CAAC,GAAG,CAAC,OA0BvD,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/toast.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC5B,OAAO,EAAqB,YAAY,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAGjE,QAAA,MAAM,OAAO,GAAI,cAAc,YAAY,KAAG,KAAK,CAAC,GAAG,CAAC,OA0BvD,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/esm/components/feedback/toast.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toast.labels.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/toast.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mBAAmB,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"toast.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/feedback/toast.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mBAAmB,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/form/autosave-indicator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"autosave-indicator.d.ts","sourceRoot":"","sources":["../../../../src/components/form/autosave-indicator.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAiDzE,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,YAAY,EACZ,OAAO,EACP,SAAS,EACT,IAAW,EACX,QAAmB,GACpB,EAAE,sBAAsB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAwEnD;AAID,OAAO,EAAE,iBAAiB,EAAE,CAAA"}
+{"version":3,"file":"autosave-indicator.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/autosave-indicator.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAiDzE,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,YAAY,EACZ,OAAO,EACP,SAAS,EACT,IAAW,EACX,QAAmB,GACpB,EAAE,sBAAsB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAwEnD;AAID,OAAO,EAAE,iBAAiB,EAAE,CAAA"}

package/dist/esm/components/form/autosave-indicator.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"autosave-indicator.labels.d.ts","sourceRoot":"","sources":["../../../../src/components/form/autosave-indicator.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,+BAA+B,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"autosave-indicator.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/autosave-indicator.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,+BAA+B,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/form/chromes/field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/chromes/field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAGL,KAAK,EAGL,KAAK,UAAU,EAChB,MAAM,6BAA6B,CAAC;AAsCrC,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,WAAgD,EAChD,GAAG,KAAK,EACT,EAAE,UAAU,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAUhC;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAW7F;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAaxD;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAW3F;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAmB/F;AAED,iBAAS,cAAc,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAsBpB;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,CAAC,EAAE,KAAK,CAAC;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,SAAS,CAAC,CAAA;CACjD,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA0CpB;AAED,OAAO,EACL,KAAK,EACL,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,cAAc,EACd,YAAY,EACZ,UAAU,GACX,CAAA"}
+{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/chromes/field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAGL,KAAK,EAGL,KAAK,UAAU,EAChB,MAAM,6BAA6B,CAAC;AA8CrC,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,WAAgD,EAChD,GAAG,KAAK,EACT,EAAE,UAAU,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAUhC;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAW7F;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAaxD;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAW3F;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAmB/F;AAED,iBAAS,cAAc,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAsBpB;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,CAAC,EAAE,KAAK,CAAC;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,SAAS,CAAC,CAAA;CACjD,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA0CpB;AAED,OAAO,EACL,KAAK,EACL,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,cAAc,EACd,YAAY,EACZ,UAAU,GACX,CAAA"}

package/dist/esm/components/form/chromes/field.js

@@ -15,12 +15,20 @@ const fieldBase = "group/field flex w-full gap-field-sm data-[invalid=true]:text
  * exclusion keys on the controls' ARIA roles (their semantic identity — no
  * extra marker attribute needed). If a new intrinsic control family is added,
  * extend the exclusion list; do NOT re-blanket `[&>*]:w-full`.
+ *
+ * A VISUALLY HIDDEN child (`.sr-only` — a hidden field label) is excluded too, in the SAME selector.
+ * It used to be stretched here and then "released" by a separate `[&>.sr-only]:w-auto`, which lost on
+ * specificity: three attribute `:not()`s outrank one class, so the hidden label took `width: 100%` of
+ * its containing block — the viewport, as it is absolutely positioned. Measured in the running Wonder
+ * Todos: the top bar's quick switcher's hidden "Todo Lists" label was 1px tall and 1280px WIDE at
+ * x=967, so every page scrolled horizontally to 2246px. Even had it won, `w-auto` is not `sr-only`'s
+ * 1px. Excluding it leaves `sr-only`'s own box untouched.
  */
-const INTRINSIC_CONTROL_EXCLUSION = "[&>*:not([role=switch]):not([role=checkbox]):not([role=radiogroup])]:w-full";
+const INTRINSIC_CONTROL_EXCLUSION = "[&>*:not([role=switch]):not([role=checkbox]):not([role=radiogroup]):not(.sr-only)]:w-full";
 const fieldOrientationClasses = {
-    [FieldVariants_Orientation.VERTICAL]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION} [&>.sr-only]:w-auto`,
+    [FieldVariants_Orientation.VERTICAL]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION}`,
     [FieldVariants_Orientation.HORIZONTAL]: "flex-row items-center [&>[data-slot=field-label]]:flex-auto has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
-    [FieldVariants_Orientation.RESPONSIVE]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION} [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto @md/field-group:[&>[data-slot=field-label]]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,
+    [FieldVariants_Orientation.RESPONSIVE]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION} @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*:not(.sr-only)]:w-auto @md/field-group:[&>[data-slot=field-label]]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,
 };
 function fieldVariants(props) {
     const orientation = props?.orientation ?? FieldVariants_Orientation.VERTICAL;

package/dist/esm/components/form/chromes/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","sourceRoot":"","sources":["../../../../../../src/components/form/chromes/field.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\"\nimport { useMemo } from \"react\"\n\nimport {\n  cn,\n  useUI,\n  Label,\n  Separator,\n  FieldVariants_Orientation,\n  type FieldProps,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport { FrontendComponentType, TypographyVariant, UIBehavior } from \"@wildo-ai/presets-components-models\"\n\ntype FieldVariantsType = (props?: {\n  orientation?: FieldVariants_Orientation | null\n  className?: string\n}) => string\n\n\n/** Field base classes */\nconst fieldBase = \"group/field flex w-full gap-field-sm data-[invalid=true]:text-destructive\"\n\n/**\n * Field orientation variant classes.\n *\n * WIDTH POLICY — the vertical orientations stretch children to the column\n * (`w-full`) so text inputs / selects / textareas fill the field, but\n * INTRINSIC-SIZE controls must keep their own box: a Switch (`role=switch`,\n * `w-8`), Checkbox (`role=checkbox`) or RadioGroup (`role=radiogroup`)\n * stretched to `w-full` renders as a container-wide slider bar. The `:not()`\n * exclusion keys on the controls' ARIA roles (their semantic identity — no\n * extra marker attribute needed). If a new intrinsic control family is added,\n * extend the exclusion list; do NOT re-blanket `[&>*]:w-full`.\n */\nconst INTRINSIC_CONTROL_EXCLUSION = \"[&>*:not([role=switch]):not([role=checkbox]):not([role=radiogroup])]:w-full\"\n\nconst fieldOrientationClasses: Record<FieldVariants_Orientation, string> = {\n  [FieldVariants_Orientation.VERTICAL]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION} [&>.sr-only]:w-auto`,\n  [FieldVariants_Orientation.HORIZONTAL]: \"flex-row items-center [&>[data-slot=field-label]]:flex-auto has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n  [FieldVariants_Orientation.RESPONSIVE]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION} [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto @md/field-group:[&>[data-slot=field-label]]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,\n}\n\nfunction fieldVariants(props?: { orientation?: FieldVariants_Orientation | null; className?: string }): string {\n  const orientation = props?.orientation ?? FieldVariants_Orientation.VERTICAL\n  return cn(fieldBase, fieldOrientationClasses[orientation], props?.className)\n}\n\nfunction Field({\n  className,\n  orientation = FieldVariants_Orientation.VERTICAL,\n  ...props\n}: FieldProps): React.JSX.Element {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"field\"\n      data-orientation={orientation}\n      className={cn(fieldVariants({ orientation }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction FieldContent({ className, ...props }: React.ComponentProps<\"div\">): React.JSX.Element {\n  return (\n    <div\n      data-slot=\"field-content\"\n      className={cn(\n        \"group/field-content flex flex-1 flex-col gap-element-sm leading-snug\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldLabel({\n  className,\n  ...props\n}: React.ComponentProps<typeof Label>): React.JSX.Element {\n  return (\n    <Label\n      data-slot=\"field-label\"\n      className={cn(\n        \"group/field-label peer/field-label flex w-fit gap-element leading-snug group-data-[disabled=true]/field:opacity-[var(--opacity-disabled)]\",\n        \"has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-card\",\n        \"has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldTitle({ className, ...props }: React.ComponentProps<\"div\">): React.JSX.Element {\n  return (\n    <div\n      data-slot=\"field-title\"\n      className={cn(\n        \"flex w-fit items-center gap-element text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-[var(--opacity-disabled)]\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldDescription({ className, ...props }: React.ComponentProps<\"p\">): React.JSX.Element {\n  const { getRecipe } = useUI();\n  const recipe = getRecipe(UIBehavior.TYPOGRAPHY, TypographyVariant.DESCRIPTION);\n\n  return (\n    <p\n      data-slot=\"field-description\"\n      className={cn(\n        // Style from TYPOGRAPHY.DESCRIPTION recipe\n        recipe.base,\n        // Structure\n        \"leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance\",\n        \"last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5\",\n        \"[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  children?: React.ReactNode\n}): React.JSX.Element {\n  return (\n    <div\n      data-slot=\"field-separator\"\n      data-content={!!children}\n      className={cn(\n        \"relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2\",\n        className\n      )}\n      {...props}\n    >\n      <Separator className=\"absolute inset-0 top-1/2\" />\n      {children && (\n        <span\n          className=\"bg-background text-muted-foreground relative mx-auto block w-fit px-card-sm\"\n          data-slot=\"field-separator-content\"\n        >\n          {children}\n        </span>\n      )}\n    </div>\n  )\n}\n\nfunction FieldError({\n  className,\n  children,\n  errors,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  errors?: Array<{ message?: string } | undefined>\n}): React.JSX.Element {\n  const content = useMemo(() => {\n    if (children) {\n      return children\n    }\n\n    if (!errors?.length) {\n      return null\n    }\n\n    const uniqueErrors = [\n      ...new Map(errors.map((error) => [error?.message, error])).values(),\n    ]\n\n    if (uniqueErrors?.length == 1) {\n      return uniqueErrors[0]?.message\n    }\n\n    return (\n      <ul className=\"ms-card flex list-disc flex-col gap-item-xs\">\n        {uniqueErrors.map(\n          (error, index) =>\n            error?.message && <li key={index}>{error.message}</li>\n        )}\n      </ul>\n    )\n  }, [children, errors])\n\n  if (!content) {\n    return null\n  }\n\n  return (\n    <div\n      role=\"alert\"\n      data-slot=\"field-error\"\n      className={cn(\"text-destructive text-sm font-normal\", className)}\n      {...props}\n    >\n      {content}\n    </div>\n  )\n}\n\nexport {\n  Field,\n  FieldLabel,\n  FieldDescription,\n  FieldError,\n  FieldSeparator,\n  FieldContent,\n  FieldTitle,\n}\n"]}
+{"version":3,"file":"field.js","sourceRoot":"","sources":["../../../../../../src/components/form/chromes/field.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\"\nimport { useMemo } from \"react\"\n\nimport {\n  cn,\n  useUI,\n  Label,\n  Separator,\n  FieldVariants_Orientation,\n  type FieldProps,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport { FrontendComponentType, TypographyVariant, UIBehavior } from \"@wildo-ai/presets-components-models\"\n\ntype FieldVariantsType = (props?: {\n  orientation?: FieldVariants_Orientation | null\n  className?: string\n}) => string\n\n\n/** Field base classes */\nconst fieldBase = \"group/field flex w-full gap-field-sm data-[invalid=true]:text-destructive\"\n\n/**\n * Field orientation variant classes.\n *\n * WIDTH POLICY — the vertical orientations stretch children to the column\n * (`w-full`) so text inputs / selects / textareas fill the field, but\n * INTRINSIC-SIZE controls must keep their own box: a Switch (`role=switch`,\n * `w-8`), Checkbox (`role=checkbox`) or RadioGroup (`role=radiogroup`)\n * stretched to `w-full` renders as a container-wide slider bar. The `:not()`\n * exclusion keys on the controls' ARIA roles (their semantic identity — no\n * extra marker attribute needed). If a new intrinsic control family is added,\n * extend the exclusion list; do NOT re-blanket `[&>*]:w-full`.\n *\n * A VISUALLY HIDDEN child (`.sr-only` — a hidden field label) is excluded too, in the SAME selector.\n * It used to be stretched here and then \"released\" by a separate `[&>.sr-only]:w-auto`, which lost on\n * specificity: three attribute `:not()`s outrank one class, so the hidden label took `width: 100%` of\n * its containing block — the viewport, as it is absolutely positioned. Measured in the running Wonder\n * Todos: the top bar's quick switcher's hidden \"Todo Lists\" label was 1px tall and 1280px WIDE at\n * x=967, so every page scrolled horizontally to 2246px. Even had it won, `w-auto` is not `sr-only`'s\n * 1px. Excluding it leaves `sr-only`'s own box untouched.\n */\nconst INTRINSIC_CONTROL_EXCLUSION = \"[&>*:not([role=switch]):not([role=checkbox]):not([role=radiogroup]):not(.sr-only)]:w-full\"\n\nconst fieldOrientationClasses: Record<FieldVariants_Orientation, string> = {\n  [FieldVariants_Orientation.VERTICAL]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION}`,\n  [FieldVariants_Orientation.HORIZONTAL]: \"flex-row items-center [&>[data-slot=field-label]]:flex-auto has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n  [FieldVariants_Orientation.RESPONSIVE]: `flex-col ${INTRINSIC_CONTROL_EXCLUSION} @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*:not(.sr-only)]:w-auto @md/field-group:[&>[data-slot=field-label]]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,\n}\n\nfunction fieldVariants(props?: { orientation?: FieldVariants_Orientation | null; className?: string }): string {\n  const orientation = props?.orientation ?? FieldVariants_Orientation.VERTICAL\n  return cn(fieldBase, fieldOrientationClasses[orientation], props?.className)\n}\n\nfunction Field({\n  className,\n  orientation = FieldVariants_Orientation.VERTICAL,\n  ...props\n}: FieldProps): React.JSX.Element {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"field\"\n      data-orientation={orientation}\n      className={cn(fieldVariants({ orientation }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction FieldContent({ className, ...props }: React.ComponentProps<\"div\">): React.JSX.Element {\n  return (\n    <div\n      data-slot=\"field-content\"\n      className={cn(\n        \"group/field-content flex flex-1 flex-col gap-element-sm leading-snug\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldLabel({\n  className,\n  ...props\n}: React.ComponentProps<typeof Label>): React.JSX.Element {\n  return (\n    <Label\n      data-slot=\"field-label\"\n      className={cn(\n        \"group/field-label peer/field-label flex w-fit gap-element leading-snug group-data-[disabled=true]/field:opacity-[var(--opacity-disabled)]\",\n        \"has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-card\",\n        \"has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldTitle({ className, ...props }: React.ComponentProps<\"div\">): React.JSX.Element {\n  return (\n    <div\n      data-slot=\"field-title\"\n      className={cn(\n        \"flex w-fit items-center gap-element text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-[var(--opacity-disabled)]\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldDescription({ className, ...props }: React.ComponentProps<\"p\">): React.JSX.Element {\n  const { getRecipe } = useUI();\n  const recipe = getRecipe(UIBehavior.TYPOGRAPHY, TypographyVariant.DESCRIPTION);\n\n  return (\n    <p\n      data-slot=\"field-description\"\n      className={cn(\n        // Style from TYPOGRAPHY.DESCRIPTION recipe\n        recipe.base,\n        // Structure\n        \"leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance\",\n        \"last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5\",\n        \"[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  children?: React.ReactNode\n}): React.JSX.Element {\n  return (\n    <div\n      data-slot=\"field-separator\"\n      data-content={!!children}\n      className={cn(\n        \"relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2\",\n        className\n      )}\n      {...props}\n    >\n      <Separator className=\"absolute inset-0 top-1/2\" />\n      {children && (\n        <span\n          className=\"bg-background text-muted-foreground relative mx-auto block w-fit px-card-sm\"\n          data-slot=\"field-separator-content\"\n        >\n          {children}\n        </span>\n      )}\n    </div>\n  )\n}\n\nfunction FieldError({\n  className,\n  children,\n  errors,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  errors?: Array<{ message?: string } | undefined>\n}): React.JSX.Element {\n  const content = useMemo(() => {\n    if (children) {\n      return children\n    }\n\n    if (!errors?.length) {\n      return null\n    }\n\n    const uniqueErrors = [\n      ...new Map(errors.map((error) => [error?.message, error])).values(),\n    ]\n\n    if (uniqueErrors?.length == 1) {\n      return uniqueErrors[0]?.message\n    }\n\n    return (\n      <ul className=\"ms-card flex list-disc flex-col gap-item-xs\">\n        {uniqueErrors.map(\n          (error, index) =>\n            error?.message && <li key={index}>{error.message}</li>\n        )}\n      </ul>\n    )\n  }, [children, errors])\n\n  if (!content) {\n    return null\n  }\n\n  return (\n    <div\n      role=\"alert\"\n      data-slot=\"field-error\"\n      className={cn(\"text-destructive text-sm font-normal\", className)}\n      {...props}\n    >\n      {content}\n    </div>\n  )\n}\n\nexport {\n  Field,\n  FieldLabel,\n  FieldDescription,\n  FieldError,\n  FieldSeparator,\n  FieldContent,\n  FieldTitle,\n}\n"]}

package/dist/esm/components/form/chromes/field.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/chromes/field.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mBAAmB,EAAE,mBAAmB,EAAO,CAAC;AAG7D,eAAO,MAAM,0BAA0B,EAAE,mBAAmB,EAAO,CAAC;AAGpE,eAAO,MAAM,8BAA8B,EAAE,mBAAmB,EAAO,CAAC;AAGxE,eAAO,MAAM,wBAAwB,EAAE,mBAAmB,EAAO,CAAC;AAGlE,eAAO,MAAM,wBAAwB,EAAE,mBAAmB,EAAO,CAAC;AAGlE,eAAO,MAAM,4BAA4B,EAAE,mBAAmB,EAAO,CAAC;AAGtE,eAAO,MAAM,wBAAwB,EAAE,mBAAmB,EAAO,CAAC"}
+{"version":3,"file":"field.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/chromes/field.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM/H,eAAO,MAAM,mBAAmB,EAAE,mBAAmB,EAAO,CAAC;AAG7D,eAAO,MAAM,0BAA0B,EAAE,mBAAmB,EAAO,CAAC;AAGpE,eAAO,MAAM,8BAA8B,EAAE,mBAAmB,EAAO,CAAC;AAGxE,eAAO,MAAM,wBAAwB,EAAE,mBAAmB,EAAO,CAAC;AAGlE,eAAO,MAAM,wBAAwB,EAAE,mBAAmB,EAAO,CAAC;AAGlE,eAAO,MAAM,4BAA4B,EAAE,mBAAmB,EAAO,CAAC;AAGtE,eAAO,MAAM,wBAAwB,EAAE,mBAAmB,EAAO,CAAC"}

package/dist/esm/components/form/chromes/form-primitive.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form-primitive.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/chromes/form-primitive.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAEL,YAAY,EACZ,KAAK,eAAe,EACpB,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,iBAAiB,CAAA;AAExB,OAAO,EAAyC,YAAY,EAA4B,MAAM,6BAA6B,CAAA;AAG3H,QAAA,MAAM,QAAQ,EAAE,OAAO,YAA2B,CAAA;AAElD,QAAA,MAAM,kBAAkB,GACtB,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,cAEC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,KAAG,KAAK,CAAC,GAAG,CAAC,OAMnD,CAAA;AAED,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAYzF;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAYtE;AAED,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAgBvF;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAY9F;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAmBjG;AAED,OAAO,EACL,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,kBAAkB,GACnB,CAAA"}
+{"version":3,"file":"form-primitive.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/chromes/form-primitive.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAEL,YAAY,EACZ,KAAK,eAAe,EACpB,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,iBAAiB,CAAA;AAExB,OAAO,EAAyC,YAAY,EAA4B,MAAM,6BAA6B,CAAA;AAG3H,QAAA,MAAM,QAAQ,EAAE,OAAO,YAA2B,CAAA;AAElD,QAAA,MAAM,kBAAkB,GACtB,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,cAEC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,KAAG,KAAK,CAAC,GAAG,CAAC,OAMnD,CAAA;AAED,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAYzF;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAYtE;AAED,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAgBvF;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAY9F;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAmBjG;AAED,OAAO,EACL,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,kBAAkB,GACnB,CAAA"}

package/dist/esm/components/form/chromes/form-primitive.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form-primitive.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/chromes/form-primitive.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,kBAAkB,EAAE,mBAAmB,EAAO,CAAC;AAG5D,eAAO,MAAM,yBAAyB,EAAE,mBAAmB,EAAO,CAAC;AAGnE,eAAO,MAAM,6BAA6B,EAAE,mBAAmB,EAAO,CAAC;AAGvE,eAAO,MAAM,uBAAuB,EAAE,mBAAmB,EA0DxD,CAAC;AAGF,eAAO,MAAM,sBAAsB,EAAE,mBAAmB,EAAO,CAAC;AAGhE,eAAO,MAAM,uBAAuB,EAAE,mBAAmB,EAAO,CAAC;AAGjE,eAAO,MAAM,yBAAyB,EAAE,mBAAmB,EAgI1D,CAAC"}
+{"version":3,"file":"form-primitive.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/chromes/form-primitive.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,mBAAmB,EAA2B,MAAM,qCAAqC,CAAC;AAM1I,eAAO,MAAM,kBAAkB,EAAE,mBAAmB,EAAO,CAAC;AAG5D,eAAO,MAAM,yBAAyB,EAAE,mBAAmB,EAAO,CAAC;AAGnE,eAAO,MAAM,6BAA6B,EAAE,mBAAmB,EAAO,CAAC;AAGvE,eAAO,MAAM,uBAAuB,EAAE,mBAAmB,EAsFxD,CAAC;AAGF,eAAO,MAAM,sBAAsB,EAAE,mBAAmB,EAAO,CAAC;AAGhE,eAAO,MAAM,uBAAuB,EAAE,mBAAmB,EAAO,CAAC;AAGjE,eAAO,MAAM,yBAAyB,EAAE,mBAAmB,EAgI1D,CAAC"}

package/dist/esm/components/form/chromes/form-primitive.labels.js

@@ -14,6 +14,7 @@ export const LowLevelFormFieldLabels = [
     { ref: 'saved', kind: LabelKind.LABEL, purpose: 'Confirmation shown once a field value has persisted successfully' },
     { ref: 'retry', kind: LabelKind.BUTTON, purpose: 'Button that re-attempts a failed field save' },
     { ref: 'save_failed', kind: LabelKind.MESSAGE, purpose: 'Error shown when persisting a field value fails' },
+    { ref: 'field_reset_after_conflict', kind: LabelKind.MESSAGE, purpose: 'Shown on an inline-edited field after someone else saved it first: the edit was discarded and the field now shows the latest saved value' },
     {
         ref: 'save_conflict',
         kind: LabelKind.MESSAGE,
@@ -21,6 +22,11 @@ export const LowLevelFormFieldLabels = [
     },
     // Shared display labels (read-only value rendering)
     { ref: 'noValue', kind: LabelKind.EMPTY_STATE, purpose: 'Placeholder shown in place of a field that has no value' },
+    // The other two halves of `DisplayEmptyReason`. One em dash used to say all three things at once:
+    // a field awaiting the operator's input, a list with no members, and a computed value nothing has
+    // produced yet. `noValue` above keeps the NOT_SET case and its existing words.
+    { ref: 'noValueNone', kind: LabelKind.EMPTY_STATE, purpose: 'Shown in place of a COLLECTION (list, object or record) that exists but has no members yet — frequently the correct state rather than a gap, so the words should read as a calm statement ("None yet"), not as something missing' },
+    { ref: 'noValueNotProvided', kind: LabelKind.EMPTY_STATE, purpose: 'Shown in place of a COMPUTED or system-owned field that has no value — the reader cannot set it, so the words must NOT invite input; they say nothing has produced one yet ("Not available")' },
     { ref: 'clear', kind: LabelKind.ARIA, purpose: 'Accessible name of the affordance inside a clearable picker that removes the current selection, returning the control to its empty state' },
     { ref: 'displayError', kind: LabelKind.MESSAGE, purpose: 'Fallback text when a field value cannot be rendered' },
     { ref: 'object', kind: LabelKind.ARIA, purpose: 'Accessible name for a rendered object/record value region' },
@@ -66,6 +72,28 @@ export const LowLevelFormFieldLabels = [
     { ref: 'selectAll', kind: LabelKind.BUTTON, purpose: 'Selects every available option in a multi-select' },
     // Chrome labels
     { ref: 'moreInformation', kind: LabelKind.ARIA, purpose: "Accessible label for a field's help/info trigger" },
+    // Display-side labels. These four were READ by components and declared NOWHERE until 2026-09-18,
+    // which is the drift direction this file's own header warns about: "a key the component reads and
+    // this array omits renders as its RAW KEY PATH in the browser — visible only to somebody looking
+    // at the panel". `unsupportedDisplayType` is how it was caught — it rendered verbatim on five
+    // settings panes, and reading WHY led to a whole missing display branch (`FieldSchemaType.RECORD`).
+    {
+        ref: 'fileCount',
+        kind: LabelKind.LABEL,
+        purpose: 'Summary of how many files a file field holds, shown instead of listing them',
+        params: [{ key: 'count', meaning: 'number of files attached to the field' }],
+    },
+    { ref: 'noFile', kind: LabelKind.EMPTY_STATE, purpose: 'Shown in place of a file field that holds no file' },
+    {
+        ref: 'save_unavailable',
+        kind: LabelKind.MESSAGE,
+        purpose: 'Shown when an inline relationship edit cannot be saved because the save route is unavailable — distinct from a save that was attempted and failed',
+    },
+    {
+        ref: 'unsupportedDisplayType',
+        kind: LabelKind.MESSAGE,
+        purpose: 'Shown beside the raw schema type when a field\'s type has no display renderer at all; it names a framework gap rather than anything the reader can act on, so it reads as a diagnostic and not as user error',
+    },
 ];
 registerComponentLabels(FrontendComponentType.LOW_LEVEL_FORM_FIELD, LowLevelFormFieldLabels);
 export const LowLevelFormItemLabels = [];