@rt-tools/ui-kit 0.0.16 → 0.0.20

package/styles/tokens.css

@@ -0,0 +1,301 @@
+@charset "UTF-8";
+/* Material Theme */
+/* Base */
+/* Device Definitions */
+/* Fonts */
+/* Button palette seeds (static — fed to sass color.scale() for hover/active states) */
+/* Components */
+/* ============================== Tier 1: primitives ============================== */
+/* ------------------------------ Accent-role ramps (indirection layer) ------------------------------ */
+/* ============================== Tier 2: semantic ============================== */
+/* ============================== Foundations (mode-independent) ============================== */
+/* ============================== Emission ============================== */
+:root {
+  color-scheme: light;
+  /* --- Tier 1: primitives --- */
+  --rt-color-neutral-0: #fff;
+  --rt-color-neutral-5: #f5f6f8;
+  --rt-color-neutral-10: #f3f3f3;
+  --rt-color-neutral-15: #eee;
+  --rt-color-neutral-20: #e8e8e8;
+  --rt-color-neutral-25: #e0e0e0;
+  --rt-color-neutral-30: #d1d1d1;
+  --rt-color-neutral-35: #ccc;
+  --rt-color-neutral-40: #a3a3a3;
+  --rt-color-neutral-60: #747474;
+  --rt-color-neutral-80: #323033;
+  --rt-color-neutral-100: #181818;
+  --rt-color-red-10: #fdedee;
+  --rt-color-red-20: #efc0c1;
+  --rt-color-red-40: #f7b9bb;
+  --rt-color-red-60: #e88487;
+  --rt-color-red-80: #df6064;
+  --rt-color-red-100: #eb5055;
+  --rt-color-orange-5: #f6e4d9;
+  --rt-color-orange-10: #e8cbbf;
+  --rt-color-orange-20: #e1ba9e;
+  --rt-color-orange-40: #e4a985;
+  --rt-color-orange-60: #f1a05d;
+  --rt-color-orange-70: #f2994a;
+  --rt-color-orange-80: #ee7a34;
+  --rt-color-orange-100: #ef7128;
+  --rt-color-blue-20: #eaedfc;
+  --rt-color-blue-40: #b3ceef;
+  --rt-color-blue-60: #6d96e8;
+  --rt-color-blue-80: #4285f4;
+  --rt-color-blue-100: #4284d7;
+  --rt-color-green-10: #e5f8f4;
+  --rt-color-green-20: #baf4e0;
+  --rt-color-green-40: #5dbfbc;
+  --rt-color-green-60: #46c4c0;
+  --rt-color-green-80: #21b18e;
+  --rt-color-green-100: #01af8d;
+  --rt-color-red: #eb5055;
+  --rt-color-red-a5: color-mix(in srgb, #eb5055 5%, transparent);
+  --rt-color-red-a10: color-mix(in srgb, #eb5055 10%, transparent);
+  --rt-color-red-a20: color-mix(in srgb, #eb5055 20%, transparent);
+  --rt-color-red-a30: color-mix(in srgb, #eb5055 30%, transparent);
+  --rt-color-red-a40: color-mix(in srgb, #eb5055 40%, transparent);
+  --rt-color-red-a50: color-mix(in srgb, #eb5055 50%, transparent);
+  --rt-color-red-a60: color-mix(in srgb, #eb5055 60%, transparent);
+  --rt-color-red-a70: color-mix(in srgb, #eb5055 70%, transparent);
+  --rt-color-red-a80: color-mix(in srgb, #eb5055 80%, transparent);
+  --rt-color-red-a90: color-mix(in srgb, #eb5055 90%, transparent);
+  --rt-color-orange: #ef7128;
+  --rt-color-orange-a5: color-mix(in srgb, #ef7128 5%, transparent);
+  --rt-color-orange-a10: color-mix(in srgb, #ef7128 10%, transparent);
+  --rt-color-orange-a20: color-mix(in srgb, #ef7128 20%, transparent);
+  --rt-color-orange-a30: color-mix(in srgb, #ef7128 30%, transparent);
+  --rt-color-orange-a40: color-mix(in srgb, #ef7128 40%, transparent);
+  --rt-color-orange-a50: color-mix(in srgb, #ef7128 50%, transparent);
+  --rt-color-orange-a60: color-mix(in srgb, #ef7128 60%, transparent);
+  --rt-color-orange-a70: color-mix(in srgb, #ef7128 70%, transparent);
+  --rt-color-orange-a80: color-mix(in srgb, #ef7128 80%, transparent);
+  --rt-color-orange-a90: color-mix(in srgb, #ef7128 90%, transparent);
+  --rt-color-blue: #4284d7;
+  --rt-color-blue-a5: color-mix(in srgb, #4284d7 5%, transparent);
+  --rt-color-blue-a10: color-mix(in srgb, #4284d7 10%, transparent);
+  --rt-color-blue-a20: color-mix(in srgb, #4284d7 20%, transparent);
+  --rt-color-blue-a30: color-mix(in srgb, #4284d7 30%, transparent);
+  --rt-color-blue-a40: color-mix(in srgb, #4284d7 40%, transparent);
+  --rt-color-blue-a50: color-mix(in srgb, #4284d7 50%, transparent);
+  --rt-color-blue-a60: color-mix(in srgb, #4284d7 60%, transparent);
+  --rt-color-blue-a70: color-mix(in srgb, #4284d7 70%, transparent);
+  --rt-color-blue-a80: color-mix(in srgb, #4284d7 80%, transparent);
+  --rt-color-blue-a90: color-mix(in srgb, #4284d7 90%, transparent);
+  --rt-color-green: #01af8d;
+  --rt-color-green-a5: color-mix(in srgb, #01af8d 5%, transparent);
+  --rt-color-green-a10: color-mix(in srgb, #01af8d 10%, transparent);
+  --rt-color-green-a20: color-mix(in srgb, #01af8d 20%, transparent);
+  --rt-color-green-a30: color-mix(in srgb, #01af8d 30%, transparent);
+  --rt-color-green-a40: color-mix(in srgb, #01af8d 40%, transparent);
+  --rt-color-green-a50: color-mix(in srgb, #01af8d 50%, transparent);
+  --rt-color-green-a60: color-mix(in srgb, #01af8d 60%, transparent);
+  --rt-color-green-a70: color-mix(in srgb, #01af8d 70%, transparent);
+  --rt-color-green-a80: color-mix(in srgb, #01af8d 80%, transparent);
+  --rt-color-green-a90: color-mix(in srgb, #01af8d 90%, transparent);
+  --rt-color-brand: #0d1c2b;
+  --rt-color-brand-a5: color-mix(in srgb, #0d1c2b 5%, transparent);
+  --rt-color-brand-a10: color-mix(in srgb, #0d1c2b 10%, transparent);
+  --rt-color-brand-a20: color-mix(in srgb, #0d1c2b 20%, transparent);
+  --rt-color-brand-a30: color-mix(in srgb, #0d1c2b 30%, transparent);
+  --rt-color-brand-a40: color-mix(in srgb, #0d1c2b 40%, transparent);
+  --rt-color-brand-a50: color-mix(in srgb, #0d1c2b 50%, transparent);
+  --rt-color-brand-a60: color-mix(in srgb, #0d1c2b 60%, transparent);
+  --rt-color-brand-a70: color-mix(in srgb, #0d1c2b 70%, transparent);
+  --rt-color-brand-a80: color-mix(in srgb, #0d1c2b 80%, transparent);
+  --rt-color-brand-a90: color-mix(in srgb, #0d1c2b 90%, transparent);
+  --rt-color-dark-a5: rgba(24, 24, 24, 0.05);
+  --rt-color-light-a5: rgba(255, 255, 255, 0.05);
+  --rt-color-dark-a10: rgba(24, 24, 24, 0.1);
+  --rt-color-light-a10: rgba(255, 255, 255, 0.1);
+  --rt-color-dark-a15: rgba(24, 24, 24, 0.15);
+  --rt-color-light-a15: rgba(255, 255, 255, 0.15);
+  --rt-color-dark-a20: rgba(24, 24, 24, 0.2);
+  --rt-color-light-a20: rgba(255, 255, 255, 0.2);
+  --rt-color-dark-a25: rgba(24, 24, 24, 0.25);
+  --rt-color-light-a25: rgba(255, 255, 255, 0.25);
+  --rt-color-dark-a30: rgba(24, 24, 24, 0.3);
+  --rt-color-light-a30: rgba(255, 255, 255, 0.3);
+  --rt-color-dark-a40: rgba(24, 24, 24, 0.4);
+  --rt-color-light-a40: rgba(255, 255, 255, 0.4);
+  --rt-color-dark-a50: rgba(24, 24, 24, 0.5);
+  --rt-color-light-a50: rgba(255, 255, 255, 0.5);
+  --rt-color-dark-a60: rgba(24, 24, 24, 0.6);
+  --rt-color-light-a60: rgba(255, 255, 255, 0.6);
+  --rt-color-dark-a70: rgba(24, 24, 24, 0.7);
+  --rt-color-light-a70: rgba(255, 255, 255, 0.7);
+  --rt-color-dark-a80: rgba(24, 24, 24, 0.8);
+  --rt-color-light-a80: rgba(255, 255, 255, 0.8);
+  --rt-color-dark-a90: rgba(24, 24, 24, 0.9);
+  --rt-color-light-a90: rgba(255, 255, 255, 0.9);
+  --rt-color-primary-20: var(--mat-sys-primary-container, #eaedfc);
+  --rt-color-primary-40: #b3ceef;
+  --rt-color-primary-60: var(--mat-sys-primary, #6d96e8);
+  --rt-color-primary-100: var(--mat-sys-primary, #4284d7);
+  --rt-color-info-20: #eaedfc;
+  --rt-color-info-80: #4285f4;
+  --rt-color-info-100: #4284d7;
+  --rt-color-success-10: #e5f8f4;
+  --rt-color-success-80: #21b18e;
+  --rt-color-success-100: #01af8d;
+  --rt-color-warning-10: #e8cbbf;
+  --rt-color-warning-80: #ee7a34;
+  --rt-color-warning-100: #ef7128;
+  --rt-color-danger-10: var(--mat-sys-error-container, #fdedee);
+  --rt-color-danger-60: #e88487;
+  --rt-color-danger-100: var(--mat-sys-error, #eb5055);
+  --rt-color-brand-20: var(--mat-sys-primary, #e8e8e8);
+  --rt-color-brand-100: var(--mat-sys-primary, #0d1c2b);
+  /* --- Tier 2: semantic --- */
+  --rt-bg-base-base: var(--mat-sys-surface, light-dark(#fff, #1c1b1e));
+  --rt-bg-base-elevated: var(--mat-sys-surface-container, light-dark(#fff, #2a292d));
+  --rt-bg-base-subtle: light-dark(#f5f6f8, #232226);
+  --rt-bg-base-hover: light-dark(#f3f3f3, rgba(255, 255, 255, 0.06));
+  --rt-bg-base-active: light-dark(#eee, rgba(255, 255, 255, 0.1));
+  --rt-bg-base-strong: light-dark(#e0e0e0, #3f3e43);
+  --rt-bg-base-emphasis: light-dark(#747474, #a3a3a3);
+  --rt-bg-base-emphasis-soft: light-dark(#a3a3a3, #747474);
+  --rt-bg-base-inverse: var(--mat-sys-inverse-surface, light-dark(#181818, #f3f3f3));
+  --rt-bg-base-inverse-soft: light-dark(#323033, #eee);
+  --rt-bg-base-overlay: light-dark(rgba(0, 0, 0, 0.32), rgba(0, 0, 0, 0.6));
+  --rt-bg-static-light: #fff;
+  --rt-bg-static-dark: #181818;
+  --rt-bg-static-none: transparent;
+  --rt-bg-accent-primary-subtle: light-dark(var(--rt-color-primary-20), color-mix(in srgb, var(--rt-color-primary-100) 18%, #1c1b1e));
+  --rt-bg-accent-primary-solid: var(--rt-color-primary-100);
+  --rt-bg-accent-primary-hover: light-dark(color-mix(in srgb, var(--rt-color-primary-100) 90%, #000), color-mix(in srgb, var(--rt-color-primary-100) 90%, #fff));
+  --rt-bg-accent-primary-disabled: color-mix(in srgb, var(--rt-color-primary-100) 38%, transparent);
+  --rt-bg-accent-success-subtle: light-dark(var(--rt-color-success-10), color-mix(in srgb, var(--rt-color-success-100) 18%, #1c1b1e));
+  --rt-bg-accent-success-solid: var(--rt-color-success-80);
+  --rt-bg-accent-success-hover: light-dark(color-mix(in srgb, var(--rt-color-success-80) 90%, #000), color-mix(in srgb, var(--rt-color-success-80) 90%, #fff));
+  --rt-bg-accent-success-disabled: color-mix(in srgb, var(--rt-color-success-80) 38%, transparent);
+  --rt-bg-accent-warning-subtle: light-dark(var(--rt-color-warning-10), color-mix(in srgb, var(--rt-color-warning-100) 18%, #1c1b1e));
+  --rt-bg-accent-warning-solid: var(--rt-color-warning-80);
+  --rt-bg-accent-warning-hover: light-dark(color-mix(in srgb, var(--rt-color-warning-80) 90%, #000), color-mix(in srgb, var(--rt-color-warning-80) 90%, #fff));
+  --rt-bg-accent-warning-disabled: color-mix(in srgb, var(--rt-color-warning-80) 38%, transparent);
+  --rt-bg-accent-danger-subtle: light-dark(var(--rt-color-danger-10), color-mix(in srgb, var(--rt-color-danger-100) 18%, #1c1b1e));
+  --rt-bg-accent-danger-solid: var(--rt-color-danger-100);
+  --rt-bg-accent-danger-hover: light-dark(color-mix(in srgb, var(--rt-color-danger-100) 90%, #000), color-mix(in srgb, var(--rt-color-danger-100) 90%, #fff));
+  --rt-bg-accent-danger-disabled: color-mix(in srgb, var(--rt-color-danger-100) 38%, transparent);
+  --rt-bg-accent-info-subtle: light-dark(var(--rt-color-info-20), color-mix(in srgb, var(--rt-color-info-100) 18%, #1c1b1e));
+  --rt-bg-accent-info-solid: var(--rt-color-info-100);
+  --rt-bg-accent-info-hover: light-dark(color-mix(in srgb, var(--rt-color-info-100) 90%, #000), color-mix(in srgb, var(--rt-color-info-100) 90%, #fff));
+  --rt-bg-accent-info-disabled: color-mix(in srgb, var(--rt-color-info-100) 38%, transparent);
+  --rt-bg-accent-neutral-subtle: light-dark(#f3f3f3, rgba(255, 255, 255, 0.06));
+  --rt-bg-accent-neutral-solid: light-dark(#747474, #a3a3a3);
+  --rt-bg-accent-neutral-hover: light-dark(#a3a3a3, #747474);
+  --rt-bg-accent-neutral-disabled: light-dark(rgba(116, 116, 116, 0.38), rgba(163, 163, 163, 0.38));
+  --rt-text-base-primary: var(--mat-sys-on-surface, light-dark(rgba(0, 0, 0, 0.87), rgba(255, 255, 255, 0.87)));
+  --rt-text-base-strong: light-dark(#181818, #f3f3f3);
+  --rt-text-base-soft: light-dark(#323033, #e0e0e0);
+  --rt-text-base-secondary: var(--mat-sys-on-surface-variant, light-dark(#747474, #a3a3a3));
+  --rt-text-base-disabled: light-dark(#a3a3a3, #747474);
+  --rt-text-base-inverse: var(--mat-sys-inverse-on-surface, light-dark(#fff, #181818));
+  --rt-text-static-light: #fff;
+  --rt-text-static-dark: #181818;
+  --rt-text-accent-brand: light-dark(var(--rt-color-brand-100), var(--rt-color-brand-20));
+  --rt-text-accent-primary: light-dark(var(--rt-color-primary-100), var(--rt-color-primary-60));
+  --rt-text-accent-success: var(--rt-color-success-100);
+  --rt-text-accent-success-soft: var(--rt-color-success-80);
+  --rt-text-accent-warning: var(--rt-color-warning-100);
+  --rt-text-accent-warning-soft: var(--rt-color-warning-80);
+  --rt-text-accent-danger: var(--rt-color-danger-100);
+  --rt-text-accent-danger-soft: var(--rt-color-danger-60);
+  --rt-text-accent-info: var(--rt-color-info-100);
+  --rt-text-accent-info-soft: var(--rt-color-info-80);
+  --rt-icon-neutral-default: light-dark(#323033, #e0e0e0);
+  --rt-icon-neutral-soft: light-dark(#747474, #a3a3a3);
+  --rt-icon-neutral-disabled: light-dark(#a3a3a3, #747474);
+  --rt-icon-neutral-inverse: light-dark(#fff, #181818);
+  --rt-icon-static-light: #fff;
+  --rt-icon-static-dark: #181818;
+  --rt-icon-accent-brand: light-dark(var(--rt-color-brand-100), var(--rt-color-brand-20));
+  --rt-icon-accent-primary: light-dark(var(--rt-color-primary-100), var(--rt-color-primary-60));
+  --rt-icon-accent-success: var(--rt-color-success-100);
+  --rt-icon-accent-warning: var(--rt-color-warning-100);
+  --rt-icon-accent-danger: var(--rt-color-danger-100);
+  --rt-icon-accent-info: var(--rt-color-info-100);
+  --rt-border-neutral-subtle: light-dark(#e8e8e8, #2e2d31);
+  --rt-border-neutral-default: var(--mat-sys-outline-variant, light-dark(#e0e0e0, #3f3e43));
+  --rt-border-neutral-medium: light-dark(#d1d1d1, #4a494e);
+  --rt-border-neutral-divider: light-dark(#ccc, #4a494e);
+  --rt-border-neutral-strong: var(--mat-sys-outline, light-dark(#a3a3a3, #5c5b60));
+  --rt-border-neutral-emphasis: light-dark(#747474, #a3a3a3);
+  --rt-border-accent-primary: light-dark(var(--rt-color-primary-100), var(--rt-color-primary-60));
+  --rt-border-accent-success: var(--rt-color-success-100);
+  --rt-border-accent-warning: var(--rt-color-warning-100);
+  --rt-border-accent-danger: var(--rt-color-danger-100);
+  --rt-border-accent-danger-soft: var(--rt-color-danger-60);
+  --rt-border-accent-info: var(--rt-color-info-100);
+  --rt-border-focus: light-dark(var(--rt-color-primary-40), var(--rt-color-primary-60));
+  --rt-control-track: light-dark(#e8e8e8, #4a494e);
+  --rt-control-thumb: light-dark(#fff, #eee);
+  --rt-control-checked: light-dark(#323033, #e0e0e0);
+  --rt-scrollbar-thumb: light-dark(#ccc, #4a494e);
+  --rt-scrollbar-thumb-hover: light-dark(#a3a3a3, #5c5b60);
+  --rt-shadow-color: light-dark(#747474, rgba(0, 0, 0, 0.6));
+  /* --- Foundations --- */
+  --rt-spacing-0: 0;
+  --rt-spacing-2: 0.125rem;
+  --rt-spacing-4: 0.25rem;
+  --rt-spacing-6: 0.375rem;
+  --rt-spacing-8: 0.5rem;
+  --rt-spacing-12: 0.75rem;
+  --rt-spacing-16: 1rem;
+  --rt-spacing-20: 1.25rem;
+  --rt-spacing-24: 1.5rem;
+  --rt-spacing-32: 2rem;
+  --rt-spacing-40: 2.5rem;
+  --rt-spacing-48: 3rem;
+  --rt-spacing-56: 3.5rem;
+  --rt-spacing-64: 4rem;
+  --rt-radius-xs: 0.25rem;
+  --rt-radius-sm: 0.5rem;
+  --rt-radius-md: 0.75rem;
+  --rt-radius-lg: 1rem;
+  --rt-radius-xl: 1.5rem;
+  --rt-radius-2xl: 2rem;
+  --rt-radius-full: 624.9375rem;
+  --rt-font-size-xs: 0.75rem;
+  --rt-font-size-sm: 0.875rem;
+  --rt-font-size-md: 1rem;
+  --rt-font-size-lg: 1.25rem;
+  --rt-font-size-xl: 1.5rem;
+  --rt-font-weight-regular: 400;
+  --rt-font-weight-medium: 500;
+  --rt-font-weight-semibold: 600;
+  --rt-font-weight-bold: 700;
+  --rt-shadow-sm: 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.12);
+  --rt-shadow-md: 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.14);
+  --rt-shadow-lg: 0 0.5rem 1rem 0 var(--rt-shadow-color);
+  --rt-transition-fast: 0.15s ease-in-out;
+  --rt-transition-base: 0.25s ease-in-out;
+  --rt-transition-slow: 0.4s ease-in-out;
+  --rt-z-index-dropdown: 1000;
+  --rt-z-index-sticky: 1020;
+  --rt-z-index-overlay: 1040;
+  --rt-z-index-modal: 1060;
+  --rt-z-index-popover: 1080;
+  --rt-z-index-tooltip: 1100;
+  --rt-breakpoint-xs: 600px;
+  --rt-breakpoint-sm: 720px;
+  --rt-breakpoint-md: 960px;
+  --rt-breakpoint-lg: 1280px;
+  --rt-breakpoint-xl: 1920px;
+}
+
+/* Theme switching: global class + nested local contexts (GMT data-theme analogue) */
+.rt-dark,
+[data-rt-theme=dark] {
+  color-scheme: dark;
+}
+
+[data-rt-theme=light] {
+  color-scheme: light;
+}
+
+/* 'auto' follows prefers-color-scheme */
+.rt-theme-auto {
+  color-scheme: light dark;
+}

package/types/rt-tools-ui-kit.d.ts

@@ -1590,5 +1590,104 @@ declare class RtActionBarService {
     static ɵprov: i0.ɵɵInjectableDeclaration<RtActionBarService>;
 }
 
-export { ASIDE_BUTTONS_ENUM, ASIDE_REF, AsideRef, BUTTON_APPEARANCE, BUTTON_COLOR, BUTTON_SIZE, DEFAULT_PAGE_MODEL, DEFAULT_PAGE_SIZE, IAside, IModal, INFO_BADGE_SIZE_ENUM, INFO_BADGE_TYPE_ENUM, IRtActionBar, IRtSnackBar, ISideMenu, ITable, MODAL_WINDOW_SIZE_ENUM, RTUI_TABLE_COMPONENT_TOKEN, RTUI_TABLE_STOP_ROW_CLICK_ATTRIBUTE, RtActionBarService, RtAsideService, RtDynamicListSelectorsDirective, RtModalService, RtPopoverDirective, RtSnackBarService, RtTableConfigService, RtTableSelectorsDirective, RtuiActionBarComponent, RtuiActionBarContainerComponent, RtuiAsideContainerComponent, RtuiAsideContainerHeaderDirective, RtuiButtonComponent, RtuiClearButtonComponent, RtuiCustomTableCellsDirective, RtuiDynamicInputAdditionalControlDirective, RtuiDynamicInputComponent, RtuiDynamicListComponent, RtuiDynamicListCustomTableCellsDirective, RtuiDynamicListRowActionsDirective, RtuiDynamicListRowAdditionalActionsDirective, RtuiDynamicListToolbarActionsDirective, RtuiDynamicListToolbarSelectorsDirective, RtuiDynamicSelectorAdditionalControlDirective, RtuiDynamicSelectorComponent, RtuiDynamicSelectorItemAdditionalControlDirective, RtuiDynamicSelectorItemTitleDirective, RtuiDynamicSelectorItemTitleProjectionDirective, RtuiDynamicSelectorListActionsComponent, RtuiDynamicSelectorPlaceholderComponent, RtuiDynamicSelectorSelectedListComponent, RtuiFileUploadComponent, RtuiHeaderCenterDirective, RtuiHeaderComponent, RtuiHeaderLeftDirective, RtuiHeaderRightDirective, RtuiImageUploadComponent, RtuiInfoBadgeComponent, RtuiModalComponent, RtuiMultiButtonComponent, RtuiMultiSelectorPopupComponent, RtuiPaginationComponent, RtuiRoundIconButtonComponent, RtuiScrollableContainerComponent, RtuiScrollableContainerContentDirective, RtuiScrollableContainerFooterDirective, RtuiScrollableContainerHeaderDirective, RtuiSideMenuComponent, RtuiSideMenuFooterDirective, RtuiSideMenuHeaderDirective, RtuiSnackBarComponent, RtuiSpinnerComponent, RtuiStopTableRowClickDirective, RtuiTableAdditionalRowActionsDirective, RtuiTableComponent, RtuiTableRowActionsDirective, RtuiTableRowClickDirective, RtuiToggleComponent, RtuiToolbarCenterDirective, RtuiToolbarComponent, RtuiToolbarLeftDirective, RtuiToolbarRightDirective, TABLE_COLUMN_FILTER_TYPES_ENUM, TABLE_COLUMN_TYPES_ENUM, TEXT_CELL_COLOR_ENUM, TOGGLE_SIZE_TYPE_ENUM, darkenHexColor, ddServices, getColorBasedOnBackground, progressDecreaseAnimation, progressIncreaseAnimation, provideRtUi };
-export type { AsideButtonsType, AsidePositions, ButtonAppearanceType, ButtonColorType, ButtonSizeType, IImageUploadFormat, IInfoBadgeSizeType, IRtuiTable, Icon, IconSideType, InfoBadgeType, MenuItemTrigger, ModalWindowSizeType, NameValueType, Select, ToggleSizeType };
+declare enum RT_THEME_ENUM {
+    LIGHT = "light",
+    DARK = "dark",
+    AUTO = "auto"
+}
+type RtThemeType = `${RT_THEME_ENUM}`;
+declare const RT_THEME_STORAGE_KEY: string;
+declare const RT_DARK_CLASS: string;
+declare const RT_THEME_AUTO_CLASS: string;
+declare const RT_THEME_ATTRIBUTE: string;
+/**
+ * Accent roles whose `--rt-color-{role}-{0..100}` indirection rows a custom
+ * color scheme may override. The semantic accent tier
+ * (`--rt-bg/text/icon/border-accent-*`) derives entirely from these rows.
+ */
+declare enum RT_ACCENT_ROLE_ENUM {
+    PRIMARY = "primary",
+    INFO = "info",
+    SUCCESS = "success",
+    WARNING = "warning",
+    DANGER = "danger",
+    BRAND = "brand"
+}
+type RtAccentRole = `${RT_ACCENT_ROLE_ENUM}`;
+/**
+ * A brand palette: per accent role, a tonal ramp mapping tone step (0–100)
+ * to a CSS color. One ramp serves both light and dark (the mode picks the tone).
+ * Partial ramps are allowed — unset tones keep the rt-tools defaults.
+ *
+ * @example
+ * const teal: RtColorSchemeRamp = {
+ *     primary: { 20: '#b3e3e1', 40: '#5cb8b5', 60: '#1a9d99', 100: '#008582' },
+ *     brand:   { 20: '#e8e8e8', 100: '#008582' },
+ * };
+ */
+type RtColorSchemeRamp = Partial<Record<RtAccentRole, Record<number, string>>>;
+/** `'default'`/`null` clears the active scheme (back to the rt-tools palette). */
+declare const RT_DEFAULT_SCHEME: string;
+declare const RT_COLOR_SCHEME_STORAGE_KEY: string;
+declare const RT_SCHEME_ATTRIBUTE: string;
+
+/**
+ * Global theme + color-scheme switcher for the rt-tools design tokens.
+ *
+ * **Theme** (`light`/`dark`/`auto`): applies `.rt-dark` / `.rt-theme-auto` to
+ * `<html>`; semantic tokens (`--rt-*`) adapt through `color-scheme` + `light-dark()`.
+ * Persisted to localStorage (`rt-theme`). `auto` follows the OS preference.
+ *
+ * **Color scheme** (brand palette): toggles `data-rt-scheme="<name>"` on `<html>`,
+ * which activates a `[data-rt-scheme]` block (emitted by the `rt.color-scheme` Sass
+ * mixin or injected at runtime via {@link registerColorScheme}). It overrides only
+ * the accent-role rows `--rt-color-{role}-{N}`, so the whole accent layer recolors
+ * while semantic token names stay stable. Orthogonal to light/dark; persisted to
+ * localStorage (`rt-color-scheme`).
+ */
+declare class RtThemeService {
+    #private;
+    readonly theme: Signal<RtThemeType>;
+    readonly colorScheme: Signal<string | null>;
+    constructor();
+    setTheme(theme: RtThemeType): void;
+    /** Toggles between light and dark (auto resolves to its opposite visual state). */
+    toggle(): void;
+    /**
+     * Activates a registered color scheme by name, or clears it with `null`/`'default'`.
+     * Orthogonal to the light/dark theme; persisted to localStorage.
+     */
+    setColorScheme(name: string | null): void;
+    /**
+     * Injects (or replaces) a color scheme's `[data-rt-scheme]` block at runtime —
+     * the JS twin of the `rt.color-scheme` Sass mixin. Browser-only (no-op on server;
+     * for SSR/brand-critical schemes prefer the Sass path). Does not activate the
+     * scheme — call {@link setColorScheme} afterwards.
+     */
+    registerColorScheme(name: string, ramp: RtColorSchemeRamp): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RtThemeService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<RtThemeService>;
+}
+
+/**
+ * Local theme context (GMT `data-theme` analogue).
+ *
+ * Sets `data-rt-theme` on the host, re-scoping all adaptive `--rt-*` tokens
+ * inside the subtree through `color-scheme` + `light-dark()`:
+ *
+ * ```html
+ * <!-- dark promo card inside a light page -->
+ * <section [rtTheme]="'dark'">…</section>
+ * ```
+ *
+ * Note: `color` is inherited as a resolved value — re-apply text tokens
+ * on elements inside the context (e.g. `color: var(--rt-text-base-primary)`).
+ */
+declare class RtThemeDirective {
+    readonly rtTheme: InputSignal<RtThemeType | ''>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RtThemeDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RtThemeDirective, "[rtTheme]", never, { "rtTheme": { "alias": "rtTheme"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { ASIDE_BUTTONS_ENUM, ASIDE_REF, AsideRef, BUTTON_APPEARANCE, BUTTON_COLOR, BUTTON_SIZE, DEFAULT_PAGE_MODEL, DEFAULT_PAGE_SIZE, IAside, IModal, INFO_BADGE_SIZE_ENUM, INFO_BADGE_TYPE_ENUM, IRtActionBar, IRtSnackBar, ISideMenu, ITable, MODAL_WINDOW_SIZE_ENUM, RTUI_TABLE_COMPONENT_TOKEN, RTUI_TABLE_STOP_ROW_CLICK_ATTRIBUTE, RT_ACCENT_ROLE_ENUM, RT_COLOR_SCHEME_STORAGE_KEY, RT_DARK_CLASS, RT_DEFAULT_SCHEME, RT_SCHEME_ATTRIBUTE, RT_THEME_ATTRIBUTE, RT_THEME_AUTO_CLASS, RT_THEME_ENUM, RT_THEME_STORAGE_KEY, RtActionBarService, RtAsideService, RtDynamicListSelectorsDirective, RtModalService, RtPopoverDirective, RtSnackBarService, RtTableConfigService, RtTableSelectorsDirective, RtThemeDirective, RtThemeService, RtuiActionBarComponent, RtuiActionBarContainerComponent, RtuiAsideContainerComponent, RtuiAsideContainerHeaderDirective, RtuiButtonComponent, RtuiClearButtonComponent, RtuiCustomTableCellsDirective, RtuiDynamicInputAdditionalControlDirective, RtuiDynamicInputComponent, RtuiDynamicListComponent, RtuiDynamicListCustomTableCellsDirective, RtuiDynamicListRowActionsDirective, RtuiDynamicListRowAdditionalActionsDirective, RtuiDynamicListToolbarActionsDirective, RtuiDynamicListToolbarSelectorsDirective, RtuiDynamicSelectorAdditionalControlDirective, RtuiDynamicSelectorComponent, RtuiDynamicSelectorItemAdditionalControlDirective, RtuiDynamicSelectorItemTitleDirective, RtuiDynamicSelectorItemTitleProjectionDirective, RtuiDynamicSelectorListActionsComponent, RtuiDynamicSelectorPlaceholderComponent, RtuiDynamicSelectorSelectedListComponent, RtuiFileUploadComponent, RtuiHeaderCenterDirective, RtuiHeaderComponent, RtuiHeaderLeftDirective, RtuiHeaderRightDirective, RtuiImageUploadComponent, RtuiInfoBadgeComponent, RtuiModalComponent, RtuiMultiButtonComponent, RtuiMultiSelectorPopupComponent, RtuiPaginationComponent, RtuiRoundIconButtonComponent, RtuiScrollableContainerComponent, RtuiScrollableContainerContentDirective, RtuiScrollableContainerFooterDirective, RtuiScrollableContainerHeaderDirective, RtuiSideMenuComponent, RtuiSideMenuFooterDirective, RtuiSideMenuHeaderDirective, RtuiSnackBarComponent, RtuiSpinnerComponent, RtuiStopTableRowClickDirective, RtuiTableAdditionalRowActionsDirective, RtuiTableComponent, RtuiTableRowActionsDirective, RtuiTableRowClickDirective, RtuiToggleComponent, RtuiToolbarCenterDirective, RtuiToolbarComponent, RtuiToolbarLeftDirective, RtuiToolbarRightDirective, TABLE_COLUMN_FILTER_TYPES_ENUM, TABLE_COLUMN_TYPES_ENUM, TEXT_CELL_COLOR_ENUM, TOGGLE_SIZE_TYPE_ENUM, darkenHexColor, ddServices, getColorBasedOnBackground, progressDecreaseAnimation, progressIncreaseAnimation, provideRtUi };
+export type { AsideButtonsType, AsidePositions, ButtonAppearanceType, ButtonColorType, ButtonSizeType, IImageUploadFormat, IInfoBadgeSizeType, IRtuiTable, Icon, IconSideType, InfoBadgeType, MenuItemTrigger, ModalWindowSizeType, NameValueType, RtAccentRole, RtColorSchemeRamp, RtThemeType, Select, ToggleSizeType };