@siemens/ix 1.5.0-beta.4 → 1.6.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.
- package/dist/cjs/icon-c65f0901.js +106 -0
- package/dist/cjs/icon-c65f0901.js.map +1 -0
- package/dist/cjs/{index-478a4b66.js → index-c978628a.js} +134 -38
- package/dist/cjs/index-c978628a.js.map +1 -0
- package/dist/cjs/index.cjs.js +2 -0
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/ix-action-card.cjs.entry.js +28 -0
- package/dist/cjs/ix-action-card.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-animated-tab_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-application-header.cjs.entry.js +1 -1
- package/dist/cjs/ix-basic-navigation.cjs.entry.js +2 -2
- package/dist/cjs/ix-basic-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-blind.cjs.entry.js +4 -7
- package/dist/cjs/ix-blind.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-breadcrumb_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-burger-menu.cjs.entry.js +1 -1
- package/dist/cjs/ix-button.cjs.entry.js +2 -2
- package/dist/cjs/ix-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-card-accordion_2.cjs.entry.js +74 -0
- package/dist/cjs/ix-card-accordion_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-card-list.cjs.entry.js +164 -0
- package/dist/cjs/ix-card-list.cjs.entry.js.map +1 -0
- package/dist/cjs/{ix-typography.cjs.entry.js → ix-card_3.cjs.entry.js} +37 -3
- package/dist/cjs/ix-card_3.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-category-filter.cjs.entry.js +1 -1
- package/dist/cjs/ix-chip.cjs.entry.js +1 -1
- package/dist/cjs/ix-content-header.cjs.entry.js +26 -0
- package/dist/cjs/ix-content-header.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-counter-pill.cjs.entry.js +1 -1
- package/dist/cjs/ix-css-grid-item.cjs.entry.js +24 -0
- package/dist/cjs/ix-css-grid-item.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-css-grid.cjs.entry.js +96 -0
- package/dist/cjs/ix-css-grid.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-date-picker_2.cjs.entry.js +103 -19
- package/dist/cjs/ix-date-picker_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-date-time-card.cjs.entry.js +1 -1
- package/dist/cjs/ix-datetime-picker.cjs.entry.js +1 -1
- package/dist/cjs/ix-divider.cjs.entry.js +1 -1
- package/dist/cjs/ix-drawer.cjs.entry.js +4 -4
- package/dist/cjs/ix-drawer.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-dropdown-button.cjs.entry.js +1 -1
- package/dist/cjs/ix-dropdown-quick-actions.cjs.entry.js +1 -1
- package/dist/cjs/ix-dropdown_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-empty-state.cjs.entry.js +27 -0
- package/dist/cjs/ix-empty-state.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-event-list_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-expanding-search.cjs.entry.js +5 -2
- package/dist/cjs/ix-expanding-search.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-filter-chip.cjs.entry.js +1 -1
- package/dist/cjs/ix-flip-tile_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-group-context-menu.cjs.entry.js +1 -1
- package/dist/cjs/ix-group_3.cjs.entry.js +1 -1
- package/dist/cjs/ix-icon-button.cjs.entry.js +11 -4
- package/dist/cjs/ix-icon-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-icon.cjs.entry.js +3 -29
- package/dist/cjs/ix-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-index-button.cjs.entry.js +1 -1
- package/dist/cjs/ix-input-group.cjs.entry.js +1 -1
- package/dist/cjs/ix-key-value-list.cjs.entry.js +22 -0
- package/dist/cjs/ix-key-value-list.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-key-value.cjs.entry.js +28 -0
- package/dist/cjs/ix-key-value.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-kpi.cjs.entry.js +2 -2
- package/dist/cjs/ix-kpi.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-map-navigation_2.cjs.entry.js +11 -5
- package/dist/cjs/ix-map-navigation_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-menu_9.cjs.entry.js +24 -15
- package/dist/cjs/ix-menu_9.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-message-bar.cjs.entry.js +2 -2
- package/dist/cjs/ix-message-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-modal-example.cjs.entry.js +1 -1
- package/dist/cjs/ix-modal_2.cjs.entry.js +2 -2
- package/dist/cjs/ix-modal_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-pagination.cjs.entry.js +1 -1
- package/dist/cjs/ix-pill.cjs.entry.js +1 -1
- package/dist/cjs/ix-push-card.cjs.entry.js +27 -0
- package/dist/cjs/ix-push-card.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-select_2.cjs.entry.js +3 -3
- package/dist/cjs/ix-select_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-spinner.cjs.entry.js +2 -2
- package/dist/cjs/ix-spinner.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-split-button_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-tab-item.cjs.entry.js +1 -1
- package/dist/cjs/ix-tabs.cjs.entry.js +1 -1
- package/dist/cjs/ix-tile.cjs.entry.js +1 -1
- package/dist/cjs/ix-toast_2.cjs.entry.js +8 -26
- package/dist/cjs/ix-toast_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-toggle.cjs.entry.js +1 -1
- package/dist/cjs/ix-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/ix-tree_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-upload.cjs.entry.js +1 -1
- package/dist/cjs/ix-validation-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/ix-workflow-step_2.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/cjs/my-component.cjs.entry.js +2 -2
- package/dist/cjs/my-component.cjs.entry.js.map +1 -1
- package/dist/cjs/siemens-ix.cjs.js +3 -3
- package/dist/cjs/siemens-ix.cjs.js.map +1 -1
- package/dist/collection/collection-manifest.json +33 -4
- package/dist/collection/components/action-card/action-card.css +161 -0
- package/dist/collection/components/action-card/action-card.js +136 -0
- package/dist/collection/components/action-card/action-card.js.map +1 -0
- package/dist/collection/components/basic-navigation/basic-navigation.css +1 -1
- package/dist/collection/components/blind/blind.css +5 -5
- package/dist/collection/components/blind/blind.js +3 -6
- package/dist/collection/components/blind/blind.js.map +1 -1
- package/dist/collection/components/button/button.css +359 -0
- package/dist/collection/components/button/button.js +2 -2
- package/dist/collection/components/button/button.js.map +1 -1
- package/dist/collection/components/card/card.css +92 -0
- package/dist/collection/components/card/card.js +53 -0
- package/dist/collection/components/card/card.js.map +1 -0
- package/dist/collection/components/card-accordion/card-accordion.css +121 -0
- package/dist/collection/components/card-accordion/card-accordion.js +94 -0
- package/dist/collection/components/card-accordion/card-accordion.js.map +1 -0
- package/dist/collection/components/card-content/card-content.css +29 -0
- package/dist/collection/components/card-content/card-content.js +22 -0
- package/dist/collection/components/card-content/card-content.js.map +1 -0
- package/dist/collection/components/card-list/card-list.css +127 -0
- package/dist/collection/components/card-list/card-list.js +387 -0
- package/dist/collection/components/card-list/card-list.js.map +1 -0
- package/dist/collection/components/card-title/card-title.css +30 -0
- package/dist/collection/components/card-title/card-title.js +24 -0
- package/dist/collection/components/card-title/card-title.js.map +1 -0
- package/dist/collection/components/content-header/content-header.css +28 -0
- package/dist/collection/components/content-header/content-header.js +131 -0
- package/dist/collection/components/content-header/content-header.js.map +1 -0
- package/dist/collection/components/drawer/drawer.css +20 -12
- package/dist/collection/components/drawer/drawer.js +5 -5
- package/dist/collection/components/drawer/drawer.js.map +1 -1
- package/dist/collection/components/empty-state/empty-state.css +100 -0
- package/dist/collection/components/empty-state/empty-state.js +150 -0
- package/dist/collection/components/empty-state/empty-state.js.map +1 -0
- package/dist/collection/components/expanding-search/expanding-search.css +8 -0
- package/dist/collection/components/expanding-search/expanding-search.js +24 -0
- package/dist/collection/components/expanding-search/expanding-search.js.map +1 -1
- package/dist/collection/components/icon-button/icon-button.css +362 -0
- package/dist/collection/components/icon-button/icon-button.js +10 -3
- package/dist/collection/components/icon-button/icon-button.js.map +1 -1
- package/dist/collection/components/key-value/key-value.css +56 -0
- package/dist/collection/components/key-value/key-value.js +119 -0
- package/dist/collection/components/key-value/key-value.js.map +1 -0
- package/dist/collection/components/key-value-list/key-value-list.css +7 -0
- package/dist/collection/components/key-value-list/key-value-list.js +54 -0
- package/dist/collection/components/key-value-list/key-value-list.js.map +1 -0
- package/dist/collection/components/kpi/kpi.css +25 -11
- package/dist/collection/components/kpi/kpi.js +1 -1
- package/dist/collection/components/kpi/kpi.js.map +1 -1
- package/dist/collection/components/layout/css-grid/builder.js +20 -0
- package/dist/collection/components/layout/css-grid/builder.js.map +1 -0
- package/dist/collection/components/layout/css-grid/css-grid-item.css +16 -0
- package/dist/collection/components/layout/css-grid/css-grid-item.js +56 -0
- package/dist/collection/components/layout/css-grid/css-grid-item.js.map +1 -0
- package/dist/collection/components/{icon/icon.css → layout/css-grid/css-grid.css} +5 -23
- package/dist/collection/components/layout/css-grid/css-grid.js +123 -0
- package/dist/collection/components/layout/css-grid/css-grid.js.map +1 -0
- package/dist/collection/components/map-navigation/map-navigation.css +1 -1
- package/dist/collection/components/map-navigation/map-navigation.js +37 -3
- package/dist/collection/components/map-navigation/map-navigation.js.map +1 -1
- package/dist/collection/components/menu/menu.css +4 -4
- package/dist/collection/components/menu/menu.js +1 -1
- package/dist/collection/components/menu/menu.js.map +1 -1
- package/dist/collection/components/menu-about-news/menu-about-news.css +2 -2
- package/dist/collection/components/menu-avatar/menu-avatar.css +2 -2
- package/dist/collection/components/menu-avatar/menu-avatar.js +1 -1
- package/dist/collection/components/menu-avatar/menu-avatar.js.map +1 -1
- package/dist/collection/components/menu-item/menu-item.css +47 -23
- package/dist/collection/components/menu-item/menu-item.js +19 -10
- package/dist/collection/components/menu-item/menu-item.js.map +1 -1
- package/dist/collection/components/message-bar/message-bar.css +19 -11
- package/dist/collection/components/message-bar/message-bar.js +1 -1
- package/dist/collection/components/message-bar/message-bar.js.map +1 -1
- package/dist/collection/components/modal/modal.css +1 -0
- package/dist/collection/components/my-component/my-component.css +1 -0
- package/dist/collection/components/my-component/my-component.js.map +1 -1
- package/dist/collection/components/push-card/push-card.css +74 -0
- package/dist/collection/components/push-card/push-card.js +134 -0
- package/dist/collection/components/push-card/push-card.js.map +1 -0
- package/dist/collection/components/select/select.css +20 -2
- package/dist/collection/components/select/select.js +1 -1
- package/dist/collection/components/select/select.js.map +1 -1
- package/dist/collection/components/spinner/spinner.css +13 -0
- package/dist/collection/components/spinner/spinner.js +1 -1
- package/dist/collection/components/spinner/spinner.js.map +1 -1
- package/dist/collection/components/time-picker/time-picker.css +23 -17
- package/dist/collection/components/time-picker/time-picker.js +102 -18
- package/dist/collection/components/time-picker/time-picker.js.map +1 -1
- package/dist/collection/components/toast/toast.css +0 -10
- package/dist/collection/components/toast/toast.js +6 -25
- package/dist/collection/components/toast/toast.js.map +1 -1
- package/dist/collection/components/typography/{types.js → type-mapping.js} +1 -1
- package/dist/collection/components/typography/type-mapping.js.map +1 -0
- package/dist/collection/components/typography/typography.js +34 -6
- package/dist/collection/components/typography/typography.js.map +1 -1
- package/dist/collection/index.js +1 -0
- package/dist/collection/index.js.map +1 -1
- package/dist/components/button.js +3 -2
- package/dist/components/button.js.map +1 -1
- package/dist/components/card-accordion.js +80 -0
- package/dist/components/card-accordion.js.map +1 -0
- package/dist/components/card-content.js +32 -0
- package/dist/components/card-content.js.map +1 -0
- package/dist/components/card-title.js +32 -0
- package/dist/components/card-title.js.map +1 -0
- package/dist/components/card.js +36 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/icon-button.js +12 -4
- package/dist/components/icon-button.js.map +1 -1
- package/dist/components/icon.js +87 -14
- package/dist/components/icon.js.map +1 -1
- package/dist/components/ix-action-card.d.ts +11 -0
- package/dist/components/ix-action-card.js +72 -0
- package/dist/components/ix-action-card.js.map +1 -0
- package/dist/components/ix-basic-navigation.js +1 -1
- package/dist/components/ix-basic-navigation.js.map +1 -1
- package/dist/components/ix-blind.js +5 -7
- package/dist/components/ix-blind.js.map +1 -1
- package/dist/components/ix-card-accordion.d.ts +11 -0
- package/dist/components/ix-card-accordion.js +8 -0
- package/dist/components/ix-card-accordion.js.map +1 -0
- package/dist/components/ix-card-content.d.ts +11 -0
- package/dist/components/ix-card-content.js +8 -0
- package/dist/components/ix-card-content.js.map +1 -0
- package/dist/components/ix-card-list.d.ts +11 -0
- package/dist/components/ix-card-list.js +228 -0
- package/dist/components/ix-card-list.js.map +1 -0
- package/dist/components/ix-card-title.d.ts +11 -0
- package/dist/components/ix-card-title.js +8 -0
- package/dist/components/ix-card-title.js.map +1 -0
- package/dist/components/{ix-icon.d.ts → ix-card.d.ts} +4 -4
- package/dist/components/ix-card.js +8 -0
- package/dist/components/ix-card.js.map +1 -0
- package/dist/components/ix-content-header.d.ts +11 -0
- package/dist/components/ix-content-header.js +63 -0
- package/dist/components/ix-content-header.js.map +1 -0
- package/dist/components/ix-css-grid-item.d.ts +11 -0
- package/dist/components/ix-css-grid-item.js +40 -0
- package/dist/components/ix-css-grid-item.js.map +1 -0
- package/dist/components/ix-css-grid.d.ts +11 -0
- package/dist/components/ix-css-grid.js +113 -0
- package/dist/components/ix-css-grid.js.map +1 -0
- package/dist/components/ix-drawer.js +6 -5
- package/dist/components/ix-drawer.js.map +1 -1
- package/dist/components/ix-empty-state.d.ts +11 -0
- package/dist/components/ix-empty-state.js +65 -0
- package/dist/components/ix-empty-state.js.map +1 -0
- package/dist/components/ix-expanding-search.js +5 -1
- package/dist/components/ix-expanding-search.js.map +1 -1
- package/dist/components/ix-key-value-list.d.ts +11 -0
- package/dist/components/ix-key-value-list.js +38 -0
- package/dist/components/ix-key-value-list.js.map +1 -0
- package/dist/components/ix-key-value.d.ts +11 -0
- package/dist/components/ix-key-value.js +53 -0
- package/dist/components/ix-key-value.js.map +1 -0
- package/dist/components/ix-kpi.js +3 -2
- package/dist/components/ix-kpi.js.map +1 -1
- package/dist/components/ix-map-navigation.js +11 -4
- package/dist/components/ix-map-navigation.js.map +1 -1
- package/dist/components/ix-menu-about-news.js +1 -1
- package/dist/components/ix-menu-about-news.js.map +1 -1
- package/dist/components/ix-menu-avatar.js +2 -2
- package/dist/components/ix-menu-avatar.js.map +1 -1
- package/dist/components/ix-menu.js +12 -6
- package/dist/components/ix-menu.js.map +1 -1
- package/dist/components/ix-message-bar.js +3 -2
- package/dist/components/ix-message-bar.js.map +1 -1
- package/dist/components/ix-push-card.d.ts +11 -0
- package/dist/components/ix-push-card.js +83 -0
- package/dist/components/ix-push-card.js.map +1 -0
- package/dist/components/menu-item.js +27 -11
- package/dist/components/menu-item.js.map +1 -1
- package/dist/components/modal.js +1 -1
- package/dist/components/modal.js.map +1 -1
- package/dist/components/my-component.js +1 -1
- package/dist/components/my-component.js.map +1 -1
- package/dist/components/select.js +2 -2
- package/dist/components/select.js.map +1 -1
- package/dist/components/spinner.js +3 -2
- package/dist/components/spinner.js.map +1 -1
- package/dist/components/time-picker.js +103 -19
- package/dist/components/time-picker.js.map +1 -1
- package/dist/components/toast.js +7 -26
- package/dist/components/toast.js.map +1 -1
- package/dist/components/typography.js +9 -2
- package/dist/components/typography.js.map +1 -1
- package/dist/esm/icon-21211f80.js +104 -0
- package/dist/esm/icon-21211f80.js.map +1 -0
- package/dist/esm/{index-3d163acd.js → index-8ddfb6d8.js} +134 -38
- package/dist/esm/index-8ddfb6d8.js.map +1 -0
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/ix-action-card.entry.js +24 -0
- package/dist/esm/ix-action-card.entry.js.map +1 -0
- package/dist/esm/ix-animated-tab_2.entry.js +1 -1
- package/dist/esm/ix-application-header.entry.js +1 -1
- package/dist/esm/ix-basic-navigation.entry.js +2 -2
- package/dist/esm/ix-basic-navigation.entry.js.map +1 -1
- package/dist/esm/ix-blind.entry.js +4 -7
- package/dist/esm/ix-blind.entry.js.map +1 -1
- package/dist/esm/ix-breadcrumb_2.entry.js +1 -1
- package/dist/esm/ix-burger-menu.entry.js +1 -1
- package/dist/esm/ix-button.entry.js +2 -2
- package/dist/esm/ix-button.entry.js.map +1 -1
- package/dist/esm/ix-card-accordion_2.entry.js +69 -0
- package/dist/esm/ix-card-accordion_2.entry.js.map +1 -0
- package/dist/esm/ix-card-list.entry.js +160 -0
- package/dist/esm/ix-card-list.entry.js.map +1 -0
- package/dist/esm/{ix-typography.entry.js → ix-card_3.entry.js} +36 -4
- package/dist/esm/ix-card_3.entry.js.map +1 -0
- package/dist/esm/ix-category-filter.entry.js +1 -1
- package/dist/esm/ix-chip.entry.js +1 -1
- package/dist/esm/ix-content-header.entry.js +22 -0
- package/dist/esm/ix-content-header.entry.js.map +1 -0
- package/dist/esm/ix-counter-pill.entry.js +1 -1
- package/dist/esm/ix-css-grid-item.entry.js +20 -0
- package/dist/esm/ix-css-grid-item.entry.js.map +1 -0
- package/dist/esm/ix-css-grid.entry.js +92 -0
- package/dist/esm/ix-css-grid.entry.js.map +1 -0
- package/dist/esm/ix-date-picker_2.entry.js +103 -19
- package/dist/esm/ix-date-picker_2.entry.js.map +1 -1
- package/dist/esm/ix-date-time-card.entry.js +1 -1
- package/dist/esm/ix-datetime-picker.entry.js +1 -1
- package/dist/esm/ix-divider.entry.js +1 -1
- package/dist/esm/ix-drawer.entry.js +4 -4
- package/dist/esm/ix-drawer.entry.js.map +1 -1
- package/dist/esm/ix-dropdown-button.entry.js +1 -1
- package/dist/esm/ix-dropdown-quick-actions.entry.js +1 -1
- package/dist/esm/ix-dropdown_2.entry.js +1 -1
- package/dist/esm/ix-empty-state.entry.js +23 -0
- package/dist/esm/ix-empty-state.entry.js.map +1 -0
- package/dist/esm/ix-event-list_2.entry.js +1 -1
- package/dist/esm/ix-expanding-search.entry.js +5 -2
- package/dist/esm/ix-expanding-search.entry.js.map +1 -1
- package/dist/esm/ix-filter-chip.entry.js +1 -1
- package/dist/esm/ix-flip-tile_2.entry.js +1 -1
- package/dist/esm/ix-group-context-menu.entry.js +1 -1
- package/dist/esm/ix-group_3.entry.js +1 -1
- package/dist/esm/ix-icon-button.entry.js +11 -4
- package/dist/esm/ix-icon-button.entry.js.map +1 -1
- package/dist/esm/ix-icon.entry.js +2 -32
- package/dist/esm/ix-icon.entry.js.map +1 -1
- package/dist/esm/ix-index-button.entry.js +1 -1
- package/dist/esm/ix-input-group.entry.js +1 -1
- package/dist/esm/ix-key-value-list.entry.js +18 -0
- package/dist/esm/ix-key-value-list.entry.js.map +1 -0
- package/dist/esm/ix-key-value.entry.js +24 -0
- package/dist/esm/ix-key-value.entry.js.map +1 -0
- package/dist/esm/ix-kpi.entry.js +2 -2
- package/dist/esm/ix-kpi.entry.js.map +1 -1
- package/dist/esm/ix-map-navigation_2.entry.js +11 -5
- package/dist/esm/ix-map-navigation_2.entry.js.map +1 -1
- package/dist/esm/ix-menu_9.entry.js +24 -15
- package/dist/esm/ix-menu_9.entry.js.map +1 -1
- package/dist/esm/ix-message-bar.entry.js +2 -2
- package/dist/esm/ix-message-bar.entry.js.map +1 -1
- package/dist/esm/ix-modal-example.entry.js +1 -1
- package/dist/esm/ix-modal_2.entry.js +2 -2
- package/dist/esm/ix-modal_2.entry.js.map +1 -1
- package/dist/esm/ix-pagination.entry.js +1 -1
- package/dist/esm/ix-pill.entry.js +1 -1
- package/dist/esm/ix-push-card.entry.js +23 -0
- package/dist/esm/ix-push-card.entry.js.map +1 -0
- package/dist/esm/ix-select_2.entry.js +3 -3
- package/dist/esm/ix-select_2.entry.js.map +1 -1
- package/dist/esm/ix-spinner.entry.js +2 -2
- package/dist/esm/ix-spinner.entry.js.map +1 -1
- package/dist/esm/ix-split-button_2.entry.js +1 -1
- package/dist/esm/ix-tab-item.entry.js +1 -1
- package/dist/esm/ix-tabs.entry.js +1 -1
- package/dist/esm/ix-tile.entry.js +1 -1
- package/dist/esm/ix-toast_2.entry.js +8 -26
- package/dist/esm/ix-toast_2.entry.js.map +1 -1
- package/dist/esm/ix-toggle.entry.js +1 -1
- package/dist/esm/ix-tooltip.entry.js +1 -1
- package/dist/esm/ix-tree_2.entry.js +1 -1
- package/dist/esm/ix-upload.entry.js +1 -1
- package/dist/esm/ix-validation-tooltip.entry.js +1 -1
- package/dist/esm/ix-workflow-step_2.entry.js +1 -1
- package/dist/esm/loader.js +4 -4
- package/dist/esm/loader.js.map +1 -1
- package/dist/esm/my-component.entry.js +2 -2
- package/dist/esm/my-component.entry.js.map +1 -1
- package/dist/esm/siemens-ix.js +4 -4
- package/dist/esm/siemens-ix.js.map +1 -1
- package/dist/siemens-ix/index.esm.js +1 -1
- package/dist/siemens-ix/index.esm.js.map +1 -1
- package/dist/siemens-ix/{p-3776a37f.entry.js → p-003e9355.entry.js} +2 -2
- package/dist/siemens-ix/p-07c932da.entry.js +2 -0
- package/dist/siemens-ix/p-07c932da.entry.js.map +1 -0
- package/dist/siemens-ix/{p-afd1f351.entry.js → p-1331a920.entry.js} +2 -2
- package/dist/siemens-ix/p-13bda5ea.entry.js +2 -0
- package/dist/siemens-ix/p-13bda5ea.entry.js.map +1 -0
- package/dist/siemens-ix/p-1abcd6ba.js +2 -0
- package/dist/siemens-ix/p-1abcd6ba.js.map +1 -0
- package/dist/siemens-ix/p-1c64b073.js +3 -0
- package/dist/siemens-ix/p-1c64b073.js.map +1 -0
- package/dist/siemens-ix/{p-626b3af5.entry.js → p-1e8ee4af.entry.js} +2 -2
- package/dist/siemens-ix/{p-6bdfaf91.entry.js → p-3172249b.entry.js} +2 -2
- package/dist/siemens-ix/p-3f4a9e1f.entry.js +2 -0
- package/dist/siemens-ix/p-3f4a9e1f.entry.js.map +1 -0
- package/dist/siemens-ix/{p-9546cbdd.entry.js → p-40982e21.entry.js} +2 -2
- package/dist/siemens-ix/{p-a4a16daa.entry.js → p-4597dd77.entry.js} +2 -2
- package/dist/siemens-ix/p-46ced516.entry.js +2 -0
- package/dist/siemens-ix/p-46ced516.entry.js.map +1 -0
- package/dist/siemens-ix/p-47422d47.entry.js +2 -0
- package/dist/siemens-ix/p-47422d47.entry.js.map +1 -0
- package/dist/siemens-ix/{p-909ccf09.entry.js → p-4e851aa3.entry.js} +2 -2
- package/dist/siemens-ix/{p-c19c2492.entry.js → p-51c81a20.entry.js} +2 -2
- package/dist/siemens-ix/p-55b54a81.entry.js +2 -0
- package/dist/siemens-ix/p-55b54a81.entry.js.map +1 -0
- package/dist/siemens-ix/p-5ec38498.entry.js +2 -0
- package/dist/siemens-ix/p-5ec38498.entry.js.map +1 -0
- package/dist/siemens-ix/{p-43965bd0.entry.js → p-6124d173.entry.js} +2 -2
- package/dist/siemens-ix/{p-16ec6f50.entry.js → p-626fbee2.entry.js} +2 -2
- package/dist/siemens-ix/{p-0f864265.entry.js → p-652ba2c1.entry.js} +2 -2
- package/dist/siemens-ix/p-67be3720.entry.js +2 -0
- package/dist/siemens-ix/p-67be3720.entry.js.map +1 -0
- package/dist/siemens-ix/p-6acce5c9.entry.js +2 -0
- package/dist/siemens-ix/p-6acce5c9.entry.js.map +1 -0
- package/dist/siemens-ix/p-6c033b08.entry.js +2 -0
- package/dist/siemens-ix/p-6c033b08.entry.js.map +1 -0
- package/dist/siemens-ix/{p-663724a8.entry.js → p-821ca55e.entry.js} +2 -2
- package/dist/siemens-ix/p-85f01dba.entry.js +2 -0
- package/dist/siemens-ix/p-85f01dba.entry.js.map +1 -0
- package/dist/siemens-ix/{p-eb799bdd.entry.js → p-8719eeff.entry.js} +2 -2
- package/dist/siemens-ix/{p-4c8d5207.entry.js → p-94ab7c1c.entry.js} +2 -2
- package/dist/siemens-ix/{p-fef2f9e0.entry.js → p-9a82921b.entry.js} +2 -2
- package/dist/siemens-ix/{p-0e8a6997.entry.js → p-a08e1bbc.entry.js} +2 -2
- package/dist/siemens-ix/p-a422c64a.entry.js +2 -0
- package/dist/siemens-ix/p-a422c64a.entry.js.map +1 -0
- package/dist/siemens-ix/p-a7212f01.entry.js +2 -0
- package/dist/siemens-ix/p-a7212f01.entry.js.map +1 -0
- package/dist/siemens-ix/{p-20bed29f.entry.js → p-a73580a5.entry.js} +2 -2
- package/dist/siemens-ix/p-a89a1fa5.entry.js +2 -0
- package/dist/siemens-ix/p-a89a1fa5.entry.js.map +1 -0
- package/dist/siemens-ix/{p-2ea2fc07.entry.js → p-b5c40bb3.entry.js} +2 -2
- package/dist/siemens-ix/p-b60bd26c.entry.js +2 -0
- package/dist/siemens-ix/p-b60bd26c.entry.js.map +1 -0
- package/dist/siemens-ix/p-b9c2e7d9.entry.js +2 -0
- package/dist/siemens-ix/p-b9c2e7d9.entry.js.map +1 -0
- package/dist/siemens-ix/{p-63666529.entry.js → p-bd24f35f.entry.js} +2 -2
- package/dist/siemens-ix/p-c349b266.entry.js +2 -0
- package/dist/siemens-ix/p-c349b266.entry.js.map +1 -0
- package/dist/siemens-ix/p-c5124f7b.entry.js +2 -0
- package/dist/siemens-ix/p-c5124f7b.entry.js.map +1 -0
- package/dist/siemens-ix/{p-aa4141e4.entry.js → p-c7109071.entry.js} +2 -2
- package/dist/siemens-ix/p-c724bb65.entry.js +2 -0
- package/dist/siemens-ix/p-c724bb65.entry.js.map +1 -0
- package/dist/siemens-ix/p-ca4d28fb.entry.js +2 -0
- package/dist/siemens-ix/p-ca4d28fb.entry.js.map +1 -0
- package/dist/siemens-ix/p-cd3cfc78.entry.js +2 -0
- package/dist/siemens-ix/p-cd3cfc78.entry.js.map +1 -0
- package/dist/siemens-ix/p-cd4e3593.entry.js +2 -0
- package/dist/siemens-ix/p-cd4e3593.entry.js.map +1 -0
- package/dist/siemens-ix/p-cd75b455.entry.js +2 -0
- package/dist/siemens-ix/p-cd75b455.entry.js.map +1 -0
- package/dist/siemens-ix/{p-4ec66090.entry.js → p-cf2717c1.entry.js} +2 -2
- package/dist/siemens-ix/{p-dbcf33de.entry.js → p-d2225fc2.entry.js} +2 -2
- package/dist/siemens-ix/{p-b9fbd029.entry.js → p-d5302336.entry.js} +2 -2
- package/dist/siemens-ix/{p-13adcf62.entry.js → p-d784a04b.entry.js} +2 -2
- package/dist/siemens-ix/{p-55d0fabf.entry.js → p-d7e23a1f.entry.js} +2 -2
- package/dist/siemens-ix/p-d848739e.entry.js +2 -0
- package/dist/siemens-ix/p-d848739e.entry.js.map +1 -0
- package/dist/siemens-ix/p-dbcec49e.entry.js +2 -0
- package/dist/siemens-ix/p-dbcec49e.entry.js.map +1 -0
- package/dist/siemens-ix/{p-33160fe4.entry.js → p-dc98d3f4.entry.js} +2 -2
- package/dist/siemens-ix/{p-65b6330a.entry.js → p-df138b2a.entry.js} +2 -2
- package/dist/siemens-ix/p-ea55afa3.entry.js +2 -0
- package/dist/siemens-ix/p-ea55afa3.entry.js.map +1 -0
- package/dist/siemens-ix/{p-62b4d696.entry.js → p-eccc2475.entry.js} +2 -2
- package/dist/siemens-ix/{p-7d4a7388.entry.js → p-ecd1145b.entry.js} +2 -2
- package/dist/siemens-ix/{p-78f2b858.entry.js → p-f207e578.entry.js} +2 -2
- package/dist/siemens-ix/p-f207e578.entry.js.map +1 -0
- package/dist/siemens-ix/{p-a30c7b5a.entry.js → p-f48b706b.entry.js} +2 -2
- package/dist/siemens-ix/{p-b998abe4.entry.js → p-f50697b9.entry.js} +2 -2
- package/dist/siemens-ix/p-f6ae45fb.entry.js +2 -0
- package/dist/siemens-ix/p-f6ae45fb.entry.js.map +1 -0
- package/dist/siemens-ix/{p-c9c9f2b5.entry.js → p-f74c7692.entry.js} +2 -2
- package/dist/siemens-ix/{p-042b490c.entry.js → p-feb8c2c4.entry.js} +2 -2
- package/dist/siemens-ix/siemens-ix.css +32 -14
- package/dist/siemens-ix/siemens-ix.esm.js +1 -1
- package/dist/siemens-ix/siemens-ix.esm.js.map +1 -1
- package/dist/types/components/action-card/action-card.d.ts +28 -0
- package/dist/types/components/button/button.d.ts +1 -1
- package/dist/types/components/card/card.d.ts +12 -0
- package/dist/types/components/card-accordion/card-accordion.d.ts +20 -0
- package/dist/types/components/card-content/card-content.d.ts +6 -0
- package/dist/types/components/card-list/card-list.d.ts +78 -0
- package/dist/types/components/card-title/card-title.d.ts +8 -0
- package/dist/types/components/content-header/content-header.d.ts +25 -0
- package/dist/types/components/drawer/drawer.d.ts +1 -1
- package/dist/types/components/empty-state/empty-state.d.ts +32 -0
- package/dist/types/components/expanding-search/expanding-search.d.ts +5 -0
- package/dist/types/components/icon-button/icon-button.d.ts +1 -0
- package/dist/types/components/key-value/key-value.d.ts +25 -0
- package/dist/types/components/key-value-list/key-value-list.d.ts +10 -0
- package/dist/types/components/layout/css-grid/builder.d.ts +1 -0
- package/dist/types/components/layout/css-grid/css-grid-item.d.ts +10 -0
- package/dist/types/components/layout/css-grid/css-grid.d.ts +18 -0
- package/dist/types/components/map-navigation/map-navigation.d.ts +7 -1
- package/dist/types/components/menu-item/menu-item.d.ts +5 -3
- package/dist/types/components/push-card/push-card.d.ts +28 -0
- package/dist/types/components/time-picker/time-picker.d.ts +7 -0
- package/dist/types/components/toast/toast.d.ts +0 -1
- package/dist/types/components/typography/typography.d.ts +7 -2
- package/dist/types/components.d.ts +654 -46
- package/dist/types/index.d.ts +12 -0
- package/dist/types/stencil-public-runtime.d.ts +1 -0
- package/package.json +2 -2
- package/scss/components/_buttons.scss +3 -6
- package/scss/components/_forms.scss +18 -12
- package/scss/mixins/shadow-dom/_component.scss +15 -0
- package/scss/mixins/shadow-dom/_hover.scss +19 -0
- package/scss/theme/classic-dark/_borderRadius.scss +1 -1
- package/dist/cjs/index-478a4b66.js.map +0 -1
- package/dist/cjs/ix-typography.cjs.entry.js.map +0 -1
- package/dist/collection/components/icon/icon.js +0 -101
- package/dist/collection/components/icon/icon.js.map +0 -1
- package/dist/collection/components/typography/types.js.map +0 -1
- package/dist/esm/index-3d163acd.js.map +0 -1
- package/dist/esm/ix-typography.entry.js.map +0 -1
- package/dist/siemens-ix/p-07fd8298.entry.js +0 -2
- package/dist/siemens-ix/p-07fd8298.entry.js.map +0 -1
- package/dist/siemens-ix/p-1666b0e2.entry.js +0 -2
- package/dist/siemens-ix/p-1666b0e2.entry.js.map +0 -1
- package/dist/siemens-ix/p-1a87eb66.entry.js +0 -2
- package/dist/siemens-ix/p-1a87eb66.entry.js.map +0 -1
- package/dist/siemens-ix/p-283686d7.entry.js +0 -2
- package/dist/siemens-ix/p-283686d7.entry.js.map +0 -1
- package/dist/siemens-ix/p-2dafa048.entry.js +0 -2
- package/dist/siemens-ix/p-2dafa048.entry.js.map +0 -1
- package/dist/siemens-ix/p-34e3a10e.entry.js +0 -2
- package/dist/siemens-ix/p-34e3a10e.entry.js.map +0 -1
- package/dist/siemens-ix/p-53c69375.entry.js +0 -2
- package/dist/siemens-ix/p-53c69375.entry.js.map +0 -1
- package/dist/siemens-ix/p-5d7e1440.entry.js +0 -2
- package/dist/siemens-ix/p-5d7e1440.entry.js.map +0 -1
- package/dist/siemens-ix/p-63e1264b.entry.js +0 -2
- package/dist/siemens-ix/p-63e1264b.entry.js.map +0 -1
- package/dist/siemens-ix/p-78f2b858.entry.js.map +0 -1
- package/dist/siemens-ix/p-7fb5fa79.entry.js +0 -2
- package/dist/siemens-ix/p-7fb5fa79.entry.js.map +0 -1
- package/dist/siemens-ix/p-88a47c9b.entry.js +0 -2
- package/dist/siemens-ix/p-88a47c9b.entry.js.map +0 -1
- package/dist/siemens-ix/p-8fcd6f85.js +0 -3
- package/dist/siemens-ix/p-8fcd6f85.js.map +0 -1
- package/dist/siemens-ix/p-caae2fa5.entry.js +0 -2
- package/dist/siemens-ix/p-caae2fa5.entry.js.map +0 -1
- package/dist/siemens-ix/p-d7a3acce.entry.js +0 -2
- package/dist/siemens-ix/p-d7a3acce.entry.js.map +0 -1
- package/dist/siemens-ix/p-d7cf7a1a.entry.js +0 -2
- package/dist/siemens-ix/p-d7cf7a1a.entry.js.map +0 -1
- package/dist/siemens-ix/p-eb301ea2.entry.js +0 -2
- package/dist/siemens-ix/p-eb301ea2.entry.js.map +0 -1
- package/dist/siemens-ix/p-f6509805.entry.js +0 -2
- package/dist/siemens-ix/p-f6509805.entry.js.map +0 -1
- package/dist/siemens-ix/p-f6c54047.entry.js +0 -2
- package/dist/siemens-ix/p-f6c54047.entry.js.map +0 -1
- package/dist/types/components/icon/icon.d.ts +0 -15
- /package/dist/siemens-ix/{p-3776a37f.entry.js.map → p-003e9355.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-afd1f351.entry.js.map → p-1331a920.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-626b3af5.entry.js.map → p-1e8ee4af.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-6bdfaf91.entry.js.map → p-3172249b.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-9546cbdd.entry.js.map → p-40982e21.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-a4a16daa.entry.js.map → p-4597dd77.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-909ccf09.entry.js.map → p-4e851aa3.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-c19c2492.entry.js.map → p-51c81a20.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-43965bd0.entry.js.map → p-6124d173.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-16ec6f50.entry.js.map → p-626fbee2.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-0f864265.entry.js.map → p-652ba2c1.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-663724a8.entry.js.map → p-821ca55e.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-eb799bdd.entry.js.map → p-8719eeff.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-4c8d5207.entry.js.map → p-94ab7c1c.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-fef2f9e0.entry.js.map → p-9a82921b.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-0e8a6997.entry.js.map → p-a08e1bbc.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-20bed29f.entry.js.map → p-a73580a5.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-2ea2fc07.entry.js.map → p-b5c40bb3.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-63666529.entry.js.map → p-bd24f35f.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-aa4141e4.entry.js.map → p-c7109071.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-4ec66090.entry.js.map → p-cf2717c1.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-dbcf33de.entry.js.map → p-d2225fc2.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-b9fbd029.entry.js.map → p-d5302336.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-13adcf62.entry.js.map → p-d784a04b.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-55d0fabf.entry.js.map → p-d7e23a1f.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-33160fe4.entry.js.map → p-dc98d3f4.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-65b6330a.entry.js.map → p-df138b2a.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-62b4d696.entry.js.map → p-eccc2475.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-7d4a7388.entry.js.map → p-ecd1145b.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-a30c7b5a.entry.js.map → p-f48b706b.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-b998abe4.entry.js.map → p-f50697b9.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-c9c9f2b5.entry.js.map → p-f74c7692.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-042b490c.entry.js.map → p-feb8c2c4.entry.js.map} +0 -0
- /package/dist/types/components/typography/{types.d.ts → type-mapping.d.ts} +0 -0
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as i,H as t}from"./p-8fcd6f85.js";const n=".sc-ix-spinner-h{display:flex;position:relative;height:2rem;width:2rem;justify-content:center;align-items:center}.sc-ix-spinner-h svg.sc-ix-spinner{height:2rem;width:2rem}.sc-ix-spinner-h #fill.sc-ix-spinner{fill:var(--theme-color-weak-text)}.sc-ix-spinner-h #stroke.sc-ix-spinner{stroke:var(--theme-color-weak-text)}.primary.sc-ix-spinner-h #fill.sc-ix-spinner{fill:var(--theme-color-primary)}.primary.sc-ix-spinner-h #stroke.sc-ix-spinner{stroke:var(--theme-color-primary)}.large.sc-ix-spinner-h{height:6rem;width:6rem}.large.sc-ix-spinner-h svg.sc-ix-spinner{height:5.75rem;width:6rem}";const s=class{constructor(i){e(this,i);this.variant="secondary";this.size="medium"}render(){return i(t,{class:{primary:this.variant==="primary",large:this.size==="large"}},i("svg",{viewBox:"0 0 32 32",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},i("g",{id:"waiting-anim",stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},i("g",{id:"stroke",transform:"translate(4.5, 3)","fill-rule":"nonzero",stroke:"#0F8287","stroke-linejoin":"round"},i("polygon",{id:"w1",points:"11.2583302 0 11.2583302 6.5 11.2583302 13",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"0s;w6ul.end",to:"visible"}),i("animate",{id:"w1l",attributeName:"points",calcMode:"spline",begin:"0s;w6ul.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 0 11.2583302 6.5 11.2583302 13",to:"11.2583302 0 22.5166605 6.5 11.2583302 13",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"w1ul",attributeName:"points",calcMode:"spline",begin:"f6uf.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 0 22.5166605 6.5 11.2583302 13",to:"16.88749535 9.25 22.5166605 6.5 11.2583302 13",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"w1ul.end",to:"hidden"})),i("polygon",{id:"w2",points:"22.5166605 6.5 16.88749535 10 11.2583302 13",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"w1l.end",to:"visible"}),i("animate",{id:"w2l",attributeName:"points",calcMode:"spline",begin:"w1l.end",dur:"0.4s",keyTimes:"0;1",from:"22.5166605 6.5 16.88749535 10 11.2583302 13",to:"22.5166605 6.5 22.5166605 19.5 11.2583302 13",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"w2ul",attributeName:"points",calcMode:"spline",begin:"w1ul.end",dur:"0.4s",keyTimes:"0;1",from:"22.5166605 6.5 22.5166605 19.5 11.2583302 13",to:"16.88749535 16.25 22.5166605 19.5 11.2583302 13",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"w2ul.end",to:"hidden"})),i("polygon",{id:"w3",points:"11.2583302 13 22.5166605 19.5 16.88749535 16.75",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"w2l.end",to:"visible"}),i("animate",{id:"w3l",attributeName:"points",calcMode:"spline",begin:"w2l.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 22.5166605 19.5 16.88749535 16.75",to:"11.2583302 13 22.5166605 19.5 11.2583302 26",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"w3ul",attributeName:"points",calcMode:"spline",begin:"w2ul.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 22.5166605 19.5 11.2583302 26",to:"11.2583302 13 11.2583302 19.5 11.2583302 26",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"w3ul.end",to:"hidden"})),i("polygon",{id:"w4",points:"11.2583302 26 11.2583302 19.5 11.2583302 13",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"w3l.end",to:"visible"}),i("animate",{id:"w4l",attributeName:"points",calcMode:"spline",begin:"w3l.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 26 11.2583302 19.5 11.2583302 13",to:"11.2583302 26 4.4408921e-15 19.5 11.2583302 13",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"w4ul",attributeName:"points",calcMode:"spline",begin:"w3ul.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 26 4.4408921e-15 19.5 11.2583302 13",to:"5.62651 16.25 4.4408921e-15 19.5 11.2583302 13",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"w4ul.end",to:"hidden"})),i("polygon",{id:"w5",points:"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"w4l.end",to:"visible"}),i("animate",{id:"w5l",attributeName:"points",calcMode:"spline",begin:"w4l.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25",to:"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"w5ul",attributeName:"points",calcMode:"spline",begin:"w4ul.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5",to:"11.2583302 13 5.6291651 9.75 1.687539e-14 6.5",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"w5ul.end",to:"hidden"})),i("polygon",{id:"w6",points:"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"w5l.end",to:"visible"}),i("animate",{id:"w6l",attributeName:"points",calcMode:"spline",begin:"w5l.end",dur:"0.4s",keyTimes:"0;1",from:"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5",to:"11.2583302 0 11.2583302 13 2.66453526e-15 6.5",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"w6ul",attributeName:"points",calcMode:"spline",begin:"w5ul.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 0 11.2583302 13 2.66453526e-15 6.5",to:"11.2583302 0 11.2583302 13 11.2583302 6.5",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"w6ul.end",to:"hidden"}))),i("g",{id:"fill",transform:"translate(4.5, 3)",fill:"#0F8287","fill-rule":"nonzero"},i("polygon",{id:"f1",points:"11.2583302 0 11.2583302 6.5 11.2583302 13",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"w6l.end",to:"visible"}),i("animate",{id:"f1f",attributeName:"points",calcMode:"spline",begin:"w6l.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 0 11.2583302 6.5 11.2583302 13",to:"11.2583302 0 22.5166605 6.5 11.2583302 13",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"f1uf",attributeName:"points",calcMode:"spline",begin:"f6f.end + 0.2s",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 0 22.5166605 6.5 11.2583302 13",to:"16.88749535 9.25 22.5166605 6.5 11.2583302 13",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"f1uf.end",to:"hidden"})),i("polygon",{id:"f2",points:"22.5166605 6.5 16.88749535 10 11.2583302 13",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"f1f.end",to:"visible"}),i("animate",{id:"f2f",attributeName:"points",calcMode:"spline",begin:"f1f.end",dur:"0.4s",keyTimes:"0;1",from:"22.5166605 6.5 16.88749535 10 11.2583302 13",to:"22.5166605 6.5 22.5166605 19.5 11.2583302 13",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"f2uf",attributeName:"points",calcMode:"spline",begin:"f1uf.end",dur:"0.4s",keyTimes:"0;1",from:"22.5166605 6.5 22.5166605 19.5 11.2583302 13",to:"16.88749535 16.25 22.5166605 19.5 11.2583302 13",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"f2uf.end",to:"hidden"})),i("polygon",{id:"f3",points:"11.2583302 13 22.5166605 19.5 16.88749535 16.75",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"f2f.end",to:"visible"}),i("animate",{id:"f3f",attributeName:"points",calcMode:"spline",begin:"f2f.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 22.5166605 19.5 16.88749535 16.75",to:"11.2583302 13 22.5166605 19.5 11.2583302 26",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"f3uf",attributeName:"points",calcMode:"spline",begin:"f2uf.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 22.5166605 19.5 11.2583302 26",to:"11.2583302 13 11.2583302 19.5 11.2583302 26",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"f3uf.end",to:"hidden"})),i("polygon",{id:"f4",points:"11.2583302 26 11.2583302 19.5 11.2583302 13",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"f3f.end",to:"visible"}),i("animate",{id:"f4f",attributeName:"points",calcMode:"spline",begin:"f3f.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 26 11.2583302 19.5 11.2583302 13",to:"11.2583302 26 4.4408921e-15 19.5 11.2583302 13",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"f4uf",attributeName:"points",calcMode:"spline",begin:"f3uf.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 26 4.4408921e-15 19.5 11.2583302 13",to:"5.62651 16.25 4.4408921e-15 19.5 11.2583302 13",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"f4uf.end",to:"hidden"})),i("polygon",{id:"f5",points:"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"f4f.end",to:"visible"}),i("animate",{id:"f5f",attributeName:"points",calcMode:"spline",begin:"f4f.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25",to:"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"f5uf",attributeName:"points",calcMode:"spline",begin:"f4uf.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5",to:"11.2583302 13 5.6291651 9.75 1.687539e-14 6.5",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"f5uf.end",to:"hidden"})),i("polygon",{id:"f6",points:"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5",visibility:"hidden"},i("set",{attributeName:"visibility",begin:"f5f.end",to:"visible"}),i("animate",{id:"f6f",attributeName:"points",calcMode:"spline",begin:"f5f.end",dur:"0.4s",keyTimes:"0;1",from:"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5",to:"11.2583302 0 11.2583302 13 2.66453526e-15 6.5",keySplines:"1 0 0.8 1",fill:"freeze"}),i("animate",{id:"f6uf",attributeName:"points",calcMode:"spline",begin:"f5uf.end",dur:"0.4s",keyTimes:"0;1",from:"11.2583302 0 11.2583302 13 2.66453526e-15 6.5",to:"11.2583302 0 11.2583302 13 11.2583302 6.5",keySplines:"0.2 0 0 1",fill:"freeze"}),i("set",{attributeName:"visibility",begin:"f6uf.end",to:"hidden"}))))))}};s.style=n;export{s as ix_spinner};
|
|
2
|
-
//# sourceMappingURL=p-1a87eb66.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["spinnerCss","Spinner","render","h","Host","class","primary","this","variant","large","size","viewBox","version","xmlns","id","stroke","fill","transform","points","visibility","attributeName","begin","to","calcMode","dur","keyTimes","from","keySplines"],"sources":["./src/components/spinner/spinner.scss?tag=ix-spinner&encapsulation=scoped","./src/components/spinner/spinner.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: flex;\n position: relative;\n height: 2rem;\n width: 2rem;\n justify-content: center;\n align-items: center;\n\n svg {\n height: 2rem;\n width: 2rem;\n }\n\n #fill {\n fill: var(--theme-color-weak-text);\n }\n\n #stroke {\n stroke: var(--theme-color-weak-text);\n }\n}\n\n:host(.primary) {\n #fill {\n fill: var(--theme-color-primary);\n }\n\n #stroke {\n stroke: var(--theme-color-primary);\n }\n}\n\n:host(.large) {\n height: 6rem;\n width: 6rem;\n\n svg {\n height: 5.75rem;\n width: 6rem;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-spinner',\n styleUrl: 'spinner.scss',\n scoped: true,\n})\nexport class Spinner {\n /**\n * Variant of spinner\n */\n @Prop() variant: 'primary' | 'sencodary' | 'secondary' = 'secondary';\n\n /**\n * Size of spinner\n */\n @Prop() size: 'medium' | 'large' = 'medium';\n\n render() {\n return (\n <Host\n class={{\n primary: this.variant === 'primary',\n large: this.size === 'large',\n }}\n >\n <svg\n viewBox=\"0 0 32 32\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <g\n id=\"waiting-anim\"\n stroke=\"none\"\n stroke-width=\"1\"\n fill=\"none\"\n fill-rule=\"evenodd\"\n >\n <g\n id=\"stroke\"\n transform=\"translate(4.5, 3)\"\n fill-rule=\"nonzero\"\n stroke=\"#0F8287\"\n stroke-linejoin=\"round\"\n >\n <polygon\n id=\"w1\"\n points=\"11.2583302 0 11.2583302 6.5 11.2583302 13\"\n visibility=\"hidden\"\n >\n <set\n attributeName=\"visibility\"\n begin=\"0s;w6ul.end\"\n to=\"visible\"\n />\n <animate\n id=\"w1l\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"0s;w6ul.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 0 11.2583302 6.5 11.2583302 13\"\n to=\"11.2583302 0 22.5166605 6.5 11.2583302 13\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"w1ul\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f6uf.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 0 22.5166605 6.5 11.2583302 13\"\n to=\"16.88749535 9.25 22.5166605 6.5 11.2583302 13\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"w1ul.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"w2\"\n points=\"22.5166605 6.5 16.88749535 10 11.2583302 13\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"w1l.end\" to=\"visible\" />\n <animate\n id=\"w2l\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w1l.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"22.5166605 6.5 16.88749535 10 11.2583302 13\"\n to=\"22.5166605 6.5 22.5166605 19.5 11.2583302 13\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"w2ul\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w1ul.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"22.5166605 6.5 22.5166605 19.5 11.2583302 13\"\n to=\"16.88749535 16.25 22.5166605 19.5 11.2583302 13\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"w2ul.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"w3\"\n points=\"11.2583302 13 22.5166605 19.5 16.88749535 16.75\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"w2l.end\" to=\"visible\" />\n <animate\n id=\"w3l\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w2l.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 22.5166605 19.5 16.88749535 16.75\"\n to=\"11.2583302 13 22.5166605 19.5 11.2583302 26\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"w3ul\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w2ul.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 22.5166605 19.5 11.2583302 26\"\n to=\"11.2583302 13 11.2583302 19.5 11.2583302 26\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"w3ul.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"w4\"\n points=\"11.2583302 26 11.2583302 19.5 11.2583302 13\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"w3l.end\" to=\"visible\" />\n <animate\n id=\"w4l\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w3l.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 26 11.2583302 19.5 11.2583302 13\"\n to=\"11.2583302 26 4.4408921e-15 19.5 11.2583302 13\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"w4ul\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w3ul.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 26 4.4408921e-15 19.5 11.2583302 13\"\n to=\"5.62651 16.25 4.4408921e-15 19.5 11.2583302 13\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"w4ul.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"w5\"\n points=\"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"w4l.end\" to=\"visible\" />\n <animate\n id=\"w5l\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w4l.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25\"\n to=\"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"w5ul\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w4ul.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5\"\n to=\"11.2583302 13 5.6291651 9.75 1.687539e-14 6.5\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"w5ul.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"w6\"\n points=\"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"w5l.end\" to=\"visible\" />\n <animate\n id=\"w6l\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w5l.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5\"\n to=\"11.2583302 0 11.2583302 13 2.66453526e-15 6.5\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"w6ul\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w5ul.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 0 11.2583302 13 2.66453526e-15 6.5\"\n to=\"11.2583302 0 11.2583302 13 11.2583302 6.5\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"w6ul.end\" to=\"hidden\" />\n </polygon>\n </g>\n <g\n id=\"fill\"\n transform=\"translate(4.5, 3)\"\n fill=\"#0F8287\"\n fill-rule=\"nonzero\"\n >\n <polygon\n id=\"f1\"\n points=\"11.2583302 0 11.2583302 6.5 11.2583302 13\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"w6l.end\" to=\"visible\" />\n <animate\n id=\"f1f\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"w6l.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 0 11.2583302 6.5 11.2583302 13\"\n to=\"11.2583302 0 22.5166605 6.5 11.2583302 13\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"f1uf\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f6f.end + 0.2s\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 0 22.5166605 6.5 11.2583302 13\"\n to=\"16.88749535 9.25 22.5166605 6.5 11.2583302 13\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"f1uf.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"f2\"\n points=\"22.5166605 6.5 16.88749535 10 11.2583302 13\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"f1f.end\" to=\"visible\" />\n <animate\n id=\"f2f\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f1f.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"22.5166605 6.5 16.88749535 10 11.2583302 13\"\n to=\"22.5166605 6.5 22.5166605 19.5 11.2583302 13\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"f2uf\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f1uf.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"22.5166605 6.5 22.5166605 19.5 11.2583302 13\"\n to=\"16.88749535 16.25 22.5166605 19.5 11.2583302 13\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"f2uf.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"f3\"\n points=\"11.2583302 13 22.5166605 19.5 16.88749535 16.75\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"f2f.end\" to=\"visible\" />\n <animate\n id=\"f3f\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f2f.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 22.5166605 19.5 16.88749535 16.75\"\n to=\"11.2583302 13 22.5166605 19.5 11.2583302 26\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"f3uf\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f2uf.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 22.5166605 19.5 11.2583302 26\"\n to=\"11.2583302 13 11.2583302 19.5 11.2583302 26\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"f3uf.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"f4\"\n points=\"11.2583302 26 11.2583302 19.5 11.2583302 13\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"f3f.end\" to=\"visible\" />\n <animate\n id=\"f4f\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f3f.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 26 11.2583302 19.5 11.2583302 13\"\n to=\"11.2583302 26 4.4408921e-15 19.5 11.2583302 13\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"f4uf\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f3uf.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 26 4.4408921e-15 19.5 11.2583302 13\"\n to=\"5.62651 16.25 4.4408921e-15 19.5 11.2583302 13\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"f4uf.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"f5\"\n points=\"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"f4f.end\" to=\"visible\" />\n <animate\n id=\"f5f\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f4f.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 2.4062463e-14 19.5 5.6291651 16.25\"\n to=\"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"f5uf\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f4uf.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 13 2.4062463e-14 19.5 1.687539e-14 6.5\"\n to=\"11.2583302 13 5.6291651 9.75 1.687539e-14 6.5\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"f5uf.end\" to=\"hidden\" />\n </polygon>\n\n <polygon\n id=\"f6\"\n points=\"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5\"\n visibility=\"hidden\"\n >\n <set attributeName=\"visibility\" begin=\"f5f.end\" to=\"visible\" />\n <animate\n id=\"f6f\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f5f.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"5.6291651 9.75 11.2583302 13 2.66453526e-15 6.5\"\n to=\"11.2583302 0 11.2583302 13 2.66453526e-15 6.5\"\n keySplines=\"1 0 0.8 1\"\n fill=\"freeze\"\n />\n <animate\n id=\"f6uf\"\n attributeName=\"points\"\n calcMode=\"spline\"\n begin=\"f5uf.end\"\n dur=\"0.4s\"\n keyTimes=\"0;1\"\n from=\"11.2583302 0 11.2583302 13 2.66453526e-15 6.5\"\n to=\"11.2583302 0 11.2583302 13 11.2583302 6.5\"\n keySplines=\"0.2 0 0 1\"\n fill=\"freeze\"\n />\n <set attributeName=\"visibility\" begin=\"f6uf.end\" to=\"hidden\" />\n </polygon>\n </g>\n </g>\n </svg>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as i,h as t,H as a,g as n}from"./p-8fcd6f85.js";import{a as o}from"./p-810b5232.js";const s=".sc-ix-map-navigation-h{display:flex;position:relative;width:100%;height:100%}.sc-ix-map-navigation-h .map-nav.sc-ix-map-navigation{display:flex;margin-left:4rem;position:relative;height:100%;flex-grow:1;overflow:hidden}.sc-ix-map-navigation-h .map-nav-sidebar.sc-ix-map-navigation{display:flex;flex-direction:column;align-items:center;width:29.75rem;max-width:29.75rem;min-width:29.75rem;height:100%;left:4rem;background-color:var(--theme-map-navigation--background);-webkit-border-end:0.125rem solid var(--theme-map-navigation-separator--background);border-inline-end:0.125rem solid var(--theme-map-navigation-separator--background);z-index:99}.sc-ix-map-navigation-h .map-nav-sidebar-content.sc-ix-map-navigation{align-items:center;position:relative;overflow:auto;height:100%;width:100%}.sc-ix-map-navigation-h .map-nav-sidebar-content.sc-ix-map-navigation .map-nav-sidebar-static-content.sc-ix-map-navigation{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);display:flex;justify-content:space-between;margin-top:0.437rem;margin-bottom:0.812rem;margin-left:1rem;margin-right:1rem}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation{display:flex;position:relative;align-items:center;height:3.5rem;min-height:3.5rem;width:100%}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation{background-color:var(--theme-map-navigation-background);display:flex;align-items:center;height:100%;width:100%;padding:0 1rem;--theme-app-header--color:var(--theme-map-navigation-header--color);--theme-app-header-logo--color:var(--theme-map-navigation-logo--color)}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation button.sc-ix-map-navigation{margin-left:1rem}.sc-ix-map-navigation-h .map-nav-header-content.sc-ix-map-navigation{display:flex;height:3.5rem;align-items:center;overflow:hidden;padding:0 1rem}.sc-ix-map-navigation-h .map-nav-header-content.sc-ix-map-navigation:empty{height:0}.sc-ix-map-navigation-h .map-nav-title.sc-ix-map-navigation{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);display:flex;align-items:center;flex-grow:1}.sc-ix-map-navigation-h .content.sc-ix-map-navigation{display:block;flex-grow:1;position:relative;height:100%;overflow:hidden;z-index:calc(var(--theme-z-index-sticky) - 1)}";const r=class{constructor(t){e(this,t);this.navigationToggled=i(this,"navigationToggled",7);this.contextMenuClick=i(this,"contextMenuClick",7);this.applicationName=undefined;this.navigationTitle=undefined;this.hideContextMenu=true;this.isSidebarOpen=true}get menu(){return this.hostElement.querySelector("ix-menu")}get menuOverlay(){return this.hostElement.querySelector("ix-menu-overlay")}get mapNavMenu(){return this.hostElement.querySelector(".map-nav-menu")}get sidebar(){return this.hostElement.querySelector(".map-nav-sidebar")}get overlay(){return this.hostElement.querySelector("#overlay")}componentDidRender(){this.appendMenu();this.closeOverlay()}appendMenu(){this.hostElement.querySelector("#menu-placeholder").appendChild(this.menu);this.menu.addEventListener("mapExpandChange",(e=>{const i=!e.detail;this.toggleSidebar(i);this.menu.toggleMapExpand(i)}));this.menu.enableMapExpand=true}toggleSidebar(e){if(e!==undefined){this.isSidebarOpen=e}else{this.isSidebarOpen=!this.isSidebarOpen}if(e){this.openSidebar()}else{this.closeSidebar()}this.navigationToggled.emit(this.isSidebarOpen)}closeSidebar(){o({targets:this.sidebar,duration:r.defaultTime,marginLeft:[0,"-29.75rem"],opacity:[1,0],easing:"easeInSine",complete:()=>{this.sidebar.classList.add("d-none")}})}openSidebar(){o({targets:this.sidebar,duration:r.defaultTime,marginLeft:["-29.75rem",0],opacity:[0,1],easing:"easeOutSine",begin:()=>{this.sidebar.classList.remove("d-none")}})}async openOverlay(e,i,t,a){o({targets:this.overlay,duration:r.slowTime,backdropFilter:[0,"blur(1rem)"],translateX:["-4rem",0],opacity:[0,1],easing:"easeOutSine",begin:()=>{this.overlay.classList.remove("d-none")}});const n=document.createElement("ix-map-navigation-overlay");n.setAttribute("color",a);n.setAttribute("name",e);n.setAttribute("icon",t);n.setAttribute("slot","overlay");n.addEventListener("closeClick",(()=>this.closeOverlay()));n.appendChild(i);this.hostElement.appendChild(n)}async closeOverlay(){o({targets:this.overlay,duration:r.slowTime,backdropFilter:["blur(1rem)",0],translateX:[0,"-4rem"],opacity:[1,0],easing:"easeInSine",complete:()=>{var e;if(!this.overlay){return}(e=this.overlay.firstChild)===null||e===void 0?void 0:e.remove();this.overlay.classList.add("d-none")}})}render(){return t(a,null,t("div",{id:"menu-placeholder"}),t("div",{class:"map-nav"},t("div",{class:"map-nav-sidebar"},t("div",{class:"map-nav-header"},t("ix-application-header",{name:this.applicationName,class:"map-nav-header-brand"},t("slot",{name:"logo"}))),t("div",{class:"map-nav-sidebar-content"},t("div",{class:"map-nav-sidebar-static-content"},t("div",{class:"map-nav-title"},this.navigationTitle),this.hideContextMenu?"":t("ix-icon-button",{icon:"context-menu",ghost:true,size:"24",variant:"Secondary",onClick:e=>this.contextMenuClick.emit()})),t("div",{class:"map-nav-sidebar-user-content"},t("slot",{name:"sidebar-content"})))),t("div",{class:"content"},t("div",{class:"map-nav-header-content bg-2"},t("slot",{name:"content-header"})),t("main",null,t("slot",null),t("slot",{name:"overlay"})))))}get hostElement(){return n(this)}};r.defaultTime=150;r.slowTime=500;r.style=s;const l=".text-xs.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-title-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}.text-l.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-title-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}a.sc-ix-map-navigation-overlay{color:var(--theme-color-primary)}.sc-ix-map-navigation-overlay-h{position:absolute;width:100%;height:100%;z-index:2;top:0;left:0;background-color:var(--theme-overlay--background)}.sc-ix-map-navigation-overlay-h .overlay-header.sc-ix-map-navigation-overlay{display:flex;position:relative;justify-content:flex-start;align-items:center;height:3.5rem;background-color:var(--theme-overlay-header--background)}.sc-ix-map-navigation-overlay-h .overlay-header-content.sc-ix-map-navigation-overlay{display:flex;align-items:center;min-width:0}.sc-ix-map-navigation-overlay-h .overlay-header-content.sc-ix-map-navigation-overlay ix-icon.sc-ix-map-navigation-overlay{-webkit-margin-start:1rem;margin-inline-start:1rem;color:var(--theme-overlay-header--color)}.sc-ix-map-navigation-overlay-h .overlay-header-content.sc-ix-map-navigation-overlay .overlay-header-title.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-overlay-header--color);-webkit-margin-start:1rem;margin-inline-start:1rem}.sc-ix-map-navigation-overlay-h .color-indicator.sc-ix-map-navigation-overlay{display:inline-block;position:relative;width:0.5rem;height:100%;background-color:var(--theme-color-neutral)}.sc-ix-map-navigation-overlay-h .overlay-close.sc-ix-map-navigation-overlay{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:1rem;margin-inline-end:1rem}";const m=class{constructor(t){e(this,t);this.closeClick=i(this,"closeClick",7);this.name=undefined;this.icon=undefined;this.color=undefined}componentWillLoad(){o({targets:this.hostElement,duration:m.slowTime,backdropFilter:[0,"blur(1rem)"],translateX:["-4rem",0],opacity:[0,1],easing:"easeOutSine",begin:()=>{this.hostElement.classList.remove("d-none")}})}closeOverlay(){o({targets:this.hostElement,duration:m.slowTime,backdropFilter:["blur(1rem)",0],translateX:[0,"-4rem"],opacity:[1,0],easing:"easeInSine",complete:()=>{this.closeClick.emit();this.hostElement.classList.add("d-none")}})}render(){return t(a,null,t("div",{class:"overlay-header"},t("div",{class:{"color-indicator":true,"d-none":this.color==="undefined"||this.color===undefined},style:{"background-color":this.color?`var(--theme-${this.color})`:""}}),t("div",{class:"overlay-header-content"},t("ix-icon",{size:"32",name:this.icon}),t("span",{class:"overlay-header-title",title:this.name},this.name)),t("ix-icon-button",{class:"overlay-close",ghost:true,icon:"close",size:"24",onClick:()=>this.closeOverlay()})),t("slot",null))}get hostElement(){return n(this)}};m.slowTime=500;m.style=l;export{r as ix_map_navigation,m as ix_map_navigation_overlay};
|
|
2
|
-
//# sourceMappingURL=p-283686d7.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["mapNavigationCss","MapNavigation","menu","this","hostElement","querySelector","menuOverlay","mapNavMenu","sidebar","overlay","componentDidRender","appendMenu","closeOverlay","appendChild","addEventListener","event","state","detail","toggleSidebar","toggleMapExpand","enableMapExpand","show","undefined","isSidebarOpen","openSidebar","closeSidebar","navigationToggled","emit","anime","targets","duration","defaultTime","marginLeft","opacity","easing","complete","classList","add","begin","remove","async","name","component","icon","color","slowTime","backdropFilter","translateX","overlayInstance","document","createElement","setAttribute","_a","firstChild","render","h","Host","id","class","applicationName","navigationTitle","hideContextMenu","ghost","size","variant","onClick","_","contextMenuClick","mapNavigationOverlayCss","MapNavigationOverlay","componentWillLoad","closeClick","style","title"],"sources":["./src/components/map-navigation/map-navigation.scss?tag=ix-map-navigation&encapsulation=scoped","./src/components/map-navigation/map-navigation.tsx","./src/components/map-navigation-overlay/map-navigation-overlay.scss?tag=ix-map-navigation-overlay&encapsulation=scoped","./src/components/map-navigation-overlay/map-navigation-overlay.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/fonts';\n@import 'mixins/text-truncation';\n\n:host {\n $appHeaderHeight: 3.5rem;\n $appHeaderGradientHeight: 4rem;\n $navHeaderHeight: 11.5rem;\n $sidebarWidth: 29.75rem;\n\n display: flex;\n position: relative;\n width: 100%;\n height: 100%;\n\n .map-nav {\n display: flex;\n margin-left: 4rem;\n position: relative;\n height: 100%;\n flex-grow: 1;\n overflow: hidden;\n }\n\n .map-nav-sidebar {\n display: flex;\n flex-direction: column;\n align-items: center;\n width: $sidebarWidth;\n max-width: $sidebarWidth;\n min-width: $sidebarWidth;\n height: 100%;\n left: 4rem;\n background-color: var(--theme-map-navigation--background);\n border-inline-end: 0.125rem solid\n var(--theme-map-navigation-separator--background);\n z-index: 99;\n }\n\n .map-nav-sidebar-content {\n align-items: center;\n position: relative;\n overflow: auto;\n height: 100%;\n width: 100%;\n\n .map-nav-sidebar-static-content {\n @include text-h2;\n display: flex;\n justify-content: space-between;\n margin-top: 0.437rem;\n margin-bottom: 0.812rem;\n margin-left: $default-space;\n margin-right: $default-space;\n }\n }\n\n .map-nav-header {\n display: flex;\n position: relative;\n align-items: center;\n height: $appHeaderHeight;\n min-height: $appHeaderHeight;\n width: 100%;\n\n .map-nav-header-brand {\n background-color: var(--theme-map-navigation-background);\n display: flex;\n align-items: center;\n height: 100%;\n width: 100%;\n padding: 0 $default-space;\n\n --theme-app-header--color: var(--theme-map-navigation-header--color);\n --theme-app-header-logo--color: var(--theme-map-navigation-logo--color);\n\n button {\n margin-left: $default-space;\n }\n }\n }\n\n .map-nav-header-content {\n display: flex;\n height: $appHeaderHeight;\n align-items: center;\n overflow: hidden;\n padding: 0 $default-space;\n\n &:empty {\n height: 0;\n }\n }\n\n .map-nav-title {\n @include text-h2();\n\n display: flex;\n align-items: center;\n flex-grow: 1;\n }\n\n .content {\n display: block;\n flex-grow: 1;\n position: relative;\n height: 100%;\n overflow: hidden;\n z-index: calc(var(--theme-z-index-sticky) - 1);\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n tag: 'ix-map-navigation',\n styleUrl: 'map-navigation.scss',\n scoped: true,\n})\nexport class MapNavigation {\n private static readonly defaultTime = 150;\n private static readonly slowTime = 500;\n\n @Element() hostElement: HTMLIxMapNavigationElement;\n\n /**\n * Application name\n */\n @Prop() applicationName: string;\n\n /**\n * Navigation title\n */\n @Prop() navigationTitle: string;\n\n /**\n * Hide the sidebar context menu button when set to true\n */\n @Prop() hideContextMenu = true;\n\n @State() isSidebarOpen = true;\n\n /**\n * Navigation toggled\n */\n @Event() navigationToggled: EventEmitter<boolean>;\n\n /**\n * Context menu clicked\n */\n @Event() contextMenuClick: EventEmitter<void>;\n\n get menu() {\n return this.hostElement.querySelector('ix-menu');\n }\n\n get menuOverlay() {\n return this.hostElement.querySelector('ix-menu-overlay');\n }\n\n get mapNavMenu() {\n return this.hostElement.querySelector('.map-nav-menu');\n }\n\n get sidebar() {\n return this.hostElement.querySelector('.map-nav-sidebar');\n }\n\n get overlay() {\n return this.hostElement.querySelector('#overlay');\n }\n\n componentDidRender() {\n this.appendMenu();\n this.closeOverlay();\n }\n\n private appendMenu() {\n this.hostElement.querySelector('#menu-placeholder').appendChild(this.menu);\n this.menu.addEventListener(\n 'mapExpandChange',\n (event: CustomEvent<boolean>) => {\n const state = !event.detail;\n this.toggleSidebar(state);\n this.menu.toggleMapExpand(state);\n }\n );\n this.menu.enableMapExpand = true;\n }\n\n private toggleSidebar(show: boolean) {\n if (show !== undefined) {\n this.isSidebarOpen = show;\n } else {\n this.isSidebarOpen = !this.isSidebarOpen;\n }\n\n if (show) {\n this.openSidebar();\n } else {\n this.closeSidebar();\n }\n\n this.navigationToggled.emit(this.isSidebarOpen);\n }\n\n private closeSidebar() {\n anime({\n targets: this.sidebar,\n duration: MapNavigation.defaultTime,\n marginLeft: [0, '-29.75rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n this.sidebar.classList.add('d-none');\n },\n });\n }\n\n private openSidebar() {\n anime({\n targets: this.sidebar,\n duration: MapNavigation.defaultTime,\n marginLeft: ['-29.75rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.sidebar.classList.remove('d-none');\n },\n });\n }\n\n /**\n * Open a overlay inside content area\n * @deprecated Will be removed in 2.0.0. Use slot based approach\n *\n * @param name\n * @param component\n * @param icon\n * @param color\n */\n @Method()\n async openOverlay(\n name: string,\n component: HTMLElement,\n icon?: string,\n color?: string\n ) {\n anime({\n targets: this.overlay,\n duration: MapNavigation.slowTime,\n backdropFilter: [0, 'blur(1rem)'],\n translateX: ['-4rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.overlay.classList.remove('d-none');\n },\n });\n\n const overlayInstance = document.createElement('ix-map-navigation-overlay');\n overlayInstance.setAttribute('color', color);\n overlayInstance.setAttribute('name', name);\n overlayInstance.setAttribute('icon', icon);\n overlayInstance.setAttribute('slot', 'overlay');\n overlayInstance.addEventListener('closeClick', () => this.closeOverlay());\n overlayInstance.appendChild(component);\n this.hostElement.appendChild(overlayInstance);\n }\n\n /**\n * Close current shown overlay\n * @deprecated Will be removed in 2.0.0. Use slot based approach\n */\n @Method()\n async closeOverlay() {\n anime({\n targets: this.overlay,\n duration: MapNavigation.slowTime,\n backdropFilter: ['blur(1rem)', 0],\n translateX: [0, '-4rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n if (!this.overlay) {\n return;\n }\n this.overlay.firstChild?.remove();\n this.overlay.classList.add('d-none');\n },\n });\n }\n\n render() {\n return (\n <Host>\n <div id=\"menu-placeholder\"></div>\n <div class=\"map-nav\">\n <div class=\"map-nav-sidebar\">\n <div class=\"map-nav-header\">\n <ix-application-header\n name={this.applicationName}\n class=\"map-nav-header-brand\"\n >\n <slot name=\"logo\"></slot>\n </ix-application-header>\n </div>\n <div class=\"map-nav-sidebar-content\">\n <div class=\"map-nav-sidebar-static-content\">\n <div class=\"map-nav-title\">{this.navigationTitle}</div>\n {this.hideContextMenu ? (\n ''\n ) : (\n <ix-icon-button\n icon=\"context-menu\"\n ghost\n size=\"24\"\n variant=\"Secondary\"\n onClick={(_) => this.contextMenuClick.emit()}\n ></ix-icon-button>\n )}\n </div>\n <div class=\"map-nav-sidebar-user-content\">\n <slot name=\"sidebar-content\"></slot>\n </div>\n </div>\n </div>\n <div class=\"content\">\n <div class=\"map-nav-header-content bg-2\">\n <slot name=\"content-header\"></slot>\n </div>\n <main>\n <slot></slot>\n <slot name=\"overlay\"></slot>\n </main>\n </div>\n </div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'common-variables';\n@import 'fonts';\n@import 'mixins/text-truncation';\n\n:host {\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n top: 0;\n left: 0;\n\n background-color: var(--theme-overlay--background);\n\n .overlay-header {\n display: flex;\n position: relative;\n justify-content: flex-start;\n align-items: center;\n height: 3.5rem;\n\n background-color: var(--theme-overlay-header--background);\n }\n\n .overlay-header-content {\n display: flex;\n align-items: center;\n min-width: 0;\n\n ix-icon {\n margin-inline-start: $default-space;\n color: var(--theme-overlay-header--color);\n }\n\n .overlay-header-title {\n @include text-h2;\n @include ellipsis;\n color: var(--theme-overlay-header--color);\n margin-inline-start: $default-space;\n }\n }\n\n .color-indicator {\n display: inline-block;\n position: relative;\n width: $small-space;\n height: 100%;\n background-color: var(--theme-color-neutral);\n }\n\n .overlay-close {\n margin-inline-start: auto;\n margin-inline-end: $default-space;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n tag: 'ix-map-navigation-overlay',\n styleUrl: 'map-navigation-overlay.scss',\n scoped: true,\n})\nexport class MapNavigationOverlay {\n private static readonly slowTime = 500;\n\n @Element() hostElement: HTMLIxMapNavigationOverlayElement;\n\n /**\n * Title of overlay\n */\n @Prop() name: string;\n\n /**\n * Icon of overlay\n */\n @Prop() icon: string;\n\n /**\n * Color of icon\n */\n @Prop() color: string;\n\n /**\n * Event closed\n */\n @Event() closeClick: EventEmitter;\n\n componentWillLoad() {\n anime({\n targets: this.hostElement,\n duration: MapNavigationOverlay.slowTime,\n backdropFilter: [0, 'blur(1rem)'],\n translateX: ['-4rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.hostElement.classList.remove('d-none');\n },\n });\n }\n\n private closeOverlay() {\n anime({\n targets: this.hostElement,\n duration: MapNavigationOverlay.slowTime,\n backdropFilter: ['blur(1rem)', 0],\n translateX: [0, '-4rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n this.closeClick.emit();\n this.hostElement.classList.add('d-none');\n },\n });\n }\n\n render() {\n return (\n <Host>\n <div class=\"overlay-header\">\n <div\n class={{\n 'color-indicator': true,\n 'd-none': this.color === 'undefined' || this.color === undefined,\n }}\n style={{\n 'background-color': this.color\n ? `var(--theme-${this.color})`\n : '',\n }}\n ></div>\n <div class=\"overlay-header-content\">\n <ix-icon size=\"32\" name={this.icon}></ix-icon>\n <span class=\"overlay-header-title\" title={this.name}>\n {this.name}\n </span>\n </div>\n <ix-icon-button\n class=\"overlay-close\"\n ghost\n icon=\"close\"\n size=\"24\"\n onClick={() => this.closeOverlay()}\n ></ix-icon-button>\n </div>\n\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as i,H as s}from"./p-8fcd6f85.js";import{g as n}from"./p-5b39e04e.js";const e=".disabled.sc-ix-icon-button-h{pointer-events:none}.sc-ix-icon-button-h .icon-button.sc-ix-icon-button{padding:0;overflow:hidden}";const o=class{constructor(i){t(this,i);this.variant="Secondary";this.outline=undefined;this.invisible=undefined;this.ghost=undefined;this.oval=undefined;this.icon=undefined;this.size="24";this.color=undefined;this.selected=false;this.disabled=false;this.type="button"}getIconButtonClasses(){return Object.assign(Object.assign({},n(this.variant,this.outline,this.ghost||this.invisible,true,this.oval,this.selected,this.disabled)),{"icon-button":true,"btn-icon-12":this.size==="12","btn-icon-16":this.size==="16","btn-icon-32":this.size==="32"||this.size==="24"||!this.size})}render(){return i(s,{class:{disabled:this.disabled}},i("button",{class:this.getIconButtonClasses(),type:this.type},i("ix-icon",{size:this.size,name:this.icon,color:this.color}),i("div",{style:{display:"none"}},i("slot",null))))}};o.style=e;export{o as ix_icon_button};
|
|
2
|
-
//# sourceMappingURL=p-2dafa048.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["iconButtonCss","IconButton","getIconButtonClasses","Object","assign","getButtonClasses","this","variant","outline","ghost","invisible","oval","selected","disabled","size","render","h","Host","class","type","name","icon","color","style","display"],"sources":["./src/components/icon-button/icon-button.scss?tag=ix-icon-button&encapsulation=scoped","./src/components/icon-button/icon-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n:host {\n &.disabled {\n pointer-events: none;\n }\n\n .icon-button {\n padding: 0;\n overflow: hidden;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\nimport { getButtonClasses } from '../button/base-button';\nimport { Button, ButtonVariant } from '../button/button';\n\nexport type IconButtonVariant = ButtonVariant;\n\n@Component({\n tag: 'ix-icon-button',\n styleUrl: 'icon-button.scss',\n scoped: true,\n})\nexport class IconButton implements Button {\n /**\n * Variant of button\n */\n @Prop() variant: IconButtonVariant = 'Secondary';\n\n /**\n * Button outline\n */\n @Prop() outline: boolean;\n\n /**\n * Button invisible\n *\n * @deprecated Use ghost property\n */\n @Prop() invisible: boolean;\n\n /**\n * Button invisible\n */\n @Prop() ghost: boolean;\n\n /**\n * Button in oval shape\n */\n @Prop() oval: boolean;\n\n /**\n * Button icon\n */\n @Prop() icon: string;\n\n /**\n * Size of icon in button\n */\n @Prop() size: '32' | '24' | '16' | '12' = '24';\n\n /**\n * Color of icon in button\n */\n @Prop() color: string;\n\n /**\n * Selected state only working with outline or invisible\n */\n @Prop() selected = false;\n\n /**\n * Disabled\n */\n @Prop() disabled = false;\n\n /**\n * Type of the button\n */\n @Prop() type: 'button' | 'submit' = 'button';\n\n private getIconButtonClasses() {\n return {\n ...getButtonClasses(\n this.variant,\n this.outline,\n this.ghost || this.invisible,\n true,\n this.oval,\n this.selected,\n this.disabled\n ),\n 'icon-button': true,\n 'btn-icon-12': this.size === '12',\n 'btn-icon-16': this.size === '16',\n 'btn-icon-32': this.size === '32' || this.size === '24' || !this.size,\n };\n }\n\n render() {\n return (\n <Host class={{ disabled: this.disabled }}>\n <button class={this.getIconButtonClasses()} type={this.type}>\n <ix-icon size={this.size} name={this.icon} color={this.color} />\n <div style={{ display: 'none' }}>\n <slot></slot>\n </div>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"sFAAA,MAAMA,EAAgB,mI,MCoBTC,EAAU,M,sCAIgB,Y,uHAgCK,K,mCAUvB,M,cAKA,M,UAKiB,Q,CAE5BC,uBACN,OAAAC,OAAAC,OAAAD,OAAAC,OAAA,GACKC,EACDC,KAAKC,QACLD,KAAKE,QACLF,KAAKG,OAASH,KAAKI,UACnB,KACAJ,KAAKK,KACLL,KAAKM,SACLN,KAAKO,WACN,CACD,cAAe,KACf,cAAeP,KAAKQ,OAAS,KAC7B,cAAeR,KAAKQ,OAAS,KAC7B,cAAeR,KAAKQ,OAAS,MAAQR,KAAKQ,OAAS,OAASR,KAAKQ,M,CAIrEC,SACE,OACEC,EAACC,EAAI,CAACC,MAAO,CAAEL,SAAUP,KAAKO,WAC5BG,EAAA,UAAQE,MAAOZ,KAAKJ,uBAAwBiB,KAAMb,KAAKa,MACrDH,EAAA,WAASF,KAAMR,KAAKQ,KAAMM,KAAMd,KAAKe,KAAMC,MAAOhB,KAAKgB,QACvDN,EAAA,OAAKO,MAAO,CAAEC,QAAS,SACrBR,EAAA,e"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as e,h as i,H as s,g as n,f as o}from"./p-8fcd6f85.js";import{m as a,h as r,i as m}from"./p-529d7530.js";import{a as h}from"./p-21aa3602.js";import{s as l}from"./p-1572aab3.js";import{t as c}from"./p-323d5529.js";import"./p-9ee41861.js";const u="ix-menu{display:flex;flex-direction:row;position:absolute;height:100%;min-height:22.75rem;z-index:var(--theme-z-index-sticky);width:auto}ix-menu .menu{display:flex;flex-direction:column;position:relative;width:4rem;height:100%;-webkit-padding-after:1rem;padding-block-end:1rem;overflow:hidden;background-color:var(--theme-nav--background);transition:width var(--animate-duration)}ix-menu .menu.expanded{box-shadow:var(--theme-navigation--box-shadow)}ix-menu .menu .burger-menu{margin:0.75rem 0 1rem 0.75rem}ix-menu .menu-overlay{display:block;position:absolute;width:calc(100vw - 4rem);height:100%;left:4rem;z-index:-1;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem);background-color:var(--theme-sidebar-overlay-blur);transition:all 300ms ease-out}ix-menu .menu-overlay-invisible{display:none}ix-menu .menu.expanded{width:16rem}ix-menu .menu-overlay.expanded{width:calc(100vw - 16rem);left:16rem}ix-menu #avatar-tab-placeholder{max-height:3rem}ix-menu .avatar{margin-bottom:2rem}ix-menu #cui-imprint .cui-imprint-product-name{margin-bottom:1rem}ix-menu #cui-imprint .cui-imprint-product-description{margin-bottom:2rem}ix-menu #cui-imprint .cui-imprint-link-container{display:flex;align-items:center}ix-menu .bottom-tab-divider{margin-top:auto}ix-menu.mode-mobile .menu:not(.expanded){width:0}ix-menu.mode-mobile .menu{padding-top:2rem}ix-menu.mode-mobile .menu .burger-menu{display:none}ix-menu.mode-mobile .menu-overlay{left:0px;width:100vw}a[href]:has(>ix-menu-item){text-decoration:none}";const d=class{constructor(i){t(this,i);this.expandChange=e(this,"expandChange",7);this.mapExpandChange=e(this,"mapExpandChange",7);this.domObserver=new MutationObserver(this.onDomChange.bind(this));this.isVisible=t=>{var e,i;return t.style.display!=="none"&&((i=(e=t.parentElement)===null||e===void 0?void 0:e.parentElement)===null||i===void 0?void 0:i.style.display)!=="none"};this.showSettings=false;this.showAbout=false;this.enableToggleTheme=false;this.enableSettings=true;this.enableMapExpand=false;this.applicationName=undefined;this.applicationDescription="";this.maxVisibleMenuItems=9;this.i18nLegal="About & legal information";this.i18nSettings="Settings";this.i18nToggleTheme="Toggle theme";this.i18nExpand=" Expand";this.i18nCollapse="Collapse";this.i18nMore="More…";this.expand=false;this.showMoreItems=false;this.visibleMenuItems=0;this.countMoreNotifications=0;this.mapExpand=true;this.activeTab=undefined;this.isMoreTabEmpty=false;this.mode="desktop"}onWindowResize(){this.visibleMenuItems=this.getMaxTabCount()}handleNodeMutation(t){if(!(t instanceof HTMLElement)){return}if(t.matches(".tab")){this.onWindowResize()}if(t.matches("ix-menu-about")&&this.menu.contains(t)){this.appendAbout()}if(t.matches("ix-menu-settings")&&this.menu.contains(t)){this.appendSettings()}}onDomChange(t){t.forEach((t=>{t.addedNodes.forEach(this.handleNodeMutation.bind(this));t.removedNodes.forEach(this.handleNodeMutation.bind(this))}))}get popoverArea(){return this.hostElement.querySelector("#popover-area")}get overlayContainer(){return this.hostElement.querySelector(".menu-overlay")}get invisibleContainer(){return this.hostElement.querySelector(".menu-overlay-invisible")}get menu(){return this.hostElement.querySelector(".menu")}get menuItems(){return Array.from(this.hostElement.querySelectorAll('ix-menu-item:not(.internal-tab):not(.home-tab):not(.bottom-tab):not([slot="bottom"])')).filter(this.isVisible)}get menuBottomItems(){return Array.from(this.hostElement.querySelectorAll("ix-menu-item.bottom-tab:not(.internal-tab):not(.home-tab)")).filter(this.isVisible)}get homeTab(){return this.hostElement.querySelector("ix-menu-item.home-tab")}get moreItemsDropdown(){return this.hostElement.querySelector(".internal-tab ix-dropdown")}get isMoreItemsDropdownEmpty(){return this.hostElement.querySelectorAll(".internal-tab ix-dropdown .appended").length===0}get moreItemsDropdownItems(){return this.hostElement.querySelectorAll(".internal-tab ix-dropdown ix-menu-item")}get activeMoreTabContainer(){return this.hostElement.querySelector(".active-more-tab")}get activeMoreTab(){return this.hostElement.querySelector(".active-more-tab ix-menu-item")}get aboutPopoverContainer(){return this.hostElement.querySelector(".about-news")}get aboutPopover(){return document.querySelector("ix-menu-about-news")}get aboutTab(){return this.hostElement.querySelector("#aboutAndLegal")}get about(){return this.hostElement.querySelector("ix-menu-about")}get settings(){return this.hostElement.querySelector("ix-menu-settings")}get isSettingsEmpty(){return Array.from(this.hostElement.querySelectorAll("ix-menu-settings-item")).length===0}get avatarItem(){return this.hostElement.querySelector("ix-menu-avatar")}get tabsContainer(){return this.hostElement.querySelector("#menu-tabs")}showTab(t){return t+1<=this.visibleMenuItems}componentDidLoad(){var t,e,i,s;(t=this.settings)===null||t===void 0?void 0:t.addEventListener("close",(()=>{this.showSettings=false;this.settings.show=this.showSettings}));(e=this.settings)===null||e===void 0?void 0:e.addEventListener("animationend",(()=>{if(!this.showSettings){this.settings.classList.add("d-none");this.overlayContainer.classList.add("d-none")}}));(i=this.about)===null||i===void 0?void 0:i.addEventListener("close",(()=>{this.showAbout=false;this.about.show=this.showAbout}));(s=this.about)===null||s===void 0?void 0:s.addEventListener("animationend",(()=>{if(!this.showAbout){this.about.classList.add("d-none");this.overlayContainer.classList.add("d-none")}}));this.overlayContainer.classList.add("d-none");this.onWindowResize();this.domObserver.observe(this.hostElement,{attributes:false,childList:true,subtree:true})}componentWillLoad(){a.register(this.hostElement);const t=r("ix-basic-navigation",this.hostElement);if(m(t)&&t.hideHeader===false){l.onChange.on((t=>this.mode=t));this.mode=l.mode}}componentWillRender(){this.appendTabs()}componentDidRender(){this.visibleMenuItems=this.getMaxTabCount();this.appendFragments()}appendFragments(){this.appendAvatar();this.appendAbout();this.appendSettings();this.appendAboutNewsPopover();this.isMoreTabEmpty=this.isMoreItemsDropdownEmpty;this.countMoreNotifications=this.getMoreNotificationsCount()}resetActiveTab(){this.activeTab=null}isMenuItemActive(t){return t.active||t.classList.contains("active")}appendTabs(){this.activeTab=null;if(this.homeTab){this.hostElement.querySelector(".tabs-top").appendChild(this.homeTab);this.homeTab.addEventListener("click",this.resetOverlay.bind(this))}this.menuItems.forEach(((t,e)=>{var i;if(this.showTab(e)){t.classList.remove("d-none")}else{t.classList.add("d-none");if(this.isMenuItemActive(t)){this.activeTab=t}}(i=this.homeTab)===null||i===void 0?void 0:i.classList.remove("d-none");t.addEventListener("click",this.resetOverlay.bind(this))}))}appendAvatar(){var t;const e=this.avatarItem;if(e){e.style.marginBottom="1rem";(t=this.hostElement.querySelector("#avatar-tab-placeholder"))===null||t===void 0?void 0:t.appendChild(e)}}getAboutPopoverVerticalPosition(){const t=12;const e=6;const i=this.aboutTab.getBoundingClientRect();const s=window.innerHeight-(i.bottom-i.height/2+t/2+e);return h(s)}appendAboutNewsPopover(){var t;if(!this.aboutPopover){return}this.aboutPopover.style.bottom=this.getAboutPopoverVerticalPosition();if(!((t=this.popoverArea)===null||t===void 0?void 0:t.contains(this.aboutPopover))){const t=()=>{var t;if((t=this.aboutPopover)===null||t===void 0?void 0:t.aboutItemLabel){this.about.activeTabLabel=this.aboutPopover.aboutItemLabel;this.toggleAbout(true)}};this.aboutPopover.addEventListener("showMore",t.bind(this));document.body.appendChild(this.aboutPopover)}}appendSettings(){if(this.settings){this.overlayContainer.appendChild(this.settings)}}appendAbout(){if(this.about){this.overlayContainer.appendChild(this.about)}}getMoreNotificationsCount(){var t;const e=(t=this.moreItemsDropdown)===null||t===void 0?void 0:t.querySelectorAll(".appended");let i=0;e===null||e===void 0?void 0:e.forEach((t=>{if(t["notifications"]){i+=t["notifications"]}}));return i}getAvailableHeight(){const t=60;const e=72;const i=56;const s=36;let n=this.hostElement.clientHeight;n-=t;if(this.avatarItem){n-=i}if(this.homeTab){n-=e}if(this.showAbout){n-=s}if(this.showSettings){n-=s}if(this.menuBottomItems.length){n-=this.menuBottomItems.length*s}if(this.enableMapExpand){n-=s}n-=2*s;n-=16;return n}getMaxTabCount(){const t=48;const e=this.getAvailableHeight();const i=Math.floor(e/t);const s=this.menuItems.length;if(s===1){return 1}if(s<this.maxVisibleMenuItems){if(i>s){return s}return Math.min(i-2,s)}if(s===this.maxVisibleMenuItems){if(i<this.maxVisibleMenuItems){return i-2}if(i===this.maxVisibleMenuItems){return this.maxVisibleMenuItems-2}return Math.min(i,this.maxVisibleMenuItems)}if(i===this.maxVisibleMenuItems){return this.maxVisibleMenuItems-2}if(i>=this.maxVisibleMenuItems){return this.maxVisibleMenuItems-1}return Math.min(i-2,this.maxVisibleMenuItems)}async toggleMapExpand(t){this.skipAllOverlayAnimations();if(t!==undefined){this.mapExpand=t}else{this.mapExpand=!this.mapExpand}}skipAllOverlayAnimations(){if(this.about){this.skipOverlayAnimationFor(this.about)}if(this.settings){this.skipOverlayAnimationFor(this.settings)}}skipOverlayAnimationFor(t){const e="animate__animated";t===null||t===void 0?void 0:t.classList.remove(e);setTimeout((()=>{t===null||t===void 0?void 0:t.classList.add(e)}),300)}async toggleMenu(t){this.skipAllOverlayAnimations();if(t!==undefined){this.expand=t}else{this.expand=!this.expand}if(this.aboutPopover){this.aboutPopover.expanded=this.expand}this.expandChange.emit(this.expand)}async toggleSettings(t){var e;if(this.showAbout){this.skipAllOverlayAnimations()}else{this.skipOverlayAnimationFor(this.about)}(e=this.about)===null||e===void 0?void 0:e.classList.add("d-none");this.resetOverlay();this.showSettings=t;this.settings.show=this.showSettings;this.settings.classList.remove("d-none");this.overlayContainer.classList.remove("d-none")}async toggleAbout(t){var e;if(this.showSettings){this.skipAllOverlayAnimations()}else{this.skipOverlayAnimationFor(this.settings)}(e=this.settings)===null||e===void 0?void 0:e.classList.add("d-none");this.resetOverlay();this.showAbout=t;this.about.show=this.showAbout;this.about.classList.remove("d-none");this.overlayContainer.classList.remove("d-none")}resetOverlay(){this.showSettings=false;this.showAbout=false;if(this.settings){this.settings.show=this.showSettings}if(this.about){this.about.show=this.showAbout}this.toggleMenu(false)}showMoreButton(){const t=this.menuItems.length;if(t===1){return false}if(t<this.maxVisibleMenuItems){return this.visibleMenuItems<t}if(t>this.maxVisibleMenuItems){return this.visibleMenuItems<this.maxVisibleMenuItems}return this.visibleMenuItems<=this.maxVisibleMenuItems-2}getCollapseText(){return this.mapExpand?this.i18nCollapse:this.i18nExpand}getCollapseIcon(){return this.mapExpand?"double-chevron-left":"double-chevron-right"}isMenuItemClicked(t){const e=t.composedPath();const i=e.filter((t=>t.id!=="ix-menu-more-tab")).filter((t=>t.tagName==="IX-MENU-ITEM"));return i.some((t=>this.tabsContainer.contains(t)))}render(){return i(s,{class:{expanded:this.expand,[`mode-${this.mode}`]:true}},i("div",{class:{menu:true,expanded:this.expand},onClick:()=>{this.resetActiveTab()}},i("ix-burger-menu",{onClick:async()=>this.toggleMenu(),expanded:this.expand,class:{"burger-menu":true}}),i("div",{id:"avatar-tab-placeholder"}),i("div",{id:"menu-tabs",style:{display:"contents"},onClick:t=>{if(this.isMenuItemClicked(t)){this.resetOverlay()}}},i("div",{class:"tabs-top"}),i("slot",null),i("div",{class:"active-more-tab"},this.activeTab?i("ix-menu-item",{class:"internal-tab",active:true,tabIcon:this.activeTab.tabIcon},this.activeTab.innerText):null),i("ix-menu-item",{id:"ix-menu-more-tab",tabIcon:"more-menu",class:{"internal-tab":true},style:{display:this.showMoreButton()?"block":"none"},title:"Show more",notifications:this.countMoreNotifications},this.i18nMore,i("ix-dropdown",{trigger:"ix-menu-more-tab",positioningStrategy:"fixed",placement:"right-start"},this.menuItems.filter(((t,e)=>!this.showTab(e)&&!this.isMenuItemActive(t)&&this.isVisible(t))).map((t=>i("ix-menu-item",{tabIcon:t.tabIcon,active:t.active,class:"internal-tab appended",onClick:()=>{this.resetOverlay();t.dispatchEvent(new CustomEvent("click"))}},t.innerText)))))),i("div",{class:"bottom-tab-divider"}),this.enableSettings&&!this.isSettingsEmpty?i("ix-menu-item",{id:"settings",class:{"internal-tab":true,"bottom-tab":true,active:this.showSettings},tabIcon:"cogwheel",onClick:async()=>this.toggleSettings(!this.showSettings)},this.i18nSettings):null,i("slot",{name:"bottom"}),i("div",{id:"popover-area"}),this.about?i("ix-menu-item",{id:"aboutAndLegal",class:{"internal-tab":true,"bottom-tab":true,active:this.showAbout},tabIcon:"info",onClick:async()=>this.toggleAbout(!this.showAbout)},this.i18nLegal):null,this.enableToggleTheme?i("ix-menu-item",{id:"toggleTheme",onClick:()=>c.toggleMode(),class:"internal-tab bottom-tab",tabIcon:"bulb"},this.i18nToggleTheme):null,this.enableMapExpand?i("ix-menu-item",{id:"menu-collapse",onClick:()=>this.mapExpandChange.emit(this.mapExpand),class:"internal-tab bottom-tab",tabIcon:`${this.getCollapseIcon()}`},this.getCollapseText()):null),i("div",{class:{"menu-overlay":true,expanded:this.expand,"d-block":this.showAbout||this.showSettings},style:{opacity:this.showAbout||this.showSettings?"1":"0"}}),i("div",{class:"menu-overlay-invisible"}))}get hostElement(){return n(this)}};d.style=u;const b=".text-xs.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-title-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}.text-l.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-title-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}a.sc-ix-menu-about{color:var(--theme-color-primary)}.sc-ix-menu-about-h{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}.sc-ix-menu-about-h .about-header.sc-ix-menu-about{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}.sc-ix-menu-about-h .about-header.sc-ix-menu-about h2.sc-ix-menu-about{color:var(--theme-nav-overlay-header--color);margin-bottom:0}.sc-ix-menu-about-h .about-tabs.sc-ix-menu-about{margin-bottom:1.5rem}.sc-ix-menu-about-h ix-menu-about-item.sc-ix-menu-about{display:none}";const x=class{constructor(i){t(this,i);this.close=e(this,"close",7);this.activeTabLabel=undefined;this.label="About & legal information";this.show=false;this.labels=[]}get aboutItems(){return Array.from(this.el.querySelectorAll("ix-menu-about-item"))}setTab(t){this.activeTabLabel=t;this.aboutItems.forEach((t=>{t.style.display="none";if(t.label===this.activeTabLabel){t.style.display="block"}}))}componentWillLoad(){if(this.aboutItems.length){this.setTab(this.activeTabLabel||this.aboutItems[0].label)}}componentDidLoad(){o(this.el)}componentWillRender(){this.updateLabels()}updateLabels(){this.labels=this.aboutItems.map((t=>t.label))}watchActiveTabLabel(t){setTimeout((()=>this.setTab(t)))}getSelectedTabIndex(t){const e=this.aboutItems.find((e=>e.label===t));return this.aboutItems.indexOf(e)}getTabItems(){return this.aboutItems.map((({label:t})=>i("ix-tab-item",{class:{active:t===this.activeTabLabel},onClick:()=>this.setTab(t)},t)))}render(){return i(s,{class:{animate__animated:true,animate__fadeInLeft:this.show,animate__fadeOutLeft:!this.show}},i("div",{class:"about-header"},i("h2",{class:"text-h2"},this.label),i("ix-icon-button",{ghost:true,size:"24",icon:"close",onClick:t=>this.close.emit(t)})),i("ix-tabs",{selected:this.getSelectedTabIndex(this.activeTabLabel),class:"about-tabs"},this.getTabItems()),i("div",{class:"about-items"},i("slot",null)))}get el(){return n(this)}static get watchers(){return{activeTabLabel:["watchActiveTabLabel"]}}};x.style=b;const g=".sc-ix-menu-about-item-h{display:block}";const f=class{constructor(e){t(this,e);this.label=undefined}render(){return i(s,null,i("slot",null))}};f.style=g;const v=".sc-ix-menu-about-news-h{--margin:0.5rem;display:block;position:fixed;width:20rem;height:auto;background-color:var(--theme-color-1);border:var(--theme-weak-bdr-1);border-radius:0.25rem;padding:1rem;left:4rem;z-index:10000;transition:left var(--animate-duration);margin-left:var(--margin) !important;box-shadow:var(--theme-box-shadow-level-4)}.expanded.sc-ix-menu-about-news-h{left:calc(4rem + 12rem)}.show.sc-ix-menu-about-news-h{display:none}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news{position:absolute;top:0.0625rem;left:1rem}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news svg.sc-ix-menu-about-news{position:absolute;height:3.625rem;width:3rem}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news svg.sc-ix-menu-about-news polygon.sc-ix-menu-about-news{fill:var(--theme-color-primary)}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news ix-icon.sc-ix-menu-about-news{margin:0.5rem;position:absolute;z-index:1}.sc-ix-menu-about-news-h .cui-popover-news-header.sc-ix-menu-about-news{margin-bottom:2rem;margin-left:4rem;margin-top:-0.25rem}.sc-ix-menu-about-news-h .popover-body.sc-ix-menu-about-news{color:var(--theme-color-std-text)}.sc-ix-menu-about-news-h .cui-popover-news-footer.sc-ix-menu-about-news{display:flex;justify-content:flex-end;margin-top:1rem}.sc-ix-menu-about-news-h ix-icon-button.sc-ix-menu-about-news{top:0.5rem;right:0.5rem;position:absolute}.sc-ix-menu-about-news-h #arrow.sc-ix-menu-about-news{position:absolute;width:0.5rem;height:0.5rem;background-color:var(--theme-color-1);border-left:var(--theme-weak-bdr-1);border-bottom:var(--theme-weak-bdr-1);transform:translateX(calc(var(--margin) * -1 - 0.8rem)) rotateZ(45deg)}";const p=class{constructor(i){t(this,i);this.showMore=e(this,"showMore",7);this.closePopover=e(this,"closePopover",7);this.show=false;this.label=undefined;this.i18nShowMore="Show more";this.aboutItemLabel=undefined;this.offsetBottom=0;this.expanded=false}render(){return i(s,{class:{expanded:this.expanded,show:!this.show}},i("div",{class:"banner-container"},i("ix-icon",{color:"color-inv-contrast-text",name:"shout",size:"32"}),i("svg",{viewBox:"0 0 48 56",xmlns:"http://www.w3.org/2000/svg"},i("polygon",{points:"0 0 48 0 48 56 24 48 0 56"}))),i("div",{class:"cui-popover-news-header"},i("span",{class:"text-l-title"},this.label)),i("ix-icon-button",{size:"24",icon:"close-small",ghost:true,onClick:()=>{this.show=false;this.closePopover.emit()}}),i("slot",null),this.aboutItemLabel?i("div",{class:"cui-popover-news-footer"},i("button",{class:"btn btn-primary",onClick:t=>{this.show=false;this.showMore.emit(t)}},this.i18nShowMore)):null,i("div",{id:"arrow"}))}};p.style=v;const w=".sc-ix-menu-avatar-h{display:block;position:relative;margin-bottom:0.5rem}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar{display:flex;align-items:center;height:2.5rem;max-height:2.5rem;padding-left:0.25rem;margin-left:0.75rem;margin-right:0.75rem;transition:0.15s;border-radius:1.25rem}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar>.avatar-image.sc-ix-menu-avatar{height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar>.avatar-initials.sc-ix-menu-avatar{display:flex;align-items:center;justify-content:center;height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px;background-color:var(--theme-color-component-3)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar #avatar-path-background.sc-ix-menu-avatar{fill:var(--theme-avatar--background)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar #avatar-path-person.sc-ix-menu-avatar{fill:var(--theme-color-4)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar .avatar-name.sc-ix-menu-avatar{display:flex;flex-direction:column;overflow:hidden;white-space:nowrap;margin-left:1rem;line-height:1.14}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar .avatar-name.sc-ix-menu-avatar .text-default-single.sc-ix-menu-avatar{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled):hover{background-color:var(--theme-avatar-btn--background--hover);color:var(--theme-avatar-btn--color--hover)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled):active{background-color:var(--theme-avatar-btn--background--active);color:var(--theme-avatar-btn--color--active)}";function y(t){const{initials:e}=t;if(e){return i("div",{class:"avatar-initials"},e)}return i("svg",{class:"avatar-image",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32"},i("g",{fill:"none","fill-rule":"evenodd"},i("path",{id:"avatar-path-background",d:"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n 16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z"}),i("path",{id:"avatar-path-person",d:"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n 6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n 9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n 6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z"})))}const k=class{constructor(i){t(this,i);this.logoutClick=e(this,"logoutClick",7);this.avatarElementId="ix-menu-avatar-id";this.top=undefined;this.bottom=undefined;this.image=undefined;this.initials=undefined;this.i18nLogout="Logout"}render(){return i(s,null,i("li",{class:"nav-item top-item avatar no-hover",title:this.top,id:this.avatarElementId},this.image?i("img",{src:this.image,class:"avatar-image"}):i(y,{initials:this.initials}),i("div",{class:"avatar-name"},i("span",{class:"text-default-single",title:this.top},this.top),i("span",{class:"text-default-single",title:this.bottom},this.bottom))),i("ix-dropdown",{trigger:this.avatarElementId,placement:"right-start",offset:{mainAxis:12}},i("slot",null),i("ix-menu-avatar-item",{label:this.i18nLogout,icon:"log-out",onClick:t=>{this.logoutClick.emit(t)}})))}get hostElement(){return n(this)}};k.style=w;const z=".sc-ix-menu-avatar-item-h{display:block}";const S=class{constructor(i){t(this,i);this.itemClick=e(this,"itemClick",7);this.icon=undefined;this.label=undefined}render(){return i("ix-dropdown-item",{icon:this.icon,label:this.label,onClick:t=>this.itemClick.emit(t)})}get hostElement(){return n(this)}};S.style=z;const C='.sc-ix-menu-item-h{position:relative;display:block;cursor:pointer}.sc-ix-menu-item-h:not(.disabled):not(:disabled).hover,.sc-ix-menu-item-h:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}.sc-ix-menu-item-h:not(.disabled):not(:disabled).active,.sc-ix-menu-item-h:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}.sc-ix-menu-item-h .tab.sc-ix-menu-item{display:flex;position:relative;align-items:center;height:3rem;z-index:500;padding-left:1.25rem}.sc-ix-menu-item-h i.glyph.sc-ix-menu-item{color:var(--theme-nav-item-primary-icon--color);position:relative}.sc-ix-menu-item-h .tab.sc-ix-menu-item:focus-visible{outline:none}.sc-ix-menu-item-h:focus-visible{outline:none}.sc-ix-menu-item-h .tab.sc-ix-menu-item:not(:last-child){margin-bottom:0.5rem}.sc-ix-menu-item-h .notification.sc-ix-menu-item{display:inline-flex;position:absolute;top:-0.5rem;right:-50%}.sc-ix-menu-item-h .notification.sc-ix-menu-item .pill.sc-ix-menu-item{display:inline-flex;justify-content:center;align-items:center;height:1rem;min-width:1rem;position:relative;border-radius:6.25rem;background-color:var(--theme-color-primary);border-radius:6.25rem;font-size:0.75rem;font-weight:bold;line-height:1;font-family:Siemens Sans, Arial, sans-serif;color:var(--theme-color-primary--contrast);padding:0.25rem}.sc-ix-menu-item-h .tab-text.sc-ix-menu-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-nav-item-primary--color);margin:0 1.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.active.sc-ix-menu-item-h .tab.sc-ix-menu-item,.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item{background-color:var(--theme-nav-item-primary--background--selected)}.active.sc-ix-menu-item-h .tab.sc-ix-menu-item::before,.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item::before{content:"";background-color:var(--theme-nav-item-primary--border-color--selected);height:3rem;width:0.25rem;left:0;position:absolute}.active.sc-ix-menu-item-h .tab.sc-ix-menu-item>.glyph.sc-ix-menu-item,.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item>.glyph.sc-ix-menu-item{color:var(--theme-nav-item-primary-icon--color--selected)}.disabled.sc-ix-menu-item-h{color:var(--theme-color-weak-text);pointer-events:none;cursor:default}.disabled.sc-ix-menu-item-h .tab.sc-ix-menu-item>.glyph.sc-ix-menu-item{color:var(--theme-color-weak-text)}.disabled.sc-ix-menu-item-h .tab-text.sc-ix-menu-item{color:var(--theme-color-weak-text)}.home-tab.sc-ix-menu-item-h,[slot=home].sc-ix-menu-item-h{margin-bottom:1.5rem}.bottom-tab.sc-ix-menu-item-h,[slot=bottom].sc-ix-menu-item-h{height:2.25rem}.bottom-tab.sc-ix-menu-item-h .tab.sc-ix-menu-item,[slot=bottom].sc-ix-menu-item-h .tab.sc-ix-menu-item{height:2.25rem}.bottom-tab.sc-ix-menu-item-h .tab.sc-ix-menu-item::before,[slot=bottom].sc-ix-menu-item-h .tab.sc-ix-menu-item::before{height:2.25rem;background-color:transparent}.bottom-tab.active.sc-ix-menu-item-h .tab.sc-ix-menu-item,.bottom-tab.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item,[slot=bottom].active.sc-ix-menu-item-h .tab.sc-ix-menu-item,[slot=bottom].selected.sc-ix-menu-item-h .tab.sc-ix-menu-item{background-color:var(--theme-nav-item-secondary--background--selected)}.bottom-tab.active.sc-ix-menu-item-h:hover,.bottom-tab.selected.sc-ix-menu-item-h:hover,[slot=bottom].active.sc-ix-menu-item-h:hover,[slot=bottom].selected.sc-ix-menu-item-h:hover{background-color:var(--theme-nav-item-secondary--background--selected)}.bottom-tab.active.sc-ix-menu-item-h:active,.bottom-tab.selected.sc-ix-menu-item-h:active,[slot=bottom].active.sc-ix-menu-item-h:active,[slot=bottom].selected.sc-ix-menu-item-h:active{background-color:var(--theme-nav-item-secondary--background--selected)}';const _=class{constructor(e){t(this,e);this.home=false;this.bottom=false;this.tabIcon="document";this.notifications=undefined;this.active=undefined;this.disabled=undefined;this.title=undefined}get tabLabel(){return this.hostElement.querySelector(".tab-text")}componentDidRender(){const t=this.tabLabel;const e=t.innerHTML.replace("&","&");if(this.title!==e){this.title=e}}render(){return i(s,{class:{disabled:this.disabled,"home-tab":this.home,"bottom-tab":this.bottom,active:this.active}},i("li",{class:"tab",title:this.title},i("i",{class:`glyph glyph-${this.tabIcon}`},i("div",{class:"notification"},this.notifications?i("div",{class:"pill"},this.notifications):null)),i("span",{class:"tab-text text-default"},i("slot",null))))}get hostElement(){return n(this)}};_.style=C;const A=".text-xs.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-title-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}.text-l.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-title-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}a.sc-ix-menu-settings{color:var(--theme-color-primary)}.sc-ix-menu-settings-h{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}.sc-ix-menu-settings-h .settings-header.sc-ix-menu-settings{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}.sc-ix-menu-settings-h .settings-header.sc-ix-menu-settings h2.sc-ix-menu-settings{color:var(--theme-nav-overlay-header--color);margin-bottom:0}.sc-ix-menu-settings-h .settings-tabs.sc-ix-menu-settings{margin-bottom:1.5rem}";const I=class{constructor(i){t(this,i);this.close=e(this,"close",7);this.activeTabLabel=undefined;this.label="Settings";this.show=false}get settingsItems(){return Array.from(this.el.querySelectorAll("ix-menu-settings-item"))}setTab(t){this.activeTabLabel=t;this.settingsItems.forEach((t=>{t.style.display="none";if(t.label===this.activeTabLabel){t.style.display="block"}}))}componentWillLoad(){if(this.settingsItems.length){this.setTab(this.activeTabLabel||this.settingsItems[0].label)}}componentDidLoad(){o(this.el)}watchActiveTabLabel(t){this.setTab(t)}getTabItems(){return this.settingsItems.map((({label:t})=>i("ix-tab-item",{class:{active:t===this.activeTabLabel},onClick:()=>this.setTab(t)},t)))}render(){return i(s,{class:{animate__animated:true,animate__fadeInLeft:this.show,animate__fadeOutLeft:!this.show}},i("div",{class:"settings-header"},i("h2",{class:"text-h2"},this.label),i("ix-icon-button",{ghost:true,size:"24",icon:"close",onClick:t=>this.close.emit(t)})),i("ix-tabs",null,this.getTabItems()),i("slot",null))}get el(){return n(this)}static get watchers(){return{activeTabLabel:["watchActiveTabLabel"]}}};I.style=A;const T=".sc-ix-menu-settings-item-h{display:block}";const M=class{constructor(e){t(this,e);this.label=undefined}render(){return i(s,null,i("slot",null))}};M.style=T;export{d as ix_menu,x as ix_menu_about,f as ix_menu_about_item,p as ix_menu_about_news,k as ix_menu_avatar,S as ix_menu_avatar_item,_ as ix_menu_item,I as ix_menu_settings,M as ix_menu_settings_item};
|
|
2
|
-
//# sourceMappingURL=p-34e3a10e.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["menuCss","Menu","this","domObserver","MutationObserver","onDomChange","bind","isVisible","elm","style","display","_b","_a","parentElement","onWindowResize","visibleMenuItems","getMaxTabCount","handleNodeMutation","node","HTMLElement","matches","menu","contains","appendAbout","appendSettings","mutations","forEach","mutationRecord","addedNodes","removedNodes","popoverArea","hostElement","querySelector","overlayContainer","invisibleContainer","menuItems","Array","from","querySelectorAll","filter","menuBottomItems","homeTab","moreItemsDropdown","isMoreItemsDropdownEmpty","length","moreItemsDropdownItems","activeMoreTabContainer","activeMoreTab","aboutPopoverContainer","aboutPopover","document","aboutTab","about","settings","isSettingsEmpty","avatarItem","tabsContainer","showTab","index","componentDidLoad","addEventListener","showSettings","show","classList","add","_c","showAbout","_d","observe","attributes","childList","subtree","componentWillLoad","menuController","register","layout","hostContext","isBasicNavigationLayout","hideHeader","screenMode","onChange","on","mode","componentWillRender","appendTabs","componentDidRender","appendFragments","appendAvatar","appendAboutNewsPopover","isMoreTabEmpty","countMoreNotifications","getMoreNotificationsCount","resetActiveTab","activeTab","isMenuItemActive","item","active","appendChild","resetOverlay","remove","avatar","marginBottom","getAboutPopoverVerticalPosition","heightArrow","offsetArrow","rectAbout","getBoundingClientRect","offset","window","innerHeight","bottom","height","convertToRemString","showMore","aboutItemLabel","activeTabLabel","toggleAbout","body","moreTabs","count","tab","getAvailableHeight","heightBurgerMenu","heightHome","heightAvatar","heightBottomTab","availableHeight","clientHeight","enableMapExpand","heightTab","visibleCount","Math","floor","menuItemCount","maxVisibleMenuItems","min","async","skipAllOverlayAnimations","undefined","mapExpand","skipOverlayAnimationFor","element","animateClass","setTimeout","expand","expanded","expandChange","emit","toggleMenu","showMoreButton","getCollapseText","i18nCollapse","i18nExpand","getCollapseIcon","isMenuItemClicked","event","path","composedPath","id","tagName","some","render","h","Host","class","onClick","tabIcon","innerText","title","notifications","i18nMore","trigger","positioningStrategy","placement","map","e","dispatchEvent","CustomEvent","enableSettings","toggleSettings","i18nSettings","name","i18nLegal","enableToggleTheme","themeSwitcher","toggleMode","i18nToggleTheme","mapExpandChange","opacity","menuAboutCss","MenuAbout","aboutItems","el","setTab","label","i","forceUpdate","updateLabels","labels","watchActiveTabLabel","value","getSelectedTabIndex","selectedItem","find","indexOf","getTabItems","animate__animated","animate__fadeInLeft","animate__fadeOutLeft","ghost","size","icon","close","selected","menuAboutItemCss","MenuAboutItem","menuAboutNewsCss","MenuAboutNews","color","viewBox","xmlns","points","closePopover","i18nShowMore","menuAvatarCss","DefaultAvatar","props","initials","width","fill","d","MenuAvatar","avatarElementId","top","image","src","mainAxis","i18nLogout","logoutClick","menuAvatarItemCss","MenuAvatarItem","itemClick","menuItemCss","MenuItem","tabLabel","spanElement","newTitle","innerHTML","replace","disabled","home","menuSettingsCss","settingsItems","menuSettingsItemCss","MenuSettingsItem"],"sources":["./src/components/menu/menu.scss?tag=ix-menu","./src/components/menu/menu.tsx","./src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=scoped","./src/components/menu-about/menu-about.tsx","./src/components/menu-about-item/menu-about-item.css?tag=ix-menu-about-item&encapsulation=scoped","./src/components/menu-about-item/menu-about-item.tsx","./src/components/menu-about-news/menu-about-news.scss?tag=ix-menu-about-news&encapsulation=scoped","./src/components/menu-about-news/menu-about-news.tsx","./src/components/menu-avatar/menu-avatar.scss?tag=ix-menu-avatar&encapsulation=scoped","./src/components/menu-avatar/menu-avatar.tsx","./src/components/menu-avatar-item/menu-avatar-item.css?tag=ix-menu-avatar-item&encapsulation=scoped","./src/components/menu-avatar-item/menu-avatar-item.tsx","./src/components/menu-item/menu-item.scss?tag=ix-menu-item&encapsulation=scoped","./src/components/menu-item/menu-item.tsx","./src/components/menu-settings/menu-settings.scss?tag=ix-menu-settings&encapsulation=scoped","./src/components/menu-settings/menu-settings.tsx","./src/components/menu-settings-item/menu-settings-item.css?tag=ix-menu-settings-item&encapsulation=scoped","./src/components/menu-settings-item/menu-settings-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n\nix-menu {\n display: flex;\n flex-direction: row;\n position: absolute;\n height: 100%;\n min-height: 22.75rem;\n z-index: var(--theme-z-index-sticky);\n width: auto;\n\n .menu {\n display: flex;\n flex-direction: column;\n position: relative;\n width: 4rem;\n height: 100%;\n padding-block-end: 1rem;\n overflow: hidden;\n\n &.expanded {\n box-shadow: var(--theme-navigation--box-shadow);\n }\n\n background-color: var(--theme-nav--background);\n transition: width var(--animate-duration);\n\n .burger-menu {\n margin: 0.75rem 0 1rem 0.75rem;\n }\n }\n\n .menu-overlay {\n display: block;\n position: absolute;\n width: calc(100vw - 4rem);\n height: 100%;\n left: 4rem;\n z-index: -1;\n backdrop-filter: blur(1rem);\n background-color: var(--theme-sidebar-overlay-blur);\n transition: all $medium-time ease-out;\n }\n\n .menu-overlay-invisible {\n display: none;\n }\n\n .menu.expanded {\n width: 16rem;\n }\n\n .menu-overlay.expanded {\n width: calc(100vw - 16rem);\n left: 16rem;\n }\n\n #avatar-tab-placeholder {\n max-height: 3rem;\n }\n\n .avatar {\n margin-bottom: 2rem;\n }\n\n #cui-imprint {\n .cui-imprint-product-name {\n margin-bottom: $default-space;\n }\n\n .cui-imprint-product-description {\n margin-bottom: $x-large-space;\n }\n\n .cui-imprint-link-container {\n display: flex;\n align-items: center;\n }\n }\n\n .bottom-tab-divider {\n margin-top: auto;\n }\n}\n\nix-menu.mode-mobile {\n .menu:not(.expanded) {\n width: 0;\n }\n\n .menu {\n padding-top: 2rem;\n }\n\n .menu .burger-menu {\n display: none;\n }\n\n .menu-overlay {\n left: 0px;\n width: calc(100vw);\n }\n}\n\n// Remove text-decoration if a tag is used inside ix-menu\na[href]:has(> ix-menu-item) {\n text-decoration: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { hostContext, isBasicNavigationLayout } from '../utils/screen/context';\nimport { Mode } from '../utils/screen/mode';\nimport { screenMode } from '../utils/screen/service';\nimport { themeSwitcher } from '../utils/theme-switcher';\n\n@Component({\n tag: 'ix-menu',\n styleUrl: 'menu.scss',\n scoped: false,\n})\nexport class Menu {\n @Element() hostElement!: HTMLIxMenuElement;\n\n /**\n * Is settings tab visible\n */\n @Prop({ mutable: true }) showSettings = false;\n\n /**\n * Is about tab visible\n */\n @Prop({ mutable: true }) showAbout = false;\n\n /**\n * Show toggle between light and dark variant. Only if the provided theme have implemented both!\n */\n @Prop() enableToggleTheme = false;\n\n /**\n * Is settings tab is visible\n */\n @Prop() enableSettings = true;\n\n /**\n * Internal\n */\n @Prop() enableMapExpand = false;\n\n /**\n * Should only be set if you use ix-menu standalone\n */\n @Prop() applicationName: string;\n\n /**\n * Should only be set if you use ix-menu standalone\n */\n @Prop() applicationDescription = '';\n\n /**\n * Maximum number of menu items to show in case enough vertical space is available.\n * Extra menu items will be collapsed to 'show more' menu item.\n */\n @Prop() maxVisibleMenuItems = 9;\n\n /**\n */\n @Prop() i18nLegal = 'About & legal information';\n\n /**\n */\n @Prop() i18nSettings = 'Settings';\n\n /**\n */\n @Prop() i18nToggleTheme = 'Toggle theme';\n\n /**\n */\n @Prop() i18nExpand = ' Expand';\n\n /**\n */\n @Prop() i18nCollapse = 'Collapse';\n\n /**\n */\n @Prop() i18nMore = 'More…';\n\n /**\n * Expand menu\n */\n @Prop({ mutable: true, reflect: true }) expand = false;\n\n /**\n * Menu expanded\n */\n @Event() expandChange: EventEmitter<boolean>;\n\n /**\n * Map Sidebar expanded\n */\n @Event() mapExpandChange: EventEmitter<boolean>;\n @State() showMoreItems = false;\n @State() visibleMenuItems = 0;\n @State() countMoreNotifications = 0;\n @State() mapExpand = true;\n @State() activeTab: HTMLIxMenuItemElement;\n @State() isMoreTabEmpty = false;\n @State() mode: Mode = 'desktop';\n\n private readonly domObserver = new MutationObserver(\n this.onDomChange.bind(this)\n );\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.visibleMenuItems = this.getMaxTabCount();\n }\n\n private handleNodeMutation(node: Node) {\n if (!(node instanceof HTMLElement)) {\n return;\n }\n\n if (node.matches('.tab')) {\n this.onWindowResize();\n }\n\n if (node.matches('ix-menu-about') && this.menu.contains(node)) {\n this.appendAbout();\n }\n\n if (node.matches('ix-menu-settings') && this.menu.contains(node)) {\n this.appendSettings();\n }\n }\n\n private onDomChange(mutations: MutationRecord[]) {\n mutations.forEach((mutationRecord) => {\n mutationRecord.addedNodes.forEach(this.handleNodeMutation.bind(this));\n mutationRecord.removedNodes.forEach(this.handleNodeMutation.bind(this));\n });\n }\n\n // FBC IAM workaround #488\n private readonly isVisible = (elm: HTMLElement) => {\n return (\n elm.style.display !== 'none' &&\n elm.parentElement?.parentElement?.style.display !== 'none'\n );\n };\n\n get popoverArea() {\n return this.hostElement.querySelector('#popover-area');\n }\n\n get overlayContainer() {\n return this.hostElement.querySelector('.menu-overlay');\n }\n\n get invisibleContainer() {\n return this.hostElement.querySelector('.menu-overlay-invisible');\n }\n\n get menu() {\n return this.hostElement.querySelector('.menu');\n }\n\n get menuItems() {\n return Array.from(\n this.hostElement.querySelectorAll(\n 'ix-menu-item:not(.internal-tab):not(.home-tab):not(.bottom-tab):not([slot=\"bottom\"])'\n )\n ).filter(this.isVisible);\n }\n\n get menuBottomItems() {\n return Array.from(\n this.hostElement.querySelectorAll(\n 'ix-menu-item.bottom-tab:not(.internal-tab):not(.home-tab)'\n )\n ).filter(this.isVisible);\n }\n\n get homeTab() {\n return this.hostElement.querySelector('ix-menu-item.home-tab');\n }\n\n get moreItemsDropdown(): HTMLElement {\n return this.hostElement.querySelector('.internal-tab ix-dropdown');\n }\n\n get isMoreItemsDropdownEmpty(): boolean {\n return (\n this.hostElement.querySelectorAll('.internal-tab ix-dropdown .appended')\n .length === 0\n );\n }\n\n get moreItemsDropdownItems() {\n return this.hostElement.querySelectorAll(\n '.internal-tab ix-dropdown ix-menu-item'\n );\n }\n\n get activeMoreTabContainer() {\n return this.hostElement.querySelector('.active-more-tab');\n }\n\n get activeMoreTab() {\n return this.hostElement.querySelector('.active-more-tab ix-menu-item');\n }\n\n get aboutPopoverContainer(): HTMLElement {\n return this.hostElement.querySelector('.about-news');\n }\n\n get aboutPopover(): HTMLIxMenuAboutNewsElement {\n return document.querySelector('ix-menu-about-news');\n }\n\n get aboutTab(): HTMLElement {\n return this.hostElement.querySelector('#aboutAndLegal');\n }\n\n get about(): HTMLIxMenuAboutElement {\n return this.hostElement.querySelector('ix-menu-about');\n }\n\n get settings(): HTMLIxMenuSettingsElement {\n return this.hostElement.querySelector('ix-menu-settings');\n }\n\n get isSettingsEmpty(): boolean {\n return (\n Array.from(this.hostElement.querySelectorAll('ix-menu-settings-item'))\n .length === 0\n );\n }\n\n get avatarItem(): HTMLIxMenuAvatarElement {\n return this.hostElement.querySelector('ix-menu-avatar');\n }\n\n get tabsContainer(): HTMLDivElement {\n return this.hostElement.querySelector('#menu-tabs');\n }\n\n private showTab(index: number) {\n return index + 1 <= this.visibleMenuItems;\n }\n\n componentDidLoad() {\n this.settings?.addEventListener('close', () => {\n this.showSettings = false;\n this.settings.show = this.showSettings;\n });\n\n this.settings?.addEventListener('animationend', () => {\n if (!this.showSettings) {\n this.settings.classList.add('d-none');\n this.overlayContainer.classList.add('d-none');\n }\n });\n\n this.about?.addEventListener('close', () => {\n this.showAbout = false;\n this.about.show = this.showAbout;\n });\n\n this.about?.addEventListener('animationend', () => {\n if (!this.showAbout) {\n this.about.classList.add('d-none');\n this.overlayContainer.classList.add('d-none');\n }\n });\n\n this.overlayContainer.classList.add('d-none');\n\n this.onWindowResize();\n\n this.domObserver.observe(this.hostElement, {\n attributes: false,\n childList: true,\n subtree: true,\n });\n }\n\n componentWillLoad() {\n menuController.register(this.hostElement);\n const layout = hostContext('ix-basic-navigation', this.hostElement);\n if (isBasicNavigationLayout(layout) && layout.hideHeader === false) {\n screenMode.onChange.on((mode) => (this.mode = mode));\n this.mode = screenMode.mode;\n }\n }\n\n componentWillRender() {\n this.appendTabs();\n }\n\n componentDidRender() {\n this.visibleMenuItems = this.getMaxTabCount();\n this.appendFragments();\n }\n\n private appendFragments() {\n this.appendAvatar();\n this.appendAbout();\n this.appendSettings();\n this.appendAboutNewsPopover();\n\n // This lead to none infinite-loops and other bugs.\n this.isMoreTabEmpty = this.isMoreItemsDropdownEmpty;\n\n this.countMoreNotifications = this.getMoreNotificationsCount();\n }\n\n private resetActiveTab() {\n this.activeTab = null;\n }\n\n private isMenuItemActive(item: HTMLIxMenuItemElement) {\n return item.active || item.classList.contains('active');\n }\n\n private appendTabs() {\n this.activeTab = null;\n\n if (this.homeTab) {\n this.hostElement.querySelector('.tabs-top').appendChild(this.homeTab);\n this.homeTab.addEventListener('click', this.resetOverlay.bind(this));\n }\n\n this.menuItems.forEach((item: HTMLIxMenuItemElement, index) => {\n if (this.showTab(index)) {\n item.classList.remove('d-none');\n } else {\n item.classList.add('d-none');\n\n if (this.isMenuItemActive(item)) {\n this.activeTab = item;\n }\n }\n\n // TODO: Find better solution to handle home tab\n this.homeTab?.classList.remove('d-none');\n\n item.addEventListener('click', this.resetOverlay.bind(this));\n });\n }\n\n private appendAvatar() {\n const avatar = this.avatarItem;\n if (avatar) {\n avatar.style.marginBottom = '1rem';\n this.hostElement\n .querySelector('#avatar-tab-placeholder')\n ?.appendChild(avatar);\n }\n }\n\n private getAboutPopoverVerticalPosition() {\n const heightArrow = 12;\n const offsetArrow = 6;\n const rectAbout = this.aboutTab.getBoundingClientRect();\n const offset =\n window.innerHeight -\n (rectAbout.bottom - rectAbout.height / 2 + heightArrow / 2 + offsetArrow);\n return convertToRemString(offset);\n }\n\n private appendAboutNewsPopover() {\n if (!this.aboutPopover) {\n return;\n }\n\n this.aboutPopover.style.bottom = this.getAboutPopoverVerticalPosition();\n\n if (!this.popoverArea?.contains(this.aboutPopover)) {\n const showMore = () => {\n if (this.aboutPopover?.aboutItemLabel) {\n this.about.activeTabLabel = this.aboutPopover.aboutItemLabel;\n this.toggleAbout(true);\n }\n };\n\n this.aboutPopover.addEventListener('showMore', showMore.bind(this));\n document.body.appendChild(this.aboutPopover);\n }\n }\n\n private appendSettings() {\n if (this.settings) {\n this.overlayContainer.appendChild(this.settings);\n }\n }\n\n private appendAbout() {\n if (this.about) {\n this.overlayContainer.appendChild(this.about);\n }\n }\n\n private getMoreNotificationsCount(): number {\n const moreTabs = this.moreItemsDropdown?.querySelectorAll('.appended');\n let count = 0;\n moreTabs?.forEach((tab) => {\n if (tab['notifications']) {\n count += tab['notifications'];\n }\n });\n\n return count;\n }\n\n private getAvailableHeight() {\n const heightBurgerMenu = 60;\n const heightHome = 72;\n const heightAvatar = 56;\n const heightBottomTab = 36;\n\n let availableHeight = this.hostElement.clientHeight;\n\n availableHeight -= heightBurgerMenu;\n\n if (this.avatarItem) {\n availableHeight -= heightAvatar;\n }\n\n if (this.homeTab) {\n availableHeight -= heightHome;\n }\n\n if (this.showAbout) {\n availableHeight -= heightBottomTab;\n }\n\n if (this.showSettings) {\n availableHeight -= heightBottomTab;\n }\n\n if (this.menuBottomItems.length) {\n availableHeight -= this.menuBottomItems.length * heightBottomTab;\n }\n\n if (this.enableMapExpand) {\n availableHeight -= heightBottomTab;\n }\n\n // Subtract height of imprint and theme toggle tabs\n availableHeight -= 2 * heightBottomTab;\n\n // Subtract bottom margin of bottom tabs\n availableHeight -= 16;\n\n return availableHeight;\n }\n\n private getMaxTabCount() {\n const heightTab = 48;\n const availableHeight = this.getAvailableHeight();\n const visibleCount = Math.floor(availableHeight / heightTab);\n const menuItemCount = this.menuItems.length;\n\n if (menuItemCount === 1) {\n return 1;\n }\n\n if (menuItemCount < this.maxVisibleMenuItems) {\n if (visibleCount > menuItemCount) {\n return menuItemCount;\n }\n\n return Math.min(visibleCount - 2, menuItemCount);\n }\n\n if (menuItemCount === this.maxVisibleMenuItems) {\n if (visibleCount < this.maxVisibleMenuItems) {\n return visibleCount - 2;\n }\n\n if (visibleCount === this.maxVisibleMenuItems) {\n return this.maxVisibleMenuItems - 2;\n }\n\n return Math.min(visibleCount, this.maxVisibleMenuItems);\n }\n\n if (visibleCount === this.maxVisibleMenuItems) {\n return this.maxVisibleMenuItems - 2;\n }\n if (visibleCount >= this.maxVisibleMenuItems) {\n return this.maxVisibleMenuItems - 1;\n }\n\n return Math.min(visibleCount - 2, this.maxVisibleMenuItems);\n }\n\n /**\n * Toggle map sidebar expand\n * @param show\n */\n @Method()\n async toggleMapExpand(show?: boolean) {\n this.skipAllOverlayAnimations();\n\n if (show !== undefined) {\n this.mapExpand = show;\n } else {\n this.mapExpand = !this.mapExpand;\n }\n }\n\n private skipAllOverlayAnimations() {\n if (this.about) {\n this.skipOverlayAnimationFor(this.about);\n }\n if (this.settings) {\n this.skipOverlayAnimationFor(this.settings);\n }\n }\n\n private skipOverlayAnimationFor(element: HTMLElement) {\n const animateClass = 'animate__animated';\n\n element?.classList.remove(animateClass);\n\n setTimeout(() => {\n element?.classList.add(animateClass);\n }, 300);\n }\n\n /**\n * Toggle menu\n * @param show\n */\n @Method()\n async toggleMenu(show?: boolean) {\n this.skipAllOverlayAnimations();\n\n if (show !== undefined) {\n this.expand = show;\n } else {\n this.expand = !this.expand;\n }\n\n if (this.aboutPopover) {\n this.aboutPopover.expanded = this.expand;\n }\n\n this.expandChange.emit(this.expand);\n }\n\n /**\n * Toggle Settings tabs\n * @param show\n */\n @Method()\n async toggleSettings(show: boolean) {\n if (this.showAbout) {\n this.skipAllOverlayAnimations();\n } else {\n this.skipOverlayAnimationFor(this.about);\n }\n\n this.about?.classList.add('d-none');\n\n this.resetOverlay();\n this.showSettings = show;\n this.settings.show = this.showSettings;\n this.settings.classList.remove('d-none');\n this.overlayContainer.classList.remove('d-none');\n }\n\n /**\n * Toggle About tabs\n * @param show\n */\n @Method()\n async toggleAbout(show: boolean) {\n if (this.showSettings) {\n this.skipAllOverlayAnimations();\n } else {\n this.skipOverlayAnimationFor(this.settings);\n }\n\n this.settings?.classList.add('d-none');\n\n this.resetOverlay();\n this.showAbout = show;\n this.about.show = this.showAbout;\n this.about.classList.remove('d-none');\n this.overlayContainer.classList.remove('d-none');\n }\n\n private resetOverlay() {\n this.showSettings = false;\n this.showAbout = false;\n\n if (this.settings) {\n this.settings.show = this.showSettings;\n }\n\n if (this.about) {\n this.about.show = this.showAbout;\n }\n\n this.toggleMenu(false);\n }\n\n private showMoreButton() {\n const menuItemCount = this.menuItems.length;\n\n if (menuItemCount === 1) {\n return false;\n }\n\n if (menuItemCount < this.maxVisibleMenuItems) {\n return this.visibleMenuItems < menuItemCount;\n }\n\n if (menuItemCount > this.maxVisibleMenuItems) {\n return this.visibleMenuItems < this.maxVisibleMenuItems;\n }\n\n return this.visibleMenuItems <= this.maxVisibleMenuItems - 2;\n }\n\n private getCollapseText() {\n return this.mapExpand ? this.i18nCollapse : this.i18nExpand;\n }\n\n private getCollapseIcon() {\n return this.mapExpand ? 'double-chevron-left' : 'double-chevron-right';\n }\n\n private isMenuItemClicked(event: MouseEvent) {\n const path = event.composedPath();\n const menuItems = (path as HTMLElement[])\n .filter((element) => element.id !== 'ix-menu-more-tab')\n .filter((element) => {\n return element.tagName === 'IX-MENU-ITEM';\n });\n\n return menuItems.some((menu) => this.tabsContainer.contains(menu));\n }\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expand,\n [`mode-${this.mode}`]: true,\n }}\n >\n <div\n class={{\n menu: true,\n expanded: this.expand,\n }}\n onClick={() => {\n this.resetActiveTab();\n }}\n >\n <ix-burger-menu\n onClick={async () => this.toggleMenu()}\n expanded={this.expand}\n class={{\n 'burger-menu': true,\n }}\n ></ix-burger-menu>\n <div id=\"avatar-tab-placeholder\"></div>\n <div\n id=\"menu-tabs\"\n style={{\n display: 'contents',\n }}\n onClick={(event) => {\n if (this.isMenuItemClicked(event)) {\n this.resetOverlay();\n }\n }}\n >\n <div class=\"tabs-top\"></div>\n <slot></slot>\n <div class=\"active-more-tab\">\n {this.activeTab ? (\n <ix-menu-item\n class=\"internal-tab\"\n active={true}\n tabIcon={this.activeTab.tabIcon}\n >\n {this.activeTab.innerText}\n </ix-menu-item>\n ) : null}\n </div>\n <ix-menu-item\n id=\"ix-menu-more-tab\"\n tabIcon=\"more-menu\"\n class={{\n 'internal-tab': true,\n }}\n style={{\n display: this.showMoreButton() ? 'block' : 'none',\n }}\n title=\"Show more\"\n notifications={this.countMoreNotifications}\n >\n {this.i18nMore}\n <ix-dropdown\n trigger={'ix-menu-more-tab'}\n positioningStrategy={'fixed'}\n placement={'right-start'}\n >\n {this.menuItems\n .filter(\n (elm: HTMLIxMenuItemElement, index) =>\n !this.showTab(index) &&\n !this.isMenuItemActive(elm) &&\n this.isVisible(elm)\n )\n .map((e: HTMLIxMenuItemElement) => {\n return (\n <ix-menu-item\n tabIcon={e.tabIcon}\n active={e.active}\n class=\"internal-tab appended\"\n onClick={() => {\n this.resetOverlay();\n e.dispatchEvent(new CustomEvent('click'));\n }}\n >\n {e.innerText}\n </ix-menu-item>\n );\n })}\n </ix-dropdown>\n </ix-menu-item>\n </div>\n <div class=\"bottom-tab-divider\"></div>\n {this.enableSettings && !this.isSettingsEmpty ? (\n <ix-menu-item\n id=\"settings\"\n class={{\n 'internal-tab': true,\n 'bottom-tab': true,\n active: this.showSettings,\n }}\n tabIcon=\"cogwheel\"\n onClick={async () => this.toggleSettings(!this.showSettings)}\n >\n {this.i18nSettings}\n </ix-menu-item>\n ) : null}\n <slot name=\"bottom\"></slot>\n <div id=\"popover-area\"></div>\n {this.about ? (\n <ix-menu-item\n id=\"aboutAndLegal\"\n class={{\n 'internal-tab': true,\n 'bottom-tab': true,\n active: this.showAbout,\n }}\n tabIcon=\"info\"\n onClick={async () => this.toggleAbout(!this.showAbout)}\n >\n {this.i18nLegal}\n </ix-menu-item>\n ) : null}\n {this.enableToggleTheme ? (\n <ix-menu-item\n id=\"toggleTheme\"\n onClick={() => themeSwitcher.toggleMode()}\n class=\"internal-tab bottom-tab\"\n tabIcon=\"bulb\"\n >\n {this.i18nToggleTheme}\n </ix-menu-item>\n ) : null}\n {this.enableMapExpand ? (\n <ix-menu-item\n id=\"menu-collapse\"\n onClick={() => this.mapExpandChange.emit(this.mapExpand)}\n class=\"internal-tab bottom-tab\"\n tabIcon={`${this.getCollapseIcon()}`}\n >\n {this.getCollapseText()}\n </ix-menu-item>\n ) : null}\n </div>\n <div\n class={{\n 'menu-overlay': true,\n expanded: this.expand,\n 'd-block': this.showAbout || this.showSettings,\n }}\n style={{\n opacity: this.showAbout || this.showSettings ? '1' : '0',\n }}\n ></div>\n <div class=\"menu-overlay-invisible\"></div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .about-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 0;\n }\n }\n\n .about-tabs {\n margin-bottom: $large-space;\n }\n\n ix-menu-about-item {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n forceUpdate,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about',\n styleUrl: 'menu-about.scss',\n scoped: true,\n})\nexport class MenuAbout {\n /**\n * Active tab\n */\n @Prop({ mutable: true }) activeTabLabel: string;\n\n /**\n * Label of first tab\n */\n @Prop() label = 'About & legal information';\n\n /**\n * Internal\n */\n @Prop() show = false;\n\n @Element() el!: HTMLIxMenuAboutElement;\n\n /**\n * About and Legal closed\n */\n @Event() close: EventEmitter<MouseEvent>;\n\n @State() labels: string[] = [];\n\n get aboutItems(): HTMLIxMenuAboutItemElement[] {\n return Array.from(this.el.querySelectorAll('ix-menu-about-item'));\n }\n\n private setTab(label: string) {\n this.activeTabLabel = label;\n this.aboutItems.forEach((i) => {\n i.style.display = 'none';\n if (i.label === this.activeTabLabel) {\n i.style.display = 'block';\n }\n });\n }\n\n componentWillLoad() {\n if (this.aboutItems.length) {\n this.setTab(this.activeTabLabel || this.aboutItems[0].label);\n }\n }\n\n componentDidLoad() {\n forceUpdate(this.el);\n }\n\n componentWillRender() {\n this.updateLabels();\n }\n\n private updateLabels() {\n this.labels = this.aboutItems.map((i) => i.label);\n }\n\n @Watch('activeTabLabel')\n watchActiveTabLabel(value: string) {\n // Wait a DOM render cycle to get changed labels\n setTimeout(() => this.setTab(value));\n }\n\n private getSelectedTabIndex(label: string) {\n const selectedItem = this.aboutItems.find((item) => item.label === label);\n return this.aboutItems.indexOf(selectedItem);\n }\n\n private getTabItems() {\n return this.aboutItems.map(({ label }) => {\n return (\n <ix-tab-item\n class={{\n active: label === this.activeTabLabel,\n }}\n onClick={() => this.setTab(label)}\n >\n {label}\n </ix-tab-item>\n );\n });\n }\n\n render() {\n return (\n <Host\n class={{\n animate__animated: true,\n animate__fadeInLeft: this.show,\n animate__fadeOutLeft: !this.show,\n }}\n >\n <div class=\"about-header\">\n <h2 class=\"text-h2\">{this.label}</h2>\n <ix-icon-button\n ghost\n size=\"24\"\n icon=\"close\"\n onClick={(e) => this.close.emit(e)}\n ></ix-icon-button>\n </div>\n <ix-tabs\n selected={this.getSelectedTabIndex(this.activeTabLabel)}\n class=\"about-tabs\"\n >\n {this.getTabItems()}\n </ix-tabs>\n <div class=\"about-items\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about-item',\n styleUrl: 'menu-about-item.css',\n scoped: true,\n})\nexport class MenuAboutItem {\n /**\n * About Item label\n */\n @Prop({ reflect: true }) label: string;\n\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/shadows';\n\n:host {\n --margin: 0.5rem;\n\n $left: 4rem;\n display: block;\n position: fixed;\n width: 20rem;\n height: auto;\n background-color: var(--theme-color-1);\n border: var(--theme-weak-bdr-1);\n border-radius: $default-border-radius;\n padding: 1rem;\n left: $left;\n z-index: 10000;\n transition: left var(--animate-duration);\n\n margin-left: var(--margin) !important;\n\n @include box-shadow(4);\n\n &.expanded {\n left: calc(#{$left} + 12rem);\n }\n\n &.show {\n display: none;\n }\n\n .banner-container {\n position: absolute;\n top: 0.0625rem;\n left: $default-space;\n\n svg {\n position: absolute;\n height: 3.625rem;\n width: 3rem;\n\n polygon {\n fill: var(--theme-color-primary);\n }\n }\n\n ix-icon {\n margin: $small-space;\n position: absolute;\n z-index: 1;\n }\n }\n\n .cui-popover-news-header {\n margin-bottom: 2rem;\n margin-left: 4rem;\n margin-top: -$tiny-space;\n }\n\n .popover-body {\n color: var(--theme-color-std-text);\n }\n\n .cui-popover-news-footer {\n display: flex;\n justify-content: flex-end;\n margin-top: 1rem;\n }\n\n ix-icon-button {\n top: $small-space;\n right: $small-space;\n position: absolute;\n }\n\n #arrow {\n position: absolute;\n width: 0.5rem;\n height: 0.5rem;\n background-color: var(--theme-color-1);\n border-left: var(--theme-weak-bdr-1);\n border-bottom: var(--theme-weak-bdr-1);\n transform: translateX(calc(var(--margin) * -1 - 0.8rem)) rotateZ(45deg);\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about-news',\n styleUrl: 'menu-about-news.scss',\n scoped: true,\n})\nexport class MenuAboutNews {\n /**\n * Show about news\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Title of the about news\n */\n @Prop() label: string;\n\n /**\n *\n */\n @Prop() i18nShowMore = 'Show more';\n\n /**\n * Subtitle of the about news\n */\n @Prop() aboutItemLabel: string;\n\n /**\n * Bottom offset\n */\n @Prop() offsetBottom = 0;\n\n /**\n * Show More button is pressed\n */\n @Event() showMore: EventEmitter<MouseEvent>;\n\n /**\n * Popover closed\n */\n @Event() closePopover: EventEmitter<void>;\n\n /**\n * Internal\n */\n @Prop() expanded = false;\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expanded,\n show: !this.show,\n }}\n >\n <div class=\"banner-container\">\n <ix-icon\n color=\"color-inv-contrast-text\"\n name=\"shout\"\n size=\"32\"\n ></ix-icon>\n <svg viewBox=\"0 0 48 56\" xmlns=\"http://www.w3.org/2000/svg\">\n <polygon points=\"0 0 48 0 48 56 24 48 0 56\" />\n </svg>\n </div>\n\n <div class=\"cui-popover-news-header\">\n <span class=\"text-l-title\">{this.label}</span>\n </div>\n\n <ix-icon-button\n size=\"24\"\n icon=\"close-small\"\n ghost\n onClick={() => {\n this.show = false;\n this.closePopover.emit();\n }}\n ></ix-icon-button>\n <slot></slot>\n {this.aboutItemLabel ? (\n <div class=\"cui-popover-news-footer\">\n <button\n class=\"btn btn-primary\"\n onClick={(e) => {\n this.show = false;\n this.showMore.emit(e);\n }}\n >\n {this.i18nShowMore}\n </button>\n </div>\n ) : null}\n <div id=\"arrow\"></div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/hover';\n\n:host {\n display: block;\n position: relative;\n margin-bottom: 0.5rem;\n\n .avatar {\n display: flex;\n align-items: center;\n height: 2.5rem;\n max-height: 2.5rem;\n padding-left: 0.25rem;\n margin-left: 0.75rem;\n margin-right: 0.75rem;\n transition: 0.15s;\n\n > .avatar-image {\n height: 2rem;\n width: 2rem;\n min-height: 2rem;\n min-width: 2rem;\n border-radius: 100px;\n }\n\n > .avatar-initials {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 2rem;\n width: 2rem;\n min-height: 2rem;\n min-width: 2rem;\n border-radius: 100px;\n background-color: var(--theme-color-component-3);\n }\n\n #avatar-path-background {\n fill: var(--theme-avatar--background);\n }\n\n #avatar-path-person {\n fill: var(--theme-color-4);\n }\n\n .avatar-name {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n white-space: nowrap;\n margin-left: $default-space;\n line-height: 1.14;\n\n .text-default-single {\n @include ellipsis;\n }\n }\n\n border-radius: 1.25rem;\n\n @include hover {\n background-color: var(--theme-avatar-btn--background--hover);\n color: var(--theme-avatar-btn--color--hover);\n }\n\n @include active {\n background-color: var(--theme-avatar-btn--background--active);\n color: var(--theme-avatar-btn--color--active);\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nfunction DefaultAvatar(props: { initials?: string }) {\n const { initials } = props;\n\n if (initials) {\n return <div class={'avatar-initials'}>{initials}</div>;\n }\n\n return (\n <svg\n class={'avatar-image'}\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"32\"\n height=\"32\"\n viewBox=\"0 0 32 32\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <path\n id=\"avatar-path-background\"\n d=\"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n 16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z\"\n />\n <path\n id=\"avatar-path-person\"\n d=\"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n 6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n 9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n 6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z\"\n />\n </g>\n </svg>\n );\n}\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-avatar',\n styleUrl: 'menu-avatar.scss',\n scoped: true,\n})\nexport class MenuAvatar {\n @Element() hostElement: HTMLIxMenuAvatarElement;\n\n /**\n * First line of text\n */\n @Prop() top: string;\n\n /**\n * Second line of text\n */\n @Prop() bottom: string;\n\n /**\n * Display a avatar image\n *\n * @since 1.4.0\n */\n @Prop() image: string;\n\n /**\n * Display the initials of the user. Will be overwritten by image\n *\n * @since 1.4.0\n */\n @Prop() initials: string;\n\n /**\n * Use for translation\n */\n @Prop() i18nLogout = 'Logout';\n\n /**\n * Logout click\n */\n @Event() logoutClick: EventEmitter;\n\n private avatarElementId = 'ix-menu-avatar-id';\n\n render() {\n return (\n <Host>\n <li\n class=\"nav-item top-item avatar no-hover\"\n title={this.top}\n id={this.avatarElementId}\n >\n {this.image ? (\n <img src={this.image} class=\"avatar-image\"></img>\n ) : (\n <DefaultAvatar initials={this.initials} />\n )}\n <div class=\"avatar-name\">\n <span class=\"text-default-single\" title={this.top}>\n {this.top}\n </span>\n <span class=\"text-default-single\" title={this.bottom}>\n {this.bottom}\n </span>\n </div>\n </li>\n <ix-dropdown\n trigger={this.avatarElementId}\n placement={'right-start'}\n offset={{\n mainAxis: 12,\n }}\n >\n <slot></slot>\n <ix-menu-avatar-item\n label={this.i18nLogout}\n icon=\"log-out\"\n onClick={(e) => {\n this.logoutClick.emit(e);\n }}\n ></ix-menu-avatar-item>\n </ix-dropdown>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-avatar-item',\n styleUrl: 'menu-avatar-item.css',\n scoped: true,\n})\nexport class MenuAvatarItem {\n /**\n * Avatar dropdown icon\n */\n @Prop() icon: string;\n\n /**\n * Avatar dropdown label\n */\n @Prop() label: string;\n\n /**\n * Avatar dropdown item clicked\n */\n @Event() itemClick: EventEmitter<MouseEvent>;\n\n @Element() hostElement: HTMLIxMenuAvatarItemElement;\n\n render() {\n return (\n <ix-dropdown-item\n icon={this.icon}\n label={this.label}\n onClick={(e) => this.itemClick.emit(e)}\n ></ix-dropdown-item>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n position: relative;\n display: block;\n cursor: pointer;\n @include ghost-hover-pressed;\n\n .tab {\n display: flex;\n position: relative;\n align-items: center;\n height: 3rem;\n z-index: 500;\n padding-left: 1.25rem;\n }\n\n i.glyph {\n color: var(--theme-nav-item-primary-icon--color);\n position: relative;\n }\n\n .tab:focus-visible {\n outline: none;\n }\n\n &:focus-visible {\n outline: none;\n }\n\n .tab:not(:last-child) {\n margin-bottom: $small-space;\n }\n\n .notification {\n display: inline-flex;\n position: absolute;\n top: -$small-space;\n right: -50%;\n\n .pill {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n height: 1rem;\n min-width: 1rem;\n position: relative;\n border-radius: 6.25rem;\n background-color: var(--theme-color-primary);\n border-radius: 6.25rem;\n font-size: 0.75rem;\n font-weight: bold;\n line-height: 1;\n font-family: Siemens Sans, Arial, sans-serif;\n color: var(--theme-color-primary--contrast);\n padding: $tiny-space;\n }\n }\n\n .tab-text {\n @include ellipsis;\n color: var(--theme-nav-item-primary--color);\n margin: 0 1.25rem;\n user-select: none;\n }\n\n &.active,\n &.selected {\n .tab {\n background-color: var(--theme-nav-item-primary--background--selected);\n }\n\n .tab::before {\n content: '';\n background-color: var(--theme-nav-item-primary--border-color--selected);\n height: 3rem;\n width: 0.25rem;\n left: 0;\n position: absolute;\n }\n\n .tab > .glyph {\n color: var(--theme-nav-item-primary-icon--color--selected);\n }\n }\n\n &.disabled {\n color: var(--theme-color-weak-text);\n pointer-events: none;\n cursor: default;\n\n .tab > .glyph {\n color: var(--theme-color-weak-text);\n }\n\n .tab-text {\n color: var(--theme-color-weak-text);\n }\n }\n\n &.home-tab,\n &[slot='home'] {\n margin-bottom: 1.5rem;\n }\n\n &.bottom-tab,\n &[slot='bottom'] {\n $bottom-height: 2.25rem;\n\n height: $bottom-height;\n\n .tab {\n height: $bottom-height;\n }\n\n .tab::before {\n height: $bottom-height;\n background-color: transparent;\n }\n\n &.active,\n &.selected {\n .tab {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n\n &:hover {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n\n &:active {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-item',\n styleUrl: 'menu-item.scss',\n scoped: true,\n})\nexport class MenuItem {\n /**\n * Move the Tab to a top position.\n */\n @Prop() home = false;\n\n /**\n * Caution: this is no longer working. Please use slot=\"bottom\" instead.\n *\n * Place tab on bottom\n *\n * @deprecated Will be removed in 2.0.0. Replaced by slot based implementation\n */\n @Prop() bottom = false;\n\n /**\n * Icon name from @siemens/ix-icons\n */\n @Prop() tabIcon = 'document';\n\n /**\n * Show notification cound on tab\n */\n @Prop() notifications: number;\n\n /**\n * State to display active\n */\n @Prop() active: boolean;\n\n /**\n * Disable tab and remove event handlers\n */\n @Prop() disabled: boolean;\n\n @Element() hostElement: HTMLIxMenuItemElement;\n\n @State() title: string;\n\n get tabLabel() {\n return this.hostElement.querySelector('.tab-text');\n }\n\n componentDidRender() {\n const spanElement = this.tabLabel;\n const newTitle = spanElement.innerHTML.replace('&', '&');\n if (this.title !== newTitle) {\n this.title = newTitle;\n }\n }\n\n render() {\n return (\n <Host\n class={{\n disabled: this.disabled,\n 'home-tab': this.home,\n 'bottom-tab': this.bottom,\n active: this.active,\n }}\n >\n <li class=\"tab\" title={this.title}>\n <i class={`glyph glyph-${this.tabIcon}`}>\n <div class=\"notification\">\n {this.notifications ? (\n <div class=\"pill\">{this.notifications}</div>\n ) : null}\n </div>\n </i>\n <span class=\"tab-text text-default\">\n <slot></slot>\n </span>\n </li>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .settings-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 0;\n }\n }\n\n .settings-tabs {\n margin-bottom: $large-space;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n forceUpdate,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-settings',\n styleUrl: 'menu-settings.scss',\n scoped: true,\n})\nexport class MenuAbout {\n /**\n * active tab\n */\n @Prop({ mutable: true }) activeTabLabel: string;\n\n /**\n * Label\n */\n @Prop() label = 'Settings';\n\n /**\n * Internal\n */\n @Prop() show = false;\n\n @Element() el!: HTMLIxMenuSettingsElement;\n\n /**\n * Popover closed\n */\n @Event() close: EventEmitter<MouseEvent>;\n\n get settingsItems(): HTMLIxMenuSettingsItemElement[] {\n return Array.from(this.el.querySelectorAll('ix-menu-settings-item'));\n }\n\n private setTab(label: string) {\n this.activeTabLabel = label;\n this.settingsItems.forEach((i) => {\n i.style.display = 'none';\n\n if (i.label === this.activeTabLabel) {\n i.style.display = 'block';\n }\n });\n }\n\n componentWillLoad() {\n if (this.settingsItems.length) {\n this.setTab(this.activeTabLabel || this.settingsItems[0].label);\n }\n }\n\n componentDidLoad() {\n forceUpdate(this.el);\n }\n\n @Watch('activeTabLabel')\n watchActiveTabLabel(value: string) {\n this.setTab(value);\n }\n\n private getTabItems() {\n return this.settingsItems.map(({ label }) => {\n return (\n <ix-tab-item\n class={{\n active: label === this.activeTabLabel,\n }}\n onClick={() => this.setTab(label)}\n >\n {label}\n </ix-tab-item>\n );\n });\n }\n\n render() {\n return (\n <Host\n class={{\n animate__animated: true,\n animate__fadeInLeft: this.show,\n animate__fadeOutLeft: !this.show,\n }}\n >\n <div class=\"settings-header\">\n <h2 class=\"text-h2\">{this.label}</h2>\n <ix-icon-button\n ghost\n size=\"24\"\n icon=\"close\"\n onClick={(e) => this.close.emit(e)}\n ></ix-icon-button>\n </div>\n <ix-tabs>{this.getTabItems()}</ix-tabs>\n <slot></slot>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: block;\n\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-settings-item',\n styleUrl: 'menu-settings-item.css',\n scoped: true,\n})\nexport class MenuSettingsItem {\n /**\n * Label\n */\n @Prop() label: string;\n\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as i,c as e,h as d,H as n,g as l}from"./p-8fcd6f85.js";import{a as t}from"./p-810b5232.js";const s=i=>i?"true":"false";const r=".sc-ix-blind-h{display:flex;flex-direction:column;background-color:var(--theme-blind-base--background);border:solid var(--theme-blind--border-thickness) var(--theme-blind-base--border-color);border-radius:var(--theme-blind--border-radius);overflow:hidden}.sc-ix-blind-h .blind-header.sc-ix-blind{all:unset;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;min-height:3rem;height:3rem;border:solid var(--theme-blind--border-thickness) transparent;border-radius:var(--theme-blind--border-radius) var(--theme-blind--border-radius) 0 0;padding-right:0.5rem;transition:border-radius 150ms;cursor:pointer;z-index:1;color:var(--theme-blind-header-closed--color);background-color:var(--theme-blind-header-closed--background)}.sc-ix-blind-h .blind-header.sc-ix-blind .glyph.sc-ix-blind{color:var(--theme-blind-header-icon-closed--color);padding:0.25rem 0.5rem}.sc-ix-blind-h .blind-header.sc-ix-blind .blind-header-title.sc-ix-blind,.sc-ix-blind-h .blind-header.sc-ix-blind .blind-header-title-basic.sc-ix-blind{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;flex-grow:1;height:100%}.sc-ix-blind-h .blind-header.sc-ix-blind .blind-header-title.sc-ix-blind .blind-header-title-default.sc-ix-blind,.sc-ix-blind-h .blind-header.sc-ix-blind .blind-header-title-basic.sc-ix-blind .blind-header-title-default.sc-ix-blind{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text);-webkit-margin-end:0.5rem;margin-inline-end:0.5rem;flex-grow:1}.sc-ix-blind-h .blind-header.sc-ix-blind .blind-header-title-basic.sc-ix-blind ix-icon.sc-ix-blind{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}.sc-ix-blind-h .blind-header.sc-ix-blind:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-blind-h .blind-header.sc-ix-blind:not(.disabled):not(:disabled):hover{background-color:var(--theme-blind-header-open--background--hover)}.sc-ix-blind-h .blind-header.sc-ix-blind:not(.disabled):not(:disabled):hover .glyph.sc-ix-blind{color:var(--theme-blind-header-icon-open--color--hover)}.sc-ix-blind-h .blind-header.sc-ix-blind:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-blind-h .blind-header.sc-ix-blind:not(.disabled):not(:disabled):active{background-color:var(--theme-blind-header-open--background--active)}.sc-ix-blind-h .blind-header.sc-ix-blind:not(.disabled):not(:disabled):active .glyph.sc-ix-blind{color:var(--theme-blind-header-icon-open--color--active)}.sc-ix-blind-h .blind-header.sc-ix-blind:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-color-focus-bdr);outline:none}.sc-ix-blind-h .blind-header.closed.sc-ix-blind{border-radius:var(--theme-blind--border-radius)}.sc-ix-blind-h .blind-header.closed.sc-ix-blind:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-blind-h .blind-header.closed.sc-ix-blind:not(.disabled):not(:disabled):hover{background-color:var(--theme-blind-header-open--background--hover)}.sc-ix-blind-h .blind-header.closed.sc-ix-blind:not(.disabled):not(:disabled):hover .glyph.sc-ix-blind{color:var(--theme-blind-header-icon-closed--color--hover)}.sc-ix-blind-h .blind-header.closed.sc-ix-blind:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-blind-h .blind-header.closed.sc-ix-blind:not(.disabled):not(:disabled):active{background-color:var(--theme-blind-header-open--background--active)}.sc-ix-blind-h .blind-header.closed.sc-ix-blind:not(.disabled):not(:disabled):active .glyph.sc-ix-blind{color:var(--theme-blind-header-icon-closed--color--active)}.sc-ix-blind-h .blind-content.sc-ix-blind{display:block;padding:1rem;transition-property:padding;transition-duration:150ms;transition-timing-function:ease-in}.sc-ix-blind-h .blind-content.hide.sc-ix-blind{max-height:0;padding-top:0px;padding-bottom:0px}";let a=0;const o=class{constructor(d){i(this,d);this.collapsedChange=e(this,"collapsedChange",7);this.id=++a;this.collapsed=false;this.label=undefined;this.icon=undefined}onHeaderClick(i){if(i.target.closest(".header-actions")){return}i.preventDefault();i.stopImmediatePropagation();this.collapsed=!this.collapsed;this.collapsedChange.emit(this.collapsed)}componentDidLoad(){this.animateCollapse(this.collapsed)}get content(){return this.hostElement.querySelector(".blind-content")}animation(i){this.animateCollapse(i)}animateCollapse(i){if(i){this.rotateChevronRight()}else{this.rotateChevronDown()}}rotateChevronDown(){t({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:90});t({targets:this.content,duration:150,easing:"easeInOutSine",opacity:1})}rotateChevronRight(){t({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:0});t({targets:this.content,duration:150,easing:"easeInOutSine",opacity:0})}render(){return d(n,null,d("button",{class:{"blind-header":true,closed:this.collapsed},type:"button","aria-labelledby":`ix-blind-header-title-${this.id}`,"aria-controls":`ix-blind-content-section-${this.id}`,"aria-expanded":s(!this.collapsed),onClick:i=>this.onHeaderClick(i)},d("span",{class:{glyph:true,"glyph-chevron-right-small":true},ref:i=>this.chevronRef=i}),d("div",{class:"blind-header-title",id:`ix-blind-header-title-${this.id}`},this.label!==undefined?d("span",{class:"blind-header-title-basic"},this.icon!==undefined?d("ix-icon",{name:this.icon}):"",d("span",{class:"blind-header-title-default"},this.label),d("span",{class:"header-actions"},d("slot",{name:"header-actions"}))):d("slot",{name:"custom-header"}))),d("section",{id:`ix-blind-content-section-${this.id}`,"aria-labelledby":`ix-blind-header-title-${this.id}`},d("div",{class:{"blind-content":true,hide:this.collapsed}},d("slot",null))))}get hostElement(){return l(this)}static get watchers(){return{collapsed:["animation"]}}};o.style=r;export{o as ix_blind};
|
|
2
|
-
//# sourceMappingURL=p-53c69375.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["a11yBoolean","value","blindCss","sequentialInstanceId","Blind","constructor","hostRef","this","id","onHeaderClick","e","target","closest","preventDefault","stopImmediatePropagation","collapsed","collapsedChange","emit","componentDidLoad","animateCollapse","content","hostElement","querySelector","animation","isCollapsed","rotateChevronRight","rotateChevronDown","anime","targets","chevronRef","duration","easing","rotateZ","opacity","render","h","Host","class","closed","type","onClick","glyph","ref","label","undefined","icon","name","hide"],"sources":["./src/components/utils/a11y.ts","./src/components/blind/blind.scss?tag=ix-blind&encapsulation=scoped","./src/components/blind/blind.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nexport const a11yBoolean = (value: boolean) => (value ? 'true' : 'false');\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n display: flex;\n flex-direction: column;\n background-color: var(--theme-blind-base--background);\n border: solid var(--theme-blind--border-thickness)\n var(--theme-blind-base--border-color);\n border-radius: var(--theme-blind--border-radius);\n overflow: hidden;\n\n .blind-header {\n all: unset;\n @include ellipsis;\n\n display: flex;\n align-items: center;\n min-height: 3rem;\n height: 3rem;\n border: solid var(--theme-blind--border-thickness) transparent;\n border-radius: var(--theme-blind--border-radius)\n var(--theme-blind--border-radius) 0 0;\n padding-right: $small-space;\n transition: border-radius $default-time;\n cursor: pointer;\n\n z-index: 1;\n\n color: var(--theme-blind-header-closed--color);\n background-color: var(--theme-blind-header-closed--background);\n\n .glyph {\n color: var(--theme-blind-header-icon-closed--color);\n padding: $tiny-space $small-space;\n }\n\n .blind-header-title,\n .blind-header-title-basic {\n @include ellipsis;\n display: flex;\n align-items: center;\n flex-grow: 1;\n height: 100%;\n\n .blind-header-title-default {\n @include ellipsis;\n @include text-l-title;\n margin-inline-end: $small-space;\n flex-grow: 1;\n }\n }\n\n .blind-header-title-basic ix-icon {\n margin-inline-end: $small-space;\n }\n\n @include hover {\n background-color: var(--theme-blind-header-open--background--hover);\n\n .glyph {\n color: var(--theme-blind-header-icon-open--color--hover);\n }\n }\n\n @include active {\n background-color: var(--theme-blind-header-open--background--active);\n\n .glyph {\n color: var(--theme-blind-header-icon-open--color--active);\n }\n }\n\n @include focus-visible {\n border-color: var(--theme-color-focus-bdr);\n outline: none;\n }\n\n &.closed {\n border-radius: var(--theme-blind--border-radius);\n\n @include hover {\n background-color: var(--theme-blind-header-open--background--hover);\n\n .glyph {\n color: var(--theme-blind-header-icon-closed--color--hover);\n }\n }\n\n @include active {\n background-color: var(--theme-blind-header-open--background--active);\n\n .glyph {\n color: var(--theme-blind-header-icon-closed--color--active);\n }\n }\n }\n }\n\n .blind-content {\n display: block;\n padding: 1rem;\n transition-property: padding;\n transition-duration: $default-time;\n transition-timing-function: ease-in;\n\n &.hide {\n max-height: 0;\n padding-top: 0px;\n padding-bottom: 0px;\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { a11yBoolean } from '../utils/a11y';\n\nlet sequentialInstanceId = 0;\n@Component({\n tag: 'ix-blind',\n styleUrl: 'blind.scss',\n scoped: true,\n})\nexport class Blind {\n /**\n * Collapsed state\n */\n @Prop({ mutable: true, reflect: true }) collapsed = false;\n\n /**\n * Label of blind\n */\n @Prop() label: string;\n\n /**\n * Optional icon to be displayed next to the header label\n * @since 1.5.0\n */\n @Prop() icon: string;\n\n /**\n * Collapsed state changed\n */\n @Event() collapsedChange: EventEmitter<boolean>;\n\n @Element() hostElement!: HTMLIxBlindElement;\n\n private chevronRef: HTMLElement;\n private id = ++sequentialInstanceId;\n\n constructor() {}\n\n private onHeaderClick(e: Event) {\n if ((e.target as Element).closest('.header-actions')) {\n return;\n }\n\n e.preventDefault();\n e.stopImmediatePropagation();\n\n this.collapsed = !this.collapsed;\n this.collapsedChange.emit(this.collapsed);\n }\n\n componentDidLoad() {\n this.animateCollapse(this.collapsed);\n }\n\n get content() {\n return this.hostElement.querySelector('.blind-content');\n }\n\n @Watch('collapsed')\n animation(isCollapsed: boolean) {\n this.animateCollapse(isCollapsed);\n }\n\n private animateCollapse(isCollapsed: boolean) {\n if (isCollapsed) {\n this.rotateChevronRight();\n } else {\n this.rotateChevronDown();\n }\n }\n\n private rotateChevronDown() {\n anime({\n targets: this.chevronRef,\n duration: 150,\n easing: 'easeInOutSine',\n rotateZ: 90,\n });\n anime({\n targets: this.content,\n duration: 150,\n easing: 'easeInOutSine',\n opacity: 1,\n });\n }\n\n private rotateChevronRight() {\n anime({\n targets: this.chevronRef,\n duration: 150,\n easing: 'easeInOutSine',\n rotateZ: 0,\n });\n anime({\n targets: this.content,\n duration: 150,\n easing: 'easeInOutSine',\n opacity: 0,\n });\n }\n\n render() {\n return (\n <Host>\n <button\n class={{\n 'blind-header': true,\n closed: this.collapsed,\n }}\n type=\"button\"\n aria-labelledby={`ix-blind-header-title-${this.id}`}\n aria-controls={`ix-blind-content-section-${this.id}`}\n aria-expanded={a11yBoolean(!this.collapsed)}\n onClick={(e) => this.onHeaderClick(e)}\n >\n <span\n class={{\n glyph: true,\n 'glyph-chevron-right-small': true,\n }}\n ref={(ref) => (this.chevronRef = ref)}\n ></span>\n <div\n class=\"blind-header-title\"\n id={`ix-blind-header-title-${this.id}`}\n >\n {this.label !== undefined ? (\n <span class=\"blind-header-title-basic\">\n {this.icon !== undefined ? (\n <ix-icon name={this.icon}></ix-icon>\n ) : (\n ''\n )}\n <span class=\"blind-header-title-default\">{this.label}</span>\n <span class=\"header-actions\">\n <slot name=\"header-actions\"></slot>\n </span>\n </span>\n ) : (\n <slot name=\"custom-header\"></slot>\n )}\n </div>\n </button>\n <section\n id={`ix-blind-content-section-${this.id}`}\n aria-labelledby={`ix-blind-header-title-${this.id}`}\n >\n <div\n class={{\n 'blind-content': true,\n hide: this.collapsed,\n }}\n >\n <slot></slot>\n </div>\n </section>\n </Host>\n );\n }\n}\n"],"mappings":"oGAQO,MAAMA,EAAeC,GAAoBA,EAAQ,OAAS,QCRjE,MAAMC,EAAW,k1HCsBjB,IAAIC,EAAuB,E,MAMdC,EAAK,MA2BhBC,YAAAC,G,2DAFQC,KAAAC,KAAOL,E,eArBqC,M,yCAyB5CM,cAAcC,GACpB,GAAKA,EAAEC,OAAmBC,QAAQ,mBAAoB,CACpD,M,CAGFF,EAAEG,iBACFH,EAAEI,2BAEFP,KAAKQ,WAAaR,KAAKQ,UACvBR,KAAKS,gBAAgBC,KAAKV,KAAKQ,U,CAGjCG,mBACEX,KAAKY,gBAAgBZ,KAAKQ,U,CAGxBK,cACF,OAAOb,KAAKc,YAAYC,cAAc,iB,CAIxCC,UAAUC,GACRjB,KAAKY,gBAAgBK,E,CAGfL,gBAAgBK,GACtB,GAAIA,EAAa,CACfjB,KAAKkB,oB,KACA,CACLlB,KAAKmB,mB,EAIDA,oBACNC,EAAM,CACJC,QAASrB,KAAKsB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,KAEXL,EAAM,CACJC,QAASrB,KAAKa,QACdU,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAILR,qBACNE,EAAM,CACJC,QAASrB,KAAKsB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,IAEXL,EAAM,CACJC,QAASrB,KAAKa,QACdU,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIbC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,UACEE,MAAO,CACL,eAAgB,KAChBC,OAAQ/B,KAAKQ,WAEfwB,KAAK,SAAQ,kBACI,yBAAyBhC,KAAKC,KAAI,gBACpC,4BAA4BD,KAAKC,KAAI,gBACrCR,GAAaO,KAAKQ,WACjCyB,QAAU9B,GAAMH,KAAKE,cAAcC,IAEnCyB,EAAA,QACEE,MAAO,CACLI,MAAO,KACP,4BAA6B,MAE/BC,IAAMA,GAASnC,KAAKsB,WAAaa,IAEnCP,EAAA,OACEE,MAAM,qBACN7B,GAAI,yBAAyBD,KAAKC,MAEjCD,KAAKoC,QAAUC,UACdT,EAAA,QAAME,MAAM,4BACT9B,KAAKsC,OAASD,UACbT,EAAA,WAASW,KAAMvC,KAAKsC,OAAgB,GAItCV,EAAA,QAAME,MAAM,8BAA8B9B,KAAKoC,OAC/CR,EAAA,QAAME,MAAM,kBACVF,EAAA,QAAMW,KAAK,qBAIfX,EAAA,QAAMW,KAAK,oBAIjBX,EAAA,WACE3B,GAAI,4BAA4BD,KAAKC,KAAI,kBACxB,yBAAyBD,KAAKC,MAE/C2B,EAAA,OACEE,MAAO,CACL,gBAAiB,KACjBU,KAAMxC,KAAKQ,YAGboB,EAAA,e"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as i,h as s,H as t}from"./p-8fcd6f85.js";const h=".sc-ix-icon-h{display:inline-flex;height:1.5rem;width:1.5rem;color:var(--theme-color-std-text)}.sc-ix-icon-h i.sc-ix-icon{color:inherit;transition:color 150ms}.size-12.sc-ix-icon-h{height:0.75rem;width:0.75rem}.size-16.sc-ix-icon-h{height:1rem;width:1rem}.size-32.sc-ix-icon-h{height:2rem;width:2rem}";const e=class{constructor(s){i(this,s);this.size=undefined;this.color=undefined;this.name=undefined}render(){return s(t,{style:{color:this.color?`var(--theme-${this.color})`:"inherit"},class:{["size-12"]:this.size==="12",["size-16"]:this.size==="16",["size-24"]:this.size==="24",["size-32"]:this.size==="32"}},s("i",{class:{glyph:true,[`glyph-${this.name}`]:true,"glyph-12":this.size==="12","glyph-16":this.size==="16","glyph-24":this.size==="24","glyph-32":this.size==="32"}},s("slot",null)))}};e.style=h;export{e as ix_icon};
|
|
2
|
-
//# sourceMappingURL=p-5d7e1440.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["iconCss","Icon","render","h","Host","style","color","this","class","size","glyph","name"],"sources":["./src/components/icon/icon.scss?tag=ix-icon&encapsulation=scoped","./src/components/icon/icon.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n\n:host {\n display: inline-flex;\n height: $large-space;\n width: $large-space;\n\n color: var(--theme-color-std-text);\n\n i {\n color: inherit;\n transition: color $default-time;\n }\n}\n\n:host(.size-12) {\n height: $medium-space;\n width: $medium-space;\n}\n\n:host(.size-16) {\n height: $default-space;\n width: $default-space;\n}\n\n:host(.size-32) {\n height: $x-large-space;\n width: $x-large-space;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-icon',\n styleUrl: 'icon.scss',\n scoped: true,\n})\nexport class Icon {\n /**\n * Size of the icon\n */\n @Prop() size: '12' | '16' | '24' | '32';\n\n /**\n * Color of the icon\n */\n @Prop() color: string;\n\n /**\n * Use one of our defined icon names e.g. `copy`.\n */\n @Prop({ reflect: true }) name: string;\n\n render() {\n return (\n <Host\n style={{\n color: this.color ? `var(--theme-${this.color})` : 'inherit',\n }}\n class={{\n ['size-12']: this.size === '12',\n ['size-16']: this.size === '16',\n ['size-24']: this.size === '24',\n ['size-32']: this.size === '32',\n }}\n >\n <i\n class={{\n glyph: true,\n [`glyph-${this.name}`]: true,\n 'glyph-12': this.size === '12',\n 'glyph-16': this.size === '16',\n 'glyph-24': this.size === '24',\n 'glyph-32': this.size === '32',\n }}\n >\n <slot></slot>\n </i>\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAU,+S,MCgBHC,EAAI,M,sFAgBfC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLC,MAAOC,KAAKD,MAAQ,eAAeC,KAAKD,SAAW,WAErDE,MAAO,CACL,CAAC,WAAYD,KAAKE,OAAS,KAC3B,CAAC,WAAYF,KAAKE,OAAS,KAC3B,CAAC,WAAYF,KAAKE,OAAS,KAC3B,CAAC,WAAYF,KAAKE,OAAS,OAG7BN,EAAA,KACEK,MAAO,CACLE,MAAO,KACP,CAAC,SAASH,KAAKI,QAAS,KACxB,WAAYJ,KAAKE,OAAS,KAC1B,WAAYF,KAAKE,OAAS,KAC1B,WAAYF,KAAKE,OAAS,KAC1B,WAAYF,KAAKE,OAAS,OAG5BN,EAAA,c"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as e}from"./p-8fcd6f85.js";const o={"x-small":"text-xs",small:"text-s",caption:"text-caption","caption-single":"text-caption-single",default:"text-default","default-single":"text-default-single",large:"text-l","large-single":"text-l-single",h2:"text-h2","display-large":"text-xl","default-title":"text-default-title","default-title-single":"text-default-title-single"};const s=":host .text-xs{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}:host .text-s{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-caption{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-caption-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}:host .text-default{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}:host .text-default-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}:host .text-default-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}:host .text-default-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}:host .text-l{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-l-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}:host .text-l-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-l-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}:host .text-h2{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}:host .text-xl{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}";const i=class{constructor(e){t(this,e);this.variant="default"}render(){const t={[o[this.variant]]:true};return e("div",{class:t},e("slot",null))}};i.style=s;export{i as ix_typography};
|
|
2
|
-
//# sourceMappingURL=p-63e1264b.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["VariantsMapping","small","caption","default","large","h2","typographyCss","IxTypography","render","typographyClass","this","variant","h","class"],"sources":["./src/components/typography/types.ts","./src/components/typography/typography.scss?tag=ix-typography&encapsulation=shadow","./src/components/typography/typography.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nexport type TypographyVariants =\n | 'x-small'\n | 'small'\n | 'caption'\n | 'caption-single'\n | 'default'\n | 'default-single'\n | 'default-title'\n | 'default-title-single'\n | 'large'\n | 'large-single'\n | 'h2'\n | 'display-large';\n\nexport const VariantsMapping: Record<TypographyVariants, string> = {\n 'x-small': 'text-xs',\n small: 'text-s',\n caption: 'text-caption',\n 'caption-single': 'text-caption-single',\n default: 'text-default',\n 'default-single': 'text-default-single',\n large: 'text-l',\n 'large-single': 'text-l-single',\n h2: 'text-h2',\n 'display-large': 'text-xl',\n 'default-title': 'text-default-title',\n 'default-title-single': 'text-default-title-single',\n};\n","@import 'common-variables';\n@import 'mixins/fonts';\n\n:host {\n .text-xs {\n @include text-xs;\n }\n\n .text-s {\n @include text-s;\n }\n\n .text-caption {\n @include text-caption;\n }\n\n .text-caption-single {\n @include text-caption-single;\n }\n\n .text-default {\n @include text-default;\n }\n\n .text-default-single {\n @include text-default-single;\n }\n\n .text-default-title {\n @include text-default-title;\n }\n\n .text-default-title-single {\n @include text-default-title-single;\n }\n\n .text-l {\n @include text-l;\n }\n\n .text-l-single {\n @include text-l-single;\n }\n\n .text-l-title {\n @include text-l-title;\n }\n\n .text-l-title-single {\n @include text-l-title-single;\n }\n\n .text-h2 {\n @include text-h2;\n }\n\n .text-xl {\n @include text-xl;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Prop } from '@stencil/core';\nimport { TypographyVariants, VariantsMapping } from './types';\n\n/**\n * @internal\n */\n@Component({\n tag: 'ix-typography',\n styleUrl: 'typography.scss',\n shadow: true,\n})\nexport class IxTypography {\n /**\n * Font variant\n */\n @Prop() variant: TypographyVariants = 'default';\n\n render() {\n const typographyClass = {\n [VariantsMapping[this.variant]]: true,\n };\n return (\n <div class={typographyClass}>\n <slot></slot>\n </div>\n );\n }\n}\n"],"mappings":"2CAsBO,MAAMA,EAAsD,CACjE,UAAW,UACXC,MAAO,SACPC,QAAS,eACT,iBAAkB,sBAClBC,QAAS,eACT,iBAAkB,sBAClBC,MAAO,SACP,eAAgB,gBAChBC,GAAI,UACJ,gBAAiB,UACjB,gBAAiB,qBACjB,uBAAwB,6BClC1B,MAAMC,EAAgB,k6F,MCoBTC,EAAY,M,sCAIe,S,CAEtCC,SACE,MAAMC,EAAkB,CACtB,CAACT,EAAgBU,KAAKC,UAAW,MAEnC,OACEC,EAAA,OAAKC,MAAOJ,GACVG,EAAA,a"}
|