@siemens/ix 0.0.0-20240419081748 → 0.0.0-20240508065324
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/components/dropdown.js +112 -9
- package/components/dropdown.js.map +1 -1
- package/components/group-context-menu.js +1 -1
- package/components/group-context-menu.js.map +1 -1
- package/components/group-item.js +3 -3
- package/components/group-item.js.map +1 -1
- package/components/ix-category-filter.js +34 -10
- package/components/ix-category-filter.js.map +1 -1
- package/components/ix-event-list-item.js +5 -4
- package/components/ix-event-list-item.js.map +1 -1
- package/components/ix-event-list.js +26 -25
- package/components/ix-event-list.js.map +1 -1
- package/components/ix-form-field.js +1 -1
- package/components/ix-form-field.js.map +1 -1
- package/components/ix-group.js +16 -9
- package/components/ix-group.js.map +1 -1
- package/components/ix-icon-toggle-button.js +1 -1
- package/components/ix-input-group.js +1 -1
- package/components/ix-key-value-list.js +1 -1
- package/components/ix-kpi.js +3 -3
- package/components/ix-link-button.js +3 -3
- package/components/ix-map-navigation.js +2 -2
- package/components/ix-menu-about-item.js +1 -1
- package/components/ix-menu-about-news.js +4 -4
- package/components/ix-menu-about.js +1 -1
- package/components/ix-menu-about.js.map +1 -1
- package/components/ix-menu-avatar.js +2 -2
- package/components/ix-menu-category.js +5 -5
- package/components/ix-menu-settings-item.js +1 -1
- package/components/ix-menu.js +11 -11
- package/components/ix-message-bar.js +1 -1
- package/components/ix-modal-example.js +1 -1
- package/components/ix-modal-footer.js +1 -1
- package/components/ix-modal-loading.js +1 -1
- package/components/ix-pagination.js +2 -2
- package/components/ix-pane-layout.js +1 -1
- package/components/ix-pill.js +4 -4
- package/components/ix-playground-internal.js +1 -1
- package/components/ix-split-button-item.js +1 -1
- package/components/ix-tile.js +4 -4
- package/components/ix-toggle-button.js +2 -2
- package/components/ix-toggle.js +2 -2
- package/components/ix-tree.js +1 -1
- package/components/ix-upload.js +3 -3
- package/components/ix-validation-tooltip.js +2 -2
- package/components/ix-workflow-step.js +3 -3
- package/components/ix-workflow-steps.js +1 -1
- package/components/map-navigation-overlay.js +2 -2
- package/components/menu-avatar-item.js +1 -1
- package/components/menu-expand-icon.js +1 -1
- package/components/menu-item.js +2 -2
- package/components/modal-content.js +1 -1
- package/components/modal-header.js +1 -1
- package/components/row.js +1 -1
- package/components/select-item.js +9 -1
- package/components/select-item.js.map +1 -1
- package/components/select.js +161 -42
- package/components/select.js.map +1 -1
- package/components/spinner.js +1 -1
- package/components/tabs.js +2 -2
- package/components/time-picker.js +1 -1
- package/components/time-picker.js.map +1 -1
- package/components/toast.js +2 -2
- package/components/tooltip.js +2 -2
- package/components/tree-item.js +4 -4
- package/dist/cjs/focus-9c8ffbb0.js +65 -0
- package/dist/cjs/focus-9c8ffbb0.js.map +1 -0
- package/dist/cjs/ix-avatar_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-category-filter.cjs.entry.js +33 -10
- package/dist/cjs/ix-category-filter.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-col_4.cjs.entry.js +1 -1
- package/dist/cjs/ix-dropdown.cjs.entry.js +52 -8
- package/dist/cjs/ix-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-event-list-item.cjs.entry.js +5 -4
- package/dist/cjs/ix-event-list-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-event-list.cjs.entry.js +26 -25
- package/dist/cjs/ix-event-list.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-filter-chip_2.cjs.entry.js +8 -1
- package/dist/cjs/ix-filter-chip_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-form-field.cjs.entry.js +1 -1
- package/dist/cjs/ix-form-field.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-group-context-menu_2.cjs.entry.js +4 -4
- package/dist/cjs/ix-group-context-menu_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-group.cjs.entry.js +13 -7
- package/dist/cjs/ix-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-icon-button_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-icon-toggle-button.cjs.entry.js +1 -1
- package/dist/cjs/ix-input-group.cjs.entry.js +1 -1
- package/dist/cjs/ix-key-value-list.cjs.entry.js +1 -1
- package/dist/cjs/ix-kpi.cjs.entry.js +3 -3
- package/dist/cjs/ix-link-button.cjs.entry.js +3 -3
- package/dist/cjs/ix-map-navigation-overlay.cjs.entry.js +2 -2
- package/dist/cjs/ix-map-navigation.cjs.entry.js +2 -2
- package/dist/cjs/ix-menu-about-item.cjs.entry.js +1 -1
- package/dist/cjs/ix-menu-about-news.cjs.entry.js +4 -4
- package/dist/cjs/ix-menu-about.cjs.entry.js +1 -1
- package/dist/cjs/ix-menu-about.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-menu-avatar.cjs.entry.js +2 -2
- package/dist/cjs/ix-menu-category.cjs.entry.js +5 -5
- package/dist/cjs/ix-menu-expand-icon.cjs.entry.js +1 -1
- package/dist/cjs/ix-menu-item.cjs.entry.js +2 -2
- package/dist/cjs/ix-menu-settings-item.cjs.entry.js +1 -1
- package/dist/cjs/ix-menu.cjs.entry.js +11 -11
- package/dist/cjs/ix-message-bar.cjs.entry.js +1 -1
- package/dist/cjs/ix-modal-content_2.cjs.entry.js +2 -2
- package/dist/cjs/ix-modal-example.cjs.entry.js +1 -1
- package/dist/cjs/ix-modal-footer.cjs.entry.js +1 -1
- package/dist/cjs/ix-modal-loading.cjs.entry.js +1 -1
- package/dist/cjs/ix-pagination.cjs.entry.js +2 -2
- package/dist/cjs/ix-pane-layout.cjs.entry.js +1 -1
- package/dist/cjs/ix-pill.cjs.entry.js +4 -4
- package/dist/cjs/ix-playground-internal.cjs.entry.js +1 -1
- package/dist/cjs/ix-select.cjs.entry.js +159 -39
- package/dist/cjs/ix-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-split-button-item.cjs.entry.js +1 -1
- package/dist/cjs/ix-tab-item_2.cjs.entry.js +2 -2
- package/dist/cjs/ix-tile.cjs.entry.js +4 -4
- package/dist/cjs/ix-time-picker.cjs.entry.js +1 -1
- package/dist/cjs/ix-time-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-toast.cjs.entry.js +2 -2
- package/dist/cjs/ix-toggle-button.cjs.entry.js +2 -2
- package/dist/cjs/ix-toggle.cjs.entry.js +2 -2
- package/dist/cjs/ix-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/ix-tree-item.cjs.entry.js +4 -4
- package/dist/cjs/ix-tree.cjs.entry.js +1 -1
- package/dist/cjs/ix-upload.cjs.entry.js +3 -3
- package/dist/cjs/ix-validation-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/ix-workflow-step.cjs.entry.js +3 -3
- package/dist/cjs/ix-workflow-steps.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/siemens-ix.cjs.js +1 -1
- package/dist/collection/components/category-filter/category-filter.css +60 -24
- package/dist/collection/components/category-filter/category-filter.js +58 -9
- package/dist/collection/components/category-filter/category-filter.js.map +1 -1
- package/dist/collection/components/dropdown/dropdown.js +52 -8
- package/dist/collection/components/dropdown/dropdown.js.map +1 -1
- package/dist/collection/components/dropdown/test/dropdown.ct.js +42 -0
- package/dist/collection/components/dropdown/test/dropdown.ct.js.map +1 -1
- package/dist/collection/components/event-list/event-list.js +26 -25
- package/dist/collection/components/event-list/event-list.js.map +1 -1
- package/dist/collection/components/event-list/test/event-list.ct.js +61 -0
- package/dist/collection/components/event-list/test/event-list.ct.js.map +1 -0
- package/dist/collection/components/event-list/test/event-list.spec.js +0 -47
- package/dist/collection/components/event-list/test/event-list.spec.js.map +1 -1
- package/dist/collection/components/event-list-item/event-list-item.js +5 -4
- package/dist/collection/components/event-list-item/event-list-item.js.map +1 -1
- package/dist/collection/components/form-field/form-field.css +30 -12
- package/dist/collection/components/group/group-context-menu.css +3 -0
- package/dist/collection/components/group/group.js +16 -9
- package/dist/collection/components/group/group.js.map +1 -1
- package/dist/collection/components/group/test/group.ct.js +47 -0
- package/dist/collection/components/group/test/group.ct.js.map +1 -0
- package/dist/collection/components/group-item/group-item.css +9 -4
- package/dist/collection/components/group-item/group-item.js +2 -2
- package/dist/collection/components/icon-toggle-button/icon-toggle-button.js +1 -1
- package/dist/collection/components/input-group/input-group.js +1 -1
- package/dist/collection/components/key-value-list/key-value-list.js +1 -1
- package/dist/collection/components/kpi/kpi.js +3 -3
- package/dist/collection/components/link-button/link-button.js +3 -3
- package/dist/collection/components/map-navigation/map-navigation.js +2 -2
- package/dist/collection/components/map-navigation-overlay/map-navigation-overlay.js +2 -2
- package/dist/collection/components/menu/menu-expand-icon.js +1 -1
- package/dist/collection/components/menu/menu.js +11 -11
- package/dist/collection/components/menu-about/menu-about.js +2 -2
- package/dist/collection/components/menu-about/menu-about.js.map +1 -1
- package/dist/collection/components/menu-about-item/menu-about-item.js +1 -1
- package/dist/collection/components/menu-about-news/menu-about-news.js +4 -4
- package/dist/collection/components/menu-avatar/menu-avatar.js +2 -2
- package/dist/collection/components/menu-avatar-item/menu-avatar-item.js +1 -1
- package/dist/collection/components/menu-category/menu-category.js +5 -5
- package/dist/collection/components/menu-item/menu-item.js +2 -2
- package/dist/collection/components/menu-settings-item/menu-settings-item.js +1 -1
- package/dist/collection/components/message-bar/message-bar.js +1 -1
- package/dist/collection/components/modal-content/modal-content.js +1 -1
- package/dist/collection/components/modal-footer/modal-footer.js +1 -1
- package/dist/collection/components/modal-header/modal-header.js +1 -1
- package/dist/collection/components/modal-loading/modal-loading.js +1 -1
- package/dist/collection/components/pagination/pagination.js +2 -2
- package/dist/collection/components/pane-layout/pane-layout.js +1 -1
- package/dist/collection/components/pill/pill.js +4 -4
- package/dist/collection/components/playground/example-modal.js +1 -1
- package/dist/collection/components/playground/playground.js +1 -1
- package/dist/collection/components/row/row.js +1 -1
- package/dist/collection/components/select/select.css +27 -9
- package/dist/collection/components/select/select.js +159 -38
- package/dist/collection/components/select/select.js.map +1 -1
- package/dist/collection/components/select/test/select.ct.js +342 -0
- package/dist/collection/components/select/test/select.ct.js.map +1 -1
- package/dist/collection/components/select-item/select-item.js +32 -1
- package/dist/collection/components/select-item/select-item.js.map +1 -1
- package/dist/collection/components/spinner/spinner.js +1 -1
- package/dist/collection/components/split-button-item/split-button-item.js +1 -1
- package/dist/collection/components/tabs/tabs.js +2 -2
- package/dist/collection/components/tile/tile.js +4 -4
- package/dist/collection/components/time-picker/time-picker.css +30 -12
- package/dist/collection/components/toast/toast.js +2 -2
- package/dist/collection/components/toggle/toggle.js +2 -2
- package/dist/collection/components/toggle-button/toggle-button.js +2 -2
- package/dist/collection/components/tooltip/tooltip.js +2 -2
- package/dist/collection/components/tree/tree.js +1 -1
- package/dist/collection/components/tree-item/tree-item.js +4 -4
- package/dist/collection/components/upload/upload.js +3 -3
- package/dist/collection/components/utils/focus.js +60 -0
- package/dist/collection/components/utils/focus.js.map +1 -0
- package/dist/collection/components/validation-tooltip/validation-tooltip.js +2 -2
- package/dist/collection/components/workflow-step/workflow-step.js +3 -3
- package/dist/collection/components/workflow-steps/workflow-steps.js +1 -1
- package/dist/collection/tests/category-filter/category-filter.e2e.js +30 -0
- package/dist/collection/tests/category-filter/category-filter.e2e.js.map +1 -1
- package/dist/collection/tests/select/select.e2e.js +21 -0
- package/dist/collection/tests/select/select.e2e.js.map +1 -1
- package/dist/esm/focus-d4d3abaf.js +63 -0
- package/dist/esm/focus-d4d3abaf.js.map +1 -0
- package/dist/esm/ix-avatar_2.entry.js +1 -1
- package/dist/esm/ix-category-filter.entry.js +33 -10
- package/dist/esm/ix-category-filter.entry.js.map +1 -1
- package/dist/esm/ix-col_4.entry.js +1 -1
- package/dist/esm/ix-dropdown.entry.js +52 -8
- package/dist/esm/ix-dropdown.entry.js.map +1 -1
- package/dist/esm/ix-event-list-item.entry.js +5 -4
- package/dist/esm/ix-event-list-item.entry.js.map +1 -1
- package/dist/esm/ix-event-list.entry.js +26 -25
- package/dist/esm/ix-event-list.entry.js.map +1 -1
- package/dist/esm/ix-filter-chip_2.entry.js +8 -1
- package/dist/esm/ix-filter-chip_2.entry.js.map +1 -1
- package/dist/esm/ix-form-field.entry.js +1 -1
- package/dist/esm/ix-form-field.entry.js.map +1 -1
- package/dist/esm/ix-group-context-menu_2.entry.js +4 -4
- package/dist/esm/ix-group-context-menu_2.entry.js.map +1 -1
- package/dist/esm/ix-group.entry.js +14 -8
- package/dist/esm/ix-group.entry.js.map +1 -1
- package/dist/esm/ix-icon-button_2.entry.js +1 -1
- package/dist/esm/ix-icon-toggle-button.entry.js +1 -1
- package/dist/esm/ix-input-group.entry.js +1 -1
- package/dist/esm/ix-key-value-list.entry.js +1 -1
- package/dist/esm/ix-kpi.entry.js +3 -3
- package/dist/esm/ix-link-button.entry.js +3 -3
- package/dist/esm/ix-map-navigation-overlay.entry.js +2 -2
- package/dist/esm/ix-map-navigation.entry.js +2 -2
- package/dist/esm/ix-menu-about-item.entry.js +1 -1
- package/dist/esm/ix-menu-about-news.entry.js +4 -4
- package/dist/esm/ix-menu-about.entry.js +1 -1
- package/dist/esm/ix-menu-about.entry.js.map +1 -1
- package/dist/esm/ix-menu-avatar.entry.js +2 -2
- package/dist/esm/ix-menu-category.entry.js +5 -5
- package/dist/esm/ix-menu-expand-icon.entry.js +1 -1
- package/dist/esm/ix-menu-item.entry.js +2 -2
- package/dist/esm/ix-menu-settings-item.entry.js +1 -1
- package/dist/esm/ix-menu.entry.js +11 -11
- package/dist/esm/ix-message-bar.entry.js +1 -1
- package/dist/esm/ix-modal-content_2.entry.js +2 -2
- package/dist/esm/ix-modal-example.entry.js +1 -1
- package/dist/esm/ix-modal-footer.entry.js +1 -1
- package/dist/esm/ix-modal-loading.entry.js +1 -1
- package/dist/esm/ix-pagination.entry.js +2 -2
- package/dist/esm/ix-pane-layout.entry.js +1 -1
- package/dist/esm/ix-pill.entry.js +4 -4
- package/dist/esm/ix-playground-internal.entry.js +1 -1
- package/dist/esm/ix-select.entry.js +159 -39
- package/dist/esm/ix-select.entry.js.map +1 -1
- package/dist/esm/ix-split-button-item.entry.js +1 -1
- package/dist/esm/ix-tab-item_2.entry.js +2 -2
- package/dist/esm/ix-tile.entry.js +4 -4
- package/dist/esm/ix-time-picker.entry.js +1 -1
- package/dist/esm/ix-time-picker.entry.js.map +1 -1
- package/dist/esm/ix-toast.entry.js +2 -2
- package/dist/esm/ix-toggle-button.entry.js +2 -2
- package/dist/esm/ix-toggle.entry.js +2 -2
- package/dist/esm/ix-tooltip.entry.js +2 -2
- package/dist/esm/ix-tree-item.entry.js +4 -4
- package/dist/esm/ix-tree.entry.js +1 -1
- package/dist/esm/ix-upload.entry.js +3 -3
- package/dist/esm/ix-validation-tooltip.entry.js +2 -2
- package/dist/esm/ix-workflow-step.entry.js +3 -3
- package/dist/esm/ix-workflow-steps.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/siemens-ix.js +1 -1
- package/dist/playwright-ct.config.js +1 -1
- package/dist/playwright-ct.config.js.map +1 -1
- package/dist/siemens-ix/{p-d2ee87ae.entry.js → p-0a1bfcfc.entry.js} +2 -2
- package/dist/siemens-ix/{p-ca838b5c.entry.js → p-0b7741b7.entry.js} +2 -2
- package/dist/siemens-ix/{p-9c03b231.entry.js → p-114bb49b.entry.js} +2 -2
- package/dist/siemens-ix/{p-c2f6aaae.entry.js → p-262026ab.entry.js} +2 -2
- package/dist/siemens-ix/{p-d48a746d.entry.js → p-29b0bef3.entry.js} +2 -2
- package/dist/siemens-ix/{p-f2856faf.entry.js → p-30e8a26a.entry.js} +2 -2
- package/dist/siemens-ix/{p-1450ba99.entry.js → p-3b8e4fe5.entry.js} +2 -2
- package/dist/siemens-ix/{p-96615442.entry.js → p-418959d3.entry.js} +2 -2
- package/dist/siemens-ix/{p-96615442.entry.js.map → p-418959d3.entry.js.map} +1 -1
- package/dist/siemens-ix/p-4290098e.entry.js +2 -0
- package/dist/siemens-ix/{p-cb1c0d63.entry.js.map → p-4290098e.entry.js.map} +1 -1
- package/dist/siemens-ix/p-43a58a77.entry.js +2 -0
- package/dist/siemens-ix/{p-7289b0be.entry.js.map → p-43a58a77.entry.js.map} +1 -1
- package/dist/siemens-ix/p-4fd11865.entry.js +2 -0
- package/dist/siemens-ix/p-56bbdae4.entry.js +2 -0
- package/dist/siemens-ix/{p-0d268489.entry.js → p-5f08da2c.entry.js} +2 -2
- package/dist/siemens-ix/{p-26789c86.entry.js → p-601cfc6a.entry.js} +2 -2
- package/dist/siemens-ix/p-64c895ac.entry.js +2 -0
- package/dist/siemens-ix/p-64c895ac.entry.js.map +1 -0
- package/dist/siemens-ix/p-678d821f.entry.js +2 -0
- package/dist/siemens-ix/{p-b1ec7f32.entry.js → p-6ea6396e.entry.js} +2 -2
- package/dist/siemens-ix/{p-7c1fd9a0.entry.js → p-6eb4eefc.entry.js} +2 -2
- package/dist/siemens-ix/{p-af46164c.entry.js → p-784fe260.entry.js} +2 -2
- package/dist/siemens-ix/{p-9fcf9dcd.entry.js → p-8d161202.entry.js} +2 -2
- package/dist/siemens-ix/{p-d77fa665.entry.js → p-90c55341.entry.js} +2 -2
- package/dist/siemens-ix/p-90c55341.entry.js.map +1 -0
- package/dist/siemens-ix/p-96d2d21f.entry.js +2 -0
- package/dist/siemens-ix/p-96d2d21f.entry.js.map +1 -0
- package/dist/siemens-ix/{p-c5762d6c.entry.js → p-9dabe2f7.entry.js} +2 -2
- package/dist/siemens-ix/p-a039faa9.entry.js +2 -0
- package/dist/siemens-ix/p-a039faa9.entry.js.map +1 -0
- package/dist/siemens-ix/p-a35d02ea.entry.js +2 -0
- package/dist/siemens-ix/{p-31cc5367.entry.js → p-a3ad98bc.entry.js} +2 -2
- package/dist/siemens-ix/p-a6fbea5b.entry.js +2 -0
- package/dist/siemens-ix/p-a6fbea5b.entry.js.map +1 -0
- package/dist/siemens-ix/p-a9d1ab94.entry.js +2 -0
- package/dist/siemens-ix/{p-080653aa.entry.js.map → p-a9d1ab94.entry.js.map} +1 -1
- package/dist/siemens-ix/p-aa58d9d7.entry.js +2 -0
- package/dist/siemens-ix/p-aa58d9d7.entry.js.map +1 -0
- package/dist/siemens-ix/p-abb29515.entry.js +2 -0
- package/dist/siemens-ix/p-abb29515.entry.js.map +1 -0
- package/dist/siemens-ix/{p-f6635bfc.entry.js → p-ac1d46d6.entry.js} +2 -2
- package/dist/siemens-ix/p-add5b76c.entry.js +2 -0
- package/dist/siemens-ix/{p-33e903e1.entry.js.map → p-add5b76c.entry.js.map} +1 -1
- package/dist/siemens-ix/{p-d76ee9ff.entry.js → p-af74fc62.entry.js} +2 -2
- package/dist/siemens-ix/{p-32fa185a.entry.js → p-b02fd2c5.entry.js} +2 -2
- package/dist/siemens-ix/p-b32c2183.entry.js +2 -0
- package/dist/siemens-ix/{p-d0cf522c.entry.js.map → p-b32c2183.entry.js.map} +1 -1
- package/dist/siemens-ix/{p-6f056fc6.entry.js → p-bc5d33ce.entry.js} +2 -2
- package/dist/siemens-ix/{p-f17e4cce.entry.js → p-bd310180.entry.js} +2 -2
- package/dist/siemens-ix/p-c09553f3.js +2 -0
- package/dist/siemens-ix/p-c09553f3.js.map +1 -0
- package/dist/siemens-ix/{p-c89a070a.entry.js → p-c29aff68.entry.js} +2 -2
- package/dist/siemens-ix/{p-30f449bc.entry.js → p-ca65a043.entry.js} +2 -2
- package/dist/siemens-ix/{p-4bbae41b.entry.js → p-cbbe9dee.entry.js} +2 -2
- package/dist/siemens-ix/p-ccf1bd22.entry.js +2 -0
- package/dist/siemens-ix/{p-47017ce7.entry.js → p-d08cbeaf.entry.js} +2 -2
- package/dist/siemens-ix/p-d600ea55.entry.js +2 -0
- package/dist/siemens-ix/p-d600ea55.entry.js.map +1 -0
- package/dist/siemens-ix/{p-1255e76b.entry.js → p-d6a094cf.entry.js} +2 -2
- package/dist/siemens-ix/{p-3e4e3b23.entry.js → p-dbf234e5.entry.js} +2 -2
- package/dist/siemens-ix/{p-177f9a5c.entry.js → p-e2464e13.entry.js} +2 -2
- package/dist/siemens-ix/{p-d9d5389b.entry.js → p-e678bfc5.entry.js} +2 -2
- package/dist/siemens-ix/{p-c8e0563a.entry.js → p-ec741c06.entry.js} +2 -2
- package/dist/siemens-ix/{p-ca658a19.entry.js → p-ed2ec72f.entry.js} +2 -2
- package/dist/siemens-ix/{p-d9370972.entry.js → p-f2a81e70.entry.js} +2 -2
- package/dist/siemens-ix/{p-1ad7fd83.entry.js → p-fe273de4.entry.js} +2 -2
- package/dist/siemens-ix/siemens-ix-core.css +1 -1
- package/dist/siemens-ix/siemens-ix.css +30 -12
- package/dist/siemens-ix/siemens-ix.esm.js +1 -1
- package/dist/siemens-ix/siemens-ix.esm.js.map +1 -1
- package/dist/types/components/category-filter/category-filter.d.ts +10 -0
- package/dist/types/components/dropdown/dropdown.d.ts +7 -1
- package/dist/types/components/event-list/test/event-list.ct.d.ts +1 -0
- package/dist/types/components/group/group.d.ts +1 -0
- package/dist/types/components/group/test/group.ct.d.ts +1 -0
- package/dist/types/components/menu-about/menu-about.d.ts +1 -1
- package/dist/types/components/select/select.d.ts +15 -3
- package/dist/types/components/select-item/select-item.d.ts +5 -1
- package/dist/types/components/utils/focus.d.ts +10 -0
- package/dist/types/components.d.ts +15 -2
- package/package.json +1 -1
- package/scss/components/form/_input.scss +11 -8
- package/dist/siemens-ix/p-080653aa.entry.js +0 -2
- package/dist/siemens-ix/p-08bedeaa.entry.js +0 -2
- package/dist/siemens-ix/p-2a9673f3.entry.js +0 -2
- package/dist/siemens-ix/p-2a9673f3.entry.js.map +0 -1
- package/dist/siemens-ix/p-33e903e1.entry.js +0 -2
- package/dist/siemens-ix/p-37e4df76.entry.js +0 -2
- package/dist/siemens-ix/p-37e4df76.entry.js.map +0 -1
- package/dist/siemens-ix/p-7289b0be.entry.js +0 -2
- package/dist/siemens-ix/p-7b5ed355.entry.js +0 -2
- package/dist/siemens-ix/p-87fe9d5f.entry.js +0 -2
- package/dist/siemens-ix/p-87fe9d5f.entry.js.map +0 -1
- package/dist/siemens-ix/p-8a06a632.entry.js +0 -2
- package/dist/siemens-ix/p-96f2c71a.entry.js +0 -2
- package/dist/siemens-ix/p-96f2c71a.entry.js.map +0 -1
- package/dist/siemens-ix/p-9fd3ae7f.entry.js +0 -2
- package/dist/siemens-ix/p-a93df5f2.entry.js +0 -2
- package/dist/siemens-ix/p-a93df5f2.entry.js.map +0 -1
- package/dist/siemens-ix/p-ab446f83.entry.js +0 -2
- package/dist/siemens-ix/p-ab446f83.entry.js.map +0 -1
- package/dist/siemens-ix/p-b78fd38b.entry.js +0 -2
- package/dist/siemens-ix/p-b78fd38b.entry.js.map +0 -1
- package/dist/siemens-ix/p-c49701a0.entry.js +0 -2
- package/dist/siemens-ix/p-cb1c0d63.entry.js +0 -2
- package/dist/siemens-ix/p-d0cf522c.entry.js +0 -2
- package/dist/siemens-ix/p-d77fa665.entry.js.map +0 -1
- /package/dist/siemens-ix/{p-d2ee87ae.entry.js.map → p-0a1bfcfc.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-ca838b5c.entry.js.map → p-0b7741b7.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-9c03b231.entry.js.map → p-114bb49b.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-c2f6aaae.entry.js.map → p-262026ab.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-d48a746d.entry.js.map → p-29b0bef3.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-f2856faf.entry.js.map → p-30e8a26a.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-1450ba99.entry.js.map → p-3b8e4fe5.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-c49701a0.entry.js.map → p-4fd11865.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-9fd3ae7f.entry.js.map → p-56bbdae4.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-0d268489.entry.js.map → p-5f08da2c.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-26789c86.entry.js.map → p-601cfc6a.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-7b5ed355.entry.js.map → p-678d821f.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-b1ec7f32.entry.js.map → p-6ea6396e.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-7c1fd9a0.entry.js.map → p-6eb4eefc.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-af46164c.entry.js.map → p-784fe260.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-9fcf9dcd.entry.js.map → p-8d161202.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-c5762d6c.entry.js.map → p-9dabe2f7.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-08bedeaa.entry.js.map → p-a35d02ea.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-31cc5367.entry.js.map → p-a3ad98bc.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-f6635bfc.entry.js.map → p-ac1d46d6.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-d76ee9ff.entry.js.map → p-af74fc62.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-32fa185a.entry.js.map → p-b02fd2c5.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-6f056fc6.entry.js.map → p-bc5d33ce.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-f17e4cce.entry.js.map → p-bd310180.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-c89a070a.entry.js.map → p-c29aff68.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-30f449bc.entry.js.map → p-ca65a043.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-4bbae41b.entry.js.map → p-cbbe9dee.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-8a06a632.entry.js.map → p-ccf1bd22.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-47017ce7.entry.js.map → p-d08cbeaf.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-1255e76b.entry.js.map → p-d6a094cf.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-3e4e3b23.entry.js.map → p-dbf234e5.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-177f9a5c.entry.js.map → p-e2464e13.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-d9d5389b.entry.js.map → p-e678bfc5.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-c8e0563a.entry.js.map → p-ec741c06.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-ca658a19.entry.js.map → p-ed2ec72f.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-d9370972.entry.js.map → p-f2a81e70.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-1ad7fd83.entry.js.map → p-fe273de4.entry.js.map} +0 -0
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-c6f0ac73.js');
|
|
6
6
|
|
|
7
|
-
const formFieldCss = "label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}input
|
|
7
|
+
const formFieldCss = "label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}input{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover,input:hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus,input:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder{color:transparent}input:disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{height:3.25rem;padding:0.375rem 1.25rem 0.375rem 0.5rem}textarea{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover,textarea:hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus,textarea:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder{color:transparent}textarea~.valid-feedback,textarea~.invalid-feedback,input~.valid-feedback,input~.invalid-feedback{display:none;font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}form textarea~.valid-feedback,form input~.valid-feedback{color:var(--theme-color-success)}form textarea~.invalid-feedback,form input~.invalid-feedback{color:var(--theme-color-alarm-text)}form:not([novalidate]) :invalid,form:not([novalidate]) .is-invalid,form.was-validated :invalid,form.was-validated .is-invalid{background-color:var(--theme-input-error--background);border-color:var(--theme-input-error--border-color);background-image:url(\"data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='512px' height='512px' viewBox='0 0 512 512' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: sketchtool 62 (101010) - https://sketch.com --%3E%3Ctitle%3Eerror%3C/title%3E%3Cdesc%3ECreated with sketchtool.%3C/desc%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' fill-opacity='0.75'%3E%3Cg id='error' fill='%23ff2640'%3E%3Cg id='error/error'%3E%3Cpath d='M256,42.6666667 C373.626371,42.6666667 469.333333,138.373627 469.333333,256 C469.333333,373.626371 373.626371,469.333333 256,469.333333 C138.373627,469.333333 42.6666667,373.626371 42.6666667,256 C42.6666667,138.373627 138.373627,42.6666667 256,42.6666667 Z M256,85.3333333 C161.559631,85.3333333 85.3333333,161.559631 85.3333333,256 C85.3333333,350.44037 161.559631,426.666667 256,426.666667 C350.44037,426.666667 426.666667,350.44037 426.666667,256 C426.666667,161.559631 350.44037,85.3333333 256,85.3333333 Z M326.248389,155.581722 L356.418278,185.751611 L286.168667,255.999667 L356.418278,326.248389 L326.248389,356.418278 L255.999667,286.168667 L185.751611,356.418278 L155.581722,326.248389 L225.829667,255.999667 L155.581722,185.751611 L185.751611,155.581722 L255.999667,225.829667 L326.248389,155.581722 Z' id='Combined-Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\") !important;background-position:left calc(0.375em + 0.1875rem) center;padding-right:0.75rem;padding-left:calc(1.5em + 0.75rem);background-size:18px;background-repeat:no-repeat}form:not([novalidate]) :invalid~.invalid-feedback,form:not([novalidate]) .is-invalid~.invalid-feedback,form.was-validated :invalid~.invalid-feedback,form.was-validated .is-invalid~.invalid-feedback{display:block}form:not([novalidate]) :valid~.valid-feedback,form:not([novalidate]) .is-valid~.valid-feedback,form.was-validated :valid~.valid-feedback,form.was-validated .is-valid~.valid-feedback{display:block}form:not(.was-validated) .invalid-feedback,form:not(.was-validated) .valid-feedback{display:none !important}:host{display:contents}";
|
|
8
8
|
const IxFormFieldStyle0 = formFieldCss;
|
|
9
9
|
|
|
10
10
|
const FormField = class {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"ix-form-field.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,
|
|
1
|
+
{"file":"ix-form-field.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,mpSAAmpS,CAAC;AACzqS,0BAAe,YAAY;;MCcd,SAAS;;;;;IAQpB,IAAY,YAAY;QACtB,OAAO,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;KAChD;IAED,iBAAiB,MAAK;IAEtB,MAAM;QACJ,QACEA,QAACC,UAAI,uDACF,IAAI,CAAC,KAAK,IACTD,mBAAO,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,EAAE,IAAG,IAAI,CAAC,KAAK,CAAS,IACxD,IAAI,EACRA,oEAAa,CACR,EACP;KACH;;;;;;;","names":["h","Host"],"sources":["src/components/form-field/form-field.scss?tag=ix-form-field&encapsulation=shadow","src/components/form-field/form-field.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@import 'components/form/input';\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 */\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-form-field',\n styleUrl: 'form-field.scss',\n shadow: true,\n})\nexport class FormField {\n @Element() hostElement!: HTMLIxFormFieldElement;\n\n /**\n * Label\n */\n @Prop() label: string;\n\n private get inputElement() {\n return this.hostElement.querySelector('input');\n }\n\n componentWillLoad() {}\n\n render() {\n return (\n <Host>\n {this.label ? (\n <label htmlFor={this.inputElement.id}>{this.label}</label>\n ) : null}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-c6f0ac73.js');
|
|
6
6
|
const shadowDom = require('./shadow-dom-73f9d553.js');
|
|
7
7
|
|
|
8
|
-
const groupContextMenuCss = ":host{display:block;position:relative;height:2rem;width:2rem;margin-block-start:0.3125rem;margin-inline-end:0.3125rem;margin-inline-start:auto}:host .hide{visibility:collapse}";
|
|
8
|
+
const groupContextMenuCss = ":host{display:block;position:relative;height:2rem;width:2rem;margin-block-start:0.3125rem;margin-inline-end:0.3125rem;margin-inline-start:auto}:host .hide{visibility:collapse}:host ::slotted(ix-dropdown){cursor:default}";
|
|
9
9
|
const IxGroupContextMenuStyle0 = groupContextMenuCss;
|
|
10
10
|
|
|
11
11
|
const GroupContextMenu = class {
|
|
@@ -44,7 +44,7 @@ const GroupContextMenu = class {
|
|
|
44
44
|
};
|
|
45
45
|
GroupContextMenu.style = IxGroupContextMenuStyle0;
|
|
46
46
|
|
|
47
|
-
const groupItemCss = ":host{display:flex;min-height:2.25rem;height:2.25rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host>button{display:flex;height:100%;width:100%;align-items:center;justify-content:flex-start;position:relative;outline:none;background-color:var(--theme-group-item--background);border:1px solid transparent;color:var(--theme-color-std-text);padding-left:2.5rem}:host>button:focus-visible{border:1px solid var(--theme-color-focus-bdr)}:host ix-icon{margin-right:0.25rem;margin-top:-0.125rem}:host .group-entry-selection-indicator{position:absolute;left:-1px;height:calc(100% + 2px);width:0.25rem}:host .group-entry-text{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .group-entry-text-secondary{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text)}:host .group-entry-text-secondary,:host .group-entry-text-secondary span{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.selected){border-top-width:0.062rem !important;background-color:var(--theme-color-ghost--selected)}:host(.selected) .group-entry-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host(:
|
|
47
|
+
const groupItemCss = ":host{display:flex;min-height:2.25rem;height:2.25rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host>button{display:flex;height:100%;width:100%;align-items:center;justify-content:flex-start;position:relative;outline:none;background-color:var(--theme-group-item--background);border:1px solid transparent;color:var(--theme-color-std-text);cursor:pointer;padding-left:2.5rem}:host>button:focus-visible{border:1px solid var(--theme-color-focus-bdr)}:host ix-icon{margin-right:0.25rem;margin-top:-0.125rem}:host .group-entry-selection-indicator{position:absolute;left:-1px;height:calc(100% + 2px);width:0.25rem}:host .group-entry-text{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .group-entry-text-secondary{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text)}:host .group-entry-text-secondary,:host .group-entry-text-secondary span{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.suppress-selection){pointer-events:none}:host(.selected){border-top-width:0.062rem !important;background-color:var(--theme-color-ghost--selected)}:host(.selected) .group-entry-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host(:hover){background-color:var(--theme-color-ghost--selected-hover);border-color:var(--theme-group-item--border-color--hover)}:host(.selected:hover){background-color:var(--theme-color-ghost--selected-hover)}:host(:active){background-color:var(--theme-color-ghost--selected-active);border-color:var(--theme-group-item--border-color--active)}:host(.selected:active){background-color:var(--theme-color-ghost--selected-active)}";
|
|
48
48
|
const IxGroupItemStyle0 = groupItemCss;
|
|
49
49
|
|
|
50
50
|
const GroupItem = class {
|
|
@@ -66,10 +66,10 @@ const GroupItem = class {
|
|
|
66
66
|
this.selectedChanged.emit(this.hostElement);
|
|
67
67
|
}
|
|
68
68
|
render() {
|
|
69
|
-
return (index.h(index.Host, { key: '
|
|
69
|
+
return (index.h(index.Host, { key: 'ec30959a56062acbad4443b9ca91fb8c99125b03', class: {
|
|
70
70
|
selected: this.selected && !this.suppressSelection,
|
|
71
71
|
'suppress-selection': this.suppressSelection,
|
|
72
|
-
} }, index.h("button", { key: '
|
|
72
|
+
} }, index.h("button", { key: 'e29e098d709f657d5109ff840d54e84b7c645d28', tabindex: this.focusable ? 0 : -1 }, index.h("div", { key: 'd82048e82f3a9de77f1acb19f9500c475f400147', class: "group-entry-selection-indicator" }), this.icon ? index.h("ix-icon", { size: "16", name: this.icon }) : null, this.text ? (index.h("span", { class: "group-entry-text" }, index.h("span", { title: this.text }, this.text))) : null, this.secondaryText ? (index.h("span", { class: "group-entry-text-secondary" }, index.h("span", { title: this.secondaryText }, this.secondaryText))) : null, index.h("slot", { key: '1cde0aba243ca5f3537ce589be9e44d3ba9e2494' }))));
|
|
73
73
|
}
|
|
74
74
|
get hostElement() { return index.getElement(this); }
|
|
75
75
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"ix-group-context-menu.ix-group-item.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,mBAAmB,GAAG,
|
|
1
|
+
{"file":"ix-group-context-menu.ix-group-item.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,mBAAmB,GAAG,6NAA6N,CAAC;AAC1P,iCAAe,mBAAmB;;MCgBrB,gBAAgB;;;+BAGA,KAAK;;IAExB,UAAU;QAChB,OAAO,IAAI,CAAC,WAAW,CAAC;KACzB;IAEO,iBAAiB,CACvB,eAAsC,EACtC,cAA2B;QAE3B,eAAe,CAAC,mBAAmB,GAAG,OAAO,CAAC;QAC9C,eAAe,CAAC,OAAO,GAAG,cAAc,CAAC;KAC1C;IAEO,YAAY;QAClB,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAC/D,IAAI,CAAC,IAAI,EAAE;YACT,OAAO;SACR;QACD,MAAM,QAAQ,GAAGA,4BAAkB,CAAC,IAAI,CAAC,CAAC;QAC1C,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;QAE7C,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CACnC,CAAC,GAAY,KAAK,GAAG,CAAC,OAAO,KAAK,aAAa,CAChD,CAAC;QAEF,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAEzC,IAAI,CAAC,cAAc,EAAE;YACnB,OAAO;SACR;QAED,IAAI,CAAC,eAAe,EAAE;YACpB,OAAO;SACR;QAED,IAAI,CAAC,iBAAiB,CAAC,eAAe,EAAE,cAAc,CAAC,CAAC;KACzD;IAED,MAAM;QACJ,QACEC,QAACC,UAAI,uDACHD,6EACE,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,EACtC,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,IAAI,EACX,IAAI,EAAE,cAAc,GACJ,EAClBA,mEAAM,YAAY,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,GAAS,CACjD,EACP;KACH;;;;;ACvEH,MAAM,YAAY,GAAG,ojFAAojF,CAAC;AAC1kF,0BAAe,YAAY;;MCwBd,SAAS;;;;;;;iCAqBQ,KAAK;;yBAWb,IAAI;;;IAaxB,WAAW;QACT,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1B,OAAO;SACR;QACD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;KAC7C;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,iBAAiB;gBAClD,oBAAoB,EAAE,IAAI,CAAC,iBAAiB;aAC7C,IAEDD,qEAAQ,QAAQ,EAAE,IAAI,CAAC,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC,IACvCA,kEAAK,KAAK,EAAC,iCAAiC,GAAO,EAClD,IAAI,CAAC,IAAI,GAAGA,qBAAS,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,GAAG,IAAI,EACjE,IAAI,CAAC,IAAI,IACRA,kBAAM,KAAK,EAAC,kBAAkB,IAC5BA,kBAAM,KAAK,EAAE,IAAI,CAAC,IAAI,IAAG,IAAI,CAAC,IAAI,CAAQ,CACrC,IACL,IAAI,EACP,IAAI,CAAC,aAAa,IACjBA,kBAAM,KAAK,EAAC,4BAA4B,IACtCA,kBAAM,KAAK,EAAE,IAAI,CAAC,aAAa,IAAG,IAAI,CAAC,aAAa,CAAQ,CACvD,IACL,IAAI,EACRA,oEAAa,CACN,CACJ,EACP;KACH;;;;;;;;","names":["getSlottedElements","h","Host"],"sources":["src/components/group/group-context-menu.scss?tag=ix-group-context-menu&encapsulation=shadow","src/components/group/group-context-menu.tsx","src/components/group-item/group-item.scss?tag=ix-group-item&encapsulation=shadow","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:host {\n display: block;\n position: relative;\n\n height: 2rem;\n width: 2rem;\n\n margin-block-start: 0.3125rem;\n margin-inline-end: 0.3125rem;\n margin-inline-start: auto;\n\n .hide {\n visibility: collapse;\n }\n\n ::slotted(ix-dropdown) {\n cursor: default;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, State } from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n tag: 'ix-group-context-menu',\n styleUrl: './group-context-menu.scss',\n shadow: true,\n})\nexport class GroupContextMenu {\n @Element() hostElement!: HTMLIxGroupContextMenuElement;\n\n @State() showContextMenu = false;\n\n private getTrigger() {\n return this.hostElement;\n }\n\n private configureDropdown(\n dropdownElement: HTMLIxDropdownElement,\n triggerElement: HTMLElement\n ) {\n dropdownElement.positioningStrategy = 'fixed';\n dropdownElement.trigger = triggerElement;\n }\n\n private onSlotChange() {\n const slot = this.hostElement.shadowRoot.querySelector('slot');\n if (!slot) {\n return;\n }\n const elements = getSlottedElements(slot);\n this.showContextMenu = elements.length !== 0;\n\n const dropdownElement = elements.find(\n (elm: Element) => elm.tagName === 'IX-DROPDOWN'\n );\n\n const triggerElement = this.getTrigger();\n\n if (!triggerElement) {\n return;\n }\n\n if (!dropdownElement) {\n return;\n }\n\n this.configureDropdown(dropdownElement, triggerElement);\n }\n\n render() {\n return (\n <Host>\n <ix-icon-button\n class={{ hide: !this.showContextMenu }}\n size=\"24\"\n ghost={true}\n icon={'context-menu'}\n ></ix-icon-button>\n <slot onSlotchange={() => this.onSlotChange()}></slot>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/shadow-dom/hover';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n$focusBorderWidth: 1px;\n\n:host {\n @include ix-component;\n display: flex;\n min-height: 2.25rem;\n height: 2.25rem;\n\n > button {\n display: flex;\n height: 100%;\n width: 100%;\n align-items: center;\n justify-content: flex-start;\n position: relative;\n outline: none;\n background-color: var(--theme-group-item--background);\n border: 1px solid transparent;\n color: var(--theme-color-std-text);\n cursor: pointer;\n\n padding-left: 2.5rem;\n\n &:focus-visible {\n border: $focusBorderWidth solid var(--theme-color-focus-bdr);\n }\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: -#{$focusBorderWidth};\n height: calc(100% + #{$focusBorderWidth * 2});\n width: $tiny-space;\n }\n\n .group-entry-text {\n @include text-default;\n @include ellipsis();\n }\n\n .group-entry-text-secondary {\n &,\n span {\n @include text-default;\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 }\n}\n\n:host(.suppress-selection) {\n pointer-events: none;\n}\n\n:host(.selected) {\n border-top-width: 0.062rem !important;\n background-color: var(--theme-color-ghost--selected);\n\n .group-entry-selection-indicator {\n background-color: var(--theme-group-item-indicator--background--selected);\n }\n}\n\n:host(:hover) {\n background-color: var(--theme-color-ghost--selected-hover);\n border-color: var(--theme-group-item--border-color--hover);\n}\n\n:host(.selected:hover) {\n background-color: var(--theme-color-ghost--selected-hover);\n}\n\n:host(:active) {\n background-color: var(--theme-color-ghost--selected-active);\n border-color: var(--theme-group-item--border-color--active);\n}\n\n:host(.selected:active) {\n background-color: var(--theme-color-ghost--selected-active);\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 shadow: 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 >\n <button tabindex={this.focusable ? 0 : -1}>\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 </button>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -26,6 +26,7 @@ const Group = class {
|
|
|
26
26
|
this.dropdownTriggerRef = undefined;
|
|
27
27
|
this.slotSize = this.groupItems.length;
|
|
28
28
|
this.footerVisible = false;
|
|
29
|
+
this.showExpandCollapsedIcon = false;
|
|
29
30
|
}
|
|
30
31
|
get dropdownItems() {
|
|
31
32
|
return Array.from(this.hostElement.querySelectorAll('ix-group-dropdown-item'));
|
|
@@ -104,21 +105,26 @@ const Group = class {
|
|
|
104
105
|
}
|
|
105
106
|
}
|
|
106
107
|
render() {
|
|
107
|
-
return (index.h(index.Host, { key: '
|
|
108
|
+
return (index.h(index.Host, { key: '6b775c7d0b0184c3d33c46c2401b378c3b6c4c08' }, index.h("div", { key: '9a3c57add7b086b0223e8957e7863e0f0caa5c0b', class: {
|
|
108
109
|
'group-header': true,
|
|
109
110
|
expand: !this.collapsed,
|
|
110
111
|
selected: this.selected,
|
|
111
|
-
}, tabindex: "0" }, index.h("div", { key: '
|
|
112
|
+
}, tabindex: "0" }, index.h("div", { key: 'ff7b3e3b0dd048cac13a13d892abaf3d9b12de08', class: "group-header-clickable", onClick: (e) => this.onHeaderClick(e) }, index.h("div", { key: '1b60a84b9c98de13a498ab54e88f72c54fa3d35c', class: {
|
|
112
113
|
'group-header-selection-indicator': true,
|
|
113
114
|
'group-header-selection-indicator-item-selected': this.itemSelected,
|
|
114
|
-
} }), index.h("div", { key: '
|
|
115
|
-
hidden: this.
|
|
116
|
-
}, name: this.collapsed ? 'chevron-right-small' : 'chevron-down-small', onClick: (e) => this.onExpandClick(e) })), index.h("div", { key: '
|
|
115
|
+
} }), index.h("div", { key: 'bc128ad0a4fa2af31cbd03cb67fd8785f605bac1', class: "btn-expand-header" }, index.h("ix-icon", { key: '8fbfe095e0d37b74804e67c174b347cca9471f60', "data-testid": "expand-collapsed-icon", class: {
|
|
116
|
+
hidden: !this.showExpandCollapsedIcon,
|
|
117
|
+
}, name: this.collapsed ? 'chevron-right-small' : 'chevron-down-small', onClick: (e) => this.onExpandClick(e) })), index.h("div", { key: '78551a007fe0e0919f556742020a9d2d510d2fb0', class: "group-header-content" }, this.header ? (index.h("div", { class: "group-header-props-container" }, index.h("div", { class: "group-header-title" }, index.h("span", { title: this.header }, this.header)), index.h("div", { class: "group-subheader", title: this.subHeader }, this.subHeader))) : null, index.h("slot", { key: 'ad99eba2934c2a910e5260ac8f8c62f43319b674', name: "header" }))), index.h("ix-group-context-menu", { key: 'b4203f23bc8c19bd45ad088c6314c5bb03187932' }, index.h("slot", { key: '9b77656e2282afdfe7836c54bc970effb2c351f7', name: "dropdown" }))), index.h("div", { key: 'a26dd0dfac3d432920ba566dc5d2dc5776ea7fce', class: {
|
|
117
118
|
'group-content': true,
|
|
118
|
-
} },
|
|
119
|
+
} }, index.h("div", { key: 'ba7fd9e27461fe30ed804e03d0e7b99b377f0dff', style: {
|
|
120
|
+
display: this.collapsed ? 'none' : 'contents',
|
|
121
|
+
} }, index.h("slot", { key: 'e4ce555634eae2b89f64d18ce2220d6ec677baf1', onSlotchange: () => {
|
|
122
|
+
const slot = this.hostElement.shadowRoot.querySelector('slot:not([name])');
|
|
123
|
+
this.showExpandCollapsedIcon = shadowDom.hasSlottedElements(slot);
|
|
124
|
+
} }), index.h("ix-group-item", { key: '1f50e8d0639ad719f84dd938e8c30f28856a2ee3', suppressSelection: true, focusable: false, class: {
|
|
119
125
|
footer: true,
|
|
120
126
|
'footer-visible': this.footerVisible,
|
|
121
|
-
} }, index.h("slot", { name: "footer", onSlotchange: () => this.onSlotChange() }))))
|
|
127
|
+
} }, index.h("slot", { key: '96a102b08e08ff95f0f56ddf06b6ff47efdbb89c', name: "footer", onSlotchange: () => this.onSlotChange() }))))));
|
|
122
128
|
}
|
|
123
129
|
get hostElement() { return index.getElement(this); }
|
|
124
130
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"ix-group.entry.cjs.js","mappings":"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","names":["hasSlottedElements","createMutationObserver","h","Host","Fragment"],"sources":["src/components/group/group.scss?tag=ix-group&encapsulation=shadow","src/components/group/group.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 'legacy/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: var(--theme-group--border-radius)\n var(--theme-group--border-radius) 0 0;\n display: flex;\n background-color: var(--theme-group-item--background);\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\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n\n @include active {\n background-color: var(--theme-group-item--background--active);\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n\n @include focus-visible {\n border: 1px solid var(--theme-color-focus-bdr);\n border-radius: var(--theme-default-border-radius)\n var(--theme-default-border-radius) 0px 0px;\n outline: none;\n }\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n\n .group-header-selection-indicator {\n background-color: var(\n --theme-group-item-indicator--background--selected\n );\n }\n }\n\n .group-header-selection-indicator {\n background-color: var(--theme-color-input--focus);\n\n &.group-header-selection-indicator-item-selected {\n background-color: var(\n --theme-group-item-indicator--background--selected\n );\n }\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-selection-indicator {\n width: $tiny-space;\n border-top-left-radius: var(--theme-group--border-radius);\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 flex-grow: 1;\n flex-basis: 0;\n padding: 0.5rem;\n padding-left: 0;\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 padding-right: 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 min-width: 1.5rem;\n }\n\n .group-content {\n display: flex;\n flex-direction: column;\n gap: 1px;\n margin-top: 1px;\n }\n\n .footer {\n visibility: collapse;\n height: auto;\n min-height: 0;\n }\n\n .footer-visible {\n visibility: visible;\n }\n\n .hidden {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { hasSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n tag: 'ix-group',\n styleUrl: 'group.scss',\n shadow: true,\n})\nexport class Group {\n @Element() hostElement!: HTMLIxGroupElement;\n\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 @State() itemSelected = false;\n @State() dropdownTriggerRef: HTMLElement;\n @State() slotSize = this.groupItems.length;\n @State() footerVisible = false;\n\n private observer: MutationObserver;\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.shadowRoot.querySelector('.group-content');\n }\n\n private onExpandClick(event: Event) {\n this.collapsed = !this.collapsed;\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 if (this.index >= 0) {\n this.itemSelected = true;\n } else this.itemSelected = false;\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 private onSlotChange() {\n const slot = this.hostElement.shadowRoot.querySelector(\n 'slot[name=\"footer\"]'\n );\n\n if (slot) {\n this.footerVisible = hasSlottedElements(slot);\n }\n }\n\n componentWillRender() {\n this.groupItems.forEach((item, index) => {\n if (this.selected === true) {\n item.selected = false;\n this.index = undefined;\n this.itemSelected = false;\n return;\n }\n item.selected = index === this.index;\n item.index = index;\n });\n }\n\n componentDidLoad() {\n this.observer = createMutationObserver(() => {\n this.slotSize = this.groupItems.length;\n });\n\n this.observer.observe(this.groupContent, {\n childList: true,\n });\n\n this.groupContent.addEventListener(\n 'selectedChanged',\n (evt: CustomEvent<HTMLIxGroupItemElement>) => {\n this.onItemClick(evt.detail.index);\n }\n );\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\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\n class={{\n 'group-header-selection-indicator': true,\n 'group-header-selection-indicator-item-selected':\n this.itemSelected,\n }}\n ></div>\n <div class=\"btn-expand-header\">\n <ix-icon\n class={{\n hidden: this.slotSize === 0,\n }}\n name={\n this.collapsed ? 'chevron-right-small' : 'chevron-down-small'\n }\n onClick={(e) => this.onExpandClick(e)}\n ></ix-icon>\n </div>\n\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 }}\n >\n {!this.collapsed ? (\n <Fragment>\n <slot></slot>\n <ix-group-item\n suppressSelection={true}\n focusable={false}\n class={{\n footer: true,\n 'footer-visible': this.footerVisible,\n }}\n >\n <slot\n name=\"footer\"\n onSlotchange={() => this.onSlotChange()}\n ></slot>\n </ix-group-item>\n </Fragment>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"ix-group.entry.cjs.js","mappings":"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","names":["hasSlottedElements","createMutationObserver","h","Host"],"sources":["src/components/group/group.scss?tag=ix-group&encapsulation=shadow","src/components/group/group.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 'legacy/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: var(--theme-group--border-radius)\n var(--theme-group--border-radius) 0 0;\n display: flex;\n background-color: var(--theme-group-item--background);\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\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n\n @include active {\n background-color: var(--theme-group-item--background--active);\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n\n @include focus-visible {\n border: 1px solid var(--theme-color-focus-bdr);\n border-radius: var(--theme-default-border-radius)\n var(--theme-default-border-radius) 0px 0px;\n outline: none;\n }\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n\n .group-header-selection-indicator {\n background-color: var(\n --theme-group-item-indicator--background--selected\n );\n }\n }\n\n .group-header-selection-indicator {\n background-color: var(--theme-color-input--focus);\n\n &.group-header-selection-indicator-item-selected {\n background-color: var(\n --theme-group-item-indicator--background--selected\n );\n }\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-selection-indicator {\n width: $tiny-space;\n border-top-left-radius: var(--theme-group--border-radius);\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 flex-grow: 1;\n flex-basis: 0;\n padding: 0.5rem;\n padding-left: 0;\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 padding-right: 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 min-width: 1.5rem;\n }\n\n .group-content {\n display: flex;\n flex-direction: column;\n gap: 1px;\n margin-top: 1px;\n }\n\n .footer {\n visibility: collapse;\n height: auto;\n min-height: 0;\n }\n\n .footer-visible {\n visibility: visible;\n }\n\n .hidden {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { hasSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n tag: 'ix-group',\n styleUrl: 'group.scss',\n shadow: true,\n})\nexport class Group {\n @Element() hostElement!: HTMLIxGroupElement;\n\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 @State() itemSelected = false;\n @State() dropdownTriggerRef: HTMLElement;\n @State() slotSize = this.groupItems.length;\n @State() footerVisible = false;\n\n @State() showExpandCollapsedIcon = false;\n\n private observer: MutationObserver;\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.shadowRoot.querySelector('.group-content');\n }\n\n private onExpandClick(event: Event) {\n this.collapsed = !this.collapsed;\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 if (this.index >= 0) {\n this.itemSelected = true;\n } else this.itemSelected = false;\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 private onSlotChange() {\n const slot = this.hostElement.shadowRoot.querySelector(\n 'slot[name=\"footer\"]'\n );\n\n if (slot) {\n this.footerVisible = hasSlottedElements(slot);\n }\n }\n\n componentWillRender() {\n this.groupItems.forEach((item, index) => {\n if (this.selected === true) {\n item.selected = false;\n this.index = undefined;\n this.itemSelected = false;\n return;\n }\n item.selected = index === this.index;\n item.index = index;\n });\n }\n\n componentDidLoad() {\n this.observer = createMutationObserver(() => {\n this.slotSize = this.groupItems.length;\n });\n\n this.observer.observe(this.groupContent, {\n childList: true,\n });\n\n this.groupContent.addEventListener(\n 'selectedChanged',\n (evt: CustomEvent<HTMLIxGroupItemElement>) => {\n this.onItemClick(evt.detail.index);\n }\n );\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\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\n class={{\n 'group-header-selection-indicator': true,\n 'group-header-selection-indicator-item-selected':\n this.itemSelected,\n }}\n ></div>\n <div class=\"btn-expand-header\">\n <ix-icon\n data-testid=\"expand-collapsed-icon\"\n class={{\n hidden: !this.showExpandCollapsedIcon,\n }}\n name={\n this.collapsed ? 'chevron-right-small' : 'chevron-down-small'\n }\n onClick={(e) => this.onExpandClick(e)}\n ></ix-icon>\n </div>\n\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 }}\n >\n <div\n style={{\n display: this.collapsed ? 'none' : 'contents',\n }}\n >\n <slot\n onSlotchange={() => {\n const slot =\n this.hostElement.shadowRoot.querySelector('slot:not([name])');\n this.showExpandCollapsedIcon = hasSlottedElements(slot);\n }}\n ></slot>\n <ix-group-item\n suppressSelection={true}\n focusable={false}\n class={{\n footer: true,\n 'footer-visible': this.footerVisible,\n }}\n >\n <slot\n name=\"footer\"\n onSlotchange={() => this.onSlotChange()}\n ></slot>\n </ix-group-item>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -88,7 +88,7 @@ const Spinner = class {
|
|
|
88
88
|
this.hideTrack = false;
|
|
89
89
|
}
|
|
90
90
|
render() {
|
|
91
|
-
return (index.h(index.Host, { key: '
|
|
91
|
+
return (index.h(index.Host, { key: '6ca735841b5d203cf8ef66f8675f73d2988d7518', class: {
|
|
92
92
|
primary: this.variant === 'primary',
|
|
93
93
|
'xx-small': this.size === 'xx-small',
|
|
94
94
|
'x-small': this.size === 'x-small',
|
|
@@ -73,7 +73,7 @@ const IconToggleButton = class {
|
|
|
73
73
|
extraClasses: Object.assign({ 'icon-button': true }, this.getIconSizeClass()),
|
|
74
74
|
};
|
|
75
75
|
console.log(baseButtonProps, this.disabled, this.loading);
|
|
76
|
-
return (index.h(index.Host, { key: '
|
|
76
|
+
return (index.h(index.Host, { key: '90281a49cd680bd8cf611726bf0c6370452432d1', class: Object.assign(Object.assign({}, this.getIconSizeClass()), { disabled: this.disabled || this.loading }) }, index.h(baseIconButton.BaseIconButton, Object.assign({ key: '12a0e3c4c9654c522dbf65bb43744143b842c44c' }, baseButtonProps))));
|
|
77
77
|
}
|
|
78
78
|
get hostElement() { return index.getElement(this); }
|
|
79
79
|
static get watchers() { return {
|
|
@@ -125,7 +125,7 @@ const InputGroup = class {
|
|
|
125
125
|
return width;
|
|
126
126
|
}
|
|
127
127
|
render() {
|
|
128
|
-
return (index.h(index.Host, { key: '
|
|
128
|
+
return (index.h(index.Host, { key: '32aef634c699370147d06d110ecf4bfee619f657', class: { disabled: this.disabled } }, index.h("div", { key: '285517df8b9cb66cc63de951bd9146ca4dd0d098', class: "group group-start" }, index.h("slot", { key: '79af98dc6dd8352c768d5eb14346f39f88978bac', name: "input-start" })), index.h("slot", { key: '070682be2e58879ec9b1d2adeac9031b75d52a14' }), index.h("div", { key: 'f9d0fdbdafe8a23d23e4ce11e2b0c07dfbeda159', class: "group group-end" }, index.h("slot", { key: '02c882edae38c3fd655ab1abe82abd9f016bb09c', name: "input-end" }))));
|
|
129
129
|
}
|
|
130
130
|
get hostElement() { return index.getElement(this); }
|
|
131
131
|
};
|
|
@@ -13,7 +13,7 @@ const KeyValueList = class {
|
|
|
13
13
|
this.striped = undefined;
|
|
14
14
|
}
|
|
15
15
|
render() {
|
|
16
|
-
return (index.h(index.Host, { key: '
|
|
16
|
+
return (index.h(index.Host, { key: '754310ec87f8ab82d3cddc18beea932d72136d73', class: { keyValueList: true, 'keyValueList--striped': this.striped } }, index.h("slot", { key: '2dc0039fc53a720330b1e9b175ff668b72dd80f6' })));
|
|
17
17
|
}
|
|
18
18
|
};
|
|
19
19
|
KeyValueList.style = IxKeyValueListStyle0;
|
|
@@ -34,13 +34,13 @@ const Kpi = class {
|
|
|
34
34
|
return tooltip;
|
|
35
35
|
}
|
|
36
36
|
render() {
|
|
37
|
-
return (index.h(index.Host, { key: '
|
|
37
|
+
return (index.h(index.Host, { key: 'd6ad8fb6abdd54276ed4d6e99602abc765b7224d', title: this.getTooltipText(), tabindex: "1", class: {
|
|
38
38
|
stacked: this.orientation === 'vertical',
|
|
39
|
-
} }, index.h("div", { key: '
|
|
39
|
+
} }, index.h("div", { key: 'c42c84ed0f27a7b1bd083bb4fb7b424a54e2f892', class: {
|
|
40
40
|
'kpi-container': true,
|
|
41
41
|
alarm: this.state === 'alarm',
|
|
42
42
|
warning: this.state === 'warning',
|
|
43
|
-
} }, index.h("span", { key: '
|
|
43
|
+
} }, index.h("span", { key: 'fdd055e5a2b67ef84a77c6cef50f728506793f3f', class: "kpi-label" }, this.getStateIcon(), index.h("span", { key: '9fb3820732fdc053135215cf3e39df0fb7ec90cc', class: "kpi-label-text" }, this.label)), index.h("span", { key: 'e4856bfd98c838a15fc28e28754899d36007e778', class: "kpi-value-container" }, index.h("span", { key: 'e8757664f1480828a940d17be00822bbfa7e4c39', class: "kpi-value" }, this.value), this.unit ? index.h("span", { class: "kpi-unit" }, this.unit) : ''))));
|
|
44
44
|
}
|
|
45
45
|
};
|
|
46
46
|
Kpi.style = IxKpiStyle0;
|
|
@@ -15,13 +15,13 @@ const LinkButton = class {
|
|
|
15
15
|
this.target = '_self';
|
|
16
16
|
}
|
|
17
17
|
render() {
|
|
18
|
-
return (index.h(index.Host, { key: '
|
|
18
|
+
return (index.h(index.Host, { key: '0308562a5da54b5dbc6e5fff61ff5c40458220a4' }, index.h("a", { key: '31312e87d8ec1a6876d0f9f0d119ec5a99e3d7df', title: this.url, tabindex: "0", class: {
|
|
19
19
|
'link-button': true,
|
|
20
20
|
disabled: this.disabled,
|
|
21
|
-
}, href: this.disabled ? undefined : this.url, target: this.target }, index.h("ix-icon", { key: '
|
|
21
|
+
}, href: this.disabled ? undefined : this.url, target: this.target }, index.h("ix-icon", { key: 'f2f046c1695abcb7ab6c5aae112c78cd9ef4163d', class: "icon", name: 'chevron-right-small', size: "16" }), index.h("div", { key: '04a4a97aa51211e18a585c74aff33b9cd5ed6bc1', class: {
|
|
22
22
|
link: true,
|
|
23
23
|
disabled: this.disabled,
|
|
24
|
-
} }, index.h("slot", { key: '
|
|
24
|
+
} }, index.h("slot", { key: 'a1d09c078e9a4a63ca06a4bbc65c8b8d3e8e1e89' })))));
|
|
25
25
|
}
|
|
26
26
|
};
|
|
27
27
|
LinkButton.style = IxLinkButtonStyle0;
|
|
@@ -46,14 +46,14 @@ const MapNavigationOverlay = class {
|
|
|
46
46
|
}
|
|
47
47
|
render() {
|
|
48
48
|
var _a, _b, _c;
|
|
49
|
-
return (index.h(index.Host, { key: '
|
|
49
|
+
return (index.h(index.Host, { key: 'c992b5ea02d714ebf9ca9b567c5047d74dc588c7' }, index.h("div", { key: '6b2312354d083296f7c2daca376d82bd33f50b29', class: "overlay-header" }, index.h("div", { key: 'be432f47e376532f48a5408f4f080c2a30af9f9c', class: {
|
|
50
50
|
'color-indicator': true,
|
|
51
51
|
'd-none': ((_a = this.iconColor) !== null && _a !== void 0 ? _a : this.color) === undefined,
|
|
52
52
|
}, style: {
|
|
53
53
|
'background-color': ((_b = this.iconColor) !== null && _b !== void 0 ? _b : this.color)
|
|
54
54
|
? `var(--theme-${(_c = this.iconColor) !== null && _c !== void 0 ? _c : this.color})`
|
|
55
55
|
: '',
|
|
56
|
-
} }), index.h("div", { key: '
|
|
56
|
+
} }), index.h("div", { key: '41fe4514c4076704cdad94ccef438401ff7f4e41', class: "overlay-header-content" }, index.h("ix-icon", { key: '815d0df9d50aa9dd91ccd094a7801c215c0f3f7e', size: "32", name: this.icon }), index.h("span", { key: '670420d4703b65b39c9b0dc4d9031fadb73934da', class: "overlay-header-title", title: this.name }, this.name)), index.h("ix-icon-button", { key: '3ef17d0836b665787e22f6e9da0e14ccecc15d52', class: "overlay-close", ghost: true, icon: 'close', size: "24", onClick: () => this.closeOverlay() })), index.h("slot", { key: '4328f4ab00517bc4de787fc45117c14afc309efb' })));
|
|
57
57
|
}
|
|
58
58
|
get hostElement() { return index.getElement(this); }
|
|
59
59
|
};
|
|
@@ -158,11 +158,11 @@ const MapNavigation = class {
|
|
|
158
158
|
this.hasContentHeader = (nodes === null || nodes === void 0 ? void 0 : nodes.length) !== 0;
|
|
159
159
|
}
|
|
160
160
|
render() {
|
|
161
|
-
return (index.h(index.Host, { key: '
|
|
161
|
+
return (index.h(index.Host, { key: '2946dcb874fe6142c5e46fc0e631528f9c252acd' }, index.h("slot", { key: '1dade6736fb8ca41922269af3613069109e0f7e1', name: "menu" }), index.h("div", { key: 'ebf94a90f8d8bc250f50e3b6b81ab9529403ced4', class: "map-nav" }, index.h("div", { key: 'ca6e3fb3f7222e415a2c3b0a0485852e0d24eb27', class: "map-nav-sidebar" }, index.h("div", { key: 'eedd75c6ed28651eb0dacc304c2a6bb74a3acb48', class: "map-nav-header" }, index.h("ix-application-header", { key: '29c589f85db676ffd91bb12488e70de7e2e4dbe1', name: this.applicationName, class: "map-nav-header-brand" }, index.h("slot", { key: 'c19497c92151dffa74f57177b67b4ba4e0927598', slot: "logo", name: "logo" }))), index.h("div", { key: '4b3f49c7a748481ba6644748cf81b97346a93e86', class: "map-nav-sidebar-content" }, index.h("div", { key: '2f3ae2b3b2b82259c9d50f84446b3c3b9187595e', class: "map-nav-sidebar-static-content" }, index.h("div", { key: '55256b8072af12003597c805c5b79e5996326199', class: "map-nav-title" }, this.navigationTitle), this.hideContextMenu ? ('') : (index.h("ix-icon-button", { icon: 'context-menu', ghost: true, size: "24", variant: "secondary", onClick: (_) => this.contextMenuClick.emit() }))), index.h("div", { key: 'fb536c51269368ac94db2464fa040992c1bfb272', class: "map-nav-sidebar-user-content" }, index.h("slot", { key: '46a3481ffdb3b1fd94dbcb3e4100d36abd3ec800', name: "sidebar-content" })))), index.h("div", { key: '68e57564835c8813e97a6a5ca27bb6560744b635', class: "content" }, index.h("div", { key: '51fe8de82f713940d867a5d369a4e9c520f8a13b', class: {
|
|
162
162
|
'map-nav-header-content': true,
|
|
163
163
|
'bg-2': true,
|
|
164
164
|
empty: !this.hasContentHeader,
|
|
165
|
-
} }, index.h("slot", { key: '
|
|
165
|
+
} }, index.h("slot", { key: 'bb2fd5b5bb1577353c85780fa3f285702f1d224e', name: "content-header", onSlotchange: (e) => this.checkHasContentHeader(e) })), index.h("main", { key: '2735c1d81e97f98b9a9e5652ee7d281e233a21a6' }, index.h("slot", { key: '830e9656af5d9e46e0d39202abd82ad9fe1ce7fa' }), index.h("slot", { key: '7bf4f8bce525e3572acdeb08a852e029e7f5cd09', name: "overlay" }))))));
|
|
166
166
|
}
|
|
167
167
|
get hostElement() { return index.getElement(this); }
|
|
168
168
|
};
|
|
@@ -21,7 +21,7 @@ const MenuAboutItem = class {
|
|
|
21
21
|
});
|
|
22
22
|
}
|
|
23
23
|
render() {
|
|
24
|
-
return (index.h(index.Host, { key: '
|
|
24
|
+
return (index.h(index.Host, { key: 'db029b1d15d652d75c93dfc429bf154196d9b9aa' }, index.h("slot", { key: '8564c8182628fd41a29f5adc896d6482b5ce3ada' })));
|
|
25
25
|
}
|
|
26
26
|
static get watchers() { return {
|
|
27
27
|
"label": ["watchLabel"]
|
|
@@ -20,16 +20,16 @@ const MenuAboutNews = class {
|
|
|
20
20
|
this.expanded = false;
|
|
21
21
|
}
|
|
22
22
|
render() {
|
|
23
|
-
return (index.h(index.Host, { key: '
|
|
23
|
+
return (index.h(index.Host, { key: '39cfad7d2abb6147661da57bc79b528040ea591d', class: {
|
|
24
24
|
expanded: this.expanded,
|
|
25
25
|
show: !this.show,
|
|
26
|
-
} }, index.h("div", { key: '
|
|
26
|
+
} }, index.h("div", { key: '6257ae03e7a15a1712ee5e89db3b0fb7c646d211', class: "banner-container" }, index.h("ix-icon", { key: 'f2bac5de5b7ec1f83fd93b7a523ed36efb262ec8', color: "color-inv-contrast-text", name: 'shout', size: "32" }), index.h("svg", { key: 'cac47b22376f5e4541fba3b08fcf6a9e2e6bc385', viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, index.h("polygon", { key: '2bab22f0e230dfb4b90da92d2a09c5fc0c8aaf85', points: "0 0 48 0 48 56 24 48 0 56" }))), index.h("div", { key: '36dabd8f389b71c803ed7e26fb5038811f10f43a', class: "cui-popover-news-header" }, index.h("ix-typography", { key: 'a82ebe9ebb3a0aee9fe276b37381475d326dfe92', variant: "default-title-single" }, this.label)), index.h("ix-icon-button", { key: '1b8e63ffaee5befe53c02e772d9f018e29bbf574', size: "24", icon: 'close', ghost: true, onClick: () => {
|
|
27
27
|
this.show = false;
|
|
28
28
|
this.closePopover.emit();
|
|
29
|
-
} }), index.h("div", { key: '
|
|
29
|
+
} }), index.h("div", { key: '8c18be6b3e1c086c36f02031f2656d8d6122fe6b', class: "slot-container" }, index.h("slot", { key: '8d784c09bffab1c553c812ed08f4f38f27ab93db' })), this.aboutItemLabel ? (index.h("div", { class: "cui-popover-news-footer" }, index.h("ix-button", { variant: "primary", onClick: (e) => {
|
|
30
30
|
this.show = false;
|
|
31
31
|
this.showMore.emit(e);
|
|
32
|
-
} }, this.i18nShowMore))) : null, index.h("div", { key: '
|
|
32
|
+
} }, this.i18nShowMore))) : null, index.h("div", { key: 'ff66eddc3cab62ee4dc48b2680f99e737cee31bf', id: "arrow" })));
|
|
33
33
|
}
|
|
34
34
|
};
|
|
35
35
|
MenuAboutNews.style = IxMenuAboutNewsStyle0;
|
|
@@ -27,7 +27,7 @@ const MenuAbout = class {
|
|
|
27
27
|
index.forceUpdate(this.el);
|
|
28
28
|
}
|
|
29
29
|
render() {
|
|
30
|
-
return index.h(menuTabsFc.MenuTabs, { key: '
|
|
30
|
+
return index.h(menuTabsFc.MenuTabs, { key: 'dc8ff17b6bee972f3ed647d700db41cad0125aa1', context: this });
|
|
31
31
|
}
|
|
32
32
|
get el() { return index.getElement(this); }
|
|
33
33
|
static get watchers() { return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"ix-menu-about.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG,CAAC;AAC10G,0BAAe,YAAY;;MC+Bd,SAAS;;;;;qBAYJ,2BAA2B;oBAK5B,KAAK;;;IAUpB,SAAS,CAAC,KAAa;QACrBA,iBAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;KACrB;IAED,iBAAiB;QACfC,qBAAU,CAAC,IAAI,CAAC,CAAC;KAClB;IAED,gBAAgB;QACdC,iBAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACtB;IAED,MAAM;QACJ,OAAOC,QAACC,mBAAQ,qDAAC,OAAO,EAAE,IAAI,GAAI,CAAC;KACpC;;;;;;;;;;","names":["setTab","initialize","forceUpdate","h","MenuTabs"],"sources":["src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=shadow","src/components/menu-about/menu-about.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 'legacy/fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .about-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 1rem;\n }\n }\n\n ix-tabs {\n margin-bottom: 1.5rem;\n }\n\n ix-menu-about-item {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n forceUpdate,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { MenuTabs } from '../utils/menu-tabs/menu-tabs-fc';\nimport {\n CustomCloseEvent,\n initialize,\n setTab,\n} from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n tag: 'ix-menu-about',\n styleUrl: 'menu-about.scss',\n shadow: true,\n})\nexport class MenuAbout {\n @Element() el!: HTMLIxMenuAboutElement;\n\n /**\n * Active tab\n */\n // eslint-disable-next-line @stencil-community/strict-mutable\n @Prop({ mutable: true }) activeTabLabel: string;\n\n /**\n *
|
|
1
|
+
{"file":"ix-menu-about.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG,CAAC;AAC10G,0BAAe,YAAY;;MC+Bd,SAAS;;;;;qBAYJ,2BAA2B;oBAK5B,KAAK;;;IAUpB,SAAS,CAAC,KAAa;QACrBA,iBAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;KACrB;IAED,iBAAiB;QACfC,qBAAU,CAAC,IAAI,CAAC,CAAC;KAClB;IAED,gBAAgB;QACdC,iBAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACtB;IAED,MAAM;QACJ,OAAOC,QAACC,mBAAQ,qDAAC,OAAO,EAAE,IAAI,GAAI,CAAC;KACpC;;;;;;;;;;","names":["setTab","initialize","forceUpdate","h","MenuTabs"],"sources":["src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=shadow","src/components/menu-about/menu-about.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 'legacy/fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .about-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 1rem;\n }\n }\n\n ix-tabs {\n margin-bottom: 1.5rem;\n }\n\n ix-menu-about-item {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n forceUpdate,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { MenuTabs } from '../utils/menu-tabs/menu-tabs-fc';\nimport {\n CustomCloseEvent,\n initialize,\n setTab,\n} from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n tag: 'ix-menu-about',\n styleUrl: 'menu-about.scss',\n shadow: true,\n})\nexport class MenuAbout {\n @Element() el!: HTMLIxMenuAboutElement;\n\n /**\n * Active tab\n */\n // eslint-disable-next-line @stencil-community/strict-mutable\n @Prop({ mutable: true }) activeTabLabel: string;\n\n /**\n * Content of the header\n */\n @Prop() label = 'About & legal information';\n\n /**\n * Internal\n */\n @Prop() show = false;\n\n /**\n * About and Legal closed\n */\n @Event() close: EventEmitter<CustomCloseEvent>;\n\n @State() items: HTMLIxMenuAboutItemElement[];\n\n @Watch('activeTabLabel')\n updateTab(label: string) {\n setTab(this, label);\n }\n\n componentWillLoad() {\n initialize(this);\n }\n\n componentDidLoad() {\n forceUpdate(this.el);\n }\n\n render() {\n return <MenuTabs context={this} />;\n }\n}\n"],"version":3}
|
|
@@ -30,9 +30,9 @@ const MenuAvatar = class {
|
|
|
30
30
|
this.showContextMenu = elements.length !== 0;
|
|
31
31
|
}
|
|
32
32
|
render() {
|
|
33
|
-
return (index.h(index.Host, { key: '
|
|
33
|
+
return (index.h(index.Host, { key: '5ce6a18ce0ad5abe546f26eb0792ae9277ee3330', slot: "ix-menu-avatar" }, index.h("button", { key: '1b3da5028c32b38c396aab0e4122772be4b10ae4', class: "nav-item top-item avatar no-hover", title: this.top, id: this.avatarElementId, tabIndex: 0 }, index.h("ix-avatar", { key: '237e2b1841f7070bfb11ef83a72e8d427fbf1316', image: this.image, initials: this.initials }), index.h("div", { key: 'e1091468ca746a3e471b83ee1f3337d8cfe2baf6', class: "avatar-name" }, index.h("span", { key: '63e8130a4b5f15a35b4d3eac2f3bcaea30243c28', class: "text-default-single", title: this.top }, this.top), index.h("span", { key: '378fe56221b406bf0846304938b8ca122ac626cc', class: "text-default-single", title: this.bottom }, this.bottom))), index.h("ix-dropdown", { key: 'dd7e541e91c15b4d1c309d01ed75666f5cdb61fa', trigger: this.hostElement, placement: 'right-start', hidden: !this.showContextMenu && !this.showLogoutButton, offset: {
|
|
34
34
|
mainAxis: 16,
|
|
35
|
-
} }, index.h("slot", { key: '
|
|
35
|
+
} }, index.h("slot", { key: '671b121c9b7313526fa3ab075cb0cafaacf67503', onSlotchange: () => this.onSlotChange() }), this.showLogoutButton ? (index.h("ix-menu-avatar-item", { label: this.i18nLogout, icon: 'log-out', onClick: (e) => {
|
|
36
36
|
this.logoutClick.emit(e);
|
|
37
37
|
} })) : null)));
|
|
38
38
|
}
|
|
@@ -168,7 +168,7 @@ const MenuCategory = class {
|
|
|
168
168
|
}
|
|
169
169
|
}
|
|
170
170
|
render() {
|
|
171
|
-
return (index.h(index.Host, { key: '
|
|
171
|
+
return (index.h(index.Host, { key: 'e62e654ac84f229e1f669a732c051d96848c730d', class: {
|
|
172
172
|
expanded: this.showItems,
|
|
173
173
|
}, onPointerEnter: () => {
|
|
174
174
|
this.enterLeaveDebounce.onEnter();
|
|
@@ -177,14 +177,14 @@ const MenuCategory = class {
|
|
|
177
177
|
return;
|
|
178
178
|
}
|
|
179
179
|
this.enterLeaveDebounce.onLeave();
|
|
180
|
-
} }, index.h("ix-menu-item", { key: '
|
|
180
|
+
} }, index.h("ix-menu-item", { key: 'f64066062bdd83ee3c49228d04877fbe78eb15ce', class: 'category-parent', active: this.isNestedItemActive(), notifications: this.notifications, icon: this.icon, onClick: (e) => this.onCategoryClick(e), onFocus: () => this.onPointerEnter(), isCategory: true }, index.h("div", { key: '89f722bf950f5428e5b090e14a1ea68be2a27536', class: "category" }, index.h("div", { key: 'd72fc532b76d2807a3fad5a54e5243dc712383b6', class: "category-text" }, this.label), index.h("ix-icon", { key: '080cfeb2201ce391ca621fdb1b1bc3b5bfbbe6bb', name: 'chevron-down-small', class: {
|
|
181
181
|
'category-chevron': true,
|
|
182
182
|
'category-chevron--open': this.showItems,
|
|
183
|
-
} }))), index.h("div", { key: '
|
|
183
|
+
} }))), index.h("div", { key: '5f59b31543e5f71fb188a1b6e952e732ef1c3db4', ref: (ref) => (this.menuItemsContainer = ref), class: {
|
|
184
184
|
'menu-items': true,
|
|
185
185
|
'menu-items--expanded': this.showItems,
|
|
186
186
|
'menu-items--collapsed': !this.showItems,
|
|
187
|
-
} }, this.showItems ? index.h("slot", null) : null), index.h("ix-dropdown", { key: '
|
|
187
|
+
} }, this.showItems ? index.h("slot", null) : null), index.h("ix-dropdown", { key: '9d7cdb7ce906a6d2cbeeac5e3d71dc0c49cf1327', closeBehavior: 'both', show: this.showDropdown, onShowChanged: ({ detail: dropdownShown }) => {
|
|
188
188
|
this.showDropdown = dropdownShown;
|
|
189
189
|
}, class: 'category-dropdown', anchor: this.hostElement, placement: "right-start", offset: {
|
|
190
190
|
mainAxis: 3,
|
|
@@ -194,7 +194,7 @@ const MenuCategory = class {
|
|
|
194
194
|
this.showDropdown = false;
|
|
195
195
|
}
|
|
196
196
|
}
|
|
197
|
-
} }, index.h("ix-dropdown-item", { key: '
|
|
197
|
+
} }, index.h("ix-dropdown-item", { key: 'f8d2ec34a4602f977802808e23c3ebc811d2d0ce', class: 'category-dropdown-header' }, index.h("ix-typography", { key: '1f6fea32ef8b6786cdd35285e44e9715c7622ad9', variant: "default-title-single", color: "std" }, this.label)), index.h("ix-divider", { key: 'f868a430532498205b95c76addc1c3ef2f5ff239' }), index.h("slot", { key: 'ba6dd154693ae5040fdadf4c92d4d10e5dc79d2b' }))));
|
|
198
198
|
}
|
|
199
199
|
get hostElement() { return index.getElement(this); }
|
|
200
200
|
};
|
|
@@ -36,7 +36,7 @@ const MenuExpandIcon = class {
|
|
|
36
36
|
return this.getSmallScreenIcon();
|
|
37
37
|
}
|
|
38
38
|
render() {
|
|
39
|
-
return (index.h(index.Host, { key: '
|
|
39
|
+
return (index.h(index.Host, { key: '01c334cc036c65c1ba58b1eb2266fec201e7204e', class: {
|
|
40
40
|
expanded: this.expanded,
|
|
41
41
|
} }, this.getMenuIcon()));
|
|
42
42
|
}
|
|
@@ -88,13 +88,13 @@ const MenuItem = class {
|
|
|
88
88
|
slot: 'bottom',
|
|
89
89
|
};
|
|
90
90
|
}
|
|
91
|
-
return (index.h(index.Host, Object.assign({ key: '
|
|
91
|
+
return (index.h(index.Host, Object.assign({ key: '777964dc37701b147cba8070470a0dba049ccc9b', class: {
|
|
92
92
|
disabled: this.disabled,
|
|
93
93
|
'home-tab': this.home,
|
|
94
94
|
'bottom-tab': this.bottom,
|
|
95
95
|
active: this.active,
|
|
96
96
|
'tab-nested': this.isHostedInsideCategory,
|
|
97
|
-
} }, extendedAttributes), index.h("button", { key: '
|
|
97
|
+
} }, extendedAttributes), index.h("button", { key: '20f94fbcf3babdadc83c4c2b4a267c6d74266541', class: "tab", tabIndex: this.disabled ? -1 : 0, role: "listitem", ref: this.buttonRef }, (this.icon || this.tabIcon) && (index.h("ix-icon", { class: 'tab-icon', name: (_a = this.icon) !== null && _a !== void 0 ? _a : this.tabIcon })), this.notifications ? (index.h("div", { class: "notification" }, index.h("div", { class: "pill" }, this.notifications))) : null, index.h("span", { key: 'a168fd4927264ce970c52098a6a4a1263db48f6d', class: "tab-text text-default" }, this.label, " ", index.h("slot", { key: '36a52eb3d0cd6f96c5c3a6f36bffa1593c78fb1c' }))), !this.isCategory &&
|
|
98
98
|
!this.isHostedInsideCategory &&
|
|
99
99
|
!this.menuExpanded && (index.h("ix-tooltip", { for: this.buttonRef.waitForCurrent(), placement: 'right', showDelay: 1000 }, this.tooltip))));
|
|
100
100
|
}
|
|
@@ -21,7 +21,7 @@ const MenuSettingsItem = class {
|
|
|
21
21
|
});
|
|
22
22
|
}
|
|
23
23
|
render() {
|
|
24
|
-
return (index.h(index.Host, { key: '
|
|
24
|
+
return (index.h(index.Host, { key: 'ece4d8e415ca694383a7a2e3bd55733e43521143' }, index.h("slot", { key: '3da9723abce35580aa1d6382ff936887a538fe9e' })));
|
|
25
25
|
}
|
|
26
26
|
static get watchers() { return {
|
|
27
27
|
"label": ["watchLabel"]
|