wcs-core 7.2.2 → 7.4.0

package/dist/wcs/p-fb2751c2.js.map

@@ -1 +1 @@
-{"version":3,"names":["isElementFocused","element","document","activeElement","wcsFocusableElements","isWcsFocusableElement","includes","tagName","toLowerCase","isFocusable","parseInt","getAttribute","disabled","boundingRect","getBoundingClientRect","bottom","top","left","right","height","width","x","y","style","display","visibility","opacity","nodeName","href","rel","type"],"sources":["src/utils/accessibility.ts"],"sourcesContent":["export function isElementFocused(element: HTMLElement) {\n    return element === document.activeElement;\n}\n\nexport const wcsFocusableElements = [\n    'wcs-select',\n    'wcs-select-option',\n    'wcs-dropdown',\n    'wcs-dropdown-item',\n    'wcs-nav-item',\n    'wcs-button',\n    'wcs-input',\n    'wcs-textarea',\n    'wcs-checkbox',\n    'wcs-radio',\n    'wcs-switch',\n    'wcs-tab',\n    'wcs-counter',\n];\n\n/**\n * Returns true if the provided element is part of the wcsFocusableElements list\n */\nexport function isWcsFocusableElement(element: any): boolean {\n    return wcsFocusableElements.includes(element.tagName.toLowerCase());\n}\n\nexport function isFocusable(element: any) {\n    if (parseInt(element.getAttribute('tabindex')) < 0) {\n        return false;\n    }\n    if (element.disabled) {\n        return false;\n    }\n    const boundingRect = element.getBoundingClientRect();\n    if (\n        boundingRect.bottom === 0 &&\n        boundingRect.top === 0 &&\n        boundingRect.left === 0 &&\n        boundingRect.right === 0 &&\n        boundingRect.height === 0 &&\n        boundingRect.width === 0 &&\n        boundingRect.x === 0 &&\n        boundingRect.y === 0\n    ) {\n        return false;\n    }\n    if (\n        element.style.display === 'none' ||\n        element.style.visibility === 'hidden' ||\n        element.style.opacity === 0\n    ) {\n        return false;\n    }\n    if (element.getAttribute('role') === 'button') {\n        return true;\n    }\n\n    if (isWcsFocusableElement(element)) {\n        return true;\n    }\n\n    // To identify other native focus elements.\n    switch (element.nodeName) {\n        case 'A':\n            return !!element.href && element.rel !== 'ignore';\n        case 'INPUT':\n            return element.type !== 'hidden';\n        case 'BUTTON':\n        case 'SELECT':\n        case 'TEXTAREA':\n            return true;\n        default:\n            return false;\n    }\n}\n"],"mappings":"SAAgBA,EAAiBC,GAC7B,OAAOA,IAAYC,SAASC,aAChC,CAEO,MAAMC,EAAuB,CAChC,aACA,oBACA,eACA,oBACA,eACA,aACA,YACA,eACA,eACA,YACA,aACA,UACA,e,SAMYC,EAAsBJ,GAClC,OAAOG,EAAqBE,SAASL,EAAQM,QAAQC,cACzD,C,SAEgBC,EAAYR,GACxB,GAAIS,SAAST,EAAQU,aAAa,aAAe,EAAG,CAChD,OAAO,K,CAEX,GAAIV,EAAQW,SAAU,CAClB,OAAO,K,CAEX,MAAMC,EAAeZ,EAAQa,wBAC7B,GACID,EAAaE,SAAW,GACxBF,EAAaG,MAAQ,GACrBH,EAAaI,OAAS,GACtBJ,EAAaK,QAAU,GACvBL,EAAaM,SAAW,GACxBN,EAAaO,QAAU,GACvBP,EAAaQ,IAAM,GACnBR,EAAaS,IAAM,EACrB,CACE,OAAO,K,CAEX,GACIrB,EAAQsB,MAAMC,UAAY,QAC1BvB,EAAQsB,MAAME,aAAe,UAC7BxB,EAAQsB,MAAMG,UAAY,EAC5B,CACE,OAAO,K,CAEX,GAAIzB,EAAQU,aAAa,UAAY,SAAU,CAC3C,OAAO,I,CAGX,GAAIN,EAAsBJ,GAAU,CAChC,OAAO,I,CAIX,OAAQA,EAAQ0B,UACZ,IAAK,IACD,QAAS1B,EAAQ2B,MAAQ3B,EAAQ4B,MAAQ,SAC7C,IAAK,QACD,OAAO5B,EAAQ6B,OAAS,SAC5B,IAAK,SACL,IAAK,SACL,IAAK,WACD,OAAO,KACX,QACI,OAAO,MAEnB,Q"}
+{"version":3,"names":["isElementFocused","element","document","activeElement","wcsFocusableElements","isWcsFocusableElement","includes","tagName","toLowerCase","isFocusable","parseInt","getAttribute","disabled","boundingRect","getBoundingClientRect","bottom","top","left","right","height","width","x","y","style","display","visibility","opacity","nodeName","href","rel","type"],"sources":["src/utils/accessibility.ts"],"sourcesContent":["export function isElementFocused(element: HTMLElement): boolean {\n    return element === document.activeElement;\n}\n\nexport const wcsFocusableElements = [\n    'wcs-select',\n    'wcs-select-option',\n    'wcs-dropdown',\n    'wcs-dropdown-item',\n    'wcs-nav-item',\n    'wcs-button',\n    'wcs-input',\n    'wcs-textarea',\n    'wcs-checkbox',\n    'wcs-radio',\n    'wcs-switch',\n    'wcs-tab',\n    'wcs-counter',\n];\n\n/**\n * Returns true if the provided element is part of the wcsFocusableElements list\n */\nexport function isWcsFocusableElement(element: any): boolean {\n    return wcsFocusableElements.includes(element.tagName.toLowerCase());\n}\n\nexport function isFocusable(element: any): boolean {\n    if (parseInt(element.getAttribute('tabindex')) < 0) {\n        return false;\n    }\n    if (element.disabled) {\n        return false;\n    }\n    const boundingRect = element.getBoundingClientRect();\n    if (\n        boundingRect.bottom === 0 &&\n        boundingRect.top === 0 &&\n        boundingRect.left === 0 &&\n        boundingRect.right === 0 &&\n        boundingRect.height === 0 &&\n        boundingRect.width === 0 &&\n        boundingRect.x === 0 &&\n        boundingRect.y === 0\n    ) {\n        return false;\n    }\n    if (\n        element.style.display === 'none' ||\n        element.style.visibility === 'hidden' ||\n        element.style.opacity === 0\n    ) {\n        return false;\n    }\n    if (element.getAttribute('role') === 'button') {\n        return true;\n    }\n\n    if (isWcsFocusableElement(element)) {\n        return true;\n    }\n\n    // To identify other native focus elements.\n    switch (element.nodeName) {\n        case 'A':\n            return !!element.href && element.rel !== 'ignore';\n        case 'INPUT':\n            return element.type !== 'hidden';\n        case 'BUTTON':\n        case 'SELECT':\n        case 'TEXTAREA':\n            return true;\n        default:\n            return false;\n    }\n}\n\n/**\n * Finds the next focusable element after the given startElement.\n * It checks the next siblings of the startElement and returns the first focusable element found.\n * If no focusable element is found, it returns null.\n * @param startElement The element from which to start searching for the next focusable element.\n */\nexport function findNextFocusableElement(startElement: HTMLElement): HTMLElement | null {\n    let nextElement = startElement.nextElementSibling;\n    while (nextElement) {\n        if (isFocusable(nextElement) && nextElement instanceof HTMLElement) {\n            return nextElement;\n        }\n        nextElement = nextElement.nextElementSibling;\n    }\n    return null;\n}\n"],"mappings":"SAAgBA,EAAiBC,GAC7B,OAAOA,IAAYC,SAASC,aAChC,CAEO,MAAMC,EAAuB,CAChC,aACA,oBACA,eACA,oBACA,eACA,aACA,YACA,eACA,eACA,YACA,aACA,UACA,e,SAMYC,EAAsBJ,GAClC,OAAOG,EAAqBE,SAASL,EAAQM,QAAQC,cACzD,C,SAEgBC,EAAYR,GACxB,GAAIS,SAAST,EAAQU,aAAa,aAAe,EAAG,CAChD,OAAO,K,CAEX,GAAIV,EAAQW,SAAU,CAClB,OAAO,K,CAEX,MAAMC,EAAeZ,EAAQa,wBAC7B,GACID,EAAaE,SAAW,GACxBF,EAAaG,MAAQ,GACrBH,EAAaI,OAAS,GACtBJ,EAAaK,QAAU,GACvBL,EAAaM,SAAW,GACxBN,EAAaO,QAAU,GACvBP,EAAaQ,IAAM,GACnBR,EAAaS,IAAM,EACrB,CACE,OAAO,K,CAEX,GACIrB,EAAQsB,MAAMC,UAAY,QAC1BvB,EAAQsB,MAAME,aAAe,UAC7BxB,EAAQsB,MAAMG,UAAY,EAC5B,CACE,OAAO,K,CAEX,GAAIzB,EAAQU,aAAa,UAAY,SAAU,CAC3C,OAAO,I,CAGX,GAAIN,EAAsBJ,GAAU,CAChC,OAAO,I,CAIX,OAAQA,EAAQ0B,UACZ,IAAK,IACD,QAAS1B,EAAQ2B,MAAQ3B,EAAQ4B,MAAQ,SAC7C,IAAK,QACD,OAAO5B,EAAQ6B,OAAS,SAC5B,IAAK,SACL,IAAK,SACL,IAAK,WACD,OAAO,KACX,QACI,OAAO,MAEnB,Q"}

package/dist/wcs/p-fbd68522.entry.js

@@ -0,0 +1,2 @@
+import{h as t,r as e,c as s,H as i,g as r}from"./p-32e583ea.js";const a=({step:e,checkOnComplete:s,complete:i,passed:r,active:a,first:n,disable:l,onClick:c})=>{var d;return t("li",{role:"listitem",class:"graphic-step","data-first":n},n?null:t("wcs-progress-bar",{value:r?100:0,"aria-hidden":"true"}),t("wcs-button",{style:{backgroundColor:"white"},"aria-label":(d=e.ariaLabel)!==null&&d!==void 0?d:e.text,onClick:t=>c(e),ref:t=>{a?t.setAriaAttribute("aria-current","step"):t.setAriaAttribute("aria-current",null)},shape:"round",mode:(a||i)&&!e.disable?"plain":"stroked",disabled:l},o(e.button,s,i,a)))};const o=(e,s,i,r)=>{if(s&&i&&!r){return t("wcs-mat-icon",{size:"m",icon:"done",family:"outlined"})}switch(e.kind){case"Icon":return t("wcs-mat-icon",{size:"m",icon:e.iconName,family:e.family?e.family:"outlined"});case"Text":return e.text}};const n=":host{--wcs-horizontal-step-text-color-default:var(--wcs-semantic-color-text-secondary);--wcs-horizontal-step-text-color-active:var(--wcs-semantic-color-foreground-brand);--wcs-horizontal-step-text-color-disabled:var(--wcs-semantic-color-text-disabled);display:block}:host .steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;flex:1}:host .graphic-step{display:flex;position:relative;flex-direction:row;flex:1;align-items:center}:host .graphic-step wcs-button{z-index:1;mix-blend-mode:darken}:host .graphic-step[data-first]{flex:0}:host wcs-progress-bar{--wcs-progress-bar-border-radius:0;flex:1;margin:0 -1px}:host .label-container{justify-content:space-between;display:flex;flex-direction:row;margin-top:var(--wcs-semantic-spacing-base)}:host .label-container>*{width:100%;text-align:center;flex:1;color:var(--wcs-horizontal-step-text-color-default);font-weight:500}:host .label-container>*[data-disable]{color:var(--wcs-horizontal-step-text-color-disabled)}:host .label-container>*[data-current]{color:var(--wcs-horizontal-step-text-color-active)}:host .label-container>div[data-first]{margin-right:calc(var(--wcs-semantic-size-m, 40px) / 2);text-align:left;flex:0.5}:host .label-container>div[data-last]{margin-left:calc(var(--wcs-semantic-size-m, 40px) / 2);text-align:right;flex:0.5}";const l=n;const c=class{constructor(t){e(this,t);this.wcsHorizontalStepClick=s(this,"wcsHorizontalStepClick",7);this.currentStep=0;this.steps=undefined;this.mode="nonLinear";this.checkOnComplete=undefined;this.internalCurrentStepIndex=undefined}componentWillLoad(){this.internalCurrentStepIndex=this.currentStep;if(this.steps.length<1){throw new Error("You must add at least one step")}}onCurrentStepChange(t,e){if(this.internalCurrentStepIndex!==undefined){const s=Math.abs(e-t);this.el.style.setProperty("--wcs-progress-bar-animation-duration",350/s+"ms");if(t!==e){for(let i=0;i<s;i++){setTimeout((()=>{this.internalCurrentStepIndex-=e-t>0?1:-1;if(i===s-1){this.el.style.removeProperty("--wcs-progress-bar-animation-duration")}}),i*(375/s))}}}}async previous(){this.navigateToIndex(this.internalCurrentStepIndex-1,"backward")}async next(){this.navigateToIndex(this.internalCurrentStepIndex+1,"forward")}navigateToIndex(t,e){var s,i;if(t>=0&&t<=this.steps.length-1){if(((s=this.steps[t])===null||s===void 0?void 0:s.complete)||((i=this.steps[t])===null||i===void 0?void 0:i.disable)){this.navigateToIndex(t+(e==="forward"?1:-1),e)}else{this.currentStep=t}}}render(){return t(i,{key:"72063828a00d77fc1bc2a92de8979d096b806786"},t("ul",{key:"a5b2de6193a68b6b70b0857d1c50ed1c5c069863",role:"list",class:"steps"},this.steps.map(((e,s)=>t(a,{step:e,passed:s<=this.internalCurrentStepIndex,checkOnComplete:this.checkOnComplete,complete:this.isComplete(e,s),active:s===this.internalCurrentStepIndex,first:s===0,disable:this.isDisable(e,s),onClick:t=>this.wcsHorizontalStepClick.emit({step:t,index:s})})))),this.renderLabels())}isComplete(t,e){return e<=this.internalCurrentStepIndex||t.complete}renderLabels(){if(this.steps.map((t=>t.text)).every((t=>!t))){return null}else{return t("div",{class:"label-container","aria-hidden":"true"},this.steps.map(((e,s)=>t("div",{"data-first":s===0,"data-current":s===this.internalCurrentStepIndex&&!e.disable,"data-disable":this.isDisable(e,s),"data-last":s===this.steps.length-1},t("span",null,e.text)))))}}isDisable(t,e){return t.disable||this.mode==="linear"&&(!this.isNextPossibleStep(e)&&this.internalCurrentStepIndex<e)}isNextPossibleStep(t){var e;if(t===0)return true;if(((e=this.steps[t-1])===null||e===void 0?void 0:e.disable)||this.previousStepIsCompleteAndNotActive(t))return this.isNextPossibleStep(t-1);return this.internalCurrentStepIndex===t-1}previousStepIsCompleteAndNotActive(t){var e;return((e=this.steps[t-1])===null||e===void 0?void 0:e.complete)&&t-1!==this.internalCurrentStepIndex}get el(){return r(this)}static get watchers(){return{currentStep:["onCurrentStepChange"]}}};c.style=l;export{c as wcs_horizontal_stepper};
+//# sourceMappingURL=p-fbd68522.entry.js.map

package/dist/wcs/p-fbd68522.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["HorizontalStep","step","checkOnComplete","complete","passed","active","first","disable","onClick","h","role","class","value","style","backgroundColor","_a","ariaLabel","text","_","ref","el","setAriaAttribute","shape","mode","disabled","getButtonContent","button","stepButton","size","icon","family","kind","iconName","horizontalStepperCss","WcsHorizontalStepperStyle0","HorizontalStepper","componentWillLoad","this","internalCurrentStepIndex","currentStep","steps","length","Error","onCurrentStepChange","newValue","oldValue","undefined","stepInterval","Math","abs","setProperty","i","setTimeout","removeProperty","previous","navigateToIndex","next","index","direction","_b","render","Host","key","map","isComplete","isDisable","wcsHorizontalStepClick","emit","renderLabels","s","every","isNextPossibleStep","previousStepIsCompleteAndNotActive"],"sources":["src/components/horizontal-stepper/horizontal-step.tsx","src/components/horizontal-stepper/horizontal-stepper.scss?tag=wcs-horizontal-stepper&encapsulation=shadow","src/components/horizontal-stepper/horizontal-stepper.tsx"],"sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\nimport { HorizontalStepConfig, StepButton } from './horizontal-stepper-interface';\n\ninterface HorizontalStepProps {\n    step: HorizontalStepConfig;\n    checkOnComplete: boolean;\n    complete: boolean;\n    passed: boolean;\n    active: boolean;\n    first: boolean;\n    disable: boolean;\n    onClick: (step: HorizontalStepConfig) => void;\n}\n\nexport const HorizontalStep: FunctionalComponent<HorizontalStepProps> = (\n    {\n        step,\n        checkOnComplete,\n        complete,\n        passed,\n        active,\n        first,\n        disable,\n        onClick\n    }) => {\n    return (\n        /*\n        When using list-style: none in CSS, it removes the semantic of the list in Safari.\n        So we add role=\"list\" manually to provide semantic to screen readers\n        https://www.scottohara.me/blog/2019/01/12/lists-and-safari.html\n        https://css-tricks.com/snippets/css/remove-list-markers-without-affecting-semantics/ \n         */\n        <li role=\"listitem\" class=\"graphic-step\" data-first={first}>\n            {first ? null : (<wcs-progress-bar value={passed ? 100 : 0} aria-hidden=\"true\"></wcs-progress-bar>)}\n            <wcs-button style={{'backgroundColor': 'white'}}\n                        aria-label={step.ariaLabel ?? step.text}\n                        onClick={_ => onClick(step)}\n                        ref={(el: HTMLWcsButtonElement) => {\n                            active ? el.setAriaAttribute('aria-current', 'step') : el.setAriaAttribute('aria-current', null)\n                        }}\n                        shape=\"round\" mode={(active || complete) && !step.disable ? 'plain' : 'stroked'}\n                        disabled={disable}>\n                {getButtonContent(step.button, checkOnComplete, complete, active)}\n            </wcs-button>\n        </li>\n    );\n}\n\nconst getButtonContent = (stepButton: StepButton, checkOnComplete: boolean, complete: boolean, active: boolean) => {\n    if (checkOnComplete && complete && !active) {\n        return (<wcs-mat-icon size=\"m\" icon=\"done\" family=\"outlined\"></wcs-mat-icon>);\n    }\n    switch (stepButton.kind) {\n        case 'Icon':\n            return (<wcs-mat-icon size=\"m\" icon={stepButton.iconName}\n                                  family={stepButton.family ? stepButton.family : 'outlined'}></wcs-mat-icon>);\n        case 'Text':\n            return (stepButton.text);\n    }\n}\n\n","@import '../../style/focus-outline.scss';\n\n:host {\n    --wcs-horizontal-step-text-color-default: var(--wcs-semantic-color-text-secondary);\n    --wcs-horizontal-step-text-color-active: var(--wcs-semantic-color-foreground-brand);\n    --wcs-horizontal-step-text-color-disabled: var(--wcs-semantic-color-text-disabled);\n\n\n    display: block;\n\n    .steps {\n        list-style: none;\n        margin: 0;\n        padding: 0;\n\n        display: flex;\n        flex-direction: row;\n        flex: 1;\n    }\n\n    .graphic-step {\n        display: flex;\n        position: relative;\n        flex-direction: row;\n        flex: 1;\n        align-items: center;\n\n        wcs-button {\n            z-index: 1;\n            mix-blend-mode: darken;\n        }\n    }\n\n    .graphic-step[data-first] {\n        flex: 0;\n    }\n\n    wcs-progress-bar {\n        --wcs-progress-bar-border-radius: 0;\n        flex: 1;\n        margin: 0 -1px;\n    }\n\n    .label-container {\n        justify-content: space-between;\n        display: flex;\n        flex-direction: row;\n        margin-top: var(--wcs-semantic-spacing-base);\n    }\n\n    .label-container > * {\n        width: 100%;\n        text-align: center;\n        flex: 1;\n        color: var(--wcs-horizontal-step-text-color-default);\n        font-weight: 500;\n\n    }\n\n    .label-container > *[data-disable] {\n        color: var(--wcs-horizontal-step-text-color-disabled);\n    }\n\n    .label-container > *[data-current] {\n        color: var(--wcs-horizontal-step-text-color-active);\n    }\n\n    .label-container > div[data-first] {\n        margin-right: calc(var(--wcs-semantic-size-m, 40px) / 2);\n        text-align: left;\n        flex: 0.5;\n    }\n\n    .label-container > div[data-last] {\n        margin-left: calc(var(--wcs-semantic-size-m, 40px) / 2);\n        text-align: right;\n        flex: 0.5;\n    }\n}\n","import {\n    Component,\n    ComponentInterface,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Method,\n    Prop,\n    State,\n    Watch\n} from '@stencil/core';\nimport { HorizontalStepClickEvent, HorizontalStepConfig, HorizontalStepperMode } from './horizontal-stepper-interface';\nimport { HorizontalStep } from './horizontal-step';\n\n/**\n * The horizontal-stepper is a representation of a user’s progress through a series of discrete steps.\n *\n * ## Accessibility guidelines 💡\n * > - The `ariaLabel` property is available for every step to provide a more descriptive label for screen readers.\n * > - It is **mandatory** in `linear` mode if the step's content is not descriptive enough (e.g., only a number).\n * \n * @cssprop --wcs-horizontal-step-text-color-default - Text color of the step by default\n * @cssprop --wcs-horizontal-step-text-color-active - Text color of the step when active\n * @cssprop --wcs-horizontal-step-text-color-disabled - Text color of step when disabled\n */\n@Component({\n    tag: 'wcs-horizontal-stepper',\n    styleUrl: 'horizontal-stepper.scss',\n    shadow: true,\n})\nexport class HorizontalStepper implements ComponentInterface {\n    @Element() private el!: HTMLWcsHorizontalStepperElement;\n    /**\n     * index of the active step. The index corresponds to the index of the step in the 'steps' list\n     */\n    @Prop({mutable: true}) currentStep: number = 0;\n    /**\n     * steps to display\n     */\n    @Prop() steps: HorizontalStepConfig[];\n    /**\n     * Specifies if the stepper is in linear mode (the user can only click on the next step)\n     * or non-linear (the user can click on any step)\n     */\n    @Prop() mode: HorizontalStepperMode = 'nonLinear';\n    /**\n     * Specifies whether a check should be displayed when a step is passed.\n     */\n    @Prop({ reflect: true }) checkOnComplete: boolean;\n    /**\n     * Emits when the user selects a new step.\n     */\n    @Event() wcsHorizontalStepClick!: EventEmitter<HorizontalStepClickEvent>\n\n    /**\n     * Used to know which current step index is selected (component internal calculations mainly for the animation)\n     * @private\n     */\n    @State() private internalCurrentStepIndex: number;\n\n    componentWillLoad(): Promise<void> | void {\n        this.internalCurrentStepIndex = this.currentStep;\n        if (this.steps.length < 1) {\n            throw new Error('You must add at least one step');\n        }\n    }\n\n    @Watch('currentStep')\n    onCurrentStepChange(newValue: number, oldValue: number) {\n        //Check if the function is called before the component has finished its initialization in which case we do nothing\n        if (this.internalCurrentStepIndex !== undefined) {\n            const stepInterval = Math.abs(oldValue - newValue);\n            this.el.style.setProperty('--wcs-progress-bar-animation-duration', 350 / stepInterval + 'ms');\n            if (newValue !== oldValue) {\n                for (let i = 0; i < stepInterval; i++) {\n                    setTimeout(() => {\n                        this.internalCurrentStepIndex -= (oldValue - newValue) > 0 ? 1 : -1;\n                        \n                        if (i === stepInterval - 1) {\n                            this.el.style.removeProperty('--wcs-progress-bar-animation-duration');\n                        }\n                    }, (i * (375 / stepInterval)));\n                }\n            }\n        }\n    }\n\n    @Method()\n    async previous() {\n        this.navigateToIndex(this.internalCurrentStepIndex - 1, 'backward');\n    }\n\n    @Method()\n    async next() {\n        this.navigateToIndex(this.internalCurrentStepIndex + 1, 'forward');\n    }\n\n    private navigateToIndex(index: number, direction: 'backward' | 'forward'): void {\n        if (index >= 0 && index <= this.steps.length - 1) {\n            if (this.steps[index]?.complete || this.steps[index]?.disable) {\n                this.navigateToIndex(index + (direction === 'forward' ? 1 : -1), direction)\n            } else {\n                this.currentStep = index;\n            }\n        }\n    }\n\n    render(): any {\n        return (\n            <Host>\n                {/* \n                When using list-style: none in CSS, it removes the semantic of the list in Safari.\n                So we add role=\"list\" manually to provide semantic to screen readers\n                https://www.scottohara.me/blog/2019/01/12/lists-and-safari.html\n                https://css-tricks.com/snippets/css/remove-list-markers-without-affecting-semantics/ \n                */}\n                <ul role=\"list\" class=\"steps\">\n                    {this.steps.map((step: HorizontalStepConfig, index) =>\n                        (<HorizontalStep step={step}\n                                         passed={index <= this.internalCurrentStepIndex}\n                                         checkOnComplete={this.checkOnComplete}\n                                         complete={this.isComplete(step, index)}\n                                         active={index === this.internalCurrentStepIndex}\n                                         first={index === 0}\n                                         disable={this.isDisable(step, index)}\n                                         onClick={step => this.wcsHorizontalStepClick.emit({step, index})}\n                            />\n                        )\n                    )}\n                </ul>\n                {this.renderLabels()}\n            </Host>\n        );\n    }\n\n    private isComplete(step: HorizontalStepConfig, index: number) {\n        return index <= this.internalCurrentStepIndex || step.complete;\n    }\n\n    private renderLabels() {\n        if (this.steps.map(s => s.text).every(s => !s)) {\n            return null;\n        } else {\n            return <div class=\"label-container\" aria-hidden=\"true\">\n                {this.steps.map((step, index) =>\n                    (<div data-first={index === 0} data-current={index === this.internalCurrentStepIndex && !step.disable}\n                          data-disable={this.isDisable(step, index)} data-last={index === this.steps.length - 1}>\n                        <span>{step.text}</span></div>)\n                )}\n            </div>;\n        }\n    }\n\n    private isDisable(step, index) {\n        return step.disable || (this.mode === 'linear' && (!this.isNextPossibleStep(index) && this.internalCurrentStepIndex < index));\n    }\n\n    private isNextPossibleStep(index) {\n        if (index === 0) return true;\n        if (this.steps[index - 1]?.disable || this.previousStepIsCompleteAndNotActive(index)) return this.isNextPossibleStep(index - 1);\n        return this.internalCurrentStepIndex === index - 1;\n    }\n\n    private previousStepIsCompleteAndNotActive(index) {\n        return this.steps[index - 1]?.complete && index - 1 !== this.internalCurrentStepIndex;\n    }\n}\n"],"mappings":"gEAcO,MAAMA,EAA2D,EAEhEC,OACAC,kBACAC,WACAC,SACAC,SACAC,QACAC,UACAC,c,MAEJ,OAOIC,EAAA,MAAIC,KAAK,WAAWC,MAAM,eAAc,aAAaL,GAChDA,EAAQ,KAAQG,EAAA,oBAAkBG,MAAOR,EAAS,IAAM,EAAC,cAAc,SACxEK,EAAA,cAAYI,MAAO,CAACC,gBAAmB,SAAQ,cACvBC,EAAAd,EAAKe,aAAS,MAAAD,SAAA,EAAAA,EAAId,EAAKgB,KACnCT,QAASU,GAAKV,EAAQP,GACtBkB,IAAMC,IACFf,EAASe,EAAGC,iBAAiB,eAAgB,QAAUD,EAAGC,iBAAiB,eAAgB,KAAK,EAEpGC,MAAM,QAAQC,MAAOlB,GAAUF,KAAcF,EAAKM,QAAU,QAAU,UACtEiB,SAAUjB,GACjBkB,EAAiBxB,EAAKyB,OAAQxB,EAAiBC,EAAUE,IAE7D,EAIb,MAAMoB,EAAmB,CAACE,EAAwBzB,EAA0BC,EAAmBE,KAC3F,GAAIH,GAAmBC,IAAaE,EAAQ,CACxC,OAAQI,EAAA,gBAAcmB,KAAK,IAAIC,KAAK,OAAOC,OAAO,Y,CAEtD,OAAQH,EAAWI,MACf,IAAK,OACD,OAAQtB,EAAA,gBAAcmB,KAAK,IAAIC,KAAMF,EAAWK,SAC1BF,OAAQH,EAAWG,OAASH,EAAWG,OAAS,aAC1E,IAAK,OACD,OAAQH,EAAe,K,ECzDnC,MAAMM,EAAuB,iyCAC7B,MAAAC,EAAeD,E,MC+BFE,EAAiB,M,yGAKmB,E,+BASP,Y,uEAgBtC,iBAAAC,GACIC,KAAKC,yBAA2BD,KAAKE,YACrC,GAAIF,KAAKG,MAAMC,OAAS,EAAG,CACvB,MAAM,IAAIC,MAAM,iC,EAKxB,mBAAAC,CAAoBC,EAAkBC,GAElC,GAAIR,KAAKC,2BAA6BQ,UAAW,CAC7C,MAAMC,EAAeC,KAAKC,IAAIJ,EAAWD,GACzCP,KAAKjB,GAAGP,MAAMqC,YAAY,wCAAyC,IAAMH,EAAe,MACxF,GAAIH,IAAaC,EAAU,CACvB,IAAK,IAAIM,EAAI,EAAGA,EAAIJ,EAAcI,IAAK,CACnCC,YAAW,KACPf,KAAKC,0BAA6BO,EAAWD,EAAY,EAAI,GAAK,EAElE,GAAIO,IAAMJ,EAAe,EAAG,CACxBV,KAAKjB,GAAGP,MAAMwC,eAAe,wC,IAEjCF,GAAK,IAAMJ,G,IAO/B,cAAMO,GACFjB,KAAKkB,gBAAgBlB,KAAKC,yBAA2B,EAAG,W,CAI5D,UAAMkB,GACFnB,KAAKkB,gBAAgBlB,KAAKC,yBAA2B,EAAG,U,CAGpD,eAAAiB,CAAgBE,EAAeC,G,QACnC,GAAID,GAAS,GAAKA,GAASpB,KAAKG,MAAMC,OAAS,EAAG,CAC9C,KAAI1B,EAAAsB,KAAKG,MAAMiB,MAAM,MAAA1C,SAAA,SAAAA,EAAEZ,aAAYwD,EAAAtB,KAAKG,MAAMiB,MAAM,MAAAE,SAAA,SAAAA,EAAEpD,SAAS,CAC3D8B,KAAKkB,gBAAgBE,GAASC,IAAc,UAAY,GAAK,GAAIA,E,KAC9D,CACHrB,KAAKE,YAAckB,C,GAK/B,MAAAG,GACI,OACInD,EAACoD,EAAI,CAAAC,IAAA,4CAODrD,EAAA,MAAAqD,IAAA,2CAAIpD,KAAK,OAAOC,MAAM,SACjB0B,KAAKG,MAAMuB,KAAI,CAAC9D,EAA4BwD,IACxChD,EAACT,EAAc,CAACC,KAAMA,EACNG,OAAQqD,GAASpB,KAAKC,yBACtBpC,gBAAiBmC,KAAKnC,gBACtBC,SAAUkC,KAAK2B,WAAW/D,EAAMwD,GAChCpD,OAAQoD,IAAUpB,KAAKC,yBACvBhC,MAAOmD,IAAU,EACjBlD,QAAS8B,KAAK4B,UAAUhE,EAAMwD,GAC9BjD,QAASP,GAAQoC,KAAK6B,uBAAuBC,KAAK,CAAClE,OAAMwD,eAKjFpB,KAAK+B,e,CAKV,UAAAJ,CAAW/D,EAA4BwD,GAC3C,OAAOA,GAASpB,KAAKC,0BAA4BrC,EAAKE,Q,CAGlD,YAAAiE,GACJ,GAAI/B,KAAKG,MAAMuB,KAAIM,GAAKA,EAAEpD,OAAMqD,OAAMD,IAAMA,IAAI,CAC5C,OAAO,I,KACJ,CACH,OAAO5D,EAAA,OAAKE,MAAM,kBAAiB,cAAa,QAC3C0B,KAAKG,MAAMuB,KAAI,CAAC9D,EAAMwD,IAClBhD,EAAA,oBAAiBgD,IAAU,EAAC,eAAgBA,IAAUpB,KAAKC,2BAA6BrC,EAAKM,QAAO,eACjF8B,KAAK4B,UAAUhE,EAAMwD,GAAM,YAAaA,IAAUpB,KAAKG,MAAMC,OAAS,GACtFhC,EAAA,YAAOR,EAAKgB,S,EAMxB,SAAAgD,CAAUhE,EAAMwD,GACpB,OAAOxD,EAAKM,SAAY8B,KAAKd,OAAS,YAAcc,KAAKkC,mBAAmBd,IAAUpB,KAAKC,yBAA2BmB,E,CAGlH,kBAAAc,CAAmBd,G,MACvB,GAAIA,IAAU,EAAG,OAAO,KACxB,KAAI1C,EAAAsB,KAAKG,MAAMiB,EAAQ,MAAE,MAAA1C,SAAA,SAAAA,EAAER,UAAW8B,KAAKmC,mCAAmCf,GAAQ,OAAOpB,KAAKkC,mBAAmBd,EAAQ,GAC7H,OAAOpB,KAAKC,2BAA6BmB,EAAQ,C,CAG7C,kCAAAe,CAAmCf,G,MACvC,QAAO1C,EAAAsB,KAAKG,MAAMiB,EAAQ,MAAE,MAAA1C,SAAA,SAAAA,EAAEZ,WAAYsD,EAAQ,IAAMpB,KAAKC,wB"}

package/dist/wcs/{p-8c2605fd.entry.js → p-fe303f58.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as o,H as r,g as t}from"./p-32e583ea.js";import{S as s}from"./p-84e22272.js";import{k as a,s as i,i as n,a as c}from"./p-52d77e1f.js";import{k as d}from"./p-89b8c724.js";import{c as l}from"./p-0f864e86.js";function p(e,o){const r=d(e);if(r==="UNKNOWN"){return[]}switch(o){case"closed":switch(r){case"UP_ARROW":return[{kind:"OpenMenu"},{kind:"FocusItem",target:"last"}];case"DOWN_ARROW":return[{kind:"OpenMenu"},{kind:"FocusItem",target:"first"}];case"SPACE":case"ENTER":return[{kind:"OpenMenu"},{kind:"FocusItem",target:"first"}]}break;case"opened":switch(r){case"UP_ARROW":return[{kind:"FocusItem",target:"previous"}];case"DOWN_ARROW":return[{kind:"FocusItem",target:"next"}];case"HOME":return[{kind:"FocusItem",target:"first"}];case"END":return[{kind:"FocusItem",target:"last"}];case"ESCAPE":case"MAJ+TAB":case"TAB":return[{kind:"CloseMenu"}]}break;default:throw Error("Unknown error")}return[]}const w=':host{display:flex;--wcs-dropdown-outline-color-focus:var(--wcs-semantic-color-border-focus-base);--wcs-dropdown-padding-empty:var(--wcs-semantic-spacing-large);--wcs-dropdown-plain-arrow-color:var(--wcs-semantic-color-foreground-action-primary-default);--wcs-dropdown-stroked-arrow-color:var(--wcs-semantic-color-foreground-action-secondary-default);--wcs-dropdown-clear-arrow-color:var(--wcs-semantic-color-foreground-action-tertiary-default);--wcs-dropdown-arrow-color-disabled:var(--wcs-semantic-color-text-disabled);--wcs-dropdown-overlay-max-height:360px;--wcs-dropdown-overlay-padding:var(--wcs-semantic-spacing-base);--wcs-dropdown-overlay-background-color:var(--wcs-semantic-color-background-surface-primary);--wcs-dropdown-overlay-border-width:var(--wcs-semantic-border-width-default);--wcs-dropdown-overlay-border-radius:var(--wcs-semantic-border-radius-base);--wcs-dropdown-overlay-border-color:var(--wcs-semantic-color-border-secondary)}:host wcs-button{height:fit-content}:host svg{margin-right:-0.25rem}button{position:absolute;opacity:0;height:1px;width:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;outline:0;outline-offset:0}button:focus-visible+wcs-button{outline:var(--wcs-semantic-border-width-large) dashed var(--wcs-dropdown-outline-color-focus);outline-offset:var(--wcs-semantic-spacing-small);border-radius:var(--wcs-button-border-radius)}@supports not selector(button:focus-visible + wcs-button){button:focus-within+wcs-button{outline:var(--wcs-semantic-border-width-large) dashed var(--wcs-dropdown-outline-color-focus);outline-offset:var(--wcs-semantic-spacing-small);border-radius:var(--wcs-button-border-radius)}}.wcs-button-content-wrapper{display:flex;align-items:center}.popover{display:none;border:var(--wcs-dropdown-overlay-border-width) solid var(--wcs-dropdown-overlay-border-color);border-radius:var(--wcs-dropdown-overlay-border-radius);background-color:var(--wcs-dropdown-overlay-background-color);z-index:9999}.show{display:block}.container{min-width:calc(10 * var(--wcs-semantic-size-base));border-radius:inherit;overflow:hidden;padding:var(--wcs-dropdown-overlay-padding);background-color:var(--wcs-dropdown-overlay-background-color)}:host([mode=clear]) .arrow{fill:var(--wcs-dropdown-clear-arrow-color)}:host([mode=stroked]) .arrow{fill:var(--wcs-dropdown-stroked-arrow-color)}:host([mode=plain]) .arrow{fill:var(--wcs-dropdown-plain-arrow-color)}:host([disabled]) .arrow{fill:var(--wcs-dropdown-arrow-color-disabled)}#arrow,#arrow::before{position:absolute;width:8px;height:8px;background:inherit;border:var(--wcs-dropdown-overlay-border-width) solid var(--wcs-dropdown-overlay-border-color)}#arrow{visibility:hidden;z-index:-1}#arrow::before{visibility:visible;content:"";transform:rotate(45deg)}#is-empty{display:block;width:20ch;padding:0 var(--wcs-dropdown-padding-empty)}.popover[data-popper-placement^=top]>#arrow{bottom:-5px}.popover[data-popper-placement^=bottom]>#arrow{top:-6px}.popover[data-popper-placement^=left]>#arrow{right:-4px}.popover[data-popper-placement^=right]>#arrow{left:-6px}';const h=w;const u=["tabindex"];const b=class{constructor(o){e(this,o);this.inheritedAttributes={};this.noArrow=false;this.mode="stroked";this.shape="normal";this.size="m";this.disabled=false;this.placement="bottom-end";this.expanded=false}get items(){return Array.from(this.el.querySelectorAll("wcs-dropdown-item"))}placementChange(){this.popper.setOptions(Object.assign(Object.assign({},this.popper.state.options),{placement:this.placement})).then((e=>this.popper.update()))}onBlur(){this.clearLastFocusedItem();this.expanded=false}componentDidLoad(){this.popper=l(this.wcsButton,this.popoverDiv,{placement:this.placement,modifiers:[{name:"offset",options:{offset:[0,8]}}]});this.fixForFirefoxBelow63()}fixForFirefoxBelow63(){const e=this.el.querySelectorAll("wcs-dropdown-item");const o=this.el.querySelector(".container");if(e.length>0&&o){e.forEach((e=>{this.el.removeChild(e);o.appendChild(e)}))}}onButtonClick(e){this.clearLastFocusedItem();this.expanded=!this.expanded;if(this.expanded){this.focusItem(0)}}onWindowClickEvent(e){const o=a(e,this.el);if(this.expanded&&!o){this.expanded=false}}dropdownItemClick(e){this.expanded=false;this.nativeButton.focus()}onKeyDown(e){const o=this.expanded?"opened":"closed";const r=p(e,o);if(r.length!=0){e.preventDefault()}for(const e of r){this.doActionFromKeyboardEventAssociatedAction(e)}}async setAriaAttribute(e,o){i(this.nativeButton,e,o)}doActionFromKeyboardEventAssociatedAction(e){switch(e.kind){case"OpenMenu":this.expanded=true;this.focusItem(0);break;case"CloseMenu":this.expanded=false;this.nativeButton.focus();break;case"ClearFocus":this.clearLastFocusedItem();break;case"FocusItem":switch(e.target){case"previous":this.focusClosestItem("previous");break;case"next":this.focusClosestItem("next");break;case"first":this.focusItem(0);break;case"last":this.focusItem(this.items.length-1);break}break}}clearLastFocusedItem(){if(this.lastFocusedItemElement){this.lastFocusedItemElement.tabIndex=-1;this.lastFocusedItemElement=null}}focusItem(e){this.clearLastFocusedItem();this.lastFocusedItemElement=this.items[e];if(this.lastFocusedItemElement){this.lastFocusedItemElement.tabIndex=0;requestAnimationFrame((()=>{var e;(e=this.lastFocusedItemElement)===null||e===void 0?void 0:e.focus()}))}}focusClosestItem(e){const o=this.getClosestActiveItemIndexForDirection(e);if(o===-1)return;this.focusItem(o)}getClosestActiveItemIndexForDirection(e){const o=this.items;let r=Array.from(o).indexOf(this.lastFocusedItemElement);const t=0;const s=o.length-1;if(e==="next"&&r<s){r++}else if(e==="previous"&&r>t){r--}else{if(e==="next"&&r>=s){r=0}if(e==="previous"&&r===t){r=s}}return r}componentDidRender(){if(this.popper){this.popper.update()}}componentWillLoad(){this.inheritedAttributes=Object.assign(Object.assign({},n(this.el)),c(this.el,u))}render(){return o(r,{key:"96be2f9df0a80b4d6c88cf15419ff29cb001c695"},o("button",Object.assign({key:"562456822837e6ff61ed23569335e42ad4e36df9",id:"dropdown-button","aria-controls":"menu",disabled:this.disabled,"aria-haspopup":"true",role:"button","aria-expanded":this.expanded?"true":"false",ref:e=>this.nativeButton=e,onClick:e=>this.onButtonClick(e),onBlur:e=>e.stopImmediatePropagation()},this.inheritedAttributes),"Dropdown"),o("wcs-button",{key:"66348725409b810219dd1bd4658611c63bbb5eb8",mode:this.mode,shape:this.shape,disabled:this.disabled,size:this.size,ref:e=>this.wcsButton=e,"aria-hidden":"true",tabindex:-1,onClick:e=>this.onButtonClick(e),onBlur:e=>e.stopImmediatePropagation()},o("div",{key:"028e06637e35ecc14b66cf74fba32dc59d58121a",class:"wcs-button-content-wrapper"},o("slot",{key:"7f7e2db54f9b5d3a20588c48c1d3fd6750187017",name:"placeholder"}),this.noArrow?null:o(s,{up:this.expanded}))),o("div",{key:"7f6f4efe22cab63033b3e7775791856ed8e1b921",class:(this.expanded?"show ":"")+"popover",id:"menu",role:"menu","aria-labelledby":"dropdown-button",tabindex:-1,ref:e=>this.popoverDiv=e},o("div",{key:"ca7ce6adea1005d7126d4ae060ada55e9d3b6d70",role:"presentation",id:"arrow","data-popper-arrow":true}),o("div",{key:"0f2a9e15df898550117743f855e7ee0746157ab1",role:"presentation",class:"container"},o("slot",{key:"688fd29a894bae8aee4c848a9b07380c95302ca2",name:"item"},o("span",{key:"a80c902d26d7afed58e8a17646dac92473042fa4",id:"is-empty"})))))}static get delegatesFocus(){return true}get el(){return t(this)}static get watchers(){return{placement:["placementChange"]}}};b.style=h;export{b as wcs_dropdown};
-//# sourceMappingURL=p-8c2605fd.entry.js.map
+import{r as e,h as o,H as r,g as t}from"./p-32e583ea.js";import{S as s}from"./p-84e22272.js";import{k as a,s as i,i as n,a as c}from"./p-52d77e1f.js";import{k as d}from"./p-89b8c724.js";import{c as l}from"./p-e1fb3625.js";function p(e,o){const r=d(e);if(r==="UNKNOWN"){return[]}switch(o){case"closed":switch(r){case"UP_ARROW":return[{kind:"OpenMenu"},{kind:"FocusItem",target:"last"}];case"DOWN_ARROW":return[{kind:"OpenMenu"},{kind:"FocusItem",target:"first"}];case"SPACE":case"ENTER":return[{kind:"OpenMenu"},{kind:"FocusItem",target:"first"}]}break;case"opened":switch(r){case"UP_ARROW":return[{kind:"FocusItem",target:"previous"}];case"DOWN_ARROW":return[{kind:"FocusItem",target:"next"}];case"HOME":return[{kind:"FocusItem",target:"first"}];case"END":return[{kind:"FocusItem",target:"last"}];case"ESCAPE":case"MAJ+TAB":case"TAB":return[{kind:"CloseMenu"}]}break;default:throw Error("Unknown error")}return[]}const w=':host{display:flex;--wcs-dropdown-outline-color-focus:var(--wcs-semantic-color-border-focus-base);--wcs-dropdown-padding-empty:var(--wcs-semantic-spacing-large);--wcs-dropdown-plain-arrow-color:var(--wcs-semantic-color-foreground-action-primary-default);--wcs-dropdown-stroked-arrow-color:var(--wcs-semantic-color-foreground-action-secondary-default);--wcs-dropdown-clear-arrow-color:var(--wcs-semantic-color-foreground-action-tertiary-default);--wcs-dropdown-arrow-color-disabled:var(--wcs-semantic-color-text-disabled);--wcs-dropdown-overlay-max-height:360px;--wcs-dropdown-overlay-padding:var(--wcs-semantic-spacing-base);--wcs-dropdown-overlay-background-color:var(--wcs-semantic-color-background-surface-primary);--wcs-dropdown-overlay-border-width:var(--wcs-semantic-border-width-default);--wcs-dropdown-overlay-border-radius:var(--wcs-semantic-border-radius-base);--wcs-dropdown-overlay-border-color:var(--wcs-semantic-color-border-secondary)}:host wcs-button{height:fit-content}:host svg{margin-right:-0.25rem}button{position:absolute;opacity:0;height:1px;width:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;outline:0;outline-offset:0}button:focus-visible+wcs-button{outline:var(--wcs-semantic-border-width-large) dashed var(--wcs-dropdown-outline-color-focus);outline-offset:var(--wcs-semantic-spacing-small);border-radius:var(--wcs-button-border-radius)}@supports not selector(button:focus-visible + wcs-button){button:focus-within+wcs-button{outline:var(--wcs-semantic-border-width-large) dashed var(--wcs-dropdown-outline-color-focus);outline-offset:var(--wcs-semantic-spacing-small);border-radius:var(--wcs-button-border-radius)}}.wcs-button-content-wrapper{display:flex;align-items:center}.popover{display:none;border:var(--wcs-dropdown-overlay-border-width) solid var(--wcs-dropdown-overlay-border-color);border-radius:var(--wcs-dropdown-overlay-border-radius);background-color:var(--wcs-dropdown-overlay-background-color);z-index:9999}.show{display:block}.container{min-width:calc(10 * var(--wcs-semantic-size-base));border-radius:inherit;overflow:hidden;padding:var(--wcs-dropdown-overlay-padding);background-color:var(--wcs-dropdown-overlay-background-color)}:host([mode=clear]) .arrow{fill:var(--wcs-dropdown-clear-arrow-color)}:host([mode=stroked]) .arrow{fill:var(--wcs-dropdown-stroked-arrow-color)}:host([mode=plain]) .arrow{fill:var(--wcs-dropdown-plain-arrow-color)}:host([disabled]) .arrow{fill:var(--wcs-dropdown-arrow-color-disabled)}#arrow,#arrow::before{position:absolute;width:8px;height:8px;background:inherit;border:var(--wcs-dropdown-overlay-border-width) solid var(--wcs-dropdown-overlay-border-color)}#arrow{visibility:hidden;z-index:-1}#arrow::before{visibility:visible;content:"";transform:rotate(45deg)}#is-empty{display:block;width:20ch;padding:0 var(--wcs-dropdown-padding-empty)}.popover[data-popper-placement^=top]>#arrow{bottom:-5px}.popover[data-popper-placement^=bottom]>#arrow{top:-6px}.popover[data-popper-placement^=left]>#arrow{right:-4px}.popover[data-popper-placement^=right]>#arrow{left:-6px}';const h=w;const u=["tabindex"];const b=class{constructor(o){e(this,o);this.inheritedAttributes={};this.noArrow=false;this.mode="stroked";this.shape="normal";this.size="m";this.disabled=false;this.placement="bottom-end";this.expanded=false}get items(){return Array.from(this.el.querySelectorAll("wcs-dropdown-item"))}placementChange(){this.popper.setOptions(Object.assign(Object.assign({},this.popper.state.options),{placement:this.placement})).then((e=>this.popper.update()))}onBlur(){this.clearLastFocusedItem();this.expanded=false}componentDidLoad(){this.popper=l(this.wcsButton,this.popoverDiv,{placement:this.placement,modifiers:[{name:"offset",options:{offset:[0,8]}}]});this.fixForFirefoxBelow63()}fixForFirefoxBelow63(){const e=this.el.querySelectorAll("wcs-dropdown-item");const o=this.el.querySelector(".container");if(e.length>0&&o){e.forEach((e=>{this.el.removeChild(e);o.appendChild(e)}))}}onButtonClick(e){this.clearLastFocusedItem();this.expanded=!this.expanded;if(this.expanded){this.focusItem(0)}}onWindowClickEvent(e){const o=a(e,this.el);if(this.expanded&&!o){this.expanded=false}}dropdownItemClick(e){this.expanded=false;this.nativeButton.focus()}onKeyDown(e){const o=this.expanded?"opened":"closed";const r=p(e,o);if(r.length!=0){e.preventDefault()}for(const e of r){this.doActionFromKeyboardEventAssociatedAction(e)}}async setAriaAttribute(e,o){i(this.nativeButton,e,o)}doActionFromKeyboardEventAssociatedAction(e){switch(e.kind){case"OpenMenu":this.expanded=true;this.focusItem(0);break;case"CloseMenu":this.expanded=false;this.nativeButton.focus();break;case"ClearFocus":this.clearLastFocusedItem();break;case"FocusItem":switch(e.target){case"previous":this.focusClosestItem("previous");break;case"next":this.focusClosestItem("next");break;case"first":this.focusItem(0);break;case"last":this.focusItem(this.items.length-1);break}break}}clearLastFocusedItem(){if(this.lastFocusedItemElement){this.lastFocusedItemElement.tabIndex=-1;this.lastFocusedItemElement=null}}focusItem(e){this.clearLastFocusedItem();this.lastFocusedItemElement=this.items[e];if(this.lastFocusedItemElement){this.lastFocusedItemElement.tabIndex=0;requestAnimationFrame((()=>{var e;(e=this.lastFocusedItemElement)===null||e===void 0?void 0:e.focus()}))}}focusClosestItem(e){const o=this.getClosestActiveItemIndexForDirection(e);if(o===-1)return;this.focusItem(o)}getClosestActiveItemIndexForDirection(e){const o=this.items;let r=Array.from(o).indexOf(this.lastFocusedItemElement);const t=0;const s=o.length-1;if(e==="next"&&r<s){r++}else if(e==="previous"&&r>t){r--}else{if(e==="next"&&r>=s){r=0}if(e==="previous"&&r===t){r=s}}return r}componentDidRender(){if(this.popper){this.popper.update()}}componentWillLoad(){this.inheritedAttributes=Object.assign(Object.assign({},n(this.el)),c(this.el,u))}render(){return o(r,{key:"96be2f9df0a80b4d6c88cf15419ff29cb001c695"},o("button",Object.assign({key:"562456822837e6ff61ed23569335e42ad4e36df9",id:"dropdown-button","aria-controls":"menu",disabled:this.disabled,"aria-haspopup":"true",role:"button","aria-expanded":this.expanded?"true":"false",ref:e=>this.nativeButton=e,onClick:e=>this.onButtonClick(e),onBlur:e=>e.stopImmediatePropagation()},this.inheritedAttributes),"Dropdown"),o("wcs-button",{key:"66348725409b810219dd1bd4658611c63bbb5eb8",mode:this.mode,shape:this.shape,disabled:this.disabled,size:this.size,ref:e=>this.wcsButton=e,"aria-hidden":"true",tabindex:-1,onClick:e=>this.onButtonClick(e),onBlur:e=>e.stopImmediatePropagation()},o("div",{key:"028e06637e35ecc14b66cf74fba32dc59d58121a",class:"wcs-button-content-wrapper"},o("slot",{key:"7f7e2db54f9b5d3a20588c48c1d3fd6750187017",name:"placeholder"}),this.noArrow?null:o(s,{up:this.expanded}))),o("div",{key:"7f6f4efe22cab63033b3e7775791856ed8e1b921",class:(this.expanded?"show ":"")+"popover",id:"menu",role:"menu","aria-labelledby":"dropdown-button",tabindex:-1,ref:e=>this.popoverDiv=e},o("div",{key:"ca7ce6adea1005d7126d4ae060ada55e9d3b6d70",role:"presentation",id:"arrow","data-popper-arrow":true}),o("div",{key:"0f2a9e15df898550117743f855e7ee0746157ab1",role:"presentation",class:"container"},o("slot",{key:"688fd29a894bae8aee4c848a9b07380c95302ca2",name:"item"},o("span",{key:"a80c902d26d7afed58e8a17646dac92473042fa4",id:"is-empty"})))))}static get delegatesFocus(){return true}get el(){return t(this)}static get watchers(){return{placement:["placementChange"]}}};b.style=h;export{b as wcs_dropdown};
+//# sourceMappingURL=p-fe303f58.entry.js.map

package/dist/wcs/wcs.esm.js

@@ -1,2 +1,2 @@
-import{p as e,b as t}from"./p-32e583ea.js";export{s as setNonce}from"./p-32e583ea.js";import{g as a}from"./p-e1255160.js";var o=()=>{const t=import.meta.url;const a={};if(t!==""){a.resourcesUrl=new URL(".",t).href}return e(a)};o().then((async e=>{await a();return t(JSON.parse('[["p-a0f6ef30",[[1,"wcs-editable-field",{"type":[1],"label":[1],"readonly":[516],"value":[1032],"validateFn":[16],"formatFn":[16],"errorMsg":[1,"error-msg"],"size":[513],"currentState":[32],"isError":[32]},[[8,"click","onWindowClickEvent"]],{"value":["onValueChange"]}]]],["p-0b8157e7",[[1,"wcs-grid-pagination",{"availablePageSizes":[16],"currentPage":[1026,"current-page"],"pageSize":[2,"page-size"],"itemsCount":[2,"items-count"],"pageCount":[2,"page-count"],"setAriaAttribute":[64]}]]],["p-dfb52a1c",[[1,"wcs-alert-drawer",{"position":[513],"timeout":[2],"showProgressBar":[4,"show-progress-bar"],"show":[64]}]]],["p-1fbe0328",[[1,"wcs-horizontal-stepper",{"currentStep":[1026,"current-step"],"steps":[16],"mode":[1],"checkOnComplete":[516,"check-on-complete"],"internalCurrentStepIndex":[32],"previous":[64],"next":[64]},null,{"currentStep":["onCurrentStepChange"]}]]],["p-8e9bd0f1",[[1,"wcs-breadcrumb",{"maxItems":[2,"max-items"],"itemsBeforeCollapse":[2,"items-before-collapse"],"itemsAfterCollapse":[2,"items-after-collapse"],"ariaLabelExpandButton":[1,"aria-label-expand-button"],"showHiddenItems":[32],"setAriaAttribute":[64]},null,{"maxItems":["handleCollapsePropsChange"],"itemsBeforeCollapse":["handleCollapsePropsChange"],"itemsAfterCollapse":["handleCollapsePropsChange"],"ariaLabelExpandButton":["handleAriaLabelExpandBtnChange"]}]]],["p-1ba616c2",[[17,"wcs-counter",{"size":[513],"label":[1],"disabled":[516],"min":[1026],"max":[1026],"step":[1026],"value":[1026],"displayedValue":[32],"setAriaAttribute":[64]},null,{"value":["valueChange"]}]]],["p-a956dc84",[[1,"wcs-grid",{"serverMode":[516,"server-mode"],"data":[16],"loading":[516],"selectionConfig":[1,"selection-config"],"selectedItems":[8,"selected-items"],"wcsGridPaginationId":[1,"wcs-grid-pagination-id"],"rowIdPath":[1,"row-id-path"],"rowCssPartsFn":[16],"columns":[32],"paginationEl":[32],"rows":[32],"cursorPosition":[32],"focusFirstCell":[64],"setAriaAttribute":[64]},[[0,"focus","onFocus"],[0,"blur","onBlur"],[0,"wcsHiddenChange","onHiddenColumnChange"],[0,"keydown","onKeyDown"],[1,"mousedown","onClick"],[0,"wcsSortChange","sortChangeEventHandler"],[0,"wcsGridPaginationChange","paginationChangeEventHandler"],[8,"wcsGridPaginationChange","paginationChangeEventHandlerOutside"]],{"cursorPosition":["onCursorPositionChange"],"data":["onDataChange"],"selectedItems":["onSelectedItemsPropertyChange"]}]]],["p-0dd07842",[[4,"wcs-modal",{"withoutBackdrop":[516,"without-backdrop"],"show":[1540],"showCloseButton":[516,"show-close-button"],"closeButtonAriaLabel":[1,"close-button-aria-label"],"size":[1],"hideActions":[516,"hide-actions"],"modalTriggerControlsId":[1,"modal-trigger-controls-id"],"initialFocusElementId":[1,"initial-focus-element-id"],"disableAutoFocus":[516,"disable-auto-focus"],"setAriaAttribute":[64]},[[4,"keydown","onKeyDown"]],{"show":["onShowChange"]}]]],["p-8c2605fd",[[17,"wcs-dropdown",{"noArrow":[516,"no-arrow"],"mode":[1],"shape":[1],"size":[1],"disabled":[516],"placement":[1],"expanded":[32],"setAriaAttribute":[64]},[[0,"blur","onBlur"],[8,"click","onWindowClickEvent"],[0,"wcsDropdownItemClick","dropdownItemClick"],[0,"keydown","onKeyDown"]],{"placement":["placementChange"]}]]],["p-622f7403",[[1,"wcs-galactic-menu",{"text":[1],"showPopoverMenu":[32],"setAriaAttribute":[64]},[[8,"click","onWindowClickEvent"],[0,"keydown","onKeyDown"]]]]],["p-5da0534f",[[17,"wcs-input",{"fireFocusEvents":[4,"fire-focus-events"],"accept":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"debounce":[2],"prefixLabel":[1,"prefix-label"],"suffixLabel":[1,"suffix-label"],"disabled":[516],"enterkeyhint":[1],"size":[513],"icon":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"multiple":[516],"name":[1],"hidePasswordButtonAriaLabel":[1,"hide-password-button-aria-label"],"showPasswordButtonAriaLabel":[1,"show-password-button-aria-label"],"pattern":[1],"placeholder":[1],"readonly":[516],"required":[516],"spellcheck":[4],"state":[513],"step":[1],"type":[1],"value":[1032],"passwordReveal":[32],"setBlur":[64],"getInputElement":[64],"setAriaAttribute":[64]},null,{"debounce":["debounceChanged"],"passwordReveal":["onPasswordRevealChange"]}]]],["p-c261eaf9",[[17,"wcs-textarea",{"fireFocusEvents":[4,"fire-focus-events"],"autocapitalize":[1],"autofocus":[4],"debounce":[2],"disabled":[516],"icon":[1],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"readonly":[516],"required":[516],"spellcheck":[4],"state":[513],"cols":[2],"rows":[2],"wrap":[1],"autoGrow":[516,"auto-grow"],"value":[1025],"resize":[513],"setAriaAttribute":[64],"fitContent":[64],"setBlur":[64],"getInputElement":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}]]],["p-02f31010",[[1,"wcs-accordion",{"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"]},[[0,"wcsOpenChange","wcsOpenChangeHandler"]],{"hideActionText":["updateHideActiontextOnPanel"],"highlight":["updateHighlightOnPanel"],"groupContentWithHeader":["updateGroupContentWithHeader"]}]]],["p-61592f91",[[1,"wcs-accordion-content"]]],["p-439804b0",[[1,"wcs-accordion-header"]]],["p-6c6079ee",[[1,"wcs-accordion-panel",{"open":[1540],"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"],"setAriaAttribute":[64],"close":[64]},null,{"open":["openChange"]}]]],["p-496115a5",[[1,"wcs-action-bar",{"gutter":[516],"hasTabs":[32]}]]],["p-781a956e",[[1,"wcs-app"]]],["p-41b946b2",[[1,"wcs-badge",{"shape":[1],"color":[1],"size":[513]}]]],["p-53a395a9",[[1,"wcs-breadcrumb-item",{"last":[4]}]]],["p-637ec45a",[[1,"wcs-card",{"mode":[1537],"orientation":[513]},null,{"orientation":["orientationChanged"]}]]],["p-5607246c",[[1,"wcs-card-body",{"orientation":[32],"setOrientation":[64]}]]],["p-98a8b806",[[1,"wcs-card-content"]]],["p-6aededc6",[[1,"wcs-card-footer"]]],["p-f929b66f",[[1,"wcs-card-header"]]],["p-cbbca016",[[1,"wcs-card-media",{"orientation":[32],"setOrientation":[64]}]]],["p-1244daa0",[[1,"wcs-com-nav",{"appName":[1,"app-name"],"mobileMenuOpen":[32],"currentActiveSizing":[32],"setAriaAttribute":[64]},[[0,"wcsClickOnFinalAction","onClickOnFinalAction"],[8,"keydown","exitMobileMenuOnKeyDown"]]]]],["p-ad286030",[[1,"wcs-com-nav-category",{"label":[1],"categoryOpen":[32],"currentActiveSizing":[32],"setAriaAttribute":[64],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsCategoryOpened","onSubmenuOpened"]]]]],["p-fd187bce",[[1,"wcs-com-nav-item",null,[[0,"click","onClick"]]]]],["p-850fa9c9",[[1,"wcs-com-nav-submenu",{"label":[1],"panelTitle":[1,"panel-title"],"panelDescription":[1,"panel-description"],"menuOpen":[32],"currentActiveSizing":[32],"setAriaAttribute":[64],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsSubmenuOpened","onSubmenuOpened"],[8,"keydown","onEscapeKeyDown"],[0,"wcsClickOnFinalAction","wcsCategoryItemClickedHandler"]]]]],["p-c7812760",[[1,"wcs-divider"]]],["p-7de847e0",[[1,"wcs-dropdown-divider"]]],["p-367946fe",[[1,"wcs-dropdown-header"]]],["p-cad10435",[[4,"wcs-dropdown-item",null,[[1,"mouseup","onMouseUp"],[0,"keydown","onKeyDown"]]]]],["p-3a18535f",[[1,"wcs-field"]]],["p-e26c19e5",[[1,"wcs-field-content"]]],["p-c211a5d1",[[1,"wcs-field-label"]]],["p-0758d22e",[[1,"wcs-footer"]]],["p-0424e545",[[1,"wcs-galactic",{"text":[1],"show":[32]}]]],["p-18fa39f4",[[1,"wcs-grid-column",{"path":[1],"name":[1],"sort":[516],"sortFn":[16],"formatter":[16],"sortOrder":[1025,"sort-order"],"width":[1],"customCells":[516,"custom-cells"],"hidden":[516],"cursorPosition":[16],"columnPosition":[2,"column-position"],"setAriaAttribute":[64]},null,{"hidden":["parseMyObjectProp"],"sortOrder":["sortOrderChange"]}]]],["p-3823f54e",[[1,"wcs-grid-custom-cell",{"columnId":[1,"column-id"],"rowId":[8,"row-id"]}]]],["p-1e7ea63c",[[1,"wcs-header",{"setAriaAttribute":[64]}]]],["p-cbda74f6",[[1,"wcs-hint",{"small":[1540]}]]],["p-580b3142",[[0,"wcs-icon",{"icon":[1],"size":[1],"setAriaAttribute":[64]}]]],["p-e56b9ce2",[[1,"wcs-list-item",{"activated":[1540]}]]],["p-aadf37e7",[[1,"wcs-list-item-properties"]]],["p-27b438c0",[[1,"wcs-list-item-property"]]],["p-5e8fff73",[[1,"wcs-native-select",{"size":[513],"required":[516],"expanded":[32],"disabled":[32],"setAriaAttribute":[64],"updateStyles":[64]},null,{"required":["requiredChanged"]}]]],["p-9c73744c",[[1,"wcs-nav",{"setAriaAttribute":[64]}]]],["p-dff8641e",[[4,"wcs-nav-item",null,[[0,"keydown","onKeyDown"]]]]],["p-bc009574",[[1,"wcs-progress-radial",{"size":[2],"showLabel":[516,"show-label"],"value":[2],"setAriaAttribute":[64]}]]],["p-86ec9ead",[[17,"wcs-radio",{"value":[1544],"label":[1537],"disabled":[1540],"name":[1025],"mode":[513],"checked":[32],"radioTabIndex":[32],"updateState":[64],"setTabIndex":[64],"setAriaAttribute":[64]}]]],["p-fdeae83e",[[1,"wcs-radio-group",{"value":[1032],"name":[520],"mode":[513],"setAriaAttribute":[64]},[[0,"wcsRadioClick","handleRadioClick"],[0,"keydown","handleKeyDown"]],{"value":["onValueChangeHandler"],"name":["updateAllRadioModeAndName"],"mode":["updateAllRadioModeAndName"]}]]],["p-352e1f99",[[1,"wcs-skeleton-circle",{"animation":[513],"radius":[514]}]]],["p-c84ae00d",[[1,"wcs-skeleton-rectangle",{"animation":[513],"rounded":[516],"height":[513],"width":[513]}]]],["p-5202b323",[[1,"wcs-skeleton-text",{"animation":[513],"height":[1]}]]],["p-b0a6eec6",[[17,"wcs-switch",{"name":[1],"checked":[516],"labelAlignment":[513,"label-alignment"],"disabled":[516],"setAriaAttribute":[64],"getLabel":[64]},[[0,"click","handleHostClick"]]]]],["p-ad5192cd",[[1,"wcs-tab",{"header":[513],"itemKey":[8,"item-key"]}]]],["p-1f593d06",[[1,"wcs-tabs",{"align":[513],"selectedIndex":[2,"selected-index"],"selectedKey":[8,"selected-key"],"headersOnly":[516,"headers-only"],"gutter":[516],"description":[1],"mobileOverlayExpanded":[32],"mobile":[32],"headers":[32],"currentActiveTabIndex":[32],"setAriaAttribute":[64]},[[0,"tabLoaded","onTabLoaded"],[8,"click","onWindowClickEvent"]],{"selectedIndex":["selectedIndexChanged"],"selectedKey":["selectedTabkeyChanged"],"mobile":["onMobileChange"]}]]],["p-a94e685c",[[1,"wcs-tooltip",{"for":[1],"position":[513],"interactive":[516],"maxWidth":[8,"max-width"],"delay":[2],"duration":[2],"trigger":[1],"theme":[1],"content":[1],"appendTo":[1,"append-to"],"hide":[64],"show":[64],"disable":[64],"enable":[64]},[[8,"keydown","handleKeyDown"]],{"interactive":["updateProps"],"position":["updateProps"],"maxWidth":["updateProps"],"theme":["updateProps"],"delay":["updateProps"],"duration":["updateProps"],"trigger":["updateProps"],"content":["updateTippyContent"]}]]],["p-8152d360",[[1,"wcs-alert",{"show":[1540],"intent":[513],"timeout":[2],"showProgressBar":[4,"show-progress-bar"]},[[1,"mouseover","mouseOverHandler"],[1,"mouseout","mouseOutHandler"]]]]],["p-9fd3366c",[[1,"wcs-progress-bar",{"size":[1],"showLabel":[516,"show-label"],"value":[2],"setAriaAttribute":[64]}]]],["p-b94a09b6",[[4,"wcs-select-option",{"disabled":[1540],"selected":[1540],"highlighted":[1540],"value":[8],"chipColor":[1,"chip-color"],"chipBackgroundColor":[1,"chip-background-color"],"multiple":[1540]},[[1,"mouseup","onMouseUp"],[0,"keydown","handleKeydown"]]],[1,"wcs-select",{"size":[513],"value":[1032],"placeholder":[1537],"disabled":[1540],"required":[516],"multiple":[516],"autocomplete":[516],"serverMode":[516,"server-mode"],"filterFn":[16],"chips":[516],"name":[1],"compareWith":[16],"expanded":[32],"displayText":[32],"focused":[32],"showNoResultFoundLabel":[32],"autocompleteValue":[32],"overlayDirection":[32],"open":[64],"close":[64],"setAriaAttribute":[64]},[[1,"mouseup","onMouseUp"],[8,"click","onWindowClickEvent"],[0,"keydown","onKeyDown"],[0,"wcsSelectOptionClick","selectedOptionChanged"],[0,"focus","onFocus"],[2,"blur","onBlur"]],{"value":["onValueChangeHandler"]}]]],["p-ec383729",[[1,"wcs-error"],[1,"wcs-form-field",{"isError":[1540,"is-error"],"hasPrefix":[32],"hasSuffix":[32],"spiedElement":[32]},null,{"isError":["isErrorChange"]}],[1,"wcs-label",{"required":[516],"setAriaAttribute":[64]}]]],["p-4fb2d985",[[17,"wcs-checkbox",{"name":[1],"indeterminate":[1540],"checked":[1540],"labelAlignment":[1537,"label-alignment"],"disabled":[516],"setAriaAttribute":[64],"getLabel":[64]},[[0,"click","handleHostClick"]]]]],["p-b28b2fba",[[1,"wcs-mat-icon",{"icon":[1],"size":[1],"family":[1],"setAriaAttribute":[64]}]]],["p-204f2722",[[17,"wcs-button",{"type":[1025],"href":[1],"target":[1],"disabled":[516],"ripple":[4],"size":[513],"shape":[513],"mode":[513],"loading":[1540],"setAriaAttribute":[64]},[[0,"click","onClick"]],{"ripple":["onRippleChange"]}],[1,"wcs-spinner",{"mode":[513]}]]]]'),e)}));
+import{p as e,b as t}from"./p-32e583ea.js";export{s as setNonce}from"./p-32e583ea.js";import{g as a}from"./p-e1255160.js";var o=()=>{const t=import.meta.url;const a={};if(t!==""){a.resourcesUrl=new URL(".",t).href}return e(a)};o().then((async e=>{await a();return t(JSON.parse('[["p-a0f6ef30",[[1,"wcs-editable-field",{"type":[1],"label":[1],"readonly":[516],"value":[1032],"validateFn":[16],"formatFn":[16],"errorMsg":[1,"error-msg"],"size":[513],"currentState":[32],"isError":[32]},[[8,"click","onWindowClickEvent"]],{"value":["onValueChange"]}]]],["p-0b8157e7",[[1,"wcs-grid-pagination",{"availablePageSizes":[16],"currentPage":[1026,"current-page"],"pageSize":[2,"page-size"],"itemsCount":[2,"items-count"],"pageCount":[2,"page-count"],"setAriaAttribute":[64]}]]],["p-dfb52a1c",[[1,"wcs-alert-drawer",{"position":[513],"timeout":[2],"showProgressBar":[4,"show-progress-bar"],"show":[64]}]]],["p-fbd68522",[[1,"wcs-horizontal-stepper",{"currentStep":[1026,"current-step"],"steps":[16],"mode":[1],"checkOnComplete":[516,"check-on-complete"],"internalCurrentStepIndex":[32],"previous":[64],"next":[64]},null,{"currentStep":["onCurrentStepChange"]}]]],["p-0326f834",[[1,"wcs-breadcrumb",{"maxItems":[2,"max-items"],"itemsBeforeCollapse":[2,"items-before-collapse"],"itemsAfterCollapse":[2,"items-after-collapse"],"ariaLabelExpandButton":[1,"aria-label-expand-button"],"showHiddenItems":[32],"setAriaAttribute":[64]},null,{"maxItems":["handleCollapsePropsChange"],"itemsBeforeCollapse":["handleCollapsePropsChange"],"itemsAfterCollapse":["handleCollapsePropsChange"],"ariaLabelExpandButton":["handleAriaLabelExpandBtnChange"]}]]],["p-1ba616c2",[[17,"wcs-counter",{"size":[513],"label":[1],"disabled":[516],"min":[1026],"max":[1026],"step":[1026],"value":[1026],"displayedValue":[32],"setAriaAttribute":[64]},null,{"value":["valueChange"]}]]],["p-f2f7595e",[[1,"wcs-grid",{"serverMode":[516,"server-mode"],"data":[16],"loading":[516],"selectionConfig":[1,"selection-config"],"selectedItems":[8,"selected-items"],"wcsGridPaginationId":[1,"wcs-grid-pagination-id"],"rowIdPath":[1,"row-id-path"],"rowCssPartsFn":[16],"columns":[32],"paginationEl":[32],"rows":[32],"cursorPosition":[32],"focusFirstCell":[64],"setAriaAttribute":[64]},[[0,"focus","onFocus"],[0,"blur","onBlur"],[0,"wcsHiddenChange","onHiddenColumnChange"],[0,"keydown","onKeyDown"],[1,"mousedown","onClick"],[0,"wcsSortChange","sortChangeEventHandler"],[0,"wcsGridPaginationChange","paginationChangeEventHandler"],[8,"wcsGridPaginationChange","paginationChangeEventHandlerOutside"]],{"cursorPosition":["onCursorPositionChange"],"data":["onDataChange"],"selectedItems":["onSelectedItemsPropertyChange"]}]]],["p-4e2d6227",[[4,"wcs-modal",{"withoutBackdrop":[516,"without-backdrop"],"show":[1540],"showCloseButton":[516,"show-close-button"],"closeButtonAriaLabel":[1,"close-button-aria-label"],"size":[1],"hideActions":[516,"hide-actions"],"modalTriggerControlsId":[1,"modal-trigger-controls-id"],"initialFocusElementId":[1,"initial-focus-element-id"],"disableAutoFocus":[516,"disable-auto-focus"],"setAriaAttribute":[64]},[[4,"keydown","onKeyDown"]],{"show":["onShowChange"]}]]],["p-fe303f58",[[17,"wcs-dropdown",{"noArrow":[516,"no-arrow"],"mode":[1],"shape":[1],"size":[1],"disabled":[516],"placement":[1],"expanded":[32],"setAriaAttribute":[64]},[[0,"blur","onBlur"],[8,"click","onWindowClickEvent"],[0,"wcsDropdownItemClick","dropdownItemClick"],[0,"keydown","onKeyDown"]],{"placement":["placementChange"]}]]],["p-c6f8c45c",[[1,"wcs-galactic-menu",{"text":[1],"showPopoverMenu":[32],"setAriaAttribute":[64]},[[8,"click","onWindowClickEvent"],[0,"keydown","onKeyDown"]]]]],["p-5da0534f",[[17,"wcs-input",{"fireFocusEvents":[4,"fire-focus-events"],"accept":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"debounce":[2],"prefixLabel":[1,"prefix-label"],"suffixLabel":[1,"suffix-label"],"disabled":[516],"enterkeyhint":[1],"size":[513],"icon":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"multiple":[516],"name":[1],"hidePasswordButtonAriaLabel":[1,"hide-password-button-aria-label"],"showPasswordButtonAriaLabel":[1,"show-password-button-aria-label"],"pattern":[1],"placeholder":[1],"readonly":[516],"required":[516],"spellcheck":[4],"state":[513],"step":[1],"type":[1],"value":[1032],"passwordReveal":[32],"setBlur":[64],"getInputElement":[64],"setAriaAttribute":[64]},null,{"debounce":["debounceChanged"],"passwordReveal":["onPasswordRevealChange"]}]]],["p-c261eaf9",[[17,"wcs-textarea",{"fireFocusEvents":[4,"fire-focus-events"],"autocapitalize":[1],"autofocus":[4],"debounce":[2],"disabled":[516],"icon":[1],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"readonly":[516],"required":[516],"spellcheck":[4],"state":[513],"cols":[2],"rows":[2],"wrap":[1],"autoGrow":[516,"auto-grow"],"value":[1025],"resize":[513],"setAriaAttribute":[64],"fitContent":[64],"setBlur":[64],"getInputElement":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}]]],["p-828b45b4",[[1,"wcs-accordion",{"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"]},[[0,"wcsOpenChange","wcsOpenChangeHandler"]],{"hideActionText":["updateHideActiontextOnPanel"],"highlight":["updateHighlightOnPanel"],"groupContentWithHeader":["updateGroupContentWithHeader"]}]]],["p-61592f91",[[1,"wcs-accordion-content"]]],["p-439804b0",[[1,"wcs-accordion-header"]]],["p-f2eeb249",[[1,"wcs-accordion-panel",{"open":[1540],"hideActionText":[516,"hide-action-text"],"highlight":[516],"groupContentWithHeader":[516,"group-content-with-header"],"setAriaAttribute":[64],"close":[64]},null,{"open":["openChange"]}]]],["p-496115a5",[[1,"wcs-action-bar",{"gutter":[516],"hasTabs":[32]}]]],["p-781a956e",[[1,"wcs-app"]]],["p-41b946b2",[[1,"wcs-badge",{"shape":[1],"color":[1],"size":[513]}]]],["p-53a395a9",[[1,"wcs-breadcrumb-item",{"last":[4]}]]],["p-637ec45a",[[1,"wcs-card",{"mode":[1537],"orientation":[513]},null,{"orientation":["orientationChanged"]}]]],["p-5607246c",[[1,"wcs-card-body",{"orientation":[32],"setOrientation":[64]}]]],["p-98a8b806",[[1,"wcs-card-content"]]],["p-6aededc6",[[1,"wcs-card-footer"]]],["p-f929b66f",[[1,"wcs-card-header"]]],["p-cbbca016",[[1,"wcs-card-media",{"orientation":[32],"setOrientation":[64]}]]],["p-990698a7",[[1,"wcs-chip",{"value":[1],"label":[1],"selected":[516],"open":[516],"disabled":[516],"variant":[513],"mode":[513]}]]],["p-4ae08567",[[1,"wcs-com-nav",{"appName":[1,"app-name"],"mobileMenuOpen":[32],"currentActiveSizing":[32],"setAriaAttribute":[64]},[[0,"wcsClickOnFinalAction","onClickOnFinalAction"],[8,"keydown","exitMobileMenuOnKeyDown"]]]]],["p-ad286030",[[1,"wcs-com-nav-category",{"label":[1],"categoryOpen":[32],"currentActiveSizing":[32],"setAriaAttribute":[64],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsCategoryOpened","onSubmenuOpened"]]]]],["p-8332a7e3",[[1,"wcs-com-nav-item",null,[[0,"click","onClick"]]]]],["p-850fa9c9",[[1,"wcs-com-nav-submenu",{"label":[1],"panelTitle":[1,"panel-title"],"panelDescription":[1,"panel-description"],"menuOpen":[32],"currentActiveSizing":[32],"setAriaAttribute":[64],"close":[64],"open":[64]},[[8,"click","onWindowClickEvent"],[8,"wcsSubmenuOpened","onSubmenuOpened"],[8,"keydown","onEscapeKeyDown"],[0,"wcsClickOnFinalAction","wcsCategoryItemClickedHandler"]]]]],["p-c7812760",[[1,"wcs-divider"]]],["p-7de847e0",[[1,"wcs-dropdown-divider"]]],["p-367946fe",[[1,"wcs-dropdown-header"]]],["p-cad10435",[[4,"wcs-dropdown-item",null,[[1,"mouseup","onMouseUp"],[0,"keydown","onKeyDown"]]]]],["p-3a18535f",[[1,"wcs-field"]]],["p-e26c19e5",[[1,"wcs-field-content"]]],["p-c211a5d1",[[1,"wcs-field-label"]]],["p-0758d22e",[[1,"wcs-footer"]]],["p-0424e545",[[1,"wcs-galactic",{"text":[1],"show":[32]}]]],["p-18fa39f4",[[1,"wcs-grid-column",{"path":[1],"name":[1],"sort":[516],"sortFn":[16],"formatter":[16],"sortOrder":[1025,"sort-order"],"width":[1],"customCells":[516,"custom-cells"],"hidden":[516],"cursorPosition":[16],"columnPosition":[2,"column-position"],"setAriaAttribute":[64]},null,{"hidden":["parseMyObjectProp"],"sortOrder":["sortOrderChange"]}]]],["p-3823f54e",[[1,"wcs-grid-custom-cell",{"columnId":[1,"column-id"],"rowId":[8,"row-id"]}]]],["p-1e7ea63c",[[1,"wcs-header",{"setAriaAttribute":[64]}]]],["p-cbda74f6",[[1,"wcs-hint",{"small":[1540]}]]],["p-580b3142",[[0,"wcs-icon",{"icon":[1],"size":[1],"setAriaAttribute":[64]}]]],["p-e56b9ce2",[[1,"wcs-list-item",{"activated":[1540]}]]],["p-aadf37e7",[[1,"wcs-list-item-properties"]]],["p-27b438c0",[[1,"wcs-list-item-property"]]],["p-5e8fff73",[[1,"wcs-native-select",{"size":[513],"required":[516],"expanded":[32],"disabled":[32],"setAriaAttribute":[64],"updateStyles":[64]},null,{"required":["requiredChanged"]}]]],["p-9c73744c",[[1,"wcs-nav",{"setAriaAttribute":[64]}]]],["p-dff8641e",[[4,"wcs-nav-item",null,[[0,"keydown","onKeyDown"]]]]],["p-bc009574",[[1,"wcs-progress-radial",{"size":[2],"showLabel":[516,"show-label"],"value":[2],"setAriaAttribute":[64]}]]],["p-86ec9ead",[[17,"wcs-radio",{"value":[1544],"label":[1537],"disabled":[1540],"name":[1025],"mode":[513],"checked":[32],"radioTabIndex":[32],"updateState":[64],"setTabIndex":[64],"setAriaAttribute":[64]}]]],["p-fdeae83e",[[1,"wcs-radio-group",{"value":[1032],"name":[520],"mode":[513],"setAriaAttribute":[64]},[[0,"wcsRadioClick","handleRadioClick"],[0,"keydown","handleKeyDown"]],{"value":["onValueChangeHandler"],"name":["updateAllRadioModeAndName"],"mode":["updateAllRadioModeAndName"]}]]],["p-352e1f99",[[1,"wcs-skeleton-circle",{"animation":[513],"radius":[514]}]]],["p-c84ae00d",[[1,"wcs-skeleton-rectangle",{"animation":[513],"rounded":[516],"height":[513],"width":[513]}]]],["p-5202b323",[[1,"wcs-skeleton-text",{"animation":[513],"height":[1]}]]],["p-b0a6eec6",[[17,"wcs-switch",{"name":[1],"checked":[516],"labelAlignment":[513,"label-alignment"],"disabled":[516],"setAriaAttribute":[64],"getLabel":[64]},[[0,"click","handleHostClick"]]]]],["p-ad5192cd",[[1,"wcs-tab",{"header":[513],"itemKey":[8,"item-key"]}]]],["p-abd8d5a0",[[1,"wcs-tabs",{"align":[513],"selectedIndex":[2,"selected-index"],"selectedKey":[8,"selected-key"],"headersOnly":[516,"headers-only"],"gutter":[516],"description":[1],"mobileOverlayExpanded":[32],"mobile":[32],"headers":[32],"currentActiveTabIndex":[32],"setAriaAttribute":[64]},[[0,"tabLoaded","onTabLoaded"],[8,"click","onWindowClickEvent"]],{"selectedIndex":["selectedIndexChanged"],"selectedKey":["selectedTabkeyChanged"],"mobile":["onMobileChange"]}]]],["p-db7ba599",[[1,"wcs-tooltip",{"for":[1],"position":[513],"interactive":[516],"maxWidth":[8,"max-width"],"delay":[2],"duration":[2],"trigger":[1],"theme":[1],"content":[1],"appendTo":[1,"append-to"],"hide":[64],"show":[64],"disable":[64],"enable":[64]},[[8,"keydown","handleKeyDown"]],{"interactive":["updateProps"],"position":["updateProps"],"maxWidth":["updateProps"],"theme":["updateProps"],"delay":["updateProps"],"duration":["updateProps"],"trigger":["updateProps"],"content":["updateTippyContent"]}]]],["p-8152d360",[[1,"wcs-alert",{"show":[1540],"intent":[513],"timeout":[2],"showProgressBar":[4,"show-progress-bar"]},[[1,"mouseover","mouseOverHandler"],[1,"mouseout","mouseOutHandler"]]]]],["p-9fd3366c",[[1,"wcs-progress-bar",{"size":[1],"showLabel":[516,"show-label"],"value":[2],"setAriaAttribute":[64]}]]],["p-ed3b0709",[[17,"wcs-checkbox",{"name":[1],"indeterminate":[1540],"checked":[1540],"required":[4],"labelAlignment":[1537,"label-alignment"],"disabled":[516],"setAriaAttribute":[64],"getLabel":[64]},[[0,"click","handleHostClick"]]]]],["p-2221bf0c",[[4,"wcs-select-option",{"disabled":[1540],"selected":[1540],"highlighted":[1540],"value":[8],"chipColor":[1,"chip-color"],"chipBackgroundColor":[1,"chip-background-color"],"multiple":[1540]},[[1,"mouseup","onMouseUp"],[0,"keydown","handleKeydown"]]],[1,"wcs-select",{"size":[513],"value":[1032],"placeholder":[1537],"disabled":[1540],"required":[516],"multiple":[516],"autocomplete":[516],"serverMode":[516,"server-mode"],"filterFn":[16],"chips":[516],"name":[1],"compareWith":[16],"expanded":[32],"displayText":[32],"focused":[32],"showNoResultFoundLabel":[32],"autocompleteValue":[32],"overlayDirection":[32],"open":[64],"close":[64],"setAriaAttribute":[64]},[[1,"mouseup","onMouseUp"],[8,"click","onWindowClickEvent"],[0,"keydown","onKeyDown"],[0,"wcsSelectOptionClick","selectedOptionChanged"],[0,"focus","onFocus"],[2,"blur","onBlur"]],{"value":["onValueChangeHandler"]}]]],["p-9b76b8e6",[[1,"wcs-error"],[1,"wcs-form-field",{"isError":[1540,"is-error"],"hasPrefix":[32],"hasSuffix":[32],"spiedElement":[32]},null,{"isError":["isErrorChange"]}],[1,"wcs-label",{"required":[516],"setAriaAttribute":[64]}]]],["p-b28b2fba",[[1,"wcs-mat-icon",{"icon":[1],"size":[1],"family":[1],"setAriaAttribute":[64]}]]],["p-204f2722",[[17,"wcs-button",{"type":[1025],"href":[1],"target":[1],"disabled":[516],"ripple":[4],"size":[513],"shape":[513],"mode":[513],"loading":[1540],"setAriaAttribute":[64]},[[0,"click","onClick"]],{"ripple":["onRippleChange"]}],[1,"wcs-spinner",{"mode":[513]}]]]]'),e)}));
 //# sourceMappingURL=wcs.esm.js.map

package/dist/wcs/wcs.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.17.2 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,83YAAuCJ,EAAA"}
+{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.17.2 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,mhZAAuCJ,EAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "wcs-core",
-    "version": "7.2.2",
+    "version": "7.4.0",
     "description": "Web Components SNCF",
     "main": "dist/index.cjs.js",
     "module": "dist/index.js",
@@ -13,7 +13,9 @@
     "files": [
         "dist/",
         "loader/",
-        "design-tokens/dist/"
+        "design-tokens/dist/",
+        "bundle/",
+        "composite-elements/"
     ],
     "scripts": {
         "build:stencil": "stencil build",
@@ -24,11 +26,10 @@
         "generate-design-tokens": "node design-tokens/index.mjs ",
         "watch:stencil": "stencil build --dev --watch",
         "start": "npm run generate-design-tokens && concurrently --names \"Stencil,Storybook\" -c \"bgBlue.bold,bgMagenta.bold\" \"stencil build --dev --watch\" \"npm run storybook\"",
-        "test": "stencil test --spec --e2e",
-        "test:ci": "stencil test --spec --e2e --ci",
-        "test:watch": "stencil test --spec --e2e --watchAll",
-        "test:e2e": "stencil test --e2e",
-        "test:e2e:file": "stencil test --e2e --watch --",
+        "start:test": "npm run generate-design-tokens && stencil build --dev --watch --serve --no-open",
+        "test": "npm run test:playwright",
+        "test:playwright": "playwright test",
+        "test:playwright:ui": "playwright test --ui",
         "update-version": "node scripts/update-version.js",
         "update-develop": "node scripts/update-develop-from-master.js",
         "storybook": "storybook dev -p 6006",
@@ -41,22 +42,18 @@
         "@custom-elements-manifest/analyzer": "^0.8.3",
         "@ionic/eslint-config": "^0.3.0",
         "@material/ripple": "13.0.0",
+        "@playwright/test": "^1.57.0",
         "@stencil/angular-output-target": "0.8.4",
         "@stencil/core": "4.17.2",
+        "@stencil/playwright": "^0.2.1",
         "@stencil/react-output-target": "0.5.3",
         "@stencil/sass": "3.0.12",
-        "@storybook/addon-a11y": "^7.0.24",
-        "@storybook/addon-actions": "^7.0.24",
-        "@storybook/addon-docs": "^7.0.24",
-        "@storybook/addon-essentials": "^7.0.24",
-        "@storybook/addon-links": "^7.0.24",
-        "@storybook/addons": "^7.0.24",
-        "@storybook/blocks": "^7.0.24",
-        "@storybook/components": "^7.0.24",
+        "@storybook/addon-a11y": "^10.1.4",
+        "@storybook/addon-docs": "^10.1.4",
+        "@storybook/addon-links": "^10.1.4",
         "@storybook/icons": "^1.2.12",
-        "@storybook/theming": "^7.0.24",
-        "@storybook/web-components": "^7.0.24",
-        "@storybook/web-components-webpack5": "^7.0.24",
+        "@storybook/web-components-vite": "^10.1.4",
+        "@tokens-studio/sd-transforms": "^1.3.0",
         "@types/dom-inputevent": "^1.0.5",
         "@types/glob": "^7.1.3",
         "@types/jest": "^29.5.12",
@@ -70,15 +67,12 @@
         "jest-cli": "^29.7.0",
         "lit-html": "^2.6.1",
         "mdx-mermaid": "^2.0.3",
-        "puppeteer": "21.11.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
-        "storybook": "^7.0.24",
-        "tslib": "2.5.0",
-        "typescript": "4.9.5",
-        "webpack-watch-files-plugin": "^1.2.0",
+        "storybook": "^10.1.4",
         "style-dictionary": "^4.0.1",
-        "@tokens-studio/sd-transforms": "^1.3.0"
+        "tslib": "2.5.0",
+        "typescript": "4.9.5"
     },
     "dependencies": {
         "@popperjs/core": "^2.9.3",