@pure-ds/core 0.5.61 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/dist/types/packages/pds-configurator/src/pds-home-content.d.ts +375 -0
  2. package/dist/types/packages/pds-configurator/src/pds-home-content.d.ts.map +1 -0
  3. package/dist/types/packages/pds-configurator/src/pds-home.d.ts +2 -0
  4. package/dist/types/packages/pds-configurator/src/pds-home.d.ts.map +1 -0
  5. package/dist/types/pds.config.d.ts +2 -2
  6. package/dist/types/pds.config.d.ts.map +1 -1
  7. package/dist/types/pds.d.ts +3 -0
  8. package/dist/types/public/assets/js/pds-manager.d.ts +144 -429
  9. package/dist/types/public/assets/js/pds-manager.d.ts.map +1 -1
  10. package/dist/types/public/assets/js/pds.d.ts +3 -4
  11. package/dist/types/public/assets/js/pds.d.ts.map +1 -1
  12. package/dist/types/public/assets/pds/components/pds-live-edit.d.ts +150 -0
  13. package/dist/types/public/assets/pds/components/pds-live-edit.d.ts.map +1 -0
  14. package/dist/types/public/assets/pds/components/pds-omnibox.d.ts +2 -0
  15. package/dist/types/public/assets/pds/components/pds-omnibox.d.ts.map +1 -1
  16. package/dist/types/public/assets/pds/components/pds-richtext.d.ts.map +1 -1
  17. package/dist/types/public/assets/pds/components/pds-theme.d.ts +5 -0
  18. package/dist/types/public/assets/pds/components/pds-theme.d.ts.map +1 -1
  19. package/dist/types/src/js/pds-core/pds-config.d.ts +3 -0
  20. package/dist/types/src/js/pds-core/pds-config.d.ts.map +1 -1
  21. package/dist/types/src/js/pds-core/pds-enhancers.d.ts.map +1 -1
  22. package/dist/types/src/js/pds-core/pds-live.d.ts.map +1 -1
  23. package/dist/types/src/js/pds-core/pds-ontology.d.ts.map +1 -1
  24. package/dist/types/src/js/pds-core/pds-theme-utils.d.ts +6 -0
  25. package/dist/types/src/js/pds-core/pds-theme-utils.d.ts.map +1 -0
  26. package/dist/types/src/js/pds.d.ts.map +1 -1
  27. package/package.json +1 -4
  28. package/packages/pds-cli/bin/templates/bootstrap/pds.config.js +1 -1
  29. package/public/assets/js/app.js +106 -5636
  30. package/public/assets/js/pds-manager.js +137 -137
  31. package/public/assets/js/pds.js +7 -7
  32. package/public/assets/pds/components/pds-live-edit.js +1555 -0
  33. package/public/assets/pds/components/pds-omnibox.js +558 -369
  34. package/public/assets/pds/components/pds-richtext.js +57 -7
  35. package/public/assets/pds/components/pds-theme.js +58 -0
  36. package/readme.md +2 -2
  37. package/src/js/pds-core/pds-config.js +21 -3
  38. package/src/js/pds-core/pds-enhancers.js +61 -4
  39. package/src/js/pds-core/pds-live.js +180 -1
  40. package/src/js/pds-core/pds-ontology.js +8 -0
  41. package/src/js/pds-core/pds-theme-utils.js +33 -0
  42. package/src/js/pds.d.ts +3 -0
  43. package/src/js/pds.js +22 -0
@@ -1,12 +1,11 @@
1
- export { bt as startLive };
2
- declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setupSystemListenerIfNeeded: o }: {
1
+ export function startLive(PDS2: any, config: any, { emitReady, applyResolvedTheme, setupSystemListenerIfNeeded }: {
3
2
  emitReady: any;
4
3
  applyResolvedTheme: any;
5
4
  setupSystemListenerIfNeeded: any;
6
5
  }): Promise<{
7
6
  generator: {
8
- "__#private@#e": any;
9
- "__#private@#a": any;
7
+ "__#private@#layers": any;
8
+ "__#private@#stylesheets": any;
10
9
  options: {
11
10
  debug: boolean;
12
11
  };
@@ -118,9 +117,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
118
117
  hover: string;
119
118
  };
120
119
  };
121
- spacing: {
122
- 0: string;
123
- };
120
+ spacing: string;
124
121
  radius: {
125
122
  none: string;
126
123
  xs: string;
@@ -335,9 +332,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
335
332
  hover: string;
336
333
  };
337
334
  };
338
- spacing: {
339
- 0: string;
340
- };
335
+ spacing: string;
341
336
  radius: {
342
337
  none: string;
343
338
  xs: string;
@@ -444,13 +439,13 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
444
439
  externalPath: any;
445
440
  };
446
441
  };
447
- "__#private@#M"(t?: {}): {
442
+ "__#private@#resolveShadowOpacityConfig"(config?: {}): {
448
443
  light: number;
449
444
  dark: number;
450
445
  };
451
- "__#private@#m"(t: any): number;
452
- "__#private@#h"(t: {}, e: any): {};
453
- "__#private@#E"(t: any, e?: {}): {
446
+ "__#private@#normalizeOpacity"(value: any): number;
447
+ "__#private@#mergeShadowConfig"(layersConfig: {}, baseShadowOpacity: any): {};
448
+ "__#private@#generateColorTokens"(colorConfig: any, shadowOpacityConfig?: {}): {
454
449
  primary: {
455
450
  50: string;
456
451
  100: string;
@@ -557,7 +552,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
557
552
  hover: string;
558
553
  };
559
554
  };
560
- "__#private@#r"(t: any): {
555
+ "__#private@#generateColorScale"(baseColor: any): {
561
556
  50: string;
562
557
  100: string;
563
558
  200: string;
@@ -569,9 +564,9 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
569
564
  800: string;
570
565
  900: string;
571
566
  };
572
- "__#private@#F"(t: any): string;
573
- "__#private@#C"(t: any): string;
574
- "__#private@#f"(t: any): {
567
+ "__#private@#deriveSuccessColor"(mainColor: any): string;
568
+ "__#private@#deriveDangerColor"(mainColor: any): string;
569
+ "__#private@#generateGrayScale"(supportingColor: any): {
575
570
  50: string;
576
571
  100: string;
577
572
  200: string;
@@ -583,7 +578,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
583
578
  800: string;
584
579
  900: string;
585
580
  };
586
- "__#private@#b"(t: any): {
581
+ "__#private@#generateBackgroundShades"(backgroundBase: any): {
587
582
  base: any;
588
583
  subtle: string;
589
584
  elevated: string;
@@ -592,16 +587,16 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
592
587
  inverse: string;
593
588
  hover: string;
594
589
  };
595
- "__#private@#T"(t: any): {
590
+ "__#private@#generateFieldsetAdaptiveColors"(backgroundShades: any): {
596
591
  base: any;
597
592
  subtle: any;
598
593
  elevated: any;
599
594
  sunken: string;
600
595
  overlay: any;
601
596
  };
602
- "__#private@#L"(t: any, e?: number): string;
603
- "__#private@#y"(t: any): string;
604
- "__#private@#R"(t: any, e?: string, r?: {}): {
597
+ "__#private@#darkenColor"(hexColor: any, factor?: number): string;
598
+ "__#private@#generateSmartDarkBackground"(lightBackground: any): string;
599
+ "__#private@#generateDarkModeColors"(lightColors: any, backgroundBase?: string, overrides?: {}): {
605
600
  surface: {
606
601
  fieldset: {
607
602
  base: any;
@@ -627,34 +622,48 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
627
622
  warning: {};
628
623
  danger: {};
629
624
  };
630
- "__#private@#l"(t: any): {
625
+ "__#private@#hexToRgb"(hex: any): {
631
626
  r: number;
632
627
  g: number;
633
628
  b: number;
634
629
  };
635
- "__#private@#p"(t: any): number;
636
- "__#private@#d"(t: any, e: any): number;
637
- "__#private@#v"(t: any, e?: number): string;
638
- "__#private@#x"(t: any, e?: number): string;
639
- "__#private@#A"(t: any, e: any, r?: number): string;
640
- "__#private@#W"(t: any, e: any, r: any): string;
641
- "__#private@#j"(t: any): {
630
+ "__#private@#luminance"(hex: any): number;
631
+ "__#private@#contrastRatio"(aHex: any, bHex: any): number;
632
+ "__#private@#findReadableOnColor"(bgHex: any, target?: number): "#ffffff" | "#000000";
633
+ "__#private@#rgbaFromHex"(hex: any, alpha?: number): string;
634
+ "__#private@#mixTowards"(sourceHex: any, targetHex: any, factor?: number): string;
635
+ "__#private@#rgbToHex"(r: any, g: any, b: any): string;
636
+ "__#private@#generateDarkModeFieldsetColors"(darkSurface: any): {
642
637
  base: any;
643
638
  subtle: any;
644
639
  elevated: string;
645
640
  sunken: any;
646
641
  overlay: string;
647
642
  };
648
- "__#private@#B"(t?: {}, e?: string, r?: number): any;
649
- "__#private@#w"(t?: {}, e?: number): any;
650
- "__#private@#k"(t: any, e?: {}): {};
651
- "__#private@#S"(t: any, e?: number): string;
652
- "__#private@#i"(t: any): {};
653
- "__#private@#N"(t: any, e?: number): string;
654
- generateSpacingTokens(t: any): {
655
- 0: string;
656
- };
657
- "__#private@#U"(t: any): {
643
+ /**
644
+ * Pick a readable primary shade on a given surface background, targeting AA contrast.
645
+ * Returns the first shade that meets target from a preferred order; falls back to the best ratio.
646
+ */
647
+ "__#private@#pickReadablePrimaryOnSurface"(primaryScale?: {}, surfaceBg?: string, target?: number): any;
648
+ "__#private@#pickFillShadeForWhite"(scale?: {}, target?: number): any;
649
+ /**
650
+ * Generate smart surface tokens with context-aware colors for text, icons, shadows, and borders.
651
+ * Each surface variant gets its own semantic tokens that automatically adapt to the surface's luminance.
652
+ *
653
+ * @param {Object} surfaceShades - Object with surface color variants (base, subtle, elevated, etc.)
654
+ * @returns {Object} Smart tokens for each surface with text, icon, shadow, and border colors
655
+ */
656
+ "__#private@#generateSmartSurfaceTokens"(surfaceShades: any, shadowOpacityConfig?: {}): any;
657
+ "__#private@#lightenColor"(hexColor: any, factor?: number): string;
658
+ "__#private@#adjustColorsForDarkMode"(colorScale: any): {};
659
+ "__#private@#dimColorForDarkMode"(hexColor: any, dimFactor?: number): string;
660
+ /**
661
+ * Generate spacing tokens based on the provided configuration.
662
+ * @param {Object} spatialConfig
663
+ * @returns { String } CSS spacing tokens
664
+ */
665
+ generateSpacingTokens(spatialConfig: any): string;
666
+ "__#private@#generateRadiusTokens"(shapeConfig: any): {
658
667
  none: string;
659
668
  xs: string;
660
669
  sm: string;
@@ -663,13 +672,13 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
663
672
  xl: string;
664
673
  full: string;
665
674
  };
666
- "__#private@#D"(t: any): {
675
+ "__#private@#generateBorderWidthTokens"(shapeConfig: any): {
667
676
  hairline: string;
668
677
  thin: string;
669
678
  medium: string;
670
679
  thick: string;
671
680
  };
672
- generateTypographyTokens(t: any): {
681
+ generateTypographyTokens(typographyConfig: any): {
673
682
  fontFamily: {
674
683
  headings: any;
675
684
  body: any;
@@ -698,7 +707,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
698
707
  relaxed: any;
699
708
  };
700
709
  };
701
- "__#private@#$"(t: any): {
710
+ "__#private@#generateShadowTokens"(layersConfig: any): {
702
711
  sm: string;
703
712
  base: string;
704
713
  md: string;
@@ -706,7 +715,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
706
715
  xl: string;
707
716
  inner: string;
708
717
  };
709
- "__#private@#O"(t: any): {
718
+ "__#private@#generateLayoutTokens"(layoutConfig: any): {
710
719
  maxWidth: any;
711
720
  maxWidthSm: any;
712
721
  maxWidthMd: any;
@@ -726,20 +735,20 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
726
735
  heroSpacing: string;
727
736
  footerSpacing: string;
728
737
  };
729
- "__#private@#z"(t?: {}): {
738
+ "__#private@#resolveLayoutMaxWidths"(layoutConfig?: {}): {
730
739
  sm: any;
731
740
  md: any;
732
741
  lg: any;
733
742
  xl: any;
734
743
  };
735
- "__#private@#o"(t: any, e: any): any;
736
- "__#private@#s"(t: any, e: any): any;
737
- "__#private@#P"(t: any): {
744
+ "__#private@#formatLength"(value: any, fallback: any): any;
745
+ "__#private@#toNumber"(value: any, fallback: any): any;
746
+ "__#private@#generateTransitionTokens"(behaviorConfig: any): {
738
747
  fast: string;
739
748
  normal: string;
740
749
  slow: string;
741
750
  };
742
- "__#private@#I"(t: any): {
751
+ "__#private@#generateZIndexTokens"(layersConfig: any): {
743
752
  dropdown: any;
744
753
  sticky: any;
745
754
  fixed: any;
@@ -749,7 +758,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
749
758
  tooltip: any;
750
759
  notification: any;
751
760
  };
752
- "__#private@#H"(t: any): {
761
+ "__#private@#generateIconTokens"(iconConfig: any): {
753
762
  set: any;
754
763
  weight: any;
755
764
  defaultSize: string;
@@ -759,45 +768,45 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
759
768
  spritePath: any;
760
769
  externalPath: any;
761
770
  };
762
- "__#private@#_"(t: any): string;
763
- "__#private@#q"(t: any): string;
764
- "__#private@#G"(t: any): string;
765
- "__#private@#V"(t: any): string;
766
- "__#private@#Y"(t: any): string;
767
- "__#private@#Q"(t: any): string;
768
- "__#private@#u"(t: any): string;
769
- "__#private@#Z"(t: any): string;
770
- "__#private@#J"(t: any): string;
771
- "__#private@#X"(t: any): string;
772
- "__#private@#K"(t: any): string;
773
- "__#private@#ee"(t: any, e: any): string;
774
- "__#private@#te"(t: any, e: any): string;
775
- "__#private@#re"(t: any): string;
776
- "__#private@#oe"(t: any): string;
777
- "__#private@#ae"(): string;
778
- "__#private@#ne"(): string;
779
- "__#private@#ie"(): "" | "/* Liquid glass utility (opt-in via options.liquidGlassEffects) */\n.liquid-glass {\n border-radius: var(--radius-lg);\n /* Subtle translucent fill blended with surface */\n background: color-mix(in oklab, var(--color-surface-subtle) 45%, transparent);\n\n background-image: linear-gradient(\n 135deg,\n rgba(255,255,255,0.35),\n rgba(255,255,255,0.12)\n );\n /* Frosted glass blur + saturation */\n -webkit-backdrop-filter: blur(12px) saturate(140%);\n backdrop-filter: blur(12px) saturate(140%);\n /* Soft inner highlight and outer depth */\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.6),\n inset 0 -40px 80px rgba(255,255,255,0.12),\n 0 10px 30px rgba(0,0,0,0.10);\n /* Glossy border with slight light and dark edges */\n border: 1px solid color-mix(in oklab, var(--color-primary-500) 22%, transparent);\n outline: 1px solid color-mix(in oklab, #ffffff 18%, transparent);\n outline-offset: -1px;\n}\n\nhtml[data-theme=\"dark\"] .liquid-glass {\n background: color-mix(in oklab, var(--color-surface-inverse) 45%, transparent);\n background-image: linear-gradient(\n 135deg,\n color-mix(in oklab, var(--color-primary-300) 40%, transparent),\n color-mix(in oklab, var(--color-surface-overlay) 48%, transparent)\n );\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.12),\n inset 0 -40px 80px rgba(0,0,0,0.55),\n 0 18px 38px rgba(0,0,0,0.65);\n border: 1px solid color-mix(in oklab, var(--color-primary-300) 26%, transparent);\n outline: 1px solid color-mix(in oklab, #ffffff 16%, transparent);\n}\n\n/* Fallback when backdrop-filter isn't supported */\n@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {\n .liquid-glass {\n /* Strengthen fill a bit to compensate for lack of blur */\n background: color-mix(in oklab, var(--color-surface-subtle) 70%, rgba(255,255,255,0.4));\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.6),\n 0 10px 24px rgba(0,0,0,0.08);\n }\n\n html[data-theme=\"dark\"] .liquid-glass {\n background: color-mix(in oklab, var(--color-surface-inverse) 70%, transparent);\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.1),\n 0 18px 32px rgba(0,0,0,0.58);\n }\n}\n";
780
- "__#private@#se"(): string;
781
- "__#private@#ce"(): string;
782
- "__#private@#le"(): string;
783
- "__#private@#de"(): string;
784
- "__#private@#pe"(): string;
785
- "__#private@#ue"(): string;
786
- "__#private@#ge"(): string;
787
- "__#private@#me"(): string;
788
- "__#private@#he"(): string;
789
- "__#private@#fe"(): string;
790
- "__#private@#be"(): string;
791
- "__#private@#ye"(): string;
792
- "__#private@#ve"(): string;
793
- "__#private@#xe"(): string;
794
- "__#private@#we"(): string;
795
- "__#private@#n"(t: any): {
771
+ "__#private@#generateColorVariables"(colors: any): string;
772
+ "__#private@#generateMeshGradients"(colors: any): string;
773
+ "__#private@#generateSpacingVariables"(spacing: any): string;
774
+ "__#private@#generateRadiusVariables"(radius: any): string;
775
+ "__#private@#generateBorderWidthVariables"(borderWidths: any): string;
776
+ "__#private@#generateTypographyVariables"(typography: any): string;
777
+ "__#private@#generateShadowVariables"(shadows: any): string;
778
+ "__#private@#generateLayoutVariables"(layout: any): string;
779
+ "__#private@#generateTransitionVariables"(transitions: any): string;
780
+ "__#private@#generateZIndexVariables"(zIndex: any): string;
781
+ "__#private@#generateIconVariables"(icons: any): string;
782
+ "__#private@#generateDarkVariablesOnly"(colors: any, darkShadows: any): string;
783
+ "__#private@#generateDarkVariablesForTokensLayer"(colors: any, darkShadows: any): string;
784
+ "__#private@#generateMeshGradientsDarkVariablesOnly"(colors: any): string;
785
+ "__#private@#generateMeshGradientsDark"(colors: any): string;
786
+ "__#private@#generateDarkModeComponentRules"(): string;
787
+ "__#private@#generateBodyBackgroundMeshRule"(): string;
788
+ "__#private@#generateLiquidGlassUtility"(): "" | "/* Liquid glass utility (opt-in via options.liquidGlassEffects) */\n.liquid-glass {\n border-radius: var(--radius-lg);\n /* Subtle translucent fill blended with surface */\n background: color-mix(in oklab, var(--color-surface-subtle) 45%, transparent);\n\n background-image: linear-gradient(\n 135deg,\n rgba(255,255,255,0.35),\n rgba(255,255,255,0.12)\n );\n /* Frosted glass blur + saturation */\n -webkit-backdrop-filter: blur(12px) saturate(140%);\n backdrop-filter: blur(12px) saturate(140%);\n /* Soft inner highlight and outer depth */\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.6),\n inset 0 -40px 80px rgba(255,255,255,0.12),\n 0 10px 30px rgba(0,0,0,0.10);\n /* Glossy border with slight light and dark edges */\n border: 1px solid color-mix(in oklab, var(--color-primary-500) 22%, transparent);\n outline: 1px solid color-mix(in oklab, #ffffff 18%, transparent);\n outline-offset: -1px;\n}\n\nhtml[data-theme=\"dark\"] .liquid-glass {\n background: color-mix(in oklab, var(--color-surface-inverse) 45%, transparent);\n background-image: linear-gradient(\n 135deg,\n color-mix(in oklab, var(--color-primary-300) 40%, transparent),\n color-mix(in oklab, var(--color-surface-overlay) 48%, transparent)\n );\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.12),\n inset 0 -40px 80px rgba(0,0,0,0.55),\n 0 18px 38px rgba(0,0,0,0.65);\n border: 1px solid color-mix(in oklab, var(--color-primary-300) 26%, transparent);\n outline: 1px solid color-mix(in oklab, #ffffff 16%, transparent);\n}\n\n/* Fallback when backdrop-filter isn't supported */\n@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {\n .liquid-glass {\n /* Strengthen fill a bit to compensate for lack of blur */\n background: color-mix(in oklab, var(--color-surface-subtle) 70%, rgba(255,255,255,0.4));\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.6),\n 0 10px 24px rgba(0,0,0,0.08);\n }\n\n html[data-theme=\"dark\"] .liquid-glass {\n background: color-mix(in oklab, var(--color-surface-inverse) 70%, transparent);\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.1),\n 0 18px 32px rgba(0,0,0,0.58);\n }\n}\n";
789
+ "__#private@#generateBorderGradientUtilities"(): string;
790
+ "__#private@#generateSemanticHTMLStyles"(): string;
791
+ "__#private@#generateFormStyles"(): string;
792
+ "__#private@#generateTableStyles"(): string;
793
+ "__#private@#generateCalloutStyles"(): string;
794
+ "__#private@#generateAccordionStyles"(): string;
795
+ "__#private@#generateBadgeStyles"(): string;
796
+ "__#private@#generateDialogStyles"(): string;
797
+ "__#private@#generateTabStripStyles"(): string;
798
+ "__#private@#generateScrollbarStyles"(): string;
799
+ "__#private@#generateIconStyles"(): string;
800
+ "__#private@#generateDropdownStyles"(): string;
801
+ "__#private@#generateLayoutUtilities"(): string;
802
+ "__#private@#generateMediaUtilities"(): string;
803
+ "__#private@#generateMediaQueries"(): string;
804
+ "__#private@#hexToHsl"(hex: any): {
796
805
  h: number;
797
806
  s: number;
798
807
  l: number;
799
808
  };
800
- "__#private@#t"(t: any, e: any, r: any): string;
809
+ "__#private@#hslToHex"(h: any, s: any, l: any): string;
801
810
  getTokens(): {
802
811
  colors: {
803
812
  primary: {
@@ -906,9 +915,7 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
906
915
  hover: string;
907
916
  };
908
917
  };
909
- spacing: {
910
- 0: string;
911
- };
918
+ spacing: string;
912
919
  radius: {
913
920
  none: string;
914
921
  xs: string;
@@ -1016,353 +1023,41 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
1016
1023
  };
1017
1024
  };
1018
1025
  exportCSS(): string;
1019
- "__#private@#ke"(): void;
1020
- "__#private@#Se"(): string;
1021
- "__#private@#$e"(): string;
1022
- "__#private@#ze"(): string;
1023
- "__#private@#Me"(): string;
1024
- "__#private@#Ee"(): void;
1025
- "__#private@#Fe"(): void;
1026
+ /**
1027
+ * Generate separate CSS layers: tokens, primitives, components, utilities
1028
+ * Following the cascade layers pattern from the best practices document
1029
+ */
1030
+ "__#private@#generateLayers"(): void;
1031
+ "__#private@#generateTokensLayer"(): string;
1032
+ "__#private@#generatePrimitivesLayer"(): string;
1033
+ "__#private@#generateComponentsLayer"(): string;
1034
+ "__#private@#generateUtilitiesLayer"(): string;
1035
+ /**
1036
+ * Create constructable stylesheets for each layer
1037
+ */
1038
+ "__#private@#createConstructableStylesheets"(): void;
1039
+ "__#private@#updateConstructableStylesheets"(): void;
1026
1040
  get tokensCSS(): any;
1027
1041
  get primitivesCSS(): any;
1028
1042
  get componentsCSS(): any;
1029
1043
  get utilitiesCSS(): any;
1030
1044
  get layeredCSS(): string;
1031
- get compiled(): {
1032
- tokens: {
1033
- colors: {
1034
- primary: {
1035
- 50: string;
1036
- 100: string;
1037
- 200: string;
1038
- 300: string;
1039
- 400: string;
1040
- 500: any;
1041
- 600: string;
1042
- 700: string;
1043
- 800: string;
1044
- 900: string;
1045
- };
1046
- secondary: {
1047
- 50: string;
1048
- 100: string;
1049
- 200: string;
1050
- 300: string;
1051
- 400: string;
1052
- 500: any;
1053
- 600: string;
1054
- 700: string;
1055
- 800: string;
1056
- 900: string;
1057
- };
1058
- accent: {
1059
- 50: string;
1060
- 100: string;
1061
- 200: string;
1062
- 300: string;
1063
- 400: string;
1064
- 500: any;
1065
- 600: string;
1066
- 700: string;
1067
- 800: string;
1068
- 900: string;
1069
- };
1070
- success: {
1071
- 50: string;
1072
- 100: string;
1073
- 200: string;
1074
- 300: string;
1075
- 400: string;
1076
- 500: any;
1077
- 600: string;
1078
- 700: string;
1079
- 800: string;
1080
- 900: string;
1081
- };
1082
- warning: {
1083
- 50: string;
1084
- 100: string;
1085
- 200: string;
1086
- 300: string;
1087
- 400: string;
1088
- 500: any;
1089
- 600: string;
1090
- 700: string;
1091
- 800: string;
1092
- 900: string;
1093
- };
1094
- danger: {
1095
- 50: string;
1096
- 100: string;
1097
- 200: string;
1098
- 300: string;
1099
- 400: string;
1100
- 500: any;
1101
- 600: string;
1102
- 700: string;
1103
- 800: string;
1104
- 900: string;
1105
- };
1106
- info: {
1107
- 50: string;
1108
- 100: string;
1109
- 200: string;
1110
- 300: string;
1111
- 400: string;
1112
- 500: any;
1113
- 600: string;
1114
- 700: string;
1115
- 800: string;
1116
- 900: string;
1117
- };
1118
- gray: {
1119
- 50: string;
1120
- 100: string;
1121
- 200: string;
1122
- 300: string;
1123
- 400: string;
1124
- 500: any;
1125
- 600: string;
1126
- 700: string;
1127
- 800: string;
1128
- 900: string;
1129
- };
1130
- surface: {
1131
- base: any;
1132
- subtle: string;
1133
- elevated: string;
1134
- sunken: string;
1135
- overlay: string;
1136
- inverse: string;
1137
- hover: string;
1138
- };
1139
- };
1140
- spacing: {
1141
- 0: string;
1142
- };
1143
- radius: {
1144
- none: string;
1145
- xs: string;
1146
- sm: string;
1147
- md: string;
1148
- lg: string;
1149
- xl: string;
1150
- full: string;
1151
- };
1152
- borderWidths: {
1153
- hairline: string;
1154
- thin: string;
1155
- medium: string;
1156
- thick: string;
1157
- };
1158
- typography: {
1159
- fontFamily: {
1160
- headings: any;
1161
- body: any;
1162
- mono: any;
1163
- };
1164
- fontSize: {
1165
- xs: string;
1166
- sm: string;
1167
- base: string;
1168
- lg: string;
1169
- xl: string;
1170
- "2xl": string;
1171
- "3xl": string;
1172
- "4xl": string;
1173
- };
1174
- fontWeight: {
1175
- light: any;
1176
- normal: any;
1177
- medium: any;
1178
- semibold: any;
1179
- bold: any;
1180
- };
1181
- lineHeight: {
1182
- tight: any;
1183
- normal: any;
1184
- relaxed: any;
1185
- };
1186
- };
1187
- shadows: {
1188
- sm: string;
1189
- base: string;
1190
- md: string;
1191
- lg: string;
1192
- xl: string;
1193
- inner: string;
1194
- };
1195
- layout: {
1196
- maxWidth: any;
1197
- maxWidthSm: any;
1198
- maxWidthMd: any;
1199
- maxWidthLg: any;
1200
- maxWidthXl: any;
1201
- minHeight: string;
1202
- containerPadding: any;
1203
- breakpoints: {
1204
- sm: any;
1205
- md: any;
1206
- lg: any;
1207
- xl: any;
1208
- };
1209
- pageMargin: string;
1210
- sectionGap: string;
1211
- containerGap: string;
1212
- heroSpacing: string;
1213
- footerSpacing: string;
1214
- };
1215
- transitions: {
1216
- fast: string;
1217
- normal: string;
1218
- slow: string;
1219
- };
1220
- zIndex: {
1221
- dropdown: any;
1222
- sticky: any;
1223
- fixed: any;
1224
- modal: any;
1225
- drawer: any;
1226
- popover: any;
1227
- tooltip: any;
1228
- notification: any;
1229
- };
1230
- icons: {
1231
- set: any;
1232
- weight: any;
1233
- defaultSize: string;
1234
- sizes: {
1235
- [k: string]: string;
1236
- };
1237
- spritePath: any;
1238
- externalPath: any;
1239
- };
1240
- };
1241
- layers: {
1242
- tokens: {
1243
- css: any;
1244
- size: any;
1245
- sizeKB: string;
1246
- };
1247
- primitives: {
1248
- css: any;
1249
- size: any;
1250
- sizeKB: string;
1251
- };
1252
- components: {
1253
- css: any;
1254
- size: any;
1255
- sizeKB: string;
1256
- };
1257
- utilities: {
1258
- css: any;
1259
- size: any;
1260
- sizeKB: string;
1261
- };
1262
- combined: {
1263
- css: string;
1264
- size: number;
1265
- sizeKB: string;
1266
- };
1267
- };
1268
- config: {
1269
- design: any;
1270
- preset: any;
1271
- debug: boolean;
1272
- };
1273
- capabilities: {
1274
- constructableStylesheets: boolean;
1275
- blobURLs: boolean;
1276
- shadowDOM: boolean;
1277
- };
1278
- references: {
1279
- ontology: any;
1280
- enums: any;
1281
- };
1282
- meta: {
1283
- generatedAt: string;
1284
- totalSize: any;
1285
- totalSizeKB: string;
1286
- layerCount: number;
1287
- tokenGroups: number;
1288
- };
1289
- helpers: {
1290
- getColorScales: () => {
1291
- name: string;
1292
- scale: {
1293
- 50: string;
1294
- 100: string;
1295
- 200: string;
1296
- 300: string;
1297
- 400: string;
1298
- 500: any;
1299
- 600: string;
1300
- 700: string;
1301
- 800: string;
1302
- 900: string;
1303
- } | {
1304
- 50: string;
1305
- 100: string;
1306
- 200: string;
1307
- 300: string;
1308
- 400: string;
1309
- 500: any;
1310
- 600: string;
1311
- 700: string;
1312
- 800: string;
1313
- 900: string;
1314
- } | {
1315
- base: any;
1316
- subtle: string;
1317
- elevated: string;
1318
- sunken: string;
1319
- overlay: string;
1320
- inverse: string;
1321
- hover: string;
1322
- };
1323
- }[];
1324
- getColorScale: (t: any) => any;
1325
- getSpacingValues: () => {
1326
- key: string;
1327
- value: string;
1328
- }[];
1329
- getTypography: () => {
1330
- fontFamily: {
1331
- headings: any;
1332
- body: any;
1333
- mono: any;
1334
- };
1335
- fontSize: {
1336
- xs: string;
1337
- sm: string;
1338
- base: string;
1339
- lg: string;
1340
- xl: string;
1341
- "2xl": string;
1342
- "3xl": string;
1343
- "4xl": string;
1344
- };
1345
- fontWeight: {
1346
- light: any;
1347
- normal: any;
1348
- medium: any;
1349
- semibold: any;
1350
- bold: any;
1351
- };
1352
- lineHeight: {
1353
- tight: any;
1354
- normal: any;
1355
- relaxed: any;
1356
- };
1357
- };
1358
- getLayerCSS: (t: any) => any;
1359
- usesEnumValue: (t: any, e: any) => boolean;
1360
- };
1361
- };
1045
+ /**
1046
+ * Get a complete compiled representation of the design system state.
1047
+ * This provides structured access to all generated tokens, scales, layers, and metadata.
1048
+ * Linked to ontology and enums for introspection and tooling.
1049
+ *
1050
+ * @returns {Object} Compiled design system state with tokens, layers, metadata, and references
1051
+ */
1052
+ get compiled(): any;
1362
1053
  get tokensStylesheet(): any;
1363
1054
  get primitivesStylesheet(): any;
1364
1055
  get componentsStylesheet(): any;
1365
1056
  get utilitiesStylesheet(): any;
1057
+ /**
1058
+ * Generate CSS module files for export
1059
+ * Returns object with filename => content
1060
+ */
1366
1061
  getCSSModules(): {
1367
1062
  "pds-tokens.css.js": string;
1368
1063
  "pds-primitives.css.js": string;
@@ -1370,13 +1065,33 @@ declare function bt(n: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
1370
1065
  "pds-utilities.css.js": string;
1371
1066
  "pds-styles.css.js": string;
1372
1067
  };
1373
- "__#private@#c"(t: any, e: any): string;
1068
+ "__#private@#generateCSSModule"(name: any, css: any): string;
1374
1069
  };
1375
1070
  config: {
1376
1071
  design: any;
1377
1072
  preset: any;
1378
1073
  } | {
1379
- design: {};
1074
+ design: {
1075
+ colors: unknown;
1076
+ } | {
1077
+ typography: unknown;
1078
+ } | {
1079
+ spatialRhythm: unknown;
1080
+ } | {
1081
+ shape: unknown;
1082
+ } | {
1083
+ behavior: unknown;
1084
+ } | {
1085
+ layout: unknown;
1086
+ } | {
1087
+ advanced: unknown;
1088
+ } | {
1089
+ a11y: unknown;
1090
+ } | {
1091
+ components: unknown;
1092
+ } | {
1093
+ icons: unknown;
1094
+ };
1380
1095
  } | {
1381
1096
  debug: boolean;
1382
1097
  };