@steveencues/starter-react-ui 1.0.0 → 1.0.2

package/dist/libs/domain/interface/theme/colors/theme-text-colors.interface.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @description Define los colores del contenido textual.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeTextColors {
+    readonly primary: string;
+    readonly secondary: string;
+    readonly muted: string;
+    readonly disabled: string;
+    readonly inverse: string;
+    readonly link: string;
+    readonly linkHover: string;
+    readonly selection: string;
+    readonly placeholder: string;
+    readonly onPrimary: string;
+    readonly onSecondary: string;
+    readonly onAccent: string;
+}

package/dist/libs/domain/interface/theme/components/index.d.ts

@@ -0,0 +1,6 @@
+export * from './theme-button.interface';
+export * from './theme-card.interface';
+export * from './theme-components.interface';
+export * from './theme-input.interface';
+export * from './theme-interactive-colors.interface';
+export * from './theme-modal.interface';

package/dist/libs/domain/interface/theme/components/theme-button.interface.d.ts

@@ -0,0 +1,18 @@
+import { ThemeFontWeight, ThemeInteractiveColors } from '../../..';
+/**
+ * @description Define los tokens de un boton.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeButton {
+    readonly primary: ThemeInteractiveColors;
+    readonly secondary: ThemeInteractiveColors;
+    readonly outline: ThemeInteractiveColors;
+    readonly ghost: ThemeInteractiveColors;
+    readonly danger: ThemeInteractiveColors;
+    readonly radius: string;
+    readonly fontWeight: ThemeFontWeight;
+    readonly height: string;
+    readonly paddingInline: string;
+    readonly transition: string;
+}

package/dist/libs/domain/interface/theme/components/theme-card.interface.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @description Define los tokens de una tarjeta.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeCard {
+    readonly background: string;
+    readonly foreground: string;
+    readonly border: string;
+    readonly radius: string;
+    readonly shadow: string;
+    readonly padding: string;
+    readonly hoverTransform: string;
+    readonly transition: string;
+}

package/dist/libs/domain/interface/theme/components/theme-components.interface.d.ts

@@ -0,0 +1,12 @@
+import { ThemeButton, ThemeCard, ThemeInput, ThemeModal } from '../../..';
+/**
+ * @description Define las propiedades visuales de los componentes.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeComponents {
+    readonly button: ThemeButton;
+    readonly input: ThemeInput;
+    readonly card: ThemeCard;
+    readonly modal: ThemeModal;
+}

package/dist/libs/domain/interface/theme/components/theme-input.interface.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @description Define los tokens de un campo de entrada.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeInput {
+    readonly background: string;
+    readonly foreground: string;
+    readonly placeholder: string;
+    readonly border: string;
+    readonly borderHover: string;
+    readonly borderFocus: string;
+    readonly borderError: string;
+    readonly radius: string;
+    readonly height: string;
+    readonly paddingInline: string;
+    readonly shadowFocus: string;
+}

package/dist/libs/domain/interface/theme/components/theme-interactive-colors.interface.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @description Define los colores de los componentes interactivos.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeInteractiveColors {
+    readonly background: string;
+    readonly backgroundHover: string;
+    readonly backgroundActive: string;
+    readonly backgroundDisabled: string;
+    readonly foreground: string;
+    readonly foregroundHover: string;
+    readonly border: string;
+    readonly borderHover: string;
+    readonly borderFocus: string;
+}

package/dist/libs/domain/interface/theme/components/theme-modal.interface.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @description Define los tokens de un modal.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeModal {
+    readonly background: string;
+    readonly foreground: string;
+    readonly border: string;
+    readonly radius: string;
+    readonly shadow: string;
+    readonly backdrop: string;
+    readonly maxWidth: string;
+}

package/dist/libs/domain/interface/theme/core/app-theme.interface.d.ts

@@ -0,0 +1,11 @@
+import { Theme, ThemeManifest, ThemeName } from '../../..';
+/**
+ * @description Define una configuracion visual completa de un tema.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface AppTheme {
+    readonly manifest: ThemeManifest;
+    readonly name: ThemeName;
+    readonly themes: Theme;
+}

package/dist/libs/domain/interface/theme/core/index.d.ts

@@ -0,0 +1,2 @@
+export * from './app-theme.interface';
+export * from './theme.interface';

package/dist/libs/domain/interface/theme/core/theme.interface.d.ts

@@ -0,0 +1,26 @@
+import { ThemeBrandColors, ThemeBorderColors, ThemeColorPalette, ThemeDataColors, ThemeOverlayColors, ThemeStateColors, ThemeSurfaceColors, ThemeTextColors, ThemeAccessibility, ThemeComponents, ThemeAnimations, ThemeEffects, ThemeGradients, ThemeTransitions, ThemeLayout, ThemeShadowColors, ThemeShadows, ThemeTypography } from '../../..';
+/**
+ * @description Define la configuracion completa de tokens visuales.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface Theme {
+    readonly palette: ThemeColorPalette;
+    readonly surface: ThemeSurfaceColors;
+    readonly text: ThemeTextColors;
+    readonly brand: ThemeBrandColors;
+    readonly state: ThemeStateColors;
+    readonly border: ThemeBorderColors;
+    readonly overlay: ThemeOverlayColors;
+    readonly data: ThemeDataColors;
+    readonly typography: ThemeTypography;
+    readonly gradients: ThemeGradients;
+    readonly shadows: ThemeShadows;
+    readonly shadowColors: ThemeShadowColors;
+    readonly effects: ThemeEffects;
+    readonly transitions: ThemeTransitions;
+    readonly animations: ThemeAnimations;
+    readonly layout: ThemeLayout;
+    readonly components: ThemeComponents;
+    readonly accessibility: ThemeAccessibility;
+}

package/dist/libs/domain/interface/theme/effects/index.d.ts

@@ -0,0 +1,7 @@
+export * from './theme-animation.interface';
+export * from './theme-animations.interface';
+export * from './theme-effects.interface';
+export * from './theme-gradient-stop.interface';
+export * from './theme-gradient.interface';
+export * from './theme-gradients.interface';
+export * from './theme-transitions.interface';

package/dist/libs/domain/interface/theme/effects/theme-animation.interface.d.ts

@@ -0,0 +1,17 @@
+import { ThemeDuration, ThemeEasing } from '../../..';
+/**
+ * @description Define la configuracion de una animacion.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeAnimation {
+    readonly name: string;
+    readonly duration: ThemeDuration;
+    readonly delay: ThemeDuration;
+    readonly easing: ThemeEasing;
+    readonly iterationCount: number | "infinite";
+    readonly direction: "normal" | "reverse" | "alternate" | "alternate-reverse";
+    readonly fillMode: "none" | "forwards" | "backwards" | "both";
+    readonly playState: "running" | "paused";
+    readonly reducedMotionAlternative?: string;
+}

package/dist/libs/domain/interface/theme/effects/theme-animations.interface.d.ts

@@ -0,0 +1,20 @@
+import { ThemeAnimation } from '../../..';
+/**
+ * @description Define las animaciones disponibles.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeAnimations {
+    readonly fadeIn: ThemeAnimation;
+    readonly fadeOut: ThemeAnimation;
+    readonly slideIn: ThemeAnimation;
+    readonly slideOut: ThemeAnimation;
+    readonly scaleIn: ThemeAnimation;
+    readonly scaleOut: ThemeAnimation;
+    readonly pulse: ThemeAnimation;
+    readonly shimmer: ThemeAnimation;
+    readonly gradient: ThemeAnimation;
+    readonly glow: ThemeAnimation;
+    readonly float: ThemeAnimation;
+    readonly spin: ThemeAnimation;
+}

package/dist/libs/domain/interface/theme/effects/theme-effects.interface.d.ts

@@ -0,0 +1,22 @@
+import { ThemeOpacity } from '../../..';
+/**
+ * @description Define los efectos visuales del tema.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeEffects {
+    readonly overlay: string;
+    readonly backdrop: string;
+    readonly blur: string;
+    readonly blurStrong: string;
+    readonly glassBackground: string;
+    readonly glassBorder: string;
+    readonly glassShadow: string;
+    readonly opacityDisabled: ThemeOpacity;
+    readonly opacityHover: ThemeOpacity;
+    readonly opacityOverlay: ThemeOpacity;
+    readonly saturation: string;
+    readonly contrast: string;
+    readonly brightness: string;
+    readonly grayscale: string;
+}

package/dist/libs/domain/interface/theme/effects/theme-gradient-stop.interface.d.ts

@@ -0,0 +1,11 @@
+import { ThemeOpacity } from '../../..';
+/**
+ * @description Define una parada de color de un gradiente.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeGradientStop {
+    readonly color: string;
+    readonly position?: string;
+    readonly opacity?: ThemeOpacity;
+}

package/dist/libs/domain/interface/theme/effects/theme-gradient.interface.d.ts

@@ -0,0 +1,16 @@
+import { ThemeDuration, ThemeGradientDirection, ThemeGradientStop, ThemeGradientType } from '../../..';
+/**
+ * @description Define un gradiente reutilizable.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeGradient {
+    readonly type: ThemeGradientType;
+    readonly direction?: ThemeGradientDirection;
+    readonly angle?: string;
+    readonly stops: readonly ThemeGradientStop[];
+    readonly css: string;
+    readonly animated: boolean;
+    readonly animationName?: string;
+    readonly animationDuration?: ThemeDuration;
+}

package/dist/libs/domain/interface/theme/effects/theme-gradients.interface.d.ts

@@ -0,0 +1,17 @@
+import { ThemeGradient } from '../../..';
+/**
+ * @description Define los gradientes disponibles del tema.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeGradients {
+    readonly primary: ThemeGradient;
+    readonly secondary: ThemeGradient;
+    readonly accent: ThemeGradient;
+    readonly background: ThemeGradient;
+    readonly surface: ThemeGradient;
+    readonly sunset: ThemeGradient;
+    readonly ocean: ThemeGradient;
+    readonly aurora: ThemeGradient;
+    readonly rainbow: ThemeGradient;
+}

package/dist/libs/domain/interface/theme/effects/theme-transitions.interface.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @description Define las duraciones y curvas de las transiciones.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeTransitions {
+    readonly instant: string;
+    readonly fast: string;
+    readonly normal: string;
+    readonly slow: string;
+    readonly easing: {
+        readonly standard: string;
+        readonly emphasized: string;
+        readonly decelerate: string;
+        readonly accelerate: string;
+        readonly spring: string;
+    };
+}

package/dist/libs/domain/interface/theme/index.d.ts

@@ -0,0 +1,8 @@
+export * from './accessibility';
+export * from './colors';
+export * from './components';
+export * from './core';
+export * from './effects';
+export * from './layout';
+export * from './preferences';
+export * from './typography';

package/dist/libs/domain/interface/theme/layout/index.d.ts

@@ -0,0 +1,8 @@
+export * from './theme-breakpoints.interface';
+export * from './theme-dimensions.interface';
+export * from './theme-layout.interface';
+export * from './theme-radii.interface';
+export * from './theme-shadow-colors.interface';
+export * from './theme-shadows.interface';
+export * from './theme-spacing.interface';
+export * from './theme-z-index.interface';

package/dist/libs/domain/interface/theme/layout/theme-breakpoints.interface.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @description Define los puntos de parada para el diseno adaptable.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeBreakpoints {
+    readonly xs: string;
+    readonly sm: string;
+    readonly md: string;
+    readonly lg: string;
+    readonly xl: string;
+    readonly "2xl": string;
+}

package/dist/libs/domain/interface/theme/layout/theme-dimensions.interface.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @description Define las dimensiones principales del diseno.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeDimensions {
+    readonly headerHeight: string;
+    readonly sidebarWidth: string;
+    readonly sidebarCollapsedWidth: string;
+    readonly contentMaxWidth: string;
+    readonly modalMaxWidth: string;
+    readonly inputHeight: string;
+    readonly buttonHeight: string;
+    readonly iconSize: string;
+}

package/dist/libs/domain/interface/theme/layout/theme-layout.interface.d.ts

@@ -0,0 +1,14 @@
+import { ThemeDensity, ThemeBreakpoints, ThemeDimensions, ThemeRadii, ThemeSpacing, ThemeZIndex } from '../../..';
+/**
+ * @description Define la configuracion de layout del tema.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeLayout {
+    readonly density: ThemeDensity;
+    readonly spacing: ThemeSpacing;
+    readonly radii: ThemeRadii;
+    readonly breakpoints: ThemeBreakpoints;
+    readonly dimensions: ThemeDimensions;
+    readonly zIndex: ThemeZIndex;
+}

package/dist/libs/domain/interface/theme/layout/theme-radii.interface.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @description Define los radios de borde.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeRadii {
+    readonly none: string;
+    readonly xs: string;
+    readonly sm: string;
+    readonly md: string;
+    readonly lg: string;
+    readonly xl: string;
+    readonly "2xl": string;
+    readonly "3xl": string;
+    readonly full: string;
+}

package/dist/libs/domain/interface/theme/layout/theme-shadow-colors.interface.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @description Define la configuracion de sombras del tema.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeShadowColors {
+    readonly color: string;
+    readonly subtle: string;
+    readonly small: string;
+    readonly medium: string;
+    readonly large: string;
+    readonly glow: string;
+}

package/dist/libs/domain/interface/theme/layout/theme-shadows.interface.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @description Define la escala de elevacion visual.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeShadows {
+    readonly none: string;
+    readonly xs: string;
+    readonly sm: string;
+    readonly md: string;
+    readonly lg: string;
+    readonly xl: string;
+    readonly "2xl": string;
+    readonly inner: string;
+    readonly glow: string;
+}

package/dist/libs/domain/interface/theme/layout/theme-spacing.interface.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @description Define los espacios disponibles para el diseno.
+ * @author Steveen Cues
+ * @version 2.1.0
+ */
+export interface ThemeSpacing {
+    readonly "0": string;
+    readonly "1": string;
+    readonly "2": string;
+    readonly "3": string;
+    readonly "4": string;
+    readonly "5": string;
+    readonly "6": string;
+    readonly "8": string;
+    readonly "10": string;
+    readonly "12": string;
+    readonly "16": string;
+    readonly "20": string;
+    readonly "24": string;
+}

package/dist/libs/domain/interface/theme/layout/theme-z-index.interface.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @description Define las capas de apilamiento visual.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeZIndex {
+    readonly base: number;
+    readonly dropdown: number;
+    readonly sticky: number;
+    readonly header: number;
+    readonly overlay: number;
+    readonly modal: number;
+    readonly popover: number;
+    readonly tooltip: number;
+    readonly toast: number;
+}

package/dist/libs/domain/interface/theme/preferences/index.d.ts

@@ -0,0 +1,5 @@
+export * from './theme-context.interface';
+export * from './theme-preference-configuration.interface';
+export * from './theme-preference-result.interface';
+export * from './theme-preference-state.interface';
+export * from './theme-provider.interface';

package/dist/libs/domain/interface/theme/preferences/theme-context.interface.d.ts

@@ -0,0 +1,12 @@
+import { AppTheme, ThemeName } from '../../..';
+/**
+ * @description Define el contrato publico del contexto de temas.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface IThemeContextValue {
+    readonly theme: AppTheme;
+    readonly themeName: ThemeName;
+    readonly themes: readonly AppTheme[];
+    readonly setTheme: (theme: ThemeName) => void;
+}

package/dist/libs/domain/interface/theme/preferences/theme-preference-configuration.interface.d.ts

@@ -0,0 +1,11 @@
+import { IThemeProviderProps } from '../../..';
+/**
+ * @description Define la configuracion de las preferencias de temas.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemePreferenceConfiguration {
+    readonly themes: IThemeProviderProps["themes"];
+    readonly initialTheme: IThemeProviderProps["initialTheme"];
+    readonly themeEncryptionKey: IThemeProviderProps["themeEncryptionKey"];
+}

package/dist/libs/domain/interface/theme/preferences/theme-preference-result.interface.d.ts

@@ -0,0 +1,11 @@
+import { ThemeName } from '../../..';
+/**
+ * @description Define el resultado del hook de preferencias de temas.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemePreferenceResult {
+    readonly themeName: ThemeName;
+    readonly isPreferenceLoaded: boolean;
+    readonly setThemeName: (nextTheme: ThemeName) => void;
+}

package/dist/libs/domain/interface/theme/preferences/theme-preference-state.interface.d.ts

@@ -0,0 +1,10 @@
+import { ThemeName, ThemePreferenceConfiguration } from '../../..';
+/**
+ * @description Define el estado de las preferencias de temas.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemePreferenceState extends ThemePreferenceConfiguration {
+    readonly themeName: ThemeName;
+    readonly isLoaded: boolean;
+}

package/dist/libs/domain/interface/theme/preferences/theme-provider.interface.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+import { AppTheme, ThemeName } from '../../..';
+/**
+ * @description Define las propiedades del proveedor de temas.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface IThemeProviderProps {
+    readonly themes: readonly AppTheme[];
+    readonly initialTheme: ThemeName;
+    readonly themeEncryptionKey: string;
+    readonly children: ReactNode;
+}

package/dist/libs/domain/interface/theme/typography/index.d.ts

@@ -0,0 +1,5 @@
+export * from './theme-font-family.interface';
+export * from './theme-font-sizes.interface';
+export * from './theme-font-weights.interface';
+export * from './theme-text-style.interface';
+export * from './theme-typography.interface';

package/dist/libs/domain/interface/theme/typography/theme-font-family.interface.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @description Define las familias tipograficas del tema.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeFontFamily {
+    readonly sans: string;
+    readonly serif: string;
+    readonly mono: string;
+    readonly display: string;
+    readonly heading: string;
+    readonly body: string;
+}

package/dist/libs/domain/interface/theme/typography/theme-font-sizes.interface.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @description Define los tamanos de fuente.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeFontSizes {
+    readonly xs: string;
+    readonly sm: string;
+    readonly md: string;
+    readonly lg: string;
+    readonly xl: string;
+    readonly "2xl": string;
+    readonly "3xl": string;
+    readonly "4xl": string;
+    readonly "5xl": string;
+    readonly "6xl": string;
+    readonly "7xl": string;
+    readonly "8xl": string;
+    readonly "9xl": string;
+}

package/dist/libs/domain/interface/theme/typography/theme-font-weights.interface.d.ts

@@ -0,0 +1,17 @@
+import { ThemeFontWeightValue } from '../../..';
+/**
+ * @description Define los pesos de fuente del sistema tipografico.
+ * @author Steveen Cues
+ * @version 2.1.0
+ */
+export interface ThemeFontWeights {
+    readonly thin: ThemeFontWeightValue;
+    readonly extraLight: ThemeFontWeightValue;
+    readonly light: ThemeFontWeightValue;
+    readonly regular: ThemeFontWeightValue;
+    readonly medium: ThemeFontWeightValue;
+    readonly semiBold: ThemeFontWeightValue;
+    readonly bold: ThemeFontWeightValue;
+    readonly extraBold: ThemeFontWeightValue;
+    readonly black: ThemeFontWeightValue;
+}

package/dist/libs/domain/interface/theme/typography/theme-text-style.interface.d.ts

@@ -0,0 +1,18 @@
+import { ThemeFontStyle, ThemeFontWeight, ThemeTextAlignment, ThemeTextTransform } from '../../..';
+/**
+ * @description Define los estilos tipograficos reutilizables.
+ * @author Steveen Cues
+ * @version 2.0.0
+ */
+export interface ThemeTextStyle {
+    readonly fontFamily: string;
+    readonly fontSize: string;
+    readonly fontWeight: ThemeFontWeight;
+    readonly lineHeight: string | number;
+    readonly letterSpacing: string;
+    readonly color: string;
+    readonly fontStyle: ThemeFontStyle;
+    readonly textAlign: ThemeTextAlignment;
+    readonly textTransform: ThemeTextTransform;
+    readonly textDecoration: string;
+}