jb-select 2.0.3 → 2.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +11 -0
  2. package/dist/JBSelect.js +3 -2
  3. package/dist/JBSelect.js.map +1 -1
  4. package/lib/JBSelect.js +2 -1
  5. package/lib/JBSelect.scss +1 -1
  6. package/package.json +1 -1
package/README.md CHANGED
@@ -17,6 +17,16 @@ use `<jb-select></jb-select>`
17
17
  if ypu want to add option to jb-select set option list to DOM
18
18
  `const dropDownElement = document.querySelector('jb-select').optionList = [your option array]`
19
19
 
20
+ ### get value
21
+
22
+ its simple like any other form element use `.value` of dom
23
+
24
+ ```javascript
25
+ //get value
26
+ document.querySelector('jb-select').value;
27
+ // if you use a object in option list you can get selected option title beside value
28
+ document.querySelector('jb-select').selectedOptionTitle;
29
+ ```
20
30
  ### set value
21
31
 
22
32
  to select value in your code you have 2 option:
@@ -97,4 +107,5 @@ if you want to set a custom style to this web-component all you need is to set c
97
107
  | --jb-select-input-color | color of input value |
98
108
  | --jb-select-bgcolor-selected | set background color for selected status |
99
109
  | --jb-select-selected-value-color | selected value text color default is `#1f1735` |
110
+ | --jb-select-message-color | message text color default is `#929292` |
100
111
 
package/dist/JBSelect.js CHANGED
@@ -1,6 +1,6 @@
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 @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== */";
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: var(--jb-select-message-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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QixhQUFhO1FBQ2IsbUJBQW1CO1FBQ25CLGdCQUFnQjtRQUNoQiw2Q0FBNkM7UUFDN0MsZ0VBQWdFLEVBQUU7UUFDbEU7VUFDRSx5RUFBeUU7VUFDekUsZ0RBQWdEO1VBQ2hELGVBQWUsRUFBRSIsImZpbGUiOiJKQlNlbGVjdC5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IHtcbiAgd2lkdGg6IHZhcigtLWpiLXNlbGVjdC13aWR0aCwgMTAwJSk7XG4gIG1hcmdpbjogdmFyKC0tamItc2VsZWN0LW1hcmdpbiwgMTJweCAwKTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBib3gtc2l6aW5nOiBib3JkZXItYm94OyB9XG4gIEBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50Li0tZm9jdXNlZCB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB0b3A6IDA7XG4gICAgICBsZWZ0OiAwO1xuICAgICAgYmFja2dyb3VuZC1jb2xvcjogIzAwMDg7XG4gICAgICB3aWR0aDogMTAwdnc7XG4gICAgICBoZWlnaHQ6IDEwMHZoO1xuICAgICAgbWFyZ2luOiAwO1xuICAgICAgcGFkZGluZzogMTZweCA4cHg7XG4gICAgICB6LWluZGV4OiA5MDA7IH0gfVxuICBAbWVkaWEgKG1pbi13aWR0aDogMzIwcHgpIGFuZCAobWF4LXdpZHRoOiA3NjdweCkge1xuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudC4tLWZvY3VzZWQgLnNlbGVjdC1saXN0LXdyYXBwZXIge1xuICAgICAgcG9zaXRpb246IGluaXRpYWw7XG4gICAgICBtYXJnaW46IDE2cHggMDtcbiAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItcmFkaXVzLCAxNnB4KTsgfSB9XG4gIEBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50Li0tZm9jdXNlZCBsYWJlbCB7XG4gICAgICBjb2xvcjogI2ZmZjtcbiAgICAgIGZvbnQtc2l6ZTogMS41ZW07IH0gfVxuICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQuLS1oYXMtdmFsdWUgLnNlbGVjdC1ib3gge1xuICAgIGJvcmRlci1jb2xvcjogdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvci1zZWxlY3RlZCwgI2MzZmYxNCk7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tamItc2VsZWN0LWJnY29sb3Itc2VsZWN0ZWQsICNmN2Y2ZjYpOyB9XG4gIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCBsYWJlbCB7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgbWFyZ2luOiA0cHggMHB4O1xuICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgIGZvbnQtc2l6ZTogMC44ZW07XG4gICAgY29sb3I6IHZhcigtLWpiLXNlbGVjdC1sYWJlbC1jb2xvciwgIzFmMTczNSk7IH1cbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgbGFiZWwuLS1oaWRlIHtcbiAgICAgIGRpc3BsYXk6IG5vbmU7IH1cbiAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IHtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIGhlaWdodDogdmFyKC0tamItc2VsZWN0LWhlaWdodCwgNDBweCk7XG4gICAgYm9yZGVyOiBzb2xpZCB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXdpZHRoLCAxcHgpIHZhcigtLWpiLXNlbGVjdC1ib3JkZXItY29sb3IsICNmN2Y2ZjYpO1xuICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWpiLXNlbGVjdC1iZ2NvbG9yLCAjZjdmNmY2KTtcbiAgICBib3JkZXItYm90dG9tOiBzb2xpZCB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWJvdHRvbS13aWR0aCwgM3B4KSB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjZjdmNmY2KTtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCk7XG4gICAgbWFyZ2luOiA0cHggMHB4O1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gICAgcGFkZGluZy1pbmxpbmUtZW5kOiAxNnB4O1xuICAgIGdhcDogOHB4O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTsgfVxuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveDpmb2N1cy13aXRoaW4ge1xuICAgICAgYm9yZGVyLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjMWUyODMyKTtcbiAgICAgIGJvcmRlci1ib3R0b20tY29sb3I6IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItY29sb3IsICNmN2Y2ZjYpO1xuICAgICAgYm9yZGVyLXJhZGl1czogdmFyKC0tamItc2VsZWN0LWJvcmRlci1yYWRpdXMsIDE2cHgpIHZhcigtLWpiLXNlbGVjdC1ib3JkZXItcmFkaXVzLCAxNnB4KSAwIDA7IH1cbiAgICAgIEBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gICAgICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveDpmb2N1cy13aXRoaW4ge1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWpiLXNlbGVjdC1ib3JkZXItcmFkaXVzLCAxNnB4KTtcbiAgICAgICAgICBib3JkZXItYm90dG9tLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLWNvbG9yLCAjMWUyODMyKTsgfSB9XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94IC5zZWxlY3RlZC12YWx1ZS13cmFwcGVyIHtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgYm9yZGVyLXJhZGl1czogaW5oZXJpdDtcbiAgICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgICB6LWluZGV4OiAxOyB9XG4gICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3ggLnNlbGVjdGVkLXZhbHVlLXdyYXBwZXIuLS1zZWFyY2gtdHlwZWQge1xuICAgICAgICBvcGFjaXR5OiAwOyB9XG4gICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3ggLnNlbGVjdGVkLXZhbHVlLXdyYXBwZXIgLnNlbGVjdGVkLXZhbHVlIHtcbiAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gICAgICAgIHBhZGRpbmc6IDJweCAxMnB4IDAgMTJweDtcbiAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgIGZvbnQtZmFtaWx5OiBpbmhlcml0O1xuICAgICAgICBmb250LXNpemU6IDEuMWVtO1xuICAgICAgICBjb2xvcjogdmFyKC0tamItc2VsZWN0LXNlbGVjdGVkLXZhbHVlLWNvbG9yLCAjMWYxNzM1KTtcbiAgICAgICAgbWFyZ2luOiAwO1xuICAgICAgICBib3JkZXItcmFkaXVzOiAwO1xuICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyOyB9XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtYm94OmZvY3VzLXdpdGhpbiAuc2VsZWN0ZWQtdmFsdWUge1xuICAgICAgb3BhY2l0eTogMC43O1xuICAgICAgdHJhbnNpdGlvbjogYWxsIDAuM3MgZWFzZTsgfVxuICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCAuZnJvbnQtYm94IHtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgYm9yZGVyLXJhZGl1czogaW5oZXJpdDtcbiAgICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgICB6LWluZGV4OiAyOyB9XG4gICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3ggLmZyb250LWJveCBpbnB1dCB7XG4gICAgICAgIGJvcmRlcjogbm9uZTtcbiAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gICAgICAgIHBhZGRpbmc6IDJweCAxMnB4IDAgMTJweDtcbiAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgIGZvbnQtZmFtaWx5OiBpbmhlcml0O1xuICAgICAgICBmb250LXNpemU6IDEuMWVtO1xuICAgICAgICBjb2xvcjogdmFyKC0tamItc2VsZWN0LWlucHV0LWNvbG9yLCAjMWYxNzM1KTtcbiAgICAgICAgbWFyZ2luOiAwO1xuICAgICAgICBib3JkZXItcmFkaXVzOiAwOyB9XG4gICAgICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWJveCAuZnJvbnQtYm94IGlucHV0OmZvY3VzIHtcbiAgICAgICAgICBvdXRsaW5lOiBub25lOyB9XG4gICAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1ib3ggLmZyb250LWJveCAuYXJyb3ctaWNvbiB7XG4gICAgICAgIHdpZHRoOiA4cHg7XG4gICAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgICAgYmFja2dyb3VuZC1pbWFnZTogdXJsKFwiZGF0YTppbWFnZS9zdmcreG1sO3V0ZjgsPHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSc4JyBoZWlnaHQ9JzgnIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJyB2ZXJzaW9uPScxLjEnIGlkPSdMYXllcl8xJyB4PScwcHgnIHk9JzBweCcgdmlld0JveD0nMCAwIDQ5NC4xIDM3MS4xJyBzdHlsZT0nZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0OTQuMSAzNzEuMTsnIHhtbDpzcGFjZT0ncHJlc2VydmUnPjxwYXRoIGQ9J00yOTMsMzQzLjhMNDgwLjksNjkuM2M4LjctMTIuNywxMy4zLTI1LjQsMTMuMy0zNi4xYzAtMjAuNS0xNi41LTMzLjItNDQtMzMuMkg0NEMxNi40LDAsMCwxMi43LDAsMzMuMiAgYzAsMTAuNiw0LjYsMjMuMiwxMy4zLDM1LjlsMTg3LjksMjc0LjZjMTIuMSwxNy43LDI4LjQsMjcuNCw0NS45LDI3LjRDMjY0LjYsMzcxLjEsMjgwLjksMzYxLjQsMjkzLDM0My44eicvPjwvc3ZnPlwiKTtcbiAgICAgICAgYmFja2dyb3VuZC1wb3NpdGlvbjogZW5kO1xuICAgICAgICBiYWNrZ3JvdW5kLXJlcGVhdDogbm8tcmVwZWF0O1xuICAgICAgICBiYWNrZ3JvdW5kLXBvc2l0aW9uLXg6IDA7XG4gICAgICAgIGJhY2tncm91bmQtcG9zaXRpb24teTogY2VudGVyOyB9XG4gIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAubWVzc2FnZS1ib3gge1xuICAgIGZvbnQtc2l6ZTogMC43ZW07XG4gICAgcGFkZGluZzogMnB4IDhweDtcbiAgICBjb2xvcjogdmFyKC0tamItc2VsZWN0LW1lc3NhZ2UtY29sb3IsICM5MjkyOTIpOyB9XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5tZXNzYWdlLWJveDplbXB0eSB7XG4gICAgICBwYWRkaW5nOiAwOyB9XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5tZXNzYWdlLWJveC4tLWVycm9yIHtcbiAgICAgIGNvbG9yOiByZWQ7IH1cbiAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyIHtcbiAgICBkaXNwbGF5OiBub25lO1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICBtYXJnaW46IC02cHggMDtcbiAgICBoZWlnaHQ6IGF1dG87XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1qYi1zZWxlY3QtYmdjb2xvciwgI2Y3ZjZmNik7XG4gICAgYm9yZGVyLXJhZGl1czogMCAwIHZhcigtLWpiLXNlbGVjdC1ib3JkZXItcmFkaXVzLCAxNnB4KSB2YXIoLS1qYi1zZWxlY3QtYm9yZGVyLXJhZGl1cywgMTZweCk7XG4gICAgYm9yZGVyOiBzb2xpZCAxcHggdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvciwgIzFlMjgzMik7XG4gICAgYm9yZGVyLXRvcDogbm9uZTtcbiAgICBib3JkZXItYm90dG9tOiBzb2xpZCAzcHggdmFyKC0tamItc2VsZWN0LWJvcmRlci1jb2xvciwgIzFlMjgzMik7XG4gICAgYm94LXNoYWRvdzogdmFyKC0tamItc2VsZWN0LWxpc3QtYm94LXNoYWRvdyk7XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICB6LWluZGV4OiA5OTk7IH1cbiAgICAuamItc2VsZWN0LXdlYi1jb21wb25lbnQgLnNlbGVjdC1saXN0LXdyYXBwZXIuLS1zaG93IHtcbiAgICAgIGRpc3BsYXk6IGJsb2NrOyB9XG4gICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyIC5zZWxlY3QtbGlzdCB7XG4gICAgICB3aWR0aDogMTAwJTtcbiAgICAgIG1heC1oZWlnaHQ6IHZhcigtLWpiLXNlbGVjdC1saXN0LW1heC1oZWlnaHQsIDQwMHB4KTtcbiAgICAgIG92ZXJmbG93LXk6IGF1dG87XG4gICAgICBwYWRkaW5nOiAxNnB4IDA7IH1cbiAgICAgIEBtZWRpYSAobWluLXdpZHRoOiAzMjBweCkgYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gICAgICAgIC5qYi1zZWxlY3Qtd2ViLWNvbXBvbmVudCAuc2VsZWN0LWxpc3Qtd3JhcHBlciAuc2VsZWN0LWxpc3Qge1xuICAgICAgICAgIG1heC1oZWlnaHQ6IGNhbGMoMTAwdmggLSAyNDBweCk7IH0gfVxuICAgICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyIC5zZWxlY3QtbGlzdCAuc2VsZWN0LW9wdGlvbiB7XG4gICAgICAgIG1pbi1oZWlnaHQ6IDM2cHg7XG4gICAgICAgIHBhZGRpbmc6IDRweCAxNnB4O1xuICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBmb250LXNpemU6IDAuOWVtO1xuICAgICAgICBjb2xvcjogdmFyKC0tamItc2VsZWN0LW9wdGlvbi1jb2xvciwgaW5oZXJpdCk7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWpiLXNlbGVjdC1vcHRpb24tYmFja2dyb3VuZC1jb2xvciwgI2ZmZik7IH1cbiAgICAgICAgLmpiLXNlbGVjdC13ZWItY29tcG9uZW50IC5zZWxlY3QtbGlzdC13cmFwcGVyIC5zZWxlY3QtbGlzdCAuc2VsZWN0LW9wdGlvbjpob3ZlciB7XG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tamItc2VsZWN0LW9wdGlvbi1iYWNrZ3JvdW5kLWNvbG9yLWhvdmVyLCAjMTA3M2RiKTtcbiAgICAgICAgICBjb2xvcjogdmFyKC0tamItc2VsZWN0LW9wdGlvbi1jb2xvci1ob3ZlciwgI2ZmZik7XG4gICAgICAgICAgY3Vyc29yOiBwb2ludGVyOyB9XG4iXX0= */";
4
4
 
5
5
  class JBSelectWebComponent extends HTMLElement {
6
6
  get value() {
@@ -80,6 +80,7 @@ class JBSelectWebComponent extends HTMLElement {
80
80
  input: shadowRoot.querySelector('.select-box input'),
81
81
  componentWrapper: shadowRoot.querySelector('.jb-select-web-component'),
82
82
  selectedValueWrapper: shadowRoot.querySelector('.selected-value-wrapper'),
83
+ messageBox:shadowRoot.querySelector('.message-box'),
83
84
  };
84
85
  this._optionListElement = shadowRoot.querySelector('.select-list');
85
86
  this._optionListElementWrapper = shadowRoot.querySelector('.select-list-wrapper');
@@ -131,7 +132,7 @@ class JBSelectWebComponent extends HTMLElement {
131
132
  }
132
133
  break;
133
134
  case 'message':
134
- this.shadowRoot.querySelector('.message-box').innerHTML = value;
135
+ this.elements.messageBox.innerHTML = value;
135
136
  break;
136
137
  case 'value':
137
138
  this._setValueFromOutside(value);
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 }\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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"}
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 messageBox:shadowRoot.querySelector('.message-box'),\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.elements.messageBox.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
@@ -78,6 +78,7 @@ class JBSelectWebComponent extends HTMLElement {
78
78
  input: shadowRoot.querySelector('.select-box input'),
79
79
  componentWrapper: shadowRoot.querySelector('.jb-select-web-component'),
80
80
  selectedValueWrapper: shadowRoot.querySelector('.selected-value-wrapper'),
81
+ messageBox:shadowRoot.querySelector('.message-box'),
81
82
  };
82
83
  this._optionListElement = shadowRoot.querySelector('.select-list');
83
84
  this._optionListElementWrapper = shadowRoot.querySelector('.select-list-wrapper');
@@ -129,7 +130,7 @@ class JBSelectWebComponent extends HTMLElement {
129
130
  }
130
131
  break;
131
132
  case 'message':
132
- this.shadowRoot.querySelector('.message-box').innerHTML = value;
133
+ this.elements.messageBox.innerHTML = value;
133
134
  break;
134
135
  case 'value':
135
136
  this._setValueFromOutside(value);
package/lib/JBSelect.scss CHANGED
@@ -147,7 +147,7 @@
147
147
  .message-box{
148
148
  font-size: 0.7em;
149
149
  padding: 2px 8px;
150
- color: #929292;
150
+ color: var(--jb-select-message-color, #929292);
151
151
  &:empty{
152
152
  padding: 0;
153
153
  }
package/package.json CHANGED
@@ -12,7 +12,7 @@
12
12
  "select",
13
13
  "web component"
14
14
  ],
15
- "version": "2.0.3",
15
+ "version": "2.0.4",
16
16
  "bugs": "https://github.com/javadbat/jb-select/issues",
17
17
  "license": "MIT",
18
18
  "files": [