@dereekb/dbx-web 13.11.15 → 13.11.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dereekb/dbx-web",
-  "version": "13.11.15",
+  "version": "13.11.16",
   "sideEffects": [
     "*.scss",
     "*.css"
@@ -13,12 +13,12 @@
     "@angular/material": "^21.2.9",
     "@angular/platform-browser": "21.2.11",
     "@cantoo/pdf-lib": "^2.6.5",
-    "@dereekb/browser": "13.11.15",
-    "@dereekb/date": "13.11.15",
-    "@dereekb/dbx-core": "13.11.15",
-    "@dereekb/rxjs": "13.11.15",
-    "@dereekb/util": "13.11.15",
-    "@dereekb/vitest": "13.11.15",
+    "@dereekb/browser": "13.11.16",
+    "@dereekb/date": "13.11.16",
+    "@dereekb/dbx-core": "13.11.16",
+    "@dereekb/rxjs": "13.11.16",
+    "@dereekb/util": "13.11.16",
+    "@dereekb/vitest": "13.11.16",
     "@ngbracket/ngx-layout": "^21.0.0",
     "@ngrx/component-store": "^21.1.0",
     "@ngrx/effects": "^21.1.0",

package/types/dereekb-dbx-web.d.ts

@@ -4244,6 +4244,14 @@ declare class DbxSectionLayoutModule {
  * The standalone `[dbxColorTone]` input wins over `config.tone` when both are set; the same precedence
  * applies to tonal mode.
  *
+ * @dbxWebComponent
+ * @dbxWebSlug color
+ * @dbxWebCategory layout
+ * @dbxWebRelated text-color, color-service
+ * @dbxWebMinimalExample ```html
+ * <div [dbxColor]="'primary'"></div>
+ * ```
+ *
  * @example
  * ```html
  * <div [dbxColor]="'primary'">Themed background</div>
@@ -4323,6 +4331,14 @@ declare class DbxSpacerDirective {
  *
  * Use this directive to propagate the active style class onto any element or component.
  *
+ * @dbxWebComponent
+ * @dbxWebSlug style
+ * @dbxWebCategory layout
+ * @dbxWebRelated style-service, style-body, set-style
+ * @dbxWebMinimalExample ```html
+ * <div dbxStyle></div>
+ * ```
+ *
  * @example
  * ```html
  * <div dbxStyle>Styled content</div>
@@ -4350,6 +4366,14 @@ type DbxSetStyleMode = 'both' | 'global' | 'self';
  * Accepts a {@link DbxStyleName} and optional suffixes, then applies the computed style class
  * depending on the configured {@link DbxSetStyleMode}.
  *
+ * @dbxWebComponent
+ * @dbxWebSlug set-style
+ * @dbxWebCategory layout
+ * @dbxWebRelated style, style-service, style-body
+ * @dbxWebMinimalExample ```html
+ * <div [dbxSetStyle]="'my-app'"></div>
+ * ```
+ *
  * @example
  * ```html
  * <div [dbxSetStyle]="'my-app'" [setStyleMode]="'both'" [suffixes]="'dark'">
@@ -4394,6 +4418,14 @@ declare class DbxSetStyleDirective implements OnDestroy {
  *
  * Place this directive on a root-level element so that the body tag receives the active style class.
  *
+ * @dbxWebComponent
+ * @dbxWebSlug style-body
+ * @dbxWebCategory layout
+ * @dbxWebRelated style, style-service, set-style
+ * @dbxWebMinimalExample ```html
+ * <div dbxStyleBody></div>
+ * ```
+ *
  * @example
  * ```html
  * <div dbxStyleBody></div>
@@ -4427,6 +4459,20 @@ declare const DEFAULT_DBX_STYLE_CONFIG_TOKEN: InjectionToken<unknown>;
  *
  * Consumers can set a default style config, override it with an observable config,
  * and toggle style suffixes to switch between style variants at runtime.
+ *
+ * Provided via `provideDbxStyleService()` from `style.providers`.
+ *
+ * @dbxWebComponent
+ * @dbxWebSlug style-service
+ * @dbxWebCategory layout
+ * @dbxWebRelated style, set-style, style-body, color-service
+ *
+ * @example
+ * ```ts
+ * const styleService = inject(DbxStyleService);
+ * styleService.toggleDarkSuffix();           // toggle dark mode on/off
+ * styleService.setStyleClassSuffix('dark');  // force dark mode
+ * ```
  */
 declare class DbxStyleService implements Destroyable {
     private readonly _defaultConfig;
@@ -4503,9 +4549,22 @@ declare abstract class DbxColorServiceConfig {
  * Service that registers named {@link DbxColorConfigTemplate} entries and expands
  * {@link DbxColorConfig} values that reference a template by key.
  *
- * The pattern mirrors {@link DbxHelpWidgetService} and {@link DbxFirebaseModelEntitiesWidgetService}:
- * an internal Map keyed by template key, optional seeding from {@link DbxColorServiceConfig},
- * and a `register` method for adding entries at runtime.
+ * Seeded via `provideDbxStyleService({ dbxColorServiceConfig: { templates: [...] } })`,
+ * then injected by {@link DbxColorDirective} and {@link DbxTextColorDirective} to resolve
+ * template references at render time.
+ *
+ * @dbxWebComponent
+ * @dbxWebSlug color-service
+ * @dbxWebCategory layout
+ * @dbxWebRelated color, text-color, style-service
+ *
+ * @example
+ * ```ts
+ * const colorService = inject(DbxColorService);
+ * colorService.register({ key: 'brand-positive', config: { color: '#1f9b59', contrast: 'white', tone: 18 } });
+ * colorService.expandColorConfig({ template: 'brand-positive' });
+ * // -> { template: 'brand-positive', color: '#1f9b59', contrast: 'white', tone: 18 }
+ * ```
  */
 declare class DbxColorService {
     private readonly _templates;
@@ -4604,6 +4663,14 @@ declare function provideDbxStyleService(config: ProvideDbxStyleServiceConfig): E
  * object carrying an arbitrary CSS color value. Unlike {@link DbxColorDirective} which sets the background,
  * this directive only sets the foreground text color.
  *
+ * @dbxWebComponent
+ * @dbxWebSlug text-color
+ * @dbxWebCategory layout
+ * @dbxWebRelated color, color-service
+ * @dbxWebMinimalExample ```html
+ * <span [dbxTextColor]="'primary'"></span>
+ * ```
+ *
  * @example
  * ```html
  * <mat-icon [dbxTextColor]="'warn'">error</mat-icon>