@everlywell/ui-kit 1.3.1 → 1.4.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 (10) hide show
  1. package/index.d.mts +1 -0
  2. package/index.d.ts +1 -0
  3. package/index.js +7 -7
  4. package/index.mjs +251 -209
  5. package/lib/theme/actions/FormControl/FormControl.config.d.ts +9 -1
  6. package/lib/theme/data-display/Tabs/Tabs.config.d.ts +1 -1
  7. package/lib/theme/index.d.ts +88 -6
  8. package/lib/theme/navigation/Stepper/Stepper.config.d.ts +26 -0
  9. package/lib/theme/navigation/Stepper/Stepper.d.ts +4 -0
  10. package/package.json +3 -3
package/lib/theme/actions/FormControl/FormControl.config.d.ts CHANGED
@@ -30,7 +30,7 @@ declare const _default: {
30
30
  };
31
31
  };
32
32
  };
33
- 'input:not(:placeholder-shown) + label, .chakra-select__wrapper + label, textarea:not(:placeholder-shown) ~ label': {
33
+ 'input:not(:placeholder-shown) + label, .chakra-select__wrapper:not(:has(option[value=""]:checked)) + label, textarea:not(:placeholder-shown) ~ label': {
34
34
  transform: string[];
35
35
  fontSize: string;
36
36
  color: string;
@@ -38,7 +38,11 @@ declare const _default: {
38
38
  color: string;
39
39
  };
40
40
  };
41
+ '.chakra-select__wrapper:has(option[value=""]:checked) select': {
42
+ color: string;
43
+ };
41
44
  label: {
45
+ transformOrigin: string;
42
46
  position: string;
43
47
  pointerEvents: string;
44
48
  zIndex: number;
@@ -53,6 +57,10 @@ declare const _default: {
53
57
  pt: number;
54
58
  pl: string;
55
59
  };
60
+ select: {
61
+ pt: number;
62
+ pl: string;
63
+ };
56
64
  };
57
65
  };
58
66
  } | undefined;
package/lib/theme/data-display/Tabs/Tabs.config.d.ts CHANGED
@@ -63,6 +63,6 @@ declare const _default: {
63
63
  variant?: undefined;
64
64
  colorScheme?: string | undefined;
65
65
  } | undefined;
66
- parts: ("tab" | "tabpanel" | "tabpanels" | "root" | "tablist" | "indicator")[];
66
+ parts: ("tab" | "tabpanel" | "tabpanels" | "indicator" | "root" | "tablist")[];
67
67
  };
68
68
  export default _default;
package/lib/theme/index.d.ts CHANGED
@@ -360,7 +360,15 @@ export declare const theme: {
360
360
  };
361
361
  };
362
362
  secondary: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
363
- color: string;
363
+ color: string; /**
364
+ * Base unit: 4px
365
+ * 1 rem = 16px
366
+ *
367
+ * Mental model:
368
+ *
369
+ * If you need a spacing of 40px, divide it by 4.
370
+ * That'll give you 10. Then use it in your component.
371
+ */
364
372
  boxShadow: (theme: Record<string, any>) => string;
365
373
  ':hover, &.hover': {
366
374
  color: string;
@@ -591,7 +599,7 @@ export declare const theme: {
591
599
  };
592
600
  };
593
601
  };
594
- 'input:not(:placeholder-shown) + label, .chakra-select__wrapper + label, textarea:not(:placeholder-shown) ~ label': {
602
+ 'input:not(:placeholder-shown) + label, .chakra-select__wrapper:not(:has(option[value=""]:checked)) + label, textarea:not(:placeholder-shown) ~ label': {
595
603
  transform: string[];
596
604
  fontSize: string;
597
605
  color: string;
@@ -599,7 +607,11 @@ export declare const theme: {
599
607
  color: string;
600
608
  };
601
609
  };
610
+ '.chakra-select__wrapper:has(option[value=""]:checked) select': {
611
+ color: string;
612
+ };
602
613
  label: {
614
+ transformOrigin: string;
603
615
  position: string;
604
616
  pointerEvents: string;
605
617
  zIndex: number;
@@ -614,6 +626,10 @@ export declare const theme: {
614
626
  pt: number;
615
627
  pl: string;
616
628
  };
629
+ select: {
630
+ pt: number;
631
+ pl: string;
632
+ };
617
633
  };
618
634
  };
619
635
  } | undefined;
@@ -877,6 +893,31 @@ export declare const theme: {
877
893
  colorScheme?: string | undefined;
878
894
  } | undefined;
879
895
  };
896
+ Stepper: {
897
+ baseStyle?: {
898
+ stepper: {
899
+ width: string;
900
+ backgroundColor: string;
901
+ };
902
+ step: {};
903
+ title: {};
904
+ description: {};
905
+ indicator: {};
906
+ separator: {
907
+ backgroundColor: string;
908
+ height: string;
909
+ };
910
+ icon: {};
911
+ number: {};
912
+ } | undefined;
913
+ sizes?: {} | undefined;
914
+ variants?: {} | undefined;
915
+ defaultProps?: {
916
+ size?: undefined;
917
+ variant?: undefined;
918
+ colorScheme?: string | undefined;
919
+ } | undefined;
920
+ };
880
921
  Menu: {
881
922
  baseStyle?: {
882
923
  button: {};
@@ -1147,7 +1188,7 @@ export declare const theme: {
1147
1188
  variant?: undefined;
1148
1189
  colorScheme?: string | undefined;
1149
1190
  } | undefined;
1150
- parts: ("tab" | "tabpanel" | "tabpanels" | "root" | "tablist" | "indicator")[];
1191
+ parts: ("tab" | "tabpanel" | "tabpanels" | "indicator" | "root" | "tablist")[];
1151
1192
  };
1152
1193
  Table: {
1153
1194
  baseStyle?: {
@@ -2164,7 +2205,15 @@ export declare const useTheme: () => import("@chakra-ui/styled-system").WithCSSV
2164
2205
  };
2165
2206
  };
2166
2207
  secondary: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
2167
- color: string;
2208
+ color: string; /**
2209
+ * Base unit: 4px
2210
+ * 1 rem = 16px
2211
+ *
2212
+ * Mental model:
2213
+ *
2214
+ * If you need a spacing of 40px, divide it by 4.
2215
+ * That'll give you 10. Then use it in your component.
2216
+ */
2168
2217
  boxShadow: (theme: Record<string, any>) => string;
2169
2218
  ':hover, &.hover': {
2170
2219
  color: string;
@@ -2395,7 +2444,7 @@ export declare const useTheme: () => import("@chakra-ui/styled-system").WithCSSV
2395
2444
  };
2396
2445
  };
2397
2446
  };
2398
- 'input:not(:placeholder-shown) + label, .chakra-select__wrapper + label, textarea:not(:placeholder-shown) ~ label': {
2447
+ 'input:not(:placeholder-shown) + label, .chakra-select__wrapper:not(:has(option[value=""]:checked)) + label, textarea:not(:placeholder-shown) ~ label': {
2399
2448
  transform: string[];
2400
2449
  fontSize: string;
2401
2450
  color: string;
@@ -2403,7 +2452,11 @@ export declare const useTheme: () => import("@chakra-ui/styled-system").WithCSSV
2403
2452
  color: string;
2404
2453
  };
2405
2454
  };
2455
+ '.chakra-select__wrapper:has(option[value=""]:checked) select': {
2456
+ color: string;
2457
+ };
2406
2458
  label: {
2459
+ transformOrigin: string;
2407
2460
  position: string;
2408
2461
  pointerEvents: string;
2409
2462
  zIndex: number;
@@ -2418,6 +2471,10 @@ export declare const useTheme: () => import("@chakra-ui/styled-system").WithCSSV
2418
2471
  pt: number;
2419
2472
  pl: string;
2420
2473
  };
2474
+ select: {
2475
+ pt: number;
2476
+ pl: string;
2477
+ };
2421
2478
  };
2422
2479
  };
2423
2480
  } | undefined;
@@ -2681,6 +2738,31 @@ export declare const useTheme: () => import("@chakra-ui/styled-system").WithCSSV
2681
2738
  colorScheme?: string | undefined;
2682
2739
  } | undefined;
2683
2740
  };
2741
+ Stepper: {
2742
+ baseStyle?: {
2743
+ stepper: {
2744
+ width: string;
2745
+ backgroundColor: string;
2746
+ };
2747
+ step: {};
2748
+ title: {};
2749
+ description: {};
2750
+ indicator: {};
2751
+ separator: {
2752
+ backgroundColor: string;
2753
+ height: string;
2754
+ };
2755
+ icon: {};
2756
+ number: {};
2757
+ } | undefined;
2758
+ sizes?: {} | undefined;
2759
+ variants?: {} | undefined;
2760
+ defaultProps?: {
2761
+ size?: undefined;
2762
+ variant?: undefined;
2763
+ colorScheme?: string | undefined;
2764
+ } | undefined;
2765
+ };
2684
2766
  Menu: {
2685
2767
  baseStyle?: {
2686
2768
  button: {};
@@ -2951,7 +3033,7 @@ export declare const useTheme: () => import("@chakra-ui/styled-system").WithCSSV
2951
3033
  variant?: undefined;
2952
3034
  colorScheme?: string | undefined;
2953
3035
  } | undefined;
2954
- parts: ("tab" | "tabpanel" | "tabpanels" | "root" | "tablist" | "indicator")[];
3036
+ parts: ("tab" | "tabpanel" | "tabpanels" | "indicator" | "root" | "tablist")[];
2955
3037
  };
2956
3038
  Table: {
2957
3039
  baseStyle?: {
package/lib/theme/navigation/Stepper/Stepper.config.d.ts ADDED
@@ -0,0 +1,26 @@
1
+ declare const _default: {
2
+ baseStyle?: {
3
+ stepper: {
4
+ width: string;
5
+ backgroundColor: string;
6
+ };
7
+ step: {};
8
+ title: {};
9
+ description: {};
10
+ indicator: {};
11
+ separator: {
12
+ backgroundColor: string;
13
+ height: string;
14
+ };
15
+ icon: {};
16
+ number: {};
17
+ } | undefined;
18
+ sizes?: {} | undefined;
19
+ variants?: {} | undefined;
20
+ defaultProps?: {
21
+ size?: undefined;
22
+ variant?: undefined;
23
+ colorScheme?: string | undefined;
24
+ } | undefined;
25
+ };
26
+ export default _default;
package/lib/theme/navigation/Stepper/Stepper.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { Step as ChakraStep, StepDescription, StepIcon, StepIndicator, StepNumber, Stepper, StepperProps as ChakraStepperProps, StepSeparator, StepStatus, StepTitle, useSteps } from '@chakra-ui/react';
2
+ export { StepDescription, StepIcon, StepIndicator, StepNumber, StepSeparator, StepStatus, StepTitle, Stepper, useSteps, };
3
+ export type StepperProps = ChakraStepperProps;
4
+ export default ChakraStep;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@everlywell/ui-kit",
3
- "version": "1.3.1",
3
+ "version": "1.4.0",
4
4
  "main": "./index.js",
5
5
  "types": "./index.d.ts",
6
6
  "exports": {
@@ -16,8 +16,8 @@
16
16
  },
17
17
  "dependencies": {
18
18
  "@chakra-ui/react": "^2.8.1",
19
- "@emotion/react": "11.11.3",
20
- "@emotion/styled": "11.11.0",
19
+ "@emotion/react": "11.11.4",
20
+ "@emotion/styled": "11.11.5",
21
21
  "framer-motion": "^11.0.0"
22
22
  }
23
23
  }