// MARK: Style Demo (disposable demo/debug classes)
//
// These `.dbx-style-demo-template-<key>` classes back the `className` levers in
// `@dereekb/dbx-web/style-demo` (DbxStyleDemoStyleTemplate.className). They are
// DISPOSABLE demo/debug classes: they exist only to drive the styling showcase /
// live token-override preview harness and should be removed once the styling
// migration they support is complete. They are NOT a dbx-web core runtime primitive.
//
// Each template re-points CSS custom properties; values reference `--mat-sys-*`
// tokens (per the component-token convention) except where an intentional demo
// override value (e.g. an exaggerated corner radius) is the whole point of the lever.
//
// Authored like `_shapes.scss` as an opt-in mixin and emitted via an
// `@each` map loop (the `_curated-colors.scss` pattern). Include the mixin once at a
// global/root scope; the `var(--mat-sys-*)` references resolve per-theme at use-site,
// so a single emission works under both light and dark themes.

/// Builds the component-shape token override map for a single corner-radius value.
///
/// Re-points the same Material component shape tokens that `dbx-components-shapes()` pins to the
/// baseline `8px`, plus the dbx component corner tokens that track the system scale
/// (`--dbx-content-pit-rounded-border-radius`, `--dbx-prompt-box-border-radius`,
/// `--dbx-corners-border-radius`, `--dbx-navbar-item-border-radius`).
///
/// EXCEPT the intentional `--mat-sidenav-container-shape` (0) and `--mat-list-active-indicator-shape`
/// (2px global pin) entries — those keep their deliberate non-default shapes. For the same reason
/// `--dbx-list-item-border-radius` (the `.dbx-list` row radius; medium default) and
/// `--dbx-list-item-card-border-radius` (card-list rows) stay excluded here — they are owned by the list
/// component, re-rounded only by the `pill-controls` (`--dbx-list-item-border-radius` only) and the
/// dedicated `list-corner-*` levers (both list tokens).
///
/// `$value` may be a literal (e.g. `0`) or a token reference (e.g. `var(--mat-sys-corner-medium)`); the
/// emitting mixin interpolates either form via `#{$value}`. Private to this module (`-` prefix).
@function -dbx-style-demo-shape-map($value) {
  @return (
    '--mat-button-filled-container-shape': $value,
    '--mat-button-outlined-container-shape': $value,
    '--mat-button-text-container-shape': $value,
    '--mat-button-protected-container-shape': $value,
    '--mat-button-tonal-container-shape': $value,
    '--mat-fab-container-shape': $value,
    '--mat-fab-small-container-shape': $value,
    '--mat-dialog-container-shape': $value,
    '--mat-card-elevated-container-shape': $value,
    '--mat-card-filled-container-shape': $value,
    '--mat-card-outlined-container-shape': $value,
    '--mat-chip-container-shape-radius': $value,
    '--mat-form-field-filled-container-shape': $value,
    '--mat-form-field-outlined-container-shape': $value,
    '--mat-snack-bar-container-shape': $value,
    '--mat-menu-container-shape': $value,
    '--mat-autocomplete-container-shape': $value,
    '--mat-expansion-container-shape': $value,
    '--mat-datepicker-calendar-container-shape': $value,
    '--mat-bottom-sheet-container-shape': $value,
    '--mat-tooltip-container-shape': $value,
    '--dbx-content-pit-rounded-border-radius': $value // dbx component corner tokens that track the system scale.
    ,
    '--dbx-prompt-box-border-radius': $value,
    '--dbx-corners-border-radius': $value,
    '--dbx-navbar-item-border-radius': $value
  );
}

/// Builds the controls-only shape override map for a single corner-radius value.
///
/// Backs the `pill-controls` lever: re-rounds only the interactive "controls" surfaces (buttons, FABs,
/// `.dbx-list` rows via `--dbx-list-item-border-radius`, and `.dbx-anchor-list` rows via
/// `--dbx-anchor-list-item-border-radius`) without touching content surfaces. The sidenav anchor list keeps
/// its own token. Chips and form-fields are intentionally excluded — pilling them reads as a different design
/// intent than rounding controls. Private to this module (`-` prefix).
@function -dbx-style-demo-controls-shape-map($value) {
  @return (
    '--mat-button-filled-container-shape': $value,
    '--mat-button-outlined-container-shape': $value,
    '--mat-button-text-container-shape': $value,
    '--mat-button-protected-container-shape': $value,
    '--mat-button-tonal-container-shape': $value,
    '--mat-fab-container-shape': $value,
    '--mat-fab-small-container-shape': $value,
    '--mat-list-active-indicator-shape': $value,
    '--dbx-list-item-border-radius': $value // list + nav/anchor-list rows (each list type reads its own token)
    ,
    '--dbx-anchor-list-item-border-radius': $value
  );
}

/// Builds the button-only shape override map for a single corner-radius value.
///
/// Backs the `button-corner-*` levers: re-rounds only the 5 `--mat-button-*-container-shape` tokens,
/// leaving FABs / cards / lists / form-fields / etc. untouched. Composes on top of a
/// `corner-shape-*` / `pill-controls` lever — emitted later in `$dbx-style-demo-templates` so this map
/// wins the `--mat-button-*` tokens it shares with them. Private to this module (`-` prefix).
@function -dbx-style-demo-button-shape-map($value) {
  @return ('--mat-button-filled-container-shape': $value, '--mat-button-outlined-container-shape': $value, '--mat-button-text-container-shape': $value, '--mat-button-protected-container-shape': $value, '--mat-button-tonal-container-shape': $value);
}

/// Builds the dbx-list-only shape override map for a single corner-radius value.
///
/// Backs the `list-corner-*` levers: re-points the default `.dbx-list` row radius
/// (`--dbx-list-item-border-radius`, medium by default) and card-list rows (`--dbx-list-item-card-border-radius`)
/// — the two list tokens that `-dbx-style-demo-shape-map` deliberately excludes — without touching any other
/// surface. Composes on top of `pill-controls` (emitted later → wins `--dbx-list-item-border-radius`).
/// Private to this module (`-` prefix).
@function -dbx-style-demo-list-shape-map($value) {
  @return ('--dbx-list-item-border-radius': $value, '--dbx-list-item-card-border-radius': $value);
}

/// Builds the dbx-anchor-list-only shape override map for a single corner-radius value.
///
/// Backs the `anchor-list-corner-*` levers: re-points the default `.dbx-anchor-list` (nav) row radius
/// (`--dbx-anchor-list-item-border-radius`, medium by default) independently of `.dbx-list` and the sidenav
/// anchor list — which carry their own tokens. Private to this module (`-` prefix).
@function -dbx-style-demo-anchor-list-shape-map($value) {
  @return ('--dbx-anchor-list-item-border-radius': $value);
}

/// Builds the dbx-sidenav-only trailing-edge shape override map for a single corner-radius value.
///
/// Backs the `sidenav-corner-*` levers: re-points the nested `mat-sidenav` drawer's top/bottom trailing-edge
/// radius tokens (`--dbx-sidenav-top-corner-radius` / `--dbx-sidenav-bottom-corner-radius`, extra-large by
/// default) together so the rounded drawer edge flips live. Independent of every other shape lever — the
/// sidenav reads its own tokens. Private to this module (`-` prefix).
@function -dbx-style-demo-sidenav-shape-map($value) {
  @return ('--dbx-sidenav-top-corner-radius': $value, '--dbx-sidenav-bottom-corner-radius': $value);
}

/// Map of demo template key -> CSS custom-property overrides emitted for that template's debug class.
$dbx-style-demo-templates: (
  // M3 corner-radius scale levers. Each re-points the component shape tokens that `dbx-components-shapes()`
  // pins to the baseline 8px, so cards / buttons / form-fields / etc. re-round live as the lever flips.
  // Values reference the `--mat-sys-corner-*` token where one exists; `none` is the literal 0.
  // 'corner-shape-small' is intentionally omitted — the baseline is already 8px (= small), so it would be a no-op.
  // 'corner-shape-full' was removed — pilling every surface broke too many components; use the
  // controls-only 'pill-controls' lever below instead.
  'corner-shape-none': -dbx-style-demo-shape-map(0),
  'corner-shape-extra-small': -dbx-style-demo-shape-map(var(--mat-sys-corner-extra-small)),
  'corner-shape-medium': -dbx-style-demo-shape-map(var(--mat-sys-corner-medium)),
  'corner-shape-large': -dbx-style-demo-shape-map(var(--mat-sys-corner-large)),
  'corner-shape-extra-large': -dbx-style-demo-shape-map(var(--mat-sys-corner-extra-large)),
  // Controls-only pill preset. Emitted AFTER the corner-shape-* entries so that when it is composed
  // with a corner lever (its own toggle group, not 'Shape'), this later emission wins the tokens they
  // share (buttons / FABs / list items) — guard this ordering when reordering the map.
  'pill-controls': -dbx-style-demo-controls-shape-map(var(--mat-sys-corner-full)),
  // Button-only corner levers (own 'Button Shape' toggle group). Emitted AFTER the corner-shape-* /
  // pill-controls levers so this later emission wins the shared --mat-button-* shape tokens when composed
  // (e.g. corner-shape-large + button-corner-none → buttons square, everything else large). Baseline is
  // 8px (= small) so 'small' is omitted as a no-op; 'extra-small' (4px) is the meaningful step down.
  'button-corner-none': -dbx-style-demo-button-shape-map(0),
  'button-corner-extra-small': -dbx-style-demo-button-shape-map(var(--mat-sys-corner-extra-small)),
  'button-corner-medium': -dbx-style-demo-button-shape-map(var(--mat-sys-corner-medium)),
  'button-corner-large': -dbx-style-demo-button-shape-map(var(--mat-sys-corner-large)),
  'button-corner-extra-large': -dbx-style-demo-button-shape-map(var(--mat-sys-corner-extra-large)),
  // dbx-list-only corner levers (own 'List Shape' toggle group). Re-point the list item tokens that
  // -dbx-style-demo-shape-map deliberately excludes; emitted after pill-controls so they win the shared
  // --dbx-list-item-border-radius. The .dbx-list default is medium, so 'small' (8px) is meaningful and
  // 'extra-small' is omitted.
  'list-corner-none': -dbx-style-demo-list-shape-map(0),
  'list-corner-small': -dbx-style-demo-list-shape-map(var(--mat-sys-corner-small)),
  'list-corner-medium': -dbx-style-demo-list-shape-map(var(--mat-sys-corner-medium)),
  'list-corner-large': -dbx-style-demo-list-shape-map(var(--mat-sys-corner-large)),
  'list-corner-extra-large': -dbx-style-demo-list-shape-map(var(--mat-sys-corner-extra-large)),
  // dbx-anchor-list-only corner levers (own 'Anchor List Shape' toggle group), independent of list-corner-*
  // (anchor lists read their own --dbx-anchor-list-item-border-radius token). Same medium-baseline scale.
  'anchor-list-corner-none': -dbx-style-demo-anchor-list-shape-map(0),
  'anchor-list-corner-small': -dbx-style-demo-anchor-list-shape-map(var(--mat-sys-corner-small)),
  'anchor-list-corner-medium': -dbx-style-demo-anchor-list-shape-map(var(--mat-sys-corner-medium)),
  'anchor-list-corner-large': -dbx-style-demo-anchor-list-shape-map(var(--mat-sys-corner-large)),
  'anchor-list-corner-extra-large': -dbx-style-demo-anchor-list-shape-map(var(--mat-sys-corner-extra-large)),
  // dbx-sidenav-only trailing-edge corner levers (own 'Sidenav Shape' toggle group), independent of every other
  // shape lever (the sidenav drawer reads its own --dbx-sidenav-top/bottom-corner-radius tokens). Only the three
  // requested stops are exposed: none (square), medium, and extra (extra-large, the drawer's default).
  'sidenav-corner-none': -dbx-style-demo-sidenav-shape-map(0),
  'sidenav-corner-medium': -dbx-style-demo-sidenav-shape-map(var(--mat-sys-corner-medium)),
  'sidenav-corner-extra': -dbx-style-demo-sidenav-shape-map(var(--mat-sys-corner-extra-large)),
  // Tints surfaces toward the primary color by mixing the theme's own system tokens — stays theme-correct.
  'surface-tint': (
    '--mat-sys-surface': color-mix(in srgb, var(--mat-sys-primary) 8%, var(--mat-sys-surface)),
    '--mat-sys-surface-container': color-mix(in srgb, var(--mat-sys-primary) 12%, var(--mat-sys-surface-container)),
    '--mat-sys-surface-container-high': color-mix(in srgb, var(--mat-sys-primary) 16%, var(--mat-sys-surface-container-high))
  )
);

/// Opt-in mixin that emits the disposable `.dbx-style-demo-template-<key>` debug classes.
///
/// Usage (include once at a global/root scope):
/// ```scss
/// @use '@dereekb/dbx-web' as dbx;
/// @include dbx.dbx-style-demo-debug-classes();
/// ```
@mixin dbx-style-demo-debug-classes() {
  @each $key, $tokens in $dbx-style-demo-templates {
    .dbx-style-demo-template-#{$key} {
      @each $token, $value in $tokens {
        #{$token}: #{$value};
      }
    }
  }
}
