@bcc-code/component-library-vue 0.6.9 → 0.7.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/dist/component-library.js +4279 -4492
  2. package/dist/component-library.umd.cjs +171 -367
  3. package/dist/index.css +1 -1
  4. package/dist/theme.css +236 -181
  5. package/dist-types/components/custom/BccStepIndicator/BccStepIndicator.vue.d.ts +27 -0
  6. package/dist-types/components/custom/index.d.ts +2 -0
  7. package/dist-types/components/wrapped/BccCheckbox.vue.d.ts +1 -0
  8. package/dist-types/index.d.ts +0 -1
  9. package/package.json +1 -1
  10. package/dist-types/components/custom/BccStepper/BccStepper.vue.d.ts +0 -16
package/dist/theme.css CHANGED
@@ -649,7 +649,7 @@
649
649
 
650
650
  /* Capitalize first letter */
651
651
  @utility capital {
652
- display: inline-flex;
652
+ display: inline-block;
653
653
  &::first-letter {
654
654
  text-transform: uppercase;
655
655
  }
@@ -685,16 +685,16 @@
685
685
  @utility ctx-blue-bolder {
686
686
  --ctx-text: var(--color-default-blue-200);
687
687
  --ctx-text-bold: var(--color-default-blue-100);
688
- --ctx-background: var(--color-default-blue-800);
689
- --ctx-gradient: var(--color-default-blue-700);
688
+ --ctx-background: var(--color-default-blue-700);
689
+ --ctx-gradient: var(--color-default-blue-800);
690
690
  --ctx-border: var(--color-default-blue-700);
691
691
  --ctx-shadow: var(--color-neutral-alpha-500A);
692
692
  --ctx-text-hover: var(--color-default-blue-200);
693
693
  --ctx-text-pressed: var(--color-default-blue-200);
694
- --ctx-background-hover: var(--color-default-blue-700);
695
- --ctx-background-pressed: var(--color-default-blue-600);
696
- --ctx-gradient-hover: var(--color-default-blue-600);
697
- --ctx-gradient-pressed: var(--color-default-blue-600);
694
+ --ctx-background-hover: var(--color-default-blue-800);
695
+ --ctx-background-pressed: var(--color-default-blue-900);
696
+ --ctx-gradient-hover: var(--color-default-blue-900);
697
+ --ctx-gradient-pressed: var(--color-default-blue-900);
698
698
  --ctx-border-hover: var(--color-default-blue-700);
699
699
  --ctx-border-pressed: var(--color-default-blue-700);
700
700
  }
@@ -702,16 +702,16 @@
702
702
  @utility ctx-blue-subtle {
703
703
  --ctx-text: var(--color-default-blue-900);
704
704
  --ctx-text-bold: var(--color-default-blue-1000);
705
- --ctx-background: var(--color-default-blue-300);
706
- --ctx-gradient: var(--color-default-blue-400);
705
+ --ctx-background: var(--color-default-blue-400);
706
+ --ctx-gradient: var(--color-default-blue-300);
707
707
  --ctx-border: var(--color-default-blue-500);
708
708
  --ctx-shadow: var(--color-neutral-alpha-500A);
709
709
  --ctx-text-hover: var(--color-default-blue-900);
710
710
  --ctx-text-pressed: var(--color-default-blue-900);
711
- --ctx-background-hover: var(--color-default-blue-400);
712
- --ctx-background-pressed: var(--color-default-blue-500);
713
- --ctx-gradient-hover: var(--color-default-blue-500);
714
- --ctx-gradient-pressed: var(--color-default-blue-500);
711
+ --ctx-background-hover: var(--color-default-blue-300);
712
+ --ctx-background-pressed: var(--color-default-blue-200);
713
+ --ctx-gradient-hover: var(--color-default-blue-200);
714
+ --ctx-gradient-pressed: var(--color-default-blue-200);
715
715
  --ctx-border-hover: var(--color-default-blue-500);
716
716
  --ctx-border-pressed: var(--color-default-blue-500);
717
717
  }
@@ -753,16 +753,16 @@
753
753
  @utility ctx-brand-bold {
754
754
  --ctx-text: var(--color-default-bcc-200);
755
755
  --ctx-text-bold: var(--color-default-neutral-100);
756
- --ctx-background: var(--color-default-bcc-800);
756
+ --ctx-background: var(--color-default-bcc-600);
757
757
  --ctx-gradient: var(--color-default-bcc-700);
758
758
  --ctx-border: var(--color-default-bcc-600);
759
759
  --ctx-shadow: var(--color-neutral-alpha-500A);
760
760
  --ctx-text-hover: var(--color-default-bcc-200);
761
761
  --ctx-text-pressed: var(--color-default-bcc-200);
762
762
  --ctx-background-hover: var(--color-default-bcc-700);
763
- --ctx-background-pressed: var(--color-default-bcc-600);
764
- --ctx-gradient-hover: var(--color-default-bcc-600);
765
- --ctx-gradient-pressed: var(--color-default-bcc-600);
763
+ --ctx-background-pressed: var(--color-default-bcc-800);
764
+ --ctx-gradient-hover: var(--color-default-bcc-800);
765
+ --ctx-gradient-pressed: var(--color-default-bcc-800);
766
766
  --ctx-border-hover: var(--color-default-bcc-600);
767
767
  --ctx-border-pressed: var(--color-default-bcc-600);
768
768
  }
@@ -770,16 +770,16 @@
770
770
  @utility ctx-brand-bolder {
771
771
  --ctx-text: var(--color-default-bcc-100);
772
772
  --ctx-text-bold: var(--color-default-neutral-0);
773
- --ctx-background: var(--color-default-bcc-900);
773
+ --ctx-background: var(--color-default-bcc-700);
774
774
  --ctx-gradient: var(--color-default-bcc-800);
775
775
  --ctx-border: var(--color-default-bcc-700);
776
776
  --ctx-shadow: var(--color-neutral-alpha-500A);
777
777
  --ctx-text-hover: var(--color-default-bcc-100);
778
778
  --ctx-text-pressed: var(--color-default-bcc-100);
779
779
  --ctx-background-hover: var(--color-default-bcc-800);
780
- --ctx-background-pressed: var(--color-default-bcc-700);
781
- --ctx-gradient-hover: var(--color-default-bcc-700);
782
- --ctx-gradient-pressed: var(--color-default-bcc-700);
780
+ --ctx-background-pressed: var(--color-default-bcc-900);
781
+ --ctx-gradient-hover: var(--color-default-bcc-900);
782
+ --ctx-gradient-pressed: var(--color-default-bcc-900);
783
783
  --ctx-border-hover: var(--color-default-bcc-700);
784
784
  --ctx-border-pressed: var(--color-default-bcc-700);
785
785
  }
@@ -819,31 +819,31 @@
819
819
  }
820
820
 
821
821
  @utility ctx-brand-subtle {
822
- --ctx-text: var(--color-default-neutral-900);
823
- --ctx-text-bold: var(--color-default-bcc-1000);
824
- --ctx-background: var(--color-default-bcc-300);
825
- --ctx-gradient: var(--color-default-bcc-400);
822
+ --ctx-text: var(--color-default-bcc-1000);
823
+ --ctx-text-bold: var(--color-default-bcc-900);
824
+ --ctx-background: var(--color-default-bcc-400);
825
+ --ctx-gradient: var(--color-default-bcc-300);
826
826
  --ctx-border: var(--color-default-bcc-500);
827
827
  --ctx-shadow: var(--color-neutral-alpha-500A);
828
- --ctx-text-hover: var(--color-default-neutral-900);
829
- --ctx-text-pressed: var(--color-default-neutral-900);
830
- --ctx-background-hover: var(--color-default-bcc-400);
831
- --ctx-background-pressed: var(--color-default-bcc-500);
832
- --ctx-gradient-hover: var(--color-default-bcc-500);
833
- --ctx-gradient-pressed: var(--color-default-bcc-500);
828
+ --ctx-text-hover: var(--color-default-bcc-1000);
829
+ --ctx-text-pressed: var(--color-default-bcc-1000);
830
+ --ctx-background-hover: var(--color-default-bcc-300);
831
+ --ctx-background-pressed: var(--color-default-bcc-200);
832
+ --ctx-gradient-hover: var(--color-default-bcc-200);
833
+ --ctx-gradient-pressed: var(--color-default-bcc-200);
834
834
  --ctx-border-hover: var(--color-default-bcc-500);
835
835
  --ctx-border-pressed: var(--color-default-bcc-500);
836
836
  }
837
837
 
838
838
  @utility ctx-brand-subtler {
839
- --ctx-text: var(--color-default-neutral-800);
840
- --ctx-text-bold: var(--color-default-bcc-900);
839
+ --ctx-text: var(--color-default-bcc-900);
840
+ --ctx-text-bold: var(--color-default-bcc-800);
841
841
  --ctx-background: var(--color-default-bcc-200);
842
842
  --ctx-gradient: var(--color-default-bcc-300);
843
843
  --ctx-border: var(--color-default-bcc-400);
844
844
  --ctx-shadow: var(--color-neutral-alpha-500A);
845
- --ctx-text-hover: var(--color-default-neutral-800);
846
- --ctx-text-pressed: var(--color-default-neutral-800);
845
+ --ctx-text-hover: var(--color-default-bcc-900);
846
+ --ctx-text-pressed: var(--color-default-bcc-900);
847
847
  --ctx-background-hover: var(--color-default-bcc-300);
848
848
  --ctx-background-pressed: var(--color-default-bcc-400);
849
849
  --ctx-gradient-hover: var(--color-default-bcc-400);
@@ -853,14 +853,14 @@
853
853
  }
854
854
 
855
855
  @utility ctx-brand-subtlest {
856
- --ctx-text: var(--color-default-neutral-900);
857
- --ctx-text-bold: var(--color-default-bcc-1000);
856
+ --ctx-text: var(--color-default-bcc-800);
857
+ --ctx-text-bold: var(--color-default-bcc-700);
858
858
  --ctx-background: var(--color-default-bcc-100);
859
859
  --ctx-gradient: var(--color-default-bcc-200);
860
860
  --ctx-border: var(--color-default-bcc-300);
861
861
  --ctx-shadow: var(--color-neutral-alpha-500A);
862
- --ctx-text-hover: var(--color-default-neutral-900);
863
- --ctx-text-pressed: var(--color-default-neutral-900);
862
+ --ctx-text-hover: var(--color-default-bcc-800);
863
+ --ctx-text-pressed: var(--color-default-bcc-800);
864
864
  --ctx-background-hover: var(--color-default-bcc-200);
865
865
  --ctx-background-pressed: var(--color-default-bcc-300);
866
866
  --ctx-gradient-hover: var(--color-default-bcc-300);
@@ -872,16 +872,16 @@
872
872
  @utility ctx-brown-bolder {
873
873
  --ctx-text: var(--color-default-brown-200);
874
874
  --ctx-text-bold: var(--color-default-brown-100);
875
- --ctx-background: var(--color-default-brown-800);
876
- --ctx-gradient: var(--color-default-brown-700);
875
+ --ctx-background: var(--color-default-brown-700);
876
+ --ctx-gradient: var(--color-default-brown-800);
877
877
  --ctx-border: var(--color-default-brown-700);
878
878
  --ctx-shadow: var(--color-neutral-alpha-500A);
879
879
  --ctx-text-hover: var(--color-default-brown-200);
880
880
  --ctx-text-pressed: var(--color-default-brown-200);
881
- --ctx-background-hover: var(--color-default-brown-700);
882
- --ctx-background-pressed: var(--color-default-brown-600);
883
- --ctx-gradient-hover: var(--color-default-brown-600);
884
- --ctx-gradient-pressed: var(--color-default-brown-600);
881
+ --ctx-background-hover: var(--color-default-brown-800);
882
+ --ctx-background-pressed: var(--color-default-brown-900);
883
+ --ctx-gradient-hover: var(--color-default-brown-900);
884
+ --ctx-gradient-pressed: var(--color-default-brown-900);
885
885
  --ctx-border-hover: var(--color-default-brown-700);
886
886
  --ctx-border-pressed: var(--color-default-brown-700);
887
887
  }
@@ -889,16 +889,16 @@
889
889
  @utility ctx-brown-subtle {
890
890
  --ctx-text: var(--color-default-brown-900);
891
891
  --ctx-text-bold: var(--color-default-brown-1000);
892
- --ctx-background: var(--color-default-brown-300);
893
- --ctx-gradient: var(--color-default-brown-400);
892
+ --ctx-background: var(--color-default-brown-400);
893
+ --ctx-gradient: var(--color-default-brown-300);
894
894
  --ctx-border: var(--color-default-brown-500);
895
895
  --ctx-shadow: var(--color-neutral-alpha-500A);
896
896
  --ctx-text-hover: var(--color-default-brown-900);
897
897
  --ctx-text-pressed: var(--color-default-brown-900);
898
- --ctx-background-hover: var(--color-default-brown-400);
899
- --ctx-background-pressed: var(--color-default-brown-500);
900
- --ctx-gradient-hover: var(--color-default-brown-500);
901
- --ctx-gradient-pressed: var(--color-default-brown-500);
898
+ --ctx-background-hover: var(--color-default-brown-300);
899
+ --ctx-background-pressed: var(--color-default-brown-200);
900
+ --ctx-gradient-hover: var(--color-default-brown-200);
901
+ --ctx-gradient-pressed: var(--color-default-brown-200);
902
902
  --ctx-border-hover: var(--color-default-brown-500);
903
903
  --ctx-border-pressed: var(--color-default-brown-500);
904
904
  }
@@ -938,18 +938,18 @@
938
938
  }
939
939
 
940
940
  @utility ctx-danger-bolder {
941
- --ctx-text: var(--color-default-neutral-100);
942
- --ctx-text-bold: var(--color-default-neutral-0);
943
- --ctx-background: var(--color-default-red-800);
944
- --ctx-gradient: var(--color-default-red-700);
941
+ --ctx-text: var(--color-default-red-200);
942
+ --ctx-text-bold: var(--color-default-red-100);
943
+ --ctx-background: var(--color-default-red-700);
944
+ --ctx-gradient: var(--color-default-red-800);
945
945
  --ctx-border: var(--color-default-red-700);
946
946
  --ctx-shadow: var(--color-neutral-alpha-500A);
947
- --ctx-text-hover: var(--color-default-neutral-100);
948
- --ctx-text-pressed: var(--color-default-neutral-100);
949
- --ctx-background-hover: var(--color-default-red-700);
950
- --ctx-background-pressed: var(--color-default-red-600);
951
- --ctx-gradient-hover: var(--color-default-red-600);
952
- --ctx-gradient-pressed: var(--color-default-red-600);
947
+ --ctx-text-hover: var(--color-default-red-200);
948
+ --ctx-text-pressed: var(--color-default-red-200);
949
+ --ctx-background-hover: var(--color-default-red-800);
950
+ --ctx-background-pressed: var(--color-default-red-900);
951
+ --ctx-gradient-hover: var(--color-default-red-900);
952
+ --ctx-gradient-pressed: var(--color-default-red-900);
953
953
  --ctx-border-hover: var(--color-default-red-700);
954
954
  --ctx-border-pressed: var(--color-default-red-700);
955
955
  }
@@ -991,16 +991,16 @@
991
991
  @utility ctx-gray-subtle {
992
992
  --ctx-text: var(--color-default-neutral-900);
993
993
  --ctx-text-bold: var(--color-default-neutral-1000);
994
- --ctx-background: var(--color-default-neutral-300);
995
- --ctx-gradient: var(--color-default-neutral-400);
994
+ --ctx-background: var(--color-default-neutral-400);
995
+ --ctx-gradient: var(--color-default-neutral-300);
996
996
  --ctx-border: var(--color-default-neutral-500);
997
997
  --ctx-shadow: var(--color-neutral-alpha-500A);
998
998
  --ctx-text-hover: var(--color-default-neutral-900);
999
999
  --ctx-text-pressed: var(--color-default-neutral-900);
1000
- --ctx-background-hover: var(--color-default-neutral-400);
1001
- --ctx-background-pressed: var(--color-default-neutral-500);
1002
- --ctx-gradient-hover: var(--color-default-neutral-500);
1003
- --ctx-gradient-pressed: var(--color-default-neutral-500);
1000
+ --ctx-background-hover: var(--color-default-neutral-300);
1001
+ --ctx-background-pressed: var(--color-default-neutral-200);
1002
+ --ctx-gradient-hover: var(--color-default-neutral-200);
1003
+ --ctx-gradient-pressed: var(--color-default-neutral-200);
1004
1004
  --ctx-border-hover: var(--color-default-neutral-500);
1005
1005
  --ctx-border-pressed: var(--color-default-neutral-500);
1006
1006
  }
@@ -1042,16 +1042,16 @@
1042
1042
  @utility ctx-green-bolder {
1043
1043
  --ctx-text: var(--color-default-green-200);
1044
1044
  --ctx-text-bold: var(--color-default-green-100);
1045
- --ctx-background: var(--color-default-green-800);
1046
- --ctx-gradient: var(--color-default-green-700);
1045
+ --ctx-background: var(--color-default-green-700);
1046
+ --ctx-gradient: var(--color-default-green-800);
1047
1047
  --ctx-border: var(--color-default-green-700);
1048
1048
  --ctx-shadow: var(--color-neutral-alpha-500A);
1049
1049
  --ctx-text-hover: var(--color-default-green-200);
1050
1050
  --ctx-text-pressed: var(--color-default-green-200);
1051
- --ctx-background-hover: var(--color-default-green-700);
1052
- --ctx-background-pressed: var(--color-default-green-600);
1053
- --ctx-gradient-hover: var(--color-default-green-600);
1054
- --ctx-gradient-pressed: var(--color-default-green-600);
1051
+ --ctx-background-hover: var(--color-default-green-800);
1052
+ --ctx-background-pressed: var(--color-default-green-900);
1053
+ --ctx-gradient-hover: var(--color-default-green-900);
1054
+ --ctx-gradient-pressed: var(--color-default-green-900);
1055
1055
  --ctx-border-hover: var(--color-default-green-700);
1056
1056
  --ctx-border-pressed: var(--color-default-green-700);
1057
1057
  }
@@ -1059,16 +1059,16 @@
1059
1059
  @utility ctx-green-subtle {
1060
1060
  --ctx-text: var(--color-default-green-900);
1061
1061
  --ctx-text-bold: var(--color-default-green-1000);
1062
- --ctx-background: var(--color-default-green-300);
1063
- --ctx-gradient: var(--color-default-green-400);
1062
+ --ctx-background: var(--color-default-green-400);
1063
+ --ctx-gradient: var(--color-default-green-300);
1064
1064
  --ctx-border: var(--color-default-green-500);
1065
1065
  --ctx-shadow: var(--color-neutral-alpha-500A);
1066
1066
  --ctx-text-hover: var(--color-default-green-900);
1067
1067
  --ctx-text-pressed: var(--color-default-green-900);
1068
- --ctx-background-hover: var(--color-default-green-400);
1069
- --ctx-background-pressed: var(--color-default-green-500);
1070
- --ctx-gradient-hover: var(--color-default-green-500);
1071
- --ctx-gradient-pressed: var(--color-default-green-500);
1068
+ --ctx-background-hover: var(--color-default-green-300);
1069
+ --ctx-background-pressed: var(--color-default-green-200);
1070
+ --ctx-gradient-hover: var(--color-default-green-200);
1071
+ --ctx-gradient-pressed: var(--color-default-green-200);
1072
1072
  --ctx-border-hover: var(--color-default-green-500);
1073
1073
  --ctx-border-pressed: var(--color-default-green-500);
1074
1074
  }
@@ -1108,18 +1108,18 @@
1108
1108
  }
1109
1109
 
1110
1110
  @utility ctx-info-bolder {
1111
- --ctx-text: var(--color-default-neutral-100);
1112
- --ctx-text-bold: var(--color-default-neutral-0);
1113
- --ctx-background: var(--color-default-blue-800);
1114
- --ctx-gradient: var(--color-default-blue-700);
1111
+ --ctx-text: var(--color-default-blue-200);
1112
+ --ctx-text-bold: var(--color-default-blue-100);
1113
+ --ctx-background: var(--color-default-blue-700);
1114
+ --ctx-gradient: var(--color-default-blue-800);
1115
1115
  --ctx-border: var(--color-default-blue-700);
1116
1116
  --ctx-shadow: var(--color-neutral-alpha-500A);
1117
- --ctx-text-hover: var(--color-default-neutral-100);
1118
- --ctx-text-pressed: var(--color-default-neutral-100);
1119
- --ctx-background-hover: var(--color-default-blue-700);
1120
- --ctx-background-pressed: var(--color-default-blue-600);
1121
- --ctx-gradient-hover: var(--color-default-blue-600);
1122
- --ctx-gradient-pressed: var(--color-default-blue-600);
1117
+ --ctx-text-hover: var(--color-default-blue-200);
1118
+ --ctx-text-pressed: var(--color-default-blue-200);
1119
+ --ctx-background-hover: var(--color-default-blue-800);
1120
+ --ctx-background-pressed: var(--color-default-blue-900);
1121
+ --ctx-gradient-hover: var(--color-default-blue-900);
1122
+ --ctx-gradient-pressed: var(--color-default-blue-900);
1123
1123
  --ctx-border-hover: var(--color-default-blue-700);
1124
1124
  --ctx-border-pressed: var(--color-default-blue-700);
1125
1125
  }
@@ -1144,16 +1144,16 @@
1144
1144
  @utility ctx-magenta-bolder {
1145
1145
  --ctx-text: var(--color-default-magenta-200);
1146
1146
  --ctx-text-bold: var(--color-default-magenta-100);
1147
- --ctx-background: var(--color-default-magenta-800);
1148
- --ctx-gradient: var(--color-default-magenta-700);
1147
+ --ctx-background: var(--color-default-magenta-700);
1148
+ --ctx-gradient: var(--color-default-magenta-800);
1149
1149
  --ctx-border: var(--color-default-magenta-700);
1150
1150
  --ctx-shadow: var(--color-neutral-alpha-500A);
1151
1151
  --ctx-text-hover: var(--color-default-magenta-200);
1152
1152
  --ctx-text-pressed: var(--color-default-magenta-200);
1153
- --ctx-background-hover: var(--color-default-magenta-700);
1154
- --ctx-background-pressed: var(--color-default-magenta-600);
1155
- --ctx-gradient-hover: var(--color-default-magenta-600);
1156
- --ctx-gradient-pressed: var(--color-default-magenta-600);
1153
+ --ctx-background-hover: var(--color-default-magenta-800);
1154
+ --ctx-background-pressed: var(--color-default-magenta-900);
1155
+ --ctx-gradient-hover: var(--color-default-magenta-900);
1156
+ --ctx-gradient-pressed: var(--color-default-magenta-900);
1157
1157
  --ctx-border-hover: var(--color-default-magenta-700);
1158
1158
  --ctx-border-pressed: var(--color-default-magenta-700);
1159
1159
  }
@@ -1161,16 +1161,16 @@
1161
1161
  @utility ctx-magenta-subtle {
1162
1162
  --ctx-text: var(--color-default-magenta-900);
1163
1163
  --ctx-text-bold: var(--color-default-magenta-1000);
1164
- --ctx-background: var(--color-default-magenta-300);
1165
- --ctx-gradient: var(--color-default-magenta-400);
1164
+ --ctx-background: var(--color-default-magenta-400);
1165
+ --ctx-gradient: var(--color-default-magenta-300);
1166
1166
  --ctx-border: var(--color-default-magenta-500);
1167
1167
  --ctx-shadow: var(--color-neutral-alpha-500A);
1168
1168
  --ctx-text-hover: var(--color-default-magenta-900);
1169
1169
  --ctx-text-pressed: var(--color-default-magenta-900);
1170
- --ctx-background-hover: var(--color-default-magenta-400);
1171
- --ctx-background-pressed: var(--color-default-magenta-500);
1172
- --ctx-gradient-hover: var(--color-default-magenta-500);
1173
- --ctx-gradient-pressed: var(--color-default-magenta-500);
1170
+ --ctx-background-hover: var(--color-default-magenta-300);
1171
+ --ctx-background-pressed: var(--color-default-magenta-200);
1172
+ --ctx-gradient-hover: var(--color-default-magenta-200);
1173
+ --ctx-gradient-pressed: var(--color-default-magenta-200);
1174
1174
  --ctx-border-hover: var(--color-default-magenta-500);
1175
1175
  --ctx-border-pressed: var(--color-default-magenta-500);
1176
1176
  }
@@ -1314,16 +1314,16 @@
1314
1314
  @utility ctx-orange-bolder {
1315
1315
  --ctx-text: var(--color-default-orange-200);
1316
1316
  --ctx-text-bold: var(--color-default-orange-100);
1317
- --ctx-background: var(--color-default-orange-800);
1318
- --ctx-gradient: var(--color-default-orange-700);
1317
+ --ctx-background: var(--color-default-orange-700);
1318
+ --ctx-gradient: var(--color-default-orange-800);
1319
1319
  --ctx-border: var(--color-default-orange-700);
1320
1320
  --ctx-shadow: var(--color-neutral-alpha-500A);
1321
1321
  --ctx-text-hover: var(--color-default-orange-200);
1322
1322
  --ctx-text-pressed: var(--color-default-orange-200);
1323
- --ctx-background-hover: var(--color-default-orange-700);
1324
- --ctx-background-pressed: var(--color-default-orange-600);
1325
- --ctx-gradient-hover: var(--color-default-orange-600);
1326
- --ctx-gradient-pressed: var(--color-default-orange-600);
1323
+ --ctx-background-hover: var(--color-default-orange-800);
1324
+ --ctx-background-pressed: var(--color-default-orange-900);
1325
+ --ctx-gradient-hover: var(--color-default-orange-900);
1326
+ --ctx-gradient-pressed: var(--color-default-orange-900);
1327
1327
  --ctx-border-hover: var(--color-default-orange-700);
1328
1328
  --ctx-border-pressed: var(--color-default-orange-700);
1329
1329
  }
@@ -1331,16 +1331,16 @@
1331
1331
  @utility ctx-orange-subtle {
1332
1332
  --ctx-text: var(--color-default-orange-900);
1333
1333
  --ctx-text-bold: var(--color-default-orange-1000);
1334
- --ctx-background: var(--color-default-orange-300);
1335
- --ctx-gradient: var(--color-default-orange-400);
1334
+ --ctx-background: var(--color-default-orange-400);
1335
+ --ctx-gradient: var(--color-default-orange-300);
1336
1336
  --ctx-border: var(--color-default-orange-500);
1337
1337
  --ctx-shadow: var(--color-neutral-alpha-500A);
1338
1338
  --ctx-text-hover: var(--color-default-orange-900);
1339
1339
  --ctx-text-pressed: var(--color-default-orange-900);
1340
- --ctx-background-hover: var(--color-default-orange-400);
1341
- --ctx-background-pressed: var(--color-default-orange-500);
1342
- --ctx-gradient-hover: var(--color-default-orange-500);
1343
- --ctx-gradient-pressed: var(--color-default-orange-500);
1340
+ --ctx-background-hover: var(--color-default-orange-300);
1341
+ --ctx-background-pressed: var(--color-default-orange-200);
1342
+ --ctx-gradient-hover: var(--color-default-orange-200);
1343
+ --ctx-gradient-pressed: var(--color-default-orange-200);
1344
1344
  --ctx-border-hover: var(--color-default-orange-500);
1345
1345
  --ctx-border-pressed: var(--color-default-orange-500);
1346
1346
  }
@@ -1382,16 +1382,16 @@
1382
1382
  @utility ctx-purple-bolder {
1383
1383
  --ctx-text: var(--color-default-purple-200);
1384
1384
  --ctx-text-bold: var(--color-default-purple-100);
1385
- --ctx-background: var(--color-default-purple-800);
1386
- --ctx-gradient: var(--color-default-purple-700);
1385
+ --ctx-background: var(--color-default-purple-700);
1386
+ --ctx-gradient: var(--color-default-purple-800);
1387
1387
  --ctx-border: var(--color-default-purple-700);
1388
1388
  --ctx-shadow: var(--color-neutral-alpha-500A);
1389
1389
  --ctx-text-hover: var(--color-default-purple-200);
1390
1390
  --ctx-text-pressed: var(--color-default-purple-200);
1391
- --ctx-background-hover: var(--color-default-purple-700);
1392
- --ctx-background-pressed: var(--color-default-purple-600);
1393
- --ctx-gradient-hover: var(--color-default-purple-600);
1394
- --ctx-gradient-pressed: var(--color-default-purple-600);
1391
+ --ctx-background-hover: var(--color-default-purple-800);
1392
+ --ctx-background-pressed: var(--color-default-purple-900);
1393
+ --ctx-gradient-hover: var(--color-default-purple-900);
1394
+ --ctx-gradient-pressed: var(--color-default-purple-900);
1395
1395
  --ctx-border-hover: var(--color-default-purple-700);
1396
1396
  --ctx-border-pressed: var(--color-default-purple-700);
1397
1397
  }
@@ -1399,16 +1399,16 @@
1399
1399
  @utility ctx-purple-subtle {
1400
1400
  --ctx-text: var(--color-default-purple-900);
1401
1401
  --ctx-text-bold: var(--color-default-purple-1000);
1402
- --ctx-background: var(--color-default-purple-300);
1403
- --ctx-gradient: var(--color-default-purple-400);
1402
+ --ctx-background: var(--color-default-purple-400);
1403
+ --ctx-gradient: var(--color-default-purple-300);
1404
1404
  --ctx-border: var(--color-default-purple-500);
1405
1405
  --ctx-shadow: var(--color-neutral-alpha-500A);
1406
1406
  --ctx-text-hover: var(--color-default-purple-900);
1407
1407
  --ctx-text-pressed: var(--color-default-purple-900);
1408
- --ctx-background-hover: var(--color-default-purple-400);
1409
- --ctx-background-pressed: var(--color-default-purple-500);
1410
- --ctx-gradient-hover: var(--color-default-purple-500);
1411
- --ctx-gradient-pressed: var(--color-default-purple-500);
1408
+ --ctx-background-hover: var(--color-default-purple-300);
1409
+ --ctx-background-pressed: var(--color-default-purple-200);
1410
+ --ctx-gradient-hover: var(--color-default-purple-200);
1411
+ --ctx-gradient-pressed: var(--color-default-purple-200);
1412
1412
  --ctx-border-hover: var(--color-default-purple-500);
1413
1413
  --ctx-border-pressed: var(--color-default-purple-500);
1414
1414
  }
@@ -1450,16 +1450,16 @@
1450
1450
  @utility ctx-red-bolder {
1451
1451
  --ctx-text: var(--color-default-red-200);
1452
1452
  --ctx-text-bold: var(--color-default-red-100);
1453
- --ctx-background: var(--color-default-red-800);
1454
- --ctx-gradient: var(--color-default-red-700);
1453
+ --ctx-background: var(--color-default-red-700);
1454
+ --ctx-gradient: var(--color-default-red-800);
1455
1455
  --ctx-border: var(--color-default-red-700);
1456
1456
  --ctx-shadow: var(--color-neutral-alpha-500A);
1457
1457
  --ctx-text-hover: var(--color-default-red-200);
1458
1458
  --ctx-text-pressed: var(--color-default-red-200);
1459
- --ctx-background-hover: var(--color-default-red-700);
1460
- --ctx-background-pressed: var(--color-default-red-600);
1461
- --ctx-gradient-hover: var(--color-default-red-600);
1462
- --ctx-gradient-pressed: var(--color-default-red-600);
1459
+ --ctx-background-hover: var(--color-default-red-800);
1460
+ --ctx-background-pressed: var(--color-default-red-900);
1461
+ --ctx-gradient-hover: var(--color-default-red-900);
1462
+ --ctx-gradient-pressed: var(--color-default-red-900);
1463
1463
  --ctx-border-hover: var(--color-default-red-700);
1464
1464
  --ctx-border-pressed: var(--color-default-red-700);
1465
1465
  }
@@ -1467,16 +1467,16 @@
1467
1467
  @utility ctx-red-subtle {
1468
1468
  --ctx-text: var(--color-default-red-900);
1469
1469
  --ctx-text-bold: var(--color-default-red-1000);
1470
- --ctx-background: var(--color-default-red-300);
1471
- --ctx-gradient: var(--color-default-red-400);
1470
+ --ctx-background: var(--color-default-red-400);
1471
+ --ctx-gradient: var(--color-default-red-300);
1472
1472
  --ctx-border: var(--color-default-red-500);
1473
1473
  --ctx-shadow: var(--color-neutral-alpha-500A);
1474
1474
  --ctx-text-hover: var(--color-default-red-900);
1475
1475
  --ctx-text-pressed: var(--color-default-red-900);
1476
- --ctx-background-hover: var(--color-default-red-400);
1477
- --ctx-background-pressed: var(--color-default-red-500);
1478
- --ctx-gradient-hover: var(--color-default-red-500);
1479
- --ctx-gradient-pressed: var(--color-default-red-500);
1476
+ --ctx-background-hover: var(--color-default-red-300);
1477
+ --ctx-background-pressed: var(--color-default-red-200);
1478
+ --ctx-gradient-hover: var(--color-default-red-200);
1479
+ --ctx-gradient-pressed: var(--color-default-red-200);
1480
1480
  --ctx-border-hover: var(--color-default-red-500);
1481
1481
  --ctx-border-pressed: var(--color-default-red-500);
1482
1482
  }
@@ -1516,18 +1516,18 @@
1516
1516
  }
1517
1517
 
1518
1518
  @utility ctx-success-bolder {
1519
- --ctx-text: var(--color-default-neutral-100);
1520
- --ctx-text-bold: var(--color-default-neutral-0);
1521
- --ctx-background: var(--color-default-green-800);
1522
- --ctx-gradient: var(--color-default-green-700);
1519
+ --ctx-text: var(--color-default-green-200);
1520
+ --ctx-text-bold: var(--color-default-green-100);
1521
+ --ctx-background: var(--color-default-green-700);
1522
+ --ctx-gradient: var(--color-default-green-800);
1523
1523
  --ctx-border: var(--color-default-green-700);
1524
1524
  --ctx-shadow: var(--color-neutral-alpha-500A);
1525
- --ctx-text-hover: var(--color-default-neutral-100);
1526
- --ctx-text-pressed: var(--color-default-neutral-100);
1527
- --ctx-background-hover: var(--color-default-green-700);
1528
- --ctx-background-pressed: var(--color-default-green-600);
1529
- --ctx-gradient-hover: var(--color-default-green-600);
1530
- --ctx-gradient-pressed: var(--color-default-green-600);
1525
+ --ctx-text-hover: var(--color-default-green-200);
1526
+ --ctx-text-pressed: var(--color-default-green-200);
1527
+ --ctx-background-hover: var(--color-default-green-800);
1528
+ --ctx-background-pressed: var(--color-default-green-900);
1529
+ --ctx-gradient-hover: var(--color-default-green-900);
1530
+ --ctx-gradient-pressed: var(--color-default-green-900);
1531
1531
  --ctx-border-hover: var(--color-default-green-700);
1532
1532
  --ctx-border-pressed: var(--color-default-green-700);
1533
1533
  }
@@ -1552,16 +1552,16 @@
1552
1552
  @utility ctx-teal-bolder {
1553
1553
  --ctx-text: var(--color-default-teal-200);
1554
1554
  --ctx-text-bold: var(--color-default-teal-100);
1555
- --ctx-background: var(--color-default-teal-800);
1556
- --ctx-gradient: var(--color-default-teal-700);
1555
+ --ctx-background: var(--color-default-teal-700);
1556
+ --ctx-gradient: var(--color-default-teal-800);
1557
1557
  --ctx-border: var(--color-default-teal-700);
1558
1558
  --ctx-shadow: var(--color-neutral-alpha-500A);
1559
1559
  --ctx-text-hover: var(--color-default-teal-200);
1560
1560
  --ctx-text-pressed: var(--color-default-teal-200);
1561
- --ctx-background-hover: var(--color-default-teal-700);
1562
- --ctx-background-pressed: var(--color-default-teal-600);
1563
- --ctx-gradient-hover: var(--color-default-teal-600);
1564
- --ctx-gradient-pressed: var(--color-default-teal-600);
1561
+ --ctx-background-hover: var(--color-default-teal-800);
1562
+ --ctx-background-pressed: var(--color-default-teal-900);
1563
+ --ctx-gradient-hover: var(--color-default-teal-900);
1564
+ --ctx-gradient-pressed: var(--color-default-teal-900);
1565
1565
  --ctx-border-hover: var(--color-default-teal-700);
1566
1566
  --ctx-border-pressed: var(--color-default-teal-700);
1567
1567
  }
@@ -1569,16 +1569,16 @@
1569
1569
  @utility ctx-teal-subtle {
1570
1570
  --ctx-text: var(--color-default-teal-900);
1571
1571
  --ctx-text-bold: var(--color-default-teal-1000);
1572
- --ctx-background: var(--color-default-teal-300);
1573
- --ctx-gradient: var(--color-default-teal-400);
1572
+ --ctx-background: var(--color-default-teal-400);
1573
+ --ctx-gradient: var(--color-default-teal-300);
1574
1574
  --ctx-border: var(--color-default-teal-500);
1575
1575
  --ctx-shadow: var(--color-neutral-alpha-500A);
1576
1576
  --ctx-text-hover: var(--color-default-teal-900);
1577
1577
  --ctx-text-pressed: var(--color-default-teal-900);
1578
- --ctx-background-hover: var(--color-default-teal-400);
1579
- --ctx-background-pressed: var(--color-default-teal-500);
1580
- --ctx-gradient-hover: var(--color-default-teal-500);
1581
- --ctx-gradient-pressed: var(--color-default-teal-500);
1578
+ --ctx-background-hover: var(--color-default-teal-300);
1579
+ --ctx-background-pressed: var(--color-default-teal-200);
1580
+ --ctx-gradient-hover: var(--color-default-teal-200);
1581
+ --ctx-gradient-pressed: var(--color-default-teal-200);
1582
1582
  --ctx-border-hover: var(--color-default-teal-500);
1583
1583
  --ctx-border-pressed: var(--color-default-teal-500);
1584
1584
  }
@@ -1618,18 +1618,18 @@
1618
1618
  }
1619
1619
 
1620
1620
  @utility ctx-warning-bolder {
1621
- --ctx-text: var(--color-default-neutral-100);
1622
- --ctx-text-bold: var(--color-default-neutral-0);
1623
- --ctx-background: var(--color-default-yellow-800);
1624
- --ctx-gradient: var(--color-default-yellow-700);
1621
+ --ctx-text: var(--color-default-yellow-200);
1622
+ --ctx-text-bold: var(--color-default-yellow-100);
1623
+ --ctx-background: var(--color-default-yellow-700);
1624
+ --ctx-gradient: var(--color-default-yellow-800);
1625
1625
  --ctx-border: var(--color-default-yellow-700);
1626
1626
  --ctx-shadow: var(--color-neutral-alpha-500A);
1627
- --ctx-text-hover: var(--color-default-neutral-100);
1628
- --ctx-text-pressed: var(--color-default-neutral-100);
1629
- --ctx-background-hover: var(--color-default-yellow-700);
1630
- --ctx-background-pressed: var(--color-default-yellow-600);
1631
- --ctx-gradient-hover: var(--color-default-yellow-600);
1632
- --ctx-gradient-pressed: var(--color-default-yellow-600);
1627
+ --ctx-text-hover: var(--color-default-yellow-200);
1628
+ --ctx-text-pressed: var(--color-default-yellow-200);
1629
+ --ctx-background-hover: var(--color-default-yellow-800);
1630
+ --ctx-background-pressed: var(--color-default-yellow-900);
1631
+ --ctx-gradient-hover: var(--color-default-yellow-900);
1632
+ --ctx-gradient-pressed: var(--color-default-yellow-900);
1633
1633
  --ctx-border-hover: var(--color-default-yellow-700);
1634
1634
  --ctx-border-pressed: var(--color-default-yellow-700);
1635
1635
  }
@@ -1654,16 +1654,16 @@
1654
1654
  @utility ctx-yellow-bolder {
1655
1655
  --ctx-text: var(--color-default-yellow-200);
1656
1656
  --ctx-text-bold: var(--color-default-yellow-100);
1657
- --ctx-background: var(--color-default-yellow-800);
1658
- --ctx-gradient: var(--color-default-yellow-700);
1657
+ --ctx-background: var(--color-default-yellow-700);
1658
+ --ctx-gradient: var(--color-default-yellow-800);
1659
1659
  --ctx-border: var(--color-default-yellow-700);
1660
1660
  --ctx-shadow: var(--color-neutral-alpha-500A);
1661
1661
  --ctx-text-hover: var(--color-default-yellow-200);
1662
1662
  --ctx-text-pressed: var(--color-default-yellow-200);
1663
- --ctx-background-hover: var(--color-default-yellow-700);
1664
- --ctx-background-pressed: var(--color-default-yellow-600);
1665
- --ctx-gradient-hover: var(--color-default-yellow-600);
1666
- --ctx-gradient-pressed: var(--color-default-yellow-600);
1663
+ --ctx-background-hover: var(--color-default-yellow-800);
1664
+ --ctx-background-pressed: var(--color-default-yellow-900);
1665
+ --ctx-gradient-hover: var(--color-default-yellow-900);
1666
+ --ctx-gradient-pressed: var(--color-default-yellow-900);
1667
1667
  --ctx-border-hover: var(--color-default-yellow-700);
1668
1668
  --ctx-border-pressed: var(--color-default-yellow-700);
1669
1669
  }
@@ -1671,16 +1671,16 @@
1671
1671
  @utility ctx-yellow-subtle {
1672
1672
  --ctx-text: var(--color-default-yellow-900);
1673
1673
  --ctx-text-bold: var(--color-default-yellow-1000);
1674
- --ctx-background: var(--color-default-yellow-300);
1675
- --ctx-gradient: var(--color-default-yellow-400);
1674
+ --ctx-background: var(--color-default-yellow-400);
1675
+ --ctx-gradient: var(--color-default-yellow-300);
1676
1676
  --ctx-border: var(--color-default-yellow-500);
1677
1677
  --ctx-shadow: var(--color-neutral-alpha-500A);
1678
1678
  --ctx-text-hover: var(--color-default-yellow-900);
1679
1679
  --ctx-text-pressed: var(--color-default-yellow-900);
1680
- --ctx-background-hover: var(--color-default-yellow-400);
1681
- --ctx-background-pressed: var(--color-default-yellow-500);
1682
- --ctx-gradient-hover: var(--color-default-yellow-500);
1683
- --ctx-gradient-pressed: var(--color-default-yellow-500);
1680
+ --ctx-background-hover: var(--color-default-yellow-300);
1681
+ --ctx-background-pressed: var(--color-default-yellow-200);
1682
+ --ctx-gradient-hover: var(--color-default-yellow-200);
1683
+ --ctx-gradient-pressed: var(--color-default-yellow-200);
1684
1684
  --ctx-border-hover: var(--color-default-yellow-500);
1685
1685
  --ctx-border-pressed: var(--color-default-yellow-500);
1686
1686
  }
@@ -1821,6 +1821,12 @@
1821
1821
 
1822
1822
 
1823
1823
  /* === ./styles/component-overrides.css === */
1824
+ /** Custom styles to fix primevue components that are not custom or wrapped. */
1825
+
1826
+ /**
1827
+ .BccAutocomplete
1828
+ **/
1829
+
1824
1830
  /** Our icons are a bit smaller that Primevue's default */
1825
1831
  .p-autocomplete .p-icon {
1826
1832
  --p-icon-size: var(--icon-size-sm);
@@ -2263,6 +2269,55 @@
2263
2269
 
2264
2270
 
2265
2271
 
2272
+ /* from ./BccStepIndicator/BccStepIndicator.css */
2273
+ @layer components {
2274
+ .bcc-stepper-container {
2275
+ @apply flex flex-col;
2276
+ }
2277
+
2278
+ .bcc-stepper-header {
2279
+ @apply mb-2 text-left;
2280
+ }
2281
+
2282
+ .bcc-stepper-current-step {
2283
+ @apply text-heading-sm text-default;
2284
+ }
2285
+
2286
+ .bcc-stepper-current-label {
2287
+ @apply text-body-sm pl-2 text-subtle;
2288
+ }
2289
+
2290
+ .bcc-stepper-indicators {
2291
+ @apply flex justify-start gap-2;
2292
+ }
2293
+
2294
+ .bcc-stepper-indicator-container {
2295
+ @apply col;
2296
+ }
2297
+
2298
+ .bcc-stepper-indicator {
2299
+ @apply h-1.5 rounded-lg duration-300;
2300
+ }
2301
+
2302
+ .bcc-stepper-indicator-active {
2303
+ @apply w-6;
2304
+ }
2305
+
2306
+ .bcc-stepper-indicator-inactive {
2307
+ @apply w-1.5;
2308
+ }
2309
+
2310
+ .bcc-stepper-indicator-completed {
2311
+ @apply bg-selected-bold-default;
2312
+ }
2313
+
2314
+ .bcc-stepper-indicator-pending {
2315
+ @apply bg-alpha-subtle-default;
2316
+ }
2317
+ }
2318
+
2319
+
2320
+
2266
2321
  /* from ./BccTag/BccTag.css */
2267
2322
 
2268
2323
  @layer components {