@trendyol/baklava 2.4.0-beta.9 → 3.0.0-beta.1
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/assets/badge.svg +5 -0
- package/dist/assets/express.svg +3 -0
- package/dist/assets/express_delivery.svg +6 -0
- package/dist/assets/express_furniture.svg +6 -0
- package/dist/assets/medal.svg +2 -10
- package/dist/assets/translation.svg +3 -0
- package/dist/baklava.js +1 -1
- package/dist/chunk-7QGSFS64.js +16 -0
- package/dist/chunk-7QGSFS64.js.map +7 -0
- package/dist/chunk-BEGAFK2I.js +18 -0
- package/dist/chunk-BEGAFK2I.js.map +7 -0
- package/dist/{chunk-5EFPA3CA.js → chunk-ILQVF4MN.js} +5 -5
- package/dist/chunk-ILQVF4MN.js.map +7 -0
- package/dist/chunk-LDGSM7XL.js +106 -0
- package/dist/chunk-LDGSM7XL.js.map +7 -0
- package/dist/{chunk-FSFO7DCO.js → chunk-TOJWQXBJ.js} +2 -2
- package/dist/{chunk-FSFO7DCO.js.map → chunk-TOJWQXBJ.js.map} +2 -2
- package/dist/chunk-V5OMCBVZ.js +23 -0
- package/dist/chunk-V5OMCBVZ.js.map +7 -0
- package/dist/components/dropdown/bl-dropdown.d.ts.map +1 -1
- package/dist/components/dropdown/bl-dropdown.js +1 -1
- package/dist/components/dropdown/group/bl-dropdown-group.js +1 -1
- package/dist/components/dropdown/item/bl-dropdown-item.js +1 -1
- package/dist/components/icon/icon-list.d.ts +1 -1
- package/dist/components/icon/icon-list.d.ts.map +1 -1
- package/dist/components/icon/icon-list.js +1 -1
- package/dist/components/icon/icon-list.js.map +2 -2
- package/dist/components/pagination/bl-pagination.js +1 -1
- package/dist/components/select/bl-select.d.ts.map +1 -1
- package/dist/components/select/bl-select.js +1 -1
- package/dist/components/select/option/bl-select-option.d.ts +4 -0
- package/dist/components/select/option/bl-select-option.d.ts.map +1 -1
- package/dist/components/select/option/bl-select-option.js +1 -1
- package/dist/components/switch/bl-switch.d.ts.map +1 -1
- package/dist/components/switch/bl-switch.js +1 -1
- package/dist/components/tab-group/bl-tab-group.js +1 -1
- package/dist/custom-elements.json +9 -1
- package/package.json +2 -2
- package/dist/chunk-5EFPA3CA.js.map +0 -7
- package/dist/chunk-AMAOGVPQ.js +0 -106
- package/dist/chunk-AMAOGVPQ.js.map +0 -7
- package/dist/chunk-BNACGMP2.js +0 -16
- package/dist/chunk-BNACGMP2.js.map +0 -7
- package/dist/chunk-HJWQ7Y3K.js +0 -5
- package/dist/chunk-HJWQ7Y3K.js.map +0 -7
- package/dist/chunk-JPRCBAHY.js +0 -23
- package/dist/chunk-JPRCBAHY.js.map +0 -7
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.3939 8.62446C21.6958 9.06447 22.0018 9.51071 22.0018 10.0009C22.0018 10.491 21.6959 10.937 21.3942 11.3768C21.1677 11.707 20.9435 12.0338 20.8529 12.3731C20.7574 12.73 20.788 13.1395 20.8184 13.5472C20.8578 14.0741 20.897 14.5982 20.6632 15.0022C20.4248 15.414 19.9449 15.6439 19.4664 15.8731C19.1003 16.0484 18.735 16.2234 18.4792 16.4792C18.2234 16.735 18.0484 17.1003 17.8731 17.4664C17.6439 17.9449 17.414 18.4248 17.0022 18.6632C16.598 18.8974 16.0737 18.8582 15.5464 18.8187C15.1391 18.7883 14.73 18.7577 14.3731 18.8529C14.0341 18.9435 13.7075 19.1675 13.3774 19.3939C12.9374 19.6958 12.4911 20.0018 12.0009 20.0018C11.5108 20.0018 11.0649 19.6959 10.625 19.3942C10.2948 19.1677 9.96807 18.9435 9.62871 18.8529C9.27182 18.7574 8.86238 18.788 8.45467 18.8184C7.9277 18.8578 7.40362 18.8969 6.99967 18.6632C6.5878 18.4248 6.35797 17.9449 6.12878 17.4664C5.95344 17.1003 5.77848 16.735 5.52268 16.4792C5.26687 16.2234 4.90157 16.0484 4.53547 15.8731C4.05695 15.6439 3.57708 15.414 3.33863 15.0022C3.10445 14.598 3.14366 14.0737 3.18309 13.5464C3.21356 13.1391 3.24416 12.73 3.14889 12.3731C3.05835 12.0341 2.83432 11.7075 2.60789 11.3774C2.30608 10.9374 2 10.4911 2 10.0009C2 9.51083 2.30593 9.06486 2.60767 8.62501C2.83418 8.29482 3.05832 7.96807 3.14889 7.62871C3.24446 7.27183 3.21387 6.86249 3.18341 6.45486C3.14404 5.92797 3.10488 5.40393 3.33863 4.99967C3.57708 4.5878 4.05695 4.35797 4.53547 4.12878C4.90157 3.95344 5.26687 3.77848 5.52268 3.52268C5.77848 3.26687 5.95344 2.90157 6.12878 2.53547C6.35797 2.05695 6.5878 1.57708 6.99967 1.33863C7.40387 1.10445 7.92816 1.14366 8.45539 1.18309C8.86275 1.21356 9.27187 1.24416 9.62871 1.14889C9.96774 1.05835 10.2943 0.834324 10.6245 0.607889C11.0645 0.306084 11.5107 0 12.0009 0C12.491 0 12.937 0.305933 13.3768 0.607666C13.707 0.834176 14.0338 1.05832 14.3731 1.14889C14.73 1.24446 15.1395 1.21387 15.5472 1.18341C16.0741 1.14404 16.5982 1.10488 17.0022 1.33863C17.414 1.57708 17.6439 2.05695 17.8731 2.53547C18.0484 2.90157 18.2234 3.26687 18.4792 3.52268C18.735 3.77848 19.1003 3.95344 19.4664 4.12878C19.9449 4.35797 20.4248 4.5878 20.6632 4.99967C20.8974 5.40387 20.8582 5.92816 20.8187 6.45539C20.7883 6.86275 20.7577 7.27187 20.8529 7.62871C20.9435 7.96774 21.1675 8.29434 21.3939 8.62446ZM12.3494 6.22726C12.2065 5.92425 11.7935 5.92425 11.6506 6.22726L10.7164 8.20759C10.6596 8.32792 10.5499 8.41132 10.423 8.43061L8.33407 8.74817C8.01445 8.79676 7.88682 9.2077 8.1181 9.44356L9.62965 10.985C9.72149 11.0787 9.7634 11.2136 9.74172 11.3459L9.38489 13.5225C9.33029 13.8555 9.66442 14.1095 9.9503 13.9523L11.8187 12.9246C11.9322 12.8622 12.0678 12.8622 12.1813 12.9246L14.0497 13.9523C14.3356 14.1095 14.6697 13.8555 14.6151 13.5225L14.2583 11.3459C14.2366 11.2136 14.2785 11.0787 14.3704 10.985L15.8819 9.44356C16.1132 9.2077 15.9856 8.79676 15.6659 8.74817L13.577 8.43061C13.4501 8.41132 13.3404 8.32792 13.2836 8.20759L12.3494 6.22726Z" fill="currentColor"/>
|
|
3
|
+
<path d="M15.9003 19.7002C15.5641 19.675 15.2268 19.6498 14.9136 19.683L17.5622 24.0001L18.7783 20.9821L22.0005 21.4386L19.2742 16.9947C19.222 17.0365 19.1725 17.0804 19.1263 17.1266C18.8449 17.408 18.6524 17.8098 18.4595 18.2125C18.2074 18.7389 17.9546 19.2668 17.5016 19.5291C17.0569 19.7867 16.4802 19.7435 15.9003 19.7002Z" fill="currentColor"/>
|
|
4
|
+
<path d="M4.72701 16.9954C4.77892 17.037 4.82813 17.0806 4.87413 17.1266C5.15551 17.408 5.34797 17.8098 5.54084 18.2125C5.79295 18.7389 6.04577 19.2668 6.49883 19.5291C6.94317 19.7862 7.51966 19.7431 8.09932 19.6998C8.43619 19.6746 8.77413 19.6494 9.08784 19.6829L6.43915 24.0001L5.22304 20.9821L2.00087 21.4386L4.72701 16.9954Z" fill="currentColor"/>
|
|
5
|
+
</svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.9352 3.80547C25.4777 7.85818 24.3492 14.8124 19.4144 19.3381C14.4796 23.8638 7.60741 24.2472 4.06484 20.1945C3.73724 19.8198 3.44959 19.4202 3.2012 19H1C0.447715 19 0 18.5523 0 18C0 17.4477 0.447715 17 1 17H4C4.55228 17 5 16.5523 5 16C5 15.4477 4.55228 15 4 15H2C1.44772 15 1 14.5523 1 14C1 13.4477 1.44772 13 2 13H7C7.55228 13 8 12.5523 8 12C8 11.4477 7.55228 11 7 11H1C0.447715 11 0 10.5523 0 10C0 9.44771 0.447715 9 1 9H3.31377C4.08184 7.43897 5.17913 5.95181 6.5856 4.66192C11.5204 0.136209 18.3926 -0.24724 21.9352 3.80547ZM17.24 8.17268C17.6115 7.76402 17.5814 7.13157 17.1727 6.76007C16.764 6.38856 16.1316 6.41868 15.7601 6.82733L10.7601 12.3273C10.4938 12.6202 10.4254 13.0426 10.5855 13.4046C10.7456 13.7665 11.1042 14 11.5 14H16C16.5523 14 17 13.5523 17 13C17 12.4477 16.5523 12 16 12H13.7606L17.24 8.17268Z" fill="currentColor"/>
|
|
3
|
+
</svg>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M2.18177 2C1.57929 2 1.09089 2.49746 1.09089 3.11111C1.09089 3.72476 1.57929 4.22222 2.18177 4.22222H4.36371C4.96619 4.22222 5.45459 4.71968 5.45459 5.33333C5.45459 5.94698 4.96619 6.44444 4.36371 6.44444H1.09089C0.488406 6.44444 0 6.94191 0 7.55556C0 8.16921 0.488406 8.66667 1.09089 8.66667H6.54548C7.14796 8.66667 7.63636 9.16413 7.63636 9.77778C7.63636 10.3914 7.14796 10.8889 6.54548 10.8889H2.18194C1.57946 10.8889 1.09089 11.3864 1.09089 12C1.09089 12.6137 1.57929 13.1111 2.18177 13.1111H5.45443C6.05691 13.1111 6.54548 13.6086 6.54548 14.2222C6.54548 14.8359 6.05707 15.3333 5.45459 15.3333H2.18194V18.7593C2.18194 19.3218 2.62964 19.7778 3.18191 19.7778H5.03586C4.7374 17.6526 6.42764 15.8889 8.50034 15.8889C10.573 15.8889 12.2633 17.6526 11.9648 19.7778H13.0002V7.18519C13.0002 6.06016 13.8956 5.14815 15.0002 5.14815H17.0002V3.01852C17.0002 2.45601 16.5524 2 16.0002 2H2.18177Z" fill="currentColor"/>
|
|
3
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.0002 6.16667C14.4479 6.16667 14.0002 6.62267 14.0002 7.18519V19.7778H15.0356C14.7372 17.6526 16.4274 15.8889 18.5001 15.8889C20.5728 15.8889 22.2631 17.6526 21.9646 19.7778H23C23.5523 19.7778 24 19.3218 24 18.7593V12.9991C24 12.5247 23.8916 12.0569 23.6833 11.6326L21.2765 6.72969C21.1071 6.38463 20.7608 6.16667 20.382 6.16667H15.0002ZM20.264 8.80856L21.6876 12.0709C21.8345 12.4077 21.5925 12.787 21.2307 12.787H16.0002V8.2037H19.3502C19.7454 8.2037 20.1035 8.44075 20.264 8.80856Z" fill="currentColor"/>
|
|
4
|
+
<path d="M21.0001 19.4537C21.0001 20.86 19.8808 22 18.5001 22C17.1194 22 16.0002 20.86 16.0002 19.4537C16.0002 18.0474 17.1194 16.9074 18.5001 16.9074C19.8808 16.9074 21.0001 18.0474 21.0001 19.4537Z" fill="currentColor"/>
|
|
5
|
+
<path d="M8.50034 22C9.88102 22 11.0003 20.86 11.0003 19.4537C11.0003 18.0474 9.88102 16.9074 8.50034 16.9074C7.11965 16.9074 6.00039 18.0474 6.00039 19.4537C6.00039 20.86 7.11965 22 8.50034 22Z" fill="currentColor"/>
|
|
6
|
+
</svg>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M9 1C7.34315 1 6 2.34315 6 4V6.5C7.38071 6.5 8.5 7.61929 8.5 9V13.5H19.5V9C19.5 7.61929 20.6193 6.5 22 6.5V4C22 2.34315 20.6569 1 19 1H9Z" fill="currentColor"/>
|
|
3
|
+
<path d="M4 10H3C2.44772 10 2 9.55229 2 9C2 8.44772 2.44772 8 3 8H5.21922C5.2622 8 5.30442 8.00267 5.34575 8.00783C5.39646 8.00265 5.44792 8 5.5 8C6.32843 8 7 8.67157 7 9.5V14C7 14.5523 7.44772 15 8 15H20C20.5523 15 21 14.5523 21 14V9.5C21 8.67157 21.6716 8 22.5 8C23.3284 8 24 8.67157 24 9.5V18C24 19.1046 23.1046 20 22 20H6C4.89543 20 4 19.1046 4 18H3C2.44772 18 2 17.5523 2 17C2 16.4477 2.44772 16 3 16H5C5.55228 16 6 15.5523 6 15C6 14.4477 5.55228 14 5 14H1C0.447715 14 0 13.5523 0 13C0 12.4477 0.447715 12 1 12H4C4.55228 12 5 11.5523 5 11C5 10.4477 4.55228 10 4 10Z" fill="currentColor"/>
|
|
4
|
+
<path d="M9 21H6L6.31063 22.2425C6.42193 22.6877 6.82191 23 7.28078 23H7.71922C8.17809 23 8.57807 22.6877 8.68937 22.2425L9 21Z" fill="currentColor"/>
|
|
5
|
+
<path d="M22 21H19L19.3106 22.2425C19.4219 22.6877 19.8219 23 20.2808 23H20.7192C21.1781 23 21.5781 22.6877 21.6894 22.2425L22 21Z" fill="currentColor"/>
|
|
6
|
+
</svg>
|
package/dist/assets/medal.svg
CHANGED
|
@@ -1,13 +1,5 @@
|
|
|
1
1
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
-
<
|
|
3
|
-
<path
|
|
4
|
-
<path d="M18 0.3C18 0.134315 17.8657 0 17.7 0H13.3C13.1343 0 13 0.134314 13 0.3V4.57223C13 4.7256 13.1158 4.85375 13.2678 4.87442C14.8424 5.0886 16.286 5.6959 17.4887 6.59011C17.6948 6.74335 18 6.60139 18 6.34456V0.3Z" fill="#currentColor"/>
|
|
5
|
-
<path d="M6 0.3C6 0.134315 6.13431 0 6.3 0H10.7C10.8657 0 11 0.134314 11 0.3V4.57223C11 4.7256 10.8842 4.85375 10.7322 4.87442C9.15763 5.0886 7.71397 5.6959 6.51127 6.59011C6.30517 6.74335 6 6.60139 6 6.34456V0.3Z" fill="#currentColor"/>
|
|
2
|
+
<path d="M18 0.3C18 0.134315 17.8657 0 17.7 0H13.3C13.1343 0 13 0.134314 13 0.3V4.57223C13 4.7256 13.1158 4.85375 13.2678 4.87442C14.8424 5.0886 16.286 5.6959 17.4887 6.59011C17.6948 6.74335 18 6.60139 18 6.34456V0.3Z" fill="currentColor"/>
|
|
3
|
+
<path d="M6 0.3C6 0.134315 6.13431 0 6.3 0H10.7C10.8657 0 11 0.134314 11 0.3V4.57223C11 4.7256 10.8842 4.85375 10.7322 4.87442C9.15763 5.0886 7.71397 5.6959 6.51127 6.59011C6.30517 6.74335 6 6.60139 6 6.34456V0.3Z" fill="currentColor"/>
|
|
6
4
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M12 24C16.9706 24 21 19.9706 21 15C21 10.0294 16.9706 6 12 6C7.02944 6 3 10.0294 3 15C3 19.9706 7.02944 24 12 24ZM13.4233 12.6722L12.373 9.9623C12.241 9.62171 11.759 9.62171 11.627 9.96231L10.5767 12.6722C10.52 12.8187 10.3828 12.9183 10.226 12.9271L7.32412 13.0886C6.9594 13.1089 6.81048 13.5672 7.09361 13.798L9.34635 15.6343C9.46808 15.7335 9.52048 15.8948 9.48032 16.0466L8.73718 18.8564C8.64378 19.2095 9.03366 19.4928 9.34065 19.2948L11.7832 17.7198C11.9152 17.6347 12.0848 17.6347 12.2168 17.7198L14.6593 19.2948C14.9663 19.4928 15.3562 19.2095 15.2628 18.8564L14.5197 16.0466C14.4795 15.8948 14.5319 15.7335 14.6536 15.6343L16.9064 13.798C17.1895 13.5672 17.0406 13.1089 16.6759 13.0886L13.774 12.9271C13.6172 12.9183 13.48 12.8187 13.4233 12.6722Z" fill="currentColor"/>
|
|
7
|
-
</g>
|
|
8
|
-
<defs>
|
|
9
|
-
<clipPath id="clip0_15133_21082">
|
|
10
|
-
<rect width="24" height="24" fill="white"/>
|
|
11
|
-
</clipPath>
|
|
12
|
-
</defs>
|
|
13
5
|
</svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M12 24L10.8 20.4H2.4C1.74 20.4 1.175 20.165 0.705 19.695C0.235 19.225 0 18.66 0 18V2.4C0 1.74 0.235 1.175 0.705 0.705C1.175 0.235 1.74 0 2.4 0H9.6L10.65 3.6H21.6C22.3 3.6 22.875 3.825 23.325 4.275C23.775 4.725 24 5.3 24 6V21.6C24 22.26 23.775 22.825 23.325 23.295C22.875 23.765 22.3 24 21.6 24H12ZM6.18 15.12C7.56 15.12 8.695 14.675 9.585 13.785C10.475 12.895 10.92 11.74 10.92 10.32C10.92 10.16 10.915 10.015 10.905 9.885C10.895 9.755 10.87 9.62 10.83 9.48H6.09V11.34H8.76C8.6 11.9 8.295 12.335 7.845 12.645C7.395 12.955 6.85 13.11 6.21 13.11C5.43 13.11 4.76 12.83 4.2 12.27C3.64 11.71 3.36 11.02 3.36 10.2C3.36 9.38 3.64 8.69 4.2 8.13C4.76 7.57 5.43 7.29 6.21 7.29C6.57 7.29 6.91 7.355 7.23 7.485C7.55 7.615 7.84 7.81 8.1 8.07L9.57 6.66C9.15 6.22 8.645 5.88 8.055 5.64C7.465 5.4 6.84 5.28 6.18 5.28C4.84 5.28 3.695 5.755 2.745 6.705C1.795 7.655 1.32 8.82 1.32 10.2C1.32 11.58 1.795 12.745 2.745 13.695C3.695 14.645 4.84 15.12 6.18 15.12ZM14.22 15.72L14.88 15.09C14.6 14.75 14.345 14.42 14.115 14.1C13.885 13.78 13.66 13.44 13.44 13.08L14.22 15.72ZM15.72 14.19C16.28 13.53 16.705 12.9 16.995 12.3C17.285 11.7 17.48 11.23 17.58 10.89H12.81L13.17 12.15H14.37C14.53 12.45 14.72 12.775 14.94 13.125C15.16 13.475 15.42 13.83 15.72 14.19ZM13.2 22.8H21.6C21.96 22.8 22.25 22.685 22.47 22.455C22.69 22.225 22.8 21.94 22.8 21.6V6C22.8 5.64 22.69 5.35 22.47 5.13C22.25 4.91 21.96 4.8 21.6 4.8H11.01L12.42 9.66H14.79V8.4H16.02V9.66H20.4V10.89H18.87C18.67 11.65 18.37 12.39 17.97 13.11C17.57 13.83 17.1 14.5 16.56 15.12L19.83 18.33L18.96 19.2L15.72 15.96L14.64 17.07L15.6 20.4L13.2 22.8Z" fill="currentColor"/>
|
|
3
|
+
</svg>
|
package/dist/baklava.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{b as k}from"./chunk-XQUQIQBO.js";import{a as i}from"./chunk-KR6AUZ77.js";import{c as n,f as c}from"./chunk-AVMAZXZT.js";import{b as C}from"./chunk-
|
|
1
|
+
import{b as k}from"./chunk-XQUQIQBO.js";import{a as i}from"./chunk-KR6AUZ77.js";import{c as n,f as c}from"./chunk-AVMAZXZT.js";import{b as C}from"./chunk-BEGAFK2I.js";import{a as b}from"./chunk-6UTBN2XX.js";import{a as P}from"./chunk-LWG2UXQG.js";import{a as I}from"./chunk-VOYAVKU3.js";import{a as g}from"./chunk-MNNOI75G.js";import{a as w}from"./chunk-EPFBV6RC.js";import{a as h}from"./chunk-L4XYDFNG.js";import{a as u}from"./chunk-KXWP6EDU.js";import{b as T,d as G}from"./chunk-V5OMCBVZ.js";import{b as D}from"./chunk-7QGSFS64.js";import{b as S}from"./chunk-RFUZBNM4.js";import{a as B}from"./chunk-TOJWQXBJ.js";import{a as m}from"./chunk-LDGSM7XL.js";import{a as s}from"./chunk-ILQVF4MN.js";import"./chunk-EZSEQHRH.js";import{a as x}from"./chunk-FJTTJ5ZT.js";import"./chunk-OSNB4BPE.js";import"./chunk-3B64VOWB.js";import{a as e}from"./chunk-X5MXYPRD.js";import"./chunk-ECPWEUBG.js";import{a as r}from"./chunk-SLY6IY2R.js";import{b as f,e as p}from"./chunk-RQG2GHCK.js";import"./chunk-AAGDUS7G.js";import"./chunk-DJOD4BTL.js";import"./chunk-AYJMIZZ3.js";import{a as d}from"./chunk-MPKYBU46.js";import{b as l}from"./chunk-WA7DDIST.js";import"./chunk-6LT7O7T2.js";import{a as o,b as t,c as a}from"./chunk-JI2OEPG2.js";import"./chunk-GRL4DWKG.js";import"./chunk-X2KXJYXQ.js";import"./chunk-DINNT5P2.js";import"./chunk-3USCFSFQ.js";import"./chunk-7GK5LKBV.js";import"./chunk-4OT5AMS5.js";import"./chunk-CYCIT2TG.js";export{e as BlAlert,r as BlBadge,l as BlButton,f as BlCheckbox,p as BlCheckboxGroup,d as BlDialog,u as BlDrawer,G as BlDropdown,D as BlDropdownGroup,T as BlDropdownItem,a as BlIcon,x as BlInput,S as BlNotification,k as BlNotificationCard,B as BlPagination,h as BlPopover,i as BlProgressIndicator,n as BlRadio,c as BlRadioGroup,m as BlSelect,s as BlSelectOption,C as BlSwitch,I as BlTab,b as BlTabGroup,P as BlTabPanel,g as BlTextarea,w as BlTooltip,t as getIconPath,o as setIconPath};
|
|
2
2
|
//# sourceMappingURL=baklava.js.map
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import{a as s,b as i}from"./chunk-X2KXJYXQ.js";import{a as e,b as l,f as r}from"./chunk-4OT5AMS5.js";import{c as o}from"./chunk-CYCIT2TG.js";var p=e`:host{display:block;position:relative;width:100%}.dropdown-group{display:flex;flex-direction:column;gap:var(--bl-size-xs)}.caption{font:var(--bl-font-caption);font-size:var(--bl-font-size-xs);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-s);color:var(--bl-color-neutral-dark)}:host(:not(:first-child)) .dropdown-group{border-top:1px solid var(--bl-color-neutral-lighter);padding-top:var(--bl-size-xs)}:host(:not(:last-child)) .dropdown-group{border-bottom:1px solid var(--bl-color-neutral-lighter);padding-bottom:var(--bl-size-xs)}/*
|
|
2
|
+
:host(:not([caption])) ::slotted(:first-child) {
|
|
3
|
+
padding-block: var(--bl-size-xs) 0;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
:host(:not(:last-child)) ::slotted(:last-child) {
|
|
7
|
+
padding-block: 0 var(--bl-size-xs);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
:host(:not(:first-child)) .caption {
|
|
11
|
+
padding-block: var(--bl-size-xs) 0;
|
|
12
|
+
} */`,a=p;var d="bl-dropdown-group",t=class extends r{static get styles(){return[a]}render(){let n=this.caption?l`<span id="label" class="caption">${this.caption}</span>`:"";return l`<div class="dropdown-group" role="group" aria-labelledby="label">
|
|
13
|
+
${n}
|
|
14
|
+
<slot></slot>
|
|
15
|
+
</div>`}};o([i({type:String})],t.prototype,"caption",2),t=o([s(d)],t);export{d as a,t as b};
|
|
16
|
+
//# sourceMappingURL=chunk-7QGSFS64.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/dropdown/group/bl-dropdown-group.css", "../src/components/dropdown/group/bl-dropdown-group.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:block;position:relative;width:100%}.dropdown-group{display:flex;flex-direction:column;gap:var(--bl-size-xs)}.caption{font:var(--bl-font-caption);font-size:var(--bl-font-size-xs);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-s);color:var(--bl-color-neutral-dark)}:host(:not(:first-child)) .dropdown-group{border-top:1px solid var(--bl-color-neutral-lighter);padding-top:var(--bl-size-xs)}:host(:not(:last-child)) .dropdown-group{border-bottom:1px solid var(--bl-color-neutral-lighter);padding-bottom:var(--bl-size-xs)}/*\n:host(:not([caption])) ::slotted(:first-child) {\n padding-block: var(--bl-size-xs) 0;\n}\n\n:host(:not(:last-child)) ::slotted(:last-child) {\n padding-block: 0 var(--bl-size-xs);\n}\n\n:host(:not(:first-child)) .caption {\n padding-block: var(--bl-size-xs) 0;\n} */`;\nexport default styles;\n", "import { LitElement, html, CSSResultGroup, TemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport style from \"./bl-dropdown-group.css\";\n\nexport const blDropdownGroupTag = \"bl-dropdown-group\";\n\n/**\n * @tag bl-dropdown-group\n * @summary Baklava Dropdown Group component\n */\n@customElement(blDropdownGroupTag)\nexport default class BlDropdownGroup extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n /**\n * Sets the caption.\n */\n @property({ type: String })\n caption?: string;\n\n render(): TemplateResult {\n const caption = this.caption\n ? html`<span id=\"label\" class=\"caption\">${this.caption}</span>`\n : \"\";\n\n return html`<div class=\"dropdown-group\" role=\"group\" aria-labelledby=\"label\">\n ${caption}\n <slot></slot>\n </div>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [blDropdownGroupTag]: BlDropdownGroup;\n }\n}\n"],
|
|
5
|
+
"mappings": "6IACO,IAAMA,EAASC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAYfC,EAAQF,ECTR,IAAMG,EAAqB,oBAObC,EAArB,cAA6CC,CAAW,CACtD,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAQA,QAAyB,CACvB,IAAMC,EAAU,KAAK,QACjBC,qCAAwC,KAAK,iBAC7C,GAEJ,OAAOA;AAAA,QACHD;AAAA;AAAA,WAGN,CACF,EAZEE,EAAA,CADCC,EAAS,CAAE,KAAM,MAAO,CAAC,GARPN,EASnB,uBATmBA,EAArBK,EAAA,CADCC,EAAcP,CAAkB,GACZC",
|
|
6
|
+
"names": ["styles", "i", "bl_dropdown_group_default", "blDropdownGroupTag", "BlDropdownGroup", "s", "bl_dropdown_group_default", "caption", "x", "__decorateClass", "e"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import{a as b}from"./chunk-GRL4DWKG.js";import{a as h,b as a}from"./chunk-X2KXJYXQ.js";import{a as d}from"./chunk-DINNT5P2.js";import{a as s,b as c,f as n}from"./chunk-4OT5AMS5.js";import{c as r}from"./chunk-CYCIT2TG.js";var p=s`:host{display:inline-block;cursor:pointer;vertical-align:middle}span{display:inline-block}.switch{--track-height:var(--bl-size-xl);--track-width:var(--bl-size-4xl);--thumb-offset:var(--bl-size-4xs);--thumb-height:calc(var(--track-height) - calc(2 * var(--thumb-offset)));--thumb-width:var(--thumb-height);/* TODO: use predefined animation duration once it is ready */--animation-duration:var(--bl-switch-animation-duration, 300ms);--switch-color:var(--bl-switch-color-off, var(--bl-color-neutral-lighter));background-color:var(--switch-color);border-radius:var(--bl-border-radius-pill);height:var(--track-height);transition-property:background-color;transition-duration:var(--animation-duration);width:var(--track-width)}.switch::before{content:"";display:inline-block;background-color:white;border-radius:var(--bl-border-radius-circle);height:var(--thumb-height);left:var(--thumb-offset);position:relative;top:var(--thumb-offset);transition:transform;transition-duration:var(--animation-duration);width:var(--thumb-width)}label{display:flex;gap:var(--bl-size-2xs);color:var(--bl-color-neutral-darker);font:var(--bl-font-title-3);cursor:pointer;user-select:none;line-height:normal;align-items:center;margin-block:0}.label{overflow-wrap:anywhere}:host([disabled]) .label{color:var(--bl-color-neutral-light);border:1px solid var(--bl-color-neutral-lighter)}:host([checked]) .label,:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) .label,:host(:hover) .label{color:var(--bl-color-primary)}:host([checked]) .switch{--switch-color:var(--bl-switch-color-on, var(--bl-switch-color, var(--bl-color-primary)))}:host([checked]) .switch::before{transform:translateX(
|
|
2
|
+
calc(var(--track-width) - var(--thumb-width) - calc(2 * var(--thumb-offset)))
|
|
3
|
+
)}:host([disabled]) .switch{opacity:0.5}:host([disabled]){cursor:not-allowed}.switch:focus-visible{position:relative;outline:none}.switch:focus-visible::after{border:2px solid var(--switch-color);border-radius:var(--bl-border-radius-pill);content:"";position:absolute;inset:-3px}`,u=p;var m="bl-switch",e=class extends n{constructor(){super(...arguments);this.checked=!1;this.disabled=!1}static get styles(){return[u]}toggle(){this.disabled||(this.checked=!this.checked,this.onToggle(this.checked))}handleKeyDown(t){(t.code==="Enter"||t.code==="Space")&&(this.toggle(),t.preventDefault())}render(){var o,i,l;let t=(l=(i=this.ariaLabel)!=null?i:(o=this.attributes.getNamedItem("aria-label"))==null?void 0:o.value)!=null?l:void 0;return c`
|
|
4
|
+
<label @click=${this.toggle}>
|
|
5
|
+
<slot class="label"></slot>
|
|
6
|
+
<span
|
|
7
|
+
class="switch"
|
|
8
|
+
role="switch"
|
|
9
|
+
aria-checked=${this.checked}
|
|
10
|
+
aria-readonly=${!!this.disabled}
|
|
11
|
+
@keydown=${this.handleKeyDown}
|
|
12
|
+
aria-label=${d(t)}
|
|
13
|
+
tabindex="0"
|
|
14
|
+
>
|
|
15
|
+
</span>
|
|
16
|
+
</label>
|
|
17
|
+
`}};r([a({type:Boolean,reflect:!0})],e.prototype,"checked",2),r([a({type:Boolean,reflect:!0})],e.prototype,"disabled",2),r([b("bl-switch-toggle")],e.prototype,"onToggle",2),e=r([h(m)],e);export{m as a,e as b};
|
|
18
|
+
//# sourceMappingURL=chunk-BEGAFK2I.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/switch/bl-switch.css", "../src/components/switch/bl-switch.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:inline-block;cursor:pointer;vertical-align:middle}span{display:inline-block}.switch{--track-height:var(--bl-size-xl);--track-width:var(--bl-size-4xl);--thumb-offset:var(--bl-size-4xs);--thumb-height:calc(var(--track-height) - calc(2 * var(--thumb-offset)));--thumb-width:var(--thumb-height);/* TODO: use predefined animation duration once it is ready */--animation-duration:var(--bl-switch-animation-duration, 300ms);--switch-color:var(--bl-switch-color-off, var(--bl-color-neutral-lighter));background-color:var(--switch-color);border-radius:var(--bl-border-radius-pill);height:var(--track-height);transition-property:background-color;transition-duration:var(--animation-duration);width:var(--track-width)}.switch::before{content:\"\";display:inline-block;background-color:white;border-radius:var(--bl-border-radius-circle);height:var(--thumb-height);left:var(--thumb-offset);position:relative;top:var(--thumb-offset);transition:transform;transition-duration:var(--animation-duration);width:var(--thumb-width)}label{display:flex;gap:var(--bl-size-2xs);color:var(--bl-color-neutral-darker);font:var(--bl-font-title-3);cursor:pointer;user-select:none;line-height:normal;align-items:center;margin-block:0}.label{overflow-wrap:anywhere}:host([disabled]) .label{color:var(--bl-color-neutral-light);border:1px solid var(--bl-color-neutral-lighter)}:host([checked]) .label,:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) .label,:host(:hover) .label{color:var(--bl-color-primary)}:host([checked]) .switch{--switch-color:var(--bl-switch-color-on, var(--bl-switch-color, var(--bl-color-primary)))}:host([checked]) .switch::before{transform:translateX(\n calc(var(--track-width) - var(--thumb-width) - calc(2 * var(--thumb-offset)))\n )}:host([disabled]) .switch{opacity:0.5}:host([disabled]){cursor:not-allowed}.switch:focus-visible{position:relative;outline:none}.switch:focus-visible::after{border:2px solid var(--switch-color);border-radius:var(--bl-border-radius-pill);content:\"\";position:absolute;inset:-3px}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport style from \"./bl-switch.css\";\n\nexport const blSwitchTag = \"bl-switch\";\n\n/**\n * @tag bl-switch\n * @summary Baklava Switch component\n *\n * @cssproperty [--bl-switch-color-on=--bl-color-primary] Set the checked color\n * @cssproperty [--bl-switch-color-off=--bl-color-neutral-lighter] Set the unchecked color\n * @cssproperty [--bl-switch-animation-duration=300ms] Set the animation duration of switch toggle\n */\n@customElement(blSwitchTag)\nexport default class BlSwitch extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n /**\n * Sets the checked state for switch\n */\n @property({ type: Boolean, reflect: true })\n checked = false;\n\n /**\n * Sets the disabled state for switch\n */\n @property({ type: Boolean, reflect: true })\n disabled? = false;\n\n /**\n * Fires whenever user toggles the switch\n */\n @event(\"bl-switch-toggle\") private onToggle: EventDispatcher<boolean>;\n\n toggle() {\n if (this.disabled) return;\n\n this.checked = !this.checked;\n this.onToggle(this.checked);\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (event.code === \"Enter\" || event.code === \"Space\") {\n this.toggle();\n event.preventDefault();\n }\n }\n\n render(): TemplateResult {\n const ariaLabel =\n this.ariaLabel ?? this.attributes.getNamedItem(\"aria-label\")?.value ?? undefined;\n\n return html`\n <label @click=${this.toggle}>\n <slot class=\"label\"></slot>\n <span\n class=\"switch\"\n role=\"switch\"\n aria-checked=${this.checked}\n aria-readonly=${!!this.disabled}\n @keydown=${this.handleKeyDown}\n aria-label=${ifDefined(ariaLabel)}\n tabindex=\"0\"\n >\n </span>\n </label>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [blSwitchTag]: BlSwitch;\n }\n}\n"],
|
|
5
|
+
"mappings": "6NACO,IAAMA,EAASC;AAAA;AAAA,2RAGfC,EAAQF,ECER,IAAMG,EAAc,YAWNC,EAArB,cAAsCC,CAAW,CAAjD,kCASE,aAAU,GAMV,cAAY,GAdZ,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAmBA,QAAS,CACH,KAAK,WAET,KAAK,QAAU,CAAC,KAAK,QACrB,KAAK,SAAS,KAAK,OAAO,EAC5B,CAEQ,cAAcC,EAAsB,EACtCA,EAAM,OAAS,SAAWA,EAAM,OAAS,WAC3C,KAAK,OAAO,EACZA,EAAM,eAAe,EAEzB,CAEA,QAAyB,CArD3B,IAAAC,EAAAC,EAAAC,EAsDI,IAAMC,GACJD,GAAAD,EAAA,KAAK,YAAL,KAAAA,GAAkBD,EAAA,KAAK,WAAW,aAAa,YAAY,IAAzC,YAAAA,EAA4C,QAA9D,KAAAE,EAAuE,OAEzE,OAAOE;AAAA,sBACW,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,yBAKF,KAAK;AAAA,0BACJ,CAAC,CAAC,KAAK;AAAA,qBACZ,KAAK;AAAA,uBACHC,EAAUF,CAAS;AAAA;AAAA;AAAA;AAAA;AAAA,KAMxC,CACF,EA/CEG,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GARvBX,EASnB,uBAMAU,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAdvBX,EAenB,wBAKmCU,EAAA,CAAlCP,EAAM,kBAAkB,GApBNH,EAoBgB,wBApBhBA,EAArBU,EAAA,CADCC,EAAcZ,CAAW,GACLC",
|
|
6
|
+
"names": ["styles", "i", "bl_switch_default", "blSwitchTag", "BlSwitch", "s", "bl_switch_default", "event", "_a", "_b", "_c", "ariaLabel", "x", "l", "__decorateClass", "e"]
|
|
7
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as r}from"./chunk-GRL4DWKG.js";import{a as c,b as
|
|
1
|
+
import{a as r}from"./chunk-GRL4DWKG.js";import{a as c,b as l,c as p,e as u}from"./chunk-X2KXJYXQ.js";import{a as n,b as i,f as a}from"./chunk-4OT5AMS5.js";import{c as o}from"./chunk-CYCIT2TG.js";var d=n`:host{position:relative}.option-container{--option-font:var(--bl-font-title-3-regular);--option-spacing:var(--bl-size-xs) 0;--option-selected-color:var(--bl-color-primary);--option-hover-color:var(--bl-color-primary-highlight);--option-color:var(--bl-color-neutral-darker);--option-disabled-color:var(--bl-color-neutral-light);--option-separator:1px solid var(--bl-color-neutral-lighter);--option-gap:var(--bl-size-2xs);--option-transition:color 120ms ease-out}.option-container::after{position:absolute;content:"";width:100%;bottom:0;border-bottom:var(--option-separator)}.no-border-bottom::after{border-bottom:none}:host(:last-of-type) .option-container::after{border-bottom:none}.single-option{width:100%;display:block;cursor:pointer;color:var(--option-color);margin:var(--option-spacing);transition:var(--option-transition);font:var(--option-font);user-select:none;position:relative;outline:none}.single-option:focus-visible::after{content:"";position:absolute;inset:calc(var(--bl-size-3xs) * -1);border:var(--bl-size-4xs) solid var(--option-hover-color);border-radius:var(--bl-size-4xs)}:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) .single-option,:host(:hover) .single-option{color:var(--option-hover-color)}:host([selected]) .single-option{color:var(--option-selected-color)}:host([disabled]){cursor:not-allowed}:host([disabled]) .single-option{color:var(--option-disabled-color);cursor:not-allowed;pointer-events:none}.checkbox-option{width:100%;display:block;color:var(--option-color);padding:var(--option-spacing)}`,h=d;var e=class extends a{constructor(){super(...arguments);this.label="";this.disabled=!1;this.selected=!1;this.multiple=!1}static get styles(){return[h]}get value(){return this._value||this.textContent}set value(t){this._value=t}focus(){this.multiple||(this.focusTarget.tabIndex=0),this.focusTarget.focus(),this.onFocus(this.value)}blur(){this.onBlur(this.value),this.focusTarget.tabIndex=-1}singleOptionTemplate(){return i`<div
|
|
2
2
|
class="single-option focus-target"
|
|
3
3
|
@blur=${this.blur}
|
|
4
4
|
@keydown=${this.handleKeydown}
|
|
@@ -7,7 +7,7 @@ import{a as r}from"./chunk-GRL4DWKG.js";import{a as c,b as i,c as p,e as h}from"
|
|
|
7
7
|
aria-selected="${this.selected}"
|
|
8
8
|
>
|
|
9
9
|
<slot></slot>
|
|
10
|
-
</div>`}checkboxOptionTemplate(){return
|
|
10
|
+
</div>`}checkboxOptionTemplate(){return i`<bl-checkbox
|
|
11
11
|
class="checkbox-option focus-target"
|
|
12
12
|
.checked="${this.selected}"
|
|
13
13
|
.disabled="${this.disabled}"
|
|
@@ -16,7 +16,7 @@ import{a as r}from"./chunk-GRL4DWKG.js";import{a as c,b as i,c as p,e as h}from"
|
|
|
16
16
|
aria-selected="${this.selected}"
|
|
17
17
|
>
|
|
18
18
|
<slot></slot>
|
|
19
|
-
</bl-checkbox>`}render(){return
|
|
19
|
+
</bl-checkbox>`}render(){return i`<div class="option-container">
|
|
20
20
|
${this.multiple?this.checkboxOptionTemplate():this.singleOptionTemplate()}
|
|
21
|
-
</div>`}handleKeydown(
|
|
22
|
-
//# sourceMappingURL=chunk-
|
|
21
|
+
</div>`}handleKeydown(t){(t.code==="Enter"||t.code==="Space")&&(this._onClickOption(),t.preventDefault())}_handleEvent(){this._onSelect(this.value)}_onClickOption(){this.selected=!this.selected,this._handleEvent()}_onCheckboxChange(t){this.selected=t.detail,this._handleEvent()}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{var t,s;this.blSelect=this.closest("bl-select"),this.multiple=((t=this.blSelect)==null?void 0:t.multiple)||!1,(s=this.blSelect)==null||s.registerOption(this)})}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.blSelect)==null||t.unregisterOption(this)}};o([l({})],e.prototype,"value",1),o([l({type:String,reflect:!0,attribute:"label"})],e.prototype,"label",2),o([l({type:Boolean,reflect:!0})],e.prototype,"disabled",2),o([l({type:Boolean,reflect:!0})],e.prototype,"selected",2),o([p()],e.prototype,"multiple",2),o([r("bl-select-option")],e.prototype,"_onSelect",2),o([r("bl-focus")],e.prototype,"onFocus",2),o([r("bl-blur")],e.prototype,"onBlur",2),o([u(".focus-target")],e.prototype,"focusTarget",2),e=o([c("bl-select-option")],e);export{e as a};
|
|
22
|
+
//# sourceMappingURL=chunk-ILQVF4MN.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/select/option/bl-select-option.css", "../src/components/select/option/bl-select-option.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{position:relative}.option-container{--option-font:var(--bl-font-title-3-regular);--option-spacing:var(--bl-size-xs) 0;--option-selected-color:var(--bl-color-primary);--option-hover-color:var(--bl-color-primary-highlight);--option-color:var(--bl-color-neutral-darker);--option-disabled-color:var(--bl-color-neutral-light);--option-separator:1px solid var(--bl-color-neutral-lighter);--option-gap:var(--bl-size-2xs);--option-transition:color 120ms ease-out}.option-container::after{position:absolute;content:\"\";width:100%;bottom:0;border-bottom:var(--option-separator)}.no-border-bottom::after{border-bottom:none}:host(:last-of-type) .option-container::after{border-bottom:none}.single-option{width:100%;display:block;cursor:pointer;color:var(--option-color);margin:var(--option-spacing);transition:var(--option-transition);font:var(--option-font);user-select:none;position:relative;outline:none}.single-option:focus-visible::after{content:\"\";position:absolute;inset:calc(var(--bl-size-3xs) * -1);border:var(--bl-size-4xs) solid var(--option-hover-color);border-radius:var(--bl-size-4xs)}:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) .single-option,:host(:hover) .single-option{color:var(--option-hover-color)}:host([selected]) .single-option{color:var(--option-selected-color)}:host([disabled]){cursor:not-allowed}:host([disabled]) .single-option{color:var(--option-disabled-color);cursor:not-allowed;pointer-events:none}.checkbox-option{width:100%;display:block;color:var(--option-color);padding:var(--option-spacing)}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement } from \"lit\";\nimport { customElement, property, query, state } from \"lit/decorators.js\";\nimport { FormValue } from \"@open-wc/form-helpers\";\nimport { event, EventDispatcher } from \"../../../utilities/event\";\nimport BlSelect from \"../bl-select\";\nimport style from \"./bl-select-option.css\";\n\n@customElement(\"bl-select-option\")\nexport default class BlSelectOption<ValueType extends FormValue = string> extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n private _value: ValueType;\n\n /* Declare reactive properties */\n /**\n * Sets the value for the option\n */\n @property({})\n get value(): ValueType {\n return this._value || (this.textContent as ValueType);\n }\n\n set value(val: ValueType) {\n this._value = val;\n }\n\n /**\n * Sets the label for bl-select, and bl-select renders this value instead of the option's textContent\n */\n @property({ type: String, reflect: true, attribute: \"label\" })\n label = \"\";\n\n /**\n * Sets option as disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Sets option as selected state\n */\n @property({ type: Boolean, reflect: true })\n selected = false;\n\n @state()\n multiple = false;\n\n /**\n * Fires when clicked on the option\n */\n @event(\"bl-select-option\") private _onSelect: EventDispatcher<ValueType | string | null>;\n\n /**\n * Fires when checkbox is focused\n */\n @event(\"bl-focus\") private onFocus: EventDispatcher<ValueType | string | null>;\n\n /**\n * Fires when checkbox is blurred\n */\n @event(\"bl-blur\") private onBlur: EventDispatcher<ValueType | string | null>;\n\n @query(\".focus-target\") private focusTarget: HTMLElement;\n\n /**\n * Focuses this option\n */\n focus() {\n if (!this.multiple) {\n this.focusTarget.tabIndex = 0;\n }\n this.focusTarget.focus();\n this.onFocus(this.value);\n }\n\n /**\n * Blurs from this option\n */\n blur() {\n this.onBlur(this.value);\n this.focusTarget.tabIndex = -1;\n }\n\n private blSelect: BlSelect<ValueType> | null;\n\n private singleOptionTemplate() {\n return html`<div\n class=\"single-option focus-target\"\n @blur=${this.blur}\n @keydown=${this.handleKeydown}\n @click=\"${this._onClickOption}\"\n role=\"option\"\n aria-selected=\"${this.selected}\"\n >\n <slot></slot>\n </div>`;\n }\n\n private checkboxOptionTemplate() {\n return html`<bl-checkbox\n class=\"checkbox-option focus-target\"\n .checked=\"${this.selected}\"\n .disabled=\"${this.disabled}\"\n @bl-checkbox-change=\"${this._onCheckboxChange}\"\n role=\"option\"\n aria-selected=\"${this.selected}\"\n >\n <slot></slot>\n </bl-checkbox>`;\n }\n\n render() {\n return html`<div class=\"option-container\">\n ${this.multiple ? this.checkboxOptionTemplate() : this.singleOptionTemplate()}\n </div>`;\n }\n\n private handleKeydown(event: KeyboardEvent) {\n if (event.code === \"Enter\" || event.code === \"Space\") {\n this._onClickOption();\n event.preventDefault();\n }\n }\n\n private _handleEvent() {\n this._onSelect(this.value);\n }\n\n private _onClickOption() {\n this.selected = !this.selected;\n this._handleEvent();\n }\n\n private _onCheckboxChange(event: CustomEvent) {\n this.selected = event.detail;\n this._handleEvent();\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n this.updateComplete.then(() => {\n this.blSelect = this.closest<BlSelect<ValueType>>(\"bl-select\");\n // FIXME: We should warn when parent is not bl-select\n\n this.multiple = this.blSelect?.multiple || false;\n this.blSelect?.registerOption(this);\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.blSelect?.unregisterOption(this);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"bl-select-option\": BlSelectOption;\n }\n}\n"],
|
|
5
|
+
"mappings": "mMACO,IAAMA,EAASC,6/CACfC,EAAQF,ECMf,IAAqBG,EAArB,cAAkFC,CAAW,CAA7F,kCAwBE,WAAQ,GAMR,cAAW,GAMX,cAAW,GAGX,cAAW,GAtCX,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CASA,IAAI,OAAmB,CACrB,OAAO,KAAK,QAAW,KAAK,WAC9B,CAEA,IAAI,MAAMC,EAAgB,CACxB,KAAK,OAASA,CAChB,CA2CA,OAAQ,CACD,KAAK,WACR,KAAK,YAAY,SAAW,GAE9B,KAAK,YAAY,MAAM,EACvB,KAAK,QAAQ,KAAK,KAAK,CACzB,CAKA,MAAO,CACL,KAAK,OAAO,KAAK,KAAK,EACtB,KAAK,YAAY,SAAW,EAC9B,CAIQ,sBAAuB,CAC7B,OAAOC;AAAA;AAAA,cAEG,KAAK;AAAA,iBACF,KAAK;AAAA,gBACN,KAAK;AAAA;AAAA,uBAEE,KAAK;AAAA;AAAA;AAAA,WAI1B,CAEQ,wBAAyB,CAC/B,OAAOA;AAAA;AAAA,kBAEO,KAAK;AAAA,mBACJ,KAAK;AAAA,6BACK,KAAK;AAAA;AAAA,uBAEX,KAAK;AAAA;AAAA;AAAA,mBAI1B,CAEA,QAAS,CACP,OAAOA;AAAA,QACH,KAAK,SAAW,KAAK,uBAAuB,EAAI,KAAK,qBAAqB;AAAA,WAEhF,CAEQ,cAAcC,EAAsB,EACtCA,EAAM,OAAS,SAAWA,EAAM,OAAS,WAC3C,KAAK,eAAe,EACpBA,EAAM,eAAe,EAEzB,CAEQ,cAAe,CACrB,KAAK,UAAU,KAAK,KAAK,CAC3B,CAEQ,gBAAiB,CACvB,KAAK,SAAW,CAAC,KAAK,SACtB,KAAK,aAAa,CACpB,CAEQ,kBAAkBA,EAAoB,CAC5C,KAAK,SAAWA,EAAM,OACtB,KAAK,aAAa,CACpB,CAEA,mBAAoB,CAClB,MAAM,kBAAkB,EAExB,KAAK,eAAe,KAAK,IAAM,CA/InC,IAAAC,EAAAC,EAgJM,KAAK,SAAW,KAAK,QAA6B,WAAW,EAG7D,KAAK,WAAWD,EAAA,KAAK,WAAL,YAAAA,EAAe,WAAY,IAC3CC,EAAA,KAAK,WAAL,MAAAA,EAAe,eAAe,KAChC,CAAC,CACH,CAEA,sBAAuB,CAxJzB,IAAAD,EAyJI,MAAM,qBAAqB,GAC3BA,EAAA,KAAK,WAAL,MAAAA,EAAe,iBAAiB,KAClC,CACF,EAxIME,EAAA,CADHC,EAAS,CAAC,CAAC,GAXOT,EAYf,qBAYJQ,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,QAAS,GAAM,UAAW,OAAQ,CAAC,GAvB1CT,EAwBnB,qBAMAQ,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GA7BvBT,EA8BnB,wBAMAQ,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAnCvBT,EAoCnB,wBAGAQ,EAAA,CADCE,EAAM,GAtCYV,EAuCnB,wBAKmCQ,EAAA,CAAlCH,EAAM,kBAAkB,GA5CNL,EA4CgB,yBAKRQ,EAAA,CAA1BH,EAAM,UAAU,GAjDEL,EAiDQ,uBAKDQ,EAAA,CAAzBH,EAAM,SAAS,GAtDGL,EAsDO,sBAEMQ,EAAA,CAA/BG,EAAM,eAAe,GAxDHX,EAwDa,2BAxDbA,EAArBQ,EAAA,CADCC,EAAc,kBAAkB,GACZT",
|
|
6
|
+
"names": ["styles", "i", "bl_select_option_default", "BlSelectOption", "s", "bl_select_option_default", "val", "x", "event", "_a", "_b", "__decorateClass", "e", "t", "i"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
import{b as k,d as z,f as $,g as E,h as C}from"./chunk-EZSEQHRH.js";import{a as T}from"./chunk-3B64VOWB.js";import{a as w}from"./chunk-ECPWEUBG.js";import{a as S}from"./chunk-DJOD4BTL.js";import{a as b}from"./chunk-6LT7O7T2.js";import{a as m}from"./chunk-GRL4DWKG.js";import{a as _,b as s,c as p,e as h,f as O}from"./chunk-X2KXJYXQ.js";import{a as g}from"./chunk-DINNT5P2.js";import{a as x,b as a,f}from"./chunk-4OT5AMS5.js";import{c as o}from"./chunk-CYCIT2TG.js";var A=x`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size="large"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size="small"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:", "}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:"";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`,V=A;var i=class extends S(f){constructor(){super(...arguments);this.size="medium";this.required=!1;this.disabled=!1;this.clearable=!1;this.multiple=!1;this.autofocus=!1;this.labelFixed=!1;this.viewSelectAll=!1;this.selectAllText="Select All";this.searchBar=!1;this.searchBarLoadingState=!1;this.searchNotFoundText="No Data Found";this.popoverClearSearchText="Clear Search";this._isPopoverOpen=!1;this._additionalSelectedOptionCount=0;this._searchText="";this._connectedOptions=[];this._cleanUpPopover=null;this._selectedOptions=[];this.dirty=!1;this._interactOutsideHandler=e=>{var l;let t=e.composedPath();(l=t==null?void 0:t.find(n=>n.tagName==="BL-SELECT"))!=null&&l.contains(this)||this.close()};this.focusedOptionIndex=-1}static get styles(){return[V]}get value(){return this._value}set value(e){if(this._value=e,Array.isArray(e)){let t=new FormData;e.forEach(l=>t.append(this.name,`${l}`)),this.setValue(t)}else this.setValue(e);this.setOptionsSelected()}shouldFormValueUpdate(){return this.value!==null&&this.value!==""}setOptionsSelected(){this._connectedOptions.forEach(e=>e.selected=this.value===e.value||Array.isArray(this.value)&&this.value.includes(e.value)),this._selectedOptions=[...this.options.filter(e=>e.selected)]}get options(){return this._connectedOptions}get opened(){return this._isPopoverOpen}get noResultFound(){return this._searchText!==""&&this._connectedOptions.every(e=>e.hidden)}get selectedOptions(){return this._selectedOptions}get additionalSelectedOptionCount(){return this._additionalSelectedOptionCount}validityCallback(){if(this.customInvalidText)return this.customInvalidText;let e=document.createElement("select");return e.required=this.required,e.validationMessage}reportValidity(){return this.dirty=!0,this.checkValidity()}resetFormControl(){this.value=this._initialValue}open(){this.searchBar&&setTimeout(()=>{var e,t,l;(l=(t=(e=document.activeElement)==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("input"))==null||l.focus()},100),this._isPopoverOpen=!0,this._setupPopover(),document.addEventListener("click",this._interactOutsideHandler,!0),document.addEventListener("focus",this._interactOutsideHandler,!0)}close(){this._handleSearchOptions({target:{value:""}}),this._isPopoverOpen=!1,this.focusedOptionIndex=-1,this._cleanUpPopover&&this._cleanUpPopover(),document.removeEventListener("click",this._interactOutsideHandler,!0),document.removeEventListener("focus",this._interactOutsideHandler,!0)}_setupPopover(){this._cleanUpPopover=E(this._selectInput,this._popover,()=>{C(this._selectInput,this._popover,{placement:"bottom",strategy:"fixed",middleware:[k(),z(8),$({apply(e){Object.assign(e.elements.floating.style,{width:`${e.elements.reference.getBoundingClientRect().width}px`})}})]}).then(({x:e,y:t})=>{this._popover.style.setProperty("--left",`${e}px`),this._popover.style.setProperty("--top",`${t}px`)})})}connectedCallback(){var e;super.connectedCallback(),(e=this.form)==null||e.addEventListener("submit",t=>{this.reportValidity()||t.preventDefault()})}disconnectedCallback(){super.disconnectedCallback(),this._cleanUpPopover&&this._cleanUpPopover()}inputTemplate(){let e=a`<ul class="selected-options">
|
|
2
|
+
${this._selectedOptions.map(v=>a`<li>${v.getAttribute("label")||v.textContent}</li>`)}
|
|
3
|
+
</ul>`,n=!(this._selectedOptions.length>0&&this._selectedOptions.every(v=>v.disabled))&&(this.clearable||this.multiple)?a`<bl-button
|
|
4
|
+
class="remove-all"
|
|
5
|
+
size="small"
|
|
6
|
+
variant="tertiary"
|
|
7
|
+
kind="neutral"
|
|
8
|
+
icon="close"
|
|
9
|
+
@click=${this._onClickRemove}
|
|
10
|
+
></bl-button>`:"",c=this.searchBar&&this.opened,d=this.multiple&&this._selectedOptions.length>0,r=c||d,u=a`<bl-icon
|
|
11
|
+
class="search-mag-icon"
|
|
12
|
+
name="search"
|
|
13
|
+
style="color: var(--bl-color-primary);font-size: var(--bl-font-size-s)"
|
|
14
|
+
></bl-icon>`,I=a`<bl-icon
|
|
15
|
+
class="search-loading-icon"
|
|
16
|
+
name="loading"
|
|
17
|
+
style="color: var(--bl-color-primary);font-size: var(--bl-font-size-s)"
|
|
18
|
+
></bl-icon>`,y=r?a`<div class="action-divider"></div>`:"",M=a`<fieldset
|
|
19
|
+
class=${b({"select-input":!0,"has-overflowed-options":this._additionalSelectedOptionCount>0})}
|
|
20
|
+
tabindex="${this.disabled?"-1":0}"
|
|
21
|
+
role="button"
|
|
22
|
+
aria-haspopup="listbox"
|
|
23
|
+
aria-expanded="${this.opened}"
|
|
24
|
+
aria-labelledby="label"
|
|
25
|
+
@click=${this.open}
|
|
26
|
+
>
|
|
27
|
+
<legend><span>${this.label}</span></legend>
|
|
28
|
+
|
|
29
|
+
${this._selectedOptions.length>0&&!this.opened?e:a`
|
|
30
|
+
<input
|
|
31
|
+
class="search-bar-input"
|
|
32
|
+
placeholder="${g(this.searchBarPlaceholder||this.label)}"
|
|
33
|
+
@input=${this._handleSearchOptions}
|
|
34
|
+
.value=${this._searchText}
|
|
35
|
+
/>
|
|
36
|
+
`}
|
|
37
|
+
${this.opened?"":a`<span class="additional-selection-count"
|
|
38
|
+
>+${this._additionalSelectedOptionCount}</span
|
|
39
|
+
>`}
|
|
40
|
+
|
|
41
|
+
<div class="actions" @click=${this.togglePopover}>
|
|
42
|
+
${this.opened?this.searchBarLoadingState?I:u:""}
|
|
43
|
+
${this.opened?"":n} ${y}
|
|
44
|
+
<bl-icon class="dropdown-icon open" name="arrow_up"></bl-icon>
|
|
45
|
+
|
|
46
|
+
<bl-icon class="dropdown-icon closed" name="arrow_down"></bl-icon>
|
|
47
|
+
</div>
|
|
48
|
+
</fieldset>`;return this.searchBar?M:a`<fieldset
|
|
49
|
+
class=${b({"select-input":!0,"has-overflowed-options":this._additionalSelectedOptionCount>0})}
|
|
50
|
+
tabindex="${this.disabled?"-1":0}"
|
|
51
|
+
?autofocus=${this.autofocus}
|
|
52
|
+
@click=${this.togglePopover}
|
|
53
|
+
role="button"
|
|
54
|
+
aria-haspopup="listbox"
|
|
55
|
+
aria-expanded="${this.opened}"
|
|
56
|
+
aria-labelledby="label"
|
|
57
|
+
>
|
|
58
|
+
<legend><span>${this.label}</span></legend>
|
|
59
|
+
<span class="placeholder">${this.placeholder}</span>
|
|
60
|
+
<span class="label">${this.label}</span>
|
|
61
|
+
${e}
|
|
62
|
+
<span class="additional-selection-count">+${this._additionalSelectedOptionCount}</span>
|
|
63
|
+
<div class="actions">
|
|
64
|
+
${n} ${y}
|
|
65
|
+
<bl-icon class="dropdown-icon open" name="arrow_up"></bl-icon>
|
|
66
|
+
|
|
67
|
+
<bl-icon class="dropdown-icon closed" name="arrow_down"></bl-icon>
|
|
68
|
+
</div>
|
|
69
|
+
</fieldset>`}selectAllTemplate(){if(!this.multiple||!this.viewSelectAll||this.noResultFound)return null;let e=this._connectedOptions.filter(l=>!l.hidden).every(l=>l.selected),t=this._selectedOptions.filter(l=>!l.hidden).length>0;return a`<bl-checkbox
|
|
70
|
+
class="select-all"
|
|
71
|
+
.checked="${e}"
|
|
72
|
+
.indeterminate="${t&&!e}"
|
|
73
|
+
role="option"
|
|
74
|
+
aria-selected="${e}"
|
|
75
|
+
@bl-checkbox-change="${this._handleSelectAll}"
|
|
76
|
+
>
|
|
77
|
+
${this.selectAllText}
|
|
78
|
+
</bl-checkbox>`}render(){let e=this.checkValidity()?"":a`<p id="errorMessage" aria-live="polite" class="invalid-text">
|
|
79
|
+
${this.validationMessage}
|
|
80
|
+
</p>`,t=this.helpText?a`<p class="help-text">${this.helpText}</p>`:"",l=this.label?a`<label id="label">${this.label}</label>`:"";return a`<div
|
|
81
|
+
class=${b({"select-wrapper":!0,"select-open":this.opened,selected:this._selectedOptions.length>0,invalid:!this.validity.valid,dirty:this.dirty})}
|
|
82
|
+
@keydown=${this.handleKeydown}
|
|
83
|
+
>
|
|
84
|
+
${l} ${this.inputTemplate()}
|
|
85
|
+
<div
|
|
86
|
+
class="popover"
|
|
87
|
+
tabindex="${g(this._isPopoverOpen?void 0:"-1")}"
|
|
88
|
+
@bl-select-option=${this._handleSelectOptionEvent}
|
|
89
|
+
role="listbox"
|
|
90
|
+
aria-multiselectable="${this.multiple}"
|
|
91
|
+
aria-labelledby="label"
|
|
92
|
+
>
|
|
93
|
+
${this.selectAllTemplate()}
|
|
94
|
+
<slot></slot>
|
|
95
|
+
${this.searchBar&&this.noResultFound?a`<div name="popover-clear-search-text" class="popover-no-result">
|
|
96
|
+
<span>${this.searchNotFoundText}</span>
|
|
97
|
+
<bl-button
|
|
98
|
+
variant="tertiary"
|
|
99
|
+
@click=${()=>{this._handleSearchOptions({target:{value:""}})}}
|
|
100
|
+
>${this.popoverClearSearchText}</bl-button
|
|
101
|
+
>
|
|
102
|
+
</div>`:""}
|
|
103
|
+
</div>
|
|
104
|
+
<div class="hint">${e} ${t}</div>
|
|
105
|
+
</div> `}handleKeydown(e){this.focusedOptionIndex===-1&&["Enter","Space"].includes(e.code)?(this.togglePopover(),e.preventDefault()):this._isPopoverOpen===!1&&["ArrowDown","ArrowUp"].includes(e.code)?(this.open(),e.preventDefault()):e.code==="Escape"?(this.close(),e.preventDefault()):this._isPopoverOpen&&["ArrowDown","ArrowUp"].includes(e.code)&&(e.code==="ArrowDown"&&this.focusedOptionIndex++,e.code==="ArrowUp"&&this.focusedOptionIndex--,this.focusedOptionIndex=Math.max(0,Math.min(this.focusedOptionIndex,this.options.length-1)),this.options[this.focusedOptionIndex].focus(),e.preventDefault())}togglePopover(){this._isPopoverOpen?this.close():this.open()}_handleSelectEvent(){let e=this._selectedOptions.map(t=>({value:t.value,selected:t.selected,text:t.textContent}));this.multiple?this._onBlSelect(e):this._onBlSelect(e[0])}_handleSearchEvent(){this._onBlSearch(this._searchText)}_handleSearchOptions(e){this.searchBar&&(this._searchText=e.target.value,this._handleSearchEvent(),this._connectedOptions.forEach(t=>{var n;let l=(n=t.textContent)==null?void 0:n.toLowerCase().includes(this._searchText.toLowerCase());t.hidden=!l}),this._selectedOptions=this.options.filter(t=>t.selected),this._handleLastVisibleSearchedOption(),this.requestUpdate())}_handleLastVisibleSearchedOption(){var t,l;let e=[...this.options].reverse().find(n=>!n.hidden);e&&((l=(t=e==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("div"))==null||l.classList.add("no-border-bottom")),this.options.map(n=>{var c,d;!n.hidden&&n!==e&&((d=(c=n.shadowRoot)==null?void 0:c.querySelector("div"))==null||d.classList.remove("no-border-bottom"))})}_handleSingleSelect(e){this.value=e.value,this._handleSelectEvent(),this._isPopoverOpen=!1}_handleMultipleSelect(){this.value=this._connectedOptions.filter(e=>e.selected).map(e=>e.value),this._handleSelectEvent()}_handleSelectOptionEvent(e){let t=e.target;this.dirty=!0,this.multiple?this._handleMultipleSelect():this._handleSingleSelect(t)}_handleSelectAll(e){var d;let t=(d=this.shadowRoot)==null?void 0:d.querySelector(".select-all"),l=e.detail,c=this._connectedOptions.filter(r=>!r.selected&&!r.hidden).every(r=>r.disabled);if(l&&c){setTimeout(()=>{var u;let r=(u=t==null?void 0:t.shadowRoot)==null?void 0:u.querySelector("input");r==null||r.click()},0);return}this._connectedOptions.forEach(r=>{r.disabled||r.hidden||(r.selected=l)}),this._handleMultipleSelect()}_onClickRemove(e){e.stopPropagation();let t=this._selectedOptions.filter(l=>l.disabled);this._connectedOptions.filter(l=>!l.disabled&&l.selected).forEach(l=>{l.selected=!1}),this.value=t.length?t.map(l=>l.value):null,this._handleSelectEvent()}_checkAdditionalItemCount(){if(!this.multiple||!this.selectedOptionsItems||this.selectedOptionsItems.length<2){this._additionalSelectedOptionCount=0;return}let e=[...this.selectedOptionsItems].findIndex(t=>t.offsetLeft>this.selectedOptionsContainer.offsetWidth);e>-1?this._additionalSelectedOptionCount=this.selectedOptionsItems.length-e:this._additionalSelectedOptionCount=0}firstUpdated(){this.value===void 0&&(this.value=""),this._initialValue=this._value}updated(e){e.has("multiple")&&typeof e.get("multiple")=="boolean"&&(this.value=null),e.has("_selectedOptions")&&this._checkAdditionalItemCount()}registerOption(e){this._connectedOptions.push(e),e.selected&&(this.multiple?(Array.isArray(this.value)||(this.value=[]),this.value=[...this.value,e.value]):this.value=e.value),this.setOptionsSelected(),this.requestUpdate()}unregisterOption(e){this._connectedOptions.splice(this._connectedOptions.indexOf(e),1)}};i.shadowRootOptions={...f.shadowRootOptions,delegatesFocus:!0},i.formControlValidators=[T],o([s()],i.prototype,"name",2),o([s()],i.prototype,"value",1),o([s({reflect:!0})],i.prototype,"label",2),o([s({reflect:!0})],i.prototype,"placeholder",2),o([s({type:String,reflect:!0})],i.prototype,"size",2),o([s({type:Boolean,reflect:!0})],i.prototype,"required",2),o([s({type:Boolean,reflect:!0})],i.prototype,"disabled",2),o([s({type:Boolean,reflect:!0})],i.prototype,"clearable",2),o([s({type:Boolean,reflect:!0})],i.prototype,"multiple",2),o([s({type:Boolean,reflect:!0})],i.prototype,"autofocus",2),o([s({type:Boolean,attribute:"label-fixed",reflect:!0})],i.prototype,"labelFixed",2),o([s({type:String,attribute:"help-text",reflect:!0})],i.prototype,"helpText",2),o([s({type:String,attribute:"invalid-text",reflect:!0})],i.prototype,"customInvalidText",2),o([s({type:Boolean,attribute:"view-select-all"})],i.prototype,"viewSelectAll",2),o([s({type:String,attribute:"select-all-text"})],i.prototype,"selectAllText",2),o([s({type:Boolean,attribute:"search-bar",reflect:!0})],i.prototype,"searchBar",2),o([s({type:String,attribute:"search-bar-placeholder",reflect:!0})],i.prototype,"searchBarPlaceholder",2),o([s({type:Boolean,attribute:"search-bar-loading-state",converter:w()})],i.prototype,"searchBarLoadingState",2),o([s({type:String,attribute:"search-not-found-text",reflect:!0})],i.prototype,"searchNotFoundText",2),o([s({type:String,attribute:"popover-clear-search-text",reflect:!0})],i.prototype,"popoverClearSearchText",2),o([p()],i.prototype,"_isPopoverOpen",2),o([p()],i.prototype,"_additionalSelectedOptionCount",2),o([p()],i.prototype,"_searchText",2),o([h(".selected-options")],i.prototype,"selectedOptionsContainer",2),o([O(".selected-options li")],i.prototype,"selectedOptionsItems",2),o([h(".popover")],i.prototype,"_popover",2),o([h(".select-input")],i.prototype,"_selectInput",2),o([m("bl-select")],i.prototype,"_onBlSelect",2),o([m("bl-search")],i.prototype,"_onBlSearch",2),o([p()],i.prototype,"_selectedOptions",2),o([p()],i.prototype,"dirty",2),o([h(".select-input")],i.prototype,"validationTarget",2),i=o([_("bl-select")],i);export{i as a};
|
|
106
|
+
//# sourceMappingURL=chunk-LDGSM7XL.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/select/bl-select.css", "../src/components/select/bl-select.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size=\"large\"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size=\"small\"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:\", \"}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:\"\";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, PropertyValues } from \"lit\";\nimport { customElement, property, query, queryAll, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { autoUpdate, computePosition, flip, MiddlewareState, offset, size } from \"@floating-ui/dom\";\nimport { FormControlMixin, requiredValidator } from \"@open-wc/form-control\";\nimport { FormValue } from \"@open-wc/form-helpers\";\nimport \"element-internals-polyfill\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport { stringBooleanConverter } from \"../../utilities/string-boolean.converter\";\nimport BlCheckbox from \"../checkbox-group/checkbox/bl-checkbox\";\nimport \"../icon/bl-icon\";\nimport style from \"../select/bl-select.css\";\nimport \"../select/option/bl-select-option\";\nimport type BlSelectOption from \"./option/bl-select-option\";\n\nexport interface ISelectOption<T = string> {\n value: T;\n text: string;\n selected: boolean;\n}\n\nexport type SelectSize = \"medium\" | \"large\" | \"small\";\n\nexport type CleanUpFunction = () => void;\n\n/**\n * @tag bl-select\n * @summary Baklava Select component\n *\n * @cssproperty [--bl-popover-position=fixed] Sets the positioning strategy of select popover. You can set it as `absolute` if you need to show popover relative to its trigger element.\n */\n@customElement(\"bl-select\")\nexport default class BlSelect<ValueType extends FormValue = string> extends FormControlMixin(\n LitElement\n) {\n static get styles(): CSSResultGroup {\n return [style];\n }\n static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n static formControlValidators = [requiredValidator];\n\n /**\n * Sets name of the select field\n */\n @property()\n name: string;\n\n private _value: ValueType | ValueType[] | null;\n\n private _initialValue: ValueType | ValueType[] | null;\n\n /**\n * Sets the value of the select\n */\n @property()\n get value(): ValueType | ValueType[] | null {\n return this._value;\n }\n\n set value(val: ValueType | ValueType[] | null) {\n this._value = val;\n\n if (Array.isArray(val)) {\n const formData = new FormData();\n\n val.forEach(option => formData.append(this.name, `${option}`));\n this.setValue(formData);\n } else {\n this.setValue(val);\n }\n\n this.setOptionsSelected();\n }\n\n shouldFormValueUpdate(): boolean {\n return this.value !== null && this.value !== \"\";\n }\n\n /* Declare reactive properties */\n /**\n * Sets the label value\n */\n @property({ reflect: true })\n label?: string;\n\n /**\n * Sets the placeholder value. If left blank, the label value (if specified) is set as placeholder.\n */\n @property({ reflect: true })\n placeholder?: string;\n\n /**\n * Sets the size value. Select component's height value will be changed accordingly\n */\n @property({ type: String, reflect: true })\n size: SelectSize = \"medium\";\n\n /**\n * When option is not selected, shows component in error state\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Shows the component in disabled state.\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Sets whether the selected option is clearable\n */\n @property({ type: Boolean, reflect: true })\n clearable = false;\n\n /**\n * Allows multiple options to be selected\n */\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /**\n * Sets input to get keyboard focus automatically\n */\n @property({ type: Boolean, reflect: true })\n autofocus = false;\n\n /**\n * Makes label as fixed positioned\n */\n @property({ type: Boolean, attribute: \"label-fixed\", reflect: true })\n labelFixed = false;\n\n /**\n * Adds help text\n */\n @property({ type: String, attribute: \"help-text\", reflect: true })\n helpText?: string;\n\n /**\n * Set custom error message\n */\n @property({ type: String, attribute: \"invalid-text\", reflect: true })\n customInvalidText?: string;\n\n /**\n * Views select all option in multiple select\n */\n @property({ type: Boolean, attribute: \"view-select-all\" })\n viewSelectAll = false;\n\n /**\n * Sets select all text in multiple select\n */\n @property({ type: String, attribute: \"select-all-text\" })\n selectAllText = \"Select All\";\n\n /**\n * Enable search functionality for the options within the list\n */\n @property({ type: Boolean, attribute: \"search-bar\", reflect: true })\n searchBar = false;\n\n /**\n * Search for text variations such as \"search,\" \"searching,\" \"search by country,\" and so on\n */\n @property({ type: String, attribute: \"search-bar-placeholder\", reflect: true })\n searchBarPlaceholder?: string;\n\n /**\n * Display a loading icon in place of the search icon.\n */\n @property({\n type: Boolean,\n attribute: \"search-bar-loading-state\",\n converter: stringBooleanConverter(),\n })\n searchBarLoadingState = false;\n\n /**\n * Text to display when no search results are found.\n */\n @property({ type: String, attribute: \"search-not-found-text\", reflect: true })\n searchNotFoundText = \"No Data Found\";\n\n /**\n * Text to display on the clear search button.\n */\n @property({ type: String, attribute: \"popover-clear-search-text\", reflect: true })\n popoverClearSearchText = \"Clear Search\";\n\n /* Declare internal reactive properties */\n @state()\n private _isPopoverOpen = false;\n\n @state()\n private _additionalSelectedOptionCount = 0;\n\n @state()\n private _searchText = \"\";\n\n @query(\".selected-options\")\n private selectedOptionsContainer!: HTMLElement;\n\n @queryAll(\".selected-options li\")\n private selectedOptionsItems!: NodeListOf<HTMLElement>;\n\n @query(\".popover\")\n private _popover: HTMLElement;\n\n @query(\".select-input\")\n private _selectInput: HTMLElement;\n\n /**\n * Fires when selection changes\n */\n @event(\"bl-select\") private _onBlSelect: EventDispatcher<\n ISelectOption<ValueType>[] | ISelectOption<ValueType>\n >;\n\n /**\n * Fires when search text changes\n */\n @event(\"bl-search\") private _onBlSearch: EventDispatcher<string>;\n\n private _connectedOptions: BlSelectOption<ValueType>[] = [];\n\n private _cleanUpPopover: CleanUpFunction | null = null;\n\n private setOptionsSelected() {\n this._connectedOptions.forEach(\n option =>\n (option.selected =\n this.value === option.value ||\n (Array.isArray(this.value) && this.value.includes(option.value)))\n );\n\n this._selectedOptions = [...this.options.filter(option => option.selected)];\n }\n\n get options() {\n return this._connectedOptions;\n }\n\n get opened() {\n return this._isPopoverOpen;\n }\n\n get noResultFound() {\n return this._searchText !== \"\" && this._connectedOptions.every(option => option.hidden);\n }\n\n @state()\n private _selectedOptions: BlSelectOption<ValueType>[] = [];\n\n @state()\n private dirty = false;\n\n get selectedOptions(): BlSelectOption<ValueType>[] {\n return this._selectedOptions;\n }\n\n get additionalSelectedOptionCount() {\n return this._additionalSelectedOptionCount;\n }\n\n validityCallback(): string | void {\n if (this.customInvalidText) {\n return this.customInvalidText;\n }\n const select = document.createElement(\"select\");\n\n select.required = this.required;\n\n return select.validationMessage;\n }\n\n reportValidity() {\n this.dirty = true;\n return this.checkValidity();\n }\n\n resetFormControl(): void {\n this.value = this._initialValue;\n }\n\n @query(\".select-input\")\n validationTarget: HTMLElement;\n\n open() {\n if (this.searchBar) {\n setTimeout(() => {\n document.activeElement?.shadowRoot?.querySelector(\"input\")?.focus();\n }, 100);\n }\n\n this._isPopoverOpen = true;\n this._setupPopover();\n document.addEventListener(\"click\", this._interactOutsideHandler, true);\n document.addEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n close() {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n\n this._isPopoverOpen = false;\n this.focusedOptionIndex = -1;\n this._cleanUpPopover && this._cleanUpPopover();\n document.removeEventListener(\"click\", this._interactOutsideHandler, true);\n document.removeEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n private _interactOutsideHandler = (event: MouseEvent | FocusEvent) => {\n const eventPath = event.composedPath() as HTMLElement[];\n\n if (!eventPath?.find(el => el.tagName === \"BL-SELECT\")?.contains(this)) {\n this.close();\n }\n };\n\n private _setupPopover() {\n this._cleanUpPopover = autoUpdate(this._selectInput, this._popover, () => {\n computePosition(this._selectInput, this._popover, {\n placement: \"bottom\",\n strategy: \"fixed\",\n middleware: [\n flip(),\n offset(8),\n size({\n apply(args: MiddlewareState) {\n Object.assign(args.elements.floating.style, {\n width: `${args.elements.reference.getBoundingClientRect().width}px`,\n });\n },\n }),\n ],\n }).then(({ x, y }) => {\n this._popover.style.setProperty(\"--left\", `${x}px`);\n this._popover.style.setProperty(\"--top\", `${y}px`);\n });\n });\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this.form?.addEventListener(\"submit\", (e: SubmitEvent) => {\n if (!this.reportValidity()) {\n e.preventDefault();\n }\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n this._cleanUpPopover && this._cleanUpPopover();\n }\n\n private inputTemplate() {\n const inputSelectedOptions = html`<ul class=\"selected-options\">\n ${this._selectedOptions.map(\n item => html`<li>${item.getAttribute(\"label\") || item.textContent}</li>`\n )}\n </ul>`;\n\n const isAllSelectedDisabled =\n this._selectedOptions.length > 0 && this._selectedOptions.every(option => option.disabled);\n const isRemoveButtonShown = !isAllSelectedDisabled && (this.clearable || this.multiple);\n const removeButton = isRemoveButtonShown\n ? html`<bl-button\n class=\"remove-all\"\n size=\"small\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"close\"\n @click=${this._onClickRemove}\n ></bl-button>`\n : \"\";\n\n const isSearchBarVisible = this.searchBar && this.opened;\n const isMultipleWithSelection = this.multiple && this._selectedOptions.length > 0;\n\n const isDividerShown = isSearchBarVisible || isMultipleWithSelection;\n\n const searchMagIcon = html`<bl-icon\n class=\"search-mag-icon\"\n name=\"search\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const searchLoadingIcon = html`<bl-icon\n class=\"search-loading-icon\"\n name=\"loading\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const actionDivider = isDividerShown ? html`<div class=\"action-divider\"></div>` : \"\";\n\n const search = html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${this.disabled ? \"-1\" : 0}\"\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n @click=${this.open}\n >\n <legend><span>${this.label}</span></legend>\n\n ${this._selectedOptions.length > 0 && !this.opened\n ? inputSelectedOptions\n : html`\n <input\n class=\"search-bar-input\"\n placeholder=\"${ifDefined(this.searchBarPlaceholder || this.label)}\"\n @input=${this._handleSearchOptions}\n .value=${this._searchText}\n />\n `}\n ${!this.opened\n ? html`<span class=\"additional-selection-count\"\n >+${this._additionalSelectedOptionCount}</span\n >`\n : \"\"}\n\n <div class=\"actions\" @click=${this.togglePopover}>\n ${this.opened ? (this.searchBarLoadingState ? searchLoadingIcon : searchMagIcon) : \"\"}\n ${!this.opened ? removeButton : \"\"} ${actionDivider}\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </fieldset>`;\n\n return this.searchBar\n ? search\n : html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${this.disabled ? \"-1\" : 0}\"\n ?autofocus=${this.autofocus}\n @click=${this.togglePopover}\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n >\n <legend><span>${this.label}</span></legend>\n <span class=\"placeholder\">${this.placeholder}</span>\n <span class=\"label\">${this.label}</span>\n ${inputSelectedOptions}\n <span class=\"additional-selection-count\">+${this._additionalSelectedOptionCount}</span>\n <div class=\"actions\">\n ${removeButton} ${actionDivider}\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </fieldset>`;\n }\n\n selectAllTemplate() {\n if (!this.multiple || !this.viewSelectAll || this.noResultFound) {\n return null;\n }\n\n const isAllRenderedOptionsSelected = this._connectedOptions\n .filter(option => !option.hidden)\n .every(option => option.selected);\n const isAnySelected = this._selectedOptions.filter(option => !option.hidden).length > 0;\n\n return html`<bl-checkbox\n class=\"select-all\"\n .checked=\"${isAllRenderedOptionsSelected}\"\n .indeterminate=\"${isAnySelected && !isAllRenderedOptionsSelected}\"\n role=\"option\"\n aria-selected=\"${isAllRenderedOptionsSelected}\"\n @bl-checkbox-change=\"${this._handleSelectAll}\"\n >\n ${this.selectAllText}\n </bl-checkbox>`;\n }\n\n render() {\n const invalidMessage = !this.checkValidity()\n ? html`<p id=\"errorMessage\" aria-live=\"polite\" class=\"invalid-text\">\n ${this.validationMessage}\n </p>`\n : \"\";\n\n const helpMessage = this.helpText ? html`<p class=\"help-text\">${this.helpText}</p>` : \"\";\n\n const label = this.label ? html`<label id=\"label\">${this.label}</label>` : \"\";\n\n return html`<div\n class=${classMap({\n \"select-wrapper\": true,\n \"select-open\": this.opened,\n \"selected\": this._selectedOptions.length > 0,\n \"invalid\": !this.validity.valid,\n \"dirty\": this.dirty,\n })}\n @keydown=${this.handleKeydown}\n >\n ${label} ${this.inputTemplate()}\n <div\n class=\"popover\"\n tabindex=\"${ifDefined(this._isPopoverOpen ? undefined : \"-1\")}\"\n @bl-select-option=${this._handleSelectOptionEvent}\n role=\"listbox\"\n aria-multiselectable=\"${this.multiple}\"\n aria-labelledby=\"label\"\n >\n ${this.selectAllTemplate()}\n <slot></slot>\n ${this.searchBar && this.noResultFound\n ? html`<div name=\"popover-clear-search-text\" class=\"popover-no-result\">\n <span>${this.searchNotFoundText}</span>\n <bl-button\n variant=\"tertiary\"\n @click=${() => {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n }}\n >${this.popoverClearSearchText}</bl-button\n >\n </div>`\n : \"\"}\n </div>\n <div class=\"hint\">${invalidMessage} ${helpMessage}</div>\n </div> `;\n }\n\n private focusedOptionIndex = -1;\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.focusedOptionIndex === -1 && [\"Enter\", \"Space\"].includes(event.code)) {\n this.togglePopover();\n event.preventDefault();\n } else if (this._isPopoverOpen === false && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n this.open();\n event.preventDefault();\n } else if (event.code === \"Escape\") {\n this.close();\n event.preventDefault();\n } else if (this._isPopoverOpen && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n event.code === \"ArrowDown\" && this.focusedOptionIndex++;\n event.code === \"ArrowUp\" && this.focusedOptionIndex--;\n\n // Don't exceed array indexes\n this.focusedOptionIndex = Math.max(\n 0,\n Math.min(this.focusedOptionIndex, this.options.length - 1)\n );\n\n this.options[this.focusedOptionIndex].focus();\n\n event.preventDefault();\n }\n }\n\n private togglePopover() {\n this._isPopoverOpen ? this.close() : this.open();\n }\n\n private _handleSelectEvent() {\n const options = this._selectedOptions.map(\n option =>\n ({\n value: option.value,\n selected: option.selected,\n text: option.textContent,\n } as ISelectOption<ValueType>)\n );\n\n if (!this.multiple) this._onBlSelect(options[0]);\n else this._onBlSelect(options);\n }\n\n private _handleSearchEvent() {\n this._onBlSearch(this._searchText);\n }\n\n private _handleSearchOptions(e: InputEvent): void {\n if (!this.searchBar) return;\n\n this._searchText = (e.target as HTMLInputElement).value;\n\n this._handleSearchEvent();\n\n this._connectedOptions.forEach(option => {\n const isVisible = option.textContent?.toLowerCase().includes(this._searchText.toLowerCase());\n\n option.hidden = !isVisible;\n });\n\n this._selectedOptions = this.options.filter(option => option.selected);\n\n this._handleLastVisibleSearchedOption();\n\n this.requestUpdate();\n }\n\n private _handleLastVisibleSearchedOption() {\n const lastVisibleOption = [...this.options].reverse().find(option => !option.hidden);\n\n if (lastVisibleOption) {\n lastVisibleOption?.shadowRoot?.querySelector(\"div\")?.classList.add(\"no-border-bottom\");\n }\n\n this.options.map(option => {\n if (!option.hidden && option !== lastVisibleOption) {\n option.shadowRoot?.querySelector(\"div\")?.classList.remove(\"no-border-bottom\");\n }\n });\n }\n\n private _handleSingleSelect(optionItem: BlSelectOption<ValueType>) {\n this.value = optionItem.value;\n\n this._handleSelectEvent();\n this._isPopoverOpen = false;\n }\n\n private _handleMultipleSelect() {\n this.value = this._connectedOptions\n .filter(option => option.selected)\n .map(option => option.value);\n\n this._handleSelectEvent();\n }\n\n private _handleSelectOptionEvent(e: CustomEvent) {\n const optionItem = e.target as BlSelectOption<ValueType>;\n\n this.dirty = true;\n\n if (this.multiple) {\n this._handleMultipleSelect();\n } else {\n this._handleSingleSelect(optionItem);\n }\n }\n\n private _handleSelectAll(e: CustomEvent) {\n const selectAllEl = this.shadowRoot?.querySelector(\".select-all\") as BlCheckbox;\n\n const checked = e.detail;\n const unselectedOptions = this._connectedOptions.filter(\n option => !option.selected && !option.hidden\n );\n const isAllUnselectedDisabled = unselectedOptions.every(option => option.disabled);\n\n // If all available options are selected, instead of checking, uncheck all options\n if (checked && isAllUnselectedDisabled) {\n setTimeout(() => {\n const checkbox = selectAllEl?.shadowRoot?.querySelector(\"input\");\n\n checkbox?.click();\n }, 0);\n return;\n }\n\n this._connectedOptions.forEach(option => {\n if (option.disabled || option.hidden) {\n return;\n }\n\n option.selected = checked;\n });\n\n this._handleMultipleSelect();\n }\n\n private _onClickRemove(e: MouseEvent) {\n e.stopPropagation();\n\n const selectedDisabledOptions = this._selectedOptions.filter(option => option.disabled);\n\n this._connectedOptions\n .filter(option => !option.disabled && option.selected)\n .forEach(option => {\n option.selected = false;\n });\n\n this.value = selectedDisabledOptions.length\n ? selectedDisabledOptions.map(option => option.value)\n : null;\n this._handleSelectEvent();\n }\n\n private _checkAdditionalItemCount() {\n if (!this.multiple || !this.selectedOptionsItems || this.selectedOptionsItems.length < 2) {\n this._additionalSelectedOptionCount = 0;\n return;\n }\n\n const firstNonVisibleItemIndex = [...this.selectedOptionsItems].findIndex(\n item => item.offsetLeft > this.selectedOptionsContainer.offsetWidth\n );\n\n if (firstNonVisibleItemIndex > -1) {\n this._additionalSelectedOptionCount =\n this.selectedOptionsItems.length - firstNonVisibleItemIndex;\n } else {\n this._additionalSelectedOptionCount = 0;\n }\n }\n\n protected firstUpdated(): void {\n if (this.value === undefined) {\n this.value = \"\" as ValueType;\n }\n\n this._initialValue = this._value;\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (\n _changedProperties.has(\"multiple\") &&\n typeof _changedProperties.get(\"multiple\") === \"boolean\"\n ) {\n this.value = null;\n }\n\n if (_changedProperties.has(\"_selectedOptions\")) {\n this._checkAdditionalItemCount();\n }\n }\n\n /**\n * This method is used by `bl-select-option` component to register itself to bl-select.\n * @param option BlSelectOption reference to be registered\n */\n registerOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.push(option);\n\n if (option.selected) {\n if (this.multiple) {\n if (!Array.isArray(this.value)) {\n this.value = [];\n }\n this.value = [...this.value, option.value];\n } else {\n this.value = option.value;\n }\n }\n\n this.setOptionsSelected();\n this.requestUpdate();\n }\n\n /**\n * This method is used by `bl-select-option` component to unregister itself from bl-select.\n * @param option BlSelectOption reference to be unregistered\n */\n unregisterOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.splice(this._connectedOptions.indexOf(option), 1);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"bl-select\": BlSelect;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["styles", "i", "bl_select_default", "BlSelect", "FormControlMixin", "s", "event", "_a", "eventPath", "el", "bl_select_default", "val", "formData", "option", "select", "_b", "_c", "autoUpdate", "computePosition", "flip", "offset", "size", "args", "x", "y", "e", "inputSelectedOptions", "item", "removeButton", "isSearchBarVisible", "isMultipleWithSelection", "isDividerShown", "searchMagIcon", "searchLoadingIcon", "actionDivider", "search", "o", "l", "isAllRenderedOptionsSelected", "isAnySelected", "invalidMessage", "helpMessage", "label", "options", "isVisible", "lastVisibleOption", "optionItem", "selectAllEl", "checked", "isAllUnselectedDisabled", "checkbox", "selectedDisabledOptions", "firstNonVisibleItemIndex", "_changedProperties", "requiredValidator", "__decorateClass", "stringBooleanConverter", "t", "i"]
|
|
7
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as h}from"./chunk-GRL4DWKG.js";import{a as c,b as i,c as g}from"./chunk-X2KXJYXQ.js";import{a as o}from"./chunk-DINNT5P2.js";import{a as u,b as s,f as p}from"./chunk-4OT5AMS5.js";import{c as r}from"./chunk-CYCIT2TG.js";var b=u`.pagination{display:flex;flex-wrap:wrap;justify-content:center;max-width:max-content;gap:var(--bl-size-s)}.pagination *{margin:0;padding:0;box-sizing:border-box}.page-container{display:flex;align-items:center}.page-list{display:flex;align-items:center;list-style:none;user-select:none;gap:var(--bl-size-3xs)}.dots{margin:0 var(--bl-size-2xs)}.dots::before{content:" \\B7 \\B7 \\B7";color:var(--bl-color-neutral-darker)}.pagination-helpers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--bl-size-m);color:var(--bl-color-neutral-darker)}.jumper,.select{display:flex;align-items:center;gap:var(--bl-size-2xs)}label{font:var(--bl-font-title-3-medium);font-size:var(--bl-font-size-m);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-m);letter-spacing:0;user-select:none}bl-input{width:62px}bl-select{width:auto}@media only screen and (max-width: 768px){label{display:none}}`,m=b;var t=class extends p{constructor(){super(...arguments);this.currentPage=1;this.totalItems=0;this.itemsPerPage=10;this.hasJumper=!1;this.jumperLabel="Go To";this.hasSelect=!1;this.selectLabel="Show";this.itemsPerPageOptions=[{text:"10 Items",value:10},{text:"25 Items",value:25},{text:"50 Items",value:50},{text:"100 Items",value:100}];this.pages=[]}static get styles(){return[m]}connectedCallback(){super.connectedCallback(),setTimeout(()=>{window==null||window.addEventListener("resize",()=>this._paginate())})}disconnectedCallback(){super.disconnectedCallback(),window==null||window.removeEventListener("resize",this._paginate)}updated(e){(e.has("currentPage")||e.has("itemsPerPage")||e.has("totalItems"))&&this._paginate()}_paginate(){this.pages=[];let e=Math.ceil(Math.abs(this.totalItems/this.itemsPerPage))||1;if(e<=8){this.pages=Array.from(Array(e),(a,l)=>l+1);return}this.pages.push(1),this.currentPage<5?this.pages.push(2,3,4,5,"..."):this.currentPage>=5&&this.currentPage<=e-4?this.pages.push("...",this.currentPage-1,this.currentPage,this.currentPage+1,"..."):this.pages.push("...",e-4,e-3,e-2,e-1),this.pages.push(e)}_changePage(e){let a=this.currentPage;this.currentPage=e,this.onChange({selectedPage:e,prevPage:a,itemsPerPage:this.itemsPerPage})}_pageBack(){this.currentPage!==1&&this._changePage(this.currentPage-1)}_pageForward(){this.currentPage!==this._getLastPage()&&this._changePage(this.currentPage+1)}_getLastPage(){return+this.pages[this.pages.length-1]}_inputHandler(e){e.stopPropagation();let a=+e.target.value,l=a>0?Math.min(this._getLastPage(),a):1;this._changePage(l)}_selectHandler(e){var a;this.itemsPerPage=+((a=e==null?void 0:e.detail
|
|
1
|
+
import{a as h}from"./chunk-GRL4DWKG.js";import{a as c,b as i,c as g}from"./chunk-X2KXJYXQ.js";import{a as o}from"./chunk-DINNT5P2.js";import{a as u,b as s,f as p}from"./chunk-4OT5AMS5.js";import{c as r}from"./chunk-CYCIT2TG.js";var b=u`.pagination{display:flex;flex-wrap:wrap;justify-content:center;max-width:max-content;gap:var(--bl-size-s)}.pagination *{margin:0;padding:0;box-sizing:border-box}.page-container{display:flex;align-items:center}.page-list{display:flex;align-items:center;list-style:none;user-select:none;gap:var(--bl-size-3xs)}.dots{margin:0 var(--bl-size-2xs)}.dots::before{content:" \\B7 \\B7 \\B7";color:var(--bl-color-neutral-darker)}.pagination-helpers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--bl-size-m);color:var(--bl-color-neutral-darker)}.jumper,.select{display:flex;align-items:center;gap:var(--bl-size-2xs)}label{font:var(--bl-font-title-3-medium);font-size:var(--bl-font-size-m);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-m);letter-spacing:0;user-select:none}bl-input{width:62px}bl-select{width:auto}@media only screen and (max-width: 768px){label{display:none}}`,m=b;var t=class extends p{constructor(){super(...arguments);this.currentPage=1;this.totalItems=0;this.itemsPerPage=10;this.hasJumper=!1;this.jumperLabel="Go To";this.hasSelect=!1;this.selectLabel="Show";this.itemsPerPageOptions=[{text:"10 Items",value:10},{text:"25 Items",value:25},{text:"50 Items",value:50},{text:"100 Items",value:100}];this.pages=[]}static get styles(){return[m]}connectedCallback(){super.connectedCallback(),setTimeout(()=>{window==null||window.addEventListener("resize",()=>this._paginate())})}disconnectedCallback(){super.disconnectedCallback(),window==null||window.removeEventListener("resize",this._paginate)}updated(e){(e.has("currentPage")||e.has("itemsPerPage")||e.has("totalItems"))&&this._paginate()}_paginate(){this.pages=[];let e=Math.ceil(Math.abs(this.totalItems/this.itemsPerPage))||1;if(e<=8){this.pages=Array.from(Array(e),(a,l)=>l+1);return}this.pages.push(1),this.currentPage<5?this.pages.push(2,3,4,5,"..."):this.currentPage>=5&&this.currentPage<=e-4?this.pages.push("...",this.currentPage-1,this.currentPage,this.currentPage+1,"..."):this.pages.push("...",e-4,e-3,e-2,e-1),this.pages.push(e)}_changePage(e){let a=this.currentPage;this.currentPage=e,this.onChange({selectedPage:e,prevPage:a,itemsPerPage:this.itemsPerPage})}_pageBack(){this.currentPage!==1&&this._changePage(this.currentPage-1)}_pageForward(){this.currentPage!==this._getLastPage()&&this._changePage(this.currentPage+1)}_getLastPage(){return+this.pages[this.pages.length-1]}_inputHandler(e){e.stopPropagation();let a=+e.target.value,l=a>0?Math.min(this._getLastPage(),a):1;this._changePage(l)}_selectHandler(e){var a;this.itemsPerPage=+((a=e==null?void 0:e.detail)==null?void 0:a.value)||100,this._changePage(1)}_renderSinglePage(e){if(typeof e=="string")return s`<li class="dots"></li>`;let a=this.currentPage===e?"page":void 0;return s` <li>
|
|
2
2
|
<bl-button
|
|
3
3
|
@click="${()=>this._changePage(e)}"
|
|
4
4
|
variant=${this.currentPage===e?"primary":"tertiary"}
|
|
@@ -47,4 +47,4 @@ import{a as h}from"./chunk-GRL4DWKG.js";import{a as c,b as i,c as g}from"./chunk
|
|
|
47
47
|
</div>`:null;return s` <nav class="pagination" aria-label="Pagination">
|
|
48
48
|
${(()=>{if(!(!this.hasSelect&&!this.hasJumper))return s` <div class="pagination-helpers">${e} ${a}</div> `})()} ${this.renderPages()}
|
|
49
49
|
</nav>`}};r([i({attribute:"current-page",type:Number,reflect:!0})],t.prototype,"currentPage",2),r([i({attribute:"total-items",type:Number})],t.prototype,"totalItems",2),r([i({attribute:"items-per-page",type:Number,reflect:!0})],t.prototype,"itemsPerPage",2),r([i({attribute:"has-jumper",type:Boolean})],t.prototype,"hasJumper",2),r([i({attribute:"jumper-label",type:String})],t.prototype,"jumperLabel",2),r([i({attribute:"has-select",type:Boolean})],t.prototype,"hasSelect",2),r([i({attribute:"select-label",type:String})],t.prototype,"selectLabel",2),r([i({type:Array,attribute:!1})],t.prototype,"itemsPerPageOptions",2),r([g()],t.prototype,"pages",2),r([h("bl-change")],t.prototype,"onChange",2),t=r([c("bl-pagination")],t);export{t as a};
|
|
50
|
-
//# sourceMappingURL=chunk-
|
|
50
|
+
//# sourceMappingURL=chunk-TOJWQXBJ.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/components/pagination/bl-pagination.css", "../src/components/pagination/bl-pagination.ts"],
|
|
4
|
-
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`.pagination{display:flex;flex-wrap:wrap;justify-content:center;max-width:max-content;gap:var(--bl-size-s)}.pagination *{margin:0;padding:0;box-sizing:border-box}.page-container{display:flex;align-items:center}.page-list{display:flex;align-items:center;list-style:none;user-select:none;gap:var(--bl-size-3xs)}.dots{margin:0 var(--bl-size-2xs)}.dots::before{content:\" \\\\B7 \\\\B7 \\\\B7\";color:var(--bl-color-neutral-darker)}.pagination-helpers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--bl-size-m);color:var(--bl-color-neutral-darker)}.jumper,.select{display:flex;align-items:center;gap:var(--bl-size-2xs)}label{font:var(--bl-font-title-3-medium);font-size:var(--bl-font-size-m);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-m);letter-spacing:0;user-select:none}bl-input{width:62px}bl-select{width:auto}@media only screen and (max-width: 768px){label{display:none}}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult, PropertyValues } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport \"../button/bl-button\";\nimport \"../input/bl-input\";\nimport \"../select/bl-select\";\nimport style from \"./bl-pagination.css\";\n\n/**\n * @tag bl-pagination\n * @summary Baklava Pagination component\n */\n\n@customElement(\"bl-pagination\")\nexport default class BlPagination extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n /**\n * Sets the current page\n */\n @property({ attribute: \"current-page\", type: Number, reflect: true })\n currentPage = 1;\n\n /**\n * Sets the total items to be paginated\n */\n @property({ attribute: \"total-items\", type: Number })\n totalItems = 0;\n\n /**\n * Sets the number of items per page\n */\n @property({ attribute: \"items-per-page\", type: Number, reflect: true })\n itemsPerPage = 10;\n\n /**\n * Adds jumper element if provided as true\n */\n @property({ attribute: \"has-jumper\", type: Boolean })\n hasJumper = false;\n\n /**\n * Sets the jumper label\n */\n @property({ attribute: \"jumper-label\", type: String })\n jumperLabel = \"Go To\";\n\n /**\n * Adds select element to choose the items per page\n */\n @property({ attribute: \"has-select\", type: Boolean })\n hasSelect = false;\n\n /**\n * Adds select element to choose the items per page\n */\n @property({ attribute: \"select-label\", type: String })\n selectLabel = \"Show\";\n\n /**\n * Sets the items per page options of the select element\n * PROPERTY\n */\n @property({ type: Array, attribute: false })\n itemsPerPageOptions = [\n {\n text: \"10 Items\",\n value: 10,\n },\n {\n text: \"25 Items\",\n value: 25,\n },\n {\n text: \"50 Items\",\n value: 50,\n },\n {\n text: \"100 Items\",\n value: 100,\n },\n ];\n\n @state() private pages: Array<number | string> = [];\n\n /**\n * Fires when the current page changes\n */\n @event(\"bl-change\") private onChange: EventDispatcher<{\n selectedPage: number;\n prevPage: number;\n itemsPerPage: number;\n }>;\n\n connectedCallback() {\n super.connectedCallback();\n\n setTimeout(() => {\n window?.addEventListener(\"resize\", () => this._paginate());\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n window?.removeEventListener(\"resize\", this._paginate);\n }\n\n updated(changedProperties: PropertyValues<this>) {\n if (\n changedProperties.has(\"currentPage\") ||\n changedProperties.has(\"itemsPerPage\") ||\n changedProperties.has(\"totalItems\")\n ) {\n this._paginate();\n }\n }\n\n private _paginate() {\n this.pages = [];\n const pageListLength = Math.ceil(Math.abs(this.totalItems / this.itemsPerPage)) || 1;\n\n if (pageListLength <= 8) {\n this.pages = Array.from(Array(pageListLength), (_, index) => index + 1);\n return;\n }\n\n this.pages.push(1);\n\n if (this.currentPage < 5) {\n this.pages.push(2, 3, 4, 5, \"...\");\n } else if (this.currentPage >= 5 && this.currentPage <= pageListLength - 4) {\n this.pages.push(\"...\", this.currentPage - 1, this.currentPage, this.currentPage + 1, \"...\");\n } else {\n this.pages.push(\n \"...\",\n pageListLength - 4,\n pageListLength - 3,\n pageListLength - 2,\n pageListLength - 1\n );\n }\n\n this.pages.push(pageListLength);\n }\n\n private _changePage(selectedPage: number): void {\n const prevPage = this.currentPage;\n\n this.currentPage = selectedPage;\n\n this.onChange({\n selectedPage,\n prevPage,\n itemsPerPage: this.itemsPerPage,\n });\n }\n\n private _pageBack(): void {\n if (this.currentPage === 1) return;\n this._changePage(this.currentPage - 1);\n }\n\n private _pageForward(): void {\n if (this.currentPage === this._getLastPage()) return;\n this._changePage(this.currentPage + 1);\n }\n\n private _getLastPage(): number {\n return +this.pages[this.pages.length - 1];\n }\n\n private _inputHandler(event: CustomEvent) {\n event.stopPropagation();\n const inputValue = +(event.target as HTMLInputElement).value;\n const newPage = inputValue > 0 ? Math.min(this._getLastPage(), inputValue) : 1;\n\n this._changePage(newPage);\n }\n\n private _selectHandler(event: CustomEvent) {\n this.itemsPerPage = +event?.detail
|
|
5
|
-
"mappings": "oOACO,IAAMA,EAASC,+5BACfC,EAAQF,ECaf,IAAqBG,EAArB,cAA0CC,CAAW,CAArD,kCASE,iBAAc,EAMd,gBAAa,EAMb,kBAAe,GAMf,eAAY,GAMZ,iBAAc,QAMd,eAAY,GAMZ,iBAAc,OAOd,yBAAsB,CACpB,CACE,KAAM,WACN,MAAO,EACT,EACA,CACE,KAAM,WACN,MAAO,EACT,EACA,CACE,KAAM,WACN,MAAO,EACT,EACA,CACE,KAAM,YACN,MAAO,GACT,CACF,EAES,KAAQ,MAAgC,CAAC,EAtElD,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CA+EA,mBAAoB,CAClB,MAAM,kBAAkB,EAExB,WAAW,IAAM,CACf,qBAAQ,iBAAiB,SAAU,IAAM,KAAK,UAAU,EAC1D,CAAC,CACH,CAEA,sBAAuB,CACrB,MAAM,qBAAqB,EAC3B,qBAAQ,oBAAoB,SAAU,KAAK,UAC7C,CAEA,QAAQC,EAAyC,EAE7CA,EAAkB,IAAI,aAAa,GACnCA,EAAkB,IAAI,cAAc,GACpCA,EAAkB,IAAI,YAAY,IAElC,KAAK,UAAU,CAEnB,CAEQ,WAAY,CAClB,KAAK,MAAQ,CAAC,EACd,IAAMC,EAAiB,KAAK,KAAK,KAAK,IAAI,KAAK,WAAa,KAAK,YAAY,CAAC,GAAK,EAEnF,GAAIA,GAAkB,EAAG,CACvB,KAAK,MAAQ,MAAM,KAAK,MAAMA,CAAc,EAAG,CAACC,EAAGC,IAAUA,EAAQ,CAAC,EACtE,OAGF,KAAK,MAAM,KAAK,CAAC,EAEb,KAAK,YAAc,EACrB,KAAK,MAAM,KAAK,EAAG,EAAG,EAAG,EAAG,KAAK,EACxB,KAAK,aAAe,GAAK,KAAK,aAAeF,EAAiB,EACvE,KAAK,MAAM,KAAK,MAAO,KAAK,YAAc,EAAG,KAAK,YAAa,KAAK,YAAc,EAAG,KAAK,EAE1F,KAAK,MAAM,KACT,MACAA,EAAiB,EACjBA,EAAiB,EACjBA,EAAiB,EACjBA,EAAiB,CACnB,EAGF,KAAK,MAAM,KAAKA,CAAc,CAChC,CAEQ,YAAYG,EAA4B,CAC9C,IAAMC,EAAW,KAAK,YAEtB,KAAK,YAAcD,EAEnB,KAAK,SAAS,CACZ,aAAAA,EACA,SAAAC,EACA,aAAc,KAAK,YACrB,CAAC,CACH,CAEQ,WAAkB,CACpB,KAAK,cAAgB,GACzB,KAAK,YAAY,KAAK,YAAc,CAAC,CACvC,CAEQ,cAAqB,CACvB,KAAK,cAAgB,KAAK,aAAa,GAC3C,KAAK,YAAY,KAAK,YAAc,CAAC,CACvC,CAEQ,cAAuB,CAC7B,MAAO,CAAC,KAAK,MAAM,KAAK,MAAM,OAAS,CAAC,CAC1C,CAEQ,cAAcC,EAAoB,CACxCA,EAAM,gBAAgB,EACtB,IAAMC,EAAa,CAAED,EAAM,OAA4B,MACjDE,EAAUD,EAAa,EAAI,KAAK,IAAI,KAAK,aAAa,EAAGA,CAAU,EAAI,EAE7E,KAAK,YAAYC,CAAO,CAC1B,CAEQ,eAAeF,EAAoB,CAtL7C,IAAAG,EAuLI,KAAK,aAAe,GAACA,EAAAH,GAAA,YAAAA,EAAO,
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`.pagination{display:flex;flex-wrap:wrap;justify-content:center;max-width:max-content;gap:var(--bl-size-s)}.pagination *{margin:0;padding:0;box-sizing:border-box}.page-container{display:flex;align-items:center}.page-list{display:flex;align-items:center;list-style:none;user-select:none;gap:var(--bl-size-3xs)}.dots{margin:0 var(--bl-size-2xs)}.dots::before{content:\" \\\\B7 \\\\B7 \\\\B7\";color:var(--bl-color-neutral-darker)}.pagination-helpers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--bl-size-m);color:var(--bl-color-neutral-darker)}.jumper,.select{display:flex;align-items:center;gap:var(--bl-size-2xs)}label{font:var(--bl-font-title-3-medium);font-size:var(--bl-font-size-m);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-m);letter-spacing:0;user-select:none}bl-input{width:62px}bl-select{width:auto}@media only screen and (max-width: 768px){label{display:none}}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult, PropertyValues } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport \"../button/bl-button\";\nimport \"../input/bl-input\";\nimport \"../select/bl-select\";\nimport style from \"./bl-pagination.css\";\n\n/**\n * @tag bl-pagination\n * @summary Baklava Pagination component\n */\n\n@customElement(\"bl-pagination\")\nexport default class BlPagination extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n /**\n * Sets the current page\n */\n @property({ attribute: \"current-page\", type: Number, reflect: true })\n currentPage = 1;\n\n /**\n * Sets the total items to be paginated\n */\n @property({ attribute: \"total-items\", type: Number })\n totalItems = 0;\n\n /**\n * Sets the number of items per page\n */\n @property({ attribute: \"items-per-page\", type: Number, reflect: true })\n itemsPerPage = 10;\n\n /**\n * Adds jumper element if provided as true\n */\n @property({ attribute: \"has-jumper\", type: Boolean })\n hasJumper = false;\n\n /**\n * Sets the jumper label\n */\n @property({ attribute: \"jumper-label\", type: String })\n jumperLabel = \"Go To\";\n\n /**\n * Adds select element to choose the items per page\n */\n @property({ attribute: \"has-select\", type: Boolean })\n hasSelect = false;\n\n /**\n * Adds select element to choose the items per page\n */\n @property({ attribute: \"select-label\", type: String })\n selectLabel = \"Show\";\n\n /**\n * Sets the items per page options of the select element\n * PROPERTY\n */\n @property({ type: Array, attribute: false })\n itemsPerPageOptions = [\n {\n text: \"10 Items\",\n value: 10,\n },\n {\n text: \"25 Items\",\n value: 25,\n },\n {\n text: \"50 Items\",\n value: 50,\n },\n {\n text: \"100 Items\",\n value: 100,\n },\n ];\n\n @state() private pages: Array<number | string> = [];\n\n /**\n * Fires when the current page changes\n */\n @event(\"bl-change\") private onChange: EventDispatcher<{\n selectedPage: number;\n prevPage: number;\n itemsPerPage: number;\n }>;\n\n connectedCallback() {\n super.connectedCallback();\n\n setTimeout(() => {\n window?.addEventListener(\"resize\", () => this._paginate());\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n window?.removeEventListener(\"resize\", this._paginate);\n }\n\n updated(changedProperties: PropertyValues<this>) {\n if (\n changedProperties.has(\"currentPage\") ||\n changedProperties.has(\"itemsPerPage\") ||\n changedProperties.has(\"totalItems\")\n ) {\n this._paginate();\n }\n }\n\n private _paginate() {\n this.pages = [];\n const pageListLength = Math.ceil(Math.abs(this.totalItems / this.itemsPerPage)) || 1;\n\n if (pageListLength <= 8) {\n this.pages = Array.from(Array(pageListLength), (_, index) => index + 1);\n return;\n }\n\n this.pages.push(1);\n\n if (this.currentPage < 5) {\n this.pages.push(2, 3, 4, 5, \"...\");\n } else if (this.currentPage >= 5 && this.currentPage <= pageListLength - 4) {\n this.pages.push(\"...\", this.currentPage - 1, this.currentPage, this.currentPage + 1, \"...\");\n } else {\n this.pages.push(\n \"...\",\n pageListLength - 4,\n pageListLength - 3,\n pageListLength - 2,\n pageListLength - 1\n );\n }\n\n this.pages.push(pageListLength);\n }\n\n private _changePage(selectedPage: number): void {\n const prevPage = this.currentPage;\n\n this.currentPage = selectedPage;\n\n this.onChange({\n selectedPage,\n prevPage,\n itemsPerPage: this.itemsPerPage,\n });\n }\n\n private _pageBack(): void {\n if (this.currentPage === 1) return;\n this._changePage(this.currentPage - 1);\n }\n\n private _pageForward(): void {\n if (this.currentPage === this._getLastPage()) return;\n this._changePage(this.currentPage + 1);\n }\n\n private _getLastPage(): number {\n return +this.pages[this.pages.length - 1];\n }\n\n private _inputHandler(event: CustomEvent) {\n event.stopPropagation();\n const inputValue = +(event.target as HTMLInputElement).value;\n const newPage = inputValue > 0 ? Math.min(this._getLastPage(), inputValue) : 1;\n\n this._changePage(newPage);\n }\n\n private _selectHandler(event: CustomEvent) {\n this.itemsPerPage = +event?.detail?.value || 100;\n this._changePage(1);\n }\n\n private _renderSinglePage(page: number | string) {\n if (typeof page === \"string\") {\n return html`<li class=\"dots\"></li>`;\n }\n const ariaCurrent = this.currentPage === page ? \"page\" : undefined;\n\n return html` <li>\n <bl-button\n @click=\"${() => this._changePage(page)}\"\n variant=${this.currentPage === page ? \"primary\" : \"tertiary\"}\n kind=\"neutral\"\n label=\"Page ${page}\"\n aria-current=${ifDefined(ariaCurrent)}\n >\n ${page}\n </bl-button>\n </li>`;\n }\n\n private renderPages() {\n return html`\n <div class=\"page-container\">\n <bl-button\n @click=\"${this._pageBack}\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"arrow_left\"\n class=\"previous\"\n label=\"Previous\"\n ?disabled=${this.currentPage === 1}\n ></bl-button>\n <ul class=\"page-list\">\n ${window.innerWidth < 768\n ? html`${this._renderSinglePage(this.currentPage)}`\n : this.pages.map(page => html`${this._renderSinglePage(page)}`)}\n </ul>\n <bl-button\n @click=\"${this._pageForward}\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"arrow_right\"\n class=\"next\"\n label=\"Next\"\n ?disabled=${this.currentPage === this._getLastPage()}\n ></bl-button>\n </div>\n `;\n }\n\n render(): TemplateResult {\n const selectEl = this.hasSelect\n ? html`\n <div class=\"select\">\n <label>${this.selectLabel}</label>\n <bl-select @bl-select=\"${this._selectHandler}\" .value=${this.itemsPerPage} required>\n ${this.itemsPerPageOptions.map(option => {\n return html`<bl-select-option .value=${option.value}\n >${option.text}</bl-select-option\n >`;\n })}\n </bl-select>\n </div>\n `\n : null;\n\n const jumperEl = this.hasJumper\n ? html` <div class=\"jumper\">\n <label>${this.jumperLabel}</label>\n <bl-input .value=\"${this.currentPage}\" @bl-change=\"${this._inputHandler}\"></bl-input>\n </div>`\n : null;\n\n const getHelperElements = () => {\n if (!this.hasSelect && !this.hasJumper) return;\n return html` <div class=\"pagination-helpers\">${selectEl} ${jumperEl}</div> `;\n };\n\n return html` <nav class=\"pagination\" aria-label=\"Pagination\">\n ${getHelperElements()} ${this.renderPages()}\n </nav>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"bl-pagination\": BlPagination;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["styles", "i", "bl_pagination_default", "BlPagination", "s", "bl_pagination_default", "changedProperties", "pageListLength", "_", "index", "selectedPage", "prevPage", "event", "inputValue", "newPage", "_a", "page", "x", "ariaCurrent", "l", "selectEl", "option", "jumperEl", "__decorateClass", "e", "t"]
|
|
7
7
|
}
|