@genesislcap/foundation-ui 14.351.0 → 14.353.0

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.
@@ -1263,6 +1263,37 @@
1263
1263
  }
1264
1264
  ]
1265
1265
  },
1266
+ {
1267
+ "kind": "javascript-module",
1268
+ "path": "src/_config/index.ts",
1269
+ "declarations": [],
1270
+ "exports": [
1271
+ {
1272
+ "kind": "js",
1273
+ "name": "*",
1274
+ "declaration": {
1275
+ "name": "*",
1276
+ "package": "./styles"
1277
+ }
1278
+ },
1279
+ {
1280
+ "kind": "js",
1281
+ "name": "*",
1282
+ "declaration": {
1283
+ "name": "*",
1284
+ "package": "./tokens"
1285
+ }
1286
+ },
1287
+ {
1288
+ "kind": "js",
1289
+ "name": "*",
1290
+ "declaration": {
1291
+ "name": "*",
1292
+ "package": "./values"
1293
+ }
1294
+ }
1295
+ ]
1296
+ },
1266
1297
  {
1267
1298
  "kind": "javascript-module",
1268
1299
  "path": "src/accordion-item/accordion-item.styles.ts",
@@ -2218,7 +2249,158 @@
2218
2249
  },
2219
2250
  {
2220
2251
  "kind": "javascript-module",
2221
- "path": "src/_config/index.ts",
2252
+ "path": "src/accordion/accordion.styles.ts",
2253
+ "declarations": [
2254
+ {
2255
+ "kind": "function",
2256
+ "name": "foundationAccordionStyles",
2257
+ "return": {
2258
+ "type": {
2259
+ "text": "ElementStyles"
2260
+ }
2261
+ },
2262
+ "parameters": [
2263
+ {
2264
+ "name": "context",
2265
+ "type": {
2266
+ "text": "ElementDefinitionContext"
2267
+ }
2268
+ },
2269
+ {
2270
+ "name": "definition",
2271
+ "type": {
2272
+ "text": "FoundationElementDefinition"
2273
+ }
2274
+ }
2275
+ ]
2276
+ }
2277
+ ],
2278
+ "exports": [
2279
+ {
2280
+ "kind": "js",
2281
+ "name": "foundationAccordionStyles",
2282
+ "declaration": {
2283
+ "name": "foundationAccordionStyles",
2284
+ "module": "src/accordion/accordion.styles.ts"
2285
+ }
2286
+ }
2287
+ ]
2288
+ },
2289
+ {
2290
+ "kind": "javascript-module",
2291
+ "path": "src/accordion/accordion.template.ts",
2292
+ "declarations": [
2293
+ {
2294
+ "kind": "function",
2295
+ "name": "foundationAccordionTemplate",
2296
+ "return": {
2297
+ "type": {
2298
+ "text": "ViewTemplate<Accordion>"
2299
+ }
2300
+ },
2301
+ "parameters": [
2302
+ {
2303
+ "name": "context",
2304
+ "type": {
2305
+ "text": "ElementDefinitionContext"
2306
+ }
2307
+ },
2308
+ {
2309
+ "name": "definition",
2310
+ "type": {
2311
+ "text": "FoundationElementDefinition"
2312
+ }
2313
+ }
2314
+ ]
2315
+ }
2316
+ ],
2317
+ "exports": [
2318
+ {
2319
+ "kind": "js",
2320
+ "name": "foundationAccordionTemplate",
2321
+ "declaration": {
2322
+ "name": "foundationAccordionTemplate",
2323
+ "module": "src/accordion/accordion.template.ts"
2324
+ }
2325
+ }
2326
+ ]
2327
+ },
2328
+ {
2329
+ "kind": "javascript-module",
2330
+ "path": "src/accordion/accordion.ts",
2331
+ "declarations": [
2332
+ {
2333
+ "kind": "class",
2334
+ "description": "",
2335
+ "name": "Accordion",
2336
+ "superclass": {
2337
+ "name": "FASTAccordion",
2338
+ "package": "@microsoft/fast-foundation"
2339
+ },
2340
+ "tagName": "%%prefix%%-accordion",
2341
+ "customElement": true
2342
+ },
2343
+ {
2344
+ "kind": "variable",
2345
+ "name": "foundationAccordionShadowOptions",
2346
+ "type": {
2347
+ "text": "ShadowRootInit"
2348
+ },
2349
+ "default": "{\n delegatesFocus: true,\n mode: 'open',\n}"
2350
+ },
2351
+ {
2352
+ "kind": "variable",
2353
+ "name": "defaultAccordionConfig",
2354
+ "type": {
2355
+ "text": "object"
2356
+ },
2357
+ "default": "{}"
2358
+ },
2359
+ {
2360
+ "kind": "variable",
2361
+ "name": "foundationAccordion",
2362
+ "description": "The Foundation Accordion",
2363
+ "privacy": "public"
2364
+ }
2365
+ ],
2366
+ "exports": [
2367
+ {
2368
+ "kind": "js",
2369
+ "name": "Accordion",
2370
+ "declaration": {
2371
+ "name": "Accordion",
2372
+ "module": "src/accordion/accordion.ts"
2373
+ }
2374
+ },
2375
+ {
2376
+ "kind": "js",
2377
+ "name": "foundationAccordionShadowOptions",
2378
+ "declaration": {
2379
+ "name": "foundationAccordionShadowOptions",
2380
+ "module": "src/accordion/accordion.ts"
2381
+ }
2382
+ },
2383
+ {
2384
+ "kind": "js",
2385
+ "name": "defaultAccordionConfig",
2386
+ "declaration": {
2387
+ "name": "defaultAccordionConfig",
2388
+ "module": "src/accordion/accordion.ts"
2389
+ }
2390
+ },
2391
+ {
2392
+ "kind": "js",
2393
+ "name": "foundationAccordion",
2394
+ "declaration": {
2395
+ "name": "foundationAccordion",
2396
+ "module": "src/accordion/accordion.ts"
2397
+ }
2398
+ }
2399
+ ]
2400
+ },
2401
+ {
2402
+ "kind": "javascript-module",
2403
+ "path": "src/accordion/index.ts",
2222
2404
  "declarations": [],
2223
2405
  "exports": [
2224
2406
  {
@@ -2226,7 +2408,7 @@
2226
2408
  "name": "*",
2227
2409
  "declaration": {
2228
2410
  "name": "*",
2229
- "package": "./styles"
2411
+ "package": "./accordion.template"
2230
2412
  }
2231
2413
  },
2232
2414
  {
@@ -2234,7 +2416,7 @@
2234
2416
  "name": "*",
2235
2417
  "declaration": {
2236
2418
  "name": "*",
2237
- "package": "./tokens"
2419
+ "package": "./accordion.styles"
2238
2420
  }
2239
2421
  },
2240
2422
  {
@@ -2242,7 +2424,7 @@
2242
2424
  "name": "*",
2243
2425
  "declaration": {
2244
2426
  "name": "*",
2245
- "package": "./values"
2427
+ "package": "./accordion"
2246
2428
  }
2247
2429
  }
2248
2430
  ]
@@ -2767,188 +2949,6 @@
2767
2949
  }
2768
2950
  ]
2769
2951
  },
2770
- {
2771
- "kind": "javascript-module",
2772
- "path": "src/accordion/accordion.styles.ts",
2773
- "declarations": [
2774
- {
2775
- "kind": "function",
2776
- "name": "foundationAccordionStyles",
2777
- "return": {
2778
- "type": {
2779
- "text": "ElementStyles"
2780
- }
2781
- },
2782
- "parameters": [
2783
- {
2784
- "name": "context",
2785
- "type": {
2786
- "text": "ElementDefinitionContext"
2787
- }
2788
- },
2789
- {
2790
- "name": "definition",
2791
- "type": {
2792
- "text": "FoundationElementDefinition"
2793
- }
2794
- }
2795
- ]
2796
- }
2797
- ],
2798
- "exports": [
2799
- {
2800
- "kind": "js",
2801
- "name": "foundationAccordionStyles",
2802
- "declaration": {
2803
- "name": "foundationAccordionStyles",
2804
- "module": "src/accordion/accordion.styles.ts"
2805
- }
2806
- }
2807
- ]
2808
- },
2809
- {
2810
- "kind": "javascript-module",
2811
- "path": "src/accordion/accordion.template.ts",
2812
- "declarations": [
2813
- {
2814
- "kind": "function",
2815
- "name": "foundationAccordionTemplate",
2816
- "return": {
2817
- "type": {
2818
- "text": "ViewTemplate<Accordion>"
2819
- }
2820
- },
2821
- "parameters": [
2822
- {
2823
- "name": "context",
2824
- "type": {
2825
- "text": "ElementDefinitionContext"
2826
- }
2827
- },
2828
- {
2829
- "name": "definition",
2830
- "type": {
2831
- "text": "FoundationElementDefinition"
2832
- }
2833
- }
2834
- ]
2835
- }
2836
- ],
2837
- "exports": [
2838
- {
2839
- "kind": "js",
2840
- "name": "foundationAccordionTemplate",
2841
- "declaration": {
2842
- "name": "foundationAccordionTemplate",
2843
- "module": "src/accordion/accordion.template.ts"
2844
- }
2845
- }
2846
- ]
2847
- },
2848
- {
2849
- "kind": "javascript-module",
2850
- "path": "src/accordion/accordion.ts",
2851
- "declarations": [
2852
- {
2853
- "kind": "class",
2854
- "description": "",
2855
- "name": "Accordion",
2856
- "superclass": {
2857
- "name": "FASTAccordion",
2858
- "package": "@microsoft/fast-foundation"
2859
- },
2860
- "tagName": "%%prefix%%-accordion",
2861
- "customElement": true
2862
- },
2863
- {
2864
- "kind": "variable",
2865
- "name": "foundationAccordionShadowOptions",
2866
- "type": {
2867
- "text": "ShadowRootInit"
2868
- },
2869
- "default": "{\n delegatesFocus: true,\n mode: 'open',\n}"
2870
- },
2871
- {
2872
- "kind": "variable",
2873
- "name": "defaultAccordionConfig",
2874
- "type": {
2875
- "text": "object"
2876
- },
2877
- "default": "{}"
2878
- },
2879
- {
2880
- "kind": "variable",
2881
- "name": "foundationAccordion",
2882
- "description": "The Foundation Accordion",
2883
- "privacy": "public"
2884
- }
2885
- ],
2886
- "exports": [
2887
- {
2888
- "kind": "js",
2889
- "name": "Accordion",
2890
- "declaration": {
2891
- "name": "Accordion",
2892
- "module": "src/accordion/accordion.ts"
2893
- }
2894
- },
2895
- {
2896
- "kind": "js",
2897
- "name": "foundationAccordionShadowOptions",
2898
- "declaration": {
2899
- "name": "foundationAccordionShadowOptions",
2900
- "module": "src/accordion/accordion.ts"
2901
- }
2902
- },
2903
- {
2904
- "kind": "js",
2905
- "name": "defaultAccordionConfig",
2906
- "declaration": {
2907
- "name": "defaultAccordionConfig",
2908
- "module": "src/accordion/accordion.ts"
2909
- }
2910
- },
2911
- {
2912
- "kind": "js",
2913
- "name": "foundationAccordion",
2914
- "declaration": {
2915
- "name": "foundationAccordion",
2916
- "module": "src/accordion/accordion.ts"
2917
- }
2918
- }
2919
- ]
2920
- },
2921
- {
2922
- "kind": "javascript-module",
2923
- "path": "src/accordion/index.ts",
2924
- "declarations": [],
2925
- "exports": [
2926
- {
2927
- "kind": "js",
2928
- "name": "*",
2929
- "declaration": {
2930
- "name": "*",
2931
- "package": "./accordion.template"
2932
- }
2933
- },
2934
- {
2935
- "kind": "js",
2936
- "name": "*",
2937
- "declaration": {
2938
- "name": "*",
2939
- "package": "./accordion.styles"
2940
- }
2941
- },
2942
- {
2943
- "kind": "js",
2944
- "name": "*",
2945
- "declaration": {
2946
- "name": "*",
2947
- "package": "./accordion"
2948
- }
2949
- }
2950
- ]
2951
- },
2952
2952
  {
2953
2953
  "kind": "javascript-module",
2954
2954
  "path": "src/anchored-region/anchor-region.template.ts",
@@ -14370,6 +14370,40 @@
14370
14370
  }
14371
14371
  ]
14372
14372
  },
14373
+ {
14374
+ "kind": "function",
14375
+ "name": "applyCustomTokens",
14376
+ "return": {
14377
+ "type": {
14378
+ "text": "void"
14379
+ }
14380
+ },
14381
+ "parameters": [
14382
+ {
14383
+ "name": "provider",
14384
+ "type": {
14385
+ "text": "HTMLElement"
14386
+ },
14387
+ "description": "The HTML element to set CSS variables on"
14388
+ },
14389
+ {
14390
+ "name": "customTokens",
14391
+ "type": {
14392
+ "text": "CustomTokensConfig"
14393
+ },
14394
+ "description": "The custom tokens object to process"
14395
+ },
14396
+ {
14397
+ "name": "prefix",
14398
+ "default": "''",
14399
+ "type": {
14400
+ "text": "string"
14401
+ },
14402
+ "description": "Internal prefix for nested keys (used during recursion)"
14403
+ }
14404
+ ],
14405
+ "description": "Converts custom tokens to CSS custom properties and sets them on the provider element.\nSupports nested token groups which are flattened into kebab-case CSS variable names.\n\nExample:\n Input: { spacing: { padding: { small: { $value: \"8px\" } } } }\n Output: --spacing-padding-small: 8px"
14406
+ },
14373
14407
  {
14374
14408
  "kind": "function",
14375
14409
  "name": "getDefaultConfig",
@@ -14465,6 +14499,14 @@
14465
14499
  "module": "src/design-system-provider/design-system-provider.utils.ts"
14466
14500
  }
14467
14501
  },
14502
+ {
14503
+ "kind": "js",
14504
+ "name": "applyCustomTokens",
14505
+ "declaration": {
14506
+ "name": "applyCustomTokens",
14507
+ "module": "src/design-system-provider/design-system-provider.utils.ts"
14508
+ }
14509
+ },
14468
14510
  {
14469
14511
  "kind": "js",
14470
14512
  "name": "getDefaultConfig",
@@ -2,11 +2,24 @@ import { PaletteRGB } from '@microsoft/fast-components';
2
2
  import { ValueConverter } from '@microsoft/fast-element';
3
3
  import { FoundationElement, FoundationElementDefinition } from '@microsoft/fast-foundation';
4
4
  import type { DesignToken } from '@microsoft/fast-foundation';
5
- import { DesignTokensConfig } from './types';
5
+ import { CustomTokensConfig, DesignTokensConfig } from './types';
6
6
  export declare const provideTokens: (tokens: any, values: any, element?: HTMLElement) => void;
7
7
  export declare function designToken<T>(token: DesignToken<T>): (source: FoundationElement, key: string) => void;
8
8
  export declare const swatchConverter: ValueConverter;
9
9
  export declare const paletteFromHex: (hexColor: string) => PaletteRGB;
10
+ /**
11
+ * Converts custom tokens to CSS custom properties and sets them on the provider element.
12
+ * Supports nested token groups which are flattened into kebab-case CSS variable names.
13
+ *
14
+ * Example:
15
+ * Input: { spacing: { padding: { small: { $value: "8px" } } } }
16
+ * Output: --spacing-padding-small: 8px
17
+ *
18
+ * @param provider - The HTML element to set CSS variables on
19
+ * @param customTokens - The custom tokens object to process
20
+ * @param prefix - Internal prefix for nested keys (used during recursion)
21
+ */
22
+ export declare const applyCustomTokens: (provider: HTMLElement, customTokens: CustomTokensConfig, prefix?: string) => void;
10
23
  export declare const getDefaultConfig: (definition: Partial<FoundationElementDefinition>, exclusions?: string[]) => {};
11
24
  export declare const getExports: (registrationFunction: any) => {
12
25
  shadowOptions: any;
@@ -1 +1 @@
1
- {"version":3,"file":"design-system-provider.utils.d.ts","sourceRoot":"","sources":["../../../src/design-system-provider/design-system-provider.utils.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,UAAU,EA6BX,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAC;AAC5F,OAAO,KAAK,EAAE,WAAW,EAAoB,MAAM,4BAA4B,CAAC;AAChF,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE7C,eAAO,MAAM,aAAa,GAAI,WAAM,EAAE,WAAM,EAAE,UAAU,WAAW,SAalE,CAAC;AAEF,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,IAC1C,QAAQ,iBAAiB,EAAE,KAAK,MAAM,UAa/C;AAED,eAAO,MAAM,eAAe,EAAE,cAe7B,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,UAAU,MAAM,eACc,CAAC;AAG9D,eAAO,MAAM,gBAAgB,GAC3B,YAAY,OAAO,CAAC,2BAA2B,CAAC,EAChD,qBAA8B,OAO/B,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,yBAAoB;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,cAAc,MAAM,EAAE,OAAO,MAAM,WAOnE,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,UAAU,WAAW,EAAE,QAAQ,kBAAkB,SAuFtF,CAAC"}
1
+ {"version":3,"file":"design-system-provider.utils.d.ts","sourceRoot":"","sources":["../../../src/design-system-provider/design-system-provider.utils.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,UAAU,EA6BX,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAC;AAC5F,OAAO,KAAK,EAAE,WAAW,EAAoB,MAAM,4BAA4B,CAAC;AAChF,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAEjE,eAAO,MAAM,aAAa,GAAI,WAAM,EAAE,WAAM,EAAE,UAAU,WAAW,SAalE,CAAC;AAEF,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,IAC1C,QAAQ,iBAAiB,EAAE,KAAK,MAAM,UAa/C;AAED,eAAO,MAAM,eAAe,EAAE,cAe7B,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,UAAU,MAAM,eACc,CAAC;AAE9D;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,iBAAiB,GAC5B,UAAU,WAAW,EACrB,cAAc,kBAAkB,EAChC,SAAQ,MAAW,KAClB,IAcF,CAAC;AAGF,eAAO,MAAM,gBAAgB,GAC3B,YAAY,OAAO,CAAC,2BAA2B,CAAC,EAChD,qBAA8B,OAO/B,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,yBAAoB;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,cAAc,MAAM,EAAE,OAAO,MAAM,WAOnE,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,UAAU,WAAW,EAAE,QAAQ,kBAAkB,SA4FtF,CAAC"}
@@ -1,3 +1,18 @@
1
+ type TokenValue = string | number | boolean;
2
+ interface DesignToken {
3
+ $value: TokenValue;
4
+ $type?: string;
5
+ }
6
+ /**
7
+ * Custom tokens can be either a token value or nested token groups.
8
+ * This allows for arbitrary nesting depth (e.g., spacing.padding.small)
9
+ */
10
+ type CustomTokenValue = DesignToken | {
11
+ [key: string]: CustomTokenValue;
12
+ };
13
+ export interface CustomTokensConfig {
14
+ [key: string]: CustomTokenValue;
15
+ }
1
16
  export interface DesignTokensConfig {
2
17
  design_tokens: {
3
18
  color: {
@@ -53,5 +68,7 @@ export interface DesignTokensConfig {
53
68
  };
54
69
  };
55
70
  };
71
+ customTokens?: CustomTokensConfig;
56
72
  }
73
+ export {};
57
74
  //# sourceMappingURL=types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/design-system-provider/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,kBAAkB;IACjC,aAAa,EAAE;QACb,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,OAAO,EAAE;gBACP,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,UAAU,EAAE;YACV,QAAQ,EAAE;gBACR,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,UAAU,EAAE;YACV,YAAY,EAAE;gBACZ,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,cAAc,EAAE;gBACd,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,IAAI,EAAE;YACJ,SAAS,EAAE;gBACT,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,YAAY,EAAE;gBACZ,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,WAAW,EAAE;gBACX,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,KAAK,EAAE;YACL,UAAU,EAAE;gBACV,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;KACH,CAAC;CACH"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/design-system-provider/types.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAE5C,UAAU,WAAW;IACnB,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;GAGG;AACH,KAAK,gBAAgB,GACjB,WAAW,GACX;IACE,CAAC,GAAG,EAAE,MAAM,GAAG,gBAAgB,CAAC;CACjC,CAAC;AAEN,MAAM,WAAW,kBAAkB;IACjC,CAAC,GAAG,EAAE,MAAM,GAAG,gBAAgB,CAAC;CACjC;AAED,MAAM,WAAW,kBAAkB;IACjC,aAAa,EAAE;QACb,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,OAAO,EAAE;gBACP,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,UAAU,EAAE;YACV,QAAQ,EAAE;gBACR,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,UAAU,EAAE;YACV,YAAY,EAAE;gBACZ,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,cAAc,EAAE;gBACd,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,IAAI,EAAE;YACJ,SAAS,EAAE;gBACT,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,YAAY,EAAE;gBACZ,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;YACF,WAAW,EAAE;gBACX,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;QACF,KAAK,EAAE;YACL,UAAU,EAAE;gBACV,MAAM,EAAE,MAAM,CAAC;gBACf,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;KACH,CAAC;IACF,YAAY,CAAC,EAAE,kBAAkB,CAAC;CACnC"}
@@ -40,6 +40,33 @@ export const swatchConverter = {
40
40
  },
41
41
  };
42
42
  export const paletteFromHex = (hexColor) => PaletteRGB.from(SwatchRGB.from(parseColorHexRGB(hexColor)));
43
+ /**
44
+ * Converts custom tokens to CSS custom properties and sets them on the provider element.
45
+ * Supports nested token groups which are flattened into kebab-case CSS variable names.
46
+ *
47
+ * Example:
48
+ * Input: { spacing: { padding: { small: { $value: "8px" } } } }
49
+ * Output: --spacing-padding-small: 8px
50
+ *
51
+ * @param provider - The HTML element to set CSS variables on
52
+ * @param customTokens - The custom tokens object to process
53
+ * @param prefix - Internal prefix for nested keys (used during recursion)
54
+ */
55
+ export const applyCustomTokens = (provider, customTokens, prefix = '') => {
56
+ Object.entries(customTokens).forEach(([key, value]) => {
57
+ const cssVarName = prefix ? `${prefix}-${key}` : key;
58
+ if (value && typeof value === 'object') {
59
+ // If it has $value, this is a leaf token - set it as CSS variable
60
+ if ('$value' in value) {
61
+ provider.style.setProperty(`--${cssVarName}`, String(value.$value));
62
+ }
63
+ else {
64
+ // Otherwise, it's a token group - recurse into nested structure
65
+ applyCustomTokens(provider, value, cssVarName);
66
+ }
67
+ }
68
+ });
69
+ };
43
70
  const defaultExclusions = ['baseClass', 'baseName', 'shadowOptions', 'styles', 'template'];
44
71
  export const getDefaultConfig = (definition, exclusions = defaultExclusions) => {
45
72
  const keys = Object.keys(definition).filter((k) => !exclusions.includes(k));
@@ -92,4 +119,8 @@ export const configureDesignSystem = (provider, config) => {
92
119
  typeRampPlus5LineHeight.setValueFor(provider, getTypeRampValue(baseLineHeight, TypeRampValues.plusFive));
93
120
  typeRampPlus6FontSize.setValueFor(provider, getTypeRampValue(baseFontSize, TypeRampValues.plusSix));
94
121
  typeRampPlus6LineHeight.setValueFor(provider, getTypeRampValue(baseLineHeight, TypeRampValues.plusSix));
122
+ // Apply custom tokens if provided
123
+ if (config.customTokens) {
124
+ applyCustomTokens(provider, config.customTokens);
125
+ }
95
126
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@genesislcap/foundation-ui",
3
3
  "description": "Genesis Foundation UI",
4
- "version": "14.351.0",
4
+ "version": "14.353.0",
5
5
  "sideEffects": false,
6
6
  "license": "SEE LICENSE IN license.txt",
7
7
  "main": "dist/esm/index.js",
@@ -83,13 +83,13 @@
83
83
  }
84
84
  },
85
85
  "devDependencies": {
86
- "@genesislcap/foundation-testing": "14.351.0",
87
- "@genesislcap/genx": "14.351.0",
88
- "@genesislcap/rollup-builder": "14.351.0",
89
- "@genesislcap/ts-builder": "14.351.0",
90
- "@genesislcap/uvu-playwright-builder": "14.351.0",
91
- "@genesislcap/vite-builder": "14.351.0",
92
- "@genesislcap/webpack-builder": "14.351.0",
86
+ "@genesislcap/foundation-testing": "14.353.0",
87
+ "@genesislcap/genx": "14.353.0",
88
+ "@genesislcap/rollup-builder": "14.353.0",
89
+ "@genesislcap/ts-builder": "14.353.0",
90
+ "@genesislcap/uvu-playwright-builder": "14.353.0",
91
+ "@genesislcap/vite-builder": "14.353.0",
92
+ "@genesislcap/webpack-builder": "14.353.0",
93
93
  "copyfiles": "^2.4.1"
94
94
  },
95
95
  "dependencies": {
@@ -98,15 +98,15 @@
98
98
  "@fortawesome/free-regular-svg-icons": "^6.2.1",
99
99
  "@fortawesome/free-solid-svg-icons": "^6.2.1",
100
100
  "@genesiscommunitysuccess/analyzer-import-alias-plugin": "^5.0.3",
101
- "@genesislcap/expression-builder": "14.351.0",
102
- "@genesislcap/foundation-comms": "14.351.0",
103
- "@genesislcap/foundation-criteria": "14.351.0",
104
- "@genesislcap/foundation-errors": "14.351.0",
105
- "@genesislcap/foundation-events": "14.351.0",
106
- "@genesislcap/foundation-logger": "14.351.0",
107
- "@genesislcap/foundation-notifications": "14.351.0",
108
- "@genesislcap/foundation-user": "14.351.0",
109
- "@genesislcap/foundation-utils": "14.351.0",
101
+ "@genesislcap/expression-builder": "14.353.0",
102
+ "@genesislcap/foundation-comms": "14.353.0",
103
+ "@genesislcap/foundation-criteria": "14.353.0",
104
+ "@genesislcap/foundation-errors": "14.353.0",
105
+ "@genesislcap/foundation-events": "14.353.0",
106
+ "@genesislcap/foundation-logger": "14.353.0",
107
+ "@genesislcap/foundation-notifications": "14.353.0",
108
+ "@genesislcap/foundation-user": "14.353.0",
109
+ "@genesislcap/foundation-utils": "14.353.0",
110
110
  "@microsoft/fast-colors": "5.3.1",
111
111
  "@microsoft/fast-components": "2.30.6",
112
112
  "@microsoft/fast-element": "1.14.0",
@@ -128,5 +128,5 @@
128
128
  "access": "public"
129
129
  },
130
130
  "customElements": "dist/custom-elements.json",
131
- "gitHead": "d0f0215ebf3210e0cd23176af2a24190ef291b06"
131
+ "gitHead": "056526f2c5983b54024fe6fcdeb7c6e83e0e5cb3"
132
132
  }