@mozaic-ds/web-components 0.4.1-beta.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (173) hide show
  1. package/package.json +1 -1
  2. package/public/ClickOutside-63071e7a.js +15 -1
  3. package/public/ClickOutside-63071e7a.js.map +1 -1
  4. package/public/DataTableDefaultAction.nested-4da4dc44.js +759 -1
  5. package/public/DataTableDefaultAction.nested-4da4dc44.js.map +1 -1
  6. package/public/DataTableUtilities-60220c78.js +370 -1
  7. package/public/DataTableUtilities-60220c78.js.map +1 -1
  8. package/public/EventForward-8492ff62.js +109 -1
  9. package/public/EventForward-8492ff62.js.map +1 -1
  10. package/public/EventHandler-02058705.js +15 -1
  11. package/public/EventHandler-02058705.js.map +1 -1
  12. package/public/array-5b770a93.js +13 -1
  13. package/public/array-5b770a93.js.map +1 -1
  14. package/public/axis-fbc0f7b5.js +174 -1
  15. package/public/axis-fbc0f7b5.js.map +1 -1
  16. package/public/band-d7a07d2c.js +186 -1
  17. package/public/band-d7a07d2c.js.map +1 -1
  18. package/public/components/accordion/Accordion.js +365 -1
  19. package/public/components/accordion/Accordion.js.map +1 -1
  20. package/public/components/autocomplete/Autocomplete.js +1515 -1
  21. package/public/components/autocomplete/Autocomplete.js.map +1 -1
  22. package/public/components/badge/Badge.js +155 -1
  23. package/public/components/badge/Badge.js.map +1 -1
  24. package/public/components/badge/Badge.nested.js +101 -1
  25. package/public/components/badge/Badge.nested.js.map +1 -1
  26. package/public/components/breadcrumb/Breadcrumb.js +372 -1
  27. package/public/components/breadcrumb/Breadcrumb.js.map +1 -1
  28. package/public/components/breadcrumb/Breadcrumb.nested.js +319 -1
  29. package/public/components/breadcrumb/Breadcrumb.nested.js.map +1 -1
  30. package/public/components/button/Button.js +1138 -1
  31. package/public/components/button/Button.js.map +1 -1
  32. package/public/components/card/Card.js +369 -1
  33. package/public/components/card/Card.js.map +1 -1
  34. package/public/components/chart/BarChart.js +582 -1
  35. package/public/components/chart/BarChart.js.map +1 -1
  36. package/public/components/chart/Donut.js +1189 -1
  37. package/public/components/chart/Donut.js.map +1 -1
  38. package/public/components/chart/GroupedBarChart.js +750 -1
  39. package/public/components/chart/GroupedBarChart.js.map +1 -1
  40. package/public/components/chart/LineChart.js +1731 -1
  41. package/public/components/chart/LineChart.js.map +1 -1
  42. package/public/components/chart/Radar.js +729 -1
  43. package/public/components/chart/Radar.js.map +1 -1
  44. package/public/components/chart/StackedBarChart.js +745 -1
  45. package/public/components/chart/StackedBarChart.js.map +1 -1
  46. package/public/components/checkbox/Checkbox.js +307 -1
  47. package/public/components/checkbox/Checkbox.js.map +1 -1
  48. package/public/components/checkboxgroup/checkboxGroup.js +404 -1
  49. package/public/components/checkboxgroup/checkboxGroup.js.map +1 -1
  50. package/public/components/datatable/DataTable.js +3064 -1
  51. package/public/components/datatable/DataTable.js.map +1 -1
  52. package/public/components/datatable/DataTableDefaultAction.nested.js +4 -1
  53. package/public/components/datatable/DataTableDefaultAction.nested.js.map +1 -1
  54. package/public/components/datatable/DataTableDefaultEdtion.nested.js +164 -1
  55. package/public/components/datatable/DataTableDefaultEdtion.nested.js.map +1 -1
  56. package/public/components/datatable/DataTableDefaultFilterTags.nested.js +380 -1
  57. package/public/components/datatable/DataTableDefaultFilterTags.nested.js.map +1 -1
  58. package/public/components/datatable/DataTableDefaultSelection.nested.js +424 -1
  59. package/public/components/datatable/DataTableDefaultSelection.nested.js.map +1 -1
  60. package/public/components/datatable/DataTableDefaultSelectionLabel.nested.js +263 -1
  61. package/public/components/datatable/DataTableDefaultSelectionLabel.nested.js.map +1 -1
  62. package/public/components/datatable/DataTableFooter.nested.js +637 -1
  63. package/public/components/datatable/DataTableFooter.nested.js.map +1 -1
  64. package/public/components/dropdown/Dropdown.js +1426 -1
  65. package/public/components/dropdown/Dropdown.js.map +1 -1
  66. package/public/components/field/Field.js +375 -1
  67. package/public/components/field/Field.js.map +1 -1
  68. package/public/components/fileuploader/FileUploader.js +555 -1
  69. package/public/components/fileuploader/FileUploader.js.map +1 -1
  70. package/public/components/fileuploader/ResultFile.nested.js +265 -1
  71. package/public/components/fileuploader/ResultFile.nested.js.map +1 -1
  72. package/public/components/flag/Flag.js +174 -1
  73. package/public/components/flag/Flag.js.map +1 -1
  74. package/public/components/header/Header.js +903 -1
  75. package/public/components/header/Header.js.map +1 -1
  76. package/public/components/hero/Hero.js +271 -1
  77. package/public/components/hero/Hero.js.map +1 -1
  78. package/public/components/layer/Layer.js +453 -1
  79. package/public/components/layer/Layer.js.map +1 -1
  80. package/public/components/link/Link.js +380 -1
  81. package/public/components/link/Link.js.map +1 -1
  82. package/public/components/listbox/Listbox.js +595 -1
  83. package/public/components/listbox/Listbox.js.map +1 -1
  84. package/public/components/listbox/Listbox.nested.js +629 -1
  85. package/public/components/listbox/Listbox.nested.js.map +1 -1
  86. package/public/components/loader/Loader.js +246 -1
  87. package/public/components/loader/Loader.js.map +1 -1
  88. package/public/components/loader/Loader.nested.js +176 -1
  89. package/public/components/loader/Loader.nested.js.map +1 -1
  90. package/public/components/modal/Modal.js +395 -1
  91. package/public/components/modal/Modal.js.map +1 -1
  92. package/public/components/notification/Notification.js +458 -1
  93. package/public/components/notification/Notification.js.map +1 -1
  94. package/public/components/optionbutton/OptionButton.js +316 -1
  95. package/public/components/optionbutton/OptionButton.js.map +1 -1
  96. package/public/components/overlay/Overlay.js +104 -1
  97. package/public/components/overlay/Overlay.js.map +1 -1
  98. package/public/components/overlay/OverlayLoader.js +151 -1
  99. package/public/components/overlay/OverlayLoader.js.map +1 -1
  100. package/public/components/pagination/Pagination.js +613 -1
  101. package/public/components/pagination/Pagination.js.map +1 -1
  102. package/public/components/passwordinput/PasswordInput.js +291 -1
  103. package/public/components/passwordinput/PasswordInput.js.map +1 -1
  104. package/public/components/phonenumber/PhoneNumber.js +6894 -1
  105. package/public/components/phonenumber/PhoneNumber.js.map +1 -1
  106. package/public/components/phonenumber/PhoneNumber.svelte +72 -9
  107. package/public/components/price/Price.js +768 -1
  108. package/public/components/price/Price.js.map +1 -1
  109. package/public/components/progressbar/ProgressBar.js +278 -1
  110. package/public/components/progressbar/ProgressBar.js.map +1 -1
  111. package/public/components/quantityselector/QuantitySelector.js +333 -1
  112. package/public/components/quantityselector/QuantitySelector.js.map +1 -1
  113. package/public/components/radio/Radio.js +273 -1
  114. package/public/components/radio/Radio.js.map +1 -1
  115. package/public/components/radiogroup/RadioGroup.js +414 -1
  116. package/public/components/radiogroup/RadioGroup.js.map +1 -1
  117. package/public/components/ratings/StarsInput.js +292 -1
  118. package/public/components/ratings/StarsInput.js.map +1 -1
  119. package/public/components/ratings/StarsResult.js +246 -1
  120. package/public/components/ratings/StarsResult.js.map +1 -1
  121. package/public/components/select/Select.js +451 -1
  122. package/public/components/select/Select.js.map +1 -1
  123. package/public/components/sidebar/Sidebar.js +784 -1
  124. package/public/components/sidebar/Sidebar.js.map +1 -1
  125. package/public/components/sidebar/sidebar-feature-group.nested.js +594 -1
  126. package/public/components/sidebar/sidebar-feature-group.nested.js.map +1 -1
  127. package/public/components/sidebar/sidebar-feature.nested.js +402 -1
  128. package/public/components/sidebar/sidebar-feature.nested.js.map +1 -1
  129. package/public/components/sidebar/sidebar-section.nested.js +394 -1
  130. package/public/components/sidebar/sidebar-section.nested.js.map +1 -1
  131. package/public/components/sidebar/sidebar-segment.nested.js +200 -1
  132. package/public/components/sidebar/sidebar-segment.nested.js.map +1 -1
  133. package/public/components/sidebar/sidebar-separator.nested.js +49 -1
  134. package/public/components/sidebar/sidebar-separator.nested.js.map +1 -1
  135. package/public/components/sidebar/sidebar-sub-features.nested.js +312 -1
  136. package/public/components/sidebar/sidebar-sub-features.nested.js.map +1 -1
  137. package/public/components/sidebar/sidebar-user.nested.js +733 -1
  138. package/public/components/sidebar/sidebar-user.nested.js.map +1 -1
  139. package/public/components/stepper/Stepper.js +371 -1
  140. package/public/components/stepper/Stepper.js.map +1 -1
  141. package/public/components/tabs/Tabs.js +615 -1
  142. package/public/components/tabs/Tabs.js.map +1 -1
  143. package/public/components/tabs/Tabs.nested.js +472 -1
  144. package/public/components/tabs/Tabs.nested.js.map +1 -1
  145. package/public/components/tag/Tag.js +665 -1
  146. package/public/components/tag/Tag.js.map +1 -1
  147. package/public/components/tag/Tag.nested.js +554 -1
  148. package/public/components/tag/Tag.nested.js.map +1 -1
  149. package/public/components/taglist/TagList.js +475 -1
  150. package/public/components/taglist/TagList.js.map +1 -1
  151. package/public/components/textarea/Textarea.js +303 -1
  152. package/public/components/textarea/Textarea.js.map +1 -1
  153. package/public/components/textinput/Textinput.js +497 -1
  154. package/public/components/textinput/Textinput.js.map +1 -1
  155. package/public/components/textinput/Textinput.nested.js +320 -1
  156. package/public/components/textinput/Textinput.nested.js.map +1 -1
  157. package/public/components/toggle/Toggle.js +278 -1
  158. package/public/components/toggle/Toggle.js.map +1 -1
  159. package/public/components/tooltip/Tooltip.js +173 -1
  160. package/public/components/tooltip/Tooltip.js.map +1 -1
  161. package/public/index-c33b3772.js +873 -1
  162. package/public/index-c33b3772.js.map +1 -1
  163. package/public/linear-f46d7e9e.js +700 -1
  164. package/public/linear-f46d7e9e.js.map +1 -1
  165. package/public/path-1b5da959.js +186 -1
  166. package/public/path-1b5da959.js.map +1 -1
  167. package/public/sidebar-service-275bf9ef.js +129 -1
  168. package/public/sidebar-service-275bf9ef.js.map +1 -1
  169. package/public/symbol-b05a6e2b.js +169 -1
  170. package/public/symbol-b05a6e2b.js.map +1 -1
  171. package/public/transform-15d69d5d.js +2743 -1
  172. package/public/transform-15d69d5d.js.map +1 -1
  173. package/public/utilities/stories/phonenumber/PhoneNumber.stories.d.ts.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"sidebar-user.nested.js","sources":["../../../src/components/sidebar/sidebar-user.nested.svelte"],"sourcesContent":["<svelte:options />\n\n<script lang=\"ts\">\n import {\n isSidebarOpen,\n selectFeature,\n toggleSidebar,\n } from './sidebar-service';\n import type { User, Feature, A11yLabels } from './sidebar.types';\n import FeatureComponent from './sidebar-feature.nested.svelte';\n\n export let user: User;\n export let data: Feature[];\n export let a11yLabels: A11yLabels;\n\n let content: HTMLElement;\n let isExpanded = false;\n\n $: updateContentCSS(isExpanded, $isSidebarOpen);\n\n // Update the CSS programatically to have a nice animation on height between 0px and 'auto'\n function updateContentCSS(isExpanded: boolean, isOpen: boolean): void {\n if (content) {\n content.style.height = '';\n content.style.transition = 'none';\n const startHeight = window.getComputedStyle(content).height;\n\n content.classList.add(isOpen && isExpanded ? 'is-open' : 'is-close');\n content.classList.remove(isOpen && isExpanded ? 'is-close' : 'is-open');\n\n const height = window.getComputedStyle(content).height;\n content.style.height = startHeight;\n\n // wait until the next frame so that everything has time to update before starting the transition\n requestAnimationFrame(() => {\n content.style.transition = '';\n requestAnimationFrame(() => {\n content.style.height = height;\n });\n });\n\n // Clear the saved height values after the transition\n const handler = () => {\n content.style.height = '';\n content.removeEventListener('transitionend', handler);\n };\n\n content.addEventListener('transitionend', handler);\n }\n }\n\n function toggle(): void {\n if (!$isSidebarOpen) {\n toggleSidebar(true);\n isExpanded = true;\n } else {\n isExpanded = !isExpanded;\n }\n }\n\n function capitalizeTheFirstLetterOfEachWord(words: string): string {\n let separateWord: string[] = words.toLowerCase().split(' ');\n for (let i = 0; i < separateWord.length; i++) {\n separateWord[i] =\n separateWord[i].charAt(0).toUpperCase() + separateWord[i].substring(1);\n }\n return separateWord.join(' ');\n }\n\n function handleClick(feature: Feature) {\n if (!feature.disabled) {\n selectFeature(feature.code);\n }\n }\n</script>\n\n{#if user}\n <!-- svelte-ignore a11y-click-events-have-key-events -->\n <div\n class=\"mc-sidebar-user {$isSidebarOpen ? 'is-open' : 'is-close'}\"\n on:click={toggle}\n >\n <button\n aria-expanded={$isSidebarOpen && isExpanded}\n class=\"mc-sidebar-user__header\"\n aria-label={$isSidebarOpen && isExpanded\n ? a11yLabels?.['close-user'] || 'Close the user sub menu'\n : a11yLabels?.['open-user'] || 'Open the user sub menu'}\n aria-controls=\"user-content\"\n >\n <span class=\"mc-sidebar-user__header__picture\">\n {#if user.imageBase64}\n <img\n class=\"base64\"\n style=\"display:block; width:auto; height:48px; max-width:48px;\"\n aria-hidden\n alt=\"User Picture\"\n src=\"data:image/png;base64, {user.imageBase64}\"\n />\n {:else}\n <svg\n class=\"mc-sidebar-user__icon\"\n width=\"24px\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n ><path\n d=\"M12 12.76a5.38 5.38 0 115.38-5.38A5.39 5.39 0 0112 12.76zM12 4a3.38 3.38 0 103.38 3.38A3.39 3.39 0 0012 4zM16.48 13.58a1 1 0 00-.81.11 7.3 7.3 0 01-7.34 0 1 1 0 00-.81-.11l-2.81.87a1 1 0 00-.71 1V21a1 1 0 001 1h14a1 1 0 001-1v-5.59a1 1 0 00-.71-1zM18 20H6v-3.86l1.75-.53a9.36 9.36 0 008.5 0l1.75.53z\"\n /></svg\n >\n {/if}\n </span>\n {#if $isSidebarOpen}\n <p class=\"mc-sidebar-user__header__information\">\n <span class=\"mc-sidebar-user__header__information__identity\">\n {user?.firstName || ''}\n {user?.lastName || ''}\n </span>\n {#if user?.title}\n <span class=\"mc-sidebar-user__header__information__title\">\n {capitalizeTheFirstLetterOfEachWord(user.title)}\n </span>\n {/if}\n </p>\n {#if data?.length}\n <span class=\"mc-sidebar-user__header__information__icon\">\n {#if $isSidebarOpen && !isExpanded}\n <svg\n class=\"mc-sidebar-user__icon\"\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n ><path\n d=\"M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z\"\n /></svg\n >\n {:else}\n <svg\n width=\"16px\"\n height=\"16px\"\n class=\"mc-sidebar-user__icon\"\n viewBox=\"0 0 16 16\"\n ><path d=\"M12 9H4a1 1 0 010-2h8a1 1 0 010 2z\" /></svg\n >\n {/if}\n </span>\n {/if}\n {/if}\n </button>\n {#if data?.length}\n <ul\n aria-hidden={!$isSidebarOpen || !isExpanded}\n class=\"mc-sidebar-user__content is-close\"\n id=\"user-content\"\n bind:this={content}\n >\n {#each data as feature}\n <!-- svelte-ignore a11y-click-events-have-key-events -->\n <li on:click|stopPropagation={() => handleClick(feature)}>\n <FeatureComponent {feature} {a11yLabels} />\n </li>\n {/each}\n </ul>\n {/if}\n </div>\n{/if}\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import './sidebar-variables';\n\n .mc-sidebar-user {\n left: 0;\n right: 0;\n bottom: 0;\n position: absolute;\n background: $color-sidebar-user-background;\n\n &__header {\n display: flex;\n align-items: center;\n background: none;\n border: none;\n color: $color-sidebar-text-color;\n font-size: inherit;\n font-family: inherit;\n text-align: initial;\n margin: 0;\n width: 100%;\n overflow: hidden;\n\n &:focus-visible {\n box-shadow: none;\n border: none;\n border-radius: 12px;\n outline: 1px solid #0b96cc;\n outline-offset: -5px;\n }\n\n &:hover {\n cursor: pointer;\n\n .mc-sidebar-user__header__information__icon {\n background: $color-sidebar-feature-hover-background;\n }\n }\n\n &__picture {\n display: flex;\n align-items: center;\n justify-content: center;\n background: $color-grey;\n border-radius: 24px;\n width: 48px;\n min-width: 48px;\n height: 48px;\n overflow: hidden;\n img {\n display: block;\n }\n }\n\n &__information {\n justify-content: space-around;\n display: flex;\n flex-direction: column;\n flex: 1;\n margin: 0;\n margin-left: 8px;\n height: 40px;\n &__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n border-radius: 4px;\n }\n\n &__identity {\n font-size: 16px;\n font-weight: bold;\n }\n\n &__title,\n &__identity {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 176px;\n }\n }\n }\n\n &__icon {\n fill: $color-sidebar-icon;\n }\n\n &__content {\n list-style-type: none;\n padding: 0;\n overflow: hidden;\n margin: -8px 0px 24px 0px;\n @include transition(all 300ms ease-in-out);\n\n &.is-close {\n height: 0;\n margin: 0;\n }\n\n .is-open {\n height: auto;\n }\n }\n\n &.is-close {\n .mc-sidebar-user__header {\n @include transition(padding 300ms ease-in-out);\n padding: 12px 8px;\n margin: 8px 0;\n }\n }\n\n &.is-open {\n .mc-sidebar-user__header {\n @include transition(padding 300ms ease-in-out);\n padding: 12px 24px 12px 32px;\n margin: 8px 0;\n }\n }\n }\n</style>\n"],"names":["ctx","imageBase64","create_if_block_6","create_if_block_2","if_block2","length","create_if_block_1","attr","button","button_aria_expanded_value","button_aria_label_value","insert","target","div","anchor","append","span","current","dirty","svg","path","src_url_equal","img","src","img_src_value","firstName","lastName","if_block0","title","create_if_block_5","if_block1","create_if_block_3","p","set_data","t0","t0_value","t2","t2_value","capitalizeTheFirstLetterOfEachWord","t","t_value","create_if_block_4","i","ul","ul_aria_hidden_value","each_blocks","li","create_if_block","words","separateWord","toLowerCase","split","charAt","toUpperCase","substring","join","content","user","$$props","data","a11yLabels","isExpanded","handleClick","feature","disabled","selectFeature","code","isOpen","$$invalidate","style","height","transition","startHeight","window","getComputedStyle","classList","add","remove","requestAnimationFrame","handler","removeEventListener","addEventListener","updateContentCSS","$isSidebarOpen","toggleSidebar","$$value"],"mappings":"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"}
1
+ {"version":3,"file":"sidebar-user.nested.js","sources":["../../../src/components/sidebar/sidebar-user.nested.svelte"],"sourcesContent":["<svelte:options />\n\n<script lang=\"ts\">\n import {\n isSidebarOpen,\n selectFeature,\n toggleSidebar,\n } from './sidebar-service';\n import type { User, Feature, A11yLabels } from './sidebar.types';\n import FeatureComponent from './sidebar-feature.nested.svelte';\n\n export let user: User;\n export let data: Feature[];\n export let a11yLabels: A11yLabels;\n\n let content: HTMLElement;\n let isExpanded = false;\n\n $: updateContentCSS(isExpanded, $isSidebarOpen);\n\n // Update the CSS programatically to have a nice animation on height between 0px and 'auto'\n function updateContentCSS(isExpanded: boolean, isOpen: boolean): void {\n if (content) {\n content.style.height = '';\n content.style.transition = 'none';\n const startHeight = window.getComputedStyle(content).height;\n\n content.classList.add(isOpen && isExpanded ? 'is-open' : 'is-close');\n content.classList.remove(isOpen && isExpanded ? 'is-close' : 'is-open');\n\n const height = window.getComputedStyle(content).height;\n content.style.height = startHeight;\n\n // wait until the next frame so that everything has time to update before starting the transition\n requestAnimationFrame(() => {\n content.style.transition = '';\n requestAnimationFrame(() => {\n content.style.height = height;\n });\n });\n\n // Clear the saved height values after the transition\n const handler = () => {\n content.style.height = '';\n content.removeEventListener('transitionend', handler);\n };\n\n content.addEventListener('transitionend', handler);\n }\n }\n\n function toggle(): void {\n if (!$isSidebarOpen) {\n toggleSidebar(true);\n isExpanded = true;\n } else {\n isExpanded = !isExpanded;\n }\n }\n\n function capitalizeTheFirstLetterOfEachWord(words: string): string {\n let separateWord: string[] = words.toLowerCase().split(' ');\n for (let i = 0; i < separateWord.length; i++) {\n separateWord[i] =\n separateWord[i].charAt(0).toUpperCase() + separateWord[i].substring(1);\n }\n return separateWord.join(' ');\n }\n\n function handleClick(feature: Feature) {\n if (!feature.disabled) {\n selectFeature(feature.code);\n }\n }\n</script>\n\n{#if user}\n <!-- svelte-ignore a11y-click-events-have-key-events -->\n <div\n class=\"mc-sidebar-user {$isSidebarOpen ? 'is-open' : 'is-close'}\"\n on:click={toggle}\n >\n <button\n aria-expanded={$isSidebarOpen && isExpanded}\n class=\"mc-sidebar-user__header\"\n aria-label={$isSidebarOpen && isExpanded\n ? a11yLabels?.['close-user'] || 'Close the user sub menu'\n : a11yLabels?.['open-user'] || 'Open the user sub menu'}\n aria-controls=\"user-content\"\n >\n <span class=\"mc-sidebar-user__header__picture\">\n {#if user.imageBase64}\n <img\n class=\"base64\"\n style=\"display:block; width:auto; height:48px; max-width:48px;\"\n aria-hidden\n alt=\"User Picture\"\n src=\"data:image/png;base64, {user.imageBase64}\"\n />\n {:else}\n <svg\n class=\"mc-sidebar-user__icon\"\n width=\"24px\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n ><path\n d=\"M12 12.76a5.38 5.38 0 115.38-5.38A5.39 5.39 0 0112 12.76zM12 4a3.38 3.38 0 103.38 3.38A3.39 3.39 0 0012 4zM16.48 13.58a1 1 0 00-.81.11 7.3 7.3 0 01-7.34 0 1 1 0 00-.81-.11l-2.81.87a1 1 0 00-.71 1V21a1 1 0 001 1h14a1 1 0 001-1v-5.59a1 1 0 00-.71-1zM18 20H6v-3.86l1.75-.53a9.36 9.36 0 008.5 0l1.75.53z\"\n /></svg\n >\n {/if}\n </span>\n {#if $isSidebarOpen}\n <p class=\"mc-sidebar-user__header__information\">\n <span class=\"mc-sidebar-user__header__information__identity\">\n {user?.firstName || ''}\n {user?.lastName || ''}\n </span>\n {#if user?.title}\n <span class=\"mc-sidebar-user__header__information__title\">\n {capitalizeTheFirstLetterOfEachWord(user.title)}\n </span>\n {/if}\n </p>\n {#if data?.length}\n <span class=\"mc-sidebar-user__header__information__icon\">\n {#if $isSidebarOpen && !isExpanded}\n <svg\n class=\"mc-sidebar-user__icon\"\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n ><path\n d=\"M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z\"\n /></svg\n >\n {:else}\n <svg\n width=\"16px\"\n height=\"16px\"\n class=\"mc-sidebar-user__icon\"\n viewBox=\"0 0 16 16\"\n ><path d=\"M12 9H4a1 1 0 010-2h8a1 1 0 010 2z\" /></svg\n >\n {/if}\n </span>\n {/if}\n {/if}\n </button>\n {#if data?.length}\n <ul\n aria-hidden={!$isSidebarOpen || !isExpanded}\n class=\"mc-sidebar-user__content is-close\"\n id=\"user-content\"\n bind:this={content}\n >\n {#each data as feature}\n <!-- svelte-ignore a11y-click-events-have-key-events -->\n <li on:click|stopPropagation={() => handleClick(feature)}>\n <FeatureComponent {feature} {a11yLabels} />\n </li>\n {/each}\n </ul>\n {/if}\n </div>\n{/if}\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import './sidebar-variables';\n\n .mc-sidebar-user {\n left: 0;\n right: 0;\n bottom: 0;\n position: absolute;\n background: $color-sidebar-user-background;\n\n &__header {\n display: flex;\n align-items: center;\n background: none;\n border: none;\n color: $color-sidebar-text-color;\n font-size: inherit;\n font-family: inherit;\n text-align: initial;\n margin: 0;\n width: 100%;\n overflow: hidden;\n\n &:focus-visible {\n box-shadow: none;\n border: none;\n border-radius: 12px;\n outline: 1px solid #0b96cc;\n outline-offset: -5px;\n }\n\n &:hover {\n cursor: pointer;\n\n .mc-sidebar-user__header__information__icon {\n background: $color-sidebar-feature-hover-background;\n }\n }\n\n &__picture {\n display: flex;\n align-items: center;\n justify-content: center;\n background: $color-grey;\n border-radius: 24px;\n width: 48px;\n min-width: 48px;\n height: 48px;\n overflow: hidden;\n img {\n display: block;\n }\n }\n\n &__information {\n justify-content: space-around;\n display: flex;\n flex-direction: column;\n flex: 1;\n margin: 0;\n margin-left: 8px;\n height: 40px;\n &__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n border-radius: 4px;\n }\n\n &__identity {\n font-size: 16px;\n font-weight: bold;\n }\n\n &__title,\n &__identity {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 176px;\n }\n }\n }\n\n &__icon {\n fill: $color-sidebar-icon;\n }\n\n &__content {\n list-style-type: none;\n padding: 0;\n overflow: hidden;\n margin: -8px 0px 24px 0px;\n @include transition(all 300ms ease-in-out);\n\n &.is-close {\n height: 0;\n margin: 0;\n }\n\n .is-open {\n height: auto;\n }\n }\n\n &.is-close {\n .mc-sidebar-user__header {\n @include transition(padding 300ms ease-in-out);\n padding: 12px 8px;\n margin: 8px 0;\n }\n }\n\n &.is-open {\n .mc-sidebar-user__header {\n @include transition(padding 300ms ease-in-out);\n padding: 12px 24px 12px 32px;\n margin: 8px 0;\n }\n }\n }\n</style>\n"],"names":[],"mappings":"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"}
@@ -1,2 +1,372 @@
1
- import{S as e,i as t,a as r,b as i,f as s,s as p,c,e as o,n as a,g as n,h as m,j as l,m as d,o as _,J as b,p as f,q as h,d as u,t as x,l as g,k}from"../../index-c33b3772.js";import{E as w}from"../../EventHandler-02058705.js";function v(e,t,r){const i=e.slice();return i[10]=t[r],i[12]=r,i}function y(e){let t,r,s=e[12]+1+"";return{c(){t=o("span"),r=x(s)},m(e,s){i(e,t,s),l(t,r)},d(e){e&&_(t)}}}function $(e){let t;return{c(){t=o("div"),t.innerHTML='<navigation-notification-available-16px name="NotificationAvailable16" size="100%"></navigation-notification-available-16px>',n(t,"class","mc-stepper__icon")},m(e,r){i(e,t,r)},d(e){e&&_(t)}}}function z(e){let t,r,s,p,c,a,m,d,b,f,h,w,v,z,C=e[4](e[12],e[2])+"",j=e[10].label+"";function E(e,t){return 4&t&&(s=null),null==s&&(s=!!e[3](e[12],e[2])),s?$:e[10].isCurrent?y:void 0}let L=E(e,-1),A=L&&L(e);function D(){return e[7](e[10])}return{c(){t=o("li"),r=o("div"),A&&A.c(),p=u(),c=o("div"),a=o("span"),m=x(C),d=u(),b=o("span"),f=x(j),h=u(),n(r,"class","mc-stepper__indicator"),n(r,"aria-hidden","true"),n(a,"class","mc-stepper__title"),n(b,"class","mc-stepper__label"),n(c,"class","mc-stepper__detail"),n(t,"class",w="mc-stepper__item "+(e[10].isCurrent?"mc-stepper__item--current":"")+" "+(e[3](e[12],e[2])?"mc-stepper__item--validated":""))},m(e,s){i(e,t,s),l(t,r),A&&A.m(r,null),l(t,p),l(t,c),l(c,a),l(a,m),l(c,d),l(c,b),l(b,f),l(t,h),v||(z=g(t,"click",D),v=!0)},p(i,s){L!==(L=E(e=i,s))&&(A&&A.d(1),A=L&&L(e),A&&(A.c(),A.m(r,null))),4&s&&C!==(C=e[4](e[12],e[2])+"")&&k(m,C),4&s&&j!==(j=e[10].label+"")&&k(f,j),4&s&&w!==(w="mc-stepper__item "+(e[10].isCurrent?"mc-stepper__item--current":"")+" "+(e[3](e[12],e[2])?"mc-stepper__item--validated":""))&&n(t,"class",w)},d(e){e&&_(t),A&&A.d(),v=!1,z()}}}function C(e){let t,r,s,p=e[2],f=[];for(let t=0;t<p.length;t+=1)f[t]=z(v(e,p,t));let h=[{class:s="mc-stepper "+(e[0]?"mc-stepper--compact":"")+" "+(e[2].length>3?"mc-stepper--shrinked":"")},{"aria-label":"accessibilityLabels.stepperDescription"},e[1]],u={};for(let e=0;e<h.length;e+=1)u=c(u,h[e]);return{c(){t=o("nav"),r=o("ol");for(let e=0;e<f.length;e+=1)f[e].c();this.c=a,n(r,"class","mc-stepper__list"),m(t,u)},m(e,s){i(e,t,s),l(t,r);for(let e=0;e<f.length;e+=1)f[e]&&f[e].m(r,null)},p(e,[i]){if(60&i){let t;for(p=e[2],t=0;t<p.length;t+=1){const s=v(e,p,t);f[t]?f[t].p(s,i):(f[t]=z(s),f[t].c(),f[t].m(r,null))}for(;t<f.length;t+=1)f[t].d(1);f.length=p.length}m(t,u=d(h,[5&i&&s!==(s="mc-stepper "+(e[0]?"mc-stepper--compact":"")+" "+(e[2].length>3?"mc-stepper--shrinked":""))&&{class:s},{"aria-label":"accessibilityLabels.stepperDescription"},2&i&&e[1]]))},i:a,o:a,d(e){e&&_(t),b(f,e)}}}function j(e,t,r){let i,s;const p=["steps","compact"];let o=f(t,p),{steps:a}=t,{compact:n=!1}=t,m=new w;function l(e){m.dispatch("step-changed",e)}return e.$$set=e=>{t=c(c({},t),h(e)),r(9,o=f(t,p)),"steps"in e&&r(6,a=e.steps),"compact"in e&&r(0,n=e.compact)},e.$$.update=()=>{64&e.$$.dirty&&r(2,i=a?JSON.parse(a):[]),r(1,s=Object.assign({},o)),2&e.$$.dirty&&delete s.class},[n,s,i,function(e,t){return e<t.findIndex((e=>e.isCurrent))},function(e,t){return`${e+1} / ${t.length}`},l,a,e=>l(e)]}class E extends e{constructor(e){super();const c=document.createElement("style");c.textContent='.mc-stepper{width:100%}.mc-stepper__list{display:-webkit-box;display:-ms-flexbox;display:flex;padding-left:0;margin-bottom:0;margin-top:0}.mc-stepper__item,.mc-stepper__link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mc-stepper__item{-webkit-box-flex:1;-ms-flex:1;flex:1;position:relative}.mc-stepper__item::before,.mc-stepper__item::after{background-color:#999999;content:"";height:0.125rem;position:absolute;top:11px;width:calc(50% - 1.25rem);z-index:1}.mc-stepper__item::before{border-top-right-radius:1px;border-bottom-right-radius:1px;left:0}.mc-stepper__item::after{border-top-left-radius:1px;border-bottom-left-radius:1px;right:0}.mc-stepper__item:first-child::before,.mc-stepper__item:last-child::after{content:none}.mc-stepper__item--current .mc-stepper__indicator,.mc-stepper__item--validated .mc-stepper__indicator{border-color:#46a610}.mc-stepper__item--current .mc-stepper__detail,.mc-stepper__item--validated .mc-stepper__detail{font-weight:600}.mc-stepper__item--current::before{background-color:#46a610}.mc-stepper__item--current .mc-stepper__indicator{background-color:#46a610;color:#ffffff}.mc-stepper__item--current .mc-stepper__label{color:#000000}.mc-stepper__item--validated::before,.mc-stepper__item--validated:not(.mc-stepper__item--current)::after{background-color:#46a610}.mc-stepper__link{height:100%;text-decoration:none;width:100%}.mc-stepper__link:hover .mc-stepper__label,.mc-stepper__link:focus .mc-stepper__label{color:#46a610}.mc-stepper__indicator{font-size:0.875rem;line-height:1.1428571429;font-weight:600;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:2px solid #999999;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;height:1.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-bottom:0.5rem;position:relative;width:1.5rem;z-index:2}.mc-stepper__icon{fill:#46a610;max-width:100%}.mc-stepper__detail{font-size:0.875rem;line-height:1.2857142857;color:#666666;text-align:center;width:auto}.mc-stepper__title{display:none;color:#46a610}.mc-stepper--compact .mc-stepper__item{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem}.mc-stepper--compact .mc-stepper__item::before,.mc-stepper--compact .mc-stepper__item::after{bottom:0;border-radius:6px;height:0.25rem;top:auto}.mc-stepper--compact .mc-stepper__item::after{width:100%}.mc-stepper--compact .mc-stepper__item::before{z-index:2;width:calc(var(--current) * 100% / var(--steps))}.mc-stepper--compact .mc-stepper__item:not(.mc-stepper__item--current){display:none}.mc-stepper--compact .mc-stepper__indicator{display:none}.mc-stepper--compact .mc-stepper__detail{text-align:left}.mc-stepper--compact .mc-stepper__title{display:block;margin-bottom:0.25rem}@media screen and (max-width: 679px){.mc-stepper--shrinked .mc-stepper__item{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem}.mc-stepper--shrinked .mc-stepper__item::before,.mc-stepper--shrinked .mc-stepper__item::after{bottom:0;border-radius:6px;height:0.25rem;top:auto}.mc-stepper--shrinked .mc-stepper__item::after{width:100%}.mc-stepper--shrinked .mc-stepper__item::before{z-index:2;width:calc(var(--current) * 100% / var(--steps))}.mc-stepper--shrinked .mc-stepper__item:not(.mc-stepper__item--current){display:none}.mc-stepper--shrinked .mc-stepper__indicator{display:none}.mc-stepper--shrinked .mc-stepper__detail{text-align:left}.mc-stepper--shrinked .mc-stepper__title{display:block;margin-bottom:0.25rem}}',this.shadowRoot.appendChild(c),t(this,{target:this.shadowRoot,props:r(this.attributes),customElement:!0},j,C,p,{steps:6,compact:0},null),e&&(e.target&&i(e.target,this,e.anchor),e.props&&(this.$set(e.props),s()))}static get observedAttributes(){return["steps","compact"]}get steps(){return this.$$.ctx[6]}set steps(e){this.$$set({steps:e}),s()}get compact(){return this.$$.ctx[0]}set compact(e){this.$$set({compact:e}),s()}}export{E as default};
1
+ import { S as SvelteElement, i as init, a as attribute_to_object, b as insert, f as flush, s as safe_not_equal, c as assign, e as element, n as noop, g as attr, h as set_attributes, j as append, m as get_spread_update, o as detach, J as destroy_each, p as compute_rest_props, q as exclude_internal_props, d as space, t as text, l as listen, k as set_data } from '../../index-c33b3772.js';
2
+ import { E as EventHandler } from '../../EventHandler-02058705.js';
3
+
4
+ /* src/components/stepper/Stepper.svelte generated by Svelte v3.58.0 */
5
+
6
+ function get_each_context(ctx, list, i) {
7
+ const child_ctx = ctx.slice();
8
+ child_ctx[10] = list[i];
9
+ child_ctx[12] = i;
10
+ return child_ctx;
11
+ }
12
+
13
+ // (49:35)
14
+ function create_if_block_1(ctx) {
15
+ let span;
16
+ let t_value = /*index*/ ctx[12] + 1 + "";
17
+ let t;
18
+
19
+ return {
20
+ c() {
21
+ span = element("span");
22
+ t = text(t_value);
23
+ },
24
+ m(target, anchor) {
25
+ insert(target, span, anchor);
26
+ append(span, t);
27
+ },
28
+ d(detaching) {
29
+ if (detaching) detach(span);
30
+ }
31
+ };
32
+ }
33
+
34
+ // (42:10) {#if isStepValidated(index, stepsObject)}
35
+ function create_if_block(ctx) {
36
+ let div;
37
+
38
+ return {
39
+ c() {
40
+ div = element("div");
41
+ div.innerHTML = `<navigation-notification-available-16px name="NotificationAvailable16" size="100%"></navigation-notification-available-16px>`;
42
+ attr(div, "class", "mc-stepper__icon");
43
+ },
44
+ m(target, anchor) {
45
+ insert(target, div, anchor);
46
+ },
47
+ d(detaching) {
48
+ if (detaching) detach(div);
49
+ }
50
+ };
51
+ }
52
+
53
+ // (32:4) {#each stepsObject as step, index}
54
+ function create_each_block(ctx) {
55
+ let li;
56
+ let div0;
57
+ let show_if;
58
+ let t0;
59
+ let div1;
60
+ let span0;
61
+ let t1_value = /*getStepNumber*/ ctx[4](/*index*/ ctx[12], /*stepsObject*/ ctx[2]) + "";
62
+ let t1;
63
+ let t2;
64
+ let span1;
65
+ let t3_value = /*step*/ ctx[10].label + "";
66
+ let t3;
67
+ let t4;
68
+ let li_class_value;
69
+ let mounted;
70
+ let dispose;
71
+
72
+ function select_block_type(ctx, dirty) {
73
+ if (dirty & /*stepsObject*/ 4) show_if = null;
74
+ if (show_if == null) show_if = !!/*isStepValidated*/ ctx[3](/*index*/ ctx[12], /*stepsObject*/ ctx[2]);
75
+ if (show_if) return create_if_block;
76
+ if (/*step*/ ctx[10].isCurrent) return create_if_block_1;
77
+ }
78
+
79
+ let current_block_type = select_block_type(ctx, -1);
80
+ let if_block = current_block_type && current_block_type(ctx);
81
+
82
+ function click_handler() {
83
+ return /*click_handler*/ ctx[7](/*step*/ ctx[10]);
84
+ }
85
+
86
+ return {
87
+ c() {
88
+ li = element("li");
89
+ div0 = element("div");
90
+ if (if_block) if_block.c();
91
+ t0 = space();
92
+ div1 = element("div");
93
+ span0 = element("span");
94
+ t1 = text(t1_value);
95
+ t2 = space();
96
+ span1 = element("span");
97
+ t3 = text(t3_value);
98
+ t4 = space();
99
+ attr(div0, "class", "mc-stepper__indicator");
100
+ attr(div0, "aria-hidden", "true");
101
+ attr(span0, "class", "mc-stepper__title");
102
+ attr(span1, "class", "mc-stepper__label");
103
+ attr(div1, "class", "mc-stepper__detail");
104
+
105
+ attr(li, "class", li_class_value = "mc-stepper__item " + (/*step*/ ctx[10].isCurrent
106
+ ? 'mc-stepper__item--current'
107
+ : '') + " " + (/*isStepValidated*/ ctx[3](/*index*/ ctx[12], /*stepsObject*/ ctx[2])
108
+ ? 'mc-stepper__item--validated'
109
+ : ''));
110
+ },
111
+ m(target, anchor) {
112
+ insert(target, li, anchor);
113
+ append(li, div0);
114
+ if (if_block) if_block.m(div0, null);
115
+ append(li, t0);
116
+ append(li, div1);
117
+ append(div1, span0);
118
+ append(span0, t1);
119
+ append(div1, t2);
120
+ append(div1, span1);
121
+ append(span1, t3);
122
+ append(li, t4);
123
+
124
+ if (!mounted) {
125
+ dispose = listen(li, "click", click_handler);
126
+ mounted = true;
127
+ }
128
+ },
129
+ p(new_ctx, dirty) {
130
+ ctx = new_ctx;
131
+
132
+ if (current_block_type !== (current_block_type = select_block_type(ctx, dirty))) {
133
+ if (if_block) if_block.d(1);
134
+ if_block = current_block_type && current_block_type(ctx);
135
+
136
+ if (if_block) {
137
+ if_block.c();
138
+ if_block.m(div0, null);
139
+ }
140
+ }
141
+
142
+ if (dirty & /*stepsObject*/ 4 && t1_value !== (t1_value = /*getStepNumber*/ ctx[4](/*index*/ ctx[12], /*stepsObject*/ ctx[2]) + "")) set_data(t1, t1_value);
143
+ if (dirty & /*stepsObject*/ 4 && t3_value !== (t3_value = /*step*/ ctx[10].label + "")) set_data(t3, t3_value);
144
+
145
+ if (dirty & /*stepsObject*/ 4 && li_class_value !== (li_class_value = "mc-stepper__item " + (/*step*/ ctx[10].isCurrent
146
+ ? 'mc-stepper__item--current'
147
+ : '') + " " + (/*isStepValidated*/ ctx[3](/*index*/ ctx[12], /*stepsObject*/ ctx[2])
148
+ ? 'mc-stepper__item--validated'
149
+ : ''))) {
150
+ attr(li, "class", li_class_value);
151
+ }
152
+ },
153
+ d(detaching) {
154
+ if (detaching) detach(li);
155
+
156
+ if (if_block) {
157
+ if_block.d();
158
+ }
159
+
160
+ mounted = false;
161
+ dispose();
162
+ }
163
+ };
164
+ }
165
+
166
+ function create_fragment(ctx) {
167
+ let nav;
168
+ let ol;
169
+ let nav_class_value;
170
+ let each_value = /*stepsObject*/ ctx[2];
171
+ let each_blocks = [];
172
+
173
+ for (let i = 0; i < each_value.length; i += 1) {
174
+ each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
175
+ }
176
+
177
+ let nav_levels = [
178
+ {
179
+ class: nav_class_value = "mc-stepper " + (/*compact*/ ctx[0] ? 'mc-stepper--compact' : '') + " " + (/*stepsObject*/ ctx[2].length > 3
180
+ ? 'mc-stepper--shrinked'
181
+ : '')
182
+ },
183
+ {
184
+ "aria-label": "accessibilityLabels.stepperDescription"
185
+ },
186
+ /*attributes*/ ctx[1]
187
+ ];
188
+
189
+ let nav_data = {};
190
+
191
+ for (let i = 0; i < nav_levels.length; i += 1) {
192
+ nav_data = assign(nav_data, nav_levels[i]);
193
+ }
194
+
195
+ return {
196
+ c() {
197
+ nav = element("nav");
198
+ ol = element("ol");
199
+
200
+ for (let i = 0; i < each_blocks.length; i += 1) {
201
+ each_blocks[i].c();
202
+ }
203
+
204
+ this.c = noop;
205
+ attr(ol, "class", "mc-stepper__list");
206
+ set_attributes(nav, nav_data);
207
+ },
208
+ m(target, anchor) {
209
+ insert(target, nav, anchor);
210
+ append(nav, ol);
211
+
212
+ for (let i = 0; i < each_blocks.length; i += 1) {
213
+ if (each_blocks[i]) {
214
+ each_blocks[i].m(ol, null);
215
+ }
216
+ }
217
+ },
218
+ p(ctx, [dirty]) {
219
+ if (dirty & /*stepsObject, isStepValidated, stepChanged, getStepNumber*/ 60) {
220
+ each_value = /*stepsObject*/ ctx[2];
221
+ let i;
222
+
223
+ for (i = 0; i < each_value.length; i += 1) {
224
+ const child_ctx = get_each_context(ctx, each_value, i);
225
+
226
+ if (each_blocks[i]) {
227
+ each_blocks[i].p(child_ctx, dirty);
228
+ } else {
229
+ each_blocks[i] = create_each_block(child_ctx);
230
+ each_blocks[i].c();
231
+ each_blocks[i].m(ol, null);
232
+ }
233
+ }
234
+
235
+ for (; i < each_blocks.length; i += 1) {
236
+ each_blocks[i].d(1);
237
+ }
238
+
239
+ each_blocks.length = each_value.length;
240
+ }
241
+
242
+ set_attributes(nav, nav_data = get_spread_update(nav_levels, [
243
+ dirty & /*compact, stepsObject*/ 5 && nav_class_value !== (nav_class_value = "mc-stepper " + (/*compact*/ ctx[0] ? 'mc-stepper--compact' : '') + " " + (/*stepsObject*/ ctx[2].length > 3
244
+ ? 'mc-stepper--shrinked'
245
+ : '')) && { class: nav_class_value },
246
+ {
247
+ "aria-label": "accessibilityLabels.stepperDescription"
248
+ },
249
+ dirty & /*attributes*/ 2 && /*attributes*/ ctx[1]
250
+ ]));
251
+ },
252
+ i: noop,
253
+ o: noop,
254
+ d(detaching) {
255
+ if (detaching) detach(nav);
256
+ destroy_each(each_blocks, detaching);
257
+ }
258
+ };
259
+ }
260
+
261
+ function instance($$self, $$props, $$invalidate) {
262
+ let stepsObject;
263
+ let attributes;
264
+ const omit_props_names = ["steps","compact"];
265
+ let $$restProps = compute_rest_props($$props, omit_props_names);
266
+ let { steps } = $$props;
267
+ let { compact = false } = $$props;
268
+ let eventHandler = new EventHandler();
269
+
270
+ function isStepValidated(index, stepsObject) {
271
+ return index < stepsObject.findIndex(step => step.isCurrent);
272
+ }
273
+
274
+ function getStepNumber(index, stepsObject) {
275
+ return `${index + 1} / ${stepsObject.length}`;
276
+ }
277
+
278
+ function stepChanged(step) {
279
+ eventHandler.dispatch('step-changed', step);
280
+ }
281
+
282
+ const click_handler = step => stepChanged(step);
283
+
284
+ $$self.$$set = $$new_props => {
285
+ $$props = assign(assign({}, $$props), exclude_internal_props($$new_props));
286
+ $$invalidate(9, $$restProps = compute_rest_props($$props, omit_props_names));
287
+ if ('steps' in $$new_props) $$invalidate(6, steps = $$new_props.steps);
288
+ if ('compact' in $$new_props) $$invalidate(0, compact = $$new_props.compact);
289
+ };
290
+
291
+ $$self.$$.update = () => {
292
+ if ($$self.$$.dirty & /*steps*/ 64) {
293
+ $$invalidate(2, stepsObject = steps ? JSON.parse(steps) : []);
294
+ }
295
+
296
+ $$invalidate(1, attributes = Object.assign({}, $$restProps));
297
+
298
+ if ($$self.$$.dirty & /*attributes*/ 2) {
299
+ delete attributes.class;
300
+ }
301
+ };
302
+
303
+ return [
304
+ compact,
305
+ attributes,
306
+ stepsObject,
307
+ isStepValidated,
308
+ getStepNumber,
309
+ stepChanged,
310
+ steps,
311
+ click_handler
312
+ ];
313
+ }
314
+
315
+ class Stepper extends SvelteElement {
316
+ constructor(options) {
317
+ super();
318
+ const style = document.createElement('style');
319
+ style.textContent = `.mc-stepper{width:100%}.mc-stepper__list{display:-webkit-box;display:-ms-flexbox;display:flex;padding-left:0;margin-bottom:0;margin-top:0}.mc-stepper__item,.mc-stepper__link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mc-stepper__item{-webkit-box-flex:1;-ms-flex:1;flex:1;position:relative}.mc-stepper__item::before,.mc-stepper__item::after{background-color:#999999;content:"";height:0.125rem;position:absolute;top:11px;width:calc(50% - 1.25rem);z-index:1}.mc-stepper__item::before{border-top-right-radius:1px;border-bottom-right-radius:1px;left:0}.mc-stepper__item::after{border-top-left-radius:1px;border-bottom-left-radius:1px;right:0}.mc-stepper__item:first-child::before,.mc-stepper__item:last-child::after{content:none}.mc-stepper__item--current .mc-stepper__indicator,.mc-stepper__item--validated .mc-stepper__indicator{border-color:#46a610}.mc-stepper__item--current .mc-stepper__detail,.mc-stepper__item--validated .mc-stepper__detail{font-weight:600}.mc-stepper__item--current::before{background-color:#46a610}.mc-stepper__item--current .mc-stepper__indicator{background-color:#46a610;color:#ffffff}.mc-stepper__item--current .mc-stepper__label{color:#000000}.mc-stepper__item--validated::before,.mc-stepper__item--validated:not(.mc-stepper__item--current)::after{background-color:#46a610}.mc-stepper__link{height:100%;text-decoration:none;width:100%}.mc-stepper__link:hover .mc-stepper__label,.mc-stepper__link:focus .mc-stepper__label{color:#46a610}.mc-stepper__indicator{font-size:0.875rem;line-height:1.1428571429;font-weight:600;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:2px solid #999999;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;height:1.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-bottom:0.5rem;position:relative;width:1.5rem;z-index:2}.mc-stepper__icon{fill:#46a610;max-width:100%}.mc-stepper__detail{font-size:0.875rem;line-height:1.2857142857;color:#666666;text-align:center;width:auto}.mc-stepper__title{display:none;color:#46a610}.mc-stepper--compact .mc-stepper__item{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem}.mc-stepper--compact .mc-stepper__item::before,.mc-stepper--compact .mc-stepper__item::after{bottom:0;border-radius:6px;height:0.25rem;top:auto}.mc-stepper--compact .mc-stepper__item::after{width:100%}.mc-stepper--compact .mc-stepper__item::before{z-index:2;width:calc(var(--current) * 100% / var(--steps))}.mc-stepper--compact .mc-stepper__item:not(.mc-stepper__item--current){display:none}.mc-stepper--compact .mc-stepper__indicator{display:none}.mc-stepper--compact .mc-stepper__detail{text-align:left}.mc-stepper--compact .mc-stepper__title{display:block;margin-bottom:0.25rem}@media screen and (max-width: 679px){.mc-stepper--shrinked .mc-stepper__item{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem}.mc-stepper--shrinked .mc-stepper__item::before,.mc-stepper--shrinked .mc-stepper__item::after{bottom:0;border-radius:6px;height:0.25rem;top:auto}.mc-stepper--shrinked .mc-stepper__item::after{width:100%}.mc-stepper--shrinked .mc-stepper__item::before{z-index:2;width:calc(var(--current) * 100% / var(--steps))}.mc-stepper--shrinked .mc-stepper__item:not(.mc-stepper__item--current){display:none}.mc-stepper--shrinked .mc-stepper__indicator{display:none}.mc-stepper--shrinked .mc-stepper__detail{text-align:left}.mc-stepper--shrinked .mc-stepper__title{display:block;margin-bottom:0.25rem}}`;
320
+ this.shadowRoot.appendChild(style);
321
+
322
+ init(
323
+ this,
324
+ {
325
+ target: this.shadowRoot,
326
+ props: attribute_to_object(this.attributes),
327
+ customElement: true
328
+ },
329
+ instance,
330
+ create_fragment,
331
+ safe_not_equal,
332
+ { steps: 6, compact: 0 },
333
+ null
334
+ );
335
+
336
+ if (options) {
337
+ if (options.target) {
338
+ insert(options.target, this, options.anchor);
339
+ }
340
+
341
+ if (options.props) {
342
+ this.$set(options.props);
343
+ flush();
344
+ }
345
+ }
346
+ }
347
+
348
+ static get observedAttributes() {
349
+ return ["steps", "compact"];
350
+ }
351
+
352
+ get steps() {
353
+ return this.$$.ctx[6];
354
+ }
355
+
356
+ set steps(steps) {
357
+ this.$$set({ steps });
358
+ flush();
359
+ }
360
+
361
+ get compact() {
362
+ return this.$$.ctx[0];
363
+ }
364
+
365
+ set compact(compact) {
366
+ this.$$set({ compact });
367
+ flush();
368
+ }
369
+ }
370
+
371
+ export { Stepper as default };
2
372
  //# sourceMappingURL=Stepper.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Stepper.js","sources":["../../../src/components/stepper/Stepper.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { StepperItems } from './stepper.types';\n import { EventHandler } from '../../utilities/EventHandler';\n\n export let steps: string;\n export let compact = false;\n let eventHandler = new EventHandler();\n $: stepsObject = steps\n ? (JSON.parse(steps) as StepperItems[])\n : ([] as StepperItems[]);\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function isStepValidated(\n index: number,\n stepsObject: StepperItems[],\n ): boolean {\n return (\n index < stepsObject.findIndex((step: StepperItems) => step.isCurrent)\n );\n }\n\n function getStepNumber(index: number, stepsObject: StepperItems[]): string {\n return `${index + 1} / ${stepsObject.length}`;\n }\n\n function stepChanged(step: StepperItems): void {\n eventHandler.dispatch('step-changed', step);\n }\n</script>\n\n<nav\n class=\"mc-stepper {compact ? 'mc-stepper--compact' : ''} {stepsObject.length >\n 3\n ? 'mc-stepper--shrinked'\n : ''}\"\n aria-label=\"accessibilityLabels.stepperDescription\"\n {...attributes}\n>\n <ol class=\"mc-stepper__list\">\n {#each stepsObject as step, index}\n <li\n class=\"mc-stepper__item {step.isCurrent\n ? 'mc-stepper__item--current'\n : ''} {isStepValidated(index, stepsObject)\n ? 'mc-stepper__item--validated'\n : ''}\"\n on:click={() => stepChanged(step)}\n >\n <div class=\"mc-stepper__indicator\" aria-hidden=\"true\">\n {#if isStepValidated(index, stepsObject)}\n <div class=\"mc-stepper__icon\">\n <navigation-notification-available-16px\n name=\"NotificationAvailable16\"\n size=\"100%\"\n />\n </div>\n {:else if step.isCurrent}\n <span>{index + 1}</span>\n {/if}\n </div>\n <div class=\"mc-stepper__detail\">\n <span class=\"mc-stepper__title\"\n >{getStepNumber(index, stepsObject)}\n </span>\n <span class=\"mc-stepper__label\">{step.label}</span>\n </div>\n </li>\n {/each}\n </ol>\n</nav>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/_c.stepper';\n</style>\n"],"names":["t_value","ctx","insert","target","span","anchor","div","t3_value","label","isCurrent","create_if_block_1","attr","li","li_class_value","append","div0","div1","span0","span1","set_data","t1","t1_value","dirty","t3","length","i","nav","ol","class","nav_class_value","steps","$$props","compact","eventHandler","EventHandler","stepChanged","step","dispatch","$$invalidate","stepsObject","JSON","parse","attributes","Object","assign","$$restProps","index","findIndex"],"mappings":"uTA4DmBA,EAAAC,MAAQ,EAAC,yCAAhBC,EAAuBC,EAAAC,EAAAC,uPAPvBH,EAKKC,EAAAG,EAAAD,mEAOHJ,EAAa,GAACA,EAAK,IAAEA,EAAW,IAAA,GAEHM,EAAAN,MAAKO,MAAK,sDAftCP,EAAe,GAACA,EAAK,IAAEA,EAAW,SAO7BA,MAAKQ,UAASC,OAAd,yUAfaC,EAAAC,EAAA,QAAAC,EAAA,qBAAAZ,MAAKQ,UAC1B,4BACA,IAAK,KAAAR,EAAgB,GAAAA,MAAOA,EAAW,IACvC,8BACA,aALNC,EA0BIC,EAAAS,EAAAP,GAlBFS,EAWKF,EAAAG,yBACLD,EAKKF,EAAAI,GAJHF,EAEME,EAAAC,iBACNH,EAAkDE,EAAAE,+HAF9CjB,EAAa,GAACA,EAAK,IAAEA,EAAW,IAAA,KAAAkB,EAAAC,EAAAC,GAEH,EAAAC,GAAAf,KAAAA,EAAAN,MAAKO,MAAK,KAAAW,EAAAI,EAAAhB,GAvBpB,EAAAe,GAAAT,KAAAA,EAAA,qBAAAZ,MAAKQ,UAC1B,4BACA,IAAK,KAAAR,EAAgB,GAAAA,MAAOA,EAAW,IACvC,8BACA,iFANDA,EAAW,wBAAhBuB,OAAIC,GAAA,kDARWxB,EAAO,GAAG,sBAAwB,SAAKA,EAAW,GAACuB,OACtE,EACI,uBACA,6DAEAvB,EAAU,8KANhBC,EAuCKC,EAAAuB,EAAArB,GA/BHS,EA8BIY,EAAAC,mFA7BK1B,EAAW,WAAhBuB,OAAIC,GAAA,EAAA,iHAAJD,6CARevB,EAAO,GAAG,sBAAwB,SAAKA,EAAW,GAACuB,OACtE,EACI,uBACA,MAAE,CAAAI,MAAAC,gEAEF5B,EAAU,+GAjCH6B,GAAaC,GACbC,QAAAA,GAAU,GAAKD,EACtBE,MAAmBC,EAoBd,SAAAC,EAAYC,GACnBH,EAAaI,SAAS,eAAgBD,mJApBvCE,EAAA,EAAEC,EAAcT,EACZU,KAAKC,MAAMX,GAAK,QAElBY,EAALC,OAAAC,UAAuBC,yBACXH,EAAWd,uBAGnBkB,EACAP,UAGEO,EAAQP,EAAYQ,WAAWX,GAAuBA,EAAK3B,sBAIxCqC,EAAeP,GAC1B,MAAA,GAAAO,EAAQ,OAAOP,EAAYf,cAwBjBY,GAAAD,EAAYC"}
1
+ {"version":3,"file":"Stepper.js","sources":["../../../src/components/stepper/Stepper.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { StepperItems } from './stepper.types';\n import { EventHandler } from '../../utilities/EventHandler';\n\n export let steps: string;\n export let compact = false;\n let eventHandler = new EventHandler();\n $: stepsObject = steps\n ? (JSON.parse(steps) as StepperItems[])\n : ([] as StepperItems[]);\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function isStepValidated(\n index: number,\n stepsObject: StepperItems[],\n ): boolean {\n return (\n index < stepsObject.findIndex((step: StepperItems) => step.isCurrent)\n );\n }\n\n function getStepNumber(index: number, stepsObject: StepperItems[]): string {\n return `${index + 1} / ${stepsObject.length}`;\n }\n\n function stepChanged(step: StepperItems): void {\n eventHandler.dispatch('step-changed', step);\n }\n</script>\n\n<nav\n class=\"mc-stepper {compact ? 'mc-stepper--compact' : ''} {stepsObject.length >\n 3\n ? 'mc-stepper--shrinked'\n : ''}\"\n aria-label=\"accessibilityLabels.stepperDescription\"\n {...attributes}\n>\n <ol class=\"mc-stepper__list\">\n {#each stepsObject as step, index}\n <li\n class=\"mc-stepper__item {step.isCurrent\n ? 'mc-stepper__item--current'\n : ''} {isStepValidated(index, stepsObject)\n ? 'mc-stepper__item--validated'\n : ''}\"\n on:click={() => stepChanged(step)}\n >\n <div class=\"mc-stepper__indicator\" aria-hidden=\"true\">\n {#if isStepValidated(index, stepsObject)}\n <div class=\"mc-stepper__icon\">\n <navigation-notification-available-16px\n name=\"NotificationAvailable16\"\n size=\"100%\"\n />\n </div>\n {:else if step.isCurrent}\n <span>{index + 1}</span>\n {/if}\n </div>\n <div class=\"mc-stepper__detail\">\n <span class=\"mc-stepper__title\"\n >{getStepNumber(index, stepsObject)}\n </span>\n <span class=\"mc-stepper__label\">{step.label}</span>\n </div>\n </li>\n {/each}\n </ol>\n</nav>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/_c.stepper';\n</style>\n"],"names":[],"mappings":"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"}