@pure-ds/core 0.6.7 → 0.6.9
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.
- package/dist/types/public/assets/js/pds-manager.d.ts +145 -429
- package/dist/types/public/assets/js/pds-manager.d.ts.map +1 -1
- package/dist/types/public/assets/js/pds.d.ts +3 -4
- package/dist/types/public/assets/js/pds.d.ts.map +1 -1
- package/dist/types/public/assets/pds/components/pds-live-edit.d.ts +27 -1
- package/dist/types/public/assets/pds/components/pds-live-edit.d.ts.map +1 -1
- package/dist/types/src/js/common/ask.d.ts.map +1 -1
- package/dist/types/src/js/pds-core/pds-enhancers.d.ts.map +1 -1
- package/dist/types/src/js/pds-core/pds-generator.d.ts.map +1 -1
- package/dist/types/src/js/pds-manager.d.ts +1 -0
- package/package.json +1 -1
- package/public/assets/js/app.js +13 -13
- package/public/assets/js/pds-manager.js +85 -44
- package/public/assets/js/pds.js +13 -13
- package/public/assets/pds/components/pds-live-edit.js +421 -9
- package/src/js/pds-core/pds-enhancers.js +44 -25
- package/src/js/pds-core/pds-generator.js +46 -5
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
export
|
|
2
|
-
|
|
1
|
+
export function loadGoogleFont(fontFamily: any, options?: {}): Promise<any>;
|
|
2
|
+
export function startLive(PDS2: any, config: any, { emitReady, applyResolvedTheme, setupSystemListenerIfNeeded }: {
|
|
3
3
|
emitReady: any;
|
|
4
4
|
applyResolvedTheme: any;
|
|
5
5
|
setupSystemListenerIfNeeded: any;
|
|
6
6
|
}): Promise<{
|
|
7
7
|
generator: {
|
|
8
|
-
"__#private@#
|
|
9
|
-
"__#private@#
|
|
8
|
+
"__#private@#layers": any;
|
|
9
|
+
"__#private@#stylesheets": any;
|
|
10
10
|
options: {
|
|
11
11
|
debug: boolean;
|
|
12
12
|
};
|
|
@@ -118,9 +118,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
118
118
|
hover: string;
|
|
119
119
|
};
|
|
120
120
|
};
|
|
121
|
-
spacing:
|
|
122
|
-
0: string;
|
|
123
|
-
};
|
|
121
|
+
spacing: string;
|
|
124
122
|
radius: {
|
|
125
123
|
none: string;
|
|
126
124
|
xs: string;
|
|
@@ -335,9 +333,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
335
333
|
hover: string;
|
|
336
334
|
};
|
|
337
335
|
};
|
|
338
|
-
spacing:
|
|
339
|
-
0: string;
|
|
340
|
-
};
|
|
336
|
+
spacing: string;
|
|
341
337
|
radius: {
|
|
342
338
|
none: string;
|
|
343
339
|
xs: string;
|
|
@@ -444,13 +440,13 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
444
440
|
externalPath: any;
|
|
445
441
|
};
|
|
446
442
|
};
|
|
447
|
-
"__#private@#
|
|
443
|
+
"__#private@#resolveShadowOpacityConfig"(config?: {}): {
|
|
448
444
|
light: number;
|
|
449
445
|
dark: number;
|
|
450
446
|
};
|
|
451
|
-
"__#private@#
|
|
452
|
-
"__#private@#
|
|
453
|
-
"__#private@#
|
|
447
|
+
"__#private@#normalizeOpacity"(value: any): number;
|
|
448
|
+
"__#private@#mergeShadowConfig"(layersConfig: {}, baseShadowOpacity: any): {};
|
|
449
|
+
"__#private@#generateColorTokens"(colorConfig: any, shadowOpacityConfig?: {}): {
|
|
454
450
|
primary: {
|
|
455
451
|
50: string;
|
|
456
452
|
100: string;
|
|
@@ -557,7 +553,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
557
553
|
hover: string;
|
|
558
554
|
};
|
|
559
555
|
};
|
|
560
|
-
"__#private@#
|
|
556
|
+
"__#private@#generateColorScale"(baseColor: any): {
|
|
561
557
|
50: string;
|
|
562
558
|
100: string;
|
|
563
559
|
200: string;
|
|
@@ -569,9 +565,9 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
569
565
|
800: string;
|
|
570
566
|
900: string;
|
|
571
567
|
};
|
|
572
|
-
"__#private@#
|
|
573
|
-
"__#private@#
|
|
574
|
-
"__#private@#
|
|
568
|
+
"__#private@#deriveSuccessColor"(mainColor: any): string;
|
|
569
|
+
"__#private@#deriveDangerColor"(mainColor: any): string;
|
|
570
|
+
"__#private@#generateGrayScale"(supportingColor: any): {
|
|
575
571
|
50: string;
|
|
576
572
|
100: string;
|
|
577
573
|
200: string;
|
|
@@ -583,7 +579,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
583
579
|
800: string;
|
|
584
580
|
900: string;
|
|
585
581
|
};
|
|
586
|
-
"__#private@#
|
|
582
|
+
"__#private@#generateBackgroundShades"(backgroundBase: any): {
|
|
587
583
|
base: any;
|
|
588
584
|
subtle: string;
|
|
589
585
|
elevated: string;
|
|
@@ -592,16 +588,16 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
592
588
|
inverse: string;
|
|
593
589
|
hover: string;
|
|
594
590
|
};
|
|
595
|
-
"__#private@#
|
|
591
|
+
"__#private@#generateFieldsetAdaptiveColors"(backgroundShades: any): {
|
|
596
592
|
base: any;
|
|
597
593
|
subtle: any;
|
|
598
594
|
elevated: any;
|
|
599
595
|
sunken: string;
|
|
600
596
|
overlay: any;
|
|
601
597
|
};
|
|
602
|
-
"__#private@#
|
|
603
|
-
"__#private@#
|
|
604
|
-
"__#private@#
|
|
598
|
+
"__#private@#darkenColor"(hexColor: any, factor?: number): string;
|
|
599
|
+
"__#private@#generateSmartDarkBackground"(lightBackground: any): string;
|
|
600
|
+
"__#private@#generateDarkModeColors"(lightColors: any, backgroundBase?: string, overrides?: {}): {
|
|
605
601
|
surface: {
|
|
606
602
|
fieldset: {
|
|
607
603
|
base: any;
|
|
@@ -627,34 +623,48 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
627
623
|
warning: {};
|
|
628
624
|
danger: {};
|
|
629
625
|
};
|
|
630
|
-
"__#private@#
|
|
626
|
+
"__#private@#hexToRgb"(hex: any): {
|
|
631
627
|
r: number;
|
|
632
628
|
g: number;
|
|
633
629
|
b: number;
|
|
634
630
|
};
|
|
635
|
-
"__#private@#
|
|
636
|
-
"__#private@#
|
|
637
|
-
"__#private@#
|
|
638
|
-
"__#private@#
|
|
639
|
-
"__#private@#
|
|
640
|
-
"__#private@#
|
|
641
|
-
"__#private@#
|
|
631
|
+
"__#private@#luminance"(hex: any): number;
|
|
632
|
+
"__#private@#contrastRatio"(aHex: any, bHex: any): number;
|
|
633
|
+
"__#private@#findReadableOnColor"(bgHex: any, target?: number): "#ffffff" | "#000000";
|
|
634
|
+
"__#private@#rgbaFromHex"(hex: any, alpha?: number): string;
|
|
635
|
+
"__#private@#mixTowards"(sourceHex: any, targetHex: any, factor?: number): string;
|
|
636
|
+
"__#private@#rgbToHex"(r: any, g: any, b: any): string;
|
|
637
|
+
"__#private@#generateDarkModeFieldsetColors"(darkSurface: any): {
|
|
642
638
|
base: any;
|
|
643
639
|
subtle: any;
|
|
644
640
|
elevated: string;
|
|
645
641
|
sunken: any;
|
|
646
642
|
overlay: string;
|
|
647
643
|
};
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
"__#private@#
|
|
653
|
-
"__#private@#
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
644
|
+
/**
|
|
645
|
+
* Pick a readable primary shade on a given surface background, targeting AA contrast.
|
|
646
|
+
* Returns the first shade that meets target from a preferred order; falls back to the best ratio.
|
|
647
|
+
*/
|
|
648
|
+
"__#private@#pickReadablePrimaryOnSurface"(primaryScale?: {}, surfaceBg?: string, target?: number): any;
|
|
649
|
+
"__#private@#pickFillShadeForWhite"(scale?: {}, target?: number): any;
|
|
650
|
+
/**
|
|
651
|
+
* Generate smart surface tokens with context-aware colors for text, icons, shadows, and borders.
|
|
652
|
+
* Each surface variant gets its own semantic tokens that automatically adapt to the surface's luminance.
|
|
653
|
+
*
|
|
654
|
+
* @param {Object} surfaceShades - Object with surface color variants (base, subtle, elevated, etc.)
|
|
655
|
+
* @returns {Object} Smart tokens for each surface with text, icon, shadow, and border colors
|
|
656
|
+
*/
|
|
657
|
+
"__#private@#generateSmartSurfaceTokens"(surfaceShades: any, shadowOpacityConfig?: {}): any;
|
|
658
|
+
"__#private@#lightenColor"(hexColor: any, factor?: number): string;
|
|
659
|
+
"__#private@#adjustColorsForDarkMode"(colorScale: any): {};
|
|
660
|
+
"__#private@#dimColorForDarkMode"(hexColor: any, dimFactor?: number): string;
|
|
661
|
+
/**
|
|
662
|
+
* Generate spacing tokens based on the provided configuration.
|
|
663
|
+
* @param {Object} spatialConfig
|
|
664
|
+
* @returns { String } CSS spacing tokens
|
|
665
|
+
*/
|
|
666
|
+
generateSpacingTokens(spatialConfig: any): string;
|
|
667
|
+
"__#private@#generateRadiusTokens"(shapeConfig: any): {
|
|
658
668
|
none: string;
|
|
659
669
|
xs: string;
|
|
660
670
|
sm: string;
|
|
@@ -663,13 +673,13 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
663
673
|
xl: string;
|
|
664
674
|
full: string;
|
|
665
675
|
};
|
|
666
|
-
"__#private@#
|
|
676
|
+
"__#private@#generateBorderWidthTokens"(shapeConfig: any): {
|
|
667
677
|
hairline: string;
|
|
668
678
|
thin: string;
|
|
669
679
|
medium: string;
|
|
670
680
|
thick: string;
|
|
671
681
|
};
|
|
672
|
-
generateTypographyTokens(
|
|
682
|
+
generateTypographyTokens(typographyConfig: any): {
|
|
673
683
|
fontFamily: {
|
|
674
684
|
headings: any;
|
|
675
685
|
body: any;
|
|
@@ -698,7 +708,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
698
708
|
relaxed: any;
|
|
699
709
|
};
|
|
700
710
|
};
|
|
701
|
-
"__#private
|
|
711
|
+
"__#private@#generateShadowTokens"(layersConfig: any): {
|
|
702
712
|
sm: string;
|
|
703
713
|
base: string;
|
|
704
714
|
md: string;
|
|
@@ -706,7 +716,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
706
716
|
xl: string;
|
|
707
717
|
inner: string;
|
|
708
718
|
};
|
|
709
|
-
"__#private@#
|
|
719
|
+
"__#private@#generateLayoutTokens"(layoutConfig: any): {
|
|
710
720
|
maxWidth: any;
|
|
711
721
|
maxWidthSm: any;
|
|
712
722
|
maxWidthMd: any;
|
|
@@ -726,20 +736,20 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
726
736
|
heroSpacing: string;
|
|
727
737
|
footerSpacing: string;
|
|
728
738
|
};
|
|
729
|
-
"__#private@#
|
|
739
|
+
"__#private@#resolveLayoutMaxWidths"(layoutConfig?: {}): {
|
|
730
740
|
sm: any;
|
|
731
741
|
md: any;
|
|
732
742
|
lg: any;
|
|
733
743
|
xl: any;
|
|
734
744
|
};
|
|
735
|
-
"__#private@#
|
|
736
|
-
"__#private@#
|
|
737
|
-
"__#private@#
|
|
745
|
+
"__#private@#formatLength"(value: any, fallback: any): any;
|
|
746
|
+
"__#private@#toNumber"(value: any, fallback: any): any;
|
|
747
|
+
"__#private@#generateTransitionTokens"(behaviorConfig: any): {
|
|
738
748
|
fast: string;
|
|
739
749
|
normal: string;
|
|
740
750
|
slow: string;
|
|
741
751
|
};
|
|
742
|
-
"__#private@#
|
|
752
|
+
"__#private@#generateZIndexTokens"(layersConfig: any): {
|
|
743
753
|
dropdown: any;
|
|
744
754
|
sticky: any;
|
|
745
755
|
fixed: any;
|
|
@@ -749,7 +759,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
749
759
|
tooltip: any;
|
|
750
760
|
notification: any;
|
|
751
761
|
};
|
|
752
|
-
"__#private@#
|
|
762
|
+
"__#private@#generateIconTokens"(iconConfig: any): {
|
|
753
763
|
set: any;
|
|
754
764
|
weight: any;
|
|
755
765
|
defaultSize: string;
|
|
@@ -759,45 +769,45 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
759
769
|
spritePath: any;
|
|
760
770
|
externalPath: any;
|
|
761
771
|
};
|
|
762
|
-
"__#private@#
|
|
763
|
-
"__#private@#
|
|
764
|
-
"__#private@#
|
|
765
|
-
"__#private@#
|
|
766
|
-
"__#private@#
|
|
767
|
-
"__#private@#
|
|
768
|
-
"__#private@#
|
|
769
|
-
"__#private@#
|
|
770
|
-
"__#private@#
|
|
771
|
-
"__#private@#
|
|
772
|
-
"__#private@#
|
|
773
|
-
"__#private@#
|
|
774
|
-
"__#private@#
|
|
775
|
-
"__#private@#
|
|
776
|
-
"__#private@#
|
|
777
|
-
"__#private@#
|
|
778
|
-
"__#private@#
|
|
779
|
-
"__#private@#
|
|
780
|
-
"__#private@#
|
|
781
|
-
"__#private@#
|
|
782
|
-
"__#private@#
|
|
783
|
-
"__#private@#
|
|
784
|
-
"__#private@#
|
|
785
|
-
"__#private@#
|
|
786
|
-
"__#private@#
|
|
787
|
-
"__#private@#
|
|
788
|
-
"__#private@#
|
|
789
|
-
"__#private@#
|
|
790
|
-
"__#private@#
|
|
791
|
-
"__#private@#
|
|
792
|
-
"__#private@#
|
|
793
|
-
"__#private@#
|
|
794
|
-
"__#private@#
|
|
795
|
-
"__#private@#
|
|
772
|
+
"__#private@#generateColorVariables"(colors: any): string;
|
|
773
|
+
"__#private@#generateMeshGradients"(colors: any): string;
|
|
774
|
+
"__#private@#generateSpacingVariables"(spacing: any): string;
|
|
775
|
+
"__#private@#generateRadiusVariables"(radius: any): string;
|
|
776
|
+
"__#private@#generateBorderWidthVariables"(borderWidths: any): string;
|
|
777
|
+
"__#private@#generateTypographyVariables"(typography: any): string;
|
|
778
|
+
"__#private@#generateShadowVariables"(shadows: any): string;
|
|
779
|
+
"__#private@#generateLayoutVariables"(layout: any): string;
|
|
780
|
+
"__#private@#generateTransitionVariables"(transitions: any): string;
|
|
781
|
+
"__#private@#generateZIndexVariables"(zIndex: any): string;
|
|
782
|
+
"__#private@#generateIconVariables"(icons: any): string;
|
|
783
|
+
"__#private@#generateDarkVariablesOnly"(colors: any, darkShadows: any): string;
|
|
784
|
+
"__#private@#generateDarkVariablesForTokensLayer"(colors: any, darkShadows: any): string;
|
|
785
|
+
"__#private@#generateMeshGradientsDarkVariablesOnly"(colors: any): string;
|
|
786
|
+
"__#private@#generateMeshGradientsDark"(colors: any): string;
|
|
787
|
+
"__#private@#generateDarkModeComponentRules"(): string;
|
|
788
|
+
"__#private@#generateBodyBackgroundMeshRule"(): string;
|
|
789
|
+
"__#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: var(--border-width-thin) 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: var(--border-width-thin) 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";
|
|
790
|
+
"__#private@#generateBorderGradientUtilities"(): string;
|
|
791
|
+
"__#private@#generateSemanticHTMLStyles"(): string;
|
|
792
|
+
"__#private@#generateFormStyles"(): string;
|
|
793
|
+
"__#private@#generateTableStyles"(): string;
|
|
794
|
+
"__#private@#generateCalloutStyles"(): string;
|
|
795
|
+
"__#private@#generateAccordionStyles"(): string;
|
|
796
|
+
"__#private@#generateBadgeStyles"(): string;
|
|
797
|
+
"__#private@#generateDialogStyles"(): string;
|
|
798
|
+
"__#private@#generateTabStripStyles"(): string;
|
|
799
|
+
"__#private@#generateScrollbarStyles"(): string;
|
|
800
|
+
"__#private@#generateIconStyles"(): string;
|
|
801
|
+
"__#private@#generateDropdownStyles"(): string;
|
|
802
|
+
"__#private@#generateLayoutUtilities"(): string;
|
|
803
|
+
"__#private@#generateMediaUtilities"(): string;
|
|
804
|
+
"__#private@#generateMediaQueries"(): string;
|
|
805
|
+
"__#private@#hexToHsl"(hex: any): {
|
|
796
806
|
h: number;
|
|
797
807
|
s: number;
|
|
798
808
|
l: number;
|
|
799
809
|
};
|
|
800
|
-
"__#private@#
|
|
810
|
+
"__#private@#hslToHex"(h: any, s: any, l: any): string;
|
|
801
811
|
getTokens(): {
|
|
802
812
|
colors: {
|
|
803
813
|
primary: {
|
|
@@ -906,9 +916,7 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
906
916
|
hover: string;
|
|
907
917
|
};
|
|
908
918
|
};
|
|
909
|
-
spacing:
|
|
910
|
-
0: string;
|
|
911
|
-
};
|
|
919
|
+
spacing: string;
|
|
912
920
|
radius: {
|
|
913
921
|
none: string;
|
|
914
922
|
xs: string;
|
|
@@ -1016,353 +1024,41 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
1016
1024
|
};
|
|
1017
1025
|
};
|
|
1018
1026
|
exportCSS(): string;
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
"__#private@#
|
|
1024
|
-
"__#private@#
|
|
1025
|
-
"__#private@#
|
|
1027
|
+
/**
|
|
1028
|
+
* Generate separate CSS layers: tokens, primitives, components, utilities
|
|
1029
|
+
* Following the cascade layers pattern from the best practices document
|
|
1030
|
+
*/
|
|
1031
|
+
"__#private@#generateLayers"(): void;
|
|
1032
|
+
"__#private@#generateTokensLayer"(): string;
|
|
1033
|
+
"__#private@#generatePrimitivesLayer"(): string;
|
|
1034
|
+
"__#private@#generateComponentsLayer"(): string;
|
|
1035
|
+
"__#private@#generateUtilitiesLayer"(): string;
|
|
1036
|
+
/**
|
|
1037
|
+
* Create constructable stylesheets for each layer
|
|
1038
|
+
*/
|
|
1039
|
+
"__#private@#createConstructableStylesheets"(): void;
|
|
1040
|
+
"__#private@#updateConstructableStylesheets"(): void;
|
|
1026
1041
|
get tokensCSS(): any;
|
|
1027
1042
|
get primitivesCSS(): any;
|
|
1028
1043
|
get componentsCSS(): any;
|
|
1029
1044
|
get utilitiesCSS(): any;
|
|
1030
1045
|
get layeredCSS(): string;
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
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
|
-
};
|
|
1046
|
+
/**
|
|
1047
|
+
* Get a complete compiled representation of the design system state.
|
|
1048
|
+
* This provides structured access to all generated tokens, scales, layers, and metadata.
|
|
1049
|
+
* Linked to ontology and enums for introspection and tooling.
|
|
1050
|
+
*
|
|
1051
|
+
* @returns {Object} Compiled design system state with tokens, layers, metadata, and references
|
|
1052
|
+
*/
|
|
1053
|
+
get compiled(): any;
|
|
1362
1054
|
get tokensStylesheet(): any;
|
|
1363
1055
|
get primitivesStylesheet(): any;
|
|
1364
1056
|
get componentsStylesheet(): any;
|
|
1365
1057
|
get utilitiesStylesheet(): any;
|
|
1058
|
+
/**
|
|
1059
|
+
* Generate CSS module files for export
|
|
1060
|
+
* Returns object with filename => content
|
|
1061
|
+
*/
|
|
1366
1062
|
getCSSModules(): {
|
|
1367
1063
|
"pds-tokens.css.js": string;
|
|
1368
1064
|
"pds-primitives.css.js": string;
|
|
@@ -1370,13 +1066,33 @@ declare function Mt(a: any, t: any, { emitReady: e, applyResolvedTheme: r, setup
|
|
|
1370
1066
|
"pds-utilities.css.js": string;
|
|
1371
1067
|
"pds-styles.css.js": string;
|
|
1372
1068
|
};
|
|
1373
|
-
"__#private@#
|
|
1069
|
+
"__#private@#generateCSSModule"(name: any, css: any): string;
|
|
1374
1070
|
};
|
|
1375
1071
|
config: {
|
|
1376
1072
|
design: any;
|
|
1377
1073
|
preset: any;
|
|
1378
1074
|
} | {
|
|
1379
|
-
design: {
|
|
1075
|
+
design: {
|
|
1076
|
+
colors: unknown;
|
|
1077
|
+
} | {
|
|
1078
|
+
typography: unknown;
|
|
1079
|
+
} | {
|
|
1080
|
+
spatialRhythm: unknown;
|
|
1081
|
+
} | {
|
|
1082
|
+
shape: unknown;
|
|
1083
|
+
} | {
|
|
1084
|
+
behavior: unknown;
|
|
1085
|
+
} | {
|
|
1086
|
+
layout: unknown;
|
|
1087
|
+
} | {
|
|
1088
|
+
advanced: unknown;
|
|
1089
|
+
} | {
|
|
1090
|
+
a11y: unknown;
|
|
1091
|
+
} | {
|
|
1092
|
+
components: unknown;
|
|
1093
|
+
} | {
|
|
1094
|
+
icons: unknown;
|
|
1095
|
+
};
|
|
1380
1096
|
} | {
|
|
1381
1097
|
debug: boolean;
|
|
1382
1098
|
};
|