@wizishop/angular-components 15.1.119 → 15.1.120
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.
- package/angular-components.scss +151 -124
- package/esm2020/lib/components/border-picker/border-picker.component.mjs +36 -34
- package/esm2020/lib/components/header-page/header-page.component.mjs +1 -1
- package/esm2020/lib/components/hn/h1/h1.component.mjs +12 -3
- package/esm2020/lib/components/hn/h2/h2.component.mjs +16 -6
- package/esm2020/lib/components/hn/h3/h3.component.mjs +12 -3
- package/esm2020/lib/components/hn/h4/h4.component.mjs +12 -3
- package/esm2020/lib/components/multiple-search-plus/multiple-search-plus.component.mjs +1 -1
- package/esm2020/lib/components/slide-in/slide-in.component.mjs +32 -3
- package/fesm2015/wizishop-angular-components.mjs +112 -46
- package/fesm2015/wizishop-angular-components.mjs.map +1 -1
- package/fesm2020/wizishop-angular-components.mjs +112 -46
- package/fesm2020/wizishop-angular-components.mjs.map +1 -1
- package/lib/components/border-picker/border-picker.component.d.ts +6 -10
- package/lib/components/hn/h1/h1.component.d.ts +4 -1
- package/lib/components/hn/h2/h2.component.d.ts +4 -1
- package/lib/components/hn/h3/h3.component.d.ts +4 -1
- package/lib/components/hn/h4/h4.component.d.ts +4 -1
- package/lib/components/slide-in/slide-in.component.d.ts +14 -1
- package/package.json +1 -1
- package/wizishop-angular-components-15.1.120.tgz +0 -0
- package/wizishop-angular-components-15.1.119.tgz +0 -0
package/angular-components.scss
CHANGED
|
@@ -786,6 +786,25 @@ $wac-tab-colunm-blue: #3ba6ec!default;.zindexToggle {
|
|
|
786
786
|
}
|
|
787
787
|
}
|
|
788
788
|
}
|
|
789
|
+
wac-block {
|
|
790
|
+
.wac-block {
|
|
791
|
+
background-color: $white;
|
|
792
|
+
@include padding(rem(30));
|
|
793
|
+
box-shadow: 0 rem(2) rem(5) rgba(45, 62, 85, 0.05);
|
|
794
|
+
@include simple_transition();
|
|
795
|
+
height: 100%;
|
|
796
|
+
border-radius: var(--wac-block-border-radius);
|
|
797
|
+
|
|
798
|
+
@include media('<tablet') {
|
|
799
|
+
@include padding(rem(20));
|
|
800
|
+
}
|
|
801
|
+
|
|
802
|
+
&:hover {
|
|
803
|
+
box-shadow: 0 rem(2) rem(5) rgba(45, 62, 85, 0.2);
|
|
804
|
+
}
|
|
805
|
+
}
|
|
806
|
+
}
|
|
807
|
+
|
|
789
808
|
.block-with-checkbox {
|
|
790
809
|
width: 100%;
|
|
791
810
|
display: flex;
|
|
@@ -926,25 +945,6 @@ $wac-tab-colunm-blue: #3ba6ec!default;.zindexToggle {
|
|
|
926
945
|
margin-right: 0;
|
|
927
946
|
}
|
|
928
947
|
}
|
|
929
|
-
wac-block {
|
|
930
|
-
.wac-block {
|
|
931
|
-
background-color: $white;
|
|
932
|
-
@include padding(rem(30));
|
|
933
|
-
box-shadow: 0 rem(2) rem(5) rgba(45, 62, 85, 0.05);
|
|
934
|
-
@include simple_transition();
|
|
935
|
-
height: 100%;
|
|
936
|
-
border-radius: var(--wac-block-border-radius);
|
|
937
|
-
|
|
938
|
-
@include media('<tablet') {
|
|
939
|
-
@include padding(rem(20));
|
|
940
|
-
}
|
|
941
|
-
|
|
942
|
-
&:hover {
|
|
943
|
-
box-shadow: 0 rem(2) rem(5) rgba(45, 62, 85, 0.2);
|
|
944
|
-
}
|
|
945
|
-
}
|
|
946
|
-
}
|
|
947
|
-
|
|
948
948
|
.w-border-picker {
|
|
949
949
|
display: flex;
|
|
950
950
|
flex-direction: column;
|
|
@@ -954,20 +954,22 @@ wac-block {
|
|
|
954
954
|
}
|
|
955
955
|
|
|
956
956
|
.w-input {
|
|
957
|
-
width:
|
|
957
|
+
width: 100%;
|
|
958
|
+
min-width: 305px;
|
|
958
959
|
height: 40px;
|
|
959
960
|
display: flex;
|
|
960
961
|
align-items: center;
|
|
961
962
|
gap: 10px;
|
|
962
|
-
padding:
|
|
963
|
+
padding: 8px;
|
|
963
964
|
border: 1px solid #dee2ed;
|
|
964
965
|
border-radius: 3px;
|
|
965
966
|
position: relative;
|
|
966
967
|
|
|
967
968
|
.border-preview {
|
|
968
969
|
position: relative;
|
|
969
|
-
width:
|
|
970
|
-
|
|
970
|
+
width: 100%;
|
|
971
|
+
max-width: 24px;
|
|
972
|
+
height: 24px;
|
|
971
973
|
border: 2px solid #1d2a3b;
|
|
972
974
|
border-radius: 3px;
|
|
973
975
|
|
|
@@ -981,17 +983,99 @@ wac-block {
|
|
|
981
983
|
|
|
982
984
|
.mask1 {
|
|
983
985
|
width: 30px;
|
|
984
|
-
height:
|
|
986
|
+
height: 5px;
|
|
985
987
|
}
|
|
986
988
|
|
|
987
989
|
.mask2 {
|
|
988
|
-
width:
|
|
990
|
+
width: 5px;
|
|
989
991
|
height: 30px;
|
|
990
992
|
}
|
|
993
|
+
|
|
991
994
|
}
|
|
992
|
-
|
|
995
|
+
|
|
996
|
+
.bp-range {
|
|
997
|
+
width: 100%;
|
|
998
|
+
max-width: 202px;
|
|
999
|
+
height: 4px;
|
|
1000
|
+
background: transparent;
|
|
1001
|
+
-webkit-appearance: none;
|
|
1002
|
+
appearance: none;
|
|
1003
|
+
margin: 0;
|
|
1004
|
+
cursor: pointer;
|
|
1005
|
+
|
|
1006
|
+
&::-webkit-slider-runnable-track {
|
|
1007
|
+
height: 4px;
|
|
1008
|
+
background: #dee2ed;
|
|
1009
|
+
border-radius: 20px;
|
|
1010
|
+
}
|
|
1011
|
+
|
|
1012
|
+
&::-moz-range-track {
|
|
1013
|
+
height: 4px;
|
|
1014
|
+
background: #dee2ed;
|
|
1015
|
+
border-radius: 20px;
|
|
1016
|
+
}
|
|
1017
|
+
|
|
1018
|
+
&::-ms-track {
|
|
1019
|
+
height: 4px;
|
|
1020
|
+
background: #dee2ed;
|
|
1021
|
+
border-radius: 20px;
|
|
1022
|
+
border-color: transparent;
|
|
1023
|
+
color: transparent;
|
|
1024
|
+
}
|
|
1025
|
+
|
|
1026
|
+
// Thumb style
|
|
1027
|
+
&::-webkit-slider-thumb {
|
|
1028
|
+
-webkit-appearance: none;
|
|
1029
|
+
width: 16px;
|
|
1030
|
+
height: 16px;
|
|
1031
|
+
border-radius: 50%;
|
|
1032
|
+
background: #3BA6EC;
|
|
1033
|
+
margin-top: -6px; // Centrer verticalement (height of track - height of thumb) / 2
|
|
1034
|
+
border: 2px solid white;
|
|
1035
|
+
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
|
|
1036
|
+
transition: all 0.2s ease;
|
|
1037
|
+
}
|
|
1038
|
+
|
|
1039
|
+
&::-moz-range-thumb {
|
|
1040
|
+
width: 16px;
|
|
1041
|
+
height: 16px;
|
|
1042
|
+
border-radius: 50%;
|
|
1043
|
+
background: #3BA6EC;
|
|
1044
|
+
border: 2px solid white;
|
|
1045
|
+
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
|
|
1046
|
+
transition: all 0.2s ease;
|
|
1047
|
+
}
|
|
1048
|
+
|
|
1049
|
+
&::-ms-thumb {
|
|
1050
|
+
width: 16px;
|
|
1051
|
+
height: 16px;
|
|
1052
|
+
border-radius: 50%;
|
|
1053
|
+
background: #3BA6EC;
|
|
1054
|
+
border: 2px solid white;
|
|
1055
|
+
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
|
|
1056
|
+
transition: all 0.2s ease;
|
|
1057
|
+
}
|
|
1058
|
+
|
|
1059
|
+
// Active/hover state
|
|
1060
|
+
&:active::-webkit-slider-thumb,
|
|
1061
|
+
&:hover::-webkit-slider-thumb {
|
|
1062
|
+
transform: scale(1.1);
|
|
1063
|
+
}
|
|
1064
|
+
|
|
1065
|
+
&:active::-moz-range-thumb,
|
|
1066
|
+
&:hover::-moz-range-thumb {
|
|
1067
|
+
transform: scale(1.1);
|
|
1068
|
+
}
|
|
1069
|
+
|
|
1070
|
+
// Fill color before thumb (optional)
|
|
1071
|
+
&::-webkit-slider-runnable-track {
|
|
1072
|
+
background: linear-gradient(to right, #3BA6EC 0%, #3BA6EC var(--slider-percentage, 0%), #dee2ed var(--slider-percentage, 0%), #dee2ed 100%);
|
|
1073
|
+
}
|
|
1074
|
+
}
|
|
1075
|
+
|
|
993
1076
|
.bp-input {
|
|
994
|
-
width:
|
|
1077
|
+
width: 100%;
|
|
1078
|
+
max-width: 45px;
|
|
995
1079
|
height: 100%;
|
|
996
1080
|
border: none;
|
|
997
1081
|
font-size: 14px;
|
|
@@ -999,101 +1083,6 @@ wac-block {
|
|
|
999
1083
|
font-weight: 400;
|
|
1000
1084
|
}
|
|
1001
1085
|
|
|
1002
|
-
.slider-popup {
|
|
1003
|
-
display: flex;
|
|
1004
|
-
flex-direction: column;
|
|
1005
|
-
gap: 10px;
|
|
1006
|
-
position: absolute;
|
|
1007
|
-
top: 50px;
|
|
1008
|
-
left: 0;
|
|
1009
|
-
min-width: 270px;
|
|
1010
|
-
background: white;
|
|
1011
|
-
border: 1px solid #dee2ed;
|
|
1012
|
-
padding: 10px;
|
|
1013
|
-
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
1014
|
-
z-index: 10;
|
|
1015
|
-
display: flex;
|
|
1016
|
-
align-items: center;
|
|
1017
|
-
gap: 10px;
|
|
1018
|
-
|
|
1019
|
-
&::before {
|
|
1020
|
-
content: '';
|
|
1021
|
-
position: absolute;
|
|
1022
|
-
top: -20px;
|
|
1023
|
-
left: 8px;
|
|
1024
|
-
border: 10px solid transparent;
|
|
1025
|
-
border-bottom-color: #dee2ed;
|
|
1026
|
-
}
|
|
1027
|
-
|
|
1028
|
-
.slider {
|
|
1029
|
-
width: 100%;
|
|
1030
|
-
display: flex;
|
|
1031
|
-
align-items: center;
|
|
1032
|
-
gap: 10px;
|
|
1033
|
-
|
|
1034
|
-
input[type="range"] {
|
|
1035
|
-
-webkit-appearance: none;
|
|
1036
|
-
width: 100%;
|
|
1037
|
-
height: 8px;
|
|
1038
|
-
background: #dee2ed;
|
|
1039
|
-
border-radius: 5px;
|
|
1040
|
-
outline: none;
|
|
1041
|
-
opacity: 0.7;
|
|
1042
|
-
transition: opacity .2s;
|
|
1043
|
-
|
|
1044
|
-
&:hover {
|
|
1045
|
-
opacity: 1;
|
|
1046
|
-
}
|
|
1047
|
-
|
|
1048
|
-
&::-webkit-slider-thumb {
|
|
1049
|
-
-webkit-appearance: none;
|
|
1050
|
-
appearance: none;
|
|
1051
|
-
width: 20px;
|
|
1052
|
-
height: 20px;
|
|
1053
|
-
background: #52aecd;
|
|
1054
|
-
cursor: pointer;
|
|
1055
|
-
border-radius: 50%;
|
|
1056
|
-
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
|
|
1057
|
-
}
|
|
1058
|
-
|
|
1059
|
-
&::-moz-range-thumb {
|
|
1060
|
-
width: 20px;
|
|
1061
|
-
height: 20px;
|
|
1062
|
-
background: #52aecd;
|
|
1063
|
-
cursor: pointer;
|
|
1064
|
-
border-radius: 50%;
|
|
1065
|
-
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
|
|
1066
|
-
}
|
|
1067
|
-
}
|
|
1068
|
-
}
|
|
1069
|
-
|
|
1070
|
-
.preset-buttons {
|
|
1071
|
-
display: flex;
|
|
1072
|
-
gap: 10px;
|
|
1073
|
-
align-items: center;
|
|
1074
|
-
|
|
1075
|
-
button {
|
|
1076
|
-
border: 1px solid #dee2ed;
|
|
1077
|
-
background-color: #f5f5f5;
|
|
1078
|
-
color: #1d2a3b;
|
|
1079
|
-
font-size: 14px;
|
|
1080
|
-
border-radius: 12px;
|
|
1081
|
-
padding: 5px 15px;
|
|
1082
|
-
cursor: pointer;
|
|
1083
|
-
transition: background-color 0.3s, box-shadow 0.3s;
|
|
1084
|
-
|
|
1085
|
-
&:hover {
|
|
1086
|
-
background-color: #e0e0e0;
|
|
1087
|
-
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
|
1088
|
-
}
|
|
1089
|
-
|
|
1090
|
-
&:active {
|
|
1091
|
-
background-color: #d0d0d0;
|
|
1092
|
-
box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.2);
|
|
1093
|
-
}
|
|
1094
|
-
}
|
|
1095
|
-
}
|
|
1096
|
-
}
|
|
1097
1086
|
}
|
|
1098
1087
|
}.wac-breadcrumbs {
|
|
1099
1088
|
width: 100%;
|
|
@@ -7232,8 +7221,8 @@ wac-optional-disable-container {
|
|
|
7232
7221
|
&__panel {
|
|
7233
7222
|
position: fixed;
|
|
7234
7223
|
top: 0;
|
|
7235
|
-
right: -
|
|
7236
|
-
width:
|
|
7224
|
+
right: -100%;
|
|
7225
|
+
width: 25%;
|
|
7237
7226
|
height: 100%;
|
|
7238
7227
|
background-color: #fff;
|
|
7239
7228
|
box-shadow: -2px 0 10px rgba(0, 0, 0, 0.2);
|
|
@@ -7241,6 +7230,16 @@ wac-optional-disable-container {
|
|
|
7241
7230
|
transition: right 0.3s ease;
|
|
7242
7231
|
display: flex;
|
|
7243
7232
|
flex-direction: column;
|
|
7233
|
+
|
|
7234
|
+
@include media('<1440px') {
|
|
7235
|
+
width: 40%;
|
|
7236
|
+
}
|
|
7237
|
+
@include media('<desktop') {
|
|
7238
|
+
width: 50%;
|
|
7239
|
+
}
|
|
7240
|
+
@include media('<tablet') {
|
|
7241
|
+
width: 85%;
|
|
7242
|
+
}
|
|
7244
7243
|
|
|
7245
7244
|
&.is-open {
|
|
7246
7245
|
right: 0;
|
|
@@ -7277,6 +7276,15 @@ wac-optional-disable-container {
|
|
|
7277
7276
|
flex: 1;
|
|
7278
7277
|
overflow-y: auto;
|
|
7279
7278
|
}
|
|
7279
|
+
|
|
7280
|
+
&__footer {
|
|
7281
|
+
display: flex;
|
|
7282
|
+
justify-content: space-between;
|
|
7283
|
+
align-items: center;
|
|
7284
|
+
padding: 30px;
|
|
7285
|
+
gap: 15px;
|
|
7286
|
+
background-color: #F5F8FA;
|
|
7287
|
+
}
|
|
7280
7288
|
}
|
|
7281
7289
|
}
|
|
7282
7290
|
|
|
@@ -8973,14 +8981,21 @@ h1.wac-h1 {
|
|
|
8973
8981
|
line-height: rem(35);
|
|
8974
8982
|
font-weight: 600;
|
|
8975
8983
|
color: $wac-main-text;
|
|
8984
|
+
|
|
8976
8985
|
@include media('<desktop') {
|
|
8977
8986
|
font-size: rem(22);
|
|
8978
8987
|
line-height: rem(30);
|
|
8979
8988
|
}
|
|
8989
|
+
|
|
8990
|
+
&.no-margin {
|
|
8991
|
+
margin: 0 !important;
|
|
8992
|
+
}
|
|
8993
|
+
|
|
8980
8994
|
&.with-img {
|
|
8981
8995
|
display: flex;
|
|
8982
8996
|
align-items: center;
|
|
8983
8997
|
}
|
|
8998
|
+
|
|
8984
8999
|
&.center {
|
|
8985
9000
|
text-align: center;
|
|
8986
9001
|
}
|
|
@@ -8998,11 +9013,20 @@ h2.wac-h2 {
|
|
|
8998
9013
|
line-height: rem(21);
|
|
8999
9014
|
font-weight: 500;
|
|
9000
9015
|
color: $wac-main-text;
|
|
9016
|
+
|
|
9017
|
+
&.no-margin {
|
|
9018
|
+
margin: 0 !important;
|
|
9019
|
+
}
|
|
9001
9020
|
}h3.wac-h3 {
|
|
9002
9021
|
font-size: rem(16);
|
|
9003
9022
|
line-height: rem(19);
|
|
9004
9023
|
font-weight: 500;
|
|
9005
9024
|
color: $wac-main-text;
|
|
9025
|
+
|
|
9026
|
+
&.no-margin {
|
|
9027
|
+
margin: 0 !important;
|
|
9028
|
+
}
|
|
9029
|
+
|
|
9006
9030
|
&.grey {
|
|
9007
9031
|
color: $wac-second-color;
|
|
9008
9032
|
}
|
|
@@ -9012,6 +9036,9 @@ h4.wac-h4 {
|
|
|
9012
9036
|
line-height: rem(16);
|
|
9013
9037
|
font-weight: 500;
|
|
9014
9038
|
color: $wac-main-text;
|
|
9039
|
+
&.no-margin {
|
|
9040
|
+
margin: 0 !important;
|
|
9041
|
+
}
|
|
9015
9042
|
&.grey {
|
|
9016
9043
|
color: $wac-second-color;
|
|
9017
9044
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CommonModule } from "@angular/common";
|
|
2
|
-
import { Component, EventEmitter, Input, Output,
|
|
2
|
+
import { Component, EventEmitter, Input, Output, forwardRef } from "@angular/core";
|
|
3
3
|
import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
5
|
import * as i1 from "@angular/common";
|
|
@@ -8,19 +8,22 @@ export class BorderPickerComponent {
|
|
|
8
8
|
constructor() {
|
|
9
9
|
this.gap = '12px';
|
|
10
10
|
this.fontSize = '14px';
|
|
11
|
-
this.borderRadius = '0px';
|
|
12
|
-
this.firstBtnOption = 'Small';
|
|
13
|
-
this.secondBtnOption = 'Medium';
|
|
14
|
-
this.thirdBtnOption = 'Full';
|
|
15
11
|
this.disabled = false;
|
|
16
|
-
this.value = '';
|
|
12
|
+
this.value = '0%';
|
|
17
13
|
this.blurred = new EventEmitter();
|
|
18
14
|
this.borderRadiusChange = new EventEmitter();
|
|
19
|
-
this.showSlider = false;
|
|
20
15
|
this.sliderValue = 0;
|
|
21
16
|
this.onChange = () => { };
|
|
22
17
|
this.onTouched = () => { };
|
|
23
18
|
}
|
|
19
|
+
ngOnInit() {
|
|
20
|
+
if (this.value) {
|
|
21
|
+
const numericValue = parseInt(this.value.replace('%', ''), 10);
|
|
22
|
+
if (!isNaN(numericValue)) {
|
|
23
|
+
this.sliderValue = numericValue;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}
|
|
24
27
|
writeValue(value) {
|
|
25
28
|
if (value !== undefined) {
|
|
26
29
|
this.value = value;
|
|
@@ -34,39 +37,49 @@ export class BorderPickerComponent {
|
|
|
34
37
|
}
|
|
35
38
|
setValue(event) {
|
|
36
39
|
this.value = event.target.value;
|
|
40
|
+
const numericValue = parseInt(this.value.replace('%', ''), 10);
|
|
41
|
+
if (!isNaN(numericValue)) {
|
|
42
|
+
this.sliderValue = numericValue;
|
|
43
|
+
this.updateSliderPercentage();
|
|
44
|
+
}
|
|
37
45
|
this.onChange(this.value);
|
|
38
46
|
this.borderRadiusChange.emit(this.value);
|
|
39
47
|
}
|
|
40
|
-
|
|
48
|
+
updateSliderPercentage() {
|
|
49
|
+
const slider = document.querySelector('.bp-range');
|
|
50
|
+
if (slider) {
|
|
51
|
+
slider.style.setProperty('--slider-percentage', `${this.sliderValue}%`);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
ngAfterViewInit() {
|
|
55
|
+
this.updateSliderPercentage();
|
|
41
56
|
}
|
|
42
|
-
|
|
43
|
-
this.
|
|
44
|
-
|
|
57
|
+
onFocusOut() {
|
|
58
|
+
if (!this.value.endsWith('%') && this.value) {
|
|
59
|
+
this.value = this.value + '%';
|
|
60
|
+
this.onChange(this.value);
|
|
61
|
+
this.borderRadiusChange.emit(this.value);
|
|
62
|
+
}
|
|
45
63
|
}
|
|
46
64
|
updateBorderRadius(value) {
|
|
47
|
-
this.value = value + '
|
|
48
|
-
this.
|
|
65
|
+
this.value = value + '%';
|
|
66
|
+
this.updateSliderPercentage();
|
|
67
|
+
this.onChange(this.value);
|
|
49
68
|
this.borderRadiusChange.emit(this.value);
|
|
50
69
|
}
|
|
51
70
|
setBorderRadius(value) {
|
|
52
71
|
this.sliderValue = value;
|
|
53
72
|
this.updateBorderRadius(value);
|
|
54
73
|
}
|
|
55
|
-
onClickOutside(event) {
|
|
56
|
-
const target = event.target;
|
|
57
|
-
if (!target.closest('.w-input')) {
|
|
58
|
-
this.showSlider = false;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
74
|
}
|
|
62
75
|
BorderPickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: BorderPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
63
|
-
BorderPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: BorderPickerComponent, isStandalone: true, selector: "wac-border-picker", inputs: { label: "label", gap: "gap", fontSize: "fontSize",
|
|
76
|
+
BorderPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: BorderPickerComponent, isStandalone: true, selector: "wac-border-picker", inputs: { label: "label", gap: "gap", fontSize: "fontSize", disabled: "disabled", value: "value" }, outputs: { blurred: "blurred", borderRadiusChange: "borderRadiusChange" }, providers: [
|
|
64
77
|
{
|
|
65
78
|
provide: NG_VALUE_ACCESSOR,
|
|
66
79
|
useExisting: forwardRef(() => BorderPickerComponent),
|
|
67
80
|
multi: true
|
|
68
81
|
}
|
|
69
|
-
], ngImport: i0, template: "<div class=\"w-border-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"bp-label\" for=\"borderPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div class=\"border-preview\" [ngStyle]=\"{'border-radius': value}\">\r\n <div class=\"mask1\"></div>\r\n <div class=\"mask2\"></div>\r\n </div>\r\n\r\n <input\r\n class=\"bp-
|
|
82
|
+
], ngImport: i0, template: "<div class=\"w-border-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"bp-label\" for=\"borderPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div class=\"border-preview\" [ngStyle]=\"{'border-radius': value}\">\r\n <div class=\"mask1\"></div>\r\n <div class=\"mask2\"></div>\r\n </div>\r\n\r\n <input\r\n class=\"bp-range\"\r\n type=\"range\"\r\n min=\"0\"\r\n max=\"100\"\r\n [(ngModel)]=\"sliderValue\"\r\n (ngModelChange)=\"updateBorderRadius($event)\"\r\n />\r\n\r\n <input\r\n class=\"bp-input\"\r\n id=\"borderPicker\"\r\n [placeholder]=\"sliderValue\"\r\n maxlength=\"5\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChange($event)\"\r\n (focusout)=\"onFocusOut()\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-border-picker{display:flex;flex-direction:column}.w-border-picker .bp-label{font-weight:500}.w-border-picker .w-input{width:100%;min-width:305px;height:40px;display:flex;align-items:center;gap:10px;padding:8px;border:1px solid #dee2ed;border-radius:3px;position:relative}.w-border-picker .w-input .border-preview{position:relative;width:100%;max-width:24px;height:24px;border:2px solid #1d2a3b;border-radius:3px}.w-border-picker .w-input .border-preview .mask1,.w-border-picker .w-input .border-preview .mask2{background:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.w-border-picker .w-input .border-preview .mask1{width:30px;height:5px}.w-border-picker .w-input .border-preview .mask2{width:5px;height:30px}.w-border-picker .w-input .bp-range{width:100%;max-width:202px;height:4px;background:transparent;-webkit-appearance:none;appearance:none;margin:0;cursor:pointer}.w-border-picker .w-input .bp-range::-webkit-slider-runnable-track{height:4px;background:#dee2ed;border-radius:20px}.w-border-picker .w-input .bp-range::-moz-range-track{height:4px;background:#dee2ed;border-radius:20px}.w-border-picker .w-input .bp-range::-ms-track{height:4px;background:#dee2ed;border-radius:20px;border-color:transparent;color:transparent}.w-border-picker .w-input .bp-range::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#3BA6EC;margin-top:-6px;border:2px solid white;box-shadow:0 1px 3px #0003;-webkit-transition:all .2s ease;transition:all .2s ease}.w-border-picker .w-input .bp-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#3BA6EC;border:2px solid white;box-shadow:0 1px 3px #0003;-moz-transition:all .2s ease;transition:all .2s ease}.w-border-picker .w-input .bp-range::-ms-thumb{width:16px;height:16px;border-radius:50%;background:#3BA6EC;border:2px solid white;box-shadow:0 1px 3px #0003;-ms-transition:all .2s ease;transition:all .2s ease}.w-border-picker .w-input .bp-range:active::-webkit-slider-thumb,.w-border-picker .w-input .bp-range:hover::-webkit-slider-thumb{transform:scale(1.1)}.w-border-picker .w-input .bp-range:active::-moz-range-thumb,.w-border-picker .w-input .bp-range:hover::-moz-range-thumb{transform:scale(1.1)}.w-border-picker .w-input .bp-range::-webkit-slider-runnable-track{background:linear-gradient(to right,#3BA6EC 0%,#3BA6EC var(--slider-percentage, 0%),#dee2ed var(--slider-percentage, 0%),#dee2ed 100%)}.w-border-picker .w-input .bp-input{width:100%;max-width:45px;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
70
83
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: BorderPickerComponent, decorators: [{
|
|
71
84
|
type: Component,
|
|
72
85
|
args: [{ selector: "wac-border-picker", standalone: true, imports: [
|
|
@@ -78,21 +91,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImpor
|
|
|
78
91
|
useExisting: forwardRef(() => BorderPickerComponent),
|
|
79
92
|
multi: true
|
|
80
93
|
}
|
|
81
|
-
], template: "<div class=\"w-border-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"bp-label\" for=\"borderPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div class=\"border-preview\" [ngStyle]=\"{'border-radius': value}\">\r\n <div class=\"mask1\"></div>\r\n <div class=\"mask2\"></div>\r\n </div>\r\n\r\n <input\r\n class=\"bp-
|
|
94
|
+
], template: "<div class=\"w-border-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"bp-label\" for=\"borderPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div class=\"border-preview\" [ngStyle]=\"{'border-radius': value}\">\r\n <div class=\"mask1\"></div>\r\n <div class=\"mask2\"></div>\r\n </div>\r\n\r\n <input\r\n class=\"bp-range\"\r\n type=\"range\"\r\n min=\"0\"\r\n max=\"100\"\r\n [(ngModel)]=\"sliderValue\"\r\n (ngModelChange)=\"updateBorderRadius($event)\"\r\n />\r\n\r\n <input\r\n class=\"bp-input\"\r\n id=\"borderPicker\"\r\n [placeholder]=\"sliderValue\"\r\n maxlength=\"5\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChange($event)\"\r\n (focusout)=\"onFocusOut()\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-border-picker{display:flex;flex-direction:column}.w-border-picker .bp-label{font-weight:500}.w-border-picker .w-input{width:100%;min-width:305px;height:40px;display:flex;align-items:center;gap:10px;padding:8px;border:1px solid #dee2ed;border-radius:3px;position:relative}.w-border-picker .w-input .border-preview{position:relative;width:100%;max-width:24px;height:24px;border:2px solid #1d2a3b;border-radius:3px}.w-border-picker .w-input .border-preview .mask1,.w-border-picker .w-input .border-preview .mask2{background:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.w-border-picker .w-input .border-preview .mask1{width:30px;height:5px}.w-border-picker .w-input .border-preview .mask2{width:5px;height:30px}.w-border-picker .w-input .bp-range{width:100%;max-width:202px;height:4px;background:transparent;-webkit-appearance:none;appearance:none;margin:0;cursor:pointer}.w-border-picker .w-input .bp-range::-webkit-slider-runnable-track{height:4px;background:#dee2ed;border-radius:20px}.w-border-picker .w-input .bp-range::-moz-range-track{height:4px;background:#dee2ed;border-radius:20px}.w-border-picker .w-input .bp-range::-ms-track{height:4px;background:#dee2ed;border-radius:20px;border-color:transparent;color:transparent}.w-border-picker .w-input .bp-range::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#3BA6EC;margin-top:-6px;border:2px solid white;box-shadow:0 1px 3px #0003;-webkit-transition:all .2s ease;transition:all .2s ease}.w-border-picker .w-input .bp-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#3BA6EC;border:2px solid white;box-shadow:0 1px 3px #0003;-moz-transition:all .2s ease;transition:all .2s ease}.w-border-picker .w-input .bp-range::-ms-thumb{width:16px;height:16px;border-radius:50%;background:#3BA6EC;border:2px solid white;box-shadow:0 1px 3px #0003;-ms-transition:all .2s ease;transition:all .2s ease}.w-border-picker .w-input .bp-range:active::-webkit-slider-thumb,.w-border-picker .w-input .bp-range:hover::-webkit-slider-thumb{transform:scale(1.1)}.w-border-picker .w-input .bp-range:active::-moz-range-thumb,.w-border-picker .w-input .bp-range:hover::-moz-range-thumb{transform:scale(1.1)}.w-border-picker .w-input .bp-range::-webkit-slider-runnable-track{background:linear-gradient(to right,#3BA6EC 0%,#3BA6EC var(--slider-percentage, 0%),#dee2ed var(--slider-percentage, 0%),#dee2ed 100%)}.w-border-picker .w-input .bp-input{width:100%;max-width:45px;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"] }]
|
|
82
95
|
}], ctorParameters: function () { return []; }, propDecorators: { label: [{
|
|
83
96
|
type: Input
|
|
84
97
|
}], gap: [{
|
|
85
98
|
type: Input
|
|
86
99
|
}], fontSize: [{
|
|
87
100
|
type: Input
|
|
88
|
-
}], borderRadius: [{
|
|
89
|
-
type: Input
|
|
90
|
-
}], firstBtnOption: [{
|
|
91
|
-
type: Input
|
|
92
|
-
}], secondBtnOption: [{
|
|
93
|
-
type: Input
|
|
94
|
-
}], thirdBtnOption: [{
|
|
95
|
-
type: Input
|
|
96
101
|
}], disabled: [{
|
|
97
102
|
type: Input
|
|
98
103
|
}], value: [{
|
|
@@ -101,8 +106,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImpor
|
|
|
101
106
|
type: Output
|
|
102
107
|
}], borderRadiusChange: [{
|
|
103
108
|
type: Output
|
|
104
|
-
}], onClickOutside: [{
|
|
105
|
-
type: HostListener,
|
|
106
|
-
args: ['document:click', ['$event']]
|
|
107
109
|
}] } });
|
|
108
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
110
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm9yZGVyLXBpY2tlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL2JvcmRlci1waWNrZXIvYm9yZGVyLXBpY2tlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL2JvcmRlci1waWNrZXIvYm9yZGVyLXBpY2tlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBaUQsVUFBVSxFQUFnQixNQUFNLGVBQWUsQ0FBQztBQUMvSSxPQUFPLEVBQXdCLFdBQVcsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7O0FBb0J0RixNQUFNLE9BQU8scUJBQXFCO0lBV2hDO1FBVFMsUUFBRyxHQUFXLE1BQU0sQ0FBQztRQUNyQixhQUFRLEdBQVcsTUFBTSxDQUFDO1FBQzFCLGFBQVEsR0FBWSxLQUFLLENBQUM7UUFDMUIsVUFBSyxHQUFXLElBQUksQ0FBQztRQUVwQixZQUFPLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUNuQyx1QkFBa0IsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBQzFELGdCQUFXLEdBQVcsQ0FBQyxDQUFDO1FBSXhCLGFBQVEsR0FBUSxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDekIsY0FBUyxHQUFRLEdBQUcsRUFBRSxHQUFFLENBQUMsQ0FBQztJQUhYLENBQUM7SUFLaEIsUUFBUTtRQUNOLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNkLE1BQU0sWUFBWSxHQUFHLFFBQVEs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O1lBQ3BELEtBQUssRUFBRSxJQUFJO1NBQ1o7S0FDRiwwQkNuQkgsNDVCQWtDQSxza0ZEeEJJLFlBQVksbUhBQ1osV0FBVzsyRkFXRixxQkFBcUI7a0JBbEJqQyxTQUFTOytCQUNFLG1CQUFtQixjQUdqQixJQUFJLFdBQ1A7d0JBQ1AsWUFBWTt3QkFDWixXQUFXO3FCQUNaLGFBQ1U7d0JBQ1Q7NEJBQ0UsT0FBTyxFQUFFLGlCQUFpQjs0QkFDMUIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsc0JBQXNCLENBQUM7NEJBQ3BELEtBQUssRUFBRSxJQUFJO3lCQUNaO3FCQUNGOzBFQUlRLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxHQUFHO3NCQUFYLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFFSSxPQUFPO3NCQUFoQixNQUFNO2dCQUNHLGtCQUFrQjtzQkFBM0IsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb21tb25cIjtcclxuaW1wb3J0IHtDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCwgT25Jbml0ICwgSG9zdExpc3RlbmVyLCBDVVNUT01fRUxFTUVOVFNfU0NIRU1BLCBmb3J3YXJkUmVmLCBBZnRlclZpZXdJbml0fSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5pbXBvcnQgeyBDb250cm9sVmFsdWVBY2Nlc3NvciwgRm9ybXNNb2R1bGUsIE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xyXG5cclxuQENvbXBvbmVudCAoe1xyXG4gIHNlbGVjdG9yOiBcIndhYy1ib3JkZXItcGlja2VyXCIsXHJcbiAgdGVtcGxhdGVVcmw6IFwiLi9ib3JkZXItcGlja2VyLmNvbXBvbmVudC5odG1sXCIsXHJcbiAgc3R5bGVVcmxzOiBbXCIuL2JvcmRlci1waWNrZXIuY29tcG9uZW50LnNjc3NcIl0sXHJcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcclxuICBpbXBvcnRzOiBbXHJcbiAgICBDb21tb25Nb2R1bGUsXHJcbiAgICBGb3Jtc01vZHVsZSxcclxuICBdLFxyXG4gIHByb3ZpZGVyczogW1xyXG4gICAge1xyXG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcclxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gQm9yZGVyUGlja2VyQ29tcG9uZW50KSxcclxuICAgICAgbXVsdGk6IHRydWVcclxuICAgIH1cclxuICBdXHJcbn0pXHJcblxyXG5leHBvcnQgY2xhc3MgQm9yZGVyUGlja2VyQ29tcG9uZW50IGltcGxlbWVudHMgQ29udHJvbFZhbHVlQWNjZXNzb3IsIE9uSW5pdCwgQWZ0ZXJWaWV3SW5pdCB7XHJcbiAgQElucHV0KCkgbGFiZWw6IHN0cmluZztcclxuICBASW5wdXQoKSBnYXA6IHN0cmluZyA9ICcxMnB4JztcclxuICBASW5wdXQoKSBmb250U2l6ZTogc3RyaW5nID0gJzE0cHgnO1xyXG4gIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCkgdmFsdWU6IHN0cmluZyA9ICcwJSc7XHJcblxyXG4gIEBPdXRwdXQoKSBibHVycmVkID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xyXG4gIEBPdXRwdXQoKSBib3JkZXJSYWRpdXNDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcclxuICBzbGlkZXJWYWx1ZTogbnVtYmVyID0gMDtcclxuXHJcbiAgY29uc3RydWN0b3IoKSB7fVxyXG5cclxuICBvbkNoYW5nZTogYW55ID0gKCkgPT4ge307XHJcbiAgb25Ub3VjaGVkOiBhbnkgPSAoKSA9PiB7fTtcclxuXHJcbiAgbmdPbkluaXQoKSB7XHJcbiAgICBpZiAodGhpcy52YWx1ZSkge1xyXG4gICAgICBjb25zdCBudW1lcmljVmFsdWUgPSBwYXJzZUludCh0aGlzLnZhbHVlLnJlcGxhY2UoJyUnLCAnJyksIDEwKTtcclxuICAgICAgaWYgKCFpc05hTihudW1lcmljVmFsdWUpKSB7XHJcbiAgICAgICAgdGhpcy5zbGlkZXJWYWx1ZSA9IG51bWVyaWNWYWx1ZTtcclxuICAgICAgfVxyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgd3JpdGVWYWx1ZSh2YWx1ZTogc3RyaW5nKTogdm9pZCB7XHJcbiAgICBpZiAodmFsdWUgIT09IHVuZGVmaW5lZCkge1xyXG4gICAgICB0aGlzLnZhbHVlID0gdmFsdWU7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiBhbnkpOiB2b2lkIHtcclxuICAgIHRoaXMub25DaGFuZ2UgPSBmbjtcclxuICB9XHJcblxyXG4gIHJlZ2lzdGVyT25Ub3VjaGVkKGZuOiBhbnkpOiB2b2lkIHtcclxuICAgIHRoaXMub25Ub3VjaGVkID0gZm47XHJcbiAgfVxyXG5cclxuICBzZXRWYWx1ZShldmVudDogYW55KSB7XHJcbiAgICB0aGlzLnZhbHVlID0gZXZlbnQudGFyZ2V0LnZhbHVlO1xyXG4gICAgY29uc3QgbnVtZXJpY1ZhbHVlID0gcGFyc2VJbnQodGhpcy52YWx1ZS5yZXBsYWNlKCclJywgJycpLCAxMCk7XHJcbiAgICBcclxuICAgIGlmICghaXNOYU4obnVtZXJpY1ZhbHVlKSkge1xyXG4gICAgICB0aGlzLnNsaWRlclZhbHVlID0gbnVtZXJpY1ZhbHVlO1xyXG4gICAgICB0aGlzLnVwZGF0ZVNsaWRlclBlcmNlbnRhZ2UoKTtcclxuICAgIH1cclxuICAgIFxyXG4gICAgdGhpcy5vbkNoYW5nZSh0aGlzLnZhbHVlKTtcclxuICAgIHRoaXMuYm9yZGVyUmFkaXVzQ2hhbmdlLmVtaXQodGhpcy52YWx1ZSk7XHJcbiAgfVxyXG5cclxuICBwcml2YXRlIHVwZGF0ZVNsaWRlclBlcmNlbnRhZ2UoKSB7XHJcbiAgICBjb25zdCBzbGlkZXIgPSBkb2N1bWVudC5xdWVyeVNlbGVjdG9yKCcuYnAtcmFuZ2UnKSBhcyBIVE1MRWxlbWVudDtcclxuICAgIGlmIChzbGlkZXIpIHtcclxuICAgICAgc2xpZGVyLnN0eWxlLnNldFByb3BlcnR5KCctLXNsaWRlci1wZXJjZW50YWdlJywgYCR7dGhpcy5zbGlkZXJWYWx1ZX0lYCk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBuZ0FmdGVyVmlld0luaXQoKSB7XHJcbiAgICB0aGlzLnVwZGF0ZVNsaWRlclBlcmNlbnRhZ2UoKTtcclxuICB9XHJcblxyXG4gIG9uRm9jdXNPdXQoKSB7XHJcbiAgICBpZiAoIXRoaXMudmFsdWUuZW5kc1dpdGgoJyUnKSAmJiB0aGlzLnZhbHVlKSB7XHJcbiAgICAgIHRoaXMudmFsdWUgPSB0aGlzLnZhbHVlICsgJyUnO1xyXG4gICAgICB0aGlzLm9uQ2hhbmdlKHRoaXMudmFsdWUpO1xyXG4gICAgICB0aGlzLmJvcmRlclJhZGl1c0NoYW5nZS5lbWl0KHRoaXMudmFsdWUpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgdXBkYXRlQm9yZGVyUmFkaXVzKHZhbHVlOiBudW1iZXIpIHtcclxuICAgIHRoaXMudmFsdWUgPSB2YWx1ZSArICclJztcclxuICAgIHRoaXMudXBkYXRlU2xpZGVyUGVyY2VudGFnZSgpO1xyXG4gICAgdGhpcy5vbkNoYW5nZSh0aGlzLnZhbHVlKTtcclxuICAgIHRoaXMuYm9yZGVyUmFkaXVzQ2hhbmdlLmVtaXQodGhpcy52YWx1ZSk7XHJcbiAgfVxyXG5cclxuICBzZXRCb3JkZXJSYWRpdXModmFsdWU6IG51bWJlcikge1xyXG4gICAgdGhpcy5zbGlkZXJWYWx1ZSA9IHZhbHVlO1xyXG4gICAgdGhpcy51cGRhdGVCb3JkZXJSYWRpdXModmFsdWUpO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwidy1ib3JkZXItcGlja2VyXCIgW25nU3R5bGVdPVwieydnYXAnOiBnYXB9XCI+XHJcblxyXG4gIDxsYWJlbCBjbGFzcz1cImJwLWxhYmVsXCIgZm9yPVwiYm9yZGVyUGlja2VyXCIgW25nU3R5bGVdPVwieydmb250LXNpemUnOiBmb250U2l6ZX1cIj57eyBsYWJlbCB9fTwvbGFiZWw+XHJcblxyXG4gIDxkaXYgY2xhc3M9XCJ3LWlucHV0XCI+XHJcblxyXG4gICAgPGRpdiBjbGFzcz1cImJvcmRlci1wcmV2aWV3XCIgW25nU3R5bGVdPVwieydib3JkZXItcmFkaXVzJzogdmFsdWV9XCI+XHJcbiAgICAgIDxkaXYgY2xhc3M9XCJtYXNrMVwiPjwvZGl2PlxyXG4gICAgICA8ZGl2IGNsYXNzPVwibWFzazJcIj48L2Rpdj5cclxuICAgIDwvZGl2PlxyXG5cclxuICAgIDxpbnB1dFxyXG4gICAgICBjbGFzcz1cImJwLXJhbmdlXCJcclxuICAgICAgdHlwZT1cInJhbmdlXCJcclxuICAgICAgbWluPVwiMFwiXHJcbiAgICAgIG1heD1cIjEwMFwiXHJcbiAgICAgIFsobmdNb2RlbCldPVwic2xpZGVyVmFsdWVcIlxyXG4gICAgICAobmdNb2RlbENoYW5nZSk9XCJ1cGRhdGVCb3JkZXJSYWRpdXMoJGV2ZW50KVwiXHJcbiAgICAvPlxyXG5cclxuICAgIDxpbnB1dFxyXG4gICAgICBjbGFzcz1cImJwLWlucHV0XCJcclxuICAgICAgaWQ9XCJib3JkZXJQaWNrZXJcIlxyXG4gICAgICBbcGxhY2Vob2xkZXJdPVwic2xpZGVyVmFsdWVcIlxyXG4gICAgICBtYXhsZW5ndGg9XCI1XCJcclxuICAgICAgWyhuZ01vZGVsKV09XCJ2YWx1ZVwiXHJcbiAgICAgIChuZ01vZGVsQ2hhbmdlKT1cIm9uQ2hhbmdlKCRldmVudClcIlxyXG4gICAgICAoZm9jdXNvdXQpPVwib25Gb2N1c091dCgpXCJcclxuICAgICAgKGlucHV0KT1cInNldFZhbHVlKCRldmVudClcIlxyXG4gICAgLz5cclxuXHJcbiAgPC9kaXY+XHJcblxyXG48L2Rpdj5cclxuIl19
|
|
@@ -24,7 +24,7 @@ export class HeaderPageComponent {
|
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
HeaderPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: HeaderPageComponent, deps: [{ token: i1.HistoryService }, { token: i2.Location }], target: i0.ɵɵFactoryTarget.Component });
|
|
27
|
-
HeaderPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: HeaderPageComponent, selector: "wac-header-page", inputs: { title: "title", linkBack: "linkBack", withImg: "withImg", center: "center", useHistory: "useHistory" }, ngImport: i0, template: "<div class=\"wac-header-page\">\r\n <div class=\"wac-header-page__maxWidth\">\r\n <div class=\"wac-header-page__maxWidth__top\" [ngClass]=\"{'center':center}\">\r\n <div class=\"wac-header-page__maxWidth__top__left\" [ngClass]=\"{'fullsize':center}\">\r\n <div class=\"wac-header-page__maxWidth__top__left__nowrap\">\r\n <a *ngIf=\"linkBack || useHistory\" (click)=\"back()\"><i class=\"fas fa-chevron-left\"></i></a>\r\n <wac-h1 [center]=\"center\" [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\r\n </div>\r\n <p class=\"subtitle\"><ng-content select=\"[role=subtitle]\"></ng-content></p>\r\n </div>\r\n <div class=\"wac-header-page__maxWidth__top__right\" *ngIf=\"!center\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.H1Component, selector: "wac-h1", inputs: ["annotation", "withImg", "center", "color"] }] });
|
|
27
|
+
HeaderPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: HeaderPageComponent, selector: "wac-header-page", inputs: { title: "title", linkBack: "linkBack", withImg: "withImg", center: "center", useHistory: "useHistory" }, ngImport: i0, template: "<div class=\"wac-header-page\">\r\n <div class=\"wac-header-page__maxWidth\">\r\n <div class=\"wac-header-page__maxWidth__top\" [ngClass]=\"{'center':center}\">\r\n <div class=\"wac-header-page__maxWidth__top__left\" [ngClass]=\"{'fullsize':center}\">\r\n <div class=\"wac-header-page__maxWidth__top__left__nowrap\">\r\n <a *ngIf=\"linkBack || useHistory\" (click)=\"back()\"><i class=\"fas fa-chevron-left\"></i></a>\r\n <wac-h1 [center]=\"center\" [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\r\n </div>\r\n <p class=\"subtitle\"><ng-content select=\"[role=subtitle]\"></ng-content></p>\r\n </div>\r\n <div class=\"wac-header-page__maxWidth__top__right\" *ngIf=\"!center\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.H1Component, selector: "wac-h1", inputs: ["annotation", "withImg", "center", "color", "noMargin"] }] });
|
|
28
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: HeaderPageComponent, decorators: [{
|
|
29
29
|
type: Component,
|
|
30
30
|
args: [{ selector: 'wac-header-page', template: "<div class=\"wac-header-page\">\r\n <div class=\"wac-header-page__maxWidth\">\r\n <div class=\"wac-header-page__maxWidth__top\" [ngClass]=\"{'center':center}\">\r\n <div class=\"wac-header-page__maxWidth__top__left\" [ngClass]=\"{'fullsize':center}\">\r\n <div class=\"wac-header-page__maxWidth__top__left__nowrap\">\r\n <a *ngIf=\"linkBack || useHistory\" (click)=\"back()\"><i class=\"fas fa-chevron-left\"></i></a>\r\n <wac-h1 [center]=\"center\" [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\r\n </div>\r\n <p class=\"subtitle\"><ng-content select=\"[role=subtitle]\"></ng-content></p>\r\n </div>\r\n <div class=\"wac-header-page__maxWidth__top__right\" *ngIf=\"!center\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
|