npm - @scania/tegel - Versions diffs - 0.0.5 → 0.0.7 - Mend

@scania/tegel 0.0.5 → 0.0.7

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 (1142) hide show

package/dist/collection/components/divider/divider.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"divider.stories.js","sourceRoot":"","sources":["../../../src/components/divider/divider.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n title: 'Components/Divider',\n parameters: {\n layout: 'centered',\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=993%3A47555&t=M7Ova7xZaoeMwb5e-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=993%3A47555&t=M7Ova7xZaoeMwb5e-1',\n },\n ],\n },\n argTypes: {\n type: {\n name: 'Type',\n description: 'Sets the divider type.',\n control: {\n type: 'radio',\n },\n options: ['Horizontal', 'Vertical'],\n },\n direction: {\n name: 'Direction',\n description: 'Sets the direction of the divider.',\n control: {\n type: 'select',\n },\n options: ['Top', 'Right', 'Bottom', 'Left'],\n },\n width: {\n name: 'Width',\n description: 'Sets the divider width.',\n control: {\n type: 'number',\n },\n if: { arg: 'type', eq: 'Horizontal' },\n },\n height: {\n name: 'Height',\n description: 'Sets the divider height.',\n control: {\n type: 'number',\n },\n if: { arg: 'type', eq: 'Vertical' },\n },\n },\n args: {\n type: 'Horizontal',\n direction: 'Top',\n width: 150,\n height: 150,\n },\n};\n\n\nconst Template = ({ type, width, height }) => {\n const classLookup = {\n Horizontal: `sdds-divider`,\n Vertical: `sdds-divider-vertical`,\n };\n \n return formatHtmlPreview(\n `\n <style>\n ${\n height\n ? `/* demo-div is for demonstration purposes only*/\n .demo-div {\n height: ${height}px;\n width: 1px;\n padding: 0px;\n }`\n : ''\n } ${\n width\n ? `/* demo-div is for demonstration purposes only*/\n .demo-div {\n width: ${width}px;\n height: 1px;\n padding: 0px;\n }`\n : ''\n }\n </style>\n \n \n <div\n class=\"demo-div ${classLookup[type]}\"></div>\n `,\n);\n};\n\nconst BorderTemplate= ({ direction }) => {\n const directionLookup = {\n Top: 'top',\n Right: 'right',\n Bottom: 'bottom',\n Left: 'left',\n };\n return formatHtmlPreview(\n `\n <style>\n #demo-wrapper{\n padding: 50px;\n background-color: var(--sdds-grey-958)\n }\n /* border-demo-div is for demonstration purposes only*/\n .border-demo-div {\n height: 200px;\n width: 200px;\n background-color: var(--sdds-grey-868);\n color: var(--sdds-grey-50);\n text-align: center;\n padding: 10px;\n }\n \n </style>\n <div id= \"demo-wrapper\">\n \n <div\n class=\"border-demo-div sdds-divider-border-${directionLookup[direction]}\">\n <H4>DEMO</H4></div></div>\n `,\n);\n};\n\n\nexport const Native = Template.bind({});\nNative.argTypes={\n direction: { table: { disable: true } } \n }\nexport const Border = BorderTemplate.bind({});\nBorder.args={\n direction: 'Top'\n} \n \nBorder.argTypes={\n type: { table: { disable: true } } \n}\n\n\n"]}

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

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown-filter.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown-filter/dropdown-filter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOvF,MAAM,OAAO,cAAc;;uBACF,EAAE;2BAEE,EAAE;sBAEP,EAAE;;;uBAOuB,IAAI;uBAGrB,EAAE;;;;oBAYJ,KAAK;gBAGiC,IAAI;kBAG5C,KAAK;yBAGiB,UAAU;iBAGjC,KAAK;kBAGL,EAAE;;yBAOM,aAAa;yBAEb,aAAa;;EAE9C,iBAAiB;IACf,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAE1B,IAAI,IAAI,CAAC,aAAa,EAAE;MACtB,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,aAAa,CAAC;KAC/C;EACH,CAAC;EAGD,SAAS,CAAC,QAAgB;IACxB,IAAI,QAAQ;MAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IACtD,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,WAAW,CAAC;EAC1C,CAAC;EAGD,oBAAoB,CAAC,KAAuB;IAC1C,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC;IAC/B,IAAI,CAAC,QAAQ,EAAE,CAAC;EAClB,CAAC;EAGD,mBAAmB,CAAC,KAAuB;IACzC,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;IAC9C,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;IACxC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;IAExC,mEAAmE;IACnE,gEAAgE;IAChE,UAAU,CAAC,GAAG,EAAE;MACd,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,WAAW,CAAC;IAC1C,CAAC,EAAE,GAAG,CAAC,CAAC;EACV,CAAC;EAED,QAAQ;IACN,MAAM,aAAa,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IACzD,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE;MACxD,IAAI,MAAM,CAAC,KAAK,EAAE;QAChB,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;QAC5C,MAAM,gBAAgB,GAAG,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;QACvD,IAAI,gBAAgB,EAAE;UACpB,OAAO,gBAAgB,CAAC;SACzB;QACD,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC;QAChC,IAAI,CAAC,aAAa,GAAG,WAAW,CAAC;QACjC,IAAI,CAAC,aAAa,GAAG,WAAW,CAAC;OAClC;IACH,CAAC,CAAC,CAAC;EACL,CAAC;EAED,iBAAiB;IACf,MAAM,OAAO,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAChD,4BACE,QAAQ,EAAC,GAAG,EACZ,KAAK,EAAE,GAAG,CAAC,KAAK,EAChB,KAAK,EAAE,GAAG,IAAI,CAAC,mBAAmB,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,IAEnE,GAAG,CAAC,KAAK,CACW,CACxB,CAAC,CAAC;IACH,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;MACtB,OAAO,OAAO,CAAC;KAChB;IACD,OAAO,CACL,4BAAsB,QAAQ,EAAC,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,wBAAwB,gBAE7D,CACxB,CAAC;EACJ,CAAC;EAED,wFAAwF;EAC9E,KAAK,CAAC,WAAW;;IACzB,MAAM,CAAA,MAAA,IAAI,CAAC,WAAW,0CAAE,WAAW,EAAE,CAAA,CAAC;EACxC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,sBAAiB,IAAI,CAAC,aAAa,mBAAiB,IAAI,CAAC,aAAa,EAAE,KAAK,EAAE;QAClF,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,qBAAqB,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE;MACjE;MACE,qBACE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,EACpC,WAAW,EAAC,0BAA0B,EACtC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAEpC,IAAI,CAAC,iBAAiB,EAAE,CACX,CACX,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'sdds-dropdown-filter',\n shadow: true,\n styleUrl: './../dropdown.scss',\n})\nexport class DropdownFilter {\n @State() dataOptions = [];\n\n @State() filteredContent = [];\n\n @State() searchTerm = '';\n\n @State() selectedOptionState: any;\n\n @State() dropdownRef?: HTMLSddsDropdownElement;\n\n /** Set the variant of the dropdown. */\n @Prop() modeVariant: 'primary' | 'secondary' = null;\n\n /** Placeholder text for dropdown with no selected item */\n @Prop() placeholder: string = '';\n\n /** Label for dropdown with no selected item */\n @Prop() label: string;\n\n /** Add the value of the option to set it as default */\n @Prop() defaultOption: string;\n\n /** Add the value of the option as string to set it as new selected value */\n @Prop() selectedOption: string;\n\n /** Add the value of the option to set it as default */\n @Prop() disabled: boolean = false;\n\n /** Controls the size of dropdown. 'sm', 'md' and 'lg' correct values and 'small', 'medium' and 'large' are deprecated */\n @Prop() size: 'sm' | 'md' | 'lg' | 'small' | 'medium' | 'large' = 'lg';\n\n /** Set to true to make the width following the label text length */\n @Prop() inline: boolean = false;\n\n /** Position of label */\n @Prop() labelPosition: 'no-label' | 'outside' = 'no-label';\n\n /** Support `error` state */\n @Prop() state: boolean = false;\n\n /** Add helper text in the bottom of dropdown */\n @Prop() helper: string = '';\n\n /** Data is an array of objects that contains label and value\n * `data = [{label:'Option 1', value:'opt-1'},{label:'Option 2', value:'opt-2'}]`\n */\n @Prop() data: string;\n\n @State() selectedLabel: string = 'no-selected';\n\n @State() selectedValue: string = 'no-selected';\n\n componentWillLoad() {\n this.parseData(this.data);\n\n if (this.defaultOption) {\n this.selectedOptionState = this.defaultOption;\n }\n }\n\n @Watch('data')\n parseData(newValue: string) {\n if (newValue) this.dataOptions = JSON.parse(newValue);\n this.filteredContent = this.dataOptions;\n }\n\n @Listen('inputSearch')\n updateOptionsContent(event: CustomEvent<any>) {\n this.searchTerm = event.detail;\n this.findData();\n }\n\n @Listen('internalSddsSelect')\n selectOptionHandler(event: CustomEvent<any>) {\n this.selectedOptionState = event.detail.value;\n this.selectedLabel = event.detail.label;\n this.selectedValue = event.detail.value;\n\n // Reset list when search is done and user have selected one option\n // To match with animation time for option list to fadeout first\n setTimeout(() => {\n this.filteredContent = this.dataOptions;\n }, 200);\n }\n\n findData() {\n const searchAsRegEx = new RegExp(this.searchTerm, 'gmi');\n this.filteredContent = this.dataOptions.filter((option) => {\n if (option.label) {\n const listItem = option.label.toLowerCase();\n const searchResultList = listItem.match(searchAsRegEx);\n if (searchResultList) {\n return searchResultList;\n }\n this.selectedOptionState = null;\n this.selectedLabel = 'no-result';\n this.selectedValue = 'no-result';\n }\n });\n }\n\n setOptionsContent() {\n const newList = this.filteredContent.map((obj) => (\n <sdds-dropdown-option\n tabindex=\"0\"\n value={obj.value}\n class={`${this.selectedOptionState === obj.value ? 'selected' : ''}`}\n >\n {obj.label}\n </sdds-dropdown-option>\n ));\n if (newList.length > 0) {\n return newList;\n }\n return (\n <sdds-dropdown-option tabindex=\"-1\" value=\"no-result\" class=\"sdds-option--no-result\">\n No result\n </sdds-dropdown-option>\n );\n }\n\n /** Use this method to reset the dropdown. Then it will go back to its initial state. */\n @Method() async resetOption() {\n await this.dropdownRef?.resetOption();\n }\n\n render() {\n return (\n <Host selected-value={this.selectedValue} selected-text={this.selectedLabel} class={`\n ${this.modeVariant ? `sdds-mode-variant-${this.modeVariant}` : ''}\n `}>\n <sdds-dropdown\n ref={(el) => (this.dropdownRef = el)}\n exportparts=\"dropdown-filter-disabled\"\n size={this.size}\n label={this.label}\n disabled={this.disabled}\n labelPosition={this.labelPosition}\n helper={this.helper}\n state={this.state}\n placeholder={this.placeholder}\n defaultOption={this.defaultOption}\n selectedOption={this.selectedOption}\n type=\"filter\"\n tabindex={this.disabled ? '-1' : null}\n >\n {this.setOptionsContent()}\n </sdds-dropdown>\n </Host>\n );\n }\n}\n"]}

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

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown-filter.stories.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown-filter/dropdown-filter.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n title: 'Components/Dropdown Filter',\n parameters: {\n layout: 'centered',\n notes: readme,\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n ],\n },\n argTypes: {\n modeVariant: {\n name: 'Mode variant',\n description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n control: {\n type: 'radio',\n },\n options: ['Inherit from parent', 'Primary', 'Secondary'],\n table: {\n defaultValue: { summary: 'Inherit from parent' },\n },\n },\n state: {\n name: 'Error state',\n description: 'Puts the component in error state.',\n control: {\n type: 'boolean',\n },\n table: {\n defaultValue: { summary: false },\n },\n },\n size: {\n name: 'Size',\n description: 'Sets the size of the dropdown.',\n control: {\n type: 'radio',\n },\n options: ['Large', 'Medium', 'Small'],\n table: {\n defaultValue: { summary: 'lg' },\n },\n },\n openDirection: {\n name: 'Open direction',\n description: 'Sets which direction the dropdown will open in.',\n control: {\n type: 'radio',\n },\n options: ['Up', 'Down', 'Auto'],\n table: {\n defaultValue: { summary: 'auto' },\n },\n },\n labelPosition: {\n name: 'Label position',\n description: 'Sets the label text position.',\n control: {\n type: 'radio',\n },\n options: ['No label', 'Outside'],\n table: {\n defaultValue: { summary: 'no-label' },\n },\n },\n labelText: {\n name: 'Label text',\n description: 'Sets a label text to help describe what the dropdown contains.',\n control: {\n type: 'text',\n },\n if: { arg: 'labelPosition', neq: 'No label' },\n },\n placeholder: {\n name: 'Placeholder',\n description: 'Sets the placeholder text when no option is selected.',\n control: {\n type: 'text',\n },\n },\n helper: {\n name: 'Helper text',\n description: 'Sets a helper text to assist the user with additional information about the dropdown.',\n control: {\n type: 'text',\n },\n },\n defaultOption: {\n name: 'Default option',\n description: 'Sets a pre-selected option and replaces the placeholder.',\n control: {\n type: 'radio',\n },\n options: ['No default', 'Option 1', 'Option 2', 'Option 3'],\n },\n disabled: {\n name: 'Disabled',\n description: 'Disables the dropdown.',\n control: {\n type: 'boolean',\n },\n table: {\n defaultValue: { summary: false },\n },\n },\n },\n args: {\n modeVariant: 'Inherit from parent',\n state: false,\n size: 'Large',\n openDirection: 'Auto',\n labelPosition: 'No label',\n labelText: 'Label text',\n placeholder: 'Placeholder',\n helper: '',\n defaultOption: 'Option 1',\n disabled: false,\n },\n};\n\nconst FilterTemplate = ({\n modeVariant,\n state = false,\n size,\n openDirection,\n labelPosition,\n labelText,\n placeholder,\n helper = '',\n defaultOption,\n disabled = false,\n}) => {\n const sizeLookup = { Large: 'lg', Medium: 'md', Small: 'sm' };\n const labelPosLookup = { 'No label': 'no-label', 'Outside': 'outside' };\n const defaultOptionLookup = {\n 'No default': 'no-default',\n 'Option 1': 'option-1',\n 'Option 2': 'option-2',\n 'Option 3': 'option-3',\n };\n\n return formatHtmlPreview(`\n <style>\n /* demo-wrapper is for demonstration purposes only*/\n .demo-wrapper {\n width: 300px;\n height:200px;\n }\n </style>\n\n <div class=\"demo-wrapper\">\n <sdds-dropdown-filter\n ${\n modeVariant !== 'Inherit from parent'\n ? `mode-variant=\"${modeVariant.toLowerCase()}\".sdds-option-label {\n `\n : ''\n }\n id=\"sdds-dropdown-filter\"\n size=\"${sizeLookup[size]}\"\n placeholder=\"${placeholder}\"\n disabled=\"${disabled}\"\n open-direction=\"${openDirection.toLowerCase()}\"\n label-position=\"${labelPosLookup[labelPosition]}\"\n ${labelPosLookup[labelPosition] !== 'no-label' ? `label=\"${labelText}\"` : ''}\n ${helper !== '' ? `helper=\"${helper}\"` : ''}\n state=\"${state}\"\n data='[\n {\n \"value\": \"option-1\",\n \"label\":\"Jakarta\"\n },\n {\n \"value\":\"option-2\"\n ,\"label\":\"Stockholm\"\n },\n {\n \"value\":\"option-3\",\n \"label\":\"Barcelona\"\n }\n ]'\n default-option=\"${defaultOptionLookup[defaultOption]}\">\n </sdds-dropdown-filter>\n </div>\n `);\n};\n\nexport const Default = FilterTemplate.bind({});\n"]}

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

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown-native.stories.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-native.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n title: 'Components/Dropdown',\n parameters: {\n layout: 'centered',\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n ],\n },\n argTypes: {\n modeVariant: {\n name: 'Mode variant',\n description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n control: {\n type: 'radio',\n },\n options: ['Inherit from parent', 'Primary', 'Secondary'],\n table: {\n defaultValue: { summary: 'Inherit from parent' },\n },\n },\n state: {\n name: 'Error state',\n description: 'Puts the component in error state.',\n control: {\n type: 'boolean',\n },\n },\n size: {\n name: 'Size',\n description: 'Sets the size of the dropdown.',\n control: {\n type: 'radio',\n },\n options: ['Large', 'Medium', 'Small'],\n },\n label: {\n name: 'Label',\n description: 'Sets a label text to help describe what the dropdown contains.',\n control: {\n type: 'text',\n },\n },\n helper: {\n name: 'Helper text',\n description: 'Sets a helper text to assist the user with additional information about the dropdown.',\n control: {\n type: 'text',\n },\n },\n disabled: {\n name: 'Disabled',\n description: 'Disables the dropdown.',\n control: {\n type: 'boolean',\n },\n },\n },\n args: {\n modeVariant: 'Inherit from parent',\n state: false,\n size: 'Large',\n label: '',\n helper: '',\n disabled: false,\n },\n};\n\nconst NativeTemplate = ({\n modeVariant, \n state, \n size, \n label, \n helper, \n disabled \n}) => {\n const sizeLookup = { Large: 'lg', Medium: 'md', Small: 'sm' };\n return formatHtmlPreview(`\n <style>\n/* demo-wrapper is for demonstration purposes only*/\n .demo-wrapper {\n width: 300px;\n }\n</style>\n\n<div class=\"demo-wrapper\">\n <div class=\"sdds-dropdown ${size !== 'Large' ? `sdds-dropdown-${sizeLookup[size]}` : ''} ${\n state ? 'sdds-dropdown--error' : ''\n } ${modeVariant === 'Inherit from parent' ? '' : `sdds-mode-variant-${modeVariant.toLowerCase()}`}\">\n ${label !== '' ? `<span class=\"sdds-dropdown-label-outside\">${label}</span> ` : ''}\n <select\n name=\"nativeDropdown\"\n id=\"mySelect\"\n ${disabled ? `disabled` : ''} >\n <option value=\"truck\">Truck</option>\n <option value=\"bus\">Bus</option>\n <option value=\"car\">Car</option>\n </select>\n ${helper !== '' ? `<span class=\"sdds-dropdown-helper\">${helper}</span>` : ''}\n </div>\n </div>\n `);\n};\n\nexport const Native = NativeTemplate.bind({});\n"]}

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

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown-option.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown-option/dropdown-option.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Prop,\n State,\n Element,\n Host,\n Event,\n EventEmitter,\n Listen,\n} from '@stencil/core';\n\n@Component({\n tag: 'sdds-dropdown-option',\n styleUrl: './../dropdown.scss',\n shadow: true,\n})\nexport class DropdownOption {\n @Element() host: HTMLElement;\n\n // Used as a fallback if value prop is not recognized to match handleClick\n @State() innerValue: string;\n\n /** Selected set to true if selected */\n @Prop() selected: boolean = false;\n\n /** Sets option to disabled state if true */\n @Prop() disabled: boolean = false;\n\n /** Value is a unique string that will be used for application logic */\n @Prop({ reflect: true }) value: string;\n\n /** @internal Fires on click on one of the dropdown items */\n @Event({\n eventName: 'internalSddsSelect',\n composed: true,\n cancelable: false,\n bubbles: true,\n })\n internalSddsSelect: EventEmitter<{\n value: string | number;\n label: string | number;\n parent: HTMLSddsDropdownElement;\n }>;\n\n isMultiSelectOption: boolean;\n\n @Listen('mouseover')\n changeFocusHandler() {\n this.host.focus();\n }\n\n @Listen('mouseout')\n removeFocusHandler() {\n this.host.blur();\n }\n\n @Listen('keydown')\n onKeyDown(event: KeyboardEvent) {\n if (event.code === 'Enter') {\n this.handleClick({\n value: this.value,\n label: this.host.innerText,\n parent: this.host.parentNode,\n });\n }\n }\n\n componentWillLoad() {\n this.innerValue = this.value;\n this.isMultiSelectOption = this.host\n .closest('sdds-dropdown')\n .classList.contains('sdds-dropdown-multiselect');\n }\n\n handleClick(value) {\n if (!this.disabled) {\n const listOptions = value.parent.childNodes;\n this.internalSddsSelect.emit(value);\n if (!this.isMultiSelectOption) {\n listOptions.forEach((optionEl) => {\n optionEl.selected = false;\n });\n }\n const optionCheckbox = this.host.shadowRoot.querySelector('input');\n\n if (this.selected) {\n this.selected = false;\n if (optionCheckbox) {\n optionCheckbox.checked = false;\n }\n } else {\n this.selected = true;\n if (optionCheckbox) {\n optionCheckbox.checked = true;\n }\n }\n }\n }\n\n render() {\n return (\n <Host\n onClick={(event) => {\n if (this.isMultiSelectOption) {\n event.stopPropagation();\n }\n return this.handleClick({\n value: this.value,\n label: this.host.innerText,\n parent: event.target.parentNode,\n });\n }}\n class={{\n 'selected': this.selected,\n 'sdds-dropdown-option-disabled': this.disabled,\n }}\n tabindex=\"-1\"\n aria-disabled={this.disabled}\n >\n {this.isMultiSelectOption && (\n <div class=\"sdds-checkbox-item sdds-option-checkbox\">\n <label class=\"sdds-form-label\">\n <input\n class=\"sdds-form-input\"\n type=\"checkbox\"\n checked={this.selected}\n disabled={this.disabled}\n />\n </label>\n </div>\n )}\n <span class=\"sdds-option-label\">\n <slot />\n </span>\n {!this.isMultiSelectOption && (\n <span class=\"sdds-option-checkmark\">\n <svg\n width=\"10\"\n height=\"7\"\n viewBox=\"0 0 10 7\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M1 3L4 6L9 1\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/dropdown/dropdown-wc-default.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown-wc-default.stories.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-wc-default.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import readme from './readme.md';\nimport readmeOption from './dropdown-option/readme.md';\nimport { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n title: 'Components/Dropdown',\n parameters: {\n layout: 'centered',\n notes: { 'Dropdown': readme, 'Dropdown option': readmeOption },\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n ],\n },\n argTypes: {\n modeVariant: {\n name: 'Mode variant',\n description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n control: {\n type: 'radio',\n },\n options: ['Inherit from parent', 'Primary', 'Secondary'],\n table: {\n defaultValue: { summary: 'Inherit from parent' },\n },\n },\n state: {\n name: 'Error state',\n description: 'Puts the component in error state.',\n control: {\n type: 'boolean',\n },\n table: {\n defaultValue: { summary: false },\n },\n },\n size: {\n name: 'Size',\n description: 'Sets the size of the dropdown.',\n control: {\n type: 'radio',\n },\n options: ['Large', 'Medium', 'Small'],\n table: {\n defaultValue: { summary: 'lg' },\n },\n },\n openDirection: {\n name: 'Open direction',\n description: 'Sets which direction the dropdown will open in.',\n control: {\n type: 'radio',\n },\n options: ['Up', 'Down', 'Auto'],\n table: {\n defaultValue: { summary: 'lg' },\n },\n },\n labelPosition: {\n name: 'Label position',\n description: 'Sets the label text position.',\n control: {\n type: 'radio',\n },\n options: ['No label', 'Inside', 'Outside'],\n table: {\n defaultValue: { summary: 'no-label' },\n },\n },\n labelText: {\n name: 'Label text',\n description: 'Sets a label text to help describe what the dropdown contains.',\n control: {\n type: 'text',\n },\n if: { arg: 'labelPosition', neq: 'No label' },\n },\n placeholder: {\n name: 'Placeholder',\n description: 'Sets the placeholder text when no option is selected.',\n control: {\n type: 'text',\n },\n },\n helper: {\n name: 'Helper text',\n description: 'Sets a helper text to assist the user with additional information about the dropdown.',\n control: {\n type: 'text',\n },\n },\n defaultOption: {\n if: { arg: 'type', neq: 'Multiselect' },\n name: 'Default option',\n description: 'Sets a pre-selected option and replaces the placeholder.',\n control: {\n type: 'radio',\n },\n options: ['No default', 'Option 1', 'Option 2', 'Option 3'],\n },\n disabled: {\n name: 'Disabled',\n description: 'Disables the dropdown.',\n control: {\n type: 'boolean',\n },\n table: {\n defaultValue: { summary: false },\n },\n },\n },\n args: {\n modeVariant: 'Inherit from parent',\n state: false,\n size: 'Large',\n openDirection: 'Auto',\n labelPosition: 'No label',\n labelText: 'Label text',\n placeholder: 'Placeholder',\n helper: '',\n defaultOption: 'Option 1',\n disabled: false,\n },\n};\n\nconst Template = ({\n modeVariant,\n state = false,\n size,\n openDirection,\n labelText,\n labelPosition,\n placeholder,\n helper,\n defaultOption,\n disabled = false,\n}) => {\n const sizeLookup = { Large: 'lg', Medium: 'md', Small: 'sm' };\n const labelPosLookup = { 'No label': 'no-label', 'Inside': 'inside', 'Outside': 'outside' };\n const defaultOptionLookup = {\n 'No default': 'no-default',\n 'Option 1': 'option-1',\n 'Option 2': 'option-2',\n 'Option 3': 'option-3',\n };\n\n return formatHtmlPreview(`\n <style>\n /* demo-wrapper is for demonstration purposes only*/\n .demo-wrapper {\n width: 300px;\n height:200px;\n }\n </style>\n\n <div class=\"demo-wrapper\">\n <sdds-dropdown\n ${\n modeVariant !== 'Inherit from parent'\n ? `mode-variant=\"${modeVariant.toLowerCase()}\".sdds-option-label {\n `\n : ''\n }\n id=\"sdds-dropdown-reg\"\n size=\"${sizeLookup[size]}\"\n placeholder=\"${placeholder}\"\n disabled=\"${disabled}\"\n open-direction=\"${openDirection.toLowerCase()}\"\n label-position=\"${labelPosLookup[labelPosition]}\"\n ${labelPosLookup[labelPosition] !== 'no-label' ? `label=\"${labelText}\"` : ''}\n ${helper !== '' ? `helper=\"${helper}\"` : ''}\n state=\"${state}\"\n type=\"default\"\n default-option=\"${defaultOptionLookup[defaultOption]}\" >\n <sdds-dropdown-option value=\"option-1\" tabindex=\"0\" disabled>Option 1</sdds-dropdown-option>\n <sdds-dropdown-option value=\"option-2\" tabindex=\"0\">Option 2</sdds-dropdown-option>\n <sdds-dropdown-option value=\"option-3\" tabindex=\"0\">Option 3</sdds-dropdown-option>\n </sdds-dropdown>\n </div>\n `);\n};\n\nexport const WebComponentDefault = Template.bind({});\n"]}

package/dist/collection/components/dropdown/dropdown-wc-multiselect.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown-wc-multiselect.stories.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-wc-multiselect.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import readme from './readme.md';\nimport readmeOption from './dropdown-option/readme.md';\n\nimport { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n title: 'Components/Dropdown',\n parameters: {\n layout: 'centered',\n notes: { 'Dropdown': readme, 'Dropdown option': readmeOption },\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9754%3A22916&t=M7Ova7xZaoeMwb5e-1',\n },\n ],\n },\n argTypes: {\n modeVariant: {\n name: 'Mode variant',\n description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n control: {\n type: 'radio',\n },\n options: ['Inherit from parent', 'Primary', 'Secondary'],\n table: {\n defaultValue: { summary: 'Inherit from parent' },\n },\n },\n state: {\n name: 'Error state',\n description: 'Puts the component in error state.',\n control: {\n type: 'boolean',\n },\n table: {\n defaultValue: { summary: false },\n },\n },\n size: {\n name: 'Size',\n description: 'Sets the size of the dropdown.',\n control: {\n type: 'radio',\n },\n options: ['Large', 'Medium', 'Small'],\n table: {\n defaultValue: { summary: 'lg' },\n },\n },\n openDirection: {\n name: 'Open direction',\n description: 'Sets which direction the dropdown will open in.',\n control: {\n type: 'radio',\n },\n options: ['Up', 'Down', 'Auto'],\n table: {\n defaultValue: { summary: 'auto' },\n },\n },\n labelPosition: {\n name: 'Label position',\n description: 'Sets the label text position.',\n control: {\n type: 'radio',\n },\n options: ['No label', 'Inside', 'Outside'],\n table: {\n defaultValue: { summary: 'no-label' },\n },\n },\n labelText: {\n name: 'Label text',\n description: 'Sets a label text to help describe what the dropdown contains.',\n control: {\n type: 'text',\n },\n if: { arg: 'labelPosition', neq: 'No label' },\n },\n placeholder: {\n name: 'Placeholder',\n description: 'Sets the placeholder text when no option is selected.',\n control: {\n type: 'text',\n },\n },\n helper: {\n name: 'Helper text',\n description: 'Sets a helper text to assist the user with additional information about the dropdown.',\n control: {\n type: 'text',\n },\n },\n multiDefaultOption: {\n name: 'Default options',\n description: 'Sets a pre-selected option and replaces the placeholder.',\n if: { arg: 'type', neq: 'Default' },\n control: {\n type: 'check',\n },\n options: ['Option 1', 'Option 2', 'Option 3'],\n },\n disabled: {\n name: 'Disabled',\n description: 'Disables the dropdown.',\n control: {\n type: 'boolean',\n },\n table: {\n defaultValue: { summary: false },\n },\n },\n },\n args: {\n modeVariant: 'Inherit from parent',\n state: false,\n size: 'Large',\n openDirection: 'Auto',\n labelPosition: 'No label',\n labelText: 'Label text',\n placeholder: 'Placeholder',\n helper: '',\n multiDefaultOption: ['Option 1', 'Option 2'],\n disabled: false,\n },\n};\n\nconst Template = ({\n modeVariant,\n state = false,\n size,\n openDirection,\n labelPosition,\n labelText,\n placeholder,\n helper,\n multiDefaultOption,\n disabled = false,\n}) => {\n const sizeLookup = { Large: 'lg', Medium: 'md', Small: 'sm' };\n const labelPosLookup = { 'No label': 'no-label', 'Inside': 'inside', 'Outside': 'outside' };\n const multiDefaultOptionValue = multiDefaultOption.map((value) =>\n value.toLowerCase().replace(' ', '-'),\n );\n return formatHtmlPreview(`\n <style>\n /* demo-wrapper is for demonstration purposes only*/\n .demo-wrapper {\n width: 300px;\n height:200px;\n }\n </style>\n\n <div class=\"demo-wrapper\">\n <sdds-dropdown\n ${\n modeVariant !== 'Inherit from parent'\n ? `mode-variant=\"${modeVariant.toLowerCase()}\".sdds-option-label {\n `\n : ''\n }\n id=\"sdds-dropdown-reg\"\n size=\"${sizeLookup[size]}\"\n placeholder=\"${placeholder}\"\n disabled=\"${disabled}\"\n open-direction=\"${openDirection.toLowerCase()}\"\n label-position=\"${labelPosLookup[labelPosition]}\"\n ${labelPosLookup[labelPosition] !== 'no-label' ? `label=\"${labelText}\"` : ''}\n ${helper !== '' ? `helper=\"${helper}\"` : ''}\n state=\"${state}\"\n type=\"multiselect\"\n default-option=\"${multiDefaultOptionValue}\" >\n <sdds-dropdown-option value=\"option-1\" tabindex=\"0\">Option 1</sdds-dropdown-option>\n <sdds-dropdown-option value=\"option-2\" tabindex=\"0\" disabled>Option 2</sdds-dropdown-option>\n <sdds-dropdown-option value=\"option-3\" tabindex=\"0\">Option 3</sdds-dropdown-option>\n </sdds-dropdown>\n </div>\n `);\n};\n\nexport const WebComponentMultiselect = Template.bind({});\n"]}

package/dist/collection/components/dropdown/dropdown.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,KAAK,EACL,OAAO,EACP,MAAM,EACN,IAAI,EACJ,KAAK,EAEL,KAAK,EACL,MAAM,GACP,MAAM,eAAe,CAAC;AAOvB,MAAM,OAAO,QAAQ;;uBAI4B,IAAI;;;;oBAYvB,KAAK;gBAGoB,SAAS;gBAGI,IAAI;kBAG5C,KAAK;yBAG4B,UAAU;;iBAM5C,KAAK;kBAGL,EAAE;yBAGqB,MAAM;wBAElB,EAAE;wBAEF,EAAE;gBAEb,KAAK;;yBAIG,EAAE;yBAEF,EAAE;+BAEQ,EAAE;+BAEF,EAAE;+BAEN,EAAE;uBAET,KAAK;8BAEC,CAAC;;yBAIT,CAAC,CAAC;;;;EAQhC,iBAAiB;IACf,mEAAmE;IACnE,kEAAkE;IAClE,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;IACzC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IACrD,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;MAClC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;MACvC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;IACH,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAE9C,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;MACzB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;MACjB,OAAO,CAAC,IAAI,CAAC,mDAAmD,CAAC,CAAC;KACnE;IACD,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;MAC1B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;MACjB,OAAO,CAAC,IAAI,CAAC,oDAAoD,CAAC,CAAC;KACpE;IACD,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;MACzB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;MACjB,OAAO,CAAC,IAAI,CAAC,mDAAmD,CAAC,CAAC;KACnE;EACH,CAAC;EAED,oBAAoB,CAAC,WAAW;IAC9B,IAAI,WAAW,EAAE;MACf,IAAI,CAAC,WAAW,EAAE,CAAC;MACnB,OAAO;MACP,6CAA6C;MAC7C,WAAW,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;MACrC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QAClD,sBAAsB;QACtB,MAAM,EAAE,GAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QACtC,IAAI,WAAW,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,EAAE;UACzC,IAAI,CAAC,mBAAmB,GAAG,CAAC,GAAG,IAAI,CAAC,mBAAmB,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC;UAChF,IAAI,CAAC,mBAAmB,GAAG,CAAC,GAAG,IAAI,CAAC,mBAAmB,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC;UACnE,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,WAAW,CAAC;UACpC,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,KAAK,CAAC;UAC9B,EAAE,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;UACzC,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;SACrC;aAAM;UACL,EAAE,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;UAC1C,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;SACtC;OACF;KACF;EACH,CAAC;EAGD,oBAAoB;IAClB,IAAI,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,EAAE;MAC1D,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;IACD,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAC/C,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC;EAChD,CAAC;EAGD,cAAc,CAAC,EAAE;IACf,uBAAuB;IACvB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrB,MAAM,MAAM,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAClE,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;MACzD,IAAI,OAAO,IAAI,CAAC,SAAS,KAAK,WAAW,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,EAAE;QACpE,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;OACxB;KACF;SAAM;MACL,IAAI,CAAC,iBAAiB,EAAE,CAAC;MACzB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;KACnB;EACH,CAAC;EAGD,WAAW,CAAC,EAAiB;IAC3B,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;MAClB,QAAQ,EAAE,CAAC,GAAG,EAAE;QACd,KAAK,WAAW;UACd,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,EAAE,CAAC,cAAc,EAAE,CAAC;YACpB,IAAI,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE;cACtD,IAAI,CAAC,aAAa,EAAE,CAAC;aACtB;iBAAM;cACL,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;aACxB;YACA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,aAAa,CAAiB,CAAC,KAAK,EAAE,CAAC;WAClE;UACD,MAAM;QACR,KAAK,SAAS;UACZ,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,EAAE,CAAC,cAAc,EAAE,CAAC;YACpB,IAAI,IAAI,CAAC,aAAa,GAAG,CAAC,EAAE;cAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;aACtB;iBAAM;cACL,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;aACpD;YACA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,aAAa,CAAiB,CAAC,KAAK,EAAE,CAAC;WAClE;UACD,MAAM;QAER,KAAK,KAAK;UACR,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;UAClB,MAAM;QAER,KAAK,QAAQ;UACX,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;UAClB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;UAClB,MAAM;QAER;UACE,MAAM;OACT;KACF;EACH,CAAC;EAED,WAAW;IACT,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,KAAK,CAAC;IAChC,IAAI,IAAI,CAAC,aAAa,KAAK,MAAM,EAAE;MACjC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,oBAAoB,CAAC,YAAY,CAAC;MACjE,MAAM,gBAAgB,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;MAC/D,MAAM,cAAc,GAAG,MAAM,CAAC,WAAW,CAAC;MAC1C,IAAI,CAAC,WAAW,GAAG,gBAAgB,GAAG,IAAI,CAAC,kBAAkB,GAAG,EAAE,GAAG,cAAc,CAAC;MACpF,oHAAoH;MACpH,wFAAwF;MACxF,0GAA0G;KAC3G;SAAM;MACL,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,aAAa,KAAK,IAAI,CAAC;KAChD;EACH,CAAC;EAED,iBAAiB;IACf,IAAI,OAAO,IAAI,CAAC,SAAS,KAAK,WAAW,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,EAAE;MACpE,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,IAAI,CAAC,EAAE;QACzD,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,EAAE,CAAC;QAC1B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;OAC3B;MACD,IAAI,IAAI,CAAC,aAAa,KAAK,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE;QAC/C,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC;OAC3C;KACF;EACH,CAAC;EAGD,mBAAmB,CAAC,KAAuB;IACzC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,aAAa,CAAC;IACxC,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE;MAC/B,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;MACxC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;MACxC,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;SAAM;MACL,IAAI,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;QACzD,MAAM,SAAS,GAAG,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACvE,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,MAAM,CACxD,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,SAAS,CACvC,CAAC;QACF,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,MAAM,CACxD,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,SAAS,CACvC,CAAC;OACH;WAAM;QACL,IAAI,CAAC,mBAAmB,GAAG,CAAC,GAAG,IAAI,CAAC,mBAAmB,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC7E,IAAI,CAAC,mBAAmB,GAAG,CAAC,GAAG,IAAI,CAAC,mBAAmB,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC;OACrF;KACF;EACH,CAAC;EAUD,YAAY,CAAC,EAAE;IACb,MAAM,UAAU,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC;IACnC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IAClC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;EACnB,CAAC;EAED,WAAW;IACT,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;IACxB,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;IACxB,IAAI,CAAC,mBAAmB,GAAG,EAAE,CAAC;IAC9B,IAAI,CAAC,mBAAmB,GAAG,EAAE,CAAC;IAC9B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,iCACvD,UAAU,KACb,QAAQ,EAAE,KAAK,IACf,CAAC,CAAC;EACN,CAAC;EAES,KAAK,CAAC,WAAW;IACzB,IAAI,CAAC,WAAW,EAAE,CAAC;IACnB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAElB,IAAI,IAAI,CAAC,aAAa,EAAE;MACtB,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KAC/C;EACH,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;UACL,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,qBAAqB,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE;UAC/D,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE;UACxD,IAAI,CAAC,IAAI,KAAK,aAAa,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,EAAE;UAC9D,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE;UAEzC,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,aAAa,KAAK,EAAE;QACxD,CAAC,CAAC,yBAAyB;QAC3B,CAAC,CAAC,EACN;UACE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE;UACxC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,EAAE;UAErD,IAAI,CAAC,aAAa,KAAK,QAAQ,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,GAAG,CAAC;QACpE,CAAC,CAAC,sCAAsC;QACxC,CAAC,CAAC,EACN;QACA,oBACgB,IAAI,CAAC,aAAa,mBACnB,IAAI,CAAC,aAAa,2BACV,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,2BACxC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC;MAE/D,YAAM,KAAK,EAAE,+BAA+B,IAAI,CAAC,IAAI,EAAE;QACpD,IAAI,CAAC,aAAa,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAC3D,YAAM,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,KAAK,CAAQ,CAC9D,CAAC,CAAC,CAAC,CACF,EAAE,CACH;QACD,cACE,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,EAAE,EACrD,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EACrC,KAAK,EAAE,wBAAwB,IAAI,CAAC,aAAa,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,IAC/E,IAAI,CAAC,aAAa,KAAK,EAAE,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,GAAG,CAAC;YAC9D,CAAC,CAAC,gCAAgC;YAClC,CAAC,CAAC,EACN;kBAEM,IAAI,CAAC,aAAa,KAAK,QAAQ,IAAI,IAAI,CAAC,aAAa,KAAK,EAAE,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI;YAChF,CAAC,CAAC,qCAAqC,IAAI,CAAC,IAAI,EAAE;YAClD,CAAC,CAAC,wBAAwB,IAAI,CAAC,IAAI,EACvC,EAAE,EACN,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,EACjC,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;UAEjC,YAAM,KAAK,EAAC,qBAAqB,IAC9B,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxB,aACE,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,EAAE,EACrD,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAC,IAAI,EACb,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,OAA2B,CAAC,EAChE,KAAK,EAAC,sBAAsB,EAC5B,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,KAAK,EAAE,IAAI,CAAC,aAAa,EACzB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,EAC5C,YAAY,EAAC,KAAK,GAClB,CACH,CAAC,CAAC,CAAC,CACF,YACE,KAAK,EAAE;cACL,+BAA+B,EAAE,IAAI;cACrC,6CAA6C,EAC3C,IAAI,CAAC,aAAa,KAAK,QAAQ;gBAC/B,IAAI,CAAC,IAAI,KAAK,IAAI;gBAClB,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,GAAG,CAAC,CAAC;aACzE;YAEA,IAAI,CAAC,IAAI,KAAK,IAAI;cACjB,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,GAAG,CAAC,CAAC;cACtE,IAAI,CAAC,aAAa,KAAK,QAAQ;cAC/B,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CACvB,YAAM,KAAK,EAAC,4BAA4B,IAAE,IAAI,CAAC,KAAK,CAAQ,CAC7D;YACH,YACE,KAAK,EAAE,4BACL,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,KAAK,CAAC;gBAC9B,CAAC,IAAI,CAAC,aAAa,KAAK,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;gBAC7D,2BACF,EAAE;cAED,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC;gBAC5B,IAAI,CAAC,IAAI,KAAK,aAAa;gBAC3B,IAAI,CAAC,aAAa;cAEnB,IAAI,CAAC,IAAI,KAAK,aAAa,IAAI,CAC9B,YAAM,KAAK,EAAC,kCAAkC;gBAC3C,IAAI,CAAC,aAAa,KAAK,QAAQ;kBAC9B,IAAI,CAAC,mBAAmB,CAAC,QAAQ,EAAE,CAAC,MAAM,GAAG,CAAC;kBAC9C,IAAI,CAAC,WAAW;gBACjB,IAAI,CAAC,mBAAmB,CAAC,QAAQ,EAAE,CAAC,MAAM,GAAG,CAAC;kBAC7C,IAAI,CAAC,mBAAmB,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CACtD,CACR;cACA,CAAC,IAAI,CAAC,aAAa;gBAClB,IAAI,CAAC,aAAa,KAAK,QAAQ;gBAC/B,IAAI,CAAC,IAAI,KAAK,IAAI;gBAClB,IAAI,CAAC,KAAK;cAEX,CAAC,IAAI,CAAC,aAAa;gBAClB,IAAI,CAAC,IAAI,KAAK,aAAa;gBAC3B,IAAI,CAAC,aAAa,KAAK,QAAQ;gBAC/B,IAAI,CAAC,WAAW;cAEjB,CAAC,IAAI,CAAC,aAAa;gBAClB,IAAI,CAAC,IAAI,KAAK,IAAI;gBAClB,IAAI,CAAC,aAAa,KAAK,QAAQ;gBAC/B,IAAI,CAAC,WAAW,CACb,CACF,CACR,CACI;UACP,WACE,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,GAAG,EACV,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B;YAElC,YACE,CAAC,EAAC,eAAe,EACjB,MAAM,EAAC,cAAc,kBACR,MAAM,oBACJ,OAAO,qBACN,OAAO,GACvB,CACE,CACC;QACT,YACE,KAAK,EAAC,oBAAoB;UAC1B,0EAA0E;UAC1E,GAAG,EAAE,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,oBAAoB,GAAG,YAAY,CAAC;UAEjE,eAAQ,CACH,CACF;MACP,SAAG,KAAK,EAAC,sBAAsB;QAC7B,WACE,KAAK,EAAC,0BAA0B,EAChC,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW;UAEnB,yBACY,SAAS,eACT,SAAS,EACnB,CAAC,EAAC,0MAA0M,EAC5M,IAAI,EAAC,cAAc,GACnB;UACF,YACE,CAAC,EAAC,gGAAgG,EAClG,IAAI,EAAC,cAAc,GACnB,CACE;QACN,gBAAO,IAAI,CAAC,MAAM,CAAQ,CACxB,CACC,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n h,\n Prop,\n State,\n Element,\n Listen,\n Host,\n Event,\n EventEmitter,\n Watch,\n Method,\n} from '@stencil/core';\n\n@Component({\n tag: 'sdds-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown {\n textInput?: HTMLInputElement;\n\n /** Set the variant of the dropdown. */\n @Prop() modeVariant: 'primary' | 'secondary' = null;\n\n /** Placeholder text for dropdown with no selectedLabel item */\n @Prop() placeholder: string;\n\n /** Add the value of the option as string to set it as default */\n @Prop() defaultOption: string;\n\n /** Add the value of the option as string to set it as new selected value */\n @Prop() selectedOption: string;\n\n /** Set to true for disabled states */\n @Prop() disabled: boolean = false;\n\n /** `Controls type of dropdown. */\n @Prop() type: 'default' | 'multiselect' | 'filter' = 'default';\n\n /** Controls the size of dropdown. 'sm', 'md' and 'lg' correct values and 'small', 'medium' and 'large' are deprecated */\n @Prop() size: 'sm' | 'md' | 'lg' | 'small' | 'medium' | 'large' = 'lg';\n\n /** Set to true to make the width following the label text length */\n @Prop() inline: boolean = false;\n\n /** Controls position of label */\n @Prop() labelPosition: 'no-label' | 'inside' | 'outside' = 'no-label';\n\n /** Label text for label inside & outside */\n @Prop() label: string;\n\n /** Support `error` state */\n @Prop() state: boolean = false;\n\n /** Add helper text in the bottom of dropdown */\n @Prop() helper: string = '';\n\n /** Direction that the dropdown will open. Default is auto. */\n @Prop() openDirection: 'down' | 'up' | 'auto' = 'auto';\n\n @State() optionValues: Array<any> = [];\n\n @State() optionLabels: Array<any> = [];\n\n @State() open: boolean = false;\n\n @State() node: HTMLElement;\n\n @State() selectedLabel: string = '';\n\n @State() selectedValue: string = '';\n\n @State() selectedValuesArray: Array<any> = [];\n\n @State() selectedLabelsArray: Array<any> = [];\n\n @State() dropdownUniqueClass: string = '';\n\n @State() openUpwards: boolean = false;\n\n @State() dropdownMenuHeight: number = 0;\n\n @State() dropdownMenuSelector: HTMLElement;\n\n @State() listItemIndex: any = -1;\n\n @State() listItemArray: any;\n\n @State() listItemObject: any;\n\n @Element() host: HTMLElement;\n\n componentWillLoad() {\n // If default option is set, update the default selectedLabel value\n // this.host.children is a HTMLCollection type, cannot use forEach\n this.listItemObject = this.host.children;\n this.listItemArray = Array.from(this.listItemObject);\n this.listItemArray.map((listItem) => {\n this.optionValues.push(listItem.value);\n this.optionLabels.push(listItem.innerText.trim());\n });\n this.setOptionFromOutside(this.defaultOption);\n\n if (this.size === 'small') {\n this.size = 'sm';\n console.warn('size=\"small\" is deprecated, use size=\"sm\" instead');\n }\n if (this.size === 'medium') {\n this.size = 'md';\n console.warn('size=\"medium\" is deprecated, use size=\"md\" instead');\n }\n if (this.size === 'large') {\n this.size = 'lg';\n console.warn('size=\"large\" is deprecated, use size=\"lg\" instead');\n }\n }\n\n setOptionFromOutside(optionValue) {\n if (optionValue) {\n this.deselectAll();\n // TODO\n // eslint-disable-next-line no-param-reassign\n optionValue = optionValue.split(',');\n for (let i = 0; i < this.host.children.length; i++) {\n // Todo - specify type\n const el: any = this.host.children[i];\n if (optionValue.includes(el.value.trim())) {\n this.selectedLabelsArray = [...this.selectedLabelsArray, el.textContent.trim()];\n this.selectedValuesArray = [...this.selectedValuesArray, el.value];\n this.selectedLabel = el.textContent;\n this.selectedValue = el.value;\n el.setAttribute('selectedLabel', 'true');\n el.setAttribute('selected', 'true');\n } else {\n el.setAttribute('selectedLabel', 'false');\n el.setAttribute('selected', 'false');\n }\n }\n }\n }\n\n @Watch('selectedOption')\n changeSelectedOption() {\n if (this.selectedValuesArray.includes(this.selectedOption)) {\n this.resetOption();\n }\n this.setOptionFromOutside(this.selectedOption);\n this.host.setAttribute('selected-option', '');\n }\n\n @Listen('click', { target: 'document' })\n handleDocClick(ev) {\n // To stop bubble click\n ev.stopPropagation();\n const target = ev ? ev.composedPath()[0] : window.event.target[0];\n if (this.node !== undefined && this.node.contains(target)) {\n if (typeof this.textInput !== 'undefined' || this.textInput === null) {\n this.textInput.focus();\n }\n } else {\n this.tabbingLabelReset();\n this.open = false;\n }\n }\n\n @Listen('keydown')\n keyListener(ev: KeyboardEvent) {\n if (!this.disabled) {\n switch (ev.key) {\n case 'ArrowDown':\n if (this.open) {\n ev.preventDefault();\n if (this.listItemIndex < this.listItemArray.length - 1) {\n this.listItemIndex++;\n } else {\n this.listItemIndex = 0;\n }\n (this.listItemObject[this.listItemIndex] as HTMLElement).focus();\n }\n break;\n case 'ArrowUp':\n if (this.open) {\n ev.preventDefault();\n if (this.listItemIndex > 0) {\n this.listItemIndex--;\n } else {\n this.listItemIndex = this.listItemArray.length - 1;\n }\n (this.listItemObject[this.listItemIndex] as HTMLElement).focus();\n }\n break;\n\n case 'Tab':\n this.open = false;\n break;\n\n case 'Escape':\n this.open = false;\n this.node.focus();\n break;\n\n default:\n break;\n }\n }\n }\n\n handleClick() {\n this.open = this.open === false;\n if (this.openDirection === 'auto') {\n this.dropdownMenuHeight = this.dropdownMenuSelector.offsetHeight;\n const distanceToBottom = this.host.getBoundingClientRect().top;\n const viewportHeight = window.innerHeight;\n this.openUpwards = distanceToBottom + this.dropdownMenuHeight + 57 > viewportHeight;\n // If summary of dropdown menu height and its distance to the bottom is more than viewport height, open menu upwards\n // Additional 57px is added as compensation for dropdown element own input/button height\n // It is added on handleClick due to possible dynamic injection of data when component is already rendered\n } else {\n this.openUpwards = this.openDirection === 'up';\n }\n }\n\n tabbingLabelReset() {\n if (typeof this.textInput !== 'undefined' || this.textInput === null) {\n if (!this.selectedLabel && this.selectedLabel.length <= 0) {\n this.textInput.value = '';\n this.inputSearch.emit('');\n }\n if (this.selectedLabel !== this.textInput.value) {\n this.textInput.value = this.selectedLabel;\n }\n }\n }\n\n @Listen('internalSddsSelect')\n selectOptionHandler(event: CustomEvent<any>) {\n this.open = this.type === 'multiselect';\n if (this.type !== 'multiselect') {\n this.selectedLabel = event.detail.label;\n this.selectedValue = event.detail.value;\n this.tabbingLabelReset();\n } else {\n if (this.selectedValuesArray.includes(event.detail.value)) {\n const itemIndex = this.selectedValuesArray.indexOf(event.detail.value);\n this.selectedValuesArray = this.selectedValuesArray.filter(\n (_value, index) => index !== itemIndex,\n );\n this.selectedLabelsArray = this.selectedLabelsArray.filter(\n (_value, index) => index !== itemIndex,\n );\n } else {\n this.selectedValuesArray = [...this.selectedValuesArray, event.detail.value];\n this.selectedLabelsArray = [...this.selectedLabelsArray, event.detail.label.trim()];\n }\n }\n }\n\n @Event({\n eventName: 'inputSearch',\n composed: true,\n cancelable: true,\n bubbles: true,\n })\n inputSearch: EventEmitter<any>;\n\n handleSearch(ev) {\n const searchTerm = ev.target.value;\n this.inputSearch.emit(searchTerm);\n this.open = true;\n }\n\n deselectAll() {\n this.selectedLabel = '';\n this.selectedValue = '';\n this.selectedLabelsArray = [];\n this.selectedValuesArray = [];\n this.listItemArray = this.listItemArray.map((optionItem) => ({\n ...optionItem,\n selected: false,\n }));\n }\n\n @Method() async resetOption() {\n this.deselectAll();\n this.open = false;\n\n if (this.defaultOption) {\n this.setOptionFromOutside(this.defaultOption);\n }\n }\n\n render() {\n return (\n <Host\n class={`\n ${this.modeVariant ? `sdds-mode-variant-${this.modeVariant}` : ''}\n ${this.open && !this.disabled ? 'sdds-dropdown--open' : ''}\n ${this.type === 'multiselect' ? 'sdds-dropdown-multiselect' : ''}\n ${this.inline ? 'sdds-dropdown-inline' : ''}\n ${\n this.selectedLabel.length > 0 || this.selectedLabel === ''\n ? 'sdds-dropdown--selected'\n : ''\n }\n ${this.state ? 'sdds-dropdown--error' : ''}\n ${this.openUpwards ? 'sdds-dropdown--open-upwards' : ''}\n ${\n this.labelPosition === 'inside' && this.selectedLabelsArray.length > 0\n ? 'sdds-dropdown--label-inside-position'\n : ''\n }\n `}\n selected-value={this.selectedValue}\n selected-text={this.selectedLabel}\n multi-selected-values={JSON.stringify(this.selectedValuesArray)}\n multi-selected-labels={JSON.stringify(this.selectedLabelsArray)}\n >\n <span class={`sdds-dropdown sdds-dropdown-${this.size}`}>\n {this.labelPosition === 'outside' && this.label.length > 0 ? (\n <span class=\"sdds-dropdown-label-outside\">{this.label}</span>\n ) : (\n ''\n )}\n <button\n part={this.disabled ? 'dropdown-filter-disabled' : ''}\n disabled={this.disabled}\n tabindex={this.disabled ? '-1' : null}\n class={`sdds-dropdown-toggle ${this.selectedValue === 'filter' ? 'is-filter' : ''} ${\n this.selectedValue !== '' || this.selectedLabelsArray.length > 0\n ? 'sdds-dropdown-toggle--selected'\n : ''\n }\n ${\n this.labelPosition === 'inside' && this.selectedValue !== '' && this.size !== 'sm'\n ? `sdds-dropdown-toggle-label-inside-${this.size}`\n : `sdds-dropdown-toggle-${this.size}`\n }`}\n type=\"button\"\n onClick={() => this.handleClick()}\n ref={(node) => (this.node = node)}\n >\n <span class=\"sdds-dropdown-label\">\n {this.type === 'filter' ? (\n <input\n part={this.disabled ? 'dropdown-filter-disabled' : ''}\n disabled={this.disabled}\n tabindex=\"-1\"\n ref={(inputEl) => (this.textInput = inputEl as HTMLInputElement)}\n class=\"sdds-dropdown-filter\"\n type=\"text\"\n placeholder={this.placeholder}\n value={this.selectedLabel}\n onInput={(event) => this.handleSearch(event)}\n autoComplete=\"off\"\n />\n ) : (\n <span\n class={{\n 'sdds-dropdown-label-container': true,\n 'sdds-dropdown-label-container--label-inside':\n this.labelPosition === 'inside' &&\n this.size !== 'sm' &&\n (this.selectedLabel.length > 0 || this.selectedLabelsArray.length > 0),\n }}\n >\n {this.size !== 'sm' &&\n (this.selectedLabel.length > 0 || this.selectedLabelsArray.length > 0) &&\n this.labelPosition === 'inside' &&\n this.label.length > 0 && (\n <span class=\"sdds-dropdown-label-inside\">{this.label}</span>\n )}\n <span\n class={`sdds-dropdown-label-main ${\n (this.selectedLabel.length === 0 ||\n (this.labelPosition === 'inside' && this.label.length < 0)) &&\n 'sdds-dropdown-placeholder'\n }`}\n >\n {this.selectedLabel.length > 0 &&\n this.type !== 'multiselect' &&\n this.selectedLabel}\n\n {this.type === 'multiselect' && (\n <span class=\"sdds-dropdown-multiselect-result\">\n {this.labelPosition !== 'inside' &&\n this.selectedLabelsArray.toString().length < 1 &&\n this.placeholder}\n {this.selectedLabelsArray.toString().length > 0 &&\n this.selectedLabelsArray.toString().split(',').join(', ')}\n </span>\n )}\n {!this.selectedLabel &&\n this.labelPosition === 'inside' &&\n this.size !== 'sm' &&\n this.label}\n\n {!this.selectedLabel &&\n this.type !== 'multiselect' &&\n this.labelPosition !== 'inside' &&\n this.placeholder}\n\n {!this.selectedLabel &&\n this.size === 'sm' &&\n this.labelPosition === 'inside' &&\n this.placeholder}\n </span>\n </span>\n )}\n </span>\n <svg\n class=\"sdds-dropdown-arrow\"\n width=\"12\"\n height=\"7\"\n viewBox=\"0 0 12 7\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M1 1L6 6L11 1\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n <span\n class=\"sdds-dropdown-menu\"\n // Need to have reference in order to calc height and distance from bottom\n ref={(dropdownMenu) => (this.dropdownMenuSelector = dropdownMenu)}\n >\n <slot />\n </span>\n </span>\n <p class=\"sdds-dropdown-helper\">\n <svg\n class=\"sdds-dropdown-error-icon\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 32 32\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M16 4C9.37 4 3.996 9.374 3.996 16.004S9.371 28.007 16 28.007c6.63 0 12.004-5.374 12.004-12.003C28.004 9.374 22.629 4 16 4ZM2 16.004c0-7.732 6.268-14 14-14s14 6.268 14 14-6.268 14-14 14-14-6.268-14-14Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M14.803 14.47V10h2.376v4.47l-.352 4.295h-1.672l-.352-4.295Zm-.053 5.632h2.5v2.394h-2.5v-2.394Z\"\n fill=\"currentColor\"\n />\n </svg>\n <span>{this.helper}</span>\n </p>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/footer/footer.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"footer.stories.js","sourceRoot":"","sources":["../../../src/components/footer/footer.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,eAAe;EACb,KAAK,EAAE,mBAAmB;EAC1B,UAAU,EAAE;IACV,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,YAAY;IACpB,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,WAAW,EAAE;MACX,IAAI,EAAE,cAAc;MACpB,WAAW,EAAE,0GAA0G;MACvH,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,qBAAqB,EAAE,SAAS,EAAE,WAAW,CAAC;MACxD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,qBAAqB,EAAE;OACjD;KACF;IACD,OAAO,EAAE;MACP,IAAI,EAAE,UAAU;MAChB,WAAW,EAAE,kDAAkD;MAC/D,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;OAChB;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;OACjC;KACF;GACF;EACD,IAAI,EAAC;IACH,WAAW,EAAE,qBAAqB;IAClC,OAAO,EAAE,KAAK;GACjB;CACA,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,OAAO,EAAE,WAAW,EAAC,EAAE,EAAE,CAC3C,iBAAiB,CACf;;;;;;;;;;;IAWA,WAAW,KAAK,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,WAAW,CAAC,WAAW,EAAE,EAAE,CAAA,CAAC,CAAC,EAAE;;MAG1F,OAAO;EACL,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAkCH;EACC,CAAC,CAAC,EACN;;;;;;;;;;;;;;;;;;GAkBD,CACA,CAAC;AAEJ,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import readme from './readme.md';\nimport { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n title: 'Components/Footer',\n parameters: {\n notes: readme,\n layout: 'fullscreen',\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=7568%3A298118&t=Ne6myqwca5m00de7-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=7568%3A298118&t=Ne6myqwca5m00de7-1',\n },\n ],\n },\n argTypes: {\n modeVariant: {\n name: 'Mode variant',\n description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n control: {\n type: 'radio',\n },\n options: ['Inherit from parent', 'Primary', 'Secondary'],\n table: {\n defaultValue: { summary: 'Inherit from parent' },\n },\n },\n topPart: {\n name: 'Top part',\n description: 'Adds the top part of the footer with more links.',\n control: {\n type: 'boolean',\n },\n table: {\n defaultValue: { summary: false },\n },\n },\n },\n args:{\n modeVariant: 'Inherit from parent', \n topPart: false,\n}\n};\n\nconst Template = ({ topPart, modeVariant}) =>\n formatHtmlPreview(\n `\n <style>\n .demo-wrapper {\n padding: 0;\n margin: 0;\n font-size: 14px;\n }\n </style>\n\n <div class=\"demo-wrapper\">\n <div class=\"sdds-footer \n ${modeVariant !== 'Inherit from parent' ? `sdds-mode-variant-${modeVariant.toLowerCase()}`: ''}\n \">\n ${\n topPart\n ? `\n <div class=\"sdds-footer-top sdds-container-fluid\">\n <div class=\"sdds-row\">\n <div class=\"sdds-footer-top-col sdds-col-max sdds-col-xxlg sdds-col-xlg sdds-col-lg sdds-col-md-12 sdds-col-sm-12 sdds-col-xs-12\">\n <div class=\"sdds-footer-title opened\">\n <span>Title 1</span>\n <span class=\"sdds-footer-top-icon\">\n <sdds-icon name=\"chevron_down\" size=\"16px\"></sdds-icon>\n </span>\n </div>\n <ul class=\"sdds-footer-main-links opened\">\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n </ul>\n </div>\n\n <div class=\"sdds-col-max sdds-col-xxlg sdds-col-xlg sdds-col-lg sdds-col-md-12 sdds-col-sm-12 sdds-col-xs-12\">\n <div class=\"sdds-footer-title\">\n <span>Title 2</span>\n <span class=\"sdds-footer-top-icon\">\n <sdds-icon name=\"chevron_down\" size=\"16px\"></sdds-icon>\n </span>\n </div>\n <ul class=\"sdds-footer-main-links\">\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n </ul>\n </div>\n </div>\n </div>\n `\n : ''\n }\n <div class=\"sdds-footer-main\">\n <ul class=\"sdds-footer-main-links\">\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n <li><a href=\"#\">Legal link</a></li>\n </ul>\n <ul class=\"sdds-footer-social-links\">\n <li><a href=\"#\">Social link</a></li>\n <li><a href=\"#\">Social link</a></li>\n <li><a href=\"#\">Social link</a></li>\n </ul>\n <div class=\"sdds-footer-main-brand\">\n <p>Copyright © 2022 Scania</p>\n </div>\n </div>\n </div>\n </div>\n `,\n );\n\nexport const Native = Template.bind({});\n"]}

package/dist/collection/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.css DELETED Viewed

@@ -1,45 +0,0 @@
-[role=listitem] a {
-  font: var(--sdds-headline-06);
-  letter-spacing: var(--sdds-headline-06-ls);
-  color: var(--sdds-footer-main-links);
-  opacity: var(--sdds-footer-main-links-opacity);
-  text-decoration: none;
-}
-[role=listitem] a:focus {
-  outline: 2px solid var(--sdds-blue-400);
-  outline-offset: -2px;
-}
-[role=listitem] a:hover {
-  text-decoration: underline;
-}
-[role=listitem].top-part-child a {
-  color: var(--sdds-footer-top-links);
-  font-family: "Scania Sans Semi Condensed", "Scania Sans Condensed", arial, helvetica, sans-serif;
-  font-weight: bold;
-  font-size: 14px;
-  line-height: 18px;
-}
-[role=listitem].top-part-child a:focus {
-  outline: 2px solid var(--sdds-blue-400);
-  outline-offset: -2px;
-}
-@media all and (max-width: 992px) {
-  [role=listitem].top-part-child {
-    border-bottom: 1px solid var(--sdds-footer-top-divider);
-  }
-  [role=listitem].top-part-child a {
-    display: block;
-    height: 100%;
-    padding: 19px 40px;
-    font-weight: normal;
-  }
-  [role=listitem].top-part-child a:hover {
-    text-decoration: underline;
-    background-color: var(--sdds-footer-top-links-background-hover);
-  }
-  [role=listitem].top-part-child a:focus {
-    outline: 2px solid var(--sdds-blue-400);
-    outline-offset: -2px;
-  }
-}

package/dist/collection/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.js DELETED Viewed

@@ -1,86 +0,0 @@
-import { h } from '@stencil/core';
-export class SddsFooterLink {
-  constructor() {
-    this.parentIsTopPart = false;
-    this.linkHref = undefined;
-    this.target = '_self';
-    this.rel = 'noopener';
-  }
-  connectedCallback() {
-    this.parentIsTopPart = this.host.closest('sdds-footer-link-group').parentElement.slot === 'top';
-  }
-  render() {
-    return (h("div", { role: "listitem", class: `${this.parentIsTopPart ? 'top-part-child' : ''}` }, h("a", { target: this.target, rel: this.rel, href: this.linkHref }, h("slot", null))));
-  }
-  static get is() { return "sdds-footer-link"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["sdds-footer-link.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["sdds-footer-link.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "linkHref": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "URL for the link"
-        },
-        "attribute": "link-href",
-        "reflect": false
-      },
-      "target": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'_self' | '_blank' | '_parent' | '_top'",
-          "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Where to open the linked URL"
-        },
-        "attribute": "target",
-        "reflect": false,
-        "defaultValue": "'_self'"
-      },
-      "rel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "'noopener' is a security measure for legacy browsers that prevents the opened page from getting access to the original page when using target='_blank'."
-        },
-        "attribute": "rel",
-        "reflect": false,
-        "defaultValue": "'noopener'"
-      }
-    };
-  }
-  static get elementRef() { return "host"; }
-}
-//# sourceMappingURL=sdds-footer-link.js.map

package/dist/collection/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sdds-footer-link.js","sourceRoot":"","sources":["../../../../../src/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAS5D,MAAM,OAAO,cAAc;;IAYzB,oBAAe,GAAY,KAAK,CAAC;;kBAPyB,OAAO;eAG3C,UAAU;;EAMhC,iBAAiB;IACf,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,aAAa,CAAC,IAAI,KAAK,KAAK,CAAC;EAClG,CAAC;EAED,MAAM;IACJ,OAAO,CACL,WAAK,IAAI,EAAC,UAAU,EAAC,KAAK,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,EAAE;MAC3E,SAAG,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ;QACxD,eAAa,CACX,CACA,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Prop } from '@stencil/core';\nimport { HostElement } from '@stencil/core/internal';\n\n@Component({\n tag: 'sdds-footer-link',\n styleUrl: 'sdds-footer-link.scss',\n shadow: false,\n scoped: true,\n})\nexport class SddsFooterLink {\n /** URL for the link */\n @Prop() linkHref: string;\n\n /** Where to open the linked URL */\n @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n /** 'noopener' is a security measure for legacy browsers that prevents the opened page from getting access to the original page when using target='_blank'. */\n @Prop() rel: string = 'noopener';\n\n @Element() host: HostElement;\n\n parentIsTopPart: boolean = false;\n\n connectedCallback() {\n this.parentIsTopPart = this.host.closest('sdds-footer-link-group').parentElement.slot === 'top';\n }\n\n render() {\n return (\n <div role=\"listitem\" class={`${this.parentIsTopPart ? 'top-part-child' : ''}`}>\n <a target={this.target} rel={this.rel} href={this.linkHref}>\n <slot></slot>\n </a>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/footer/webcomponent/sdds-footer-link-group/sdds-footer-link-group.css DELETED Viewed

@@ -1,67 +0,0 @@
-:host {
-  display: block;
-  width: 100%;
-}
-:host .footer-top-title {
-  font: var(--sdds-headline-07);
-  letter-spacing: var(--sdds-headline-07-ls);
-  opacity: var(--sdds-footer-top-title-opacity);
-  color: var(--sdds-footer-top-links);
-  padding-bottom: 8px;
-}
-:host button.footer-top-title-button {
-  display: none;
-  border: none;
-  width: 100%;
-  font: var(--sdds-headline-07);
-  letter-spacing: var(--sdds-headline-07-ls);
-  color: var(--sdds-footer-top-links);
-  background-color: transparent;
-  text-align: left;
-  padding: 19px 24px;
-  justify-content: space-between;
-  border-bottom: 1px solid var(--sdds-footer-top-divider);
-}
-:host button.footer-top-title-button.expanded {
-  border-bottom: none;
-}
-:host button.footer-top-title-button.expanded sdds-icon {
-  transform: rotateZ(180deg);
-}
-:host button.footer-top-title-button:hover {
-  cursor: pointer;
-}
-:host button.footer-top-title-button:active {
-  background-color: var(--sdds-footer-top-button-active);
-}
-:host button.footer-top-title-button sdds-icon {
-  transition: transform 0.2s ease-in-out;
-}
-:host [role=list] {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-  display: flex;
-  gap: 8px;
-}
-:host [role=list].top-part-child {
-  flex-direction: column;
-}
-@media all and (max-width: 992px) {
-  :host [role=list].left:not(.top-part-child) {
-    flex-direction: column;
-  }
-  :host [role=list].top-part-child.closed {
-    display: none;
-  }
-  :host [role=list].top-part-child {
-    gap: 0;
-  }
-  :host .footer-top-title {
-    display: none;
-  }
-  :host button.footer-top-title-button {
-    display: flex;
-    align-items: center;
-  }
-}

package/dist/collection/components/footer/webcomponent/sdds-footer-link-group/sdds-footer-link-group.js DELETED Viewed

@@ -1,62 +0,0 @@
-import { Host, h } from '@stencil/core';
-export class SddsFooterLinkGroup {
-  constructor() {
-    this.rightSlot = false;
-    this.parentIsTopPart = false;
-    this.titleText = undefined;
-    this.open = false;
-  }
-  connectedCallback() {
-    this.rightSlot = this.host.parentElement.slot === 'main-right';
-    this.parentIsTopPart = this.host.parentElement.slot === 'top';
-  }
-  render() {
-    return (h(Host, null, this.titleText && this.parentIsTopPart && (h("div", { class: "footer-top-title" }, this.titleText)), this.titleText && this.parentIsTopPart && (h("button", { onClick: () => {
-        this.open = !this.open;
-      }, class: `footer-top-title-button  ${this.open ? 'expanded' : 'closed'}` }, this.titleText, h("sdds-icon", { name: "chevron_down", size: "20px" }))), h("div", { role: "list", class: `
-        ${this.rightSlot ? 'right' : 'left'}
-        ${this.parentIsTopPart ? 'top-part-child' : ''}
-        ${this.open ? 'expanded' : 'closed'}
-        ` }, h("slot", null))));
-  }
-  static get is() { return "sdds-footer-link-group"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["sdds-footer-link-group.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["sdds-footer-link-group.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "titleText": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Title text for the link group, only valid on top part of footer."
-        },
-        "attribute": "title-text",
-        "reflect": false
-      }
-    };
-  }
-  static get states() {
-    return {
-      "open": {}
-    };
-  }
-  static get elementRef() { return "host"; }
-}
-//# sourceMappingURL=sdds-footer-link-group.js.map

package/dist/collection/components/footer/webcomponent/sdds-footer-link-group/sdds-footer-link-group.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sdds-footer-link-group.js","sourceRoot":"","sources":["../../../../../src/components/footer/webcomponent/sdds-footer-link-group/sdds-footer-link-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAe,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAQ5D,MAAM,OAAO,mBAAmB;;IAQ9B,cAAS,GAAY,KAAK,CAAC;IAE3B,oBAAe,GAAY,KAAK,CAAC;;gBAJR,KAAK;;EAM9B,iBAAiB;IACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,YAAY,CAAC;IAC/D,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,KAAK,CAAC;EAChE,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACF,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,eAAe,IAAI,CACzC,WAAK,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,SAAS,CAAO,CACrD;MAEA,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,eAAe,IAAI,CACzC,cACE,OAAO,EAAE,GAAG,EAAE;UACZ,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;QACzB,CAAC,EACD,KAAK,EAAE,4BAA4B,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,EAAE;QAErE,IAAI,CAAC,SAAS;QACf,iBAAW,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,MAAM,GAAa,CAChD,CACV;MACD,WACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;UACP,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;UACjC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE;UAC5C,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ;SAClC;QAEC,eAAa,CACT,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, Element } from '@stencil/core';\nimport { HostElement, State } from '@stencil/core/internal';\n\n@Component({\n tag: 'sdds-footer-link-group',\n styleUrl: 'sdds-footer-link-group.scss',\n shadow: false,\n scoped: true,\n})\nexport class SddsFooterLinkGroup {\n /** Title text for the link group, only valid on top part of footer. */\n @Prop() titleText: string;\n\n @Element() host: HostElement;\n\n @State() open: boolean = false;\n\n rightSlot: boolean = false;\n\n parentIsTopPart: boolean = false;\n\n connectedCallback() {\n this.rightSlot = this.host.parentElement.slot === 'main-right';\n this.parentIsTopPart = this.host.parentElement.slot === 'top';\n }\n\n render() {\n return (\n <Host>\n {this.titleText && this.parentIsTopPart && (\n <div class=\"footer-top-title\">{this.titleText}</div>\n )}\n\n {this.titleText && this.parentIsTopPart && (\n <button\n onClick={() => {\n this.open = !this.open;\n }}\n class={`footer-top-title-button ${this.open ? 'expanded' : 'closed'}`}\n >\n {this.titleText}\n <sdds-icon name=\"chevron_down\" size=\"20px\"></sdds-icon>\n </button>\n )}\n <div\n role=\"list\"\n class={`\n ${this.rightSlot ? 'right' : 'left'}\n ${this.parentIsTopPart ? 'top-part-child' : ''}\n ${this.open ? 'expanded' : 'closed'}\n `}\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/footer/webcomponent/sdds-footer.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sdds-footer.js","sourceRoot":"","sources":["../../../../src/components/footer/webcomponent/sdds-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,IAAI,EAAe,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAOjE,MAAM,OAAO,UAAU;;uBAE0B,IAAI;;;EAMnD,iBAAiB;IACf,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAChD,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC;EACvE,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,qBAAqB,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE;MAC/E;QACG,IAAI,CAAC,UAAU,IAAI,CAClB,WAAK,KAAK,EAAC,YAAY;UACrB,YAAM,IAAI,EAAC,KAAK,GAAQ,CACpB,CACP;QACD,WAAK,KAAK,EAAC,aAAa;UACtB,WAAK,KAAK,EAAC,iBAAiB;YAC1B,WAAK,KAAK,EAAC,oBAAoB;cAC7B,YAAM,IAAI,EAAC,WAAW,GAAQ,CAC1B;YACN,WAAK,KAAK,EAAC,qBAAqB;cAC9B,YAAM,IAAI,EAAC,YAAY,GAAQ,CAC3B,CACF;UACN,WAAK,KAAK,EAAC,oBAAoB;YAC7B,aAAO,KAAK,EAAC,WAAW;;cAAmB,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE;wBAAgB;YACnF,WAAK,KAAK,EAAC,OAAO;cAChB,sBAAa,CACT,CACF,CACF,CACC,CACJ,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, State, Element } from '@stencil/core';\nimport { Host, HostElement, Prop } from '@stencil/core/internal';\n\n@Component({\n tag: 'sdds-footer',\n styleUrl: 'sdds-footer.scss',\n shadow: true,\n})\nexport class SddsFooter {\n /** Mode variant of the component, based on current mode. */\n @Prop() modeVariant: 'primary' | 'secondary' = null;\n\n @State() hasTopPart: boolean;\n\n @Element() host: HostElement;\n\n connectedCallback() {\n const children = Array.from(this.host.children);\n this.hasTopPart = children.some((element) => element.slot === 'top');\n }\n\n render() {\n return (\n <Host class={`${this.modeVariant ? `sdds-mode-variant-${this.modeVariant}` : ''}`}>\n <footer>\n {this.hasTopPart && (\n <div class=\"footer-top\">\n <slot name=\"top\"></slot>\n </div>\n )}\n <div class=\"footer-main\">\n <div class=\"footer-main-top\">\n <div class=\"footer-bottom-left\">\n <slot name=\"main-left\"></slot>\n </div>\n <div class=\"footer-bottom-right\">\n <slot name=\"main-right\"></slot>\n </div>\n </div>\n <div class=\"footer-main-bottom\">\n <small class=\"copyright\">Copyright © {new Date().getFullYear()} Scania</small>\n <div class=\"brand\">\n <p>Scania</p>\n </div>\n </div>\n </div>\n </footer>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/footer/webcomponent/sdds-footer.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sdds-footer.stories.js","sourceRoot":"","sources":["../../../../src/components/footer/webcomponent/sdds-footer.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,UAAU,MAAM,8BAA8B,CAAC;AACtD,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAEjE,eAAe;EACb,KAAK,EAAE,mBAAmB;EAC1B,UAAU,EAAE;IACV,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,mBAAmB,EAAE,eAAe,EAAE,aAAa,EAAE,UAAU,EAAE;IAC5F,MAAM,EAAE,YAAY;IACpB,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,WAAW,EAAE;MACX,IAAI,EAAE,cAAc;MACpB,WAAW,EAAE,0GAA0G;MACvH,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,qBAAqB,EAAE,SAAS,EAAE,WAAW,CAAC;MACxD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,qBAAqB,EAAE;OACjD;KACF;IACD,OAAO,EAAE;MACP,IAAI,EAAE,UAAU;MAChB,WAAW,EAAE,kDAAkD;MAC/D,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;OAChB;KACF;GACF;EACD,IAAI,EAAE;IACJ,WAAW,EAAE,qBAAqB;IAClC,OAAO,EAAE,KAAK;GACf;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE,CAC5C,iBAAiB,CACf;;;;;;;;;MASE,WAAW,KAAK,qBAAqB,CAAC,CAAC,CAAC,iBAAiB,WAAW,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE;;QAGxF,OAAO;EACL,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAgCL;EACG,CAAC,CAAC,EACN;;;;;;;;;;;;;;;;;;;;;;;GAuBH,CACA,CAAC;AAEJ,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../../utils/utils';\nimport readme from './readme.md';\nimport readmeLink from './sdds-footer-link/readme.md';\nimport readmeLinkGroup from './sdds-footer-link-group/readme.md';\n\nexport default {\n title: 'Components/Footer',\n parameters: {\n notes: { 'Footer': readme, 'Footer link group': readmeLinkGroup, 'Footer link': readmeLink },\n layout: 'fullscreen',\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=7568%3A298118&t=Ne6myqwca5m00de7-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=7568%3A298118&t=Ne6myqwca5m00de7-1',\n },\n ],\n },\n argTypes: {\n modeVariant: {\n name: 'Mode variant',\n description: 'Mode variant adjusts component colors to have better visibility depending on global mode and background.',\n control: {\n type: 'radio',\n },\n options: ['Inherit from parent', 'Primary', 'Secondary'],\n table: {\n defaultValue: { summary: 'Inherit from parent' },\n },\n },\n topPart: {\n name: 'Top part',\n description: 'Adds the top part of the footer with more links.',\n control: {\n type: 'boolean',\n },\n },\n },\n args: {\n modeVariant: 'Inherit from parent',\n topPart: false,\n },\n};\n\nconst Template = ({ topPart, modeVariant }) =>\n formatHtmlPreview(\n `\n <main>\n <div class=\"sdds-u-p3 \">\n <div class=\"sdds-body-01\">\n Resize the window to see how the footer behaves on smaller/bigger screens.\n </div>\n </div>\n </main>\n <sdds-footer\n ${modeVariant !== 'Inherit from parent' ? `mode-variant=\"${modeVariant.toLowerCase()}\"` : ''}\n >\n ${\n topPart\n ? `\n <div slot=\"top\">\n <sdds-footer-link-group title-text=\"Title\">\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n </sdds-footer-link-group>\n\n <sdds-footer-link-group title-text=\"Title\">\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n </sdds-footer-link-group>\n\n <sdds-footer-link-group title-text=\"Title\">\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n </sdds-footer-link-group>\n\n <sdds-footer-link-group title-text=\"Title\">\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n </sdds-footer-link-group>\n\n <sdds-footer-link-group title-text=\"Title\">\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n </sdds-footer-link-group>\n </div>\n `\n : ''\n }\n <div slot=\"main-left\">\n <sdds-footer-link-group>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n <sdds-footer-link link-href=\"#\">Link text</sdds-footer-link>\n </sdds-footer-link-group>\n </div>\n <div slot=\"main-right\">\n <sdds-footer-link-group>\n <sdds-footer-link link-href=\"#\">\n <sdds-icon name=\"truck\"></sdds-icon>\n </sdds-footer-link>\n <sdds-footer-link link-href=\"#\">\n <sdds-icon name=\"truck\"></sdds-icon>\n </sdds-footer-link>\n <sdds-footer-link link-href=\"#\">\n <sdds-icon name=\"truck\"></sdds-icon>\n </sdds-footer-link>\n </sdds-footer-link-group>\n </div>\n </sdds-footer>\n \n `,\n );\n\nexport const WebComponent = Template.bind({});\n"]}

package/dist/collection/components/header/header-all.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"header-all.stories.js","sourceRoot":"","sources":["../../../src/components/header/header-all.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,eAAe;EACb,KAAK,EAAE,mBAAmB;EAC1B,UAAU,EAAE;IACV,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,YAAY;IACpB,IAAI,EAAE;MACJ,MAAM,EAAE;QACN,KAAK,EAAE,QAAQ;OAChB;KACF;IACD,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,QAAQ,EAAE;MACR,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,qCAAqC;MAClD,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;GACF;EACD,IAAI,EAAE;IACJ,QAAQ,EAAE,aAAa;GACxB;CACF,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACxC,iBAAiB,CACf;;;;;;;;;;;4CAWwC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAwK/C,CACF,CAAC;AAEJ,MAAM,CAAC,MAAM,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import readme from './readme.md';\nimport { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n title: 'Components/Header',\n parameters: {\n notes: readme,\n layout: 'fullscreen',\n docs: {\n source: {\n state: 'closed',\n },\n },\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',\n },\n ],\n },\n argTypes: {\n siteName: {\n name: 'Site name',\n description: 'Sets a custom title for the header.',\n control: {\n type: 'text',\n },\n },\n },\n args: {\n siteName: 'Application',\n },\n};\n\nconst AllMenusTemplate = ({ siteName }) =>\n formatHtmlPreview(\n `\n <nav class='sdds-nav'>\n <div class='sdds-nav__left'>\n <div class=\"sdds-nav__overlay\" onclick=\"closeDropdownsFromOverlay()\"></div>\n <button class='sdds-nav__mob-menu-btn' onclick='toggleMobileMenu()'>\n <span id='sdds-nav__mob-menu-icon'>\n <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-1'></span>\n <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-2'></span>\n <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-3'></span>\n </span>\n </button>\n <div class='sdds-nav__app-name'>${siteName}</div>\n </div>\n\n <div class='sdds-nav__center'>\n <ul class='sdds-nav__inline-menu'>\n\n <li class='sdds-nav__item'>\n <a class='sdds-nav__item-core' href='#'>\n <span class='sdds-nav__item-core-text'>Item 1</span>\n </a>\n </li>\n\n <li class='sdds-nav__item sdds-nav__item--active'>\n <a class='sdds-nav__item-core ' href='#'>\n <span class='sdds-nav__item-core-text'>Item 2</span>\n </a>\n </li>\n\n <li class='sdds-nav__item sdds-nav__dropdown'>\n <button class='sdds-nav__item-core' onclick='toggleInlineDropdown()'>\n <span class='sdds-nav__item-core-text'>Item 3</span>\n <span class='sdds-nav__dropdown-icon'>\n <sdds-icon class=\"sdds-nav__dropdown-icon-svg\" name=\"chevron_down\" size=\"16px\"></sdds-icon> \n </span>\n </button>\n <ul class='sdds-nav__dropdown-menu'>\n <li class='sdds-nav__dropdown-item'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3 long label...</a></li>\n <li class='sdds-nav__dropdown-item'><button class='sdds-nav__dropdown-item-core'>Sub item 3</button></li>\n <li class='sdds-nav__dropdown-item sdds-nav__dropdown-item--active'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3 long label...</a></li>\n </ul>\n </li>\n </ul>\n\n <ul class='sdds-nav__toolbar-menu'>\n <li class='sdds-nav__item'>\n <a class='sdds-nav__item-core' href='#'>\n <span class='sdds-nav__item-core-text'>Item 4</span>\n </a>\n </li>\n\n <li class='sdds-nav__item sdds-nav__avatar'>\n <button class='sdds-nav__avatar-btn' onclick='toggleAvatarMenu()'>\n <img class=\"sdds-nav__avatar-img\" src='https://www.svgrepo.com/show/170303/avatar.svg' alt='profile photo'/>\n <span class='sdds-nav__avatar-info sdds-nav__avatar-info--mobile'>\n <span class='sdds-nav__avatar-title'>Employee Name</span>\n <span class='sdds-nav__avatar-subtitle'>Company Name</span>\n </span>\n </button>\n\n <ul class='sdds-nav__avatar-menu'>\n <li class='sdds-nav__avatar-item sdds-nav__avatar-item--large'>\n <span class='sdds-nav__avatar-info'>\n <span class='sdds-nav__avatar-title'>Employee Name</span>\n <span class='sdds-nav__avatar-subtitle'>Company Name</span>\n </span>\n </li>\n <li class='sdds-nav__avatar-item'>\n <a href='' class='sdds-nav__avatar-item-core'>Link 1</a>\n </li>\n <li class='sdds-nav__avatar-item'>\n <button class='sdds-nav__avatar-item-core'>Logout</button>\n </li>\n </ul>\n </li>\n </ul>\n </div>\n\n <div class='sdds-nav__right'>\n <div class='sdds-nav__item sdds-nav__app-launcher'>\n <button class='sdds-nav__app-launcher-btn' onclick='toggleAppLauncher()'>\n <sdds-icon class=\"sdds-nav__app-launcher-btn-svg\" name=\"bento\" size=\"20px\" ></sdds-icon> \n </button>\n <ul class='sdds-nav__app-launcher-menu'>\n <li class='sdds-nav__app-launcher-item sdds-nav__app-launcher-item--category'>\n <p class='sdds-nav__app-launcher-category-title'>Category 1</p>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 1</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 2</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 3</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 4</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 5</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 6</a>\n </li>\n <li class='sdds-nav__app-launcher-item sdds-nav__app-launcher-item--category'>\n <p class='sdds-nav__app-launcher-category-title'>Category 2</p>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 1</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 2</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 3</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 4</a>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <button class='sdds-nav__app-launcher-item-core'>Application 5 BTN</button>\n </li>\n <li class='sdds-nav__app-launcher-item'>\n <a href='' class='sdds-nav__app-launcher-item-core'>Application 6</a>\n </li>\n </ul>\n </div>\n <a class='sdds-nav__item sdds-nav__app-logo' href='#'></a>\n </div>\n </nav>\n\n <script>\n /* Note: Code below is used only for inspiration and presentation purposes in Storybook */\n toggleAvatarMenu = () => {\n document.getElementsByClassName(\"sdds-nav\")[0].classList.toggle(\"sdds-nav__avatar--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.remove(\"sdds-nav__dropdown--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n }\n toggleMobileMenu = () => {\n document.getElementsByClassName(\"sdds-nav\")[0].classList.toggle(\"sdds-nav__mob-menu--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__avatar--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.remove(\"sdds-nav__dropdown--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n }\n toggleAppLauncher = () => {\n document.getElementsByClassName(\"sdds-nav\")[0].classList.toggle(\"sdds-nav__app-launcher--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.remove(\"sdds-nav__dropdown--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__avatar--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n }\n toggleInlineDropdown = () => {\n document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.toggle(\"sdds-nav__dropdown--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__avatar--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n\n }\n\n toggleSearchbar = () => {\n document.getElementsByClassName(\"sdds-nav\")[0].classList.toggle(\"sdds-nav__searchbar--opened\");\n document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.remove(\"sdds-nav__dropdown--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__avatar--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n }\n\n closeDropdownsFromOverlay = () => {\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n\n }\n </script>\n `,\n );\n\nexport const AllMenus = AllMenusTemplate.bind({});\n"]}

package/dist/collection/components/header/header-default.stories.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"header-default.stories.js","sourceRoot":"","sources":["../../../src/components/header/header-default.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,eAAe;EACb,KAAK,EAAE,mBAAmB;EAC1B,UAAU,EAAE;IACV,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,YAAY;IACpB,IAAI,EAAE;MACJ,MAAM,EAAE;QACN,KAAK,EAAE,QAAQ;OAChB;KACF;IACD,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,QAAQ,EAAE;MACR,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,qCAAqC;MAClD,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;GACF;EACD,IAAI,EAAE;IACJ,QAAQ,EAAE,aAAa;GACxB;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAChC,iBAAiB,CACf;;;sCAGkC,QAAQ;;;;;;GAM3C,CACA,CAAC;AAEJ,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import readme from './readme.md';\nimport { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n title: 'Components/Header',\n parameters: {\n notes: readme,\n layout: 'fullscreen',\n docs: {\n source: {\n state: 'closed',\n },\n },\n design: [\n {\n name: 'Figma',\n type: 'figma',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',\n },\n {\n name: 'Link',\n type: 'link',\n url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',\n },\n ],\n },\n argTypes: {\n siteName: {\n name: 'Site name',\n description: 'Sets a custom title for the header.',\n control: {\n type: 'text',\n },\n },\n },\n args: {\n siteName: 'Application',\n },\n};\n\nconst Template = ({ siteName }) =>\n formatHtmlPreview(\n `\n <nav class='sdds-nav'>\n <div class='sdds-nav__left'>\n <div class='sdds-nav__app-name'>${siteName}</div>\n </div>\n <div class='sdds-nav__right'>\n <a class='sdds-nav__item sdds-nav__app-logo' href='#'></a>\n </div>\n</nav>\n `,\n );\n\nexport const Default = Template.bind({});\n"]}