@3ddv/software-division-components 1.5.0 → 2.0.0

package/shared/format-value.pipe.ts

@@ -0,0 +1,23 @@
+import { CurrencyPipe, DatePipe } from '@angular/common';
+import { inject, Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  pure: true,
+  standalone: true,
+  name: 'formatValue',
+})
+export class FormatValuePipe implements PipeTransform {
+  private currencyPipe = inject(CurrencyPipe);
+  private datePipe = inject(DatePipe);
+
+  public transform(value: string, pipe: any): string {
+    switch (pipe) {
+      case 'currency':
+        return this.currencyPipe.transform(value) ?? '';
+      case 'date':
+        return this.datePipe.transform(value) ?? '';
+      default:
+        return value ?? '';
+    }
+  }
+}

package/shared/index.ts

@@ -0,0 +1 @@
+export * from './public-api';

package/shared/lib-provider/config-token.ts

@@ -0,0 +1,4 @@
+import { InjectionToken } from '@angular/core';
+import { NgSdComponentsConfig } from '../types';
+
+export const NG_SD_COMPONENTS_CONFIG = new InjectionToken<NgSdComponentsConfig>('NgSdComponentsConfig');

package/shared/lib-provider/index.ts

@@ -0,0 +1 @@
+export * from './public-api';

package/shared/lib-provider/provide-sdc.ts

@@ -0,0 +1,24 @@
+import { CurrencyPipe, DatePipe } from '@angular/common';
+import { Provider } from '@angular/core';
+import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
+import { NgSdComponentsConfig } from '../types';
+import { NG_SD_COMPONENTS_CONFIG } from './config-token';
+
+/**
+ * Provides all necessary dependencies for the library:
+ * - Angular Pipes (`DatePipe`, `CurrencyPipe`)
+ * - Animations
+ * - CommonModule
+ */
+export function provideSdc(config?: NgSdComponentsConfig): Provider[] {
+  // const preset = config?.theme === 'generic' ? GenericTheme : Aura;
+  // if config.theme is generic, pass a theme, otherwise, pass another theme
+  const providers = [
+    DatePipe,
+    CurrencyPipe,
+    { provide: NG_SD_COMPONENTS_CONFIG, useValue: config ?? 'generic' },
+    provideAnimationsAsync() as unknown as Provider,
+  ];
+
+  return [...providers];
+}

package/shared/lib-provider/{public-api.d.ts → public-api.ts}

@@ -1,2 +1 @@
 export { provideSdc } from './provide-sdc';
-//# sourceMappingURL=public-api.d.ts.map

package/shared/ng-package.json

@@ -0,0 +1 @@
+{ "lib": { "entryFile": "public-api.ts" } }

package/shared/public-api.ts

@@ -0,0 +1,6 @@
+export * from './apply-theme-variables';
+export * from './format-value.pipe';
+export * from './lib-provider';
+export * from './screen-observer';
+export * from './theme-provider';
+export * from './types';

package/shared/screen-observer/{index.d.ts → index.ts}

@@ -1,3 +1,2 @@
 export * from './provide-screen-observer';
 export * from './screen-observer';
-//# sourceMappingURL=index.d.ts.map

package/shared/screen-observer/provide-screen-observer.ts

@@ -0,0 +1,17 @@
+// screen-helper.providers.ts
+import { InjectionToken, Provider } from '@angular/core';
+import { Size } from '../types';
+import { ScreenObserver } from './screen-observer';
+
+export const SCREENS_TOKEN = new InjectionToken<Record<Size, string>>('SCREENS_TOKEN');
+
+export function provideScreenObserver(screens: Record<Size, string>): Provider[] {
+  return [
+    { provide: SCREENS_TOKEN, useValue: screens },
+    {
+      provide: ScreenObserver,
+      deps: [SCREENS_TOKEN],
+      useFactory: (cfg: Record<Size, string>) => new ScreenObserver(cfg),
+    },
+  ];
+}

package/shared/screen-observer/screen-observer.ts

@@ -0,0 +1,56 @@
+import { computed, Signal, signal } from '@angular/core';
+import { toSignal } from '@angular/core/rxjs-interop';
+import { fromEvent, startWith } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { Size, SIZE_ORDER } from '../types';
+
+export class ScreenObserver {
+  // SIGNALS
+  private readonly _size = signal<Size>('md');
+
+  // CLASS PROPERTIES
+  private readonly breakpoints: Record<Size, number>;
+  public readonly size: Signal<Size> = this._size;
+  public readonly index!: Signal<number>;
+
+  public constructor(screens: Record<Partial<Size>, string>) {
+    this.breakpoints = Object.fromEntries(
+      Object.entries(screens).map(([k, v]) => [k, Number(v.replace('px', ''))])
+    ) as Record<Size, number>;
+
+    const resize$ = fromEvent(window, 'resize').pipe(
+      startWith(null),
+      map(() => this.getSize())
+    );
+
+    this.size = toSignal(resize$, { initialValue: this.getSize() });
+    this.index = computed(() => SIZE_ORDER.indexOf(this.size()));
+  }
+
+  public getSize(): Size {
+    const w = window.innerWidth;
+    if (w >= this.breakpoints?.['2xl']) return '2xl';
+    if (w >= this.breakpoints?.['xl']) return 'xl';
+    if (w >= this.breakpoints?.['lg']) return 'lg';
+    if (w >= this.breakpoints?.['md']) return 'md';
+    if (w >= this.breakpoints?.['sm']) return 'sm';
+    if (w >= this.breakpoints?.['xs']) return 'xs';
+    return 'xxs';
+  }
+
+  public isBiggerThan(screen: Size): boolean {
+    return window.innerWidth >= this.breakpoints?.[screen];
+  }
+
+  public isSmallerThan(screen: Size): boolean {
+    return window.innerWidth < this.breakpoints?.[screen];
+  }
+
+  public isBiggerThan$(screen: Size): boolean {
+    return this.index() >= SIZE_ORDER.indexOf(screen);
+  }
+
+  public isSmallerThan$(screen: Size): boolean {
+    return this.index() < SIZE_ORDER.indexOf(screen);
+  }
+}

package/shared/screen-observer/sizable-base.ts

@@ -0,0 +1,70 @@
+import { computed, Directive, input } from '@angular/core';
+import { Size, SIZE_ORDER } from '../types';
+
+@Directive()
+export abstract class SizableBase<TSupported extends Size> {
+  // Inputs shared by sizable components
+  public readonly size = input<Size>('md');
+  public readonly styleClass = input<string[]>([]);
+  public readonly className = input<string>('');
+
+  /** Component-specific config */
+  protected abstract readonly supportedSizes: readonly TSupported[];
+  protected abstract readonly fallbackSize: TSupported;
+
+  /** Floor any Size to the nearest supported size. */
+  protected normalizeSize = (s: Size): TSupported => {
+    const wantedIdx = SIZE_ORDER.indexOf(s);
+    if (wantedIdx === -1) return this.fallbackSize;
+    for (let i = wantedIdx; i >= 0; i--) {
+      const candidate = SIZE_ORDER[i];
+      if (this.supportedSizes.includes(candidate as TSupported)) {
+        return candidate as TSupported;
+      }
+    }
+    return this.fallbackSize;
+  };
+
+  /** Base validator: by default only allow universal size-* tokens. Subclasses widen this. */
+  protected validateStyleClass(classes: readonly string[]): string[] {
+    const allowedSizes = SIZE_ORDER.map(s => `size-${s}`);
+    return (classes ?? []).filter(c => allowedSizes.includes(c));
+  }
+
+  /** Validated styleClass as a signal; logs dropped tokens (same behavior you had). */
+  protected readonly _validatedStyleClass = computed(() => {
+    const classes = this.styleClass() ?? [];
+    const valid = this.validateStyleClass(classes);
+    if (valid.length !== classes.length) {
+      const invalid = classes.filter(c => !valid.includes(c));
+      if (invalid.length) {
+        console.warn(`${this.constructor.name}: Ignored invalid styleClass: ${invalid.join(', ')}`);
+      }
+    }
+    return valid;
+  });
+
+  /** Effective size: last size-* override wins; else normalized [size] input. */
+  protected readonly _effectiveSize = computed<TSupported>(() => {
+    const sc = this._validatedStyleClass();
+    const rawOverride = sc
+      .filter(c => c.startsWith('size-'))
+      .slice(-1)[0]
+      ?.replace(/^size-/, '') as Size | undefined;
+
+    if (rawOverride) return this.normalizeSize(rawOverride);
+    return this.normalizeSize(this.size());
+  });
+
+  /**
+   * Build final host classes:
+   * - keep ALL validated non-size tokens (align/orientation etc.) — nothing dropped
+   * - inject exactly one normalized `size-*` (matching your working code)
+   * - append `className` unchanged
+   */
+  protected buildHostClass(baseClasses: readonly string[]): string {
+    const nonSize = this._validatedStyleClass().filter(c => !c.startsWith('size-'));
+    const normalized = this._effectiveSize();
+    return [...baseClasses, `size-${normalized}`, ...nonSize, this.className()].filter(Boolean).join(' ');
+  }
+}

package/shared/theme-provider/generic-theme.ts

@@ -0,0 +1 @@
+//

package/shared/theme-provider/index.ts

@@ -0,0 +1 @@
+export * from './public-api';

package/shared/theme-provider/public-api.ts

@@ -0,0 +1 @@
+export * from './theme-provider.directive';

package/shared/theme-provider/theme-provider.directive.ts

@@ -0,0 +1,17 @@
+import { Directive, HostBinding, Inject } from '@angular/core';
+import { NG_SD_COMPONENTS_CONFIG } from '../lib-provider/config-token';
+import { type NgSdComponentsConfig } from '../types';
+
+@Directive({
+  standalone: true,
+  selector: '[themeProvider]',
+})
+export class ThemeProviderDirective {
+  @HostBinding('class') class: string = '';
+  theme: string = '';
+
+  constructor(@Inject(NG_SD_COMPONENTS_CONFIG) private configuration: NgSdComponentsConfig) {
+    this.theme = this.configuration.theme;
+    this.class = `theme-${this.theme}`;
+  }
+}

package/shared/themes/sdc.css

@@ -0,0 +1,153 @@
+:root {
+  /* Font Families */
+  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  --font-secondary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+
+  /* Font Sizes */
+  --text-xxs: 0.625rem; /* 8px - Small labels, captions */
+  --text-xs: 0.75rem; /* 12px - Small labels, captions */
+  --text-sm: 0.875rem; /* 14px - Table content, form labels */
+  --text-base: 1rem; /* 16px - Body text, buttons */
+  --text-lg: 1.125rem; /* 18px - Section headings */
+  --text-xl: 1.25rem; /* 20px - Page titles */
+  --text-2xl: 1.5rem; /* 24px - Main headings */
+
+  /* Font Weights */
+  --font-light: 300; /* Light text */
+  --font-regular: 400; /* Normal body text */
+  --font-medium: 500; /* Medium emphasis */
+  --font-semibold: 600; /* Section headings */
+  --font-bold: 700; /* Strong emphasis, buttons */
+
+  /* Line Heights */
+  --leading-tight: 1.25; /* Tight line height for headings */
+  --leading-normal: 1.5; /* Normal line height for body text */
+  --leading-relaxed: 1.625; /* Relaxed line height for readability */
+
+  /* Spacing Scale */
+  --space-0: 0; /* No spacing */
+  --space-px: 1px; /* 1px spacing */
+  --space-0_5: 0.125rem; /* 2px - Minimal spacing */
+  --space-1: 0.25rem; /* 4px - Very small spacing */
+  --space-1_5: 0.375rem; /* 6px - Small spacing */
+  --space-2: 0.5rem; /* 8px - Small padding/margin */
+  --space-2_5: 0.625rem; /* 10px - Button padding */
+  --space-3: 0.75rem; /* 12px - Form element spacing */
+  --space-3_5: 0.875rem; /* 14px - Medium spacing */
+  --space-4: 1rem; /* 16px - Standard spacing unit */
+  --space-5: 1.25rem; /* 20px - Section spacing */
+  --space-6: 1.5rem; /* 24px - Large spacing */
+  --space-7: 1.75rem; /* 28px - Extra spacing */
+  --space-8: 2rem; /* 32px - Large section spacing */
+  --space-10: 2.5rem; /* 40px - Very large spacing */
+  --space-12: 3rem; /* 48px - Header/footer spacing */
+  --space-16: 4rem; /* 64px - Major section dividers */
+  --space-20: 5rem; /* 80px - Large container spacing */
+  --space-24: 6rem; /* 96px - Extra large spacing */
+
+  /* Border Radius */
+  --radius-none: 0; /* No border radius */
+  --radius-sm: 0.125rem; /* 2px - Small radius */
+  --radius-default: 0.25rem; /* 4px - Default button/input radius */
+  --radius-md: 0.375rem; /* 6px - Medium radius for cards */
+  --radius-lg: 0.5rem; /* 8px - Large radius */
+  --radius-xl: 0.75rem; /* 12px - Extra large radius */
+  --radius-2xl: 1rem; /* 16px - Very large radius */
+  --radius-3xl: 1.5rem; /* 24px - Extra large radius */
+  --radius-full: 9999px; /* Full circular radius */
+
+  /* Border Widths */
+  --border-0: 0; /* No border */
+  --border-default: 1px; /* Default border width */
+  --border-2: 2px; /* Thick border */
+  --border-3: 3px; /* Thick border */
+  --border-4: 4px; /* Very thick border */
+  --border-6: 6px; /* Extra thick border */
+  --border-8: 8px; /* Extra thick border */
+
+  /* Neutral Colors */
+  --color-neutral-50: hsl(210 40% 98%); /* #f8fafc - Lightest background */
+  --color-neutral-100: hsl(210 40% 96%); /* #f1f5f9 - Light background, table headers */
+  --color-neutral-200: hsl(214 32% 91%); /* #e2e8f0 - Border colors, dividers */
+  --color-neutral-300: hsl(215 20% 83%); /* #cbd5e1 - Disabled states, subtle borders */
+  --color-neutral-400: hsl(215 16% 65%); /* #94a3b8 - Placeholder text, inactive elements */
+  --color-neutral-500: hsl(215 19% 47%); /* #64748b - Secondary text, icons */
+  --color-neutral-600: hsl(215 25% 35%); /* #475569 - Primary text color */
+  --color-neutral-700: hsl(215 28% 27%); /* #334155 - Dark text, headings */
+  --color-neutral-800: hsl(217 33% 17%); /* #1e293b - Very dark text */
+  --color-neutral-900: hsl(222 47% 11%); /* #0f172a - Darkest text, high contrast */
+  --color-pure-white: hsl(0 0% 100%); /* #ffffff - Pure white backgrounds */
+  --color-pure-black: hsl(0 0% 0%); /* #000000 - Pure black text */
+
+  /* Primary Colors - Club Brand */
+  --color-primary: hsl(29.01 100% 52.55%); /* #ff8c00 - Main Club brand color */
+  --color-primary-hover: hsl(29.01 100% 44%); /* #e67e00 - Darker orange for hover states */
+  --color-primary-active: hsl(29.01 100% 36%); /* #cc7000 - Even darker for active/pressed states */
+  --color-primary-50: hsl(29.01 100% 97%); /* #fff8f0 - Very light orange background */
+  --color-primary-100: hsl(29.01 100% 91%); /* #fff0d7 - Light orange background */
+  --color-primary-200: hsl(29.01 100% 84%); /* #ffe8c0 - Soft orange for highlights */
+
+  /* Secondary Colors - Navy Blue */
+  --color-secondary: hsl(218.73 72.48% 21.37%); /* #1a2b4a - Deep navy blue for secondary actions */
+  --color-secondary-hover: hsl(218.73 72.48% 28%); /* #2a3f6a - Lighter navy for hover */
+  --color-secondary-active: hsl(218.73 72.48% 35%); /* #3a538a - Active state navy */
+  --color-secondary-50: hsl(218.73 72.48% 97%); /* #f7f9fc - Very light blue background */
+  --color-secondary-100: hsl(218.73 72.48% 93%); /* #eef2f9 - Light blue background */
+  --color-secondary-200: hsl(218.73 72.48% 87%); /* #e0e7f3 - Soft blue for highlights */
+
+  /* Alternative Colors - Light Blue/Cyan */
+  --color-alternative: hsl(199 89% 48%); /* #0ea5e9 - Cyan blue for alternative actions */
+  --color-alternative-hover: hsl(198 93% 39%); /* #0284c7 - Darker cyan for hover */
+  --color-alternative-active: hsl(201 96% 32%); /* #0369a1 - Active state cyan */
+  --color-alternative-50: hsl(204 100% 97%); /* #f0f9ff - Very light cyan background */
+  --color-alternative-100: hsl(204 94% 94%); /* #e0f2fe - Light cyan background */
+
+  /* Success Colors */
+  --color-success: hsl(158 64% 52%); /* #10b981 - Green for completed transactions, success states */
+  --color-success-hover: hsl(160 84% 39%); /* #059669 - Darker green for hover */
+  --color-success-active: hsl(161 94% 30%); /* #047857 - Active state green */
+  --color-success-50: hsl(151 81% 96%); /* #ecfdf5 - Light success background */
+  --color-success-100: hsl(149 80% 90%); /* #d1fae5 - Success message backgrounds */
+
+  /* Warning Colors */
+  --color-warning: hsl(43 96% 56%); /* #f59e0b - Amber/orange for warnings, pending states */
+  --color-warning-hover: hsl(32 95% 44%); /* #d97706 - Darker amber for hover */
+  --color-warning-active: hsl(30 100% 34%); /* #b45309 - Active state amber */
+  --color-warning-50: hsl(48 100% 96%); /* #fffbeb - Light warning background */
+  --color-warning-100: hsl(48 96% 89%); /* #fef3c7 - Warning message backgrounds */
+
+  /* Danger Colors */
+  --color-danger: hsl(0 72% 51%); /* #ef4444 - Red for cancelled transactions, errors, delete actions */
+  --color-danger-hover: hsl(0 73% 41%); /* #dc2626 - Darker red for hover */
+  --color-danger-active: hsl(0 79% 30%); /* #b91c1c - Active state red */
+  --color-danger-50: hsl(0 86% 97%); /* #fef2f2 - Light error background */
+  --color-danger-100: hsl(0 93% 94%); /* #fee2e2 - Error message backgrounds */
+
+  /*
+  * -----------------------------------------------------------
+  * Spartan UI standard theme (Updated with SDC color mappings)
+  * -----------------------------------------------------------
+  */
+  --font-sans: 'Geist Sans', sans-serif;
+  --background: var(--color-pure-white);
+  --foreground: var(--color-neutral-600);
+  --card: var(--color-pure-white);
+  --card-foreground: var(--color-neutral-600);
+  --popover: var(--color-pure-white);
+  --popover-foreground: var(--color-neutral-600);
+  --primary: var(--color-primary);
+  --primary-foreground: var(--color-pure-white);
+  --secondary: var(--color-neutral-100);
+  --secondary-foreground: var(--color-neutral-600);
+  --muted: var(--color-neutral-50);
+  --muted-foreground: var(--color-neutral-500);
+  --accent: var(--color-primary-200);
+  --accent-foreground: var(--color-neutral-700);
+  --destructive: var(--color-danger);
+  --destructive-foreground: var(--color-pure-white);
+  --border: var(--color-neutral-200);
+  --input: var(--color-neutral-200);
+  --ring: var(--color-primary);
+  --radius: var(--radius-lg);
+  color-scheme: light;
+}

package/shared/types.ts

@@ -0,0 +1,18 @@
+export const SIZES = { xxs: 'xxs', xs: 'xs', sm: 'sm', md: 'md', lg: 'lg', xl: 'xl', '2xl': '2xl' } as const;
+
+export type Size = (typeof SIZES)[keyof typeof SIZES];
+
+/** Ordered array for size comparison logic */
+export const SIZE_ORDER: Size[] = ['xxs', 'xs', 'sm', 'md', 'lg', 'xl', '2xl'];
+
+export type NgPipes = 'none' | 'currency' | 'date';
+
+export type NgSdComponentsConfigValues = 'generic' | 'backoffice' | 'sdc';
+
+export interface NgSdComponentsConfig {
+  theme: NgSdComponentsConfigValues;
+}
+
+type Theme = 'backoffice' | 'sdc';
+
+export type ThemeClass = `theme-${Theme}`;

package/src/private-exports.ts

@@ -0,0 +1 @@
+export { validateStylesForComponent } from '../utils';

package/src/public-api.ts

@@ -0,0 +1,20 @@
+/**
+ * MAIN ENTRY POINT (@3ddv/software-division-components)
+ *
+ * This file exports ONLY the configuration tokens, global providers, and shared utilities.
+ *
+ * UI Components and Feature Modules are NOT exported here. They must be imported via their secondary entry points:
+ * - import { ... } from '@3ddv/software-division-components/generic/button';
+ * - import { ... } from '@3ddv/software-division-components/backoffice/table';
+ *
+ * See libs/ticketing-598-software-division-components-npm/docs/entrypoint_strategy.md for details.
+ */
+
+export type * from '@3ddv/software-division-components/shared';
+export {
+  ScreenObserver,
+  applyGlobalCssVariables,
+  provideScreenObserver,
+  provideSdc,
+  type SCREENS_TOKEN,
+} from '@3ddv/software-division-components/shared';

package/styles.css

@@ -1,2 +1,46 @@
-/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
-.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;width:100%;height:100%;top:0;left:0}.cdk-overlay-container{z-index:1000;position:fixed}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{z-index:1000;display:flex;position:absolute}.cdk-overlay-pane{pointer-events:auto;box-sizing:border-box;z-index:1000;max-width:100%;max-height:100%;display:flex;position:absolute}.cdk-overlay-backdrop{pointer-events:auto;-webkit-tap-highlight-color:#0000;opacity:0;touch-action:manipulation;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1);position:absolute;inset:0}@media (prefers-reduced-motion){.cdk-overlay-backdrop{transition-duration:1ms}}.cdk-overlay-backdrop-showing{opacity:1}@media (forced-colors:active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{visibility:hidden;opacity:1;transition:visibility 1ms linear,opacity 1ms linear}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{z-index:1000;flex-direction:column;min-width:1px;min-height:1px;display:flex;position:absolute}.cdk-global-scrollblock{width:100%;position:fixed;overflow-y:scroll}:root,:host{--radius-sm:calc(var(--radius) - 4px);--radius-md:calc(var(--radius) - 2px);--radius-lg:var(--radius);--radius-xl:calc(var(--radius) + 4px);--color-primary:var(--primary);--color-secondary:var(--secondary)}@keyframes indeterminate{0%{transform:translate(-100%)scaleX(.5)}to{transform:translate(100%)scaleX(.5)}}:root{--font-primary:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-secondary:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--text-xxs:.625rem;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--font-light:300;--font-regular:400;--font-medium:500;--font-semibold:600;--font-bold:700;--leading-tight:1.25;--leading-normal:1.5;--leading-relaxed:1.625;--space-0:0;--space-px:1px;--space-0_5:.125rem;--space-1:.25rem;--space-1_5:.375rem;--space-2:.5rem;--space-2_5:.625rem;--space-3:.75rem;--space-3_5:.875rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-7:1.75rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--radius-none:0;--radius-sm:.125rem;--radius-default:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--border-0:0;--border-default:1px;--border-2:2px;--border-3:3px;--border-4:4px;--border-6:6px;--border-8:8px;--color-neutral-50:#f8fafc;--color-neutral-100:#f1f5f9;--color-neutral-200:#e1e7ef;--color-neutral-300:#cbd2dc;--color-neutral-400:#97a3b4;--color-neutral-500:#61748f;--color-neutral-600:#435670;--color-neutral-700:#324258;--color-neutral-800:#1d283a;--color-neutral-900:#0f1729;--color-pure-white:#fff;--color-pure-black:#000;--color-primary:#ff820d;--color-primary-hover:#e06c00;--color-primary-active:#b85900;--color-primary-50:#fff7f0;--color-primary-100:#ffe7d1;--color-primary-200:#ffd5ad;--color-secondary:#0f2b5e;--color-secondary-hover:#14387b;--color-secondary-active:#19469a;--color-secondary-50:#f2f6fd;--color-secondary-100:#e0e9fa;--color-secondary-200:#c6d7f6;--color-alternative:#0da2e7;--color-alternative-hover:#0788c0;--color-alternative-active:#0369a0;--color-alternative-50:#f0f9ff;--color-alternative-100:#e1f3fe;--color-success:#36d399;--color-success-hover:#10b77f;--color-success-active:#059467;--color-success-50:#edfdf5;--color-success-100:#d1fae5;--color-warning:#fbbd23;--color-warning-hover:#db7706;--color-warning-active:#ad5700;--color-warning-50:#fffbeb;--color-warning-100:#fef3c8;--color-danger:#dc2828;--color-danger-hover:#b51c1c;--color-danger-active:#891010;--color-danger-50:#fef1f1;--color-danger-100:#fee1e1;--font-sans:"Geist Sans",sans-serif;--background:var(--color-pure-white);--foreground:var(--color-neutral-600);--card:var(--color-pure-white);--card-foreground:var(--color-neutral-600);--popover:var(--color-pure-white);--popover-foreground:var(--color-neutral-600);--primary:var(--color-primary);--primary-foreground:var(--color-pure-white);--secondary:var(--color-neutral-100);--secondary-foreground:var(--color-neutral-600);--muted:var(--color-neutral-50);--muted-foreground:var(--color-neutral-500);--accent:var(--color-primary-200);--accent-foreground:var(--color-neutral-700);--destructive:var(--color-danger);--destructive-foreground:var(--color-pure-white);--border:var(--color-neutral-200);--input:var(--color-neutral-200);--ring:var(--color-primary);--radius:var(--radius-lg);color-scheme:light}@media (max-width:1024px){.cdk-overlay-pane:has(>hlm-select-content),.cdk-overlay-pane:has(>hlm-select-content.full-width){width:100%!important;left:0!important;right:0!important}}:root{--p-button-primary-color:white!important;--p-button-primary-contrast-color:white!important;--p-button-primary-hover-color:white!important}.sdc-datepicker{--sdc-datepicker-label-color:var(--color-neutral-700);--sdc-datepicker-label-size:var(--text-base);--sdc-datepicker-label-weight:var(--font-semibold);--sdc-datepicker-label-gap:var(--space-6);--sdc-datepicker-label-width:auto;--sdc-datepicker-input-width:100%;--sdc-datepicker-input-background:var(--color-pure-white);--sdc-datepicker-input-border-color:var(--color-neutral-300);--sdc-datepicker-input-border-width:var(--border-default);--sdc-datepicker-input-border-radius:var(--radius-full);--sdc-datepicker-input-padding-vertical:var(--space-2);--sdc-datepicker-input-padding-horizontal:var(--space-3);--sdc-datepicker-input-text-color:var(--color-neutral-900);--sdc-datepicker-input-text-size:var(--text-base);--sdc-datepicker-input-text-weight:var(--font-medium);--sdc-datepicker-input-border-hover:var(--color-neutral-500);--sdc-datepicker-input-focus-ring-width:var(--border-default);--sdc-datepicker-input-focus-ring-color:var(--color-primary);--sdc-datepicker-input-focus-ring-offset:var(--border-2);--sdc-datepicker-placeholder-color:var(--color-neutral-500);--sdc-datepicker-placeholder-size:var(--text-sm);--sdc-datepicker-placeholder-weight:var(--font-medium);--sdc-datepicker-hint-color:var(--color-neutral-600);--sdc-datepicker-hint-size:var(--text-xs);--sdc-datepicker-error-color:var(--color-danger);--sdc-datepicker-error-size:var(--text-xs);--sdc-datepicker-calendar-background:var(--color-pure-white);--sdc-datepicker-calendar-border-color:var(--color-neutral-200);--sdc-datepicker-calendar-border-width:var(--border-default);--sdc-datepicker-calendar-border-radius:var(--radius-lg);--sdc-datepicker-calendar-shadow:0 1px 3px #00000014;--sdc-datepicker-calendar-padding:var(--space-4);--sdc-datepicker-month-year-text-color:var(--color-neutral-900);--sdc-datepicker-month-year-text-size:var(--text-base);--sdc-datepicker-month-year-text-weight:var(--font-semibold);--sdc-datepicker-month-year-hover-text-color:var(--color-neutral-900);--sdc-datepicker-month-year-padding:var(--space-2);--sdc-datepicker-month-year-button-background:var(--color-pure-white);--sdc-datepicker-month-year-button-text-color-hover:var(--color-pure-white);--sdc-datepicker-month-year-button-background-hover:var(--color-neutral-900);--sdc-datepicker-day-button-disabled-background:transparent;--sdc-datepicker-day-button-disabled-text-color:var(--color-neutral-300);--sdc-datepicker-day-button-background:transparent;--sdc-datepicker-day-button-text-color:var(--color-neutral-900);--sdc-datepicker-day-button-text-size:var(--text-sm);--sdc-datepicker-day-button-text-weight:var(--font-semibold);--sdc-datepicker-day-button-border-radius:var(--radius-md);--sdc-datepicker-day-button-padding:var(--space-2);--sdc-datepicker-day-button-hover-background:var(--color-secondary);--sdc-datepicker-day-button-hover-text-color:var(--color-pure-white)}.component-container{gap:var(--sdc-datepicker-label-gap);width:var(--sdc-datepicker-input-width);flex-direction:column;display:flex}.component-container hlm-date-picker{width:var(--sdc-datepicker-input-width)}.sdc-datepicker-label{font-weight:var(--sdc-datepicker-label-weight);font-size:var(--sdc-datepicker-label-size);color:hsl(var(--sdc-datepicker-label-color));width:var(--sdc-datepicker-label-width);padding-left:var(--sdc-datepicker-input-padding-horizontal);line-height:1.25rem;display:block}.component-container:has(.sdc-datepicker-label.left){flex-direction:row;align-items:center;padding-left:0}.sdc-datepicker button[brnpopovertrigger]{width:var(--sdc-datepicker-input-width);background:var(--sdc-datepicker-input-background);border:var(--sdc-datepicker-input-border-width)solid hsl(var(--sdc-datepicker-input-border-color));border-radius:var(--sdc-datepicker-input-border-radius);padding:var(--sdc-datepicker-input-padding-vertical)var(--sdc-datepicker-input-padding-horizontal);color:hsl(var(--sdc-datepicker-input-text-color));font-size:var(--sdc-datepicker-input-text-size);font-weight:var(--sdc-datepicker-input-text-weight);cursor:pointer;outline:none}.sdc-datepicker-placeholder{color:hsl(var(--sdc-datepicker-placeholder-color));font-size:var(--sdc-datepicker-placeholder-size);font-weight:var(--sdc-datepicker-placeholder-weight)}.sdc-datepicker button[brnpopovertrigger]:hover:not(:disabled){border-color:hsl(var(--sdc-datepicker-input-border-hover))}.sdc-datepicker button[brnpopovertrigger][data-state=open]{outline:var(--sdc-datepicker-input-focus-ring-width)solid hsl(var(--sdc-datepicker-input-focus-ring-color));outline-offset:var(--sdc-datepicker-input-focus-ring-offset)}.sdc-datepicker button[brnpopovertrigger]:disabled{opacity:.6;cursor:not-allowed;background:hsl(var(--color-neutral-100))}.sdc-datepicker-error{color:hsl(var(--sdc-datepicker-error-color));font-size:var(--sdc-datepicker-error-size);line-height:1rem}.sdc-datepicker-hint{color:hsl(var(--sdc-datepicker-hint-color));font-size:var(--sdc-datepicker-hint-size);line-height:1rem}.sdc-datepicker div[brncalendar]{background:hsl(var(--sdc-datepicker-calendar-background));border:var(--sdc-datepicker-calendar-border-width)solid hsl(var(--sdc-datepicker-calendar-border-color));border-radius:var(--sdc-datepicker-calendar-border-radius);box-shadow:var(--sdc-datepicker-calendar-shadow);padding:var(--sdc-datepicker-calendar-padding)}.sdc-datepicker div[brncalendarheader]{color:hsl(var(--sdc-datepicker-month-year-text-color));font-size:var(--sdc-datepicker-month-year-text-size);font-weight:var(--sdc-datepicker-month-year-text-weight);padding:var(--sdc-datepicker-month-year-padding)}.sdc-datepicker button[brncalendarpreviousbutton],.sdc-datepicker button[brncalendarnextbutton]{cursor:pointer;color:hsl(var(--sdc-datepicker-month-year-text-color));background:hsl(var(--sdc-datepicker-month-year-button-background));transition:all .2s}.sdc-datepicker button[brncalendarpreviousbutton]:disabled,.sdc-datepicker button[brncalendarnextbutton]:disabled{opacity:.6;cursor:not-allowed;color:hsl(var(--color-neutral-100))}.sdc-datepicker button[brncalendarpreviousbutton]:hover:not(:disabled),.sdc-datepicker button[brncalendarnextbutton]:hover:not(:disabled){color:hsl(var(--sdc-datepicker-month-year-button-text-color-hover));background:hsl(var(--sdc-datepicker-month-year-button-background-hover))}.sdc-datepicker button[brncalendarcellbutton]{background:hsl(var(--sdc-datepicker-day-button-background));color:hsl(var(--sdc-datepicker-day-button-text-color));font-size:var(--sdc-datepicker-day-button-text-size);font-weight:var(--sdc-datepicker-day-button-text-weight);border-radius:var(--sdc-datepicker-day-button-border-radius);padding:var(--sdc-datepicker-day-button-padding);cursor:pointer;transition:all .2s}.sdc-datepicker button[brncalendarcellbutton]:hover:not(:disabled){background-color:hsl(var(--sdc-datepicker-day-button-hover-background));color:hsl(var(--sdc-datepicker-day-button-hover-text-color))}.sdc-datepicker button[brncalendarcellbutton]:disabled{background-color:hsl(var(--sdc-datepicker-day-button-disabled-background));color:hsl(var(--sdc-datepicker-day-button-disabled-text-color));cursor:not-allowed}.variant-primary.sdc-datepicker{--sdc-datepicker-day-button-hover-background:var(--color-primary)}.variant-secondary.sdc-datepicker{--sdc-datepicker-day-button-hover-background:var(--color-secondary)}.variant-alternative.sdc-datepicker{--sdc-datepicker-day-button-hover-background:var(--color-alternative)}.variant-success.sdc-datepicker{--sdc-datepicker-day-button-hover-background:var(--color-success)}.variant-warning.sdc-datepicker{--sdc-datepicker-day-button-hover-background:var(--color-warning)}.variant-danger.sdc-datepicker{--sdc-datepicker-day-button-hover-background:var(--color-danger)}.radius-default.sdc-datepicker{--sdc-datepicker-input-border-radius:var(--radius-default);--sdc-datepicker-day-button-border-radius:var(--radius-default)}.radius-sm.sdc-datepicker{--sdc-datepicker-input-border-radius:var(--radius-sm);--sdc-datepicker-day-button-border-radius:var(--radius-sm)}.radius-md.sdc-datepicker{--sdc-datepicker-input-border-radius:var(--radius-md);--sdc-datepicker-day-button-border-radius:var(--radius-md)}.radius-lg.sdc-datepicker{--sdc-datepicker-input-border-radius:var(--radius-lg);--sdc-datepicker-day-button-border-radius:var(--radius-lg)}.radius-xl.sdc-datepicker{--sdc-datepicker-input-border-radius:var(--radius-xl);--sdc-datepicker-day-button-border-radius:var(--radius-xl)}.dialog-overlay-margin{margin:0 1rem}.sdc-ripple{background-color:var(--sdc-button-ripple-color);pointer-events:none;border-radius:50%;animation:.6s linear ripple-animation;position:absolute;transform:scale(0)}@keyframes ripple-animation{to{opacity:0;transform:scale(4)}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0)scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0))}}
+@import 'tailwindcss';
+@import '@angular/cdk/overlay-prebuilt.css';
+@import '@spartan-ng/brain/hlm-tailwind-preset.css';
+
+@source "./**/*.{html,ts}";
+
+@theme {
+  --color-white: rgb(255 255 255);
+}
+
+/* Import themes */
+@import './shared/themes/sdc.css';
+
+/* Select component adjustments */
+@media (max-width: 1024px) {
+  .cdk-overlay-pane:has(> hlm-select-content),
+  .cdk-overlay-pane:has(> hlm-select-content.full-width) {
+    width: 100% !important;
+    left: 0 !important;
+    right: 0 !important;
+  }
+}
+/* Import component styles */
+@import './generic/braintree/braintree.component.css';
+@import './backoffice/datepicker/datepicker.component.css';
+
+.dialog-overlay-margin {
+  margin: 0 1rem;
+}
+
+/* Ripple effect styles */
+.sdc-ripple {
+  position: absolute;
+  border-radius: 50%;
+  background-color: var(--sdc-button-ripple-color);
+  transform: scale(0);
+  animation: ripple-animation 0.6s linear;
+  pointer-events: none;
+}
+
+@keyframes ripple-animation {
+  to {
+    transform: scale(4);
+    opacity: 0;
+  }
+}

package/tsconfig.json

@@ -0,0 +1,50 @@
+{
+  "extends": "../../tsconfig.json",
+  "exclude": ["node_modules"],
+  "compilerOptions": {
+    "baseUrl": ".",
+    "rootDir": ".",
+    "outDir": "../../dist",
+    "paths": {
+      "@backoffice/*": ["./backoffice/*"],
+      "@utils/*": ["./utils"],
+      "@shared/*": ["./shared/*"],
+      "@dvm/*": ["./dvm/*"],
+      "@generic/*": ["./generic/*"],
+      "@3ddv/software-division-components/utils": ["./utils/public-api.ts"],
+      "@3ddv/software-division-components/shared": ["./shared/public-api.ts"],
+      "@3ddv/software-division-components/backoffice/checkbox": ["./backoffice/checkbox/public-api.ts"],
+      "@3ddv/software-division-components/backoffice/datepicker": ["./backoffice/datepicker/public-api.ts"],
+      "@3ddv/software-division-components/backoffice/input": ["./backoffice/input/public-api.ts"],
+      "@3ddv/software-division-components/backoffice/radio": ["./backoffice/radio/public-api.ts"],
+      "@3ddv/software-division-components/backoffice/table": ["./backoffice/table/public-api.ts"],
+      "@3ddv/software-division-components/generic/select": ["./generic/select/public-api.ts"],
+      "@3ddv/software-division-components/generic/add-digital-wallet": ["./generic/add-digital-wallet/public-api.ts"],
+      "@3ddv/software-division-components/generic/braintree": ["./generic/braintree/public-api.ts"],
+      "@3ddv/software-division-components/generic/button": ["./generic/button/public-api.ts"],
+      "@3ddv/software-division-components/generic/dialog": ["./generic/dialog/public-api.ts"],
+      "@3ddv/software-division-components/generic/drawer": ["./generic/drawer/public-api.ts"],
+      "@3ddv/software-division-components/generic/icon": ["./generic/icon/public-api.ts"],
+      "@3ddv/software-division-components/dvm/cart-item": ["./dvm/cart-item/public-api.ts"],
+      "@3ddv/software-division-components/dvm/cart": ["./dvm/cart/public-api.ts"],
+      "@3ddv/software-division-components/dvm/legend": ["./dvm/legend/public-api.ts"],
+      "@3ddv/software-division-components/dvm/loader": ["./dvm/loader/public-api.ts"],
+      "@3ddv/software-division-components/dvm/neighbors": ["./dvm/neighbors/public-api.ts"],
+      "@3ddv/software-division-components/dvm/popover": ["./dvm/popover/public-api.ts"],
+      "@3ddv/software-division-components/dvm/stepper": ["./dvm/stepper/public-api.ts"],
+      "@3ddv/software-division-components/dvm/map-loader": ["./dvm/map-loader/public-api.ts"],
+      "@3ddv/software-division-components/dvm/ticket-info-item": ["./dvm/ticket-info-item/public-api.ts"]
+    }
+  },
+  "angularCompilerOptions": {
+    "disableTypeScriptVersionCheck": true,
+    "fullTemplateTypeCheck": true,
+    "annotateForClosureCompiler": false,
+    "strictTemplates": true,
+    "strictMetadataEmit": true,
+    "skipTemplateCodegen": false,
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true
+  }
+}

package/tsconfig.lib.prod.json

@@ -0,0 +1,6 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "declarationMap": false
+  }
+}

package/tsconfig.spec.json

@@ -0,0 +1,15 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "include": [
+    "**/*.spec.ts",
+    "**/*.d.ts"
+  ]
+}

package/tsconfig.temp.json

@@ -0,0 +1 @@
+{"compileOnSave": false, "compilerOptions": {"baseUrl": ".", "outDir": "./dist", "module": "es2020", "sourceMap": true, "declaration": true, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es2020", "types": [], "lib": ["es2018", "dom"]}, "angularCompilerOptions": {"enableIvy": true}}

package/utils/index.ts

@@ -0,0 +1 @@
+export * from './public-api';

package/utils/ng-package.json

@@ -0,0 +1 @@
+{ "lib": { "entryFile": "public-api.ts" } }

package/utils/public-api.ts

@@ -0,0 +1 @@
+export * from './validate-styles-for-component';