npm - @spw-ds/spw-stencil-library - Versions diffs - 1.8.0 → 1.9.0 - Mend

@spw-ds/spw-stencil-library 1.8.0 → 1.9.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.

Files changed (455) hide show

package/dist/cjs/spw-checkbox.cjs.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
 'use strict';
-var index = require('./index-CGg8f9_X.js');
+var index = require('./index-DvyqwgdS.js');
-const spwCheckboxCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:inline-flex;vertical-align:top;--spw-ds-checkbox-checked-color:var(--spw-ds-primary);--spw-ds-checkbox-checked-active-color:var(--spw-ds-active);--spw-ds-checkbox-checked-hover-color:var(--spw-ds-variant);--spw-ds-toggle-checked-color:var(--spw-color-themes-green-green-600);--spw-ds-toggle-checked-active-color:var(--spw-color-themes-green-green-700);--spw-ds-toggle-checked-hover-color:var(--spw-color-themes-green-green-800)}.spw-checkbox{display:inline-flex;flex-direction:row;align-items:flex-start;padding:0}.spw-checkbox__wrapper{display:flex;position:relative;justify-content:center;align-items:center;width:20px;height:20px;background-color:var(--spw-ds-white);border:2px solid var(--spw-color-themes-grey-grey-900);border-radius:var(--spw-spacings-border-radius-2-xs);font-size:var(--spw-typography-body-body-3-font-size);flex:none;order:0;flex-grow:0}.spw-checkbox__wrapper spw-icon{font-size:14px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.spw-checkbox__wrapper--error{border-color:var(--spw-colors-dark-states-error-error-300)}.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):hover{outline:4px solid var(--spw-color-themes-grey-grey-300)}.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):focus-visible,.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):active,.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):focus-within{outline:2px solid white;outline-offset:0;box-shadow:0 0 0 4px black}.spw-checkbox__wrapper--disabled{border-color:var(--spw-color-themes-grey-grey-500)}.spw-checkbox__wrapper--checked{border-color:var(--spw-ds-checkbox-checked-color);color:var(--spw-ds-checkbox-checked-color)}.spw-checkbox__wrapper--checked--disabled{color:var(--spw-color-themes-grey-grey-500)}.spw-checkbox__wrapper--toggle{top:1px;width:30px;height:18px;border-radius:40px;border:none;background:var(--spw-color-themes-grey-grey-500);transition:background 0.2s ease}.spw-checkbox__wrapper--toggle:hover{background:var(--spw-color-themes-grey-grey-600)}.spw-checkbox__wrapper--toggle:active{background:var(--spw-color-themes-grey-grey-800)}.spw-checkbox__wrapper--toggle spw-icon{opacity:0;line-height:0;transition:all 0.2s 0.3s ease;margin-left:15px;transition:all 0.2s ease}.spw-checkbox__wrapper--toggle:before{content:"";position:absolute;width:14px;height:14px;background:white;border-radius:50%;top:50%;left:2px;transform:translateY(-50%);transition:all 0.2s ease}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle{background:var(--spw-ds-toggle-checked-color);color:var(--spw-ds-toggle-checked-color)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle:before{left:calc(100% - 16px);background:white}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle spw-icon{font-size:10px;margin-left:6px;opacity:1}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle:not(.spw-checkbox__wrapper--disabled):hover{background:var(--spw-ds-toggle-checked-hover-color);color:var(--spw-ds-toggle-checked-hover-color)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle:not(.spw-checkbox__wrapper--disabled):active{background:var(--spw-ds-toggle-checked-active-color);color:var(--spw-ds-toggle-checked-active-color)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled{background:var(--spw-color-themes-grey-grey-500);color:var(--spw-color-themes-grey-grey-500)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled:before{background:var(--spw-ds-white)}.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled,.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled.spw-checkbox__wrapper--checked{border-color:var(--spw-color-themes-grey-grey-300);background:var(--spw-color-themes-grey-grey-300)}.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled:before,.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled.spw-checkbox__wrapper--checked:before{background:white}.spw-checkbox__label{color:var(--spw-color-themes-grey-grey-900);word-wrap:break-word;order:1;padding-top:1px;user-select:none;padding-left:var(--spw-spacings-spacing-sm)}.spw-checkbox__label:hover~.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled){outline:4px solid var(--spw-color-themes-grey-grey-300)}.spw-checkbox__label:active~.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled){outline:2px solid white;outline-offset:0;box-shadow:0 0 0 4px black}.spw-checkbox__label--disabled{color:var(--spw-color-themes-grey-grey-600)}.spw-checkbox__wrapper:hover,.spw-checkbox__label:hover{cursor:pointer}.spw-checkbox__wrapper--disabled:hover,.spw-checkbox__label--disabled:hover{cursor:not-allowed}`;
+const spwCheckboxCss = () => `@charset "UTF-8";html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:inline-flex;vertical-align:top;--spw-ds-checkbox-checked-color:var(--spw-ds-primary);--spw-ds-checkbox-checked-active-color:var(--spw-ds-active);--spw-ds-checkbox-checked-hover-color:var(--spw-ds-variant);--spw-ds-toggle-checked-color:var(--spw-color-themes-green-green-600);--spw-ds-toggle-checked-active-color:var(--spw-color-themes-green-green-700);--spw-ds-toggle-checked-hover-color:var(--spw-color-themes-green-green-800)}.spw-checkbox{display:inline-flex;flex-direction:row;align-items:flex-start;padding:0}.spw-checkbox__wrapper{display:flex;position:relative;justify-content:center;align-items:center;width:20px;height:20px;background-color:var(--spw-ds-white);border:2px solid var(--spw-color-themes-grey-grey-900);border-radius:var(--spw-spacings-border-radius-2-xs);font-size:var(--spw-typography-body-body-3-font-size);flex:none;order:0;flex-grow:0}.spw-checkbox__wrapper spw-icon{font-size:14px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.spw-checkbox__wrapper--error{border-color:var(--spw-colors-dark-states-error-error-300)}.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):hover{outline:4px solid var(--spw-color-themes-grey-grey-300)}.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):focus-visible,.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):active,.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled):focus-within{outline:2px solid white;outline-offset:0;box-shadow:0 0 0 4px black}.spw-checkbox__wrapper--disabled{border-color:var(--spw-color-themes-grey-grey-500)}.spw-checkbox__wrapper--checked{border-color:var(--spw-ds-checkbox-checked-color);color:var(--spw-ds-checkbox-checked-color)}.spw-checkbox__wrapper--checked--disabled{color:var(--spw-color-themes-grey-grey-500)}.spw-checkbox__wrapper--toggle{top:1px;width:30px;height:18px;border-radius:40px;border:none;background:var(--spw-color-themes-grey-grey-500);transition:background 0.2s ease}.spw-checkbox__wrapper--toggle:hover{background:var(--spw-color-themes-grey-grey-600)}.spw-checkbox__wrapper--toggle:active{background:var(--spw-color-themes-grey-grey-800)}.spw-checkbox__wrapper--toggle spw-icon{opacity:0;line-height:0;transition:all 0.2s 0.3s ease;margin-left:15px;transition:all 0.2s ease}.spw-checkbox__wrapper--toggle:before{content:"";position:absolute;width:14px;height:14px;background:white;border-radius:50%;top:50%;left:2px;transform:translateY(-50%);transition:all 0.2s ease}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle{background:var(--spw-ds-toggle-checked-color);color:var(--spw-ds-toggle-checked-color)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle:before{left:calc(100% - 16px);background:white}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle spw-icon{font-size:10px;margin-left:6px;opacity:1}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle:not(.spw-checkbox__wrapper--disabled):hover{background:var(--spw-ds-toggle-checked-hover-color);color:var(--spw-ds-toggle-checked-hover-color)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle:not(.spw-checkbox__wrapper--disabled):active{background:var(--spw-ds-toggle-checked-active-color);color:var(--spw-ds-toggle-checked-active-color)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled{background:var(--spw-color-themes-grey-grey-500);color:var(--spw-color-themes-grey-grey-500)}.spw-checkbox__wrapper.spw-checkbox__wrapper--checked.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled:before{background:var(--spw-ds-white)}.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled,.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled.spw-checkbox__wrapper--checked{border-color:var(--spw-color-themes-grey-grey-300);background:var(--spw-color-themes-grey-grey-300)}.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled:before,.spw-checkbox__wrapper.spw-checkbox__wrapper--toggle.spw-checkbox__wrapper--disabled.spw-checkbox__wrapper--checked:before{background:white}.spw-checkbox__label{color:var(--spw-color-themes-grey-grey-900);word-wrap:break-word;order:1;padding-top:1px;user-select:none;padding-left:var(--spw-spacings-spacing-sm)}.spw-checkbox__label:hover~.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled){outline:4px solid var(--spw-color-themes-grey-grey-300)}.spw-checkbox__label:active~.spw-checkbox__wrapper:not(.spw-checkbox__wrapper--disabled){outline:2px solid white;outline-offset:0;box-shadow:0 0 0 4px black}.spw-checkbox__label--disabled{color:var(--spw-color-themes-grey-grey-600)}.spw-checkbox__wrapper:hover,.spw-checkbox__label:hover{cursor:pointer}.spw-checkbox__wrapper--disabled:hover,.spw-checkbox__label--disabled:hover{cursor:not-allowed}`;
 const SpwCheckbox = class {
     constructor(hostRef) {

package/dist/cjs/spw-cookies.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CGg8f9_X.js');
+var index = require('./index-DvyqwgdS.js');
 const spwCookiesCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-cookies{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.5);display:flex;align-items:flex-end;justify-content:end;z-index:9999}.spw-cookies__container{background:white;border-radius:5px;box-shadow:0 2px 10px rgba(0, 0, 0, 0.1);max-width:400px;width:100%;margin:12px;line-height:1.5;max-height:calc(-24px + 100vh);overflow-y:auto}.spw-cookies__content,.spw-cookies__buttons{padding:16px}@media (min-width: 768px){.spw-cookies__content,.spw-cookies__buttons{padding:24px}}.spw-cookies__content{padding-bottom:0}.spw-cookies__buttons{position:sticky;z-index:10;bottom:0;background:#fff;display:flex;flex-direction:column;gap:12px;text-align:center}.spw-cookies__buttons spw-button{--spw-button-py-medium:var(--spw-button-py-large)}.spw-cookies__title{font-size:24px;line-height:1.2;color:var(--spw-colors-support-grey-grey-900);margin-bottom:8px}.spw-cookies__text{color:var(--spw-color-themes-grey-grey-600);margin-bottom:16px}.spw-cookies__checkbox{padding-top:4px}.spw-cookies__checkbox-text{color:var(--spw-color-themes-grey-grey-600)}`;

package/dist/cjs/spw-custom-select.cjs.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
 'use strict';
-var index = require('./index-CGg8f9_X.js');
+var index = require('./index-DvyqwgdS.js');
-const spwCustomSelectCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-custom-select{position:relative}.spw-custom-select__field-message{margin-bottom:8px;margin-top:-4px}.spw-custom-select__checkbox{margin-right:8px}.spw-custom-select__container{display:flex;justify-content:space-between;align-items:center;width:100%;height:40px;padding:0 12px;line-height:40px;border-radius:4px;border:1px solid var(--spw-color-themes-grey-grey-800);background-color:#fff}.spw-custom-select__container:hover{outline:4px solid var(--spw-color-themes-grey-grey-300)}.spw-custom-select__container:focus-within,.spw-custom-select__container:focus-visible{outline:3px solid white;outline-offset:0;box-shadow:0 0 0 6px black}.spw-custom-select--disabled .spw-custom-select__container{border-color:var(--spw-color-themes-grey-grey-400);background:var(--spw-color-themes-grey-grey-100);color:var(--spw-color-themes-grey-grey-500);cursor:not-allowed}.spw-custom-select--disabled .spw-custom-select__container::placeholder{color:var(--spw-color-themes-grey-grey-500)}.spw-custom-select--disabled .spw-custom-select__container:hover,.spw-custom-select--disabled .spw-custom-select__container:focus,.spw-custom-select--disabled .spw-custom-select__container:focus-visible{outline:none}.spw-custom-select--is-error .spw-custom-select__container{border-color:var(--spw-colors-states-error-error-300)}.spw-custom-select--large .spw-custom-select__container{height:60px;padding:0 24px;line-height:60px}.spw-custom-select--is-opened .spw-custom-select__container{height:auto;line-height:1;min-height:40px}.spw-custom-select--is-opened.spw-custom-select--down .spw-custom-select__container{border-radius:4px 4px 0 0;border-bottom-color:transparent}.spw-custom-select--is-opened.spw-custom-select--up .spw-custom-select__container{border-radius:0 0 4px 4px;border-top-color:transparent}.spw-custom-select__selected{flex:1;padding-right:30px;max-width:100%;overflow:hidden;text-overflow:ellipsis}.spw-custom-select__selected span{white-space:nowrap}.spw-custom-select--is-clear .spw-custom-select__selected{padding-right:58px}.spw-custom-select__selected-item{display:inline-flex;align-items:center;gap:6px;color:var(--spw-color-themes-grey-grey-900);border:1px solid var(--spw-color-themes-grey-grey-900);background:var(--spw-color-themes-grey-grey-200);line-height:24px;height:24px;padding:0 8px;margin:4px 6px 2px 0;border-radius:999px;font-size:14px;user-select:none}.spw-custom-select__selected-items{flex:1;overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.spw-custom-select--is-opened .spw-custom-select__selected-items{padding-top:3px;padding-bottom:4px;overflow:visible;text-overflow:initial;text-wrap:initial}.spw-custom-select__icons{display:flex;align-items:center;position:absolute;top:50%;right:12px;gap:8px;pointer-events:none;transform:translateY(-50%);z-index:12}.spw-custom-select--large .spw-custom-select__icons{right:24px}.spw-custom-select__clear{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;pointer-events:auto;cursor:pointer;padding:2px;border:2px var(--spw-color-themes-grey-grey-900) solid;border-radius:50%;font-size:12px}.spw-custom-select__arrow{font-size:16px;color:var(--spw-color-themes-grey-grey-600);pointer-events:none}.spw-custom-select__wrapper{position:relative}.spw-custom-select--is-opened .spw-custom-select__search{position:absolute;top:0;left:0;z-index:11;width:100%;margin-top:1px}.spw-custom-select--has-value.spw-custom-select--is-opened .spw-custom-select__search{top:100%;margin-top:-3px;padding:4px;border:1px solid var(--spw-color-themes-grey-grey-800);background:white}.spw-custom-select--up.spw-custom-select--has-value.spw-custom-select--is-opened .spw-custom-select__search{top:-100%;margin-top:-7px}.spw-custom-select__search-input{padding:0;height:38px;line-height:40px;border:none;margin:0;width:calc(100% - 30px)}.spw-custom-select--is-clear .spw-custom-select__search-input{width:calc(100% - 58px)}.spw-custom-select__search-input{text-overflow:ellipsis}.spw-custom-select__search-input:focus{outline:none}.spw-custom-select--is-opened .spw-custom-select__search-input{border-left:1px solid var(--spw-color-themes-grey-grey-800);padding:0 12px}.spw-custom-select--is-opened.spw-custom-select--has-value .spw-custom-select__search-input{border:1px solid var(--spw-color-themes-grey-grey-800);width:100%;border-radius:3px}.spw-custom-select__options{background-color:#fff;border:1px solid var(--spw-color-themes-grey-grey-800);border-radius:0 0 4px 4px;max-height:200px;overflow-y:auto;z-index:9999;box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}.spw-custom-select__options:not(.spw-custom-select__options--fixed){position:absolute;top:100%;left:0;width:100%;margin-top:-1px}.spw-custom-select__options--up:not(.spw-custom-select__options--fixed){top:0;transform:translateY(-100%);border-radius:4px 4px 0 0;margin-top:0}.spw-custom-select__options--fixed.spw-custom-select__options--down{transform:translateY(0)}.spw-custom-select__options--fixed.spw-custom-select__options--up{transform:translateY(-100%);border-radius:4px 4px 0 0;margin-top:-40px}.spw-custom-select--down.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options--fixed{margin-top:44px}.spw-custom-select--up.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options--fixed{margin-top:-86px}.spw-custom-select--down.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options:not(.spw-custom-select__options--fixed){margin-top:44px}.spw-custom-select--up.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options:not(.spw-custom-select__options--fixed){margin-top:-46px}.spw-custom-select__no-results{padding:12px;cursor:not-allowed;color:var(--spw-color-themes-grey-grey-600)}.spw-custom-select__option{border-bottom:1px solid var(--spw-color-themes-grey-grey-900);padding:12px;cursor:pointer}.spw-custom-select__option:hover{background-color:var(--spw-color-themes-grey-grey-200)}.spw-custom-select__option:last-child{border-bottom:none}.spw-custom-select__option--selected{font-weight:700}.spw-custom-select__option--disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}.spw-custom-select__option--disabled:hover{background-color:transparent}.spw-custom-select__error{display:block;font-size:12px;color:var(--spw-color-themes-grey-grey-600);margin-top:8px}.spw-custom-select__option--focused{background-color:var(--spw-color-themes-grey-grey-300)}`;
+const spwCustomSelectCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-custom-select{position:relative}.spw-custom-select__field-message{margin-bottom:8px;margin-top:-4px}.spw-custom-select__checkbox{margin-right:8px}.spw-custom-select__container{display:flex;justify-content:space-between;align-items:center;width:100%;height:40px;padding:0 12px;line-height:40px;border-radius:4px;border:1px solid var(--spw-color-themes-grey-grey-800);background-color:#fff}.spw-custom-select__container:hover{outline:4px solid var(--spw-color-themes-grey-grey-300)}.spw-custom-select__container:focus-within,.spw-custom-select__container:focus-visible{outline:3px solid white;outline-offset:0;box-shadow:0 0 0 6px black}.spw-custom-select--disabled .spw-custom-select__container{border-color:var(--spw-color-themes-grey-grey-400);background:var(--spw-color-themes-grey-grey-100);color:var(--spw-color-themes-grey-grey-500);cursor:not-allowed}.spw-custom-select--disabled .spw-custom-select__container::placeholder{color:var(--spw-color-themes-grey-grey-500)}.spw-custom-select--disabled .spw-custom-select__container:hover,.spw-custom-select--disabled .spw-custom-select__container:focus,.spw-custom-select--disabled .spw-custom-select__container:focus-visible{outline:none}.spw-custom-select--is-error .spw-custom-select__container{border-color:var(--spw-colors-states-error-error-300)}.spw-custom-select--large .spw-custom-select__container{height:60px;padding:0 24px;line-height:60px}.spw-custom-select--is-opened .spw-custom-select__container{height:auto;line-height:1;min-height:40px}.spw-custom-select--is-opened.spw-custom-select--down .spw-custom-select__container{border-radius:4px 4px 0 0;border-bottom-color:transparent}.spw-custom-select--is-opened.spw-custom-select--up .spw-custom-select__container{border-radius:0 0 4px 4px;border-top-color:transparent}.spw-custom-select__selected{flex:1;padding-right:30px;max-width:100%;overflow:hidden;text-overflow:ellipsis}.spw-custom-select__selected span{white-space:nowrap}.spw-custom-select--is-clear .spw-custom-select__selected{padding-right:58px}.spw-custom-select__selected-item{display:inline-flex;align-items:center;gap:6px;color:var(--spw-color-themes-grey-grey-900);border:1px solid var(--spw-color-themes-grey-grey-900);background:var(--spw-color-themes-grey-grey-200);line-height:24px;height:24px;padding:0 8px;margin:4px 6px 2px 0;border-radius:999px;font-size:14px;user-select:none}.spw-custom-select__selected-items{flex:1;overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.spw-custom-select--is-opened .spw-custom-select__selected-items{padding-top:3px;padding-bottom:4px;overflow:visible;text-overflow:initial;text-wrap:initial}.spw-custom-select__icons{display:flex;align-items:center;position:absolute;top:50%;right:12px;gap:8px;pointer-events:none;transform:translateY(-50%);z-index:12}.spw-custom-select--large .spw-custom-select__icons{right:24px}.spw-custom-select__clear{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;pointer-events:auto;cursor:pointer;padding:2px;border:2px var(--spw-color-themes-grey-grey-900) solid;border-radius:50%;font-size:12px}.spw-custom-select__arrow{font-size:16px;color:var(--spw-color-themes-grey-grey-600);pointer-events:none}.spw-custom-select__wrapper{position:relative}.spw-custom-select--is-opened .spw-custom-select__search{position:absolute;top:0;left:0;z-index:11;width:100%;margin-top:1px}.spw-custom-select--has-value.spw-custom-select--is-opened .spw-custom-select__search{top:100%;margin-top:-3px;padding:4px;border:1px solid var(--spw-color-themes-grey-grey-800);background:white}.spw-custom-select--up.spw-custom-select--has-value.spw-custom-select--is-opened .spw-custom-select__search{top:-100%;margin-top:-7px}.spw-custom-select__search-input{padding:0;height:38px;line-height:40px;border:none;margin:0;width:calc(100% - 30px)}.spw-custom-select--is-clear .spw-custom-select__search-input{width:calc(100% - 58px)}.spw-custom-select__search-input{text-overflow:ellipsis}.spw-custom-select__search-input:focus{outline:none}.spw-custom-select--is-opened .spw-custom-select__search-input{border-left:1px solid var(--spw-color-themes-grey-grey-800);padding:0 12px}.spw-custom-select--is-opened.spw-custom-select--has-value .spw-custom-select__search-input{border:1px solid var(--spw-color-themes-grey-grey-800);width:100%;border-radius:3px}.spw-custom-select__options{background-color:#fff;border:1px solid var(--spw-color-themes-grey-grey-800);border-radius:0 0 4px 4px;max-height:200px;overflow-y:auto}.spw-custom-select__options::-webkit-scrollbar{width:14px;height:14px}.spw-custom-select__options::-webkit-scrollbar-thumb{background:var(--spw-color-themes-grey-grey-400);border-radius:20px;border:4px solid var(--spw-ds-white)}.spw-custom-select__options::-webkit-scrollbar-track{background:var(--spw-ds-white)}.spw-custom-select__options{scrollbar-face-color:var(--spw-color-themes-grey-grey-400);scrollbar-track-color:var(--spw-ds-white)}.spw-custom-select__options{z-index:9999;box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}.spw-custom-select__options:not(.spw-custom-select__options--fixed){position:absolute;top:100%;left:0;width:100%;margin-top:-1px}.spw-custom-select__options--up:not(.spw-custom-select__options--fixed){top:0;transform:translateY(-100%);border-radius:4px 4px 0 0;margin-top:0}.spw-custom-select__options--fixed.spw-custom-select__options--down{transform:translateY(0)}.spw-custom-select__options--fixed.spw-custom-select__options--up{transform:translateY(-100%);border-radius:4px 4px 0 0;margin-top:-40px}.spw-custom-select--down.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options--fixed{margin-top:44px}.spw-custom-select--up.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options--fixed{margin-top:-86px}.spw-custom-select--down.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options:not(.spw-custom-select__options--fixed){margin-top:44px}.spw-custom-select--up.spw-custom-select--has-value.spw-custom-select--is-opened:not(.spw-custom-select--not-searchable) .spw-custom-select__options:not(.spw-custom-select__options--fixed){margin-top:-46px}.spw-custom-select__no-results{padding:12px;cursor:not-allowed;color:var(--spw-color-themes-grey-grey-600)}.spw-custom-select__option{border-bottom:1px solid var(--spw-color-themes-grey-grey-900);padding:12px;cursor:pointer}.spw-custom-select__option:hover{background-color:var(--spw-color-themes-grey-grey-200)}.spw-custom-select__option:last-child{border-bottom:none}.spw-custom-select__option--selected{font-weight:700}.spw-custom-select__option--disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}.spw-custom-select__option--disabled:hover{background-color:transparent}.spw-custom-select__error{display:block;font-size:12px;color:var(--spw-color-themes-grey-grey-600);margin-top:8px}.spw-custom-select__option--focused{background-color:var(--spw-color-themes-grey-grey-300)}`;
 const SpwCustomSelect = class {
     constructor(hostRef) {
@@ -15,6 +15,7 @@ const SpwCustomSelect = class {
             this.internals = hostRef.$hostElement$.attachInternals();
             hostRef.$hostElement$["s-ei"] = this.internals;
         }
+        this.parentScrollContainer = null;
         this.isOpen = false;
         this.parsedOptions = [];
         this.focusedOptionIndex = null;
@@ -204,8 +205,77 @@ const SpwCustomSelect = class {
         document.removeEventListener('spw-custom-select-opened', this.handleOtherSelectOpened);
         window.removeEventListener('scroll', this.updateDropdownPosition, true);
         window.removeEventListener('resize', this.updateDropdownPosition);
+        this.cleanupParentScrollListener();
         this.isOpen = false;
     }
+    findParentComponent() {
+        if (!this.fixedDropdownParent)
+            return null;
+        let current = this.hostElement;
+        while (current) {
+            if (current instanceof HTMLElement && current.tagName.toLowerCase() === this.fixedDropdownParent.toLowerCase()) {
+                return current;
+            }
+            if (current.parentElement) {
+                current = current.parentElement;
+            }
+            else {
+                const rootNode = current.getRootNode();
+                if (rootNode instanceof ShadowRoot) {
+                    current = rootNode.host;
+                }
+                else {
+                    break;
+                }
+            }
+        }
+        return null;
+    }
+    findScrollContainerInShadowRoot(parent) {
+        const shadowRoot = parent.shadowRoot;
+        if (!shadowRoot)
+            return null;
+        const elements = shadowRoot.querySelectorAll('*');
+        let deepestScrollContainer = null;
+        let maxDepth = -1;
+        for (const el of Array.from(elements)) {
+            const htmlEl = el;
+            const style = window.getComputedStyle(htmlEl);
+            const hasOverflow = style.overflow === 'auto' || style.overflow === 'scroll' || style.overflowY === 'auto' || style.overflowY === 'scroll';
+            if (hasOverflow) {
+                let depth = 0;
+                let node = el;
+                while (node && node !== shadowRoot) {
+                    depth++;
+                    node = node.parentNode;
+                }
+                if (depth > maxDepth) {
+                    maxDepth = depth;
+                    deepestScrollContainer = htmlEl;
+                }
+            }
+        }
+        return deepestScrollContainer;
+    }
+    ensureParentScrollListener() {
+        if (!this.fixedDropdownParent || !this.fixedDropdown)
+            return;
+        if (this.parentScrollContainer)
+            return;
+        const parentComponent = this.findParentComponent();
+        if (parentComponent) {
+            this.parentScrollContainer = this.findScrollContainerInShadowRoot(parentComponent);
+            if (this.parentScrollContainer) {
+                this.parentScrollContainer.addEventListener('scroll', this.updateDropdownPosition);
+            }
+        }
+    }
+    cleanupParentScrollListener() {
+        if (this.parentScrollContainer) {
+            this.parentScrollContainer.removeEventListener('scroll', this.updateDropdownPosition);
+            this.parentScrollContainer = null;
+        }
+    }
     parseOptions(newValue) {
         try {
             if (Array.isArray(newValue)) {
@@ -268,6 +338,7 @@ const SpwCustomSelect = class {
             const wasOpen = this.isOpen;
             this.isOpen = !this.isOpen;
             if (this.isOpen && !wasOpen) {
+                this.ensureParentScrollListener();
                 this.notifyOtherSelects();
             }
             if (!this.isOpen) {
@@ -290,6 +361,7 @@ const SpwCustomSelect = class {
         this.determineDropdownDirection();
         this.isOpen = true;
         this.focusedOptionIndex = 0;
+        this.ensureParentScrollListener();
         this.notifyOtherSelects();
     }
     closeDropdown() {
@@ -447,6 +519,7 @@ const SpwCustomSelect = class {
         this.focusedOptionIndex = 0;
         if (!this.isOpen) {
             this.isOpen = true;
+            this.ensureParentScrollListener();
             this.notifyOtherSelects();
         }
     }
@@ -469,11 +542,11 @@ const SpwCustomSelect = class {
     render() {
         const filteredOptions = this.getFilteredOptions();
         const showPlaceholder = this.showPlaceholder();
-        return (index.h("div", { key: '064c59c91692cc15ba93199a724553477bac7697', class: this.elementClass, ref: el => (this.host = el) }, this.label && (index.h("spw-field-label", { key: 'c326970b9d3da20f7ca2236500e98bddd9bf1ce4', label: this.label, name: this.name, required: this.required, tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, tooltipMaxWidth: this.tooltipMaxWidth, tooltipDirection: this.tooltipDirection, tooltipCursor: this.tooltipCursor })), this.assistiveText && (index.h("spw-field-message", { key: '85103620cd282232f01fdbd467886490fd888991', class: "spw-custom-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), index.h("div", { key: '337d9a34f40c13f8fb491c73a137711d7cbcee6d', class: "spw-custom-select__wrapper" }, index.h("div", { key: '50566c5d50437a9d351ee44198d479f32a603158', class: "spw-custom-select__container", id: this.name, ref: el => (this.selectContainer = el), onClick: event => this.toggleDropdown(event), onKeyDown: event => this.handleKeyDown(event), tabindex: this.disabled ? -1 : 0 }, index.h("div", { key: '4f847641c06968e5d7be950bcdae69c988245755', class: "spw-custom-select__selected" }, this.isSearchVisible() && (index.h("div", { key: '5001191ddaed6c57f2f3242a374288ba1998e874', class: "spw-custom-select__search" }, index.h("input", { key: '5ab68945bdc9fd54365dcac92d27c20dad0f8061', class: "spw-custom-select__search-input", placeholder: this.searchPlaceholder, onInput: event => this.handleSearchInput(event), value: this.searchText }))), showPlaceholder && index.h("span", { key: '6edafe01385ba6d334532cc72029255a11cc83a5' }, this.placeholder), this.multiple && this.internalValue.length > 0 && (index.h("div", { key: '7c344bbc9beff7011fe4b25acd4d267ac7c37caa', class: "spw-custom-select__selected-items" }, this.internalValue.map(val => {
+        return (index.h("div", { key: '43447038a22e3ceffa27d676bc2192e4aca5f287', class: this.elementClass, ref: el => (this.host = el) }, this.label && (index.h("spw-field-label", { key: '5baa3c868c7365ae95cb3e0b643c52abe7b13c55', label: this.label, name: this.name, required: this.required, tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, tooltipMaxWidth: this.tooltipMaxWidth, tooltipDirection: this.tooltipDirection, tooltipCursor: this.tooltipCursor })), this.assistiveText && (index.h("spw-field-message", { key: '6c7178d419fde80e0394dcc80754ad2313bf0833', class: "spw-custom-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), index.h("div", { key: '78b5cc99a3f9b86ba0f3e9e0f5473a60c198eec6', class: "spw-custom-select__wrapper" }, index.h("div", { key: '4a964452b1e693b3693c7db8f87a98a0262bab50', class: "spw-custom-select__container", id: this.name, ref: el => (this.selectContainer = el), onClick: event => this.toggleDropdown(event), onKeyDown: event => this.handleKeyDown(event), tabindex: this.disabled ? -1 : 0 }, index.h("div", { key: 'a6474cfe11ab5987cc4103e0dcf92875960622a7', class: "spw-custom-select__selected" }, this.isSearchVisible() && (index.h("div", { key: 'dfa397daa49fb324eee56c384dd29e661ca7fd1c', class: "spw-custom-select__search" }, index.h("input", { key: '59229eb7c26407745f9a2d4d049027f5fbec3950', class: "spw-custom-select__search-input", placeholder: this.searchPlaceholder, onInput: event => this.handleSearchInput(event), value: this.searchText }))), showPlaceholder && index.h("span", { key: '2adfc41cb5589e7c599b87c31a27f5669a2e778e' }, this.placeholder), this.multiple && this.internalValue.length > 0 && (index.h("div", { key: '638b74dc9f89c466a99b03b38a319eef3a773788', class: "spw-custom-select__selected-items" }, this.internalValue.map(val => {
             var _a;
             return (index.h("span", { class: "spw-custom-select__selected-item" }, (_a = this.parsedOptions.find(option => String(option.value) === String(val))) === null || _a === void 0 ? void 0 :
                 _a.label, index.h("spw-icon", { icon: "fa-times", class: "spw-custom-select__deselect-icon", onClick: event => this.selectOption(val, event) })));
-        }))), !this.multiple && index.h("span", { key: 'ac06a9718592fde37f42c90d84700d74d0d50416' }, this.getSelectedLabels()))), index.h("div", { key: '4a083004a149ab7388a982fb5eff4e128bbb4913', class: "spw-custom-select__icons" }, this.isClear && (this.hasSelectedValue || !!this.searchText) && (index.h("span", { key: 'de239bf60b076f4e01a82c454f285c7bdf65c5df', class: "spw-custom-select__clear", onClick: (event) => this.handleClear(event) }, index.h("spw-icon", { key: '1dce3eb6f67567b559992645681d9796a1152ed3', icon: "fa-xmark" }))), index.h("div", { key: 'f4473657553e03512f3c3468ee4303e83fb4183e', class: "spw-custom-select__arrow" }, index.h("spw-icon", { key: 'f4ccf66ee935c4e169eca3fc4beebaa35c3adc1c', icon: this.isOpen ? 'fa-chevron-up' : 'fa-chevron-down' }))), this.isOpen && (index.h("div", { key: '4c5fc4853b083c4a1128fadb6f35e33a67b07428', class: {
+        }))), !this.multiple && index.h("span", { key: '8182a2e87d00b2d27b626a92b62f680fa4dde490' }, this.getSelectedLabels()))), index.h("div", { key: '6a96891304f69e05b58b32f9c388a1d7a9dec540', class: "spw-custom-select__icons" }, this.isClear && (this.hasSelectedValue || !!this.searchText) && (index.h("span", { key: '1d1016892a92598037fe4726fb401b85c9ebbd11', class: "spw-custom-select__clear", onClick: event => this.handleClear(event) }, index.h("spw-icon", { key: '2d8b4105962fe31534135ace34720031727e356e', icon: "fa-xmark" }))), index.h("div", { key: '44a3b248918027860ef576bd98661b3af5893651', class: "spw-custom-select__arrow" }, index.h("spw-icon", { key: 'd1778da95cb69a2bdf8786d351993bfd84b8d1fa', icon: this.isOpen ? 'fa-chevron-up' : 'fa-chevron-down' }))), this.isOpen && (index.h("div", { key: 'ef3f8ba6da6295d7bd9e15f653b33b5426b731ce', class: {
                 'spw-custom-select__options': true,
                 [`spw-custom-select__options--${this.dropdownDirection}`]: true,
                 'spw-custom-select__options--fixed': this.fixedDropdown,
@@ -484,16 +557,17 @@ const SpwCustomSelect = class {
                     left: `${this.dropdownPosition.left}px`,
                     width: `${this.dropdownPosition.width}px`,
                 }
-                : {} }, !!filteredOptions.length && (index.h("ul", { key: 'a652e4fd6b5741337eceb5dc6c5efbe0deb7d995' }, filteredOptions.map((option, index$1) => (index.h("li", { class: {
+                : {} }, !!filteredOptions.length && (index.h("ul", { key: 'f39f93c198df038c933ac5610c829e86365805c6' }, filteredOptions.map((option, index$1) => (index.h("li", { class: {
                 'spw-custom-select__option': true,
                 'spw-custom-select__option--selected': this.multiple
                     ? this.internalValue.some(val => String(val) === String(option.value))
                     : option.value === this.internalValue,
                 'spw-custom-select__option--focused': index$1 === this.focusedOptionIndex,
                 'spw-custom-select__option--disabled': option.disabled,
-            }, onClick: () => this.selectOption(option.value) }, this.multiple && (index.h("spw-checkbox", { onKeyDown: event => this.handleOptionKeyDown(event, option.value), class: "spw-custom-select__checkbox", checked: this.internalValue.some(val => String(val) === String(option.value)), disabled: option.disabled })), option.label))))), !filteredOptions.length && index.h("p", { key: '0d786046f4f8b3c6a9a43f5c2199758feb63a305', class: "spw-custom-select__no-results" }, this.noResultsText)))), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
+            }, onClick: () => this.selectOption(option.value) }, this.multiple && (index.h("spw-checkbox", { onKeyDown: event => this.handleOptionKeyDown(event, option.value), class: "spw-custom-select__checkbox", checked: this.internalValue.some(val => String(val) === String(option.value)), disabled: option.disabled })), option.label))))), !filteredOptions.length && index.h("p", { key: 'ec93e913732816d37fe58731d4edfe8e5cd78718', class: "spw-custom-select__no-results" }, this.noResultsText)))), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
     }
     static get formAssociated() { return true; }
+    get hostElement() { return index.getElement(this); }
     static get watchers() { return {
         "items": [{
                 "parseOptions": 0

package/dist/cjs/spw-date-picker.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CGg8f9_X.js');
+var index = require('./index-DvyqwgdS.js');
 var _commonjsHelpers = require('./_commonjsHelpers-CFO10eej.js');
 var datepicker_min = {exports: {}};
@@ -19,7 +19,7 @@ function requireDatepicker_min () {
 var datepicker_minExports = requireDatepicker_min();
 var datepicker = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(datepicker_minExports);
-const spwDatePickerCss = () => `.qs-datepicker-container{font-size:1rem;font-family:sans-serif;color:#000;position:absolute;width:15.625em;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;z-index:9001;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid grey;border-radius:.263921875em;overflow:hidden;background:#fff;-webkit-box-shadow:0 1.25em 1.25em -.9375em rgba(0,0,0,.3);box-shadow:0 1.25em 1.25em -.9375em rgba(0,0,0,.3)}.qs-datepicker-container *{-webkit-box-sizing:border-box;box-sizing:border-box}.qs-centered{position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.qs-hidden{display:none}.qs-overlay{position:absolute;top:0;left:0;background:rgba(0,0,0,.75);color:#fff;width:100%;height:100%;padding:.5em;z-index:1;opacity:1;-webkit-transition:opacity .3s;transition:opacity .3s;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.qs-overlay.qs-hidden{opacity:0;z-index:-1}.qs-overlay .qs-overlay-year{background:rgba(0,0,0,0);border:none;border-bottom:1px solid #fff;border-radius:0;color:#fff;font-size:.875em;padding:.25em 0;width:80%;text-align:center;margin:0 auto;display:block}.qs-overlay .qs-overlay-year::-webkit-inner-spin-button{-webkit-appearance:none}.qs-overlay .qs-close{padding:.5em;cursor:pointer;position:absolute;top:0;right:0}.qs-overlay .qs-submit{border:1px solid #fff;border-radius:.263921875em;padding:.5em;margin:0 auto auto;cursor:pointer;background:hsla(0,0%,50.2%,.4)}.qs-overlay .qs-submit.qs-disabled{color:grey;border-color:grey;cursor:not-allowed}.qs-overlay .qs-overlay-month-container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.qs-overlay .qs-overlay-month{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:calc(100% / 3);cursor:pointer;opacity:.5;-webkit-transition:opacity .15s;transition:opacity .15s}.qs-overlay .qs-overlay-month.active,.qs-overlay .qs-overlay-month:hover{opacity:1}.qs-controls{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0;background:#d3d3d3;-webkit-filter:blur(0);filter:blur(0);-webkit-transition:-webkit-filter .3s;transition:-webkit-filter .3s;transition:filter .3s;transition:filter .3s, -webkit-filter .3s}.qs-controls.qs-blur{-webkit-filter:blur(5px);filter:blur(5px)}.qs-arrow{height:1.5625em;width:1.5625em;position:relative;cursor:pointer;border-radius:.263921875em;-webkit-transition:background .15s;transition:background .15s}.qs-arrow:hover.qs-left:after{border-right-color:#000}.qs-arrow:hover.qs-right:after{border-left-color:#000}.qs-arrow:hover{background:rgba(0,0,0,.1)}.qs-arrow:after{content:"";border:.390625em solid rgba(0,0,0,0);position:absolute;top:50%;-webkit-transition:border .2s;transition:border .2s}.qs-arrow.qs-left:after{border-right-color:grey;right:50%;-webkit-transform:translate(25%,-50%);-ms-transform:translate(25%,-50%);transform:translate(25%,-50%)}.qs-arrow.qs-right:after{border-left-color:grey;left:50%;-webkit-transform:translate(-25%,-50%);-ms-transform:translate(-25%,-50%);transform:translate(-25%,-50%)}.qs-month-year{font-weight:700;-webkit-transition:border .2s;transition:border .2s;border-bottom:1px solid rgba(0,0,0,0)}.qs-month-year:not(.qs-disabled-year-overlay){cursor:pointer}.qs-month-year:not(.qs-disabled-year-overlay):hover{border-bottom:1px solid grey}.qs-month-year:active:focus,.qs-month-year:focus{outline:none}.qs-month{padding-right:.5ex}.qs-year{padding-left:.5ex}.qs-squares{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:.3125em;-webkit-filter:blur(0);filter:blur(0);-webkit-transition:-webkit-filter .3s;transition:-webkit-filter .3s;transition:filter .3s;transition:filter .3s, -webkit-filter .3s}.qs-squares.qs-blur{-webkit-filter:blur(5px);filter:blur(5px)}.qs-square{width:calc(100% / 7);height:1.5625em;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;-webkit-transition:background .1s;transition:background .1s;border-radius:.263921875em}.qs-square:not(.qs-empty):not(.qs-disabled):not(.qs-day):not(.qs-active):hover{background:orange}.qs-current{font-weight:700;text-decoration:underline}.qs-active,.qs-range-end,.qs-range-start{background:#add8e6}.qs-range-start:not(.qs-range-6){border-top-right-radius:0;border-bottom-right-radius:0}.qs-range-middle{background:#d4ebf2}.qs-range-middle:not(.qs-range-0):not(.qs-range-6){border-radius:0}.qs-range-middle.qs-range-0{border-top-right-radius:0;border-bottom-right-radius:0}.qs-range-end:not(.qs-range-0),.qs-range-middle.qs-range-6{border-top-left-radius:0;border-bottom-left-radius:0}.qs-disabled,.qs-outside-current-month{opacity:.2}.qs-disabled{cursor:not-allowed}.qs-day,.qs-empty{cursor:default}.qs-day{font-weight:700;color:grey}.qs-event{position:relative}.qs-event:after{content:"";position:absolute;width:.46875em;height:.46875em;border-radius:50%;background:#07f;bottom:0;right:0}html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block;font-family:inherit;--spw-input-height:40px;--spw-input-padding:0 12px;--spw-input-text-align:left;--spw-input-font-size:16px;--spw-input-radius:4px;--spw-input-icon-search-color:var(--spw-color-themes-grey-grey-900);--spw-input-border:var(--spw-color-themes-grey-grey-800)}.qs-datepicker-container .qs-overlay .qs-overlay-year,.spw-date-picker__input{flex:1;width:100%;height:var(--spw-input-height);padding:var(--spw-input-padding);text-overflow:ellipsis;line-height:var(--spw-input-height);border-radius:var(--spw-input-radius);font-size:var(--spw-input-font-size);text-align:var(--spw-input-text-align);border:1px solid var(--spw-input-border)}.qs-datepicker-container .qs-overlay .qs-overlay-year:hover,.spw-date-picker__input:hover{outline:4px solid var(--spw-color-themes-grey-grey-300)}.qs-datepicker-container .qs-overlay .qs-overlay-year:focus,.spw-date-picker__input:focus,.qs-datepicker-container .qs-overlay .qs-overlay-year:focus-visible,.spw-date-picker__input:focus-visible{outline:3px solid white;outline-offset:0;box-shadow:0 0 0 6px black}.qs-datepicker-container .qs-overlay .qs-overlay-year:active,.spw-date-picker__input:active{border-color:var(--spw-input-border)}.spw-date-picker{position:relative}.spw-date-picker__field-message{margin-bottom:8px;margin-top:-4px}.spw-date-picker__input-container{position:relative;display:flex;align-items:center}.spw-date-picker--is-clear .spw-date-picker__input{padding-right:70px}.spw-date-picker__input--error{border-color:var(--spw-color-error, #dc2626)}.spw-date-picker__input--error:focus{border-color:var(--spw-color-error, #dc2626);box-shadow:0 0 0 3px var(--spw-color-error-light, rgba(220, 38, 38, 0.1))}.spw-date-picker__input--disabled{border-color:var(--spw-color-themes-grey-grey-400);background:var(--spw-color-themes-grey-grey-100);color:var(--spw-color-themes-grey-grey-500);cursor:not-allowed}.spw-date-picker__input--disabled::placeholder{color:var(--spw-color-themes-grey-grey-500)}.spw-date-picker__input--disabled:hover,.spw-date-picker__input--disabled:focus,.spw-date-picker__input--disabled:focus-visible{outline:none}.spw-date-picker__input--open{outline:3px solid white;outline-offset:0;box-shadow:0 0 0 6px black}.spw-date-picker__input::placeholder{color:var(--spw-color-text-placeholder, #9ca3af)}.spw-date-picker__icons{display:flex;align-items:center;position:absolute;top:50%;right:12px;gap:8px;transform:translateY(-50%)}.spw-date-picker--disabled .spw-date-picker__icons{pointer-events:none}.spw-date-picker__clear{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;cursor:pointer;padding:2px;border:2px var(--spw-color-themes-grey-grey-900) solid;border-radius:50%;font-size:12px;transition:all 0.2s ease-in}.spw-date-picker__clear:hover{background:var(--spw-color-themes-grey-grey-300)}.spw-date-picker--disabled .spw-date-picker__clear{border-color:var(--spw-color-themes-grey-grey-500)}.spw-date-picker__icon{color:var(--spw-input-icon-search-color)}.spw-date-picker--disabled .spw-date-picker__icon{color:var(--spw-color-themes-grey-grey-500)}.spw-date-picker__icon--calendar{font-size:16px;cursor:pointer;color:var(--spw-color-text-secondary, #6b7280)}.spw-date-picker__icon--clear{color:var(--spw-color-themes-grey-grey-900);font-size:12px}.spw-date-picker__help{margin-top:0.25rem;font-size:0.75rem;line-height:1rem;color:var(--spw-color-text-secondary, #6b7280)}.spw-date-picker__error{display:flex;align-items:center;margin-top:0.25rem;font-size:0.75rem;line-height:1rem;color:var(--spw-color-error, #dc2626)}.spw-date-picker__error spw-icon{margin-right:0.25rem;font-size:0.75rem}.qs-datepicker-container{box-shadow:var(--spw-effect-elevation-6);border:none;width:320px;margin-top:6px}.qs-datepicker-container .qs-controls{padding:24px;padding-bottom:0;background:none;margin-bottom:16px;position:relative}.qs-datepicker-container .qs-month-year{font-size:14px;border:1px solid var(--spw-colors-support-grey-grey-300);border-radius:6px;padding:8px 16px}.qs-datepicker-container .qs-month-year:hover{border-color:var(--spw-colors-support-grey-grey-800)}.qs-datepicker-container .qs-arrow{position:absolute;top:24px;width:36px;height:36px;color:transparent}.qs-datepicker-container .qs-arrow:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-family:var(--spw-ds-font-icons-solid);font-weight:700;font-size:16px;display:inline-flex;justify-content:center;align-items:center;color:var(--spw-colors-support-grey-grey-800)}.qs-datepicker-container .qs-arrow:after{display:none}.qs-datepicker-container .qs-arrow:hover{background:var(--spw-colors-support-grey-grey-200)}.qs-datepicker-container .qs-arrow:active{background:var(--spw-colors-support-grey-grey-300)}.qs-datepicker-container .qs-left{right:60px}.qs-datepicker-container .qs-left:before{content:"\\f053"}.qs-datepicker-container .qs-right{right:24px}.qs-datepicker-container .qs-right:before{content:"\\f054"}.qs-datepicker-container .qs-squares{padding:24px;padding-top:0;gap:4px 0}.qs-datepicker-container .qs-square{font-size:14px;text-transform:lowercase;height:36px}.qs-datepicker-container .qs-square:not(.qs-empty):not(.qs-disabled):not(.qs-day):not(.qs-active):hover{background:var(--spw-colors-support-grey-grey-400)}.qs-datepicker-container .qs-range-end:hover,.qs-datepicker-container .qr-range-start:hover{background:var(--spw-colors-support-grey-grey-800)}.qs-datepicker-container .qs-active,.qs-datepicker-container .qs-range-end,.qs-datepicker-container .qs-range-start,.qs-datepicker-container .qs-range-start.qs-disabled{background:var(--spw-colors-support-grey-grey-900);color:white;opacity:1}.qs-datepicker-container .qs-range-middle{background:var(--spw-colors-support-grey-grey-300)}.qs-datepicker-container .spw-date-range-start{background:var(--spw-colors-support-grey-grey-900) !important;color:white !important;opacity:1 !important;font-weight:700;border-radius:4px 0 0 4px !important}.qs-datepicker-container .spw-date-range-start:hover{background:var(--spw-colors-support-grey-grey-800) !important}.qs-datepicker-container .spw-date-range-end{background:var(--spw-colors-support-grey-grey-900) !important;color:white !important;opacity:1 !important;font-weight:700;border-radius:0 4px 4px 0 !important}.qs-datepicker-container .spw-date-range-end:hover{background:var(--spw-colors-support-grey-grey-800) !important}.qs-datepicker-container .spw-date-range-middle{background:var(--spw-colors-support-grey-grey-300) !important;border-radius:0 !important}.qs-datepicker-container .spw-date-range-middle:hover{background:var(--spw-colors-support-grey-grey-400) !important}.qs-datepicker-container .qs-day{font-weight:400;color:var(--spw-colors-support-grey-grey-800);padding-bottom:12px;border-radius:0;position:relative}.qs-datepicker-container .qs-day:after{content:"";position:absolute;bottom:0;left:0;width:68px;height:1px;background:var(--spw-colors-support-grey-grey-300)}.qs-datepicker-container .qs-day:nth-child(7):after{display:none}.qs-datepicker-container .qs-overlay{padding:24px;background:#fff}.qs-datepicker-container .qs-overlay-month{font-size:14px;color:var(--spw-colors-support-grey-grey-800);width:25%}.qs-datepicker-container .qs-close{color:var(--spw-colors-support-grey-grey-600);top:24px;left:24px;right:auto;padding:0;height:40px;width:32px;text-indent:-9999px;transition:all ease-in 0.2s}.qs-datepicker-container .qs-close:after{position:absolute;top:50%;transform:translateY(-50%);left:0;font-family:var(--spw-ds-font-icons-solid);font-weight:700;content:"\\f060";font-size:14px;text-indent:0}.qs-datepicker-container .qs-close:hover{color:var(--spw-colors-support-grey-grey-900)}.qs-datepicker-container .qs-blur{filter:none}.qs-datepicker-container .qs-overlay{transition:none}.qs-datepicker-container .qs-overlay .qs-overlay-year{color:var(--spw-colors-support-grey-grey-900);margin-bottom:24px;width:calc(100% - 80px);margin-left:28px}.qs-datepicker-container .qs-submit{position:absolute;text-indent:-9999px;top:24px;right:24px;width:40px;height:40px;border-radius:9999px;border:2px solid transparent;color:white;background:var(--spw-ds-primary);font-weight:700;font-size:14px;transition:all ease-in 0.2s}.qs-datepicker-container .qs-submit:after{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-family:var(--spw-ds-font-icons-solid);font-weight:700;content:"\\f00c";font-size:14px;text-indent:0}.qs-datepicker-container .qs-submit:hover{background:var(--spw-ds-variant)}.qs-datepicker-container .qs-submit:active{background:var(--spw-ds-active)}.qs-datepicker-container .qs-submit.qs-disabled{background:var(--spw-colors-support-grey-grey-400);border-color:var(--spw-colors-support-grey-grey-400);color:var(--spw-colors-support-grey-grey-500);opacity:1}`;
+const spwDatePickerCss = () => `@charset "UTF-8";.qs-datepicker-container{font-size:1rem;font-family:sans-serif;color:#000;position:absolute;width:15.625em;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;z-index:9001;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid grey;border-radius:.263921875em;overflow:hidden;background:#fff;-webkit-box-shadow:0 1.25em 1.25em -.9375em rgba(0,0,0,.3);box-shadow:0 1.25em 1.25em -.9375em rgba(0,0,0,.3)}.qs-datepicker-container *{-webkit-box-sizing:border-box;box-sizing:border-box}.qs-centered{position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.qs-hidden{display:none}.qs-overlay{position:absolute;top:0;left:0;background:rgba(0,0,0,.75);color:#fff;width:100%;height:100%;padding:.5em;z-index:1;opacity:1;-webkit-transition:opacity .3s;transition:opacity .3s;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.qs-overlay.qs-hidden{opacity:0;z-index:-1}.qs-overlay .qs-overlay-year{background:rgba(0,0,0,0);border:none;border-bottom:1px solid #fff;border-radius:0;color:#fff;font-size:.875em;padding:.25em 0;width:80%;text-align:center;margin:0 auto;display:block}.qs-overlay .qs-overlay-year::-webkit-inner-spin-button{-webkit-appearance:none}.qs-overlay .qs-close{padding:.5em;cursor:pointer;position:absolute;top:0;right:0}.qs-overlay .qs-submit{border:1px solid #fff;border-radius:.263921875em;padding:.5em;margin:0 auto auto;cursor:pointer;background:hsla(0,0%,50.2%,.4)}.qs-overlay .qs-submit.qs-disabled{color:grey;border-color:grey;cursor:not-allowed}.qs-overlay .qs-overlay-month-container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.qs-overlay .qs-overlay-month{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:calc(100% / 3);cursor:pointer;opacity:.5;-webkit-transition:opacity .15s;transition:opacity .15s}.qs-overlay .qs-overlay-month.active,.qs-overlay .qs-overlay-month:hover{opacity:1}.qs-controls{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0;background:#d3d3d3;-webkit-filter:blur(0);filter:blur(0);-webkit-transition:-webkit-filter .3s;transition:-webkit-filter .3s;transition:filter .3s;transition:filter .3s, -webkit-filter .3s}.qs-controls.qs-blur{-webkit-filter:blur(5px);filter:blur(5px)}.qs-arrow{height:1.5625em;width:1.5625em;position:relative;cursor:pointer;border-radius:.263921875em;-webkit-transition:background .15s;transition:background .15s}.qs-arrow:hover.qs-left:after{border-right-color:#000}.qs-arrow:hover.qs-right:after{border-left-color:#000}.qs-arrow:hover{background:rgba(0,0,0,.1)}.qs-arrow:after{content:"";border:.390625em solid rgba(0,0,0,0);position:absolute;top:50%;-webkit-transition:border .2s;transition:border .2s}.qs-arrow.qs-left:after{border-right-color:grey;right:50%;-webkit-transform:translate(25%,-50%);-ms-transform:translate(25%,-50%);transform:translate(25%,-50%)}.qs-arrow.qs-right:after{border-left-color:grey;left:50%;-webkit-transform:translate(-25%,-50%);-ms-transform:translate(-25%,-50%);transform:translate(-25%,-50%)}.qs-month-year{font-weight:700;-webkit-transition:border .2s;transition:border .2s;border-bottom:1px solid rgba(0,0,0,0)}.qs-month-year:not(.qs-disabled-year-overlay){cursor:pointer}.qs-month-year:not(.qs-disabled-year-overlay):hover{border-bottom:1px solid grey}.qs-month-year:active:focus,.qs-month-year:focus{outline:none}.qs-month{padding-right:.5ex}.qs-year{padding-left:.5ex}.qs-squares{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:.3125em;-webkit-filter:blur(0);filter:blur(0);-webkit-transition:-webkit-filter .3s;transition:-webkit-filter .3s;transition:filter .3s;transition:filter .3s, -webkit-filter .3s}.qs-squares.qs-blur{-webkit-filter:blur(5px);filter:blur(5px)}.qs-square{width:calc(100% / 7);height:1.5625em;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;-webkit-transition:background .1s;transition:background .1s;border-radius:.263921875em}.qs-square:not(.qs-empty):not(.qs-disabled):not(.qs-day):not(.qs-active):hover{background:orange}.qs-current{font-weight:700;text-decoration:underline}.qs-active,.qs-range-end,.qs-range-start{background:#add8e6}.qs-range-start:not(.qs-range-6){border-top-right-radius:0;border-bottom-right-radius:0}.qs-range-middle{background:#d4ebf2}.qs-range-middle:not(.qs-range-0):not(.qs-range-6){border-radius:0}.qs-range-middle.qs-range-0{border-top-right-radius:0;border-bottom-right-radius:0}.qs-range-end:not(.qs-range-0),.qs-range-middle.qs-range-6{border-top-left-radius:0;border-bottom-left-radius:0}.qs-disabled,.qs-outside-current-month{opacity:.2}.qs-disabled{cursor:not-allowed}.qs-day,.qs-empty{cursor:default}.qs-day{font-weight:700;color:grey}.qs-event{position:relative}.qs-event:after{content:"";position:absolute;width:.46875em;height:.46875em;border-radius:50%;background:#07f;bottom:0;right:0}html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block;font-family:inherit;--spw-input-height:40px;--spw-input-padding:0 12px;--spw-input-text-align:left;--spw-input-font-size:16px;--spw-input-radius:4px;--spw-input-icon-search-color:var(--spw-color-themes-grey-grey-900);--spw-input-border:var(--spw-color-themes-grey-grey-800)}.qs-datepicker-container .qs-overlay .qs-overlay-year,.spw-date-picker__input{flex:1;width:100%;height:var(--spw-input-height);padding:var(--spw-input-padding);text-overflow:ellipsis;line-height:var(--spw-input-height);border-radius:var(--spw-input-radius);font-size:var(--spw-input-font-size);text-align:var(--spw-input-text-align);border:1px solid var(--spw-input-border)}.qs-datepicker-container .qs-overlay .qs-overlay-year:hover,.spw-date-picker__input:hover{outline:4px solid var(--spw-color-themes-grey-grey-300)}.qs-datepicker-container .qs-overlay .qs-overlay-year:focus,.spw-date-picker__input:focus,.qs-datepicker-container .qs-overlay .qs-overlay-year:focus-visible,.spw-date-picker__input:focus-visible{outline:3px solid white;outline-offset:0;box-shadow:0 0 0 6px black}.qs-datepicker-container .qs-overlay .qs-overlay-year:active,.spw-date-picker__input:active{border-color:var(--spw-input-border)}.spw-date-picker{position:relative}.spw-date-picker__field-message{margin-bottom:8px;margin-top:-4px}.spw-date-picker__input-container{position:relative;display:flex;align-items:center}.spw-date-picker--is-clear .spw-date-picker__input{padding-right:70px}.spw-date-picker__input--error{border-color:var(--spw-color-error, #dc2626)}.spw-date-picker__input--error:focus{border-color:var(--spw-color-error, #dc2626);box-shadow:0 0 0 3px var(--spw-color-error-light, rgba(220, 38, 38, 0.1))}.spw-date-picker__input--disabled{border-color:var(--spw-color-themes-grey-grey-400);background:var(--spw-color-themes-grey-grey-100);color:var(--spw-color-themes-grey-grey-500);cursor:not-allowed}.spw-date-picker__input--disabled::placeholder{color:var(--spw-color-themes-grey-grey-500)}.spw-date-picker__input--disabled:hover,.spw-date-picker__input--disabled:focus,.spw-date-picker__input--disabled:focus-visible{outline:none}.spw-date-picker__input--open{outline:3px solid white;outline-offset:0;box-shadow:0 0 0 6px black}.spw-date-picker__input::placeholder{color:var(--spw-color-text-placeholder, #9ca3af)}.spw-date-picker__icons{display:flex;align-items:center;position:absolute;top:50%;right:12px;gap:8px;transform:translateY(-50%)}.spw-date-picker--disabled .spw-date-picker__icons{pointer-events:none}.spw-date-picker__clear{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;cursor:pointer;padding:2px;border:2px var(--spw-color-themes-grey-grey-900) solid;border-radius:50%;font-size:12px;transition:all 0.2s ease-in}.spw-date-picker__clear:hover{background:var(--spw-color-themes-grey-grey-300)}.spw-date-picker--disabled .spw-date-picker__clear{border-color:var(--spw-color-themes-grey-grey-500)}.spw-date-picker__icon{color:var(--spw-input-icon-search-color)}.spw-date-picker--disabled .spw-date-picker__icon{color:var(--spw-color-themes-grey-grey-500)}.spw-date-picker__icon--calendar{font-size:16px;cursor:pointer;color:var(--spw-color-text-secondary, #6b7280)}.spw-date-picker__icon--clear{color:var(--spw-color-themes-grey-grey-900);font-size:12px}.spw-date-picker__help{margin-top:0.25rem;font-size:0.75rem;line-height:1rem;color:var(--spw-color-text-secondary, #6b7280)}.spw-date-picker__error{display:flex;align-items:center;margin-top:0.25rem;font-size:0.75rem;line-height:1rem;color:var(--spw-color-error, #dc2626)}.spw-date-picker__error spw-icon{margin-right:0.25rem;font-size:0.75rem}.qs-datepicker-container{box-shadow:var(--spw-effect-elevation-6);border:none;width:320px;margin-top:6px}.qs-datepicker-container .qs-controls{padding:24px;padding-bottom:0;background:none;margin-bottom:16px;position:relative}.qs-datepicker-container .qs-month-year{font-size:14px;border:1px solid var(--spw-colors-support-grey-grey-300);border-radius:6px;padding:8px 16px}.qs-datepicker-container .qs-month-year:hover{border-color:var(--spw-colors-support-grey-grey-800)}.qs-datepicker-container .qs-arrow{position:absolute;top:24px;width:36px;height:36px;color:transparent}.qs-datepicker-container .qs-arrow:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-family:var(--spw-ds-font-icons-solid);font-weight:700;font-size:16px;display:inline-flex;justify-content:center;align-items:center;color:var(--spw-colors-support-grey-grey-800)}.qs-datepicker-container .qs-arrow:after{display:none}.qs-datepicker-container .qs-arrow:hover{background:var(--spw-colors-support-grey-grey-200)}.qs-datepicker-container .qs-arrow:active{background:var(--spw-colors-support-grey-grey-300)}.qs-datepicker-container .qs-left{right:60px}.qs-datepicker-container .qs-left:before{content:"\\f053"}.qs-datepicker-container .qs-right{right:24px}.qs-datepicker-container .qs-right:before{content:"\\f054"}.qs-datepicker-container .qs-squares{padding:24px;padding-top:0;gap:4px 0}.qs-datepicker-container .qs-square{font-size:14px;text-transform:lowercase;height:36px}.qs-datepicker-container .qs-square:not(.qs-empty):not(.qs-disabled):not(.qs-day):not(.qs-active):hover{background:var(--spw-colors-support-grey-grey-400)}.qs-datepicker-container .qs-range-end:hover,.qs-datepicker-container .qr-range-start:hover{background:var(--spw-colors-support-grey-grey-800)}.qs-datepicker-container .qs-active,.qs-datepicker-container .qs-range-end,.qs-datepicker-container .qs-range-start,.qs-datepicker-container .qs-range-start.qs-disabled{background:var(--spw-colors-support-grey-grey-900);color:white;opacity:1}.qs-datepicker-container .qs-range-middle{background:var(--spw-colors-support-grey-grey-300)}.qs-datepicker-container .spw-date-range-start{background:var(--spw-colors-support-grey-grey-900) !important;color:white !important;opacity:1 !important;font-weight:700;border-radius:4px 0 0 4px !important}.qs-datepicker-container .spw-date-range-start:hover{background:var(--spw-colors-support-grey-grey-800) !important}.qs-datepicker-container .spw-date-range-end{background:var(--spw-colors-support-grey-grey-900) !important;color:white !important;opacity:1 !important;font-weight:700;border-radius:0 4px 4px 0 !important}.qs-datepicker-container .spw-date-range-end:hover{background:var(--spw-colors-support-grey-grey-800) !important}.qs-datepicker-container .spw-date-range-middle{background:var(--spw-colors-support-grey-grey-300) !important;border-radius:0 !important}.qs-datepicker-container .spw-date-range-middle:hover{background:var(--spw-colors-support-grey-grey-400) !important}.qs-datepicker-container .qs-day{font-weight:400;color:var(--spw-colors-support-grey-grey-800);padding-bottom:12px;border-radius:0;position:relative}.qs-datepicker-container .qs-day:after{content:"";position:absolute;bottom:0;left:0;width:68px;height:1px;background:var(--spw-colors-support-grey-grey-300)}.qs-datepicker-container .qs-day:nth-child(7):after{display:none}.qs-datepicker-container .qs-overlay{padding:24px;background:#fff}.qs-datepicker-container .qs-overlay-month{font-size:14px;color:var(--spw-colors-support-grey-grey-800);width:25%}.qs-datepicker-container .qs-close{color:var(--spw-colors-support-grey-grey-600);top:24px;left:24px;right:auto;padding:0;height:40px;width:32px;text-indent:-9999px;transition:all ease-in 0.2s}.qs-datepicker-container .qs-close:after{position:absolute;top:50%;transform:translateY(-50%);left:0;font-family:var(--spw-ds-font-icons-solid);font-weight:700;content:"\\f060";font-size:14px;text-indent:0}.qs-datepicker-container .qs-close:hover{color:var(--spw-colors-support-grey-grey-900)}.qs-datepicker-container .qs-blur{filter:none}.qs-datepicker-container .qs-overlay{transition:none}.qs-datepicker-container .qs-overlay .qs-overlay-year{color:var(--spw-colors-support-grey-grey-900);margin-bottom:24px;width:calc(100% - 80px);margin-left:28px}.qs-datepicker-container .qs-submit{position:absolute;text-indent:-9999px;top:24px;right:24px;width:40px;height:40px;border-radius:9999px;border:2px solid transparent;color:white;background:var(--spw-ds-primary);font-weight:700;font-size:14px;transition:all ease-in 0.2s}.qs-datepicker-container .qs-submit:after{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-family:var(--spw-ds-font-icons-solid);font-weight:700;content:"\\f00c";font-size:14px;text-indent:0}.qs-datepicker-container .qs-submit:hover{background:var(--spw-ds-variant)}.qs-datepicker-container .qs-submit:active{background:var(--spw-ds-active)}.qs-datepicker-container .qs-submit.qs-disabled{background:var(--spw-colors-support-grey-grey-400);border-color:var(--spw-colors-support-grey-grey-400);color:var(--spw-colors-support-grey-grey-500);opacity:1}`;
 const SpwDatePicker = class {
     constructor(hostRef) {
@@ -74,12 +74,47 @@ const SpwDatePicker = class {
         this.range = false;
         /** Permet de définir l'input de début pour un range */
         this.isStart = false;
+        /** Utilise un positionnement fixed pour le calendrier si nécessité de sortir du contexte (utile dans une modal avec overflow hidden) */
+        this.fixedCalendar = false;
         this.isOpen = false;
         this.hasError = false;
         this.internalValue = '';
         this.isClearIconVisible = false;
         this.lastInputValue = '';
         this.isDeleting = false;
+        this.parentScrollContainer = null;
+        this.updateCalendarPosition = () => {
+            var _a;
+            if (!this.fixedCalendar || !((_a = this.datepickerInstance) === null || _a === void 0 ? void 0 : _a.calendarContainer) || !this.inputElement)
+                return;
+            const inputRect = this.inputElement.getBoundingClientRect();
+            const calendarEl = this.datepickerInstance.calendarContainer;
+            const calendarHeight = calendarEl.offsetHeight || 320;
+            const viewportHeight = window.innerHeight;
+            // Déterminer si on ouvre vers le haut ou le bas
+            const spaceBelow = viewportHeight - inputRect.bottom;
+            const spaceAbove = inputRect.top;
+            const openAbove = spaceBelow < calendarHeight && spaceAbove > spaceBelow;
+            let top;
+            if (openAbove) {
+                top = inputRect.top - calendarHeight - 6;
+            }
+            else {
+                top = inputRect.bottom + 6;
+            }
+            // Positionner horizontalement selon la prop position
+            let left;
+            if (this.position === 'tr' || this.position === 'br') {
+                left = inputRect.right - calendarEl.offsetWidth;
+            }
+            else {
+                left = inputRect.left;
+            }
+            calendarEl.style.position = 'fixed';
+            calendarEl.style.top = `${top}px`;
+            calendarEl.style.left = `${left}px`;
+            calendarEl.style.zIndex = '9999';
+        };
         this.handleMaskedInput = (event) => {
             const target = event.target;
             const newValue = target.value;
@@ -279,13 +314,6 @@ const SpwDatePicker = class {
         this.defaultValue = this.value;
         this.isClearIconVisible = this.isClear && !!this.value;
     }
-    connectedCallback() {
-        if (!this.datepickerInstance && this.inputElement) {
-            requestAnimationFrame(() => {
-                this.initializeDatepicker();
-            });
-        }
-    }
     componentDidLoad() {
         var _a;
         this.initializeDatepicker();
@@ -301,6 +329,17 @@ const SpwDatePicker = class {
         }
         this.internals.setFormValue(this.value ? this.value : null);
     }
+    connectedCallback() {
+        if (!this.datepickerInstance && this.inputElement) {
+            requestAnimationFrame(() => {
+                this.initializeDatepicker();
+            });
+        }
+        if (this.fixedCalendar) {
+            window.addEventListener('scroll', this.updateCalendarPosition, true);
+            window.addEventListener('resize', this.updateCalendarPosition);
+        }
+    }
     disconnectedCallback() {
         if (this.datepickerInstance && typeof this.datepickerInstance.remove === 'function') {
             setTimeout(() => {
@@ -310,6 +349,79 @@ const SpwDatePicker = class {
                 }
             }, 100);
         }
+        if (this.fixedCalendar) {
+            window.removeEventListener('scroll', this.updateCalendarPosition, true);
+            window.removeEventListener('resize', this.updateCalendarPosition);
+            this.cleanupParentScrollListener();
+        }
+    }
+    findParentComponent() {
+        if (!this.fixedCalendarParent)
+            return null;
+        let current = this.el;
+        while (current) {
+            if (current instanceof HTMLElement && current.tagName.toLowerCase() === this.fixedCalendarParent.toLowerCase()) {
+                return current;
+            }
+            if (current.parentElement) {
+                current = current.parentElement;
+            }
+            else {
+                const rootNode = current.getRootNode();
+                if (rootNode instanceof ShadowRoot) {
+                    current = rootNode.host;
+                }
+                else {
+                    break;
+                }
+            }
+        }
+        return null;
+    }
+    findScrollContainerInShadowRoot(parent) {
+        const shadowRoot = parent.shadowRoot;
+        if (!shadowRoot)
+            return null;
+        const elements = shadowRoot.querySelectorAll('*');
+        let deepestScrollContainer = null;
+        let maxDepth = -1;
+        for (const el of Array.from(elements)) {
+            const htmlEl = el;
+            const style = window.getComputedStyle(htmlEl);
+            const hasOverflow = style.overflow === 'auto' || style.overflow === 'scroll' || style.overflowY === 'auto' || style.overflowY === 'scroll';
+            if (hasOverflow) {
+                let depth = 0;
+                let node = el;
+                while (node && node !== shadowRoot) {
+                    depth++;
+                    node = node.parentNode;
+                }
+                if (depth > maxDepth) {
+                    maxDepth = depth;
+                    deepestScrollContainer = htmlEl;
+                }
+            }
+        }
+        return deepestScrollContainer;
+    }
+    ensureParentScrollListener() {
+        if (!this.fixedCalendarParent || !this.fixedCalendar)
+            return;
+        if (this.parentScrollContainer)
+            return;
+        const parentComponent = this.findParentComponent();
+        if (parentComponent) {
+            this.parentScrollContainer = this.findScrollContainerInShadowRoot(parentComponent);
+            if (this.parentScrollContainer) {
+                this.parentScrollContainer.addEventListener('scroll', this.updateCalendarPosition);
+            }
+        }
+    }
+    cleanupParentScrollListener() {
+        if (this.parentScrollContainer) {
+            this.parentScrollContainer.removeEventListener('scroll', this.updateCalendarPosition);
+            this.parentScrollContainer = null;
+        }
     }
     watchValue(newValue) {
         if (this.datepickerInstance && newValue) {
@@ -710,6 +822,12 @@ const SpwDatePicker = class {
             onShow: () => {
                 this.isOpen = true;
                 this.datePickerOpen.emit();
+                if (this.fixedCalendar) {
+                    this.ensureParentScrollListener();
+                    requestAnimationFrame(() => {
+                        this.updateCalendarPosition();
+                    });
+                }
                 setTimeout(() => {
                     this.setupCalendarNavigation();
                     this.highlightRangeInCalendar();
@@ -822,7 +940,7 @@ const SpwDatePicker = class {
             'spw-date-picker--is-clear': this.isClearIconVisible,
         };
         const errorMessage = this.error || this.internalError;
-        return (index.h(index.Host, { key: '70bc9908337a34fce7a364e15343231c7cddfb3e' }, index.h("div", { key: '22eebe0dd218243c5b64e07039816788c5fe4366', class: containerClass }, this.label && (index.h("spw-field-label", { key: 'b05bbd092cc3e170f5d4111b9cb9fc5791066109', label: this.label, required: this.required, tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, tooltipMaxWidth: this.tooltipMaxWidth, tooltipDirection: this.tooltipDirection, tooltipCursor: this.tooltipCursor })), this.assistiveText && (index.h("spw-field-message", { key: 'a3a9cb74cb09f307472a7a41beb8937d095a3477', class: "spw-date-picker__field-message", variant: "hint", showIcon: false }, this.assistiveText)), index.h("div", { key: 'b31e2486767d521c3a9b6d1b7462af85fdbd2e60', class: "spw-date-picker__input-container" }, index.h("input", { key: '7f5c7a4168768a6828f198973d180e1f6600532a', ref: el => (this.inputElement = el), id: this.uniqueId, type: "text", class: inputClass, value: this.internalValue, placeholder: this.placeholder, disabled: this.disabled, required: this.required, onFocus: this.handleInputFocus, onInput: this.handleInputChange, onKeyDown: this.handleKeyDown, "aria-label": this.accAriaLabel || this.label || this.name, "aria-describedby": this.assistiveText || errorMessage ? `${this.uniqueId}-help ${this.uniqueId}-error` : undefined, "aria-invalid": this.hasError }), index.h("div", { key: '863780d4d9a6b3f07e17977125237809166d835f', class: "spw-date-picker__icons" }, this.isClearIconVisible && (index.h("span", { key: 'c25cd0e5a75ef062ef50b2db3dfa33e40c075f9b', class: "spw-date-picker__clear", onClick: this.handleClear }, index.h("spw-icon", { key: '4761fbc6c02cc8200c90882a8dd556dae77d9313', class: "spw-date-picker__icon spw-date-picker__icon--clear", icon: "fa-xmark" }))), index.h("span", { key: 'b35d76a9ca1b914b0bec648692e7939dc1ab4cb9', class: "spw-date-picker__calendar-trigger", onMouseDown: this.handleCalendarIconMouseDown, onClick: this.handleCalendarIconClick }, index.h("spw-icon", { key: 'b28190ea0b55dcf994fd023f6c7c6c003710dea9', icon: "fa-calendar", class: "spw-date-picker__icon spw-date-picker__icon--calendar" })))), this.error && (index.h("spw-field-message", { key: '2fb10c2981460f879c7d66fd6fb0439c38d7929c', variant: "error", showIcon: this.showErrorIcon }, this.error)), this.hint && (index.h("spw-field-message", { key: '8d1d51c87b3fc336de054c8bfe5780b0fefb31e8', variant: "hint", showIcon: this.showHintIcon }, this.hint)), this.success && (index.h("spw-field-message", { key: '2f73dff0acc8048983c6e55ce239e575e91a9440', variant: "success", showIcon: this.showSuccessIcon }, this.success)), this.warning && (index.h("spw-field-message", { key: 'f4a9746012910672908fcb188fd0fe4ed69ef352', variant: "warning", showIcon: this.showWarningIcon }, this.warning)))));
+        return (index.h(index.Host, { key: '0166db15ed91f3a679b201ed8cd170efb087526b' }, index.h("div", { key: 'eb2f7bfbc6dca0217a1b2f8b6208e5a9ebd89b12', class: containerClass }, this.label && (index.h("spw-field-label", { key: '36f9ee171649fe3ce83554b51c05d6b968839faf', label: this.label, required: this.required, tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, tooltipMaxWidth: this.tooltipMaxWidth, tooltipDirection: this.tooltipDirection, tooltipCursor: this.tooltipCursor })), this.assistiveText && (index.h("spw-field-message", { key: '9e3c3fa46e2d953ce4f4746554e73bbc39f79df1', class: "spw-date-picker__field-message", variant: "hint", showIcon: false }, this.assistiveText)), index.h("div", { key: 'c8258b0a85f4f9137d3ea1c7fd3887afac6cbb3f', class: "spw-date-picker__input-container" }, index.h("input", { key: 'a18d797519d70a5c6ba8d14167462a5cd24b5a23', ref: el => (this.inputElement = el), id: this.uniqueId, type: "text", class: inputClass, value: this.internalValue, placeholder: this.placeholder, disabled: this.disabled, required: this.required, onFocus: this.handleInputFocus, onInput: this.handleInputChange, onKeyDown: this.handleKeyDown, "aria-label": this.accAriaLabel || this.label || this.name, "aria-describedby": this.assistiveText || errorMessage ? `${this.uniqueId}-help ${this.uniqueId}-error` : undefined, "aria-invalid": this.hasError }), index.h("div", { key: '5413c1530c9de454e63b483d8030f2d779645816', class: "spw-date-picker__icons" }, this.isClearIconVisible && (index.h("span", { key: '70abf2032f4191e1bbe27d2ca9b3b5ccfadea4c1', class: "spw-date-picker__clear", onClick: this.handleClear }, index.h("spw-icon", { key: '1e12acf218589748f95a743e826a754b04f4b4cc', class: "spw-date-picker__icon spw-date-picker__icon--clear", icon: "fa-xmark" }))), index.h("span", { key: '1ce34e9fcdbf5cf823e57d73abf96f510f4e97d3', class: "spw-date-picker__calendar-trigger", onMouseDown: this.handleCalendarIconMouseDown, onClick: this.handleCalendarIconClick }, index.h("spw-icon", { key: '0e4a84c25a2e4c407f8c5ce37dfff3686acad60e', icon: "fa-calendar", class: "spw-date-picker__icon spw-date-picker__icon--calendar" })))), this.error && (index.h("spw-field-message", { key: '196f3d4c2931c329002e1fb342dfb30395dd4fe9', variant: "error", showIcon: this.showErrorIcon }, this.error)), this.hint && (index.h("spw-field-message", { key: '2f1451d32f226cc9dddc68940e8c527aa6da28dd', variant: "hint", showIcon: this.showHintIcon }, this.hint)), this.success && (index.h("spw-field-message", { key: 'bfb08cdd69d1b95ba095a6947533ab99b9b087a4', variant: "success", showIcon: this.showSuccessIcon }, this.success)), this.warning && (index.h("spw-field-message", { key: '9595c15d7a17ecfb1f3e22a20fab37b0b50f2af4', variant: "warning", showIcon: this.showWarningIcon }, this.warning)))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/spw-dropdown-container.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CGg8f9_X.js');
+var index = require('./index-DvyqwgdS.js');
 const spwDropdownContainerCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-dropdown-container{padding:16px}`;

package/dist/cjs/spw-dropdown-item.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CGg8f9_X.js');
+var index = require('./index-DvyqwgdS.js');
 const spwDropdownItemCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-dropdown-item{cursor:pointer;position:relative;display:flex;align-items:center;gap:8px;padding:8px 12px;color:var(--spw-colors-support-grey-grey-900);text-decoration:none;transition:background-color 0.2s ease;font-size:14px;border-radius:4px}.spw-dropdown-item:hover{background-color:var(--spw-colors-support-grey-grey-200)}.spw-dropdown-item--disabled{cursor:not-allowed;opacity:0.5;pointer-events:none}.spw-dropdown-item--has-sub-items{padding-right:32px}.spw-dropdown-item--sub-items-open{background-color:var(--spw-colors-support-grey-grey-100)}.spw-dropdown-item__icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;font-size:14px;color:var(--spw-colors-support-grey-grey-700)}.spw-dropdown-item__content{flex:1;display:flex;align-items:center;justify-content:space-between;position:relative}.spw-dropdown-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spw-dropdown-item__toggle{position:absolute;right:-24px;top:50%;transform:translateY(-50%);width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;transition:background-color 0.2s ease, transform 0.2s ease}.spw-dropdown-item__toggle:hover{background-color:var(--spw-colors-support-grey-grey-300)}.spw-dropdown-item__toggle spw-icon{font-size:12px;color:var(--spw-colors-support-grey-grey-900);transition:transform 0.2s ease}.spw-dropdown-item__toggle--open spw-icon{transform:rotate(180deg)}.spw-dropdown-item__sub-items{padding-left:16px;margin-top:4px}.spw-dropdown-item__sub-items spw-dropdown-item{font-size:13px}`;

package/dist/cjs/spw-dropdown.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-CGg8f9_X.js');
+var index = require('./index-DvyqwgdS.js');
 const spwDropdownCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:inline-block;line-height:1}:host([open]){--spw-dropdown-icon-color:var(--spw-color-themes-grey-grey-900)}.spw-dropdown__trigger{cursor:pointer}.spw-dropdown__trigger:hover{--spw-dropdown-icon-color:var(--spw-color-themes-grey-grey-900)}.spw-dropdown__trigger ::slotted(spw-icon){color:var(--spw-dropdown-icon-color, inherit)}`;