npm - wabtec-internal-volt-basic-components - Versions diffs - 1.2.0 → 1.4.0 - Mend

wabtec-internal-volt-basic-components 1.2.0 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1043) hide show

package/dist/collection/components/autocomplete-item/vds-autocomplete-item.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-autocomplete-item.stories.js","sourceRoot":"","sources":["../../../src/components/autocomplete-item/vds-autocomplete-item.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { getIconsFromSpriteFile } from \"../../utils/icon-utils\";\n\nconst ICON_LIST = getIconsFromSpriteFile();\n\nexport default {\n title: 'VDS/Components/Autocomplete/Item',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=29041-11385\"\n }\n },\n argTypes: {\n size: {\n options: [\"small\", \"medium\", \"large\"],\n control: { type: \"select\" }\n },\n informativeIcon: {\n options: [...ICON_LIST, undefined],\n control: { type: \"select\" }\n },\n checkmarkVariant: {\n options: [\"checkbox\", \"checkmark\"],\n control: { type: \"select\" }\n },\n checkmarkAlignment: {\n options: [\"start\", \"end\"],\n control: { type: \"select\" }\n },\n },\n};\n\nconst style = `\n<style>\n .container {\n width: 500px;\n padding: 10px;\n margin: auto;\n }\n</style>\n`\n\nconst codeTemplate = (args) => {\n return `\n${style}\n<div class=\"container\">\n <vds-autocomplete-item\n size=\"${args.size}\"\n disabled=\"${args.disabled}\"\n ${args.informativeIcon ? `informative-icon=\"${args.informativeIcon}\"` : \"\"}\n value=\"${args.value}\"\n label=\"${args.label}\"\n set-aria-label=\"${args.setAriaLabel}\"\n has-checkmark=\"${args.hasCheckmark}\"\n checkmark-variant=\"${args.checkmarkVariant}\"\n checkmark-alignment=\"${args.checkmarkAlignment}\"\n danger=\"${args.danger}\"\n is-active=\"${args.isActive}\"\n is-selected=\"${args.isSelected}\"\n ></vds-autocomplete-item>\n</div>\n`;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n size: \"medium\",\n label: \"Item\",\n value: \"Item\",\n setAriaLabel: \"Item\",\n disabled: false,\n informativeIcon: \"add\",\n hasCheckmark: false,\n checkmarkVariant: \"checkmark\",\n checkmarkAlignment: \"start\",\n isActive: false,\n danger: false,\n isSelected: false\n}\n\n\nconst codeCheckboxTemplate = (args) => {\n return `\n ${style}\n <div class=\"container\">\n <vds-autocomplete-item\n size=\"${args.size}\"\n disabled=\"${args.disabled}\"\n ${args.informativeIcon ? `informative-icon=\"${args.informativeIcon}\"` : \"\"}\n value=\"${args.value}\"\n label=\"${args.label}\"\n set-aria-label=\"${args.setAriaLabel}\"\n has-checkmark=\"${args.hasCheckmark}\"\n checkmark-variant=\"${args.checkmarkVariant}\"\n checkmark-alignment=\"${args.checkmarkAlignment}\"\n danger=\"${args.danger}\"\n is-selected=\"${args.isSelected}\"\n ></vds-autocomplete-item>\n </div>\n`;\n}\n\nexport const BasicCheckboxUsage = codeCheckboxTemplate.bind({});\n\nBasicCheckboxUsage.args = {\n size: \"medium\",\n label: \"Item with checkbox\",\n value: \"Item\",\n setAriaLabel: \"Item\",\n disabled: false,\n informativeIcon: \"add\",\n hasCheckmark: true,\n checkmarkVariant: \"checkbox\",\n checkmarkAlignment: \"end\",\n danger: false,\n isSelected: true\n}"]}

package/dist/collection/components/avatar/vds-avatar.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-avatar.js","sourceRoot":"","sources":["../../../src/components/avatar/vds-avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\n\n@Component({\n tag: 'vds-avatar',\n styleUrl: 'vds-avatar.scss',\n shadow: true,\n})\nexport class VdsAvatar {\n /**\n * This property can receive:\n * - Fullname to show the first letters inside the avatar.\n * - Url of image.\n * - +XX format for showing the number of additional users. Caps at +99.\n */\n @Prop() value: string;\n /** Set icon size in px or rem, IE: 32px or 1.25rem */\n @Prop() size: string = '20px';\n /**\n * Name of the icon to show as overlay on hover. If not set, no overlay is shown.\n */\n @Prop() overlayIcon?: string;\n\n setBackground: boolean;\n\n private getNumberFormat(number: string): string {\n const numValue = parseInt(number.substring(1), 10);\n if (numValue > 99) {\n return '+99';\n }\n return '+' + numValue;\n }\n\n private getNameInitials(name: string): string {\n const parts = name.split(' ');\n const firstInitial = parts[0].charAt(0);\n const lastInitial = parts[parts.length - 1].charAt(0);\n const initials = firstInitial + lastInitial;\n\n return initials.toUpperCase();\n }\n\n getAvatarValue(value: string): string {\n if (/^\\+\\d+$/.test(value)) {\n return this.getNumberFormat(value);\n }\n return this.getNameInitials(value);\n }\n\n calcFontSize(size: string): string {\n const regex = /^(\\d+)(px|rem)$/;\n const match = size.match(regex);\n if (match) {\n const value = parseInt(match[1], 10) / 2;\n const unit = match[2];\n const calculated_font_size = value + unit;\n return calculated_font_size;\n }\n throw new Error('Invalid size format. Please provide a valid size in px or rem.');\n }\n calcLineHeight(size: string): string {\n const regex = /^(\\d+)(px|rem)$/;\n const match = size.match(regex);\n if (match) {\n const value = parseFloat(match[1]);\n const unit = match[2];\n const lineHeight = ((value * 1.25) / 2).toFixed(2);\n return lineHeight + unit;\n }\n }\n\n getValueStyles(): { 'width': string; 'height': string; 'font-size': string } {\n return {\n 'width': this.size,\n 'height': this.calcLineHeight(this.size),\n 'font-size': this.calcFontSize(this.size),\n };\n }\n\n getAvatarContent() {\n if (this.value.startsWith('http')) {\n this.setBackground = false;\n return <img class=\"vds-avatar--picture\" src={this.value} alt=\"Avatar\" />;\n } else {\n this.setBackground = true;\n const value = this.getAvatarValue(this.value);\n return (\n <span class=\"vds-avatar--value\" style={this.getValueStyles()}>\n {value}\n </span>\n );\n }\n }\n\n setBackgroundColor(): string {\n return this.setBackground ? 'var(--vds-avatar-background-color)' : 'transparent';\n }\n\n /**\n * Calculates the overlay icon size so that a 100px avatar = 20px icon (1.25rem), scaling proportionally for px or rem.\n */\n getOverlayIconSize(): string {\n const pxMatch = this.size.match(/^(\\d+(?:\\.\\d+)?)px$/);\n if (pxMatch) {\n const px = parseFloat(pxMatch[1]);\n const iconPx = (px * 20) / 100;\n const iconRem = iconPx / 16;\n return `${iconRem.toFixed(3)}rem`;\n }\n const remMatch = this.size.match(/^(\\d+(?:\\.\\d+)?)rem$/);\n if (remMatch) {\n const rem = parseFloat(remMatch[1]);\n const iconRem = rem * 0.2;\n return `${iconRem.toFixed(4)}rem`;\n }\n return '1.25rem';\n }\n\n render(): HTMLStencilElement {\n const avatarContent = this.getAvatarContent();\n const showOverlay = !!this.overlayIcon;\n\n return (\n <Host>\n {showOverlay ? (\n <button\n type=\"button\"\n class={`vds-avatar vds-avatar--has-overlay`}\n style={{\n width: this.size,\n height: this.size,\n backgroundColor: this.setBackgroundColor(),\n }}\n >\n {avatarContent}\n <div class=\"vds-avatar__overlay\">\n <vds-icon svgIcon={this.overlayIcon} size={this.getOverlayIconSize()} color=\"static-white\" />\n </div>\n </button>\n ) : (\n <div\n class=\"vds-avatar\"\n style={{\n width: this.size,\n height: this.size,\n backgroundColor: this.setBackgroundColor(),\n }}\n >\n {avatarContent}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/avatar/vds-avatar.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-avatar.stories.js","sourceRoot":"","sources":["../../../src/components/avatar/vds-avatar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAEhE,MAAM,SAAS,GAAG,sBAAsB,EAAE,CAAC;AAE3C,eAAe;IACb,KAAK,EAAE,uBAAuB;IAC9B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,GAAG,EAAE,IAAI;SACV;QACD,MAAM,EAAE;YACN,IAAI,EAAE,OAAO;YACb,GAAG,EAAE,uFAAuF;SAC7F;KACF;IACD,QAAQ,EAAE;QACR,WAAW,EAAE;YACX,OAAO,EAAE,SAAS;YAClB,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC5B;KACF;CACF,CAAC;AAEF,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE;IAC1B,OAAO;;;gBAGO,IAAI,CAAC,IAAI,IAAI,MAAM;iBAClB,IAAI,CAAC,KAAK,IAAI,WAAW;wBAClB,IAAI,CAAC,WAAW,IAAI,EAAE;;;;KAIzC,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,UAAU,CAAC,IAAI,GAAG;IAChB,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,WAAW;IAClB,WAAW,EAAE,EAAE;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,UAAU,CAAC,IAAI,GAAG;IAChB,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,uDAAuD;IAC9D,WAAW,EAAE,EAAE;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE1D,oBAAoB,CAAC,IAAI,GAAG;IAC1B,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,KAAK;IACZ,WAAW,EAAE,EAAE;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAElD,YAAY,CAAC,IAAI,GAAG;IAClB,IAAI,EAAE,OAAO;IACb,KAAK,EAAE,uDAAuD;IAC9D,WAAW,EAAE,MAAM;CACpB,CAAC","sourcesContent":["import { getIconsFromSpriteFile } from '../../utils/icon-utils';\n\nconst ICON_LIST = getIconsFromSpriteFile();\n\nexport default {\n title: 'VDS/Components/Avatar',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: 'figma',\n url: 'https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=29184-58579',\n },\n },\n argTypes: {\n overlayIcon: {\n options: ICON_LIST,\n control: { type: 'select' },\n },\n },\n};\n\nconst codeTemplate = args => {\n return `\n <div>\n <vds-avatar\n size=\"${args.size || '24px'}\"\n value=\"${args.value || 'User Demo'}\"\n overlay-icon=\"${args.overlayIcon || ''}\"\n >\n </vds-avatar>\n </div>\n `;\n};\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n size: '28px',\n value: 'User Demo',\n overlayIcon: '',\n};\n\nexport const ImageUsage = codeTemplate.bind({});\n\nImageUsage.args = {\n size: '28px',\n value: 'https://cdn-icons-png.flaticon.com/512/149/149071.png',\n overlayIcon: '',\n};\n\nexport const AdditionalUsersUsage = codeTemplate.bind({});\n\nAdditionalUsersUsage.args = {\n size: '28px',\n value: '+42',\n overlayIcon: '',\n};\n\nexport const OverlayUsage = codeTemplate.bind({});\n\nOverlayUsage.args = {\n size: '100px',\n value: 'https://cdn-icons-png.flaticon.com/512/149/149071.png',\n overlayIcon: 'edit',\n};\n"]}

package/dist/collection/components/badge-dot/vds-badge-dot.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-badge-dot.js","sourceRoot":"","sources":["../../../src/components/badge-dot/vds-badge-dot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAE7D,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAOpE,MAAM,OAAO,WAAW;IALxB;QAME,4BAA4B;QACpB,SAAI,GAAuB,QAAQ,CAAA;QAC3C;8HACsH;QAC9G,gBAAW,GAA0E,SAAS,CAAC;QAGvG,wCAAwC;QAC/B,YAAO,GAAe,KAAK,CAAA;QACpC,qCAAqC;QAC7B,aAAQ,GAA8D,WAAW,CAAA;KAuC1F;IAlCC,mBAAmB;QACjB,IAAI,CAAC,QAAQ,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IAC7D,CAAC;IAED,mBAAmB;QACjB,IAAI,KAAK,GAAG,EAAE,CAAC;QAEf,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,OAAO;gBACL,eAAe,EAAE,SAAS,IAAI,CAAC,WAAW,GAAG;aAC9C,CAAC;QACJ,CAAC;QAED,OAAO,KAAK,CAAC;IACf,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,mEAAa,IAAI,CAAC,YAAY;YACjC,4DAAK,KAAK,EAAE,cAAc,CAAC,0BAA0B,CAAC,gBAAc,IAAI,CAAC,YAAY;gBACnF,4DAAK,KAAK,EAAE,cAAc,CACxB,sBAAsB,EACtB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,+BAA+B,CAAC,CAAC,CAAC,kCAAkC,EACnF,8BAA8B,IAAI,CAAC,IAAI,EAAE,EACzC,+BAA+B,IAAI,CAAC,WAAW,EAAE,EACjD,kCAAkC,IAAI,CAAC,QAAQ,EAAE,CAChD,EACD,KAAK,EAAE,IAAI,CAAC,mBAAmB,EAAE,GAC5B;gBACP,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { Colors } from '../../definitions/colors';\nimport { BADGE_VARIANTS } from '../badge-pill/vds-badge-pill.utils';\n\n@Component({\n tag: 'vds-badge-dot',\n styleUrl: 'vds-badge-dot.scss',\n shadow: true,\n})\nexport class VdsBadgeDot {\n /** Sets the badge's size */\n @Prop() size: \"small\" | \"medium\" = \"medium\"\n /** Sets the color of the badge, it provides special colors such as warning, danger, healthy, information, neutral \n * If you pass a color from out pallete it will consider as custom. The color will be applied as background color. */\n @Prop() statusColor: \"warning\" | \"danger\" | \"healthy\" | \"information\" | \"neutral\" | Colors = \"neutral\";\n /** Sets the aria label in badge */\n @Prop() setAriaLabel:string \n /** Sets to overlap component content */\n @Prop() overlap : boolean = false\n /** Sets the position of the badge */\n @Prop() position: \"top-right\" | \"top-left\" | \"bottom-right\" | \"bottom-left\" = \"top-right\"\n \n \n private isCustom: boolean;\n\n componentWillRender(): void {\n this.isCustom = !BADGE_VARIANTS.includes(this.statusColor);\n }\n\n setCustomColorStyle() {\n let style = {};\n\n if (this.isCustom) {\n return {\n backgroundColor: `var(--${this.statusColor})`\n };\n }\n\n return style;\n }\n\n render() {\n return (\n <Host aria-label={this.setAriaLabel}>\n <div class={combineClasses(\"vds-badge-dot__container\")} aria-label={this.setAriaLabel}>\n <div class={combineClasses(\n \"vds-badge-dot__thumb\",\n this.overlap ? \"vds-badge-dot__thumb--overlap\" : \"vds-badge-dot__thumb--no-overlap\",\n `vds-badge-dot__thumb--size-${this.size}`,\n `vds-badge-dot__thumb--color-${this.statusColor}`,\n `vds-badge-dot__thumb--position-${this.position}`\n )}\n style={this.setCustomColorStyle()}\n ></div>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/badge-dot/vds-badge-dot.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-badge-dot.stories.js","sourceRoot":"","sources":["../../../src/components/badge-dot/vds-badge-dot.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,4BAA4B,CAAC;AAEnD,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;AAE/C,eAAe;IACX,KAAK,EAAE,2BAA2B;IAClC,UAAU,EAAE;QACR,IAAI,EAAE;YACJ,GAAG,EAAE,IAAI;SACV;QACD,MAAM,EAAE;YACN,IAAI,EAAE,OAAO;YACb,GAAG,EAAE,wFAAwF;SAC9F;KACF;IACH,QAAQ,EAAE;QACR,WAAW,EAAE;YACX,OAAO,EAAE,CAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC;YAClF,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC5B;QACD,IAAI,EAAE;YACF,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC;YAC5B,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC9B;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,CAAC,WAAW,EAAE,UAAU,EAAE,cAAc,EAAE,aAAa,CAAC;YACjE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC9B;KACA;CACJ,CAAC;AACF,IAAI,MAAM,GAAG;;;;CAIZ,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,EAAE;IAC1B,OAAO;SACF,MAAM;;;cAGD,IAAI,CAAC,IAAI;sBACD,IAAI,CAAC,WAAW;wBACd,IAAI,CAAC,YAAY;iBACxB,IAAI,CAAC,OAAO;kBACX,IAAI,CAAC,QAAQ;;;;;CAK9B,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,UAAU,CAAC,IAAI,GAAG;IAChB,IAAI,EAAE,QAAQ;IACd,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,iBAAiB;IAC/B,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,WAAW;CACtB,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE,EAAE;IAChC,OAAO;SACA,MAAM;;;YAGH,IAAI,CAAC,IAAI;oBACD,IAAI,CAAC,WAAW;sBACd,IAAI,CAAC,YAAY;eACxB,IAAI,CAAC,OAAO;gBACX,IAAI,CAAC,QAAQ;;;;;CAK5B,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAExD,cAAc,CAAC,IAAI,GAAG;IACtB,IAAI,EAAE,QAAQ;IACd,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,iBAAiB;IAC/B,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,WAAW;CACpB,CAAA","sourcesContent":["import variables from \"../../constants/color-vars\";\n\nconst THEME_KEY = Object.keys(variables.theme);\n\nexport default {\n title: 'VDS/Components/Badges/Dot',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=29365-206865\"\n }\n },\n argTypes: {\n statusColor: {\n options: [ \"warning\", \"danger\", \"healthy\", \"information\", \"neutral\", ...THEME_KEY],\n control: { type: \"select\" }\n },\n size: {\n options: [\"small\", \"medium\"],\n control: { type: \"select\" }\n },\n position: {\n options: [\"top-right\", \"top-left\", \"bottom-right\", \"bottom-left\"],\n control: { type: \"select\" }\n }\n },\n};\nlet styles = `\n.content {\n margin: 20px;\n}\n`;\n \nconst codeTemplate = (args) => {\n return `\n<style>${styles}</style>\n<div class=\"content\">\n <vds-badge-dot\n size=\"${args.size}\"\n status-color=\"${args.statusColor}\"\n set-aria-label=\"${args.setAriaLabel}\"\n overlap=\"${args.overlap}\"\n position=\"${args.position}\"\n >\n <vds-avatar size=\"24px\" value=\"User Demo\"></<vds-avatar>\n </vds-badge-dot>\n</div>\n`;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n size: \"medium\",\n statusColor: \"healthy\",\n setAriaLabel: \"I'm a vds badge\",\n overlap: true,\n position: \"top-right\"\n}\n\nconst codeTextTemplate = (args) => {\n return `\n<style>${styles}</style>\n<div class=\"content\">\n <vds-badge-dot\n size=\"${args.size}\"\n status-color=\"${args.statusColor}\"\n set-aria-label=\"${args.setAriaLabel}\"\n overlap=\"${args.overlap}\"\n position=\"${args.position}\"\n >\n Hello world\n </vds-badge-dot>\n</div>\n`;\n}\n\nexport const BasicTextUsage = codeTextTemplate.bind({});\n\nBasicTextUsage.args = {\nsize: \"medium\",\nstatusColor: \"healthy\",\nsetAriaLabel: \"I'm a vds badge\",\noverlap: true,\nposition: \"top-right\"\n}\n\n"]}

package/dist/collection/components/badge-pill/vds-badge-pill.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-badge-pill.js","sourceRoot":"","sources":["../../../src/components/badge-pill/vds-badge-pill.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAG7D,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAOjE,MAAM,OAAO,YAAY;IALzB;QAME,4BAA4B;QACpB,SAAI,GAA8D,QAAQ,CAAC;QACnF;;0FAEkF;QAC1E,gBAAW,GAA0E,SAAS,CAAC;QAWvG,gDAAgD;QACxC,cAAS,GAAY,KAAK,CAAC;QAE3B,aAAQ,GAAY,KAAK,CAAC;QAG1B,uBAAkB,GAAG,kBAAkB,CAAC;KAmDjD;IAjDC,mBAAmB;QACjB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAEO,cAAc;QACpB,IAAI,CAAC,QAAQ,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAE3D,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,IAAI,MAAM,GAAG,EAAE,CAAC;YAEhB,MAAM,GAAG;gBACP,gCAAgC,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,CAAC,SAAS;gBAC7F,mCAAmC,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,SAAS;gBAClG,kCAAkC,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,CAAC,SAAS;aAC1G,CAAC;YAEF,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC;QAC7B,CAAC;IACH,CAAC;IAED;;;OAGG;IACH,OAAO;QACL,OAAO,gBAAU,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAa,CAAC;IAC7F,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,mEAAa,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK;YAC/C,+DACE,KAAK,EAAE,cAAc,CACnB,6BAA6B,EAC7B,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,0BAA0B,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,EACtD,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,kCAAkC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,uCAAuC,CACpI,EACD,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK,gBACvD,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK;gBAE3C,4DAAK,KAAK,EAAE,2BAA2B;oBACpC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,EAAE;oBAC3B,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAE,yBAAyB,IAAG,IAAI,CAAC,KAAK,CAAQ,CACtE,CACC,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport { Colors } from '../../definitions/colors';\nimport { BADGE_VARIANTS } from './vds-badge-pill.utils';\nimport { getIconSizeUpdated } from '../../utils/icon-attr.utils';\n\n@Component({\n tag: 'vds-badge-pill',\n styleUrl: 'vds-badge-pill.scss',\n shadow: true,\n})\nexport class VdsBadgePill {\n /** Sets the badge's size */\n @Prop() size: '2x-small' | 'extra-small' | 'small' | 'medium' | 'large' = 'medium';\n /** Sets the color of the badge, it provides special colors such as warning, danger, healthy, information, neutral\n * If you pass a color from out pallete it will consider as custom. The color will be applied as background color;\n * To fully customize please refer to props contentColor and borderFocusColor. */\n @Prop() statusColor: 'warning' | 'danger' | 'healthy' | 'information' | 'neutral' | Colors = 'neutral';\n /** Sets the aria label in badge */\n @Prop() setAriaLabel: string;\n /** Sets an icon inside the badge */\n @Prop() icon?: string;\n /** Sets the text value of the badge. */\n @Prop() value!: string;\n /** Sets the color of the text and icon. (Only works when passing a custom statusColor) */\n @Prop() contentColor: Colors;\n /** Sets the color of the border in focus. (Only works when passing a custom statusColor) */\n @Prop() borderFocusColor: Colors;\n /** Hides the native tooltip when set to true */\n @Prop() hideTitle: boolean = false;\n\n private isCustom: boolean = false;\n private customStyles;\n\n private getIconSizeUpdated = getIconSizeUpdated;\n\n componentWillRender(): void {\n this.setCustomBadge();\n }\n\n private setCustomBadge(): void {\n this.isCustom = !BADGE_VARIANTS.includes(this.statusColor);\n\n if (this.isCustom) {\n let styles = {};\n\n styles = {\n '--custom-badge-pill-background': this.statusColor ? `var(--${this.statusColor})` : undefined,\n '--custom-badge-pill-content-color': this.contentColor ? `var(--${this.contentColor})` : undefined,\n '--custom-badge-pill-border-color': this.borderFocusColor ? `var(--${this.borderFocusColor})` : undefined,\n };\n\n this.customStyles = styles;\n }\n }\n\n /** Sets the icon in the vds-badge-pills\n *\n * @returns HTMLStencilElement\n */\n getIcon(): HTMLStencilElement {\n return <vds-icon svgIcon={this.icon} size={this.getIconSizeUpdated(this.size)}></vds-icon>;\n }\n\n render(): HTMLStencilElement {\n return (\n <Host aria-label={this.setAriaLabel || this.value}>\n <button\n class={combineClasses(\n 'vds__badge__pill--container',\n this.size ? `vds__badge__pill--size-${this.size}` : '',\n this.statusColor && !this.isCustom ? `vds__badge__pill--status-color-${this.statusColor}` : 'vds__badge__pill--status-color-custom',\n )}\n style={this.customStyles}\n title={this.hideTitle ? undefined : this.setAriaLabel || this.value}\n aria-label={this.setAriaLabel || this.value}\n >\n <div class={'vds__badge__pill--content'}>\n {this.icon && this.getIcon()}\n {this.value && <span class={'vds__badge__pill--value'}>{this.value}</span>}\n </div>\n </button>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/badge-pill/vds-badge-pill.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-badge-pill.stories.js","sourceRoot":"","sources":["../../../src/components/badge-pill/vds-badge-pill.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,4BAA4B,CAAC;AAEnD,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;AAE/C,eAAe;IACb,KAAK,EAAE,4BAA4B;IACnC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,GAAG,EAAE,IAAI;SACV;QACD,MAAM,EAAE;YACN,IAAI,EAAE,OAAO;YACb,GAAG,EAAE,wFAAwF;SAC9F;KACF;IACD,QAAQ,EAAE;QACR,WAAW,EAAE;YACX,OAAO,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,SAAS,CAAC;YACtE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC5B;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;YAChE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC5B;QACD,YAAY,EAAE;YACZ,OAAO,EAAE,CAAC,SAAS,EAAE,GAAG,SAAS,CAAC;YAClC,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC5B;QACD,gBAAgB,EAAE;YAChB,OAAO,EAAE,CAAC,SAAS,EAAE,GAAG,SAAS,CAAC;YAClC,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC5B;KACF;CACF,CAAC;AACF,IAAI,MAAM,GAAG;;;;CAIZ,CAAC;AAEF,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE;IAC1B,OAAO;SACA,MAAM;;;cAGD,IAAI,CAAC,IAAI;sBACD,IAAI,CAAC,WAAW;wBACd,IAAI,CAAC,YAAY;cAC3B,IAAI,CAAC,IAAI;eACR,IAAI,CAAC,KAAK;uBACF,IAAI,CAAC,YAAY;4BACZ,IAAI,CAAC,gBAAgB;oBAC7B,IAAI,CAAC,SAAS;;;CAGjC,CAAC;AACF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,UAAU,CAAC,IAAI,GAAG;IAChB,IAAI,EAAE,QAAQ;IACd,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,iBAAiB;IAC/B,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,SAAS;IAChB,YAAY,EAAE,SAAS;IACvB,gBAAgB,EAAE,SAAS;IAC3B,SAAS,EAAE,KAAK;CACjB,CAAC","sourcesContent":["import variables from '../../constants/color-vars';\n\nconst THEME_KEY = Object.keys(variables.theme);\n\nexport default {\n title: 'VDS/Components/Badges/Pill',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: 'figma',\n url: 'https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=29365-205847',\n },\n },\n argTypes: {\n statusColor: {\n options: ['warning', 'danger', 'healthy', 'information', ...THEME_KEY],\n control: { type: 'select' },\n },\n size: {\n options: ['2x-small', 'extra-small', 'small', 'medium', 'large'],\n control: { type: 'select' },\n },\n contentColor: {\n options: [undefined, ...THEME_KEY],\n control: { type: 'select' },\n },\n borderFocusColor: {\n options: [undefined, ...THEME_KEY],\n control: { type: 'select' },\n },\n },\n};\nlet styles = `\n.content {\n margin: 10px;\n}\n`;\n\nconst codeTemplate = args => {\n return `\n<style>${styles}</style>\n<div class=\"content\">\n <vds-badge-pill\n size=\"${args.size}\"\n status-color=\"${args.statusColor}\"\n set-aria-label=\"${args.setAriaLabel}\"\n icon=\"${args.icon}\"\n value=\"${args.value}\"\n content-color=\"${args.contentColor}\"\n border-focus-color=\"${args.borderFocusColor}\"\n hide-title=\"${args.hideTitle}\"\n ></vds-badge-pill>\n</div>\n`;\n};\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n size: 'medium',\n statusColor: 'healthy',\n setAriaLabel: \"I'm a vds badge\",\n icon: 'good',\n value: 'Badge 1',\n contentColor: undefined,\n borderFocusColor: undefined,\n hideTitle: false,\n};\n"]}

package/dist/collection/components/badge-pill/vds-badge-pill.utils.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"vds-badge-pill.utils.js","sourceRoot":"","sources":["../../../src/components/badge-pill/vds-badge-pill.utils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,cAAc,GAAG;IAC1B,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,SAAS;CAC3D,CAAC","sourcesContent":["export const BADGE_VARIANTS = [\n \"warning\", \"danger\", \"healthy\", \"information\", \"neutral\"\n];\n"]}

package/dist/collection/components/base-group-header/base-group-header.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"base-group-header.js","sourceRoot":"","sources":["../../../src/components/base-group-header/base-group-header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAsB,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAI7D;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAC1C,IAAqB,EACrB,KAAc,EACM,EAAE;IACtB,OAAO,CACL,WAAK,KAAK,EAAE,cAAc,CACxB,uBAAuB,EACvB,0BAA0B,IAAI,EAAE,CACjC;QACC,YAAM,KAAK,EAAE,cAAc,CACzB,8BAA8B,EAC9B,iCAAiC,IAAI,EAAE,CACxC,IACE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,eAAa,CACzB,CACH,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h, HTMLStencilElement } from '@stencil/core/internal';\nimport { combineClasses } from '../../utils/combine-classes';\n\nexport type GroupHeaderSize = 'small' | 'medium' | 'large';\n\n/**\n * Generates a group header container with a label.\n *\n * @param {GroupHeaderSize} size - The size of the group header.\n * @param {string} value - The text value to display in the group header.\n * \n * @returns {HTMLStencilElement} The generated group header container.\n */\nexport const generateGroupHeaderContainer = (\n size: GroupHeaderSize,\n value?: string\n): HTMLStencilElement => {\n return (\n <div class={combineClasses(\n 'vds-base-group-header',\n `vds-base-group-header--${size}`\n )}>\n <span class={combineClasses(\n 'vds-base-group-header__label',\n `vds-base-group-header__label--${size}`\n )}>\n {value ? value : <slot></slot>}\n </span>\n </div>\n );\n};\n"]}

package/dist/collection/components/base-item/base-item.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"base-item.js","sourceRoot":"","sources":["../../../src/components/base-item/base-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from \"@stencil/core\";\nimport { HTMLStencilElement } from \"@stencil/core/internal\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { IconColors } from \"../../components\";\n\n/**\n * Gets the appropriate icon color based on the provided conditions.\n *\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} [danger=false] - Whether the icon should indicate danger.\n * @param {boolean} [isCheckbox=false] - Whether the icon is for a checkbox.\n * \n * @returns {IconColors} The CSS variable name for the icon color.\n */\nconst getIconColor = (\n disabled: boolean,\n isActive: boolean,\n danger: boolean = false,\n isCheckbox: boolean = false\n): IconColors => {\n switch(true) {\n case disabled:\n return \"color-icon-disabled\";\n case danger:\n return \"color-icon-danger\";\n case isActive:\n return isCheckbox ? \"color-icon-brand-default\" : \"color-icon-brand-press\";\n default: \n return \"color-icon-high\";\n }\n}\n\n/**\n * Gets the appropriate icon size based on the provided size.\n *\n * @param {\"small\" | \"medium\" | \"large\"} size - The desired size of the icon.\n * \n * @returns {string} The CSS size value for the icon.\n */\nconst getIconSize = (size: \"small\" | \"medium\" | \"large\"): string => size === \"medium\" ? \"1rem\" : size === \"small\" ? \"0.75rem\" : \"1.25rem\"\n\n/**\n * Generates a checkmark icon button based on the provided parameters.\n *\n * @param {boolean} isSelected - Whether the item is selected.\n * @param {\"medium\" | \"large\"} size - The desired size of the icon.\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} danger - Whether the icon should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated checkmark icon button.\n */\nexport const generateCheckmarkIconButton = (\n isSelected: boolean,\n size: \"small\" | \"medium\" | \"large\",\n disabled: boolean,\n isActive: boolean,\n danger: boolean\n): HTMLStencilElement => {\n if (isSelected) {\n return (\n <div class=\"vds-base-item__checkmark-icon\">\n <vds-icon\n svg-icon=\"good\"\n size={getIconSize(size)}\n color={getIconColor(disabled, isSelected || isActive, danger)}\n alt=\"Selected Item\"\n />\n </div>\n );\n }\n\n return (\n <div class={`vds-base-item__checkmark-icon--empty-${size}`}></div>\n );\n}\n\n/**\n * Generates an informative icon based on the provided parameters.\n *\n * @param {string} icon - The name of the SVG icon to use.\n * @param {string} value - The value associated with the icon.\n * @param {\"medium\" | \"large\"} size - The desired size of the icon.\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} danger - Whether the icon should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated informative icon.\n */\nexport const generateInformativeIcon = (\n icon: string,\n value: string,\n size: \"small\" | \"medium\" | \"large\",\n disabled: boolean,\n isActive: boolean,\n danger: boolean\n): HTMLStencilElement => {\n return (\n <div class=\"vds-base-item__informative-icon\"> \n <vds-icon\n svg-icon={icon}\n size={getIconSize(size)}\n color={getIconColor(disabled, isActive, danger)}\n alt={value}\n />\n </div>\n );\n}\n\n/**\n * Generates a checkbox icon based on the provided parameters.\n *\n * @param {boolean} isSelected - Whether the checkbox is selected.\n * @param {\"medium\" | \"large\"} size - The desired size of the checkbox.\n * @param {boolean} disabled - Whether the checkbox is disabled.\n * @param {boolean} isActive - Whether the checkbox is active.\n * @param {boolean} danger - Whether the checkbox should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated checkbox icon.\n */\nexport const generateCheckbox = (\n isSelected: boolean,\n size: \"small\" | \"medium\" | \"large\",\n disabled: boolean,\n isActive: boolean,\n danger: boolean\n): HTMLStencilElement => {\n return (\n <div class={`vds-base-item__checkbox-icon-${size}`}>\n <vds-icon\n svg-icon={isSelected ? \"checked\" : \"unchecked\"}\n class={combineClasses(isSelected ? \"checkbox-icon-checked\" : \"\", `checkbox-item-${size}`)}\n size={getIconSize(size)}\n color={getIconColor(disabled, isSelected || isActive, danger, true)}\n alt={\"checkbox-element\"}\n />\n </div>\n );\n}\n\n/**\n * Generates a label element based on the provided parameters.\n\n * @param {string} label - The text content of the label.\n * @param {\"medium\" | \"large\"} size - The desired size of the label.\n * @param {boolean} disabled - Whether the label is disabled.\n * @param {boolean} isActive - Whether the label is active.\n * @param {boolean} danger - Whether the label should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated label element.\n */\nexport const generateLabel = (\n label: string,\n size: \"small\" | \"medium\" | \"large\",\n disabled: boolean,\n isActive: boolean,\n danger: boolean\n): HTMLStencilElement => {\n return (\n <span\n class={combineClasses(\n \"vds-base-item__label\",\n `vds-base-item__label--size-${size}`,\n disabled ? \"vds-base-item__label--disabled\" : \"\",\n isActive ? \"vds-base-item__label--active\" : \"\",\n danger ? \"vds-base-item__label--danger\" : \"\",\n )}\n >\n { label ? label : <slot></slot> }\n </span>\n );\n}\n\n/**\n * Generates a children icon button based on the provided parameters.\n\n * @param {\"medium\" | \"large\"} size - The desired size of the icon.\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} danger - Whether the icon should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated children icon button.\n */\nexport const generateChildrenIconButton = (\n size: \"small\" | \"medium\" | \"large\",\n disabled: boolean,\n isActive: boolean,\n danger: boolean\n): HTMLStencilElement => {\n return(\n <div class=\"vds-base-item__has-children-icon\">\n <vds-icon\n svg-icon=\"chevron-right\"\n size={getIconSize(size)}\n color={getIconColor(disabled, isActive, danger)}\n alt=\"Open menu\"\n />\n </div>\n );\n}\n"]}

package/dist/collection/components/basic-dropdown/vds-basic-dropdown.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-basic-dropdown.js","sourceRoot":"","sources":["../../../src/components/basic-dropdown/vds-basic-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAgB,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AACnJ,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AAE9E,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AACjG,OAAO,EACL,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACnB,iBAAiB,EACjB,sBAAsB,EACtB,gBAAgB,EAChB,wBAAwB,EACxB,oBAAoB,GACrB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAQlD,MAAM,OAAO,gBAAgB;IAN7B;QAQE,gCAAgC;QACP,SAAI,GAAiC,QAAQ,CAAC;QAKvE,mGAAmG;QAC1E,2BAAsB,GAAY,KAAK,CAAC;QAGjE,2CAA2C;QAClB,aAAQ,GAAY,KAAK,CAAC;QACnD,2CAA2C;QAClB,eAAU,GAAY,KAAK,CAAC;QAGrD,yCAAyC;QAChB,UAAK,GAAsB,OAAO,CAAC;QAC5D,mDAAmD;QAC1B,oBAAe,GAAY,IAAI,CAAC;QAGzD,+FAA+F;QACtE,eAAU,GAAY,KAAK,CAAC;QACrD;;;WAGG;QACsB,iBAAY,GAAY,KAAK,CAAC;QACvD,2FAA2F;QACnF,aAAQ,GAAY,KAAK,CAAC;QAWlC,yBAAyB;QAChB,mBAAc,GAAY,KAAK,CAAC;QACzC,6CAA6C;QAC5B,eAAU,GAAW,SAAS,CAAC;QAOxC,YAAO,GAAiC,EAAE,CAAC;KAgWpD;IA1VC,KAAK,CAAC,SAAS;QACb,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,IAAI,CAAC,eAAe,GAAG,MAAM,yBAAyB,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,yBAAyB,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;YACjJ,sBAAsB,CAAC,IAAI,CAAC,yBAAyB,EAAE,IAAI,CAAC,CAAC;YAC7D,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;gBACf,qBAAqB,CAAC,IAAI,CAAC,yBAAyB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;YACpE,CAAC;YACD,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QACrB,CAAC;aAAM,CAAC;YACN,sBAAsB,CAAC,IAAI,CAAC,yBAAyB,EAAE,KAAK,CAAC,CAAC;YAC9D,IAAI,CAAC,eAAe,EAAE,CAAC;YACvB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QACrB,CAAC;IACH,CAAC;IAGD,eAAe;QACb,cAAc,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QACxC,wBAAwB,CAAC,IAAI,CAAC,yBAAyB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QACrE,mBAAmB,CAAC,IAAI,CAAC,yBAAyB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QAChE,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,UAAU,GAAG,gBAAgB,CAAC,IAAI,CAAC,yBAAyB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACjF,CAAC;IAEO,YAAY;QAClB,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,EAAE,CAAC;YACpD,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,mDAAmD;IAE3C,cAAc,CAAC,GAAe;QACpC,GAAG,CAAC,eAAe,EAAE,CAAC;QACtB,MAAM,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAc,CAAC,CAAC;QAC/D,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,IAAI,CAAC,KAAK,EAAE,CAAC;QACf,CAAC;IACH,CAAC;IAED,qEAAqE;IAC7D,qBAAqB,CAAC,KAAoB;QAChD,KAAK,CAAC,wBAAwB,EAAE,CAAC;QACjC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE,CAAC;YAClD,IAAI,CAAC,KAAK,EAAE,CAAC;QACf,CAAC;IACH,CAAC;IAED,kEAAkE;IAC1D,WAAW,CAAC,GAAU;QAC5B,GAAG,CAAC,wBAAwB,EAAE,CAAC;QAC/B,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE,CAAC;YAC3B,MAAM,cAAc,GAAG,GAAG,CAAC,MAAqB,CAAC;YACjD,IAAI,cAAc,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;gBACzD,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC;YAC7C,CAAC;QACH,CAAC;IACH,CAAC;IAED,6CAA6C;IACrC,UAAU,CAAC,GAAU;QAC3B,GAAG,CAAC,wBAAwB,EAAE,CAAC;QAC/B,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,iFAAiF;IAEzE,yBAAyB,CAAC,KAA4C;QAC5E,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACnC,MAAM,UAAU,GAAG,IAAI,UAAU,CAAC,OAAO,CAAC,CAAC;QAC3C,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;QACtC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAChF,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,qGAAqG;IAC7F,eAAe,CAAC,KAA4C;QAClE,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAChC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;IACvC,CAAC;IAED,sDAAsD;IAE/C,KAAK,CAAC,IAAI;QACf,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC;IAED,uDAAuD;IAEhD,KAAK,CAAC,KAAK;QAChB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;IAC9B,CAAC;IAED,iDAAiD;IAE1C,KAAK,CAAC,KAAK;QAChB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACnC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAC1F,gBAAgB,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;QACjD,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAED;;;OAGG;IAEI,KAAK,CAAC,SAAS;QACpB,OAAO,QAAQ,CAAC,aAAa,CAAC,yBAAyB,CAAgB,CAAC;IAC1E,CAAC;IAED;;;OAGG;IAEI,KAAK,CAAC,QAAQ;QACnB,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;IAED;;OAEG;IAEI,KAAK,CAAC,QAAQ,CAAC,KAAa;QACjC,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACrB,CAAC;IAEO,WAAW,CAAC,KAAY;QAC9B,MAAM,cAAc,GAAG,KAAK,CAAC,MAAqB,CAAC;QACnD,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,IAAI,cAAc,EAAE,CAAC;YAC7C,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC;IACH,CAAC;IACO,cAAc,CAAC,KAAY;QACjC,MAAM,cAAc,GAAG,KAAK,CAAC,MAAqB,CAAC;QACnD,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,IAAI,cAAc,EAAE,CAAC;YAC7C,IAAI,CAAC,KAAK,EAAE,CAAC;QACf,CAAC;IACH,CAAC;IAEO,iBAAiB;;QACvB,MAAM,WAAW,GAAG,MAAA,IAAI,CAAC,yBAAyB,0CAAE,aAAa,CAAC,MAAM,CAAC,CAAC;QAC1E,MAAM,KAAK,GAAG,OAAO,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,gBAAgB,CAAA,KAAK,UAAU,KAAI,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,gBAAgB,EAAE,CAAA,CAAC;QACrG,IAAI,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;QACjK,IAAI,eAAe,EAAE,CAAC;YACpB,eAAe,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;YACpD,eAAe,CAAC,YAAY,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;YAClD,IAAI,CAAC,UAAU,GAAG,eAAe,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAC1D,CAAC;IACH,CAAC;IAEO,wBAAwB;;QAC9B,IAAI,kBAAkB,GAAG,SAAS,CAAC;QACnC,MAAM,WAAW,GAAG,MAAA,IAAI,CAAC,yBAAyB,0CAAE,aAAa,CAAC,MAAM,CAAC,CAAC;QAC1E,IAAI,WAAW,IAAI,OAAO,WAAW,CAAC,gBAAgB,KAAK,UAAU,IAAI,WAAW,CAAC,gBAAgB,EAAE,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACnH,kBAAkB,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,EAAE,CAAC,CAAC,IAAI,CAClE,IAAI,CAAC,EAAE,CACL,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB;gBAClD,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC;gBAChC,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,KAAK,MAAM;gBAC3C,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC;gBAC9B,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,KAAK,MAAM,CAC5C,CAAC;QACJ,CAAC;QACD,IAAI,kBAAkB,KAAK,SAAS,EAAE,CAAC;YACrC,IAAI,CAAC,KAAK,GAAG,kBAAkB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;YACtD,IAAI,CAAC,UAAU,GAAG,kBAAkB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAC7D,CAAC;IACH,CAAC;IAEO,WAAW;QACjB,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YACnC,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAC3B,CAAC;QACD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAClC,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,sBAAsB,IAAI,IAAI,CAAC,sBAAsB,KAAK,SAAS,EAAE,CAAC;YAC7E,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,eAAe,CAAC;QACrD,CAAC;IACH,CAAC;IAED,kBAAkB;QAChB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,CAAC,CAAC;QAC7E,yBAAyB,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,yBAAyB,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;QACxG,oBAAoB,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,yBAAyB,CAAC,CAAC;IAC/F,CAAC;IAED,gBAAgB;;QACd,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE,CAAC;YAC3B,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAC/E,CAAC;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE,CAAC;YAClC,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YAClF,IAAI,CAAC,yBAAyB,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAChG,CAAC;QACD,MAAA,IAAI,CAAC,gBAAgB,0CAAE,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAC1F,MAAA,IAAI,CAAC,yBAAyB,0CAAE,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QACnG,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE,CAAC;YACpC,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAC;QACrG,CAAC;QACD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAC3B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAClC,CAAC;QACD,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,sBAAsB,EAAE,CAAC;IAChC,CAAC;IAED,oBAAoB;;QAClB,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QACpE,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE,CAAC;YAC3B,IAAI,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAClF,CAAC;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE,CAAC;YAClC,IAAI,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YACrF,IAAI,CAAC,yBAAyB,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YACjG,IAAI,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YAC5F,IAAI,CAAC,yBAAyB,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QACvG,CAAC;QAED,MAAA,IAAI,CAAC,QAAQ,0CAAE,UAAU,EAAE,CAAC;IAC9B,CAAC;IAEO,sBAAsB;QAC5B,MAAM,MAAM,GAAG;YACb,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;SACd,CAAC;QAEF,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;YACxC,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,CAAC,CAAC;YAC7E,WAAW,CAAC,IAAI,CAAC,CAAC;QACpB,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC7C,CAAC;IAED;;;OAGG;IACK,YAAY;QAClB,OAAO,YAAY,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;IACtD,CAAC;IAEO,eAAe;QACrB,OAAO,gBAAU,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,GAAa,CAAC;IACvJ,CAAC;IAEO,kBAAkB;QACxB,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,OAAO,gBAAU,KAAK,EAAE,gCAAgC,EAAE,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,GAAa,CAAC;QACjK,CAAC;aAAM,CAAC;YACN,OAAO,IAAI,CAAC;QACd,CAAC;IACH,CAAC;IAEO,aAAa;QACnB,OAAO,CACL,YACE,KAAK,EAAE,cAAc,CAAC,sBAAsB,EAAE,uBAAuB,GAAG,IAAI,CAAC,IAAI,EAAE,uBAAuB,GAAG,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,IAEtK,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAC9D,CACR,CAAC;IACJ,CAAC;IAEO,uBAAuB;QAC7B,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YAC1D,OAAO,CACL,uBACE,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC,EACxC,OAAO,EACL,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,UAAU;oBAChC,CAAC,CAAC,KAAK,CAAC,EAAE;wBACN,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;oBACzB,CAAC;oBACH,CAAC,CAAC,IAAI,EAEV,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,UAAU,EAC1C,YAAY,EAAC,OAAO,GACH,CACpB,CAAC;QACJ,CAAC;aAAM,CAAC;YACN,OAAO,IAAI,CAAC;QACd,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,yBAAyB,CAAC,KAAK,CAAC,MAAM,CAAC;YAChJ,4DAAK,KAAK,EAAE,+BAA+B;gBACzC,+DACE,QAAQ,EAAE,CAAC,EACX,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,cAAc,CACnB,wBAAwB,EACxB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,iCAAiC,CAAC,CAAC,CAAC,EAAE,EACtD,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,kCAAkC,CAAC,CAAC,CAAC,EAAE,EACzD,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,EAAE,EAChD,gCAAgC,IAAI,CAAC,IAAI,EAAE,CAC5C,EACD,OAAO,EAAE,CAAC,GAAe,EAAE,EAAE;wBAC3B,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;oBACxB,CAAC,EACD,GAAG,EAAE,SAAS,CAAC,EAAE;wBACf,IAAI,SAAS;4BAAE,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;oBACnD,CAAC;oBAED,6DAAM,KAAK,EAAC,6BAA6B;wBACtC,IAAI,CAAC,kBAAkB,EAAE;wBACzB,IAAI,CAAC,aAAa,EAAE,CAChB;oBACP,6DAAM,KAAK,EAAC,8BAA8B;wBACvC,IAAI,CAAC,uBAAuB,EAAE;wBAC9B,IAAI,CAAC,eAAe,EAAE,CAClB,CACA;gBACR,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,WAAK,KAAK,EAAC,uBAAuB,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAQ,CAAC,CAAC,CAAC,EAAE;gBACtH,4DACE,KAAK,EAAE,cAAc,CAAC,0BAA0B,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,EACnI,GAAG,EAAE,UAAU,CAAC,EAAE;wBAChB,IAAI,UAAU;4BAAE,IAAI,CAAC,yBAAyB,GAAG,UAAU,CAAC;oBAC9D,CAAC;oBAED,4DAAK,KAAK,EAAE,cAAc,CAAC,uBAAuB,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC;wBAC/H,8DAAa,CACT,CACF,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, Method, Listen, Element, Event, EventEmitter, State, Watch, AttachInternals, forceUpdate } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { updateFloatingBoxPosition } from '../../utils/floating-engine-utils';\nimport { DropdownItemClickedEvent } from '../dropdown-item/vds-dropdown-item-clicked-event';\nimport { getIconSize, getIconColor, getActionIconButtonSize } from '../../utils/icon-attr.utils';\nimport {\n getSelectedLabel,\n scrollToSelectedValue,\n selectSelectedItems,\n setDropdownStyles,\n toggleContainerDisplay,\n unselectAllItems,\n unselectNonSelectedItems,\n updateContainerWidth,\n} from './vds-basic-dropdown.utils';\nimport { emitInputEvent } from '../../utils/form';\n\n@Component({\n tag: 'vds-basic-dropdown',\n styleUrl: 'vds-basic-dropdown.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class VdsBasicDropdown {\n @Element() hostEl: HTMLElement;\n /** Sets the dropdown's size. */\n @Prop({ mutable: true }) size: 'small' | 'medium' | 'large' = 'medium';\n /** Sets the dropdown's value. */\n @Prop({ mutable: true, reflect: true }) value: string;\n /** Allows user to define a information icon to the left of the dropdown. */\n @Prop({ mutable: true }) informativeIcon: string;\n /** Allows dropdown-item informativeIcon reflect dynamically as informativeIcon of the dropdown. */\n @Prop({ mutable: true }) dynamicInformativeIcon: boolean = false;\n /** Sets the dropdown's placeholder. */\n @Prop({ mutable: true }) placeholder: string;\n /** Sets the dropdown in disabled state. */\n @Prop({ mutable: true }) disabled: boolean = false;\n /** Sets the dropdown in readonly state. */\n @Prop({ mutable: true }) isReadonly: boolean = false;\n /** Sets the dropdown in error state. */\n @Prop({ mutable: true, reflect: true }) error: boolean;\n /** Sets the dropdown's trigger event. */\n @Prop({ mutable: true }) event: 'click' | 'hover' = 'click';\n /** Sets the dropdown's clear button visibility. */\n @Prop({ mutable: true }) showClearButton: boolean = true;\n /** Set the max height value for the floating container of the items */\n @Prop({ mutable: true }) maxHeight: string;\n /** Sets the width value for the floating container of the items to match the dropdown width */\n @Prop({ mutable: true }) matchWidth: boolean = false;\n /**\n * Toggles the floating container auto-positioning based on available window space.\n * False by default as it may cause positioning issues in some situations, use with caution\n */\n @Prop({ mutable: true }) autoPosition: boolean = false;\n /** Toggles the overlay element, allowing interaction only with this element when active */\n @Prop() backdrop: boolean = false;\n\n /** Emits event when floating element gets opens */\n @Event() opened: EventEmitter<void>;\n /** Emits event when floating element gets closes */\n @Event() closed: EventEmitter<void>;\n /** Emits event when an item is selected, this event contains the value of the selected item */\n @Event() valueChanged: EventEmitter<string>;\n /** Emits an event when the clear button is clicked */\n @Event() cleared: EventEmitter<boolean>;\n\n /** Dropdown's status. */\n @State() dropdownOpened: boolean = false;\n /** Dropdown's label of the current value. */\n @State() private valueLabel: string = undefined;\n\n @AttachInternals() internals: ElementInternals;\n\n private actionElementRef: HTMLButtonElement;\n private dropdownContentElementRef: HTMLDivElement;\n private defaultInformativeIcon: string;\n private options: HTMLVdsDropdownItemElement[] = [];\n\n private floatingCleanUp: () => void;\n observer: any;\n\n @Watch('dropdownOpened')\n async emitValue(): Promise<void> {\n if (this.dropdownOpened) {\n this.floatingCleanUp = await updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', this.autoPosition);\n toggleContainerDisplay(this.dropdownContentElementRef, true);\n if (this.value) {\n scrollToSelectedValue(this.dropdownContentElementRef, this.value);\n }\n this.opened.emit();\n } else {\n toggleContainerDisplay(this.dropdownContentElementRef, false);\n this.floatingCleanUp();\n this.closed.emit();\n }\n }\n\n @Watch('value')\n setValueHandler(): void {\n emitInputEvent(this.hostEl, this.value);\n unselectNonSelectedItems(this.dropdownContentElementRef, this.value);\n selectSelectedItems(this.dropdownContentElementRef, this.value);\n this.defineValue();\n this.setFormValue();\n this.valueLabel = getSelectedLabel(this.dropdownContentElementRef, this.value);\n }\n\n private setFormValue(): void {\n if (this.internals && !!this.internals.setFormValue) {\n this.internals.setFormValue(this.value);\n }\n }\n\n /* Close the floating element when click outside */\n @Listen('click', { target: 'window' })\n private handleClickOut(evt: MouseEvent): void {\n evt.stopPropagation();\n const isClickInside = this.hostEl.contains(evt.target as Node);\n if (!isClickInside) {\n this.close();\n }\n }\n\n /* Close the floating element with keydown on the trigger element */\n private handleFloatingKeydown(event: KeyboardEvent): void {\n event.stopImmediatePropagation();\n if (event.key === 'Escape' || event.key === 'Esc') {\n this.close();\n }\n }\n\n /* Open the floating element with click on the trigger element */\n private handleClick(evt: Event): void {\n evt.stopImmediatePropagation();\n if (this.event === 'click') {\n const clickedElement = evt.target as HTMLElement;\n if (clickedElement && !this.disabled && !this.isReadonly) {\n this.dropdownOpened = !this.dropdownOpened;\n }\n }\n }\n\n /* Clear selected value from the Dropdown */\n private clearValue(evt: Event): void {\n evt.stopImmediatePropagation();\n this.clear();\n this.close();\n }\n\n /* Listen when Dropdown Item element is clicked to close Dropdown Items window */\n @Listen('dropdownItemClicked')\n private handleDropdownItemClicked(event: CustomEvent<DropdownItemClickedEvent>): void {\n this.handleSelection(event);\n this.valueChanged.emit(this.value);\n const inputEvent = new InputEvent(\"input\");\n this.hostEl.dispatchEvent(inputEvent);\n this.dynamicInformativeIcon ? (this.informativeIcon = event.detail.icon) : null;\n this.close();\n }\n\n /* Checks if the item is already selected and if so clears the selection, otherwise sets the value */\n private handleSelection(event: CustomEvent<DropdownItemClickedEvent>): void {\n this.value = event.detail.value;\n this.valueLabel = event.detail.label;\n }\n\n /* Open the floating element(menu) of the Dropdown. */\n @Method()\n public async open(): Promise<void> {\n this.dropdownOpened = true;\n }\n\n /* Close the floating element(menu) of the Dropdown. */\n @Method()\n public async close(): Promise<void> {\n this.dropdownOpened = false;\n }\n\n /* Clear the selected value from the Dropdown. */\n @Method()\n public async clear(): Promise<void> {\n this.value = null;\n this.valueLabel = null;\n this.valueChanged.emit(this.value);\n this.dynamicInformativeIcon ? (this.informativeIcon = this.defaultInformativeIcon) : null;\n unselectAllItems(this.dropdownContentElementRef);\n this.cleared.emit(true);\n }\n\n /**\n * Gets the target that will manage the menu\n * returns a promise with the target HTMLElement.\n */\n @Method()\n public async getTarget(): Promise<HTMLElement | null> {\n return document.querySelector('.vds__dropdown--trigger') as HTMLElement;\n }\n\n /**\n * Gets the selected value of the dropdown\n * returns a promise with the value.\n */\n @Method()\n public async getValue(): Promise<String | null> {\n return this.value;\n }\n\n /**\n * Set the value of the dropdown\n */\n @Method()\n public async setValue(value: string): Promise<void> {\n this.clear();\n this.value = value;\n }\n\n private handleHover(event: Event): void {\n const hoveredElement = event.target as HTMLElement;\n if (this.event === 'hover' && hoveredElement) {\n this.dropdownOpened = true;\n }\n }\n private handleHoverOut(event: Event): void {\n const hoveredElement = event.target as HTMLElement;\n if (this.event === 'hover' && hoveredElement) {\n this.close();\n }\n }\n\n private setPredefinedItem() {\n const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n const items = typeof slotElement?.assignedElements === 'function' && slotElement?.assignedElements();\n let preselectedItem = Array.from(items || []).filter(item => item.tagName.toLowerCase() === 'vds-dropdown-item' && item.getAttribute('value') === this.value)[0];\n if (preselectedItem) {\n preselectedItem.setAttribute('is-selected', 'true');\n preselectedItem.setAttribute('is-active', 'true');\n this.valueLabel = preselectedItem.getAttribute('label');\n }\n }\n\n private findAndSetPredefinedItem() {\n let getPreselectedItem = undefined;\n const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n if (slotElement && typeof slotElement.assignedElements === 'function' && slotElement.assignedElements().length > 0) {\n getPreselectedItem = Array.from(slotElement.assignedElements()).find(\n item =>\n item.tagName.toLowerCase() === 'vds-dropdown-item' &&\n item.hasAttribute('is-selected') &&\n item.getAttribute('is-selected') === 'true' &&\n item.hasAttribute('is-active') &&\n item.getAttribute('is-active') === 'true',\n );\n }\n if (getPreselectedItem !== undefined) {\n this.value = getPreselectedItem.getAttribute('value');\n this.valueLabel = getPreselectedItem.getAttribute('label');\n }\n }\n\n private defineValue() {\n if (this.value && !this.valueLabel) {\n this.setPredefinedItem();\n }\n if (this.value) {\n this.findAndSetPredefinedItem();\n }\n }\n\n componentWillLoad() {\n if (this.dynamicInformativeIcon && this.defaultInformativeIcon === undefined) {\n this.defaultInformativeIcon = this.informativeIcon;\n }\n }\n\n componentDidRender() {\n this.options = Array.from(this.hostEl.querySelectorAll('vds-dropdown-item'));\n updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', false);\n updateContainerWidth(this.actionElementRef, this.matchWidth, this.dropdownContentElementRef);\n }\n\n componentDidLoad() {\n if (this.event === 'click') {\n this.actionElementRef.addEventListener('click', this.handleClick.bind(this));\n } else if (this.event === 'hover') {\n this.actionElementRef.addEventListener('mouseenter', this.handleHover.bind(this));\n this.dropdownContentElementRef.addEventListener('mouseleave', this.handleHoverOut.bind(this));\n }\n this.actionElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n this.dropdownContentElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n if (!this.dropdownContentElementRef) {\n this.dropdownContentElementRef = this.hostEl.shadowRoot.querySelector('.vds__dropdown--container');\n }\n if (this.value) {\n this.setPredefinedItem();\n } else {\n this.findAndSetPredefinedItem();\n }\n this.setFormValue();\n this.setListenerForChildren();\n }\n\n disconnectedCallback() {\n window.removeEventListener('click', this.handleClickOut.bind(this));\n if (this.event === 'click') {\n this.actionElementRef.removeEventListener('click', this.handleClick.bind(this));\n } else if (this.event === 'hover') {\n this.actionElementRef.removeEventListener('mouseenter', this.handleHover.bind(this));\n this.dropdownContentElementRef.removeEventListener('mouseleave', this.handleHoverOut.bind(this));\n this.actionElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n this.dropdownContentElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n }\n\n this.observer?.disconnect();\n }\n\n private setListenerForChildren(): void {\n const config = {\n childList: true,\n subtree: true,\n };\n\n this.observer = new MutationObserver(() => {\n this.options = Array.from(this.hostEl.querySelectorAll('vds-dropdown-item'));\n forceUpdate(this);\n });\n\n this.observer.observe(this.hostEl, config);\n }\n\n /** Gets the icon color.\n *\n * @returns string\n */\n private getIconColor() {\n return getIconColor(this.disabled, this.isReadonly);\n }\n\n private setDropdownIcon() {\n return <vds-icon svgIcon={this.dropdownOpened ? 'chevron-up' : 'chevron-down'} color={this.getIconColor()} size={getIconSize(this.size)}></vds-icon>;\n }\n\n private setInformativeIcon() {\n if (this.informativeIcon) {\n return <vds-icon class={'vds-dropdown__informative-icon'} svgIcon={this.informativeIcon} color={this.getIconColor()} size={getIconSize(this.size)}></vds-icon>;\n } else {\n return null;\n }\n }\n\n private setLabelValue() {\n return (\n <span\n class={combineClasses('vds__dropdown--value', 'vds__dropdown--value-' + this.size, 'vds__dropdown--value-' + (this.value && this.valueLabel ? 'label' : 'placeholder'))}\n >\n {this.value && this.valueLabel ? this.valueLabel : this.placeholder}\n </span>\n );\n }\n\n private setClearValueButtonIcon() {\n if (this.value && this.valueLabel && this.showClearButton) {\n return (\n <vds-icon-button\n icon=\"close\"\n variant=\"secondary\"\n size={getActionIconButtonSize(this.size)}\n onClick={\n !this.disabled && !this.isReadonly\n ? event => {\n this.clearValue(event);\n }\n : null\n }\n disabled={this.disabled || this.isReadonly}\n setAriaLabel=\"clear\"\n ></vds-icon-button>\n );\n } else {\n return null;\n }\n }\n\n render() {\n return (\n <Host class={combineClasses(this.disabled ? 'vds-basic-dropdown--disabled' : '')} onClicked={event => this.handleDropdownItemClicked(event.detail)}>\n <div class={'vds-basic-dropdown__container'}>\n <button\n tabIndex={0}\n disabled={this.disabled}\n value={this.value}\n class={combineClasses(\n 'vds__dropdown--trigger',\n this.disabled ? 'vds__dropdown--trigger-disabled' : '',\n this.isReadonly ? 'vds__dropdown--trigger--readonly' : '',\n this.error ? 'vds__dropdown--trigger-error' : '',\n `vds__dropdown--trigger--size-${this.size}`,\n )}\n onClick={(evt: MouseEvent) => {\n this.handleClick(evt);\n }}\n ref={triggerEl => {\n if (triggerEl) this.actionElementRef = triggerEl;\n }}\n >\n <span class=\"vds__dropdown--left-content\">\n {this.setInformativeIcon()}\n {this.setLabelValue()}\n </span>\n <span class=\"vds__dropdown--right-actions\">\n {this.setClearValueButtonIcon()}\n {this.setDropdownIcon()}\n </span>\n </button>\n {this.backdrop && this.dropdownOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n <div\n class={combineClasses('vds__dropdown--container', this.maxHeight ? 'has-scroll' : '', this.options.length === 0 ? 'no-shadow' : '')}\n ref={dropdownEl => {\n if (dropdownEl) this.dropdownContentElementRef = dropdownEl;\n }}\n >\n <div class={combineClasses('vds-dropdown__content', this.maxHeight ? 'scrollable' : '')} style={setDropdownStyles(this.maxHeight)}>\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/basic-dropdown/vds-basic-dropdown.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-basic-dropdown.stories.js","sourceRoot":"","sources":["../../../src/components/basic-dropdown/vds-basic-dropdown.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["export default {\n title: 'VDS/Components/Dropdown/Basic-dropdown',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=29047-159996\"\n }\n },\n argTypes: {\n size: {\n options: [\"small\", \"medium\", \"large\"],\n control: { type: \"select\" }\n },\n informativeIcon: {\n options: [\"add\", \"calendar\", \"train\", \"administration\"],\n control: { type: \"select\" }\n },\n event: {\n options: [\"click\", \"hover\"],\n control: { type: \"select\" }\n },\n autoPosition: {\n control: \"boolean\"\n }\n },\n};\nconst styles = `\n .container {\n position: relative;\n padding:10px;\n width: 500px;\n }\n`;\n\nconst codeTemplate = (args) => {\n return `\n <style>${styles}</style>\n <div class=\"container\">\n <vds-basic-dropdown\n class=\"animal-dropdown\"\n size=\"${args.size}\"\n value=\"${args.value}\"\n placeholder=\"${args.placeholder}\"\n ${args.disabled ? \"disabled\" : \"\"}\n ${args.isReadonly ? \"is-readonly\" : \"\"}\n ${args.error ? \"error\" : \"\"}\n is-required=\"${args.isRequired}\"\n event=\"${args.event}\"\n show-clear-button=\"${args.showClearButton}\"\n max-height=\"${args.maxHeight}\"\n match-width=\"${args.matchWidth}\"\n auto-position=\"${args.autoPosition}\"\n backdrop=\"${args.backdrop}\"\n >\n <vds-dropdown-group-header size=\"${args.size}\">Carnivores</vds-dropdown-group-header>\n <vds-dropdown-item value=\"lion\" label=\"Lion\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"tiger\" label=\"Tiger\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"leopard\" label=\"Leopard\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"cheetah\" label=\"Cheetah\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"wolf\" label=\"Wolf\" size=\"${args.size}\"></vds-dropdown-item>\n\n <vds-dropdown-group-header size=\"${args.size}\">Primates</vds-dropdown-group-header>\n <vds-dropdown-item value=\"chimpanzee\" label=\"Chimpanzee\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"gorilla\" label=\"Gorilla\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"orangutan\" label=\"Orangutan\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"monkey\" label=\"Monkey\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"human\" label=\"Human\" size=\"${args.size}\"></vds-dropdown-item>\n\n <vds-dropdown-group-header size=\"${args.size}\">Rodents</vds-dropdown-group-header>\n <vds-dropdown-item value=\"rat\" label=\"Rat\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"mouse\" label=\"Mouse\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"squirrel\" label=\"Squirrel\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"hamster\" label=\"Hamster\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"guinea pig\" label=\"Guinea Pig\" size=\"${args.size}\"></vds-dropdown-item>\n\n <vds-dropdown-group-header size=\"${args.size}\">Ungulates</vds-dropdown-group-header>\n <vds-dropdown-item value=\"elephant\" label=\"Elephant\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"giraffe\" label=\"Giraffe\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"zebra\" label=\"Zebra\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"horse\" label=\"Horse\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"rhino\" label=\"Rhino\" size=\"${args.size}\"></vds-dropdown-item>\n\n <vds-dropdown-group-header size=\"${args.size}\">Cetaceans</vds-dropdown-group-header>\n <vds-dropdown-item value=\"whale\" label=\"Whale\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"dolphin\" label=\"Dolphin\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"porpoise\" label=\"Porpoise\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"orca\" label=\"Orca\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"manatee\" label=\"Manatee\" size=\"${args.size}\"></vds-dropdown-item>\n </vds-basic-dropdown>\n </div>\n`;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n size: \"medium\",\n value: \"\",\n placeholder: \"Placeholder\",\n disabled: false,\n isReadonly: false,\n error: false,\n isRequired: false,\n event: \"click\",\n showClearButton: true,\n maxHeight: \"200px\",\n matchWidth: true,\n backdrop: true,\n autoPosition: false\n}\n\nconst codeTemplateWithIcons = (args) => {\n return `\n <style>${styles}</style>\n <div class=\"container\">\n <vds-basic-dropdown\n size=\"${args.size}\"\n value=\"${args.value}\"\n placeholder=\"${args.placeholder}\"\n ${args.disabled ? \"disabled\" : \"\"}\n ${args.isReadonly ? \"is-readonly\" : \"\"}\n ${args.error ? \"error\" : \"\"}\n is-required=\"${args.isRequired}\"\n informative-icon=\"${args.informativeIcon}\"\n dynamic-informative-icon=\"${args.dynamicInformativeIcon}\"\n match-width=\"${args.matchWidth}\"\n auto-position=\"${args.autoPosition}\"\n >\n <vds-dropdown-group-header size=\"${args.size}\">My Group</vds-dropdown-group-header>\n <vds-dropdown-item informative-icon=\"add\" value=\"Item 1\" label=\"Item 1\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item informative-icon=\"administration\" value=\"Item 2 with more content\" label=\"Item 2 with more content\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item informative-icon=\"user\" value=\"Item 3\" label=\"Item 3\" size=\"${args.size}\"></vds-dropdown-item>\n </vds-basic-dropdown>\n </div>\n`;\n}\n\nexport const BasicWithIconsUsage = codeTemplateWithIcons.bind({});\n\nBasicWithIconsUsage.args = {\n size: \"medium\",\n value: \"\",\n placeholder: \"Placeholder\",\n disabled: false,\n isReadonly: false,\n error: false,\n isRequired: false,\n informativeIcon: \"add\",\n dynamicInformativeIcon: false,\n matchWidth: true,\n autoPosition: false\n}\n\nconst codeTemplateWithPredefinedItem = (args) => {\n return `\n <style>${styles}</style>\n <div class=\"container\">\n <vds-basic-dropdown\n size=\"${args.size}\"\n value=\"${args.value}\"\n placeholder=\"${args.placeholder}\"\n ${args.disabled ? \"disabled\" : \"\"}\n ${args.isReadonly ? \"is-readonly\" : \"\"}\n ${args.error ? \"error\" : \"\"}\n is-required=\"${args.isRequired}\"\n event=\"${args.event}\"\n match-width=\"${args.matchWidth}\"\n auto-position=\"${args.autoPosition}\"\n >\n <vds-dropdown-group-header size=\"${args.size}\">My Group</vds-dropdown-group-header>\n <vds-dropdown-item value=\"Item-1\" label=\"Item 1\" is-active=\"true\" is-selected=\"true\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"Item-2\" label=\"Item 2 with more content\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"Item-3\" label=\"Item 3\" size=\"${args.size}\"></vds-dropdown-item>\n </vds-basic-dropdown>\n </div>\n <div class=\"container\">\n <vds-basic-dropdown\n size=\"${args.size}\"\n value=\"Item-2\"\n placeholder=\"${args.placeholder}\"\n ${args.disabled ? \"disabled\" : \"\"}\n ${args.isReadonly ? \"is-readonly\" : \"\"}\n ${args.error ? \"error\" : \"\"}\n is-required=\"${args.isRequired}\"\n event=\"${args.event}\"\n match-width=\"${args.matchWidth}\"\n auto-position=\"${args.autoPosition}\"\n >\n <vds-dropdown-group-header size=\"${args.size}\">My Group</vds-dropdown-group-header>\n <vds-dropdown-item value=\"Item-1\" label=\"Item 1\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"Item-2\" label=\"Item 2 with more content\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item value=\"Item-3\" label=\"Item 3\" size=\"${args.size}\"></vds-dropdown-item>\n </vds-basic-dropdown>\n </div>\n`;\n}\n\nexport const BasicWithPredefinedItemUsage = codeTemplateWithPredefinedItem.bind({});\n\nBasicWithPredefinedItemUsage.args = {\n size: \"medium\",\n value: \"\",\n placeholder: \"Placeholder\",\n disabled: false,\n isReadonly: false,\n error: false,\n isRequired: false,\n event: \"click\",\n matchWidth: true,\n autoPosition: false\n}\n\nconst codeTemplateWithItemCheckmarkUsage = (args) => {\n return `\n <style>${styles}</style>\n <div class=\"container\">\n <vds-basic-dropdown\n size=\"${args.size}\"\n value=\"${args.value}\"\n placeholder=\"${args.placeholder}\"\n ${args.disabled ? \"disabled\" : \"\"}\n ${args.isReadonly ? \"is-readonly\" : \"\"}\n ${args.error ? \"error\" : \"\"}\n is-required=\"${args.isRequired}\"\n event=\"${args.event}\"\n match-width=\"${args.matchWidth}\"\n auto-position=\"${args.autoPosition}\"\n >\n <vds-dropdown-group-header size=\"${args.size}\">My Group</vds-dropdown-group-header>\n <vds-dropdown-item has-checkmark=\"true\" value=\"Item-1\" label=\"Item 1\" is-selected=\"true\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item has-checkmark=\"true\" value=\"Item-2\" label=\"Item 2 with more content\" size=\"${args.size}\"></vds-dropdown-item>\n <vds-dropdown-item has-checkmark=\"true\" value=\"Item-3\" label=\"Item 3\" size=\"${args.size}\"></vds-dropdown-item>\n </vds-basic-dropdown>\n </div>\n`;\n}\n\nexport const BasicWithItemCheckmarkUsage = codeTemplateWithItemCheckmarkUsage.bind({});\n\nBasicWithItemCheckmarkUsage.args = {\n size: \"medium\",\n value: \"Item-1\",\n placeholder: \"Placeholder\",\n disabled: false,\n isReadonly: false,\n error: false,\n isRequired: false,\n event: \"click\",\n matchWidth: true,\n autoPosition: false\n}"]}

package/dist/collection/components/basic-dropdown/vds-basic-dropdown.utils.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-basic-dropdown.utils.js","sourceRoot":"","sources":["../../../src/components/basic-dropdown/vds-basic-dropdown.utils.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Toggles the display style of an HTML element.\n * \n * @param {HTMLElement} contentBox The HTML element to toggle the display for.\n * @param {boolean} toggle A boolean value to control the display. \n * - True: Sets the display to \"block\".\n * - False: Sets the display to \"none\".\n * @returns {void}\n */\nexport const toggleContainerDisplay = (contentBox: HTMLElement, toggle: boolean): void => {\n if (!contentBox) {\n return;\n }\n\n contentBox.style.display = toggle ? \"block\" : \"none\";\n}\n\n/**\n * Unselects non-selected items in a dropdown.\n *\n * @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]|string} value The selected value or an array of selected values.\n */\nexport const unselectNonSelectedItems = (dropdownContent: HTMLElement, value: string[] | string) => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems || []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") !== value) {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n }\n if (Array.isArray(value) && item.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v !== item.getAttribute(\"value\"))) {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n }\n });\n}\n\n/**\n * Selects selected items in a dropdown.\n *\n * @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]|string} value The selected value or an array of selected values.\n */\nexport const selectSelectedItems = (dropdownContent: HTMLElement, value: string[] | string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems || []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n item.setAttribute(\"is-selected\", \"true\");\n item.setAttribute(\"is-active\", \"true\");\n }\n if (Array.isArray(value) && item.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v === item.getAttribute(\"value\"))) {\n item.setAttribute(\"is-selected\", \"true\");\n item.setAttribute(\"is-active\", \"true\");\n }\n });\n } catch (error) {\n console.warn(\"[selectSelectedItems]\", error);\n }\n}\n\n/**\n * Gets selected label in single dropdown using value\n *\n * @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]|string} value The selected value or an array of selected values.\n */\nexport const getSelectedLabel = (dropdownContent: HTMLElement, value: string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n let response = \"\";\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems || []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n response = (item as HTMLVdsDropdownItemElement)?.label || (item as HTMLVdsDropdownItemElement)?.textContent;\n }\n });\n return response;\n } catch (error) {\n console.warn(\"[getSelectedLabel]\", error);\n }\n}\n\nexport const scrollToSelectedValue = (dropdownContent: HTMLElement, value: string[] | string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n let selectedItem: Element | null = null;\n Array.from(dropdownItems || []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n selectedItem = item;\n }\n });\n \n // Scroll to option when is single value\n if (typeof value === \"string\" && selectedItem) {\n selectedItem.scrollIntoView({\n behavior: \"instant\",\n block: \"center\",\n inline: \"center\",\n });\n }\n } catch (error) {\n console.warn(\"[ScrollToSelectedValue]\", error);\n }\n}\n\n/**\n * Gets thje selected text items in a dropdown.\n *\n * @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]|string} value The selected value or an array of selected values.\n */\nexport const getSelectedItemsText = (dropdownContent: HTMLElement, value: string[]): string[] => {\n if (!dropdownContent) {\n return [];\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n return Array.from(dropdownItems || [])\n .filter(ditem => ditem.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v === ditem.getAttribute(\"value\")))\n .map(item => item.getAttribute(\"label\"))\n}\n\n/**\n * Unselects all items in a dropdown.\n *\n * @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]|string} value The selected value or an array of selected values.\n */\nexport const unselectAllItems = (dropdownContent: HTMLElement) => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems || []).forEach(item => {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n });\n}\n\n/**\n * Emits a native \"input\" event on the specified host element.\n *\n * @param {HTMLElement} hostEl The host element to emit the event on.\n */\nexport const emitNativeInputEvent = (hostEl: HTMLElement): void => {\n if (!hostEl) {\n return;\n }\n\n const inputEvent = new InputEvent(\"input\");\n hostEl.dispatchEvent(inputEvent);\n}\n\n/**\n * Checks if a given value is a valid option within a dropdown content element.\n *\n * @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string} value The value to check for validity.\n * @returns {boolean} True if the value is a valid option, false otherwise.\n *\n * **Validity criteria:**\n * - The value must match the `value` attribute of at least one `vds-dropdown-item` element within the dropdown content.\n */\nexport const isValidOption = (dropdownContent: HTMLElement, value: string): boolean => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n return Array.from(dropdownItems || []).some(item => item.getAttribute(\"value\") === value);\n}\n\n/**\n * Filters a list of options to only include those that are valid within a specified host element.\n *\n * @param {HTMLElement} hostEl The host element to validate options against.\n * @param {string[]} options The list of options to filter.\n * @returns {string[]} A new array containing only the valid options from the input list.\n *\n * **Validity criteria:**\n * - An option is considered valid if it matches the `value` attribute of at least one `vds-dropdown-item` element within the host element's dropdown content.\n */\nexport const getValidOptions = (hostEl: HTMLElement, options: string[]): string[] => {\n const validOptions = [];\n options.forEach(nv => {\n if (isValidOption(hostEl, nv)) {\n validOptions.push(nv);\n }\n })\n return validOptions;\n}\n\n/**\n * Sets dropdown styles for JSX.style property\n *\n * @param maxHeight string\n * @returns { [key: string]: string }\n */\nexport const setDropdownStyles = (maxHeight: string): { [key: string]: string } => {\n let styles = {};\n\n styles = {\n maxHeight: maxHeight ? maxHeight : undefined,\n }\n\n return styles;\n}\n\n/**\n * Updates the container width to match the trigger width when matchWidth is true.\n *\n * @param {HTMLElement} dropdownTrigger - The HTML button element that triggers the dropdown.\n * @param {boolean} matchWidth - A flag indicating whether to match the width of the dropdown content to the trigger.\n * @param {HTMLDivElement} dropdownContent - The dropdown content element whose width is to be updated.\n */\nexport const updateContainerWidth = (dropdownTrigger: HTMLElement, matchWidth: boolean, dropdownContent: HTMLDivElement) => {\n try {\n if (matchWidth && dropdownTrigger && dropdownContent) {\n const triggerWidth = dropdownTrigger.offsetWidth;\n dropdownContent.style.setProperty('--trigger-width', `${triggerWidth}px`);\n dropdownContent.classList.add('match-width');\n } else if (dropdownContent){\n dropdownContent.classList.remove('match-width');\n }\n } catch (error) {\n console.warn(\"[updateContainerWidth]\", error);\n }\n};"]}

package/dist/collection/components/breadcrumb-item/vds-breadcrumbs-item.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-breadcrumbs-item.js","sourceRoot":"","sources":["../../../src/components/breadcrumb-item/vds-breadcrumbs-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAO7D,MAAM,OAAO,iBAAiB;IAL9B;QAME,gDAAgD;QACxC,aAAQ,GAAY,KAAK,CAAC;QAElC,8CAA8C;QACtC,aAAQ,GAAY,KAAK,CAAC;KAenC;IAbC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,cAAc,CACxB,sBAAsB,EACtB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,gCAAgC,CAAC,CAAC,CAAC,EAAE,EACrD,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,EAAE,CACpD;gBACC,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\n\n@Component({\n tag: 'vds-breadcrumbs-item',\n styleUrl: 'vds-breadcrumbs-item.scss',\n shadow: true,\n})\nexport class VdsBreadcrumbItem {\n /** Sets the breacrumb item in disabled state */\n @Prop() disabled: boolean = false;\n\n /** Sets the breacrumb item in active state */\n @Prop() isActive: boolean = false;\n\n render() {\n return (\n <Host>\n <div class={combineClasses(\n \"vds-breadcrumbs-item\",\n this.disabled ? \"vds-breadcrumbs-item--disabled\" : \"\",\n this.isActive ? \"vds-breadcrumbs-item--active\" : \"\"\n )}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/breadcrumb-item/vds-breadcrumbs-item.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-breadcrumbs-item.stories.js","sourceRoot":"","sources":["../../../src/components/breadcrumb-item/vds-breadcrumbs-item.stories.tsx"],"names":[],"mappings":"AAAA,eAAe;IACX,KAAK,EAAE,2CAA2C;IAClD,UAAU,EAAE;QACR,IAAI,EAAE;YACF,GAAG,EAAE,IAAI;SACZ;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,OAAO;YACb,GAAG,EAAE,6GAA6G;SACrH;KACJ;CACJ,CAAC;AAEF,MAAM,KAAK,GAAG;;;;;;;;CAQb,CAAA;AAED,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,EAAE;IAC1B,OAAO;EACT,KAAK;;sCAE+B,IAAI,CAAC,QAAQ,aAAa,IAAI,CAAC,QAAQ;sBACvD,IAAI,CAAC,IAAI;;;CAG9B,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,UAAU,CAAC,IAAI,GAAG;IACd,IAAI,EAAE,eAAe;IACrB,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;CAClB,CAAA;AAGD,MAAM,YAAY,GAAG,GAAG,EAAE;IACtB,OAAO;EACT,KAAK;;;;;;;;;;;;;;;;;;;;;;;;CAwBN,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE/C,SAAS,CAAC,IAAI,GAAG,EAChB,CAAA","sourcesContent":["export default {\n title: 'VDS/Components/Breadcrumbs/BreadcrumbItem',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?node-id=33183-125481&focus-id=33183-125481&m=dev\"\n }\n }\n};\n\nconst style = `\n<style>\n .container {\n width: 500px;\n padding: 10px;\n margin: auto;\n }\n</style>\n`\n\nconst codeTemplate = (args) => {\n return `\n${style}\n<div class=\"container\">\n <vds-breadcrumbs-item is-active=${args.isActive} disabled=${args.disabled}>\n <a href=\"#\">${args.text}</a>\n </vds-breadcrumbs-item>\n</div>\n`;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n text: 'Horror movies',\n isActive: false,\n disabled: false\n}\n\n\nconst menuTemplate = () => {\n return `\n${style}\n<div class=\"container\">\n <vds-breadcrumbs-item class=\"truncate-menu\">\n <vds-menu>\n <vds-icon-button class=\"breadcrumb\" slot=\"menu-trigger\" variant=\"tertiary\" icon=\"more-horizontal\"></vds-icon-button>\n <div slot=\"menu-content\">\n <vds-menu-list>\n <vds-menu-item class=\"breadcrumb\">\n <a href=\"google.com\">Home</a>\n </vds-menu-item>\n <vds-menu-item class=\"breadcrumb\" disabled>\n <a href=\"google.com\">Food supply</a>\n </vds-menu-item>\n <vds-menu-item class=\"breadcrumb\" danger>\n <a href=\"google.com\">Meals</a>\n </vds-menu-item>\n <vds-menu-item class=\"breadcrumb\" is-active>\n <a href=\"#\">Food</a>\n </vds-menu-item>\n </vds-menu-list>\n </div>\n </vds-menu>\n </vds-breadcrumbs-item>\n</div>\n`;\n}\n\nexport const MenuUsage = menuTemplate.bind({});\n\nMenuUsage.args = {\n}"]}

package/dist/collection/components/button/vds-button.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-button.js","sourceRoot":"","sources":["../../../src/components/button/vds-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAO/D,MAAM,OAAO,SAAS;IALtB;QAME,wBAAwB;QACjB,SAAI,GAAiC,QAAQ,CAAC;QACrD,2BAA2B;QACpB,YAAO,GAAiE,SAAS,CAAC;QACzF,kDAAkD;QAC3C,kBAAa,GAAgC,QAAQ,CAAC;QAC3D,yCAAyC;QACnC,WAAM,GAAY,KAAK,CAAC;QAChC,oCAAoC;QAC7B,aAAQ,GAAY,KAAK,CAAC;QACjC,oIAAoI;QAC7H,gBAAW,GAAY,KAAK,CAAC;KAsDrC;IAlDA,YAAY,CAAC,KAAY;QACtB,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,KAAK,CAAC,wBAAwB,EAAE,CAAC;QACnC,CAAC;aAAM,CAAC;YACN,IAAI,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ,EAAE,CAAC;gBAClD,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,CAAC;QACH,CAAC;IACJ,CAAC;IAEQ,UAAU;QAClB,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC/B,CAAC;IAEA,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,cAAc,CACzB,YAAY,EACZ,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE,EAC/C,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAChC;YACC,6EACE,OAAO,EAAE,CAAC,GAAU,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,EAC/C,KAAK,EAAE,cAAc,CACnB,qBAAqB,EACrB,wBAAwB,IAAI,CAAC,OAAO,EAAE,EACtC,sBAAsB,IAAI,CAAC,aAAa,EAAE,EAC1C,qBAAqB,IAAI,CAAC,IAAI,EAAE,EAChC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,EACvC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAC1C,IAAI,CAAC,WAAW,CAAA,CAAC,CAAC,+BAA+B,CAAA,CAAC,CAAA,EAAE,CACrD,EACD,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,IAC5B,eAAe,CACvB,IAAI,CAAC,MAAM,EACL,UAAU,EACV,OAAO,EACP,OAAO,CAAC;gBAEV,6DAAM,IAAI,EAAC,WAAW,GAAQ;gBAC9B,8DAAa;gBACb,6DAAM,IAAI,EAAC,YAAY,GAAQ,CACxB,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Element, Host, Prop, h } from '@stencil/core';\nimport { shadowSubmitForm } from '../../utils/form';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { cloneAttributes } from '../../utils/clone-attributes';\n\n@Component({\n tag: 'vds-button',\n styleUrl: 'vds-button.scss',\n shadow: true,\n})\nexport class VdsButton {\n /** Set button's size */\n\t@Prop() size: \"large\" | \"medium\" | \"small\" = \"medium\";\n /** Set button's variant */\n\t@Prop() variant: \"primary\" | \"secondary\" | \"tertiary\" | \"ghost\" | \"ghost-alt\" = \"primary\";\n /** Allow to change the button's text alignment */\n\t@Prop() textAlignment: \"right\" | \"left\" | \"center\" = \"center\";\n /** Enable button's danger/error state */\n @Prop() danger: boolean = false;\n /** Enable button's disable state */\n\t@Prop() disabled: boolean = false;\n /** Enable button's full width. This prop permits to the component will be adaptable to the container available horizontal space. */\n\t@Prop() isFullWidth: boolean = false;\n\n @Element() hostEl: HTMLButtonElement;\n\n\thandleSubmit(event: Event): void {\n if (this.disabled) {\n event.preventDefault();\n event.stopPropagation();\n event.stopImmediatePropagation();\n } else {\n if (this.hostEl.getAttribute(\"type\") === \"submit\") {\n this.submitForm();\n }\n }\n\t}\n\n private submitForm(): void {\n\t\tshadowSubmitForm(this.hostEl);\n\t}\n\n render() {\n return (\n <Host class={combineClasses(\n \"vds-button\",\n this.isFullWidth ? \"vds-button--fullwidth\" : \"\",\n this.disabled ? \"disabled\" : \"\"\n )}>\n <button\n onClick={(evt: Event) => this.handleSubmit(evt)}\n class={combineClasses(\n `vds-button__element`,\n `vds-button__variant--${this.variant}`,\n `vds-button__align--${this.textAlignment}`,\n `vds-button__size--${this.size}`,\n this.danger ? \"vds-button__danger\" : \"\",\n this.disabled ? \"vds-button-disabled\" : \"\",\n this.isFullWidth? \"vds-button__element_fullwidth\":\"\"\n )}\n type=\"button\"\n disabled={ this.disabled || null}\n {...cloneAttributes(\n\t\t\t\t\t\tthis.hostEl,\n \"disabled\",\n \"class\",\n \"style\")}\n >\n <slot name=\"icon-left\"></slot>\n <slot></slot>\n <slot name=\"icon-right\"></slot>\n </button>\n </Host>\n );\n }\n\n}\n"]}

package/dist/collection/components/button/vds-button.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-button.stories.js","sourceRoot":"","sources":["../../../src/components/button/vds-button.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { getIconsFromSpriteFile } from \"../../utils/icon-utils\";\n\nconst ICON_LIST = getIconsFromSpriteFile();\n\nexport default {\n title: 'VDS/Components/Buttons/Button',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=28590-13838\"\n }\n },\n argTypes: {\n variant: {\n options: [\"primary\", \"secondary\", \"tertiary\", \"ghost\", \"ghost-alt\"],\n control: { type: \"select\" }\n },\n size: {\n options: [\"large\", \"medium\", \"small\"],\n control: { type: \"select\" }\n },\n textAlignment: {\n options: [\"right\", \"left\", \"center\"],\n control: { type: \"select\" }\n },\n iconLeft: {\n options: ICON_LIST,\n control: { type: \"select\" }\n },\n iconRight: {\n options: ICON_LIST,\n control: { type: \"select\" }\n }\n },\n};\n\nconst getIconSize = size => {\n switch (size) {\n case 'small':\n return '1rem';\n case 'large':\n return '1.5rem';\n default:\n return '1.25rem';\n }\n};\n\nconst styles = `vds-button { margin: 20px }`;\n \nconst codeTemplate = (args) => {\n return `\n<style>${styles}</style>\n<vds-button\n id=\"btn-test\"\n variant=\"${args.variant}\"\n text-alignment=\"${args.textAlignment}\"\n size=\"${args.size || \"medium\"}\"\n disabled=\"${args.disabled || false}\"\n danger=\"${args.danger || false}\"\n is-full-width=\"${args.isFullWidth || false}\"\n>\n ${args.iconLeft ? `<vds-icon slot=\"icon-left\" svg-icon=\"${args.iconLeft}\" size=\"${getIconSize(args.size)}\"></vds-icon>` : \"\"}\n ${args.text}\n ${args.iconRight ? `<vds-icon slot=\"icon-right\" svg-icon=\"${args.iconRight}\" size=\"${getIconSize(args.size)}\"></vds-icon>` : \"\"}\n</vds-button>\n `; \n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n variant: \"primary\",\n textAlignment: \"center\",\n size: \"medium\",\n danger: false,\n disabled: false,\n text: \"Button\",\n iconLeft: undefined,\n iconRight: undefined,\n isFullWidth: false\n};\n\nconst sizesCodeTemplate = (args) => {\n return `\n<style>${styles}</style>\n<vds-button\n variant=\"${args.variant}\"\n size=\"large\"\n disabled=\"${args.disabled || false}\"\n danger=\"${args.danger || false}\"\n is-full-width=\"${args.isFullWidth || false}\"\n>\n ${args.iconLeft ? `<vds-icon slot=\"icon-left\" svg-icon=\"${args.iconLeft}\" size=\"1.5rem\"></vds-icon>` : \"\"}\n ${args.text}\n ${args.iconRight ? `<vds-icon slot=\"icon-right\" svg-icon=\"${args.iconRight}\" size=\"1.5rem\"></vds-icon>` : \"\"}\n</vds-button>\n<vds-button\n variant=\"${args.variant}\"\n size=\"medium\"\n disabled=\"${args.disabled || false}\"\n danger=\"${args.danger || false}\"\n is-full-width=\"${args.isFullWidth || false}\"\n>\n ${args.iconLeft ? `<vds-icon slot=\"icon-left\" svg-icon=\"${args.iconLeft}\" size=\"1.25rem\"></vds-icon>` : \"\"}\n ${args.text}\n ${args.iconRight ? `<vds-icon slot=\"icon-right\" svg-icon=\"${args.iconRight}\" size=\"1.25rem\"></vds-icon>` : \"\"}\n</vds-button>\n<vds-button\n variant=\"${args.variant}\"\n size=\"small\"\n disabled=\"${args.disabled || false}\"\n danger=\"${args.danger || false}\"\n is-full-width=\"${args.isFullWidth || false}\" \n>\n ${args.iconLeft ? `<vds-icon slot=\"icon-left\" svg-icon=\"${args.iconLeft}\" size=\"1rem\"></vds-icon>` : \"\"}\n ${args.text}\n ${args.iconRight ? `<vds-icon slot=\"icon-right\" svg-icon=\"${args.iconRight}\" size=\"1rem\"></vds-icon>` : \"\"}\n</vds-button>\n `; \n}\n\nexport const Sizes = sizesCodeTemplate.bind({});\n\nSizes.args = {\n variant: \"primary\",\n danger: false,\n disabled: false,\n text: \"Button\",\n iconLeft: undefined,\n iconRight: undefined,\n isFullWidth: false\n};\n\n\nconst buttonsCodeTemplate = (args, variant) => {\n return `\n<style>${styles}</style>\n<vds-button\n variant=\"${variant}\"\n text-alignment=\"center\"\n size=\"${args.size || \"medium\"}\"\n disabled=\"${args.disabled || false}\"\n danger=\"${args.danger || false}\"\n is-full-width=\"${args.isFullWidth || false}\" \n>\n ${args.iconLeft ? `<vds-icon slot=\"icon-left\" svg-icon=\"${args.iconLeft}\" size=\"${getIconSize(args.size)}\"></vds-icon>` : \"\"}\n ${args.text}\n ${args.iconRight ? `<vds-icon slot=\"icon-right\" svg-icon=\"${args.iconRight}\" size=\"${getIconSize(args.size)}\"></vds-icon>` : \"\"}\n</vds-button>\n `; \n}\n\nexport const Primary = (args) => buttonsCodeTemplate(args, \"primary\");\n\nPrimary.args = {\n size: \"medium\",\n danger: false,\n disabled: false,\n text: \"Primary Button\",\n iconLeft: undefined,\n iconRight: undefined,\n isFullWidth: false\n};\n\nexport const Secondary = (args) => buttonsCodeTemplate(args, \"secondary\");\n\nSecondary.args = {\n size: \"medium\",\n danger: false,\n disabled: false,\n text: \"Secondary Button\",\n iconLeft: undefined,\n iconRight: undefined,\n isFullWidth: false\n};\n\nexport const Tertiary = (args) => buttonsCodeTemplate(args, \"tertiary\");\n\nTertiary.args = {\n size: \"medium\",\n danger: false,\n disabled: false,\n text: \"Tertiary Button\",\n iconLeft: undefined,\n iconRight: undefined,\n isFullWidth: false\n};\n\nexport const Ghost = (args) => buttonsCodeTemplate(args, \"ghost\");\n\nGhost.args = {\n size: \"medium\",\n danger: false,\n disabled: false,\n text: \"Ghost Button\",\n iconLeft: undefined,\n iconRight: undefined,\n isFullWidth: false\n};\n\nexport const GhostAlt = (args) => buttonsCodeTemplate(args, \"ghost-alt\");\n\nGhostAlt.args = {\n size: \"medium\",\n danger: false,\n disabled: false,\n text: \"Ghost-Alt Button\",\n iconLeft: undefined,\n iconRight: undefined,\n isFullWidth: false\n};\n\nconst dangerCodeTemplate = (args) => {\n const variants = [\"primary\", \"secondary\", \"ghost\", \"ghost-alt\"];\n return `\n<style>${styles}</style>\n${variants.map(variant => \n `<vds-button variant=\"${variant}\" is-full-width=\"${args.isFullWidth || false}\" size=\"medium\" danger=\"true\">${variant} button</vds-button>`\n).join(\"\")}`; \n}\n\n//export const Danger = dangerCodeTemplate.bind({});\nexport const Danger = (args) => dangerCodeTemplate(args);\n\nDanger.args = {\n isFullWidth: false\n};"]}

package/dist/collection/components/card/vds-card.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-card.js","sourceRoot":"","sources":["../../../src/components/card/vds-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h } from '@stencil/core';\nimport { HTMLStencilElement, Prop, Event, EventEmitter, Watch } from '@stencil/core/internal';\nimport { Colors } from '../../definitions/colors';\nimport { Spacing } from '../../definitions/spacing';\nimport { ShadowBox } from '../../definitions/shadows';\nimport { combineClasses } from '../../utils/combine-classes';\n@Component({\n tag: 'vds-card',\n styleUrl: 'vds-card.scss',\n shadow: true,\n})\nexport class VdsCard {\n /** Padding of component based on volt-spacing tokens */\n @Prop({ mutable: true }) padding: Spacing = 'spacing-05';\n /** Selectable property allow the card to toggle between selected and unselected state.\n * This property can't be used with the button property at the same time */\n @Prop({ mutable: true }) selectable: boolean = false;\n /** Sets the selected state for the card (only works when selectable property is true).\n * This property can't be used with the button property at the same time */\n @Prop({ mutable: true }) selected: boolean = false;\n /** Button property allows the card to behave like a button.\n * This property can't be used with the selectable property at the same time */\n @Prop({ mutable: true }) button = false;\n /** Sets the card in disabled state */\n @Prop({ mutable: true }) disabled = false;\n /** Allows changing the default card variant */\n @Prop({ mutable: true }) variant: 'primary' | 'secondary' | 'danger' | 'default' = 'default';\n /** Sets the shadow for the card */\n @Prop({ mutable: true }) shadowBox: ShadowBox = 'elevation-shadow-1';\n\n /**\n * Allows changing the default border color.\n * @deprecated This property is deprecated and will be removed from the code in the future.\n */\n @Prop() borderColor: Colors;\n /**\n * Allows changing the border color when hovering.\n * @deprecated This property is deprecated and will be removed from the code in the future.\n */\n @Prop() borderHoverColor: Colors;\n\n /** Emits event when card have been selected (only works when selectable property is true) */\n @Event() select: EventEmitter<boolean>;\n /** Emits event when card have been clicked on (only works when button property is true) */\n @Event() click: EventEmitter<MouseEvent>;\n\n @Watch('selected')\n emitSelected(): void {\n if (this.selectable) {\n this.select.emit(this.selected);\n }\n }\n\n @Watch('selectable')\n @Watch('button')\n handleBehaviorValidation(): void {\n if (this.button && this.selectable) {\n this.selectable = false;\n this.selected = false;\n }\n if (!this.selectable && this.selected) {\n this.selected = false;\n }\n }\n\n /**\n * Sets card's custom border colors\n *\n * @returns { [key: string]: string }\n */\n private setCustomBorderColors(): { [key: string]: string } {\n const styles = {};\n\n if (this.borderColor) {\n styles['--vds-card-default-border-color'] = `var(--${this.borderColor})`;\n }\n\n if (this.borderHoverColor) {\n styles['--vds-card-default-border-hover-color'] = `var(--${this.borderHoverColor})`;\n }\n\n return styles;\n }\n\n private handleSelectable(): void {\n this.selected = !this.selected;\n }\n\n private handleClick(evt: MouseEvent): void {\n if (this.button) {\n this.click.emit(evt);\n }\n\n if (this.selectable) {\n this.handleSelectable();\n }\n }\n\n componentWillLoad(): void {\n this.handleBehaviorValidation();\n }\n\n render(): HTMLStencilElement {\n return (\n <Host class={combineClasses(this.disabled ? \"vds-card--disabled\" : \"\")}>\n <div\n onClick={(evt: MouseEvent) => {\n this.handleClick(evt);\n }}\n style={this.setCustomBorderColors()}\n class={`\n vds__card \n vds__card--${this.variant}\n padding__${this.padding}\n shadow__${this.shadowBox}\n ${this.selectable ? 'vds__card--selectable' : ''}\n ${this.selectable && this.selected ? 'vds__card--selected' : ''}\n ${this.button ? 'vds__card--button' : ''}\n ${this.disabled ? 'vds__card--disabled' : ''}\n `}\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/card/vds-card.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-card.stories.js","sourceRoot":"","sources":["../../../src/components/card/vds-card.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import spacingVars from \"../../constants/spacing-vars\";\nimport shadowVars from \"../../constants/shadow-vars\";\n\nconst SPACING_VARS = Object.keys(spacingVars)\nconst SHADOW_VARS = Object.keys(shadowVars);\n\nexport default {\n title: 'VDS/Components/Card',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=28956-6874\"\n }\n },\n argTypes: {\n padding: {\n options: [...SPACING_VARS],\n control: { type: \"select\" }\n },\n shadowBox: {\n options: [...SHADOW_VARS],\n control: { type: \"select\" }\n },\n variant: {\n options: [\"default\", \"primary\", \"secondary\", \"danger\"],\n control: { type: \"select\" }\n }\n },\n};\n\nconst styles = `\n vds-card {\n padding: 10px;\n }\n .parent-container {\n position: relative;\n height: 20px;\n }\n .child-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n span {\n font-size: 1.25rem;\n line-height: 1.5rem;\n font-weight: bold;\n color: var(--color-text-high);\n }\n`;\n \nconst codeTemplate = (args) => {\n return `\n<style>${styles}</style>\n<vds-card \n selectable=\"${args.selectable || false}\"\n padding=\"${args.padding}\"\n variant=\"${args.variant}\"\n shadow-box=\"${args.shadowBox}\"\n selected=\"${args.selected || false}\"\n button=\"${args.button || false}\" \n disabled=\"${args.disabled || false}\"\n>\n <div class=\"parent-container\">\n <div class=\"child-container\">\n <span>Content</span>\n </div>\n </div>\n</vds-card>\n `;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n selectable: false,\n padding: \"spacing-16\",\n variant: \"default\",\n shadowBox: \"elevation-shadow-1\",\n selected: false,\n button: false,\n disabled: false\n};\n\nexport const Selectable = codeTemplate.bind({});\n\nSelectable.args = {\n padding: \"spacing-16\",\n variant: \"default\",\n shadowBox: \"elevation-shadow-1\",\n selectable: true,\n selected: false,\n};\n\nexport const Button = codeTemplate.bind({});\n\nButton.args = {\n padding: \"spacing-16\",\n variant: \"default\",\n shadowBox: \"elevation-shadow-1\",\n button: true,\n};\n\nconst stylesCustom = `\n vds-card {\n padding: 10px;\n\n --vds-card-default-border-color: var(--color-background-healthy-lowest-press);\n --vds-card-default-border-hover-color: var(--color-border-healthy);\n --vds-card-default-border-press-color: var(--color-border-healthy);\n --vds-card-default-background-color: var(--color-background-healthy-lowest-default);\n --vds-card-default-background-hover-color: var(--color-background-healthy-lowest-hover);\n --vds-card-default-background-press-color: var(--color-background-healthy-lowest-press);\n --vds-card-default-selected-border-color: var(--color-border-healthy);\n --vds-card-default-selected-background-color: var(--color-background-healthy-lowest-hover);\n\n --vds-card-primary-border-hover-color: var(--color-interaction-brand-low);\n --vds-card-primary-background-color: var(--color-background-information-lowest-default);\n --vds-card-primary-background-hover-color: var(--color-background-information-lowest-hover);\n --vds-card-primary-background-press-color: var(--color-background-information-lowest-press);\n --vds-card-primary-selected-border-color: var(--color-interaction-brand-lower);\n --vds-card-primary-selected-background-color: var(--color-background-information-lowest-hover);\n }\n .parent-container {\n position: relative;\n height: 20px;\n }\n .child-container {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n span {\n font-size: 1.25rem;\n line-height: 1.5rem;\n font-weight: bold;\n color: var(--color-text-high);\n }\n`;\n\nconst codeTemplateCustom = (args) => {\n return `\n<style>${stylesCustom}</style>\n<vds-card \n selectable=\"${args.selectable || false}\"\n padding=\"${args.padding}\"\n variant=\"default\"\n shadow-box=\"${args.shadowBox}\"\n selected=\"${args.selected || false}\"\n button=\"${args.button || false}\" \n ${args.disabled ? `disabled=\"${args.disabled}\"` : \"\"}\n>\n <div class=\"parent-container\">\n <div class=\"child-container\">\n <span>Default Custom Variant</span>\n </div>\n </div>\n</vds-card>\n<vds-card \n selectable=\"${args.selectable || false}\"\n padding=\"${args.padding}\"\n variant=\"primary\"\n shadow-box=\"${args.shadowBox}\"\n selected=\"${args.selected || false}\"\n button=\"${args.button || false}\" \n disabled=\"${args.disabled || false}\"\n>\n <div class=\"parent-container\">\n <div class=\"child-container\">\n <span>Primary Custom Variant</span>\n </div>\n </div>\n</vds-card>\n `;\n}\n\nexport const CustomColorsUsage = codeTemplateCustom.bind({});\n\nCustomColorsUsage.args = {\n selectable: false,\n padding: \"spacing-16\",\n shadowBox: \"elevation-shadow-1\",\n selected: false,\n button: false,\n disabled: false\n};"]}

package/dist/collection/components/checkbox/vds-checkbox.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-checkbox.js","sourceRoot":"","sources":["../../../src/components/checkbox/vds-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h } from \"@stencil/core\";\nimport { HTMLStencilElement, Prop, Method, Event, EventEmitter, Element, AttachInternals, Watch } from \"@stencil/core/internal\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { CheckboxEvent } from \"./vds-checkbox.utils\";\n\n@Component({\n tag: \"vds-checkbox\",\n styleUrl: \"vds-checkbox.scss\",\n shadow: true,\n formAssociated: true\n})\nexport class VdsBasicCheckbox {\n /** Sets the text to be shown in the checkbox */\n @Prop({ reflect: true, mutable: true }) labelValue: string;\n /** Sets the checkbox in checked state */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n /** Sets the checkbodx in indeterminate state */\n @Prop({ reflect: true, mutable: true }) indeterminate: boolean = false;\n /** Sets the checkbox in disabled state */\n @Prop({ reflect: true, mutable: true }) disabled: boolean = false;\n /** Sets the checkbox in error state */\n @Prop({ reflect: true, mutable: true }) error: boolean = false;\n /** Sets the checkbox's size */\n @Prop({ mutable: true }) size: \"medium\" | \"large\" = \"medium\";\n /** Toggles the required sign in the field */\n @Prop({ mutable: true }) isRequired: boolean = false;\n /** Sets the value in the input. Usually uses checked prop as string. \n * Used to manage Reactive forms and other native functionality */\n @Prop({ reflect: true, mutable: true }) value: string;\n\n @Element() hostEl: HTMLElement;\n\n @AttachInternals() internals: ElementInternals;\n\n /**\n * Event which is triggered when checkbox state changes. This event also captures if\n * any of the special keys (shift, ctrl, meta or alt) where pressed when the checkbox state\n * changed. Use CheckboxEvent.isChecked() or\n * checkbox.on('checkboxEvent', (event : CustomEvent<CheckboxEvent>) => {\n *\t\tif(event.detail == true) {\n *\t\t\tconsole.log('Checked');\n * \t\t}\n * console.log(event.detail.altKey);\n * console.log(event.detail.shiftKey);\n * console.log(event.detail.ctrlKey);\n * })\n *\n */\n @Event() checkboxChange: EventEmitter<CheckboxEvent>;\n /** Makes a custom change to target property using checked and indeterminate (use for React components) */\n @Event() check: EventEmitter<boolean>;\n\n private state: \"checked\" | \"unchecked\" | \"indeterminate\" = \"unchecked\";\n\n componentWillRender(): void {\n this.setCheckboxState();\n }\n\n componentDidLoad(): void {\n if (this.internals && !!this.internals.setFormValue) {\n this.internals.setFormValue(this.checked.toString());\n }\n }\n\n /**\n * Executes every time checked value changes.\n * Sets indeterminate value to false in order to guarantee a change in value.\n * Sets form value in order to work properly with native forms\n *\n * @returns void\n */\n @Watch(\"checked\")\n setCheckedStates(): void {\n this.indeterminate = false;\n if (this.internals && !!this.internals.setFormValue) {\n this.internals.setFormValue(this.checked.toString());\n }\n }\n\n /**\n * Executes every time the checkbox is being click.\n * Executes toggleCheck method.\n *\n * @param event - MouseEvent\n * @returns void\n */\n\thandleClick(event: MouseEvent): void {\n\t\tthis.toggleCheck(event);\n\t}\n\n /**\n * Toggles checkbox value.\n * Emits checkboxChange event with CheckboxEvent value.\n * Emits check event with checked value.\n *\n * @param evt - KeyboardEvent | MouseEvent\n * @returns Promise<void>\n */\n @Method()\n toggleCheck(evt?: KeyboardEvent | MouseEvent): Promise<void> {\n if (!this.disabled) {\n const inputEvent = new InputEvent(\"input\");\n\t\t\tthis.checked = !this.checked;\n this.value = this.checked.toString();\n\t\t\tthis.indeterminate = false;\n\t\t\tthis.checkboxChange.emit(\n\t\t\t\tnew CheckboxEvent(\n\t\t\t\t\tthis.checked,\n\t\t\t\t\tevt?.altKey,\n\t\t\t\t\tevt?.ctrlKey,\n\t\t\t\t\tevt?.metaKey,\n\t\t\t\t\tevt?.shiftKey\n\t\t\t\t)\n\t\t\t);\n\t\t\tthis.check.emit(this.checked);\n this.hostEl.dispatchEvent(inputEvent);\n\t\t}\n return Promise.resolve();\n }\n\n /**\n * Determine state of the checkbox based on the indeterminate and checked properties.\n * When indetermanate is true, state is indeterminate.\n * When indetermanate is false and checked is true, state is checked.\n * When indetermanate is false and checked is false, state is unchecked.\n *\n * @returns void\n */\n private setCheckboxState(): void {\n this.state = this.indeterminate ? \"indeterminate\" : this.checked ? \"checked\" : \"unchecked\";\n }\n\n /**\n * Returns the icon prop based on the state and calculate the size.\n *\n * @returns HTMLStencilElement\n */\n private renderCheckbox(): HTMLStencilElement {\n const size = this.size === \"large\" ? \"1.5rem\" : \"1.25rem\";\n const disabledClass = this.disabled ? \"checkbox-icon-disabled\" : \"\";\n switch(this.state) {\n case \"checked\":\n return <vds-icon class={`checkbox-icon checkbox-icon-checked ${disabledClass}`} svgIcon={`checked`} size={size}></vds-icon>;\n case \"indeterminate\":\n return <vds-icon class={`checkbox-icon checkbox-icon-indeterminate ${disabledClass}`} svgIcon={`indeterminate`} size={size}></vds-icon>\n default:\n return <vds-icon class={`checkbox-icon ${disabledClass}`} svgIcon={`unchecked`} size={size}></vds-icon>;; \n }\n }\n\n /**\n * Returns the vds-label for the checkbox when there is a label provided.\n *\n * @returns HTMLStencilElement\n */\n private renderLabel(): HTMLStencilElement {\n return <vds-label class={\"checkbox-label\"} labelValue={this.labelValue} required={this.isRequired} size={this.size} disabled={this.disabled}></vds-label>\n }\n\n render(): HTMLStencilElement {\n return (\n <Host state={this.state}>\n <div\n onClick={(evt): void => {this.handleClick(evt)}}\n class={combineClasses(\n \"vds__checkbox__container\",\n `vds__checkbox__container--size-${this.size}`,\n this.checked && !this.indeterminate ? \"vds__checkbox--checked\" : \"\",\n this.indeterminate ? \"vds__checkbox--indeterminate\" : \"\",\n this.disabled ? \"vds__checkbox--disabled\" : \"\",\n this.error ? \"vds__checkbox--error\" : \"\",\n )}\n >\n <div class=\"vds__checkbox\">\n <input\n type={\"checkbox\"}\n checked={this.checked}\n value={this.value}\n id={this.hostEl?.id}\n disabled={this.disabled} />\n {this.renderCheckbox()}\n </div>\n {this.labelValue && this.renderLabel()}\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/checkbox/vds-checkbox.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-checkbox.stories.js","sourceRoot":"","sources":["../../../src/components/checkbox/vds-checkbox.stories.tsx"],"names":[],"mappings":"AAAA,eAAe;IACX,KAAK,EAAE,oCAAoC;IAC3C,UAAU,EAAE;QACR,IAAI,EAAE;YACJ,GAAG,EAAE,IAAI;SACV;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,OAAO;YACb,GAAG,EAAE,sFAAsF;SAC9F;KACF;IACH,QAAQ,EAAE;QACN,IAAI,EAAE;YACF,OAAO,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;YAC5B,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC9B;KACJ;CACJ,CAAC;AAEF,MAAM,MAAM,GAAG;;;;;CAKd,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,EAAE;IAC1B,OAAO;SACF,MAAM;;;gBAGC,IAAI,CAAC,IAAI;uBACF,IAAI,CAAC,UAAU;mBACnB,IAAI,CAAC,OAAO;yBACN,IAAI,CAAC,aAAa;oBACvB,IAAI,CAAC,QAAQ;iBAChB,IAAI,CAAC,KAAK;uBACJ,IAAI,CAAC,UAAU;;;;CAIrC,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,UAAU,CAAC,IAAI,GAAG;IACd,IAAI,EAAE,QAAQ;IACd,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,KAAK;IACd,aAAa,EAAE,KAAK;IACpB,QAAQ,EAAE,KAAK;IACf,KAAK,EAAE,KAAK;IACZ,UAAU,EAAE,KAAK;CACpB,CAAA","sourcesContent":["export default {\n title: 'VDS/Components/Checkboxes/Checkbox',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=28693-3522\"\n }\n },\n argTypes: {\n size: {\n options: [\"medium\", \"large\"],\n control: { type: \"select\" }\n },\n },\n};\n\nconst styles = `\n div {\n margin: 20px;\n width: 400px; \n }\n`;\n \nconst codeTemplate = (args) => {\n return `\n<style>${styles}</style>\n<div>\n <vds-checkbox\n size=\"${args.size}\"\n label-value=\"${args.labelValue}\"\n checked=\"${args.checked}\"\n indeterminate=\"${args.indeterminate}\"\n disabled=\"${args.disabled}\"\n error=\"${args.error}\"\n is-required=\"${args.isRequired}\"\n >\n </vds-checkbox>\n</div>\n`;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n size: \"medium\",\n labelValue: \"Label 1\",\n checked: false,\n indeterminate: false,\n disabled: false,\n error: false,\n isRequired: false,\n}"]}

package/dist/collection/components/checkbox/vds-checkbox.utils.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-checkbox.utils.js","sourceRoot":"","sources":["../../../src/components/checkbox/vds-checkbox.utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,OAAO,aAAc,SAAQ,OAAO;IACzC,YACS,SAAS,KAAK,EACd,UAAU,KAAK,EACf,WAAW,KAAK,EAChB,WAAW,KAAK,EAChB,YAAY,KAAK;QAEzB,KAAK,CAAC,MAAM,CAAC,CAAC;QANN,WAAM,GAAN,MAAM,CAAQ;QACd,YAAO,GAAP,OAAO,CAAQ;QACf,aAAQ,GAAR,QAAQ,CAAQ;QAChB,aAAQ,GAAR,QAAQ,CAAQ;QAChB,cAAS,GAAT,SAAS,CAAQ;IAG1B,CAAC;IAED,OAAO;QACN,OAAO,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC;IACtB,CAAC;IAED,SAAS;QACR,OAAO,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC;IACtB,CAAC;IAED,IAAI,MAAM;QACT,OAAO,IAAI,CAAC,OAAO,CAAC;IACrB,CAAC;IAED,IAAI,OAAO;QACV,OAAO,IAAI,CAAC,QAAQ,CAAC;IACtB,CAAC;IAED,IAAI,OAAO;QACV,OAAO,IAAI,CAAC,QAAQ,CAAC;IACtB,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,IAAI,CAAC,SAAS,CAAC;IACvB,CAAC;CACD","sourcesContent":["/**\n * Custom checkbox change event to capture\n * extra keys being pressed when user clicks on the checkbox\n */\nexport class CheckboxEvent extends Boolean {\n\tconstructor(\n\t\tprivate _value = false,\n\t\tprivate _altKey = false,\n\t\tprivate _ctrlKey = false,\n\t\tprivate _metaKey = false,\n\t\tprivate _shiftKey = false\n\t) {\n\t\tsuper(_value);\n\t}\n\n\tvalueOf(): boolean {\n\t\treturn !!this._value;\n\t}\n\n\tisChecked(): boolean {\n\t\treturn !!this._value;\n\t}\n\n\tget altKey(): boolean {\n\t\treturn this._altKey;\n\t}\n\n\tget ctrlKey(): boolean {\n\t\treturn this._ctrlKey;\n\t}\n\n\tget metaKey(): boolean {\n\t\treturn this._metaKey;\n\t}\n\n\tget shiftKey(): boolean {\n\t\treturn this._shiftKey;\n\t}\n}\n\n"]}

package/dist/collection/components/chip/vds-chip.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-chip.js","sourceRoot":"","sources":["../../../src/components/chip/vds-chip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h } from '@stencil/core';\nimport { HTMLStencilElement, Prop, Event, EventEmitter, Method, Element, State } from '@stencil/core/internal';\nimport { BorderColors, IconColors, StaticGlobal } from '../../definitions/colors';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { ICON_SIZE } from '../icon-button/vds-icon-button.utils';\n\n@Component({\n tag: 'vds-chip',\n styleUrl: 'vds-chip.scss',\n shadow: true,\n})\nexport class VdsChip {\n /** Sets chips content value */\n @Prop({ reflect: true, mutable: true}) value: string;\n /** Displays close icon */\n @Prop() close: boolean;\n /** Displays menu (chevron-down) icon */\n @Prop() menu: boolean;\n /** Displays chip in active state */\n @Prop({ reflect: true, mutable: true}) active: boolean;\n /** Sets chip to disabled */\n @Prop() disabled: boolean;\n /** Sets content size */\n @Prop() size: \"small\" | \"medium\" | \"large\" = \"medium\";\n /** Defines the aria label on the close button */\n @Prop({ reflect: true }) closeAriaLabel: string;\n /** They turn active on/off when clicking the chip */\n @Prop() toggle: boolean = false;\n /** Receives the icon name to be shown in the left side */\n @Prop() informativeIcon: string;\n /** When close button is clicked, the element is removed from the DOM */\n @Prop() removeOnClose: boolean = true;\n\n /** Fires after chip dismiss and hide */\n @Event() afterClosed: EventEmitter<void>;\n /** Fires when chip is selected (only works when toggle is enabled) */\n @Event() selected: EventEmitter<void>;\n /** Fires when menu-icon is clicked */\n @Event() menuClick: EventEmitter<void>;\n\n @Element() hostEl: HTMLVdsChipElement;\n\n @State() _informativeIcon: string = undefined;\n\n private iconColor: IconColors = \"color-icon-brand-default\";\n private iconSize: string = ICON_SIZE[\"small\"];\n\n private dividerColor: BorderColors | StaticGlobal;\n\n /**\n * Executes before every render cycle.\n *\n * @returns void\n */\n componentWillRender(): void {\n this.setChipIconsColor();\n this.setChipIconsSize();\n this.setInformativeIcon();\n this.setDividerColor();\n }\n\n /** \n * Dismiss/Hide the chip.\n * Emits afterClosed event\n * \n * @Returns Promise<void>\n */\n @Method()\n dismiss(): Promise<void> {\n return new Promise(resolve => {\n this.afterClosed.emit();\n if (this.removeOnClose) {\n this.hostEl && this.hostEl.remove();\n }\n resolve();\n });\n }\n\n /** \n * Emits event when menu-icon is clicked\n * \n * @Returns void\n */\n private emitMenuClicked(): void {\n this.menuClick.emit();\n }\n\n /** \n * Sets informative icon based on the following herarchy\n * When informativeIcon prop is provided it will always display.\n * When Chip is toggle and active it will set informativeIcon to checkMarck (good)\n * Otherwise it'll not be display.\n * \n * @Returns void\n */\n private setInformativeIcon(): void {\n this._informativeIcon = this.informativeIcon ? this.informativeIcon : this.active && this.toggle ? \"good\" : undefined;\n }\n\n /**\n * Sets the color for the icons inside the chip.\n * Sets the chip's vds-icon colors\n *\n * @returns void\n */\n private setChipIconsColor(): void {\n const state = this.disabled && this.active ? \"disabled-active\" : this.disabled ? \"disabled\" : this.active ? \"active\" : \"default\";\n switch(state) {\n case \"disabled-active\":\n this.iconColor = \"color-icon-white-high\";\n break;\n case \"disabled\":\n this.iconColor = \"color-icon-disabled\";\n break;\n case \"active\":\n this.iconColor = \"static-white\";\n break;\n default:\n this.iconColor = \"color-icon-brand-default\";\n break;\n }\n }\n\n private setChipIconsSize(): void {\n switch(this.size) {\n case \"small\": \n this.iconSize = ICON_SIZE[\"extra-small\"];\n break;\n case \"medium\": \n this.iconSize = ICON_SIZE[\"small\"];\n break;\n case \"large\": \n this.iconSize = ICON_SIZE[\"medium\"];\n break;\n }\n }\n\n /**\n * Changes the chip active state when toggle option is enabled.\n * Add checks icon when informativeIcon is not provided\n *\n * @returns void\n */\n private handleChipClick(): void {\n if (!this.toggle) return;\n \n this.active = !this.active;\n\n this.setInformativeIcon();\n\n this.selected.emit();\n }\n\n private setDividerColor(): void {\n const state = this.disabled && this.active ? \"disabled-active\" : this.disabled ? \"disabled\" : this.active ? \"active\" : \"default\";\n switch(state) {\n case \"disabled-active\":\n this.dividerColor = \"static-white-low\";\n break;\n case \"disabled\":\n this.dividerColor = \"color-border-disabled\";\n break;\n case \"active\":\n this.dividerColor = \"static-white-low\";\n break;\n default:\n this.dividerColor = \"color-border-brand\";\n break;\n }\n }\n\n render(): HTMLStencilElement {\n return (\n <Host class={this.disabled ? \"vds-chip--disabled\" : \"\"}>\n <button\n onClick={() => this.handleChipClick()}\n class={\n combineClasses(\n \"vds__chip__container\",\n `vds__chip__container--size-${this.size}`,\n this.toggle && \"vds__chip__container--toggleable\",\n this.disabled && \"vds__chip__container--disabled\",\n this.active && \"vds__chip__container--active\",\n )\n }\n disabled={ this.disabled }\n >\n {this._informativeIcon && <vds-icon svgIcon={this._informativeIcon} color={this.iconColor} size={this.iconSize}></vds-icon>}\n {this.value}\n {this.menu && <vds-icon class=\"vds-chip__icon\" onClick={() => this.emitMenuClicked()} svgIcon={this.active ? \"chevron-up\" : \"chevron-down\"} color={this.iconColor} size={this.iconSize}></vds-icon>}\n {this.close && <vds-divider orientation=\"vertical\" padding=\"spacing-00\" color={this.dividerColor}></vds-divider>}\n {this.close && <vds-icon class=\"vds-chip__icon\" onClick={() => this.dismiss()} aria-label={this.closeAriaLabel} svgIcon={\"close\"} color={this.iconColor} size={this.iconSize}></vds-icon>}\n </button>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/chip/vds-chip.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-chip.stories.js","sourceRoot":"","sources":["../../../src/components/chip/vds-chip.stories.tsx"],"names":[],"mappings":"AAAA,eAAe;IACX,KAAK,EAAE,sBAAsB;IAC7B,UAAU,EAAE;QACR,IAAI,EAAE;YACJ,GAAG,EAAE,IAAI;SACV;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,OAAO;YACb,GAAG,EAAE,sFAAsF;SAC9F;KACF;IACH,QAAQ,EAAE;QACN,IAAI,EAAE;YACF,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;YACrC,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC9B;KACJ;CACJ,CAAC;AAEF,IAAI,MAAM,GAAG;;;CAGZ,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,EAAE;IAC1B,OAAO;SACF,MAAM;;;iBAGE,IAAI,CAAC,KAAK;iBACV,IAAI,CAAC,KAAK;gBACX,IAAI,CAAC,IAAI;kBACP,IAAI,CAAC,MAAM;oBACT,IAAI,CAAC,QAAQ;gBACjB,IAAI,CAAC,IAAI;4BACG,IAAI,CAAC,cAAc;kBAC7B,IAAI,CAAC,MAAM;4BACD,IAAI,CAAC,eAAe;;;CAG/C,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,UAAU,CAAC,IAAI,GAAG;IACd,KAAK,EAAE,WAAW;IAClB,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE,IAAI;IACZ,QAAQ,EAAE,KAAK;IACf,IAAI,EAAE,QAAQ;IACd,cAAc,EAAE,YAAY;IAC5B,MAAM,EAAE,IAAI;IACZ,IAAI,EAAE,IAAI;IACV,eAAe,EAAE,kBAAkB;CACtC,CAAC;AAEF,MAAM,qBAAqB,GAAG,CAAC,IAAI,EAAE,EAAE;IACnC,OAAO;SACF,MAAM;;uCAEwB,IAAI,CAAC,IAAI;uCACT,IAAI,CAAC,IAAI;uCACT,IAAI,CAAC,IAAI;uCACT,IAAI,CAAC,IAAI;;CAE/C,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEzD,UAAU,CAAC,IAAI,GAAG;IACd,IAAI,EAAE,QAAQ;CACjB,CAAA;AAED,MAAM,sBAAsB,GAAG,CAAC,IAAI,EAAE,EAAE;IACpC,OAAO;SACF,MAAM;;sBAEO,IAAI,CAAC,IAAI;sBACT,IAAI,CAAC,IAAI;sBACT,IAAI,CAAC,IAAI;sBACT,IAAI,CAAC,IAAI;sBACT,IAAI,CAAC,IAAI;;CAE9B,CAAC;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE3D,WAAW,CAAC,IAAI,GAAG;IACf,IAAI,EAAE,QAAQ;CACjB,CAAA","sourcesContent":["export default {\n title: 'VDS/Components/Chips',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=20457-8324\"\n }\n },\n argTypes: {\n size: {\n options: [\"small\", \"medium\", \"large\"],\n control: { type: \"select\" }\n },\n },\n};\n\nlet styles = `\n vds-chip { padding-right: 5px; }\n div.chip__content { padding: 20px; display: flex; }\n`;\n \nconst codeTemplate = (args) => {\n return `\n<style>${styles}</style>\n<div class=\"chip__content\">\n <vds-chip\n value=\"${args.value}\"\n close=\"${args.close}\"\n menu=\"${args.menu}\"\n active=\"${args.active}\"\n disabled=\"${args.disabled}\"\n size=\"${args.size}\"\n close-aria-label=\"${args.closeAriaLabel}\"\n toggle=\"${args.toggle}\"\n informative-icon=\"${args.informativeIcon}\"\n ></vds-chip>\n</div>\n`;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n value: \"Traveling\",\n close: false,\n active: true,\n disabled: false,\n size: \"medium\",\n closeAriaLabel: \"Close icon\",\n toggle: true,\n menu: true,\n informativeIcon: \"local-containers\",\n};\n\nconst codeTemplateInputChip = (args) => {\n return `\n<style>${styles}</style>\n<div class=\"chip__content\">\n <vds-chip value=\"Chip - 1\" size=\"${args.size}\" close=\"true\" close-aria-label=\"Close chip 1\"></vds-chip>\n <vds-chip value=\"Chip - 2\" size=\"${args.size}\" close=\"true\" close-aria-label=\"Close chip 2\"></vds-chip>\n <vds-chip value=\"Chip - 3\" size=\"${args.size}\" close=\"true\" disabled=\"true\" close-aria-label=\"Close chip 3\"></vds-chip>\n <vds-chip value=\"Chip - 4\" size=\"${args.size}\" close=\"true\" close-aria-label=\"Close chip 4\"></vds-chip>\n</div>\n`;\n}\n\nexport const InputChips = codeTemplateInputChip.bind({});\n\nInputChips.args = {\n size: \"medium\",\n}\n\nconst codeTemplateFilterChip = (args) => {\n return `\n<style>${styles}</style>\n<div class=\"chip__content\">\n <vds-chip size=\"${args.size}\" toggle=\"true\" value=\"Docs\"></vds-chip>\n <vds-chip size=\"${args.size}\" toggle=\"true\" value=\"Sheets\" active=\"true\"></vds-chip>\n <vds-chip size=\"${args.size}\" toggle=\"true\" value=\"Slides\"></vds-chip>\n <vds-chip size=\"${args.size}\" toggle=\"true\" value=\"Videos\" active=\"true\"></vds-chip>\n <vds-chip size=\"${args.size}\" toggle=\"true\" value=\"Images\" active=\"true\"></vds-chip>\n</div>\n`;\n}\n\nexport const FilterChips = codeTemplateFilterChip.bind({});\n\nFilterChips.args = {\n size: \"medium\",\n}\n"]}

package/dist/collection/components/dialog/vds-dialog.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-dialog.js","sourceRoot":"","sources":["../../../src/components/dialog/vds-dialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h } from \"@stencil/core\";\nimport { HTMLStencilElement, Prop, Event, EventEmitter, Method, Element, State, Listen } from \"@stencil/core/internal\";\nimport { Spacing } from \"../../definitions/spacing\";\nimport { combineClasses } from \"../../utils/combine-classes\";\n\n@Component({\n tag: \"vds-dialog\",\n styleUrl: \"vds-dialog.scss\",\n shadow: true,\n})\nexport class VdsDialog {\n /** Sets the padding around the dialog */\n @Prop() padding: Spacing = \"spacing-07\";\n /** Toggles the background behind the dialog */\n @Prop() backdrop: boolean = true;\n /** Sets the width size of the dialog */\n @Prop() width: string = \"37.5rem\";\n /** Sets the minimum width size of the dialog */\n @Prop() minWidth: string = \"20rem\";\n /** Sets the maximum width size of the dialog */\n @Prop() maxWidth: string = \"80%\";\n /** Avoids user to close dialog by clicking outside */\n @Prop() preventOutsideClose: boolean = false;\n\n /** Emits the event when opens dialog */\n @Event() opened: EventEmitter<string>;\n /** Emits the event when opens dialog */\n @Event() closed: EventEmitter<string>;\n\n @State() isOpen: boolean = undefined;\n\n @Element() host: HTMLElement;\n\n private dialog: HTMLDialogElement;\n private trigger: HTMLElement;\n\n componentDidLoad(): void {\n this.setHTMLElementEvents();\n }\n\n /**\n * Opens the dialog element. This method displays the dialog modally\n * with a backdrop if the `backdrop` property is set to `true`. Otherwise,\n * it opens the dialog non-modally without a backdrop.\n *\n * @returns {Promise<void>} A promise that resolves when the dialog is opened.\n */\n @Method()\n open(): Promise<void> {\n this.isOpen = true;\n this.backdrop ? this.dialog.showModal() : this.dialog.open = true;\n this.opened.emit();\n return Promise.resolve();\n }\n\n /**\n * Closes the dialog element. This method hides the dialog.\n *\n * @returns {Promise<void>} A promise that resolves when the dialog is closed.\n */\n @Method()\n close(): Promise<void> {\n this.isOpen = false;\n this.dialog.close();\n this.closed.emit();\n return Promise.resolve();\n }\n\n /**\n * Returns the main element container of the dialog.\n *\n * @returns {Promise<HTMLDialogElement>} A promise that resolves returning the dialog main element.\n */\n @Method()\n getContainer(): Promise<HTMLDialogElement> {\n return Promise.resolve(this.dialog);\n }\n\n /**\n * Listens for \"closeButton\" events on the children elements.\n * This method calls the `close()` method to close the dialog when the button is clicked.\n *\n * @returns {void}\n */\n @Listen(\"closeButton\")\n closeButtonHandle(): void {\n this.close();\n }\n\n /**\n * Listens for \"keydown\" events on the children elements, when the Escape key is press down\n * it closes the dialog.\n *\n * @returns {void}\n */\n @Listen('keydown')\n handleEscKey(ev: KeyboardEvent): void {\n if (ev.key === \"Escape\"){\n this.close();\n }\n }\n\n /**\n * Opens the dialog when the trigger element is clicked\n *\n * @returns {void}\n */\n handleClick(): void {\n this.open();\n }\n\n /**\n * Closes the dialog when the backdrop element is clicked.\n * The HTMLDialog adds a ::backdrop element when is open with showDialog. This element returns as target\n * the DIALOG element; when clicking on the content it returns the element that was click.\n *\n * @returns {void}\n */\n handleClose(evt: Event): void {\n if (this.backdrop && !this.preventOutsideClose && (evt.target as HTMLElement).nodeName === \"DIALOG\") {\n this.close();\n }\n }\n\n /**\n * @private\n * Creates a styles object based on the component's properties (`width`, `minWidth`, `maxWidth`).\n *\n * @returns {Object} An object containing CSS styles for the component.\n */\n private setStyles(): { [key: string]: string } {\n const styles: any = {};\n\n styles.width = this.width;\n styles.minWidth = this.minWidth;\n styles.maxWidth = this.maxWidth;\n\n return styles;\n }\n\n /**\n * @private\n * Sets up event listeners for the dialog component elements.\n *\n * - Listens for \"click\" events on the `trigger` element and calls `handleClick`.\n * - Listens for \"click\" events on the `dialog` element and calls `handleClose`.\n *\n */\n private setHTMLElementEvents(): void {\n this.trigger.addEventListener(\"click\", this.handleClick.bind(this));\n this.dialog.addEventListener(\"click\", this.handleClose.bind(this));\n }\n\n render(): HTMLStencilElement {\n return (\n <Host>\n <div\n ref={(el): void => {\n if (el) {\n this.trigger = el;\n }\n }}\n class={\"vds__dialog__trigger\"}\n >\n <slot name=\"dialog-trigger\"></slot>\n </div>\n <dialog\n ref={(el): void => {\n if (el) {\n this.dialog = el;\n }\n }}\n style={{maxWidth: this.maxWidth}}\n class={combineClasses(\n \"vds__dialog\",\n this.backdrop ? \"vds__dialog--backdrop\" : \"vds__dialog--no-backdrop\",\n this.isOpen ? \"vds__dialog__container--open\" : \"\"\n )}\n >\n <div\n class={combineClasses(\n \"vds__dialog__container\",\n `vds__dialog__spacing--${this.padding}`\n )}\n style={this.setStyles()}\n >\n <slot></slot>\n </div>\n </dialog>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/dialog/vds-dialog.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"vds-dialog.stories.js","sourceRoot":"","sources":["../../../src/components/dialog/vds-dialog.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import variables from \"../../constants/spacing-vars\";\n\nexport default {\n title: 'VDS/Components/Dialog/Dialog',\n parameters: {\n docs: {\n toc: true,\n },\n design: {\n type: \"figma\",\n url: \"https://www.figma.com/design/pWWQH7I7zAkgkBKIuRG53Y/Volt-2?m=auto&node-id=29192-182339\"\n }\n },\n argTypes: {\n padding: {\n options: Object.keys(variables),\n control: { type: \"select\" }\n },\n },\n};\n\nconst styles = `\n .p5 {\n padding: 5px;\n }\n`;\n \nconst codeTemplate = (args) => {\n return `\n<style>${styles}</style>\n<vds-dialog\n padding=\"${args.padding}\"\n backdrop=\"${args.backdrop}\"\n width=\"${args.width}\"\n minWidth=\"${args.minWidth}\"\n maxWidth=\"${args.maxWidth}\"\n>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n ${args.header ? \n `<vds-dialog-header slot=\"header\" show-close-button=\"${args.showCloseButton}\">\n Dialog title\n </vds-dialog-header>` : \"\"}\n <vds-dialog-body slot=\"body\">\n <h2 class=\"content\">Content</h2>\n </vds-dialog-body>\n ${args.footer ? \n `<vds-dialog-action-footer class=\"vds__dialog__footer--end\" slot=\"footer\">\n <vds-button variant=\"secondary\" close-dialog>Cancel</vds-button>\n <vds-button>Submit</vds-button>\n </vds-dialog-action-footer>` : \"\"}\n </vds-dialog-modal>\n</vds-dialog>\n`;\n}\n\nexport const BasicUsage = codeTemplate.bind({});\n\nBasicUsage.args = {\n padding: \"spacing-07\",\n backdrop: true,\n width: \"600px\",\n minWidth: \"320px\",\n showCloseButton: true,\n header: true,\n footer: true\n};\n \nconst nonModalCodeTemplate = () => {\n return `\n<style>${styles}</style>\n<vds-dialog\n backdrop=\"false\"\n>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n <vds-dialog-header slot=\"header\" show-close-button=\"true\">\n Non modal dialog title\n </vds-dialog-header>\n <vds-dialog-body slot=\"body\">\n A dialog that does not block the main interface, allowing users to interact with both the dialog and the main content simultaneously.\n </vds-dialog-body>\n </vds-dialog-modal>\n</vds-dialog>\n<label for=\"fruits\">Fruits:</label>\n<select name=\"fruits\" id=\"fruits\">\n <option value=\"apple\">Apple</option>\n <option value=\"lemon\">Lemon</option>\n <option value=\"mango\">Mango</option>\n <option value=\"strawberry\">Strawberry</option>\n</select>\n`;\n}\n\nexport const nonModal = nonModalCodeTemplate.bind({});\n\n\nconst alertCodeTemplate = () => {\n return `\n<style>${styles}</style>\n<vds-dialog prevent-outside-close>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n <vds-dialog-header slot=\"header\" show-close-button=\"true\">\n Alert dialog title\n </vds-dialog-header>\n <vds-dialog-body>\n A dialog specifically designed to alert users to important information or to confirm critical actions, typically requiring an acknowledgment.\n </vds-dialog-body>\n <vds-dialog-action-footer class=\"vds__dialog__footer--end\" slot=\"footer\">\n <vds-button variant=\"tertiary\" close-dialog>Close</vds-button>\n <vds-button close-dialog>Continue</vds-button>\n </vds-dialog-action-footer>\n </vds-dialog>\n </vds-dialog-modal>\n`;\n}\n\nexport const alert = alertCodeTemplate.bind({});\n\nconst scrollCodeTemplate = () => {\n return `\n<style>${styles}</style>\n<vds-dialog>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n <vds-dialog-header slot=\"header\" show-close-button=\"true\">\n Scroll long text dialog title\n </vds-dialog-header>\n <vds-dialog-body>\n <p>\n Content description here. Quis vel facilisi habitant enim mattis risus integer augue. \n Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant \n enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis \n risus integer augue.Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi \n habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n Quis vel facilisi habitant enim mattis risus integer augue.\n </p>\n <p>\n Content description here. Quis vel facilisi habitant enim mattis risus integer augue. \n Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant \n enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis \n risus integer augue.Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi \n habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n Quis vel facilisi habitant enim mattis risus integer augue.\n </p>\n <p>\n Content description here. Quis vel facilisi habitant enim mattis risus integer augue. \n Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant \n enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis \n risus integer augue.Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi \n habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n Quis vel facilisi habitant enim mattis risus integer augue.\n </p>\n </vds-dialog-body>\n <vds-dialog-action-footer class=\"vds__dialog__footer--end\" slot=\"footer\">\n <vds-button variant=\"tertiary\" close-dialog>Close</vds-button>\n <vds-button close-dialog>Continue</vds-button>\n </vds-dialog-action-footer>\n </vds-dialog-modal>\n</vds-dialog>\n`;\n}\n\nexport const scroll = scrollCodeTemplate.bind({});\n\nconst actionCodeTemplate = () => {\n return `\n<style>${styles}</style>\n<vds-dialog prevent-outside-close>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n <vds-dialog-header slot=\"header\" show-close-button=\"true\">\n Dialog title\n </vds-dialog-header>\n <vds-dialog-body>\n Content description here. Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n <br />\n <br />\n <input type=\"checkbox\" autofocus /> Yes, delete this elements and all its associated resources\n </vds-dialog-body>\n <vds-dialog-action-footer class=\"vds__dialog__footer--end\" slot=\"footer\">\n <vds-button variant=\"tertiary\" disabled>Delete</vds-button>\n <vds-button variant=\"tertiary\" close-dialog>Close</vds-button>\n </vds-dialog-action-footer>\n </vds-dialog-modal>\n</vds-dialog>\n`;\n}\n\nexport const action = actionCodeTemplate.bind({});\n\nconst fluidCodeTemplate = () => {\n return `\n<style>${styles}</style>\n<vds-dialog prevent-outside-close>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n <vds-dialog-header slot=\"header\" show-close-button=\"true\">\n Dialog title\n </vds-dialog-header>\n <vds-dialog-body>\n Content description here. Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n </vds-dialog-body>\n <vds-dialog-action-footer class=\"vds__dialog__footer--end\" slot=\"footer\">\n <vds-button variant=\"tertiary\">Action 3</vds-button>\n <vds-button variant=\"tertiary\">Action 2</vds-button>\n <vds-button variant=\"tertiary\">Action 1</vds-button>\n </vds-dialog-action-footer>\n </vds-dialog-modal>\n</vds-dialog>\n`;\n}\n\nexport const fluid = fluidCodeTemplate.bind({});\n\nconst focusElementCodeTemplate = () => {\n return `\n<style>${styles}</style>\n<vds-dialog prevent-outside-close>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n <vds-dialog-header slot=\"header\" show-close-button=\"true\">\n Dialog title\n </vds-dialog-header>\n <vds-dialog-body>\n <div>\n <input autofocus type=\"checkbox\" checked /> ⛔️ A Dialog without focusable elements is not recommended!\n </div>\n <div>\n <input type=\"checkbox\" checked /> Escape key works\n </div>\n <div>\n <input type=\"checkbox\" /> Backdrop click still works to ensure this modal can be closed\n </div>\n </vds-dialog-body>\n </vds-dialog-modal>\n</vds-dialog>\n`;\n}\n\nexport const NoFocusableElement = focusElementCodeTemplate.bind({});\n\nconst formCodeTemplate = () => {\n return `\n<style>${styles}</style>\n<vds-dialog prevent-outside-close>\n <vds-button class=\"p5\" slot=\"dialog-trigger\">Open</vds-button>\n <vds-dialog-modal>\n <vds-dialog-header slot=\"header\" show-close-button=\"true\">\n Dialog title\n </vds-dialog-header>\n <vds-dialog-body>\n <p>\n Content description here. Quis vel facilisi habitant enim mattis risus integer augue. Quis vel facilisi habitant enim mattis risus integer augue.\n </p>\n <vds-field label=\"Email input\">\n <vds-basic-input informative-icon=\"mail\" autofocus></vds-basic-input>\n </vds-field>\n </vds-dialog-body>\n <vds-dialog-action-footer class=\"vds__dialog__footer--end\" slot=\"footer\">\n <vds-button variant=\"tertiary\" close-dialog>Close</vds-button>\n <vds-button close-dialog>Continue</vds-button>\n </vds-dialog-action-footer>\n </vds-dialog-modal>\n</vds-dialog>\n`;\n}\n\nexport const form = formCodeTemplate.bind({});\n"]}