@max-ts/kit 1.5.3 → 1.6.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 (43) hide show
  1. package/lib/components/ContentState/ContentState.d.ts +3 -34
  2. package/lib/components/ContentState/ContentState.d.ts.map +1 -1
  3. package/lib/components/ContentState/styles.css.d.ts +2 -1
  4. package/lib/components/ContentState/styles.css.d.ts.map +1 -1
  5. package/lib/components/ContentState/types.d.ts +14 -23
  6. package/lib/components/ContentState/types.d.ts.map +1 -1
  7. package/lib/components/DataGrid/Body/Body.d.ts +1 -1
  8. package/lib/components/DataGrid/Body/Body.d.ts.map +1 -1
  9. package/lib/components/DataGrid/DataGrid.d.ts +9 -6
  10. package/lib/components/DataGrid/DataGrid.d.ts.map +1 -1
  11. package/lib/components/DataGrid/Header/Header.d.ts +4 -2
  12. package/lib/components/DataGrid/Header/Header.d.ts.map +1 -1
  13. package/lib/components/DataGrid/HeaderCell/HeaderCell.d.ts +4 -2
  14. package/lib/components/DataGrid/HeaderCell/HeaderCell.d.ts.map +1 -1
  15. package/lib/components/DataGrid/State/State.d.ts +5 -5
  16. package/lib/components/DataGrid/State/State.d.ts.map +1 -1
  17. package/lib/components/DataGrid/State/styles.css.d.ts +2 -1
  18. package/lib/components/DataGrid/State/styles.css.d.ts.map +1 -1
  19. package/lib/components/DataGrid/types.d.ts +12 -5
  20. package/lib/components/DataGrid/types.d.ts.map +1 -1
  21. package/lib/components/DataGridSortHeader/DataGridSortHeader.d.ts +3 -2
  22. package/lib/components/DataGridSortHeader/DataGridSortHeader.d.ts.map +1 -1
  23. package/lib/components/DataGridSortHeader/types.d.ts +1 -4
  24. package/lib/components/DataGridSortHeader/types.d.ts.map +1 -1
  25. package/lib/components/DataList/DataList.d.ts +3 -3
  26. package/lib/components/DataList/DataList.d.ts.map +1 -1
  27. package/lib/components/Spinner/Spinner.d.ts +6 -0
  28. package/lib/components/Spinner/Spinner.d.ts.map +1 -0
  29. package/lib/components/Spinner/index.d.ts +2 -0
  30. package/lib/components/Spinner/index.d.ts.map +1 -0
  31. package/lib/components/Spinner/styles.css.d.ts +2 -0
  32. package/lib/components/Spinner/styles.css.d.ts.map +1 -0
  33. package/lib/components/index.d.ts +1 -0
  34. package/lib/components/index.d.ts.map +1 -1
  35. package/lib/index.mjs +362 -254
  36. package/lib/stories/ContentState.stories.d.ts +14 -0
  37. package/lib/stories/ContentState.stories.d.ts.map +1 -0
  38. package/lib/stories/DataGrid.stories.d.ts.map +1 -1
  39. package/lib/stories/DataList.stories.d.ts +1 -1
  40. package/lib/stories/Spinner.stories.d.ts +13 -0
  41. package/lib/stories/Spinner.stories.d.ts.map +1 -0
  42. package/lib/styles.css +204 -177
  43. package/package.json +1 -1
@@ -0,0 +1,14 @@
1
+ import { ContentState } from '../components/index.ts';
2
+ declare const _default: {
3
+ title: string;
4
+ component: typeof ContentState;
5
+ parameters: {
6
+ layout: string;
7
+ };
8
+ tags: string[];
9
+ };
10
+ export default _default;
11
+ export declare function Success(): import("react").JSX.Element;
12
+ export declare function Loading(): import("react").JSX.Element;
13
+ export declare function ErrorState(): import("react").JSX.Element;
14
+ //# sourceMappingURL=ContentState.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ContentState.stories.d.ts","sourceRoot":"","sources":["../../src/stories/ContentState.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;;;;;;;;;AAa5C,wBAOsC;AAEtC,wBAAgB,OAAO,gCAMtB;AAED,wBAAgB,OAAO,gCAQtB;AAED,wBAAgB,UAAU,gCAezB"}
@@ -1 +1 @@
1
- {"version":3,"file":"DataGrid.stories.d.ts","sourceRoot":"","sources":["../../src/stories/DataGrid.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,EACN,QAAQ,EAMR,MAAM,cAAc,CAAC;;;;;;;;;AAGtB,wBAOkC;AA6JlC,eAAO,MAAM,WAAW,mCAMvB,CAAC;AAEF,eAAO,MAAM,WAAW,mCA6BvB,CAAC;AAEF,eAAO,MAAM,WAAW,mCAmDvB,CAAC;AAEF,eAAO,MAAM,OAAO,mCAEnB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAEtB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAEtB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAsB1B,CAAC"}
1
+ {"version":3,"file":"DataGrid.stories.d.ts","sourceRoot":"","sources":["../../src/stories/DataGrid.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,EACN,QAAQ,EAKR,MAAM,cAAc,CAAC;;;;;;;;;AAGtB,wBAOkC;AA6JlC,eAAO,MAAM,WAAW,mCAMvB,CAAC;AAEF,eAAO,MAAM,WAAW,mCA6BvB,CAAC;AAEF,eAAO,MAAM,WAAW,mCAoCvB,CAAC;AAEF,eAAO,MAAM,OAAO,mCAEnB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAEtB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAEtB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAsB1B,CAAC"}
@@ -6,7 +6,7 @@ import type React from 'react';
6
6
  */
7
7
  declare const _default: {
8
8
  title: string;
9
- component: <TDataItem extends Record<string, unknown>>({ data, keyId, className, itemContent, noDataPlaceholder, endOfScrollMsg, errorState, isLoading, isError, isEndReached, onRetry, onEndReached, ref, }: import("../components/index.ts").DataListProps<TDataItem>) => React.JSX.Element;
9
+ component: <TDataItem extends Record<string, unknown>>({ data, keyId, className, itemContent, noDataPlaceholder, endOfScrollMsg, errorState, isLoading, isError, isEndReached, onRetry, onEndReached, ref, }: import("../components/index.ts").DataListProps<TDataItem>) => string | number | bigint | true | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | React.JSX.Element;
10
10
  parameters: {
11
11
  layout: string;
12
12
  };
@@ -0,0 +1,13 @@
1
+ import { Spinner } from '../components/index.ts';
2
+ declare const _default: {
3
+ title: string;
4
+ component: typeof Spinner;
5
+ parameters: {
6
+ layout: string;
7
+ };
8
+ tags: string[];
9
+ };
10
+ export default _default;
11
+ export declare function Default(): import("react").JSX.Element;
12
+ export declare function CustomSize(): import("react").JSX.Element;
13
+ //# sourceMappingURL=Spinner.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Spinner.stories.d.ts","sourceRoot":"","sources":["../../src/stories/Spinner.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;;;;;;;;;AAEvC,wBAOiC;AAEjC,wBAAgB,OAAO,gCAEtB;AAED,wBAAgB,UAAU,gCAEzB"}
package/lib/styles.css CHANGED
@@ -2210,90 +2210,124 @@ a.outline__1af895x4:hover {
2210
2210
  max-width: 400px;
2211
2211
  }
2212
2212
 
2213
- .style__1o97kvm0 {
2214
- object-fit: contain;
2215
- max-width: 100%;
2216
- color: var(--colors-text-secondary);
2217
- display: block;
2213
+ .style__e4li7y0 {
2214
+ justify-content: center;
2215
+ align-items: center;
2216
+ gap: var(--spacing-4);
2217
+ border-radius: var(--borderRadius-lg);
2218
+ width: 100%;
2219
+ min-width: 0;
2220
+ padding: var(--spacing-6);
2221
+ text-align: center;
2222
+ text-wrap: balance;
2223
+ flex-direction: column;
2224
+ flex: 1;
2225
+ display: flex;
2218
2226
  }
2219
2227
 
2220
- .small__1o97kvm1 {
2221
- margin: auto auto var(--spacing-4);
2228
+ .style__e4li7y1 {
2229
+ align-items: center;
2230
+ gap: var(--spacing-2);
2231
+ flex-direction: column;
2232
+ max-width: 24rem;
2233
+ display: flex;
2222
2234
  }
2223
2235
 
2224
- .medium__1o97kvm2 {
2225
- margin: auto auto var(--spacing-8);
2236
+ .style__e4li7y2 {
2237
+ margin-bottom: var(--spacing-2);
2238
+ flex-shrink: 0;
2239
+ justify-content: center;
2240
+ align-items: center;
2241
+ display: flex;
2226
2242
  }
2227
2243
 
2228
- .large__1o97kvm3 {
2229
- margin: auto auto var(--spacing-10);
2244
+ .default__e4li7y3 {
2245
+ background-color: #0000;
2230
2246
  }
2231
2247
 
2232
- @media (width <= 600px) {
2233
- .style__1o97kvm0 {
2234
- margin: auto auto var(--spacing-4);
2235
- }
2248
+ .icon__e4li7y4 {
2249
+ width: var(--spacing-8);
2250
+ height: var(--spacing-8);
2251
+ border-radius: var(--borderRadius-md);
2252
+ background-color: var(--colors-background-element);
2253
+ color: var(--colors-text-primary);
2254
+ flex-shrink: 0;
2236
2255
  }
2237
2256
 
2238
- .style__1nenzg00 {
2239
- width: 100%;
2240
- height: 100%;
2241
- padding: var(--spacing-4);
2242
- background-color: var(--colors-background-paper);
2243
- flex-direction: column;
2244
- justify-content: center;
2245
- align-items: center;
2246
- display: flex;
2257
+ .style__e4li7y2 svg {
2258
+ pointer-events: none;
2259
+ flex-shrink: 0;
2247
2260
  }
2248
2261
 
2249
- .small__1nenzg01 {
2250
- gap: var(--spacing-4);
2262
+ .icon__e4li7y4 svg:not([class*="size-"]) {
2263
+ width: var(--spacing-4);
2264
+ height: var(--spacing-4);
2251
2265
  }
2252
2266
 
2253
- .medium__1nenzg02 {
2254
- gap: var(--spacing-8);
2267
+ .style__e4li7y5 {
2268
+ font-size: var(--fontSize-sm);
2269
+ font-weight: var(--fontWeight-medium);
2270
+ line-height: var(--lineHeight-normal);
2255
2271
  }
2256
2272
 
2257
- .large__1nenzg03 {
2258
- gap: var(--spacing-10);
2273
+ .style__e4li7y6 {
2274
+ color: var(--colors-text-secondary);
2275
+ font-size: var(--fontSize-sm);
2276
+ line-height: var(--lineHeight-relaxed);
2259
2277
  }
2260
2278
 
2261
- .style__1nenzg04 {
2262
- margin: 0 auto;
2279
+ .style__e4li7y6 a {
2280
+ text-decoration: underline;
2263
2281
  }
2264
2282
 
2265
- .style__1nenzg05 {
2266
- text-align: center;
2267
- color: var(--colors-text-secondary);
2268
- display: block;
2283
+ .style__e4li7y6 a:hover {
2284
+ color: var(--colors-primary);
2269
2285
  }
2270
2286
 
2271
- .style__1nenzg06 {
2272
- color: var(--colors-text-secondary);
2273
- justify-content: center;
2274
- gap: var(--spacing-2);
2275
- flex-wrap: wrap;
2287
+ .style__e4li7y7 {
2288
+ width: 100%;
2289
+ min-width: 0;
2290
+ max-width: 24rem;
2291
+ font-size: var(--fontSize-sm);
2292
+ text-wrap: balance;
2293
+ flex-direction: column;
2294
+ align-items: center;
2295
+ gap: .625rem;
2276
2296
  display: flex;
2277
2297
  }
2278
2298
 
2279
- @media (width <= 560px) {
2280
- .style__1nenzg00 {
2281
- gap: var(--spacing-4);
2282
- grid-template-rows: 1fr max-content;
2283
- grid-template-columns: 100%;
2284
- display: grid;
2299
+ @keyframes style__1dbefg90 {
2300
+ to {
2301
+ transform: rotate(360deg);
2285
2302
  }
2286
2303
  }
2287
2304
 
2305
+ .style__1dbefg91 {
2306
+ width: var(--spacing-4);
2307
+ height: var(--spacing-4);
2308
+ color: currentColor;
2309
+ animation: 1s linear infinite style__1dbefg90;
2310
+ }
2311
+
2288
2312
  .style__nan0ao0 {
2289
- flex-grow: 1;
2313
+ box-sizing: border-box;
2290
2314
  justify-content: center;
2291
2315
  align-items: center;
2292
2316
  width: 100%;
2317
+ min-width: 0;
2293
2318
  height: 100%;
2319
+ min-height: 100%;
2294
2320
  display: flex;
2295
2321
  }
2296
2322
 
2323
+ .style__nan0ao1 {
2324
+ max-width: 100%;
2325
+ width: var(--spacing-20);
2326
+ height: var(--spacing-20);
2327
+ object-fit: contain;
2328
+ display: block;
2329
+ }
2330
+
2297
2331
  @keyframes style__izacrl0 {
2298
2332
  from {
2299
2333
  opacity: 0;
@@ -2514,11 +2548,15 @@ a.outline__1af895x4:hover {
2514
2548
  }
2515
2549
 
2516
2550
  .style__15m2ib81 {
2517
- justify-content: center;
2518
- align-items: center;
2519
- height: 100%;
2520
- min-height: 50px;
2521
- display: flex;
2551
+ max-width: 100%;
2552
+ width: var(--spacing-20);
2553
+ height: var(--spacing-20);
2554
+ object-fit: contain;
2555
+ display: block;
2556
+ }
2557
+
2558
+ .style__15m2ib82 {
2559
+ height: 60vh;
2522
2560
  }
2523
2561
 
2524
2562
  .style__82af400 {
@@ -2547,6 +2585,44 @@ a.outline__1af895x4:hover {
2547
2585
  display: none;
2548
2586
  }
2549
2587
 
2588
+ .style__o752f00 {
2589
+ align-items: center;
2590
+ gap: var(--spacing-1);
2591
+ cursor: pointer;
2592
+ color: inherit;
2593
+ font-size: inherit;
2594
+ font-weight: inherit;
2595
+ overflow-wrap: break-word;
2596
+ background-color: #0000;
2597
+ border: none;
2598
+ width: 100%;
2599
+ height: 100%;
2600
+ font-family: inherit;
2601
+ display: flex;
2602
+ position: relative;
2603
+ }
2604
+
2605
+ .style__o752f00 svg {
2606
+ stroke: currentColor;
2607
+ min-width: 12px;
2608
+ }
2609
+
2610
+ .left__o752f01 {
2611
+ justify-content: flex-start;
2612
+ }
2613
+
2614
+ .center__o752f02 {
2615
+ justify-content: center;
2616
+ }
2617
+
2618
+ .right__o752f03 {
2619
+ justify-content: flex-end;
2620
+ }
2621
+
2622
+ .justify__o752f04 {
2623
+ justify-content: space-between;
2624
+ }
2625
+
2550
2626
  .style__uma6hu0 {
2551
2627
  padding: var(--spacing-1) var(--spacing-2);
2552
2628
  width: 100%;
@@ -2860,44 +2936,6 @@ a.outline__1af895x4:hover {
2860
2936
  display: inline-flex;
2861
2937
  }
2862
2938
 
2863
- .style__o752f00 {
2864
- align-items: center;
2865
- gap: var(--spacing-1);
2866
- cursor: pointer;
2867
- color: inherit;
2868
- font-size: inherit;
2869
- font-weight: inherit;
2870
- overflow-wrap: break-word;
2871
- background-color: #0000;
2872
- border: none;
2873
- width: 100%;
2874
- height: 100%;
2875
- font-family: inherit;
2876
- display: flex;
2877
- position: relative;
2878
- }
2879
-
2880
- .style__o752f00 svg {
2881
- stroke: currentColor;
2882
- min-width: 12px;
2883
- }
2884
-
2885
- .left__o752f01 {
2886
- justify-content: flex-start;
2887
- }
2888
-
2889
- .center__o752f02 {
2890
- justify-content: center;
2891
- }
2892
-
2893
- .right__o752f03 {
2894
- justify-content: flex-end;
2895
- }
2896
-
2897
- .justify__o752f04 {
2898
- justify-content: space-between;
2899
- }
2900
-
2901
2939
  .style__1syvw5e0 {
2902
2940
  padding: var(--spacing-4) var(--spacing-5);
2903
2941
  justify-content: center;
@@ -2942,6 +2980,81 @@ a.outline__1af895x4:hover {
2942
2980
  }
2943
2981
  }
2944
2982
 
2983
+ .style__1o97kvm0 {
2984
+ object-fit: contain;
2985
+ max-width: 100%;
2986
+ color: var(--colors-text-secondary);
2987
+ display: block;
2988
+ }
2989
+
2990
+ .small__1o97kvm1 {
2991
+ margin: auto auto var(--spacing-4);
2992
+ }
2993
+
2994
+ .medium__1o97kvm2 {
2995
+ margin: auto auto var(--spacing-8);
2996
+ }
2997
+
2998
+ .large__1o97kvm3 {
2999
+ margin: auto auto var(--spacing-10);
3000
+ }
3001
+
3002
+ @media (width <= 600px) {
3003
+ .style__1o97kvm0 {
3004
+ margin: auto auto var(--spacing-4);
3005
+ }
3006
+ }
3007
+
3008
+ .style__1nenzg00 {
3009
+ width: 100%;
3010
+ height: 100%;
3011
+ padding: var(--spacing-4);
3012
+ background-color: var(--colors-background-paper);
3013
+ flex-direction: column;
3014
+ justify-content: center;
3015
+ align-items: center;
3016
+ display: flex;
3017
+ }
3018
+
3019
+ .small__1nenzg01 {
3020
+ gap: var(--spacing-4);
3021
+ }
3022
+
3023
+ .medium__1nenzg02 {
3024
+ gap: var(--spacing-8);
3025
+ }
3026
+
3027
+ .large__1nenzg03 {
3028
+ gap: var(--spacing-10);
3029
+ }
3030
+
3031
+ .style__1nenzg04 {
3032
+ margin: 0 auto;
3033
+ }
3034
+
3035
+ .style__1nenzg05 {
3036
+ text-align: center;
3037
+ color: var(--colors-text-secondary);
3038
+ display: block;
3039
+ }
3040
+
3041
+ .style__1nenzg06 {
3042
+ color: var(--colors-text-secondary);
3043
+ justify-content: center;
3044
+ gap: var(--spacing-2);
3045
+ flex-wrap: wrap;
3046
+ display: flex;
3047
+ }
3048
+
3049
+ @media (width <= 560px) {
3050
+ .style__1nenzg00 {
3051
+ gap: var(--spacing-4);
3052
+ grid-template-rows: 1fr max-content;
3053
+ grid-template-columns: 100%;
3054
+ display: grid;
3055
+ }
3056
+ }
3057
+
2945
3058
  .style__1jg5nd90 {
2946
3059
  right: var(--spacing-3);
2947
3060
  bottom: var(--spacing-8);
@@ -3524,92 +3637,6 @@ a.outline__1af895x4:hover {
3524
3637
  }
3525
3638
  }
3526
3639
 
3527
- .style__e4li7y0 {
3528
- justify-content: center;
3529
- align-items: center;
3530
- gap: var(--spacing-4);
3531
- border-radius: var(--borderRadius-lg);
3532
- width: 100%;
3533
- min-width: 0;
3534
- padding: var(--spacing-6);
3535
- text-align: center;
3536
- text-wrap: balance;
3537
- flex-direction: column;
3538
- flex: 1;
3539
- display: flex;
3540
- }
3541
-
3542
- .style__e4li7y1 {
3543
- align-items: center;
3544
- gap: var(--spacing-2);
3545
- flex-direction: column;
3546
- max-width: 24rem;
3547
- display: flex;
3548
- }
3549
-
3550
- .style__e4li7y2 {
3551
- margin-bottom: var(--spacing-2);
3552
- flex-shrink: 0;
3553
- justify-content: center;
3554
- align-items: center;
3555
- display: flex;
3556
- }
3557
-
3558
- .default__e4li7y3 {
3559
- background-color: #0000;
3560
- }
3561
-
3562
- .icon__e4li7y4 {
3563
- width: var(--spacing-8);
3564
- height: var(--spacing-8);
3565
- border-radius: var(--borderRadius-md);
3566
- background-color: var(--colors-background-element);
3567
- color: var(--colors-text-primary);
3568
- flex-shrink: 0;
3569
- }
3570
-
3571
- .style__e4li7y2 svg {
3572
- pointer-events: none;
3573
- flex-shrink: 0;
3574
- }
3575
-
3576
- .icon__e4li7y4 svg:not([class*="size-"]) {
3577
- width: var(--spacing-4);
3578
- height: var(--spacing-4);
3579
- }
3580
-
3581
- .style__e4li7y5 {
3582
- font-size: var(--fontSize-sm);
3583
- font-weight: var(--fontWeight-medium);
3584
- line-height: var(--lineHeight-normal);
3585
- }
3586
-
3587
- .style__e4li7y6 {
3588
- color: var(--colors-text-secondary);
3589
- font-size: var(--fontSize-sm);
3590
- line-height: var(--lineHeight-relaxed);
3591
- }
3592
-
3593
- .style__e4li7y6 a {
3594
- text-decoration: underline;
3595
- }
3596
-
3597
- .style__e4li7y6 a:hover {
3598
- color: var(--colors-primary);
3599
- }
3600
-
3601
- .style__e4li7y7 {
3602
- width: 100%;
3603
- min-width: 0;
3604
- max-width: 24rem;
3605
- font-size: var(--fontSize-sm);
3606
- text-wrap: balance;
3607
- flex-direction: column;
3608
- align-items: center;
3609
- gap: .625rem;
3610
- display: flex;
3611
- }
3612
-
3613
3640
  .style__a5l83v0 {
3614
3641
  width: 100%;
3615
3642
  max-width: 800px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@max-ts/kit",
3
- "version": "1.5.3",
3
+ "version": "1.6.0",
4
4
  "main": "./lib/index.js",
5
5
  "module": "./lib/index.mjs",
6
6
  "types": "./lib/index.d.ts",