@blockle/blocks-core 0.24.0 → 1.0.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.
Files changed (17) hide show
  1. package/dist/atoms/atoms.css.d.ts +296 -142
  2. package/dist/atoms/atoms.js +2 -2
  3. package/dist/config/themeTokens.d.ts +5 -5
  4. package/dist/css/tokens.js +18 -16
  5. package/dist/css/vars.css.d.ts +23 -18
  6. package/dist/index.d.ts +9 -9
  7. package/dist/index.js +4 -4
  8. package/dist/theme/makeComponentTheme.d.ts +1 -1
  9. package/dist/theme/makeComponentTheme.js +1 -1
  10. package/dist/theme/makeVanillaTheme.d.ts +2 -2
  11. package/dist/theme/makeVanillaTheme.js +13 -3
  12. package/package.json +1 -1
  13. package/dist/atoms/atoms.spec.d.ts +0 -1
  14. package/dist/css/breakpoint/breakpoint.test.d.ts +0 -1
  15. package/dist/css/cssMatrixUtils.test.d.ts +0 -1
  16. package/dist/utils/classnames/classnames.test.d.ts +0 -1
  17. package/dist/utils/math/math.test.d.ts +0 -1
package/dist/atoms/atoms.css.d.ts CHANGED
@@ -963,47 +963,53 @@ export declare const atomicProperties: {
963
963
  };
964
964
  borderRadius: {
965
965
  values: {
966
- medium: {
966
+ 0: {
967
967
  defaultClass: string;
968
968
  } | {
969
969
  defaultClass: string;
970
970
  conditions: string[];
971
971
  };
972
- small: {
972
+ 4: {
973
973
  defaultClass: string;
974
974
  } | {
975
975
  defaultClass: string;
976
976
  conditions: string[];
977
977
  };
978
- large: {
978
+ 1: {
979
979
  defaultClass: string;
980
980
  } | {
981
981
  defaultClass: string;
982
982
  conditions: string[];
983
983
  };
984
- xlarge: {
984
+ 2: {
985
985
  defaultClass: string;
986
986
  } | {
987
987
  defaultClass: string;
988
988
  conditions: string[];
989
989
  };
990
- };
991
- };
992
- borderWidth: {
993
- values: {
994
- medium: {
990
+ 3: {
995
991
  defaultClass: string;
996
992
  } | {
997
993
  defaultClass: string;
998
994
  conditions: string[];
999
995
  };
1000
- small: {
996
+ full: {
1001
997
  defaultClass: string;
1002
998
  } | {
1003
999
  defaultClass: string;
1004
1000
  conditions: string[];
1005
1001
  };
1006
- large: {
1002
+ };
1003
+ };
1004
+ borderWidth: {
1005
+ values: {
1006
+ thin: {
1007
+ defaultClass: string;
1008
+ } | {
1009
+ defaultClass: string;
1010
+ conditions: string[];
1011
+ };
1012
+ thick: {
1007
1013
  defaultClass: string;
1008
1014
  } | {
1009
1015
  defaultClass: string;
@@ -1555,7 +1561,13 @@ export declare const atomicProperties: {
1555
1561
  };
1556
1562
  fontWeight: {
1557
1563
  values: {
1558
- regular: {
1564
+ light: {
1565
+ defaultClass: string;
1566
+ } | {
1567
+ defaultClass: string;
1568
+ conditions: string[];
1569
+ };
1570
+ normal: {
1559
1571
  defaultClass: string;
1560
1572
  } | {
1561
1573
  defaultClass: string;
@@ -1573,6 +1585,12 @@ export declare const atomicProperties: {
1573
1585
  defaultClass: string;
1574
1586
  conditions: string[];
1575
1587
  };
1588
+ bold: {
1589
+ defaultClass: string;
1590
+ } | {
1591
+ defaultClass: string;
1592
+ conditions: string[];
1593
+ };
1576
1594
  };
1577
1595
  };
1578
1596
  inlineSize: {
@@ -1665,19 +1683,19 @@ export declare const atomicProperties: {
1665
1683
  defaultClass: string;
1666
1684
  conditions: string[];
1667
1685
  };
1668
- xsmall: {
1686
+ small: {
1669
1687
  defaultClass: string;
1670
1688
  } | {
1671
1689
  defaultClass: string;
1672
1690
  conditions: string[];
1673
1691
  };
1674
- small: {
1692
+ large: {
1675
1693
  defaultClass: string;
1676
1694
  } | {
1677
1695
  defaultClass: string;
1678
1696
  conditions: string[];
1679
1697
  };
1680
- large: {
1698
+ xsmall: {
1681
1699
  defaultClass: string;
1682
1700
  } | {
1683
1701
  defaultClass: string;
@@ -1923,13 +1941,13 @@ export declare const atomicProperties: {
1923
1941
  };
1924
1942
  transition: {
1925
1943
  values: {
1926
- slow: {
1944
+ normal: {
1927
1945
  defaultClass: string;
1928
1946
  } | {
1929
1947
  defaultClass: string;
1930
1948
  conditions: string[];
1931
1949
  };
1932
- normal: {
1950
+ slow: {
1933
1951
  defaultClass: string;
1934
1952
  } | {
1935
1953
  defaultClass: string;
@@ -2111,31 +2129,39 @@ export declare const atomicProperties: {
2111
2129
  };
2112
2130
  columnGap: {
2113
2131
  values: {
2114
- medium: {
2132
+ 0: {
2115
2133
  defaultClass: string;
2116
2134
  conditions: string[];
2117
2135
  };
2118
- none: {
2136
+ 4: {
2119
2137
  defaultClass: string;
2120
2138
  conditions: string[];
2121
2139
  };
2122
- gutter: {
2140
+ 1: {
2123
2141
  defaultClass: string;
2124
2142
  conditions: string[];
2125
2143
  };
2126
- xsmall: {
2144
+ 2: {
2127
2145
  defaultClass: string;
2128
2146
  conditions: string[];
2129
2147
  };
2130
- small: {
2148
+ 3: {
2131
2149
  defaultClass: string;
2132
2150
  conditions: string[];
2133
2151
  };
2134
- large: {
2152
+ 5: {
2135
2153
  defaultClass: string;
2136
2154
  conditions: string[];
2137
2155
  };
2138
- xlarge: {
2156
+ 6: {
2157
+ defaultClass: string;
2158
+ conditions: string[];
2159
+ };
2160
+ 7: {
2161
+ defaultClass: string;
2162
+ conditions: string[];
2163
+ };
2164
+ 8: {
2139
2165
  defaultClass: string;
2140
2166
  conditions: string[];
2141
2167
  };
@@ -2143,15 +2169,15 @@ export declare const atomicProperties: {
2143
2169
  };
2144
2170
  display: {
2145
2171
  values: {
2146
- none: {
2172
+ flex: {
2147
2173
  defaultClass: string;
2148
2174
  conditions: string[];
2149
2175
  };
2150
- flex: {
2176
+ grid: {
2151
2177
  defaultClass: string;
2152
2178
  conditions: string[];
2153
2179
  };
2154
- grid: {
2180
+ none: {
2155
2181
  defaultClass: string;
2156
2182
  conditions: string[];
2157
2183
  };
@@ -2247,15 +2273,15 @@ export declare const atomicProperties: {
2247
2273
  defaultClass: string;
2248
2274
  conditions: string[];
2249
2275
  };
2250
- xsmall: {
2276
+ small: {
2251
2277
  defaultClass: string;
2252
2278
  conditions: string[];
2253
2279
  };
2254
- small: {
2280
+ large: {
2255
2281
  defaultClass: string;
2256
2282
  conditions: string[];
2257
2283
  };
2258
- large: {
2284
+ xsmall: {
2259
2285
  defaultClass: string;
2260
2286
  conditions: string[];
2261
2287
  };
@@ -2267,31 +2293,39 @@ export declare const atomicProperties: {
2267
2293
  };
2268
2294
  gap: {
2269
2295
  values: {
2270
- medium: {
2296
+ 0: {
2271
2297
  defaultClass: string;
2272
2298
  conditions: string[];
2273
2299
  };
2274
- none: {
2300
+ 4: {
2275
2301
  defaultClass: string;
2276
2302
  conditions: string[];
2277
2303
  };
2278
- gutter: {
2304
+ 1: {
2279
2305
  defaultClass: string;
2280
2306
  conditions: string[];
2281
2307
  };
2282
- xsmall: {
2308
+ 2: {
2283
2309
  defaultClass: string;
2284
2310
  conditions: string[];
2285
2311
  };
2286
- small: {
2312
+ 3: {
2287
2313
  defaultClass: string;
2288
2314
  conditions: string[];
2289
2315
  };
2290
- large: {
2316
+ 5: {
2291
2317
  defaultClass: string;
2292
2318
  conditions: string[];
2293
2319
  };
2294
- xlarge: {
2320
+ 6: {
2321
+ defaultClass: string;
2322
+ conditions: string[];
2323
+ };
2324
+ 7: {
2325
+ defaultClass: string;
2326
+ conditions: string[];
2327
+ };
2328
+ 8: {
2295
2329
  defaultClass: string;
2296
2330
  conditions: string[];
2297
2331
  };
@@ -2323,31 +2357,39 @@ export declare const atomicProperties: {
2323
2357
  };
2324
2358
  margin: {
2325
2359
  values: {
2326
- medium: {
2360
+ 0: {
2327
2361
  defaultClass: string;
2328
2362
  conditions: string[];
2329
2363
  };
2330
- none: {
2364
+ 4: {
2331
2365
  defaultClass: string;
2332
2366
  conditions: string[];
2333
2367
  };
2334
- gutter: {
2368
+ 1: {
2335
2369
  defaultClass: string;
2336
2370
  conditions: string[];
2337
2371
  };
2338
- xsmall: {
2372
+ 2: {
2339
2373
  defaultClass: string;
2340
2374
  conditions: string[];
2341
2375
  };
2342
- small: {
2376
+ 3: {
2343
2377
  defaultClass: string;
2344
2378
  conditions: string[];
2345
2379
  };
2346
- large: {
2380
+ 5: {
2347
2381
  defaultClass: string;
2348
2382
  conditions: string[];
2349
2383
  };
2350
- xlarge: {
2384
+ 6: {
2385
+ defaultClass: string;
2386
+ conditions: string[];
2387
+ };
2388
+ 7: {
2389
+ defaultClass: string;
2390
+ conditions: string[];
2391
+ };
2392
+ 8: {
2351
2393
  defaultClass: string;
2352
2394
  conditions: string[];
2353
2395
  };
@@ -2359,31 +2401,39 @@ export declare const atomicProperties: {
2359
2401
  };
2360
2402
  marginBlock: {
2361
2403
  values: {
2362
- medium: {
2404
+ 0: {
2363
2405
  defaultClass: string;
2364
2406
  conditions: string[];
2365
2407
  };
2366
- none: {
2408
+ 4: {
2409
+ defaultClass: string;
2410
+ conditions: string[];
2411
+ };
2412
+ 1: {
2367
2413
  defaultClass: string;
2368
2414
  conditions: string[];
2369
2415
  };
2370
- gutter: {
2416
+ 2: {
2371
2417
  defaultClass: string;
2372
2418
  conditions: string[];
2373
2419
  };
2374
- xsmall: {
2420
+ 3: {
2375
2421
  defaultClass: string;
2376
2422
  conditions: string[];
2377
2423
  };
2378
- small: {
2424
+ 5: {
2379
2425
  defaultClass: string;
2380
2426
  conditions: string[];
2381
2427
  };
2382
- large: {
2428
+ 6: {
2383
2429
  defaultClass: string;
2384
2430
  conditions: string[];
2385
2431
  };
2386
- xlarge: {
2432
+ 7: {
2433
+ defaultClass: string;
2434
+ conditions: string[];
2435
+ };
2436
+ 8: {
2387
2437
  defaultClass: string;
2388
2438
  conditions: string[];
2389
2439
  };
@@ -2395,31 +2445,39 @@ export declare const atomicProperties: {
2395
2445
  };
2396
2446
  marginBlockEnd: {
2397
2447
  values: {
2398
- medium: {
2448
+ 0: {
2399
2449
  defaultClass: string;
2400
2450
  conditions: string[];
2401
2451
  };
2402
- none: {
2452
+ 4: {
2403
2453
  defaultClass: string;
2404
2454
  conditions: string[];
2405
2455
  };
2406
- gutter: {
2456
+ 1: {
2407
2457
  defaultClass: string;
2408
2458
  conditions: string[];
2409
2459
  };
2410
- xsmall: {
2460
+ 2: {
2411
2461
  defaultClass: string;
2412
2462
  conditions: string[];
2413
2463
  };
2414
- small: {
2464
+ 3: {
2415
2465
  defaultClass: string;
2416
2466
  conditions: string[];
2417
2467
  };
2418
- large: {
2468
+ 5: {
2419
2469
  defaultClass: string;
2420
2470
  conditions: string[];
2421
2471
  };
2422
- xlarge: {
2472
+ 6: {
2473
+ defaultClass: string;
2474
+ conditions: string[];
2475
+ };
2476
+ 7: {
2477
+ defaultClass: string;
2478
+ conditions: string[];
2479
+ };
2480
+ 8: {
2423
2481
  defaultClass: string;
2424
2482
  conditions: string[];
2425
2483
  };
@@ -2431,31 +2489,39 @@ export declare const atomicProperties: {
2431
2489
  };
2432
2490
  marginBlockStart: {
2433
2491
  values: {
2434
- medium: {
2492
+ 0: {
2435
2493
  defaultClass: string;
2436
2494
  conditions: string[];
2437
2495
  };
2438
- none: {
2496
+ 4: {
2439
2497
  defaultClass: string;
2440
2498
  conditions: string[];
2441
2499
  };
2442
- gutter: {
2500
+ 1: {
2443
2501
  defaultClass: string;
2444
2502
  conditions: string[];
2445
2503
  };
2446
- xsmall: {
2504
+ 2: {
2447
2505
  defaultClass: string;
2448
2506
  conditions: string[];
2449
2507
  };
2450
- small: {
2508
+ 3: {
2451
2509
  defaultClass: string;
2452
2510
  conditions: string[];
2453
2511
  };
2454
- large: {
2512
+ 5: {
2455
2513
  defaultClass: string;
2456
2514
  conditions: string[];
2457
2515
  };
2458
- xlarge: {
2516
+ 6: {
2517
+ defaultClass: string;
2518
+ conditions: string[];
2519
+ };
2520
+ 7: {
2521
+ defaultClass: string;
2522
+ conditions: string[];
2523
+ };
2524
+ 8: {
2459
2525
  defaultClass: string;
2460
2526
  conditions: string[];
2461
2527
  };
@@ -2467,31 +2533,39 @@ export declare const atomicProperties: {
2467
2533
  };
2468
2534
  marginInline: {
2469
2535
  values: {
2470
- medium: {
2536
+ 0: {
2471
2537
  defaultClass: string;
2472
2538
  conditions: string[];
2473
2539
  };
2474
- none: {
2540
+ 4: {
2475
2541
  defaultClass: string;
2476
2542
  conditions: string[];
2477
2543
  };
2478
- gutter: {
2544
+ 1: {
2479
2545
  defaultClass: string;
2480
2546
  conditions: string[];
2481
2547
  };
2482
- xsmall: {
2548
+ 2: {
2483
2549
  defaultClass: string;
2484
2550
  conditions: string[];
2485
2551
  };
2486
- small: {
2552
+ 3: {
2487
2553
  defaultClass: string;
2488
2554
  conditions: string[];
2489
2555
  };
2490
- large: {
2556
+ 5: {
2491
2557
  defaultClass: string;
2492
2558
  conditions: string[];
2493
2559
  };
2494
- xlarge: {
2560
+ 6: {
2561
+ defaultClass: string;
2562
+ conditions: string[];
2563
+ };
2564
+ 7: {
2565
+ defaultClass: string;
2566
+ conditions: string[];
2567
+ };
2568
+ 8: {
2495
2569
  defaultClass: string;
2496
2570
  conditions: string[];
2497
2571
  };
@@ -2503,31 +2577,39 @@ export declare const atomicProperties: {
2503
2577
  };
2504
2578
  marginInlineEnd: {
2505
2579
  values: {
2506
- medium: {
2580
+ 0: {
2507
2581
  defaultClass: string;
2508
2582
  conditions: string[];
2509
2583
  };
2510
- none: {
2584
+ 4: {
2511
2585
  defaultClass: string;
2512
2586
  conditions: string[];
2513
2587
  };
2514
- gutter: {
2588
+ 1: {
2515
2589
  defaultClass: string;
2516
2590
  conditions: string[];
2517
2591
  };
2518
- xsmall: {
2592
+ 2: {
2519
2593
  defaultClass: string;
2520
2594
  conditions: string[];
2521
2595
  };
2522
- small: {
2596
+ 3: {
2523
2597
  defaultClass: string;
2524
2598
  conditions: string[];
2525
2599
  };
2526
- large: {
2600
+ 5: {
2527
2601
  defaultClass: string;
2528
2602
  conditions: string[];
2529
2603
  };
2530
- xlarge: {
2604
+ 6: {
2605
+ defaultClass: string;
2606
+ conditions: string[];
2607
+ };
2608
+ 7: {
2609
+ defaultClass: string;
2610
+ conditions: string[];
2611
+ };
2612
+ 8: {
2531
2613
  defaultClass: string;
2532
2614
  conditions: string[];
2533
2615
  };
@@ -2539,31 +2621,39 @@ export declare const atomicProperties: {
2539
2621
  };
2540
2622
  marginInlineStart: {
2541
2623
  values: {
2542
- medium: {
2624
+ 0: {
2543
2625
  defaultClass: string;
2544
2626
  conditions: string[];
2545
2627
  };
2546
- none: {
2628
+ 4: {
2547
2629
  defaultClass: string;
2548
2630
  conditions: string[];
2549
2631
  };
2550
- gutter: {
2632
+ 1: {
2551
2633
  defaultClass: string;
2552
2634
  conditions: string[];
2553
2635
  };
2554
- xsmall: {
2636
+ 2: {
2555
2637
  defaultClass: string;
2556
2638
  conditions: string[];
2557
2639
  };
2558
- small: {
2640
+ 3: {
2559
2641
  defaultClass: string;
2560
2642
  conditions: string[];
2561
2643
  };
2562
- large: {
2644
+ 5: {
2563
2645
  defaultClass: string;
2564
2646
  conditions: string[];
2565
2647
  };
2566
- xlarge: {
2648
+ 6: {
2649
+ defaultClass: string;
2650
+ conditions: string[];
2651
+ };
2652
+ 7: {
2653
+ defaultClass: string;
2654
+ conditions: string[];
2655
+ };
2656
+ 8: {
2567
2657
  defaultClass: string;
2568
2658
  conditions: string[];
2569
2659
  };
@@ -2575,31 +2665,39 @@ export declare const atomicProperties: {
2575
2665
  };
2576
2666
  padding: {
2577
2667
  values: {
2578
- medium: {
2668
+ 0: {
2579
2669
  defaultClass: string;
2580
2670
  conditions: string[];
2581
2671
  };
2582
- none: {
2672
+ 4: {
2583
2673
  defaultClass: string;
2584
2674
  conditions: string[];
2585
2675
  };
2586
- gutter: {
2676
+ 1: {
2587
2677
  defaultClass: string;
2588
2678
  conditions: string[];
2589
2679
  };
2590
- xsmall: {
2680
+ 2: {
2591
2681
  defaultClass: string;
2592
2682
  conditions: string[];
2593
2683
  };
2594
- small: {
2684
+ 3: {
2595
2685
  defaultClass: string;
2596
2686
  conditions: string[];
2597
2687
  };
2598
- large: {
2688
+ 5: {
2599
2689
  defaultClass: string;
2600
2690
  conditions: string[];
2601
2691
  };
2602
- xlarge: {
2692
+ 6: {
2693
+ defaultClass: string;
2694
+ conditions: string[];
2695
+ };
2696
+ 7: {
2697
+ defaultClass: string;
2698
+ conditions: string[];
2699
+ };
2700
+ 8: {
2603
2701
  defaultClass: string;
2604
2702
  conditions: string[];
2605
2703
  };
@@ -2607,31 +2705,39 @@ export declare const atomicProperties: {
2607
2705
  };
2608
2706
  paddingBlock: {
2609
2707
  values: {
2610
- medium: {
2708
+ 0: {
2611
2709
  defaultClass: string;
2612
2710
  conditions: string[];
2613
2711
  };
2614
- none: {
2712
+ 4: {
2615
2713
  defaultClass: string;
2616
2714
  conditions: string[];
2617
2715
  };
2618
- gutter: {
2716
+ 1: {
2619
2717
  defaultClass: string;
2620
2718
  conditions: string[];
2621
2719
  };
2622
- xsmall: {
2720
+ 2: {
2623
2721
  defaultClass: string;
2624
2722
  conditions: string[];
2625
2723
  };
2626
- small: {
2724
+ 3: {
2627
2725
  defaultClass: string;
2628
2726
  conditions: string[];
2629
2727
  };
2630
- large: {
2728
+ 5: {
2631
2729
  defaultClass: string;
2632
2730
  conditions: string[];
2633
2731
  };
2634
- xlarge: {
2732
+ 6: {
2733
+ defaultClass: string;
2734
+ conditions: string[];
2735
+ };
2736
+ 7: {
2737
+ defaultClass: string;
2738
+ conditions: string[];
2739
+ };
2740
+ 8: {
2635
2741
  defaultClass: string;
2636
2742
  conditions: string[];
2637
2743
  };
@@ -2639,31 +2745,39 @@ export declare const atomicProperties: {
2639
2745
  };
2640
2746
  paddingBlockEnd: {
2641
2747
  values: {
2642
- medium: {
2748
+ 0: {
2643
2749
  defaultClass: string;
2644
2750
  conditions: string[];
2645
2751
  };
2646
- none: {
2752
+ 4: {
2647
2753
  defaultClass: string;
2648
2754
  conditions: string[];
2649
2755
  };
2650
- gutter: {
2756
+ 1: {
2651
2757
  defaultClass: string;
2652
2758
  conditions: string[];
2653
2759
  };
2654
- xsmall: {
2760
+ 2: {
2655
2761
  defaultClass: string;
2656
2762
  conditions: string[];
2657
2763
  };
2658
- small: {
2764
+ 3: {
2659
2765
  defaultClass: string;
2660
2766
  conditions: string[];
2661
2767
  };
2662
- large: {
2768
+ 5: {
2663
2769
  defaultClass: string;
2664
2770
  conditions: string[];
2665
2771
  };
2666
- xlarge: {
2772
+ 6: {
2773
+ defaultClass: string;
2774
+ conditions: string[];
2775
+ };
2776
+ 7: {
2777
+ defaultClass: string;
2778
+ conditions: string[];
2779
+ };
2780
+ 8: {
2667
2781
  defaultClass: string;
2668
2782
  conditions: string[];
2669
2783
  };
@@ -2671,31 +2785,39 @@ export declare const atomicProperties: {
2671
2785
  };
2672
2786
  paddingBlockStart: {
2673
2787
  values: {
2674
- medium: {
2788
+ 0: {
2675
2789
  defaultClass: string;
2676
2790
  conditions: string[];
2677
2791
  };
2678
- none: {
2792
+ 4: {
2679
2793
  defaultClass: string;
2680
2794
  conditions: string[];
2681
2795
  };
2682
- gutter: {
2796
+ 1: {
2683
2797
  defaultClass: string;
2684
2798
  conditions: string[];
2685
2799
  };
2686
- xsmall: {
2800
+ 2: {
2687
2801
  defaultClass: string;
2688
2802
  conditions: string[];
2689
2803
  };
2690
- small: {
2804
+ 3: {
2691
2805
  defaultClass: string;
2692
2806
  conditions: string[];
2693
2807
  };
2694
- large: {
2808
+ 5: {
2695
2809
  defaultClass: string;
2696
2810
  conditions: string[];
2697
2811
  };
2698
- xlarge: {
2812
+ 6: {
2813
+ defaultClass: string;
2814
+ conditions: string[];
2815
+ };
2816
+ 7: {
2817
+ defaultClass: string;
2818
+ conditions: string[];
2819
+ };
2820
+ 8: {
2699
2821
  defaultClass: string;
2700
2822
  conditions: string[];
2701
2823
  };
@@ -2703,31 +2825,39 @@ export declare const atomicProperties: {
2703
2825
  };
2704
2826
  paddingInline: {
2705
2827
  values: {
2706
- medium: {
2828
+ 0: {
2707
2829
  defaultClass: string;
2708
2830
  conditions: string[];
2709
2831
  };
2710
- none: {
2832
+ 4: {
2711
2833
  defaultClass: string;
2712
2834
  conditions: string[];
2713
2835
  };
2714
- gutter: {
2836
+ 1: {
2715
2837
  defaultClass: string;
2716
2838
  conditions: string[];
2717
2839
  };
2718
- xsmall: {
2840
+ 2: {
2719
2841
  defaultClass: string;
2720
2842
  conditions: string[];
2721
2843
  };
2722
- small: {
2844
+ 3: {
2723
2845
  defaultClass: string;
2724
2846
  conditions: string[];
2725
2847
  };
2726
- large: {
2848
+ 5: {
2727
2849
  defaultClass: string;
2728
2850
  conditions: string[];
2729
2851
  };
2730
- xlarge: {
2852
+ 6: {
2853
+ defaultClass: string;
2854
+ conditions: string[];
2855
+ };
2856
+ 7: {
2857
+ defaultClass: string;
2858
+ conditions: string[];
2859
+ };
2860
+ 8: {
2731
2861
  defaultClass: string;
2732
2862
  conditions: string[];
2733
2863
  };
@@ -2735,31 +2865,39 @@ export declare const atomicProperties: {
2735
2865
  };
2736
2866
  paddingInlineEnd: {
2737
2867
  values: {
2738
- medium: {
2868
+ 0: {
2739
2869
  defaultClass: string;
2740
2870
  conditions: string[];
2741
2871
  };
2742
- none: {
2872
+ 4: {
2743
2873
  defaultClass: string;
2744
2874
  conditions: string[];
2745
2875
  };
2746
- gutter: {
2876
+ 1: {
2747
2877
  defaultClass: string;
2748
2878
  conditions: string[];
2749
2879
  };
2750
- xsmall: {
2880
+ 2: {
2751
2881
  defaultClass: string;
2752
2882
  conditions: string[];
2753
2883
  };
2754
- small: {
2884
+ 3: {
2755
2885
  defaultClass: string;
2756
2886
  conditions: string[];
2757
2887
  };
2758
- large: {
2888
+ 5: {
2759
2889
  defaultClass: string;
2760
2890
  conditions: string[];
2761
2891
  };
2762
- xlarge: {
2892
+ 6: {
2893
+ defaultClass: string;
2894
+ conditions: string[];
2895
+ };
2896
+ 7: {
2897
+ defaultClass: string;
2898
+ conditions: string[];
2899
+ };
2900
+ 8: {
2763
2901
  defaultClass: string;
2764
2902
  conditions: string[];
2765
2903
  };
@@ -2767,31 +2905,39 @@ export declare const atomicProperties: {
2767
2905
  };
2768
2906
  paddingInlineStart: {
2769
2907
  values: {
2770
- medium: {
2908
+ 0: {
2771
2909
  defaultClass: string;
2772
2910
  conditions: string[];
2773
2911
  };
2774
- none: {
2912
+ 4: {
2775
2913
  defaultClass: string;
2776
2914
  conditions: string[];
2777
2915
  };
2778
- gutter: {
2916
+ 1: {
2779
2917
  defaultClass: string;
2780
2918
  conditions: string[];
2781
2919
  };
2782
- xsmall: {
2920
+ 2: {
2783
2921
  defaultClass: string;
2784
2922
  conditions: string[];
2785
2923
  };
2786
- small: {
2924
+ 3: {
2787
2925
  defaultClass: string;
2788
2926
  conditions: string[];
2789
2927
  };
2790
- large: {
2928
+ 5: {
2791
2929
  defaultClass: string;
2792
2930
  conditions: string[];
2793
2931
  };
2794
- xlarge: {
2932
+ 6: {
2933
+ defaultClass: string;
2934
+ conditions: string[];
2935
+ };
2936
+ 7: {
2937
+ defaultClass: string;
2938
+ conditions: string[];
2939
+ };
2940
+ 8: {
2795
2941
  defaultClass: string;
2796
2942
  conditions: string[];
2797
2943
  };
@@ -2823,31 +2969,39 @@ export declare const atomicProperties: {
2823
2969
  };
2824
2970
  rowGap: {
2825
2971
  values: {
2826
- medium: {
2972
+ 0: {
2827
2973
  defaultClass: string;
2828
2974
  conditions: string[];
2829
2975
  };
2830
- none: {
2976
+ 4: {
2831
2977
  defaultClass: string;
2832
2978
  conditions: string[];
2833
2979
  };
2834
- gutter: {
2980
+ 1: {
2835
2981
  defaultClass: string;
2836
2982
  conditions: string[];
2837
2983
  };
2838
- xsmall: {
2984
+ 2: {
2839
2985
  defaultClass: string;
2840
2986
  conditions: string[];
2841
2987
  };
2842
- small: {
2988
+ 3: {
2843
2989
  defaultClass: string;
2844
2990
  conditions: string[];
2845
2991
  };
2846
- large: {
2992
+ 5: {
2847
2993
  defaultClass: string;
2848
2994
  conditions: string[];
2849
2995
  };
2850
- xlarge: {
2996
+ 6: {
2997
+ defaultClass: string;
2998
+ conditions: string[];
2999
+ };
3000
+ 7: {
3001
+ defaultClass: string;
3002
+ conditions: string[];
3003
+ };
3004
+ 8: {
2851
3005
  defaultClass: string;
2852
3006
  conditions: string[];
2853
3007
  };
package/dist/atoms/atoms.js CHANGED
@@ -20,10 +20,10 @@ function atoms(properties) {
20
20
  }
21
21
  return;
22
22
  }
23
- if (!(atomicValue == null ? void 0 : atomicValue.conditions[i])) {
23
+ if (!atomicValue?.conditions[i]) {
24
24
  return;
25
25
  }
26
- classList.push(atomicValue == null ? void 0 : atomicValue.conditions[i]);
26
+ classList.push(atomicValue?.conditions[i]);
27
27
  });
28
28
  }
29
29
  }
package/dist/config/themeTokens.d.ts CHANGED
@@ -1,8 +1,8 @@
1
- type FontWeight = 'regular' | 'medium' | 'strong';
2
- type Space = 'none' | 'gutter' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
1
+ type FontWeight = 'light' | 'normal' | 'medium' | 'strong' | 'bold';
2
+ type Space = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
3
3
  type Transition = 'slow' | 'normal' | 'fast';
4
- type BorderRadius = 'small' | 'medium' | 'large' | 'xlarge';
5
- type BorderWidth = 'small' | 'medium' | 'large';
4
+ type BorderRadius = 1 | 2 | 3 | 4;
5
+ type BorderWidth = 'thin' | 'thick';
6
6
  type BoxShadow = 'small' | 'medium' | 'large';
7
7
  type FontSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
8
8
  type LineHeight = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
@@ -27,7 +27,7 @@ export type ThemeTokens = {
27
27
  secondary?: string;
28
28
  };
29
29
  fontSize: Record<FontSize, number | string>;
30
- fontWeight: Record<FontWeight, 400 | 500 | 600 | 700 | 800>;
30
+ fontWeight: Record<FontWeight, 300 | 400 | 500 | 600 | 700 | 800>;
31
31
  lineHeight: Record<LineHeight, number | string>;
32
32
  };
33
33
  spacing: Record<Space, number | string>;
package/dist/css/tokens.js CHANGED
@@ -24,9 +24,11 @@ const tokens = {
24
24
  xlarge: null
25
25
  },
26
26
  fontWeight: {
27
- regular: null,
27
+ light: null,
28
+ normal: null,
28
29
  medium: null,
29
- strong: null
30
+ strong: null,
31
+ bold: null
30
32
  },
31
33
  lineHeight: {
32
34
  xsmall: null,
@@ -37,13 +39,14 @@ const tokens = {
37
39
  }
38
40
  },
39
41
  spacing: {
40
- none: null,
41
- gutter: null,
42
- xsmall: null,
43
- small: null,
44
- medium: null,
45
- large: null,
46
- xlarge: null
42
+ 1: null,
43
+ 2: null,
44
+ 3: null,
45
+ 4: null,
46
+ 5: null,
47
+ 6: null,
48
+ 7: null,
49
+ 8: null
47
50
  },
48
51
  transition: {
49
52
  slow: null,
@@ -52,15 +55,14 @@ const tokens = {
52
55
  },
53
56
  border: {
54
57
  radius: {
55
- small: null,
56
- medium: null,
57
- large: null,
58
- xlarge: null
58
+ 1: null,
59
+ 2: null,
60
+ 3: null,
61
+ 4: null
59
62
  },
60
63
  width: {
61
- small: null,
62
- medium: null,
63
- large: null
64
+ thin: null,
65
+ thick: null
64
66
  }
65
67
  },
66
68
  shadow: {
package/dist/css/vars.css.d.ts CHANGED
@@ -1,18 +1,22 @@
1
1
  export declare const vars: {
2
2
  space: {
3
- medium: `var(--${string})`;
4
- none: `var(--${string})`;
5
- gutter: `var(--${string})`;
6
- xsmall: `var(--${string})`;
7
- small: `var(--${string})`;
8
- large: `var(--${string})`;
9
- xlarge: `var(--${string})`;
3
+ 0: `var(--${string})`;
4
+ 4: `var(--${string})`;
5
+ 1: `var(--${string})`;
6
+ 2: `var(--${string})`;
7
+ 3: `var(--${string})`;
8
+ 5: `var(--${string})`;
9
+ 6: `var(--${string})`;
10
+ 7: `var(--${string})`;
11
+ 8: `var(--${string})`;
10
12
  };
11
13
  borderRadius: {
12
- medium: `var(--${string})`;
13
- small: `var(--${string})`;
14
- large: `var(--${string})`;
15
- xlarge: `var(--${string})`;
14
+ 0: `var(--${string})`;
15
+ 4: `var(--${string})`;
16
+ 1: `var(--${string})`;
17
+ 2: `var(--${string})`;
18
+ 3: `var(--${string})`;
19
+ full: `var(--${string})`;
16
20
  };
17
21
  color: {
18
22
  white: `var(--${string})`;
@@ -91,9 +95,8 @@ export declare const vars: {
91
95
  "text-900": `var(--${string})`;
92
96
  };
93
97
  borderWidth: {
94
- medium: `var(--${string})`;
95
- small: `var(--${string})`;
96
- large: `var(--${string})`;
98
+ thin: `var(--${string})`;
99
+ thick: `var(--${string})`;
97
100
  };
98
101
  fontFamily: {
99
102
  primary: `var(--${string})`;
@@ -102,26 +105,28 @@ export declare const vars: {
102
105
  };
103
106
  fontSize: {
104
107
  medium: `var(--${string})`;
105
- xsmall: `var(--${string})`;
106
108
  small: `var(--${string})`;
107
109
  large: `var(--${string})`;
110
+ xsmall: `var(--${string})`;
108
111
  xlarge: `var(--${string})`;
109
112
  };
110
113
  fontWeight: {
111
- regular: `var(--${string})`;
114
+ light: `var(--${string})`;
115
+ normal: `var(--${string})`;
112
116
  medium: `var(--${string})`;
113
117
  strong: `var(--${string})`;
118
+ bold: `var(--${string})`;
114
119
  };
115
120
  lineHeight: {
116
121
  medium: `var(--${string})`;
117
- xsmall: `var(--${string})`;
118
122
  small: `var(--${string})`;
119
123
  large: `var(--${string})`;
124
+ xsmall: `var(--${string})`;
120
125
  xlarge: `var(--${string})`;
121
126
  };
122
127
  transition: {
123
- slow: `var(--${string})`;
124
128
  normal: `var(--${string})`;
129
+ slow: `var(--${string})`;
125
130
  fast: `var(--${string})`;
126
131
  };
127
132
  shadow: {
package/dist/index.d.ts CHANGED
@@ -1,22 +1,22 @@
1
+ export { atomicProperties } from './atoms/atoms.css.js';
2
+ export { type Atoms, atoms } from './atoms/atoms.js';
3
+ export type { MarginAtoms, PaddingAtoms, TextAtoms, } from './atoms/atomTypes.js';
4
+ export { getAtomsAndProps } from './atoms/getAtomsAndProps.js';
1
5
  export type { ComponentThemes, ComponentThemesProps, } from './config/componentThemes.js';
2
6
  export type { ThemeTokens } from './config/themeTokens.js';
3
7
  export { breakpointNames, minMediaQuery } from './css/breakpoint/breakpoint.js';
8
+ export { cssValueToNumber, getCSSScale, getOriginalElementSize, parseCSSTransform, } from './css/cssMatrixUtils.js';
4
9
  export { blocksLayer, blocksLayerAtom, blocksLayerComponent, } from './css/layers.css.js';
5
10
  export { rem } from './css/rem.js';
6
11
  export { vars } from './css/vars.css.js';
7
- export { makeComponentTheme } from './theme/makeComponentTheme.js';
8
12
  export type { ComponentTheme, ThemeComponentsStyles, } from './theme/makeComponentTheme.js';
9
- export { makeTheme } from './theme/makeTheme.js';
13
+ export { makeComponentTheme } from './theme/makeComponentTheme.js';
10
14
  export type { Theme } from './theme/makeTheme.js';
15
+ export { makeTheme } from './theme/makeTheme.js';
11
16
  export { classnames } from './utils/classnames/classnames.js';
12
17
  export { hasAnimationDuration } from './utils/dom/hasAnimationDuration.js';
13
- export { alignItemsMap, justifyContentMap, type AlignItemsMap, type JustifyContentMap, } from './utils/flexbox/flexbox.js';
18
+ export { type AlignItemsMap, alignItemsMap, type JustifyContentMap, justifyContentMap, } from './utils/flexbox/flexbox.js';
14
19
  export { clampAndRoundValue } from './utils/math/math.js';
15
20
  export { mergeProps } from './utils/react/mergeProps.js';
16
21
  export { composeRefs } from './utils/react/refs.js';
17
- export { isObjectLike, type AnyString, type HTMLElementProps, type IsNumberUnion, type IsStringUnion, type IsUnion, type OptionalLiteral, type RecordLike, } from './utils/typing/helpers.js';
18
- export { atomicProperties } from './atoms/atoms.css.js';
19
- export { atoms, type Atoms } from './atoms/atoms.js';
20
- export type { MarginAtoms, PaddingAtoms, TextAtoms, } from './atoms/atomTypes.js';
21
- export { getAtomsAndProps } from './atoms/getAtomsAndProps.js';
22
- export { cssValueToNumber, getCSSScale, getOriginalElementSize, parseCSSTransform, } from './css/cssMatrixUtils.js';
22
+ export { type AnyString, type HTMLElementProps, type IsNumberUnion, type IsStringUnion, type IsUnion, isObjectLike, type OptionalLiteral, type RecordLike, } from './utils/typing/helpers.js';
package/dist/index.js CHANGED
@@ -1,4 +1,8 @@
1
+ import { atomicProperties } from "./atoms/atoms.css.js";
2
+ import { atoms } from "./atoms/atoms.js";
3
+ import { getAtomsAndProps } from "./atoms/getAtomsAndProps.js";
1
4
  import { breakpointNames, minMediaQuery } from "./css/breakpoint/breakpoint.js";
5
+ import { cssValueToNumber, getCSSScale, getOriginalElementSize, parseCSSTransform } from "./css/cssMatrixUtils.js";
2
6
  import { blocksLayer, blocksLayerAtom, blocksLayerComponent } from "./css/layers.css.js";
3
7
  import { rem } from "./css/rem.js";
4
8
  import { vars } from "./css/vars.css.js";
@@ -11,10 +15,6 @@ import { clampAndRoundValue } from "./utils/math/math.js";
11
15
  import { mergeProps } from "./utils/react/mergeProps.js";
12
16
  import { composeRefs } from "./utils/react/refs.js";
13
17
  import { isObjectLike } from "./utils/typing/helpers.js";
14
- import { atomicProperties } from "./atoms/atoms.css.js";
15
- import { atoms } from "./atoms/atoms.js";
16
- import { getAtomsAndProps } from "./atoms/getAtomsAndProps.js";
17
- import { cssValueToNumber, getCSSScale, getOriginalElementSize, parseCSSTransform } from "./css/cssMatrixUtils.js";
18
18
  export {
19
19
  alignItemsMap,
20
20
  atomicProperties,
package/dist/theme/makeComponentTheme.d.ts CHANGED
@@ -25,5 +25,5 @@ export type ComponentTheme<T extends RecordLike> = ComponentThemeToStyles<T> & {
25
25
  export type ThemeComponentsStyles = {
26
26
  [K in keyof ComponentThemes]?: ComponentTheme<ComponentThemes[K]>;
27
27
  };
28
- export declare function makeComponentTheme<T extends keyof ThemeComponentsStyles>(component: T, componentTheme: Exclude<ThemeComponentsStyles[T], undefined>): Exclude<ThemeComponentsStyles[T], undefined>;
28
+ export declare function makeComponentTheme<T extends keyof ThemeComponentsStyles>(_component: T, componentTheme: Exclude<ThemeComponentsStyles[T], undefined>): Exclude<ThemeComponentsStyles[T], undefined>;
29
29
  export {};
package/dist/theme/makeComponentTheme.js CHANGED
@@ -1,4 +1,4 @@
1
- function makeComponentTheme(component, componentTheme) {
1
+ function makeComponentTheme(_component, componentTheme) {
2
2
  return componentTheme;
3
3
  }
4
4
  export {
package/dist/theme/makeVanillaTheme.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { ThemeTokens } from '../config/themeTokens.js';
2
2
  export declare const makeVanillaTheme: (tokens: ThemeTokens) => {
3
- space: Record<keyof typeof tokens.spacing, string>;
4
- borderRadius: Record<keyof typeof tokens.border.radius, string>;
3
+ space: Record<0 | (4 | 1 | 2 | 3 | 5 | 6 | 7 | 8), string>;
4
+ borderRadius: Record<0 | 4 | 1 | 2 | 3 | "full", string>;
5
5
  color: Record<"white" | "black" | "background-100" | "background-200" | "background-300" | "background-400" | "background-500" | "background-600" | "background-700" | "background-800" | "background-900" | "primary-100" | "primary-200" | "primary-300" | "primary-400" | "primary-500" | "primary-600" | "primary-700" | "primary-800" | "primary-900" | "secondary-100" | "secondary-200" | "secondary-300" | "secondary-400" | "secondary-500" | "secondary-600" | "secondary-700" | "secondary-800" | "secondary-900" | "success-100" | "success-200" | "success-300" | "success-400" | "success-500" | "success-600" | "success-700" | "success-800" | "success-900" | "warning-100" | "warning-200" | "warning-300" | "warning-400" | "warning-500" | "warning-600" | "warning-700" | "warning-800" | "warning-900" | "danger-100" | "danger-200" | "danger-300" | "danger-400" | "danger-500" | "danger-600" | "danger-700" | "danger-800" | "danger-900" | "info-100" | "info-200" | "info-300" | "info-400" | "info-500" | "info-600" | "info-700" | "info-800" | "info-900" | "text-100" | "text-200" | "text-300" | "text-400" | "text-500" | "text-600" | "text-700" | "text-800" | "text-900", string>;
6
6
  borderWidth: Record<keyof typeof tokens.border.width, string>;
7
7
  fontFamily: Record<keyof typeof tokens.typography.fontFamily, string>;
package/dist/theme/makeVanillaTheme.js CHANGED
@@ -1,3 +1,10 @@
1
+ const ColorDelimiter = "-";
2
+ function addZeroToken(obj) {
3
+ return {
4
+ 0: "0px",
5
+ ...obj
6
+ };
7
+ }
1
8
  const makeVanillaTheme = (tokens) => {
2
9
  const color = {};
3
10
  for (const [colorName, colorValue] of Object.entries(tokens.color)) {
@@ -6,12 +13,15 @@ const makeVanillaTheme = (tokens) => {
6
13
  continue;
7
14
  }
8
15
  for (const [shade, shadeValue] of Object.entries(colorValue)) {
9
- color[`${colorName}-${shade}`] = shadeValue;
16
+ color[`${colorName}${ColorDelimiter}${shade}`] = shadeValue;
10
17
  }
11
18
  }
12
19
  return {
13
- space: tokens.spacing,
14
- borderRadius: tokens.border.radius,
20
+ space: addZeroToken(tokens.spacing),
21
+ borderRadius: addZeroToken({
22
+ ...tokens.border.radius,
23
+ full: "9999px"
24
+ }),
15
25
  color,
16
26
  borderWidth: tokens.border.width,
17
27
  fontFamily: tokens.typography.fontFamily,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blockle/blocks-core",
3
- "version": "0.24.0",
3
+ "version": "1.0.0",
4
4
  "description": "Core for Blocks",
5
5
  "type": "module",
6
6
  "sideEffects": false,
package/dist/atoms/atoms.spec.d.ts DELETED
@@ -1 +0,0 @@
1
- export {};
package/dist/css/breakpoint/breakpoint.test.d.ts DELETED
@@ -1 +0,0 @@
1
- export {};
package/dist/css/cssMatrixUtils.test.d.ts DELETED
@@ -1 +0,0 @@
1
- export {};
package/dist/utils/classnames/classnames.test.d.ts DELETED
@@ -1 +0,0 @@
1
- export {};
package/dist/utils/math/math.test.d.ts DELETED
@@ -1 +0,0 @@
1
- export {};