@siemens/ix 1.4.2 → 1.5.0-beta.1
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/_commonjsHelpers-1a0c346f.js +2 -0
- package/dist/cjs/_commonjsHelpers-1a0c346f.js.map +1 -0
- package/dist/cjs/animation-d5cc0bec.js +2 -0
- package/dist/cjs/animation-d5cc0bec.js.map +1 -0
- package/dist/cjs/anime.es-8822f296.js +2 -0
- package/dist/cjs/anime.es-8822f296.js.map +1 -0
- package/dist/cjs/base-button-497db257.js +2 -0
- package/dist/cjs/base-button-497db257.js.map +1 -0
- package/dist/cjs/context-a0900b95.js +2 -0
- package/dist/cjs/context-a0900b95.js.map +1 -0
- package/dist/cjs/default-tree-item-89cd1f3f.js +2 -0
- package/dist/cjs/default-tree-item-89cd1f3f.js.map +1 -0
- package/dist/cjs/flip-tile-state-b5ff5ea0.js +2 -0
- package/dist/cjs/flip-tile-state-b5ff5ea0.js.map +1 -0
- package/dist/cjs/floating-ui.dom.esm-01fe5abe.js +2 -0
- package/dist/cjs/floating-ui.dom.esm-01fe5abe.js.map +1 -0
- package/dist/cjs/{index-f4b8e6ee.js → index-478a4b66.js} +133 -3
- package/dist/cjs/index-478a4b66.js.map +1 -0
- package/dist/cjs/index.cjs.js +12 -11
- package/dist/cjs/index.cjs.js.map +1 -0
- package/dist/cjs/ix-animated-tab_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-animated-tab_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-application-header.cjs.entry.js +3 -1
- package/dist/cjs/ix-application-header.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-basic-navigation.cjs.entry.js +3 -1
- package/dist/cjs/ix-basic-navigation.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-blind.cjs.entry.js +9 -4
- package/dist/cjs/ix-blind.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-breadcrumb_2.cjs.entry.js +4 -2
- package/dist/cjs/ix-breadcrumb_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-burger-menu.cjs.entry.js +3 -1
- package/dist/cjs/ix-burger-menu.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-button.cjs.entry.js +3 -1
- package/dist/cjs/ix-button.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-category-filter.cjs.entry.js +6 -4
- package/dist/cjs/ix-category-filter.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-chip.cjs.entry.js +9 -2
- package/dist/cjs/ix-chip.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-counter-pill.cjs.entry.js +3 -1
- package/dist/cjs/ix-counter-pill.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-date-picker_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-date-picker_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-date-time-card.cjs.entry.js +3 -1
- package/dist/cjs/ix-date-time-card.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-datetime-picker.cjs.entry.js +6 -4
- package/dist/cjs/ix-datetime-picker.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-divider.cjs.entry.js +3 -1
- package/dist/cjs/ix-divider.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-drawer.cjs.entry.js +3 -1
- package/dist/cjs/ix-drawer.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-dropdown-button.cjs.entry.js +3 -1
- package/dist/cjs/ix-dropdown-button.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-dropdown-quick-actions.cjs.entry.js +3 -1
- package/dist/cjs/ix-dropdown-quick-actions.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-dropdown_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-dropdown_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-event-list_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-event-list_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-expanding-search.cjs.entry.js +14 -12
- package/dist/cjs/ix-expanding-search.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-filter-chip.cjs.entry.js +5 -3
- package/dist/cjs/ix-filter-chip.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-flip-tile_2.cjs.entry.js +14 -3
- package/dist/cjs/ix-flip-tile_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-group-context-menu.cjs.entry.js +3 -1
- package/dist/cjs/ix-group-context-menu.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-group_3.cjs.entry.js +4 -2
- package/dist/cjs/ix-group_3.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-icon-button.cjs.entry.js +3 -1
- package/dist/cjs/ix-icon-button.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-icon.cjs.entry.js +3 -1
- package/dist/cjs/ix-icon.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-index-button.cjs.entry.js +28 -0
- package/dist/cjs/ix-index-button.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-input-group.cjs.entry.js +4 -2
- package/dist/cjs/ix-input-group.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-kpi.cjs.entry.js +3 -1
- package/dist/cjs/ix-kpi.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-map-navigation_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-map-navigation_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-menu_9.cjs.entry.js +4 -2
- package/dist/cjs/ix-menu_9.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-message-bar.cjs.entry.js +3 -1
- package/dist/cjs/ix-message-bar.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-modal-example.cjs.entry.js +3 -1
- package/dist/cjs/ix-modal-example.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-modal_2.cjs.entry.js +208 -7
- package/dist/cjs/ix-modal_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-pagination.cjs.entry.js +115 -0
- package/dist/cjs/ix-pagination.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-pill.cjs.entry.js +3 -1
- package/dist/cjs/ix-pill.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-select_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-select_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-spinner.cjs.entry.js +3 -1
- package/dist/cjs/ix-spinner.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-split-button_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-split-button_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-tab-item.cjs.entry.js +3 -1
- package/dist/cjs/ix-tab-item.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-tabs.cjs.entry.js +3 -1
- package/dist/cjs/ix-tabs.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-tile.cjs.entry.js +3 -1
- package/dist/cjs/ix-tile.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-toast_2.cjs.entry.js +13 -2
- package/dist/cjs/ix-toast_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-toggle.cjs.entry.js +3 -1
- package/dist/cjs/ix-toggle.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-tooltip.cjs.entry.js +3 -1
- package/dist/cjs/ix-tooltip.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-tree_2.cjs.entry.js +7 -1
- package/dist/cjs/ix-tree_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-typography.cjs.entry.js +3 -1
- package/dist/cjs/ix-typography.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-upload.cjs.entry.js +4 -2
- package/dist/cjs/ix-upload.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-validation-tooltip.cjs.entry.js +3 -1
- package/dist/cjs/ix-validation-tooltip.cjs.entry.js.map +1 -0
- package/dist/cjs/ix-workflow-step_2.cjs.entry.js +3 -1
- package/dist/cjs/ix-workflow-step_2.cjs.entry.js.map +1 -0
- package/dist/cjs/loader.cjs.js +6 -3
- package/dist/cjs/loader.cjs.js.map +1 -0
- package/dist/cjs/{logical-filter-operator-0faf70b8.js → logical-filter-operator-20233f71.js} +5 -3
- package/dist/cjs/logical-filter-operator-20233f71.js.map +1 -0
- package/dist/cjs/modal-utils-b645989b.js +2 -0
- package/dist/cjs/modal-utils-b645989b.js.map +1 -0
- package/dist/cjs/mutation-observer-eaaa5399.js +2 -0
- package/dist/cjs/mutation-observer-eaaa5399.js.map +1 -0
- package/dist/cjs/my-component.cjs.entry.js +3 -1
- package/dist/cjs/my-component.cjs.entry.js.map +1 -0
- package/dist/cjs/rwd.util-9480f0b5.js +2 -0
- package/dist/cjs/rwd.util-9480f0b5.js.map +1 -0
- package/dist/cjs/service-18dc5907.js +2 -0
- package/dist/cjs/service-18dc5907.js.map +1 -0
- package/dist/cjs/siemens-ix.cjs.js +12 -3
- package/dist/cjs/siemens-ix.cjs.js.map +1 -0
- package/dist/cjs/{theme-switcher-67669a35.js → theme-switcher-bdbd0d30.js} +10 -8
- package/dist/cjs/theme-switcher-bdbd0d30.js.map +1 -0
- package/dist/cjs/typed-event-f0f051da.js +2 -0
- package/dist/cjs/typed-event-f0f051da.js.map +1 -0
- package/dist/cjs/upload-file-state-a79acf2b.js +2 -0
- package/dist/cjs/upload-file-state-a79acf2b.js.map +1 -0
- package/dist/collection/collection-manifest.json +14 -12
- package/dist/collection/components/animated-tab/animated-tab.js +1 -0
- package/dist/collection/components/animated-tab/animated-tab.js.map +1 -0
- package/dist/collection/components/animated-tabs/animated-tabs.js +1 -0
- package/dist/collection/components/animated-tabs/animated-tabs.js.map +1 -0
- package/dist/collection/components/application-header/application-header.js +1 -0
- package/dist/collection/components/application-header/application-header.js.map +1 -0
- package/dist/collection/components/basic-navigation/basic-navigation.js +1 -0
- package/dist/collection/components/basic-navigation/basic-navigation.js.map +1 -0
- package/dist/collection/components/blind/blind.css +12 -6
- package/dist/collection/components/blind/blind.js +26 -2
- package/dist/collection/components/blind/blind.js.map +1 -0
- package/dist/collection/components/breadcrumb/breadcrumb.css +1 -2
- package/dist/collection/components/breadcrumb/breadcrumb.js +1 -0
- package/dist/collection/components/breadcrumb/breadcrumb.js.map +1 -0
- package/dist/collection/components/breadcrumb-item/breadcrumb-item.js +1 -0
- package/dist/collection/components/breadcrumb-item/breadcrumb-item.js.map +1 -0
- package/dist/collection/components/button/base-button.js +1 -0
- package/dist/collection/components/button/base-button.js.map +1 -0
- package/dist/collection/components/button/button.js +5 -4
- package/dist/collection/components/button/button.js.map +1 -0
- package/dist/collection/components/category-filter/category-filter.js +3 -2
- package/dist/collection/components/category-filter/category-filter.js.map +1 -0
- package/dist/collection/components/category-filter/filter-state.js +1 -0
- package/dist/collection/components/category-filter/filter-state.js.map +1 -0
- package/dist/collection/components/category-filter/input-state.js +4 -3
- package/dist/collection/components/category-filter/input-state.js.map +1 -0
- package/dist/collection/components/category-filter/logical-filter-operator.js +1 -0
- package/dist/collection/components/category-filter/logical-filter-operator.js.map +1 -0
- package/dist/collection/components/chip/chip.js +28 -2
- package/dist/collection/components/chip/chip.js.map +1 -0
- package/dist/collection/components/counter-pill/counter-pill.js +1 -0
- package/dist/collection/components/counter-pill/counter-pill.js.map +1 -0
- package/dist/collection/components/date-picker/date-picker.js +10 -9
- package/dist/collection/components/date-picker/date-picker.js.map +1 -0
- package/dist/collection/components/date-time-card/date-time-card.js +6 -1
- package/dist/collection/components/date-time-card/date-time-card.js.map +1 -0
- package/dist/collection/components/datetime-picker/datetime-picker.js +9 -11
- package/dist/collection/components/datetime-picker/datetime-picker.js.map +1 -0
- package/dist/collection/components/divider/divider.js +1 -0
- package/dist/collection/components/divider/divider.js.map +1 -0
- package/dist/collection/components/drawer/drawer.js +1 -0
- package/dist/collection/components/drawer/drawer.js.map +1 -0
- package/dist/collection/components/dropdown/alignment.js +1 -0
- package/dist/collection/components/dropdown/alignment.js.map +1 -0
- package/dist/collection/components/dropdown/dropdown.css +0 -5
- package/dist/collection/components/dropdown/dropdown.js +3 -2
- package/dist/collection/components/dropdown/dropdown.js.map +1 -0
- package/dist/collection/components/dropdown/placement.js +1 -0
- package/dist/collection/components/dropdown/placement.js.map +1 -0
- package/dist/collection/components/dropdown-button/dropdown-button.js +5 -4
- package/dist/collection/components/dropdown-button/dropdown-button.js.map +1 -0
- package/dist/collection/components/dropdown-item/dropdown-item.js +1 -0
- package/dist/collection/components/dropdown-item/dropdown-item.js.map +1 -0
- package/dist/collection/components/dropdown-quick-actions/dropdown-quick-actions.js +1 -0
- package/dist/collection/components/dropdown-quick-actions/dropdown-quick-actions.js.map +1 -0
- package/dist/collection/components/event-list/event-list.js +1 -0
- package/dist/collection/components/event-list/event-list.js.map +1 -0
- package/dist/collection/components/event-list-item/event-list-item.js +1 -0
- package/dist/collection/components/event-list-item/event-list-item.js.map +1 -0
- package/dist/collection/components/expanding-search/expanding-search.js +10 -9
- package/dist/collection/components/expanding-search/expanding-search.js.map +1 -0
- package/dist/collection/components/filter-chip/filter-chip.css +14 -7
- package/dist/collection/components/filter-chip/filter-chip.js +2 -1
- package/dist/collection/components/filter-chip/filter-chip.js.map +1 -0
- package/dist/collection/components/flip-tile/flip-tile-state.js +1 -0
- package/dist/collection/components/flip-tile/flip-tile-state.js.map +1 -0
- package/dist/collection/components/flip-tile/flip-tile.css +0 -4
- package/dist/collection/components/flip-tile/flip-tile.js +57 -2
- package/dist/collection/components/flip-tile/flip-tile.js.map +1 -0
- package/dist/collection/components/flip-tile-content/flip-tile-content.js +1 -0
- package/dist/collection/components/flip-tile-content/flip-tile-content.js.map +1 -0
- package/dist/collection/components/group/group-context-menu.js +1 -0
- package/dist/collection/components/group/group-context-menu.js.map +1 -0
- package/dist/collection/components/group/group.js +2 -1
- package/dist/collection/components/group/group.js.map +1 -0
- package/dist/collection/components/group-dropdown-item/group-dropdown-item.js +1 -0
- package/dist/collection/components/group-dropdown-item/group-dropdown-item.js.map +1 -0
- package/dist/collection/components/group-item/group-item.js +1 -0
- package/dist/collection/components/group-item/group-item.js.map +1 -0
- package/dist/collection/components/icon/icon.js +1 -0
- package/dist/collection/components/icon/icon.js.map +1 -0
- package/dist/collection/components/icon-button/icon-button.js +8 -2
- package/dist/collection/components/icon-button/icon-button.js.map +1 -0
- package/dist/collection/components/index-button/index-button.css +31 -0
- package/dist/collection/components/index-button/index-button.js +83 -0
- package/dist/collection/components/index-button/index-button.js.map +1 -0
- package/dist/collection/components/input-group/input-group.css +3 -0
- package/dist/collection/components/input-group/input-group.js +1 -0
- package/dist/collection/components/input-group/input-group.js.map +1 -0
- package/dist/collection/components/kpi/kpi.js +1 -0
- package/dist/collection/components/kpi/kpi.js.map +1 -0
- package/dist/collection/components/map-navigation/map-navigation.js +1 -0
- package/dist/collection/components/map-navigation/map-navigation.js.map +1 -0
- package/dist/collection/components/map-navigation-overlay/map-navigation-overlay.js +1 -0
- package/dist/collection/components/map-navigation-overlay/map-navigation-overlay.js.map +1 -0
- package/dist/collection/components/menu/burger-menu.js +1 -0
- package/dist/collection/components/menu/burger-menu.js.map +1 -0
- package/dist/collection/components/menu/menu.js +1 -0
- package/dist/collection/components/menu/menu.js.map +1 -0
- package/dist/collection/components/menu-about/menu-about.js +1 -0
- package/dist/collection/components/menu-about/menu-about.js.map +1 -0
- package/dist/collection/components/menu-about-item/menu-about-item.js +1 -0
- package/dist/collection/components/menu-about-item/menu-about-item.js.map +1 -0
- package/dist/collection/components/menu-about-news/menu-about-news.js +1 -0
- package/dist/collection/components/menu-about-news/menu-about-news.js.map +1 -0
- package/dist/collection/components/menu-avatar/menu-avatar.js +1 -0
- package/dist/collection/components/menu-avatar/menu-avatar.js.map +1 -0
- package/dist/collection/components/menu-avatar-item/menu-avatar-item.js +1 -0
- package/dist/collection/components/menu-avatar-item/menu-avatar-item.js.map +1 -0
- package/dist/collection/components/menu-item/menu-item.js +1 -0
- package/dist/collection/components/menu-item/menu-item.js.map +1 -0
- package/dist/collection/components/menu-settings/menu-settings.js +1 -0
- package/dist/collection/components/menu-settings/menu-settings.js.map +1 -0
- package/dist/collection/components/menu-settings-item/menu-settings-item.js +1 -0
- package/dist/collection/components/menu-settings-item/menu-settings-item.js.map +1 -0
- package/dist/collection/components/message-bar/message-bar.js +1 -0
- package/dist/collection/components/message-bar/message-bar.js.map +1 -0
- package/dist/collection/components/modal/modal-utils.js +1 -0
- package/dist/collection/components/modal/modal-utils.js.map +1 -0
- package/dist/collection/components/modal/modal.js +1 -0
- package/dist/collection/components/modal/modal.js.map +1 -0
- package/dist/collection/components/modal-container/modal-container.js +6 -2
- package/dist/collection/components/modal-container/modal-container.js.map +1 -0
- package/dist/collection/components/my-component/example-modal.js +1 -0
- package/dist/collection/components/my-component/example-modal.js.map +1 -0
- package/dist/collection/components/my-component/my-component.js +1 -0
- package/dist/collection/components/my-component/my-component.js.map +1 -0
- package/dist/collection/components/pagination/pagination.css +58 -0
- package/dist/collection/components/pagination/pagination.js +303 -0
- package/dist/collection/components/pagination/pagination.js.map +1 -0
- package/dist/collection/components/pill/pill.js +1 -0
- package/dist/collection/components/pill/pill.js.map +1 -0
- package/dist/collection/components/select/select.js +1 -0
- package/dist/collection/components/select/select.js.map +1 -0
- package/dist/collection/components/select-item/events.js +1 -0
- package/dist/collection/components/select-item/events.js.map +1 -0
- package/dist/collection/components/select-item/select-item.js +1 -0
- package/dist/collection/components/select-item/select-item.js.map +1 -0
- package/dist/collection/components/spinner/spinner.js +1 -0
- package/dist/collection/components/spinner/spinner.js.map +1 -0
- package/dist/collection/components/split-button/split-button.js +5 -4
- package/dist/collection/components/split-button/split-button.js.map +1 -0
- package/dist/collection/components/split-button-item/split-button-item.js +1 -0
- package/dist/collection/components/split-button-item/split-button-item.js.map +1 -0
- package/dist/collection/components/tab-item/tab-item.js +1 -0
- package/dist/collection/components/tab-item/tab-item.js.map +1 -0
- package/dist/collection/components/tabs/tabs.js +1 -0
- package/dist/collection/components/tabs/tabs.js.map +1 -0
- package/dist/collection/components/tile/tile.js +1 -0
- package/dist/collection/components/tile/tile.js.map +1 -0
- package/dist/collection/components/time-picker/time-picker.js +5 -4
- package/dist/collection/components/time-picker/time-picker.js.map +1 -0
- package/dist/collection/components/toast/toast-container.js +17 -4
- package/dist/collection/components/toast/toast-container.js.map +1 -0
- package/dist/collection/components/toast/toast-utils.js +5 -1
- package/dist/collection/components/toast/toast-utils.js.map +1 -0
- package/dist/collection/components/toast/toast.js +1 -0
- package/dist/collection/components/toast/toast.js.map +1 -0
- package/dist/collection/components/toggle/toggle.js +1 -0
- package/dist/collection/components/toggle/toggle.js.map +1 -0
- package/dist/collection/components/tooltip/tooltip.js +1 -0
- package/dist/collection/components/tooltip/tooltip.js.map +1 -0
- package/dist/collection/components/tree/tree-model.js +1 -0
- package/dist/collection/components/tree/tree-model.js.map +1 -0
- package/dist/collection/components/tree/tree.js +39 -0
- package/dist/collection/components/tree/tree.js.map +1 -0
- package/dist/collection/components/tree-item/default-tree-item.js +1 -0
- package/dist/collection/components/tree-item/default-tree-item.js.map +1 -0
- package/dist/collection/components/tree-item/tree-item.js +1 -0
- package/dist/collection/components/tree-item/tree-item.js.map +1 -0
- package/dist/collection/components/typography/types.js +1 -0
- package/dist/collection/components/typography/types.js.map +1 -0
- package/dist/collection/components/typography/typography.js +1 -0
- package/dist/collection/components/typography/typography.js.map +1 -0
- package/dist/collection/components/upload/upload-file-state.js +1 -0
- package/dist/collection/components/upload/upload-file-state.js.map +1 -0
- package/dist/collection/components/upload/upload.js +2 -1
- package/dist/collection/components/upload/upload.js.map +1 -0
- package/dist/collection/components/utils/animation.js +1 -0
- package/dist/collection/components/utils/animation.js.map +1 -0
- package/dist/collection/components/utils/menu-service/menu-service.js +1 -0
- package/dist/collection/components/utils/menu-service/menu-service.js.map +1 -0
- package/dist/collection/components/utils/mutation-observer.js +1 -0
- package/dist/collection/components/utils/mutation-observer.js.map +1 -0
- package/dist/collection/components/utils/notification-color.js +1 -0
- package/dist/collection/components/utils/notification-color.js.map +1 -0
- package/dist/collection/components/utils/rwd.util.js +1 -0
- package/dist/collection/components/utils/rwd.util.js.map +1 -0
- package/dist/collection/components/utils/screen/context.js +1 -0
- package/dist/collection/components/utils/screen/context.js.map +1 -0
- package/dist/collection/components/utils/screen/index.js +1 -0
- package/dist/collection/components/utils/screen/index.js.map +1 -0
- package/dist/collection/components/utils/screen/mode.js +1 -0
- package/dist/collection/components/utils/screen/mode.js.map +1 -0
- package/dist/collection/components/utils/screen/service.js +1 -0
- package/dist/collection/components/utils/screen/service.js.map +1 -0
- package/dist/collection/components/utils/theme-switcher.js +9 -8
- package/dist/collection/components/utils/theme-switcher.js.map +1 -0
- package/dist/collection/components/utils/typed-event.js +1 -0
- package/dist/collection/components/utils/typed-event.js.map +1 -0
- package/dist/collection/components/validation-tooltip/validation-tooltip.js +1 -0
- package/dist/collection/components/validation-tooltip/validation-tooltip.js.map +1 -0
- package/dist/collection/components/workflow-step/workflow-step.js +1 -0
- package/dist/collection/components/workflow-step/workflow-step.js.map +1 -0
- package/dist/collection/components/workflow-steps/workflow-steps.js +1 -0
- package/dist/collection/components/workflow-steps/workflow-steps.js.map +1 -0
- package/dist/collection/index.js +11 -6
- package/dist/collection/index.js.map +1 -0
- package/dist/collection/tests/utils/test/index.js +1 -0
- package/dist/collection/tests/utils/test/index.js.map +1 -0
- package/dist/collection/tests/utils/test/page.js +1 -0
- package/dist/collection/tests/utils/test/page.js.map +1 -0
- package/dist/collection/utils/test/index.js +1 -0
- package/dist/collection/utils/test/index.js.map +1 -0
- package/dist/collection/utils/test/page.js +1 -0
- package/dist/collection/utils/test/page.js.map +1 -0
- package/dist/components/_commonjsHelpers.js +2 -0
- package/dist/components/_commonjsHelpers.js.map +1 -0
- package/dist/components/animation.js +2 -0
- package/dist/components/animation.js.map +1 -0
- package/dist/components/anime.es.js +2 -0
- package/dist/components/anime.es.js.map +1 -0
- package/dist/components/application-header.js +2 -0
- package/dist/components/application-header.js.map +1 -0
- package/dist/components/base-button.js +2 -0
- package/dist/components/base-button.js.map +1 -0
- package/dist/components/burger-menu.js +2 -0
- package/dist/components/burger-menu.js.map +1 -0
- package/dist/components/button.js +2 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/date-picker.js +2 -0
- package/dist/components/date-picker.js.map +1 -0
- package/dist/components/date-time-card.js +2 -0
- package/dist/components/date-time-card.js.map +1 -0
- package/dist/components/default-tree-item.js +22 -0
- package/dist/components/default-tree-item.js.map +1 -0
- package/dist/components/dropdown-item.js +2 -0
- package/dist/components/dropdown-item.js.map +1 -0
- package/dist/components/dropdown.js +2 -0
- package/dist/components/dropdown.js.map +1 -0
- package/dist/components/filter-chip.js +4 -2
- package/dist/components/filter-chip.js.map +1 -0
- package/dist/components/flip-tile-state.js +20 -0
- package/dist/components/flip-tile-state.js.map +1 -0
- package/dist/components/floating-ui.dom.esm.js +2 -0
- package/dist/components/floating-ui.dom.esm.js.map +1 -0
- package/dist/components/group-context-menu.js +2 -0
- package/dist/components/group-context-menu.js.map +1 -0
- package/dist/components/group-item.js +2 -0
- package/dist/components/group-item.js.map +1 -0
- package/dist/components/icon-button.js +2 -0
- package/dist/components/icon-button.js.map +1 -0
- package/dist/components/icon.js +2 -0
- package/dist/components/icon.js.map +1 -0
- package/dist/components/index-button.js +41 -0
- package/dist/components/index-button.js.map +1 -0
- package/dist/components/index.d.ts +9 -75
- package/dist/components/index.js +13 -76
- package/dist/components/index.js.map +1 -0
- package/dist/components/ix-animated-tab.js +2 -0
- package/dist/components/ix-animated-tab.js.map +1 -0
- package/dist/components/ix-animated-tabs.js +2 -0
- package/dist/components/ix-animated-tabs.js.map +1 -0
- package/dist/components/ix-application-header.js +2 -0
- package/dist/components/ix-application-header.js.map +1 -0
- package/dist/components/ix-basic-navigation.js +2 -0
- package/dist/components/ix-basic-navigation.js.map +1 -0
- package/dist/components/ix-blind.js +17 -5
- package/dist/components/ix-blind.js.map +1 -0
- package/dist/components/ix-breadcrumb-item.js +2 -0
- package/dist/components/ix-breadcrumb-item.js.map +1 -0
- package/dist/components/ix-breadcrumb.js +3 -1
- package/dist/components/ix-breadcrumb.js.map +1 -0
- package/dist/components/ix-burger-menu.js +2 -0
- package/dist/components/ix-burger-menu.js.map +1 -0
- package/dist/components/ix-button.js +2 -0
- package/dist/components/ix-button.js.map +1 -0
- package/dist/components/ix-category-filter.js +6 -35
- package/dist/components/ix-category-filter.js.map +1 -0
- package/dist/components/ix-chip.js +8 -1
- package/dist/components/ix-chip.js.map +1 -0
- package/dist/components/ix-counter-pill.js +2 -0
- package/dist/components/ix-counter-pill.js.map +1 -0
- package/dist/components/ix-date-picker.js +2 -0
- package/dist/components/ix-date-picker.js.map +1 -0
- package/dist/components/ix-date-time-card.js +2 -0
- package/dist/components/ix-date-time-card.js.map +1 -0
- package/dist/components/ix-datetime-picker.js +5 -3
- package/dist/components/ix-datetime-picker.js.map +1 -0
- package/dist/components/ix-divider.js +2 -0
- package/dist/components/ix-divider.js.map +1 -0
- package/dist/components/ix-drawer.js +2 -0
- package/dist/components/ix-drawer.js.map +1 -0
- package/dist/components/ix-dropdown-button.js +2 -0
- package/dist/components/ix-dropdown-button.js.map +1 -0
- package/dist/components/ix-dropdown-item.js +2 -0
- package/dist/components/ix-dropdown-item.js.map +1 -0
- package/dist/components/ix-dropdown-quick-actions.js +2 -0
- package/dist/components/ix-dropdown-quick-actions.js.map +1 -0
- package/dist/components/ix-dropdown.js +2 -0
- package/dist/components/ix-dropdown.js.map +1 -0
- package/dist/components/ix-event-list-item.js +2 -0
- package/dist/components/ix-event-list-item.js.map +1 -0
- package/dist/components/ix-event-list.js +2 -0
- package/dist/components/ix-event-list.js.map +1 -0
- package/dist/components/ix-expanding-search.js +14 -12
- package/dist/components/ix-expanding-search.js.map +1 -0
- package/dist/components/ix-filter-chip.js +2 -0
- package/dist/components/ix-filter-chip.js.map +1 -0
- package/dist/components/ix-flip-tile-content.js +2 -0
- package/dist/components/ix-flip-tile-content.js.map +1 -0
- package/dist/components/ix-flip-tile.js +17 -20
- package/dist/components/ix-flip-tile.js.map +1 -0
- package/dist/components/ix-group-context-menu.js +2 -0
- package/dist/components/ix-group-context-menu.js.map +1 -0
- package/dist/components/ix-group-dropdown-item.js +2 -0
- package/dist/components/ix-group-dropdown-item.js.map +1 -0
- package/dist/components/ix-group-item.js +2 -0
- package/dist/components/ix-group-item.js.map +1 -0
- package/dist/components/ix-group.js +3 -1
- package/dist/components/ix-group.js.map +1 -0
- package/dist/components/ix-icon-button.js +2 -0
- package/dist/components/ix-icon-button.js.map +1 -0
- package/dist/components/ix-icon.js +2 -0
- package/dist/components/ix-icon.js.map +1 -0
- package/dist/components/ix-index-button.d.ts +11 -0
- package/dist/components/ix-index-button.js +8 -0
- package/dist/components/ix-index-button.js.map +1 -0
- package/dist/components/ix-input-group.js +3 -1
- package/dist/components/ix-input-group.js.map +1 -0
- package/dist/components/ix-kpi.js +2 -0
- package/dist/components/ix-kpi.js.map +1 -0
- package/dist/components/ix-map-navigation-overlay.js +2 -0
- package/dist/components/ix-map-navigation-overlay.js.map +1 -0
- package/dist/components/ix-map-navigation.js +2 -0
- package/dist/components/ix-map-navigation.js.map +1 -0
- package/dist/components/ix-menu-about-item.js +2 -0
- package/dist/components/ix-menu-about-item.js.map +1 -0
- package/dist/components/ix-menu-about-news.js +2 -0
- package/dist/components/ix-menu-about-news.js.map +1 -0
- package/dist/components/ix-menu-about.js +2 -0
- package/dist/components/ix-menu-about.js.map +1 -0
- package/dist/components/ix-menu-avatar-item.js +2 -0
- package/dist/components/ix-menu-avatar-item.js.map +1 -0
- package/dist/components/ix-menu-avatar.js +2 -0
- package/dist/components/ix-menu-avatar.js.map +1 -0
- package/dist/components/ix-menu-item.js +2 -0
- package/dist/components/ix-menu-item.js.map +1 -0
- package/dist/components/ix-menu-settings-item.js +2 -0
- package/dist/components/ix-menu-settings-item.js.map +1 -0
- package/dist/components/ix-menu-settings.js +2 -0
- package/dist/components/ix-menu-settings.js.map +1 -0
- package/dist/components/ix-menu.js +4 -88
- package/dist/components/ix-menu.js.map +1 -0
- package/dist/components/ix-message-bar.js +2 -0
- package/dist/components/ix-message-bar.js.map +1 -0
- package/dist/components/ix-modal-container.js +2 -0
- package/dist/components/ix-modal-container.js.map +1 -0
- package/dist/components/ix-modal-example.js +4 -38
- package/dist/components/ix-modal-example.js.map +1 -0
- package/dist/components/ix-modal.js +2 -0
- package/dist/components/ix-modal.js.map +1 -0
- package/dist/components/ix-pagination.d.ts +11 -0
- package/dist/components/ix-pagination.js +185 -0
- package/dist/components/ix-pagination.js.map +1 -0
- package/dist/components/ix-pill.js +2 -0
- package/dist/components/ix-pill.js.map +1 -0
- package/dist/components/ix-select-item.js +2 -0
- package/dist/components/ix-select-item.js.map +1 -0
- package/dist/components/ix-select.js +3 -341
- package/dist/components/ix-select.js.map +1 -0
- package/dist/components/ix-spinner.js +2 -0
- package/dist/components/ix-spinner.js.map +1 -0
- package/dist/components/ix-split-button-item.js +2 -0
- package/dist/components/ix-split-button-item.js.map +1 -0
- package/dist/components/ix-split-button.js +2 -0
- package/dist/components/ix-split-button.js.map +1 -0
- package/dist/components/ix-tab-item.js +2 -0
- package/dist/components/ix-tab-item.js.map +1 -0
- package/dist/components/ix-tabs.js +2 -0
- package/dist/components/ix-tabs.js.map +1 -0
- package/dist/components/ix-tile.js +2 -0
- package/dist/components/ix-tile.js.map +1 -0
- package/dist/components/ix-time-picker.js +2 -0
- package/dist/components/ix-time-picker.js.map +1 -0
- package/dist/components/ix-toast-container.js +12 -1
- package/dist/components/ix-toast-container.js.map +1 -0
- package/dist/components/ix-toast.js +2 -0
- package/dist/components/ix-toast.js.map +1 -0
- package/dist/components/ix-toggle.js +2 -0
- package/dist/components/ix-toggle.js.map +1 -0
- package/dist/components/ix-tooltip.js +2 -0
- package/dist/components/ix-tooltip.js.map +1 -0
- package/dist/components/ix-tree-item.js +2 -0
- package/dist/components/ix-tree-item.js.map +1 -0
- package/dist/components/ix-tree.js +8 -20
- package/dist/components/ix-tree.js.map +1 -0
- package/dist/components/ix-typography.js +2 -0
- package/dist/components/ix-typography.js.map +1 -0
- package/dist/components/ix-upload.js +5 -18
- package/dist/components/ix-upload.js.map +1 -0
- package/dist/components/ix-validation-tooltip.js +2 -0
- package/dist/components/ix-validation-tooltip.js.map +1 -0
- package/dist/components/ix-workflow-step.js +2 -0
- package/dist/components/ix-workflow-step.js.map +1 -0
- package/dist/components/ix-workflow-steps.js +2 -0
- package/dist/components/ix-workflow-steps.js.map +1 -0
- package/dist/{esm/logical-filter-operator-15696001.js → components/logical-filter-operator.js} +5 -3
- package/dist/components/logical-filter-operator.js.map +1 -0
- package/dist/components/luxon.js +2 -0
- package/dist/components/luxon.js.map +1 -0
- package/dist/components/map-navigation-overlay.js +2 -0
- package/dist/components/map-navigation-overlay.js.map +1 -0
- package/dist/components/menu-avatar-item.js +2 -0
- package/dist/components/menu-avatar-item.js.map +1 -0
- package/dist/components/menu-item.js +2 -0
- package/dist/components/menu-item.js.map +1 -0
- package/dist/components/modal-container.js +2 -0
- package/dist/components/modal-container.js.map +1 -0
- package/dist/components/modal-utils.js +40 -0
- package/dist/components/modal-utils.js.map +1 -0
- package/dist/components/modal.js +2 -0
- package/dist/components/modal.js.map +1 -0
- package/dist/components/mutation-observer.js +2 -0
- package/dist/components/mutation-observer.js.map +1 -0
- package/dist/components/my-component.js +2 -0
- package/dist/components/my-component.js.map +1 -0
- package/dist/components/rwd.util.js +2 -0
- package/dist/components/rwd.util.js.map +1 -0
- package/dist/components/select-item.js +2 -0
- package/dist/components/select-item.js.map +1 -0
- package/dist/components/select.js +345 -0
- package/dist/components/select.js.map +1 -0
- package/dist/components/service.js +2 -0
- package/dist/components/service.js.map +1 -0
- package/dist/components/spinner.js +2 -0
- package/dist/components/spinner.js.map +1 -0
- package/dist/components/tab-item.js +2 -0
- package/dist/components/tab-item.js.map +1 -0
- package/dist/components/tabs.js +2 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/theme-switcher.js +91 -0
- package/dist/components/theme-switcher.js.map +1 -0
- package/dist/components/time-picker.js +2 -0
- package/dist/components/time-picker.js.map +1 -0
- package/dist/components/toast.js +2 -0
- package/dist/components/toast.js.map +1 -0
- package/dist/components/tree-item.js +2 -0
- package/dist/components/tree-item.js.map +1 -0
- package/dist/components/typed-event.js +2 -0
- package/dist/components/typed-event.js.map +1 -0
- package/dist/components/typography.js +2 -0
- package/dist/components/typography.js.map +1 -0
- package/dist/components/upload-file-state.js +19 -0
- package/dist/components/upload-file-state.js.map +1 -0
- package/dist/esm/_commonjsHelpers-4bc7200a.js +2 -0
- package/dist/esm/_commonjsHelpers-4bc7200a.js.map +1 -0
- package/dist/esm/animation-268dce50.js +2 -0
- package/dist/esm/animation-268dce50.js.map +1 -0
- package/dist/esm/anime.es-185e9087.js +2 -0
- package/dist/esm/anime.es-185e9087.js.map +1 -0
- package/dist/esm/base-button-5bfeb71c.js +2 -0
- package/dist/esm/base-button-5bfeb71c.js.map +1 -0
- package/dist/esm/context-f6a2b727.js +2 -0
- package/dist/esm/context-f6a2b727.js.map +1 -0
- package/dist/esm/default-tree-item-91ff2c08.js +2 -0
- package/dist/esm/default-tree-item-91ff2c08.js.map +1 -0
- package/dist/esm/flip-tile-state-051bb2fd.js +2 -0
- package/dist/esm/flip-tile-state-051bb2fd.js.map +1 -0
- package/dist/esm/floating-ui.dom.esm-3130eda0.js +2 -0
- package/dist/esm/floating-ui.dom.esm-3130eda0.js.map +1 -0
- package/dist/esm/{index-6b660a23.js → index-3d163acd.js} +133 -4
- package/dist/esm/index-3d163acd.js.map +1 -0
- package/dist/esm/index.js +9 -8
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/ix-animated-tab_2.entry.js +3 -1
- package/dist/esm/ix-animated-tab_2.entry.js.map +1 -0
- package/dist/esm/ix-application-header.entry.js +3 -1
- package/dist/esm/ix-application-header.entry.js.map +1 -0
- package/dist/esm/ix-basic-navigation.entry.js +3 -1
- package/dist/esm/ix-basic-navigation.entry.js.map +1 -0
- package/dist/esm/ix-blind.entry.js +9 -4
- package/dist/esm/ix-blind.entry.js.map +1 -0
- package/dist/esm/ix-breadcrumb_2.entry.js +4 -2
- package/dist/esm/ix-breadcrumb_2.entry.js.map +1 -0
- package/dist/esm/ix-burger-menu.entry.js +3 -1
- package/dist/esm/ix-burger-menu.entry.js.map +1 -0
- package/dist/esm/ix-button.entry.js +3 -1
- package/dist/esm/ix-button.entry.js.map +1 -0
- package/dist/esm/ix-category-filter.entry.js +6 -4
- package/dist/esm/ix-category-filter.entry.js.map +1 -0
- package/dist/esm/ix-chip.entry.js +9 -2
- package/dist/esm/ix-chip.entry.js.map +1 -0
- package/dist/esm/ix-counter-pill.entry.js +3 -1
- package/dist/esm/ix-counter-pill.entry.js.map +1 -0
- package/dist/esm/ix-date-picker_2.entry.js +3 -1
- package/dist/esm/ix-date-picker_2.entry.js.map +1 -0
- package/dist/esm/ix-date-time-card.entry.js +3 -1
- package/dist/esm/ix-date-time-card.entry.js.map +1 -0
- package/dist/esm/ix-datetime-picker.entry.js +6 -4
- package/dist/esm/ix-datetime-picker.entry.js.map +1 -0
- package/dist/esm/ix-divider.entry.js +3 -1
- package/dist/esm/ix-divider.entry.js.map +1 -0
- package/dist/esm/ix-drawer.entry.js +3 -1
- package/dist/esm/ix-drawer.entry.js.map +1 -0
- package/dist/esm/ix-dropdown-button.entry.js +3 -1
- package/dist/esm/ix-dropdown-button.entry.js.map +1 -0
- package/dist/esm/ix-dropdown-quick-actions.entry.js +3 -1
- package/dist/esm/ix-dropdown-quick-actions.entry.js.map +1 -0
- package/dist/esm/ix-dropdown_2.entry.js +3 -1
- package/dist/esm/ix-dropdown_2.entry.js.map +1 -0
- package/dist/esm/ix-event-list_2.entry.js +3 -1
- package/dist/esm/ix-event-list_2.entry.js.map +1 -0
- package/dist/esm/ix-expanding-search.entry.js +14 -12
- package/dist/esm/ix-expanding-search.entry.js.map +1 -0
- package/dist/esm/ix-filter-chip.entry.js +5 -3
- package/dist/esm/ix-filter-chip.entry.js.map +1 -0
- package/dist/esm/ix-flip-tile_2.entry.js +14 -3
- package/dist/esm/ix-flip-tile_2.entry.js.map +1 -0
- package/dist/esm/ix-group-context-menu.entry.js +3 -1
- package/dist/esm/ix-group-context-menu.entry.js.map +1 -0
- package/dist/esm/ix-group_3.entry.js +4 -2
- package/dist/esm/ix-group_3.entry.js.map +1 -0
- package/dist/esm/ix-icon-button.entry.js +3 -1
- package/dist/esm/ix-icon-button.entry.js.map +1 -0
- package/dist/esm/ix-icon.entry.js +3 -1
- package/dist/esm/ix-icon.entry.js.map +1 -0
- package/dist/esm/ix-index-button.entry.js +24 -0
- package/dist/esm/ix-index-button.entry.js.map +1 -0
- package/dist/esm/ix-input-group.entry.js +4 -2
- package/dist/esm/ix-input-group.entry.js.map +1 -0
- package/dist/esm/ix-kpi.entry.js +3 -1
- package/dist/esm/ix-kpi.entry.js.map +1 -0
- package/dist/esm/ix-map-navigation_2.entry.js +3 -1
- package/dist/esm/ix-map-navigation_2.entry.js.map +1 -0
- package/dist/esm/ix-menu_9.entry.js +4 -2
- package/dist/esm/ix-menu_9.entry.js.map +1 -0
- package/dist/esm/ix-message-bar.entry.js +3 -1
- package/dist/esm/ix-message-bar.entry.js.map +1 -0
- package/dist/esm/ix-modal-example.entry.js +3 -1
- package/dist/esm/ix-modal-example.entry.js.map +1 -0
- package/dist/esm/ix-modal_2.entry.js +210 -5
- package/dist/esm/ix-modal_2.entry.js.map +1 -0
- package/dist/esm/ix-pagination.entry.js +111 -0
- package/dist/esm/ix-pagination.entry.js.map +1 -0
- package/dist/esm/ix-pill.entry.js +3 -1
- package/dist/esm/ix-pill.entry.js.map +1 -0
- package/dist/esm/ix-select_2.entry.js +3 -1
- package/dist/esm/ix-select_2.entry.js.map +1 -0
- package/dist/esm/ix-spinner.entry.js +3 -1
- package/dist/esm/ix-spinner.entry.js.map +1 -0
- package/dist/esm/ix-split-button_2.entry.js +3 -1
- package/dist/esm/ix-split-button_2.entry.js.map +1 -0
- package/dist/esm/ix-tab-item.entry.js +3 -1
- package/dist/esm/ix-tab-item.entry.js.map +1 -0
- package/dist/esm/ix-tabs.entry.js +3 -1
- package/dist/esm/ix-tabs.entry.js.map +1 -0
- package/dist/esm/ix-tile.entry.js +3 -1
- package/dist/esm/ix-tile.entry.js.map +1 -0
- package/dist/esm/ix-toast_2.entry.js +13 -2
- package/dist/esm/ix-toast_2.entry.js.map +1 -0
- package/dist/esm/ix-toggle.entry.js +3 -1
- package/dist/esm/ix-toggle.entry.js.map +1 -0
- package/dist/esm/ix-tooltip.entry.js +3 -1
- package/dist/esm/ix-tooltip.entry.js.map +1 -0
- package/dist/esm/ix-tree_2.entry.js +7 -1
- package/dist/esm/ix-tree_2.entry.js.map +1 -0
- package/dist/esm/ix-typography.entry.js +3 -1
- package/dist/esm/ix-typography.entry.js.map +1 -0
- package/dist/esm/ix-upload.entry.js +4 -2
- package/dist/esm/ix-upload.entry.js.map +1 -0
- package/dist/esm/ix-validation-tooltip.entry.js +3 -1
- package/dist/esm/ix-validation-tooltip.entry.js.map +1 -0
- package/dist/esm/ix-workflow-step_2.entry.js +3 -1
- package/dist/esm/ix-workflow-step_2.entry.js.map +1 -0
- package/dist/esm/loader.js +6 -3
- package/dist/esm/loader.js.map +1 -0
- package/dist/esm/logical-filter-operator-92531263.js +35 -0
- package/dist/esm/logical-filter-operator-92531263.js.map +1 -0
- package/dist/esm/modal-utils-aecbcba5.js +2 -0
- package/dist/esm/modal-utils-aecbcba5.js.map +1 -0
- package/dist/esm/mutation-observer-7d01bbea.js +2 -0
- package/dist/esm/mutation-observer-7d01bbea.js.map +1 -0
- package/dist/esm/my-component.entry.js +3 -1
- package/dist/esm/my-component.entry.js.map +1 -0
- package/dist/esm/polyfills/css-shim.js +1 -1
- package/dist/esm/rwd.util-cfc2ea72.js +2 -0
- package/dist/esm/rwd.util-cfc2ea72.js.map +1 -0
- package/dist/esm/service-fc436c5b.js +2 -0
- package/dist/esm/service-fc436c5b.js.map +1 -0
- package/dist/esm/siemens-ix.js +9 -3
- package/dist/esm/siemens-ix.js.map +1 -0
- package/dist/esm/{theme-switcher-4b9e5cc2.js → theme-switcher-7498e4f2.js} +10 -8
- package/dist/esm/theme-switcher-7498e4f2.js.map +1 -0
- package/dist/esm/typed-event-a230184a.js +2 -0
- package/dist/esm/typed-event-a230184a.js.map +1 -0
- package/dist/esm/upload-file-state-532a36d3.js +2 -0
- package/dist/esm/upload-file-state-532a36d3.js.map +1 -0
- package/dist/siemens-ix/index.esm.js +2 -1
- package/dist/siemens-ix/index.esm.js.map +1 -0
- package/dist/siemens-ix/p-01f9f803.entry.js +2 -0
- package/dist/siemens-ix/p-01f9f803.entry.js.map +1 -0
- package/dist/siemens-ix/p-030078b4.entry.js +2 -0
- package/dist/siemens-ix/p-030078b4.entry.js.map +1 -0
- package/dist/siemens-ix/p-042b490c.entry.js +2 -0
- package/dist/siemens-ix/p-042b490c.entry.js.map +1 -0
- package/dist/siemens-ix/p-076c29d1.js +2 -1
- package/dist/siemens-ix/p-076c29d1.js.map +1 -0
- package/dist/siemens-ix/p-07fd8298.entry.js +2 -0
- package/dist/siemens-ix/p-07fd8298.entry.js.map +1 -0
- package/dist/siemens-ix/p-0e8a6997.entry.js +2 -0
- package/dist/siemens-ix/p-0e8a6997.entry.js.map +1 -0
- package/dist/siemens-ix/p-0f864265.entry.js +2 -0
- package/dist/siemens-ix/p-0f864265.entry.js.map +1 -0
- package/dist/siemens-ix/p-13adcf62.entry.js +2 -0
- package/dist/siemens-ix/p-13adcf62.entry.js.map +1 -0
- package/dist/siemens-ix/p-1572aab3.js +2 -1
- package/dist/siemens-ix/p-1572aab3.js.map +1 -0
- package/dist/siemens-ix/p-15bebd8a.js +2 -1
- package/dist/siemens-ix/p-15bebd8a.js.map +1 -0
- package/dist/siemens-ix/p-1666b0e2.entry.js +2 -0
- package/dist/siemens-ix/p-1666b0e2.entry.js.map +1 -0
- package/dist/siemens-ix/p-16ec6f50.entry.js +2 -0
- package/dist/siemens-ix/p-16ec6f50.entry.js.map +1 -0
- package/dist/siemens-ix/p-1701b127.entry.js +2 -0
- package/dist/siemens-ix/p-1701b127.entry.js.map +1 -0
- package/dist/siemens-ix/p-1a87eb66.entry.js +2 -0
- package/dist/siemens-ix/p-1a87eb66.entry.js.map +1 -0
- package/dist/siemens-ix/p-20bed29f.entry.js +2 -0
- package/dist/siemens-ix/p-20bed29f.entry.js.map +1 -0
- package/dist/siemens-ix/p-21aa3602.js +2 -1
- package/dist/siemens-ix/p-21aa3602.js.map +1 -0
- package/dist/siemens-ix/p-24d2d95e.entry.js +2 -0
- package/dist/siemens-ix/p-24d2d95e.entry.js.map +1 -0
- package/dist/siemens-ix/p-283686d7.entry.js +2 -0
- package/dist/siemens-ix/p-283686d7.entry.js.map +1 -0
- package/dist/siemens-ix/p-28f50519.entry.js +2 -0
- package/dist/siemens-ix/p-28f50519.entry.js.map +1 -0
- package/dist/siemens-ix/p-2dafa048.entry.js +2 -0
- package/dist/siemens-ix/p-2dafa048.entry.js.map +1 -0
- package/dist/siemens-ix/p-323d5529.js +2 -0
- package/dist/siemens-ix/p-323d5529.js.map +1 -0
- package/dist/siemens-ix/p-34e3a10e.entry.js +2 -0
- package/dist/siemens-ix/p-34e3a10e.entry.js.map +1 -0
- package/dist/siemens-ix/p-37417714.js +2 -1
- package/dist/siemens-ix/p-37417714.js.map +1 -0
- package/dist/siemens-ix/p-3776a37f.entry.js +2 -0
- package/dist/siemens-ix/p-3776a37f.entry.js.map +1 -0
- package/dist/siemens-ix/p-3b97bb69.js +2 -1
- package/dist/siemens-ix/p-3b97bb69.js.map +1 -0
- package/dist/siemens-ix/p-41f0a2b2.entry.js +2 -0
- package/dist/siemens-ix/p-41f0a2b2.entry.js.map +1 -0
- package/dist/siemens-ix/p-43965bd0.entry.js +2 -0
- package/dist/siemens-ix/p-43965bd0.entry.js.map +1 -0
- package/dist/siemens-ix/p-446a0a3f.entry.js +2 -0
- package/dist/siemens-ix/p-446a0a3f.entry.js.map +1 -0
- package/dist/siemens-ix/p-4ec66090.entry.js +2 -0
- package/dist/siemens-ix/p-4ec66090.entry.js.map +1 -0
- package/dist/siemens-ix/p-529d7530.js +2 -1
- package/dist/siemens-ix/p-529d7530.js.map +1 -0
- package/dist/siemens-ix/p-55d0fabf.entry.js +2 -0
- package/dist/siemens-ix/p-55d0fabf.entry.js.map +1 -0
- package/dist/siemens-ix/p-56ed024b.js +2 -1
- package/dist/siemens-ix/p-56ed024b.js.map +1 -0
- package/dist/siemens-ix/p-58ef1328.entry.js +2 -0
- package/dist/siemens-ix/p-58ef1328.entry.js.map +1 -0
- package/dist/siemens-ix/p-5b39e04e.js +2 -1
- package/dist/siemens-ix/p-5b39e04e.js.map +1 -0
- package/dist/siemens-ix/p-5d7e1440.entry.js +2 -0
- package/dist/siemens-ix/p-5d7e1440.entry.js.map +1 -0
- package/dist/siemens-ix/p-62b4d696.entry.js +2 -0
- package/dist/siemens-ix/p-62b4d696.entry.js.map +1 -0
- package/dist/siemens-ix/p-63666529.entry.js +2 -0
- package/dist/siemens-ix/p-63666529.entry.js.map +1 -0
- package/dist/siemens-ix/p-63e1264b.entry.js +2 -0
- package/dist/siemens-ix/p-63e1264b.entry.js.map +1 -0
- package/dist/siemens-ix/p-65b6330a.entry.js +2 -0
- package/dist/siemens-ix/p-65b6330a.entry.js.map +1 -0
- package/dist/siemens-ix/p-6bdfaf91.entry.js +2 -0
- package/dist/siemens-ix/p-6bdfaf91.entry.js.map +1 -0
- package/dist/siemens-ix/p-6f819085.js +2 -0
- package/dist/siemens-ix/p-6f819085.js.map +1 -0
- package/dist/siemens-ix/p-6facc3cc.entry.js +2 -0
- package/dist/siemens-ix/p-6facc3cc.entry.js.map +1 -0
- package/dist/siemens-ix/p-73f7ef87.entry.js +2 -0
- package/dist/siemens-ix/p-73f7ef87.entry.js.map +1 -0
- package/dist/siemens-ix/p-7d4a7388.entry.js +2 -0
- package/dist/siemens-ix/p-7d4a7388.entry.js.map +1 -0
- package/dist/siemens-ix/p-810b5232.js +2 -1
- package/dist/siemens-ix/p-810b5232.js.map +1 -0
- package/dist/siemens-ix/p-88a47c9b.entry.js +2 -0
- package/dist/siemens-ix/p-88a47c9b.entry.js.map +1 -0
- package/dist/siemens-ix/p-8fcd6f85.js +3 -0
- package/dist/siemens-ix/p-8fcd6f85.js.map +1 -0
- package/dist/siemens-ix/p-909ccf09.entry.js +2 -0
- package/dist/siemens-ix/p-909ccf09.entry.js.map +1 -0
- package/dist/siemens-ix/p-9546cbdd.entry.js +2 -0
- package/dist/siemens-ix/p-9546cbdd.entry.js.map +1 -0
- package/dist/siemens-ix/p-9ee41861.js +2 -1
- package/dist/siemens-ix/p-9ee41861.js.map +1 -0
- package/dist/siemens-ix/p-a30c7b5a.entry.js +2 -0
- package/dist/siemens-ix/p-a30c7b5a.entry.js.map +1 -0
- package/dist/siemens-ix/p-a4178e26.entry.js +2 -0
- package/dist/siemens-ix/p-a4178e26.entry.js.map +1 -0
- package/dist/siemens-ix/p-a4a16daa.entry.js +2 -0
- package/dist/siemens-ix/p-a4a16daa.entry.js.map +1 -0
- package/dist/siemens-ix/p-a92126b5.entry.js +2 -0
- package/dist/siemens-ix/p-a92126b5.entry.js.map +1 -0
- package/dist/siemens-ix/p-aa4141e4.entry.js +2 -0
- package/dist/siemens-ix/p-aa4141e4.entry.js.map +1 -0
- package/dist/siemens-ix/p-afd1f351.entry.js +2 -0
- package/dist/siemens-ix/p-afd1f351.entry.js.map +1 -0
- package/dist/siemens-ix/p-b14308ed.js +2 -1
- package/dist/siemens-ix/p-b14308ed.js.map +1 -0
- package/dist/siemens-ix/p-b64e82ce.entry.js +2 -0
- package/dist/siemens-ix/p-b64e82ce.entry.js.map +1 -0
- package/dist/siemens-ix/p-b9fbd029.entry.js +2 -0
- package/dist/siemens-ix/p-b9fbd029.entry.js.map +1 -0
- package/dist/siemens-ix/p-c0454c9a.js +2 -1
- package/dist/siemens-ix/p-c0454c9a.js.map +1 -0
- package/dist/siemens-ix/p-c19c2492.entry.js +2 -0
- package/dist/siemens-ix/p-c19c2492.entry.js.map +1 -0
- package/dist/siemens-ix/p-d7a3acce.entry.js +2 -0
- package/dist/siemens-ix/p-d7a3acce.entry.js.map +1 -0
- package/dist/siemens-ix/p-d7cf7a1a.entry.js +2 -0
- package/dist/siemens-ix/p-d7cf7a1a.entry.js.map +1 -0
- package/dist/siemens-ix/p-eb301ea2.entry.js +2 -0
- package/dist/siemens-ix/p-eb301ea2.entry.js.map +1 -0
- package/dist/siemens-ix/p-f34a16c6.js +2 -1
- package/dist/siemens-ix/p-f34a16c6.js.map +1 -0
- package/dist/siemens-ix/p-f6509805.entry.js +2 -0
- package/dist/siemens-ix/p-f6509805.entry.js.map +1 -0
- package/dist/siemens-ix/p-f6c54047.entry.js +2 -0
- package/dist/siemens-ix/p-f6c54047.entry.js.map +1 -0
- package/dist/siemens-ix/p-fef2f9e0.entry.js +2 -0
- package/dist/siemens-ix/p-fef2f9e0.entry.js.map +1 -0
- package/dist/siemens-ix/siemens-ix.css +79 -1092
- package/dist/siemens-ix/siemens-ix.esm.js +2 -1
- package/dist/siemens-ix/siemens-ix.esm.js.map +1 -0
- package/dist/types/components/blind/blind.d.ts +5 -0
- package/dist/types/components/button/button.d.ts +2 -2
- package/dist/types/components/chip/chip.d.ts +8 -0
- package/dist/types/components/date-picker/date-picker.d.ts +6 -1
- package/dist/types/components/date-time-card/date-time-card.d.ts +4 -1
- package/dist/types/components/datetime-picker/datetime-picker.d.ts +8 -3
- package/dist/types/components/dropdown/alignment.d.ts +1 -1
- package/dist/types/components/dropdown/dropdown.d.ts +4 -1
- package/dist/types/components/dropdown-button/dropdown-button.d.ts +3 -2
- package/dist/types/components/flip-tile/flip-tile.d.ts +11 -0
- package/dist/types/components/icon-button/icon-button.d.ts +3 -2
- package/dist/types/components/index-button/index-button.d.ts +16 -0
- package/dist/types/components/modal/modal-utils.d.ts +1 -1
- package/dist/types/components/modal-container/modal-container.d.ts +1 -1
- package/dist/types/components/pagination/pagination.d.ts +55 -0
- package/dist/types/components/split-button/split-button.d.ts +3 -2
- package/dist/types/components/time-picker/time-picker.d.ts +2 -1
- package/dist/types/components/toast/toast-container.d.ts +3 -1
- package/dist/types/components/toast/toast-utils.d.ts +9 -6
- package/dist/types/components/tree/tree-model.d.ts +4 -4
- package/dist/types/components/tree/tree.d.ts +13 -0
- package/dist/types/components/tree-item/default-tree-item.d.ts +1 -1
- package/dist/types/components/typography/types.d.ts +1 -1
- package/dist/types/components/utils/notification-color.d.ts +1 -1
- package/dist/types/components/utils/screen/mode.d.ts +2 -2
- package/dist/types/components/utils/typed-event.d.ts +2 -2
- package/dist/types/components/validation-tooltip/validation-tooltip.d.ts +1 -1
- package/dist/types/components.d.ts +273 -20
- package/dist/types/index.d.ts +10 -9
- package/dist/types/stencil-public-runtime.d.ts +71 -15
- package/loader/index.d.ts +9 -0
- package/package.json +19 -18
- package/scss/components/_forms.scss +1 -1
- package/dist/cjs/modal-a93045dd.js +0 -211
- package/dist/collection/components/button/button-variants.js +0 -1
- package/dist/collection/components/date-picker/events.js +0 -1
- package/dist/collection/components/datetime-picker/event.js +0 -1
- package/dist/collection/components/dropdown/dropdown-trigger-event.js +0 -1
- package/dist/collection/env.js +0 -9
- package/dist/collection/exports.js +0 -17
- package/dist/esm/modal-64e18970.js +0 -208
- package/dist/siemens-ix/p-06d5ab35.entry.js +0 -1
- package/dist/siemens-ix/p-098e22c3.entry.js +0 -1
- package/dist/siemens-ix/p-0bc4408b.entry.js +0 -1
- package/dist/siemens-ix/p-0d619f3e.entry.js +0 -1
- package/dist/siemens-ix/p-0dfe994b.entry.js +0 -1
- package/dist/siemens-ix/p-122c7f57.entry.js +0 -1
- package/dist/siemens-ix/p-122cf38d.entry.js +0 -1
- package/dist/siemens-ix/p-165c6a82.entry.js +0 -1
- package/dist/siemens-ix/p-1d48ce36.entry.js +0 -1
- package/dist/siemens-ix/p-20c88582.entry.js +0 -1
- package/dist/siemens-ix/p-22e84c7c.entry.js +0 -1
- package/dist/siemens-ix/p-2b33ead4.js +0 -1
- package/dist/siemens-ix/p-346c6c2f.entry.js +0 -1
- package/dist/siemens-ix/p-3624a41c.entry.js +0 -1
- package/dist/siemens-ix/p-3cc4df65.entry.js +0 -1
- package/dist/siemens-ix/p-4b2265fd.entry.js +0 -1
- package/dist/siemens-ix/p-4da15801.entry.js +0 -1
- package/dist/siemens-ix/p-560cfce8.entry.js +0 -1
- package/dist/siemens-ix/p-5890faf9.entry.js +0 -1
- package/dist/siemens-ix/p-5b47360e.entry.js +0 -1
- package/dist/siemens-ix/p-5ca7b937.entry.js +0 -1
- package/dist/siemens-ix/p-5feec7a4.entry.js +0 -1
- package/dist/siemens-ix/p-622fb593.entry.js +0 -1
- package/dist/siemens-ix/p-63776469.entry.js +0 -1
- package/dist/siemens-ix/p-66074788.js +0 -2
- package/dist/siemens-ix/p-67cf5cd4.entry.js +0 -1
- package/dist/siemens-ix/p-68ec0b51.entry.js +0 -1
- package/dist/siemens-ix/p-6b463b40.entry.js +0 -1
- package/dist/siemens-ix/p-6be65050.entry.js +0 -1
- package/dist/siemens-ix/p-71c91a11.entry.js +0 -1
- package/dist/siemens-ix/p-72cc8632.entry.js +0 -1
- package/dist/siemens-ix/p-75abd144.js +0 -1
- package/dist/siemens-ix/p-80fe33d1.entry.js +0 -1
- package/dist/siemens-ix/p-8778ba75.entry.js +0 -1
- package/dist/siemens-ix/p-94b440bc.entry.js +0 -1
- package/dist/siemens-ix/p-9c8c835c.entry.js +0 -1
- package/dist/siemens-ix/p-9eb8347c.entry.js +0 -1
- package/dist/siemens-ix/p-9fa6a59b.entry.js +0 -1
- package/dist/siemens-ix/p-ac1d6617.entry.js +0 -1
- package/dist/siemens-ix/p-ae35c07f.entry.js +0 -1
- package/dist/siemens-ix/p-affb60fb.js +0 -1
- package/dist/siemens-ix/p-b0573cc6.entry.js +0 -1
- package/dist/siemens-ix/p-b85458fb.entry.js +0 -1
- package/dist/siemens-ix/p-c2b50878.entry.js +0 -1
- package/dist/siemens-ix/p-c4568016.entry.js +0 -1
- package/dist/siemens-ix/p-c92ee533.entry.js +0 -1
- package/dist/siemens-ix/p-d1a16c62.entry.js +0 -1
- package/dist/siemens-ix/p-d1a8d791.entry.js +0 -1
- package/dist/siemens-ix/p-d7618223.entry.js +0 -1
- package/dist/siemens-ix/p-e5fd4b34.entry.js +0 -1
- package/dist/siemens-ix/p-f3cde62f.entry.js +0 -1
- package/dist/siemens-ix/p-fa262af7.entry.js +0 -1
- package/dist/siemens-ix/p-feefa8c7.entry.js +0 -1
- package/dist/types/components/button/button-variants.d.ts +0 -1
- package/dist/types/components/date-picker/events.d.ts +0 -5
- package/dist/types/components/datetime-picker/event.d.ts +0 -5
- package/dist/types/components/dropdown/dropdown-trigger-event.d.ts +0 -4
- package/dist/types/env.d.ts +0 -1
- package/dist/types/exports.d.ts +0 -9
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["datetimePickerCss","DateTimePicker","undefined","onDone","this","done","emit","_from","_a","_to","_time","join","eventDelimiter","dateSelect","from","to","time","async","event","preventDefault","stopPropagation","detail","date","dateChange","currentDateTime","datePickerElement","getCurrentDate","start","end","timeChange","timePickerElement","getCurrentTime","componentDidLoad","render","h","Host","class","ref","corners","individual","range","onDateChange","format","dateFormat","minDate","maxDate","showHour","showMinutes","showSeconds","showTimeReference","onTimeChange","timeFormat","timeReference","onClick","textSelectDate"],"sources":["./src/components/datetime-picker/datetime-picker.scss?tag=ix-datetime-picker&encapsulation=scoped","./src/components/datetime-picker/datetime-picker.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: block;\n background-color: var(--theme-menu--background);\n border-radius: 4px;\n}\n\n.flex {\n display: flex;\n justify-content: center;\n}\n\n.done {\n display: inline-flex;\n justify-content: flex-end;\n padding: $default-space;\n width: 100%;\n}\n\n.separator {\n border: 1px solid var(--theme-datepicker-separator--background);\n width: 100%;\n margin-top: 72px;\n height: 1px;\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';\nimport { DateChangeEvent } from 'src/components';\n\nexport type DateTimeSelectEvent = {\n from: string;\n to: string;\n time: string;\n};\n\nexport type DateTimeDateChangeEvent =\n | string\n | Omit<DateTimeSelectEvent, 'time'>;\n\n@Component({\n tag: 'ix-datetime-picker',\n styleUrl: 'datetime-picker.scss',\n scoped: true,\n})\nexport class DateTimePicker {\n /**\n * Set range size\n */\n @Prop() range = true;\n\n /**\n * Show hour input\n */\n @Prop() showHour = false;\n\n /**\n * Show minutes input\n */\n @Prop() showMinutes = false;\n\n /**\n * Show seconds input\n */\n @Prop() showSeconds = false;\n\n /**\n * The earliest date that can be selected by the date picker.\n * If not set there will be no restriction.\n *\n * @since 1.1.0\n */\n @Prop() minDate: string;\n\n /**\n * The latest date that can be selected by the date picker.\n * If not set there will be no restriction.\n *\n * @since 1.1.0\n */\n @Prop() maxDate: string;\n\n /**\n * Date format string.\n * See @link https://moment.github.io/luxon/#/formatting?id=table-of-tokens for all available tokens.\n *\n * @since 1.1.0\n */\n @Prop() dateFormat: string = 'yyyy/LL/dd';\n\n /**\n * Time format string.\n * See @link https://moment.github.io/luxon/#/formatting?id=table-of-tokens for all available tokens.\n *\n * @since 1.1.0\n */\n @Prop() timeFormat: string = 'TT';\n\n /**\n * Picker date. If the picker is in range mode this property is the start date.\n *\n * Format is based on `format`\n *\n * @since 1.1.0\n */\n @Prop() from: string;\n\n /**\n * Picker date. If the picker is in range mode this property is the end date.\n * If the picker is not in range mode leave this value `null`\n *\n * Format is based on `format`\n *\n * @since 1.1.0\n */\n @Prop() to: string | null = null;\n\n /**\n * Select time with format string\n *\n * @since 1.1.0\n */\n @Prop() time: string;\n\n /**\n * Show time reference input\n * Time reference is default aligned with @see {this.timeFormat}\n *\n * @since 1.1.0\n */\n @Prop() showTimeReference = undefined;\n\n /**\n * Default behavior of the done event is to join the two events (date and time) into one combined string output.\n * This combination can be configured over the delimiter\n *\n * @since 1.1.0\n */\n @Prop() eventDelimiter = ' - ';\n\n /**\n * Set time reference\n */\n @Prop() timeReference: 'AM' | 'PM';\n\n /**\n * Text of date select button\n *\n * @since 1.1.0\n */\n @Prop() textSelectDate = 'Done';\n\n /**\n * Done event\n *\n * Set `doneEventDelimiter` to null or undefine to get the typed event\n */\n @Event() done: EventEmitter<string>;\n\n /**\n * Time change\n *\n * @since 1.1.0\n */\n @Event() timeChange: EventEmitter<string>;\n\n /**\n * Date change\n *\n * @since 1.1.0\n */\n @Event() dateChange: EventEmitter<DateTimeDateChangeEvent>;\n\n /**\n * Date selection event is fired after confirm button is pressend\n *\n * @since 1.1.0\n */\n @Event() dateSelect: EventEmitter<DateTimeSelectEvent>;\n\n private datePickerElement: HTMLIxDatePickerElement;\n private timePickerElement: HTMLIxTimePickerElement;\n\n private _from: string;\n private _to: string;\n private _time: string;\n\n private onDone() {\n this.done.emit(\n [this._from, this._to ?? '', this._time].join(this.eventDelimiter)\n );\n\n this.dateSelect.emit({\n from: this._from,\n to: this._to,\n time: this._time,\n });\n }\n\n private async onDateChange(event: CustomEvent<string | DateChangeEvent>) {\n event.preventDefault();\n event.stopPropagation();\n const { detail: date } = event;\n this.dateChange.emit(date);\n\n const currentDateTime = await this.datePickerElement.getCurrentDate();\n this._from = currentDateTime.start;\n this._to = currentDateTime.end;\n }\n\n private async onTimeChange(event: CustomEvent<string>) {\n event.preventDefault();\n event.stopPropagation();\n const { detail: time } = event;\n this.timeChange.emit(time);\n\n const currentDateTime = await this.timePickerElement.getCurrentTime();\n this._time = currentDateTime;\n }\n\n componentDidLoad() {\n this._from = this.from;\n this._to = this.to;\n this._time = this.time;\n }\n\n render() {\n return (\n <Host>\n <div class=\"flex\">\n <div class=\"separator\"></div>\n <ix-date-picker\n ref={(ref) => (this.datePickerElement = ref)}\n corners=\"left\"\n individual={false}\n range={this.range}\n onDateChange={(event) => this.onDateChange(event)}\n from={this.from}\n to={this.to}\n format={this.dateFormat}\n minDate={this.minDate}\n maxDate={this.maxDate}\n eventDelimiter={this.eventDelimiter}\n ></ix-date-picker>\n\n <ix-time-picker\n ref={(ref) => (this.timePickerElement = ref)}\n corners=\"right\"\n individual={false}\n showHour={this.showHour}\n showMinutes={this.showMinutes}\n showSeconds={this.showSeconds}\n showTimeReference={this.showTimeReference}\n onTimeChange={(event) => this.onTimeChange(event)}\n time={this.time}\n format={this.timeFormat}\n timeReference={this.timeReference}\n ></ix-time-picker>\n <div class=\"separator\"></div>\n </div>\n\n <div class=\"done\">\n <ix-button onClick={() => this.onDone()}>\n {this.textSelectDate}\n </ix-button>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAoB,kZ,MC2BbC,EAAc,M,oLAIT,K,cAKG,M,iBAKG,M,iBAKA,M,8DAwBO,a,gBAQA,K,4BAmBD,K,2CAeAC,U,oBAQH,M,iDAYA,M,CAqCjBC,S,MACNC,KAAKC,KAAKC,KACR,CAACF,KAAKG,OAAOC,EAAAJ,KAAKK,OAAG,MAAAD,SAAA,EAAAA,EAAI,GAAIJ,KAAKM,OAAOC,KAAKP,KAAKQ,iBAGrDR,KAAKS,WAAWP,KAAK,CACnBQ,KAAMV,KAAKG,MACXQ,GAAIX,KAAKK,IACTO,KAAMZ,KAAKM,O,CAIPO,mBAAmBC,GACzBA,EAAMC,iBACND,EAAME,kBACN,MAAQC,OAAQC,GAASJ,EACzBd,KAAKmB,WAAWjB,KAAKgB,GAErB,MAAME,QAAwBpB,KAAKqB,kBAAkBC,iBACrDtB,KAAKG,MAAQiB,EAAgBG,MAC7BvB,KAAKK,IAAMe,EAAgBI,G,CAGrBX,mBAAmBC,GACzBA,EAAMC,iBACND,EAAME,kBACN,MAAQC,OAAQL,GAASE,EACzBd,KAAKyB,WAAWvB,KAAKU,GAErB,MAAMQ,QAAwBpB,KAAK0B,kBAAkBC,iBACrD3B,KAAKM,MAAQc,C,CAGfQ,mBACE5B,KAAKG,MAAQH,KAAKU,KAClBV,KAAKK,IAAML,KAAKW,GAChBX,KAAKM,MAAQN,KAAKY,I,CAGpBiB,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAM,QACTF,EAAA,OAAKE,MAAM,cACXF,EAAA,kBACEG,IAAMA,GAASjC,KAAKqB,kBAAoBY,EACxCC,QAAQ,OACRC,WAAY,MACZC,MAAOpC,KAAKoC,MACZC,aAAevB,GAAUd,KAAKqC,aAAavB,GAC3CJ,KAAMV,KAAKU,KACXC,GAAIX,KAAKW,GACT2B,OAAQtC,KAAKuC,WACbC,QAASxC,KAAKwC,QACdC,QAASzC,KAAKyC,QACdjC,eAAgBR,KAAKQ,iBAGvBsB,EAAA,kBACEG,IAAMA,GAASjC,KAAK0B,kBAAoBO,EACxCC,QAAQ,QACRC,WAAY,MACZO,SAAU1C,KAAK0C,SACfC,YAAa3C,KAAK2C,YAClBC,YAAa5C,KAAK4C,YAClBC,kBAAmB7C,KAAK6C,kBACxBC,aAAehC,GAAUd,KAAK8C,aAAahC,GAC3CF,KAAMZ,KAAKY,KACX0B,OAAQtC,KAAK+C,WACbC,cAAehD,KAAKgD,gBAEtBlB,EAAA,OAAKE,MAAM,eAGbF,EAAA,OAAKE,MAAM,QACTF,EAAA,aAAWmB,QAAS,IAAMjD,KAAKD,UAC5BC,KAAKkD,iB"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as i,h as s,H as e,g as h}from"./p-8fcd6f85.js";import{g as n}from"./p-5b39e04e.js";const o=".sc-ix-split-button-h{display:inline-block}.sc-ix-split-button-h .btn-group.sc-ix-split-button{width:100%}.sc-ix-split-button-h .btn-group.sc-ix-split-button>button.sc-ix-split-button:nth-child(1){width:calc(100% - 2rem)}.sc-ix-split-button-h .btn-group.sc-ix-split-button>button.sc-ix-split-button:nth-child(2){width:2rem}.sc-ix-split-button-h .middle-gap.sc-ix-split-button{gap:0.125rem}.sc-ix-split-button-h .left-button-border.sc-ix-split-button{border-top-width:0.125rem;border-right-width:0;border-left-width:0.125rem;border-bottom-width:0.125rem}";const r=class{constructor(s){t(this,s);this.buttonClick=i(this,"buttonClick",7);this.variant="Primary";this.outline=false;this.invisible=false;this.ghost=false;this.label=undefined;this.icon="";this.splitIcon="context-menu";this.disabled=false;this.placement="bottom-start";this.toggle=false}get splitItems(){return Array.from(this.hostElement.querySelectorAll("ix-split-button-item"))}linkTriggerRef(){if(this.triggerElement&&this.dropdownElement){this.dropdownElement.trigger=this.triggerElement}}componentDidLoad(){this.linkTriggerRef()}render(){return s(e,null,s("div",{class:{"btn-group":true,"middle-gap":!this.outline}},s("button",{class:Object.assign(Object.assign({},n(this.variant,this.outline,this.ghost||this.invisible,!this.label,false,false,this.disabled)),{"left-button-border":!this.outline}),onClick:t=>this.buttonClick.emit(t)},this.icon?s("ix-icon",{name:this.icon}):null," ",this.label),s("button",{ref:t=>this.triggerElement=t,class:Object.assign(Object.assign({},n(this.variant,this.outline,this.ghost||this.invisible,true,false,false,this.disabled)),{anchor:true})},s("ix-icon",{name:this.splitIcon}))),s("ix-dropdown",{ref:t=>this.dropdownElement=t},s("slot",null)))}get hostElement(){return h(this)}};r.style=o;const l=".sc-ix-split-button-item-h{display:block}";const c=class{constructor(s){t(this,s);this.itemClick=i(this,"itemClick",7);this.icon=undefined;this.label=undefined}render(){return s("ix-dropdown-item",{icon:this.icon,label:this.label,onClick:t=>this.itemClick.emit(t)})}get hostElement(){return h(this)}};c.style=l;export{r as ix_split_button,c as ix_split_button_item};
|
|
2
|
+
//# sourceMappingURL=p-a4a16daa.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["splitButtonCss","SplitButton","splitItems","Array","from","this","hostElement","querySelectorAll","linkTriggerRef","triggerElement","dropdownElement","trigger","componentDidLoad","render","h","Host","class","outline","Object","assign","getButtonClasses","variant","ghost","invisible","label","disabled","onClick","e","buttonClick","emit","icon","name","ref","r","anchor","splitIcon","splitButtonItemCss","SplitButtonItem","itemClick"],"sources":["./src/components/split-button/split-button.scss?tag=ix-split-button&encapsulation=scoped","./src/components/split-button/split-button.tsx","./src/components/split-button-item/split-button-item.css?tag=ix-split-button-item&encapsulation=scoped","./src/components/split-button-item/split-button-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:host {\n display: inline-block;\n\n .btn-group {\n // Overwrite styling from bootstrap button group\n width: 100%;\n\n > button:nth-child(1) {\n width: calc(100% - 2rem);\n }\n\n > button:nth-child(2) {\n width: 2rem;\n }\n }\n\n .middle-gap {\n gap: 0.125rem;\n }\n\n .left-button-border {\n border-top-width: 0.125rem;\n border-right-width: 0;\n border-left-width: 0.125rem;\n border-bottom-width: 0.125rem;\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 State,\n} from '@stencil/core';\nimport { getButtonClasses } from '../button/base-button';\nimport { ButtonVariant } from '../button/button';\nimport { Placement } from '../dropdown/placement';\n\nexport type SplitButtonVariant = ButtonVariant;\n\n@Component({\n tag: 'ix-split-button',\n styleUrl: 'split-button.scss',\n scoped: true,\n})\nexport class SplitButton {\n @Element() hostElement!: HTMLIxSplitButtonElement;\n\n /**\n * Color variant of button\n */\n @Prop() variant: SplitButtonVariant = 'Primary';\n\n /**\n * Button outline variant\n */\n @Prop() outline = false;\n\n /**\n * Button invisible\n *\n * @deprecated Will be removed in 2.0.0. Use ghost property\n */\n @Prop() invisible = false;\n\n /**\n * Button invisible\n */\n @Prop() ghost = false;\n\n /**\n * Button label\n */\n @Prop() label: string;\n\n /**\n * Button icon\n */\n @Prop() icon = '';\n\n /**\n * Splitbutton icon\n */\n @Prop() splitIcon = 'context-menu';\n\n /**\n * Disabled\n */\n @Prop() disabled = false;\n\n /**\n * Placement of the dropdown\n */\n @Prop() placement: Placement = 'bottom-start';\n\n @State() toggle = false;\n\n /**\n * Button clicked\n */\n @Event() buttonClick: EventEmitter<MouseEvent>;\n\n private triggerElement: HTMLElement;\n private dropdownElement: HTMLIxDropdownElement;\n\n get splitItems() {\n return Array.from(\n this.hostElement.querySelectorAll('ix-split-button-item')\n );\n }\n\n private linkTriggerRef() {\n if (this.triggerElement && this.dropdownElement) {\n this.dropdownElement.trigger = this.triggerElement;\n }\n }\n\n componentDidLoad() {\n this.linkTriggerRef();\n }\n\n render() {\n return (\n <Host>\n <div class={{ 'btn-group': true, 'middle-gap': !this.outline }}>\n <button\n class={{\n ...getButtonClasses(\n this.variant,\n this.outline,\n this.ghost || this.invisible,\n !this.label,\n false,\n false,\n this.disabled\n ),\n ...{\n 'left-button-border': !this.outline,\n },\n }}\n onClick={(e) => this.buttonClick.emit(e)}\n >\n {this.icon ? <ix-icon name={this.icon} /> : null} {this.label}\n </button>\n <button\n ref={(r) => (this.triggerElement = r)}\n class={{\n ...getButtonClasses(\n this.variant,\n this.outline,\n this.ghost || this.invisible,\n true,\n false,\n false,\n this.disabled\n ),\n ...{\n anchor: true,\n },\n }}\n >\n <ix-icon name={this.splitIcon} />\n </button>\n </div>\n\n <ix-dropdown ref={(r) => (this.dropdownElement = r)}>\n <slot></slot>\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-split-button-item',\n styleUrl: 'split-button-item.css',\n scoped: true,\n})\nexport class SplitButtonItem {\n /**\n * Dropdown icon\n */\n @Prop() icon: string;\n\n /**\n * Dropdown label\n */\n @Prop() label: string;\n\n /**\n * Dropdown item clicked\n */\n @Event() itemClick: EventEmitter<MouseEvent>;\n\n @Element() hostElement: HTMLIxSplitButtonItemElement;\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"],"mappings":"oGAAA,MAAMA,EAAiB,4iB,MC8BVC,EAAW,M,+EAMgB,U,aAKpB,M,eAOE,M,WAKJ,M,+BAUD,G,eAKK,e,cAKD,M,eAKY,e,YAEb,K,CAUdC,iBACF,OAAOC,MAAMC,KACXC,KAAKC,YAAYC,iBAAiB,wB,CAI9BC,iBACN,GAAIH,KAAKI,gBAAkBJ,KAAKK,gBAAiB,CAC/CL,KAAKK,gBAAgBC,QAAUN,KAAKI,c,EAIxCG,mBACEP,KAAKG,gB,CAGPK,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAO,CAAE,YAAa,KAAM,cAAeX,KAAKY,UACnDH,EAAA,UACEE,MAAKE,OAAAC,OAAAD,OAAAC,OAAA,GACAC,EACDf,KAAKgB,QACLhB,KAAKY,QACLZ,KAAKiB,OAASjB,KAAKkB,WAClBlB,KAAKmB,MACN,MACA,MACAnB,KAAKoB,WAEJ,CACD,sBAAuBpB,KAAKY,UAGhCS,QAAUC,GAAMtB,KAAKuB,YAAYC,KAAKF,IAErCtB,KAAKyB,KAAOhB,EAAA,WAASiB,KAAM1B,KAAKyB,OAAW,KAAI,IAAGzB,KAAKmB,OAE1DV,EAAA,UACEkB,IAAMC,GAAO5B,KAAKI,eAAiBwB,EACnCjB,MAAKE,OAAAC,OAAAD,OAAAC,OAAA,GACAC,EACDf,KAAKgB,QACLhB,KAAKY,QACLZ,KAAKiB,OAASjB,KAAKkB,UACnB,KACA,MACA,MACAlB,KAAKoB,WAEJ,CACDS,OAAQ,QAIZpB,EAAA,WAASiB,KAAM1B,KAAK8B,cAIxBrB,EAAA,eAAakB,IAAMC,GAAO5B,KAAKK,gBAAkBuB,GAC/CnB,EAAA,c,8CCvJV,MAAMsB,EAAqB,4C,MCuBdC,EAAe,M,uGAkB1BxB,SACE,OACEC,EAAA,oBACEgB,KAAMzB,KAAKyB,KACXN,MAAOnB,KAAKmB,MACZE,QAAUC,GAAMtB,KAAKiC,UAAUT,KAAKF,I"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,c as r,h as o,H as i,g as t}from"./p-8fcd6f85.js";const s=".sc-ix-group-h{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:column;position:relative;max-width:19.75rem;border-color:var(--theme-group-item--border-color)}.sc-ix-group-h .group-header.sc-ix-group{height:4rem;min-height:4rem;max-height:4rem;border-radius:0.25rem;display:flex;background-color:var(--theme-group-item--background);border:1px solid var(--theme-group-item--border-color);color:var(--theme-group-header--color);cursor:pointer}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover);border-color:var(--theme-group-item--border-color--hover)}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled):active{background-color:var(--theme-group-item--background--active);border-color:var(--theme-group-item--border-color--active)}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled):focus-visible{border-color:var(--focus--border-color);border-radius:var(--theme-group--border-radius--focus);outline:none}.sc-ix-group-h .group-header.selected.sc-ix-group{border:var(--theme-primary-bdr-2);background-color:var(--theme-group-item--background--selected)}.sc-ix-group-h .group-header.sc-ix-group .group-header-selection-indicator.sc-ix-group{background-color:var(--theme-color-input--focus)}.sc-ix-group-h .group-header-clickable.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;width:100%;min-width:0}.sc-ix-group-h .group-header.expand.sc-ix-group{border-bottom-left-radius:0;border-bottom-right-radius:0}.sc-ix-group-h .group-header-selection-indicator.sc-ix-group{width:0.25rem}.sc-ix-group-h .group-header-content.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:row;justify-content:space-between;min-width:0;padding:0.5rem;padding-left:0;width:100%}.sc-ix-group-h .group-header-content.sc-ix-group .group-header-props-container.sc-ix-group{width:100%}.sc-ix-group-h .group-header-content.sc-ix-group .group-header-title.sc-ix-group{display:flex;align-items:center;font-size:1rem;font-weight:700;height:1.5rem}.sc-ix-group-h .group-header-content.sc-ix-group .group-header-title.sc-ix-group>*.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.sc-ix-group-h .group-header-content.sc-ix-group .group-subheader.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:1.25rem;font-size:0.875rem;color:var(--theme-group-subheader--color)}.sc-ix-group-h .expand-icon.sc-ix-group{padding:0.125rem 0.437rem;color:var(--theme-color-std-text)}.sc-ix-group-h .btn-expand-header.sc-ix-group{margin:0.5rem;-webkit-margin-end:0.25rem;margin-inline-end:0.25rem}.sc-ix-group-h .group-content.sc-ix-group{display:flex;flex-direction:column}.sc-ix-group-h .footer.sc-ix-group{height:auto;min-height:0}";const n=class{get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-dropdown-item"))}get groupItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-item:not(.footer)"))}get groupContent(){return this.hostElement.querySelector(".group-content")}get footer(){return this.hostElement.querySelector(".footer")}constructor(o){e(this,o);this.selectGroup=r(this,"selectGroup",7);this.selectItem=r(this,"selectItem",7);this.collapsedChanged=r(this,"collapsedChanged",7);this.suppressHeaderSelection=false;this.header=undefined;this.subHeader=undefined;this.collapsed=true;this.selected=undefined;this.index=undefined;this.expandOnHeaderClick=false;this.dropdownTriggerRef=undefined}async onKeyDown(e){const r=e.target;if(!this.hostElement.contains(r)){return}if(e.code==="Enter"||e.code==="NumpadEnter"){if(r.classList.contains("group-header")){if(this.suppressHeaderSelection){this.collapsed=!this.collapsed}else{this.selected=!this.selected}}else if(r.matches("ix-group-item")){const e=r;e.selected=!e.selected}}}onExpandClick(e){const r=this.collapsed;this.collapsed=!this.collapsed;if(!r&&this.index!==undefined){this.index=undefined;this.setGroupSelection(true)}this.collapsedChanged.emit(this.collapsed);e.stopPropagation()}onHeaderClick(e){this.setGroupSelection(!this.selected);if(this.suppressHeaderSelection){this.onExpandClick(e)}}onItemClick(e){if(e===this.index){this.index=undefined;this.selectItem.emit(undefined)}else{this.index=e;this.selectItem.emit(e)}this.setGroupSelection(false)}setGroupSelection(e){if(!this.suppressHeaderSelection){this.selected=e;this.selectGroup.emit(this.selected)}}componentWillRender(){var e;this.groupItems.forEach(((e,r)=>{var o;e.selected=r===this.index;e.index=r;e.classList.remove("last");if(!((o=this.footer)===null||o===void 0?void 0:o.children.length)&&r===this.groupItems.length-1){e.classList.add("last")}}));if(((e=this.footer)===null||e===void 0?void 0:e.childElementCount)>1){this.groupContent.appendChild(this.footer)}}componentDidLoad(){this.groupContent.addEventListener("selectedChanged",(e=>{this.onItemClick(e.detail.index)}))}render(){return o(i,null,o("div",{class:{"group-header":true,expand:!this.collapsed,selected:this.selected},tabindex:"0"},o("div",{class:"group-header-clickable",onClick:e=>this.onHeaderClick(e)},o("div",{class:"group-header-selection-indicator"}),o("ix-icon",{class:"btn-expand-header",name:`chevron-${this.collapsed?"right":"down"}-small`,onClick:e=>this.onExpandClick(e)}),o("div",{class:"group-header-content"},this.header?o("div",{class:"group-header-props-container"},o("div",{class:"group-header-title"},o("span",{title:this.header},this.header)),o("div",{class:"group-subheader",title:this.subHeader},this.subHeader)):null,o("slot",{name:"header"}))),o("ix-group-context-menu",null,o("slot",{name:"dropdown"}))),o("div",{class:{"group-content":true,"d-none":this.collapsed}},o("slot",null)),o("div",{class:"d-none"},o("ix-group-item",{class:"footer last",suppressSelection:true,focusable:false},o("slot",{name:"footer"}))))}get hostElement(){return t(this)}};n.style=s;const d=".sc-ix-group-dropdown-item-h{display:contents}";const c=class{constructor(r){e(this,r);this.label=undefined;this.icon=undefined}render(){return o(i,null,o("ix-dropdown-item",{label:this.label,icon:this.icon},o("slot",null)))}};c.style=d;const h=".sc-ix-group-item-h{display:flex;min-height:2.25rem;height:2.25rem;align-items:center;justify-content:space-between;padding:0.5rem 1.5rem 0.5rem 2.5rem;position:relative;margin-top:0.0625rem;border:1px solid var(--theme-group-item--border-color);outline:none;background-color:var(--theme-group-item--background)}.last.sc-ix-group-item-h{border-bottom-left-radius:0.25rem;border-bottom-right-radius:0.25rem}.sc-ix-group-item-h ix-icon.sc-ix-group-item{margin-right:0.25rem;margin-top:-0.125rem}.sc-ix-group-item-h .group-entry-selection-indicator.sc-ix-group-item{position:absolute;left:0;height:100%;width:0.25rem}.sc-ix-group-item-h .group-entry-text.sc-ix-group-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text);font-size:0.875rem}.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item,.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item span.sc-ix-group-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover);border-color:var(--theme-group-item--border-color--hover)}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):active{background-color:var(--theme-group-item--background--active);border-color:var(--theme-group-item--border-color--active)}.selected.sc-ix-group-item-h{border-top-width:0.062rem !important;border-color:var(--theme-group-item--border-color--selected);background-color:var(--theme-group-item--background--selected)}.selected.sc-ix-group-item-h .group-entry-selection-indicator.sc-ix-group-item{background-color:var(--theme-color-input--focus)}.sc-ix-group-item-h:not(.disabled):not(:disabled):focus-visible{border-color:var(--focus--border-color) !important}";const u=class{constructor(o){e(this,o);this.selectedChanged=r(this,"selectedChanged",7);this.icon=undefined;this.text=undefined;this.secondaryText=undefined;this.suppressSelection=false;this.selected=undefined;this.focusable=true;this.index=undefined}clickListen(){if(this.suppressSelection){return}this.selectedChanged.emit(this.hostElement)}render(){return o(i,{class:{selected:this.selected&&!this.suppressSelection,"suppress-selection":this.suppressSelection},tabindex:this.focusable?0:-1},o("div",{class:"group-entry-selection-indicator"}),this.icon?o("ix-icon",{size:"16",name:this.icon}):null,this.text?o("span",{class:"group-entry-text"},o("span",{title:this.text},this.text)):null,this.secondaryText?o("span",{class:"group-entry-text-secondary"},o("span",{title:this.secondaryText},this.secondaryText)):null,o("slot",null))}get hostElement(){return t(this)}};u.style=h;export{n as ix_group,c as ix_group_dropdown_item,u as ix_group_item};
|
|
2
|
+
//# sourceMappingURL=p-a92126b5.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["groupCss","Group","dropdownItems","Array","from","this","hostElement","querySelectorAll","groupItems","groupContent","querySelector","footer","constructor","hostRef","registerInstance","selectGroup","createEvent","selectItem","collapsedChanged","suppressHeaderSelection","header","undefined","subHeader","collapsed","selected","index","expandOnHeaderClick","dropdownTriggerRef","async","event","targetElement","target","contains","code","classList","matches","groupItem","onExpandClick","wasCollapsed","setGroupSelection","emit","stopPropagation","onHeaderClick","onItemClick","selection","componentWillRender","forEach","item","remove","_a","children","length","add","childElementCount","appendChild","componentDidLoad","addEventListener","evt","detail","render","h","Host","class","expand","tabindex","onClick","e","name","title","suppressSelection","focusable","groupDropdownItemCss","GroupDropdownItem","label","icon","groupItemCss","GroupItem","clickListen","selectedChanged","size","text","secondaryText"],"sources":["./src/components/group/group.scss?tag=ix-group&encapsulation=scoped","./src/components/group/group.tsx","./src/components/group-dropdown-item/group-dropdown-item.scss?tag=ix-group-dropdown-item&encapsulation=scoped","./src/components/group-dropdown-item/group-dropdown-item.tsx","./src/components/group-item/group-item.scss?tag=ix-group-item&encapsulation=scoped","./src/components/group-item/group-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/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n @include ellipsis;\n\n display: flex;\n flex-direction: column;\n position: relative;\n max-width: 19.75rem;\n border-color: var(--theme-group-item--border-color);\n\n .group-header {\n height: 4rem;\n min-height: 4rem;\n max-height: 4rem;\n border-radius: 0.25rem;\n display: flex;\n background-color: var(--theme-group-item--background);\n border: 1px solid var(--theme-group-item--border-color);\n color: var(--theme-group-header--color);\n\n cursor: pointer;\n\n @include hover {\n background-color: var(--theme-group-item--background--hover);\n border-color: var(--theme-group-item--border-color--hover);\n }\n\n @include active {\n background-color: var(--theme-group-item--background--active);\n border-color: var(--theme-group-item--border-color--active);\n }\n\n @include focus-visible {\n border-color: var(--focus--border-color);\n border-radius: var(--theme-group--border-radius--focus);\n outline: none;\n }\n\n &.selected {\n border: var(--theme-primary-bdr-2);\n background-color: var(--theme-group-item--background--selected);\n }\n\n .group-header-selection-indicator {\n background-color: var(--theme-color-input--focus);\n }\n }\n\n .group-header-clickable {\n @include ellipsis;\n\n display: flex;\n width: 100%;\n min-width: 0;\n }\n\n .group-header.expand {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n .group-header-selection-indicator {\n width: $tiny-space;\n }\n\n .group-header-content {\n @include ellipsis;\n\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n min-width: 0;\n padding: 0.5rem;\n padding-left: 0;\n width: 100%;\n\n .group-header-props-container {\n width: 100%;\n }\n\n .group-header-title {\n display: flex;\n align-items: center;\n font-size: 1rem;\n font-weight: $font-weight-bold;\n height: 1.5rem;\n\n & > * {\n @include ellipsis;\n\n min-width: 0;\n }\n }\n\n .group-subheader {\n @include ellipsis();\n\n height: 1.25rem;\n font-size: 0.875rem;\n color: var(--theme-group-subheader--color);\n }\n }\n\n .expand-icon {\n padding: 0.125rem 0.437rem;\n color: var(--theme-color-std-text);\n }\n\n .btn-expand-header {\n margin: $small-space;\n margin-inline-end: $tiny-space;\n }\n\n .group-content {\n display: flex;\n flex-direction: column;\n }\n\n .footer {\n height: auto;\n min-height: 0;\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 Listen,\n Prop,\n State,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-group',\n styleUrl: 'group.scss',\n scoped: true,\n})\nexport class Group {\n /**\n * Prevent header from being selectable\n */\n @Prop() suppressHeaderSelection = false;\n\n /**\n * Group header\n */\n @Prop() header: string;\n\n /**\n * Group header subtitle\n */\n @Prop() subHeader: string;\n\n /**\n * Whether the group is collapsed or expanded. Defaults to true.\n */\n @Prop({ mutable: true, reflect: true }) collapsed = true;\n\n /**\n * Whether the group is selected.\n */\n @Prop({ mutable: true, reflect: true }) selected: boolean;\n\n /**\n * The index of the selected group entry.\n * If undefined no group item is selected.\n */\n @Prop({ mutable: true, reflect: true }) index: number;\n\n /**\n * Expand the group if the header is clicked\n */\n @Prop() expandOnHeaderClick = false;\n\n /**\n * Emits when whole group gets selected.\n */\n @Event() selectGroup: EventEmitter<boolean>;\n\n /**\n * Emits when group item gets selected.\n */\n @Event() selectItem: EventEmitter<number>;\n\n /**\n * Group collapsed\n */\n @Event() collapsedChanged: EventEmitter<boolean>;\n\n @Element() hostElement!: HTMLIxGroupElement;\n\n get dropdownItems() {\n return Array.from(\n this.hostElement.querySelectorAll('ix-group-dropdown-item')\n );\n }\n\n get groupItems(): Array<HTMLIxGroupItemElement> {\n return Array.from(\n this.hostElement.querySelectorAll('ix-group-item:not(.footer)')\n );\n }\n\n get groupContent() {\n return this.hostElement.querySelector('.group-content');\n }\n\n get footer() {\n return this.hostElement.querySelector('.footer');\n }\n\n @State() dropdownTriggerRef: HTMLElement;\n\n constructor() {}\n\n @Listen('keydown', {\n target: 'window',\n })\n async onKeyDown(event: KeyboardEvent) {\n const targetElement = event.target as HTMLElement;\n\n if (!this.hostElement.contains(targetElement)) {\n return;\n }\n\n if (event.code === 'Enter' || event.code === 'NumpadEnter') {\n if (targetElement.classList.contains('group-header')) {\n if (this.suppressHeaderSelection) {\n this.collapsed = !this.collapsed;\n } else {\n this.selected = !this.selected;\n }\n } else if (targetElement.matches('ix-group-item')) {\n const groupItem = targetElement as HTMLIxGroupItemElement;\n groupItem.selected = !groupItem.selected;\n }\n }\n }\n\n private onExpandClick(event: Event) {\n const wasCollapsed = this.collapsed;\n this.collapsed = !this.collapsed;\n\n if (!wasCollapsed && this.index !== undefined) {\n this.index = undefined;\n this.setGroupSelection(true);\n }\n\n this.collapsedChanged.emit(this.collapsed);\n event.stopPropagation();\n }\n\n private onHeaderClick(event: Event) {\n this.setGroupSelection(!this.selected);\n\n if (this.suppressHeaderSelection) {\n this.onExpandClick(event);\n }\n }\n\n private onItemClick(index: number) {\n if (index === this.index) {\n this.index = undefined;\n this.selectItem.emit(undefined);\n } else {\n this.index = index;\n this.selectItem.emit(index);\n }\n\n this.setGroupSelection(false);\n }\n\n private setGroupSelection(selection: boolean) {\n if (!this.suppressHeaderSelection) {\n this.selected = selection;\n this.selectGroup.emit(this.selected);\n }\n }\n\n componentWillRender() {\n this.groupItems.forEach((item, index) => {\n item.selected = index === this.index;\n item.index = index;\n item.classList.remove('last');\n if (\n !this.footer?.children.length &&\n index === this.groupItems.length - 1\n ) {\n item.classList.add('last');\n }\n });\n\n if (this.footer?.childElementCount > 1) {\n this.groupContent.appendChild(this.footer);\n }\n }\n\n componentDidLoad() {\n this.groupContent.addEventListener(\n 'selectedChanged',\n (evt: CustomEvent<HTMLIxGroupItemElement>) => {\n this.onItemClick(evt.detail.index);\n }\n );\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'group-header': true,\n expand: !this.collapsed,\n selected: this.selected,\n }}\n tabindex=\"0\"\n >\n <div\n class=\"group-header-clickable\"\n onClick={(e) => this.onHeaderClick(e)}\n >\n <div class=\"group-header-selection-indicator\"></div>\n <ix-icon\n class=\"btn-expand-header\"\n name={`chevron-${this.collapsed ? 'right' : 'down'}-small`}\n onClick={(e) => this.onExpandClick(e)}\n ></ix-icon>\n <div class=\"group-header-content\">\n {this.header ? (\n <div class=\"group-header-props-container\">\n <div class=\"group-header-title\">\n <span title={this.header}>{this.header}</span>\n </div>\n <div class=\"group-subheader\" title={this.subHeader}>\n {this.subHeader}\n </div>\n </div>\n ) : null}\n <slot name=\"header\"></slot>\n </div>\n </div>\n <ix-group-context-menu>\n <slot name=\"dropdown\"></slot>\n </ix-group-context-menu>\n </div>\n <div\n class={{\n 'group-content': true,\n 'd-none': this.collapsed,\n }}\n >\n <slot></slot>\n </div>\n <div class=\"d-none\">\n <ix-group-item\n class=\"footer last\"\n suppressSelection={true}\n focusable={false}\n >\n <slot name=\"footer\"></slot>\n </ix-group-item>\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: contents;\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-group-dropdown-item',\n styleUrl: 'group-dropdown-item.scss',\n scoped: true,\n})\nexport class GroupDropdownItem {\n /**\n * Group dropdown label\n */\n @Prop() label: string;\n\n /**\n * Group dropdown icon\n */\n @Prop() icon: string;\n\n render() {\n return (\n <Host>\n <ix-dropdown-item label={this.label} icon={this.icon}>\n <slot></slot>\n </ix-dropdown-item>\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/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n display: flex;\n min-height: 2.25rem;\n height: 2.25rem;\n align-items: center;\n justify-content: space-between;\n padding: $small-space $large-space $small-space 2.5rem;\n position: relative;\n margin-top: 0.0625rem;\n border: 1px solid var(--theme-group-item--border-color);\n outline: none;\n\n background-color: var(--theme-group-item--background);\n\n &.last {\n border-bottom-left-radius: 0.25rem;\n border-bottom-right-radius: 0.25rem;\n }\n\n ix-icon {\n margin-right: $tiny-space;\n margin-top: -0.125rem;\n }\n\n .group-entry-selection-indicator {\n position: absolute;\n left: 0;\n height: 100%;\n width: $tiny-space;\n }\n\n .group-entry-text {\n @include ellipsis();\n flex-grow: 1;\n }\n\n .group-entry-text-secondary {\n &,\n span {\n @include ellipsis;\n }\n\n display: flex;\n justify-content: flex-end;\n flex-grow: 1;\n white-space: nowrap;\n color: var(--theme-color-soft-text);\n font-size: 0.875rem;\n }\n\n &:not(.suppress-selection) {\n @include hover {\n background-color: var(--theme-group-item--background--hover);\n border-color: var(--theme-group-item--border-color--hover);\n }\n\n @include active {\n background-color: var(--theme-group-item--background--active);\n border-color: var(--theme-group-item--border-color--active);\n }\n }\n\n &.selected {\n border-top-width: 0.062rem !important;\n border-color: var(--theme-group-item--border-color--selected);\n background-color: var(--theme-group-item--background--selected);\n\n .group-entry-selection-indicator {\n background-color: var(--theme-color-input--focus);\n }\n }\n\n @include focus-visible {\n border-color: var(--focus--border-color) !important;\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 Listen,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-group-item',\n styleUrl: 'group-item.scss',\n scoped: true,\n})\nexport class GroupItem {\n @Element() hostElement!: HTMLIxGroupItemElement;\n\n /**\n * Group item icon\n */\n @Prop() icon: string;\n\n /**\n * Group item text\n */\n @Prop() text: string;\n\n /**\n * Group item secondary text\n */\n @Prop() secondaryText: string;\n\n /**\n * Supress the selection of the group\n */\n @Prop() suppressSelection = false;\n\n /**\n * Show selected state\n */\n @Prop() selected: boolean;\n\n /**\n * The elements tabindex attribute will get set accordingly.\n * If true tabindex will be 0, -1 otherwise.\n */\n @Prop() focusable = true;\n\n /**\n * Selection changed\n */\n @Event() selectedChanged: EventEmitter<HTMLIxGroupItemElement>;\n\n /**\n * Index\n */\n @Prop() index: number;\n\n @Listen('click', { passive: true })\n clickListen() {\n if (this.suppressSelection) {\n return;\n }\n this.selectedChanged.emit(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n selected: this.selected && !this.suppressSelection,\n 'suppress-selection': this.suppressSelection,\n }}\n tabindex={this.focusable ? 0 : -1}\n >\n <div class=\"group-entry-selection-indicator\"></div>\n {this.icon ? <ix-icon size=\"16\" name={this.icon}></ix-icon> : null}\n {this.text ? (\n <span class=\"group-entry-text\">\n <span title={this.text}>{this.text}</span>\n </span>\n ) : null}\n {this.secondaryText ? (\n <span class=\"group-entry-text-secondary\">\n <span title={this.secondaryText}>{this.secondaryText}</span>\n </span>\n ) : null}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as i,h as r,H as t,g as o}from"./p-8fcd6f85.js";const e='.sc-ix-counter-pill-h{display:inline-flex;width:-moz-fit-content;width:fit-content;position:relative;align-items:center;justify-content:center;border-radius:100px;padding:0px 6px;margin-left:0.25rem;min-width:1.5rem;height:1.25rem;min-height:1.25rem;max-height:1.25rem;cursor:auto}.sc-ix-counter-pill-h .with-icon.sc-ix-counter-pill{margin-right:0.25rem}.align-left.sc-ix-counter-pill-h{justify-content:flex-start}[variant=primary].sc-ix-counter-pill-h{background-color:var(--theme-color-primary);color:var(--theme-chip-primary--color)}[variant=primary].sc-ix-counter-pill-h .close-button.sc-ix-counter-pill{color:var(--theme-chip-primary--color);pointer-events:auto}[variant=primary].outline.sc-ix-counter-pill-h{color:var(--theme-chip-primary-outline--color);background-color:transparent;border:solid 1px var(--theme-chip-primary-outline--border-color)}[variant=primary].outline.sc-ix-counter-pill-h .close-button.sc-ix-counter-pill{color:var(--theme-chip-primary-outline--color)}[variant=alarm].sc-ix-counter-pill-h{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-alarm)}[variant=alarm].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=alarm].sc-ix-counter-pill-h:not(.outline).active::after,[variant=alarm].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=alarm].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-alarm)}[variant=alarm].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=alarm].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=alarm].outline.active.sc-ix-counter-pill-h::after,[variant=alarm].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=alarm].outline.active.sc-ix-counter-pill-h,[variant=alarm].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=critical].sc-ix-counter-pill-h{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-critical)}[variant=critical].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=critical].sc-ix-counter-pill-h:not(.outline).active::after,[variant=critical].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=critical].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-critical)}[variant=critical].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=critical].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=critical].outline.active.sc-ix-counter-pill-h::after,[variant=critical].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=critical].outline.active.sc-ix-counter-pill-h,[variant=critical].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=warning].sc-ix-counter-pill-h{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-warning)}[variant=warning].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=warning].sc-ix-counter-pill-h:not(.outline).active::after,[variant=warning].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=warning].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-warning)}[variant=warning].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=warning].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=warning].outline.active.sc-ix-counter-pill-h::after,[variant=warning].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=warning].outline.active.sc-ix-counter-pill-h,[variant=warning].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=info].sc-ix-counter-pill-h{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-info)}[variant=info].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=info].sc-ix-counter-pill-h:not(.outline).active::after,[variant=info].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=info].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-info)}[variant=info].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=info].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=info].outline.active.sc-ix-counter-pill-h::after,[variant=info].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=info].outline.active.sc-ix-counter-pill-h,[variant=info].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=neutral].sc-ix-counter-pill-h{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-neutral)}[variant=neutral].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=neutral].sc-ix-counter-pill-h:not(.outline).active::after,[variant=neutral].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=neutral].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-neutral)}[variant=neutral].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=neutral].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=neutral].outline.active.sc-ix-counter-pill-h::after,[variant=neutral].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=neutral].outline.active.sc-ix-counter-pill-h,[variant=neutral].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=success].sc-ix-counter-pill-h{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-success)}[variant=success].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=success].sc-ix-counter-pill-h:not(.outline).active::after,[variant=success].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=success].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-success)}[variant=success].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=success].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=success].outline.active.sc-ix-counter-pill-h::after,[variant=success].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=success].outline.active.sc-ix-counter-pill-h,[variant=success].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=custom].outline.sc-ix-counter-pill-h{border:solid 1px transparent;background-color:transparent}.sc-ix-counter-pill-h .slot.sc-ix-counter-pill{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-counter-pill-h .hidden.sc-ix-counter-pill{width:0px;margin-right:0px}.sc-ix-counter-pill-h{min-height:1rem;max-height:1rem;height:1rem;font-size:0.75rem;padding:0 0.25rem;min-width:1rem;width:auto;padding:0 4px}.sc-ix-counter-pill-h .slot-container.sc-ix-counter-pill{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}';const n=class{constructor(r){i(this,r);this.variant="primary";this.outline=false;this.background=undefined;this.color=undefined;this.alignLeft=false}render(){return r(t,{class:{outline:this.outline,"align-left":this.alignLeft},style:this.variant==="custom"?{color:this.color,backgroundColor:this.background}:{},title:this.el.textContent},r("span",{class:"slot-container"},r("slot",null)))}get el(){return o(this)}};n.style=e;export{n as ix_counter_pill};
|
|
2
|
+
//# sourceMappingURL=p-aa4141e4.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["counterPillCss","CounterPill","render","h","Host","class","outline","this","alignLeft","style","variant","color","backgroundColor","background","title","el","textContent"],"sources":["./src/components/counter-pill/counter-pill.scss?tag=ix-counter-pill&encapsulation=scoped","./src/components/counter-pill/counter-pill.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 './../pill/pill.scss';\n@import 'common-variables';\n@import 'mixins/text-truncation';\n\n:host {\n .slot-container {\n @include ellipsis;\n }\n\n min-height: 1rem;\n max-height: 1rem;\n height: 1rem;\n font-size: $font-size-s;\n padding: 0 $tiny-space;\n\n min-width: 1rem;\n width: auto;\n\n padding: 0 4px;\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 } from '@stencil/core';\n\n@Component({\n tag: 'ix-counter-pill',\n styleUrl: 'counter-pill.scss',\n scoped: true,\n})\nexport class CounterPill {\n @Element() el: HTMLIxCounterPillElement;\n\n /**\n * Pill variant\n */\n @Prop({ reflect: true }) variant:\n | 'primary'\n | 'alarm'\n | 'critical'\n | 'warning'\n | 'info'\n | 'neutral'\n | 'success'\n | 'custom' = 'primary';\n\n /**\n * Show pill as outline\n */\n @Prop() outline = false;\n\n /**\n * Custom color for pill. Only working for `variant='custom'`\n */\n @Prop() background: string | undefined;\n\n /**\n * Custom font color for pill. Only working for `variant='custom'`\n */\n @Prop() color: string | undefined;\n\n /**\n * Align pill content left\n */\n @Prop() alignLeft = false;\n\n render() {\n return (\n <Host\n class={{\n outline: this.outline,\n 'align-left': this.alignLeft,\n }}\n style={\n this.variant === 'custom'\n ? {\n color: this.color,\n backgroundColor: this.background,\n }\n : {}\n }\n title={this.el.textContent}\n >\n <span class=\"slot-container\">\n <slot></slot>\n </span>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,mjR,MCgBVC,EAAW,M,sCAcP,U,aAKG,M,8DAeE,K,CAEpBC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLC,QAASC,KAAKD,QACd,aAAcC,KAAKC,WAErBC,MACEF,KAAKG,UAAY,SACb,CACEC,MAAOJ,KAAKI,MACZC,gBAAiBL,KAAKM,YAExB,GAENC,MAAOP,KAAKQ,GAAGC,aAEfb,EAAA,QAAME,MAAM,kBACVF,EAAA,c"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as i,H as r,g as n}from"./p-8fcd6f85.js";import{c as s,g as o,a as h}from"./p-37417714.js";import{r as a}from"./p-56ed024b.js";var c=s((function(t,e){(function(e){{t.exports=e()}})((function(){return function(){function t(e,i,r){function n(o,a){if(!i[o]){if(!e[o]){var c="function"==typeof h&&h;if(!a&&c)return c(o,!0);if(s)return s(o,!0);var l=new Error("Cannot find module '"+o+"'");throw l.code="MODULE_NOT_FOUND",l}var u=i[o]={exports:{}};e[o][0].call(u.exports,(function(t){var i=e[o][1][t];return n(i||t)}),u,u.exports,t,e,i,r)}return i[o].exports}for(var s="function"==typeof h&&h,o=0;o<r.length;o++)n(r[o]);return n}return t}()({1:[function(t,e,i){Object.defineProperty(i,"__esModule",{value:true});var r=function(){function t(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||false;r.configurable=true;if("value"in r)r.writable=true;Object.defineProperty(t,r.key,r)}}return function(e,i,r){if(i)t(e.prototype,i);if(r)t(e,r);return e}}();function n(t,e,i){if(e in t){Object.defineProperty(t,e,{value:i,enumerable:true,configurable:true,writable:true})}else{t[e]=i}return t}function s(t,e){if(!(t instanceof e)){throw new TypeError("Cannot call a class as a function")}}var o={width:"100%",height:"100%"};var h=function t(e){return Number(e)===Number(e)};var a="classList"in document.documentElement?function(t,e){t.classList.add(e)}:function(t,e){var i=t.getAttribute("class")||"";t.setAttribute("class",i+" "+e)};var c=function(){r(t,null,[{key:"create",value:function e(i,r){return new t(i,r)}},{key:"mergeStyle",value:function t(e,i){for(var r in i){if(e.style[r]!==i[r]){e.style[r]=i[r]}}}},{key:"getMaxBrowserHeight",value:function e(){var i=document.createElement("div");var r=document.createElement("div");t.mergeStyle(i,{position:"absolute",height:"1px",opacity:0});t.mergeStyle(r,{height:"1e7px"});i.appendChild(r);document.body.appendChild(i);var n=r.offsetHeight;document.body.removeChild(i);return n}}]);function t(e,i){var r=this;s(this,t);this._config={};this._lastRepaint=null;this._maxElementHeight=t.getMaxBrowserHeight();this.refresh(e,i);var n=this._config;var o=function t(){var e=r._getScrollPosition();var i=r._lastRepaint;r._renderAnimationFrame=window.requestAnimationFrame(t);if(e===i){return}var s=i?e-i:0;if(!i||s<0||s>r._averageHeight){var o=r._renderChunk();r._lastRepaint=e;if(o!==false&&typeof n.afterRender==="function"){n.afterRender()}}};o()}r(t,[{key:"destroy",value:function t(){window.cancelAnimationFrame(this._renderAnimationFrame)}},{key:"refresh",value:function e(i,r){var s;Object.assign(this._config,o,r);if(!i||i.nodeType!==1){throw new Error("HyperList requires a valid DOM Node container")}this._element=i;var a=this._config;var c=this._scroller||a.scroller||document.createElement(a.scrollerTagName||"tr");if(typeof a.useFragment!=="boolean"){this._config.useFragment=true}if(!a.generate){throw new Error("Missing required `generate` function")}if(!h(a.total)){throw new Error("Invalid required `total` value, expected number")}if(!Array.isArray(a.itemHeight)&&!h(a.itemHeight)){throw new Error("\n Invalid required `itemHeight` value, expected number or array\n ".trim())}else if(h(a.itemHeight)){this._itemHeights=Array(a.total).fill(a.itemHeight)}else{this._itemHeights=a.itemHeight}Object.keys(o).filter((function(t){return t in a})).forEach((function(t){var e=a[t];var i=h(e);if(e&&typeof e!=="string"&&typeof e!=="number"){var r="Invalid optional `"+t+"`, expected string or number";throw new Error(r)}else if(i){a[t]=e+"px"}}));var l=Boolean(a.horizontal);var u=a[l?"width":"height"];if(u){var d=h(u);var f=d?false:u.slice(-1)==="%";var v=d?u:parseInt(u.replace(/px|%/,""),10);var m=window[l?"innerWidth":"innerHeight"];if(f){this._containerSize=m*v/100}else{this._containerSize=h(u)?u:v}}var g=a.scrollContainer;var p=a.itemHeight*a.total;var x=this._maxElementHeight;if(p>x){console.warn(["HyperList: The maximum element height",x+"px has","been exceeded; please reduce your item height."].join(" "))}var b={width:""+a.width,height:g?p+"px":""+a.height,overflow:g?"none":"auto",position:"relative"};t.mergeStyle(i,b);if(g){t.mergeStyle(a.scrollContainer,{overflow:"auto"})}var w=(s={opacity:"0",position:"absolute"},n(s,l?"height":"width","1px"),n(s,l?"width":"height",p+"px"),s);t.mergeStyle(c,w);if(!this._scroller){i.appendChild(c)}var y=this._computeScrollPadding();this._scrollPaddingBottom=y.bottom;this._scrollPaddingTop=y.top;this._scroller=c;this._scrollHeight=this._computeScrollHeight();this._itemPositions=this._itemPositions||Array(a.total).fill(0);this._computePositions(0);this._renderChunk(this._lastRepaint!==null);if(typeof a.afterRender==="function"){a.afterRender()}}},{key:"_getRow",value:function e(i){var r=this._config;var s=r.generate(i);var o=s.height;if(o!==undefined&&h(o)){s=s.element;if(o!==this._itemHeights[i]){this._itemHeights[i]=o;this._computePositions(i);this._scrollHeight=this._computeScrollHeight(i)}}else{o=this._itemHeights[i]}if(!s||s.nodeType!==1){throw new Error("Generator did not return a DOM Node for index: "+i)}a(s,r.rowClassName||"vrow");var c=this._itemPositions[i]+this._scrollPaddingTop;t.mergeStyle(s,n({position:"absolute"},r.horizontal?"left":"top",c+"px"));return s}},{key:"_getScrollPosition",value:function t(){var e=this._config;if(typeof e.overrideScrollPosition==="function"){return e.overrideScrollPosition()}return this._element[e.horizontal?"scrollLeft":"scrollTop"]}},{key:"_renderChunk",value:function t(e){var i=this._config;var r=this._element;var n=this._getScrollPosition();var s=i.total;var o=i.reverse?this._getReverseFrom(n):this._getFrom(n)-1;if(o<0||o-this._screenItemsLen<0){o=0}if(!e&&this._lastFrom===o){return false}this._lastFrom=o;var h=o+this._cachedItemsLen;if(h>s||h+this._cachedItemsLen>s){h=s}var a=i.useFragment?document.createDocumentFragment():[];var c=this._scroller;a[i.useFragment?"appendChild":"push"](c);for(var l=o;l<h;l++){var u=this._getRow(l);a[i.useFragment?"appendChild":"push"](u)}if(i.applyPatch){return i.applyPatch(r,a)}r.innerHTML="";r.appendChild(a)}},{key:"_computePositions",value:function t(){var e=arguments.length>0&&arguments[0]!==undefined?arguments[0]:1;var i=this._config;var r=i.total;var n=i.reverse;if(e<1&&!n){e=1}for(var s=e;s<r;s++){if(n){if(s===0){this._itemPositions[0]=this._scrollHeight-this._itemHeights[0]}else{this._itemPositions[s]=this._itemPositions[s-1]-this._itemHeights[s]}}else{this._itemPositions[s]=this._itemHeights[s-1]+this._itemPositions[s-1]}}}},{key:"_computeScrollHeight",value:function e(){var i,r=this;var s=this._config;var o=Boolean(s.horizontal);var h=s.total;var a=this._itemHeights.reduce((function(t,e){return t+e}),0)+this._scrollPaddingBottom+this._scrollPaddingTop;t.mergeStyle(this._scroller,(i={opacity:0,position:"absolute",top:"0px"},n(i,o?"height":"width","1px"),n(i,o?"width":"height",a+"px"),i));var c=this._itemHeights.slice(0).sort((function(t,e){return t-e}));var l=Math.floor(h/2);var u=h%2===0?(c[l]+c[l-1])/2:c[l];var d=o?"clientWidth":"clientHeight";var f=s.scrollContainer?s.scrollContainer:this._element;var v=f[d]?f[d]:this._containerSize;this._screenItemsLen=Math.ceil(v/u);this._containerSize=v;this._cachedItemsLen=Math.max(this._cachedItemsLen||0,this._screenItemsLen*3);this._averageHeight=u;if(s.reverse){window.requestAnimationFrame((function(){if(o){r._element.scrollLeft=a}else{r._element.scrollTop=a}}))}return a}},{key:"_computeScrollPadding",value:function t(){var e=this._config;var i=Boolean(e.horizontal);var r=e.reverse;var n=window.getComputedStyle(this._element);var s=function t(e){var i=n.getPropertyValue("padding-"+e);return parseInt(i,10)||0};if(i&&r){return{bottom:s("left"),top:s("right")}}else if(i){return{bottom:s("right"),top:s("left")}}else if(r){return{bottom:s("top"),top:s("bottom")}}else{return{bottom:s("bottom"),top:s("top")}}}},{key:"_getFrom",value:function t(e){var i=0;while(this._itemPositions[i]<e){i++}return i}},{key:"_getReverseFrom",value:function t(e){var i=this._config.total-1;while(i>0&&this._itemPositions[i]<e+this._containerSize){i--}return i}}]);return t}();i.default=c;e.exports=i["default"]},{}]},{},[1])(1)}))}));const l=o(c);const u=".sc-ix-tree-h{display:block}";const d=class{constructor(i){t(this,i);this.contextChange=e(this,"contextChange",7);this.nodeToggled=e(this,"nodeToggled",7);this.nodeClicked=e(this,"nodeClicked",7);this.nodeRemoved=e(this,"nodeRemoved",7);this.toggleListener=new Map;this.itemClickListener=new Map;this.updates=new Map;this.hasFirstRender=false;this.root=undefined;this.model=undefined;this.renderItem=undefined;this.context={}}getVirtualizerOptions(){const t=this.buildTreeList(this.model[this.root]);let e=(e,i,r)=>{if(e.hasChildren&&!this.toggleListener.has(i)){const n=i=>{i.preventDefault();i.stopPropagation();const n=this.getContext(t[r].id);n.isExpanded=!n.isExpanded;this.nodeToggled.emit({id:e.id,isExpaned:n.isExpanded});this.setContext(e.id,n)};i.addEventListener("toggle",n);this.toggleListener.set(i,n)}};return{itemHeight:32,total:t.length,generate:i=>{const r=t[i];const n=this.host.querySelector(`[data-tree-node-id="${r.id}"]`);const s=this.getContext(r.id);if(n){n.hasChildren=r.hasChildren;n.context=Object.assign({},s);e(r,n,i);if(this.updates.has(r.id)){const t=this.updates.get(r.id);t(r,Object.assign({},this.context))}return n}const o=t=>{this.updates.set(r.id,t)};let h=null;if(this.renderItem){h=this.renderItem(i,r,t,Object.assign({},this.context),o)}if(h===null){h=a(r,s,o)}const c=h;c.setAttribute("data-tree-node-id",r.id);c.style.paddingLeft=r.level+"rem";c.style.paddingRight="1rem";if(!this.itemClickListener.has(c)){const t=t=>{t.preventDefault();t.stopPropagation();Object.values(this.context).forEach((t=>t.isSelected=false));const e=this.getContext(r.id);e.isSelected=true;this.setContext(r.id,e);this.nodeClicked.emit(r.id)};c.addEventListener("itemClick",t);this.itemClickListener.set(c,t)}e(r,c,i);return c}}}setContext(t,e){this.context=Object.assign(Object.assign({},this.context),{[t]:e});this.contextChange.emit(this.context)}getContext(t){if(!this.context){return{isExpanded:false,isSelected:false}}if(!this.context[t]){this.context[t]={isExpanded:false,isSelected:false}}return this.context[t]}buildTreeList(t,e=0){const i=[];if(t===null||t===void 0?void 0:t.hasChildren){const r=e+1;t.children.forEach((t=>{const n=this.model[t];const s=this.getContext(t);i.push(Object.assign(Object.assign({},n),{level:e}));if(n.hasChildren&&s.isExpanded){i.push(...this.buildTreeList(n,r))}}))}return i}componentDidLoad(){this.initList();this.observer=new MutationObserver((t=>{let e=[];t.forEach((t=>{e=[...e,...Array.from(t.removedNodes)];t.addedNodes.forEach((t=>{const i=e.indexOf(t);if(i>=0){e.splice(i,1)}}))}));this.nodeRemoved.emit(e)}));this.observer.observe(this.host,{childList:true})}componentWillRender(){this.hasFirstRender=true;if(this.isListInitialized()){this.refreshList()}else{this.initList()}}disconnectedCallback(){this.hyperlist.destroy();this.observer.disconnect()}modelChange(){if(this.hasFirstRender&&!this.isListInitialized()){this.initList()}}isListInitialized(){var t;const e=(t=this.hyperlist)===null||t===void 0?void 0:t._itemPositions;return e!==undefined&&e.length&&!(e===null||e===void 0?void 0:e.some((t=>t===undefined||Number.isNaN(t))))}refreshList(){if(this.hyperlist){this.hyperlist.refresh(this.host,this.getVirtualizerOptions())}}initList(){var t;(t=this.hyperlist)===null||t===void 0?void 0:t.destroy();const e=this.getVirtualizerOptions();this.hyperlist=new l(this.host,e)}render(){return i(r,null,i("slot",null))}get host(){return n(this)}static get watchers(){return{model:["modelChange"]}}};d.style=u;const f=".sc-ix-tree-item-h{display:flex;align-items:center;height:32px;width:100%;cursor:pointer}.sc-ix-tree-item-h:not(.disabled):not(:disabled):not(.selected).hover,.sc-ix-tree-item-h:not(.disabled):not(:disabled):not(.selected):hover{background-color:var(--theme-tree-item--background--hover)}.sc-ix-tree-item-h:not(.disabled):not(:disabled):not(.selected).active,.sc-ix-tree-item-h:not(.disabled):not(:disabled):not(.selected):active{background-color:var(--theme-tree-item--background--active)}.selected.sc-ix-tree-item-h{background-color:var(--theme-tree-item--background--selected)}.selected.hover.sc-ix-tree-item-h,.selected.sc-ix-tree-item-h:hover{background-color:var(--theme-tree-item--background--selected-hover)}.selected.active.sc-ix-tree-item-h,.selected.sc-ix-tree-item-h:active{background-color:var(--theme-tree-item--background--selected-active)}.sc-ix-tree-item-h .tree-node-container.sc-ix-tree-item{display:flex;align-items:center;height:2rem;flex-grow:1;align-items:center}.sc-ix-tree-item-h .icon-toggle-container.sc-ix-tree-item{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem}.sc-ix-tree-item-h .icon-toggle-container.sc-ix-tree-item ix-icon.sc-ix-tree-item{transition:transform 150ms ease-in-out}.sc-ix-tree-item-h .icon-toggle-container.sc-ix-tree-item ix-icon.icon-toggle-down.sc-ix-tree-item{transform:rotate(90deg)}";const v=class{constructor(i){t(this,i);this.toggle=e(this,"toggle",7);this.itemClick=e(this,"itemClick",7);this.text=undefined;this.hasChildren=undefined;this.context=undefined}render(){var t,e,n;return i(r,{class:{selected:(t=this.context)===null||t===void 0?void 0:t.isSelected}},i("div",{class:"icon-toggle-container",onClick:t=>{t.preventDefault();this.toggle.emit()}},this.hasChildren?i("ix-icon",{name:"chevron-right",size:"16",class:{["icon-toggle-down"]:(e=this.context)===null||e===void 0?void 0:e.isExpanded},color:`color-${((n=this.context)===null||n===void 0?void 0:n.isExpanded)?"primary":"std-text"}`}):null),i("div",{class:"tree-node-container",onClick:()=>{this.itemClick.emit()}},this.text,i("slot",null)))}};v.style=f;export{d as ix_tree,v as ix_tree_item};
|
|
2
|
+
//# sourceMappingURL=p-afd1f351.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["f","module","exports","r","e","n","t","o","i","c","require","u","a","Error","code","p","call","length","_dereq_","Object","defineProperty","value","_createClass","defineProperties","target","props","descriptor","enumerable","configurable","writable","key","Constructor","protoProps","staticProps","prototype","_defineProperty","obj","_classCallCheck","instance","TypeError","defaultConfig","width","height","isNumber","input","Number","addClass","document","documentElement","element","className","classList","add","oldClass","getAttribute","setAttribute","HyperList","create","userProvidedConfig","mergeStyle","style","getMaxBrowserHeight","wrapper","createElement","fixture","position","opacity","appendChild","body","maxElementHeight","offsetHeight","removeChild","_this","this","_config","_lastRepaint","_maxElementHeight","refresh","config","render","scrollTop","_getScrollPosition","lastRepaint","_renderAnimationFrame","window","requestAnimationFrame","diff","_averageHeight","rendered","_renderChunk","afterRender","destroy","cancelAnimationFrame","_scrollerStyle","assign","nodeType","_element","scroller","_scroller","scrollerTagName","useFragment","generate","total","Array","isArray","itemHeight","trim","_itemHeights","fill","keys","filter","prop","forEach","isValueNumber","msg","isHoriz","Boolean","horizontal","isValuePercent","slice","numberValue","parseInt","replace","innerSize","_containerSize","scrollContainer","scrollerHeight","console","warn","join","elementStyle","overflow","scrollerStyle","padding","_computeScrollPadding","_scrollPaddingBottom","bottom","_scrollPaddingTop","top","_scrollHeight","_computeScrollHeight","_itemPositions","_computePositions","_getRow","item","undefined","rowClassName","overrideScrollPosition","force","from","reverse","_getReverseFrom","_getFrom","_screenItemsLen","_lastFrom","to","_cachedItemsLen","fragment","createDocumentFragment","row","applyPatch","innerHTML","arguments","_HyperList$mergeStyle2","_this2","scrollHeight","reduce","b","sortedItemHeights","sort","middle","Math","floor","averageHeight","clientProp","containerHeight","ceil","max","scrollLeft","isReverse","styles","getComputedStyle","location","cssValue","getPropertyValue","default","treeCss","Tree","toggleListener","Map","itemClickListener","updates","hasFirstRender","getVirtualizerOptions","list","buildTreeList","model","root","setToggleListener","el","index","hasChildren","has","toggleCallback","preventDefault","stopPropagation","context","getContext","id","isExpanded","nodeToggled","emit","isExpaned","setContext","addEventListener","set","renderedTreeItem","host","querySelector","doUpdate","get","update","callback","innerElement","renderItem","renderDefaultItem","paddingLeft","level","paddingRight","itemClickCallback","values","isSelected","nodeClicked","contextChange","itemList","newLevel","children","push","componentDidLoad","initList","observer","MutationObserver","records","removed","record","removedNodes","addedNodes","an","indexOf","splice","nodeRemoved","observe","childList","componentWillRender","isListInitialized","refreshList","disconnectedCallback","hyperlist","disconnect","modelChange","itemPositions","_a","some","isNaN","Hyperlist","h","Host","treeItemCss","TreeItem","class","selected","onClick","toggle","name","size","_b","color","_c","itemClick","text"],"sources":["../../node_modules/hyperlist/dist/hyperlist.js","./src/components/tree/tree.css?tag=ix-tree&encapsulation=scoped","./src/components/tree/tree.tsx","./src/components/tree-item/tree-item.scss?tag=ix-tree-item&encapsulation=scoped","./src/components/tree-item/tree-item.tsx"],"sourcesContent":["(function(f){if(typeof exports===\"object\"&&typeof module!==\"undefined\"){module.exports=f()}else if(typeof define===\"function\"&&define.amd){define([],f)}else{var g;if(typeof window!==\"undefined\"){g=window}else if(typeof global!==\"undefined\"){g=global}else if(typeof self!==\"undefined\"){g=self}else{g=this}g.HyperList = f()}})(function(){var define,module,exports;return (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c=\"function\"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error(\"Cannot find module '\"+i+\"'\");throw a.code=\"MODULE_NOT_FOUND\",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u=\"function\"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(_dereq_,module,exports){\n'use strict';\n\n// Default configuration.\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nvar defaultConfig = {\n width: '100%',\n height: '100%'\n\n // Check for valid number.\n};var isNumber = function isNumber(input) {\n return Number(input) === Number(input);\n};\n\n// Add a class to an element.\nvar addClass = 'classList' in document.documentElement ? function (element, className) {\n element.classList.add(className);\n} : function (element, className) {\n var oldClass = element.getAttribute('class') || '';\n element.setAttribute('class', oldClass + ' ' + className);\n};\n\n/**\n * Creates a HyperList instance that virtually scrolls very large amounts of\n * data effortlessly.\n */\n\nvar HyperList = function () {\n _createClass(HyperList, null, [{\n key: 'create',\n value: function create(element, userProvidedConfig) {\n return new HyperList(element, userProvidedConfig);\n }\n\n /**\n * Merge given css style on an element\n * @param {DOMElement} element\n * @param {Object} style\n */\n\n }, {\n key: 'mergeStyle',\n value: function mergeStyle(element, style) {\n for (var i in style) {\n if (element.style[i] !== style[i]) {\n element.style[i] = style[i];\n }\n }\n }\n }, {\n key: 'getMaxBrowserHeight',\n value: function getMaxBrowserHeight() {\n // Create two elements, the wrapper is `1px` tall and is transparent and\n // positioned at the top of the page. Inside that is an element that gets\n // set to 1 billion pixels. Then reads the max height the browser can\n // calculate.\n var wrapper = document.createElement('div');\n var fixture = document.createElement('div');\n\n // As said above, these values get set to put the fixture elements into the\n // right visual state.\n HyperList.mergeStyle(wrapper, { position: 'absolute', height: '1px', opacity: 0 });\n HyperList.mergeStyle(fixture, { height: '1e7px' });\n\n // Add the fixture into the wrapper element.\n wrapper.appendChild(fixture);\n\n // Apply to the page, the values won't kick in unless this is attached.\n document.body.appendChild(wrapper);\n\n // Get the maximum element height in pixels.\n var maxElementHeight = fixture.offsetHeight;\n\n // Remove the element immediately after reading the value.\n document.body.removeChild(wrapper);\n\n return maxElementHeight;\n }\n }]);\n\n function HyperList(element, userProvidedConfig) {\n var _this = this;\n\n _classCallCheck(this, HyperList);\n\n this._config = {};\n this._lastRepaint = null;\n this._maxElementHeight = HyperList.getMaxBrowserHeight();\n\n this.refresh(element, userProvidedConfig);\n\n var config = this._config;\n\n // Create internal render loop.\n var render = function render() {\n var scrollTop = _this._getScrollPosition();\n var lastRepaint = _this._lastRepaint;\n\n _this._renderAnimationFrame = window.requestAnimationFrame(render);\n\n if (scrollTop === lastRepaint) {\n return;\n }\n\n var diff = lastRepaint ? scrollTop - lastRepaint : 0;\n if (!lastRepaint || diff < 0 || diff > _this._averageHeight) {\n var rendered = _this._renderChunk();\n\n _this._lastRepaint = scrollTop;\n\n if (rendered !== false && typeof config.afterRender === 'function') {\n config.afterRender();\n }\n }\n };\n\n render();\n }\n\n _createClass(HyperList, [{\n key: 'destroy',\n value: function destroy() {\n window.cancelAnimationFrame(this._renderAnimationFrame);\n }\n }, {\n key: 'refresh',\n value: function refresh(element, userProvidedConfig) {\n var _scrollerStyle;\n\n Object.assign(this._config, defaultConfig, userProvidedConfig);\n\n if (!element || element.nodeType !== 1) {\n throw new Error('HyperList requires a valid DOM Node container');\n }\n\n this._element = element;\n\n var config = this._config;\n\n var scroller = this._scroller || config.scroller || document.createElement(config.scrollerTagName || 'tr');\n\n // Default configuration option `useFragment` to `true`.\n if (typeof config.useFragment !== 'boolean') {\n this._config.useFragment = true;\n }\n\n if (!config.generate) {\n throw new Error('Missing required `generate` function');\n }\n\n if (!isNumber(config.total)) {\n throw new Error('Invalid required `total` value, expected number');\n }\n\n if (!Array.isArray(config.itemHeight) && !isNumber(config.itemHeight)) {\n throw new Error('\\n Invalid required `itemHeight` value, expected number or array\\n '.trim());\n } else if (isNumber(config.itemHeight)) {\n this._itemHeights = Array(config.total).fill(config.itemHeight);\n } else {\n this._itemHeights = config.itemHeight;\n }\n\n // Width and height should be coerced to string representations. Either in\n // `%` or `px`.\n Object.keys(defaultConfig).filter(function (prop) {\n return prop in config;\n }).forEach(function (prop) {\n var value = config[prop];\n var isValueNumber = isNumber(value);\n\n if (value && typeof value !== 'string' && typeof value !== 'number') {\n var msg = 'Invalid optional `' + prop + '`, expected string or number';\n throw new Error(msg);\n } else if (isValueNumber) {\n config[prop] = value + 'px';\n }\n });\n\n var isHoriz = Boolean(config.horizontal);\n var value = config[isHoriz ? 'width' : 'height'];\n\n if (value) {\n var isValueNumber = isNumber(value);\n var isValuePercent = isValueNumber ? false : value.slice(-1) === '%';\n // Compute the containerHeight as number\n var numberValue = isValueNumber ? value : parseInt(value.replace(/px|%/, ''), 10);\n var innerSize = window[isHoriz ? 'innerWidth' : 'innerHeight'];\n\n if (isValuePercent) {\n this._containerSize = innerSize * numberValue / 100;\n } else {\n this._containerSize = isNumber(value) ? value : numberValue;\n }\n }\n\n var scrollContainer = config.scrollContainer;\n var scrollerHeight = config.itemHeight * config.total;\n var maxElementHeight = this._maxElementHeight;\n\n if (scrollerHeight > maxElementHeight) {\n console.warn(['HyperList: The maximum element height', maxElementHeight + 'px has', 'been exceeded; please reduce your item height.'].join(' '));\n }\n\n // Decorate the container element with styles that will match\n // the user supplied configuration.\n var elementStyle = {\n width: '' + config.width,\n height: scrollContainer ? scrollerHeight + 'px' : '' + config.height,\n overflow: scrollContainer ? 'none' : 'auto',\n position: 'relative'\n };\n\n HyperList.mergeStyle(element, elementStyle);\n\n if (scrollContainer) {\n HyperList.mergeStyle(config.scrollContainer, { overflow: 'auto' });\n }\n\n var scrollerStyle = (_scrollerStyle = {\n opacity: '0',\n position: 'absolute'\n }, _defineProperty(_scrollerStyle, isHoriz ? 'height' : 'width', '1px'), _defineProperty(_scrollerStyle, isHoriz ? 'width' : 'height', scrollerHeight + 'px'), _scrollerStyle);\n\n HyperList.mergeStyle(scroller, scrollerStyle);\n\n // Only append the scroller element once.\n if (!this._scroller) {\n element.appendChild(scroller);\n }\n\n var padding = this._computeScrollPadding();\n this._scrollPaddingBottom = padding.bottom;\n this._scrollPaddingTop = padding.top;\n\n // Set the scroller instance.\n this._scroller = scroller;\n this._scrollHeight = this._computeScrollHeight();\n\n // Reuse the item positions if refreshed, otherwise set to empty array.\n this._itemPositions = this._itemPositions || Array(config.total).fill(0);\n\n // Each index in the array should represent the position in the DOM.\n this._computePositions(0);\n\n // Render after refreshing. Force render if we're calling refresh manually.\n this._renderChunk(this._lastRepaint !== null);\n\n if (typeof config.afterRender === 'function') {\n config.afterRender();\n }\n }\n }, {\n key: '_getRow',\n value: function _getRow(i) {\n var config = this._config;\n var item = config.generate(i);\n var height = item.height;\n\n if (height !== undefined && isNumber(height)) {\n item = item.element;\n\n // The height isn't the same as predicted, compute positions again\n if (height !== this._itemHeights[i]) {\n this._itemHeights[i] = height;\n this._computePositions(i);\n this._scrollHeight = this._computeScrollHeight(i);\n }\n } else {\n height = this._itemHeights[i];\n }\n\n if (!item || item.nodeType !== 1) {\n throw new Error('Generator did not return a DOM Node for index: ' + i);\n }\n\n addClass(item, config.rowClassName || 'vrow');\n\n var top = this._itemPositions[i] + this._scrollPaddingTop;\n\n HyperList.mergeStyle(item, _defineProperty({\n position: 'absolute'\n }, config.horizontal ? 'left' : 'top', top + 'px'));\n\n return item;\n }\n }, {\n key: '_getScrollPosition',\n value: function _getScrollPosition() {\n var config = this._config;\n\n if (typeof config.overrideScrollPosition === 'function') {\n return config.overrideScrollPosition();\n }\n\n return this._element[config.horizontal ? 'scrollLeft' : 'scrollTop'];\n }\n }, {\n key: '_renderChunk',\n value: function _renderChunk(force) {\n var config = this._config;\n var element = this._element;\n var scrollTop = this._getScrollPosition();\n var total = config.total;\n\n var from = config.reverse ? this._getReverseFrom(scrollTop) : this._getFrom(scrollTop) - 1;\n\n if (from < 0 || from - this._screenItemsLen < 0) {\n from = 0;\n }\n\n if (!force && this._lastFrom === from) {\n return false;\n }\n\n this._lastFrom = from;\n\n var to = from + this._cachedItemsLen;\n\n if (to > total || to + this._cachedItemsLen > total) {\n to = total;\n }\n\n // Append all the new rows in a document fragment that we will later append\n // to the parent node\n var fragment = config.useFragment ? document.createDocumentFragment() : []\n // Sometimes you'll pass fake elements to this tool and Fragments require\n // real elements.\n\n\n // The element that forces the container to scroll.\n ;var scroller = this._scroller;\n\n // Keep the scroller in the list of children.\n fragment[config.useFragment ? 'appendChild' : 'push'](scroller);\n\n for (var i = from; i < to; i++) {\n var row = this._getRow(i);\n\n fragment[config.useFragment ? 'appendChild' : 'push'](row);\n }\n\n if (config.applyPatch) {\n return config.applyPatch(element, fragment);\n }\n\n element.innerHTML = '';\n element.appendChild(fragment);\n }\n }, {\n key: '_computePositions',\n value: function _computePositions() {\n var from = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;\n\n var config = this._config;\n var total = config.total;\n var reverse = config.reverse;\n\n if (from < 1 && !reverse) {\n from = 1;\n }\n\n for (var i = from; i < total; i++) {\n if (reverse) {\n if (i === 0) {\n this._itemPositions[0] = this._scrollHeight - this._itemHeights[0];\n } else {\n this._itemPositions[i] = this._itemPositions[i - 1] - this._itemHeights[i];\n }\n } else {\n this._itemPositions[i] = this._itemHeights[i - 1] + this._itemPositions[i - 1];\n }\n }\n }\n }, {\n key: '_computeScrollHeight',\n value: function _computeScrollHeight() {\n var _HyperList$mergeStyle2,\n _this2 = this;\n\n var config = this._config;\n var isHoriz = Boolean(config.horizontal);\n var total = config.total;\n var scrollHeight = this._itemHeights.reduce(function (a, b) {\n return a + b;\n }, 0) + this._scrollPaddingBottom + this._scrollPaddingTop;\n\n HyperList.mergeStyle(this._scroller, (_HyperList$mergeStyle2 = {\n opacity: 0,\n position: 'absolute',\n top: '0px'\n }, _defineProperty(_HyperList$mergeStyle2, isHoriz ? 'height' : 'width', '1px'), _defineProperty(_HyperList$mergeStyle2, isHoriz ? 'width' : 'height', scrollHeight + 'px'), _HyperList$mergeStyle2));\n\n // Calculate the height median\n var sortedItemHeights = this._itemHeights.slice(0).sort(function (a, b) {\n return a - b;\n });\n var middle = Math.floor(total / 2);\n var averageHeight = total % 2 === 0 ? (sortedItemHeights[middle] + sortedItemHeights[middle - 1]) / 2 : sortedItemHeights[middle];\n\n var clientProp = isHoriz ? 'clientWidth' : 'clientHeight';\n var element = config.scrollContainer ? config.scrollContainer : this._element;\n var containerHeight = element[clientProp] ? element[clientProp] : this._containerSize;\n this._screenItemsLen = Math.ceil(containerHeight / averageHeight);\n this._containerSize = containerHeight;\n\n // Cache 3 times the number of items that fit in the container viewport.\n this._cachedItemsLen = Math.max(this._cachedItemsLen || 0, this._screenItemsLen * 3);\n this._averageHeight = averageHeight;\n\n if (config.reverse) {\n window.requestAnimationFrame(function () {\n if (isHoriz) {\n _this2._element.scrollLeft = scrollHeight;\n } else {\n _this2._element.scrollTop = scrollHeight;\n }\n });\n }\n\n return scrollHeight;\n }\n }, {\n key: '_computeScrollPadding',\n value: function _computeScrollPadding() {\n var config = this._config;\n var isHoriz = Boolean(config.horizontal);\n var isReverse = config.reverse;\n var styles = window.getComputedStyle(this._element);\n\n var padding = function padding(location) {\n var cssValue = styles.getPropertyValue('padding-' + location);\n return parseInt(cssValue, 10) || 0;\n };\n\n if (isHoriz && isReverse) {\n return {\n bottom: padding('left'),\n top: padding('right')\n };\n } else if (isHoriz) {\n return {\n bottom: padding('right'),\n top: padding('left')\n };\n } else if (isReverse) {\n return {\n bottom: padding('top'),\n top: padding('bottom')\n };\n } else {\n return {\n bottom: padding('bottom'),\n top: padding('top')\n };\n }\n }\n }, {\n key: '_getFrom',\n value: function _getFrom(scrollTop) {\n var i = 0;\n\n while (this._itemPositions[i] < scrollTop) {\n i++;\n }\n\n return i;\n }\n }, {\n key: '_getReverseFrom',\n value: function _getReverseFrom(scrollTop) {\n var i = this._config.total - 1;\n\n while (i > 0 && this._itemPositions[i] < scrollTop + this._containerSize) {\n i--;\n }\n\n return i;\n }\n }]);\n\n return HyperList;\n}();\n\nexports.default = HyperList;\nmodule.exports = exports['default'];\n\n},{}]},{},[1])(1)\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 Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport Hyperlist from 'hyperlist';\nimport { renderDefaultItem } from '../tree-item/default-tree-item';\nimport {\n TreeContext,\n TreeItem,\n TreeItemContext,\n TreeItemVisual,\n TreeModel,\n UpdateCallback,\n} from './tree-model';\n\n@Component({\n tag: 'ix-tree',\n styleUrl: 'tree.css',\n scoped: true,\n})\nexport class Tree {\n @Element() host!: HTMLIxTreeElement;\n\n /**\n * Initial root element will not be rendered\n */\n @Prop() root: string;\n\n /**\n * Tree model\n */\n @Prop() model: TreeModel<any>;\n\n /**\n * Render function of tree items\n */\n @Prop() renderItem: <T = any>(\n index: number,\n data: T,\n dataList: Array<T>,\n context: TreeContext,\n update: (callback: UpdateCallback) => void\n ) => HTMLElement;\n\n /**\n * Selection and collapsed state management\n */\n @Prop({ mutable: true }) context: TreeContext = {};\n\n /**\n * Context changed\n */\n @Event() contextChange: EventEmitter<TreeContext>;\n\n /**\n * Node toggled event\n * @since 1.5.0\n */\n @Event() nodeToggled: EventEmitter<{ id: string; isExpaned: boolean }>;\n\n /**\n * Node clicked event\n * @since 1.5.0\n */\n @Event() nodeClicked: EventEmitter<string>;\n\n /**\n * Emits removed nodes\n */\n @Event() nodeRemoved: EventEmitter<any>;\n\n private hyperlist: Hyperlist;\n\n private toggleListener = new Map<HTMLElement, Function>();\n private itemClickListener = new Map<HTMLElement, Function>();\n private updates = new Map<string, UpdateCallback>();\n\n private observer: MutationObserver;\n\n private hasFirstRender = false;\n\n private getVirtualizerOptions() {\n const list = this.buildTreeList(this.model[this.root]);\n\n let setToggleListener = (\n item: TreeItemVisual<any>,\n el: HTMLElement,\n index: number\n ) => {\n if (item.hasChildren && !this.toggleListener.has(el)) {\n const toggleCallback = (e: Event) => {\n e.preventDefault();\n e.stopPropagation();\n const context = this.getContext(list[index].id);\n context.isExpanded = !context.isExpanded;\n this.nodeToggled.emit({ id: item.id, isExpaned: context.isExpanded });\n this.setContext(item.id, context);\n };\n el.addEventListener('toggle', toggleCallback);\n this.toggleListener.set(el, toggleCallback);\n }\n };\n\n return {\n itemHeight: 32,\n total: list.length,\n generate: (index: number) => {\n const item = list[index];\n const renderedTreeItem = this.host.querySelector(\n `[data-tree-node-id=\"${item.id}\"]`\n ) as HTMLIxTreeItemElement;\n\n const context = this.getContext(item.id);\n\n if (renderedTreeItem) {\n renderedTreeItem.hasChildren = item.hasChildren;\n renderedTreeItem.context = { ...context };\n\n setToggleListener(item, renderedTreeItem, index);\n\n if (this.updates.has(item.id)) {\n const doUpdate = this.updates.get(item.id);\n doUpdate(item, { ...this.context });\n }\n\n return renderedTreeItem;\n }\n\n const update = (callback: UpdateCallback) => {\n this.updates.set(item.id, callback);\n };\n\n let innerElement: HTMLElement | null = null;\n if (this.renderItem) {\n innerElement = this.renderItem(\n index,\n item,\n list,\n { ...this.context },\n update\n );\n }\n\n if (innerElement === null) {\n innerElement = renderDefaultItem(item, context, update);\n }\n\n const el = innerElement;\n el.setAttribute('data-tree-node-id', item.id);\n el.style.paddingLeft = item.level + 'rem';\n el.style.paddingRight = '1rem';\n\n if (!this.itemClickListener.has(el)) {\n const itemClickCallback = (e: Event) => {\n e.preventDefault();\n e.stopPropagation();\n Object.values(this.context).forEach((c) => (c.isSelected = false));\n const context = this.getContext(item.id);\n context.isSelected = true;\n this.setContext(item.id, context);\n this.nodeClicked.emit(item.id);\n };\n el.addEventListener('itemClick', itemClickCallback);\n this.itemClickListener.set(el, itemClickCallback);\n }\n\n setToggleListener(item, el, index);\n\n return el;\n },\n };\n }\n\n private setContext(id: string, context: TreeItemContext) {\n this.context = {\n ...this.context,\n [id]: context,\n };\n\n this.contextChange.emit(this.context);\n }\n\n private getContext(id: string): TreeItemContext {\n if (!this.context) {\n return {\n isExpanded: false,\n isSelected: false,\n };\n }\n if (!this.context[id]) {\n this.context[id] = {\n isExpanded: false,\n isSelected: false,\n };\n }\n return this.context[id];\n }\n\n private buildTreeList(\n root: TreeItem<any>,\n level: number = 0\n ): TreeItemVisual<any>[] {\n const itemList: TreeItemVisual<any>[] = [];\n\n if (root?.hasChildren) {\n const newLevel = level + 1;\n root.children.forEach((id: string) => {\n const item = this.model[id];\n const context = this.getContext(id);\n itemList.push({ ...item, level });\n if (item.hasChildren && context.isExpanded) {\n itemList.push(...this.buildTreeList(item, newLevel));\n }\n });\n }\n\n return itemList;\n }\n\n componentDidLoad() {\n this.initList();\n\n this.observer = new MutationObserver((records) => {\n let removed = [];\n\n records.forEach((record) => {\n removed = [...removed, ...Array.from(record.removedNodes)];\n\n record.addedNodes.forEach((an) => {\n const index = removed.indexOf(an);\n if (index >= 0) {\n removed.splice(index, 1);\n }\n });\n });\n\n this.nodeRemoved.emit(removed);\n });\n\n this.observer.observe(this.host, {\n childList: true,\n });\n }\n\n componentWillRender() {\n this.hasFirstRender = true;\n\n if (this.isListInitialized()) {\n this.refreshList();\n } else {\n this.initList();\n }\n }\n\n disconnectedCallback() {\n this.hyperlist.destroy();\n this.observer.disconnect();\n }\n\n @Watch('model')\n modelChange() {\n if (this.hasFirstRender && !this.isListInitialized()) {\n this.initList();\n }\n }\n\n private isListInitialized() {\n const itemPositions = this.hyperlist?._itemPositions;\n\n return (\n itemPositions !== undefined &&\n itemPositions.length &&\n !itemPositions?.some(\n (item: number) => item === undefined || Number.isNaN(item)\n )\n );\n }\n\n private refreshList() {\n if (this.hyperlist) {\n this.hyperlist.refresh(this.host, this.getVirtualizerOptions());\n }\n }\n\n private initList() {\n this.hyperlist?.destroy();\n const config = this.getVirtualizerOptions();\n this.hyperlist = new Hyperlist(this.host, config);\n }\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 'mixins/hover';\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n display: flex;\n align-items: center;\n\n height: 32px;\n width: 100%;\n\n cursor: pointer;\n\n &:not(.disabled):not(:disabled):not(.selected) {\n &.hover,\n &:hover {\n background-color: var(--theme-tree-item--background--hover);\n }\n\n &.active,\n &:active {\n background-color: var(--theme-tree-item--background--active);\n }\n }\n\n &.selected {\n background-color: var(--theme-tree-item--background--selected);\n\n &.hover,\n &:hover {\n background-color: var(--theme-tree-item--background--selected-hover);\n }\n\n &.active,\n &:active {\n background-color: var(--theme-tree-item--background--selected-active);\n }\n }\n\n .tree-node-container {\n display: flex;\n align-items: center;\n height: $x-large-space;\n flex-grow: 1;\n align-items: center;\n }\n\n .icon-toggle-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n\n ix-icon {\n transition: transform $default-time ease-in-out;\n\n &.icon-toggle-down {\n transform: rotate(90deg);\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, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { TreeItemContext } from '../tree/tree-model';\n\n@Component({\n tag: 'ix-tree-item',\n styleUrl: 'tree-item.scss',\n scoped: true,\n})\nexport class TreeItem {\n /**\n * Text\n */\n @Prop() text: string;\n\n /**\n * Has tree item children\n */\n @Prop() hasChildren: boolean;\n\n /**\n * Context\n */\n @Prop() context: TreeItemContext;\n\n /**\n * Expand/Collapsed toggled\n */\n @Event() toggle: EventEmitter<void>;\n\n /**\n * Clicked\n */\n @Event() itemClick: EventEmitter<void>;\n\n render() {\n return (\n <Host\n class={{\n selected: this.context?.isSelected,\n }}\n >\n <div\n class=\"icon-toggle-container\"\n onClick={(e) => {\n e.preventDefault();\n this.toggle.emit();\n }}\n >\n {this.hasChildren ? (\n <ix-icon\n name=\"chevron-right\"\n size=\"16\"\n class={{\n ['icon-toggle-down']: this.context?.isExpanded,\n }}\n color={`color-${\n this.context?.isExpanded ? 'primary' : 'std-text'\n }`}\n />\n ) : null}\n </div>\n <div\n class=\"tree-node-container\"\n onClick={() => {\n this.itemClick.emit();\n }}\n >\n {this.text}\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
function n(){const n=Array.from(document.querySelectorAll("ix-modal-container"));const[t]=n;if(n.length>1){console.warn("Multiple modal containers were found. The one instatiated first will be used.");return t}if(!t){const n=document.createElement("ix-modal-container");document.body.appendChild(n);return n}return t}async function t(t){const o=n();const e=await o.showModal(t);return e}function o(n){return n.closest("ix-modal")}function e(n,t){o(n).close(t)}function c(n,t){o(n).dismiss(t)}export{e as c,c as d,t as m};
|
|
2
|
+
//# sourceMappingURL=p-b14308ed.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["getModalContainer","containerList","Array","from","document","querySelectorAll","container","length","console","warn","modalContainer","createElement","body","appendChild","async","modal","config","modalInstance","showModal","getIxModal","element","closest","closeModal","closeResult","close","dismissModal","dismissResult","dismiss"],"sources":["./src/components/modal/modal-utils.ts"],"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\nimport { NotificationColor } from '../utils/notification-color';\nimport { TypedEvent } from '../utils/typed-event';\n\nexport interface ModalConfig<TReason = any> {\n animation?: boolean;\n ariaDescribedBy?: string;\n ariaLabelledBy?: string;\n backdrop?: boolean | 'static';\n backdropClass?: string;\n beforeDismiss?: (reason?: TReason) => boolean | Promise<boolean>;\n centered?: boolean;\n container?: string | HTMLElement;\n content: string | HTMLElement;\n keyboard?: boolean;\n modalDialogClass?: string;\n scrollable?: boolean;\n size?: 'sm' | 'lg' | 'xl';\n title: string;\n windowClass?: string;\n icon?: string;\n iconColor?: NotificationColor;\n}\n\nexport interface ModalInstance<TReason = any> {\n htmlElement: HTMLIxModalElement;\n onClose: TypedEvent<TReason>;\n onDismiss: TypedEvent<TReason>;\n}\n\nfunction getModalContainer() {\n const containerList = Array.from(\n document.querySelectorAll('ix-modal-container')\n );\n const [container] = containerList;\n if (containerList.length > 1) {\n console.warn(\n 'Multiple modal containers were found. The one instatiated first will be used.'\n );\n return container;\n }\n if (!container) {\n const modalContainer = document.createElement('ix-modal-container');\n document.body.appendChild(modalContainer);\n\n return modalContainer;\n }\n return container;\n}\n\nexport async function modal<T = any>(\n config: ModalConfig<T>\n): Promise<ModalInstance<T>> {\n const modalContainer = getModalContainer();\n const modalInstance = await modalContainer.showModal<T>(config);\n\n return modalInstance;\n}\n\nfunction getIxModal(element: Element) {\n return element.closest('ix-modal');\n}\n\nexport function closeModal<TClose = any>(\n element: Element,\n closeResult: TClose\n) {\n getIxModal(element).close(closeResult);\n}\n\nexport function dismissModal(element: Element, dismissResult?: any) {\n getIxModal(element).dismiss(dismissResult);\n}\n"],"mappings":"AAsCA,SAASA,IACP,MAAMC,EAAgBC,MAAMC,KAC1BC,SAASC,iBAAiB,uBAE5B,MAAOC,GAAaL,EACpB,GAAIA,EAAcM,OAAS,EAAG,CAC5BC,QAAQC,KACN,iFAEF,OAAOH,C,CAET,IAAKA,EAAW,CACd,MAAMI,EAAiBN,SAASO,cAAc,sBAC9CP,SAASQ,KAAKC,YAAYH,GAE1B,OAAOA,C,CAET,OAAOJ,CACT,CAEOQ,eAAeC,EACpBC,GAEA,MAAMN,EAAiBV,IACvB,MAAMiB,QAAsBP,EAAeQ,UAAaF,GAExD,OAAOC,CACT,CAEA,SAASE,EAAWC,GAClB,OAAOA,EAAQC,QAAQ,WACzB,C,SAEgBC,EACdF,EACAG,GAEAJ,EAAWC,GAASI,MAAMD,EAC5B,C,SAEgBE,EAAaL,EAAkBM,GAC7CP,EAAWC,GAASO,QAAQD,EAC9B,Q"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as i,c as t,h as o,H as s,g as a}from"./p-8fcd6f85.js";import{a as e}from"./p-810b5232.js";import{A as d}from"./p-3b97bb69.js";import{T as l}from"./p-9ee41861.js";const n=".sc-ix-modal-h{position:relative;width:100vw;height:100vh}.sc-ix-modal-h .modal.sc-ix-modal{display:flex}.sc-ix-modal-h .modal.animation.sc-ix-modal{animation:modal-fade 300ms ease-in-out}.sc-ix-modal-h .modal.backdrop.sc-ix-modal{background-color:var(--theme-color-lightbox);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:none}.sc-ix-modal-h .modal.backdrop.animation.sc-ix-modal{transition:-webkit-backdrop-filter 0ms ease-in-out;transition:backdrop-filter 0ms ease-in-out;transition:backdrop-filter 0ms ease-in-out, -webkit-backdrop-filter 0ms ease-in-out}.sc-ix-modal-h .modal.sc-ix-modal .modal-dialog.sc-ix-modal{flex-grow:1}.sc-ix-modal-h .modal.scrollable.sc-ix-modal .modal-content.sc-ix-modal{max-height:100%}.sc-ix-modal-h .modal.scrollable.sc-ix-modal .modal-content.sc-ix-modal .modal-body.sc-ix-modal{overflow-y:auto}.sc-ix-modal-h .modal.sc-ix-modal .modal-content.sc-ix-modal{box-shadow:var(--theme-modal--box-shadow);flex-direction:row;background-color:var(--theme-modal--background);border:var(--modal--border-thickness) solid var(--theme-modal--border-color);padding:1.5rem;max-height:100vh}.sc-ix-modal-h .modal.sc-ix-modal .modal-content.sc-ix-modal .state-icon-container.sc-ix-modal{-webkit-margin-end:1rem;margin-inline-end:1rem}.sc-ix-modal-h .modal.sc-ix-modal .modal-content.sc-ix-modal .slot-container.sc-ix-modal{flex-grow:1}@media (min-width: 576px){.sc-ix-modal-h .modal.sc-ix-modal .modal-dialog.sc-ix-modal:not(.modal-dialog-centered){margin:2.5rem auto}}@media (max-width: 575.98px){.sc-ix-modal-h .modal.sc-ix-modal .modal-dialog.sc-ix-modal{height:100%;margin:0}.sc-ix-modal-h .modal.sc-ix-modal .modal-dialog.sc-ix-modal .modal-content.sc-ix-modal{height:100%;border-radius:0}}@keyframes modal-fade{from{opacity:0%}to{opacity:100%}}@keyframes slide-down{from{top:-100%}to{top:32px}}";const c=class{constructor(o){i(this,o);this.closed=t(this,"closed",7);this.dismissed=t(this,"dismissed",7);this.onKeydown=this.handleKeydown.bind(this);this.animation=true;this.ariaDescribedBy=undefined;this.ariaLabelledBy="modal-title";this.backdrop=true;this.backdropClass=undefined;this.beforeDismiss=undefined;this.centered=false;this.content=undefined;this.keyboard=true;this.icon=undefined;this.iconColor="color-std-text";this.modalDialogClass=undefined;this.scrollable=true;this.size="sm";this.headerTitle=undefined;this.windowClass=undefined}get modal(){return this.hostElement.querySelector(".modal")}get modalDialog(){return this.modal.querySelector(".modal-dialog")}get modalContent(){return this.modalDialog.querySelector(".modal-content")}get modalBackdrop(){return this.hostElement.querySelector(".backdrop")}slideDown(i){const t=this.animation?d.mediumTime:0;e({targets:i,duration:t,opacity:[0,1],translateY:["-100%",0],easing:"easeOutSine"})}slideUp(i,t){const o=this.animation?d.mediumTime:0;e({targets:i,duration:o,opacity:[1,0],translateY:[0,"-100%"],easing:"easeInSine",complete:()=>{if(t){t()}}})}onBackdropClick(i){const t=i.target;if(t.classList.contains("backdrop")){this.dismiss(i)}}componentDidLoad(){if(this.backdrop==="static"){this.modalBackdrop.addEventListener("click",(i=>this.onBackdropClick(i)))}if(this.backdropClass){this.modalBackdrop.classList.add(this.backdropClass)}if(this.modalDialogClass){this.modalDialog.classList.add(this.modalDialogClass)}if(this.windowClass){this.modal.classList.add(this.windowClass)}if(this.keyboard){window.addEventListener("keydown",this.onKeydown)}this.slideDown(this.modalContent)}handleKeydown(i){if(i.key==="Escape"){this.dismiss(i.key)}}disconnectedCallback(){window.removeEventListener("keydown",this.onKeydown)}async dismiss(i){if(this.beforeDismiss){const t=await this.beforeDismiss(i);if(t!==false){this.slideUp(this.modalContent,(()=>this.dismissed.emit(i)))}}else{this.slideUp(this.modalContent,(()=>this.dismissed.emit(i)))}}async close(i){this.slideUp(this.modalContent,(()=>this.closed.emit(i)))}render(){return o(s,null,o("div",{class:{animation:this.animation,modal:true,backdrop:this.backdrop==="static"||this.backdrop,"align-items-center":this.centered,scrollable:this.scrollable},"aria-describedby":this.ariaDescribedBy,"aria-labelledby":this.ariaLabelledBy},o("div",{class:{"modal-dialog":true,"modal-sm":this.size==="sm","modal-lg":this.size==="lg","modal-xl":this.size==="xl"}},o("div",{class:"modal-content"},this.icon===undefined||this.icon===""?"":o("div",{class:"state-icon-container"},o("ix-icon",{name:this.icon,size:"32",color:this.iconColor})),o("div",{class:"slot-container"},o("slot",null))))))}get hostElement(){return a(this)}};c.style=n;const m=".sc-ix-modal-container-h{position:absolute;top:0;left:0;z-index:9999}";var r=undefined&&undefined.__rest||function(i,t){var o={};for(var s in i)if(Object.prototype.hasOwnProperty.call(i,s)&&t.indexOf(s)<0)o[s]=i[s];if(i!=null&&typeof Object.getOwnPropertySymbols==="function")for(var a=0,s=Object.getOwnPropertySymbols(i);a<s.length;a++){if(t.indexOf(s[a])<0&&Object.prototype.propertyIsEnumerable.call(i,s[a]))o[s[a]]=i[s[a]]}return o};const h=class{constructor(t){i(this,t)}async showModal(i){const t=new l;const o=new l;const s=document.createElement("ix-modal");let{title:a,content:e}=i,d=r(i,["title","content"]);Object.assign(s,Object.assign({headerTitle:a},d));if(typeof e==="string"){const i=document.createElement("template");e=e.trim();i.innerHTML=e;s.appendChild(i.content.firstChild)}else{s.appendChild(e)}this.hostElement.appendChild(s);s.addEventListener("closed",(i=>{this.hostElement.removeChild(s);t.emit(i.detail)}));s.addEventListener("dismissed",(i=>{this.hostElement.removeChild(s);o.emit(i.detail)}));return{htmlElement:s,onClose:t,onDismiss:o}}render(){return o(s,null)}get hostElement(){return a(this)}};h.style=m;export{c as ix_modal,h as ix_modal_container};
|
|
2
|
+
//# sourceMappingURL=p-b64e82ce.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["modalCss","Modal","this","onKeydown","handleKeydown","bind","modal","hostElement","querySelector","modalDialog","modalContent","modalBackdrop","slideDown","duration","animation","Animation","mediumTime","anime","targets","opacity","translateY","easing","slideUp","completeCallback","complete","onBackdropClick","event","target","classList","contains","dismiss","componentDidLoad","backdrop","addEventListener","backdropClass","add","modalDialogClass","windowClass","keyboard","window","ev","key","disconnectedCallback","removeEventListener","async","reason","beforeDismiss","result","dismissed","emit","closed","render","h","Host","class","centered","scrollable","ariaDescribedBy","ariaLabelledBy","size","icon","undefined","name","color","iconColor","modalContainerCss","ModalContainer","config","onClose","TypedEvent","onDismiss","document","createElement","title","content","modifiedConfig","__rest","Object","assign","headerTitle","template","trim","innerHTML","appendChild","firstChild","removeChild","detail","htmlElement"],"sources":["./src/components/modal/modal.scss?tag=ix-modal&encapsulation=scoped","./src/components/modal/modal.tsx","./src/components/modal-container/modal-container.scss?tag=ix-modal-container&encapsulation=scoped","./src/components/modal-container/modal-container.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 '~bootstrap/scss/_functions';\n@import '~bootstrap/scss/mixins/_breakpoints.scss';\n@import '~bootstrap/scss/_variables.scss';\n\n@import 'common-variables';\n\n:host {\n position: relative;\n width: 100vw;\n height: 100vh;\n\n .modal {\n display: flex;\n\n &.animation {\n animation: modal-fade $medium-time ease-in-out;\n }\n\n &.backdrop {\n background-color: var(--theme-color-lightbox);\n backdrop-filter: blur(4px);\n transition: none;\n\n &.animation {\n transition: backdrop-filter $short-time ease-in-out;\n }\n }\n\n .modal-dialog {\n flex-grow: 1;\n }\n\n &.scrollable {\n .modal-content {\n max-height: 100%;\n .modal-body {\n overflow-y: auto;\n }\n }\n }\n\n .modal-content {\n box-shadow: var(--theme-modal--box-shadow);\n flex-direction: row;\n background-color: var(--theme-modal--background);\n border: var(--modal--border-thickness) solid\n var(--theme-modal--border-color);\n padding: $large-space;\n max-height: 100vh;\n\n .state-icon-container {\n margin-inline-end: $default-space;\n }\n\n .slot-container {\n flex-grow: 1;\n }\n }\n\n @include media-breakpoint-up(sm) {\n .modal-dialog:not(.modal-dialog-centered) {\n margin: 2.5rem auto;\n }\n }\n\n @include media-breakpoint-down(sm) {\n .modal-dialog {\n height: 100%;\n margin: 0;\n\n .modal-content {\n height: 100%;\n border-radius: 0;\n }\n }\n }\n\n @keyframes modal-fade {\n from {\n opacity: 0%;\n }\n to {\n opacity: 100%;\n }\n }\n\n @keyframes slide-down {\n from {\n top: -100%;\n }\n to {\n top: 32px;\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 {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport Animation from '../utils/animation';\nimport { NotificationColor } from '../utils/notification-color';\n\n@Component({\n tag: 'ix-modal',\n styleUrl: 'modal.scss',\n scoped: true,\n})\nexport class Modal {\n @Element() hostElement: HTMLIxModalElement;\n\n /**\n * Should the modal be animtated\n */\n @Prop() animation = true;\n\n /**\n *\n */\n @Prop() ariaDescribedBy: string;\n\n /**\n *\n */\n @Prop() ariaLabelledBy = 'modal-title';\n\n /**\n * Adds a dimming layer to the modal.\n * This should only be used when it it necessary to focus the user's attention to the dialog content (e.g. errors, warnings, complex tasks).\n */\n @Prop() backdrop: boolean | 'static' = true;\n\n /**\n * Backdrop class\n */\n @Prop() backdropClass: string;\n\n /**\n * BeforeDismiss callback\n */\n @Prop() beforeDismiss: (reason?: any) => boolean | Promise<boolean>;\n\n /**\n * Centered modal\n */\n @Prop() centered = false;\n\n /**\n * Content of modal\n */\n @Prop() content: HTMLElement | string;\n\n /**\n * ESC close modal dialog\n */\n @Prop() keyboard = true;\n\n /**\n * Optional icon displayed next to the title\n */\n @Prop() icon: string;\n\n /**\n * Color of the header {@see ix-icon}\n */\n @Prop() iconColor: NotificationColor = 'color-std-text';\n\n /**\n * Modal dialog class\n */\n @Prop() modalDialogClass: string;\n\n /**\n * Modal scollable\n */\n @Prop() scrollable = true;\n\n /**\n * Modal size\n */\n @Prop() size: 'sm' | 'lg' | 'xl' = 'sm';\n\n /**\n * Header title\n */\n @Prop() headerTitle: string;\n\n /**\n * Window class\n */\n @Prop() windowClass: string;\n\n /**\n * Modal closed\n */\n @Event() closed: EventEmitter;\n\n /**\n * Modal dismissed\n */\n @Event() dismissed: EventEmitter;\n\n private readonly onKeydown = this.handleKeydown.bind(this);\n\n get modal() {\n return this.hostElement.querySelector('.modal');\n }\n\n get modalDialog() {\n return this.modal.querySelector('.modal-dialog');\n }\n\n get modalContent() {\n return this.modalDialog.querySelector('.modal-content');\n }\n\n get modalBackdrop() {\n return this.hostElement.querySelector('.backdrop');\n }\n\n private slideDown(modal: any) {\n const duration = this.animation ? Animation.mediumTime : 0;\n\n anime({\n targets: modal,\n duration,\n opacity: [0, 1],\n translateY: ['-100%', 0],\n easing: 'easeOutSine',\n });\n }\n\n private slideUp(modal: any, completeCallback?: any) {\n const duration = this.animation ? Animation.mediumTime : 0;\n\n anime({\n targets: modal,\n duration,\n opacity: [1, 0],\n translateY: [0, '-100%'],\n easing: 'easeInSine',\n complete: () => {\n if (completeCallback) {\n completeCallback();\n }\n },\n });\n }\n\n private onBackdropClick(event: Event) {\n const target = event.target as Element;\n if (target.classList.contains('backdrop')) {\n this.dismiss(event);\n }\n }\n\n componentDidLoad() {\n if (this.backdrop === 'static') {\n this.modalBackdrop.addEventListener('click', (event) =>\n this.onBackdropClick(event)\n );\n }\n\n if (this.backdropClass) {\n this.modalBackdrop.classList.add(this.backdropClass);\n }\n\n if (this.modalDialogClass) {\n this.modalDialog.classList.add(this.modalDialogClass);\n }\n\n if (this.windowClass) {\n this.modal.classList.add(this.windowClass);\n }\n\n if (this.keyboard) {\n window.addEventListener('keydown', this.onKeydown);\n }\n\n this.slideDown(this.modalContent);\n }\n\n private handleKeydown(ev: KeyboardEvent) {\n if (ev.key === 'Escape') {\n this.dismiss(ev.key);\n }\n }\n\n disconnectedCallback() {\n window.removeEventListener('keydown', this.onKeydown);\n }\n\n /**\n * Dismiss modal instance\n * @param reason\n */\n @Method()\n async dismiss<T = any>(reason?: T) {\n if (this.beforeDismiss) {\n const result = await this.beforeDismiss(reason);\n if (result !== false) {\n this.slideUp(this.modalContent, () => this.dismissed.emit(reason));\n }\n } else {\n this.slideUp(this.modalContent, () => this.dismissed.emit(reason));\n }\n }\n\n /**\n * Close modal\n * @param result\n */\n @Method()\n async close<T = any>(result: T) {\n this.slideUp(this.modalContent, () => this.closed.emit(result));\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n animation: this.animation,\n modal: true,\n backdrop: this.backdrop === 'static' || this.backdrop,\n 'align-items-center': this.centered,\n scrollable: this.scrollable,\n }}\n aria-describedby={this.ariaDescribedBy}\n aria-labelledby={this.ariaLabelledBy}\n >\n <div\n class={{\n 'modal-dialog': true,\n 'modal-sm': this.size === 'sm',\n 'modal-lg': this.size === 'lg',\n 'modal-xl': this.size === 'xl',\n }}\n >\n <div class=\"modal-content\">\n {this.icon === undefined || this.icon === '' ? (\n ''\n ) : (\n <div class=\"state-icon-container\">\n <ix-icon\n name={this.icon}\n size=\"32\"\n color={this.iconColor}\n ></ix-icon>\n </div>\n )}\n <div class=\"slot-container\">\n <slot></slot>\n </div>\n </div>\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\n:host {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 9999;\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, Method } from '@stencil/core';\nimport { ModalConfig, ModalInstance } from '../modal/modal-utils';\nimport { TypedEvent } from '../utils/typed-event';\n\n@Component({\n tag: 'ix-modal-container',\n styleUrl: 'modal-container.scss',\n scoped: true,\n})\nexport class ModalContainer {\n @Element() hostElement: HTMLIxModalContainerElement;\n\n /**\n * Display modal dialog\n *\n * @param config\n */\n @Method()\n async showModal<T = any>(config: ModalConfig<T>): Promise<ModalInstance<T>> {\n const onClose = new TypedEvent<T>();\n const onDismiss = new TypedEvent<T>();\n\n const modal = document.createElement('ix-modal');\n let { title, content, ...modifiedConfig } = config;\n Object.assign(modal, { headerTitle: title, ...modifiedConfig });\n\n if (typeof content === 'string') {\n const template = document.createElement('template');\n content = content.trim();\n template.innerHTML = content;\n modal.appendChild(template.content.firstChild);\n } else {\n modal.appendChild(content);\n }\n\n this.hostElement.appendChild(modal);\n\n modal.addEventListener('closed', (event: CustomEvent<T>) => {\n this.hostElement.removeChild(modal);\n onClose.emit(event.detail);\n });\n modal.addEventListener('dismissed', (event: CustomEvent<T>) => {\n this.hostElement.removeChild(modal);\n onDismiss.emit(event.detail);\n });\n\n return {\n htmlElement: modal,\n onClose,\n onDismiss,\n };\n }\n\n render() {\n return <Host></Host>;\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,c as i,h as a,H as s,g as l}from"./p-8fcd6f85.js";import{U as t}from"./p-076c29d1.js";const o=".sc-ix-upload-h{display:block;min-height:4rem;height:4rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload{display:flex;flex-direction:row;align-items:center;justify-content:space-between;overflow:hidden;height:100%;width:100%;padding:1rem;border:1px dashed var(--theme-upload--border-color);border-radius:var(--theme-upload--border-radius);color:var(--theme-upload-text--color)}.sc-ix-upload-h .file-upload-area.multiline.sc-ix-upload{max-height:unset;height:auto}.sc-ix-upload-h .file-upload-area.multiline.sc-ix-upload .glyph.sc-ix-upload{align-self:flex-start;-webkit-margin-before:3px;margin-block-start:3px}.sc-ix-upload-h .file-upload-area.multiline.sc-ix-upload>div.sc-ix-upload{align-self:flex-start}.sc-ix-upload-h .file-upload-area.sc-ix-upload:not(.multiline) .state.sc-ix-upload,.sc-ix-upload-h .file-upload-area.sc-ix-upload:not(.multiline) .upload-text.sc-ix-upload{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-upload-h .file-upload-area.file-over.sc-ix-upload{border-color:var(--theme-upload--border-color--dragover);border-style:solid}.sc-ix-upload-h .file-upload-area.checking.sc-ix-upload{color:var(--theme-upload-text--color--checking);border-style:solid}.sc-ix-upload-h .file-upload-area.disabled.sc-ix-upload{border-style:solid;color:var(--theme-upload-text--color--disabled)}.sc-ix-upload-h .file-upload-area.sc-ix-upload ix-button.sc-ix-upload{-webkit-margin-start:1rem;margin-inline-start:1rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .upload-browser.sc-ix-upload{opacity:0;overflow:hidden;position:absolute;z-index:-1}.sc-ix-upload-h .file-upload-area.sc-ix-upload .loader.sc-ix-upload{margin:2.187rem auto;font-size:0.937rem;width:1rem;height:1rem;border-radius:50%;position:relative;text-indent:-9999em;animation:optimise-loading 1.1s infinite ease;transform:translateZ(0)}.sc-ix-upload-h .file-upload-area.sc-ix-upload .upload-filename.sc-ix-upload{margin-bottom:1rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload{display:flex;align-items:center}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>ix-spinner.sc-ix-upload{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem;height:1.5rem;width:1.5rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>i.sc-ix-upload{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>i.glyph-error.sc-ix-upload{color:var(--theme-color-alarm)}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>i.glyph-success.sc-ix-upload{color:var(--theme-color-success)}";const r=class{get inputElement(){return this.hostElement.querySelector("#upload-browser")}constructor(a){e(this,a);this.filesChanged=i(this,"filesChanged",7);this.accept=undefined;this.multiple=false;this.multiline=false;this.disabled=false;this.state=t.SELECT_FILE;this.selectFileText="+ Drag files here or…";this.loadingText="Checking files…";this.uploadFailedText="Upload failed. Please try again.";this.uploadSuccessText="Upload successful";this.i18nUploadFile="Upload file…";this.i18nUploadDisabled="File upload currently not possible.";this.isFileOver=false}fileDropped(e){e.preventDefault();const i=e.dataTransfer.files;this.isFileOver=false;this.filesToUpload=this.convertToFileArray(i);this.filesChanged.emit(this.filesToUpload)}fileOver(e){e.preventDefault();e.dataTransfer.dropEffect="move";if(!this.multiple&&e.dataTransfer.items.length>1){e.preventDefault();e.stopPropagation();e.dataTransfer.effectAllowed="none";e.dataTransfer.dropEffect="none"}else{this.isFileOver=true}}fileLeave(){this.isFileOver=false}fileChangeEvent(e){this.filesToUpload=this.convertToFileArray(e.target.files);this.filesChanged.emit(this.filesToUpload);this.inputElement.type="";this.inputElement.type="file"}convertToFileArray(e){let i=[];if(e instanceof FileList){i=Array.from(e)}else{i=[e]}return i}renderUploadState(){if(this.disabled){return a("span",{class:"state"},a("span",{class:"upload-text"},this.i18nUploadDisabled))}switch(this.state){case t.SELECT_FILE:return a("span",{class:"state"},a("span",{class:"upload-text"},this.selectFileText));case t.LOADING:return a("span",{class:"state"},a("ix-spinner",{variant:"primary"}),a("span",{class:"upload-text"},this.loadingText));case t.UPLOAD_FAILED:return a("span",{class:"state"},a("i",{class:"glyph glyph-error"}),a("span",{class:"upload-text"},this.uploadFailedText));case t.UPLOAD_SUCCESSED:return a("span",{class:"state"},a("i",{class:"glyph glyph-success"}),a("span",{class:"upload-text"},this.uploadSuccessText));default:return""}}async setFilesToUpload(e){this.filesToUpload=e}render(){return a(s,null,a("div",{class:{"file-upload-area":true,"file-over":this.isFileOver,checking:this.state===t.LOADING,disabled:this.disabled,multiline:this.multiline},onDrop:e=>this.fileDropped(e),onDragOver:e=>this.fileOver(e),onDragLeave:()=>this.fileLeave(),draggable:!this.disabled},this.renderUploadState(),a("div",null,a("input",{multiple:this.multiple,type:"file",class:"upload-browser",id:"upload-browser",onChange:e=>{this.fileChangeEvent(e)},accept:this.accept}),a("ix-button",{tabindex:"-1",outline:true,onClick:()=>this.inputElement.click(),disabled:this.disabled||this.state===t.LOADING},this.i18nUploadFile))))}get hostElement(){return l(this)}};r.style=o;export{r as ix_upload};
|
|
2
|
+
//# sourceMappingURL=p-b9fbd029.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["uploadCss","Upload","inputElement","this","hostElement","querySelector","constructor","hostRef","registerInstance","filesChanged","createEvent","accept","undefined","multiple","multiline","disabled","state","UploadFileState","SELECT_FILE","selectFileText","loadingText","uploadFailedText","uploadSuccessText","i18nUploadFile","i18nUploadDisabled","isFileOver","fileDropped","evt","preventDefault","file","dataTransfer","files","filesToUpload","convertToFileArray","emit","fileOver","event","dropEffect","items","length","stopPropagation","effectAllowed","fileLeave","fileChangeEvent","target","type","filesFromEvent","FileList","Array","from","renderUploadState","h","class","LOADING","variant","UPLOAD_FAILED","UPLOAD_SUCCESSED","async","obj","render","Host","checking","onDrop","e","onDragOver","onDragLeave","draggable","id","onChange","tabindex","outline","onClick","click"],"sources":["./src/components/upload/upload.scss?tag=ix-upload&encapsulation=scoped","./src/components/upload/upload.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/text-truncation';\n\n:host {\n display: block;\n min-height: 4rem;\n height: 4rem;\n\n .file-upload-area {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n\n overflow: hidden;\n\n height: 100%;\n width: 100%;\n\n padding: $default-space;\n\n border: 1px dashed var(--theme-upload--border-color);\n border-radius: var(--theme-upload--border-radius);\n color: var(--theme-upload-text--color);\n\n &.multiline {\n max-height: unset;\n height: auto;\n\n .glyph {\n align-self: flex-start;\n margin-block-start: 3px;\n }\n\n > div {\n align-self: flex-start;\n }\n }\n\n &:not(.multiline) {\n .state,\n .upload-text {\n @include ellipsis;\n }\n }\n\n &.file-over {\n border-color: var(--theme-upload--border-color--dragover);\n border-style: solid;\n }\n\n &.checking {\n color: var(--theme-upload-text--color--checking);\n border-style: solid;\n }\n\n &.disabled {\n border-style: solid;\n color: var(--theme-upload-text--color--disabled);\n }\n\n ix-button {\n margin-inline-start: $default-space;\n }\n\n .upload-browser {\n opacity: 0;\n overflow: hidden;\n position: absolute;\n z-index: -1;\n }\n\n .loader {\n margin: 2.187rem auto;\n font-size: 0.937rem;\n width: $default-space;\n height: $default-space;\n border-radius: 50%;\n position: relative;\n text-indent: -9999em;\n animation: optimise-loading 1.1s infinite ease;\n transform: translateZ(0);\n }\n\n .upload-filename {\n margin-bottom: $default-space;\n }\n\n .state {\n display: flex;\n align-items: center;\n\n > ix-spinner {\n margin-inline-end: $small-space;\n height: $large-space;\n width: $large-space;\n }\n\n > i {\n margin-inline-end: $small-space;\n\n &.glyph-error {\n color: var(--theme-color-alarm);\n }\n\n &.glyph-success {\n color: var(--theme-color-success);\n }\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 {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { UploadFileState } from './upload-file-state';\n\n@Component({\n tag: 'ix-upload',\n styleUrl: 'upload.scss',\n scoped: true,\n})\nexport class Upload {\n /**\n * The accept attribute specifies the types of files that the server accepts (that can be submitted through a file upload).\n * [accept]{@link \"https://www.w3schools.com/tags/att_input_accept.asp\"}\n */\n @Prop() accept: string;\n\n /**\n * If multiple is true the user can drop or select multiple files\n */\n @Prop() multiple = false;\n\n /**\n * Whether the text should wrap to more than one line\n */\n @Prop() multiline = false;\n\n /**\n * Disable all input events\n */\n @Prop() disabled = false;\n\n /**\n * After a file is uploaded you can set the upload component to a defined state\n */\n @Prop() state: UploadFileState = UploadFileState.SELECT_FILE;\n\n /**\n * Will be used by state = UploadFileState.SELECT_FILE\n */\n @Prop() selectFileText = '+ Drag files here or…';\n\n /**\n * Will be used by state = UploadFileState.LOADING\n */\n @Prop() loadingText = 'Checking files…';\n\n /**\n * Will be used by state = UploadFileState.UPLOAD_FAILED\n */\n @Prop() uploadFailedText = 'Upload failed. Please try again.';\n\n /**\n * Will be used by state = UploadFileState.UPLOAD_SUCCESSED\n */\n @Prop() uploadSuccessText = 'Upload successful';\n\n /**\n * Label for upload file button\n */\n @Prop() i18nUploadFile = 'Upload file…';\n\n /**\n * Text for disabled state\n */\n @Prop() i18nUploadDisabled = 'File upload currently not possible.';\n\n /**\n * You get an array of Files after drop-action or browse action is finished\n */\n @Event() filesChanged: EventEmitter<Array<File>>;\n\n @Element() hostElement!: HTMLIxUploadElement;\n\n get inputElement(): HTMLInputElement {\n return this.hostElement.querySelector('#upload-browser');\n }\n\n @State() isFileOver = false;\n\n private filesToUpload: Array<File>;\n\n constructor() {}\n\n private fileDropped(evt: DragEvent) {\n evt.preventDefault();\n\n const file: File | FileList = evt.dataTransfer.files;\n this.isFileOver = false;\n\n this.filesToUpload = this.convertToFileArray(file);\n\n this.filesChanged.emit(this.filesToUpload);\n }\n\n private fileOver(event: DragEvent) {\n event.preventDefault();\n event.dataTransfer.dropEffect = 'move';\n\n if (!this.multiple && event.dataTransfer.items.length > 1) {\n event.preventDefault();\n event.stopPropagation();\n event.dataTransfer.effectAllowed = 'none';\n event.dataTransfer.dropEffect = 'none';\n } else {\n this.isFileOver = true;\n }\n }\n\n private fileLeave() {\n this.isFileOver = false;\n }\n\n private fileChangeEvent(event: any) {\n this.filesToUpload = this.convertToFileArray(event.target.files);\n\n this.filesChanged.emit(this.filesToUpload);\n\n // Workaround for bug in native input element, that prevents the user from uploading\n // a file with the same name as the most recent one, but with changed content.\n this.inputElement.type = '';\n this.inputElement.type = 'file';\n }\n\n private convertToFileArray(filesFromEvent: FileList | File): File[] {\n let files = [];\n if (filesFromEvent instanceof FileList) {\n files = Array.from(filesFromEvent);\n } else {\n files = [filesFromEvent];\n }\n return files;\n }\n\n private renderUploadState() {\n if (this.disabled) {\n return (\n <span class=\"state\">\n <span class=\"upload-text\">{this.i18nUploadDisabled}</span>\n </span>\n );\n }\n\n switch (this.state) {\n case UploadFileState.SELECT_FILE:\n return (\n <span class=\"state\">\n <span class=\"upload-text\">{this.selectFileText}</span>\n </span>\n );\n case UploadFileState.LOADING:\n return (\n <span class=\"state\">\n <ix-spinner variant=\"primary\"></ix-spinner>\n <span class=\"upload-text\">{this.loadingText}</span>\n </span>\n );\n case UploadFileState.UPLOAD_FAILED:\n return (\n <span class=\"state\">\n <i class=\"glyph glyph-error\"></i>\n <span class=\"upload-text\">{this.uploadFailedText}</span>\n </span>\n );\n case UploadFileState.UPLOAD_SUCCESSED:\n return (\n <span class=\"state\">\n <i class=\"glyph glyph-success\"></i>\n <span class=\"upload-text\">{this.uploadSuccessText}</span>\n </span>\n );\n default:\n return '';\n }\n }\n\n /**\n * Set files\n * @param obj\n */\n @Method()\n async setFilesToUpload(obj: any) {\n this.filesToUpload = obj;\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'file-upload-area': true,\n 'file-over': this.isFileOver,\n checking: this.state === UploadFileState.LOADING,\n disabled: this.disabled,\n multiline: this.multiline,\n }}\n onDrop={(e) => this.fileDropped(e)}\n onDragOver={(e) => this.fileOver(e)}\n onDragLeave={() => this.fileLeave()}\n draggable={!this.disabled}\n >\n {this.renderUploadState()}\n <div>\n <input\n multiple={this.multiple}\n type=\"file\"\n class=\"upload-browser\"\n id=\"upload-browser\"\n onChange={(e) => {\n this.fileChangeEvent(e);\n }}\n accept={this.accept}\n />\n <ix-button\n tabindex=\"-1\"\n outline\n onClick={() => this.inputElement.click()}\n disabled={this.disabled || this.state === UploadFileState.LOADING}\n >\n {this.i18nUploadFile}\n </ix-button>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
const e=e=>new MutationObserver(e);export{e as c}
|
|
1
|
+
const e=e=>new MutationObserver(e);export{e as c};
|
|
2
|
+
//# sourceMappingURL=p-c0454c9a.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["createMutationObserver","callback","MutationObserver"],"sources":["./src/components/utils/mutation-observer.ts"],"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\nexport const createMutationObserver = (callback: MutationCallback) =>\n new MutationObserver(callback);\n"],"mappings":"MASaA,EAA0BC,GACrC,IAAIC,iBAAiBD,U"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as i,H as s,g as e}from"./p-8fcd6f85.js";const r="ix-tabs{width:auto;display:flex;align-items:center;position:relative}ix-tabs .tab-items{overflow:hidden;scroll-behavior:smooth;width:100%}ix-tabs .tab-items .items-content{display:flex;align-items:center}ix-tabs .arrow{position:absolute;display:flex;align-items:center;justify-content:center;width:32px;height:32px;top:0;bottom:0;left:0;margin:auto 0;border-radius:4px;color:var(--theme-btn-invisible-primary--color);background-color:var(--theme-btn-invisible-primary--background);z-index:2}ix-tabs .arrow:hover{color:var(--theme-btn-invisible-primary--color--hover);background-color:var(--theme-btn-invisible-primary--background--hover)}ix-tabs .arrow:active{color:var(--theme-btn-invisible-primary--color--active);background-color:var(--theme-btn-invisible-primary--background--active)}ix-tabs .arrow.right{left:auto;right:0}ix-tabs .overflow-shadow{width:50px;height:40px;position:absolute;left:0;top:0;background:linear-gradient(90deg, var(--theme-color-1) 50%, transparent);z-index:1}ix-tabs .overflow-shadow.right{left:auto;right:0;background:linear-gradient(90deg, transparent, var(--theme-color-1) 50%)}";let o=window.innerWidth;const a=class{constructor(i){t(this,i);this.clickAction={timeout:null,isClick:true};this.small=false;this.rounded=false;this.selected=0;this.layout="auto";this.placement="bottom";this.totalItems=0;this.currentScrollAmount=0;this.scrollAmount=100;this.styleNextArrow={};this.stylePreviousArrow={};this.scrollActionAmount=0}onWindowResize(){this.totalItems=0;this.totalItems=this.getTabs().length;if(o===0)return o=window.innerWidth;this.move(o-window.innerWidth);o=window.innerWidth}getTabs(){return Array.from(this.hostElement.querySelectorAll("ix-tab-item"))}getTab(t){return this.getTabs()[t]}getTabsWrapper(){return this.hostElement.getElementsByClassName("items-content")[0]}showArrows(){try{const t=this.getTabsWrapper();return t.scrollWidth>Math.ceil(t.getBoundingClientRect().width)&&this.layout==="auto"}catch(t){return false}}showPreviousArrow(){try{return this.showArrows()&&this.scrollActionAmount<0}catch(t){return false}}showNextArrow(){try{const t=this.getTabsWrapper();const i=t.getBoundingClientRect();return this.showArrows()&&this.scrollActionAmount>(t.scrollWidth-i.width)*-1}catch(t){return false}}getArrowStyle(t){return{opacity:t?"1":"0",zIndex:t?"1":"-1"}}move(t,i=false){const s=this.getTabsWrapper();const e=(s.scrollWidth-s.getBoundingClientRect().width)*-1;t=this.currentScrollAmount+t;t=t>0?0:t<e?e:t;const r=[`transform: translateX(${t}px);`,i?"transition: all ease-in-out 400ms;":""].join("");s.setAttribute("style",r);if(i)this.currentScrollAmount=this.scrollActionAmount=t;else this.scrollActionAmount=t}moveTabToView(t){if(!this.showArrows())return;const i=this.getTab(t).getBoundingClientRect();const s=i.x*-1;this.move(s,true)}setSelected(t){this.selected=t}clickTab(t){if(this.dragStop())return;this.setSelected(t);this.moveTabToView(t)}dragStart(t,i){if(!this.showArrows())return;if(i.button>0)return;this.clickAction.timeout=this.clickAction.timeout===null?setTimeout((()=>this.clickAction.isClick=false),300):null;const s=parseFloat(window.getComputedStyle(t).left);const e=i.clientX;const r=t=>this.dragMove(t,s,e);window.addEventListener("mouseup",(()=>{window.removeEventListener("mousemove",r,false);this.dragStop()}));window.addEventListener("mousemove",r,false)}dragMove(t,i,s){this.move(t.clientX+i-s)}dragStop(){clearTimeout(this.clickAction.timeout);this.clickAction.timeout=null;if(this.clickAction.isClick)return false;this.currentScrollAmount=this.scrollActionAmount;this.clickAction.isClick=true;return true}componentDidRender(){const t=this.getTabs();this.totalItems=t.length;t.forEach(((t,i)=>{if(this.small)t.setAttribute("small","true");if(this.rounded)t.setAttribute("rounded","true");t.setAttribute("layout",this.layout);t.setAttribute("selected",i===this.selected?"true":"false");t.setAttribute("placement",this.placement)}))}componentWillRender(){requestAnimationFrame((()=>{this.styleNextArrow=this.getArrowStyle(this.showNextArrow());this.stylePreviousArrow=this.getArrowStyle(this.showPreviousArrow())}))}componentDidLoad(){const t=this.getTabs();t.forEach(((t,i)=>{const s=t.getAttribute("disabled")!==null;if(!s)t.addEventListener("click",(()=>this.clickTab(i)));t.addEventListener("mousedown",(i=>this.dragStart(t,i)))}))}render(){return i(s,null,i("div",{class:"overflow-shadow",style:this.stylePreviousArrow}),i("div",{class:"arrow",style:this.stylePreviousArrow,onClick:()=>this.move(this.scrollAmount,true)},i("span",{class:"glyph glyph-chevron-left-small"})),i("div",{class:"tab-items"},i("div",{class:"items-content"},i("slot",null))),i("div",{class:"overflow-shadow right",style:this.styleNextArrow}),i("div",{class:"arrow right",style:this.styleNextArrow,onClick:()=>this.move(-this.scrollAmount,true)},i("span",{class:"glyph glyph-chevron-right-small"})))}get hostElement(){return e(this)}};a.style=r;export{a as ix_tabs};
|
|
2
|
+
//# sourceMappingURL=p-c19c2492.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["tabsCss","windowStartSize","window","innerWidth","Tabs","this","clickAction","timeout","isClick","onWindowResize","totalItems","getTabs","length","move","Array","from","hostElement","querySelectorAll","getTab","tabIndex","getTabsWrapper","getElementsByClassName","showArrows","tabWrapper","scrollWidth","Math","ceil","getBoundingClientRect","width","layout","error","showPreviousArrow","scrollActionAmount","showNextArrow","tabWrapperRect","getArrowStyle","condition","opacity","zIndex","amount","click","maxScrollWidth","currentScrollAmount","styles","join","setAttribute","moveTabToView","tab","x","setSelected","index","selected","clickTab","dragStop","dragStart","element","event","button","setTimeout","tabPositionX","parseFloat","getComputedStyle","left","mousedownPositionX","clientX","dragMove","addEventListener","removeEventListener","tabX","mousedownX","clearTimeout","componentDidRender","tabs","forEach","small","rounded","placement","componentWillRender","requestAnimationFrame","styleNextArrow","stylePreviousArrow","componentDidLoad","isDisabled","getAttribute","render","h","Host","class","style","onClick","scrollAmount"],"sources":["./src/components/tabs/tabs.scss?tag=ix-tabs","./src/components/tabs/tabs.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/text-truncation';\n\nix-tabs {\n width: auto;\n display: flex;\n align-items: center;\n position: relative;\n\n .tab-items {\n overflow: hidden;\n scroll-behavior: smooth;\n width: 100%;\n\n .items-content {\n display: flex;\n align-items: center;\n }\n }\n\n .arrow {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n top: 0;\n bottom: 0;\n left: 0;\n margin: auto 0;\n border-radius: 4px;\n color: var(--theme-btn-invisible-primary--color);\n background-color: var(--theme-btn-invisible-primary--background);\n z-index: 2;\n\n &:hover {\n color: var(--theme-btn-invisible-primary--color--hover);\n background-color: var(--theme-btn-invisible-primary--background--hover);\n }\n\n &:active {\n color: var(--theme-btn-invisible-primary--color--active);\n background-color: var(--theme-btn-invisible-primary--background--active);\n }\n\n &.right {\n left: auto;\n right: 0;\n }\n }\n\n .overflow-shadow {\n width: 50px;\n height: 40px;\n position: absolute;\n left: 0;\n top: 0;\n background: linear-gradient(90deg, var(--theme-color-1) 50%, transparent);\n z-index: 1;\n\n &.right {\n left: auto;\n right: 0;\n background: linear-gradient(90deg, transparent, var(--theme-color-1) 50%);\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 h,\n Host,\n Listen,\n Prop,\n State,\n} from '@stencil/core';\n\nlet windowStartSize = window.innerWidth;\n\n@Component({\n tag: 'ix-tabs',\n styleUrl: 'tabs.scss',\n scoped: false,\n})\nexport class Tabs {\n @Element() hostElement!: HTMLIxTabsElement;\n\n /**\n * Set tab items to small size\n */\n @Prop() small = false;\n\n /**\n * Set rounded tabs\n */\n @Prop() rounded = false;\n\n /**\n * Set default selected tab by index\n */\n @Prop({ mutable: true }) selected = 0;\n\n /**\n * Set layout width style\n */\n @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n /**\n * Set placement style\n */\n @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n @State() totalItems = 0;\n @State() currentScrollAmount = 0;\n @State() scrollAmount = 100;\n @State() styleNextArrow = {};\n @State() stylePreviousArrow = {};\n\n @State() scrollActionAmount = 0;\n private clickAction: {\n timeout: NodeJS.Timeout;\n isClick: boolean;\n } = {\n timeout: null,\n isClick: true,\n };\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.totalItems = 0;\n this.totalItems = this.getTabs().length;\n\n if (windowStartSize === 0) return (windowStartSize = window.innerWidth);\n this.move(windowStartSize - window.innerWidth);\n windowStartSize = window.innerWidth;\n }\n\n private getTabs() {\n return Array.from(this.hostElement.querySelectorAll('ix-tab-item'));\n }\n\n private getTab(tabIndex: number) {\n return this.getTabs()[tabIndex];\n }\n\n private getTabsWrapper() {\n return this.hostElement.getElementsByClassName('items-content')[0];\n }\n\n private showArrows() {\n try {\n const tabWrapper = this.getTabsWrapper();\n return (\n tabWrapper.scrollWidth >\n Math.ceil(tabWrapper.getBoundingClientRect().width) &&\n this.layout === 'auto'\n );\n } catch (error) {\n return false;\n }\n }\n\n private showPreviousArrow() {\n try {\n return this.showArrows() && this.scrollActionAmount < 0;\n } catch (error) {\n return false;\n }\n }\n\n private showNextArrow() {\n try {\n const tabWrapper = this.getTabsWrapper();\n const tabWrapperRect = tabWrapper.getBoundingClientRect();\n\n return (\n this.showArrows() &&\n this.scrollActionAmount >\n (tabWrapper.scrollWidth - tabWrapperRect.width) * -1\n );\n } catch (error) {\n return false;\n }\n }\n\n private getArrowStyle(condition: boolean) {\n return {\n opacity: condition ? '1' : '0',\n zIndex: condition ? '1' : '-1',\n };\n }\n\n private move(amount: number, click = false) {\n const tabWrapper = this.getTabsWrapper();\n const maxScrollWidth =\n (tabWrapper.scrollWidth - tabWrapper.getBoundingClientRect().width) * -1;\n\n amount = this.currentScrollAmount + amount;\n amount = amount > 0 ? 0 : amount < maxScrollWidth ? maxScrollWidth : amount;\n\n const styles = [\n `transform: translateX(${amount}px);`,\n click ? 'transition: all ease-in-out 400ms;' : '',\n ].join('');\n\n tabWrapper.setAttribute('style', styles);\n\n if (click) this.currentScrollAmount = this.scrollActionAmount = amount;\n else this.scrollActionAmount = amount;\n }\n\n private moveTabToView(tabIndex: number) {\n if (!this.showArrows()) return;\n\n const tab = this.getTab(tabIndex).getBoundingClientRect();\n const amount = tab.x * -1;\n this.move(amount, true);\n }\n\n private setSelected(index: number) {\n this.selected = index;\n }\n\n private clickTab(index: number) {\n if (this.dragStop()) return;\n\n this.setSelected(index);\n this.moveTabToView(index);\n }\n\n private dragStart(element: HTMLIxTabItemElement, event: MouseEvent) {\n if (!this.showArrows()) return;\n if (event.button > 0) return;\n\n this.clickAction.timeout =\n this.clickAction.timeout === null\n ? setTimeout(() => (this.clickAction.isClick = false), 300)\n : null;\n\n const tabPositionX = parseFloat(window.getComputedStyle(element).left);\n const mousedownPositionX = event.clientX;\n const move = (event: MouseEvent) =>\n this.dragMove(event, tabPositionX, mousedownPositionX);\n\n window.addEventListener('mouseup', () => {\n window.removeEventListener('mousemove', move, false);\n this.dragStop();\n });\n window.addEventListener('mousemove', move, false);\n }\n\n private dragMove(event: MouseEvent, tabX: number, mousedownX: number) {\n this.move(event.clientX + tabX - mousedownX);\n }\n\n private dragStop() {\n clearTimeout(this.clickAction.timeout);\n this.clickAction.timeout = null;\n\n if (this.clickAction.isClick) return false;\n\n this.currentScrollAmount = this.scrollActionAmount;\n this.clickAction.isClick = true;\n\n return true;\n }\n\n componentDidRender() {\n const tabs = this.getTabs();\n this.totalItems = tabs.length;\n\n tabs.forEach((element, index) => {\n if (this.small) element.setAttribute('small', 'true');\n\n if (this.rounded) element.setAttribute('rounded', 'true');\n\n element.setAttribute('layout', this.layout);\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n element.setAttribute('placement', this.placement);\n });\n }\n\n componentWillRender() {\n requestAnimationFrame(() => {\n this.styleNextArrow = this.getArrowStyle(this.showNextArrow());\n this.stylePreviousArrow = this.getArrowStyle(this.showPreviousArrow());\n });\n }\n\n componentDidLoad() {\n const tabs = this.getTabs();\n tabs.forEach((element, index) => {\n const isDisabled = element.getAttribute('disabled') !== null;\n if (!isDisabled)\n element.addEventListener('click', () => this.clickTab(index));\n\n element.addEventListener('mousedown', (event) =>\n this.dragStart(element, event)\n );\n });\n }\n\n render() {\n return (\n <Host>\n <div class=\"overflow-shadow\" style={this.stylePreviousArrow}></div>\n <div\n class=\"arrow\"\n style={this.stylePreviousArrow}\n onClick={() => this.move(this.scrollAmount, true)}\n >\n <span class=\"glyph glyph-chevron-left-small\"></span>\n </div>\n <div class=\"tab-items\">\n <div class=\"items-content\">\n <slot></slot>\n </div>\n </div>\n <div class=\"overflow-shadow right\" style={this.styleNextArrow}></div>\n <div\n class=\"arrow right\"\n style={this.styleNextArrow}\n onClick={() => this.move(-this.scrollAmount, true)}\n >\n <span class=\"glyph glyph-chevron-right-small\"></span>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAU,0lCCmBhB,IAAIC,EAAkBC,OAAOC,W,MAOhBC,EAAI,M,yBAmCPC,KAAAC,YAGJ,CACFC,QAAS,KACTC,QAAS,M,WAlCK,M,aAKE,M,cAKkB,E,YAKG,O,eAKD,S,gBAEhB,E,yBACS,E,kBACP,I,oBACE,G,wBACI,G,wBAEA,C,CAU9BC,iBACEJ,KAAKK,WAAa,EAClBL,KAAKK,WAAaL,KAAKM,UAAUC,OAEjC,GAAIX,IAAoB,EAAG,OAAQA,EAAkBC,OAAOC,WAC5DE,KAAKQ,KAAKZ,EAAkBC,OAAOC,YACnCF,EAAkBC,OAAOC,U,CAGnBQ,UACN,OAAOG,MAAMC,KAAKV,KAAKW,YAAYC,iBAAiB,e,CAG9CC,OAAOC,GACb,OAAOd,KAAKM,UAAUQ,E,CAGhBC,iBACN,OAAOf,KAAKW,YAAYK,uBAAuB,iBAAiB,E,CAG1DC,aACN,IACE,MAAMC,EAAalB,KAAKe,iBACxB,OACEG,EAAWC,YACTC,KAAKC,KAAKH,EAAWI,wBAAwBC,QAC/CvB,KAAKwB,SAAW,M,CAElB,MAAOC,GACP,OAAO,K,EAIHC,oBACN,IACE,OAAO1B,KAAKiB,cAAgBjB,KAAK2B,mBAAqB,C,CACtD,MAAOF,GACP,OAAO,K,EAIHG,gBACN,IACE,MAAMV,EAAalB,KAAKe,iBACxB,MAAMc,EAAiBX,EAAWI,wBAElC,OACEtB,KAAKiB,cACLjB,KAAK2B,oBACFT,EAAWC,YAAcU,EAAeN,QAAU,C,CAEvD,MAAOE,GACP,OAAO,K,EAIHK,cAAcC,GACpB,MAAO,CACLC,QAASD,EAAY,IAAM,IAC3BE,OAAQF,EAAY,IAAM,K,CAItBvB,KAAK0B,EAAgBC,EAAQ,OACnC,MAAMjB,EAAalB,KAAKe,iBACxB,MAAMqB,GACHlB,EAAWC,YAAcD,EAAWI,wBAAwBC,QAAU,EAEzEW,EAASlC,KAAKqC,oBAAsBH,EACpCA,EAASA,EAAS,EAAI,EAAIA,EAASE,EAAiBA,EAAiBF,EAErE,MAAMI,EAAS,CACb,yBAAyBJ,QACzBC,EAAQ,qCAAuC,IAC/CI,KAAK,IAEPrB,EAAWsB,aAAa,QAASF,GAEjC,GAAIH,EAAOnC,KAAKqC,oBAAsBrC,KAAK2B,mBAAqBO,OAC3DlC,KAAK2B,mBAAqBO,C,CAGzBO,cAAc3B,GACpB,IAAKd,KAAKiB,aAAc,OAExB,MAAMyB,EAAM1C,KAAKa,OAAOC,GAAUQ,wBAClC,MAAMY,EAASQ,EAAIC,GAAK,EACxB3C,KAAKQ,KAAK0B,EAAQ,K,CAGZU,YAAYC,GAClB7C,KAAK8C,SAAWD,C,CAGVE,SAASF,GACf,GAAI7C,KAAKgD,WAAY,OAErBhD,KAAK4C,YAAYC,GACjB7C,KAAKyC,cAAcI,E,CAGbI,UAAUC,EAA+BC,GAC/C,IAAKnD,KAAKiB,aAAc,OACxB,GAAIkC,EAAMC,OAAS,EAAG,OAEtBpD,KAAKC,YAAYC,QACfF,KAAKC,YAAYC,UAAY,KACzBmD,YAAW,IAAOrD,KAAKC,YAAYE,QAAU,OAAQ,KACrD,KAEN,MAAMmD,EAAeC,WAAW1D,OAAO2D,iBAAiBN,GAASO,MACjE,MAAMC,EAAqBP,EAAMQ,QACjC,MAAMnD,EAAQ2C,GACZnD,KAAK4D,SAAST,EAAOG,EAAcI,GAErC7D,OAAOgE,iBAAiB,WAAW,KACjChE,OAAOiE,oBAAoB,YAAatD,EAAM,OAC9CR,KAAKgD,UAAU,IAEjBnD,OAAOgE,iBAAiB,YAAarD,EAAM,M,CAGrCoD,SAAST,EAAmBY,EAAcC,GAChDhE,KAAKQ,KAAK2C,EAAMQ,QAAUI,EAAOC,E,CAG3BhB,WACNiB,aAAajE,KAAKC,YAAYC,SAC9BF,KAAKC,YAAYC,QAAU,KAE3B,GAAIF,KAAKC,YAAYE,QAAS,OAAO,MAErCH,KAAKqC,oBAAsBrC,KAAK2B,mBAChC3B,KAAKC,YAAYE,QAAU,KAE3B,OAAO,I,CAGT+D,qBACE,MAAMC,EAAOnE,KAAKM,UAClBN,KAAKK,WAAa8D,EAAK5D,OAEvB4D,EAAKC,SAAQ,CAAClB,EAASL,KACrB,GAAI7C,KAAKqE,MAAOnB,EAAQV,aAAa,QAAS,QAE9C,GAAIxC,KAAKsE,QAASpB,EAAQV,aAAa,UAAW,QAElDU,EAAQV,aAAa,SAAUxC,KAAKwB,QACpC0B,EAAQV,aACN,WACAK,IAAU7C,KAAK8C,SAAW,OAAS,SAErCI,EAAQV,aAAa,YAAaxC,KAAKuE,UAAU,G,CAIrDC,sBACEC,uBAAsB,KACpBzE,KAAK0E,eAAiB1E,KAAK8B,cAAc9B,KAAK4B,iBAC9C5B,KAAK2E,mBAAqB3E,KAAK8B,cAAc9B,KAAK0B,oBAAoB,G,CAI1EkD,mBACE,MAAMT,EAAOnE,KAAKM,UAClB6D,EAAKC,SAAQ,CAAClB,EAASL,KACrB,MAAMgC,EAAa3B,EAAQ4B,aAAa,cAAgB,KACxD,IAAKD,EACH3B,EAAQW,iBAAiB,SAAS,IAAM7D,KAAK+C,SAASF,KAExDK,EAAQW,iBAAiB,aAAcV,GACrCnD,KAAKiD,UAAUC,EAASC,IACzB,G,CAIL4B,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAM,kBAAkBC,MAAOnF,KAAK2E,qBACzCK,EAAA,OACEE,MAAM,QACNC,MAAOnF,KAAK2E,mBACZS,QAAS,IAAMpF,KAAKQ,KAAKR,KAAKqF,aAAc,OAE5CL,EAAA,QAAME,MAAM,oCAEdF,EAAA,OAAKE,MAAM,aACTF,EAAA,OAAKE,MAAM,iBACTF,EAAA,eAGJA,EAAA,OAAKE,MAAM,wBAAwBC,MAAOnF,KAAK0E,iBAC/CM,EAAA,OACEE,MAAM,cACNC,MAAOnF,KAAK0E,eACZU,QAAS,IAAMpF,KAAKQ,MAAMR,KAAKqF,aAAc,OAE7CL,EAAA,QAAME,MAAM,qC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as s,H as i}from"./p-8fcd6f85.js";import{g as h}from"./p-5b39e04e.js";const e=".sc-ix-button-h{display:inline-block;width:auto;height:2rem}.disabled.sc-ix-button-h{pointer-events:none}.sc-ix-button-h .btn.sc-ix-button{width:100%;height:100%}";const o=class{constructor(s){t(this,s);this.variant="Primary";this.outline=false;this.invisible=false;this.ghost=false;this.selected=false;this.disabled=false;this.type="button"}render(){return s(i,{class:{disabled:this.disabled}},s("button",{type:this.type,class:h(this.variant,this.outline,this.ghost||this.invisible,false,false,this.selected,this.disabled)},s("slot",null)))}};o.style=e;export{o as ix_button};
|
|
2
|
+
//# sourceMappingURL=p-d7a3acce.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["buttonCss","Button","render","h","Host","class","disabled","this","type","getButtonClasses","variant","outline","ghost","invisible","selected"],"sources":["./src/components/button/button.scss?tag=ix-button&encapsulation=scoped","./src/components/button/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\n:host {\n display: inline-block;\n width: auto;\n height: 2rem;\n\n &.disabled {\n pointer-events: none;\n }\n\n .btn {\n width: 100%;\n height: 100%;\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 './base-button';\n\nexport type ButtonVariant = 'Primary' | 'Secondary';\n\n@Component({\n tag: 'ix-button',\n scoped: true,\n styleUrl: './button.scss',\n})\nexport class Button {\n /**\n * Button varaint\n */\n @Prop() variant: ButtonVariant = 'Primary';\n\n /**\n * Outline button\n */\n @Prop() outline = false;\n\n /**\n * Invisible button\n *\n * @deprecated use ghost property\n */\n @Prop() invisible = false;\n\n /**\n * Button with no background or outline\n */\n @Prop() ghost = false;\n\n /**\n * Show button as selected. Should be used with outline or ghost\n */\n @Prop() selected = false;\n\n /**\n * Disable the button\n */\n @Prop({ reflect: true }) disabled = false;\n\n /**\n * Type of the button\n */\n @Prop() type: 'button' | 'submit' = 'button';\n\n render() {\n return (\n <Host\n class={{\n disabled: this.disabled,\n }}\n >\n <button\n type={this.type}\n class={getButtonClasses(\n this.variant,\n this.outline,\n this.ghost || this.invisible,\n false,\n false,\n this.selected,\n this.disabled\n )}\n >\n <slot></slot>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"sFAAA,MAAMA,EAAY,qK,MCmBLC,EAAM,M,sCAIgB,U,aAKf,M,eAOE,M,WAKJ,M,cAKG,M,cAKiB,M,UAKA,Q,CAEpCC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLC,SAAUC,KAAKD,WAGjBH,EAAA,UACEK,KAAMD,KAAKC,KACXH,MAAOI,EACLF,KAAKG,QACLH,KAAKI,QACLJ,KAAKK,OAASL,KAAKM,UACnB,MACA,MACAN,KAAKO,SACLP,KAAKD,WAGPH,EAAA,c"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as i}from"./p-8fcd6f85.js";import{a as s}from"./p-810b5232.js";const r=".drawer-container.sc-ix-drawer{top:0;right:0;box-shadow:var(--theme-box-shadow-level-3);visibility:hidden;display:flex;position:absolute;flex-flow:column nowrap;justify-content:flex-start;align-items:center;max-height:100vh;min-height:1.5rem;background-color:var(--theme-color-1);border-radius:0.25rem;transition:all 300ms ease-out}.toggle.sc-ix-drawer{z-index:100;visibility:visible}.drawer-container.full-height.sc-ix-drawer{min-height:100%}.header.sc-ix-drawer{display:flex;position:relative;align-items:center;justify-content:flex-end;height:3.5rem;padding:0.5rem 1rem;width:100%;order:1}.header.sc-ix-drawer .header-content.sc-ix-drawer{flex-grow:1;margin-right:1rem}.content.sc-ix-drawer{position:relative;flex:1;flex-grow:1;order:2;height:100%;width:100%;overflow-y:auto}";const n=class{constructor(i){t(this,i);this.open=e(this,"open",7);this.drawerClose=e(this,"drawerClose",7);this.callback=this.clickedOutside.bind(this);this.show=false;this.closeOnClickOutside=true;this.fullHeight=false;this.minWidth=16;this.maxWidth=28;this.width=this.minWidth}onShowChanged(t){this.show=t!==undefined?t:!this.show;this.toggleDrawer(this.show)}async toggleDrawer(t){this.show=t!==undefined?t:!this.show;if(t){this.open.emit();this.slideInRight(this.divElement);setTimeout((()=>{window.addEventListener("mousedown",this.callback)}),300)}else{this.drawerClose.emit();this.slideOutRight(this.divElement);window.removeEventListener("mousedown",this.callback)}return Promise.resolve()}onCloseClicked(){this.show=false}clickedOutside(t){if(!this.closeOnClickOutside){return}const e=t.target;const i=e.closest("#div-container");const s=e.closest("#drawer-btn");if(t.target.type!=="button"&&i!==this.divElement&&e!==s){this.show=false}}slideOutRight(t){s({targets:t,duration:n.duration,translateX:[0,"16rem"],opacity:[1,0],easing:"easeInSine",complete:()=>{t.classList.add("d-none")}})}slideInRight(t){s({targets:t,duration:n.duration,translateX:["16rem",0],opacity:[0,1],easing:"easeOutSine",begin:()=>{t.classList.remove("d-none")}})}render(){return i("div",{class:{"drawer-container":true,toggle:this.show,"full-height":this.fullHeight,"d-none":true},style:{width:this.width==="auto"?this.width:`${this.width}rem`,"min-width":`${this.minWidth}rem`,"max-width":`${this.maxWidth}rem`},ref:t=>this.divElement=t,"data-testid":"container",id:"div-container"},i("div",{class:"header"},i("div",{class:"header-content"},i("slot",{name:"header"})),i("ix-icon-button",{icon:"close",size:"24",ghost:true,onClick:()=>this.onCloseClicked(),"data-testid":"close-button"})),i("div",{class:"content"},i("slot",null)))}static get watchers(){return{show:["onShowChanged"]}}};n.duration=300;n.style=r;export{n as ix_drawer};
|
|
2
|
+
//# sourceMappingURL=p-d7cf7a1a.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["drawerCss","Drawer","this","callback","clickedOutside","bind","minWidth","onShowChanged","newValue","show","undefined","toggleDrawer","async","open","emit","slideInRight","divElement","setTimeout","window","addEventListener","drawerClose","slideOutRight","removeEventListener","Promise","resolve","onCloseClicked","evt","closeOnClickOutside","target","closestElement","closest","btn","type","el","anime","targets","duration","translateX","opacity","easing","complete","classList","add","begin","remove","render","h","class","toggle","fullHeight","style","width","maxWidth","ref","id","name","icon","size","ghost","onClick"],"sources":["./src/components/drawer/drawer.scss?tag=ix-drawer&encapsulation=scoped","./src/components/drawer/drawer.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 'mixins/shadows';\n@import 'common-variables';\n\n.drawer-container {\n top: 0;\n right: 0;\n @include box-shadow(3);\n\n visibility: hidden;\n\n display: flex;\n position: absolute;\n flex-flow: column nowrap;\n justify-content: flex-start;\n align-items: center;\n\n max-height: 100vh;\n min-height: $large-space;\n background-color: var(--theme-color-1);\n border-radius: $default-border-radius;\n\n transition: all $medium-time ease-out;\n}\n\n.toggle {\n z-index: 100;\n visibility: visible;\n}\n\n.drawer-container.full-height {\n min-height: 100%;\n}\n\n.header {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: flex-end;\n height: 3.5rem;\n padding: $small-space $default-space;\n width: 100%;\n order: 1;\n\n .header-content {\n flex-grow: 1;\n margin-right: $default-space;\n }\n}\n\n.content {\n position: relative;\n flex: 1;\n flex-grow: 1;\n order: 2;\n height: 100%;\n width: 100%;\n overflow-y: auto;\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 Event,\n EventEmitter,\n h,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n tag: 'ix-drawer',\n styleUrl: 'drawer.scss',\n scoped: true,\n})\nexport class Drawer {\n /**\n * Show or hide the drawer\n */\n @Prop({ mutable: true }) show = false;\n\n /**\n * Fired in case of an outside click during drawer showed state\n */\n @Prop() closeOnClickOutside = true;\n\n /**\n * Render the drawer with maximum height\n */\n @Prop() fullHeight = false;\n\n /**\n * Min width interpreted as REM\n */\n @Prop() minWidth = 16;\n\n /**\n * Max width interpreted as REM\n */\n @Prop() maxWidth = 28;\n\n /**\n * Width interpreted as REM if not set to 'auto'\n */\n @Prop() width: number | 'auto' = this.minWidth;\n\n /**\n * Fire event after drawer is open\n */\n @Event() open: EventEmitter;\n\n /**\n * Fire event after drawer is close\n */\n @Event() drawerClose: EventEmitter;\n\n private static duration = 300;\n private callback = this.clickedOutside.bind(this);\n private divElement?: HTMLElement;\n\n @Watch('show')\n onShowChanged(newValue: boolean) {\n this.show = newValue !== undefined ? newValue : !this.show;\n this.toggleDrawer(this.show);\n }\n\n /**\n * Toggle or define show state of drawer\n * @param show Overwrite toggle state with boolean\n */\n @Method()\n async toggleDrawer(show: boolean): Promise<void> {\n this.show = show !== undefined ? show : !this.show;\n\n if (show) {\n this.open.emit();\n this.slideInRight(this.divElement);\n setTimeout(() => {\n window.addEventListener('mousedown', this.callback);\n }, 300);\n } else {\n this.drawerClose.emit();\n this.slideOutRight(this.divElement);\n window.removeEventListener('mousedown', this.callback);\n }\n\n return Promise.resolve();\n }\n\n private onCloseClicked() {\n this.show = false;\n }\n\n private clickedOutside(evt: any) {\n if (!this.closeOnClickOutside) {\n return;\n }\n\n const target = evt.target;\n const closestElement = target.closest('#div-container');\n const btn = target.closest('#drawer-btn');\n\n if (\n evt.target.type !== 'button' &&\n closestElement !== this.divElement &&\n target !== btn\n ) {\n this.show = false;\n }\n }\n\n private slideOutRight(el: HTMLElement) {\n anime({\n targets: el,\n duration: Drawer.duration,\n translateX: [0, '16rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n el.classList.add('d-none');\n },\n });\n }\n\n private slideInRight(el: HTMLElement) {\n anime({\n targets: el,\n duration: Drawer.duration,\n translateX: ['16rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n el.classList.remove('d-none');\n },\n });\n }\n\n render() {\n return (\n <div\n class={{\n 'drawer-container': true,\n toggle: this.show,\n 'full-height': this.fullHeight,\n 'd-none': true,\n }}\n style={{\n width: this.width === 'auto' ? this.width : `${this.width}rem`,\n 'min-width': `${this.minWidth}rem`,\n 'max-width': `${this.maxWidth}rem`,\n }}\n ref={(el) => (this.divElement = el as HTMLElement)}\n data-testid=\"container\"\n id=\"div-container\"\n >\n <div class=\"header\">\n <div class=\"header-content\">\n <slot name=\"header\"></slot>\n </div>\n <ix-icon-button\n icon=\"close\"\n size=\"24\"\n ghost\n onClick={() => this.onCloseClicked()}\n data-testid=\"close-button\"\n ></ix-icon-button>\n </div>\n <div class=\"content\">\n <slot></slot>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"sFAAA,MAAMA,EAAY,6wB,MCyBLC,EAAM,M,6FA0CTC,KAAAC,SAAWD,KAAKE,eAAeC,KAAKH,M,UAtCZ,M,yBAKF,K,gBAKT,M,cAKF,G,cAKA,G,WAKcA,KAAKI,Q,CAiBtCC,cAAcC,GACZN,KAAKO,KAAOD,IAAaE,UAAYF,GAAYN,KAAKO,KACtDP,KAAKS,aAAaT,KAAKO,K,CAQzBG,mBAAmBH,GACjBP,KAAKO,KAAOA,IAASC,UAAYD,GAAQP,KAAKO,KAE9C,GAAIA,EAAM,CACRP,KAAKW,KAAKC,OACVZ,KAAKa,aAAab,KAAKc,YACvBC,YAAW,KACTC,OAAOC,iBAAiB,YAAajB,KAAKC,SAAS,GAClD,I,KACE,CACLD,KAAKkB,YAAYN,OACjBZ,KAAKmB,cAAcnB,KAAKc,YACxBE,OAAOI,oBAAoB,YAAapB,KAAKC,S,CAG/C,OAAOoB,QAAQC,S,CAGTC,iBACNvB,KAAKO,KAAO,K,CAGNL,eAAesB,GACrB,IAAKxB,KAAKyB,oBAAqB,CAC7B,M,CAGF,MAAMC,EAASF,EAAIE,OACnB,MAAMC,EAAiBD,EAAOE,QAAQ,kBACtC,MAAMC,EAAMH,EAAOE,QAAQ,eAE3B,GACEJ,EAAIE,OAAOI,OAAS,UACpBH,IAAmB3B,KAAKc,YACxBY,IAAWG,EACX,CACA7B,KAAKO,KAAO,K,EAIRY,cAAcY,GACpBC,EAAM,CACJC,QAASF,EACTG,SAAUnC,EAAOmC,SACjBC,WAAY,CAAC,EAAG,SAChBC,QAAS,CAAC,EAAG,GACbC,OAAQ,aACRC,SAAU,KACRP,EAAGQ,UAAUC,IAAI,SAAS,G,CAKxB3B,aAAakB,GACnBC,EAAM,CACJC,QAASF,EACTG,SAAUnC,EAAOmC,SACjBC,WAAY,CAAC,QAAS,GACtBC,QAAS,CAAC,EAAG,GACbC,OAAQ,cACRI,MAAO,KACLV,EAAGQ,UAAUG,OAAO,SAAS,G,CAKnCC,SACE,OACEC,EAAA,OACEC,MAAO,CACL,mBAAoB,KACpBC,OAAQ9C,KAAKO,KACb,cAAeP,KAAK+C,WACpB,SAAU,MAEZC,MAAO,CACLC,MAAOjD,KAAKiD,QAAU,OAASjD,KAAKiD,MAAQ,GAAGjD,KAAKiD,WACpD,YAAa,GAAGjD,KAAKI,cACrB,YAAa,GAAGJ,KAAKkD,eAEvBC,IAAMpB,GAAQ/B,KAAKc,WAAaiB,EAAkB,cACtC,YACZqB,GAAG,iBAEHR,EAAA,OAAKC,MAAM,UACTD,EAAA,OAAKC,MAAM,kBACTD,EAAA,QAAMS,KAAK,YAEbT,EAAA,kBACEU,KAAK,QACLC,KAAK,KACLC,MAAK,KACLC,QAAS,IAAMzD,KAAKuB,iBAAgB,cACxB,kBAGhBqB,EAAA,OAAKC,MAAM,WACTD,EAAA,c,wDAhHO7C,EAAAmC,SAAW,I"}
|