@lukso/web-components 1.116.1 → 1.116.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.
- package/dist/components/lukso-icon/icons/progress-indicator-alt.d.ts.map +1 -1
- package/dist/components/lukso-icon/icons/progress-indicator.d.ts.map +1 -1
- package/dist/components/lukso-icon/index.cjs +15 -13
- package/dist/components/lukso-icon/index.js +15 -13
- package/dist/components/lukso-select/index.cjs +68 -68
- package/dist/components/lukso-select/index.js +68 -68
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"progress-indicator-alt.d.ts","sourceRoot":"","sources":["../../../../../../src/components/lukso-icon/icons/progress-indicator-alt.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAEnE,eAAO,MAAM,oBAAoB,YAAa,WAAW,
|
|
1
|
+
{"version":3,"file":"progress-indicator-alt.d.ts","sourceRoot":"","sources":["../../../../../../src/components/lukso-icon/icons/progress-indicator-alt.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAEnE,eAAO,MAAM,oBAAoB,YAAa,WAAW,yCAkJxD,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"progress-indicator.d.ts","sourceRoot":"","sources":["../../../../../../src/components/lukso-icon/icons/progress-indicator.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAEnE,eAAO,MAAM,iBAAiB,YAAa,WAAW,
|
|
1
|
+
{"version":3,"file":"progress-indicator.d.ts","sourceRoot":"","sources":["../../../../../../src/components/lukso-icon/icons/progress-indicator.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAEnE,eAAO,MAAM,iBAAiB,YAAa,WAAW,yCAuOrD,CAAA"}
|
|
@@ -3937,6 +3937,7 @@ const lyxLogo = (options) => {
|
|
|
3937
3937
|
};
|
|
3938
3938
|
|
|
3939
3939
|
const progressIndicator = (options) => {
|
|
3940
|
+
const uniqueId = Math.random().toString(36).substring(7);
|
|
3940
3941
|
return shared_tailwindElement_index.x`<svg
|
|
3941
3942
|
width="40"
|
|
3942
3943
|
height="40"
|
|
@@ -3961,7 +3962,7 @@ const progressIndicator = (options) => {
|
|
|
3961
3962
|
</g>
|
|
3962
3963
|
<defs>
|
|
3963
3964
|
<filter
|
|
3964
|
-
id="
|
|
3965
|
+
id="${uniqueId}_filter0_ddd_1744_19360"
|
|
3965
3966
|
x="-42"
|
|
3966
3967
|
y="-42"
|
|
3967
3968
|
width="124"
|
|
@@ -4106,17 +4107,17 @@ const progressIndicator = (options) => {
|
|
|
4106
4107
|
})}
|
|
4107
4108
|
class="absolute animate-spin"
|
|
4108
4109
|
>
|
|
4109
|
-
<g clip-path="url(
|
|
4110
|
-
<g filter="url(
|
|
4110
|
+
<g clip-path="url(#${uniqueId}_clip0_1744_19359)">
|
|
4111
|
+
<g filter="url(#${uniqueId}_filter0_i_1744_19359)">
|
|
4111
4112
|
<path
|
|
4112
4113
|
d="M37.5 20C38.8807 20 40.0161 21.1236 39.844 22.4935C39.5295 24.9957 38.7437 27.4237 37.5201 29.646C35.8933 32.6008 33.5456 35.0962 30.6954 36.8999C27.8452 38.7037 24.5851 39.7574 21.2184 39.9629C17.8516 40.1683 14.4876 39.519 11.4392 38.0752C8.39078 36.6314 5.75706 34.4401 3.78299 31.7051C1.80892 28.97 0.558635 25.7802 0.148441 22.4322C-0.261752 19.0842 0.181468 15.6869 1.43687 12.5562C2.38109 10.2015 3.76167 8.05527 5.49841 6.22669C6.44925 5.22556 8.0379 5.39214 8.91267 6.46039V6.46039C9.78744 7.52863 9.61127 9.09217 8.70295 10.132C7.59699 11.3982 6.70777 12.8458 6.07766 14.4171C5.1361 16.7652 4.80369 19.3132 5.11133 21.8242C5.41898 24.3351 6.35669 26.7275 7.83724 28.7788C9.31779 30.8301 11.2931 32.4735 13.5794 33.5564C15.8657 34.6392 18.3887 35.1263 20.9138 34.9721C23.4388 34.818 25.8839 34.0278 28.0216 32.675C30.1592 31.3221 31.92 29.4506 33.1401 27.2345C33.9566 25.7515 34.5132 24.1463 34.7921 22.4885C35.0212 21.1269 36.1193 20 37.5 20V20Z"
|
|
4113
|
-
fill="url(
|
|
4114
|
+
fill="url(#${uniqueId}_paint0_linear_1744_19359)"
|
|
4114
4115
|
/>
|
|
4115
4116
|
</g>
|
|
4116
4117
|
</g>
|
|
4117
4118
|
<defs>
|
|
4118
4119
|
<filter
|
|
4119
|
-
id="
|
|
4120
|
+
id="${uniqueId}_filter0_i_1744_19359"
|
|
4120
4121
|
x="0"
|
|
4121
4122
|
y="5.5603"
|
|
4122
4123
|
width="40.8613"
|
|
@@ -4151,7 +4152,7 @@ const progressIndicator = (options) => {
|
|
|
4151
4152
|
/>
|
|
4152
4153
|
</filter>
|
|
4153
4154
|
<linearGradient
|
|
4154
|
-
id="
|
|
4155
|
+
id="${uniqueId}_paint0_linear_1744_19359"
|
|
4155
4156
|
x1="31"
|
|
4156
4157
|
y1="24"
|
|
4157
4158
|
x2="-22"
|
|
@@ -4161,7 +4162,7 @@ const progressIndicator = (options) => {
|
|
|
4161
4162
|
<stop stop-color="#F8DAD3" />
|
|
4162
4163
|
<stop offset="1" stop-color="#CC99AE" />
|
|
4163
4164
|
</linearGradient>
|
|
4164
|
-
<clipPath id="
|
|
4165
|
+
<clipPath id="${uniqueId}_clip0_1744_19359">
|
|
4165
4166
|
<rect width="40" height="40" fill="white" />
|
|
4166
4167
|
</clipPath>
|
|
4167
4168
|
</defs>
|
|
@@ -4564,6 +4565,7 @@ const switched = (options) => {
|
|
|
4564
4565
|
};
|
|
4565
4566
|
|
|
4566
4567
|
const progressIndicatorAlt = (options) => {
|
|
4568
|
+
const uniqueId = Math.random().toString(36).substring(7);
|
|
4567
4569
|
return shared_tailwindElement_index.x`<svg
|
|
4568
4570
|
width="64"
|
|
4569
4571
|
height="64"
|
|
@@ -4648,17 +4650,17 @@ const progressIndicatorAlt = (options) => {
|
|
|
4648
4650
|
})}
|
|
4649
4651
|
class="absolute animate-spin"
|
|
4650
4652
|
>
|
|
4651
|
-
<g clip-path="url(
|
|
4652
|
-
<g filter="url(
|
|
4653
|
+
<g clip-path="url(#${uniqueId}_clip0_2235_25110)">
|
|
4654
|
+
<g filter="url(#${uniqueId}_filter0_i_2235_25110)">
|
|
4653
4655
|
<path
|
|
4654
4656
|
d="M61.6 32C62.9255 32 64.0094 33.0761 63.91 34.3978C63.5671 38.9614 62.2484 43.4083 60.0322 47.4336C57.4293 52.1613 53.673 56.1538 49.1127 59.0399C44.5523 61.926 39.3362 63.6118 33.9494 63.9406C28.5626 64.2693 23.1801 63.2304 18.3027 60.9203C13.4253 58.6102 9.21129 55.1041 6.05278 50.7281C2.89427 46.3521 0.893816 41.2483 0.237506 35.8915C-0.418804 30.5348 0.290348 25.099 2.299 20.0899C4.00925 15.8249 6.61426 11.9873 9.92785 8.83061C10.8876 7.91635 12.4068 8.0732 13.2466 9.09871V9.09871C14.0863 10.1242 13.9272 11.6292 12.9797 12.5561C10.2862 15.1908 8.163 18.3631 6.75415 21.8764C5.0468 26.1342 4.44402 30.7545 5.00188 35.3078C5.55974 39.8611 7.26013 44.1993 9.94486 47.9189C12.6296 51.6385 16.2115 54.6187 20.3573 56.5823C24.5031 58.5458 29.0782 59.4289 33.657 59.1495C38.2358 58.87 42.6695 57.4371 46.5458 54.9839C50.422 52.5308 53.6149 49.1371 55.8273 45.1186C57.653 41.8027 58.7622 38.1502 59.0942 34.3969C59.211 33.0766 60.2745 32 61.6 32V32Z"
|
|
4655
|
-
fill="url(
|
|
4657
|
+
fill="url(#${uniqueId}_paint0_linear_2235_25110)"
|
|
4656
4658
|
/>
|
|
4657
4659
|
</g>
|
|
4658
4660
|
</g>
|
|
4659
4661
|
<defs>
|
|
4660
4662
|
<filter
|
|
4661
|
-
id="
|
|
4663
|
+
id="${uniqueId}_filter0_i_2235_25110"
|
|
4662
4664
|
x="0"
|
|
4663
4665
|
y="8.22852"
|
|
4664
4666
|
width="64.9164"
|
|
@@ -4693,7 +4695,7 @@ const progressIndicatorAlt = (options) => {
|
|
|
4693
4695
|
/>
|
|
4694
4696
|
</filter>
|
|
4695
4697
|
<linearGradient
|
|
4696
|
-
id="
|
|
4698
|
+
id="${uniqueId}_paint0_linear_2235_25110"
|
|
4697
4699
|
x1="49.6"
|
|
4698
4700
|
y1="38.4"
|
|
4699
4701
|
x2="-35.2"
|
|
@@ -4703,7 +4705,7 @@ const progressIndicatorAlt = (options) => {
|
|
|
4703
4705
|
<stop stop-color="#F8DAD3" />
|
|
4704
4706
|
<stop offset="1" stop-color="#CC99AE" />
|
|
4705
4707
|
</linearGradient>
|
|
4706
|
-
<clipPath id="
|
|
4708
|
+
<clipPath id="${uniqueId}_clip0_2235_25110">
|
|
4707
4709
|
<rect width="64" height="64" fill="white" />
|
|
4708
4710
|
</clipPath>
|
|
4709
4711
|
</defs>
|
|
@@ -3933,6 +3933,7 @@ const lyxLogo = (options) => {
|
|
|
3933
3933
|
};
|
|
3934
3934
|
|
|
3935
3935
|
const progressIndicator = (options) => {
|
|
3936
|
+
const uniqueId = Math.random().toString(36).substring(7);
|
|
3936
3937
|
return x`<svg
|
|
3937
3938
|
width="40"
|
|
3938
3939
|
height="40"
|
|
@@ -3957,7 +3958,7 @@ const progressIndicator = (options) => {
|
|
|
3957
3958
|
</g>
|
|
3958
3959
|
<defs>
|
|
3959
3960
|
<filter
|
|
3960
|
-
id="
|
|
3961
|
+
id="${uniqueId}_filter0_ddd_1744_19360"
|
|
3961
3962
|
x="-42"
|
|
3962
3963
|
y="-42"
|
|
3963
3964
|
width="124"
|
|
@@ -4102,17 +4103,17 @@ const progressIndicator = (options) => {
|
|
|
4102
4103
|
})}
|
|
4103
4104
|
class="absolute animate-spin"
|
|
4104
4105
|
>
|
|
4105
|
-
<g clip-path="url(
|
|
4106
|
-
<g filter="url(
|
|
4106
|
+
<g clip-path="url(#${uniqueId}_clip0_1744_19359)">
|
|
4107
|
+
<g filter="url(#${uniqueId}_filter0_i_1744_19359)">
|
|
4107
4108
|
<path
|
|
4108
4109
|
d="M37.5 20C38.8807 20 40.0161 21.1236 39.844 22.4935C39.5295 24.9957 38.7437 27.4237 37.5201 29.646C35.8933 32.6008 33.5456 35.0962 30.6954 36.8999C27.8452 38.7037 24.5851 39.7574 21.2184 39.9629C17.8516 40.1683 14.4876 39.519 11.4392 38.0752C8.39078 36.6314 5.75706 34.4401 3.78299 31.7051C1.80892 28.97 0.558635 25.7802 0.148441 22.4322C-0.261752 19.0842 0.181468 15.6869 1.43687 12.5562C2.38109 10.2015 3.76167 8.05527 5.49841 6.22669C6.44925 5.22556 8.0379 5.39214 8.91267 6.46039V6.46039C9.78744 7.52863 9.61127 9.09217 8.70295 10.132C7.59699 11.3982 6.70777 12.8458 6.07766 14.4171C5.1361 16.7652 4.80369 19.3132 5.11133 21.8242C5.41898 24.3351 6.35669 26.7275 7.83724 28.7788C9.31779 30.8301 11.2931 32.4735 13.5794 33.5564C15.8657 34.6392 18.3887 35.1263 20.9138 34.9721C23.4388 34.818 25.8839 34.0278 28.0216 32.675C30.1592 31.3221 31.92 29.4506 33.1401 27.2345C33.9566 25.7515 34.5132 24.1463 34.7921 22.4885C35.0212 21.1269 36.1193 20 37.5 20V20Z"
|
|
4109
|
-
fill="url(
|
|
4110
|
+
fill="url(#${uniqueId}_paint0_linear_1744_19359)"
|
|
4110
4111
|
/>
|
|
4111
4112
|
</g>
|
|
4112
4113
|
</g>
|
|
4113
4114
|
<defs>
|
|
4114
4115
|
<filter
|
|
4115
|
-
id="
|
|
4116
|
+
id="${uniqueId}_filter0_i_1744_19359"
|
|
4116
4117
|
x="0"
|
|
4117
4118
|
y="5.5603"
|
|
4118
4119
|
width="40.8613"
|
|
@@ -4147,7 +4148,7 @@ const progressIndicator = (options) => {
|
|
|
4147
4148
|
/>
|
|
4148
4149
|
</filter>
|
|
4149
4150
|
<linearGradient
|
|
4150
|
-
id="
|
|
4151
|
+
id="${uniqueId}_paint0_linear_1744_19359"
|
|
4151
4152
|
x1="31"
|
|
4152
4153
|
y1="24"
|
|
4153
4154
|
x2="-22"
|
|
@@ -4157,7 +4158,7 @@ const progressIndicator = (options) => {
|
|
|
4157
4158
|
<stop stop-color="#F8DAD3" />
|
|
4158
4159
|
<stop offset="1" stop-color="#CC99AE" />
|
|
4159
4160
|
</linearGradient>
|
|
4160
|
-
<clipPath id="
|
|
4161
|
+
<clipPath id="${uniqueId}_clip0_1744_19359">
|
|
4161
4162
|
<rect width="40" height="40" fill="white" />
|
|
4162
4163
|
</clipPath>
|
|
4163
4164
|
</defs>
|
|
@@ -4560,6 +4561,7 @@ const switched = (options) => {
|
|
|
4560
4561
|
};
|
|
4561
4562
|
|
|
4562
4563
|
const progressIndicatorAlt = (options) => {
|
|
4564
|
+
const uniqueId = Math.random().toString(36).substring(7);
|
|
4563
4565
|
return x`<svg
|
|
4564
4566
|
width="64"
|
|
4565
4567
|
height="64"
|
|
@@ -4644,17 +4646,17 @@ const progressIndicatorAlt = (options) => {
|
|
|
4644
4646
|
})}
|
|
4645
4647
|
class="absolute animate-spin"
|
|
4646
4648
|
>
|
|
4647
|
-
<g clip-path="url(
|
|
4648
|
-
<g filter="url(
|
|
4649
|
+
<g clip-path="url(#${uniqueId}_clip0_2235_25110)">
|
|
4650
|
+
<g filter="url(#${uniqueId}_filter0_i_2235_25110)">
|
|
4649
4651
|
<path
|
|
4650
4652
|
d="M61.6 32C62.9255 32 64.0094 33.0761 63.91 34.3978C63.5671 38.9614 62.2484 43.4083 60.0322 47.4336C57.4293 52.1613 53.673 56.1538 49.1127 59.0399C44.5523 61.926 39.3362 63.6118 33.9494 63.9406C28.5626 64.2693 23.1801 63.2304 18.3027 60.9203C13.4253 58.6102 9.21129 55.1041 6.05278 50.7281C2.89427 46.3521 0.893816 41.2483 0.237506 35.8915C-0.418804 30.5348 0.290348 25.099 2.299 20.0899C4.00925 15.8249 6.61426 11.9873 9.92785 8.83061C10.8876 7.91635 12.4068 8.0732 13.2466 9.09871V9.09871C14.0863 10.1242 13.9272 11.6292 12.9797 12.5561C10.2862 15.1908 8.163 18.3631 6.75415 21.8764C5.0468 26.1342 4.44402 30.7545 5.00188 35.3078C5.55974 39.8611 7.26013 44.1993 9.94486 47.9189C12.6296 51.6385 16.2115 54.6187 20.3573 56.5823C24.5031 58.5458 29.0782 59.4289 33.657 59.1495C38.2358 58.87 42.6695 57.4371 46.5458 54.9839C50.422 52.5308 53.6149 49.1371 55.8273 45.1186C57.653 41.8027 58.7622 38.1502 59.0942 34.3969C59.211 33.0766 60.2745 32 61.6 32V32Z"
|
|
4651
|
-
fill="url(
|
|
4653
|
+
fill="url(#${uniqueId}_paint0_linear_2235_25110)"
|
|
4652
4654
|
/>
|
|
4653
4655
|
</g>
|
|
4654
4656
|
</g>
|
|
4655
4657
|
<defs>
|
|
4656
4658
|
<filter
|
|
4657
|
-
id="
|
|
4659
|
+
id="${uniqueId}_filter0_i_2235_25110"
|
|
4658
4660
|
x="0"
|
|
4659
4661
|
y="8.22852"
|
|
4660
4662
|
width="64.9164"
|
|
@@ -4689,7 +4691,7 @@ const progressIndicatorAlt = (options) => {
|
|
|
4689
4691
|
/>
|
|
4690
4692
|
</filter>
|
|
4691
4693
|
<linearGradient
|
|
4692
|
-
id="
|
|
4694
|
+
id="${uniqueId}_paint0_linear_2235_25110"
|
|
4693
4695
|
x1="49.6"
|
|
4694
4696
|
y1="38.4"
|
|
4695
4697
|
x2="-35.2"
|
|
@@ -4699,7 +4701,7 @@ const progressIndicatorAlt = (options) => {
|
|
|
4699
4701
|
<stop stop-color="#F8DAD3" />
|
|
4700
4702
|
<stop offset="1" stop-color="#CC99AE" />
|
|
4701
4703
|
</linearGradient>
|
|
4702
|
-
<clipPath id="
|
|
4704
|
+
<clipPath id="${uniqueId}_clip0_2235_25110">
|
|
4703
4705
|
<rect width="64" height="64" fill="white" />
|
|
4704
4706
|
</clipPath>
|
|
4705
4707
|
</defs>
|
|
@@ -32,84 +32,84 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
32
32
|
return result;
|
|
33
33
|
};
|
|
34
34
|
exports.LuksoSelect = class LuksoSelect extends shared_tailwindElement_index.TailwindStyledElement(style) {
|
|
35
|
-
value = "";
|
|
36
|
-
placeholder = "";
|
|
37
|
-
label = "";
|
|
38
|
-
id = "";
|
|
39
|
-
description = "";
|
|
40
|
-
error = "";
|
|
41
|
-
isFullWidth = false;
|
|
42
|
-
isReadonly = false;
|
|
43
|
-
isDisabled = false;
|
|
44
|
-
borderless = false;
|
|
45
|
-
options = "";
|
|
46
|
-
selected = void 0;
|
|
47
|
-
isOpen = false;
|
|
48
|
-
openTop = false;
|
|
49
|
-
isLargeIcon = false;
|
|
50
|
-
isRight = false;
|
|
51
|
-
size = "medium";
|
|
52
|
-
showSelectionCounter = false;
|
|
53
|
-
optionsParsed = [];
|
|
54
|
-
valueParsed = void 0;
|
|
55
35
|
constructor() {
|
|
56
36
|
super();
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
37
|
+
this.value = "";
|
|
38
|
+
this.placeholder = "";
|
|
39
|
+
this.label = "";
|
|
40
|
+
this.id = "";
|
|
41
|
+
this.description = "";
|
|
42
|
+
this.error = "";
|
|
43
|
+
this.isFullWidth = false;
|
|
44
|
+
this.isReadonly = false;
|
|
45
|
+
this.isDisabled = false;
|
|
46
|
+
this.borderless = false;
|
|
47
|
+
this.options = "";
|
|
48
|
+
this.selected = void 0;
|
|
49
|
+
this.isOpen = false;
|
|
50
|
+
this.openTop = false;
|
|
51
|
+
this.isLargeIcon = false;
|
|
52
|
+
this.isRight = false;
|
|
53
|
+
this.size = "medium";
|
|
54
|
+
this.showSelectionCounter = false;
|
|
55
|
+
this.optionsParsed = [];
|
|
56
|
+
this.valueParsed = void 0;
|
|
57
|
+
this.inputStyles = index.ce({
|
|
58
|
+
base: `bg-neutral-100
|
|
63
59
|
border border-solid placeholder:text-neutral-70 select-none whitespace-nowrap
|
|
64
60
|
outline-none transition transition-all duration-150 appearance-none
|
|
65
61
|
text-neutral-20 cursor-pointer border-neutral-90 group-hover:border-neutral-35
|
|
66
62
|
flex items-center`,
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
63
|
+
variants: {
|
|
64
|
+
isFullWidth: {
|
|
65
|
+
true: "w-full"
|
|
66
|
+
},
|
|
67
|
+
isDisabled: {
|
|
68
|
+
true: "cursor-not-allowed text-neutral-60 group-hover:border-neutral-90"
|
|
69
|
+
},
|
|
70
|
+
hasError: {
|
|
71
|
+
true: "border-red-85 group-hover:border-red-65"
|
|
72
|
+
},
|
|
73
|
+
borderless: {
|
|
74
|
+
true: "border-0"
|
|
75
|
+
},
|
|
76
|
+
size: {
|
|
77
|
+
small: "h-[28px] px-3 py-2 pr-8 paragraph-inter-12-regular rounded-8",
|
|
78
|
+
medium: "h-[48px] px-4 py-3 pr-11 paragraph-inter-14-regular rounded-12"
|
|
79
|
+
}
|
|
83
80
|
}
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
81
|
+
});
|
|
82
|
+
this.counterStyles = index.ce({
|
|
83
|
+
base: "border border-neutral-20",
|
|
84
|
+
variants: {
|
|
85
|
+
isDisabled: {
|
|
86
|
+
true: "opacity-60 cursor-not-allowed"
|
|
87
|
+
},
|
|
88
|
+
size: {
|
|
89
|
+
small: "paragraph-inter-10-semi-bold rounded-4 py-[1px] px-[5px] ml-1.5",
|
|
90
|
+
medium: "paragraph-inter-14-semi-bold rounded-8 py-[2px] px-[10px] ml-3"
|
|
91
|
+
}
|
|
95
92
|
}
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
93
|
+
});
|
|
94
|
+
this.iconStyles = index.ce({
|
|
95
|
+
base: "absolute right-0 transition cursor-pointer",
|
|
96
|
+
variants: {
|
|
97
|
+
isDisabled: {
|
|
98
|
+
true: "opacity-60 cursor-not-allowed"
|
|
99
|
+
},
|
|
100
|
+
isOpen: {
|
|
101
|
+
true: "rotate-180"
|
|
102
|
+
},
|
|
103
|
+
size: {
|
|
104
|
+
small: "mr-2",
|
|
105
|
+
medium: "mr-3"
|
|
106
|
+
}
|
|
110
107
|
}
|
|
108
|
+
});
|
|
109
|
+
if (!this.id) {
|
|
110
|
+
this.id = components_luksoDropdown_index.uniqId();
|
|
111
111
|
}
|
|
112
|
-
}
|
|
112
|
+
}
|
|
113
113
|
connectedCallback() {
|
|
114
114
|
super.connectedCallback();
|
|
115
115
|
window.addEventListener("click", this.handleOutsideDropdownClick.bind(this));
|
|
@@ -28,84 +28,84 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
28
28
|
return result;
|
|
29
29
|
};
|
|
30
30
|
let LuksoSelect = class extends TailwindStyledElement(style) {
|
|
31
|
-
value = "";
|
|
32
|
-
placeholder = "";
|
|
33
|
-
label = "";
|
|
34
|
-
id = "";
|
|
35
|
-
description = "";
|
|
36
|
-
error = "";
|
|
37
|
-
isFullWidth = false;
|
|
38
|
-
isReadonly = false;
|
|
39
|
-
isDisabled = false;
|
|
40
|
-
borderless = false;
|
|
41
|
-
options = "";
|
|
42
|
-
selected = void 0;
|
|
43
|
-
isOpen = false;
|
|
44
|
-
openTop = false;
|
|
45
|
-
isLargeIcon = false;
|
|
46
|
-
isRight = false;
|
|
47
|
-
size = "medium";
|
|
48
|
-
showSelectionCounter = false;
|
|
49
|
-
optionsParsed = [];
|
|
50
|
-
valueParsed = void 0;
|
|
51
31
|
constructor() {
|
|
52
32
|
super();
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
33
|
+
this.value = "";
|
|
34
|
+
this.placeholder = "";
|
|
35
|
+
this.label = "";
|
|
36
|
+
this.id = "";
|
|
37
|
+
this.description = "";
|
|
38
|
+
this.error = "";
|
|
39
|
+
this.isFullWidth = false;
|
|
40
|
+
this.isReadonly = false;
|
|
41
|
+
this.isDisabled = false;
|
|
42
|
+
this.borderless = false;
|
|
43
|
+
this.options = "";
|
|
44
|
+
this.selected = void 0;
|
|
45
|
+
this.isOpen = false;
|
|
46
|
+
this.openTop = false;
|
|
47
|
+
this.isLargeIcon = false;
|
|
48
|
+
this.isRight = false;
|
|
49
|
+
this.size = "medium";
|
|
50
|
+
this.showSelectionCounter = false;
|
|
51
|
+
this.optionsParsed = [];
|
|
52
|
+
this.valueParsed = void 0;
|
|
53
|
+
this.inputStyles = ce({
|
|
54
|
+
base: `bg-neutral-100
|
|
59
55
|
border border-solid placeholder:text-neutral-70 select-none whitespace-nowrap
|
|
60
56
|
outline-none transition transition-all duration-150 appearance-none
|
|
61
57
|
text-neutral-20 cursor-pointer border-neutral-90 group-hover:border-neutral-35
|
|
62
58
|
flex items-center`,
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
59
|
+
variants: {
|
|
60
|
+
isFullWidth: {
|
|
61
|
+
true: "w-full"
|
|
62
|
+
},
|
|
63
|
+
isDisabled: {
|
|
64
|
+
true: "cursor-not-allowed text-neutral-60 group-hover:border-neutral-90"
|
|
65
|
+
},
|
|
66
|
+
hasError: {
|
|
67
|
+
true: "border-red-85 group-hover:border-red-65"
|
|
68
|
+
},
|
|
69
|
+
borderless: {
|
|
70
|
+
true: "border-0"
|
|
71
|
+
},
|
|
72
|
+
size: {
|
|
73
|
+
small: "h-[28px] px-3 py-2 pr-8 paragraph-inter-12-regular rounded-8",
|
|
74
|
+
medium: "h-[48px] px-4 py-3 pr-11 paragraph-inter-14-regular rounded-12"
|
|
75
|
+
}
|
|
79
76
|
}
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
77
|
+
});
|
|
78
|
+
this.counterStyles = ce({
|
|
79
|
+
base: "border border-neutral-20",
|
|
80
|
+
variants: {
|
|
81
|
+
isDisabled: {
|
|
82
|
+
true: "opacity-60 cursor-not-allowed"
|
|
83
|
+
},
|
|
84
|
+
size: {
|
|
85
|
+
small: "paragraph-inter-10-semi-bold rounded-4 py-[1px] px-[5px] ml-1.5",
|
|
86
|
+
medium: "paragraph-inter-14-semi-bold rounded-8 py-[2px] px-[10px] ml-3"
|
|
87
|
+
}
|
|
91
88
|
}
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
89
|
+
});
|
|
90
|
+
this.iconStyles = ce({
|
|
91
|
+
base: "absolute right-0 transition cursor-pointer",
|
|
92
|
+
variants: {
|
|
93
|
+
isDisabled: {
|
|
94
|
+
true: "opacity-60 cursor-not-allowed"
|
|
95
|
+
},
|
|
96
|
+
isOpen: {
|
|
97
|
+
true: "rotate-180"
|
|
98
|
+
},
|
|
99
|
+
size: {
|
|
100
|
+
small: "mr-2",
|
|
101
|
+
medium: "mr-3"
|
|
102
|
+
}
|
|
106
103
|
}
|
|
104
|
+
});
|
|
105
|
+
if (!this.id) {
|
|
106
|
+
this.id = uniqId();
|
|
107
107
|
}
|
|
108
|
-
}
|
|
108
|
+
}
|
|
109
109
|
connectedCallback() {
|
|
110
110
|
super.connectedCallback();
|
|
111
111
|
window.addEventListener("click", this.handleOutsideDropdownClick.bind(this));
|