wcs-core 4.0.2 → 4.1.0

package/dist/collection/components/select/select.js

@@ -1,5 +1,4 @@
 import { h, Host } from '@stencil/core';
-import _ from 'lodash';
 import { interpret, Machine } from 'xstate';
 import { isWcsSelectSize, WcsSelectSizeValue } from './select-interface';
 import { SelectArrow } from './select-arrow';
@@ -7,6 +6,7 @@ import { isDownArrowKey, isElement, isEnterKey, isEscapeKey, isHomeKey, isLeftAr
 import { SelectChips } from './select-chips';
 import { MDCRipple } from '@material/ripple';
 import { createPopper } from '@popperjs/core';
+import { isEqual } from 'lodash-es';
 const SELECT_MACHINE_CONFIG = {
   key: 'select',
   initial: 'closed',
@@ -52,7 +52,7 @@ export class Select {
     this.multiple = false;
     this.chips = false;
     this.name = undefined;
-    this.compareWith = (optionValue, selectedValue) => _.isEqual(optionValue, selectedValue);
+    this.compareWith = (optionValue, selectedValue) => isEqual(optionValue, selectedValue);
     this.overlayDirection = 'bottom';
   }
   /** Open the component. */
@@ -640,7 +640,7 @@ export class Select {
           "tags": [],
           "text": "Function used to compare options, default : deep comparison."
         },
-        "defaultValue": "(optionValue, selectedValue) => _.isEqual(optionValue, selectedValue)"
+        "defaultValue": "(optionValue, selectedValue) => isEqual(optionValue, selectedValue)"
       }
     };
   }

package/dist/collection/components/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    ComponentInterface,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Method,\n    Prop,\n    State,\n    Watch\n} from '@stencil/core';\n\nimport _ from 'lodash';\nimport { interpret, Interpreter, Machine, MachineConfig, MachineOptions } from 'xstate';\n\nimport { isWcsSelectSize, SelectChangeEventDetail, WcsSelectSize, WcsSelectSizeValue } from './select-interface';\nimport { SelectArrow } from './select-arrow';\nimport { SelectOptionChosedEvent, SelectOptionValue } from '../select-option/select-option-interface';\nimport {\n    isDownArrowKey,\n    isElement,\n    isEnterKey,\n    isEscapeKey,\n    isHomeKey,\n    isLeftArrowKey,\n    isPageDownKey,\n    isPageUpKey,\n    isRightArrowKey,\n    isTabKey,\n    isUpArrowKey,\n    generateUniqueId,\n    findItemLabel,\n    isSpaceKey,\n} from '../../utils/helpers';\nimport { SelectChips } from './select-chips';\nimport { MDCRipple } from '@material/ripple';\nimport { createPopper, Instance } from '@popperjs/core';\n\ninterface SelectStateSchema {\n    states: {\n        closed: {};\n        opened: {};\n    };\n}\n\ntype SelectEvent\n    = { type: 'OPEN' }\n    | { type: 'CLOSE', value: { shouldBlur?: boolean } }\n    | { type: 'CLICK' }\n    | { type: 'OPTION_SELECTED', value: SelectOptionChosedEvent };\n\nconst SELECT_MACHINE_CONFIG: MachineConfig<any, SelectStateSchema, SelectEvent> = {\n    key: 'select',\n    initial: 'closed',\n    states: {\n        closed: {\n            entry: ['close'],\n            on: {\n                CLICK: 'opened',\n                OPEN: 'opened',\n                OPTION_SELECTED: {actions: ['selectOption']}\n            },\n        },\n        opened: {\n            entry: ['open'],\n            on: {\n                CLICK: 'closed',\n                CLOSE: 'closed',\n                OPTION_SELECTED: {actions: ['selectOption']}\n            },\n        },\n    }\n};\n\n/**\n * Select component, use in conjuction with wcs-select-option.\n *\n * @example ```hmtl\n *  <wcs-select>\n *      <wcs-select-option value=\"1\">One</wcs-select-option>\n *  </wcs-select>```\n */\n@Component({\n    tag: 'wcs-select',\n    styleUrl: 'select.scss',\n    shadow: true\n})\nexport class Select implements ComponentInterface {\n    private stateService!: Interpreter<any, SelectStateSchema, SelectEvent>;\n\n    private selectId = `wcs-select-${selectIds++}`;\n    private labelElement: HTMLWcsLabelElement;\n    private optionsEl!: HTMLDivElement;\n    private optionsId = generateUniqueId(\"OPTIONS\");\n    private controlEl!: HTMLDivElement;\n\n    // Only used for multiples.\n    private values: SelectOptionValue[];\n    private lastSelectedOptionElement: HTMLWcsSelectOptionElement | null;\n    private lastFocusedOptionElement: HTMLWcsSelectOptionElement | null;\n\n    @Element() private el!: HTMLWcsSelectElement;\n\n    /** Wether the select is expanded */\n    @State()\n    private expanded = false;\n\n    /**\n     * Specify the size (height) of the select.\n     */\n    @Prop({reflect: true}) size: WcsSelectSize = 'm';\n\n    /** Wether the component is fully loaded in the DOM. */\n    @State()\n    // @ts-ignore\n    private hasLoaded = false;\n\n    /** Text to display for the selected option, when no option is selected, the value is undefined. */\n    @State()\n    private displayText: string;\n\n    /** When the host is focused. */\n    @State()\n    // @ts-ignore\n    private focused: boolean;\n\n    /** The currently selected value. */\n    @Prop({mutable: true})\n    value?: any | null;\n\n    /** The text to display when the select is empty. */\n    @Prop({mutable: true, reflect: true})\n    placeholder?: string | null;\n\n    /** If `true`, the user cannot interact with the select. */\n    @Prop({mutable: true})\n    disabled = false;\n\n    /** If `true`, the user can select multiple values at once. */\n    @Prop({reflect: true})\n    multiple = false;\n\n    /** If `true`, selected items are shown in chips mode. */\n    @Prop({reflect: true})\n    chips = false;\n\n    /** The name of the control, which is submitted with the form data. */\n    @Prop()\n    name?: string;\n\n    /** Function used to compare options, default : deep comparison. */\n    @Prop()\n    compareWith?: (optionValue: any, selectedValue: any) => boolean = (optionValue, selectedValue) => _.isEqual(optionValue, selectedValue);\n\n    private popper: Instance;\n\n    @State() private overlayDirection: 'bottom' | 'top' = 'bottom';\n\n    /** Emitted when the value has changed. */\n    @Event() wcsChange!: EventEmitter<SelectChangeEventDetail>;\n\n    /** Emitted when the select has focus. */\n    @Event() wcsFocus!: EventEmitter<void>;\n\n    /** Emitted when the select loses focus. */\n    @Event() wcsBlur!: EventEmitter<void>;\n\n    /** Open the component. */\n    @Method()\n    async open() {\n        this.stateService.send('OPEN');\n    }\n\n    /** Close the component. */\n    @Method()\n    async close() {\n        this.stateService.send('CLOSE');\n    }\n\n    @Watch('value')\n    onValueChangeHandler(newValue: any) {\n        this.updateSelectedValue(newValue);\n        this.emitChange(this.value);\n    }\n\n    private updateSelectedValue(value: any) {\n        // If no value is passed, the select is reset.\n        if (!value) {\n            this.reset();\n        }\n        if (this.multiple) {\n            // If user don't give an array, we provide one\n            if (!Array.isArray(value)) {\n                value = [value];\n            }\n            this.values = [];\n\n            this.options.forEach((opt: HTMLWcsSelectOptionElement) => {\n                const isSelected = value ?\n                    value.findIndex(v => this.compareWith(opt.value, v)) !== -1\n                    : false;\n                if (isSelected) {\n                    this.values.push({\n                        value: opt.value,\n                        displayText: opt.innerText,\n                        chipColor: opt.chipColor,\n                        chipBackgroundColor: opt.chipBackgroundColor\n                    });\n                }\n                opt.selected = isSelected;\n            });\n            // update select placeholder text\n            this.displayText = this.values.length !== 0\n                ? this.values.map(v => v.displayText).join(', ')\n                : undefined;\n        } else {\n            this.options.forEach((opt: HTMLWcsSelectOptionElement) => {\n                const isSelected = this.compareWith(opt.value, value);\n                if (isSelected) {\n                    this.displayText = opt.innerText;\n                }\n                opt.selected = isSelected;\n            });\n        }\n    }\n\n    /**\n     * Reset the select: unselects all options for multiple mode and displays the placeholder\n     * @private\n     */\n    private reset() {\n        this.values = [];\n        this.displayText = undefined;\n        this.options.forEach((opt: HTMLWcsSelectOptionElement) => {\n            opt.selected = false;\n        });\n    }\n\n    componentDidLoad() {\n        this.optionsEl = this.el.shadowRoot.querySelector('.wcs-select-options');\n        this.controlEl = this.el.shadowRoot.querySelector('.wcs-select-control');\n\n        const stateMachine = Machine(\n            SELECT_MACHINE_CONFIG,\n            this.initMachineOptions()\n        );\n        // FIXME: type checking failed...\n        // @ts-ignore\n        this.stateService = interpret(stateMachine);\n\n        if (this.multiple) {\n            this.values = [];\n        }\n\n        this.addRippleEffect();\n        this.stateService.start();\n        if (this.optionsEl.querySelector('slot') === null) {\n            this.replaceOptions_firefoxBefore63();\n            this.listenDomUpdate_firefoxBefore63();\n        }\n\n        if (this.value !== undefined) {\n            this.updateSelectedValue(this.value);\n        }\n\n        this.popper = this.createPopperInstance();\n\n        // if the select is inside a wcs-form-field, we set an id to the wcs-label if present\n        // the wcs-label element reference is kept to compute aria-label value during the rendering\n        this.labelElement = findItemLabel(this.el);\n        if (this.labelElement) {\n            this.labelElement.id = this.selectId + \"-lbl\";\n        }\n\n        // TODO: is this still usefull for anything ?\n        this.hasLoaded = true;\n    }\n\n    private createPopperInstance() {\n        return createPopper(this.controlEl, this.optionsEl, {\n            placement: \"bottom\",\n            modifiers: [\n                {\n                    name: 'offset',\n                    options: {\n                        offset: [0, 4] // we want 4px between select control and select options\n                    }\n                }\n            ]\n        });\n    }\n\n    private emitChange(newValue: any): void {\n        this.wcsChange.emit({\n            value: newValue\n        });\n    }\n\n    private replaceOptions_firefoxBefore63() {\n        Array.from(this.el.querySelectorAll('wcs-select-option'))\n            .forEach(option => {\n                if (option.parentNode === this.el) {\n                    this.el.removeChild(option);\n                    this.optionsEl.appendChild(option);\n                }\n            });\n    }\n\n    private listenDomUpdate_firefoxBefore63() {\n        const observer = new MutationObserver((mutationsList) => {\n            for (const mutation of mutationsList) {\n                if (mutation.type === 'childList') {\n                    this.replaceOptions_firefoxBefore63();\n                }\n            }\n        });\n        observer.observe(this.el, {childList: true});\n    }\n\n    componentWillLoad(): Promise<void> | void {\n        if (!isWcsSelectSize(this.size)) {\n            console.error(`Invalid size value for wcs-select : \"${this.size}\". Must be one of \"${WcsSelectSizeValue.join(', ')}\"`);\n            this.size = \"m\"; // Default fallback value\n        }\n    }\n\n    componentWillUpdate() {\n        if (this.multiple) {\n            this.options\n                .forEach((opt: HTMLWcsSelectOptionElement) => opt.multiple = true);\n        }\n    }\n\n    private get options(): HTMLWcsSelectOptionElement[] {\n        const opts = this.el?.querySelectorAll('wcs-select-option');\n        if (opts && opts.length !== 0) {\n            return opts as any as HTMLWcsSelectOptionElement[];\n        }\n        return [];\n    }\n\n    private get notDisabledOptions(): HTMLWcsSelectOptionElement[] {\n        const opts = this.el?.querySelectorAll('wcs-select-option:not([disabled])');\n        if (opts && opts.length !== 0) {\n            return opts as any as HTMLWcsSelectOptionElement[];\n        }\n        return [];\n    }\n\n    private initMachineOptions(): Partial<MachineOptions<any, SelectEvent>> {\n        return {\n            actions: {\n                open: () => {\n                    if (!this.disabled) {\n                        this.expanded = true;\n                        this.focused = false;\n                        if(this.notDisabledOptions.length > 0) {\n                            this.lastFocusedOptionElement = this.lastSelectedOptionElement ?? this.notDisabledOptions[0];\n                            requestAnimationFrame(() => {\n                                this.lastFocusedOptionElement?.focus();\n                            });\n                        }\n                    }\n                },\n                close: (_, event: SelectEvent) => {\n                    if (event.type === 'CLOSE') {\n                        if (event.value?.shouldBlur) {\n                            this.el.closest(\"wcs-select\")?.focus();\n                            this.focused = false;\n                        } else {\n                            this.el.focus();\n                            this.focused = true\n                        }\n                    }\n                    this.expanded = false;\n                },\n                selectOption: (_, event) => {\n                    if (event.type === 'OPTION_SELECTED') {\n                        this.handleClickEvent(event.value);\n                    }\n                }\n            },\n            guards: {\n                enabled: () => !this.disabled\n            }\n        };\n    }\n\n    private handleClickEvent(event: SelectOptionChosedEvent) {\n        if (this.multiple) {\n            this.handleClickOnMultiple(event);\n        } else {\n            this.handleNormalClick(event);\n        }\n    }\n\n    private handleClickOnMultiple(event: SelectOptionChosedEvent) {\n        const index = this.values.findIndex(v => v.value === event.value);\n        if (index === -1) {\n            const {value, displayText, chipColor, chipBackgroundColor} = event;\n            this.values.push({value, displayText, chipColor, chipBackgroundColor});\n            event.source.selected = true;\n            this.lastSelectedOptionElement = event.source;\n        } else {\n            event.source.selected = false;\n            this.values.splice(index, 1);\n            if (this.lastSelectedOptionElement === event.source) this.lastSelectedOptionElement = null;\n        }\n        this.updateValueWithValues();\n    }\n\n    private updateValueWithValues() {\n        this.value = this.values.map(v => v.value);\n        this.displayText = this.values.length !== 0\n            ? this.values.map(v => v.displayText).join(', ')\n            : undefined;\n    }\n\n    private handleNormalClick(event: SelectOptionChosedEvent) {\n        // Reset other options to false if they were selected.\n        this.options\n            .forEach(option => {\n                if (option.selected) option.selected = false;\n            });\n\n        event.source.selected = true;\n        this.value = event.value;\n        this.displayText = event.displayText;\n        this.lastSelectedOptionElement = event.source;\n        this.stateService.send('CLOSE');\n    }\n\n    disconnectedCallback() {\n        this.stateService?.stop();\n    }\n\n    private addRippleEffect() {\n        // TODO: wrap MDCRipple dependency so we can eventually write our own or at least decouple a bit.\n        const ripple = new MDCRipple(this.controlEl);\n        ripple.unbounded = false;\n    }\n\n    private get hasValue(): boolean {\n        // TODO: change this behavior.\n        return this.displayText !== undefined;\n    }\n\n    @Listen('mousedown')\n    onMouseDown(event: MouseEvent) {\n        const clickOnScroll = isElement(event.target)\n            && (event.offsetX > event.target.clientWidth\n                || event.offsetY > event.target.clientHeight // If the click il located bellow the component height the click happen in the overlay\n                || event.offsetY < 0); // If the click is made above the component\n\n        const clickOnRemoveChip = event.composedPath()\n            .filter(x => {\n                const el = (x as HTMLElement);\n                return el.nodeName === 'svg' && el.classList.contains('chip');\n            })\n            .length > 0;\n\n        if (!clickOnScroll && !clickOnRemoveChip) {\n            this.stateService.send('CLICK');\n        }\n    }\n\n    @Listen('click', {target: 'window'})\n    onWindowClickEvent(event: MouseEvent) {\n        const firstSelectInEventPath = event.composedPath().filter(x => (x as HTMLElement).nodeName === 'WCS-SELECT')[0];\n        const clickOnCurrentSelect = firstSelectInEventPath === this.el;\n        // TODO: Move this logic in the state machine\n        // FIXME: Doesnt work with single + disabled option\n        if (this.expanded && !clickOnCurrentSelect) {\n            this.stateService.send('CLOSE');\n        }\n    }\n\n    @Listen('keydown')\n    onKeyDown(_event: KeyboardEvent) {\n        // close\n        if (this.stateService.getSnapshot().matches(\"closed\")) {\n            if (isEnterKey(_event) || (_event.altKey && isDownArrowKey(_event)) || isSpaceKey(_event)) {\n                _event.preventDefault();\n                _event.stopPropagation();\n                this.stateService.send('OPEN');\n                return;\n            }\n            if (this.multiple) {\n                if (isDownArrowKey(_event)) {\n                    this.stateService.send('OPEN');\n                }\n            } else {\n                if (isDownArrowKey(_event) || isRightArrowKey(_event)) {\n                    _event.preventDefault();\n                    this.selectClosestOption(\"next\");\n                }\n                if (isUpArrowKey(_event) || isLeftArrowKey(_event)) {\n                    _event.preventDefault();\n                    this.selectClosestOption(\"previous\");\n                } else if (isPageDownKey(_event)) {\n                    _event.preventDefault();\n                    this.selectLastOption();\n                } else if (isPageUpKey(_event) || isHomeKey(_event)) {\n                    _event.preventDefault();\n                    this.selectFirstOption();\n                }\n            }\n        }\n        // open\n        else if (this.stateService.getSnapshot().matches(\"opened\")) {\n            if (isEscapeKey(_event) || (_event.altKey && isUpArrowKey(_event))) {\n                this.stateService.send({type: \"CLOSE\", value: {shouldBlur: false}});\n            } else if (isTabKey(_event) || (_event.shiftKey && isTabKey(_event))) {\n                this.stateService.send({type: \"CLOSE\", value: {shouldBlur: true}});\n            } else if (isDownArrowKey(_event)) {\n                _event.preventDefault();\n                this.focusClosestOption(\"next\");\n            } else if (isUpArrowKey(_event)) {\n                _event.preventDefault();\n                this.focusClosestOption(\"previous\");\n            } else if (isPageUpKey(_event) || isHomeKey(_event)) {\n                _event.preventDefault();\n                this.focusFirstOption();\n            } else if (isPageDownKey(_event)) {\n                _event.preventDefault();\n                this.focusLastOption();\n            }\n        }\n    }\n\n    private getClosestActiveOptionIndexForState(direction: 'next' | 'previous', state: 'focused' | 'selected'): number | 'nothing' {\n        let currentIndex = Array.from(this.notDisabledOptions).indexOf(state === 'focused' ? this.lastFocusedOptionElement : this.lastSelectedOptionElement);\n\n        if (direction === 'next' && currentIndex < this.notDisabledOptions.length - 1) {\n            currentIndex++;\n        } else if (direction === 'previous' && currentIndex > 0) {\n            currentIndex--;\n        } else {\n            return 'nothing';\n        }\n        return currentIndex;\n    }\n\n    private selectOption(indexToSelect: number) {\n        this.lastSelectedOptionElement = this.notDisabledOptions[indexToSelect];\n        this.lastSelectedOptionElement.selected = true;\n        this.sendOptionSelectedToStateMachine({\n            source: this.lastSelectedOptionElement,\n            value: this.value,\n            displayText: this.lastSelectedOptionElement.innerText\n        });\n    }\n\n    private selectClosestOption(direction: 'next' | 'previous'): void {\n        const indexToSelect = this.getClosestActiveOptionIndexForState(direction, 'selected');\n        if(indexToSelect === 'nothing') return;\n        this.selectOption(indexToSelect);\n    }\n\n    private selectFirstOption() {\n        if(this.notDisabledOptions.length < 1) {\n            return;\n        }\n\n        this.selectOption(0);\n    }\n\n    private selectLastOption() {\n        if(this.notDisabledOptions.length < 1) {\n            return;\n        }\n\n        this.selectOption(this.notDisabledOptions.length - 1);\n    }\n\n    private focusOption(indexToFocus: number) {\n        this.lastFocusedOptionElement = this.notDisabledOptions[indexToFocus];\n        this.lastFocusedOptionElement?.focus();\n        this.el.setAttribute(\"aria-activedescendant\", this.lastFocusedOptionElement.id);\n    }\n\n    private focusClosestOption(direction: 'next' | 'previous'): void {\n        const indexToFocus = this.getClosestActiveOptionIndexForState(direction, 'focused');\n        if(indexToFocus === 'nothing') return;\n\n        this.focusOption(indexToFocus);\n    }\n\n    private focusFirstOption() {\n        this.focusOption(0);\n    }\n\n    private focusLastOption() {\n        this.focusOption(this.notDisabledOptions.length - 1);\n    }\n\n    @Listen('wcsSelectOptionClick')\n    selectedOptionChanged(event: CustomEvent<SelectOptionChosedEvent>) {\n        this.sendOptionSelectedToStateMachine(event.detail);\n    }\n\n    sendOptionSelectedToStateMachine(event: SelectOptionChosedEvent) {\n        this.stateService.send({type: 'OPTION_SELECTED', value: event});\n    }\n\n    onSlotchange() {\n        this.updateSelectedValue(this.value);\n    }\n\n    removeChip(v: SelectOptionValue) {\n        this.options\n            .forEach(opt => {\n                if (opt.value === v.value) {\n                    this.sendOptionSelectedToStateMachine({\n                        ...v,\n                        source: opt\n                    });\n                }\n            });\n    }\n\n    componentDidRender() {\n        this.popper?.update();\n    }\n\n    render() {\n        const ariaLabelValue = `${this.labelElement ? this.labelElement.innerText : ''} ${this.hasValue ? this.displayText : ''}`.trimEnd();\n        return (\n            <Host class={this.expanded ? 'expanded ' : ''}\n                  overlayDirection={this.overlayDirection} {...this.focusedAttributes()}\n                  role=\"combobox\"\n                  aria-haspopup=\"listbox\"\n                  aria-disabled={this.disabled ? 'true' : null}\n                  aria-expanded={this.expanded ? 'true' : 'false'}\n                  aria-controls={this.optionsId}\n                  aria-owns={this.optionsId}\n                  aria-multiselectable={this.multiple ? 'true' : 'false'}\n                  aria-label={ariaLabelValue}>\n                <div class=\"wcs-select-control\">\n                    <div class=\"wcs-select-value-container\">\n                    {this.hasValue\n                        ?\n                        (this.chips ?\n                            this.values.map((option: SelectOptionValue) =>\n                                    <SelectChips disabled={this.disabled} option={option}\n                                                  onRemove={this.removeChip.bind(this)}/>\n                            )\n                            : <label class=\"wcs-select-value\">{this.displayText}</label>)\n                        : <label class=\"wcs-select-placeholder\">{this.placeholder}</label>\n                    }\n                    </div>\n                    <SelectArrow up={this.expanded}/>\n                </div>\n                <div class=\"wcs-select-options\" id={this.optionsId} role=\"listbox\">\n                    <slot name=\"wcs-select-option\" onSlotchange={this.onSlotchange.bind(this)}/>\n                </div>\n            </Host>\n        );\n    }\n\n    private focusedAttributes() {\n        return !this.disabled ? {tabIndex: 0} : {};\n    }\n}\n\nlet selectIds = 0;\n"]}
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    ComponentInterface,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Method,\n    Prop,\n    State,\n    Watch\n} from '@stencil/core';\n\nimport { interpret, Interpreter, Machine, MachineConfig, MachineOptions } from 'xstate';\nimport { isWcsSelectSize, SelectChangeEventDetail, WcsSelectSize, WcsSelectSizeValue } from './select-interface';\nimport { SelectArrow } from './select-arrow';\nimport { SelectOptionChosedEvent, SelectOptionValue } from '../select-option/select-option-interface';\nimport {\n    isDownArrowKey,\n    isElement,\n    isEnterKey,\n    isEscapeKey,\n    isHomeKey,\n    isLeftArrowKey,\n    isPageDownKey,\n    isPageUpKey,\n    isRightArrowKey,\n    isTabKey,\n    isUpArrowKey,\n    generateUniqueId,\n    findItemLabel,\n    isSpaceKey,\n} from '../../utils/helpers';\nimport { SelectChips } from './select-chips';\nimport { MDCRipple } from '@material/ripple';\nimport { createPopper, Instance } from '@popperjs/core';\nimport { isEqual } from 'lodash-es';\n\ninterface SelectStateSchema {\n    states: {\n        closed: {};\n        opened: {};\n    };\n}\n\ntype SelectEvent\n    = { type: 'OPEN' }\n    | { type: 'CLOSE', value: { shouldBlur?: boolean } }\n    | { type: 'CLICK' }\n    | { type: 'OPTION_SELECTED', value: SelectOptionChosedEvent };\n\nconst SELECT_MACHINE_CONFIG: MachineConfig<any, SelectStateSchema, SelectEvent> = {\n    key: 'select',\n    initial: 'closed',\n    states: {\n        closed: {\n            entry: ['close'],\n            on: {\n                CLICK: 'opened',\n                OPEN: 'opened',\n                OPTION_SELECTED: {actions: ['selectOption']}\n            },\n        },\n        opened: {\n            entry: ['open'],\n            on: {\n                CLICK: 'closed',\n                CLOSE: 'closed',\n                OPTION_SELECTED: {actions: ['selectOption']}\n            },\n        },\n    }\n};\n\n/**\n * Select component, use in conjuction with wcs-select-option.\n *\n * @example ```hmtl\n *  <wcs-select>\n *      <wcs-select-option value=\"1\">One</wcs-select-option>\n *  </wcs-select>```\n */\n@Component({\n    tag: 'wcs-select',\n    styleUrl: 'select.scss',\n    shadow: true\n})\nexport class Select implements ComponentInterface {\n    private stateService!: Interpreter<any, SelectStateSchema, SelectEvent>;\n\n    private selectId = `wcs-select-${selectIds++}`;\n    private labelElement: HTMLWcsLabelElement;\n    private optionsEl!: HTMLDivElement;\n    private optionsId = generateUniqueId(\"OPTIONS\");\n    private controlEl!: HTMLDivElement;\n\n    // Only used for multiples.\n    private values: SelectOptionValue[];\n    private lastSelectedOptionElement: HTMLWcsSelectOptionElement | null;\n    private lastFocusedOptionElement: HTMLWcsSelectOptionElement | null;\n\n    @Element() private el!: HTMLWcsSelectElement;\n\n    /** Wether the select is expanded */\n    @State()\n    private expanded = false;\n\n    /**\n     * Specify the size (height) of the select.\n     */\n    @Prop({reflect: true}) size: WcsSelectSize = 'm';\n\n    /** Wether the component is fully loaded in the DOM. */\n    @State()\n    // @ts-ignore\n    private hasLoaded = false;\n\n    /** Text to display for the selected option, when no option is selected, the value is undefined. */\n    @State()\n    private displayText: string;\n\n    /** When the host is focused. */\n    @State()\n    // @ts-ignore\n    private focused: boolean;\n\n    /** The currently selected value. */\n    @Prop({mutable: true})\n    value?: any | null;\n\n    /** The text to display when the select is empty. */\n    @Prop({mutable: true, reflect: true})\n    placeholder?: string | null;\n\n    /** If `true`, the user cannot interact with the select. */\n    @Prop({mutable: true})\n    disabled = false;\n\n    /** If `true`, the user can select multiple values at once. */\n    @Prop({reflect: true})\n    multiple = false;\n\n    /** If `true`, selected items are shown in chips mode. */\n    @Prop({reflect: true})\n    chips = false;\n\n    /** The name of the control, which is submitted with the form data. */\n    @Prop()\n    name?: string;\n\n    /** Function used to compare options, default : deep comparison. */\n    @Prop()\n    compareWith?: (optionValue: any, selectedValue: any) => boolean = (optionValue, selectedValue) => isEqual(optionValue, selectedValue);\n\n    private popper: Instance;\n\n    @State() private overlayDirection: 'bottom' | 'top' = 'bottom';\n\n    /** Emitted when the value has changed. */\n    @Event() wcsChange!: EventEmitter<SelectChangeEventDetail>;\n\n    /** Emitted when the select has focus. */\n    @Event() wcsFocus!: EventEmitter<void>;\n\n    /** Emitted when the select loses focus. */\n    @Event() wcsBlur!: EventEmitter<void>;\n\n    /** Open the component. */\n    @Method()\n    async open() {\n        this.stateService.send('OPEN');\n    }\n\n    /** Close the component. */\n    @Method()\n    async close() {\n        this.stateService.send('CLOSE');\n    }\n\n    @Watch('value')\n    onValueChangeHandler(newValue: any) {\n        this.updateSelectedValue(newValue);\n        this.emitChange(this.value);\n    }\n\n    private updateSelectedValue(value: any) {\n        // If no value is passed, the select is reset.\n        if (!value) {\n            this.reset();\n        }\n        if (this.multiple) {\n            // If user don't give an array, we provide one\n            if (!Array.isArray(value)) {\n                value = [value];\n            }\n            this.values = [];\n\n            this.options.forEach((opt: HTMLWcsSelectOptionElement) => {\n                const isSelected = value ?\n                    value.findIndex(v => this.compareWith(opt.value, v)) !== -1\n                    : false;\n                if (isSelected) {\n                    this.values.push({\n                        value: opt.value,\n                        displayText: opt.innerText,\n                        chipColor: opt.chipColor,\n                        chipBackgroundColor: opt.chipBackgroundColor\n                    });\n                }\n                opt.selected = isSelected;\n            });\n            // update select placeholder text\n            this.displayText = this.values.length !== 0\n                ? this.values.map(v => v.displayText).join(', ')\n                : undefined;\n        } else {\n            this.options.forEach((opt: HTMLWcsSelectOptionElement) => {\n                const isSelected = this.compareWith(opt.value, value);\n                if (isSelected) {\n                    this.displayText = opt.innerText;\n                }\n                opt.selected = isSelected;\n            });\n        }\n    }\n\n    /**\n     * Reset the select: unselects all options for multiple mode and displays the placeholder\n     * @private\n     */\n    private reset() {\n        this.values = [];\n        this.displayText = undefined;\n        this.options.forEach((opt: HTMLWcsSelectOptionElement) => {\n            opt.selected = false;\n        });\n    }\n\n    componentDidLoad() {\n        this.optionsEl = this.el.shadowRoot.querySelector('.wcs-select-options');\n        this.controlEl = this.el.shadowRoot.querySelector('.wcs-select-control');\n\n        const stateMachine = Machine(\n            SELECT_MACHINE_CONFIG,\n            this.initMachineOptions()\n        );\n        // FIXME: type checking failed...\n        // @ts-ignore\n        this.stateService = interpret(stateMachine);\n\n        if (this.multiple) {\n            this.values = [];\n        }\n\n        this.addRippleEffect();\n        this.stateService.start();\n        if (this.optionsEl.querySelector('slot') === null) {\n            this.replaceOptions_firefoxBefore63();\n            this.listenDomUpdate_firefoxBefore63();\n        }\n\n        if (this.value !== undefined) {\n            this.updateSelectedValue(this.value);\n        }\n\n        this.popper = this.createPopperInstance();\n\n        // if the select is inside a wcs-form-field, we set an id to the wcs-label if present\n        // the wcs-label element reference is kept to compute aria-label value during the rendering\n        this.labelElement = findItemLabel(this.el);\n        if (this.labelElement) {\n            this.labelElement.id = this.selectId + \"-lbl\";\n        }\n\n        // TODO: is this still usefull for anything ?\n        this.hasLoaded = true;\n    }\n\n    private createPopperInstance() {\n        return createPopper(this.controlEl, this.optionsEl, {\n            placement: \"bottom\",\n            modifiers: [\n                {\n                    name: 'offset',\n                    options: {\n                        offset: [0, 4] // we want 4px between select control and select options\n                    }\n                }\n            ]\n        });\n    }\n\n    private emitChange(newValue: any): void {\n        this.wcsChange.emit({\n            value: newValue\n        });\n    }\n\n    private replaceOptions_firefoxBefore63() {\n        Array.from(this.el.querySelectorAll('wcs-select-option'))\n            .forEach(option => {\n                if (option.parentNode === this.el) {\n                    this.el.removeChild(option);\n                    this.optionsEl.appendChild(option);\n                }\n            });\n    }\n\n    private listenDomUpdate_firefoxBefore63() {\n        const observer = new MutationObserver((mutationsList) => {\n            for (const mutation of mutationsList) {\n                if (mutation.type === 'childList') {\n                    this.replaceOptions_firefoxBefore63();\n                }\n            }\n        });\n        observer.observe(this.el, {childList: true});\n    }\n\n    componentWillLoad(): Promise<void> | void {\n        if (!isWcsSelectSize(this.size)) {\n            console.error(`Invalid size value for wcs-select : \"${this.size}\". Must be one of \"${WcsSelectSizeValue.join(', ')}\"`);\n            this.size = \"m\"; // Default fallback value\n        }\n    }\n\n    componentWillUpdate() {\n        if (this.multiple) {\n            this.options\n                .forEach((opt: HTMLWcsSelectOptionElement) => opt.multiple = true);\n        }\n    }\n\n    private get options(): HTMLWcsSelectOptionElement[] {\n        const opts = this.el?.querySelectorAll('wcs-select-option');\n        if (opts && opts.length !== 0) {\n            return opts as any as HTMLWcsSelectOptionElement[];\n        }\n        return [];\n    }\n\n    private get notDisabledOptions(): HTMLWcsSelectOptionElement[] {\n        const opts = this.el?.querySelectorAll('wcs-select-option:not([disabled])');\n        if (opts && opts.length !== 0) {\n            return opts as any as HTMLWcsSelectOptionElement[];\n        }\n        return [];\n    }\n\n    private initMachineOptions(): Partial<MachineOptions<any, SelectEvent>> {\n        return {\n            actions: {\n                open: () => {\n                    if (!this.disabled) {\n                        this.expanded = true;\n                        this.focused = false;\n                        if(this.notDisabledOptions.length > 0) {\n                            this.lastFocusedOptionElement = this.lastSelectedOptionElement ?? this.notDisabledOptions[0];\n                            requestAnimationFrame(() => {\n                                this.lastFocusedOptionElement?.focus();\n                            });\n                        }\n                    }\n                },\n                close: (_, event: SelectEvent) => {\n                    if (event.type === 'CLOSE') {\n                        if (event.value?.shouldBlur) {\n                            this.el.closest(\"wcs-select\")?.focus();\n                            this.focused = false;\n                        } else {\n                            this.el.focus();\n                            this.focused = true\n                        }\n                    }\n                    this.expanded = false;\n                },\n                selectOption: (_, event) => {\n                    if (event.type === 'OPTION_SELECTED') {\n                        this.handleClickEvent(event.value);\n                    }\n                }\n            },\n            guards: {\n                enabled: () => !this.disabled\n            }\n        };\n    }\n\n    private handleClickEvent(event: SelectOptionChosedEvent) {\n        if (this.multiple) {\n            this.handleClickOnMultiple(event);\n        } else {\n            this.handleNormalClick(event);\n        }\n    }\n\n    private handleClickOnMultiple(event: SelectOptionChosedEvent) {\n        const index = this.values.findIndex(v => v.value === event.value);\n        if (index === -1) {\n            const {value, displayText, chipColor, chipBackgroundColor} = event;\n            this.values.push({value, displayText, chipColor, chipBackgroundColor});\n            event.source.selected = true;\n            this.lastSelectedOptionElement = event.source;\n        } else {\n            event.source.selected = false;\n            this.values.splice(index, 1);\n            if (this.lastSelectedOptionElement === event.source) this.lastSelectedOptionElement = null;\n        }\n        this.updateValueWithValues();\n    }\n\n    private updateValueWithValues() {\n        this.value = this.values.map(v => v.value);\n        this.displayText = this.values.length !== 0\n            ? this.values.map(v => v.displayText).join(', ')\n            : undefined;\n    }\n\n    private handleNormalClick(event: SelectOptionChosedEvent) {\n        // Reset other options to false if they were selected.\n        this.options\n            .forEach(option => {\n                if (option.selected) option.selected = false;\n            });\n\n        event.source.selected = true;\n        this.value = event.value;\n        this.displayText = event.displayText;\n        this.lastSelectedOptionElement = event.source;\n        this.stateService.send('CLOSE');\n    }\n\n    disconnectedCallback() {\n        this.stateService?.stop();\n    }\n\n    private addRippleEffect() {\n        // TODO: wrap MDCRipple dependency so we can eventually write our own or at least decouple a bit.\n        const ripple = new MDCRipple(this.controlEl);\n        ripple.unbounded = false;\n    }\n\n    private get hasValue(): boolean {\n        // TODO: change this behavior.\n        return this.displayText !== undefined;\n    }\n\n    @Listen('mousedown')\n    onMouseDown(event: MouseEvent) {\n        const clickOnScroll = isElement(event.target)\n            && (event.offsetX > event.target.clientWidth\n                || event.offsetY > event.target.clientHeight // If the click il located bellow the component height the click happen in the overlay\n                || event.offsetY < 0); // If the click is made above the component\n\n        const clickOnRemoveChip = event.composedPath()\n            .filter(x => {\n                const el = (x as HTMLElement);\n                return el.nodeName === 'svg' && el.classList.contains('chip');\n            })\n            .length > 0;\n\n        if (!clickOnScroll && !clickOnRemoveChip) {\n            this.stateService.send('CLICK');\n        }\n    }\n\n    @Listen('click', {target: 'window'})\n    onWindowClickEvent(event: MouseEvent) {\n        const firstSelectInEventPath = event.composedPath().filter(x => (x as HTMLElement).nodeName === 'WCS-SELECT')[0];\n        const clickOnCurrentSelect = firstSelectInEventPath === this.el;\n        // TODO: Move this logic in the state machine\n        // FIXME: Doesnt work with single + disabled option\n        if (this.expanded && !clickOnCurrentSelect) {\n            this.stateService.send('CLOSE');\n        }\n    }\n\n    @Listen('keydown')\n    onKeyDown(_event: KeyboardEvent) {\n        // close\n        if (this.stateService.getSnapshot().matches(\"closed\")) {\n            if (isEnterKey(_event) || (_event.altKey && isDownArrowKey(_event)) || isSpaceKey(_event)) {\n                _event.preventDefault();\n                _event.stopPropagation();\n                this.stateService.send('OPEN');\n                return;\n            }\n            if (this.multiple) {\n                if (isDownArrowKey(_event)) {\n                    this.stateService.send('OPEN');\n                }\n            } else {\n                if (isDownArrowKey(_event) || isRightArrowKey(_event)) {\n                    _event.preventDefault();\n                    this.selectClosestOption(\"next\");\n                }\n                if (isUpArrowKey(_event) || isLeftArrowKey(_event)) {\n                    _event.preventDefault();\n                    this.selectClosestOption(\"previous\");\n                } else if (isPageDownKey(_event)) {\n                    _event.preventDefault();\n                    this.selectLastOption();\n                } else if (isPageUpKey(_event) || isHomeKey(_event)) {\n                    _event.preventDefault();\n                    this.selectFirstOption();\n                }\n            }\n        }\n        // open\n        else if (this.stateService.getSnapshot().matches(\"opened\")) {\n            if (isEscapeKey(_event) || (_event.altKey && isUpArrowKey(_event))) {\n                this.stateService.send({type: \"CLOSE\", value: {shouldBlur: false}});\n            } else if (isTabKey(_event) || (_event.shiftKey && isTabKey(_event))) {\n                this.stateService.send({type: \"CLOSE\", value: {shouldBlur: true}});\n            } else if (isDownArrowKey(_event)) {\n                _event.preventDefault();\n                this.focusClosestOption(\"next\");\n            } else if (isUpArrowKey(_event)) {\n                _event.preventDefault();\n                this.focusClosestOption(\"previous\");\n            } else if (isPageUpKey(_event) || isHomeKey(_event)) {\n                _event.preventDefault();\n                this.focusFirstOption();\n            } else if (isPageDownKey(_event)) {\n                _event.preventDefault();\n                this.focusLastOption();\n            }\n        }\n    }\n\n    private getClosestActiveOptionIndexForState(direction: 'next' | 'previous', state: 'focused' | 'selected'): number | 'nothing' {\n        let currentIndex = Array.from(this.notDisabledOptions).indexOf(state === 'focused' ? this.lastFocusedOptionElement : this.lastSelectedOptionElement);\n\n        if (direction === 'next' && currentIndex < this.notDisabledOptions.length - 1) {\n            currentIndex++;\n        } else if (direction === 'previous' && currentIndex > 0) {\n            currentIndex--;\n        } else {\n            return 'nothing';\n        }\n        return currentIndex;\n    }\n\n    private selectOption(indexToSelect: number) {\n        this.lastSelectedOptionElement = this.notDisabledOptions[indexToSelect];\n        this.lastSelectedOptionElement.selected = true;\n        this.sendOptionSelectedToStateMachine({\n            source: this.lastSelectedOptionElement,\n            value: this.value,\n            displayText: this.lastSelectedOptionElement.innerText\n        });\n    }\n\n    private selectClosestOption(direction: 'next' | 'previous'): void {\n        const indexToSelect = this.getClosestActiveOptionIndexForState(direction, 'selected');\n        if(indexToSelect === 'nothing') return;\n        this.selectOption(indexToSelect);\n    }\n\n    private selectFirstOption() {\n        if(this.notDisabledOptions.length < 1) {\n            return;\n        }\n\n        this.selectOption(0);\n    }\n\n    private selectLastOption() {\n        if(this.notDisabledOptions.length < 1) {\n            return;\n        }\n\n        this.selectOption(this.notDisabledOptions.length - 1);\n    }\n\n    private focusOption(indexToFocus: number) {\n        this.lastFocusedOptionElement = this.notDisabledOptions[indexToFocus];\n        this.lastFocusedOptionElement?.focus();\n        this.el.setAttribute(\"aria-activedescendant\", this.lastFocusedOptionElement.id);\n    }\n\n    private focusClosestOption(direction: 'next' | 'previous'): void {\n        const indexToFocus = this.getClosestActiveOptionIndexForState(direction, 'focused');\n        if(indexToFocus === 'nothing') return;\n\n        this.focusOption(indexToFocus);\n    }\n\n    private focusFirstOption() {\n        this.focusOption(0);\n    }\n\n    private focusLastOption() {\n        this.focusOption(this.notDisabledOptions.length - 1);\n    }\n\n    @Listen('wcsSelectOptionClick')\n    selectedOptionChanged(event: CustomEvent<SelectOptionChosedEvent>) {\n        this.sendOptionSelectedToStateMachine(event.detail);\n    }\n\n    sendOptionSelectedToStateMachine(event: SelectOptionChosedEvent) {\n        this.stateService.send({type: 'OPTION_SELECTED', value: event});\n    }\n\n    onSlotchange() {\n        this.updateSelectedValue(this.value);\n    }\n\n    removeChip(v: SelectOptionValue) {\n        this.options\n            .forEach(opt => {\n                if (opt.value === v.value) {\n                    this.sendOptionSelectedToStateMachine({\n                        ...v,\n                        source: opt\n                    });\n                }\n            });\n    }\n\n    componentDidRender() {\n        this.popper?.update();\n    }\n\n    render() {\n        const ariaLabelValue = `${this.labelElement ? this.labelElement.innerText : ''} ${this.hasValue ? this.displayText : ''}`.trimEnd();\n        return (\n            <Host class={this.expanded ? 'expanded ' : ''}\n                  overlayDirection={this.overlayDirection} {...this.focusedAttributes()}\n                  role=\"combobox\"\n                  aria-haspopup=\"listbox\"\n                  aria-disabled={this.disabled ? 'true' : null}\n                  aria-expanded={this.expanded ? 'true' : 'false'}\n                  aria-controls={this.optionsId}\n                  aria-owns={this.optionsId}\n                  aria-multiselectable={this.multiple ? 'true' : 'false'}\n                  aria-label={ariaLabelValue}>\n                <div class=\"wcs-select-control\">\n                    <div class=\"wcs-select-value-container\">\n                    {this.hasValue\n                        ?\n                        (this.chips ?\n                            this.values.map((option: SelectOptionValue) =>\n                                    <SelectChips disabled={this.disabled} option={option}\n                                                  onRemove={this.removeChip.bind(this)}/>\n                            )\n                            : <label class=\"wcs-select-value\">{this.displayText}</label>)\n                        : <label class=\"wcs-select-placeholder\">{this.placeholder}</label>\n                    }\n                    </div>\n                    <SelectArrow up={this.expanded}/>\n                </div>\n                <div class=\"wcs-select-options\" id={this.optionsId} role=\"listbox\">\n                    <slot name=\"wcs-select-option\" onSlotchange={this.onSlotchange.bind(this)}/>\n                </div>\n            </Host>\n        );\n    }\n\n    private focusedAttributes() {\n        return !this.disabled ? {tabIndex: 0} : {};\n    }\n}\n\nlet selectIds = 0;\n"]}

package/dist/collection/components/skeleton/skeleton-interface.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=skeleton-interface.js.map

package/dist/collection/components/skeleton/skeleton-interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton-interface.js","sourceRoot":"","sources":["../../../src/components/skeleton/skeleton-interface.ts"],"names":[],"mappings":"","sourcesContent":["export type WcsSkeletonAnimation = 'none' | 'glide' | 'pulse';\n"]}

package/dist/collection/components/skeleton-circle/skeleton-circle.css

@@ -0,0 +1,47 @@
+:host {
+  display: block;
+  position: relative;
+  overflow: hidden;
+}
+:host span {
+  display: flex;
+  flex: 1 1 auto;
+  height: 100%;
+  width: 100%;
+  min-height: 1rem;
+  background: #ededed;
+  background: linear-gradient(90deg, rgba(0, 0, 0, 0.06) 25%, rgba(0, 0, 0, 0.15) 37%, rgba(0, 0, 0, 0.06) 63%);
+  background-size: 400% 100%;
+}
+
+:host([animation=glide]) span {
+  animation: glide 1.5s ease-in-out 0.5s infinite;
+}
+
+:host([animation=pulse]) {
+  animation: pulse 1.5s ease-in-out 0.5s infinite;
+}
+
+@keyframes glide {
+  from {
+    background-position: 100% 50%;
+  }
+  to {
+    background-position: 0 50%;
+  }
+}
+@keyframes pulse {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+:host {
+  aspect-ratio: 1/1;
+  border-radius: 999rem;
+}

package/dist/collection/components/skeleton-circle/skeleton-circle.js

@@ -0,0 +1,71 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Use a skeleton circle as a placeholder round images, illustrations or components
+ */
+export class SkeletonCircle {
+  constructor() {
+    this.animation = 'glide';
+    this.radius = 50;
+  }
+  render() {
+    return (h(Host, { style: { width: `${this.radius}px`, height: `${this.radius}px` } }, h("span", { "aria-hidden": "true" })));
+  }
+  static get is() { return "wcs-skeleton-circle"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["skeleton-circle.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["skeleton-circle.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "animation": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "WcsSkeletonAnimation",
+          "resolved": "\"glide\" | \"none\" | \"pulse\"",
+          "references": {
+            "WcsSkeletonAnimation": {
+              "location": "import",
+              "path": "../skeleton/skeleton-interface"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the animation of the skeleton"
+        },
+        "attribute": "animation",
+        "reflect": true,
+        "defaultValue": "'glide'"
+      },
+      "radius": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the radius of the circle in px"
+        },
+        "attribute": "radius",
+        "reflect": true,
+        "defaultValue": "50"
+      }
+    };
+  }
+}
+//# sourceMappingURL=skeleton-circle.js.map

package/dist/collection/components/skeleton-circle/skeleton-circle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton-circle.js","sourceRoot":"","sources":["../../../src/components/skeleton-circle/skeleton-circle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAsB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAG7E;;GAEG;AAMH,MAAM,OAAO,cAAc;;qBAKkC,OAAO;kBAKxB,EAAE;;EAE1C,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAE,EAAC,KAAK,EAAE,GAAG,IAAI,CAAC,MAAM,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,IAAI,EAAC;MAChE,2BAAkB,MAAM,GAAQ,CAC7B,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEJ","sourcesContent":["import { Component, ComponentInterface, h, Host, Prop } from \"@stencil/core\";\nimport { WcsSkeletonAnimation } from \"../skeleton/skeleton-interface\";\n\n/**\n * Use a skeleton circle as a placeholder round images, illustrations or components\n */\n@Component({\n    tag: 'wcs-skeleton-circle',\n    styleUrl: 'skeleton-circle.scss',\n    shadow: true\n})\nexport class SkeletonCircle implements ComponentInterface {\n\n    /**\n     * Specifies the animation of the skeleton\n     */\n    @Prop({reflect: true}) animation: WcsSkeletonAnimation = 'glide';\n\n    /**\n     * Specifies the radius of the circle in px\n     */\n    @Prop({reflect: true}) radius: number = 50;\n\n    render() {\n        return (\n            <Host style={{width: `${this.radius}px`, height: `${this.radius}px`}}>\n                <span aria-hidden=\"true\"></span>\n            </Host>\n        );\n    }\n\n}\n"]}

package/dist/collection/components/skeleton-rectangle/skeleton-rectangle.css

@@ -0,0 +1,53 @@
+:host {
+  display: block;
+  position: relative;
+  overflow: hidden;
+}
+:host span {
+  display: flex;
+  flex: 1 1 auto;
+  height: 100%;
+  width: 100%;
+  min-height: 1rem;
+  background: #ededed;
+  background: linear-gradient(90deg, rgba(0, 0, 0, 0.06) 25%, rgba(0, 0, 0, 0.15) 37%, rgba(0, 0, 0, 0.06) 63%);
+  background-size: 400% 100%;
+}
+
+:host([animation=glide]) span {
+  animation: glide 1.5s ease-in-out 0.5s infinite;
+}
+
+:host([animation=pulse]) {
+  animation: pulse 1.5s ease-in-out 0.5s infinite;
+}
+
+@keyframes glide {
+  from {
+    background-position: 100% 50%;
+  }
+  to {
+    background-position: 0 50%;
+  }
+}
+@keyframes pulse {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+:host {
+  --wcs-skeleton-border-radius: 0rem;
+}
+:host span {
+  border-radius: var(--wcs-skeleton-border-radius);
+}
+
+:host([rounded]) {
+  --wcs-skeleton-border-radius: 0.5rem;
+}

package/dist/collection/components/skeleton-rectangle/skeleton-rectangle.js

@@ -0,0 +1,121 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Use a skeleton rectangle as a placeholder for large images or square-shaped components
+ *
+ * @cssprop --wcs-skeleton-border-radius - Controls the border-radius of the 'rounded' skeleton rectangle (default 0.5rem)
+ */
+export class SkeletonRectangle {
+  constructor() {
+    this.animation = 'glide';
+    this.rounded = false;
+    this.height = 'auto';
+    this.width = 'auto';
+  }
+  render() {
+    return (h(Host, { style: { height: this.height, width: this.width } }, h("span", null)));
+  }
+  static get is() { return "wcs-skeleton-rectangle"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["skeleton-rectangle.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["skeleton-rectangle.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "animation": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "WcsSkeletonAnimation",
+          "resolved": "\"glide\" | \"none\" | \"pulse\"",
+          "references": {
+            "WcsSkeletonAnimation": {
+              "location": "import",
+              "path": "../skeleton/skeleton-interface"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the animation of the skeleton"
+        },
+        "attribute": "animation",
+        "reflect": true,
+        "defaultValue": "'glide'"
+      },
+      "rounded": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Adds a border radius on the skeleton if true"
+        },
+        "attribute": "rounded",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "height": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "CssTypes.Height",
+          "resolved": "LengthOrPercentage | Keyword | Global",
+          "references": {
+            "CssTypes": {
+              "location": "import",
+              "path": "../../shared-types"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the height of the skeleton (can be any valid CSS value)"
+        },
+        "attribute": "height",
+        "reflect": true,
+        "defaultValue": "'auto'"
+      },
+      "width": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "CssTypes.Width",
+          "resolved": "LengthOrPercentage | Keyword | Global",
+          "references": {
+            "CssTypes": {
+              "location": "import",
+              "path": "../../shared-types"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Specifies the width of the skeleton (can be any valid CSS value)"
+        },
+        "attribute": "width",
+        "reflect": true,
+        "defaultValue": "'auto'"
+      }
+    };
+  }
+}
+//# sourceMappingURL=skeleton-rectangle.js.map

package/dist/collection/components/skeleton-rectangle/skeleton-rectangle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton-rectangle.js","sourceRoot":"","sources":["../../../src/components/skeleton-rectangle/skeleton-rectangle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAsB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAI7E;;;;GAIG;AAMH,MAAM,OAAO,iBAAiB;;qBAK+B,OAAO;mBAKtB,KAAK;kBAKE,MAAM;iBAKR,MAAM;;EAErD,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAE,EAAC,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAC;MACjD,eAAa,CACV,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEJ","sourcesContent":["import { Component, ComponentInterface, h, Host, Prop } from \"@stencil/core\";\nimport { WcsSkeletonAnimation } from \"../skeleton/skeleton-interface\";\nimport { CssTypes } from \"../../shared-types\";\n\n/**\n * Use a skeleton rectangle as a placeholder for large images or square-shaped components\n *\n * @cssprop --wcs-skeleton-border-radius - Controls the border-radius of the 'rounded' skeleton rectangle (default 0.5rem)\n */\n@Component({\n    tag: 'wcs-skeleton-rectangle',\n    styleUrl: 'skeleton-rectangle.scss',\n    shadow: true\n})\nexport class SkeletonRectangle implements ComponentInterface {\n\n    /**\n     * Specifies the animation of the skeleton\n     */\n    @Prop({reflect: true}) animation: WcsSkeletonAnimation = 'glide';\n\n    /**\n     * Adds a border radius on the skeleton if true\n     */\n    @Prop({reflect: true}) rounded: boolean = false;\n    \n    /**\n     * Specifies the height of the skeleton (can be any valid CSS value)\n     */\n    @Prop({reflect: true}) height: CssTypes.Height = 'auto';\n    \n    /**\n     * Specifies the width of the skeleton (can be any valid CSS value)\n     */\n    @Prop({reflect: true}) width: CssTypes.Width = 'auto';\n\n    render() {\n        return (\n            <Host style={{height: this.height, width: this.width}}>\n                <span></span>\n            </Host>\n        );\n    }\n\n}\n"]}

package/dist/collection/components/skeleton-text/skeleton-text.css

@@ -0,0 +1,62 @@
+:host {
+  display: block;
+  position: relative;
+  overflow: hidden;
+}
+:host span {
+  display: flex;
+  flex: 1 1 auto;
+  height: 100%;
+  width: 100%;
+  min-height: 1rem;
+  background: #ededed;
+  background: linear-gradient(90deg, rgba(0, 0, 0, 0.06) 25%, rgba(0, 0, 0, 0.15) 37%, rgba(0, 0, 0, 0.06) 63%);
+  background-size: 400% 100%;
+}
+
+:host([animation=glide]) span {
+  animation: glide 1.5s ease-in-out 0.5s infinite;
+}
+
+:host([animation=pulse]) {
+  animation: pulse 1.5s ease-in-out 0.5s infinite;
+}
+
+@keyframes glide {
+  from {
+    background-position: 100% 50%;
+  }
+  to {
+    background-position: 0 50%;
+  }
+}
+@keyframes pulse {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+:host([height=h1]) {
+  height: 42px;
+}
+
+:host([height=h2]) {
+  height: 36px;
+}
+
+:host([height=h3]) {
+  height: 30px;
+}
+
+:host([height=caption]) {
+  height: 24px;
+}
+
+:host([height=body]) {
+  height: 16px;
+}