slim-select 4.0.7 → 4.2.0
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/README.md +3 -0
- package/dist/react/index.js +151 -66
- package/dist/react/index.umd.js +1 -1
- package/dist/render.d.ts +18 -1
- package/dist/settings.d.ts +3 -0
- package/dist/slimselect.cjs.js +1 -1
- package/dist/slimselect.cjs.js.map +1 -1
- package/dist/slimselect.css +1 -1
- package/dist/slimselect.css.map +1 -1
- package/dist/slimselect.es.js +151 -66
- package/dist/slimselect.es.js.map +1 -1
- package/dist/slimselect.iife.js +1 -1
- package/dist/slimselect.iife.js.map +1 -1
- package/dist/slimselect.js +1 -1
- package/dist/slimselect.js.map +1 -1
- package/dist/vue/index.js +151 -66
- package/dist/vue/index.umd.js +1 -1
- package/package.json +20 -20
- package/src/slim-select/slimselect.scss +89 -51
package/dist/slimselect.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--ss-primary-color: #5897fb;--ss-bg-color: #ffffff;--ss-font-color: #4d4d4d;--ss-placeholder-color: #8d8d8d;--ss-disabled-color: #dcdee2;--ss-border-color: #dcdee2;--ss-highlight-color: #fffb8c;--ss-focus-color: var(--ss-primary-color);--ss-success-color: #00b755;--ss-error-color: #dc3545;--ss-main-height: 40px;--ss-content-height: 300px;--ss-modal-height: 85vh;--ss-modal-width: min(90vw, 400px);--ss-search-height: var(--ss-main-height);--ss-option-height: var(--ss-main-height);--ss-spacing-l: 9px;--ss-spacing-m: 7px;--ss-spacing-s: 5px;--ss-animation-timing: 0.2s;--ss-border-radius: 4px;--ss-modal-z-index: 1000001}@keyframes ss-valueIn{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}@keyframes ss-valueOut{0%{transform:scale(1);opacity:1}100%{transform:scale(0);opacity:0}}.ss-hide{display:none !important}.ss-main{display:flex;flex-direction:row;align-items:center;position:relative;user-select:none;color:var(--ss-font-color);min-height:var(--ss-main-height);width:100%;padding:0 var(--ss-spacing-s);cursor:pointer;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);outline:0;box-sizing:border-box;transition:background-color var(--ss-animation-timing),border-radius var(--ss-animation-timing)}@media(prefers-reduced-motion: reduce){.ss-main{transition:background-color var(--ss-animation-timing)}}.ss-main{overflow:hidden}.ss-main:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-main.ss-disabled{background-color:var(--ss-disabled-color);cursor:not-allowed}.ss-main.ss-disabled .ss-values .ss-disabled{color:var(--ss-font-color)}.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete{cursor:not-allowed}.ss-main.ss-dir-above{border-top-left-radius:0px;border-top-right-radius:0px}.ss-main.ss-dir-below{border-bottom-left-radius:0px;border-bottom-right-radius:0px}.ss-main .ss-values{display:flex;flex-wrap:wrap;align-items:center;align-content:center;align-self:stretch;gap:var(--ss-spacing-m);flex:1 1 0%;min-width:0;max-width:100%;padding:var(--ss-spacing-s) 0;box-sizing:border-box;overflow:hidden}.ss-main .ss-values:has(.ss-multi-string){flex-wrap:nowrap;gap:0}.ss-main .ss-values:has(.ss-single),.ss-main .ss-values:has(.ss-placeholder){flex-wrap:nowrap}.ss-main .ss-values .ss-single,.ss-main .ss-values .ss-placeholder,.ss-main .ss-values .ss-multi-string{display:block;flex:1 1 0%;min-width:0;width:100%;max-width:100%;margin:0;padding:0 var(--ss-spacing-m) 0 calc(var(--ss-spacing-l) - var(--ss-spacing-s));line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box}.ss-main .ss-values .ss-placeholder{color:var(--ss-placeholder-color)}.ss-main .ss-values .ss-max{display:flex;user-select:none;align-items:center;width:fit-content;font-size:12px;color:var(--ss-bg-color);line-height:1;padding:var(--ss-spacing-s) var(--ss-spacing-m);background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius)}.ss-main .ss-values .ss-value{display:flex;user-select:none;align-items:center;width:fit-content;max-width:100%;background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);animation-name:ss-valueIn;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out;animation-fill-mode:both}@media(prefers-reduced-motion: reduce){.ss-main .ss-values .ss-value{animation:none}}.ss-main .ss-values .ss-value.ss-value-out{animation-name:ss-valueOut;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out}.ss-main .ss-values .ss-value .ss-value-text{flex:1;min-width:0;font-size:12px;line-height:1;color:var(--ss-bg-color);padding:var(--ss-spacing-s) var(--ss-spacing-m);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ss-main .ss-values .ss-value .ss-value-delete{display:flex;align-items:center;height:var(--ss-spacing-l);width:var(--ss-spacing-l);padding:var(--ss-spacing-s) var(--ss-spacing-m);cursor:pointer;border-left:solid 1px var(--ss-bg-color);box-sizing:content-box}.ss-main .ss-values .ss-value .ss-value-delete svg{height:var(--ss-spacing-l);width:var(--ss-spacing-l)}.ss-main .ss-values .ss-value .ss-value-delete svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-deselect{flex:0 1 auto;display:flex;align-items:center;justify-content:center;width:fit-content;height:auto;padding:0 var(--ss-spacing-m) 0 var(--ss-spacing-m)}.ss-main .ss-deselect svg{width:8px;height:8px}.ss-main .ss-deselect svg path{fill:none;stroke:var(--ss-font-color);stroke-width:20;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-arrow{flex:0 1 auto;display:flex;align-items:center;justify-content:flex-end;width:12px;height:12px;margin:auto var(--ss-spacing-m) auto var(--ss-spacing-m)}.ss-main .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.ss-content{position:absolute;display:flex;height:auto;flex-direction:column;width:auto;max-height:var(--ss-content-height);box-sizing:border-box;border:solid 1px var(--ss-border-color);background-color:var(--ss-bg-color);min-height:0;transition:transform var(--ss-animation-timing),opacity var(--ss-animation-timing);opacity:0;transform:scaleY(0);overflow:hidden;z-index:10000}@media(prefers-reduced-motion: reduce){.ss-content{transition:none}}.ss-content.ss-relative{position:relative;height:100%}.ss-content.ss-fixed{position:fixed}.ss-content.ss-dir-above{transform-origin:center bottom;flex-direction:column-reverse;border-top-left-radius:var(--ss-border-radius);border-top-right-radius:var(--ss-border-radius)}.ss-content.ss-dir-below{transform-origin:center top;border-bottom-left-radius:var(--ss-border-radius);border-bottom-right-radius:var(--ss-border-radius)}.ss-content.ss-open{opacity:1;transform:scaleY(1)}.ss-content .ss-search{flex:0 1 auto;display:flex;flex-direction:row;align-items:center;gap:var(--ss-spacing-s);min-height:var(--ss-search-height);padding:0 var(--ss-spacing-s);box-sizing:border-box;border-bottom:1px solid var(--ss-border-color)}.ss-content .ss-search input{display:inline-flex;font-size:inherit;line-height:inherit;flex:1 1 auto;width:100%;min-width:0;min-height:0;height:100%;padding:0 var(--ss-spacing-m);margin:0;border:none;background-color:var(--ss-bg-color);outline:0;text-align:left;box-sizing:border-box}.ss-content .ss-search input::placeholder{color:var(--ss-placeholder-color);vertical-align:middle}.ss-content .ss-search input:focus{box-shadow:none}.ss-content .ss-search .ss-addable{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;flex:0 0 auto;box-sizing:border-box;width:22px;height:22px;margin:auto 0;padding:0;border:none;border-radius:var(--ss-border-radius);background-color:var(--ss-primary-color)}.ss-content .ss-search .ss-addable svg{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:10px;height:10px;margin:0}.ss-content .ss-search .ss-addable svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-content.ss-dir-above .ss-search{border-bottom:none;border-top:1px solid var(--ss-border-color)}.ss-content .ss-list{flex:1 1 auto;height:auto;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-color:var(--ss-primary-color) var(--ss-bg-color)}.ss-content .ss-list .ss-error{color:var(--ss-error-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-searching{color:var(--ss-font-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup .ss-option{min-height:0;transition:max-height var(--ss-animation-timing) ease,min-height var(--ss-animation-timing) ease,opacity var(--ss-animation-timing) ease,padding-top var(--ss-animation-timing) ease,padding-bottom var(--ss-animation-timing) ease,margin-top var(--ss-animation-timing) ease,margin-bottom var(--ss-animation-timing) ease}.ss-content .ss-list .ss-optgroup:not(.ss-close):not(.ss-open) .ss-option{min-height:var(--ss-option-height)}.ss-content .ss-list .ss-optgroup.ss-open .ss-option{min-height:var(--ss-option-height);max-height:100px;opacity:1;overflow:visible}.ss-content .ss-list .ss-optgroup.ss-close .ss-option{min-height:0 !important;padding-top:0 !important;padding-bottom:0 !important;margin-top:0 !important;margin-bottom:0 !important;max-height:0;opacity:0;overflow:hidden}.ss-content .ss-list .ss-optgroup .ss-optgroup-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;min-height:var(--ss-option-height);padding:0 var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text{flex:1 1 auto;font-weight:bold;color:var(--ss-font-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow){cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions{flex:0 1 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ss-spacing-m)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall{flex:0 0 auto;display:flex;flex-direction:row;cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall:hover{opacity:.5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall.ss-selected svg path{stroke:var(--ss-error-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall span{flex:0 1 auto;display:flex;align-items:center;justify-content:center;font-size:60%;text-align:center;padding:0 var(--ss-spacing-s) 0 0}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg{flex:0 1 auto;width:13px;height:13px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg path{fill:none;stroke:var(--ss-success-color);stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:first-child{stroke-width:5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:last-child{stroke-width:11}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable{flex:0 1 auto;display:flex;flex-direction:row;cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow{flex:1 1 auto;width:10px;height:10px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content .ss-list .ss-optgroup .ss-option{padding:0 var(--ss-spacing-l) 0 calc(var(--ss-spacing-l)*3)}.ss-content .ss-list .ss-option{display:flex;align-items:center;min-height:var(--ss-option-height);padding:0 var(--ss-spacing-l);white-space:normal;color:var(--ss-font-color);cursor:pointer;user-select:none;content-visibility:auto;contain-intrinsic-size:auto var(--ss-option-height)}.ss-content .ss-list .ss-option:hover:not(.ss-disabled){color:var(--ss-bg-color);background-color:var(--ss-primary-color);border-left:5px solid var(--ss-primary-color);transition:border-left var(--ss-animation-timing) ease}.ss-content .ss-list .ss-option.ss-highlighted,.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-disabled{cursor:not-allowed;background-color:var(--ss-disabled-color)}.ss-content .ss-list .ss-option.ss-disabled:hover{color:var(--ss-font-color)}.ss-content .ss-list .ss-option .ss-search-highlight{display:inline-block;background-color:var(--ss-highlight-color)}.ss-content .ss-list .ss-search{display:flex;flex-direction:row;align-items:center;min-height:var(--ss-search-height);padding:0 var(--ss-spacing-l)}.ss-modal-overlay{position:fixed;inset:0;z-index:var(--ss-modal-z-index);display:flex;align-items:center;justify-content:center;padding:var(--ss-spacing-l);box-sizing:border-box;background-color:rgba(0,0,0,.8);opacity:0;transition:opacity var(--ss-animation-timing)}@media(prefers-reduced-motion: reduce){.ss-modal-overlay{transition:none}}.ss-modal-overlay.ss-open{opacity:1}.ss-modal-overlay .ss-modal-dialog{position:relative;display:flex;flex-direction:column;width:100%;max-width:var(--ss-modal-width);max-height:var(--ss-modal-height);overflow:visible}.ss-modal-overlay .ss-modal-dialog .ss-modal-title{flex:0 0 auto;width:100%;padding:0 0 var(--ss-spacing-l);box-sizing:border-box;font-weight:bold;font-size:1.35em;line-height:1.3;color:#fff;text-align:left;background:none;border:none}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content{position:relative !important;top:auto !important;left:auto !important;width:100% !important;max-width:100%;max-height:var(--ss-modal-height);min-height:0;margin:0 !important;transform-origin:center center;z-index:1;border-radius:var(--ss-border-radius);overflow:visible}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close{position:absolute;top:0;right:0;z-index:2;display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;margin:0;border:none;border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);color:var(--ss-font-color);cursor:pointer;outline:0;box-shadow:0 1px 4px rgba(0,0,0,.5);transform:translate(50%, -50%)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close:hover{background-color:var(--ss-bg-color);box-shadow:0 2px 6px rgba(0,0,0,.16)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close svg{width:10px;height:10px}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close svg path{fill:none;stroke:currentColor;stroke-width:20;stroke-linecap:round;stroke-linejoin:round}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-list{min-height:0;overflow-x:hidden;overflow-y:auto;border-radius:0 0 var(--ss-border-radius) var(--ss-border-radius);scrollbar-color:var(--ss-primary-color) var(--ss-bg-color)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-search.ss-hide~.ss-list{border-radius:var(--ss-border-radius)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content.ss-dir-above,.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content.ss-dir-below{flex-direction:column;transform-origin:center center}/*# sourceMappingURL=slimselect.css.map */
|
|
1
|
+
:root{--ss-primary-color: #5897fb;--ss-bg-color: #ffffff;--ss-font-color: #4d4d4d;--ss-placeholder-color: #8d8d8d;--ss-disabled-color: #dcdee2;--ss-border-color: #dcdee2;--ss-highlight-color: #fffb8c;--ss-focus-color: var(--ss-primary-color);--ss-success-color: #00b755;--ss-error-color: #dc3545;--ss-main-height: 40px;--ss-content-height: 300px;--ss-modal-height: 85vh;--ss-modal-width: min(90vw, 400px);--ss-search-height: var(--ss-main-height);--ss-option-height: var(--ss-main-height);--ss-spacing-l: 9px;--ss-spacing-m: 7px;--ss-spacing-s: 5px;--ss-animation-timing: 0.2s;--ss-border-radius: 4px;--ss-modal-z-index: 1000001}@keyframes ss-valueIn{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}@keyframes ss-valueOut{0%{transform:scale(1);opacity:1}100%{transform:scale(0);opacity:0}}.ss-hide{display:none !important}.ss-main{display:flex;flex-direction:row;align-items:center;position:relative;user-select:none;color:var(--ss-font-color);min-height:var(--ss-main-height);width:100%;padding:0 var(--ss-spacing-s);cursor:pointer;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);outline:0;box-sizing:border-box;transition:background-color var(--ss-animation-timing),border-radius var(--ss-animation-timing)}@media(prefers-reduced-motion: reduce){.ss-main{transition:background-color var(--ss-animation-timing)}}.ss-main{overflow:hidden}.ss-main:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-main.ss-disabled{background-color:var(--ss-disabled-color);cursor:not-allowed}.ss-main.ss-disabled .ss-values .ss-disabled{color:var(--ss-font-color)}.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete{cursor:not-allowed}.ss-main.ss-dir-above{border-top-left-radius:0px;border-top-right-radius:0px}.ss-main.ss-dir-below{border-bottom-left-radius:0px;border-bottom-right-radius:0px}.ss-main .ss-values{display:flex;flex-wrap:wrap;align-items:center;align-content:center;align-self:stretch;gap:var(--ss-spacing-m);flex:1 1 0%;min-width:0;max-width:100%;padding:var(--ss-spacing-s) 0;box-sizing:border-box;overflow:hidden}.ss-main .ss-values:has(.ss-multi-string){flex-wrap:nowrap;gap:0}.ss-main .ss-values:has(.ss-single),.ss-main .ss-values:has(.ss-placeholder){flex-wrap:nowrap}.ss-main .ss-values .ss-single,.ss-main .ss-values .ss-placeholder,.ss-main .ss-values .ss-multi-string{display:block;flex:1 1 0%;min-width:0;width:100%;max-width:100%;margin:0;padding:0 var(--ss-spacing-m) 0 calc(var(--ss-spacing-l) - var(--ss-spacing-s));line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box}.ss-main .ss-values .ss-placeholder{color:var(--ss-placeholder-color)}.ss-main .ss-values .ss-max{display:flex;user-select:none;align-items:center;width:fit-content;font-size:12px;color:var(--ss-bg-color);line-height:1;padding:var(--ss-spacing-s) var(--ss-spacing-m);background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius)}.ss-main .ss-values .ss-value{display:flex;user-select:none;align-items:center;width:fit-content;max-width:100%;background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);animation-name:ss-valueIn;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out;animation-fill-mode:both}@media(prefers-reduced-motion: reduce){.ss-main .ss-values .ss-value{animation:none}}.ss-main .ss-values .ss-value.ss-value-out{animation-name:ss-valueOut;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out}.ss-main .ss-values .ss-value.ss-highlighted{box-shadow:inset 0 0 0 2px var(--ss-bg-color);outline:2px solid var(--ss-font-color);outline-offset:-2px}.ss-main .ss-values .ss-value .ss-value-text{flex:1;min-width:0;font-size:12px;line-height:1;color:var(--ss-bg-color);padding:var(--ss-spacing-s) var(--ss-spacing-m);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ss-main .ss-values .ss-value .ss-value-delete{display:flex;align-items:center;height:var(--ss-spacing-l);width:var(--ss-spacing-l);padding:var(--ss-spacing-s) var(--ss-spacing-m);cursor:pointer;border-left:solid 1px var(--ss-bg-color);box-sizing:content-box}.ss-main .ss-values .ss-value .ss-value-delete svg{height:var(--ss-spacing-l);width:var(--ss-spacing-l)}.ss-main .ss-values .ss-value .ss-value-delete svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-deselect{flex:0 1 auto;display:flex;align-items:center;justify-content:center;width:fit-content;height:auto;padding:0 var(--ss-spacing-m) 0 var(--ss-spacing-m)}.ss-main .ss-deselect svg{width:8px;height:8px}.ss-main .ss-deselect svg path{fill:none;stroke:var(--ss-font-color);stroke-width:20;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-arrow{flex:0 1 auto;display:flex;align-items:center;justify-content:flex-end;width:12px;height:12px;margin:auto var(--ss-spacing-m) auto var(--ss-spacing-m)}.ss-main .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.ss-content{position:absolute;display:flex;height:auto;flex-direction:column;width:auto;max-height:var(--ss-content-height);box-sizing:border-box;border:solid 1px var(--ss-border-color);background-color:var(--ss-bg-color);min-height:0;transition:transform var(--ss-animation-timing),opacity var(--ss-animation-timing);opacity:0;transform:scaleY(0);overflow:hidden;z-index:10000}@media(prefers-reduced-motion: reduce){.ss-content{transition:none}}.ss-content.ss-relative{position:relative;height:100%}.ss-content.ss-fixed{position:fixed}.ss-content.ss-dir-above{transform-origin:center bottom;flex-direction:column-reverse;border-top-left-radius:var(--ss-border-radius);border-top-right-radius:var(--ss-border-radius)}.ss-content.ss-dir-below{transform-origin:center top;border-bottom-left-radius:var(--ss-border-radius);border-bottom-right-radius:var(--ss-border-radius)}.ss-content.ss-open{opacity:1;transform:scaleY(1)}.ss-content .ss-search{flex:0 1 auto;display:flex;flex-direction:row;align-items:center;gap:var(--ss-spacing-s);min-height:var(--ss-search-height);padding:0 var(--ss-spacing-s);box-sizing:border-box;border-bottom:1px solid var(--ss-border-color)}.ss-content .ss-search input{display:inline-flex;font-size:inherit;line-height:inherit;flex:1 1 auto;width:100%;min-width:0;min-height:0;height:100%;padding:0 var(--ss-spacing-m);margin:0;border:none;background-color:var(--ss-bg-color);outline:0;text-align:left;box-sizing:border-box}.ss-content .ss-search input::placeholder{color:var(--ss-placeholder-color);vertical-align:middle}.ss-content .ss-search input:focus{box-shadow:none}.ss-content .ss-search .ss-addable{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;flex:0 0 auto;box-sizing:border-box;width:22px;height:22px;margin:auto 0;padding:0;border:none;border-radius:var(--ss-border-radius);background-color:var(--ss-primary-color)}.ss-content .ss-search .ss-addable svg{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:10px;height:10px;margin:0}.ss-content .ss-search .ss-addable svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-search .ss-selectall{margin-left:auto}.ss-content .ss-selectall{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;cursor:pointer;user-select:none;gap:var(--ss-spacing-s);transition:opacity var(--ss-animation-timing)}.ss-content .ss-selectall:hover{opacity:.7}.ss-content .ss-selectall span{flex:0 1 auto;display:flex;align-items:center;justify-content:center;font-size:65%;color:var(--ss-font-color);text-align:center;white-space:nowrap}.ss-content .ss-selectall svg{flex:0 0 auto;width:15px;height:15px;border-radius:calc(var(--ss-border-radius)*.5)}.ss-content .ss-selectall svg path{stroke-linecap:round;stroke-linejoin:round;transition:fill var(--ss-animation-timing),stroke var(--ss-animation-timing)}.ss-content .ss-selectall svg path:first-child{fill:var(--ss-bg-color);stroke:var(--ss-border-color);stroke-width:8}.ss-content .ss-selectall svg path:last-child{fill:none;stroke:rgba(0,0,0,0);stroke-width:10}.ss-content .ss-selectall.ss-selected svg{animation-name:ss-valueIn;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out}@media(prefers-reduced-motion: reduce){.ss-content .ss-selectall.ss-selected svg{animation:none}}.ss-content .ss-selectall.ss-selected svg path:first-child{fill:var(--ss-primary-color);stroke:var(--ss-primary-color)}.ss-content .ss-selectall.ss-selected svg path:last-child{stroke:var(--ss-bg-color)}.ss-content.ss-dir-above .ss-search{border-bottom:none;border-top:1px solid var(--ss-border-color)}.ss-content .ss-list{flex:1 1 auto;height:auto;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-color:var(--ss-primary-color) var(--ss-bg-color)}.ss-content .ss-list .ss-error{color:var(--ss-error-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-searching{color:var(--ss-font-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup .ss-option{min-height:0;transition:max-height var(--ss-animation-timing) ease,min-height var(--ss-animation-timing) ease,opacity var(--ss-animation-timing) ease,padding-top var(--ss-animation-timing) ease,padding-bottom var(--ss-animation-timing) ease,margin-top var(--ss-animation-timing) ease,margin-bottom var(--ss-animation-timing) ease}.ss-content .ss-list .ss-optgroup:not(.ss-close):not(.ss-open) .ss-option{min-height:var(--ss-option-height)}.ss-content .ss-list .ss-optgroup.ss-open .ss-option{min-height:var(--ss-option-height);max-height:100px;opacity:1;overflow:visible}.ss-content .ss-list .ss-optgroup.ss-close .ss-option{min-height:0 !important;padding-top:0 !important;padding-bottom:0 !important;margin-top:0 !important;margin-bottom:0 !important;max-height:0;opacity:0;overflow:hidden}.ss-content .ss-list .ss-optgroup .ss-optgroup-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;min-height:var(--ss-option-height);padding:0 var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text{flex:1 1 auto;font-weight:bold;color:var(--ss-font-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow){cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions{flex:0 1 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ss-spacing-m)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable{flex:0 1 auto;display:flex;flex-direction:row;cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow{flex:1 1 auto;width:10px;height:10px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content .ss-list .ss-optgroup .ss-option{padding:0 var(--ss-spacing-l) 0 calc(var(--ss-spacing-l)*3)}.ss-content .ss-list .ss-option{display:flex;align-items:center;min-height:var(--ss-option-height);padding:0 var(--ss-spacing-l);white-space:normal;color:var(--ss-font-color);cursor:pointer;user-select:none;content-visibility:auto;contain-intrinsic-size:auto var(--ss-option-height)}.ss-content .ss-list .ss-option:hover:not(.ss-disabled){color:var(--ss-bg-color);background-color:var(--ss-primary-color);border-left:5px solid var(--ss-primary-color);transition:border-left var(--ss-animation-timing) ease}.ss-content .ss-list .ss-option.ss-highlighted,.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-disabled{cursor:not-allowed;background-color:var(--ss-disabled-color)}.ss-content .ss-list .ss-option.ss-disabled:hover{color:var(--ss-font-color)}.ss-content .ss-list .ss-option .ss-search-highlight{display:inline-block;background-color:var(--ss-highlight-color)}.ss-content .ss-list .ss-search{display:flex;flex-direction:row;align-items:center;min-height:var(--ss-search-height);padding:0 var(--ss-spacing-l)}.ss-modal-overlay{position:fixed;inset:0;z-index:var(--ss-modal-z-index);display:flex;align-items:center;justify-content:center;padding:var(--ss-spacing-l);box-sizing:border-box;background-color:rgba(0,0,0,.8);opacity:0;transition:opacity var(--ss-animation-timing)}@media(prefers-reduced-motion: reduce){.ss-modal-overlay{transition:none}}.ss-modal-overlay.ss-open{opacity:1}.ss-modal-overlay .ss-modal-dialog{position:relative;display:flex;flex-direction:column;width:100%;max-width:var(--ss-modal-width);max-height:var(--ss-modal-height);overflow:visible}.ss-modal-overlay .ss-modal-dialog .ss-modal-title{flex:0 0 auto;width:100%;padding:0 0 var(--ss-spacing-l);box-sizing:border-box;font-weight:bold;font-size:1.35em;line-height:1.3;color:#fff;text-align:left;background:none;border:none}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content{position:relative !important;top:auto !important;left:auto !important;width:100% !important;max-width:100%;max-height:var(--ss-modal-height);min-height:0;margin:0 !important;transform-origin:center center;z-index:1;border-radius:var(--ss-border-radius);overflow:visible}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close{position:absolute;top:0;right:0;z-index:2;display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;margin:0;border:none;border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);color:var(--ss-font-color);cursor:pointer;outline:0;box-shadow:0 1px 4px rgba(0,0,0,.5);transform:translate(50%, -50%)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close:hover{background-color:var(--ss-bg-color);box-shadow:0 2px 6px rgba(0,0,0,.16)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close svg{width:10px;height:10px}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-modal-close svg path{fill:none;stroke:currentColor;stroke-width:20;stroke-linecap:round;stroke-linejoin:round}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-list{min-height:0;overflow-x:hidden;overflow-y:auto;border-radius:0 0 var(--ss-border-radius) var(--ss-border-radius);scrollbar-color:var(--ss-primary-color) var(--ss-bg-color)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content .ss-search.ss-hide~.ss-list{border-radius:var(--ss-border-radius)}.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content.ss-dir-above,.ss-modal-overlay .ss-modal-dialog .ss-content.ss-modal-content.ss-dir-below{flex-direction:column;transform-origin:center center}/*# sourceMappingURL=slimselect.css.map */
|
package/dist/slimselect.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../src/slim-select/slimselect.scss"],"names":[],"mappings":"AAAA,MAEE,4BACA,uBACA,yBACA,gCACA,6BACA,2BACA,8BACA,0CACA,4BACA,0BAGA,uBACA,2BACA,wBACA,mCACA,0CACA,0CAGA,oBACA,oBACA,oBAGA,4BACA,wBACA,4BAIF,sBACE,GACE,mBACA,UAEF,KACE,mBACA,WAGJ,uBACE,GACE,mBACA,UAEF,KACE,mBACA,WAKJ,SACE,wBAIF,SACE,aACA,mBACA,mBACA,kBACA,iBACA,2BACA,iCACA,WACA,8BACA,eACA,wCACA,sCACA,oCACA,UACA,sBACA,WACE,qFAGF,uCApBF,SAqBI,wDArBJ,SAwBE,gBAEA,eACE,yCAGF,qBACE,0CACA,mBAGE,6CACE,2BAIA,2DACE,mBAMR,sBACE,2BACA,4BAEF,sBACE,8BACA,+BAGF,oBACE,aACA,eACA,mBACA,qBACA,mBACA,wBACA,YACA,YACA,eACA,8BACA,sBACA,gBAGA,0CACE,iBACA,MAIF,6EAEE,iBAIF,wGAGE,cACA,YACA,YACA,WACA,eACA,SACA,
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../src/slim-select/slimselect.scss"],"names":[],"mappings":"AAAA,MAEE,4BACA,uBACA,yBACA,gCACA,6BACA,2BACA,8BACA,0CACA,4BACA,0BAGA,uBACA,2BACA,wBACA,mCACA,0CACA,0CAGA,oBACA,oBACA,oBAGA,4BACA,wBACA,4BAIF,sBACE,GACE,mBACA,UAEF,KACE,mBACA,WAGJ,uBACE,GACE,mBACA,UAEF,KACE,mBACA,WAKJ,SACE,wBAIF,SACE,aACA,mBACA,mBACA,kBACA,iBACA,2BACA,iCACA,WACA,8BACA,eACA,wCACA,sCACA,oCACA,UACA,sBACA,WACE,qFAGF,uCApBF,SAqBI,wDArBJ,SAwBE,gBAEA,eACE,yCAGF,qBACE,0CACA,mBAGE,6CACE,2BAIA,2DACE,mBAMR,sBACE,2BACA,4BAEF,sBACE,8BACA,+BAGF,oBACE,aACA,eACA,mBACA,qBACA,mBACA,wBACA,YACA,YACA,eACA,8BACA,sBACA,gBAGA,0CACE,iBACA,MAIF,6EAEE,iBAIF,wGAGE,cACA,YACA,YACA,WACA,eACA,SACA,gFACA,gBACA,gBACA,uBACA,mBACA,sBAGF,oCACE,kCAIF,4BACE,aACA,iBACA,mBACA,kBACA,eACA,yBACA,cACA,gDACA,yCACA,sCAIF,8BACE,aACA,iBACA,mBACA,kBACA,eACA,yCACA,sCACA,0BACA,8CACA,mCACA,yBAEA,uCAbF,8BAcI,gBAGF,2CACE,2BACA,8CACA,mCAIF,6CACE,8CACA,uCACA,oBAGF,6CACE,OACA,YACA,eACA,cACA,yBACA,gDACA,gBACA,uBACA,mBAGF,+CACE,aACA,mBACA,2BACA,0BACA,gDACA,eACA,yCACA,uBAEA,mDACE,2BACA,0BAEA,wDACE,UACA,0BACA,gBACA,qBACA,sBAOV,sBACE,cACA,aACA,mBACA,uBACA,kBACA,YACA,oDAEA,0BACE,UACA,WAEA,+BACE,UACA,4BACA,gBACA,qBACA,sBAKN,mBACE,cACA,aACA,mBACA,yBACA,WACA,YACA,yDAEA,wBACE,UACA,4BACA,gBACA,qBACA,sBACA,oCACA,sCAMN,WACE,kBACA,UACA,WACA,UACA,YACA,gBACA,sBACA,mBACA,SAIF,YACE,kBACA,aACA,YACA,sBACA,WACA,oCACA,sBACA,wCACA,oCACA,aACA,WACE,wEAEF,UACA,oBACA,gBACA,cAEA,uCAnBF,YAoBI,iBAGF,wBACE,kBACA,YAGF,qBACE,eAGF,yBACE,+BACA,8BACA,+CACA,gDAGF,yBACE,4BACA,kDACA,mDAGF,oBACE,UACA,oBAGF,uBACE,cACA,aACA,mBACA,mBACA,wBACA,mCACA,8BACA,sBACA,+CAEA,6BACE,oBACA,kBACA,oBACA,cACA,WACA,YACA,aACA,YACA,8BACA,SACA,YACA,oCACA,UACA,gBACA,sBAEA,0CACE,kCACA,sBAGF,mCACE,gBAIJ,mCACE,oBACA,uBACA,mBACA,eACA,cACA,sBACA,WACA,YACA,cACA,UACA,YACA,sCACA,yCAEA,uCACE,aACA,mBACA,uBACA,cACA,WACA,YACA,SAEA,4CACE,UACA,0BACA,gBACA,qBACA,sBAKN,qCACE,iBAKJ,0BACE,cACA,aACA,mBACA,mBACA,eACA,iBACA,wBACA,8CAEA,gCACE,WAGF,+BACE,cACA,aACA,mBACA,uBACA,cACA,2BACA,kBACA,mBAGF,8BACE,cACA,WACA,YACA,+CAEA,mCACE,qBACA,sBACA,WACE,kEAKJ,+CACE,wBACA,8BACA,eAIF,8CACE,UACA,qBACA,gBAKF,0CACE,0BACA,8CACA,mCAEA,uCALF,0CAMI,gBAGF,2DACE,6BACA,+BAGF,0DACE,0BAMR,oCACE,mBACA,4CAGF,qBACE,cACA,YACA,aACA,kBACA,gBACA,2DAEA,+BACE,4BACA,4BAGF,mCACE,2BACA,4BAIA,6CACE,aACA,WACE,kTASJ,0EACE,mCAIA,qDACE,mCACA,iBACA,UACA,iBAMF,sDACE,wBACA,yBACA,4BACA,wBACA,2BACA,aACA,UACA,gBAIJ,qDACE,aACA,mBACA,mBACA,8BACA,mCACA,8BAEA,6EACE,cACA,iBACA,2BAIF,oEACE,eAGF,0EACE,cACA,aACA,mBACA,mBACA,uBACA,wBAEA,uFACE,cACA,aACA,mBACA,eAEA,iGACE,cACA,WACA,YAEA,sGACE,UACA,4BACA,gBACA,qBACA,sBACA,oCACA,sCAOV,6CACE,4DAIJ,gCACE,aACA,mBACA,mCACA,8BACA,mBACA,2BACA,eACA,iBACA,wBACA,oDAEA,wDACE,yBACA,yCACA,8CACA,uDAGF,6GAEE,yBACA,yCAGF,4CACE,mBACA,0CAEA,kDACE,2BAKJ,qDACE,qBACA,2CAIJ,gCACE,aACA,mBACA,mBACA,mCACA,8BAMN,kBACE,eACA,QACA,gCACA,aACA,mBACA,uBACA,4BACA,sBACA,gCACA,UACA,8CAEA,uCAbF,kBAcI,iBAGF,0BACE,UAGF,mCACE,kBACA,aACA,sBACA,WACA,gCACA,kCACA,iBAEA,mDACE,cACA,WACA,gCACA,sBACA,iBACA,iBACA,gBACA,WACA,gBACA,gBACA,YAIA,gEACE,6BACA,oBACA,qBACA,sBACA,eACA,kCACA,aACA,oBACA,+BACA,UACA,sCACA,iBAEA,gFACE,kBACA,MACA,QACA,UACA,aACA,mBACA,uBACA,WACA,YACA,UACA,SACA,YACA,sCACA,oCACA,2BACA,eACA,UACA,oCACA,+BAEA,sFACE,oCACA,qCAGF,sFACE,yCAGF,oFACE,WACA,YAEA,yFACE,UACA,oBACA,gBACA,qBACA,sBAKN,yEACE,aACA,kBACA,gBACA,kEACA,2DAGF,4FACE,sCAGF,0JAEE,sBACA","file":"slimselect.css"}
|
package/dist/slimselect.es.js
CHANGED
|
@@ -51,7 +51,7 @@ var e = class {
|
|
|
51
51
|
constructor(e) {
|
|
52
52
|
e ||= {};
|
|
53
53
|
let t = (e = "", t = "") => `${e} ${t}`.trim();
|
|
54
|
-
this.main = t("ss-main", e.main), this.placeholder = t("ss-placeholder", e.placeholder), this.values = t("ss-values", e.values), this.single = t("ss-single", e.single), this.multiString = t("ss-multi-string", e.multiString), this.max = t("ss-max", e.max), this.value = t("ss-value", e.value), this.valueText = t("ss-value-text", e.valueText), this.valueDelete = t("ss-value-delete", e.valueDelete), this.valueOut = t("ss-value-out", e.valueOut), this.deselect = t("ss-deselect", e.deselect), this.deselectPath = e.deselectPath || "M10,10 L90,90 M10,90 L90,10", this.arrow = t("ss-arrow", e.arrow), this.arrowClose = e.arrowClose || "M10,30 L50,70 L90,30", this.arrowOpen = e.arrowOpen || "M10,70 L50,30 L90,70", this.content = t("ss-content", e.content), this.contentOpen = t("ss-open", e.contentOpen), this.dirAbove = t("ss-dir-above", e.dirAbove), this.dirBelow = t("ss-dir-below", e.dirBelow), this.search = t("ss-search", e.search), this.searchHighlighter = t("ss-search-highlight", e.searchHighlighter), this.searching = t("ss-searching", e.searching), this.status = t("ss-status", e.status), this.addable = t("ss-addable", e.addable), this.addablePath = e.addablePath || "M50,10 L50,90 M10,50 L90,50", this.list = t("ss-list", e.list), this.optgroup = t("ss-optgroup", e.optgroup), this.optgroupLabel = t("ss-optgroup-label", e.optgroupLabel), this.optgroupLabelText = t("ss-optgroup-label-text", e.optgroupLabelText), this.optgroupActions = t("ss-optgroup-actions", e.optgroupActions), this.optgroupSelectAll = t("ss-selectall", e.optgroupSelectAll), this.optgroupSelectAllBox = e.optgroupSelectAllBox || "
|
|
54
|
+
this.main = t("ss-main", e.main), this.placeholder = t("ss-placeholder", e.placeholder), this.values = t("ss-values", e.values), this.single = t("ss-single", e.single), this.multiString = t("ss-multi-string", e.multiString), this.max = t("ss-max", e.max), this.value = t("ss-value", e.value), this.valueText = t("ss-value-text", e.valueText), this.valueDelete = t("ss-value-delete", e.valueDelete), this.valueOut = t("ss-value-out", e.valueOut), this.deselect = t("ss-deselect", e.deselect), this.deselectPath = e.deselectPath || "M10,10 L90,90 M10,90 L90,10", this.arrow = t("ss-arrow", e.arrow), this.arrowClose = e.arrowClose || "M10,30 L50,70 L90,30", this.arrowOpen = e.arrowOpen || "M10,70 L50,30 L90,70", this.content = t("ss-content", e.content), this.contentOpen = t("ss-open", e.contentOpen), this.dirAbove = t("ss-dir-above", e.dirAbove), this.dirBelow = t("ss-dir-below", e.dirBelow), this.search = t("ss-search", e.search), this.searchHighlighter = t("ss-search-highlight", e.searchHighlighter), this.searching = t("ss-searching", e.searching), this.status = t("ss-status", e.status), this.addable = t("ss-addable", e.addable), this.addablePath = e.addablePath || "M50,10 L50,90 M10,50 L90,50", this.list = t("ss-list", e.list), this.optgroup = t("ss-optgroup", e.optgroup), this.optgroupLabel = t("ss-optgroup-label", e.optgroupLabel), this.optgroupLabelText = t("ss-optgroup-label-text", e.optgroupLabelText), this.optgroupActions = t("ss-optgroup-actions", e.optgroupActions), this.optgroupSelectAll = t("ss-selectall", e.optgroupSelectAll), this.optgroupSelectAllBox = e.optgroupSelectAllBox || "M15,15 L85,15 L85,85 L15,85 Z", this.optgroupSelectAllCheck = e.optgroupSelectAllCheck || "M25,50 L42,68 L75,32", this.optgroupClosable = t("ss-closable", e.optgroupClosable), this.option = t("ss-option", e.option), this.optionDelete = e.optionDelete || "M10,10 L90,90 M10,90 L90,10", this.highlighted = t("ss-highlighted", e.highlighted), this.modalOverlay = t("ss-modal-overlay", e.modalOverlay), this.modalDialog = t("ss-modal-dialog", e.modalDialog), this.modalTitle = t("ss-modal-title", e.modalTitle), this.modalClose = t("ss-modal-close", e.modalClose), this.modalContent = t("ss-modal-content", e.modalContent), this.mainOpen = t("ss-open", e.mainOpen), this.close = t("ss-close", e.close), this.selected = t("ss-selected", e.selected), this.error = t("ss-error", e.error), this.disabled = t("ss-disabled", e.disabled), this.hide = t("ss-hide", e.hide);
|
|
55
55
|
}
|
|
56
56
|
getFirst(e) {
|
|
57
57
|
return this[e].split(" ")[0];
|
|
@@ -145,10 +145,13 @@ var u = 768, d = class {
|
|
|
145
145
|
maxValuesShown;
|
|
146
146
|
maxValuesMessage;
|
|
147
147
|
addableText;
|
|
148
|
+
selectAll;
|
|
149
|
+
selectAllText;
|
|
150
|
+
unselectAllText;
|
|
148
151
|
modal;
|
|
149
152
|
modalTitle;
|
|
150
153
|
constructor(e) {
|
|
151
|
-
e ||= {}, this.id = "ss-" + h(), this.style = e.style || "", this.class = e.class || [], this.disabled = e.disabled !== void 0 && e.disabled, this.alwaysOpen = e.alwaysOpen !== void 0 && e.alwaysOpen, this.showSearch = e.showSearch === void 0 || e.showSearch, this.focusSearch = e.focusSearch === void 0 || e.focusSearch, this.keepSearch = e.keepSearch !== void 0 && e.keepSearch, this.ariaLabel = e.ariaLabel || "Combobox", this.searchPlaceholder = e.searchPlaceholder || "Search...", this.searchText = e.searchText || "No Results", this.searchingText = e.searchingText || "Searching...", this.resultsText = e.resultsText || "{count} results available", this.deselectText = e.deselectText || "Clear", this.removeText = e.removeText || "Remove", this.searchHighlight = e.searchHighlight !== void 0 && e.searchHighlight, this.closeOnSelect = e.closeOnSelect === void 0 || e.closeOnSelect, this.contentLocation = e.contentLocation || document.body, this.contentPosition = e.contentPosition || "absolute", this.contentWidth = e.contentWidth || "", this.openPosition = e.openPosition || "auto", this.placeholderText = e.placeholderText === void 0 ? "Select Value" : e.placeholderText, this.allowDeselect = e.allowDeselect !== void 0 && e.allowDeselect, this.hideSelected = e.hideSelected !== void 0 && e.hideSelected, this.multiString = e.multiString !== void 0 && e.multiString, this.keepOrder = e.keepOrder !== void 0 && e.keepOrder, this.showOptionTooltips = e.showOptionTooltips !== void 0 && e.showOptionTooltips, this.minSelected = e.minSelected || 0, this.maxSelected = e.maxSelected || 1e3, this.timeoutDelay = e.timeoutDelay || 200, this.maxValuesShown = e.maxValuesShown || 20, this.maxValuesMessage = e.maxValuesMessage || "{number} selected", this.addableText = e.addableText || "Press \"Enter\" to add {value}", this.modal = e.modal || "mobile", this.modalTitle = e.modalTitle || "";
|
|
154
|
+
e ||= {}, this.id = "ss-" + h(), this.style = e.style || "", this.class = e.class || [], this.disabled = e.disabled !== void 0 && e.disabled, this.alwaysOpen = e.alwaysOpen !== void 0 && e.alwaysOpen, this.showSearch = e.showSearch === void 0 || e.showSearch, this.focusSearch = e.focusSearch === void 0 || e.focusSearch, this.keepSearch = e.keepSearch !== void 0 && e.keepSearch, this.ariaLabel = e.ariaLabel || "Combobox", this.searchPlaceholder = e.searchPlaceholder || "Search...", this.searchText = e.searchText || "No Results", this.searchingText = e.searchingText || "Searching...", this.resultsText = e.resultsText || "{count} results available", this.deselectText = e.deselectText || "Clear", this.removeText = e.removeText || "Remove", this.searchHighlight = e.searchHighlight !== void 0 && e.searchHighlight, this.closeOnSelect = e.closeOnSelect === void 0 || e.closeOnSelect, this.contentLocation = e.contentLocation || document.body, this.contentPosition = e.contentPosition || "absolute", this.contentWidth = e.contentWidth || "", this.openPosition = e.openPosition || "auto", this.placeholderText = e.placeholderText === void 0 ? "Select Value" : e.placeholderText, this.allowDeselect = e.allowDeselect !== void 0 && e.allowDeselect, this.hideSelected = e.hideSelected !== void 0 && e.hideSelected, this.multiString = e.multiString !== void 0 && e.multiString, this.keepOrder = e.keepOrder !== void 0 && e.keepOrder, this.showOptionTooltips = e.showOptionTooltips !== void 0 && e.showOptionTooltips, this.minSelected = e.minSelected || 0, this.maxSelected = e.maxSelected || 1e3, this.timeoutDelay = e.timeoutDelay || 200, this.maxValuesShown = e.maxValuesShown || 20, this.maxValuesMessage = e.maxValuesMessage || "{number} selected", this.addableText = e.addableText || "Press \"Enter\" to add {value}", this.selectAll = e.selectAll !== void 0 && e.selectAll, this.selectAllText = e.selectAllText || "Select All", this.unselectAllText = e.unselectAllText || "Unselect All", this.modal = e.modal || "mobile", this.modalTitle = e.modalTitle || "";
|
|
152
155
|
}
|
|
153
156
|
};
|
|
154
157
|
//#endregion
|
|
@@ -340,7 +343,7 @@ var O = class {
|
|
|
340
343
|
if (this.state === "closed" || this.state === "closing" || this.handlers.beforeClose && this.handlers.beforeClose(e) === !1) return !1;
|
|
341
344
|
this.cancelPending();
|
|
342
345
|
let t = ++this.generation;
|
|
343
|
-
return this.handlers.onClose && this.handlers.onClose(e), this.state = "closing", await this.waitForPhase("close", t), t === this.generation
|
|
346
|
+
return this.handlers.onClose && this.handlers.onClose(e), this.state = "closing", await this.waitForPhase("close", t), t === this.generation && (this.state = "closed", this.handlers.afterClose && this.handlers.afterClose(), this.handlers.onCloseReady && this.handlers.onCloseReady(), !0);
|
|
344
347
|
}
|
|
345
348
|
cancelPending() {
|
|
346
349
|
this.generation++, this.animationAbort?.abort(), this.animationAbort = null, this.pendingTimer &&= (clearTimeout(this.pendingTimer), null);
|
|
@@ -406,16 +409,18 @@ var O = class {
|
|
|
406
409
|
}
|
|
407
410
|
validateDataArray(e) {
|
|
408
411
|
if (!Array.isArray(e)) return /* @__PURE__ */ Error("Data must be an array");
|
|
409
|
-
for (let t of e) if (t)
|
|
410
|
-
if (
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
412
|
+
for (let t of e) if (t) {
|
|
413
|
+
if (t instanceof j || "label" in t) {
|
|
414
|
+
if (!("label" in t)) return /* @__PURE__ */ Error("Optgroup must have a label");
|
|
415
|
+
if ("options" in t && t.options) for (let e of t.options) {
|
|
416
|
+
let t = this.validateOption(e);
|
|
417
|
+
if (t) return t;
|
|
418
|
+
}
|
|
419
|
+
} else if (t instanceof A || "text" in t) {
|
|
420
|
+
let e = this.validateOption(t);
|
|
421
|
+
if (e) return e;
|
|
422
|
+
} else return /* @__PURE__ */ Error("Data object must be a valid optgroup or option");
|
|
423
|
+
}
|
|
419
424
|
return null;
|
|
420
425
|
}
|
|
421
426
|
validateOption(e) {
|
|
@@ -555,10 +560,12 @@ var O = class {
|
|
|
555
560
|
let a = [];
|
|
556
561
|
if (i.options.forEach((i) => {
|
|
557
562
|
(!e || e(i)) && (t ? a.push(n ? new A(i) : i) : r.push(n ? new A(i) : i));
|
|
558
|
-
}), a.length > 0)
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
563
|
+
}), a.length > 0) {
|
|
564
|
+
if (n) {
|
|
565
|
+
let e = new j(i);
|
|
566
|
+
e.options = a, r.push(e);
|
|
567
|
+
} else r.push(this.createOptgroupView(i, a));
|
|
568
|
+
}
|
|
562
569
|
}
|
|
563
570
|
i instanceof A && (!e || e(i)) && r.push(n ? new A(i) : i);
|
|
564
571
|
}), r;
|
|
@@ -700,7 +707,7 @@ var O = class {
|
|
|
700
707
|
close() {
|
|
701
708
|
this.main.main.setAttribute("aria-expanded", "false"), this.main.arrow.path.setAttribute("d", this.classes.arrowClose);
|
|
702
709
|
let e = this.modalSessionActive === !0;
|
|
703
|
-
this.removeClasses(this.content.main, this.classes.contentOpen), e || (this.removeClasses(this.main.main, this.classes.dirAbove), this.removeClasses(this.main.main, this.classes.dirBelow)), e && this.modalElements && this.removeClasses(this.modalElements.overlay, this.classes.contentOpen), this.modalSessionActive = null, this.content.search.input.setAttribute("aria-hidden", "true"), this.main.main.removeAttribute("aria-activedescendant");
|
|
710
|
+
this.removeClasses(this.content.main, this.classes.contentOpen), e || (this.removeClasses(this.main.main, this.classes.dirAbove), this.removeClasses(this.main.main, this.classes.dirBelow)), e && this.modalElements && this.removeClasses(this.modalElements.overlay, this.classes.contentOpen), this.modalSessionActive = null, this.content.search.input.setAttribute("aria-hidden", "true"), this.main.main.removeAttribute("aria-activedescendant"), this.clearValueChipHighlight();
|
|
704
711
|
}
|
|
705
712
|
clearDirectionClasses() {
|
|
706
713
|
this.removeClasses(this.main.main, this.classes.dirAbove), this.removeClasses(this.main.main, this.classes.dirBelow), this.removeClasses(this.content.main, this.classes.dirAbove), this.removeClasses(this.content.main, this.classes.dirBelow);
|
|
@@ -807,7 +814,8 @@ var O = class {
|
|
|
807
814
|
if (t.length === 0) {
|
|
808
815
|
this.main.values.innerHTML = this.placeholder().outerHTML;
|
|
809
816
|
return;
|
|
810
|
-
}
|
|
817
|
+
}
|
|
818
|
+
{
|
|
811
819
|
let e = this.main.values.querySelector("." + this.classes.getFirst("placeholder"));
|
|
812
820
|
e && e.remove();
|
|
813
821
|
}
|
|
@@ -822,7 +830,8 @@ var O = class {
|
|
|
822
830
|
let e = document.createElement("div");
|
|
823
831
|
this.addClasses(e, this.classes.max), e.textContent = this.settings.maxValuesMessage.replace("{number}", t.length.toString()), this.main.values.innerHTML = e.outerHTML;
|
|
824
832
|
return;
|
|
825
|
-
}
|
|
833
|
+
}
|
|
834
|
+
{
|
|
826
835
|
let e = this.main.values.querySelector("." + this.classes.getFirst("max"));
|
|
827
836
|
e && e.remove();
|
|
828
837
|
}
|
|
@@ -851,6 +860,38 @@ var O = class {
|
|
|
851
860
|
let e = this.store.getSelectedOptions();
|
|
852
861
|
return this.settings.keepOrder && (e = this.store.selectedOrderOptions(e)), e.slice(0, this.settings.minSelected).map((e) => e.id);
|
|
853
862
|
}
|
|
863
|
+
getValueChips() {
|
|
864
|
+
return !this.settings.isMultiple || this.settings.multiString ? [] : Array.from(this.main.values.querySelectorAll("." + this.classes.getFirst("value"))).filter((e) => {
|
|
865
|
+
if (e.classList.contains(this.classes.getFirst("valueOut"))) return !1;
|
|
866
|
+
let t = e.querySelector("." + this.classes.getFirst("valueDelete"));
|
|
867
|
+
return !!t && !t.classList.contains(this.classes.getFirst("hide"));
|
|
868
|
+
});
|
|
869
|
+
}
|
|
870
|
+
getHighlightedValueChip() {
|
|
871
|
+
return this.getValueChips().find((e) => e.classList.contains(this.classes.getFirst("highlighted"))) ?? null;
|
|
872
|
+
}
|
|
873
|
+
clearValueChipHighlight() {
|
|
874
|
+
for (let e of Array.from(this.main.values.querySelectorAll("." + this.classes.getFirst("value")))) this.removeClasses(e, this.classes.highlighted);
|
|
875
|
+
}
|
|
876
|
+
highlightValueChip(e) {
|
|
877
|
+
this.clearValueChipHighlight(), e && this.addClasses(e, this.classes.highlighted);
|
|
878
|
+
}
|
|
879
|
+
navigateValueChips(e) {
|
|
880
|
+
let t = this.getValueChips();
|
|
881
|
+
if (t.length === 0) return !1;
|
|
882
|
+
let n = this.getHighlightedValueChip(), r = n ? t.indexOf(n) : -1;
|
|
883
|
+
return e === "left" ? (r === -1 ? this.highlightValueChip(t[t.length - 1]) : r > 0 && this.highlightValueChip(t[r - 1]), !0) : r !== -1 && (r < t.length - 1 ? this.highlightValueChip(t[r + 1]) : this.clearValueChipHighlight(), !0);
|
|
884
|
+
}
|
|
885
|
+
deleteValueChip(e = !1) {
|
|
886
|
+
let t = this.getValueChips();
|
|
887
|
+
if (t.length === 0) return !1;
|
|
888
|
+
let n = this.getHighlightedValueChip();
|
|
889
|
+
if (e && !n) return !1;
|
|
890
|
+
let r = n ?? t[t.length - 1], i = r.querySelector("." + this.classes.getFirst("valueDelete"));
|
|
891
|
+
if (!i) return !1;
|
|
892
|
+
let a = t.indexOf(r), o = n ? t[a - 1] ?? t[a + 1] ?? null : null;
|
|
893
|
+
return i.click(), o && o !== r && this.main.values.contains(o) ? this.highlightValueChip(o) : this.clearValueChipHighlight(), !0;
|
|
894
|
+
}
|
|
854
895
|
updateMultipleValueDeleteVisibility() {
|
|
855
896
|
if (!this.settings.isMultiple || this.settings.multiString) return;
|
|
856
897
|
let e = !this.isAtMinSelected(), t = this.main.values.querySelectorAll("." + this.classes.getFirst("valueDelete"));
|
|
@@ -910,7 +951,8 @@ var O = class {
|
|
|
910
951
|
if (this.settings.openPosition === "down") {
|
|
911
952
|
this.moveContentBelow();
|
|
912
953
|
return;
|
|
913
|
-
}
|
|
954
|
+
}
|
|
955
|
+
if (this.settings.openPosition === "up") {
|
|
914
956
|
this.moveContentAbove();
|
|
915
957
|
return;
|
|
916
958
|
}
|
|
@@ -942,21 +984,33 @@ var O = class {
|
|
|
942
984
|
let r = {
|
|
943
985
|
main: e,
|
|
944
986
|
input: t
|
|
945
|
-
};
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
987
|
+
}, a = this.settings.selectAll && this.settings.isMultiple;
|
|
988
|
+
this.settings.showSearch || (t.readOnly = !0, a ? this.addClasses(t, this.classes.hide) : this.addClasses(e, this.classes.hide)), t.type = "search", t.id = `${this.settings.id}-search`, t.placeholder = this.settings.searchPlaceholder, t.tabIndex = -1, t.setAttribute("aria-label", this.settings.searchPlaceholder), t.setAttribute("aria-autocomplete", "list"), t.setAttribute("autocapitalize", "off"), t.setAttribute("autocomplete", "off"), t.setAttribute("autocorrect", "off"), t.setAttribute("aria-hidden", "true");
|
|
989
|
+
let o = _(() => {
|
|
990
|
+
this.callbacks.search(t.value);
|
|
991
|
+
}, 100);
|
|
992
|
+
if (t.oninput = (e) => {
|
|
993
|
+
e.target.value !== "" && this.clearValueChipHighlight(), o();
|
|
994
|
+
}, t.onkeydown = (e) => {
|
|
949
995
|
switch (e.key) {
|
|
950
996
|
case "ArrowUp":
|
|
951
|
-
case "ArrowDown": return e.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
|
|
997
|
+
case "ArrowDown": return this.clearValueChipHighlight(), e.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
|
|
998
|
+
case "ArrowLeft":
|
|
999
|
+
case "ArrowRight": return t.value !== "" || !this.navigateValueChips(e.key === "ArrowLeft" ? "left" : "right") || (e.preventDefault(), !1);
|
|
1000
|
+
case "Backspace": return t.value !== "" || !this.deleteValueChip() || (e.preventDefault(), !1);
|
|
1001
|
+
case "Delete": return t.value !== "" || !this.getHighlightedValueChip() || !this.deleteValueChip(!0) || (e.preventDefault(), !1);
|
|
952
1002
|
case "Tab": return this.requestClose("tab"), !0;
|
|
953
1003
|
case "Escape": return this.requestClose("escape"), !1;
|
|
954
1004
|
case "Enter":
|
|
955
|
-
let
|
|
956
|
-
return
|
|
1005
|
+
let r = this.content.list.querySelector("." + this.classes.getFirst("highlighted"));
|
|
1006
|
+
return r ? (r.click(), !1) : !this.callbacks.addable || (n.click(), !1);
|
|
957
1007
|
}
|
|
958
|
-
return !0;
|
|
959
|
-
}, e.appendChild(t),
|
|
1008
|
+
return e.key.length === 1 && this.clearValueChipHighlight(), !0;
|
|
1009
|
+
}, e.appendChild(t), a) {
|
|
1010
|
+
let t = this.createSelectAllControl(() => this.toggleGlobalSelectAll());
|
|
1011
|
+
e.appendChild(t), r.selectAll = t;
|
|
1012
|
+
}
|
|
1013
|
+
if (this.callbacks.addable) {
|
|
960
1014
|
this.addClasses(n, this.classes.addable);
|
|
961
1015
|
let t = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
962
1016
|
t.setAttribute("viewBox", "0 0 100 100");
|
|
@@ -981,7 +1035,7 @@ var O = class {
|
|
|
981
1035
|
}, e);
|
|
982
1036
|
}
|
|
983
1037
|
}, r = this.callbacks.addable(t);
|
|
984
|
-
r
|
|
1038
|
+
r !== !1 && r != null && (r instanceof Promise ? r.then((e) => {
|
|
985
1039
|
typeof e == "string" ? n({
|
|
986
1040
|
text: e,
|
|
987
1041
|
value: e
|
|
@@ -1084,34 +1138,24 @@ var O = class {
|
|
|
1084
1138
|
this.addClasses(i, this.classes.optgroupLabelText), i.textContent = n.label, r.appendChild(i);
|
|
1085
1139
|
let a = document.createElement("div");
|
|
1086
1140
|
if (this.addClasses(a, this.classes.optgroupActions), r.appendChild(a), this.settings.isMultiple && n.selectAll) {
|
|
1087
|
-
let e =
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
let r = document.createElement("span");
|
|
1092
|
-
r.textContent = this.optgroupSelectAllLabel(t), e.appendChild(r);
|
|
1093
|
-
let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
1094
|
-
i.setAttribute("viewBox", "0 0 100 100"), e.appendChild(i);
|
|
1095
|
-
let o = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
1096
|
-
o.setAttribute("d", this.classes.optgroupSelectAllBox), i.appendChild(o);
|
|
1097
|
-
let s = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
1098
|
-
s.setAttribute("d", this.classes.optgroupSelectAllCheck), i.appendChild(s), e.addEventListener("click", (e) => {
|
|
1099
|
-
e.preventDefault(), e.stopPropagation();
|
|
1100
|
-
let t = this.store.getSelected();
|
|
1101
|
-
if (this.isOptgroupAllSelected(n.options, new Set(t))) {
|
|
1102
|
-
let e = t.filter((e) => {
|
|
1141
|
+
let e = this.createSelectAllControl(() => {
|
|
1142
|
+
let e = this.store.getSelected();
|
|
1143
|
+
if (this.isOptgroupAllSelected(n.options, new Set(e))) {
|
|
1144
|
+
let t = e.filter((e) => {
|
|
1103
1145
|
for (let t of n.options) if (e === t.id) return !1;
|
|
1104
1146
|
return !0;
|
|
1105
1147
|
});
|
|
1106
|
-
this.callbacks.setSelected(
|
|
1148
|
+
this.callbacks.setSelected(t, !0);
|
|
1107
1149
|
return;
|
|
1108
|
-
}
|
|
1109
|
-
|
|
1150
|
+
}
|
|
1151
|
+
{
|
|
1152
|
+
let t = n.options.map((e) => e.id).filter((e) => e !== void 0), r = e.concat(t);
|
|
1110
1153
|
for (let e of n.options) e.id && !this.store.getOptionByID(e.id) && this.callbacks.addOption(new A(e));
|
|
1111
1154
|
this.callbacks.setSelected(r, !0);
|
|
1112
1155
|
return;
|
|
1113
1156
|
}
|
|
1114
|
-
}
|
|
1157
|
+
}, this.isOptgroupAllSelected(n.options));
|
|
1158
|
+
a.appendChild(e);
|
|
1115
1159
|
}
|
|
1116
1160
|
if (n.closable !== "off") {
|
|
1117
1161
|
let t = document.createElement("div");
|
|
@@ -1128,7 +1172,7 @@ var O = class {
|
|
|
1128
1172
|
}
|
|
1129
1173
|
n instanceof A && t.appendChild(this.option(n));
|
|
1130
1174
|
}
|
|
1131
|
-
this.content.list.appendChild(t), this.setOptionsListFullData(e), this.announce(this.settings.resultsText.replace("{count}", String(this.lastRenderedOptions.length)));
|
|
1175
|
+
this.content.list.appendChild(t), this.setOptionsListFullData(e), this.announce(this.settings.resultsText.replace("{count}", String(this.lastRenderedOptions.length))), this.updateGlobalSelectAllState();
|
|
1132
1176
|
}
|
|
1133
1177
|
canFilterOptionsInPlace() {
|
|
1134
1178
|
return this.optionsListIsFullData ? this.content.list.querySelector("." + this.classes.getFirst("option")) !== null : !1;
|
|
@@ -1149,7 +1193,7 @@ var O = class {
|
|
|
1149
1193
|
let o = a.placeholder || !a.display || a.selected && this.settings.hideSelected, s = t(a, n);
|
|
1150
1194
|
o || !s ? (this.addClasses(e, this.classes.hide), this.removeClasses(e, this.classes.highlighted)) : (this.removeClasses(e, this.classes.hide), this.setOptionElementContent(e, a, n), r.push(a)), a.selected ? (this.addClasses(e, this.classes.selected), e.setAttribute("aria-selected", "true")) : (this.removeClasses(e, this.classes.selected), e.setAttribute("aria-selected", "false"));
|
|
1151
1195
|
}
|
|
1152
|
-
this.lastRenderedOptions = r, this.updateOptgroupVisibilityAfterSearch(n), r.length === 0 ? this.updateSearchResultsMessage(0, n) : (this.removeListSearchMessage(), this.announce(this.settings.resultsText.replace("{count}", String(r.length)))), this.updateOptgroupSelectAllStates();
|
|
1196
|
+
this.lastRenderedOptions = r, this.updateOptgroupVisibilityAfterSearch(n), r.length === 0 ? this.updateSearchResultsMessage(0, n) : (this.removeListSearchMessage(), this.announce(this.settings.resultsText.replace("{count}", String(r.length)))), this.updateOptgroupSelectAllStates(), this.updateGlobalSelectAllState();
|
|
1153
1197
|
}
|
|
1154
1198
|
setOptionsListFullData(e) {
|
|
1155
1199
|
let t = this.store.getDataOptions(!1), n = e.map((e) => e instanceof A ? [e] : e.options.map((e) => new A(e))).flat();
|
|
@@ -1221,7 +1265,48 @@ var O = class {
|
|
|
1221
1265
|
let a = e.has(t);
|
|
1222
1266
|
a ? (this.addClasses(r, this.classes.selected), r.setAttribute("aria-selected", "true"), n = r) : (this.removeClasses(r, this.classes.selected), r.setAttribute("aria-selected", "false")), this.settings.hideSelected && (a ? this.addClasses(r, this.classes.hide) : (this.removeClasses(r, this.classes.hide), i.display || this.addClasses(r, this.classes.hide)));
|
|
1223
1267
|
}
|
|
1224
|
-
!this.settings.isMultiple && n ? this.main.main.setAttribute("aria-activedescendant", n.id) : !this.settings.isMultiple && e.size === 0 && this.main.main.removeAttribute("aria-activedescendant"), this.updateOptgroupSelectAllStates();
|
|
1268
|
+
!this.settings.isMultiple && n ? this.main.main.setAttribute("aria-activedescendant", n.id) : !this.settings.isMultiple && e.size === 0 && this.main.main.removeAttribute("aria-activedescendant"), this.updateOptgroupSelectAllStates(), this.updateGlobalSelectAllState();
|
|
1269
|
+
}
|
|
1270
|
+
createSelectAllControl(e, t = !1) {
|
|
1271
|
+
let n = document.createElement("div");
|
|
1272
|
+
this.addClasses(n, this.classes.optgroupSelectAll), n.setAttribute("role", "checkbox"), n.setAttribute("aria-checked", t ? "true" : "false"), n.setAttribute("aria-label", this.selectAllLabel(t)), n.tabIndex = -1, t && this.addClasses(n, this.classes.selected);
|
|
1273
|
+
let r = document.createElement("span");
|
|
1274
|
+
r.textContent = this.selectAllLabel(t), n.appendChild(r);
|
|
1275
|
+
let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
1276
|
+
i.setAttribute("viewBox", "0 0 100 100"), i.setAttribute("aria-hidden", "true"), n.appendChild(i);
|
|
1277
|
+
let a = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
1278
|
+
a.setAttribute("d", this.classes.optgroupSelectAllBox), i.appendChild(a);
|
|
1279
|
+
let o = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
1280
|
+
return o.setAttribute("d", this.classes.optgroupSelectAllCheck), i.appendChild(o), n.addEventListener("click", (t) => {
|
|
1281
|
+
t.preventDefault(), t.stopPropagation(), e();
|
|
1282
|
+
}), n;
|
|
1283
|
+
}
|
|
1284
|
+
getSelectableOptions() {
|
|
1285
|
+
return this.store.getDataOptions(!1).filter((e) => !e.disabled && !e.placeholder && e.display);
|
|
1286
|
+
}
|
|
1287
|
+
isGlobalAllSelected(e) {
|
|
1288
|
+
let t = this.getSelectableOptions();
|
|
1289
|
+
if (t.length === 0) return !1;
|
|
1290
|
+
let n = e || new Set(this.store.getSelected());
|
|
1291
|
+
for (let e of t) if (!n.has(e.id)) return !1;
|
|
1292
|
+
return !0;
|
|
1293
|
+
}
|
|
1294
|
+
toggleGlobalSelectAll() {
|
|
1295
|
+
let e = this.getSelectableOptions(), t = new Set(this.store.getSelected());
|
|
1296
|
+
if (this.isGlobalAllSelected(t)) {
|
|
1297
|
+
let t = new Set(e.map((e) => e.id)), n = this.store.getSelected().filter((e) => !t.has(e));
|
|
1298
|
+
this.callbacks.setSelected(n, !0);
|
|
1299
|
+
return;
|
|
1300
|
+
}
|
|
1301
|
+
this.callbacks.setSelected(e.map((e) => e.id), !0);
|
|
1302
|
+
}
|
|
1303
|
+
updateGlobalSelectAllState() {
|
|
1304
|
+
let e = this.content.search.selectAll;
|
|
1305
|
+
if (!e || !this.settings.isMultiple || !this.settings.selectAll) return;
|
|
1306
|
+
let t = this.isGlobalAllSelected();
|
|
1307
|
+
t ? this.addClasses(e, this.classes.selected) : this.removeClasses(e, this.classes.selected), e.setAttribute("aria-checked", t ? "true" : "false"), e.setAttribute("aria-label", this.selectAllLabel(t));
|
|
1308
|
+
let n = e.querySelector("span");
|
|
1309
|
+
n && (n.textContent = this.selectAllLabel(t));
|
|
1225
1310
|
}
|
|
1226
1311
|
updateOptgroupSelectAllStates() {
|
|
1227
1312
|
if (!this.settings.isMultiple) return;
|
|
@@ -1237,13 +1322,13 @@ var O = class {
|
|
|
1237
1322
|
break;
|
|
1238
1323
|
}
|
|
1239
1324
|
}
|
|
1240
|
-
i ? this.addClasses(t, this.classes.selected) : this.removeClasses(t, this.classes.selected);
|
|
1325
|
+
i ? this.addClasses(t, this.classes.selected) : this.removeClasses(t, this.classes.selected), t.setAttribute("aria-checked", i ? "true" : "false"), t.setAttribute("aria-label", this.selectAllLabel(i));
|
|
1241
1326
|
let a = t.querySelector("span");
|
|
1242
|
-
a && (a.textContent = this.
|
|
1327
|
+
a && (a.textContent = this.selectAllLabel(i));
|
|
1243
1328
|
}
|
|
1244
1329
|
}
|
|
1245
|
-
|
|
1246
|
-
return e ?
|
|
1330
|
+
selectAllLabel(e) {
|
|
1331
|
+
return e ? this.settings.unselectAllText : this.settings.selectAllText;
|
|
1247
1332
|
}
|
|
1248
1333
|
isOptgroupAllSelected(e, t) {
|
|
1249
1334
|
if (e.length === 0) return !1;
|
|
@@ -1722,9 +1807,7 @@ var R = class {
|
|
|
1722
1807
|
case "selection":
|
|
1723
1808
|
this.applySelection(e.values, e.source, e.runAfterChange !== !1);
|
|
1724
1809
|
break;
|
|
1725
|
-
case "addOption":
|
|
1726
|
-
this.applyAddOption(e.option);
|
|
1727
|
-
break;
|
|
1810
|
+
case "addOption": this.applyAddOption(e.option);
|
|
1728
1811
|
}
|
|
1729
1812
|
}
|
|
1730
1813
|
applyStructure(e, t, n = !1, r = !1) {
|
|
@@ -1775,10 +1858,12 @@ var R = class {
|
|
|
1775
1858
|
}
|
|
1776
1859
|
return !1;
|
|
1777
1860
|
};
|
|
1778
|
-
if (!c(t.getData(!1)))
|
|
1779
|
-
|
|
1780
|
-
|
|
1781
|
-
|
|
1861
|
+
if (!c(t.getData(!1))) {
|
|
1862
|
+
if (o) {
|
|
1863
|
+
let n = t.getCatalogData();
|
|
1864
|
+
c(n) || t.setData([...n, new A(e)], !0), t.snapshotCatalog();
|
|
1865
|
+
} else t.addOption(e), t.snapshotCatalog();
|
|
1866
|
+
}
|
|
1782
1867
|
let l = t.getData(!1);
|
|
1783
1868
|
if (o) {
|
|
1784
1869
|
let e = t.getSelectedOptions();
|
|
@@ -1817,7 +1902,7 @@ var R = class {
|
|
|
1817
1902
|
t.events && t.events.error && t.events.error(/* @__PURE__ */ Error("Element isnt of type select"));
|
|
1818
1903
|
return;
|
|
1819
1904
|
}
|
|
1820
|
-
this.selectEl.dataset.ssid && this.destroy(), this.settings = new d(t.settings), this.cssClasses = new e(t.cssClasses);
|
|
1905
|
+
this.selectEl.dataset.ssid && this.destroy(), this.settings = new d(t.settings), t.settings?.selectAll === void 0 && this.selectEl.dataset.selectall === "true" && (this.settings.selectAll = !0), this.cssClasses = new e(t.cssClasses);
|
|
1821
1906
|
let n = [
|
|
1822
1907
|
"beforeOpen",
|
|
1823
1908
|
"afterOpen",
|