jb-select 2.0.2 → 2.0.3
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/JBSelect.js +65 -57
- package/dist/JBSelect.js.map +1 -1
- package/lib/JBSelect.js +64 -56
- package/package.json +1 -1
package/dist/JBSelect.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
var HTML = "<div class=\"jb-select-web-component\">\r\n <label class=\"--hide\"><span class=\"label-value\"></span><span>:</span></label>\r\n <div class=\"select-box\">\r\n <div class=\"selected-value-wrapper\">\r\n \r\n </div>\r\n <div class=\"front-box\">\r\n <input class=\"input\">\r\n <div class=\"arrow-icon\"></div>\r\n </div>\r\n </div>\r\n <div class=\"select-list-wrapper\">\r\n <div class=\"select-list\" tabindex=\"-1\">\r\n\r\n </div>\r\n </div>\r\n <div class=\"message-box\"></div>\r\n</div>";
|
|
2
2
|
|
|
3
|
-
var css_248z = ".jb-select-web-component {\n width: var(--jb-select-width, 100%);\n margin: var(--jb-select-margin, 12px 0);\n position: relative;\n box-sizing: border-box;\n}\n@media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component.--focused {\n position: absolute;\n top: 0;\n left: 0;\n background-color: #0008;\n width: 100vw;\n height: 100vh;\n margin: 0;\n padding: 16px 8px;\n z-index: 900;\n }\n}\n@media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component.--focused .select-list-wrapper {\n position: initial;\n margin: 16px 0;\n border-radius: var(--jb-select-border-radius, 16px);\n }\n}\n@media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component.--focused label {\n color: #fff;\n font-size: 1.5em;\n }\n}\n.jb-select-web-component.--has-value .select-box {\n border-color: var(--jb-select-border-color-selected, #c3ff14);\n background-color: var(--jb-select-bgcolor-selected, #f7f6f6);\n}\n.jb-select-web-component label {\n width: 100%;\n margin: 4px 0px;\n display: block;\n font-size: 0.8em;\n color: var(--jb-select-label-color, #1f1735);\n}\n.jb-select-web-component label.--hide {\n display: none;\n}\n.jb-select-web-component .select-box {\n width: 100%;\n box-sizing: border-box;\n height: var(--jb-select-height, 40px);\n border: solid var(--jb-select-border-width, 1px) var(--jb-select-border-color, #f7f6f6);\n background-color: var(--jb-select-bgcolor, #f7f6f6);\n border-bottom: solid var(--jb-select-border-bottom-width, 3px) var(--jb-select-border-color, #f7f6f6);\n border-radius: var(--jb-select-border-radius, 16px);\n margin: 4px 0px;\n overflow: hidden;\n display: flex;\n justify-content: space-between;\n padding-inline-end: 16px;\n gap: 8px;\n position: relative;\n}\n.jb-select-web-component .select-box:focus-within {\n border-color: var(--jb-select-border-color, #1e2832);\n border-bottom-color: var(--jb-select-border-color, #f7f6f6);\n border-radius: var(--jb-select-border-radius, 16px) var(--jb-select-border-radius, 16px) 0 0;\n}\n@media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component .select-box:focus-within {\n border-radius: var(--jb-select-border-radius, 16px);\n border-bottom-color: var(--jb-select-border-color, #1e2832);\n }\n}\n.jb-select-web-component .select-box .selected-value-wrapper {\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n overflow: hidden;\n z-index: 1;\n}\n.jb-select-web-component .select-box .selected-value-wrapper.--search-typed {\n opacity: 0;\n}\n.jb-select-web-component .select-box .selected-value-wrapper .selected-value {\n width: 100%;\n box-sizing: border-box;\n height: 100%;\n background-color: transparent;\n padding: 2px 12px 0 12px;\n display: block;\n font-family: inherit;\n font-size: 1.1em;\n color: var(--jb-select-selected-value-color, #1f1735);\n margin: 0;\n border-radius: 0;\n display: flex;\n align-items: center;\n}\n.jb-select-web-component .select-box:focus-within .selected-value {\n opacity: 0.7;\n transition: all 0.3s ease;\n}\n.jb-select-web-component .select-box .front-box {\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n overflow: hidden;\n z-index: 2;\n}\n.jb-select-web-component .select-box .front-box input {\n border: none;\n width: 100%;\n box-sizing: border-box;\n height: 100%;\n background-color: transparent;\n padding: 2px 12px 0 12px;\n display: block;\n font-family: inherit;\n font-size: 1.1em;\n color: var(--jb-select-input-color, #1f1735);\n margin: 0;\n border-radius: 0;\n}\n.jb-select-web-component .select-box .front-box input:focus {\n outline: none;\n}\n.jb-select-web-component .select-box .front-box .arrow-icon {\n width: 8px;\n height: 100%;\n background-image: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 494.1 371.1' style='enable-background:new 0 0 494.1 371.1;' xml:space='preserve'><path d='M293,343.8L480.9,69.3c8.7-12.7,13.3-25.4,13.3-36.1c0-20.5-16.5-33.2-44-33.2H44C16.4,0,0,12.7,0,33.2 c0,10.6,4.6,23.2,13.3,35.9l187.9,274.6c12.1,17.7,28.4,27.4,45.9,27.4C264.6,371.1,280.9,361.4,293,343.8z'/></svg>\");\n background-position: end;\n background-repeat: no-repeat;\n background-position-x: 0;\n background-position-y: center;\n}\n.jb-select-web-component .message-box {\n font-size: 0.7em;\n padding: 2px 8px;\n color: #929292;\n}\n.jb-select-web-component .message-box:empty {\n padding: 0;\n}\n.jb-select-web-component .message-box.--error {\n color: red;\n}\n.jb-select-web-component .select-list-wrapper {\n display: none;\n position: absolute;\n margin: -6px 0;\n height: auto;\n overflow: hidden;\n width: 100%;\n background-color: var(--jb-select-bgcolor, #f7f6f6);\n border-radius: 0 0 var(--jb-select-border-radius, 16px) var(--jb-select-border-radius, 16px);\n border: solid 1px var(--jb-select-border-color, #1e2832);\n border-top: none;\n border-bottom: solid 3px var(--jb-select-border-color, #1e2832);\n box-shadow: var(--jb-select-list-box-shadow);\n box-sizing: border-box;\n z-index: 999;\n}\n.jb-select-web-component .select-list-wrapper.--show {\n display: block;\n}\n.jb-select-web-component .select-list-wrapper .select-list {\n width: 100%;\n max-height: var(--jb-select-list-max-height, 400px);\n overflow-y: auto;\n padding: 16px 0;\n}\n@media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component .select-list-wrapper .select-list {\n max-height: calc(100vh - 240px);\n }\n}\n.jb-select-web-component .select-list-wrapper .select-list .select-option {\n min-height: 36px;\n padding: 4px 16px;\n display: flex;\n align-items: center;\n font-size: 0.9em;\n color: var(--jb-select-option-color, inherit);\n background-color: var(--jb-select-option-background-color, #fff);\n}\n.jb-select-web-component .select-list-wrapper .select-list .select-option:hover {\n background-color: var(--jb-select-option-background-color-hover, #1073db);\n color: var(--jb-select-option-color-hover, #fff);\n cursor: pointer;\n}\n/*# sourceMappingURL=data:application/json;base64,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O0VBQ2IsbUJBQW1CO0VBQ25CLGdCQUFnQjtFQUNoQiw2Q0FBNkM7RUFDN0MsZ0VBQWdFO0FBQ2xFO0FBQ0E7RUFDRSx5RUFBeUU7RUFDekUsZ0RBQWdEO0VBQ2hELGVBQWU7QUFDakIiLCJmaWxlIjoiSkJTZWxlY3Quc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCB7XG4gIHdpZHRoOiB2YXIoLS1qYi1zZWxlY3Qtd2lkdGgsIDEwMCUpO1xuICBtYXJnaW46IHZhcigtLWpiLXNlbGVjdC1tYXJnaW4sIDEycHggMCk7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbn1cbkBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudC4tLWZvY3VzZWQge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0b3A6IDA7XG4gICAgbGVmdDogMDtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDAwODtcbiAgICB3aWR0aDogMTAwdnc7XG4gICAgaGVpZ2h0OiAxMDB2aDtcbiAgICBtYXJnaW46IDA7XG4gICAgcGFkZGluZzogMTZweCA4cHg7XG4gICAgei1pbmRleDogOTAwO1xuICB9XG59XG5AbWVkaWEgKG1pbi13aWR0aDogMzIwcHgpIGFuZCAobWF4LXdpZHRoOiA3NjdweCkge1xuICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQuLS1mb2N1c2VkIC5zZWxlY3QtbGlzdC13cmFwcGVyIHtcbiAgICBwb3NpdGlvbjogaW5pdGlhbDtcbiAgICBtYXJnaW46IDE2cHggMDtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCk7XG4gIH1cbn1cbkBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudC4tLWZvY3VzZWQgbGFiZWwge1xuICAgIGNvbG9yOiAjZmZmO1xuICAgIGZvbnQtc2l6ZTogMS41ZW07XG4gIH1cbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudC4tLWhhcy12YWx1ZSAuc2VsZWN0LWJveCB7XG4gIGJvcmRlci1jb2xvcjogdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvci1zZWxlY3RlZCwgI2MzZmYxNCk7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWpiLXNlbGVjdC1iZ2NvbG9yLXNlbGVjdGVkLCAjZjdmNmY2KTtcbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCBsYWJlbCB7XG4gIHdpZHRoOiAxMDAlO1xuICBtYXJnaW46IDRweCAwcHg7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBmb250LXNpemU6IDAuOGVtO1xuICBjb2xvcjogdmFyKC0tamItc2VsZWN0LWxhYmVsLWNvbG9yLCAjMWYxNzM1KTtcbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCBsYWJlbC4tLWhpZGUge1xuICBkaXNwbGF5OiBub25lO1xufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IHtcbiAgd2lkdGg6IDEwMCU7XG4gIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gIGhlaWdodDogdmFyKC0tamItc2VsZWN0LWhlaWdodCwgNDBweCk7XG4gIGJvcmRlcjogc29saWQgdmFyKC0tamItc2VsZWN0LWJvcmRlci13aWR0aCwgMXB4KSB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjZjdmNmY2KTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tamItc2VsZWN0LWJnY29sb3IsICNmN2Y2ZjYpO1xuICBib3JkZXItYm90dG9tOiBzb2xpZCB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWJvdHRvbS13aWR0aCwgM3B4KSB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjZjdmNmY2KTtcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tamItc2VsZWN0LWJvcmRlci1yYWRpdXMsIDE2cHgpO1xuICBtYXJnaW46IDRweCAwcHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgcGFkZGluZy1pbmxpbmUtZW5kOiAxNnB4O1xuICBnYXA6IDhweDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94OmZvY3VzLXdpdGhpbiB7XG4gIGJvcmRlci1jb2xvcjogdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvciwgIzFlMjgzMik7XG4gIGJvcmRlci1ib3R0b20tY29sb3I6IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItY29sb3IsICNmN2Y2ZjYpO1xuICBib3JkZXItcmFkaXVzOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCkgdmFyKC0tamItc2VsZWN0LWJvcmRlci1yYWRpdXMsIDE2cHgpIDAgMDtcbn1cbkBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveDpmb2N1cy13aXRoaW4ge1xuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItcmFkaXVzLCAxNnB4KTtcbiAgICBib3JkZXItYm90dG9tLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjMWUyODMyKTtcbiAgfVxufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5zZWxlY3RlZC12YWx1ZS13cmFwcGVyIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBib3JkZXItcmFkaXVzOiBpbmhlcml0O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICB6LWluZGV4OiAxO1xufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5zZWxlY3RlZC12YWx1ZS13cmFwcGVyLi0tc2VhcmNoLXR5cGVkIHtcbiAgb3BhY2l0eTogMDtcbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCAuc2VsZWN0ZWQtdmFsdWUtd3JhcHBlciAuc2VsZWN0ZWQtdmFsdWUge1xuICB3aWR0aDogMTAwJTtcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgaGVpZ2h0OiAxMDAlO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgcGFkZGluZzogMnB4IDEycHggMCAxMnB4O1xuICBkaXNwbGF5OiBibG9jaztcbiAgZm9udC1mYW1pbHk6IGluaGVyaXQ7XG4gIGZvbnQtc2l6ZTogMS4xZW07XG4gIGNvbG9yOiB2YXIoLS1qYi1zZWxlY3Qtc2VsZWN0ZWQtdmFsdWUtY29sb3IsICMxZjE3MzUpO1xuICBtYXJnaW46IDA7XG4gIGJvcmRlci1yYWRpdXM6IDA7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG4uamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3g6Zm9jdXMtd2l0aGluIC5zZWxlY3RlZC12YWx1ZSB7XG4gIG9wYWNpdHk6IDAuNztcbiAgdHJhbnNpdGlvbjogYWxsIDAuM3MgZWFzZTtcbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCAuZnJvbnQtYm94IHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBib3JkZXItcmFkaXVzOiBpbmhlcml0O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICB6LWluZGV4OiAyO1xufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5mcm9udC1ib3ggaW5wdXQge1xuICBib3JkZXI6IG5vbmU7XG4gIHdpZHRoOiAxMDAlO1xuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICBoZWlnaHQ6IDEwMCU7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBwYWRkaW5nOiAycHggMTJweCAwIDEycHg7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgZm9udC1zaXplOiAxLjFlbTtcbiAgY29sb3I6IHZhcigtLWpiLXNlbGVjdC1pbnB1dC1jb2xvciwgIzFmMTczNSk7XG4gIG1hcmdpbjogMDtcbiAgYm9yZGVyLXJhZGl1czogMDtcbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCAuZnJvbnQtYm94IGlucHV0OmZvY3VzIHtcbiAgb3V0bGluZTogbm9uZTtcbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCAuZnJvbnQtYm94IC5hcnJvdy1pY29uIHtcbiAgd2lkdGg6IDhweDtcbiAgaGVpZ2h0OiAxMDAlO1xuICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoXCJkYXRhOmltYWdlL3N2Zyt4bWw7dXRmOCw8c3ZnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zycgd2lkdGg9JzgnIGhlaWdodD0nOCcgeG1sbnM6eGxpbms9J2h0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsnIHZlcnNpb249JzEuMScgaWQ9J0xheWVyXzEnIHg9JzBweCcgeT0nMHB4JyB2aWV3Qm94PScwIDAgNDk0LjEgMzcxLjEnIHN0eWxlPSdlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ5NC4xIDM3MS4xOycgeG1sOnNwYWNlPSdwcmVzZXJ2ZSc+PHBhdGggZD0nTTI5MywzNDMuOEw0ODAuOSw2OS4zYzguNy0xMi43LDEzLjMtMjUuNCwxMy4zLTM2LjFjMC0yMC41LTE2LjUtMzMuMi00NC0zMy4ySDQ0QzE2LjQsMCwwLDEyLjcsMCwzMy4yICBjMCwxMC42LDQuNiwyMy4yLDEzLjMsMzUuOWwxODcuOSwyNzQuNmMxMi4xLDE3LjcsMjguNCwyNy40LDQ1LjksMjcuNEMyNjQuNiwzNzEuMSwyODAuOSwzNjEuNCwyOTMsMzQzLjh6Jy8+PC9zdmc+XCIpO1xuICBiYWNrZ3JvdW5kLXBvc2l0aW9uOiBlbmQ7XG4gIGJhY2tncm91bmQtcmVwZWF0OiBuby1yZXBlYXQ7XG4gIGJhY2tncm91bmQtcG9zaXRpb24teDogMDtcbiAgYmFja2dyb3VuZC1wb3NpdGlvbi15OiBjZW50ZXI7XG59XG4uamItc2VsZWN0LXdlYi1jb21wb25lbnQgLm1lc3NhZ2UtYm94IHtcbiAgZm9udC1zaXplOiAwLjdlbTtcbiAgcGFkZGluZzogMnB4IDhweDtcbiAgY29sb3I6ICM5MjkyOTI7XG59XG4uamItc2VsZWN0LXdlYi1jb21wb25lbnQgLm1lc3NhZ2UtYm94OmVtcHR5IHtcbiAgcGFkZGluZzogMDtcbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAubWVzc2FnZS1ib3guLS1lcnJvciB7XG4gIGNvbG9yOiByZWQ7XG59XG4uamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1saXN0LXdyYXBwZXIge1xuICBkaXNwbGF5OiBub25lO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIG1hcmdpbjogLTZweCAwO1xuICBoZWlnaHQ6IGF1dG87XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIHdpZHRoOiAxMDAlO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtYmdjb2xvciwgI2Y3ZjZmNik7XG4gIGJvcmRlci1yYWRpdXM6IDAgMCB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCkgdmFyKC0tamItc2VsZWN0LWJvcmRlci1yYWRpdXMsIDE2cHgpO1xuICBib3JkZXI6IHNvbGlkIDFweCB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjMWUyODMyKTtcbiAgYm9yZGVyLXRvcDogbm9uZTtcbiAgYm9yZGVyLWJvdHRvbTogc29saWQgM3B4IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItY29sb3IsICMxZTI4MzIpO1xuICBib3gtc2hhZG93OiB2YXIoLS1qYi1zZWxlY3QtbGlzdC1ib3gtc2hhZG93KTtcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgei1pbmRleDogOTk5O1xufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyLi0tc2hvdyB7XG4gIGRpc3BsYXk6IGJsb2NrO1xufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyIC5zZWxlY3QtbGlzdCB7XG4gIHdpZHRoOiAxMDAlO1xuICBtYXgtaGVpZ2h0OiB2YXIoLS1qYi1zZWxlY3QtbGlzdC1tYXgtaGVpZ2h0LCA0MDBweCk7XG4gIG92ZXJmbG93LXk6IGF1dG87XG4gIHBhZGRpbmc6IDE2cHggMDtcbn1cbkBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWxpc3Qtd3JhcHBlciAuc2VsZWN0LWxpc3Qge1xuICAgIG1heC1oZWlnaHQ6IGNhbGMoMTAwdmggLSAyNDBweCk7XG4gIH1cbn1cbi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWxpc3Qtd3JhcHBlciAuc2VsZWN0LWxpc3QgLnNlbGVjdC1vcHRpb24ge1xuICBtaW4taGVpZ2h0OiAzNnB4O1xuICBwYWRkaW5nOiA0cHggMTZweDtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZm9udC1zaXplOiAwLjllbTtcbiAgY29sb3I6IHZhcigtLWpiLXNlbGVjdC1vcHRpb24tY29sb3IsIGluaGVyaXQpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3Qtb3B0aW9uLWJhY2tncm91bmQtY29sb3IsICNmZmYpO1xufVxuLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyIC5zZWxlY3QtbGlzdCAuc2VsZWN0LW9wdGlvbjpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWpiLXNlbGVjdC1vcHRpb24tYmFja2dyb3VuZC1jb2xvci1ob3ZlciwgIzEwNzNkYik7XG4gIGNvbG9yOiB2YXIoLS1qYi1zZWxlY3Qtb3B0aW9uLWNvbG9yLWhvdmVyLCAjZmZmKTtcbiAgY3Vyc29yOiBwb2ludGVyO1xufSJdfQ== */";
|
|
3
|
+
var css_248z = ".jb-select-web-component {\n width: var(--jb-select-width, 100%);\n margin: var(--jb-select-margin, 12px 0);\n position: relative;\n box-sizing: border-box; }\n @media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component.--focused {\n position: absolute;\n top: 0;\n left: 0;\n background-color: #0008;\n width: 100vw;\n height: 100vh;\n margin: 0;\n padding: 16px 8px;\n z-index: 900; } }\n @media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component.--focused .select-list-wrapper {\n position: initial;\n margin: 16px 0;\n border-radius: var(--jb-select-border-radius, 16px); } }\n @media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component.--focused label {\n color: #fff;\n font-size: 1.5em; } }\n .jb-select-web-component.--has-value .select-box {\n border-color: var(--jb-select-border-color-selected, #c3ff14);\n background-color: var(--jb-select-bgcolor-selected, #f7f6f6); }\n .jb-select-web-component label {\n width: 100%;\n margin: 4px 0px;\n display: block;\n font-size: 0.8em;\n color: var(--jb-select-label-color, #1f1735); }\n .jb-select-web-component label.--hide {\n display: none; }\n .jb-select-web-component .select-box {\n width: 100%;\n box-sizing: border-box;\n height: var(--jb-select-height, 40px);\n border: solid var(--jb-select-border-width, 1px) var(--jb-select-border-color, #f7f6f6);\n background-color: var(--jb-select-bgcolor, #f7f6f6);\n border-bottom: solid var(--jb-select-border-bottom-width, 3px) var(--jb-select-border-color, #f7f6f6);\n border-radius: var(--jb-select-border-radius, 16px);\n margin: 4px 0px;\n overflow: hidden;\n display: flex;\n justify-content: space-between;\n padding-inline-end: 16px;\n gap: 8px;\n position: relative; }\n .jb-select-web-component .select-box:focus-within {\n border-color: var(--jb-select-border-color, #1e2832);\n border-bottom-color: var(--jb-select-border-color, #f7f6f6);\n border-radius: var(--jb-select-border-radius, 16px) var(--jb-select-border-radius, 16px) 0 0; }\n @media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component .select-box:focus-within {\n border-radius: var(--jb-select-border-radius, 16px);\n border-bottom-color: var(--jb-select-border-color, #1e2832); } }\n .jb-select-web-component .select-box .selected-value-wrapper {\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n overflow: hidden;\n z-index: 1; }\n .jb-select-web-component .select-box .selected-value-wrapper.--search-typed {\n opacity: 0; }\n .jb-select-web-component .select-box .selected-value-wrapper .selected-value {\n width: 100%;\n box-sizing: border-box;\n height: 100%;\n background-color: transparent;\n padding: 2px 12px 0 12px;\n display: block;\n font-family: inherit;\n font-size: 1.1em;\n color: var(--jb-select-selected-value-color, #1f1735);\n margin: 0;\n border-radius: 0;\n display: flex;\n align-items: center; }\n .jb-select-web-component .select-box:focus-within .selected-value {\n opacity: 0.7;\n transition: all 0.3s ease; }\n .jb-select-web-component .select-box .front-box {\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n overflow: hidden;\n z-index: 2; }\n .jb-select-web-component .select-box .front-box input {\n border: none;\n width: 100%;\n box-sizing: border-box;\n height: 100%;\n background-color: transparent;\n padding: 2px 12px 0 12px;\n display: block;\n font-family: inherit;\n font-size: 1.1em;\n color: var(--jb-select-input-color, #1f1735);\n margin: 0;\n border-radius: 0; }\n .jb-select-web-component .select-box .front-box input:focus {\n outline: none; }\n .jb-select-web-component .select-box .front-box .arrow-icon {\n width: 8px;\n height: 100%;\n background-image: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 494.1 371.1' style='enable-background:new 0 0 494.1 371.1;' xml:space='preserve'><path d='M293,343.8L480.9,69.3c8.7-12.7,13.3-25.4,13.3-36.1c0-20.5-16.5-33.2-44-33.2H44C16.4,0,0,12.7,0,33.2 c0,10.6,4.6,23.2,13.3,35.9l187.9,274.6c12.1,17.7,28.4,27.4,45.9,27.4C264.6,371.1,280.9,361.4,293,343.8z'/></svg>\");\n background-position: end;\n background-repeat: no-repeat;\n background-position-x: 0;\n background-position-y: center; }\n .jb-select-web-component .message-box {\n font-size: 0.7em;\n padding: 2px 8px;\n color: #929292; }\n .jb-select-web-component .message-box:empty {\n padding: 0; }\n .jb-select-web-component .message-box.--error {\n color: red; }\n .jb-select-web-component .select-list-wrapper {\n display: none;\n position: absolute;\n margin: -6px 0;\n height: auto;\n overflow: hidden;\n width: 100%;\n background-color: var(--jb-select-bgcolor, #f7f6f6);\n border-radius: 0 0 var(--jb-select-border-radius, 16px) var(--jb-select-border-radius, 16px);\n border: solid 1px var(--jb-select-border-color, #1e2832);\n border-top: none;\n border-bottom: solid 3px var(--jb-select-border-color, #1e2832);\n box-shadow: var(--jb-select-list-box-shadow);\n box-sizing: border-box;\n z-index: 999; }\n .jb-select-web-component .select-list-wrapper.--show {\n display: block; }\n .jb-select-web-component .select-list-wrapper .select-list {\n width: 100%;\n max-height: var(--jb-select-list-max-height, 400px);\n overflow-y: auto;\n padding: 16px 0; }\n @media (min-width: 320px) and (max-width: 767px) {\n .jb-select-web-component .select-list-wrapper .select-list {\n max-height: calc(100vh - 240px); } }\n .jb-select-web-component .select-list-wrapper .select-list .select-option {\n min-height: 36px;\n padding: 4px 16px;\n display: flex;\n align-items: center;\n font-size: 0.9em;\n color: var(--jb-select-option-color, inherit);\n background-color: var(--jb-select-option-background-color, #fff); }\n .jb-select-web-component .select-list-wrapper .select-list .select-option:hover {\n background-color: var(--jb-select-option-background-color-hover, #1073db);\n color: var(--jb-select-option-color-hover, #fff);\n cursor: pointer; }\n\n/*# sourceMappingURL=data:application/json;base64,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YUFBYTtRQUNiLG1CQUFtQjtRQUNuQixnQkFBZ0I7UUFDaEIsNkNBQTZDO1FBQzdDLGdFQUFnRSxFQUFFO1FBQ2xFO1VBQ0UseUVBQXlFO1VBQ3pFLGdEQUFnRDtVQUNoRCxlQUFlLEVBQUUiLCJmaWxlIjoiSkJTZWxlY3Quc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCB7XG4gIHdpZHRoOiB2YXIoLS1qYi1zZWxlY3Qtd2lkdGgsIDEwMCUpO1xuICBtYXJnaW46IHZhcigtLWpiLXNlbGVjdC1tYXJnaW4sIDEycHggMCk7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDsgfVxuICBAbWVkaWEgKG1pbi13aWR0aDogMzIwcHgpIGFuZCAobWF4LXdpZHRoOiA3NjdweCkge1xuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudC4tLWZvY3VzZWQge1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgdG9wOiAwO1xuICAgICAgbGVmdDogMDtcbiAgICAgIGJhY2tncm91bmQtY29sb3I6ICMwMDA4O1xuICAgICAgd2lkdGg6IDEwMHZ3O1xuICAgICAgaGVpZ2h0OiAxMDB2aDtcbiAgICAgIG1hcmdpbjogMDtcbiAgICAgIHBhZGRpbmc6IDE2cHggOHB4O1xuICAgICAgei1pbmRleDogOTAwOyB9IH1cbiAgQG1lZGlhIChtaW4td2lkdGg6IDMyMHB4KSBhbmQgKG1heC13aWR0aDogNzY3cHgpIHtcbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQuLS1mb2N1c2VkIC5zZWxlY3QtbGlzdC13cmFwcGVyIHtcbiAgICAgIHBvc2l0aW9uOiBpbml0aWFsO1xuICAgICAgbWFyZ2luOiAxNnB4IDA7XG4gICAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCk7IH0gfVxuICBAbWVkaWEgKG1pbi13aWR0aDogMzIwcHgpIGFuZCAobWF4LXdpZHRoOiA3NjdweCkge1xuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudC4tLWZvY3VzZWQgbGFiZWwge1xuICAgICAgY29sb3I6ICNmZmY7XG4gICAgICBmb250LXNpemU6IDEuNWVtOyB9IH1cbiAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50Li0taGFzLXZhbHVlIC5zZWxlY3QtYm94IHtcbiAgICBib3JkZXItY29sb3I6IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItY29sb3Itc2VsZWN0ZWQsICNjM2ZmMTQpO1xuICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWpiLXNlbGVjdC1iZ2NvbG9yLXNlbGVjdGVkLCAjZjdmNmY2KTsgfVxuICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgbGFiZWwge1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIG1hcmdpbjogNHB4IDBweDtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBmb250LXNpemU6IDAuOGVtO1xuICAgIGNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtbGFiZWwtY29sb3IsICMxZjE3MzUpOyB9XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IGxhYmVsLi0taGlkZSB7XG4gICAgICBkaXNwbGF5OiBub25lOyB9XG4gIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCB7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICBoZWlnaHQ6IHZhcigtLWpiLXNlbGVjdC1oZWlnaHQsIDQwcHgpO1xuICAgIGJvcmRlcjogc29saWQgdmFyKC0tamItc2VsZWN0LWJvcmRlci13aWR0aCwgMXB4KSB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjZjdmNmY2KTtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtYmdjb2xvciwgI2Y3ZjZmNik7XG4gICAgYm9yZGVyLWJvdHRvbTogc29saWQgdmFyKC0tamItc2VsZWN0LWJvcmRlci1ib3R0b20td2lkdGgsIDNweCkgdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvciwgI2Y3ZjZmNik7XG4gICAgYm9yZGVyLXJhZGl1czogdmFyKC0tamItc2VsZWN0LWJvcmRlci1yYWRpdXMsIDE2cHgpO1xuICAgIG1hcmdpbjogNHB4IDBweDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICAgIHBhZGRpbmctaW5saW5lLWVuZDogMTZweDtcbiAgICBnYXA6IDhweDtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7IH1cbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3g6Zm9jdXMtd2l0aGluIHtcbiAgICAgIGJvcmRlci1jb2xvcjogdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvciwgIzFlMjgzMik7XG4gICAgICBib3JkZXItYm90dG9tLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjZjdmNmY2KTtcbiAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItcmFkaXVzLCAxNnB4KSB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCkgMCAwOyB9XG4gICAgICBAbWVkaWEgKG1pbi13aWR0aDogMzIwcHgpIGFuZCAobWF4LXdpZHRoOiA3NjdweCkge1xuICAgICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3g6Zm9jdXMtd2l0aGluIHtcbiAgICAgICAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCk7XG4gICAgICAgICAgYm9yZGVyLWJvdHRvbS1jb2xvcjogdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvciwgIzFlMjgzMik7IH0gfVxuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCAuc2VsZWN0ZWQtdmFsdWUtd3JhcHBlciB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB3aWR0aDogMTAwJTtcbiAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgIGJvcmRlci1yYWRpdXM6IGluaGVyaXQ7XG4gICAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgICAgei1pbmRleDogMTsgfVxuICAgICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5zZWxlY3RlZC12YWx1ZS13cmFwcGVyLi0tc2VhcmNoLXR5cGVkIHtcbiAgICAgICAgb3BhY2l0eTogMDsgfVxuICAgICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5zZWxlY3RlZC12YWx1ZS13cmFwcGVyIC5zZWxlY3RlZC12YWx1ZSB7XG4gICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgICAgICBoZWlnaHQ6IDEwMCU7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICAgICAgICBwYWRkaW5nOiAycHggMTJweCAwIDEycHg7XG4gICAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgICAgICAgZm9udC1zaXplOiAxLjFlbTtcbiAgICAgICAgY29sb3I6IHZhcigtLWpiLXNlbGVjdC1zZWxlY3RlZC12YWx1ZS1jb2xvciwgIzFmMTczNSk7XG4gICAgICAgIG1hcmdpbjogMDtcbiAgICAgICAgYm9yZGVyLXJhZGl1czogMDtcbiAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjsgfVxuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveDpmb2N1cy13aXRoaW4gLnNlbGVjdGVkLXZhbHVlIHtcbiAgICAgIG9wYWNpdHk6IDAuNztcbiAgICAgIHRyYW5zaXRpb246IGFsbCAwLjNzIGVhc2U7IH1cbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3ggLmZyb250LWJveCB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB3aWR0aDogMTAwJTtcbiAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgIGJvcmRlci1yYWRpdXM6IGluaGVyaXQ7XG4gICAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgICAgei1pbmRleDogMjsgfVxuICAgICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5mcm9udC1ib3ggaW5wdXQge1xuICAgICAgICBib3JkZXI6IG5vbmU7XG4gICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgICAgICBoZWlnaHQ6IDEwMCU7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICAgICAgICBwYWRkaW5nOiAycHggMTJweCAwIDEycHg7XG4gICAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgICAgICAgZm9udC1zaXplOiAxLjFlbTtcbiAgICAgICAgY29sb3I6IHZhcigtLWpiLXNlbGVjdC1pbnB1dC1jb2xvciwgIzFmMTczNSk7XG4gICAgICAgIG1hcmdpbjogMDtcbiAgICAgICAgYm9yZGVyLXJhZGl1czogMDsgfVxuICAgICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3ggLmZyb250LWJveCBpbnB1dDpmb2N1cyB7XG4gICAgICAgICAgb3V0bGluZTogbm9uZTsgfVxuICAgICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5mcm9udC1ib3ggLmFycm93LWljb24ge1xuICAgICAgICB3aWR0aDogOHB4O1xuICAgICAgICBoZWlnaHQ6IDEwMCU7XG4gICAgICAgIGJhY2tncm91bmQtaW1hZ2U6IHVybChcImRhdGE6aW1hZ2Uvc3ZnK3htbDt1dGY4LDxzdmcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJyB3aWR0aD0nOCcgaGVpZ2h0PSc4JyB4bWxuczp4bGluaz0naHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluaycgdmVyc2lvbj0nMS4xJyBpZD0nTGF5ZXJfMScgeD0nMHB4JyB5PScwcHgnIHZpZXdCb3g9JzAgMCA0OTQuMSAzNzEuMScgc3R5bGU9J2VuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDk0LjEgMzcxLjE7JyB4bWw6c3BhY2U9J3ByZXNlcnZlJz48cGF0aCBkPSdNMjkzLDM0My44TDQ4MC45LDY5LjNjOC43LTEyLjcsMTMuMy0yNS40LDEzLjMtMzYuMWMwLTIwLjUtMTYuNS0zMy4yLTQ0LTMzLjJINDRDMTYuNCwwLDAsMTIuNywwLDMzLjIgIGMwLDEwLjYsNC42LDIzLjIsMTMuMywzNS45bDE4Ny45LDI3NC42YzEyLjEsMTcuNywyOC40LDI3LjQsNDUuOSwyNy40QzI2NC42LDM3MS4xLDI4MC45LDM2MS40LDI5MywzNDMuOHonLz48L3N2Zz5cIik7XG4gICAgICAgIGJhY2tncm91bmQtcG9zaXRpb246IGVuZDtcbiAgICAgICAgYmFja2dyb3VuZC1yZXBlYXQ6IG5vLXJlcGVhdDtcbiAgICAgICAgYmFja2dyb3VuZC1wb3NpdGlvbi14OiAwO1xuICAgICAgICBiYWNrZ3JvdW5kLXBvc2l0aW9uLXk6IGNlbnRlcjsgfVxuICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLm1lc3NhZ2UtYm94IHtcbiAgICBmb250LXNpemU6IDAuN2VtO1xuICAgIHBhZGRpbmc6IDJweCA4cHg7XG4gICAgY29sb3I6ICM5MjkyOTI7IH1cbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLm1lc3NhZ2UtYm94OmVtcHR5IHtcbiAgICAgIHBhZGRpbmc6IDA7IH1cbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLm1lc3NhZ2UtYm94Li0tZXJyb3Ige1xuICAgICAgY29sb3I6IHJlZDsgfVxuICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1saXN0LXdyYXBwZXIge1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIG1hcmdpbjogLTZweCAwO1xuICAgIGhlaWdodDogYXV0bztcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWpiLXNlbGVjdC1iZ2NvbG9yLCAjZjdmNmY2KTtcbiAgICBib3JkZXItcmFkaXVzOiAwIDAgdmFyKC0tamItc2VsZWN0LWJvcmRlci1yYWRpdXMsIDE2cHgpIHZhcigtLWpiLXNlbGVjdC1ib3JkZXItcmFkaXVzLCAxNnB4KTtcbiAgICBib3JkZXI6IHNvbGlkIDFweCB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjMWUyODMyKTtcbiAgICBib3JkZXItdG9wOiBub25lO1xuICAgIGJvcmRlci1ib3R0b206IHNvbGlkIDNweCB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjMWUyODMyKTtcbiAgICBib3gtc2hhZG93OiB2YXIoLS1qYi1zZWxlY3QtbGlzdC1ib3gtc2hhZG93KTtcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIHotaW5kZXg6IDk5OTsgfVxuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWxpc3Qtd3JhcHBlci4tLXNob3cge1xuICAgICAgZGlzcGxheTogYmxvY2s7IH1cbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1saXN0LXdyYXBwZXIgLnNlbGVjdC1saXN0IHtcbiAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgbWF4LWhlaWdodDogdmFyKC0tamItc2VsZWN0LWxpc3QtbWF4LWhlaWdodCwgNDAwcHgpO1xuICAgICAgb3ZlcmZsb3cteTogYXV0bztcbiAgICAgIHBhZGRpbmc6IDE2cHggMDsgfVxuICAgICAgQG1lZGlhIChtaW4td2lkdGg6IDMyMHB4KSBhbmQgKG1heC13aWR0aDogNzY3cHgpIHtcbiAgICAgICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyIC5zZWxlY3QtbGlzdCB7XG4gICAgICAgICAgbWF4LWhlaWdodDogY2FsYygxMDB2aCAtIDI0MHB4KTsgfSB9XG4gICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1saXN0LXdyYXBwZXIgLnNlbGVjdC1saXN0IC5zZWxlY3Qtb3B0aW9uIHtcbiAgICAgICAgbWluLWhlaWdodDogMzZweDtcbiAgICAgICAgcGFkZGluZzogNHB4IDE2cHg7XG4gICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgIGZvbnQtc2l6ZTogMC45ZW07XG4gICAgICAgIGNvbG9yOiB2YXIoLS1qYi1zZWxlY3Qtb3B0aW9uLWNvbG9yLCBpbmhlcml0KTtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tamItc2VsZWN0LW9wdGlvbi1iYWNrZ3JvdW5kLWNvbG9yLCAjZmZmKTsgfVxuICAgICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1saXN0LXdyYXBwZXIgLnNlbGVjdC1saXN0IC5zZWxlY3Qtb3B0aW9uOmhvdmVyIHtcbiAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3Qtb3B0aW9uLWJhY2tncm91bmQtY29sb3ItaG92ZXIsICMxMDczZGIpO1xuICAgICAgICAgIGNvbG9yOiB2YXIoLS1qYi1zZWxlY3Qtb3B0aW9uLWNvbG9yLWhvdmVyLCAjZmZmKTtcbiAgICAgICAgICBjdXJzb3I6IHBvaW50ZXI7IH1cbiJdfQ== */";
|
|
4
4
|
|
|
5
5
|
class JBSelectWebComponent extends HTMLElement {
|
|
6
6
|
get value() {
|
|
7
|
-
if(this._value){
|
|
7
|
+
if (this._value) {
|
|
8
8
|
return this.callbacks.getOptionValue(this._value);
|
|
9
|
-
}else {
|
|
9
|
+
} else {
|
|
10
10
|
return null;
|
|
11
11
|
}
|
|
12
12
|
}
|
|
@@ -15,18 +15,26 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
15
15
|
}
|
|
16
16
|
get textValue() {
|
|
17
17
|
return this._textValue;
|
|
18
|
+
|
|
18
19
|
}
|
|
19
20
|
set textValue(value) {
|
|
20
21
|
this._textValue = value;
|
|
21
22
|
this.elements.input.value = value;
|
|
22
23
|
this.updateOptionList(value);
|
|
23
24
|
}
|
|
25
|
+
get selectedOptionTitle() {
|
|
26
|
+
if (this.value) {
|
|
27
|
+
return this.callbacks.getOptionTitle(this._value);
|
|
28
|
+
} else {
|
|
29
|
+
return "";
|
|
30
|
+
}
|
|
31
|
+
}
|
|
24
32
|
get optionList() {
|
|
25
33
|
return this._optionList || [];
|
|
26
34
|
}
|
|
27
35
|
set optionList(value) {
|
|
28
|
-
if(!Array.isArray(value)){
|
|
29
|
-
console.error('your provided option list to jb-select is not a array. you must provide array value',{value});
|
|
36
|
+
if (!Array.isArray(value)) {
|
|
37
|
+
console.error('your provided option list to jb-select is not a array. you must provide array value', { value });
|
|
30
38
|
return;
|
|
31
39
|
}
|
|
32
40
|
this._optionList = value;
|
|
@@ -38,14 +46,14 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
38
46
|
get displayOptionList() {
|
|
39
47
|
return this._displayOptionList;
|
|
40
48
|
}
|
|
41
|
-
get isMobileDevice
|
|
49
|
+
get isMobileDevice() { return /Mobi/i.test(window.navigator.userAgent); }
|
|
42
50
|
|
|
43
51
|
|
|
44
52
|
constructor() {
|
|
45
53
|
super();
|
|
46
54
|
this.initWebComponent();
|
|
47
55
|
this.initProp();
|
|
48
|
-
|
|
56
|
+
|
|
49
57
|
}
|
|
50
58
|
connectedCallback() {
|
|
51
59
|
// standard web component event that called when all of dom is binded
|
|
@@ -76,7 +84,7 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
76
84
|
this._optionListElement = shadowRoot.querySelector('.select-list');
|
|
77
85
|
this._optionListElementWrapper = shadowRoot.querySelector('.select-list-wrapper');
|
|
78
86
|
this.registerEventListener();
|
|
79
|
-
|
|
87
|
+
|
|
80
88
|
}
|
|
81
89
|
registerEventListener() {
|
|
82
90
|
this.elements.input.addEventListener('change', this.onInputChange.bind(this));
|
|
@@ -96,8 +104,8 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
96
104
|
this.callbacks = {
|
|
97
105
|
getOptionTitle: (option) => { return option; },
|
|
98
106
|
getOptionValue: (option) => { return option; },
|
|
99
|
-
getOptionDOM:null,
|
|
100
|
-
getSelectedValueDOM:null,
|
|
107
|
+
getOptionDOM: null,
|
|
108
|
+
getSelectedValueDOM: null,
|
|
101
109
|
};
|
|
102
110
|
this.value = this.getAttribute('value') || null;
|
|
103
111
|
// if user set value and current option list is not contain the option.
|
|
@@ -116,9 +124,9 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
116
124
|
switch (name) {
|
|
117
125
|
case 'label':
|
|
118
126
|
this.shadowRoot.querySelector('label .label-value').innerHTML = value;
|
|
119
|
-
if(value == null || value == undefined || value == ""){
|
|
127
|
+
if (value == null || value == undefined || value == "") {
|
|
120
128
|
this.shadowRoot.querySelector('label').classList.add('--hide');
|
|
121
|
-
}else {
|
|
129
|
+
} else {
|
|
122
130
|
this.shadowRoot.querySelector('label').classList.remove('--hide');
|
|
123
131
|
}
|
|
124
132
|
break;
|
|
@@ -141,10 +149,10 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
141
149
|
}
|
|
142
150
|
|
|
143
151
|
}
|
|
144
|
-
_setValueOnOptionListChanged(){
|
|
152
|
+
_setValueOnOptionListChanged() {
|
|
145
153
|
//when option list changed we see if current value is valid for new optionlist we set it if not we reset value to null.
|
|
146
154
|
//in some scenario value is setted before otionList attached so we store it on this._notFindedValue and after option list setted we set value from this._notFindedValue
|
|
147
|
-
if(this.value || this._notFindedValue){
|
|
155
|
+
if (this.value || this._notFindedValue) {
|
|
148
156
|
//if select has no prev value or pending not finded value we dont set it becuase user may input some search terms in input box and developer-user update list base on that value
|
|
149
157
|
//if we set it to null the search term and this.textvalue will become null and empty too and it make impossible for user to search in dynamic back-end provided searchable list so we put this condition to prevent it
|
|
150
158
|
this._setValueFromOutside(this.value || this._notFindedValue);
|
|
@@ -179,20 +187,20 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
179
187
|
//if user select an option we rest filter so user see all option again when open a select
|
|
180
188
|
this.updateOptionList('');
|
|
181
189
|
}
|
|
182
|
-
onArrowKeyClick(){
|
|
183
|
-
if(this._optionListElementWrapper.classList.contains('--show')){
|
|
190
|
+
onArrowKeyClick() {
|
|
191
|
+
if (this._optionListElementWrapper.classList.contains('--show')) {
|
|
184
192
|
this.blur();
|
|
185
|
-
}else {
|
|
193
|
+
} else {
|
|
186
194
|
this.focus();
|
|
187
195
|
}
|
|
188
196
|
}
|
|
189
197
|
onInputKeyPress() {
|
|
190
198
|
//TODO: raise keypress event
|
|
191
199
|
}
|
|
192
|
-
onInputBeforeInput(e){
|
|
200
|
+
onInputBeforeInput(e) {
|
|
193
201
|
this.handleSelectedValueDisplay(e.data);
|
|
194
202
|
}
|
|
195
|
-
onInputInput(e){
|
|
203
|
+
onInputInput(e) {
|
|
196
204
|
this.textValue = e.target.value;
|
|
197
205
|
}
|
|
198
206
|
onInputKeyup(e) {
|
|
@@ -202,35 +210,35 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
202
210
|
//becuase on keyprees dont recieve backspace key press
|
|
203
211
|
this.handleSelectedValueDisplay(inputText);
|
|
204
212
|
}
|
|
205
|
-
|
|
213
|
+
|
|
206
214
|
this.triggerOnInputKeyup(e);
|
|
207
|
-
|
|
215
|
+
|
|
208
216
|
}
|
|
209
217
|
handleSelectedValueDisplay(inputValue) {
|
|
210
|
-
if(inputValue !== ""){
|
|
218
|
+
if (inputValue !== "") {
|
|
211
219
|
this.elements.selectedValueWrapper.classList.add('--search-typed');
|
|
212
|
-
}else {
|
|
220
|
+
} else {
|
|
213
221
|
this.elements.selectedValueWrapper.classList.remove('--search-typed');
|
|
214
222
|
}
|
|
215
223
|
}
|
|
216
|
-
triggerOnInputKeyup(e){
|
|
217
|
-
const event = new KeyboardEvent('keyup',{
|
|
218
|
-
altKey:e.altKey,
|
|
219
|
-
bubbles:e.bubbles,
|
|
220
|
-
cancelable:e.cancelable,
|
|
221
|
-
code:e.code,
|
|
222
|
-
ctrlKey:e.ctrlKey,
|
|
223
|
-
detail:e.detail,
|
|
224
|
-
key:e.key,
|
|
225
|
-
shiftKey:e.shiftKey,
|
|
226
|
-
charCode:e.charCode,
|
|
227
|
-
location:e.location,
|
|
228
|
-
composed:e.composed,
|
|
229
|
-
isComposing:e.isComposing,
|
|
230
|
-
metaKey:e.metaKey,
|
|
231
|
-
repeat:e.repeat,
|
|
232
|
-
keyCode:e.keyCode,
|
|
233
|
-
view:e.view
|
|
224
|
+
triggerOnInputKeyup(e) {
|
|
225
|
+
const event = new KeyboardEvent('keyup', {
|
|
226
|
+
altKey: e.altKey,
|
|
227
|
+
bubbles: e.bubbles,
|
|
228
|
+
cancelable: e.cancelable,
|
|
229
|
+
code: e.code,
|
|
230
|
+
ctrlKey: e.ctrlKey,
|
|
231
|
+
detail: e.detail,
|
|
232
|
+
key: e.key,
|
|
233
|
+
shiftKey: e.shiftKey,
|
|
234
|
+
charCode: e.charCode,
|
|
235
|
+
location: e.location,
|
|
236
|
+
composed: e.composed,
|
|
237
|
+
isComposing: e.isComposing,
|
|
238
|
+
metaKey: e.metaKey,
|
|
239
|
+
repeat: e.repeat,
|
|
240
|
+
keyCode: e.keyCode,
|
|
241
|
+
view: e.view
|
|
234
242
|
});
|
|
235
243
|
this.dispatchEvent(event);
|
|
236
244
|
}
|
|
@@ -248,20 +256,20 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
248
256
|
this.blur();
|
|
249
257
|
}
|
|
250
258
|
}
|
|
251
|
-
focus(){
|
|
259
|
+
focus() {
|
|
252
260
|
this.elements.input.focus();
|
|
253
261
|
this.showOptionList();
|
|
254
262
|
this.elements.componentWrapper.classList.add('--focused');
|
|
255
|
-
|
|
263
|
+
|
|
256
264
|
}
|
|
257
|
-
blur(){
|
|
265
|
+
blur() {
|
|
258
266
|
this.elements.componentWrapper.classList.remove('--focused');
|
|
259
267
|
this.textValue = "";
|
|
260
268
|
this.handleSelectedValueDisplay('');
|
|
261
269
|
this.hideOptionList();
|
|
262
270
|
this.triggerInputValidation();
|
|
263
271
|
}
|
|
264
|
-
showOptionList(){
|
|
272
|
+
showOptionList() {
|
|
265
273
|
this._optionListElementWrapper.classList.add('--show');
|
|
266
274
|
}
|
|
267
275
|
hideOptionList() {
|
|
@@ -278,22 +286,22 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
278
286
|
optionDomList.push(optionDOM);
|
|
279
287
|
});
|
|
280
288
|
this._optionListElement.innerHTML = '';
|
|
281
|
-
optionDomList.forEach(optionElement => { this._optionListElement.appendChild(optionElement);});
|
|
289
|
+
optionDomList.forEach(optionElement => { this._optionListElement.appendChild(optionElement); });
|
|
282
290
|
|
|
283
291
|
|
|
284
292
|
}
|
|
285
|
-
createOptionDOM(item){
|
|
293
|
+
createOptionDOM(item) {
|
|
286
294
|
let optionDOM = null;
|
|
287
|
-
if(typeof this.callbacks.getOptionDOM == 'function'){
|
|
288
|
-
optionDOM = this.callbacks.getOptionDOM(item,this.onOptionClicked.bind(this));
|
|
289
|
-
}else {
|
|
295
|
+
if (typeof this.callbacks.getOptionDOM == 'function') {
|
|
296
|
+
optionDOM = this.callbacks.getOptionDOM(item, this.onOptionClicked.bind(this));
|
|
297
|
+
} else {
|
|
290
298
|
optionDOM = this._createOptionDom(item);
|
|
291
299
|
}
|
|
292
300
|
optionDOM.value = item;
|
|
293
301
|
return optionDOM;
|
|
294
302
|
}
|
|
295
303
|
|
|
296
|
-
_createOptionDom(item){
|
|
304
|
+
_createOptionDom(item) {
|
|
297
305
|
const optionElement = document.createElement('div');
|
|
298
306
|
optionElement.classList.add('select-option');
|
|
299
307
|
//it has defualt function who return wxact same input
|
|
@@ -366,19 +374,19 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
366
374
|
//when user select option or value changed in any condition we set selected option DOM
|
|
367
375
|
this.elements.selectedValueWrapper.innerHTML = '';
|
|
368
376
|
//if value was null or undifined it remain empty
|
|
369
|
-
if(value !== null && value !== undefined){
|
|
377
|
+
if (value !== null && value !== undefined) {
|
|
370
378
|
const selectedOptionDom = this.createSelectedValueDom(value);
|
|
371
379
|
this.elements.selectedValueWrapper.appendChild(selectedOptionDom);
|
|
372
380
|
}
|
|
373
381
|
}
|
|
374
|
-
createSelectedValueDom(value){
|
|
375
|
-
if(typeof this.callbacks.getSelectedValueDOM == 'function'){
|
|
382
|
+
createSelectedValueDom(value) {
|
|
383
|
+
if (typeof this.callbacks.getSelectedValueDOM == 'function') {
|
|
376
384
|
return this.callbacks.getSelectedValueDOM(value);
|
|
377
|
-
}else {
|
|
385
|
+
} else {
|
|
378
386
|
return this._createSelectedValueDom(value);
|
|
379
387
|
}
|
|
380
388
|
}
|
|
381
|
-
_createSelectedValueDom(value){
|
|
389
|
+
_createSelectedValueDom(value) {
|
|
382
390
|
const valueText = this.callbacks.getOptionTitle(value);
|
|
383
391
|
const selectedOptionDom = document.createElement('div');
|
|
384
392
|
selectedOptionDom.classList.add('selected-value');
|
|
@@ -387,7 +395,7 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
387
395
|
}
|
|
388
396
|
}
|
|
389
397
|
const myElementNotExists = !customElements.get('jb-select');
|
|
390
|
-
if(myElementNotExists){
|
|
398
|
+
if (myElementNotExists) {
|
|
391
399
|
//prevent duplicate registering
|
|
392
400
|
window.customElements.define('jb-select', JBSelectWebComponent);
|
|
393
401
|
}
|
package/dist/JBSelect.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JBSelect.js","sources":["../lib/JBSelect.js"],"sourcesContent":["import HTML from './JBSelect.html';\r\nimport CSS from './JBSelect.scss';\r\nclass JBSelectWebComponent extends HTMLElement {\r\n get value() {\r\n if(this._value){\r\n return this.callbacks.getOptionValue(this._value);\r\n }else{\r\n return null;\r\n }\r\n }\r\n set value(value) {\r\n this._setValueFromOutside(value);\r\n }\r\n get textValue() {\r\n return this._textValue;\r\n }\r\n set textValue(value) {\r\n this._textValue = value;\r\n this.elements.input.value = value;\r\n this.updateOptionList(value);\r\n }\r\n get optionList() {\r\n return this._optionList || [];\r\n }\r\n set optionList(value) {\r\n if(!Array.isArray(value)){\r\n console.error('your provided option list to jb-select is not a array. you must provide array value',{value});\r\n return;\r\n }\r\n this._optionList = value;\r\n //every time optionList get updated we set our value base on current option list we use _notFindedValue in case of value provided to component before optionList\r\n this._displayOptionList = this.filterOptionList(this.textValue);\r\n this._setValueOnOptionListChanged();\r\n this.updateOptionListDOM();\r\n }\r\n get displayOptionList() {\r\n return this._displayOptionList;\r\n }\r\n get isMobileDevice (){ return /Mobi/i.test(window.navigator.userAgent);}\r\n\r\n\r\n constructor() {\r\n super();\r\n this.initWebComponent();\r\n this.initProp();\r\n \r\n }\r\n connectedCallback() {\r\n // standard web component event that called when all of dom is binded\r\n this.callOnLoadEvent();\r\n this.callOnInitEvent();\r\n }\r\n callOnInitEvent() {\r\n var event = new CustomEvent('init', { bubbles: true, composed: true });\r\n this.dispatchEvent(event);\r\n }\r\n callOnLoadEvent() {\r\n var event = new CustomEvent('load', { bubbles: true, composed: true });\r\n this.dispatchEvent(event);\r\n }\r\n initWebComponent() {\r\n const shadowRoot = this.attachShadow({\r\n mode: 'open'\r\n });\r\n const html = `<style>${CSS}</style>` + '\\n' + HTML;\r\n const element = document.createElement('template');\r\n element.innerHTML = html;\r\n shadowRoot.appendChild(element.content.cloneNode(true));\r\n this.elements = {\r\n input: shadowRoot.querySelector('.select-box input'),\r\n componentWrapper: shadowRoot.querySelector('.jb-select-web-component'),\r\n selectedValueWrapper: shadowRoot.querySelector('.selected-value-wrapper'),\r\n };\r\n this._optionListElement = shadowRoot.querySelector('.select-list');\r\n this._optionListElementWrapper = shadowRoot.querySelector('.select-list-wrapper');\r\n this.registerEventListener();\r\n \r\n }\r\n registerEventListener() {\r\n this.elements.input.addEventListener('change', this.onInputChange.bind(this));\r\n this.elements.input.addEventListener('keypress', this.onInputKeyPress.bind(this));\r\n this.elements.input.addEventListener('keyup', this.onInputKeyup.bind(this));\r\n this.elements.input.addEventListener('beforeinput', this.onInputBeforeInput.bind(this));\r\n this.elements.input.addEventListener('input', this.onInputInput.bind(this));\r\n this.elements.input.addEventListener('focus', this.onInputFocus.bind(this));\r\n this.elements.input.addEventListener('blur', this.onInputBlur.bind(this));\r\n this.shadowRoot.querySelector('.arrow-icon').addEventListener('click', this.onArrowKeyClick.bind(this));\r\n }\r\n initProp() {\r\n this.textValue = '';\r\n /**\r\n * @type {Record<string, function|null>} callbacks\r\n */\r\n this.callbacks = {\r\n getOptionTitle: (option) => { return option; },\r\n getOptionValue: (option) => { return option; },\r\n getOptionDOM:null,\r\n getSelectedValueDOM:null,\r\n };\r\n this.value = this.getAttribute('value') || null;\r\n // if user set value and current option list is not contain the option. \r\n // we hold it in _notFindedValue and select value when option value get updated\r\n this._notFindedValue = null;\r\n this.required = false;\r\n }\r\n static get observedAttributes() {\r\n return ['label', 'message', 'value', 'required', 'placeholder'];\r\n }\r\n attributeChangedCallback(name, oldValue, newValue) {\r\n // do something when an attribute has changed\r\n this.onAttributeChange(name, newValue);\r\n }\r\n onAttributeChange(name, value) {\r\n switch (name) {\r\n case 'label':\r\n this.shadowRoot.querySelector('label .label-value').innerHTML = value;\r\n if(value == null || value == undefined || value == \"\"){\r\n this.shadowRoot.querySelector('label').classList.add('--hide');\r\n }else{\r\n this.shadowRoot.querySelector('label').classList.remove('--hide');\r\n }\r\n break;\r\n case 'message':\r\n this.shadowRoot.querySelector('.message-box').innerHTML = value;\r\n break;\r\n case 'value':\r\n this._setValueFromOutside(value);\r\n break;\r\n case 'required':\r\n if (value === \"\" || value == \"true\" || value == true) {\r\n this.required = true;\r\n } else {\r\n this.required = false;\r\n }\r\n break;\r\n case 'placeholder':\r\n this.elements.input.placeholder = value;\r\n break;\r\n }\r\n\r\n }\r\n _setValueOnOptionListChanged(){\r\n //when option list changed we see if current value is valid for new optionlist we set it if not we reset value to null.\r\n //in some scenario value is setted before otionList attached so we store it on this._notFindedValue and after option list setted we set value from this._notFindedValue\r\n if(this.value || this._notFindedValue){\r\n //if select has no prev value or pending not finded value we dont set it becuase user may input some search terms in input box and developer-user update list base on that value\r\n //if we set it to null the search term and this.textvalue will become null and empty too and it make impossible for user to search in dynamic back-end provided searchable list so we put this condition to prevent it\r\n this._setValueFromOutside(this.value || this._notFindedValue);\r\n }\r\n }\r\n _setValueFromOutside(value) {\r\n //when user set value by attribute or value prop directly we call this function\r\n const matchedOption = this.optionList.find((option) => { // if we have value mapper we set selected value by object that match mapper\r\n if (this.callbacks.getOptionValue(option) == value) {\r\n return option;\r\n }\r\n });\r\n if (matchedOption || value == null) {\r\n this._setValue(matchedOption);\r\n } else {\r\n this._notFindedValue = value;\r\n }\r\n\r\n }\r\n _setValue(value) {\r\n this._notFindedValue = null;\r\n this._value = value;\r\n if ((value == null || value == undefined)) {\r\n this.textValue = '';\r\n this.setSelectedOptionDom(null);\r\n this.shadowRoot.querySelector('.jb-select-web-component').classList.remove('--has-value');\r\n } else {\r\n this.textValue = '';\r\n this.setSelectedOptionDom(value);\r\n this.shadowRoot.querySelector('.jb-select-web-component').classList.add('--has-value');\r\n }\r\n //if user select an option we rest filter so user see all option again when open a select\r\n this.updateOptionList('');\r\n }\r\n onArrowKeyClick(){\r\n if(this._optionListElementWrapper.classList.contains('--show')){\r\n this.blur();\r\n }else{\r\n this.focus();\r\n }\r\n }\r\n onInputKeyPress() {\r\n //TODO: raise keypress event\r\n }\r\n onInputBeforeInput(e){\r\n this.handleSelectedValueDisplay(e.data);\r\n }\r\n onInputInput(e){\r\n this.textValue = e.target.value;\r\n }\r\n onInputKeyup(e) {\r\n const inputText = e.target.value;\r\n //here is the rare time we update _value directly becuase we want trigger event that may read value directly from dom\r\n if (e.key === \"Backspace\" || e.key === \"Delete\") {\r\n //becuase on keyprees dont recieve backspace key press\r\n this.handleSelectedValueDisplay(inputText);\r\n }\r\n \r\n this.triggerOnInputKeyup(e);\r\n \r\n }\r\n handleSelectedValueDisplay(inputValue) {\r\n if(inputValue !== \"\"){\r\n this.elements.selectedValueWrapper.classList.add('--search-typed');\r\n }else{\r\n this.elements.selectedValueWrapper.classList.remove('--search-typed');\r\n }\r\n }\r\n triggerOnInputKeyup(e){\r\n const event = new KeyboardEvent('keyup',{\r\n altKey:e.altKey,\r\n bubbles:e.bubbles,\r\n cancelable:e.cancelable,\r\n code:e.code,\r\n ctrlKey:e.ctrlKey,\r\n detail:e.detail,\r\n key:e.key,\r\n shiftKey:e.shiftKey,\r\n charCode:e.charCode,\r\n location:e.location,\r\n composed:e.composed,\r\n isComposing:e.isComposing,\r\n metaKey:e.metaKey,\r\n repeat:e.repeat,\r\n keyCode:e.keyCode,\r\n view:e.view\r\n });\r\n this.dispatchEvent(event);\r\n }\r\n onInputChange(e) {\r\n const inputText = e.target.value;\r\n //here is the rare time we update _text_value directly becuase we want trigger event that may read value directly from dom\r\n this._textValue = inputText;\r\n }\r\n onInputFocus() {\r\n this.focus();\r\n }\r\n onInputBlur(e) {\r\n let focusedElement = e.relatedTarget;\r\n if (focusedElement === this._optionListElement) {\r\n //user click on a menu item\r\n } else {\r\n this.blur();\r\n }\r\n }\r\n focus(){\r\n this.elements.input.focus();\r\n this.showOptionList();\r\n this.elements.componentWrapper.classList.add('--focused');\r\n \r\n }\r\n blur(){\r\n this.elements.componentWrapper.classList.remove('--focused');\r\n this.textValue = \"\";\r\n this.handleSelectedValueDisplay('');\r\n this.hideOptionList();\r\n this.triggerInputValidation();\r\n }\r\n showOptionList(){\r\n this._optionListElementWrapper.classList.add('--show');\r\n }\r\n hideOptionList() {\r\n this._optionListElementWrapper.classList.remove('--show');\r\n }\r\n updateOptionList(filterText) {\r\n this._displayOptionList = this.filterOptionList(filterText);\r\n this.updateOptionListDOM();\r\n }\r\n updateOptionListDOM() {\r\n const optionDomList = [];\r\n this.displayOptionList.forEach((item) => {\r\n const optionDOM = this.createOptionDOM(item);\r\n optionDomList.push(optionDOM);\r\n });\r\n this._optionListElement.innerHTML = '';\r\n optionDomList.forEach(optionElement => { this._optionListElement.appendChild(optionElement);});\r\n\r\n\r\n }\r\n createOptionDOM(item){\r\n let optionDOM = null;\r\n if(typeof this.callbacks.getOptionDOM == 'function'){\r\n optionDOM = this.callbacks.getOptionDOM(item,this.onOptionClicked.bind(this));\r\n }else{\r\n optionDOM = this._createOptionDom(item);\r\n }\r\n optionDOM.value = item;\r\n return optionDOM;\r\n }\r\n\r\n _createOptionDom(item){\r\n const optionElement = document.createElement('div');\r\n optionElement.classList.add('select-option');\r\n //it has defualt function who return wxact same input\r\n optionElement.innerHTML = this.callbacks.getOptionTitle(item);\r\n optionElement.addEventListener('click', this.onOptionClicked.bind(this));\r\n return optionElement;\r\n }\r\n onOptionClicked(e) {\r\n const value = e.currentTarget.value;\r\n this.selectOption(value);\r\n this.blur();\r\n this._triggerOnChangeEvent();\r\n }\r\n selectOption(value) {\r\n this._setValue(value);\r\n this.triggerInputValidation();\r\n }\r\n filterOptionList(filterString) {\r\n const displayOptionList = [];\r\n this.optionList.filter((option) => {\r\n const optionTitle = this.callbacks.getOptionTitle(option);\r\n const isString = typeof optionTitle == 'string';\r\n if (isString && optionTitle.includes(filterString)) {\r\n displayOptionList.push(option);\r\n }\r\n if (!isString) {\r\n console.warn(\"the provided values for optionsList is not of type string.\", { option, title: optionTitle });\r\n }\r\n });\r\n return displayOptionList;\r\n }\r\n triggerInputValidation(showError = true) {\r\n // this method is public and used outside of component to check if field validity param are met\r\n let errorType = '';\r\n let requiredValid = true;\r\n if (this.required) {\r\n\r\n requiredValid = this.value != null;\r\n if (!requiredValid) {\r\n errorType = 'REQUIRED';\r\n }\r\n }\r\n let isAllValid = requiredValid; //& other validation if they added\r\n if (isAllValid) {\r\n this.clearValidationError();\r\n } else if (showError) {\r\n this.showValidationError(errorType);\r\n }\r\n return {\r\n isAllValid\r\n };\r\n }\r\n showValidationError(errorType) {\r\n if (errorType == 'REQUIRED') {\r\n const label = this.getAttribute('label');\r\n this.shadowRoot.querySelector('.message-box').innerHTML = `${label} حتما باید انتخاب شود`;\r\n this.shadowRoot.querySelector('.message-box').classList.add('--error');\r\n }\r\n }\r\n clearValidationError() {\r\n this.shadowRoot.querySelector('.message-box').innerHTML = this.getAttribute('message') || '';\r\n this.shadowRoot.querySelector('.message-box').classList.remove('--error');\r\n\r\n }\r\n _triggerOnChangeEvent() {\r\n const event = new Event(\"change\");\r\n this.dispatchEvent(event);\r\n }\r\n setSelectedOptionDom(value) {\r\n //when user select option or value changed in any condition we set selected option DOM\r\n this.elements.selectedValueWrapper.innerHTML = '';\r\n //if value was null or undifined it remain empty\r\n if(value !== null && value !== undefined){\r\n const selectedOptionDom = this.createSelectedValueDom(value);\r\n this.elements.selectedValueWrapper.appendChild(selectedOptionDom);\r\n }\r\n }\r\n createSelectedValueDom(value){\r\n if(typeof this.callbacks.getSelectedValueDOM == 'function'){\r\n return this.callbacks.getSelectedValueDOM(value);\r\n }else{\r\n return this._createSelectedValueDom(value);\r\n }\r\n }\r\n _createSelectedValueDom(value){\r\n const valueText = this.callbacks.getOptionTitle(value);\r\n const selectedOptionDom = document.createElement('div');\r\n selectedOptionDom.classList.add('selected-value');\r\n selectedOptionDom.innerHTML = valueText;\r\n return selectedOptionDom;\r\n }\r\n}\r\nconst myElementNotExists = !customElements.get('jb-select');\r\nif(myElementNotExists){\r\n //prevent duplicate registering\r\n window.customElements.define('jb-select', JBSelectWebComponent);\r\n}\r\n"],"names":["CSS"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"JBSelect.js","sources":["../lib/JBSelect.js"],"sourcesContent":["import HTML from './JBSelect.html';\r\nimport CSS from './JBSelect.scss';\r\nclass JBSelectWebComponent extends HTMLElement {\r\n get value() {\r\n if (this._value) {\r\n return this.callbacks.getOptionValue(this._value);\r\n } else {\r\n return null;\r\n }\r\n }\r\n set value(value) {\r\n this._setValueFromOutside(value);\r\n }\r\n get textValue() {\r\n return this._textValue;\r\n\r\n }\r\n set textValue(value) {\r\n this._textValue = value;\r\n this.elements.input.value = value;\r\n this.updateOptionList(value);\r\n }\r\n get selectedOptionTitle() {\r\n if (this.value) {\r\n return this.callbacks.getOptionTitle(this._value);\r\n } else {\r\n return \"\";\r\n }\r\n }\r\n get optionList() {\r\n return this._optionList || [];\r\n }\r\n set optionList(value) {\r\n if (!Array.isArray(value)) {\r\n console.error('your provided option list to jb-select is not a array. you must provide array value', { value });\r\n return;\r\n }\r\n this._optionList = value;\r\n //every time optionList get updated we set our value base on current option list we use _notFindedValue in case of value provided to component before optionList\r\n this._displayOptionList = this.filterOptionList(this.textValue);\r\n this._setValueOnOptionListChanged();\r\n this.updateOptionListDOM();\r\n }\r\n get displayOptionList() {\r\n return this._displayOptionList;\r\n }\r\n get isMobileDevice() { return /Mobi/i.test(window.navigator.userAgent); }\r\n\r\n\r\n constructor() {\r\n super();\r\n this.initWebComponent();\r\n this.initProp();\r\n\r\n }\r\n connectedCallback() {\r\n // standard web component event that called when all of dom is binded\r\n this.callOnLoadEvent();\r\n this.callOnInitEvent();\r\n }\r\n callOnInitEvent() {\r\n var event = new CustomEvent('init', { bubbles: true, composed: true });\r\n this.dispatchEvent(event);\r\n }\r\n callOnLoadEvent() {\r\n var event = new CustomEvent('load', { bubbles: true, composed: true });\r\n this.dispatchEvent(event);\r\n }\r\n initWebComponent() {\r\n const shadowRoot = this.attachShadow({\r\n mode: 'open'\r\n });\r\n const html = `<style>${CSS}</style>` + '\\n' + HTML;\r\n const element = document.createElement('template');\r\n element.innerHTML = html;\r\n shadowRoot.appendChild(element.content.cloneNode(true));\r\n this.elements = {\r\n input: shadowRoot.querySelector('.select-box input'),\r\n componentWrapper: shadowRoot.querySelector('.jb-select-web-component'),\r\n selectedValueWrapper: shadowRoot.querySelector('.selected-value-wrapper'),\r\n };\r\n this._optionListElement = shadowRoot.querySelector('.select-list');\r\n this._optionListElementWrapper = shadowRoot.querySelector('.select-list-wrapper');\r\n this.registerEventListener();\r\n\r\n }\r\n registerEventListener() {\r\n this.elements.input.addEventListener('change', this.onInputChange.bind(this));\r\n this.elements.input.addEventListener('keypress', this.onInputKeyPress.bind(this));\r\n this.elements.input.addEventListener('keyup', this.onInputKeyup.bind(this));\r\n this.elements.input.addEventListener('beforeinput', this.onInputBeforeInput.bind(this));\r\n this.elements.input.addEventListener('input', this.onInputInput.bind(this));\r\n this.elements.input.addEventListener('focus', this.onInputFocus.bind(this));\r\n this.elements.input.addEventListener('blur', this.onInputBlur.bind(this));\r\n this.shadowRoot.querySelector('.arrow-icon').addEventListener('click', this.onArrowKeyClick.bind(this));\r\n }\r\n initProp() {\r\n this.textValue = '';\r\n /**\r\n * @type {Record<string, function|null>} callbacks\r\n */\r\n this.callbacks = {\r\n getOptionTitle: (option) => { return option; },\r\n getOptionValue: (option) => { return option; },\r\n getOptionDOM: null,\r\n getSelectedValueDOM: null,\r\n };\r\n this.value = this.getAttribute('value') || null;\r\n // if user set value and current option list is not contain the option. \r\n // we hold it in _notFindedValue and select value when option value get updated\r\n this._notFindedValue = null;\r\n this.required = false;\r\n }\r\n static get observedAttributes() {\r\n return ['label', 'message', 'value', 'required', 'placeholder'];\r\n }\r\n attributeChangedCallback(name, oldValue, newValue) {\r\n // do something when an attribute has changed\r\n this.onAttributeChange(name, newValue);\r\n }\r\n onAttributeChange(name, value) {\r\n switch (name) {\r\n case 'label':\r\n this.shadowRoot.querySelector('label .label-value').innerHTML = value;\r\n if (value == null || value == undefined || value == \"\") {\r\n this.shadowRoot.querySelector('label').classList.add('--hide');\r\n } else {\r\n this.shadowRoot.querySelector('label').classList.remove('--hide');\r\n }\r\n break;\r\n case 'message':\r\n this.shadowRoot.querySelector('.message-box').innerHTML = value;\r\n break;\r\n case 'value':\r\n this._setValueFromOutside(value);\r\n break;\r\n case 'required':\r\n if (value === \"\" || value == \"true\" || value == true) {\r\n this.required = true;\r\n } else {\r\n this.required = false;\r\n }\r\n break;\r\n case 'placeholder':\r\n this.elements.input.placeholder = value;\r\n break;\r\n }\r\n\r\n }\r\n _setValueOnOptionListChanged() {\r\n //when option list changed we see if current value is valid for new optionlist we set it if not we reset value to null.\r\n //in some scenario value is setted before otionList attached so we store it on this._notFindedValue and after option list setted we set value from this._notFindedValue\r\n if (this.value || this._notFindedValue) {\r\n //if select has no prev value or pending not finded value we dont set it becuase user may input some search terms in input box and developer-user update list base on that value\r\n //if we set it to null the search term and this.textvalue will become null and empty too and it make impossible for user to search in dynamic back-end provided searchable list so we put this condition to prevent it\r\n this._setValueFromOutside(this.value || this._notFindedValue);\r\n }\r\n }\r\n _setValueFromOutside(value) {\r\n //when user set value by attribute or value prop directly we call this function\r\n const matchedOption = this.optionList.find((option) => { // if we have value mapper we set selected value by object that match mapper\r\n if (this.callbacks.getOptionValue(option) == value) {\r\n return option;\r\n }\r\n });\r\n if (matchedOption || value == null) {\r\n this._setValue(matchedOption);\r\n } else {\r\n this._notFindedValue = value;\r\n }\r\n\r\n }\r\n _setValue(value) {\r\n this._notFindedValue = null;\r\n this._value = value;\r\n if ((value == null || value == undefined)) {\r\n this.textValue = '';\r\n this.setSelectedOptionDom(null);\r\n this.shadowRoot.querySelector('.jb-select-web-component').classList.remove('--has-value');\r\n } else {\r\n this.textValue = '';\r\n this.setSelectedOptionDom(value);\r\n this.shadowRoot.querySelector('.jb-select-web-component').classList.add('--has-value');\r\n }\r\n //if user select an option we rest filter so user see all option again when open a select\r\n this.updateOptionList('');\r\n }\r\n onArrowKeyClick() {\r\n if (this._optionListElementWrapper.classList.contains('--show')) {\r\n this.blur();\r\n } else {\r\n this.focus();\r\n }\r\n }\r\n onInputKeyPress() {\r\n //TODO: raise keypress event\r\n }\r\n onInputBeforeInput(e) {\r\n this.handleSelectedValueDisplay(e.data);\r\n }\r\n onInputInput(e) {\r\n this.textValue = e.target.value;\r\n }\r\n onInputKeyup(e) {\r\n const inputText = e.target.value;\r\n //here is the rare time we update _value directly becuase we want trigger event that may read value directly from dom\r\n if (e.key === \"Backspace\" || e.key === \"Delete\") {\r\n //becuase on keyprees dont recieve backspace key press\r\n this.handleSelectedValueDisplay(inputText);\r\n }\r\n\r\n this.triggerOnInputKeyup(e);\r\n\r\n }\r\n handleSelectedValueDisplay(inputValue) {\r\n if (inputValue !== \"\") {\r\n this.elements.selectedValueWrapper.classList.add('--search-typed');\r\n } else {\r\n this.elements.selectedValueWrapper.classList.remove('--search-typed');\r\n }\r\n }\r\n triggerOnInputKeyup(e) {\r\n const event = new KeyboardEvent('keyup', {\r\n altKey: e.altKey,\r\n bubbles: e.bubbles,\r\n cancelable: e.cancelable,\r\n code: e.code,\r\n ctrlKey: e.ctrlKey,\r\n detail: e.detail,\r\n key: e.key,\r\n shiftKey: e.shiftKey,\r\n charCode: e.charCode,\r\n location: e.location,\r\n composed: e.composed,\r\n isComposing: e.isComposing,\r\n metaKey: e.metaKey,\r\n repeat: e.repeat,\r\n keyCode: e.keyCode,\r\n view: e.view\r\n });\r\n this.dispatchEvent(event);\r\n }\r\n onInputChange(e) {\r\n const inputText = e.target.value;\r\n //here is the rare time we update _text_value directly becuase we want trigger event that may read value directly from dom\r\n this._textValue = inputText;\r\n }\r\n onInputFocus() {\r\n this.focus();\r\n }\r\n onInputBlur(e) {\r\n let focusedElement = e.relatedTarget;\r\n if (focusedElement === this._optionListElement) {\r\n //user click on a menu item\r\n } else {\r\n this.blur();\r\n }\r\n }\r\n focus() {\r\n this.elements.input.focus();\r\n this.showOptionList();\r\n this.elements.componentWrapper.classList.add('--focused');\r\n\r\n }\r\n blur() {\r\n this.elements.componentWrapper.classList.remove('--focused');\r\n this.textValue = \"\";\r\n this.handleSelectedValueDisplay('');\r\n this.hideOptionList();\r\n this.triggerInputValidation();\r\n }\r\n showOptionList() {\r\n this._optionListElementWrapper.classList.add('--show');\r\n }\r\n hideOptionList() {\r\n this._optionListElementWrapper.classList.remove('--show');\r\n }\r\n updateOptionList(filterText) {\r\n this._displayOptionList = this.filterOptionList(filterText);\r\n this.updateOptionListDOM();\r\n }\r\n updateOptionListDOM() {\r\n const optionDomList = [];\r\n this.displayOptionList.forEach((item) => {\r\n const optionDOM = this.createOptionDOM(item);\r\n optionDomList.push(optionDOM);\r\n });\r\n this._optionListElement.innerHTML = '';\r\n optionDomList.forEach(optionElement => { this._optionListElement.appendChild(optionElement); });\r\n\r\n\r\n }\r\n createOptionDOM(item) {\r\n let optionDOM = null;\r\n if (typeof this.callbacks.getOptionDOM == 'function') {\r\n optionDOM = this.callbacks.getOptionDOM(item, this.onOptionClicked.bind(this));\r\n } else {\r\n optionDOM = this._createOptionDom(item);\r\n }\r\n optionDOM.value = item;\r\n return optionDOM;\r\n }\r\n\r\n _createOptionDom(item) {\r\n const optionElement = document.createElement('div');\r\n optionElement.classList.add('select-option');\r\n //it has defualt function who return wxact same input\r\n optionElement.innerHTML = this.callbacks.getOptionTitle(item);\r\n optionElement.addEventListener('click', this.onOptionClicked.bind(this));\r\n return optionElement;\r\n }\r\n onOptionClicked(e) {\r\n const value = e.currentTarget.value;\r\n this.selectOption(value);\r\n this.blur();\r\n this._triggerOnChangeEvent();\r\n }\r\n selectOption(value) {\r\n this._setValue(value);\r\n this.triggerInputValidation();\r\n }\r\n filterOptionList(filterString) {\r\n const displayOptionList = [];\r\n this.optionList.filter((option) => {\r\n const optionTitle = this.callbacks.getOptionTitle(option);\r\n const isString = typeof optionTitle == 'string';\r\n if (isString && optionTitle.includes(filterString)) {\r\n displayOptionList.push(option);\r\n }\r\n if (!isString) {\r\n console.warn(\"the provided values for optionsList is not of type string.\", { option, title: optionTitle });\r\n }\r\n });\r\n return displayOptionList;\r\n }\r\n triggerInputValidation(showError = true) {\r\n // this method is public and used outside of component to check if field validity param are met\r\n let errorType = '';\r\n let requiredValid = true;\r\n if (this.required) {\r\n\r\n requiredValid = this.value != null;\r\n if (!requiredValid) {\r\n errorType = 'REQUIRED';\r\n }\r\n }\r\n let isAllValid = requiredValid; //& other validation if they added\r\n if (isAllValid) {\r\n this.clearValidationError();\r\n } else if (showError) {\r\n this.showValidationError(errorType);\r\n }\r\n return {\r\n isAllValid\r\n };\r\n }\r\n showValidationError(errorType) {\r\n if (errorType == 'REQUIRED') {\r\n const label = this.getAttribute('label');\r\n this.shadowRoot.querySelector('.message-box').innerHTML = `${label} حتما باید انتخاب شود`;\r\n this.shadowRoot.querySelector('.message-box').classList.add('--error');\r\n }\r\n }\r\n clearValidationError() {\r\n this.shadowRoot.querySelector('.message-box').innerHTML = this.getAttribute('message') || '';\r\n this.shadowRoot.querySelector('.message-box').classList.remove('--error');\r\n\r\n }\r\n _triggerOnChangeEvent() {\r\n const event = new Event(\"change\");\r\n this.dispatchEvent(event);\r\n }\r\n setSelectedOptionDom(value) {\r\n //when user select option or value changed in any condition we set selected option DOM\r\n this.elements.selectedValueWrapper.innerHTML = '';\r\n //if value was null or undifined it remain empty\r\n if (value !== null && value !== undefined) {\r\n const selectedOptionDom = this.createSelectedValueDom(value);\r\n this.elements.selectedValueWrapper.appendChild(selectedOptionDom);\r\n }\r\n }\r\n createSelectedValueDom(value) {\r\n if (typeof this.callbacks.getSelectedValueDOM == 'function') {\r\n return this.callbacks.getSelectedValueDOM(value);\r\n } else {\r\n return this._createSelectedValueDom(value);\r\n }\r\n }\r\n _createSelectedValueDom(value) {\r\n const valueText = this.callbacks.getOptionTitle(value);\r\n const selectedOptionDom = document.createElement('div');\r\n selectedOptionDom.classList.add('selected-value');\r\n selectedOptionDom.innerHTML = valueText;\r\n return selectedOptionDom;\r\n }\r\n}\r\nconst myElementNotExists = !customElements.get('jb-select');\r\nif (myElementNotExists) {\r\n //prevent duplicate registering\r\n window.customElements.define('jb-select', JBSelectWebComponent);\r\n}\r\n"],"names":["CSS"],"mappings":"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"}
|
package/lib/JBSelect.js
CHANGED
|
@@ -2,9 +2,9 @@ import HTML from './JBSelect.html';
|
|
|
2
2
|
import CSS from './JBSelect.scss';
|
|
3
3
|
class JBSelectWebComponent extends HTMLElement {
|
|
4
4
|
get value() {
|
|
5
|
-
if(this._value){
|
|
5
|
+
if (this._value) {
|
|
6
6
|
return this.callbacks.getOptionValue(this._value);
|
|
7
|
-
}else{
|
|
7
|
+
} else {
|
|
8
8
|
return null;
|
|
9
9
|
}
|
|
10
10
|
}
|
|
@@ -13,18 +13,26 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
13
13
|
}
|
|
14
14
|
get textValue() {
|
|
15
15
|
return this._textValue;
|
|
16
|
+
|
|
16
17
|
}
|
|
17
18
|
set textValue(value) {
|
|
18
19
|
this._textValue = value;
|
|
19
20
|
this.elements.input.value = value;
|
|
20
21
|
this.updateOptionList(value);
|
|
21
22
|
}
|
|
23
|
+
get selectedOptionTitle() {
|
|
24
|
+
if (this.value) {
|
|
25
|
+
return this.callbacks.getOptionTitle(this._value);
|
|
26
|
+
} else {
|
|
27
|
+
return "";
|
|
28
|
+
}
|
|
29
|
+
}
|
|
22
30
|
get optionList() {
|
|
23
31
|
return this._optionList || [];
|
|
24
32
|
}
|
|
25
33
|
set optionList(value) {
|
|
26
|
-
if(!Array.isArray(value)){
|
|
27
|
-
console.error('your provided option list to jb-select is not a array. you must provide array value',{value});
|
|
34
|
+
if (!Array.isArray(value)) {
|
|
35
|
+
console.error('your provided option list to jb-select is not a array. you must provide array value', { value });
|
|
28
36
|
return;
|
|
29
37
|
}
|
|
30
38
|
this._optionList = value;
|
|
@@ -36,14 +44,14 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
36
44
|
get displayOptionList() {
|
|
37
45
|
return this._displayOptionList;
|
|
38
46
|
}
|
|
39
|
-
get isMobileDevice
|
|
47
|
+
get isMobileDevice() { return /Mobi/i.test(window.navigator.userAgent); }
|
|
40
48
|
|
|
41
49
|
|
|
42
50
|
constructor() {
|
|
43
51
|
super();
|
|
44
52
|
this.initWebComponent();
|
|
45
53
|
this.initProp();
|
|
46
|
-
|
|
54
|
+
|
|
47
55
|
}
|
|
48
56
|
connectedCallback() {
|
|
49
57
|
// standard web component event that called when all of dom is binded
|
|
@@ -74,7 +82,7 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
74
82
|
this._optionListElement = shadowRoot.querySelector('.select-list');
|
|
75
83
|
this._optionListElementWrapper = shadowRoot.querySelector('.select-list-wrapper');
|
|
76
84
|
this.registerEventListener();
|
|
77
|
-
|
|
85
|
+
|
|
78
86
|
}
|
|
79
87
|
registerEventListener() {
|
|
80
88
|
this.elements.input.addEventListener('change', this.onInputChange.bind(this));
|
|
@@ -94,8 +102,8 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
94
102
|
this.callbacks = {
|
|
95
103
|
getOptionTitle: (option) => { return option; },
|
|
96
104
|
getOptionValue: (option) => { return option; },
|
|
97
|
-
getOptionDOM:null,
|
|
98
|
-
getSelectedValueDOM:null,
|
|
105
|
+
getOptionDOM: null,
|
|
106
|
+
getSelectedValueDOM: null,
|
|
99
107
|
};
|
|
100
108
|
this.value = this.getAttribute('value') || null;
|
|
101
109
|
// if user set value and current option list is not contain the option.
|
|
@@ -114,9 +122,9 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
114
122
|
switch (name) {
|
|
115
123
|
case 'label':
|
|
116
124
|
this.shadowRoot.querySelector('label .label-value').innerHTML = value;
|
|
117
|
-
if(value == null || value == undefined || value == ""){
|
|
125
|
+
if (value == null || value == undefined || value == "") {
|
|
118
126
|
this.shadowRoot.querySelector('label').classList.add('--hide');
|
|
119
|
-
}else{
|
|
127
|
+
} else {
|
|
120
128
|
this.shadowRoot.querySelector('label').classList.remove('--hide');
|
|
121
129
|
}
|
|
122
130
|
break;
|
|
@@ -139,10 +147,10 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
139
147
|
}
|
|
140
148
|
|
|
141
149
|
}
|
|
142
|
-
_setValueOnOptionListChanged(){
|
|
150
|
+
_setValueOnOptionListChanged() {
|
|
143
151
|
//when option list changed we see if current value is valid for new optionlist we set it if not we reset value to null.
|
|
144
152
|
//in some scenario value is setted before otionList attached so we store it on this._notFindedValue and after option list setted we set value from this._notFindedValue
|
|
145
|
-
if(this.value || this._notFindedValue){
|
|
153
|
+
if (this.value || this._notFindedValue) {
|
|
146
154
|
//if select has no prev value or pending not finded value we dont set it becuase user may input some search terms in input box and developer-user update list base on that value
|
|
147
155
|
//if we set it to null the search term and this.textvalue will become null and empty too and it make impossible for user to search in dynamic back-end provided searchable list so we put this condition to prevent it
|
|
148
156
|
this._setValueFromOutside(this.value || this._notFindedValue);
|
|
@@ -177,20 +185,20 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
177
185
|
//if user select an option we rest filter so user see all option again when open a select
|
|
178
186
|
this.updateOptionList('');
|
|
179
187
|
}
|
|
180
|
-
onArrowKeyClick(){
|
|
181
|
-
if(this._optionListElementWrapper.classList.contains('--show')){
|
|
188
|
+
onArrowKeyClick() {
|
|
189
|
+
if (this._optionListElementWrapper.classList.contains('--show')) {
|
|
182
190
|
this.blur();
|
|
183
|
-
}else{
|
|
191
|
+
} else {
|
|
184
192
|
this.focus();
|
|
185
193
|
}
|
|
186
194
|
}
|
|
187
195
|
onInputKeyPress() {
|
|
188
196
|
//TODO: raise keypress event
|
|
189
197
|
}
|
|
190
|
-
onInputBeforeInput(e){
|
|
198
|
+
onInputBeforeInput(e) {
|
|
191
199
|
this.handleSelectedValueDisplay(e.data);
|
|
192
200
|
}
|
|
193
|
-
onInputInput(e){
|
|
201
|
+
onInputInput(e) {
|
|
194
202
|
this.textValue = e.target.value;
|
|
195
203
|
}
|
|
196
204
|
onInputKeyup(e) {
|
|
@@ -200,35 +208,35 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
200
208
|
//becuase on keyprees dont recieve backspace key press
|
|
201
209
|
this.handleSelectedValueDisplay(inputText);
|
|
202
210
|
}
|
|
203
|
-
|
|
211
|
+
|
|
204
212
|
this.triggerOnInputKeyup(e);
|
|
205
|
-
|
|
213
|
+
|
|
206
214
|
}
|
|
207
215
|
handleSelectedValueDisplay(inputValue) {
|
|
208
|
-
if(inputValue !== ""){
|
|
216
|
+
if (inputValue !== "") {
|
|
209
217
|
this.elements.selectedValueWrapper.classList.add('--search-typed');
|
|
210
|
-
}else{
|
|
218
|
+
} else {
|
|
211
219
|
this.elements.selectedValueWrapper.classList.remove('--search-typed');
|
|
212
220
|
}
|
|
213
221
|
}
|
|
214
|
-
triggerOnInputKeyup(e){
|
|
215
|
-
const event = new KeyboardEvent('keyup',{
|
|
216
|
-
altKey:e.altKey,
|
|
217
|
-
bubbles:e.bubbles,
|
|
218
|
-
cancelable:e.cancelable,
|
|
219
|
-
code:e.code,
|
|
220
|
-
ctrlKey:e.ctrlKey,
|
|
221
|
-
detail:e.detail,
|
|
222
|
-
key:e.key,
|
|
223
|
-
shiftKey:e.shiftKey,
|
|
224
|
-
charCode:e.charCode,
|
|
225
|
-
location:e.location,
|
|
226
|
-
composed:e.composed,
|
|
227
|
-
isComposing:e.isComposing,
|
|
228
|
-
metaKey:e.metaKey,
|
|
229
|
-
repeat:e.repeat,
|
|
230
|
-
keyCode:e.keyCode,
|
|
231
|
-
view:e.view
|
|
222
|
+
triggerOnInputKeyup(e) {
|
|
223
|
+
const event = new KeyboardEvent('keyup', {
|
|
224
|
+
altKey: e.altKey,
|
|
225
|
+
bubbles: e.bubbles,
|
|
226
|
+
cancelable: e.cancelable,
|
|
227
|
+
code: e.code,
|
|
228
|
+
ctrlKey: e.ctrlKey,
|
|
229
|
+
detail: e.detail,
|
|
230
|
+
key: e.key,
|
|
231
|
+
shiftKey: e.shiftKey,
|
|
232
|
+
charCode: e.charCode,
|
|
233
|
+
location: e.location,
|
|
234
|
+
composed: e.composed,
|
|
235
|
+
isComposing: e.isComposing,
|
|
236
|
+
metaKey: e.metaKey,
|
|
237
|
+
repeat: e.repeat,
|
|
238
|
+
keyCode: e.keyCode,
|
|
239
|
+
view: e.view
|
|
232
240
|
});
|
|
233
241
|
this.dispatchEvent(event);
|
|
234
242
|
}
|
|
@@ -248,20 +256,20 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
248
256
|
this.blur();
|
|
249
257
|
}
|
|
250
258
|
}
|
|
251
|
-
focus(){
|
|
259
|
+
focus() {
|
|
252
260
|
this.elements.input.focus();
|
|
253
261
|
this.showOptionList();
|
|
254
262
|
this.elements.componentWrapper.classList.add('--focused');
|
|
255
|
-
|
|
263
|
+
|
|
256
264
|
}
|
|
257
|
-
blur(){
|
|
265
|
+
blur() {
|
|
258
266
|
this.elements.componentWrapper.classList.remove('--focused');
|
|
259
267
|
this.textValue = "";
|
|
260
268
|
this.handleSelectedValueDisplay('');
|
|
261
269
|
this.hideOptionList();
|
|
262
270
|
this.triggerInputValidation();
|
|
263
271
|
}
|
|
264
|
-
showOptionList(){
|
|
272
|
+
showOptionList() {
|
|
265
273
|
this._optionListElementWrapper.classList.add('--show');
|
|
266
274
|
}
|
|
267
275
|
hideOptionList() {
|
|
@@ -278,22 +286,22 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
278
286
|
optionDomList.push(optionDOM);
|
|
279
287
|
});
|
|
280
288
|
this._optionListElement.innerHTML = '';
|
|
281
|
-
optionDomList.forEach(optionElement => { this._optionListElement.appendChild(optionElement);});
|
|
289
|
+
optionDomList.forEach(optionElement => { this._optionListElement.appendChild(optionElement); });
|
|
282
290
|
|
|
283
291
|
|
|
284
292
|
}
|
|
285
|
-
createOptionDOM(item){
|
|
293
|
+
createOptionDOM(item) {
|
|
286
294
|
let optionDOM = null;
|
|
287
|
-
if(typeof this.callbacks.getOptionDOM == 'function'){
|
|
288
|
-
optionDOM = this.callbacks.getOptionDOM(item,this.onOptionClicked.bind(this));
|
|
289
|
-
}else{
|
|
295
|
+
if (typeof this.callbacks.getOptionDOM == 'function') {
|
|
296
|
+
optionDOM = this.callbacks.getOptionDOM(item, this.onOptionClicked.bind(this));
|
|
297
|
+
} else {
|
|
290
298
|
optionDOM = this._createOptionDom(item);
|
|
291
299
|
}
|
|
292
300
|
optionDOM.value = item;
|
|
293
301
|
return optionDOM;
|
|
294
302
|
}
|
|
295
303
|
|
|
296
|
-
_createOptionDom(item){
|
|
304
|
+
_createOptionDom(item) {
|
|
297
305
|
const optionElement = document.createElement('div');
|
|
298
306
|
optionElement.classList.add('select-option');
|
|
299
307
|
//it has defualt function who return wxact same input
|
|
@@ -366,19 +374,19 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
366
374
|
//when user select option or value changed in any condition we set selected option DOM
|
|
367
375
|
this.elements.selectedValueWrapper.innerHTML = '';
|
|
368
376
|
//if value was null or undifined it remain empty
|
|
369
|
-
if(value !== null && value !== undefined){
|
|
377
|
+
if (value !== null && value !== undefined) {
|
|
370
378
|
const selectedOptionDom = this.createSelectedValueDom(value);
|
|
371
379
|
this.elements.selectedValueWrapper.appendChild(selectedOptionDom);
|
|
372
380
|
}
|
|
373
381
|
}
|
|
374
|
-
createSelectedValueDom(value){
|
|
375
|
-
if(typeof this.callbacks.getSelectedValueDOM == 'function'){
|
|
382
|
+
createSelectedValueDom(value) {
|
|
383
|
+
if (typeof this.callbacks.getSelectedValueDOM == 'function') {
|
|
376
384
|
return this.callbacks.getSelectedValueDOM(value);
|
|
377
|
-
}else{
|
|
385
|
+
} else {
|
|
378
386
|
return this._createSelectedValueDom(value);
|
|
379
387
|
}
|
|
380
388
|
}
|
|
381
|
-
_createSelectedValueDom(value){
|
|
389
|
+
_createSelectedValueDom(value) {
|
|
382
390
|
const valueText = this.callbacks.getOptionTitle(value);
|
|
383
391
|
const selectedOptionDom = document.createElement('div');
|
|
384
392
|
selectedOptionDom.classList.add('selected-value');
|
|
@@ -387,7 +395,7 @@ class JBSelectWebComponent extends HTMLElement {
|
|
|
387
395
|
}
|
|
388
396
|
}
|
|
389
397
|
const myElementNotExists = !customElements.get('jb-select');
|
|
390
|
-
if(myElementNotExists){
|
|
398
|
+
if (myElementNotExists) {
|
|
391
399
|
//prevent duplicate registering
|
|
392
400
|
window.customElements.define('jb-select', JBSelectWebComponent);
|
|
393
401
|
}
|