@vygruppen/spor-react 4.0.0 → 4.0.2

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 (28) hide show
  1. package/.turbo/turbo-build.log +11 -11
  2. package/CHANGELOG.md +15 -0
  3. package/dist/{CountryCodeSelect-7WPJ6BDU.mjs → CountryCodeSelect-WSPQNU6B.mjs} +1 -1
  4. package/dist/{chunk-B77QE6EZ.mjs → chunk-MGJQOEU2.mjs} +250 -91
  5. package/dist/index.d.mts +117 -49
  6. package/dist/index.d.ts +117 -49
  7. package/dist/index.js +263 -92
  8. package/dist/index.mjs +1 -1
  9. package/package.json +1 -1
  10. package/src/button/Button.tsx +1 -1
  11. package/src/datepicker/DatePicker.tsx +1 -1
  12. package/src/datepicker/DateRangePicker.tsx +12 -11
  13. package/src/datepicker/TimePicker.tsx +1 -1
  14. package/src/input/CardSelect.tsx +1 -1
  15. package/src/input/FormErrorMessage.tsx +1 -1
  16. package/src/input/InfoSelect.tsx +1 -1
  17. package/src/input/PasswordInput.tsx +1 -0
  18. package/src/linjetag/InfoTag.tsx +1 -1
  19. package/src/linjetag/LineIcon.tsx +1 -1
  20. package/src/linjetag/TravelTag.tsx +1 -1
  21. package/src/theme/components/datepicker.ts +122 -39
  22. package/src/theme/components/info-select.ts +23 -36
  23. package/src/theme/components/input.ts +12 -5
  24. package/src/theme/components/list.ts +12 -12
  25. package/src/theme/components/listbox.ts +13 -7
  26. package/src/theme/components/select.ts +5 -4
  27. package/src/theme/utils/background-utils.ts +28 -0
  28. package/src/theme/utils/border-utils.ts +59 -0
package/dist/index.d.mts CHANGED
@@ -294,7 +294,7 @@ type ButtonProps = Exclude<ButtonProps$1, "colorScheme" | "loadingText" | "size"
294
294
  * </Button>
295
295
  * ```
296
296
  *
297
- * @see https://spor.vy.no/komponenter/button
297
+ * @see https://spor.vy.no/components/button
298
298
  */
299
299
  declare const Button: _chakra_ui_system_dist_system_types.ComponentWithAs<"button", ButtonProps>;
300
300
 
@@ -524,7 +524,7 @@ type TimePickerProps = Omit<BoxProps, "defaultValue" | "onChange"> & {
524
524
  *
525
525
  * Note that the TimePicker uses the `Time` class to represent the time. This is a class that is part of the `@internationalized/date` package.
526
526
  *
527
- * @see https://spor.vy.no/komponenter/timepicker
527
+ * @see https://spor.vy.no/komponents/timepicker
528
528
  */
529
529
  declare const TimePicker: ({ label: externalLabel, value, defaultValue, onChange, minuteInterval, isDisabled: isDisabledExternally, name, ...boxProps }: TimePickerProps) => React__default.JSX.Element;
530
530
 
@@ -676,7 +676,7 @@ type CardSelectProps = BoxProps & {
676
676
  * </CardSelect>
677
677
  * ```
678
678
  *
679
- * @see https://spor.vy.no/komponenter/card-select
679
+ * @see https://spor.vy.no/components/card-select
680
680
  */
681
681
  declare const CardSelect: _chakra_ui_system_dist_system_types.ComponentWithAs<"button", CardSelectProps>;
682
682
 
@@ -831,7 +831,7 @@ type FormErrorMessageProps = BoxProps & {
831
831
  * </FormControl>
832
832
  * ```
833
833
  *
834
- * @see https://spor.vy.no/komponenter/skjemaelementer
834
+ * @see https://spor.vy.no/components/form-control
835
835
  */
836
836
  declare const FormErrorMessage: ({ children, ...boxProps }: FormErrorMessageProps) => React__default.JSX.Element | null;
837
837
 
@@ -969,7 +969,7 @@ type InfoSelectProps<T extends object> = {
969
969
  * </InfoSelect>
970
970
  * ```
971
971
  *
972
- * @see https://spor.vy.no/komponenter/info-select
972
+ * @see https://spor.vy.no/components/info-select
973
973
  */
974
974
  declare function InfoSelect<T extends object>({ placeholder, width, height, onChange, value, isLabelSrOnly, defaultValue, ...props }: InfoSelectProps<T>): React__default.JSX.Element;
975
975
 
@@ -1343,7 +1343,7 @@ type InfoTagProps = TagProps;
1343
1343
  * />
1344
1344
  * ```
1345
1345
  *
1346
- * @see https://spor.vy.no/komponenter/linjetags
1346
+ * @see https://spor.vy.no/components/line-tags
1347
1347
  */
1348
1348
  declare const InfoTag: ({ variant, size, title, description, }: InfoTagProps) => React__default.JSX.Element;
1349
1349
 
@@ -1366,7 +1366,7 @@ type LineIconProps = BoxProps & {
1366
1366
  * <LineIcon variant="subway" size="lg" />
1367
1367
  * ```
1368
1368
  *
1369
- * @see https://spor.vy.no/komponenter/linjetags
1369
+ * @see https://spor.vy.no/components/line-tags
1370
1370
  */
1371
1371
  declare const LineIcon: ({ variant, size, sx, ...rest }: LineIconProps) => React__default.JSX.Element | null;
1372
1372
 
@@ -1409,7 +1409,7 @@ type TravelTagProps = TagProps & BoxProps & {
1409
1409
  * />
1410
1410
  * ```
1411
1411
  *
1412
- * @see https://spor.vy.no/komponenter/linjetags
1412
+ * @see https://spor.vy.no/components/line-tags
1413
1413
  */
1414
1414
  declare const TravelTag: _chakra_ui_system_dist_system_types.ComponentWithAs<As, TravelTagProps>;
1415
1415
 
@@ -2874,21 +2874,10 @@ declare const theme: {
2874
2874
  paddingY: number;
2875
2875
  alignItems: string;
2876
2876
  _hover: {
2877
- boxShadow: string;
2878
2877
  zIndex: number;
2879
2878
  };
2880
- _focusWithin: {
2881
- boxShadow: string;
2882
- };
2883
- _invalid: {
2884
- boxShadow: string;
2885
- };
2886
2879
  _disabled: {
2887
2880
  pointerEvents: string;
2888
- boxShadow: string;
2889
- _focus: {
2890
- boxShadow: string;
2891
- };
2892
2881
  };
2893
2882
  };
2894
2883
  inputLabel: {
@@ -2932,7 +2921,7 @@ declare const theme: {
2932
2921
  arrow: {
2933
2922
  [x: string]: string;
2934
2923
  };
2935
- calendar: {
2924
+ calendarPopover: {
2936
2925
  backgroundColor: string;
2937
2926
  color: string;
2938
2927
  boxShadow: string;
@@ -2994,11 +2983,29 @@ declare const theme: {
2994
2983
  }) | undefined;
2995
2984
  sizes?: {
2996
2985
  [key: string]: _chakra_ui_styled_system.PartsStyleInterpolation<{
2997
- keys: ("dateCell" | "weekdays" | "weekend" | "calendar" | "calendarTriggerButton" | "dateTimeSegment" | "inputLabel" | "wrapper" | "arrow")[];
2986
+ keys: ("dateCell" | "weekdays" | "weekend" | "calendar" | "calendarTriggerButton" | "dateTimeSegment" | "inputLabel" | "wrapper" | "calendarPopover" | "arrow")[];
2998
2987
  }>;
2999
2988
  } | undefined;
3000
2989
  variants?: {
3001
2990
  base: (props: _chakra_ui_styled_system.StyleFunctionProps) => {
2991
+ wrapper: {
2992
+ boxShadow: string;
2993
+ _hover: {
2994
+ boxShadow: string;
2995
+ };
2996
+ _focusWithin: {
2997
+ boxShadow: string;
2998
+ };
2999
+ _invalid: {
3000
+ boxShadow: string;
3001
+ };
3002
+ _disabled: {
3003
+ boxShadow: string;
3004
+ _focus: {
3005
+ boxShadow: string;
3006
+ };
3007
+ };
3008
+ };
3002
3009
  calendar: {
3003
3010
  backgroundColor: string;
3004
3011
  color: string;
@@ -3015,6 +3022,24 @@ declare const theme: {
3015
3022
  };
3016
3023
  };
3017
3024
  floating: (props: _chakra_ui_styled_system.StyleFunctionProps) => {
3025
+ wrapper: {
3026
+ boxShadow: string;
3027
+ _hover: {
3028
+ boxShadow: string;
3029
+ };
3030
+ _focusWithin: {
3031
+ boxShadow: string;
3032
+ };
3033
+ _invalid: {
3034
+ boxShadow: string;
3035
+ };
3036
+ _disabled: {
3037
+ boxShadow: string;
3038
+ _focus: {
3039
+ boxShadow: string;
3040
+ };
3041
+ };
3042
+ };
3018
3043
  calendar: {
3019
3044
  backgroundColor: string;
3020
3045
  color: string;
@@ -3028,6 +3053,24 @@ declare const theme: {
3028
3053
  };
3029
3054
  };
3030
3055
  ghost: (props: _chakra_ui_styled_system.StyleFunctionProps) => {
3056
+ wrapper: {
3057
+ boxShadow: string;
3058
+ _hover: {
3059
+ boxShadow: string;
3060
+ };
3061
+ _focusWithin: {
3062
+ boxShadow: string;
3063
+ };
3064
+ _invalid: {
3065
+ boxShadow: string;
3066
+ };
3067
+ _disabled: {
3068
+ boxShadow: string;
3069
+ _focus: {
3070
+ boxShadow: string;
3071
+ };
3072
+ };
3073
+ };
3031
3074
  calendar: {
3032
3075
  backgroundColor: string;
3033
3076
  color: string;
@@ -3050,7 +3093,7 @@ declare const theme: {
3050
3093
  variant?: "base" | "ghost" | "floating" | undefined;
3051
3094
  colorScheme?: string | undefined;
3052
3095
  } | undefined;
3053
- parts: ("dateCell" | "weekdays" | "weekend" | "calendar" | "calendarTriggerButton" | "dateTimeSegment" | "inputLabel" | "wrapper" | "arrow")[];
3096
+ parts: ("dateCell" | "weekdays" | "weekend" | "calendar" | "calendarTriggerButton" | "dateTimeSegment" | "inputLabel" | "wrapper" | "calendarPopover" | "arrow")[];
3054
3097
  };
3055
3098
  Divider: {
3056
3099
  baseStyle?: ((props: _chakra_ui_styled_system.StyleFunctionProps) => {
@@ -3484,26 +3527,54 @@ declare const theme: {
3484
3527
  };
3485
3528
  button: {
3486
3529
  _disabled: {
3487
- boxShadow: string;
3488
3530
  _hover: {
3489
3531
  boxShadow: string;
3490
3532
  };
3491
3533
  _focus: {
3492
3534
  boxShadow: string;
3493
3535
  };
3536
+ backgroundColor: string;
3537
+ color: string;
3538
+ } | {
3539
+ _hover: {
3540
+ boxShadow: string;
3541
+ };
3542
+ _focus: {
3543
+ boxShadow: string;
3544
+ };
3545
+ backgroundColor?: undefined;
3546
+ color: string;
3547
+ };
3548
+ _active: {
3549
+ boxShadow: string;
3550
+ backgroundColor: string;
3551
+ } | {
3552
+ boxShadow: string;
3553
+ backgroundColor?: undefined;
3554
+ };
3555
+ _expanded: {
3556
+ boxShadow: string;
3557
+ backgroundColor: string;
3558
+ } | {
3559
+ boxShadow: string;
3560
+ backgroundColor?: undefined;
3494
3561
  };
3495
3562
  _invalid: {
3496
3563
  _focus: _chakra_ui_styled_system.SystemStyleObject;
3497
3564
  _focusVisible: _chakra_ui_styled_system.SystemStyleObject;
3498
3565
  "&[data-focus]:not([data-focus-visible])": _chakra_ui_styled_system.SystemStyleObject;
3499
- boxShadow: string;
3500
3566
  _hover: {
3501
3567
  boxShadow: string;
3502
3568
  };
3569
+ boxShadow: string;
3503
3570
  };
3504
3571
  _focus: _chakra_ui_styled_system.SystemStyleObject;
3505
3572
  _focusVisible: _chakra_ui_styled_system.SystemStyleObject;
3506
3573
  "&[data-focus]:not([data-focus-visible])": _chakra_ui_styled_system.SystemStyleObject;
3574
+ _hover: {
3575
+ boxShadow: string;
3576
+ };
3577
+ boxShadow: string;
3507
3578
  appearance: string;
3508
3579
  borderTopRadius: string;
3509
3580
  borderBottomRadius: string | number;
@@ -3513,10 +3584,6 @@ declare const theme: {
3513
3584
  justifyContent: string;
3514
3585
  alignItems: string;
3515
3586
  fontSize: string;
3516
- boxShadow: string;
3517
- _hover: {
3518
- boxShadow: string;
3519
- };
3520
3587
  };
3521
3588
  arrowIcon: {};
3522
3589
  }) | undefined;
@@ -3673,13 +3740,9 @@ declare const theme: {
3673
3740
  baseStyle?: ((props: _chakra_ui_styled_system.StyleFunctionProps) => {
3674
3741
  field: {
3675
3742
  _disabled: {
3743
+ backgroundColor: string;
3676
3744
  boxShadow: string;
3677
- _hover: {
3678
- boxShadow: string;
3679
- };
3680
- _focus: {
3681
- boxShadow: string;
3682
- };
3745
+ cursor: string;
3683
3746
  };
3684
3747
  _invalid: {
3685
3748
  _focus: _chakra_ui_styled_system.SystemStyleObject;
@@ -3734,6 +3797,11 @@ declare const theme: {
3734
3797
  element: {
3735
3798
  height: string;
3736
3799
  };
3800
+ group: {
3801
+ ":has(:disabled)": {
3802
+ color: string;
3803
+ };
3804
+ };
3737
3805
  }) | undefined;
3738
3806
  sizes?: {
3739
3807
  [key: string]: _chakra_ui_styled_system.PartsStyleInterpolation<{
@@ -3938,11 +4006,16 @@ declare const theme: {
3938
4006
  };
3939
4007
  List: {
3940
4008
  baseStyle?: {
4009
+ container: {
4010
+ fontSize: ("mobile.sm" | "desktop.sm")[];
4011
+ };
4012
+ item: {
4013
+ fontFamily: string;
4014
+ };
3941
4015
  icon: {
3942
4016
  marginEnd: string;
3943
4017
  display: string;
3944
4018
  verticalAlign: string;
3945
- fontFamily: string;
3946
4019
  };
3947
4020
  } | undefined;
3948
4021
  sizes?: {
@@ -3965,7 +4038,7 @@ declare const theme: {
3965
4038
  ListBox: {
3966
4039
  baseStyle?: ((props: _chakra_ui_styled_system.StyleFunctionProps) => {
3967
4040
  container: {
3968
- background: string;
4041
+ backgroundColor: string;
3969
4042
  boxShadow: string;
3970
4043
  overflowY: string;
3971
4044
  maxHeight: string;
@@ -3994,8 +4067,11 @@ declare const theme: {
3994
4067
  backgroundColor: string;
3995
4068
  };
3996
4069
  _selected: {
4070
+ color: string;
3997
4071
  backgroundColor: string;
4072
+ } | {
3998
4073
  color: string;
4074
+ backgroundColor?: undefined;
3999
4075
  };
4000
4076
  };
4001
4077
  label: {};
@@ -4357,13 +4433,9 @@ declare const theme: {
4357
4433
  background: string;
4358
4434
  };
4359
4435
  _disabled: {
4436
+ backgroundColor: string;
4360
4437
  boxShadow: string;
4361
- _hover: {
4362
- boxShadow: string;
4363
- };
4364
- _focus: {
4365
- boxShadow: string;
4366
- };
4438
+ cursor: string;
4367
4439
  };
4368
4440
  _invalid: {
4369
4441
  _focus: _chakra_ui_styled_system.SystemStyleObject;
@@ -4423,7 +4495,7 @@ declare const theme: {
4423
4495
  strokeLinecap: string;
4424
4496
  fontSize: string;
4425
4497
  _disabled: {
4426
- opacity: number;
4498
+ color: string;
4427
4499
  };
4428
4500
  };
4429
4501
  }) | undefined;
@@ -5174,13 +5246,9 @@ declare const theme: {
5174
5246
  };
5175
5247
  };
5176
5248
  _disabled: {
5249
+ backgroundColor: string;
5177
5250
  boxShadow: string;
5178
- _hover: {
5179
- boxShadow: string;
5180
- };
5181
- _focus: {
5182
- boxShadow: string;
5183
- };
5251
+ cursor: string;
5184
5252
  };
5185
5253
  _invalid: {
5186
5254
  _focus: _chakra_ui_styled_system.SystemStyleObject;